/* ============================================================
   DEFAULT THEME (Light Mode - Dolibarr native colors)
   ============================================================ */

:root {
	--DoliFlow-sidebar-width: 300px;
	/* Edge gap used when "padding" toggle is on. Read by JS positionChatRelative()
	   as the viewport boundary distance. Override per-breakpoint below. */
	--DoliFlow-chat-edge-gap: 40px;
	--DoliFlow-bg: #ffffff;
	--DoliFlow-sidebar-bg: #f8f9fa;
	--DoliFlow-surface: #f0f0f0;
	--DoliFlow-hover: #e9ecef;
	--DoliFlow-border: #dee2e6;
	--DoliFlow-text: #212529;
	--DoliFlow-text-secondary: #6c757d;
	--DoliFlow-user-bubble: var(--butactionbg, #0d6efd);
	--DoliFlow-user-text: var(--textbutaction, #fff);
	--DoliFlow-agent-bubble: #f7f7f8;
	--DoliFlow-input-bg: #f8f9fa;
	--DoliFlow-resize-handle: #ccc;
	--DoliFlow-toggle-bg: #e9ecef;
	--DoliFlow-icon-color: #6c757d;
	/* Dark mode uyumlu ek değişkenler */
	--DoliFlow-card-bg: #ffffff;
	--DoliFlow-muted-text: #888;
	--DoliFlow-reasoning-text: #666;
	--DoliFlow-reasoning-border: #ddd;
	--DoliFlow-tool-text: #2c6b9e;
	--DoliFlow-warning-bg: #fff3cd;
	--DoliFlow-warning-text: #856404;
	--DoliFlow-warning-border: #ffeeba;
	--DoliFlow-error-bg: #f8d7da;
	--DoliFlow-error-text: #721c24;
	--DoliFlow-error-border: #f5c6cb;
}

/* ============================================================
   DARK THEME
   ============================================================ */

.DoliFlow-theme-dark {
	--DoliFlow-bg: #212121;
	--DoliFlow-sidebar-bg: #171717;
	--DoliFlow-surface: #2f2f2f;
	--DoliFlow-hover: #3a3a3a;
	--DoliFlow-border: #3a3a3a;
	--DoliFlow-text: #ececec;
	--DoliFlow-text-secondary: #999;
	--DoliFlow-user-bubble: var(--butactionbg, #0d6efd);
	--DoliFlow-user-text: var(--textbutaction, #fff);
	--DoliFlow-agent-bubble: #26282d;
	--DoliFlow-input-bg: #2f2f2f;
	--DoliFlow-resize-handle: #555;
	--DoliFlow-toggle-bg: #3a3a3a;
	--DoliFlow-icon-color: #ccc;
	/* Dark mode uyumlu ek değişkenler -- koyu arka plana göre ayarlandı */
	--DoliFlow-card-bg: #2a2a2a;
	--DoliFlow-muted-text: #aaa;
	--DoliFlow-reasoning-text: #bbb;
	--DoliFlow-reasoning-border: #555;
	--DoliFlow-tool-text: #7bb8ff;
	--DoliFlow-warning-bg: #332701;
	--DoliFlow-warning-text: #ffd970;
	--DoliFlow-warning-border: #664d03;
	--DoliFlow-error-bg: #3d1518;
	--DoliFlow-error-text: #f5a3a8;
	--DoliFlow-error-border: #842029;
}

.DoliFlow-theme-dark .DoliFlow-stop-btn {
	background: #c62828;
}
.DoliFlow-theme-dark .DoliFlow-stop-btn:hover {
	background: #e53935;
}

#DoliFlow-chat {
	position: fixed;
	bottom: 20px;
	right: 20px;
	width: 520px;
	height: 500px;
	max-width: calc(100vw - 40px);
	max-height: calc(100vh - 40px);
	z-index: 999999;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
	color: var(--DoliFlow-text, #212529);
	background: var(--DoliFlow-bg, #ffffff);
	border-radius: 12px 0 0 0;
	overflow: hidden;
	box-shadow: 0 0 40px rgba(0, 0, 0, 0.5);
	transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1),
	            height 0.3s cubic-bezier(0.4, 0, 0.2, 1),
	            left 0.3s cubic-bezier(0.4, 0, 0.2, 1),
	            top 0.3s cubic-bezier(0.4, 0, 0.2, 1),
	            bottom 0.3s ease,
	            box-shadow 0.3s ease,
	            right 0.3s ease;
	display: flex;
}

.DoliFlow-theme-dark .DoliFlow-msg-agent .DoliFlow-msg-bubble code {
	background: rgba(255,255,255,0.1);
}

.DoliFlow-theme-dark .DoliFlow-msg-agent .DoliFlow-msg-bubble pre {
	background: rgba(255,255,255,0.06);
}

.DoliFlow-theme-dark .DoliFlow-msg-agent .DoliFlow-msg-bubble a {
	color: #66b0ff;
}

/* Dark mode - tüm mesaj tiplerinde linkleri görünür yap */
.DoliFlow-theme-dark .DoliFlow-msg-user .DoliFlow-msg-bubble a,
.DoliFlow-theme-dark .DoliFlow-msg-system .DoliFlow-msg-content a,
.DoliFlow-theme-dark .DoliFlow-msg-error .DoliFlow-msg-bubble a,
.DoliFlow-theme-dark .DoliFlow-msg-thinking .DoliFlow-msg-content a,
.DoliFlow-theme-dark .DoliFlow-msg-tool .DoliFlow-msg-content a,
.DoliFlow-theme-dark .DoliFlow-msg-status .DoliFlow-msg-content a {
	color: #66b0ff;
	text-decoration: underline;
}

/* Light mode - kullanıcı mesajlarındaki linkler (balonsuz tasarım: zemin
   beyaz, bu yüzden link rengi agent ile aynı mavi kullanılır). */
.DoliFlow-msg-user .DoliFlow-msg-bubble a {
	color: #1a73e8;
	text-decoration: underline;
	font-weight: 500;
}

/* Light mode - agent mesajlarındaki varlık linkleri görünür olsun */
.DoliFlow-msg-agent .DoliFlow-msg-bubble a {
	color: #1a73e8;
	text-decoration: underline;
}

.DoliFlow-theme-dark .DoliFlow-msg-agent .DoliFlow-msg-bubble th {
	background: rgba(255,255,255,0.08);
}

.DoliFlow-theme-dark .DoliFlow-msg-agent .DoliFlow-msg-bubble th,
.DoliFlow-theme-dark .DoliFlow-msg-agent .DoliFlow-msg-bubble td {
	border-color: rgba(255,255,255,0.15);
}

.DoliFlow-theme-dark .DoliFlow-msg-agent .DoliFlow-msg-bubble tbody tr:nth-child(even) {
	background: rgba(255,255,255,0.03);
}

.DoliFlow-theme-dark .DoliFlow-msg-agent .DoliFlow-msg-bubble hr {
	border-top-color: rgba(255,255,255,0.15);
}

/* Dark mode - inline code metin rengi daha belirgin */
.DoliFlow-theme-dark .DoliFlow-msg-agent .DoliFlow-msg-bubble code {
	color: #e0e0e0;
}

/* Dark mode - pre içinde code rengini sıfırla (pre zaten kendi bg'sine sahip) */
.DoliFlow-theme-dark .DoliFlow-msg-agent .DoliFlow-msg-bubble pre code {
	color: inherit;
}

/* Dark mode - blockquote metin rengi daha okunabilir */
.DoliFlow-theme-dark .DoliFlow-msg-agent .DoliFlow-msg-bubble blockquote {
	opacity: 1;
	color: #ccc;
	border-left-color: #66b0ff;
}

.DoliFlow-theme-dark .DoliFlow-msg-revert:hover,
.DoliFlow-theme-dark .DoliFlow-msg-copy:hover {
	background: rgba(255,255,255,0.1);
	color: var(--DoliFlow-text);
}

/* ============================================================
   WS STREAM UI HELPERS (thinking, reasoning, tool, status)
   Agent mesajı content'i içinde görünürler
   ============================================================ */

.DoliFlow-ws-thinking {
	font-size:0.85em;
	color:var(--DoliFlow-muted-text);
	padding:4px 12px 0 10px;
	font-style:italic;
	max-height:150px;
	overflow-y:auto;
	overflow-x:hidden;
	word-wrap:break-word;
	overflow-wrap:break-word;
	word-break:break-word;
}

.DoliFlow-ws-reasoning {
	font-size:0.85em;
	color:var(--DoliFlow-reasoning-text);
	padding:4px 12px 0 10px;
	border-left:2px solid var(--DoliFlow-reasoning-border);
	margin:4px 0 0 10px;
	max-height:200px;
	overflow-y:auto;
	overflow-x:hidden;
	word-wrap:break-word;
	overflow-wrap:break-word;
	word-break:break-word;
}

.DoliFlow-ws-tool {
	font-size:0.85em;
	color:var(--DoliFlow-tool-text);
	padding:2px 12px 0 10px;
}

.DoliFlow-ws-tool .DoliFlow-tool-call {
	display: flex;
	flex-direction: column;
	gap: 2px;
}
.DoliFlow-ws-tool .DoliFlow-tool-name {
	font-weight: 600;
	font-size: 12px;
	color: #6366f1;
}
.DoliFlow-ws-tool .DoliFlow-tool-args {
	background: rgba(0,0,0,0.04);
	border-radius: 4px;
	padding: 4px 8px;
	font-family: 'Consolas', 'Monaco', 'Courier New', monospace;
	font-size: 11px;
	overflow-x: auto;
	margin: 2px 0;
	max-height: 200px;
	overflow-y: auto;
	white-space: pre-wrap;
	word-break: break-all;
}
.DoliFlow-ws-tool .DoliFlow-tool-result {
	font-size: 11px;
	color: #22c55e;
	padding: 2px 0;
}
.DoliFlow-theme-dark .DoliFlow-ws-tool .DoliFlow-tool-args {
	background: rgba(255,255,255,0.06);
}

/* Ara işlem adımları (kullanıcı dostu, teknik detay yok). Thinking metninin
   hemen altında satır satır görünür; tamamlanan adımlar soluklaşır. */
.DoliFlow-ws-toolsteps {
	display:flex;
	flex-direction:column;
	gap:3px;
	margin:7px 12px 3px 10px;
	font-size:12px;
	line-height:1.5;
	opacity:.94;
}
.DoliFlow-ws-toolstep {
	display:flex;
	align-items:flex-start;
	gap:6px;
	color:var(--DoliFlow-muted-text);
	transition:opacity .25s ease, font-size .25s ease;
}
.DoliFlow-ws-toolstep-ico {
	flex:0 0 auto;
	font-size:12px;
	line-height:1.6;
}
/* Faz satırı (düşünme/aşama göstergesi) — işlem satırlarından daha soluk */
.DoliFlow-ws-toolstep.DoliFlow-ws-phase {
	font-style: italic;
	opacity:.88;
	color:var(--DoliFlow-muted-text);
}
/* "Yazıyor..." nokta animasyonu (faz satırı işareti — emoji kullanılmaz) */
.DoliFlow-ws-dots {
	display:inline-flex;
	align-items:center;
	align-self:center;      /* metinle dikey ortala (satır üstünde görünmesin) */
	vertical-align:middle;
	line-height:1;
	gap:2px;
	width:14px;
	height:12px;
	margin-right:1px;
	margin-top:1px;
}
.DoliFlow-ws-dots i {
	width:3px;
	height:3px;
	border-radius:50%;
	background:currentColor;
	opacity:.3;
	animation:DoliFlow-dot-pulse 1.2s ease-in-out infinite;
}
.DoliFlow-ws-dots i:nth-child(2){animation-delay:.18s}
.DoliFlow-ws-dots i:nth-child(3){animation-delay:.36s}
@keyframes DoliFlow-dot-pulse {
	0%, 60%, 100% { opacity:.25; transform:translateY(0); }
	30% { opacity:.95; transform:translateY(-1px); }
}

/* Kalıcı "yapılanlar" logu (yanıt altında küçük satırlar) */
.DoliFlow-ws-statuslog {
	font-size:11px;
	line-height:1.55;
	color:var(--DoliFlow-muted-text);
	opacity:.85;
	padding:1px 12px 0 12px;
}
.DoliFlow-ws-statuslog::before {
	content:'• ';
	opacity:.7;
}

.DoliFlow-ws-status {
	font-size:0.85em;
	color:#e67e22;
	padding:4px 12px 0 12px;
	font-style:italic;
}

/* ============================================================
   THINKING / TOOL / STATUS MESSAGE ITEMS (scrollable div içinde)
   ============================================================ */

.DoliFlow-msg-thinking {
	align-self: flex-start;
	max-width: 90%;
	margin: 2px 0 !important;
	font-size: 0.85em;
}
.DoliFlow-msg-thinking .DoliFlow-msg-bubble {
	background: rgba(255,193,7,0.08);
	color: var(--DoliFlow-reasoning-text, #666);
	border-left: 2px solid #f59e0b;
	border-radius: 4px 12px 12px 4px;
	padding: 6px 12px;
	font-style: italic;
	font-size: 12px;
	line-height: 1.4;
	white-space: normal;
	margin-left: 4px;
	margin-right: 4px;
}
.DoliFlow-thinking-label {
	font-weight: 600;
	color: #f59e0b;
	display:inline-block;
	font-size:20px;
	line-height:1;
	margin-right:3px;
	vertical-align:-3px;
}
.DoliFlow-theme-dark .DoliFlow-msg-thinking .DoliFlow-msg-bubble {
	background: rgba(255,193,7,0.06);
	border-left-color: #f59e0b;
}

.DoliFlow-msg-tool {
	align-self: flex-start;
	max-width: 90%;
	margin: 2px 0 !important;
	font-size: 0.85em;
}
.DoliFlow-msg-tool .DoliFlow-msg-bubble {
	background: rgba(99,102,241,0.06);
	color: var(--DoliFlow-tool-text, #2c6b9e);
	border-radius: 4px 12px 12px 4px;
	padding: 6px 12px;
	font-size: 12px;
	line-height: 1.4;
	white-space: normal;
	margin-left: 4px;
	margin-right: 4px;
}
.DoliFlow-msg-tool .DoliFlow-tool-call {
	display: flex;
	flex-direction: column;
	gap: 2px;
}
.DoliFlow-msg-tool .DoliFlow-tool-name {
	font-weight: 600;
	font-size: 12px;
	color: #6366f1;
}
.DoliFlow-msg-tool .DoliFlow-tool-args {
	background: rgba(0,0,0,0.04);
	border-radius: 4px;
	padding: 4px 8px;
	font-family: 'Consolas', 'Monaco', 'Courier New', monospace;
	font-size: 11px;
	overflow-x: auto;
	margin: 2px 0;
	max-height: 200px;
	overflow-y: auto;
	white-space: pre-wrap;
	word-break: break-all;
}
.DoliFlow-msg-tool .DoliFlow-tool-result {
	font-size: 11px;
	color: #22c55e;
	padding: 2px 0;
}
.DoliFlow-theme-dark .DoliFlow-msg-tool .DoliFlow-msg-bubble {
	background: rgba(99,102,241,0.08);
}
.DoliFlow-theme-dark .DoliFlow-msg-tool .DoliFlow-tool-args {
	background: rgba(255,255,255,0.06);
}

.DoliFlow-msg-status {
	align-self: center !important;
	max-width: 80%;
	margin: 4px 0 !important;
	pointer-events: none;
}
.DoliFlow-msg-status .DoliFlow-msg-content {
	max-width: 100%;
}
.DoliFlow-msg-status .DoliFlow-msg-bubble {
	background: var(--DoliFlow-surface, #f0f0f0);
	color: var(--DoliFlow-text-secondary, #6c757d);
	border: 1px solid var(--DoliFlow-border, #dee2e6);
	text-align: center;
	font-size: 11px;
	padding: 4px 12px;
	border-radius: 12px;
	line-height: 1.4;
	margin: 0 12px;
}
.DoliFlow-theme-dark .DoliFlow-msg-status .DoliFlow-msg-bubble {
	background: rgba(255,255,255,0.04);
	color: #999;
	border-color: rgba(255,255,255,0.08);
}

/* Stream tamamlandıktan sonra thinking/tool/status mesajlarını gizle.
   Reasoning GİZLENMEZ — kalıcıdır, katlanır blok olarak gösterilir. */
.DoliFlow-msg-streaming-done .DoliFlow-ws-thinking,
.DoliFlow-msg-streaming-done .DoliFlow-ws-tool,
.DoliFlow-msg-streaming-done .DoliFlow-ws-tool-result,
.DoliFlow-msg-streaming-done .DoliFlow-ws-toolsteps,
.DoliFlow-msg-streaming-done .DoliFlow-ws-status {
	display: none;
}

/* Reasoning: kalıcı, katlanabilir blok (geçmişte ve loadSession render'ında) */
.DoliFlow-msg-reasoning {
	font-size:0.8em;
	color:var(--DoliFlow-reasoning-text);
	border-left:2px solid var(--DoliFlow-reasoning-border);
	margin:4px 0 2px 48px;
	padding:6px 10px;
	cursor:pointer;
	user-select:none;
	background:rgba(0,0,0,0.03);
	border-radius:0 6px 6px 0;
}
.DoliFlow-reasoning-toggle {
	font-weight:600;
	display:inline-block;
}
.DoliFlow-reasoning-body {
	white-space:pre-wrap;
	word-break:break-word;
	max-height:220px;
	overflow-y:auto;
	margin-top:6px;
	cursor:auto;
	color:var(--DoliFlow-reasoning-text);
	font-size:0.9em;
	line-height:1.5;
}
.DoliFlow-theme-dark .DoliFlow-msg-reasoning {
	background:rgba(255,255,255,0.05);
}

/* Yeni: WS thinking/tool/status mesajları doğrudan container'da ayrı öğeler olarak */
.DoliFlow-ws-thinking,
.DoliFlow-ws-reasoning,
.DoliFlow-ws-tool,
.DoliFlow-ws-toolsteps,
.DoliFlow-ws-status {
	animation: DoliFlow-fade-in 0.2s ease;
}

@keyframes DoliFlow-fade-in {
	from { opacity: 0; transform: translateY(4px); }
	to { opacity: 1; transform: translateY(0); }
}

/* ============================================================
   WS STATUS BAR (Connection lost indicator)
   ============================================================ */

/* ---- SIDEBAR TABS ---- */
.DoliFlow-sidebar-tabs {
	display: flex;
	border-bottom: 1px solid var(--DoliFlow-border, #e0e0e0);
	background: var(--DoliFlow-bg-secondary, #f8f9fa);
}
.DoliFlow-sidebar-tab {
	flex: 1;
	padding: 7px 6px;
	border: none;
	background: none;
	cursor: pointer;
	font-size: 11px;
	font-weight: 500;
	color: var(--DoliFlow-dim, #888);
	text-align: center;
	transition: all 0.15s;
	border-bottom: 2px solid transparent;
}
.DoliFlow-sidebar-tab:hover {
	color: var(--DoliFlow-text, #333);
	background: rgba(0,0,0,0.02);
}
.DoliFlow-sidebar-tab.active {
	color: var(--DoliFlow-text, #333);
	border-bottom-color: var(--DoliFlow-accent, #007bff);
	background: rgba(0,123,255,0.04);
}
.DoliFlow-sidebar-body {
	flex: 1;
	overflow: hidden;
	display: flex;
	flex-direction: column;
}
.DoliFlow-sidebar-panel {
	display: none;
	flex: 1;
	overflow-y: auto;
	padding: 4px 0;
}
.DoliFlow-sidebar-panel.active {
	display: flex;
	flex-direction: column;
}

/* Dark mode (JS 'DoliFlow-theme-dark' sınıfını kullanır) */
.DoliFlow-theme-dark .DoliFlow-sidebar-tabs {
	border-color: rgba(255,255,255,0.1);
	background: rgba(255,255,255,0.03);
}
.DoliFlow-theme-dark .DoliFlow-sidebar-tab {
	color: rgba(255,255,255,0.55);
}
.DoliFlow-theme-dark .DoliFlow-sidebar-tab:hover {
	color: rgba(255,255,255,0.85);
	background: rgba(255,255,255,0.05);
}
.DoliFlow-theme-dark .DoliFlow-sidebar-tab.active {
	color: #fff;
	border-bottom-color: #4da3ff;
	background: rgba(77,163,255,0.08);
}

/* ---- SIDEBAR CRON LIST ---- */
.DoliFlow-cron-list {
	flex: 1;
	overflow-y: auto;
	padding: 8px 16px;
	display: flex;
	flex-direction: column;
	gap: 3px;
}
.DoliFlow-cron-loading,
.DoliFlow-cron-empty {
	padding: 24px 16px;
	text-align: center;
	color: var(--DoliFlow-text-secondary, #6c757d);
	font-size: 14px;
	line-height: 1.5;
}
.DoliFlow-cron-empty .DoliFlow-cron-retry {
	display: inline-block;
	margin-left: 6px;
	padding: 3px 10px;
	background: var(--DoliFlow-accent, #3b82f6);
	color: #fff;
	border: 0;
	border-radius: 4px;
	font-size: 12px;
	cursor: pointer;
	vertical-align: baseline;
}
.DoliFlow-cron-empty .DoliFlow-cron-retry:hover {
	opacity: 0.85;
}
.DoliFlow-cron-item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 6px;
	padding: 6px 8px;
	background: var(--DoliFlow-surface, #f0f0f0);
	border: 1px solid var(--DoliFlow-border, #e0e0e0);
	border-radius: 5px;
	transition: background 0.15s, border-color 0.15s;
}
.DoliFlow-cron-item:hover {
	background: var(--DoliFlow-hover, #e9ecef);
}
.DoliFlow-cron-item-body {
	flex: 1;
	min-width: 0;
}
.DoliFlow-cron-item-label {
	font-weight: 600;
	color: var(--DoliFlow-text, #333);
	font-size: 13px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.DoliFlow-cron-item-meta {
	font-size: 12px;
	color: var(--DoliFlow-text-secondary, #6c757d);
	margin-top: 1px;
}
.DoliFlow-cron-status-running {
	color: #007bff;
	font-weight: 500;
}
.DoliFlow-cron-status-pending {
	color: #f59e0b;
	font-weight: 500;
}
.DoliFlow-cron-status-done {
	color: #28a745;
	font-weight: 500;
}
.DoliFlow-cron-status-failed {
	color: #dc3545;
	font-weight: 500;
}
.DoliFlow-cron-status-cancelled {
	color: #6c757d;
	font-weight: 500;
}
.DoliFlow-cron-status-paused {
	color: #6c757d;
	font-weight: 500;
	text-decoration: line-through;
	opacity: .85;
}
.DoliFlow-cron-item-actions {
	display: flex;
	gap: 2px;
	flex-shrink: 0;
}
.DoliFlow-cron-action-btn {
	background: none;
	border: 1px solid var(--DoliFlow-border, #e0e0e0);
	border-radius: 3px;
	cursor: pointer;
	font-size: 11px;
	line-height: 1;
	padding: 3px 6px;
	color: var(--DoliFlow-text-secondary, #6c757d);
	transition: all 0.15s;
	min-width: 24px;
	text-align: center;
}
.DoliFlow-cron-action-btn:hover {
	background: var(--DoliFlow-hover, #e9ecef);
	color: var(--DoliFlow-text, #333);
}
.DoliFlow-cron-run-btn:hover {
	color: #28a745;
	border-color: #28a745;
}
.DoliFlow-cron-stop-btn:hover {
	color: #e8590c;
	border-color: #e8590c;
	background: rgba(232, 89, 12, 0.08);
}
.DoliFlow-cron-del-btn:hover {
	color: #dc3545;
	border-color: #dc3545;
}
.DoliFlow-cron-detail-btn:hover {
	color: #3b82f6;
	border-color: #3b82f6;
	background: rgba(59, 130, 246, 0.08);
}
.DoliFlow-cron-action-btn.DoliFlow-cron-detail-btn {
	min-width: 0;
	white-space: nowrap;
	font-weight: 600;
}

/* Dark mode sidebar cron — tema değişkenleriyle uyumlu */
.DoliFlow-theme-dark .DoliFlow-cron-item {
	background: var(--DoliFlow-surface, #2f2f2f);
	border-color: var(--DoliFlow-border, #3a3a3a);
}
.DoliFlow-theme-dark .DoliFlow-cron-item:hover {
	background: var(--DoliFlow-hover, #3a3a3a);
}
.DoliFlow-theme-dark .DoliFlow-cron-status-running {
	color: #4da3ff;
}
.DoliFlow-theme-dark .DoliFlow-cron-status-pending {
	color: #fbbf24;
}
.DoliFlow-theme-dark .DoliFlow-cron-status-done {
	color: #4ade80;
}
.DoliFlow-theme-dark .DoliFlow-cron-status-failed {
	color: #f87171;
}
.DoliFlow-theme-dark .DoliFlow-cron-status-cancelled {
	color: #9aa0a6;
}
.DoliFlow-theme-dark .DoliFlow-cron-status-paused {
	color: #9aa0a6;
	text-decoration: line-through;
	opacity: .85;
}
.DoliFlow-theme-dark .DoliFlow-cron-action-btn {
	color: #aaa;
	border-color: rgba(255,255,255,0.15);
}
.DoliFlow-theme-dark .DoliFlow-cron-action-btn:hover {
	background: rgba(255,255,255,0.1);
	color: #fff;
}
.DoliFlow-theme-dark .DoliFlow-cron-run-btn:hover {
	color: #4ade80;
	border-color: #4ade80;
}
.DoliFlow-theme-dark .DoliFlow-cron-del-btn:hover {
	color: #f87171;
	border-color: #f87171;
}

/* =========================================================== */

.DoliFlow-ws-status-bar {
	display: none;
	padding: 8px 16px;
	font-size: 12px;
	font-weight: 600;
	color: #fff;
	background: #e53935;
	text-align: center;
	line-height: 1.4;
	animation: DoliFlow-status-bar-in 0.3s ease;
	flex-shrink: 0;
}

.DoliFlow-ws-status-bar.visible {
	display: block;
}

.DoliFlow-ws-status-bar .DoliFlow-ws-status-retry {
	display: inline-block;
	margin-left: 8px;
	padding: 2px 10px;
	border: 1px solid rgba(255,255,255,0.4);
	border-radius: 4px;
	color: #fff;
	cursor: pointer;
	font-size: 11px;
	background: rgba(255,255,255,0.1);
	transition: background 0.15s;
}

.DoliFlow-ws-status-bar .DoliFlow-ws-status-retry:hover {
	background: rgba(255,255,255,0.25);
}

@keyframes DoliFlow-status-bar-in {
	from { opacity: 0; transform: translateY(-100%); }
	to { opacity: 1; transform: translateY(0); }
}

/* ============================================================
   STOP BUTTON
   ============================================================ */

.DoliFlow-stop-btn {
	background: #e53935;
	color: #fff;
	border: none;
	border-radius: 10px;
	padding: 8px 12px;
	cursor: pointer;
	display: none;
	align-items: center;
	justify-content: center;
	transition: opacity 0.2s, background 0.2s;
	flex-shrink: 0;
	opacity: 0.85;
}

.DoliFlow-stop-btn:hover {
	opacity: 1;
	background: #c62828;
}

.DoliFlow-stop-btn:active {
	opacity: 0.7;
}

.DoliFlow-stop-btn.visible {
	display: flex;
}

/* ============================================================
   SYSTEM MESSAGE BUBBLE (cancelled, notifications)
   ============================================================ */

.DoliFlow-msg-system {
	align-self: center !important;
	max-width: 90%;
	margin: 8px 0 !important;
	pointer-events: none;
}

.DoliFlow-msg-system .DoliFlow-msg-content {
	max-width: 100%;
}

.DoliFlow-msg-system .DoliFlow-msg-bubble {
	background: var(--DoliFlow-surface, #f0f0f0);
	color: var(--DoliFlow-text-secondary, #6c757d);
	border: 1px solid var(--DoliFlow-border, #dee2e6);
	text-align: center;
	font-size: 12px;
	padding: 8px 16px;
	border-radius: 18px;
	line-height: 1.4;
	margin: 0 12px;
}

.DoliFlow-theme-dark .DoliFlow-msg-system .DoliFlow-msg-bubble {
	background: rgba(255,255,255,0.06);
	color: #aaa;
	border-color: rgba(255,255,255,0.1);
}

.DoliFlow-msg-system.DoliFlow-msg-cancelled .DoliFlow-msg-bubble {
	background: #fff3cd;
	color: #856404;
	border-color: #ffeeba;
}

.DoliFlow-theme-dark .DoliFlow-msg-system.DoliFlow-msg-cancelled .DoliFlow-msg-bubble {
	background: #332701;
	color: #ffd970;
	border-color: #664d03;
}

/* ============================================================
   CONFIRM / CLARIFY UI — modern seçenek butonları
   ============================================================ */

#DoliFlow-confirm-area {
	padding:12px 16px 14px;
	background:var(--DoliFlow-card-bg);
	/* color-mix destekleniyorsa accent ile hafif renkli ton kullanılır */
	background:color-mix(in srgb, var(--DoliFlow-user-bubble, #0d6efd) 6%, var(--DoliFlow-card-bg));
	border-top:1px solid var(--DoliFlow-border);
	border-bottom:1px solid var(--DoliFlow-border);
	margin:0;
	/* Gelecekte birden fazla içerik/onay gelebileceği için dikey scroll destekle */
	max-height:35vh;
	overflow-y:auto;
	animation:DoliFlow-confirm-in 0.22s ease;
}

@keyframes DoliFlow-confirm-in {
	from { opacity:0; transform:translateY(6px); }
	to   { opacity:1; transform:translateY(0); }
}

#DoliFlow-confirm-area .DoliFlow-confirm-question {
	font-size:13px;
	font-weight:600;
	color:var(--DoliFlow-text);
	line-height:1.5;
}

#DoliFlow-confirm-area .DoliFlow-confirm-agent-wait {
	font-size:11px;
	color:var(--DoliFlow-text-secondary);
	display:flex;
	align-items:center;
	gap:6px;
	justify-content:flex-end;
}

/* Bekleme göstergesi — animasyonlu nokta */
#DoliFlow-confirm-area .DoliFlow-confirm-agent-wait::before {
	content:'';
	width:6px;
	height:6px;
	border-radius:50%;
	background:currentColor;
	animation:DoliFlow-pulse 1.2s ease-in-out infinite;
}

@keyframes DoliFlow-pulse {
	0%, 100% { opacity:0.25; }
	50%      { opacity:0.9; }
}

#DoliFlow-confirm-area .DoliFlow-confirm-done-text {
	font-size:12.5px;
	font-weight:600;
	color:#2e7d32;  /* seçim bilgisi için net yeşil — soluk muted rengi kullanmıyoruz */
	text-align:center;
}

.DoliFlow-theme-dark #DoliFlow-confirm-area .DoliFlow-confirm-done-text {
	color:#81c784;
}

/* Seçim yapıldıktan sonra butonlar sönük ve tıklanamaz görünsün */
#DoliFlow-confirm-area.DoliFlow-confirm-done .DoliFlow-confirm-btn {
	opacity:0.5;
	filter:grayscale(0.6);
	pointer-events:none;
}

/* --- Modern seçenek butonları --- */
.DoliFlow-confirm-btn {
	padding:10px 16px;
	border-radius:12px;
	cursor:pointer;
	font-size:13px;
	font-weight:600;
	line-height:1.4;
	white-space:normal;         /* uzun etiketler kırılsın (responsive) */
	word-break:break-word;
	/* Aynı satırdaki tüm onay butonları EŞİT genişlikte olsun (etiket uzunluğuna
	   göre değişmesin). Dar ekranlarda media query flex:1 1 100% ile alt alta
	   tam genişlik döndürür (eşitlik korunur). */
	flex:1 1 0%;
	max-width:100%;
	box-sizing:border-box;
	border:1px solid transparent;
	transition:background 0.18s ease, color 0.18s ease, border-color 0.18s ease,
	            box-shadow 0.18s ease, transform 0.18s ease;
	animation:DoliFlow-btn-in 0.24s ease backwards;
}

@keyframes DoliFlow-btn-in {
	from { opacity:0; transform:translateY(6px) scale(0.98); }
	to   { opacity:1; transform:translateY(0) scale(1); }
}

.DoliFlow-confirm-btn:hover {
	transform:translateY(-1px);
}

.DoliFlow-confirm-btn:active {
	transform:translateY(0);
}

.DoliFlow-confirm-btn:focus-visible {
	outline:2px solid var(--DoliFlow-user-bubble, #0d6efd);
	outline-offset:2px;
}

/* Birincil: accent dolgu + yumuşak renkli gölge */
.DoliFlow-confirm-btn-primary {
	background:var(--DoliFlow-user-bubble, #0d6efd);
	color:var(--DoliFlow-user-text, #fff);
	border-color:transparent;
	box-shadow:0 2px 10px rgba(13, 110, 253, 0.22);
}
.DoliFlow-confirm-btn-primary:hover {
	box-shadow:0 4px 16px rgba(13, 110, 253, 0.32);
}

/* Tehlike: yumuşak kırmızı ton (harsh dolgu değil) */
.DoliFlow-confirm-btn-danger {
	background:#fdf1f0;
	color:#c0392b;
	border-color:#f0c4c0;
}
.DoliFlow-confirm-btn-danger:hover {
	background:#fbe6e4;
	border-color:#e4a8a2;
	box-shadow:0 2px 8px rgba(192, 57, 43, 0.14);
}

/* Varsayılan: nötr çerçeveli, hover'da accent vurgusu */
.DoliFlow-confirm-btn-default {
	background:var(--DoliFlow-card-bg);
	color:var(--DoliFlow-text);
	border-color:var(--DoliFlow-border);
}
.DoliFlow-confirm-btn-default:hover {
	background:var(--DoliFlow-hover);
	border-color:var(--DoliFlow-user-bubble, #0d6efd);
}

/* Widget dark modu */
.DoliFlow-theme-dark .DoliFlow-confirm-btn-primary {
	background:var(--butactionbg, #ad8c4f);   /* tema dark --butactionbg (altın) */
	color:var(--textbutaction, #fff);
	box-shadow:0 2px 10px rgba(0, 0, 0, 0.35);
}
.DoliFlow-theme-dark .DoliFlow-confirm-btn-danger {
	background:#4a1f22;
	color:#f2b8bb;
	border-color:#7a3a3e;
}
.DoliFlow-theme-dark .DoliFlow-confirm-btn-danger:hover {
	background:#5a2629;
	border-color:#8f4448;
	box-shadow:0 2px 8px rgba(0, 0, 0, 0.35);
}
.DoliFlow-theme-dark .DoliFlow-confirm-btn-default {
	background:var(--DoliFlow-card-bg);
	color:var(--DoliFlow-text);
	border-color:var(--DoliFlow-border);
}
.DoliFlow-theme-dark .DoliFlow-confirm-btn-default:hover {
	background:var(--DoliFlow-hover);
	border-color:var(--DoliFlow-user-bubble, #ad8c4f);
}

/* Responsive: dar alanlarda butonlar tam genişlik ve alt alta dizilir */
@media (max-width:520px) {
	#DoliFlow-confirm-area .DoliFlow-confirm-btn {
		flex:1 1 100%;
	}
}

/* ============================================================
   WARNING / ERROR BUBBLES (dark mode overrides)
   ============================================================ */

.DoliFlow-theme-dark .DoliFlow-msg-error .DoliFlow-msg-bubble {
	background:var(--DoliFlow-error-bg);
	color:var(--DoliFlow-error-text);
	border-color:var(--DoliFlow-error-border);
}

.DoliFlow-server-warning {
	padding:6px 12px;
	background:#fef1f0;
	color:#c2413a;
	font-size:12px;
	text-align:center;
	border-top:1px solid #f5d3d0;
}

.DoliFlow-limit-warning {
	background:var(--DoliFlow-warning-bg);
	color:var(--DoliFlow-warning-text);
	font-size:13px;
	text-align:center;
	border-bottom:1px solid var(--DoliFlow-warning-border);
	padding:14px 24px;
	border-radius:18px;
	margin:6px 12px;
}

.DoliFlow-theme-dark .DoliFlow-server-warning {
	background:#3d1d1b;
	color:#f0a8a3;
	border-top-color:#5a2b27;
}

.DoliFlow-theme-dark .DoliFlow-limit-warning {
	background:var(--DoliFlow-warning-bg);
	color:var(--DoliFlow-warning-text);
	border-bottom-color:var(--DoliFlow-warning-border);
}

/* Banner içindeki link her iki temada da görünür olsun:
   warning-text rengini miras alır (light: koyu kahve, dark: sarı) */
.DoliFlow-limit-warning a {
	color: inherit;
	text-decoration: underline;
	font-weight: 600;
}
.DoliFlow-theme-dark .DoliFlow-limit-warning a {
	color: #8ab4ff;
	text-decoration: underline;
	font-weight: 600;
}

/* Süre dolumu banner'ındaki "Aboneliği Yenile" butonu (yalnızca admin).
   Light: altın/amber ton; dark: warning-text sarısıyla uyumlu (inline değil). */
.DoliFlow-renew-row {
	margin-top: 8px;
}
.DoliFlow-limit-warning a.DoliFlow-plan-renew {
	display: inline-block;
	padding: 6px 12px;
	border: 1px solid rgba(133, 100, 4, .5);
	border-radius: 6px;
	color: #6b4e00;
	background: rgba(133, 100, 4, .08);
	font-weight: 700;
	text-decoration: none;
}
.DoliFlow-limit-warning a.DoliFlow-plan-renew:hover {
	background: rgba(133, 100, 4, .16);
	color: #4a3500;
	text-decoration: none;
}
.DoliFlow-theme-dark .DoliFlow-limit-warning a.DoliFlow-plan-renew {
	color: #ffd970;
	border-color: rgba(255, 217, 112, .45);
	background: rgba(255, 217, 112, .12);
}
.DoliFlow-theme-dark .DoliFlow-limit-warning a.DoliFlow-plan-renew:hover {
	background: rgba(255, 217, 112, .2);
	color: #ffe9a8;
	text-decoration: none;
}

/* %100 limit dolu banner içeriği (kalıcı) */
.DoliFlow-limit-full-title {
	font-size: 13px;
	font-weight: 700;
	margin-bottom: 2px;
}
.DoliFlow-limit-full-desc {
	font-size: 12px;
	opacity: .9;
	margin-bottom: 6px;
}
.DoliFlow-btn-upgrade {
	display: inline-block;
	margin-top: 4px;
	padding: 5px 14px;
	border-radius: 999px;
	background: var(--DoliFlow-accent, #4a90d9);
	color: #fff !important;
	font-size: 12px;
	font-weight: 600;
	text-decoration: none !important;
	border: none;
	cursor: pointer;
}
.DoliFlow-btn-upgrade:hover {
	filter: brightness(1.08);
}

/* %80/%90 geçici bilgilendirme kartı (toast) — history'ye girmez */
.DoliFlow-usage-warning-card {
	position: absolute;
	top: 12px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 90;
	max-width: min(92%, 520px);
	display: flex;
	align-items: flex-start;
	gap: 10px;
	padding: 10px 14px;
	border-radius: 14px;
	font-size: 13px;
	line-height: 1.45;
	box-shadow: 0 6px 24px rgba(0, 0, 0, .14);
	background: var(--DoliFlow-warning-bg);
	color: var(--DoliFlow-warning-text);
	border: 1px solid var(--DoliFlow-warning-border);
	animation: DoliFlowCardIn .25s ease-out;
}
.DoliFlow-usage-warning-card.DoliFlow-usage-warning-80 {
	background: rgba(219, 171, 9, .13);
	border-color: rgba(219, 171, 9, .35);
	color: var(--DoliFlow-warning-text);
}
.DoliFlow-usage-warning-card.DoliFlow-usage-warning-90 {
	background: rgba(234, 88, 12, .14);
	border-color: rgba(234, 88, 12, .4);
	color: var(--DoliFlow-warning-text);
}
.DoliFlow-usage-warning-close {
	flex-shrink: 0;
	background: none;
	border: none;
	color: inherit;
	opacity: .7;
	font-size: 16px;
	line-height: 1;
	cursor: pointer;
	padding: 0 2px;
}
.DoliFlow-usage-warning-close:hover {
	opacity: 1;
}
@keyframes DoliFlowCardIn {
	from { opacity: 0; transform: translate(-50%, -6px); }
	to   { opacity: 1; transform: translate(-50%, 0); }
}

.DoliFlow-msg-bubble.DoliFlow-msg-warning {
	background:var(--DoliFlow-warning-bg);
	color:var(--DoliFlow-warning-text);
	border-color:var(--DoliFlow-warning-border);
}

/* ============================================================
   TOAST (uyarı paneli) — üstte belirir, kısa süre sonra kaybolur
   ============================================================ */

.DoliFlow-toasts {
	position: absolute;
	top: 64px;
	left: 12px;
	right: 12px;
	z-index: 30;
	display: flex;
	flex-direction: column;
	gap: 8px;
	pointer-events: none;
}

.DoliFlow-toast {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	padding: 12px 14px;
	border-radius: 10px;
	font-size: 13px;
	line-height: 1.45;
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.25);
	animation: DoliFlow-toast-in 0.25s ease-out;
	pointer-events: auto;
	border: 1px solid;
}

@keyframes DoliFlow-toast-in {
	from { opacity: 0; transform: translateY(-10px); }
	to { opacity: 1; transform: translateY(0); }
}

.DoliFlow-toast-warning {
	background: var(--DoliFlow-warning-bg);
	color: var(--DoliFlow-warning-text);
	border-color: var(--DoliFlow-warning-border);
}

.DoliFlow-toast-success {
	background: rgba(40, 167, 69, 0.12);
	color: #28a745;
	border-color: rgba(40, 167, 69, 0.5);
}

.DoliFlow-toast-info {
	background: rgba(13, 110, 253, 0.12);
	color: #0d6efd;
	border-color: rgba(13, 110, 253, 0.5);
}

.DoliFlow-theme-dark .DoliFlow-toast-success { background: rgba(40, 167, 69, 0.2); }
.DoliFlow-theme-dark .DoliFlow-toast-info { background: rgba(13, 110, 253, 0.2); }

.DoliFlow-toast-icon {
	flex-shrink: 0;
	font-size: 16px;
	line-height: 1.3;
}

.DoliFlow-toast-body {
	flex: 1;
	min-width: 0;
	word-break: break-word;
}

.DoliFlow-toast-close {
	flex-shrink: 0;
	background: transparent;
	border: none;
	color: inherit;
	opacity: 0.7;
	font-size: 18px;
	line-height: 1;
	cursor: pointer;
	padding: 0 2px;
}

.DoliFlow-toast-close:hover { opacity: 1; }

/* ============================================================
   GÖREV SONUCU POPUP (widget dışı — document.body'e eklenir)
   Zamanlanmış görev / otomasyon tamamlanınca sağ üstte belirir.
   Tarayıcı bildirimi değildir; saf HTML/CSS overlay'dir.
   ============================================================ */
.DoliFlow-task-popup {
	/* Tema değişkenleri (JS, sohbet koyu temadaysa DoliFlow-theme-dark ekler) */
	--DoliFlow-tp-bg: #ffffff;
	--DoliFlow-tp-text: #212529;
	--DoliFlow-tp-border: #dee2e6;
	--DoliFlow-tp-accent: #0d6efd;
	--DoliFlow-tp-muted: #6c757d;
	--DoliFlow-tp-preview: #555;
	--DoliFlow-tp-btn-bg: #0d6efd;
	position: fixed;
	top: 16px;
	right: 16px;
	width: 370px;
	max-width: calc(100vw - 32px);
	z-index: 2147483646;
	display: flex;
	gap: 12px;
	align-items: flex-start;
	padding: 14px 14px 12px 14px;
	box-sizing: border-box;
	border-radius: 12px;
	background: var(--DoliFlow-tp-bg);
	color: var(--DoliFlow-tp-text);
	border: 1px solid var(--DoliFlow-tp-border);
	box-shadow: 0 10px 34px rgba(0, 0, 0, 0.2);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
	animation: DoliFlow-task-popup-in 0.28s ease-out;
}
.DoliFlow-task-popup.DoliFlow-theme-dark {
	--DoliFlow-tp-bg: #2a2a2a;
	--DoliFlow-tp-text: #ececec;
	--DoliFlow-tp-border: #3a3a3a;
	--DoliFlow-tp-accent: #7bb8ff;
	--DoliFlow-tp-muted: #aaa;
	--DoliFlow-tp-preview: #bbb;
	--DoliFlow-tp-btn-bg: #3b82f6;
}
@keyframes DoliFlow-task-popup-in {
	from { opacity: 0; transform: translateY(-10px); }
	to   { opacity: 1; transform: translateY(0); }
}
.DoliFlow-task-popup-icon {
	flex-shrink: 0;
	width: 38px;
	height: 38px;
	border-radius: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
}
.DoliFlow-task-popup-report .DoliFlow-task-popup-icon { background: #0d6efd; }
.DoliFlow-task-popup-automation .DoliFlow-task-popup-icon { background: #7c3aed; }
.DoliFlow-task-popup-body { flex: 1; min-width: 0; }
.DoliFlow-task-popup-kicker {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.4px;
	text-transform: uppercase;
	color: var(--DoliFlow-tp-accent);
	margin-bottom: 2px;
}
.DoliFlow-task-popup-title {
	font-size: 13.5px;
	font-weight: 700;
	line-height: 1.35;
	margin-bottom: 4px;
	word-break: break-word;
	padding-right: 12px;
	/* Çok uzun başlıklar "…" ile kesilir (en fazla 2 satır). */
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.DoliFlow-task-popup-preview {
	font-size: 12px;
	line-height: 1.5;
	color: var(--DoliFlow-tp-preview);
	word-break: break-word;
	/* Uzun içerik "…" ile kesilir (en fazla 3 satır). */
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.DoliFlow-task-popup-preview > * { display: inline; }
/* Önizleme bir "özet" alanıdır: içerikte h1/h2/table gelse bile boyutlar
   standart küçük tutulur (tutarlı görünüm garantisi). */
.DoliFlow-task-popup-preview h1,
.DoliFlow-task-popup-preview h2,
.DoliFlow-task-popup-preview h3,
.DoliFlow-task-popup-preview h4,
.DoliFlow-task-popup-preview h5,
.DoliFlow-task-popup-preview h6 {
	font-size: 12px;
	font-weight: 700;
	margin: 0;
	color: inherit;
	line-height: inherit;
}
.DoliFlow-task-popup-preview p,
.DoliFlow-task-popup-preview li { margin: 0; }
.DoliFlow-task-popup-preview table { font-size: 11px; }
.DoliFlow-task-popup-preview th,
.DoliFlow-task-popup-preview td { padding: 1px 6px; }
.DoliFlow-task-popup-actions {
	display: flex;
	gap: 8px;
	margin-top: 10px;
	flex-wrap: wrap;
}
.DoliFlow-task-popup-open {
	border: none;
	border-radius: 6px;
	background: var(--DoliFlow-tp-btn-bg);
	color: #fff;
	padding: 6px 16px;
	font-size: 12px;
	font-weight: 600;
	cursor: pointer;
	font-family: inherit;
}
.DoliFlow-task-popup-open:hover { opacity: 0.88; }
.DoliFlow-task-popup-off {
	background: transparent;
	color: var(--DoliFlow-tp-muted);
	border: 1px solid var(--DoliFlow-tp-border);
	border-radius: 6px;
	padding: 5px 10px;
	font-size: 11px;
	cursor: pointer;
	font-family: inherit;
}
.DoliFlow-task-popup-off:hover { opacity: 0.8; }
.DoliFlow-task-popup-close {
	position: absolute;
	top: 8px;
	right: 10px;
	background: transparent;
	border: none;
	cursor: pointer;
	color: var(--DoliFlow-tp-muted);
	font-size: 18px;
	line-height: 1;
	padding: 2px 4px;
	border-radius: 4px;
}
.DoliFlow-task-popup-close:hover { color: var(--DoliFlow-tp-text); background: rgba(128,128,128,0.15); }

/* Konum seçenekleri — varsayılan tr (sağ üst); popup her şeyin üstündedir */
.DoliFlow-task-popup.DoliFlow-task-pos-tl { top: 16px; right: auto; left: 16px; }
.DoliFlow-task-popup.DoliFlow-task-pos-br { top: auto; bottom: 16px; right: 16px; }
.DoliFlow-task-popup.DoliFlow-task-pos-bl { top: auto; bottom: 16px; right: auto; left: 16px; }

/* Popup gövdesindeki HTML içeriğin taşmasın + iç boşluklar temiz */
.DoliFlow-task-popup-title > *:first-child,
.DoliFlow-task-popup-preview > *:first-child { margin-top: 0; }
.DoliFlow-task-popup-title > *:last-child,
.DoliFlow-task-popup-preview > *:last-child { margin-bottom: 0; }
.DoliFlow-task-popup-preview p,
.DoliFlow-task-popup-title p { margin: 0 0 4px 0; }
.DoliFlow-task-popup-preview ul,
.DoliFlow-task-popup-preview ol { margin: 4px 0; padding-left: 18px; }
.DoliFlow-task-popup-preview img { max-width: 100%; height: auto; border-radius: 4px; }
.DoliFlow-task-popup-preview a { color: var(--DoliFlow-tp-accent); }

/* ---- Görevler paneli: bildirim anahtarı satırı ---- */
.DoliFlow-cron-notif-row {
	padding: 10px 16px;
	border-top: 1px solid var(--DoliFlow-border, #dee2e6);
	background: var(--DoliFlow-sidebar-bg, #f8f9fa);
	flex-shrink: 0;
}
.DoliFlow-cron-notif-label {
	display: flex;
	align-items: center;
	gap: 10px;
	cursor: pointer;
	user-select: none;
}
.DoliFlow-cron-notif-icon {
	width: 28px;
	height: 28px;
	border-radius: 8px;
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--DoliFlow-hover, #e9ecef);
	color: var(--DoliFlow-icon-color, #6c757d);
}
.DoliFlow-cron-notif-text {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 1px;
}
.DoliFlow-cron-notif-title {
	font-size: 12px;
	font-weight: 600;
	color: var(--DoliFlow-text, #212529);
}
.DoliFlow-cron-notif-sub {
	font-size: 11px;
	color: var(--DoliFlow-muted-text, #888);
	line-height: 1.35;
}
/* Popup konumu seçici satırı */
.DoliFlow-cron-notif-pos-row {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-top: 8px;
}
.DoliFlow-cron-notif-pos-label {
	font-size: 11px;
	color: var(--DoliFlow-muted-text, #888);
}
.DoliFlow-task-notif-pos-select {
	font-size: 11px;
	padding: 3px 6px;
	border-radius: 6px;
	border: 1px solid var(--DoliFlow-border, #dee2e6);
	background: var(--DoliFlow-input-bg, #fff);
	color: var(--DoliFlow-text, #212529);
	max-width: 140px;
}
.DoliFlow-task-notif-pos-select:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

/* ============================================================
   GÖREV DETAY PANELİ (overlay — widget içinde açılır)
   Görevler sekmesindeki "Detaylar" ve popup "Göster" bu paneli açar
   ============================================================ */
/* Detay paneli: titlebar ve input GÖRÜNÜR kalır; panel mesaj alanının yerini
   alır (sidebar ile arasında boşluk yok, sohbet alanı genişliğindedir). */
.DoliFlow-task-detail-overlay {
	display: none;
	flex: 1 1 0;
	min-height: 0;
	flex-direction: column;
	background: var(--DoliFlow-bg, #ffffff);
	color: var(--DoliFlow-text, #212529);
}
.DoliFlow-task-detail-overlay.DoliFlow-task-detail-open { display: flex; }
.DoliFlow-task-detail-card {
	flex: 1;
	min-height: 0;
	display: flex;
	flex-direction: column;
	background: var(--DoliFlow-bg, #ffffff);
	color: var(--DoliFlow-text, #212529);
}
.DoliFlow-task-detail-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 10px 14px;
	border-bottom: 1px solid var(--DoliFlow-border, #dee2e6);
	background: var(--DoliFlow-surface, #f7f7f8);
	flex-shrink: 0;
}
.DoliFlow-task-detail-kicker {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.4px;
	text-transform: uppercase;
	color: var(--DoliFlow-text-secondary, #6c757d);
}
.DoliFlow-task-detail-close {
	background: transparent;
	border: 1px solid transparent;
	font-size: 20px;
	line-height: 1;
	color: var(--DoliFlow-muted-text, #888);
	cursor: pointer;
	padding: 3px 9px;
	border-radius: 6px;
	margin-left: auto;
	flex-shrink: 0;
}
.DoliFlow-task-detail-close:hover {
	color: var(--DoliFlow-text, #212529);
	background: rgba(128, 128, 128, 0.15);
	border-color: var(--DoliFlow-border, #dee2e6);
}
.DoliFlow-task-detail-body {
	flex: 1;
	min-height: 0;
	overflow-y: auto;
	padding: 12px 14px;
}
.DoliFlow-task-detail-loading,
.DoliFlow-task-detail-empty,
.DoliFlow-task-detail-note {
	color: var(--DoliFlow-muted-text, #888);
	font-size: 12.5px;
	padding: 10px 0;
}
.DoliFlow-task-detail-title {
	font-size: 14px;
	font-weight: 700;
	line-height: 1.4;
	word-break: break-word;
}
.DoliFlow-task-detail-chips {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	margin-top: 6px;
	align-items: center;
}
.DoliFlow-task-detail-top {
	margin-bottom: 10px;
}
.DoliFlow-task-detail-desc {
	font-size: 13px;
	line-height: 1.5;
	color: var(--DoliFlow-text, #212529);
	background: var(--DoliFlow-surface, #f7f7f8);
	border: 1px solid var(--DoliFlow-border, #dee2e6);
	border-radius: 8px;
	padding: 10px 12px;
	margin-bottom: 8px;
}
.DoliFlow-task-detail-times {
	margin-top: 6px;
	font-size: 11.5px;
	color: var(--DoliFlow-muted-text, #888);
	line-height: 1.5;
}
.DoliFlow-task-detail-row {
	display: flex;
	gap: 10px;
	padding: 5px 0;
	border-bottom: 1px dashed var(--DoliFlow-border, #e5e7eb);
	font-size: 12px;
}
.DoliFlow-task-detail-row-key {
	flex-shrink: 0;
	width: 110px;
	color: var(--DoliFlow-muted-text, #888);
}
.DoliFlow-task-detail-row-val {
	flex: 1;
	min-width: 0;
	word-break: break-word;
	color: var(--DoliFlow-text, #212529);
}
.DoliFlow-task-detail-error {
	margin-top: 8px;
	padding: 8px 10px;
	border-radius: 6px;
	background: rgba(220, 53, 69, 0.1);
	color: #dc3545;
	font-size: 12px;
	word-break: break-word;
}
.DoliFlow-task-detail-section {
	margin-top: 10px;
}
.DoliFlow-task-detail-sec-title {
	font-size: 12px;
	font-weight: 700;
	margin-bottom: 4px;
}
.DoliFlow-task-detail-result {
	font-size: 12.5px;
	line-height: 1.6;
	background: var(--DoliFlow-surface, #f7f7f8);
	border: 1px solid var(--DoliFlow-border, #dee2e6);
	border-radius: 8px;
	padding: 10px 12px;
	word-break: break-word;
}
.DoliFlow-task-detail-result p { margin: 0 0 6px 0; }
.DoliFlow-task-detail-result ul,
.DoliFlow-task-detail-result ol { margin: 4px 0; padding-left: 18px; }
.DoliFlow-task-detail-result img { max-width: 100%; height: auto; border-radius: 4px; }
.DoliFlow-task-detail-result a { color: var(--DoliFlow-accent, #3b82f6); }
.DoliFlow-theme-dark .DoliFlow-task-detail-result { background: var(--DoliFlow-agent-bubble, #26282d); }
.DoliFlow-theme-dark .DoliFlow-task-detail-result a { color: #7bb8ff; }
.DoliFlow-task-notif-disabled-note {
	font-size: 11px;
	color: var(--DoliFlow-muted-text, #888);
	font-style: italic;
	flex-shrink: 0;
}
/* Switch stili */
.DoliFlow-cron-notif-label input.DoliFlow-task-notif-toggle {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
}
.DoliFlow-task-notif-switch {
	position: relative;
	width: 36px;
	height: 20px;
	flex-shrink: 0;
	border-radius: 20px;
	background: var(--DoliFlow-toggle-bg, #e9ecef);
	border: 1px solid var(--DoliFlow-border, #dee2e6);
	transition: background 0.2s;
	box-sizing: border-box;
}
.DoliFlow-task-notif-switch::after {
	content: "";
	position: absolute;
	top: 2px;
	left: 2px;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
	transition: transform 0.2s;
}
.DoliFlow-cron-notif-label input:checked + .DoliFlow-task-notif-switch {
	background: #28a745;
	border-color: #28a745;
}
.DoliFlow-cron-notif-label input:checked + .DoliFlow-task-notif-switch::after {
	transform: translateX(16px);
}
.DoliFlow-cron-notif-label input:disabled + .DoliFlow-task-notif-switch {
	opacity: 0.5;
	cursor: not-allowed;
}

/* ============================================================
   CHAT ROOT
   ============================================================ */

#DoliFlow-chat {
	position: fixed;
	bottom: 20px;
	right: 20px;
	width: 520px;
	height: 500px;
	max-width: calc(100vw - 40px);
	max-height: calc(100vh - 40px);
	z-index: 999999;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
	color: var(--DoliFlow-text, #212529);
	background: var(--DoliFlow-bg, #ffffff);
	border-radius: 12px 0 0 0;
	overflow: hidden;
	box-shadow: 0 0 40px rgba(0, 0, 0, 0.5);
	transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1),
	            height 0.3s cubic-bezier(0.4, 0, 0.2, 1),
	            left 0.3s cubic-bezier(0.4, 0, 0.2, 1),
	            top 0.3s cubic-bezier(0.4, 0, 0.2, 1),
	            bottom 0.3s ease,
	            box-shadow 0.3s ease,
	            right 0.3s ease;
	display: flex;
	flex-direction: row;
	font-size: 14px;
}

#DoliFlow-chat.DoliFlow-repositioning {
	transition: none !important;
}

#DoliFlow-chat.DoliFlow-chat-fullscreen {
	position: fixed !important;
	top: 0 !important;
	left: 0 !important;
	width: 100vw !important;
	height: 100vh !important;
	max-width: 100% !important;
	max-height: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	border: none !important;
	border-radius: 0 !important;
	z-index: 2147483647 !important; /* Maximum possible z-index */
	box-shadow: none !important;
}

#DoliFlow-chat.DoliFlow-chat-minimized {
	display: none !important;
}

/* Hide chat until JS positions it correctly -- prevents render jump */
#DoliFlow-chat.DoliFlow-chat-not-positioned {
	opacity: 0 !important;
	pointer-events: none !important;
	transform: scale(0.97) !important;
}

/* ============================================================
   EDGE PADDING TOGGLE (.DoliFlow-chat-padded)
   ============================================================
   The actual viewport spacing is enforced by JS positionChatRelative(),
   which reads --DoliFlow-chat-edge-gap as its boundary distance. This class
   is the on/off signal. Shadow is removed in padded mode -- only the floating
   (non-padded) mode retains a box-shadow. */
/* Active state for the padding header button (mirrors .active-theme pattern) */
.DoliFlow-header-btn.DoliFlow-btn-display-mode.is-active {
	color: var(--DoliFlow-user-bubble) !important;
}

/* ============================================================
   RESIZE HANDLES (Dynamic based on position)
   ============================================================ */

.DoliFlow-resize-handle,
.DoliFlow-resize-handle-vertical {
	position: absolute;
	z-index: 100;
	background: transparent;
	transition: background 0.2s;
	display: none; /* Hidden by default, shown by JS based on position */
}

/* Horizontal Handle (Width) */
.DoliFlow-resize-handle-right {
	right: 0;
	top: 0;
	width: 6px;
	height: 100%;
	cursor: ew-resize;
}
.DoliFlow-resize-handle-left {
	left: 0;
	top: 0;
	width: 6px;
	height: 100%;
	cursor: ew-resize;
}

/* Resize handle hover effect -- shows a subtle glow line */
.DoliFlow-resize-handle:hover,
.DoliFlow-resize-handle-vertical:hover {
	background: var(--DoliFlow-user-bubble);
	opacity: 0.6;
}

/* Resize direction indicator -- which edge the chat expands toward */
.DoliFlow-chat-resize-right .DoliFlow-resize-handle-right::after {
	content: '';
	position: absolute;
	right: 1px;
	top: 50%;
	width: 3px;
	height: 32px;
	background: var(--DoliFlow-icon-color);
	border-radius: 2px;
	transform: translateY(-50%);
	opacity: 0.3;
	pointer-events: none;
}
.DoliFlow-chat-resize-left .DoliFlow-resize-handle-left::after {
	content: '';
	position: absolute;
	left: 1px;
	top: 50%;
	width: 3px;
	height: 32px;
	background: var(--DoliFlow-icon-color);
	border-radius: 2px;
	transform: translateY(-50%);
	opacity: 0.3;
	pointer-events: none;
}
.DoliFlow-resize-handle-right:hover::after,
.DoliFlow-resize-handle-left:hover::after {
	opacity: 0.8;
}

/* ============================================================
   BODY-SHIFTING / SLIDE PANEL MODE
   ============================================================ */
/* When padding-mode is enabled, body padding is driven by --DoliFlow-panel-width,
   a CSS variable that JS sets (single source of truth). This avoids JS->inline-style
   races with Dolibarr's own JS. Transition animates the content shift smoothly. */
html.DoliFlow-padding-mode,
body.DoliFlow-padding-mode {
	transition: padding-left 0.35s cubic-bezier(0.4, 0, 0.2, 1),
	            padding-right 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Body padding reads from --DoliFlow-panel-width (CSS variable set by JS).
   Note: only body gets padding -- html is intentionally excluded to avoid
   double padding (html padding shifts body, body padding shifts content). */
body.DoliFlow-padding-mode.DoliFlow-panel-right {
	padding-right: var(--DoliFlow-panel-width, 0px);
	padding-left: 0;
}
body.DoliFlow-padding-mode.DoliFlow-panel-left {
	padding-left: var(--DoliFlow-panel-width, 0px);
	padding-right: 0;
}

/* No hardcoded padding values here -- JS sets inline style for exact chat width */

/* Chat positioning when padding-mode active:
   - Chat is always docked to the chosen panel side (right or left)
   - Sits 0px from that edge, runs top to bottom (full height)
   - Width is set dynamically by JS (applyPanelPosition) */
#DoliFlow-chat.DoliFlow-chat-padded {
	bottom: 0;
	height: 100vh;
	max-height: 100vh;
	max-width: 100vw;
	border-radius: 0;
	box-shadow: none;
	z-index: 2147483000;
	transition: left 0.3s cubic-bezier(0.4, 0, 0.2, 1),
	            right 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

#DoliFlow-chat.DoliFlow-chat-padded.DoliFlow-panel-right {
	right: 0;
	left: auto;
	top: 0;
	transform: translateX(0);
}
#DoliFlow-chat.DoliFlow-chat-padded.DoliFlow-panel-left {
	left: 0;
	right: auto;
	top: 0;
	transform: translateX(0);
}

/* Slide-in entry when chat was previously closed (panel animation) */
#DoliFlow-chat.DoliFlow-chat-padded.DoliFlow-panel-right.DoliFlow-panel-enter {
	transform: translateX(100%);
}
#DoliFlow-chat.DoliFlow-chat-padded.DoliFlow-panel-left.DoliFlow-panel-enter {
	transform: translateX(-100%);
}

/* Display-mode button active state */
.DoliFlow-btn-display-mode.is-active {
	color: var(--DoliFlow-user-bubble) !important;
	background: var(--DoliFlow-hover);
}

/* ============================================================
   PADDED MODE -- RESIZE HANDLE
   ============================================================ */
/* In padded / panel mode only the inner-edge handle is shown:
   - DoliFlow-panel-right  -> show .DoliFlow-resize-handle-left  (inner edge)
   - DoliFlow-panel-left   -> show .DoliFlow-resize-handle-right (inner edge)
   The handle has a visual grip line so the user can see it. */
#DoliFlow-chat.DoliFlow-chat-padded.DoliFlow-panel-right .DoliFlow-resize-handle-left,
#DoliFlow-chat.DoliFlow-chat-padded.DoliFlow-panel-left .DoliFlow-resize-handle-right {
	display: block;
	background: transparent;
}
/* Hover: show the purple accent background (same as popup mode).
   Specificity must beat the ID-level rule above. */
#DoliFlow-chat.DoliFlow-chat-padded.DoliFlow-panel-right .DoliFlow-resize-handle-left:hover,
#DoliFlow-chat.DoliFlow-chat-padded.DoliFlow-panel-left .DoliFlow-resize-handle-right:hover {
	background: var(--DoliFlow-user-bubble);
	opacity: 0.6;
}
/* Grip line: subtle by default */
#DoliFlow-chat.DoliFlow-chat-padded.DoliFlow-panel-right .DoliFlow-resize-handle-left::after,
#DoliFlow-chat.DoliFlow-chat-padded.DoliFlow-panel-left .DoliFlow-resize-handle-right::after {
	opacity: 0.25;
}
/* Grip line on hover: full opacity + accent color */
#DoliFlow-chat.DoliFlow-chat-padded.DoliFlow-panel-right .DoliFlow-resize-handle-left:hover::after,
#DoliFlow-chat.DoliFlow-chat-padded.DoliFlow-panel-left .DoliFlow-resize-handle-right:hover::after {
	opacity: 1;
	background: var(--DoliFlow-user-bubble);
}

/* Padded (panel) modunda üst ve alt resize tutamaçları gizle -- sadece yan tutamaçlar görünür */
#DoliFlow-chat.DoliFlow-chat-padded .DoliFlow-resize-handle-vertical {
	display: none !important;
}

/* Responsive: on tablets / phones body padding collapses automatically,
   chat takes full viewport (no body shift necessary) */
@media (max-width: 1023px) {
	body.DoliFlow-padding-mode.DoliFlow-panel-right,
	html.DoliFlow-padding-mode.DoliFlow-panel-right,
	body.DoliFlow-padding-mode.DoliFlow-panel-left,
	html.DoliFlow-padding-mode.DoliFlow-panel-left {
		padding-right: 0 !important;
		padding-left: 0 !important;
	}
	#DoliFlow-chat.DoliFlow-chat-padded {
		width: 100vw !important;
		max-width: 100vw;
	}
	/* Full-width -- no resize possible */
	#DoliFlow-chat.DoliFlow-chat-padded .DoliFlow-resize-handle-left,
	#DoliFlow-chat.DoliFlow-chat-padded .DoliFlow-resize-handle-right {
		display: none !important;
	}
}

/* Vertical Handle (Height) */
.DoliFlow-resize-handle-top {
	top: 0;
	left: 0;
	width: 100%;
	height: 6px;
	cursor: ns-resize;
}
.DoliFlow-resize-handle-bottom {
	bottom: 0;
	left: 0;
	width: 100%;
	height: 6px;
	cursor: ns-resize;
}

/* Visual Indicators */
.DoliFlow-resize-handle-right::after,
.DoliFlow-resize-handle-left::after {
	content: '';
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 3px;
	height: 32px;
	background: var(--DoliFlow-resize-handle);
	border-radius: 2px;
	opacity: 0;
}

.DoliFlow-resize-handle-top::after,
.DoliFlow-resize-handle-bottom::after {
	content: '';
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	width: 32px;
	height: 3px;
	background: var(--DoliFlow-resize-handle);
	border-radius: 2px;
	opacity: 0;
}

.DoliFlow-resize-handle:hover::after,
.DoliFlow-resize-handle-resizing::after {
	opacity: 1;
}

.DoliFlow-chat-fullscreen .DoliFlow-resize-handle,
.DoliFlow-chat-minimized .DoliFlow-resize-handle {
	display: none !important;
}

/* ============================================================
   TRI STATE DISPLAY
   ============================================================ */

#DoliFlow-chat.DoliFlow-chat-minimized .DoliFlow-sidebar,
#DoliFlow-chat.DoliFlow-chat-minimized .DoliFlow-main {
	display: none;
}

/* Sidebar collapsed state */
.DoliFlow-sidebar-collapsed .DoliFlow-sidebar {
	display: none !important;
}

.DoliFlow-sidebar-collapsed .DoliFlow-main {
	flex: 1;
}

/* Sidebar toggle button visibility:
   - sidebar açıkken toggle sidebar içinde görünür, header'da gizli
   - sidebar kapalıyken toggle header'da görünür */
.DoliFlow-btn-sidebar {
	display: none !important;
}

.DoliFlow-sidebar-collapsed .DoliFlow-btn-sidebar {
	display: flex !important;
}

/* ============================================================
   SIDEBAR (Chat History)
   ============================================================ */

.DoliFlow-sidebar {
	width: var(--DoliFlow-sidebar-width);
	min-width: 180px;
	background: var(--DoliFlow-sidebar-bg);
	display: flex;
	flex-direction: column;
	border-right: 1px solid var(--DoliFlow-border);
	overflow: hidden;
}

.DoliFlow-sidebar-header {
	padding: 8px 16px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1px solid var(--DoliFlow-border);
	gap: 8px;
}

.DoliFlow-sidebar-actions {
	display: flex;
	align-items: center;
	gap: 4px;
	flex-shrink: 0;
}

.DoliFlow-user-badge {
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: var(--DoliFlow-user-bubble);
	color: var(--DoliFlow-user-text);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 11px;
	font-weight: 600;
	flex-shrink: 0;
	cursor: default;
	transition: opacity 0.2s;
}

.DoliFlow-user-badge:hover {
	opacity: 0.8;
}

/* Sidebar footer: kullanıcı + abonelik planı (ChatGPT tarzı, altta) */
.DoliFlow-sidebar-footer {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 12px;
	border-top: 1px solid var(--DoliFlow-border);
	flex-shrink: 0;
	min-height: 52px;
}

.DoliFlow-sidebar-user-badge {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: var(--DoliFlow-user-bubble);
	color: var(--DoliFlow-user-text);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	font-weight: 600;
	flex-shrink: 0;
	cursor: default;
}

.DoliFlow-sidebar-user-meta {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.DoliFlow-sidebar-user-name {
	font-size: 13px;
	font-weight: 600;
	color: var(--DoliFlow-text);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.DoliFlow-sidebar-user-plan {
	display: flex;
	align-items: center;
	gap: 6px;
	min-width: 0;
	margin-top: 2px;
}

.DoliFlow-sidebar-user-plan .DoliFlow-sidebar-plan-value {
	display: inline-block;
	font-size: 10px;
	font-weight: 700;
	padding: 1px 8px;
	border-radius: 999px;
	background: var(--DoliFlow-user-bubble, #0d6efd);
	color: var(--DoliFlow-user-text, #fff);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 130px;
}

/* Yükselt: paketin altında, kullanıcı adıyla aynı fontta */
.DoliFlow-sidebar-user-meta .DoliFlow-sidebar-plan-upgrade {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	align-self: flex-start;
	margin-top: 5px;
	font-size: 13px;
	font-weight: 600;
	color: var(--DoliFlow-accent, #0d6efd);
	text-decoration: none;
}

.DoliFlow-sidebar-user-meta .DoliFlow-sidebar-plan-upgrade:hover {
	text-decoration: underline;
}

.DoliFlow-theme-dark .DoliFlow-sidebar-user-plan .DoliFlow-sidebar-plan-value {
	background: var(--DoliFlow-user-bubble, #1a5288);
	color: var(--DoliFlow-user-text, #fff);
}

.DoliFlow-theme-dark .DoliFlow-sidebar-user-meta .DoliFlow-sidebar-plan-upgrade {
	color: #8ab4ff;
}

.DoliFlow-sidebar-header h3 {
	font-size: 14px;
	font-weight: 600;
	margin: 0;
	color: var(--DoliFlow-text);
	flex: 1;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.DoliFlow-sidebar-btn {
	background: none;
	border: none;
	color: var(--DoliFlow-text-secondary);
	cursor: pointer;
	padding: 6px;
	border-radius: 6px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background 0.2s, color 0.2s;
}

.DoliFlow-sidebar-btn:hover {
	background: var(--DoliFlow-hover);
	color: var(--DoliFlow-text);
}

.DoliFlow-btn-mobilepair {
	position: relative;
}

.DoliFlow-mp-badge {
	position: absolute;
	top: -4px;
	right: -4px;
	background: #e53935;
	color: #fff;
	font-size: 10px;
	font-weight: 700;
	min-width: 16px;
	height: 16px;
	border-radius: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 4px;
	line-height: 1;
	pointer-events: none;
}

/* Tümünü sil — tehlikeli aksiyon, hover'da kırmızı vurgu */
.DoliFlow-btn-deleteall:hover {
	background: rgba(220, 38, 38, 0.15);
	color: #dc2626;
}

.DoliFlow-theme-dark .DoliFlow-btn-deleteall:hover {
	background: rgba(248, 113, 113, 0.18);
	color: #f87171;
}

.DoliFlow-session-list {
	flex: 1;
	overflow-y: auto;
	padding: 8px 16px;
}

/* Scrollbar - theme aware */
.DoliFlow-messages,
.DoliFlow-session-list,
.DoliFlow-input-row textarea {
	scrollbar-width: thin;
	scrollbar-color: rgba(0,0,0,0.25) transparent;
}

.DoliFlow-messages::-webkit-scrollbar,
.DoliFlow-session-list::-webkit-scrollbar,
.DoliFlow-input-row textarea::-webkit-scrollbar {
	width: 4px;
}

.DoliFlow-messages::-webkit-scrollbar-thumb,
.DoliFlow-session-list::-webkit-scrollbar-thumb,
.DoliFlow-input-row textarea::-webkit-scrollbar-thumb {
	background: rgba(0,0,0,0.25);
	border-radius: 3px;
	transition: background 0.2s;
}

.DoliFlow-messages::-webkit-scrollbar-thumb:hover,
.DoliFlow-session-list::-webkit-scrollbar-thumb:hover,
.DoliFlow-input-row textarea::-webkit-scrollbar-thumb:hover {
	background: rgba(0,0,0,0.4);
}

.DoliFlow-messages::-webkit-scrollbar-track,
.DoliFlow-session-list::-webkit-scrollbar-track,
.DoliFlow-input-row textarea::-webkit-scrollbar-track {
	background: transparent;
}

/* Dark theme scrollbar */
.DoliFlow-theme-dark .DoliFlow-messages,
.DoliFlow-theme-dark .DoliFlow-session-list,
.DoliFlow-theme-dark .DoliFlow-input-row textarea {
	scrollbar-color: rgba(255,255,255,0.2) transparent;
}

.DoliFlow-theme-dark .DoliFlow-messages::-webkit-scrollbar-thumb,
.DoliFlow-theme-dark .DoliFlow-session-list::-webkit-scrollbar-thumb,
.DoliFlow-theme-dark .DoliFlow-input-row textarea::-webkit-scrollbar-thumb {
	background: rgba(255,255,255,0.2);
}

.DoliFlow-theme-dark .DoliFlow-messages::-webkit-scrollbar-thumb:hover,
.DoliFlow-theme-dark .DoliFlow-session-list::-webkit-scrollbar-thumb:hover,
.DoliFlow-theme-dark .DoliFlow-input-row textarea::-webkit-scrollbar-thumb:hover {
	background: rgba(255,255,255,0.35);
}

.DoliFlow-session-item {
	margin: 2px 0;
	padding: 10px 10px;
	border-radius: 8px;
	cursor: pointer;
	transition: background 0.2s;
	font-size: 13px;
	display: flex;
	align-items: center;
	gap: 8px;
	position: relative;
}

.DoliFlow-session-item:hover {
	background: var(--DoliFlow-hover);
}

.DoliFlow-session-item.active {
	background: var(--DoliFlow-surface);
}

.DoliFlow-session-item-title {
	flex: 1;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	color: var(--DoliFlow-text);
}

.DoliFlow-session-item-delete {
	display: none;
	background: none;
	border: none;
	color: var(--DoliFlow-text-secondary);
	cursor: pointer;
	padding: 2px;
	border-radius: 4px;
}

.DoliFlow-session-item:hover .DoliFlow-session-item-delete {
	display: flex;
}

.DoliFlow-session-item-delete:hover {
	color: #ef4444;
	background: transparent;
}

/* ---- SIDEBAR OTOMASYON LIST ---- */
.DoliFlow-automation-list {
	flex: 1;
	overflow-y: auto;
	padding: 8px 16px;
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.DoliFlow-auto-group-label {
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .4px;
	color: var(--DoliFlow-text-secondary, #6c757d);
	margin: 12px 2px 6px 2px;
	padding-bottom: 3px;
	border-bottom: 1px solid var(--DoliFlow-border, #e0e0e0);
}
.DoliFlow-auto-item {
	border: 1px solid var(--DoliFlow-border, #e0e0e0);
	border-radius: 6px;
	padding: 8px 10px;
	background: var(--DoliFlow-surface, #f0f0f0);
}
.DoliFlow-auto-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
}
.DoliFlow-auto-badge {
	font-size: 12px;
	font-weight: 600;
	color: #2563eb;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.DoliFlow-auto-state {
	font-size: 11px;
	font-weight: 600;
	padding: 2px 8px;
	border-radius: 10px;
	white-space: nowrap;
}
.DoliFlow-auto-state.is-on {
	color: #166534;
	background: #dcfce7;
}
.DoliFlow-auto-state.is-off {
	color: #6b7280;
	background: #e5e7eb;
}
.DoliFlow-auto-state.is-running {
	color: #7c2d12;
	background: #ffedd5;
}
.DoliFlow-auto-ins {
	font-size: 12px;
	color: var(--DoliFlow-text-secondary, #6c757d);
	line-height: 1.45;
	margin: 6px 0 4px 0;
	word-break: break-word;
}
.DoliFlow-auto-actions {
	display: flex;
	gap: 6px;
	flex-wrap: wrap;
}
.DoliFlow-btn-tiny {
	border: 1px solid var(--DoliFlow-border, #e0e0e0);
	background: var(--DoliFlow-surface, #f0f0f0);
	color: var(--DoliFlow-text, #212529);
	border-radius: 4px;
	padding: 3px 8px;
	font-size: 11px;
	cursor: pointer;
}
.DoliFlow-btn-tiny:hover {
	background: var(--DoliFlow-hover, #e9ecef);
}
.DoliFlow-btn-tiny.is-danger {
	color: #dc2626;
}
.DoliFlow-btn-tiny.is-danger:hover {
	background: #fee2e2;
	border-color: #fca5a5;
}
/* Dark mode — otomasyon kartı: sabit (tema-dışı) renkler yumuşatılır.
   Başlık/badge soft mavi, durum rozetleri ve mini butonlar (sil dahil) koyu
   zeminde uyumlu mute tonlar kullanır (cron listesi dark kurallarıyla aynı). */
.DoliFlow-theme-dark .DoliFlow-auto-badge {
	color: #7bb8ff;
}
.DoliFlow-theme-dark .DoliFlow-auto-state.is-on {
	color: #4ade80;
	background: rgba(74, 222, 128, 0.14);
}
.DoliFlow-theme-dark .DoliFlow-auto-state.is-off {
	color: #9aa0a6;
	background: rgba(255, 255, 255, 0.08);
}
.DoliFlow-theme-dark .DoliFlow-btn-tiny {
	color: #aaa;
	border-color: rgba(255, 255, 255, 0.15);
	background: transparent;
}
.DoliFlow-theme-dark .DoliFlow-btn-tiny:hover {
	background: rgba(255, 255, 255, 0.1);
	color: #fff;
}
.DoliFlow-theme-dark .DoliFlow-btn-tiny.is-danger {
	color: #f87171;
}
.DoliFlow-theme-dark .DoliFlow-btn-tiny.is-danger:hover {
	color: #fca5a5;
	background: rgba(248, 113, 113, 0.12);
	border-color: rgba(248, 113, 113, 0.35);
}
.DoliFlow-automation-editor {
	padding: 10px 16px;
	border-top: 1px solid var(--DoliFlow-border, #e0e0e0);
}
.DoliFlow-auto-editbox {
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.DoliFlow-auto-editlabel {
	font-size: 12px;
	font-weight: 600;
	color: var(--DoliFlow-text, #212529);
	margin-bottom: 2px;
}
#DoliFlow-chat .DoliFlow-auto-evtsel,
#DoliFlow-chat .DoliFlow-auto-evtcustom,
#DoliFlow-chat .DoliFlow-auto-instinput {
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	border: 1px solid var(--DoliFlow-border, #d0d5dd);
	border-radius: 6px;
	background: var(--DoliFlow-input-bg, #ffffff);
	color: var(--DoliFlow-text, #111827);
	font-size: 13px;
	font-family: inherit;
	line-height: 1.4;
	padding: 8px 10px;
	outline: none;
	appearance: auto;
	height: auto;
	box-shadow: none;
	margin: 0;
}
#DoliFlow-chat .DoliFlow-auto-evtsel:focus,
#DoliFlow-chat .DoliFlow-auto-evtcustom:focus,
#DoliFlow-chat .DoliFlow-auto-instinput:focus,
#DoliFlow-chat .DoliFlow-auto-evtsel:focus-visible,
#DoliFlow-chat .DoliFlow-auto-evtcustom:focus-visible,
#DoliFlow-chat .DoliFlow-auto-instinput:focus-visible {
	border-color: #2563eb;
	box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.15);
	outline: none;
}
#DoliFlow-chat .DoliFlow-auto-evtcustom {
	margin-top: 6px;
}
#DoliFlow-chat .DoliFlow-auto-instinput {
	resize: vertical;
	min-height: 64px;
	display: block;
}
#DoliFlow-chat .DoliFlow-auto-evtsel option {
	background: #ffffff;
	color: #111827;
}
.DoliFlow-theme-dark #DoliFlow-chat .DoliFlow-auto-evtsel option {
	background: #2f2f2f;
	color: #e5e7eb;
}
.DoliFlow-auto-editactions {
	display: flex;
	gap: 8px;
	margin-top: 10px;
}
.DoliFlow-auto-evtchecks {
	max-height: 220px;
	overflow-y: auto;
	border: 1px solid var(--DoliFlow-border, #d0d5dd);
	border-radius: 6px;
	padding: 6px 8px;
	background: var(--DoliFlow-input-bg, #fff);
}
.DoliFlow-auto-evtgroup {
	margin-bottom: 4px;
}
.DoliFlow-auto-evtgroup-label {
	font-size: 11px;
	font-weight: 700;
	color: var(--DoliFlow-text-secondary, #6c757d);
	text-transform: uppercase;
	letter-spacing: .4px;
	padding: 4px 2px 2px;
}
.DoliFlow-auto-evcheck {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 3px 4px;
	border-radius: 4px;
	font-size: 12.5px;
	color: var(--DoliFlow-text, #212529);
	cursor: pointer;
}
.DoliFlow-auto-evcheck:hover {
	background: var(--DoliFlow-hover, #eef1f4);
}
.DoliFlow-auto-evcheck input[type="checkbox"] {
	margin: 0;
	flex-shrink: 0;
	width: 15px;
	height: 15px;
	accent-color: #2563eb;
}
.DoliFlow-auto-evcheck.is-disabled {
	cursor: not-allowed;
	opacity: .55;
}
.DoliFlow-auto-evcheck.is-disabled:hover {
	background: transparent;
}
.DoliFlow-auto-evtcustom {
	margin-top: 6px !important;
}

/* ---- Session Search ---- */
.DoliFlow-session-search {
	display: flex;
	align-items: center;
	gap: 6px;
	margin: 6px 12px 2px;
	padding: 6px 10px;
	border: 1px solid var(--DoliFlow-border);
	border-radius: 8px;
	background: var(--DoliFlow-surface);
	color: var(--DoliFlow-text-secondary);
	flex-shrink: 0;
}
.DoliFlow-session-search svg {
	flex-shrink: 0;
	opacity: 0.6;
}
.DoliFlow-session-search-input {
	flex: 1;
	min-width: 0;
	border: none !important;
	outline: none !important;
	background: transparent;
	color: var(--DoliFlow-text);
	font-size: 13px;
}
.DoliFlow-session-search-input:focus,
.DoliFlow-session-search-input:focus-visible {
	border: none !important;
	outline: none !important;
	box-shadow: none !important;
}
.DoliFlow-session-search:focus-within {
	border-color: var(--DoliFlow-border);
	box-shadow: none !important;
}
.DoliFlow-session-search-input::placeholder {
	color: var(--DoliFlow-text-secondary);
	opacity: 0.7;
}
.DoliFlow-session-search-clear {
	display: none;
	align-items: center;
	justify-content: center;
	background: none;
	border: none;
	color: var(--DoliFlow-text-secondary);
	cursor: pointer;
	padding: 2px;
	border-radius: 4px;
	flex-shrink: 0;
}
.DoliFlow-session-search-clear:hover {
	color: var(--DoliFlow-text);
	background: var(--DoliFlow-hover);
}

/* Arama çubuğunun içindeki toplu silme butonu daralmasın */
.DoliFlow-session-search .DoliFlow-btn-deleteall {
	flex-shrink: 0;
}

.DoliFlow-session-empty,
.DoliFlow-file-empty {
	padding: 24px 16px;
	text-align: center;
	color: var(--DoliFlow-text-secondary);
	font-size: 14px;
	line-height: 1.5;
}

/* ---- User Files ---- */
.DoliFlow-file-list {
	flex: 1;
	overflow-y: auto;
	padding: 8px 16px;
}
.DoliFlow-file-item {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 8px 10px;
	margin: 2px 0;
	border-radius: 8px;
	background: var(--DoliFlow-surface, #f0f0f0);
	border: 1px solid var(--DoliFlow-border, #dee2e6);
	transition: background 0.2s, border-color 0.2s;
	font-size: 13px;
}
.DoliFlow-file-item:hover {
	background: var(--DoliFlow-hover, #e9ecef);
}
.DoliFlow-file-item-icon {
	flex-shrink: 0;
}
.DoliFlow-file-item-name {
	flex: 1;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	/* !important: Dolibarr'ın global a:link rengi bu sınıfı ezmesin diye;
	   tema değişkeni dark/light'ta otomatik uyum sağlar. */
	color: var(--DoliFlow-text) !important;
	text-decoration: none;
}
.DoliFlow-file-item-name:hover {
	text-decoration: underline;
	color: var(--DoliFlow-text) !important;
}
.DoliFlow-file-item-size {
	flex-shrink: 0;
	font-size: 12px;
	color: var(--DoliFlow-text-secondary);
}
.DoliFlow-file-item-delete {
	display: none;
	background: none;
	border: none;
	color: var(--DoliFlow-text-secondary);
	cursor: pointer;
	padding: 3px;
	border-radius: 4px;
	flex-shrink: 0;
}
.DoliFlow-file-item:hover .DoliFlow-file-item-delete {
	display: flex;
}
.DoliFlow-file-item-delete:hover {
	color: #ef4444;
}
.DoliFlow-file-item-delete:disabled {
	opacity: 0.4;
	cursor: wait;
}

/* Sidebar Resize Handle */
.DoliFlow-sidebar-resize-handle {
	width: 5px;
	cursor: col-resize;
	background: transparent;
	position: relative;
	z-index: 5;
	flex-shrink: 0;
	transition: background 0.15s;
}
.DoliFlow-sidebar-resize-handle:hover,
.DoliFlow-sidebar-resize-handle:active {
	background: var(--DoliFlow-user-bubble);
}

/* Hides sidebar resize handle when sidebar is collapsed */
.DoliFlow-sidebar-collapsed .DoliFlow-sidebar-resize-handle {
	display: none;
}

/* ============================================================
   MAIN CHAT AREA
   ============================================================ */

.DoliFlow-main {
	flex: 1;
	display: flex;
	flex-direction: column;
	background: var(--DoliFlow-bg);
	min-width: 0;
	position: relative;
}

.DoliFlow-header {
	padding: 8px 16px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1px solid var(--DoliFlow-border);
	gap: 8px;
	background: var(--DoliFlow-bg);
}

.DoliFlow-header-title {
	font-size: 14px;
	font-weight: 600;
	color: var(--DoliFlow-text);
	flex: 1;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* Header kullanım göstergesi (backend'den gelen güvenilir kullanım yüzdesi) */
.DoliFlow-usage-indicator {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-size: 12px;
	font-weight: 500;
	padding: 3px 10px;
	border-radius: 999px;
	background: var(--DoliFlow-hover);
	color: var(--DoliFlow-text-secondary);
	white-space: nowrap;
	line-height: 1.4;
}
.DoliFlow-usage-indicator.DoliFlow-usage-ok {
	background: rgba(46, 160, 67, .12);
	color: var(--DoliFlow-success, #2ea043);
}
.DoliFlow-usage-indicator.DoliFlow-usage-warn {
	background: rgba(219, 171, 9, .15);
	color: var(--DoliFlow-warning-text, #b45309);
}
.DoliFlow-usage-indicator.DoliFlow-usage-critical {
	background: rgba(217, 119, 6, .16);
	color: var(--DoliFlow-warning-text, #c2410c);
}
.DoliFlow-usage-indicator.DoliFlow-usage-full {
	background: rgba(220, 38, 38, .14);
	color: var(--DoliFlow-danger, #dc2626);
}

.DoliFlow-header-actions {
	display: flex;
	align-items: center;
	gap: 2px;
	position: relative;
}

.DoliFlow-header-btn {
	background: none;
	border: none;
	color: var(--DoliFlow-icon-color);
	cursor: pointer;
	padding: 6px;
	border-radius: 6px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background 0.2s, color 0.2s;
}

.DoliFlow-header-btn:hover {
	background: var(--DoliFlow-hover);
	color: var(--DoliFlow-text);
}

.DoliFlow-header-btn.active-theme {
	color: var(--DoliFlow-user-bubble) !important;
}

/* Ayarlar linki header butonu gibi görünür; Dolibarr'ın global a:link
   rengi/alt çizgisi bu sınıfı ezmesin diye !important kullanılır. */
a.DoliFlow-btn-settings,
a.DoliFlow-btn-settings:hover,
a.DoliFlow-btn-settings:focus,
a.DoliFlow-btn-settings:visited {
	color: var(--DoliFlow-icon-color) !important;
	text-decoration: none !important;
}

/* Sidebar footer'daki ayarlar ikonu sağ kenara yaslanır */
.DoliFlow-sidebar-footer .DoliFlow-btn-settings {
	margin-left: auto;
	flex-shrink: 0;
}

/* ============================================================
   DISPLAY MODE POPUP
   ============================================================ */
.DoliFlow-display-mode-popup {
	position: absolute;
	top: 100%;
	right: -6px;
	margin-top: 4px;
	background: var(--DoliFlow-bg, #fff);
	border: 1px solid var(--DoliFlow-border, #dee2e6);
	border-radius: 10px;
	box-shadow: 0 8px 24px rgba(0,0,0,0.15);
	padding: 4px;
	display: none;
	z-index: 2147483001;
	min-width: 160px;
	overflow: hidden;
}
.DoliFlow-display-mode-popup.DoliFlow-popup-open {
	display: block;
}
.DoliFlow-mode-option {
	display: flex;
	align-items: center;
	gap: 8px;
	width: 100%;
	padding: 8px 12px;
	border: none;
	background: transparent;
	color: var(--DoliFlow-text, #212529);
	font-size: 13px;
	cursor: pointer;
	border-radius: 6px;
	text-align: left;
	transition: background 0.15s;
}
.DoliFlow-mode-option:hover {
	background: var(--DoliFlow-hover, #e9ecef);
}
.DoliFlow-mode-option svg {
	flex-shrink: 0;
	color: var(--DoliFlow-icon-color);
}
.DoliFlow-mode-option.is-active {
	background: var(--DoliFlow-surface, #f0f0f0);
	font-weight: 600;
}
.DoliFlow-mode-option.is-active svg {
	color: var(--DoliFlow-user-bubble, #0d6efd);
}

/* ============================================================
   MESSAGES AREA
   ============================================================ */

.DoliFlow-messages {
	flex: 1;
	overflow-y: auto;
	padding: 16px;
	display: flex;
	flex-direction: column;
	gap: 18px;
	/* NOT: scroll-behavior:smooth KULLANILMAZ — programatik scrollTop ataması
	   animasyonla çakışır, kullanıcının yukarı kaydırmasını (geçmiş okuma)
	   algılayan _userScrolledUp tespitini bozar ve scroll "yukarıda takılı"
	   görünür. Scroll'lar JS tarafında rAF ile anlık yapılır. */
}

.DoliFlow-msg {
	display: flex;
	flex-direction: column;   /* üstte "simge + isim" satırı, altta balon */
	align-items: flex-start;
	gap: 4px;
	width: 100%;
	flex-shrink: 0;
	animation: DoliFlow-msg-in 0.25s ease;
}

@keyframes DoliFlow-msg-in {
	from { opacity: 0; transform: translateY(8px); }
	to { opacity: 1; transform: translateY(0); }
}

.DoliFlow-msg-user {
	align-self: flex-end;    /* kullanıcı mesajı sağda */
	align-items: flex-end;   /* başlık + balon sağa hizalı */
}

.DoliFlow-msg-agent {
	align-self: flex-start;
}

/* Kullanıcı içeriği sağa yaslanır (balon + zaman sağda hizalanır) */
.DoliFlow-msg-user .DoliFlow-msg-content {
	align-items: flex-end;
}

.DoliFlow-msg-content {
	display: flex;
	flex-direction: column;
	gap: 4px;
	flex: 1;
	min-width: 0;
	max-width: 100%;
	align-self: stretch;   /* agent balonu genişlikte tam yayılsın */
	width: 100%;
}

.DoliFlow-msg-bubble {
    position: relative;
    padding: 10px 14px;
    border-radius: 16px;
    line-height: 1.5;
    font-size: 13px;
    word-wrap: break-word;
    white-space: pre-wrap;
    visibility: visible;
    display: flex;
    flex-direction: row;
    gap: 8px;
    align-items: flex-start;
}

.DoliFlow-msg-user .DoliFlow-msg-bubble {
	/* Balonsuz tasarım (agentic görünüm): metin doğrudan sohbet zemininde akar.
	   Üstte "simge + isim" satırı olduğu için padding/girinti sorunu yoktur. */
	background: transparent;
	color: var(--DoliFlow-text, #212529);
	border: none;
	border-radius: 0;
	padding: 0;
	margin: 0;
}

.DoliFlow-msg-text {
	display: block;
	flex: 1;
	min-width: 0;
	margin-top: 0;
}

/* ---- BALON ÜSTÜ "simge + isim" SATIRI (ChatGPT/Claude tarzı) ----
   İkon burada metin akışından tamamen ayrıdır; balon içinde ikon yoktur,
   bu yüzden satır kayınca girinti oluşmaz ve simgenin altında boşluk kalmaz. */
.DoliFlow-msg-meta-header {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 0 2px;
}
.DoliFlow-msg-author {
	font-size: 11px;
	font-weight: 600;
	color: var(--DoliFlow-muted-text, #6c757d);
	line-height: 1;
}

/* LLM'in tüm yanıtı sardığı üst düzey div'e eklediği dikey padding/margin'i
   nötralize et — balonun kendi padding'i zaten var; sarmalayıcı "<div
   style='padding:12px 0'>" gibi gereksiz boşluk yaratır. İç elemanların
   kendi padding'ine dokunulmaz (yalnızca ilk çocuk DIV hedeflenir). */
.DoliFlow-msg-text > div:first-child {
	padding: 0 !important;
	margin: 0 !important;
}

/* Agent grafikleri: asla yan yana gösterilmez, her zaman dikey istiflenir.
   Agent inline style ile flex/grid kullansa bile block'a zorlanır. */
.DoliFlow-msg-text [style*="display:flex"],
.DoliFlow-msg-text [style*="display:flex;"],
.DoliFlow-msg-text [style*="display: flex"],
.DoliFlow-msg-text [style*="display:grid"],
.DoliFlow-msg-text [style*="display:grid;"],
.DoliFlow-msg-text [style*="display: grid"],
.DoliFlow-msg-text [style*="display:inline-flex"],
.DoliFlow-msg-text [style*="display: inline-flex"] {
	display: block !important;
}

.DoliFlow-msg-text svg {
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
	height: auto !important;
	margin: 10px 0 !important;
}

.DoliFlow-msg-text svg text {
	font-family: inherit;
}

/* Chart yazıları her iki temada (dark/light) arayüz metin rengiyle okunur.
   Agent'ın gönderdiği sabit fill değerleri tema geçişinde ezilir. */
.DoliFlow-msg-text svg text {
	fill: var(--DoliFlow-text) !important;
}

.DoliFlow-msg-text > svg:first-child {
	margin-top: 0;
}

/* Agent'ın sabit gönderdiği nötr tema metin renkleri (#e8e8e8, #333, #666, #999 vb.)
   tema değişkenine bağlanır — dark/light geçişinde düz metin her zaman okunur kalır.
   Semantik vurgu renkleri (kırmızı/yeşil/mavi vb.) dokunulmaz. */
.DoliFlow-msg-text [style*="color:#e8e8e8"],
.DoliFlow-msg-text [style*="color:#e8e8e8;"],
.DoliFlow-msg-text [style*="color: #e8e8e8"],
.DoliFlow-msg-text [style*="color:#ececec"],
.DoliFlow-msg-text [style*="color:#333"],
.DoliFlow-msg-text [style*="color:#333333"],
.DoliFlow-msg-text [style*="color:#666"],
.DoliFlow-msg-text [style*="color:#666666"],
.DoliFlow-msg-text [style*="color:#999"],
.DoliFlow-msg-text [style*="color:#999999"],
.DoliFlow-msg-text [style*="color:#212529"] {
	color: var(--DoliFlow-text) !important;
}

/* Agent tabloları: hücre yazı rengi, zemin ve kenarlıklar tema değişkenlerine bağlanır.
   Agent'ın sabit gönderdiği dark/light değerleri geçişte ezilir; tablo iki temada da
   her zaman okunur kalır (örn. koyu th zemini + koyu yazı çakışması oluşmaz). */
.DoliFlow-msg-text th,
.DoliFlow-msg-text td {
	color: var(--DoliFlow-text) !important;
	border-color: var(--DoliFlow-border) !important;
}

.DoliFlow-msg-text th {
	background: var(--DoliFlow-hover) !important;
}

.DoliFlow-msg-text td {
	background: transparent !important;
}

.DoliFlow-msg-agent .DoliFlow-msg-bubble {
	/* Balonsuz tasarım: metin doğrudan sohbet zemininde akar.
	   İkon+isim üstte olduğundan padding/girinti sorunu yoktur. */
	background: transparent;
	border: none;
	border-radius: 0;
	padding: 0;
	white-space: normal;
	line-height: 1.6;
}

.DoliFlow-theme-dark .DoliFlow-msg-agent .DoliFlow-msg-bubble {
	border-color: rgba(255,255,255,0.08);
}

.DoliFlow-msg-agent .DoliFlow-msg-bubble code {
	background: rgba(0,0,0,0.08);
	padding: 2px 6px;
	border-radius: 4px;
	font-size: 12px;
	font-family: 'Consolas', 'Monaco', 'Courier New', monospace;
	word-break: break-word;
}

.DoliFlow-msg-agent .DoliFlow-msg-bubble pre {
	background: rgba(0,0,0,0.06);
	padding: 10px 12px;
	border-radius: 8px;
	font-size: 12px;
	font-family: 'Consolas', 'Monaco', 'Courier New', monospace;
	overflow-x: auto;
	margin: 8px 0;
	white-space: pre-wrap;
	word-break: break-word;
}

.DoliFlow-msg-agent .DoliFlow-msg-bubble pre code {
	background: none;
	padding: 0;
	border-radius: 0;
	font-size: inherit;
}

.DoliFlow-msg-agent .DoliFlow-msg-bubble a {
	color: var(--DoliFlow-primary, #0057b7);
	text-decoration: underline;
}

.DoliFlow-msg-agent .DoliFlow-msg-bubble ul,
.DoliFlow-msg-agent .DoliFlow-msg-bubble ol {
	margin: 6px 0;
	padding-left: 20px;
}

.DoliFlow-msg-agent .DoliFlow-msg-bubble li {
	margin: 3px 0;
}

.DoliFlow-msg-agent .DoliFlow-msg-bubble blockquote {
	border-left: 3px solid var(--DoliFlow-primary, #0057b7);
	margin: 8px 0;
	padding: 4px 12px;
	opacity: 0.85;
}

.DoliFlow-msg-agent .DoliFlow-msg-bubble h1,
.DoliFlow-msg-agent .DoliFlow-msg-bubble h2,
.DoliFlow-msg-agent .DoliFlow-msg-bubble h3,
.DoliFlow-msg-agent .DoliFlow-msg-bubble h4,
.DoliFlow-msg-agent .DoliFlow-msg-bubble h5,
.DoliFlow-msg-agent .DoliFlow-msg-bubble h6 {
	margin: 10px 0 4px;
	line-height: 1.3;
}

.DoliFlow-msg-agent .DoliFlow-msg-bubble h1 { font-size: 16px; }
.DoliFlow-msg-agent .DoliFlow-msg-bubble h2 { font-size: 15px; }
.DoliFlow-msg-agent .DoliFlow-msg-bubble h3 { font-size: 14px; }
.DoliFlow-msg-agent .DoliFlow-msg-bubble h4,
.DoliFlow-msg-agent .DoliFlow-msg-bubble h5,
.DoliFlow-msg-agent .DoliFlow-msg-bubble h6 { font-size: 13px; }

.DoliFlow-msg-agent .DoliFlow-msg-bubble .DoliFlow-table-wrapper {
	overflow: auto;
	max-width: 100%;
	margin: 8px 0;
	-webkit-overflow-scrolling: touch;
}

.DoliFlow-msg-agent .DoliFlow-msg-bubble .DoliFlow-table-wrapper table {
	margin: 0;
}

.DoliFlow-msg-agent .DoliFlow-msg-bubble table {
	border-collapse: collapse;
	font-size: 12px;
	width: 100%;
}

.DoliFlow-msg-agent .DoliFlow-msg-bubble th,
.DoliFlow-msg-agent .DoliFlow-msg-bubble td {
	border: 1px solid rgba(0,0,0,0.12);
	padding: 6px 10px;
	text-align: left;
}

.DoliFlow-msg-agent .DoliFlow-msg-bubble th {
	background: rgba(0,0,0,0.05);
	font-weight: 600;
}

/* Light mode - tablo satır arkaplanları */
.DoliFlow-msg-agent .DoliFlow-msg-bubble tbody tr:nth-child(even) {
	background: rgba(0,0,0,0.02);
}

.DoliFlow-msg-agent .DoliFlow-msg-bubble hr {
	border: none;
	border-top: 1px solid rgba(0,0,0,0.12);
	margin: 10px 0;
}

.DoliFlow-msg-agent .DoliFlow-msg-bubble p {
	margin: 6px 0;
}

.DoliFlow-msg-agent .DoliFlow-msg-bubble p:first-child {
	margin-top: 0;
}

.DoliFlow-msg-agent .DoliFlow-msg-bubble p:last-child {
	margin-bottom: 0;
}

/* Agent HTML: sabit açık zeminler (inline style) — temaya uyarla.
   Prompt "container background koyma" der, ama model yine de #f5f5f5 vb.
   kullanırsa koyu temada okunmaz açık kutu oluşur; bu kurallar ezerek
   temalı yüzey rengine dönüştürür. */
.DoliFlow-msg-agent .DoliFlow-msg-bubble div[style*="background:#f5f5f5"],
.DoliFlow-msg-agent .DoliFlow-msg-bubble div[style*="background: #f5f5f5"],
.DoliFlow-msg-agent .DoliFlow-msg-bubble div[style*="background:#f0f0f0"],
.DoliFlow-msg-agent .DoliFlow-msg-bubble div[style*="background: #f0f0f0"],
.DoliFlow-msg-agent .DoliFlow-msg-bubble div[style*="background:#f8f8f8"],
.DoliFlow-msg-agent .DoliFlow-msg-bubble div[style*="background: #f8f8f8"],
.DoliFlow-msg-agent .DoliFlow-msg-bubble div[style*="background:#fafafa"],
.DoliFlow-msg-agent .DoliFlow-msg-bubble div[style*="background: #fafafa"],
.DoliFlow-msg-agent .DoliFlow-msg-bubble div[style*="background:#f9f9f9"],
.DoliFlow-msg-agent .DoliFlow-msg-bubble div[style*="background: #f9f9f9"],
.DoliFlow-msg-agent .DoliFlow-msg-bubble div[style*="background:#eeeeee"],
.DoliFlow-msg-agent .DoliFlow-msg-bubble div[style*="background: #eeeeee"],
.DoliFlow-msg-agent .DoliFlow-msg-bubble div[style*="background:#eee"],
.DoliFlow-msg-agent .DoliFlow-msg-bubble div[style*="background: #eee"],
.DoliFlow-msg-agent .DoliFlow-msg-bubble div[style*="background:#ffffff"],
.DoliFlow-msg-agent .DoliFlow-msg-bubble div[style*="background: #ffffff"],
.DoliFlow-msg-agent .DoliFlow-msg-bubble div[style*="background:white"],
.DoliFlow-msg-agent .DoliFlow-msg-bubble div[style*="background: white"] {
	background: var(--DoliFlow-surface, #f0f0f0) !important;
	color: inherit !important;
}

.DoliFlow-msg-agent .DoliFlow-msg-bubble br {
	content: '';
	display: block;
	margin: 4px 0;
}

.DoliFlow-msg-agent .DoliFlow-msg-bubble sub,
.DoliFlow-msg-agent .DoliFlow-msg-bubble sup {
	font-size: 11px;
}

.DoliFlow-msg-time {
	font-size: 11px;
	color: var(--DoliFlow-text-secondary);
	padding: 0 4px;
}

.DoliFlow-msg-user .DoliFlow-msg-time {
	text-align: right;
}

.DoliFlow-msg-bubble-row {
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	gap: 4px;
}

.DoliFlow-msg-actions {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
	flex-shrink: 0;
	padding-top: 4px;
	min-width: 20px;
}

.DoliFlow-msg-agent .DoliFlow-msg-bubble-row {
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	gap: 4px;
}
.DoliFlow-msg-agent .DoliFlow-msg-bubble-row .DoliFlow-msg-bubble {
	flex: 1;
	min-width: 0;
}

.DoliFlow-msg-user .DoliFlow-msg-bubble-row {
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	gap: 4px;
	flex: 0 1 auto;
	min-width: 0;
	max-width: 100%;
}
.DoliFlow-msg-user .DoliFlow-msg-bubble-row .DoliFlow-msg-bubble {
	/* Balonsuz tasarım: bubble içeriğine göre genişler. NOT: burada
	   yüzde (örn. 85%) max-width KULLANILMAZ — içerik boyutlu flex
	   kapsayıcıda yüzde dairesel çözülür ve kısa mesaj ("Selam") bile
	   "Sela"/"m" diye ortasından kırılır. 100% ile metin kelime
	   sınırlarında doğal şekilde sarar. */
	flex: 0 1 auto;
	min-width: 0;
	max-width: 100%;
	overflow-wrap: break-word;
	word-break: normal;
}
.DoliFlow-msg-user .DoliFlow-msg-bubble .DoliFlow-msg-text {
	flex: 0 1 auto;      /* metin içeriğe göre genişler, sınırda sarar */
	min-width: 0;
	overflow-wrap: break-word;
	word-break: normal;
}
/* ---- MESSAGE AVATAR (balonun ÜSTÜNDEKİ isim satırında) ----
   Kullanıcı/agent ayırt edici küçük yuvarlak rozet. Balonun üstündeki
   "simge + isim" satırında durur; balon içinde değildir, bu yüzden metin
   akışını etkilemez, satır kayınca girinti/boşluk oluşturmaz. */
.DoliFlow-msg-avatar {
	width: 18px;
	height: 18px;
	min-width: 18px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	margin: 0;
	overflow: hidden;
}
.DoliFlow-msg-avatar svg {
	display: block;
}
.DoliFlow-msg-avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	border-radius: 50%;
}
.DoliFlow-msg-user .DoliFlow-msg-avatar {
	background: var(--DoliFlow-user-bubble, #0d6efd);
	color: var(--DoliFlow-user-text, #fff);
}
.DoliFlow-msg-agent .DoliFlow-msg-avatar {
	/* DoliFlow marka rengi (mobil AppTheme.seed #6C5CE7) — gri agent balonunun
	   içinde logo rozeti olarak belirgin durur. */
	background: var(--DoliFlow-accent, #6c5ce7);
	color: #fff;
}

.DoliFlow-msg-revert {
	position: absolute;
	top: 6px;
	left: 4px;
	z-index: 3;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 18px;
	height: 18px;
	padding: 0;
	background: rgba(255,255,255,0.25);
	border: none;
	cursor: pointer;
	border-radius: 4px;
	color: rgba(255,255,255,0.8);
	opacity: 0;
	transition: opacity 0.2s, background 0.2s, color 0.2s;
	font-size: 11px;
	box-shadow: 0 1px 3px rgba(0,0,0,0.15);
}
.DoliFlow-msg-revert svg {
	display: block;
}

.DoliFlow-msg-user .DoliFlow-msg-revert {
	right: 36px;
	left: auto;
}

.DoliFlow-msg-user:hover .DoliFlow-msg-revert,
.DoliFlow-msg:hover .DoliFlow-msg-revert {
	opacity: 1;
}

.DoliFlow-msg-revert:hover, .DoliFlow-msg-copy:hover {
	background: rgba(0,0,0,0.12);
	color: var(--DoliFlow-text);
}

.DoliFlow-msg-copy-copied {
	color: #22c55e !important;
}
.DoliFlow-msg-copy-copied svg {
	stroke: #22c55e !important;
}

.DoliFlow-msg-copy {
	position: absolute;
	top: 6px;
	right: 12px;
	z-index: 3;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 18px;
	height: 18px;
	padding: 0;
	background: rgba(255,255,255,0.25);
	border: none;
	cursor: pointer;
	border-radius: 4px;
	color: rgba(255,255,255,0.8);
	opacity: 0;
	transition: opacity 0.2s, background 0.2s, color 0.2s;
	font-size: 11px;
	box-shadow: 0 1px 3px rgba(0,0,0,0.15);
}

.DoliFlow-msg-user .DoliFlow-msg-copy {
	left: auto;
	right: 12px;
}

.DoliFlow-msg-copy svg {
	display: block;
}

.DoliFlow-msg:hover .DoliFlow-msg-copy {
	opacity: 1;
}

/* Not: Balonlu tasarımdan kalma dark-mode overlay kuralları kaldırıldı —
   butonlar artık her zaman meta satırında ve şeffaf (agent kopyala tuşu
   stili); dark mode'da ekstra arka plan uygulanmaz. */

/* ============================================================
   TIME + COPY ACTION ROW (Trae tarzı)
   Zaman etiketiyle birlikte kopyala tuşu, sağa yaslı satır
   ============================================================ */
.DoliFlow-msg-meta {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 2px;
	margin-top: 2px;
}
.DoliFlow-msg-meta .DoliFlow-msg-copy,
.DoliFlow-msg-meta .DoliFlow-msg-revert {
	position: static;
	top: auto;
	right: auto;
	left: auto;
	/* Agent kopyala tuşu stili: arka plan YOK; ikon rengi temaya uygun.
	   (Base rgba(255,255,255,0.8) beyaz ikon açık temada görünmezdi —
	   butonun üzerine gelince renk değişip beliriyordu; balon hover'ında
	   görünmüyordu — kullanıcı şikayeti.) */
	background: transparent !important;
	box-shadow: none;
	color: var(--DoliFlow-icon-color, #6C757D);
	opacity: 0;
}
/* Balonun üzerine, saat/meta satırının üzerine veya butonun üzerine gelince
   (ve klavye odağında) kopyala/düzenle tuşları belirir — kullanıcı isteği. */
.DoliFlow-msg:hover .DoliFlow-msg-meta .DoliFlow-msg-copy,
.DoliFlow-msg:hover .DoliFlow-msg-meta .DoliFlow-msg-revert,
.DoliFlow-msg-meta:hover .DoliFlow-msg-copy,
.DoliFlow-msg-meta:hover .DoliFlow-msg-revert,
.DoliFlow-msg-meta .DoliFlow-msg-copy:hover,
.DoliFlow-msg-meta .DoliFlow-msg-revert:hover,
.DoliFlow-msg-meta .DoliFlow-msg-copy:focus-visible,
.DoliFlow-msg-meta .DoliFlow-msg-revert:focus-visible {
	opacity: 1;
}

/* Session expired warning — pencerenin altına sabitlenen bildirim */
.DoliFlow-session-expired {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	top: auto;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	background: linear-gradient(to top, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0));
	z-index: 1000;
	max-width: none;
	margin: 0 !important;
	pointer-events: auto;
	animation: DoliFlow-expired-in 0.3s ease;
}

@keyframes DoliFlow-expired-in {
	from { opacity: 0; }
	to { opacity: 1; }
}

/* Defansif: tarayıcıda önbelleklenmiş eski JS sürümü bu bildirimi
   DoliFlow-msg-system sınıfıyla çiziyordu ve bu sınıf pointer-events:none
   içerdiğinden butonlar hiç tıklanamıyordu. Bu kurallar, hangi sürüm
   yüklenirse yüklensin Re-login / Kapat butonlarının tıklanabilir
   kalmasını garanti eder. */
.DoliFlow-msg-system .DoliFlow-msg-bubble a,
.DoliFlow-msg-system .DoliFlow-msg-bubble button,
.DoliFlow-session-expired a,
.DoliFlow-session-expired button {
	pointer-events: auto !important;
	cursor: pointer;
}

.DoliFlow-session-expired .DoliFlow-msg-content {
	max-width: 100%;
	padding: 14px;
	box-sizing: border-box;
}

.DoliFlow-session-expired .DoliFlow-msg-bubble {
	display: flex;
	flex-direction: column;
	gap: 8px;
	width: auto;
	max-width: 520px;
	margin: 0 auto;
	background: var(--DoliFlow-error-bg);
	color: var(--DoliFlow-error-text);
	border: 1px solid var(--DoliFlow-error-border);
	border-radius: 14px;
	padding: 16px 20px;
	line-height: 1.5;
	box-shadow: 0 6px 24px rgba(0, 0, 0, 0.25);
}

.DoliFlow-session-expired-title {
	color: var(--DoliFlow-error-text);
	font-weight: 600;
	font-size: 14px;
}

.DoliFlow-session-expired-text {
	font-size: 13px;
	color: var(--DoliFlow-error-text);
}

/* Butonlar bildirimin altında, kendi satırlarında */
.DoliFlow-session-expired-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin-top: 4px;
}

.DoliFlow-msg-attachment {
	margin-top: 4px;
	padding: 6px 10px;
	background: var(--DoliFlow-surface);
	border-radius: 8px;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	color: var(--DoliFlow-text-secondary);
	text-decoration: none;
}

.DoliFlow-msg-attachment:hover {
	color: var(--DoliFlow-text);
}

.DoliFlow-welcome {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	gap: 8px;
	color: var(--DoliFlow-text-secondary);
	text-align: center;
}

.DoliFlow-welcome-icon {
	position: relative;
	width: 60px;
	height: 60px;
	border-radius: 50%;
	background: var(--DoliFlow-surface);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--DoliFlow-accent, #4a90d9);
}

.DoliFlow-welcome-bot,
.DoliFlow-welcome-sparkles,
.DoliFlow-welcome-star {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}

.DoliFlow-welcome-bot {
	font-size: 30px;
	line-height: 1;
	/* Robot önce belirir, kısa süre ekranda kalır, ardından sparkles'a dönüşür */
	animation: DoliFlowBotIntro 2s ease-in-out 1 forwards;
}

.DoliFlow-welcome-sparkles {
	opacity: 0;
	/* Robot kaybolduktan sonra belirir (DoliFlowTwinkle); forwards ile kalıcı */
	animation: DoliFlowTwinkle 2s ease-in-out 1 forwards;
}

.DoliFlow-welcome-star {
	font-size: 13px;
	line-height: 1;
	opacity: 0;
	/* Sparkles belirdikten sonra etrafa saçılan yıldızlar (tek seferlik) */
	animation: DoliFlowStarBurst 1.5s ease-out 1 forwards;
}
.DoliFlow-welcome-star-1 { --sx: 27px; --sy: -25px; animation-delay: .9s; }
.DoliFlow-welcome-star-2 { --sx: -27px; --sy: -21px; animation-delay: 1s; }
.DoliFlow-welcome-star-3 { --sx: 23px; --sy: 23px; animation-delay: 1.1s; }
.DoliFlow-welcome-star-4 { --sx: -24px; --sy: 21px; animation-delay: 1.2s; }

@keyframes DoliFlowBotIntro {
	0%   { opacity: 0; transform: scale(.5) translateY(8px); }
	15%  { opacity: 1; transform: scale(1.08) translateY(0); }
	25%  { opacity: 1; transform: scale(1); }
	45%  { opacity: 1; transform: scale(1); }
	60%  { opacity: 0; transform: scale(.75) translateY(-4px); }
	100% { opacity: 0; transform: scale(.75); }
}

@keyframes DoliFlowTwinkle {
	0%   { transform: scale(.5) rotate(-10deg); opacity: 0; }
	50%  { transform: scale(.5) rotate(-10deg); opacity: 0; }
	65%  { transform: scale(1.1) rotate(3deg); opacity: 1; }
	80%  { transform: scale(.95) rotate(-2deg); opacity: 1; }
	100% { transform: scale(1) rotate(0deg); opacity: 1; }
}

@keyframes DoliFlowStarBurst {
	0%   { opacity: 0; transform: scale(.4) translate(0, 0); }
	30%  { opacity: 1; transform: scale(1.1) translate(0, 0); }
	100% { opacity: 0; transform: scale(.6) translate(var(--sx, 0), var(--sy, 0)); }
}

.DoliFlow-welcome h4 {
	color: var(--DoliFlow-text);
	margin: 0;
	font-size: 16px;
	font-weight: 600;
}

.DoliFlow-welcome p {
	font-size: 13px;
	margin: 0;
	max-width: 280px;
}

/* Dinamik Quick Actions (karşılama ekranı) */
.DoliFlow-quick-actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
	margin-top: 8px;
	max-width: 340px;
}

.DoliFlow-quick-action {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 12px;
	border: 1px solid var(--DoliFlow-border);
	border-radius: 20px;
	background: var(--DoliFlow-surface);
	color: var(--DoliFlow-text);
	font-size: 12px;
	line-height: 1;
	cursor: pointer;
	transition: border-color .15s ease, background .15s ease, transform .1s ease;
}

.DoliFlow-quick-action:hover {
	border-color: var(--DoliFlow-accent, #4a90d9);
	background: var(--DoliFlow-accent-soft, rgba(74, 144, 217, 0.12));
}

.DoliFlow-quick-action:active {
	transform: scale(0.97);
}

.DoliFlow-quick-action-icon {
	font-size: 14px;
	line-height: 1;
}

/* İkincil (düşük öncelikli) quick actions — ana 4'lüden daha az vurgulu */
.DoliFlow-quick-actions-secondary {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 6px;
	margin-top: 10px;
	max-width: 340px;
}

.DoliFlow-quick-action-secondary {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 5px 10px;
	border: none;
	border-radius: 14px;
	background: transparent;
	color: var(--DoliFlow-text-secondary);
	font-size: 11px;
	line-height: 1;
	cursor: pointer;
	transition: color .15s ease, background .15s ease;
}

.DoliFlow-quick-action-secondary:hover {
	color: var(--DoliFlow-text);
	background: var(--DoliFlow-accent-soft, rgba(74, 144, 217, 0.10));
}

.DoliFlow-quick-action-secondary-icon {
	font-size: 14px;
	line-height: 1;
	opacity: .85;
}

.DoliFlow-msg-streaming .DoliFlow-msg-bubble {
	background: var(--DoliFlow-agent-bubble);
	color: var(--DoliFlow-text);
	min-height: 20px;
}

/* Stream devam ederken kopyala/meta satırı GİZLİ — aksi halde düşünme bloğu
   ile bubble arasında boşluk varmış gibi görünür. Kopyala tuşu yalnızca
   yanıt TAMAMLANINCA (en son) görünür. */
.DoliFlow-msg-streaming .DoliFlow-msg-meta {
	display: none;
}

/* Stream balonu henüz boşken (ilk içerik gelmeden) görünmesin — boş şerit
   yerine yalnızca thinking göstergesi kalsın (JS ayrıca balonu gizler). */
.DoliFlow-msg-streaming:not(.DoliFlow-msg-streaming-done) .DoliFlow-msg-text:empty {
	display: none;
}

.DoliFlow-msg-error .DoliFlow-msg-bubble {
	background: #f8d7da;
	color: #721c24;
	border: 1px solid #f5c6cb;
	border-radius: 18px;
	padding: 14px 20px;
	margin-left: 10px;
	margin-right: 10px;
}

.DoliFlow-typing {
	/* Balonsuz tasarım (agentic): yalnızca 3 zıplayan nokta, zemin yok. */
	padding: 2px 0;
	background: transparent;
	border-radius: 0;
	display: flex;
	align-items: center;
	gap: 4px;
	align-self: flex-start;
}

.DoliFlow-typing-dot {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--DoliFlow-text-secondary);
	animation: DoliFlow-typing-bounce 1.4s infinite ease-in-out;
}

.DoliFlow-typing-dot:nth-child(1) { animation-delay: 0s; }
.DoliFlow-typing-dot:nth-child(2) { animation-delay: 0.2s; }
.DoliFlow-typing-dot:nth-child(3) { animation-delay: 0.4s; }

@keyframes DoliFlow-typing-bounce {
	0%, 60%, 100% { opacity: 0.3; transform: translateY(0); }
	30% { opacity: 1; transform: translateY(-4px); }
}

/* "En alta in" butonu (kullanıcı isteği): kullanıcı mesaj geçmişinde çok
   yukarı kaydığında sağ-alt köşede belirir, tıklayınca listeyi en alta
   indirir. Yalnızca alttan uzaklaşınca görünür (JS scroll listener). */
.DoliFlow-scroll-down-btn {
	position: absolute;
	right: 18px;
	bottom: 100px; /* input alanının hemen üstü */
	width: 36px;
	height: 36px;
	border-radius: 50%;
	border: 1px solid var(--DoliFlow-border, #dee2e6);
	background: var(--DoliFlow-bg, #ffffff);
	color: var(--DoliFlow-text, #212529);
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.16);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	z-index: 5;
	opacity: 0;
	transform: translateY(6px);
	pointer-events: none;
	transition: opacity 0.18s ease, transform 0.18s ease, background 0.15s ease;
}
.DoliFlow-scroll-down-visible {
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
}
.DoliFlow-scroll-down-btn:hover {
	background: var(--DoliFlow-surface, #f0f0f0);
}
.DoliFlow-theme-dark .DoliFlow-scroll-down-btn {
	background: var(--DoliFlow-agent-bubble, #26282d);
	border-color: var(--DoliFlow-border, #3a3a3a);
	color: var(--DoliFlow-text, #ececec);
}
.DoliFlow-theme-dark .DoliFlow-scroll-down-btn:hover {
	background: #34363c;
}

/* ============================================================
   INPUT AREA
   ============================================================ */

.DoliFlow-input-area {
	padding: 12px 16px 16px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	border-top: 1px solid var(--DoliFlow-border);
}

.DoliFlow-input-row {
	display: flex;
	align-items: flex-end;
	gap: 8px;
	background: var(--DoliFlow-input-bg);
	border-radius: 16px;
	padding: 8px;
	border: 1px solid var(--DoliFlow-border);
	transition: border-color 0.2s;
}

.DoliFlow-input-row:focus-within {
	border-color: var(--DoliFlow-text-secondary);
}

.DoliFlow-attach-btn {
	background: none;
	border: none;
	color: var(--DoliFlow-icon-color);
	cursor: pointer;
	padding: 8px;
	border-radius: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: color 0.2s;
	flex-shrink: 0;
}

.DoliFlow-attach-btn:hover {
	color: var(--DoliFlow-text);
}

.DoliFlow-input-row textarea {
	flex: 1;
	background: none;
	border: none;
	color: var(--DoliFlow-text);
	font-size: 13px;
	padding: 8px;
	resize: none;
	outline: none;
	font-family: inherit;
	line-height: 1.5;
	max-height: 120px;
	min-height: 20px;
	overflow-y: auto;
	overflow-x: hidden;
	box-sizing: border-box;
}

.DoliFlow-input-row textarea::placeholder {
	color: var(--DoliFlow-text-secondary);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	opacity: 1;
}

.DoliFlow-send-btn {
	background: var(--DoliFlow-user-bubble);
	color: var(--DoliFlow-user-text);
	border: none;
	border-radius: 10px;
	padding: 8px 12px;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: opacity 0.2s;
	flex-shrink: 0;
	opacity: 0.5;
}

.DoliFlow-send-btn.active {
	opacity: 1;
	cursor: pointer;
}

.DoliFlow-send-btn.active:hover {
	opacity: 0.85;
}

.DoliFlow-attachment-preview {
	display: none;
	flex-direction: column;
	gap: 4px;
	padding: 6px 10px;
	background: var(--DoliFlow-surface);
	border-radius: 8px;
}

.DoliFlow-attachment-preview.visible {
	display: flex;
}

.DoliFlow-attach-row {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 3px 4px;
	border-radius: 6px;
	background: var(--DoliFlow-input-bg);
	font-size: 12px;
	color: var(--DoliFlow-text);
	transition: background 0.15s;
}

.DoliFlow-attach-row:hover {
	background: var(--DoliFlow-border, #e0e0e0);
}

.DoliFlow-attach-row .DoliFlow-attach-name {
	flex: 1;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.DoliFlow-attach-row svg {
	flex-shrink: 0;
	color: var(--DoliFlow-icon-color);
}

.DoliFlow-attach-row .DoliFlow-attach-remove {
	background: none;
	border: none;
	color: var(--DoliFlow-text-secondary);
	cursor: pointer;
	padding: 2px;
	display: flex;
	align-items: center;
	border-radius: 4px;
	flex-shrink: 0;
}

.DoliFlow-attach-row .DoliFlow-attach-remove:hover {
	color: #ef4444;
	background: rgba(239,68,68,0.1);
}

.DoliFlow-upload-limit {
	display: none;
	padding: 4px 12px;
	font-size: 11px;
	color: var(--DoliFlow-text-secondary);
	text-align: center;
	border-bottom: 1px solid var(--DoliFlow-border);
	background: var(--DoliFlow-surface);
}

/* ---- VOICE BUTTON ---- */

.DoliFlow-voice-btn {
	background: transparent;
	color: var(--DoliFlow-icon-color);
	border: 1px solid transparent;
	border-radius: 10px;
	padding: 6px;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.2s;
	flex-shrink: 0;
	opacity: 1;
	width: 34px;
	height: 34px;
	position: relative;
}

.DoliFlow-voice-btn:hover {
	opacity: 1;
	color: var(--DoliFlow-text);
	background: var(--DoliFlow-surface);
	border-color: var(--DoliFlow-border);
}

.DoliFlow-voice-btn.recording {
	opacity: 1;
	color: #e53935;
	background: rgba(229, 57, 53, 0.12);
	animation: DoliFlow-pulse 1s ease-in-out infinite;
	border-color: transparent;
}

.DoliFlow-voice-btn.recording::after {
	content: '';
	position: absolute;
	top: -1px;
	right: -1px;
	width: 8px;
	height: 8px;
	background: #e53935;
	border-radius: 50%;
	box-shadow: 0 0 4px rgba(229, 57, 53, 0.6);
}

@keyframes DoliFlow-pulse {
	0%, 100% { transform: scale(1); }
	50% { transform: scale(1.05); }
}

.DoliFlow-theme-dark .DoliFlow-voice-btn {
	color: #999;
}
.DoliFlow-theme-dark .DoliFlow-voice-btn:hover {
	color: #fff;
	background: rgba(255,255,255,0.1);
}
.DoliFlow-theme-dark .DoliFlow-voice-btn.recording {
	background: rgba(229, 57, 53, 0.2);
}

/* ============================================================
   FILE UPLOAD PROGRESS BAR (input-area içinde)
   ============================================================ */

.DoliFlow-upload-progress {
	display: none;
	align-items: center;
	gap: 10px;
	padding: 8px 10px;
	background: var(--DoliFlow-surface);
	border: 1px solid var(--DoliFlow-border);
	border-radius: 10px;
	font-size: 12px;
	color: var(--DoliFlow-text);
	animation: DoliFlow-msg-in 0.25s ease;
}

.DoliFlow-upload-progress.visible {
	display: flex;
}

.DoliFlow-upload-progress-icon {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 6px;
	background: color-mix(in srgb, var(--DoliFlow-user-bubble, #0d6efd) 12%, transparent);
	color: var(--DoliFlow-user-bubble, #0d6efd);
}

.DoliFlow-upload-progress-info {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.DoliFlow-upload-progress-name {
	font-weight: 500;
	font-size: 12px;
	line-height: 1.3;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	color: var(--DoliFlow-text);
}

.DoliFlow-upload-progress-track {
	width: 100%;
	height: 4px;
	background: var(--DoliFlow-border);
	border-radius: 4px;
	overflow: hidden;
	position: relative;
}

.DoliFlow-upload-progress-bar {
	height: 100%;
	width: 0%;
	background: linear-gradient(90deg, var(--DoliFlow-user-bubble, #0d6efd), #00d2ff);
	border-radius: 4px;
	transition: width 0.2s ease;
	position: relative;
}

.DoliFlow-upload-progress-bar.indeterminate {
	width: 30%;
	animation: DoliFlow-upload-indeterminate 1.4s ease-in-out infinite;
}

@keyframes DoliFlow-upload-indeterminate {
	0% { transform: translateX(-100%); }
	100% { transform: translateX(400%); }
}

.DoliFlow-upload-progress-pct {
	font-size: 11px;
	color: var(--DoliFlow-text-secondary);
	flex-shrink: 0;
	min-width: 32px;
	text-align: right;
	font-variant-numeric: tabular-nums;
}

.DoliFlow-upload-progress-cancel {
	background: none;
	border: none;
	color: var(--DoliFlow-text-secondary);
	cursor: pointer;
	padding: 4px;
	border-radius: 4px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	transition: color 0.15s, background 0.15s;
}

.DoliFlow-upload-progress-cancel:hover {
	color: #ef4444;
	background: rgba(239, 68, 68, 0.1);
}

/* Koyu tema */
.DoliFlow-theme-dark .DoliFlow-upload-progress {
	background: rgba(255,255,255,0.06);
	border-color: rgba(255,255,255,0.1);
}

.DoliFlow-theme-dark .DoliFlow-upload-progress-icon {
	background: rgba(255,255,255,0.08);
}

.DoliFlow-theme-dark .DoliFlow-attach-row:hover {
	background: rgba(255,255,255,0.08);
}

.DoliFlow-theme-dark .DoliFlow-upload-limit {
	border-bottom-color: rgba(255,255,255,0.08);
}

/* ---- FILE ATTACHMENT CARDS (messages içinde) ---- */

.DoliFlow-attach-card {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 12px;
	margin: 6px 0 2px 0;
	background: var(--DoliFlow-surface);
	border: 1px solid var(--DoliFlow-border);
	border-radius: 10px;
	text-decoration: none;
	color: var(--DoliFlow-text);
	transition: background 0.15s, border-color 0.15s;
	cursor: pointer;
	min-width: 0;
}

.DoliFlow-attach-card:hover {
	background: var(--DoliFlow-hover);
	border-color: var(--DoliFlow-text-secondary);
}

.DoliFlow-attach-card-icon {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
}

.DoliFlow-attach-card-info {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.DoliFlow-attach-card-name {
	font-size: 13px;
	font-weight: 500;
	line-height: 1.4;
	word-break: break-word;
	color: var(--DoliFlow-text);
}

.DoliFlow-attach-card-meta {
	font-size: 11px;
	color: var(--DoliFlow-text-secondary);
	line-height: 1.2;
}

/* Koyu tema */
.DoliFlow-theme-dark .DoliFlow-attach-card {
	background: rgba(255,255,255,0.06);
	border-color: rgba(255,255,255,0.1);
}

.DoliFlow-theme-dark .DoliFlow-attach-card:hover {
	background: rgba(255,255,255,0.1);
	border-color: rgba(255,255,255,0.2);
}

/* ============================================================
   MINIMIZED / CLOSED STATES
   ============================================================ */

.DoliFlow-minimized-bar {
	display: none !important;
	height: 48px;
	width: 100%;
	background: var(--DoliFlow-sidebar-bg);
	align-items: center;
	padding: 0 16px;
	gap: 10px;
	border-bottom: 1px solid var(--DoliFlow-border);
	cursor: pointer;
}

.DoliFlow-minimized-bar-icon {
	color: var(--DoliFlow-text);
	display: flex;
	align-items: center;
}

.DoliFlow-minimized-bar-text {
	flex: 1;
	font-size: 14px;
	font-weight: 500;
	color: var(--DoliFlow-text);
}

.DoliFlow-minimized-bar-chevron {
	color: var(--DoliFlow-text-secondary);
	display: flex;
	align-items: center;
}

/* ============================================================
   FLOATING BUBBLE (minimized state)
   ============================================================ */

.DoliFlow-bubble {
	position: fixed;
	right: 24px;
	bottom: 24px;
	width: 64px;
	height: 64px;
	border-radius: 50%;
	display: none;
	align-items: center;
	justify-content: center;
	z-index: 999999;
	cursor: grab;
	box-shadow: 0 4px 20px rgba(0,0,0,0.3);
	transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.3s ease;
	background-color: #ffffff !important;
	overflow: visible;
	touch-action: none;
}

.DoliFlow-bubble:active {
	cursor: grabbing;
}

.DoliFlow-bubble-visible {
	display: flex !important;
}

/* Rotating ring effect */
.DoliFlow-bubble-ring {
	position: absolute;
	top: -2px;
	left: -2px;
	right: -2px;
	bottom: -2px;
	border-radius: 50%;
	background: conic-gradient(
		from 0deg,
		#ff0000,
		#ff7300,
		#fffb00,
		#48ff00,
		#00ffd5,
		#002bff,
		#7a00ff,
		#ff00c8,
		#ff0000
	);
	animation: DoliFlow-rotate-ring 3s linear infinite;
	-webkit-mask: radial-gradient(circle, transparent 66%, black 67%);
	mask: radial-gradient(circle, transparent 66%, black 67%);
	z-index: -1;
}

@keyframes DoliFlow-rotate-ring {
	from { transform: rotate(0deg); }
	to { transform: rotate(360deg); }
}

.DoliFlow-bubble-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	color: #444;
	z-index: 1;
}

.DoliFlow-bubble:hover {
	transform: scale(1.05);
	box-shadow: 0 6px 25px rgba(0,0,0,0.4);
}

.DoliFlow-theme-dark #DoliFlow-bubble {
	background: #111 !important;
}
.DoliFlow-theme-dark #DoliFlow-bubble .DoliFlow-bubble-icon {
	color: #fff;
}

/* ============================================================
   LOGIN FORM (minimized -> click -> show login)
   ============================================================ */

.DoliFlow-login-form {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: 24px;
}

.DoliFlow-login-form input[type="text"],
.DoliFlow-login-form input[type="password"],
.DoliFlow-login-form input[type="email"] {
	padding: 10px 14px;
	border: 1px solid var(--DoliFlow-border);
	border-radius: 8px;
	font-size: 14px;
	font-family: inherit;
	background: var(--DoliFlow-bg);
	color: var(--DoliFlow-text);
	outline: none;
	transition: border-color 0.2s;
}

.DoliFlow-login-form input:focus {
	border-color: var(--DoliFlow-user-bubble);
}

.DoliFlow-login-form button {
	padding: 10px 14px;
	border: none;
	border-radius: 8px;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	background: var(--DoliFlow-user-bubble);
	color: var(--DoliFlow-user-text);
	transition: opacity 0.2s;
}

.DoliFlow-login-form button:hover {
	opacity: 0.9;
}

.DoliFlow-login-form .DoliFlow-login-error {
	color: var(--DoliFlow-error-text);
	font-size: 13px;
	background: var(--DoliFlow-error-bg);
	padding: 8px 12px;
	border-radius: 8px;
	border: 1px solid var(--DoliFlow-error-border);
	display: none;
}

.DoliFlow-login-form .DoliFlow-login-error.visible {
	display: block;
}

/* ============================================================
   ALERT MESSAGE
   ============================================================ */

.DoliFlow-alert {
	display: none;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background: var(--DoliFlow-card-bg);
	border: 1px solid var(--DoliFlow-border);
	border-radius: 12px;
	padding: 20px 24px;
	box-shadow: 0 8px 32px rgba(0,0,0,0.15);
	z-index: 100;
	max-width: 80%;
	text-align: center;
}

.DoliFlow-alert.visible {
	display: block;
}

.DoliFlow-alert h4 {
	margin: 0 0 8px 0;
	color: var(--DoliFlow-text);
}

.DoliFlow-alert p {
	margin: 0 0 16px 0;
	color: var(--DoliFlow-text-secondary);
	font-size: 13px;
}

.DoliFlow-alert button {
	padding: 8px 20px;
	border: none;
	border-radius: 8px;
	cursor: pointer;
	font-size: 13px;
	font-weight: 600;
	background: var(--DoliFlow-user-bubble);
	color: var(--DoliFlow-user-text);
	transition: opacity 0.2s;
}

.DoliFlow-alert button:hover {
	opacity: 0.9;
}

/* ============================================================
   RESPONSIVE
   ============================================================ */

@media (max-width: 768px) {
	#DoliFlow-chat {
		position: fixed;
		top: 0 !important;
		left: 0 !important;
		width: 100vw !important;
		height: 100vh !important;
		max-width: 100vw !important;
		max-height: 100vh !important;
		border-radius: 0;
		box-shadow: none;
		bottom: auto !important;
		right: auto !important;
	}
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
	:root {
		--DoliFlow-chat-edge-gap: 20px;
	}
}

@media screen and (max-width: 768px) {
	:root {
		--DoliFlow-chat-edge-gap: 0px;
	}
}

/* ============================================================
   CONVERSATION LIST
   ============================================================ */

.DoliFlow-conversation-list {
	overflow-y: auto;
}

.DoliFlow-conversation-item {
	padding: 12px 16px;
	border-bottom: 1px solid var(--DoliFlow-border);
	cursor: pointer;
	transition: background 0.2s;
}

.DoliFlow-conversation-item:hover {
	background: var(--DoliFlow-hover);
}

.DoliFlow-conversation-item .DoliFlow-conversation-title {
	font-size: 14px;
	font-weight: 500;
	color: var(--DoliFlow-text);
	margin-bottom: 4px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.DoliFlow-conversation-item .DoliFlow-conversation-preview {
	font-size: 12px;
	color: var(--DoliFlow-text-secondary);
	margin-bottom: 4px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.DoliFlow-conversation-item .DoliFlow-conversation-time {
	font-size: 11px;
	color: var(--DoliFlow-text-secondary);
}

/* ============================================================
   SCROLLABLE CONVERSATION
   ============================================================ */

.DoliFlow-scroll-conversation {
	overflow-y: auto;
}

.DoliFlow-scroll-conversation .DoliFlow-scroll-item {
	padding: 16px;
	border-bottom: 1px solid var(--DoliFlow-border);
}

.DoliFlow-scroll-item p {
	margin: 0 0 8px 0;
}

.DoliFlow-scroll-item .DoliFlow-scroll-meta {
	font-size: 12px;
	color: var(--DoliFlow-text-secondary);
}

/* ============================================================
   AVATAR
   ============================================================ */

.DoliFlow-avatar {
	width: 32px;
	height: 32px;
	min-width: 32px;
	border-radius: 50%;
	background: var(--DoliFlow-surface);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	font-weight: 600;
	color: var(--DoliFlow-text);
	overflow: hidden;
}

.DoliFlow-avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* ============================================================
   CHAT IS LOADING (initial loading overlay)
   ============================================================ */

.DoliFlow-chat-loading {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	gap: 12px;
	background: var(--DoliFlow-bg);
	z-index: 10;
}

.DoliFlow-chat-loading .DoliFlow-chat-loading-icon {
	width: 24px;
	height: 24px;
	border: 2px solid var(--DoliFlow-border);
	border-top-color: var(--DoliFlow-user-bubble);
	border-radius: 50%;
	animation: DoliFlow-spin 0.8s linear infinite;
}

@keyframes DoliFlow-spin {
	to { transform: rotate(360deg); }
}

.DoliFlow-chat-loading .DoliFlow-chat-loading-text {
	font-size: 13px;
	color: var(--DoliFlow-text-secondary);
}

/* ============================================================
   KEYBOARD SHORTCUT MODAL
   ============================================================ */

.DoliFlow-kbd {
	display: inline-block;
	padding: 2px 6px;
	font-size: 11px;
	font-family: inherit;
	font-weight: 600;
	background: var(--DoliFlow-surface);
	border: 1px solid var(--DoliFlow-border);
	border-radius: 4px;
	color: var(--DoliFlow-text);
	box-shadow: 0 1px 2px rgba(0,0,0,0.06);
	margin: 0 2px;
}

.DoliFlow-theme-dark .DoliFlow-kbd {
	background: rgba(255,255,255,0.1);
	border-color: rgba(255,255,255,0.15);
}

/* ============================================================
   UPLOAD CONTAINER (drag & drop overlay)
   ============================================================ */

.DoliFlow-upload-container {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	display: none;
	align-items: center;
	justify-content: center;
	background: rgba(0,0,0,0.1);
	z-index: 50;
	border-radius: inherit;
}

.DoliFlow-upload-container.drop-active {
	display: flex;
	backdrop-filter: blur(2px);
}

.DoliFlow-upload-container .DoliFlow-upload-hint {
	background: var(--DoliFlow-bg);
	border: 2px dashed var(--DoliFlow-user-bubble);
	border-radius: 16px;
	padding: 32px 48px;
	text-align: center;
	box-shadow: 0 4px 16px rgba(0,0,0,0.1);
}

.DoliFlow-upload-container .DoliFlow-upload-hint p {
	margin: 8px 0 0;
	font-size: 14px;
	color: var(--DoliFlow-text-secondary);
}

.DoliFlow-upload-container .DoliFlow-upload-hint strong {
	color: var(--DoliFlow-text);
}

.DoliFlow-upload-container .DoliFlow-upload-hint-icon {
	color: var(--DoliFlow-user-bubble);
}

.DoliFlow-theme-dark .DoliFlow-upload-container {
	background: rgba(0,0,0,0.4);
}

/* ============================================================
   SIDEBAR MENU (display mode / settings within sidebar)
   ============================================================ */

.DoliFlow-sidebar-menu {
	padding: 8px 16px;
	border-bottom: 1px solid var(--DoliFlow-border);
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.DoliFlow-sidebar-menu-item {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 8px 10px;
	border-radius: 8px;
	cursor: pointer;
	font-size: 13px;
	color: var(--DoliFlow-text);
	transition: background 0.15s;
	background: none;
	border: none;
	width: 100%;
	text-align: left;
	font-family: inherit;
}

.DoliFlow-sidebar-menu-item:hover {
	background: var(--DoliFlow-hover);
}

.DoliFlow-sidebar-menu-item svg {
	flex-shrink: 0;
	color: var(--DoliFlow-icon-color);
}

.DoliFlow-sidebar-menu-item.is-active {
	background: var(--DoliFlow-hover);
	font-weight: 600;
}

/* ============================================================
   RESEARCH IMAGES (agent görselleri + lightbox)
   ============================================================ */

.DoliFlow-msg img {
	max-width: 100%;
	height: auto;
	border-radius: 8px;
	margin: 6px 0;
	cursor: zoom-in;
	display: block;
}

.DoliFlow-lightbox {
	position: fixed;
	inset: 0;
	z-index: 2147483000;
	background: rgba(0,0,0,.85);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
}

.DoliFlow-lightbox img {
	max-width: 92vw;
	max-height: 92vh;
	border-radius: 8px;
	box-shadow: 0 8px 40px rgba(0,0,0,.5);
}

.DoliFlow-lightbox-close {
	position: absolute;
	top: 16px;
	right: 20px;
	color: #fff;
	font-size: 28px;
	cursor: pointer;
	background: none;
	border: none;
}

.DoliFlow-theme-dark .DoliFlow-lightbox {
	background: rgba(0,0,0,.9);
}

/* ============================================================
   DUYURU / BİLDİRİM MERKEZİ (header 🔔 + dropdown + chat banner)
   ============================================================ */

/* Header 🔔 butonu içindeki okunmamış rozeti */
.DoliFlow-notif-badge {
	position: absolute;
	top: 2px;
	right: 2px;
	background: var(--DoliFlow-danger, #dc2626);
	color: #fff;
	font-size: 10px;
	font-weight: 700;
	line-height: 1;
	min-width: 15px;
	height: 15px;
	padding: 0 4px;
	border-radius: 999px;
	display: flex;
	align-items: center;
	justify-content: center;
	pointer-events: none;
}
.DoliFlow-btn-notifications {
	position: relative;
}

/* Bildirim merkezi dropdown (header altında, display-mode popup gibi) */
.DoliFlow-notification-center {
	position: absolute;
	top: 100%;
	right: -6px;
	margin-top: 4px;
	width: 340px;
	max-height: 420px;
	background: var(--DoliFlow-bg, #fff);
	border: 1px solid var(--DoliFlow-border, #dee2e6);
	border-radius: 10px;
	box-shadow: 0 8px 24px rgba(0,0,0,0.15);
	display: none;
	flex-direction: column;
	z-index: 2147483002;
	overflow: hidden;
}
.DoliFlow-notification-center.DoliFlow-popup-open {
	display: flex;
}
.DoliFlow-notification-center-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	padding: 10px 12px;
	border-bottom: 1px solid var(--DoliFlow-border, #dee2e6);
	background: var(--DoliFlow-surface, #f0f0f0);
}
.DoliFlow-notification-center-title {
	font-size: 13px;
	font-weight: 700;
	color: var(--DoliFlow-text, #212529);
}
.DoliFlow-notif-markall {
	background: none;
	border: none;
	color: var(--DoliFlow-user-bubble, #0d6efd);
	font-size: 12px;
	font-weight: 600;
	cursor: pointer;
	padding: 2px 4px;
	border-radius: 4px;
}
.DoliFlow-notif-markall:hover {
	text-decoration: underline;
}
.DoliFlow-notification-list {
	overflow-y: auto;
	flex: 1;
	max-height: 360px;
	padding: 4px;
}
.DoliFlow-notif-empty {
	padding: 24px 16px;
	text-align: center;
	color: var(--DoliFlow-text-secondary, #6c757d);
	font-size: 13px;
}
.DoliFlow-notification-item {
	padding: 10px 12px;
	border-radius: 8px;
	border: 1px solid transparent;
	cursor: pointer;
	transition: background 0.15s;
	margin-bottom: 4px;
}
.DoliFlow-notification-item:hover {
	background: var(--DoliFlow-hover, #e9ecef);
}
.DoliFlow-notif-unread {
	background: rgba(13, 110, 253, .06);
	border-color: rgba(13, 110, 253, .18);
}
.DoliFlow-notif-highlight {
	outline: 2px solid var(--DoliFlow-user-bubble, #0d6efd);
	outline-offset: -2px;
}
.DoliFlow-notif-item-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	margin-bottom: 4px;
}
.DoliFlow-notif-item-time {
	font-size: 11px;
	color: var(--DoliFlow-muted-text, #888);
	white-space: nowrap;
}
.DoliFlow-notif-item-title {
	font-size: 13px;
	font-weight: 700;
	color: var(--DoliFlow-text, #212529);
	margin-bottom: 4px;
}
.DoliFlow-notif-item-body {
	font-size: 12px;
	color: var(--DoliFlow-text-secondary, #6c757d);
	line-height: 1.45;
	overflow-wrap: anywhere;
}
.DoliFlow-notif-item-body p {
	margin: 0 0 6px;
}
.DoliFlow-notif-item-body p:last-child {
	margin-bottom: 0;
}
.DoliFlow-notif-item-actions {
	display: flex;
	gap: 8px;
	margin-top: 8px;
}
.DoliFlow-notif-read-btn {
	background: var(--DoliFlow-hover, #e9ecef);
	border: 1px solid var(--DoliFlow-border, #dee2e6);
	color: var(--DoliFlow-text, #212529);
	font-size: 11px;
	font-weight: 600;
	padding: 3px 10px;
	border-radius: 6px;
	cursor: pointer;
}
.DoliFlow-notif-read-btn:hover {
	background: var(--DoliFlow-toggle-bg, #e9ecef);
}

/* Duyuru türü etiketi */
.DoliFlow-ann-type {
	display: inline-flex;
	align-items: center;
	font-size: 10px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .04em;
	padding: 2px 8px;
	border-radius: 999px;
	background: var(--DoliFlow-hover, #e9ecef);
	color: var(--DoliFlow-text-secondary, #6c757d);
}
.DoliFlow-ann-important {
	background: rgba(219, 171, 9, .16);
	color: #b45309;
}
.DoliFlow-ann-critical {
	background: rgba(220, 38, 38, .14);
	color: #dc2626;
}

/* Chat ekranındaki duyuru banner'ı (chat history'ye karışmaz) */
.DoliFlow-announcement-banner {
	padding: 8px 12px 0;
}
.DoliFlow-announcement-card {
	border: 1px solid var(--DoliFlow-border, #dee2e6);
	border-left: 4px solid var(--DoliFlow-user-bubble, #0d6efd);
	background: var(--DoliFlow-card-bg, #fff);
	border-radius: 10px;
	padding: 12px 14px;
	margin-bottom: 8px;
	box-shadow: 0 2px 8px rgba(0,0,0,.06);
}
.DoliFlow-announcement-card.DoliFlow-ann-card-important {
	border-left-color: #b45309;
}
.DoliFlow-announcement-card.DoliFlow-ann-card-critical {
	border-left-color: #dc2626;
}
.DoliFlow-ann-card-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	margin-bottom: 6px;
}
.DoliFlow-ann-dismiss {
	background: none;
	border: none;
	color: var(--DoliFlow-muted-text, #888);
	font-size: 16px;
	line-height: 1;
	cursor: pointer;
	padding: 2px 4px;
	border-radius: 4px;
}
.DoliFlow-ann-dismiss:hover {
	color: var(--DoliFlow-text, #212529);
	background: var(--DoliFlow-hover, #e9ecef);
}
.DoliFlow-ann-card-title {
	font-size: 13px;
	font-weight: 700;
	color: var(--DoliFlow-text, #212529);
	margin-bottom: 4px;
}
.DoliFlow-ann-card-body {
	font-size: 12px;
	color: var(--DoliFlow-text-secondary, #6c757d);
	line-height: 1.5;
	overflow-wrap: anywhere;
}
.DoliFlow-ann-card-body p {
	margin: 0 0 6px;
}
.DoliFlow-ann-card-body p:last-child {
	margin-bottom: 0;
}
.DoliFlow-ann-card-actions {
	margin-top: 10px;
	display: flex;
	justify-content: flex-end;
}
.DoliFlow-ann-details {
	background: var(--DoliFlow-user-bubble, #0d6efd);
	color: var(--DoliFlow-user-text, #fff);
	border: none;
	font-size: 12px;
	font-weight: 600;
	padding: 5px 14px;
	border-radius: 6px;
	cursor: pointer;
}
.DoliFlow-ann-details:hover {
	opacity: .9;
}

/* ============================================================
   NOTIFICATION CENTER / ANNOUNCEMENT CARDS — dark mode text uyumu
   ============================================================ */

/* Sunucudan gelen duyuru HTML'i inline renk/arkaplan içerebilir (sanitizeHtml
   style attribute'üne izin verir). Dark modda bu değerler açık zeminde koyu
   metin üretebilir; tema değişkenleriyle eziyoruz (kullanıcı isteği). */
.DoliFlow-theme-dark .DoliFlow-notification-center {
	color-scheme: dark;
}

.DoliFlow-theme-dark .DoliFlow-notif-item-title,
.DoliFlow-theme-dark .DoliFlow-notif-item-body,
.DoliFlow-theme-dark .DoliFlow-notif-item-body p,
.DoliFlow-theme-dark .DoliFlow-notif-item-body div,
.DoliFlow-theme-dark .DoliFlow-notif-item-body span,
.DoliFlow-theme-dark .DoliFlow-notif-item-body li,
.DoliFlow-theme-dark .DoliFlow-notif-item-body td,
.DoliFlow-theme-dark .DoliFlow-notif-item-body th,
.DoliFlow-theme-dark .DoliFlow-notif-item-body h1,
.DoliFlow-theme-dark .DoliFlow-notif-item-body h2,
.DoliFlow-theme-dark .DoliFlow-notif-item-body h3,
.DoliFlow-theme-dark .DoliFlow-notif-item-body h4,
.DoliFlow-theme-dark .DoliFlow-notif-item-body h5,
.DoliFlow-theme-dark .DoliFlow-notif-item-body h6,
.DoliFlow-theme-dark .DoliFlow-ann-card-title,
.DoliFlow-theme-dark .DoliFlow-ann-card-body,
.DoliFlow-theme-dark .DoliFlow-ann-card-body p,
.DoliFlow-theme-dark .DoliFlow-ann-card-body div,
.DoliFlow-theme-dark .DoliFlow-ann-card-body span,
.DoliFlow-theme-dark .DoliFlow-ann-card-body li,
.DoliFlow-theme-dark .DoliFlow-ann-card-body td,
.DoliFlow-theme-dark .DoliFlow-ann-card-body th {
	color: var(--DoliFlow-text, #ececec) !important;
	background-color: transparent !important;
}

/* Bağlantılar accent renkle görünsün (genel metin rengiyle ezilmemeli) */
.DoliFlow-theme-dark .DoliFlow-notif-item-body a,
.DoliFlow-theme-dark .DoliFlow-ann-card-body a {
	color: var(--DoliFlow-user-bubble, #7bb8ff) !important;
}

/* Duyuru gövdesindeki koyu tablolar için şeffaf zemin */
.DoliFlow-theme-dark .DoliFlow-notif-item-body table,
.DoliFlow-theme-dark .DoliFlow-ann-card-body table {
	background: transparent !important;
	border-color: var(--DoliFlow-border, #3a3a3a) !important;
}

/* ============================================================
   MOBILE PAIR PANEL (QR ile Giriş — chat içinde)
   ============================================================ */

.DoliFlow-mobilepair-panel {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1200;
	background: var(--DoliFlow-bg, #fff);
	display: none;
	flex-direction: column;
	overflow: hidden;
}

.DoliFlow-mp-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	padding: 10px 14px;
	border-bottom: 1px solid var(--DoliFlow-border, #dee2e6);
	flex-shrink: 0;
}

.DoliFlow-mp-title {
	font-size: 14px;
	font-weight: 600;
	color: var(--DoliFlow-text, #212529);
}

.DoliFlow-mp-msg {
	display: none;
	padding: 10px 14px;
	border-radius: 8px;
	font-size: 13px;
	margin: 10px 14px 0;
}

.DoliFlow-mp-msg.ok {
	display: block;
	background: #dcfce7;
	color: #166534;
	border: 1px solid #86efac;
}

.DoliFlow-mp-msg.err {
	display: block;
	background: #fee2e2;
	color: #991b1b;
	border: 1px solid #fca5a5;
}

.DoliFlow-mp-body {
	flex: 1;
	overflow-y: auto;
	padding: 16px;
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.DoliFlow-mp-card {
	text-align: center;
}

.DoliFlow-mp-desc {
	font-size: 13px;
	color: var(--DoliFlow-text-secondary, #6b7280);
	line-height: 1.6;
	margin: 0 0 10px;
}

.DoliFlow-mp-qr-wrap {
	display: inline-block;
	background: #fff;
	border: 1px solid var(--DoliFlow-border, #e5e7eb);
	border-radius: 10px;
	padding: 12px;
	margin: 0 0 10px;
}

.DoliFlow-mp-qrbox {
	width: 260px;
	height: 260px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--DoliFlow-text-secondary, #9ca3af);
	font-size: 13px;
}

.DoliFlow-mp-qrbox img {
	display: block;
	width: 260px;
	height: 260px;
	image-rendering: pixelated;
}

.DoliFlow-mp-timer {
	font-size: 13px;
	font-weight: 600;
	color: #dc2626;
	margin-bottom: 10px;
}

.DoliFlow-mp-codebox {
	margin: 0 0 10px;
	display: flex;
	gap: 8px;
}

.DoliFlow-mp-code {
	flex: 1;
	min-width: 0;
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 11px;
	color: var(--DoliFlow-text-primary, #111827);
	background: var(--DoliFlow-bg-input, #f3f4f6);
	border: 1px solid var(--DoliFlow-border, #e5e7eb);
	border-radius: 8px;
	padding: 9px 10px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.DoliFlow-mp-copycode {
	flex-shrink: 0;
	padding: 9px 14px;
	border: none;
	border-radius: 8px;
	background: #2563eb;
	color: #fff;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	white-space: nowrap;
}

.DoliFlow-mp-copycode:hover {
	background: #1d4ed8;
}

.DoliFlow-mp-refresh {
	display: inline-block;
	padding: 10px 22px;
	border-radius: 8px;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	border: none;
	text-decoration: none;
	background: #2563eb;
	color: #fff;
	transition: background .15s;
}

.DoliFlow-mp-refresh:hover {
	background: #1d4ed8;
}

.DoliFlow-mp-refresh:disabled {
	opacity: .6;
	cursor: not-allowed;
}

.DoliFlow-mp-warn {
	background: #fef3c7;
	border: 1px solid #f59e0b;
	color: #92400e;
	border-radius: 8px;
	padding: 10px 14px;
	font-size: 12px;
	text-align: left;
	margin-top: 12px;
}

.DoliFlow-mp-devices-title {
	font-size: 14px;
	color: var(--DoliFlow-text, #374151);
	margin: 0 0 12px;
	border-bottom: 1px solid var(--DoliFlow-border, #e5e7eb);
	padding-bottom: 8px;
}

.DoliFlow-mp-dev {
	border: 1px solid var(--DoliFlow-border, #e5e7eb);
	border-radius: 10px;
	padding: 12px 14px;
	margin-bottom: 10px;
	display: flex;
	align-items: center;
	gap: 12px;
}

.DoliFlow-mp-dev-icon {
	font-size: 22px;
	flex-shrink: 0;
}

.DoliFlow-mp-avatar-wrap {
	position: relative;
	display: inline-flex;
	width: 24px;
	height: 24px;
}

.DoliFlow-mp-dev-avatar {
	position: absolute;
	inset: 0;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	object-fit: cover;
}

.DoliFlow-mp-dev-avatar-init {
	display: inline-flex;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: #dbeafe;
	color: #1d4ed8;
	font-size: 12px;
	align-items: center;
	justify-content: center;
}

.DoliFlow-mp-dev-owner {
	color: var(--DoliFlow-text-secondary, #6b7280);
	font-size: 12px;
	margin-top: 2px;
}

.DoliFlow-mp-dev-info {
	flex: 1;
	min-width: 0;
}

.DoliFlow-mp-dev-name {
	font-weight: 600;
	color: var(--DoliFlow-text, #111827);
	font-size: 14px;
}

.DoliFlow-mp-dev-meta {
	color: var(--DoliFlow-text-secondary, #6b7280);
	font-size: 12px;
	margin-top: 2px;
}

.DoliFlow-mp-dev-actions {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-shrink: 0;
}

.DoliFlow-mp-status {
	font-weight: 600;
	font-size: 12px;
}

.DoliFlow-mp-status-on {
	color: #16a34a;
}

.DoliFlow-mp-status-off {
	color: #9ca3af;
}

.DoliFlow-mp-revoke {
	background: #dc2626;
	color: #fff;
	border: none;
	border-radius: 6px;
	padding: 6px 14px;
	font-size: 12px;
	font-weight: 600;
	cursor: pointer;
	transition: background .15s;
}

.DoliFlow-mp-revoke:hover {
	background: #b91c1c;
}

.DoliFlow-mp-empty {
	color: var(--DoliFlow-text-secondary, #9ca3af);
	font-size: 13px;
	text-align: center;
	padding: 16px 0;
}

/* Dark tema: QR her zaman beyaz zemin üzerinde kalır */
.DoliFlow-theme-dark .DoliFlow-mp-qr-wrap {
	background: #fff;
}

.DoliFlow-theme-dark .DoliFlow-mp-warn {
	background: #332701;
	border-color: #664d03;
	color: #ffd970;
}

.DoliFlow-theme-dark .DoliFlow-mp-msg.ok {
	background: rgba(40, 167, 69, .2);
	color: #4ade80;
	border-color: rgba(40, 167, 69, .5);
}

.DoliFlow-theme-dark .DoliFlow-mp-msg.err {
	background: rgba(220, 38, 38, .2);
	color: #f87171;
	border-color: rgba(220, 38, 38, .5);
}

@media (max-width: 480px) {
	.DoliFlow-mp-qrbox,
	.DoliFlow-mp-qrbox img {
		width: 210px;
		height: 210px;
	}
}

/* ============================================================
   DUYURULAR — SIDEBAR GİRİŞİ + CHAT İÇİ PANEL + DETAY PENCERESİ
   (eski header 🔔 bildirim merkezi kaldırıldı; duyurular artık
   sidebar "Duyurular" girişi + harici popup üzerinden sunulur)
   ============================================================ */

/* Sidebar footer "Duyurular" girişi — Ayarlar dişlisinin SOLUNDA */
.DoliFlow-btn-announcements {
	position: relative;
}
.DoliFlow-sidebar-footer .DoliFlow-btn-announcements {
	margin-left: auto;
	flex-shrink: 0;
}
.DoliFlow-sidebar-footer .DoliFlow-btn-settings {
	margin-left: 0;
}

/* Duyuru popup'ı (görev/otomasyon popup alanında görünür — turuncu ikon) */
.DoliFlow-task-popup-announcement .DoliFlow-task-popup-icon {
	background: #e8590c;
}

/* Chat içi Duyurular paneli (mobil eşleştirme paneliyle aynı absolute desen) */
.DoliFlow-announcements-panel {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1200;
	background: var(--DoliFlow-bg, #fff);
	display: none;
	flex-direction: column;
	overflow: hidden;
}
.DoliFlow-announcements-panel .DoliFlow-notification-list {
	flex: 1;
	max-height: none;
}
.DoliFlow-ann-panel-head-actions {
	display: flex;
	align-items: center;
	gap: 6px;
}

/* Duyuru detay penceresi — görev detay paneliyle aynı yerleşim deseni */
.DoliFlow-ann-detail-overlay {
	display: none;
	flex: 1 1 0;
	min-height: 0;
	flex-direction: column;
	background: var(--DoliFlow-bg, #ffffff);
	color: var(--DoliFlow-text, #212529);
}
.DoliFlow-ann-detail-overlay.DoliFlow-ann-detail-open { display: flex; }
.DoliFlow-ann-detail-card {
	flex: 1;
	min-height: 0;
	display: flex;
	flex-direction: column;
	background: var(--DoliFlow-bg, #ffffff);
	color: var(--DoliFlow-text, #212529);
}
.DoliFlow-ann-detail-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 10px 14px;
	border-bottom: 1px solid var(--DoliFlow-border, #dee2e6);
	background: var(--DoliFlow-surface, #f7f7f8);
	flex-shrink: 0;
}
.DoliFlow-ann-detail-kicker {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.4px;
	text-transform: uppercase;
	color: var(--DoliFlow-text-secondary, #6c757d);
}
.DoliFlow-ann-detail-close {
	background: transparent;
	border: 1px solid transparent;
	font-size: 20px;
	line-height: 1;
	color: var(--DoliFlow-muted-text, #888);
	cursor: pointer;
	padding: 3px 9px;
	border-radius: 6px;
	margin-left: auto;
	flex-shrink: 0;
}
.DoliFlow-ann-detail-close:hover {
	color: var(--DoliFlow-text, #212529);
	background: rgba(128, 128, 128, 0.15);
	border-color: var(--DoliFlow-border, #dee2e6);
}
.DoliFlow-ann-detail-body {
	flex: 1;
	min-height: 0;
	overflow-y: auto;
	padding: 12px 14px;
}
.DoliFlow-ann-detail-top { margin-bottom: 10px; }
.DoliFlow-ann-detail-title {
	font-size: 15px;
	font-weight: 700;
	line-height: 1.4;
	word-break: break-word;
}
.DoliFlow-ann-detail-meta {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 8px;
}
.DoliFlow-ann-detail-content {
	font-size: 13px;
	line-height: 1.6;
	color: var(--DoliFlow-text, #212529);
	overflow-wrap: anywhere;
}
.DoliFlow-ann-detail-content p { margin: 0 0 8px 0; }
.DoliFlow-ann-detail-content p:last-child { margin-bottom: 0; }
.DoliFlow-ann-detail-content ul,
.DoliFlow-ann-detail-content ol { margin: 4px 0; padding-left: 18px; }
.DoliFlow-ann-detail-content img { max-width: 100%; height: auto; border-radius: 4px; }
.DoliFlow-ann-detail-content a { color: var(--DoliFlow-accent, #3b82f6); }
.DoliFlow-ann-detail-content table { border-collapse: collapse; max-width: 100%; }
.DoliFlow-ann-detail-content th,
.DoliFlow-ann-detail-content td { border: 1px solid var(--DoliFlow-border, #dee2e6); padding: 4px 8px; font-size: 12.5px; }

/* Duyuru detay içeriği — dark mode uyumu (sanitizeHtml inline renk bırakabilir) */
.DoliFlow-theme-dark .DoliFlow-ann-detail-title,
.DoliFlow-theme-dark .DoliFlow-ann-detail-content,
.DoliFlow-theme-dark .DoliFlow-ann-detail-content p,
.DoliFlow-theme-dark .DoliFlow-ann-detail-content div,
.DoliFlow-theme-dark .DoliFlow-ann-detail-content span,
.DoliFlow-theme-dark .DoliFlow-ann-detail-content li,
.DoliFlow-theme-dark .DoliFlow-ann-detail-content td,
.DoliFlow-theme-dark .DoliFlow-ann-detail-content th,
.DoliFlow-theme-dark .DoliFlow-ann-detail-content h1,
.DoliFlow-theme-dark .DoliFlow-ann-detail-content h2,
.DoliFlow-theme-dark .DoliFlow-ann-detail-content h3,
.DoliFlow-theme-dark .DoliFlow-ann-detail-content h4,
.DoliFlow-theme-dark .DoliFlow-ann-detail-content h5,
.DoliFlow-theme-dark .DoliFlow-ann-detail-content h6 {
	color: #e5e7eb;
}

/* ============================================================
   END OF CSS
   ============================================================ */