/**
 * Lavren Chat Interface
 * Mevcut renk paleti ile uyumlu tasarım
 * Sol sidebar ile sohbet geçmişi
 */

/* ============================================
   CSS VARIABLES - Mevcut Palette
   ============================================ */
:root {
    /* Yeni Renk Paleti */
    --accent: #5b5f7a;
    --accent-2: #84A1B5;
    --accent-main-dark: #303349;
    --dark-accent: #13151C;
    --dark-accent-2: #0e1015;
    --dark-accent-3: #07080b;
    --light-accent: #1C1F28;
    --light-accent-2: #262932;
    --siyah: #0b0b0c;
    --notr1: #e4e7ec;
    --notr2: #b9c2cf;
    --notr3: #8a94a6;
    --notr4: #6b7280;
    
    /* Chat Renkleri - Yeni palet */
    --chat-primary: var(--accent);
    --chat-primary-dark: var(--dark-accent);
    --chat-primary-light: var(--accent);
    --chat-primary-subtle: rgba(91, 95, 122, 0.08);
    
    /* Accent */
    --chat-accent: var(--accent);
    --chat-accent-light: var(--accent);
    --chat-accent-subtle: rgba(91, 95, 122, 0.1);
    
    /* Navy */
    --chat-navy: #0f1419;
    --chat-navy-light: #1a2027;
    --chat-navy-medium: #242d36;
    
    /* Nötr - Yeni palet - Dark Theme */
    --chat-white: #ffffff;
    /* Koyu tema: ana sohbet alanı (açık tema light-chat.css’te ezilir) */
    --chat-main-surface: #0b0b0c;
    --chat-bg: var(--chat-main-surface);
    --chat-surface: var(--chat-main-surface);
    --chat-surface-alt: rgba(91, 95, 122, 0.3);
    --chat-border: rgba(185, 194, 207, 0.15);
    --chat-border-light: rgba(185, 194, 207, 0.1);
    
    /* Metin - Dark Theme (okunaklılık: normal metin yumuşak ton, vurgular beyaz) */
    --chat-text: var(--notr1);
    --chat-text-color: #e5e5e5;          /* Varsayılan chat mesaj metni rengi */
    --chat-text-body: var(--chat-text-color);   /* Normal paragraf/body */
    --chat-text-emphasis: #ffffff;        /* Bold, referanslar - beyaz, öne çıkar */
    --chat-text-secondary: var(--notr2);
    --chat-text-muted: var(--notr3);
    
    /* Durum */
    --chat-success: var(--accent);
    --chat-warning: #d97706;
    --chat-error: #dc2626;
    /* Kopyalandı / yumuşak başarı — canlı neon değil; accent-2 (mavi-gri) ile karışık sage */
    --chat-soft-green: color-mix(in srgb, #8f9f94 58%, var(--accent-2) 42%);
    --chat-soft-green-bright: color-mix(in srgb, #b0bfb4 55%, var(--notr2) 45%);
    --chat-copy-success-bg: color-mix(in srgb, var(--chat-soft-green) 13%, transparent);
    --chat-copy-success-bg-hover: color-mix(in srgb, var(--chat-soft-green) 19%, transparent);
    --chat-copy-success-border: color-mix(in srgb, var(--chat-soft-green) 36%, transparent);
    --chat-copy-success-ring: color-mix(in srgb, var(--chat-soft-green) 11%, transparent);
    
    /* Typography */
    --chat-font: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --chat-font-mono: 'JetBrains Mono', 'Fira Code', monospace;
    
    /* Spacing */
    --chat-radius-sm: 6px;
    --chat-radius-md: 8px;
    --chat-radius-lg: 12px;
    --chat-radius-xl: 16px;
    --chat-radius-full: 9999px;
    
    /* Shadows */
    --chat-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.06);
    --chat-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.07);
    --chat-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.08);
    
    /* Kaynak/link ikincil accent rengi */
    --chat-ref-color: var(--accent-2);

    /* Panel scrollbar — tek kaynak: ref panel, dilekçe, mevzuat overlay, kaynak listeleri */
    --chat-panel-scrollbar-width: 6px;
    --chat-panel-scrollbar-track: var(--chat-wa-800);
    --chat-panel-scrollbar-thumb: var(--chat-wa-3400);
    --chat-panel-scrollbar-thumb-hover: var(--chat-wa-5200);
    /* Metin ile kaydırma çubuğu arası — overlap / yapışıklık önleme */
    --chat-panel-scrollbar-content-gap: 14px;

    /* Mevzuat vurgu — düz yüzey, kurumsal: beyaz rail + accent dolgu (3B gölge / halo yok) */
    --chat-mevzuat-hl-rail: var(--chat-wa-9400);
    /* Opak karışım = tam düz ton (panel üzerinde şeffaf katman değil) */
    --chat-mevzuat-hl-fill: color-mix(in srgb, var(--accent) 42%, var(--chat-bg));
    --chat-mevzuat-hl-fill-mark: color-mix(in srgb, var(--accent) 48%, var(--chat-bg));
    
    /* Transitions */
    --chat-ease: cubic-bezier(0.16, 1, 0.3, 1);
    --chat-transition: 200ms var(--chat-ease);
    
    /* Layout */
    --sidebar-width: 300px;
    --sidebar-collapsed-width: 72px;
    --header-height: 52px;
    --mobile-kb-height: 0px;

    /* Sol bar / vurgu yüzeyi (#16181f); sağ içtihat-mevzuat-dilekçe kabı siyah — light: light-chat.css */
    --chat-panel-surface: #16181f;
    --chat-right-panel-bg: var(--siyah);
    --chat-sidebar-bg: var(--chat-panel-surface);
    --chat-sidebar-ink: #ffffff;
    --chat-on-accent: #ffffff;
    --chat-collapse-btn-fg: var(--chat-sidebar-ink);
    --chat-text-inverse: #ffffff;
    --chat-citation-badge-text: var(--chat-bg);
    --chat-dot-nav-active-fill: #ffffff;
    --chat-de-page-bg: #1a1c24;
    --chat-mobile-ctx-sheet-bg: #1a1d2e;

    /* Kart çerçevesi — input yüzeyinden biraz daha koyu kenar (koyu tema) */
    --chat-line-muted: color-mix(in srgb, var(--chat-wa-300) 22%, rgb(0 0 0) 78%);
    --chat-card-border: 1px solid var(--chat-line-muted);
    --chat-card-shadow: 0 2px 24px rgba(0, 0, 0, 0.2), 0 1px 8px rgba(0, 0, 0, 0.12);
    --chat-favorites-star-active: #8388ac;
    --chat-history-row-label: var(--chat-wa-6500);
    --chat-resize-line: var(--chat-line-muted);
    --chat-resize-line-hover: rgba(231, 231, 238, 0.34);

    /* UI alfa (beyaz tint) — dark varsayılan; light: light-chat.css */
    --chat-wa-200: rgba(255, 255, 255, 0.02);
    --chat-wa-250: rgba(255, 255, 255, 0.025);
    --chat-wa-300: rgba(255, 255, 255, 0.03);
    --chat-wa-400: rgba(255, 255, 255, 0.04);
    --chat-wa-450: rgba(255, 255, 255, 0.045);
    --chat-wa-500: rgba(255, 255, 255, 0.05);
    --chat-wa-550: rgba(255, 255, 255, 0.055);
    --chat-wa-600: rgba(255, 255, 255, 0.06);
    --chat-wa-700: rgba(255, 255, 255, 0.07);
    --chat-wa-800: rgba(255, 255, 255, 0.08);
    --chat-wa-900: rgba(255, 255, 255, 0.09);
    --chat-wa-1000: rgba(255, 255, 255, 0.1);
    --chat-wa-1200: rgba(255, 255, 255, 0.12);
    --chat-wa-1400: rgba(255, 255, 255, 0.14);
    --chat-wa-1500: rgba(255, 255, 255, 0.15);
    --chat-wa-1600: rgba(255, 255, 255, 0.16);
    --chat-wa-1800: rgba(255, 255, 255, 0.18);
    --chat-wa-2000: rgba(255, 255, 255, 0.2);
    --chat-wa-2200: rgba(255, 255, 255, 0.22);
    --chat-wa-2500: rgba(255, 255, 255, 0.25);
    --chat-wa-2800: rgba(255, 255, 255, 0.28);
    --chat-wa-3000: rgba(255, 255, 255, 0.3);
    --chat-wa-3200: rgba(255, 255, 255, 0.32);
    --chat-wa-3400: rgba(255, 255, 255, 0.34);
    --chat-wa-3500: rgba(255, 255, 255, 0.35);
    --chat-wa-3800: rgba(255, 255, 255, 0.38);
    --chat-wa-4000: rgba(255, 255, 255, 0.4);
    --chat-wa-4500: rgba(255, 255, 255, 0.45);
    --chat-wa-5000: rgba(255, 255, 255, 0.5);
    --chat-wa-5200: rgba(255, 255, 255, 0.52);
    --chat-wa-5500: rgba(255, 255, 255, 0.55);
    --chat-wa-6000: rgba(255, 255, 255, 0.6);
    --chat-wa-6500: rgba(255, 255, 255, 0.65);
    --chat-wa-7000: rgba(255, 255, 255, 0.7);
    --chat-wa-7200: rgba(255, 255, 255, 0.72);
    --chat-wa-8000: rgba(255, 255, 255, 0.8);
    --chat-wa-8500: rgba(255, 255, 255, 0.85);
    --chat-wa-8800: rgba(255, 255, 255, 0.88);
    --chat-wa-9000: rgba(255, 255, 255, 0.9);
    --chat-wa-9200: rgba(255, 255, 255, 0.92);
    --chat-wa-9400: rgba(255, 255, 255, 0.94);
    --chat-wa-9500: rgba(255, 255, 255, 0.95);
    --chat-wa-9600: rgba(255, 255, 255, 0.96);
    --chat-wa-9700: rgba(255, 255, 255, 0.97);
}

/* ============================================
   BASE & RESET
   ============================================ */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body.chat-page {
    font-family: var(--chat-font);
    font-size: 15px;
    background: var(--chat-bg);
    color: var(--chat-text);
    min-height: 100vh;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
    width: 100%;
    max-width: 100vw;
}

@media (max-width: 768px) {
    html, body.chat-page {
        overflow: hidden !important;
        overscroll-behavior: none;
        position: fixed;
        width: 100%;
        height: 100%;
    }
}

/* ============================================
   LAYOUT - Sidebar + Main
   ============================================ */
.chat-app {
    display: flex;
    height: 100vh;
    height: 100dvh;
    max-height: 100vh;
    max-height: 100dvh;
    overflow: hidden;
    width: 100%;
    max-width: 100vw;
    overflow-x: hidden;
    position: relative;
}

/* ============================================
   SIDEBAR - Sohbet Geçmişi (ChatGPT Style)
   ============================================ */
.chat-sidebar {
    width: var(--sidebar-width);
    background: var(--chat-sidebar-bg);
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    border-right: none;
    /* Tüm ikonlar (stroke currentColor) */
    --sidebar-icon: var(--chat-sidebar-ink);
    color: var(--sidebar-icon);
    overflow-x: hidden;
    overflow-y: hidden;
    max-width: 100%;
    position: relative;
    transition: width 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ── Collapsed sidebar ──────────────────────────────────── */
.chat-sidebar.collapsed {
    width: var(--sidebar-collapsed-width);
    align-items: center;
}

/* Collapsed: logo büyük gizle, küçük logo + hover’da genişlet tuşu */
.chat-sidebar-collapsed-brand {
    display: none;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: center;
    gap: 0;
    max-width: 100%;
}
.chat-sidebar.collapsed .chat-sidebar-collapsed-brand {
    display: flex;
}
.chat-sidebar.collapsed .chat-sidebar-logo { display: none; }
.chat-sidebar.collapsed .chat-sidebar-logo-collapsed {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    padding: 0;
    text-decoration: none;
    border: none;
    background: none;
    cursor: pointer;
    font: inherit;
    color: inherit;
    border-radius: 8px;
    transition: opacity 0.2s ease, transform 0.28s cubic-bezier(0.25, 0.1, 0.25, 1);
    opacity: 0.88;
    flex-shrink: 0;
    -webkit-tap-highlight-color: transparent;
}
.chat-sidebar.collapsed .chat-sidebar-logo-collapsed:hover { opacity: 1; }
.chat-sidebar.collapsed .chat-sidebar-logo-collapsed-img {
    width: 22px;
    height: 22px;
    object-fit: contain;
    pointer-events: none;
}

/* Kapalı şerit: hover’da logo hafif sağa, yanında kenar çubuğunu aç */
.chat-sidebar-header-expand-btn {
    display: none;
    flex-shrink: 0;
    width: 0;
    min-width: 0;
    height: 28px;
    padding: 0;
    margin: 0;
    overflow: hidden;
    opacity: 0;
    border: none;
    border-radius: 6px;
    background: transparent;
    color: var(--sidebar-icon);
    cursor: pointer;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    pointer-events: none;
    transform: translateX(-5px);
    transition:
        width 0.32s cubic-bezier(0.22, 1, 0.36, 1),
        min-width 0.32s cubic-bezier(0.22, 1, 0.36, 1),
        opacity 0.26s ease,
        transform 0.32s cubic-bezier(0.22, 1, 0.36, 1),
        background 0.18s ease;
}
.chat-sidebar.collapsed .chat-sidebar-header-expand-btn {
    display: flex;
}
.chat-sidebar-collapsed-brand:hover,
.chat-sidebar-collapsed-brand:focus-within {
    gap: 0;
}

.chat-sidebar-collapsed-brand:hover .chat-sidebar-header-expand-btn,
.chat-sidebar-collapsed-brand:focus-within .chat-sidebar-header-expand-btn {
    width: 26px;
    min-width: 26px;
    opacity: 1;
    pointer-events: auto;
    transform: translateX(0);
}
.chat-sidebar-collapsed-brand:hover .chat-sidebar-logo-collapsed,
.chat-sidebar-collapsed-brand:focus-within .chat-sidebar-logo-collapsed {
    transform: translateX(1px);
}
.chat-sidebar-header-expand-btn:hover {
    background: transparent;
    color: var(--sidebar-icon);
}
.chat-sidebar-header-expand-icon {
    width: 18px;
    height: 18px;
    display: block;
    flex-shrink: 0;
}

/* Dokunmatik / hover yok: genişlet tuşu her zaman görünsün */
@media (hover: none) {
    .chat-sidebar.collapsed .chat-sidebar-collapsed-brand .chat-sidebar-header-expand-btn {
        width: 26px;
        min-width: 26px;
        opacity: 1;
        pointer-events: auto;
        transform: translateX(0);
    }

    .chat-sidebar.collapsed .chat-sidebar-collapsed-brand .chat-sidebar-logo-collapsed {
        transform: translateX(1px);
    }
}
/* Dar sidebar: koyu tema beyaz kare, açık tema siyah kare (light-chat.css) */
.chat-sidebar-logo-collapsed-img-light {
    display: none;
}
.chat-sidebar.collapsed .chat-sidebar-logo-collapsed-img-dark {
    display: block;
}

/* Collapsed: header — sadece logo, üstte */
.chat-sidebar.collapsed .chat-sidebar-header {
    padding: 18px 0 0;
    align-items: center;
    gap: 0;
    flex-shrink: 0;
}

.chat-sidebar.collapsed .chat-sidebar-header-row {
    justify-content: center;
    width: 100%;
}

.chat-sidebar.collapsed .chat-sidebar-header-logos {
    flex: 0 0 auto;
    justify-content: center;
}
.chat-sidebar.collapsed .chat-sidebar-new-search { display: none; }
.chat-sidebar.collapsed .chat-sidebar-search-btn { display: none !important; }

/* Collapsed: history gizle */
.chat-sidebar.collapsed .chat-history { display: none; }

/* Orta grup — açık sidebar’da sadece sarmalayıcı */
.chat-sidebar-bottom-mid {
    display: flex;
    flex-direction: column;
    gap: 0;
    width: 100%;
}

.chat-sidebar-bottom-expand,
.chat-sidebar-collapsed-new,
.chat-sidebar-collapsed-search,
.chat-sidebar-collapsed-favorites {
    display: none;
}

/* Kapalı modda yeni sohbet kutusu — chat arkaplanı + sidebar/chat ayrımı gibi ince çizgi */
.chat-sidebar-collapsed-new-box {
    display: none;
}
.chat-sidebar.collapsed .chat-sidebar-collapsed-new-box {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    flex-shrink: 0;
    background: var(--chat-bg);
    border: var(--chat-card-border);
    border-radius: 8px;
    box-sizing: border-box;
}
.chat-sidebar.collapsed .chat-sidebar-collapsed-new-box .chat-sidebar-collapsed-new {
    display: flex;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center;
    padding: 0;
    margin: 0;
    background: transparent;
    border: none;
    border-radius: 6px;
    color: var(--sidebar-icon);
    cursor: pointer;
}
.chat-sidebar.collapsed .chat-sidebar-collapsed-new-box .chat-sidebar-collapsed-new:hover {
    background: var(--chat-wa-600);
    color: var(--sidebar-icon);
}
.chat-sidebar.collapsed .chat-sidebar-collapsed-new-box .chat-sidebar-collapsed-new svg {
    width: 19px;
    height: 19px;
}

/* Collapsed: üst logo, ortada butonlar (daha geniş aralık), altta profil */
.chat-sidebar.collapsed .chat-sidebar-bottom {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    min-height: 0;
    padding: 6px 0 10px;
    gap: 0;
    width: 100%;
}

.chat-sidebar.collapsed .chat-sidebar-bottom-mid {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 0;
    width: 100%;
}

/* Collapsed: arama + favoriler + menü aç (yeni sohbet kutusu yukarıda ayrı) */
.chat-sidebar.collapsed .chat-sidebar-bottom-expand,
.chat-sidebar.collapsed .chat-sidebar-collapsed-search,
.chat-sidebar.collapsed .chat-sidebar-collapsed-favorites {
    display: flex;
    width: 40px; height: 40px;
    padding: 0; align-items: center; justify-content: center;
    background: transparent; border: none; border-radius: 8px;
    color: var(--sidebar-icon);
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}
.chat-sidebar.collapsed .chat-sidebar-bottom-expand:hover,
.chat-sidebar.collapsed .chat-sidebar-collapsed-search:hover,
.chat-sidebar.collapsed .chat-sidebar-collapsed-favorites:hover {
    background: var(--chat-wa-800);
    color: var(--sidebar-icon);
}
.chat-sidebar.collapsed .chat-sidebar-bottom-expand svg,
.chat-sidebar.collapsed .chat-sidebar-collapsed-search svg,
.chat-sidebar.collapsed .chat-sidebar-collapsed-favorites svg {
    width: 18px; height: 18px;
}
.chat-sidebar.collapsed .chat-sidebar-collapsed-favorites.is-active {
    color: var(--chat-favorites-star-active);
    background: transparent;
}
.chat-sidebar.collapsed .chat-sidebar-collapsed-favorites.is-active svg {
    fill: var(--chat-favorites-star-active);
    stroke: var(--chat-favorites-star-active);
}

/* Collapsed: Dosyalar / Profil — sadece ikon */
.chat-sidebar.collapsed .chat-sidebar-bottom-mid .chat-sidebar-bottom-link {
    width: 40px; height: 40px;
    padding: 0; justify-content: center; gap: 0;
    border-radius: 8px; background: transparent;
    color: var(--sidebar-icon);
}
.chat-sidebar.collapsed .chat-sidebar-bottom-mid .chat-sidebar-bottom-link:hover {
    background: var(--chat-wa-800);
    color: var(--sidebar-icon);
}
.chat-sidebar.collapsed .chat-sidebar-bottom-mid .chat-sidebar-bottom-link .chat-sidebar-nav-label { display: none; }
.chat-sidebar.collapsed .chat-sidebar-bottom-mid .chat-sidebar-bottom-link svg { width: 18px; height: 18px; }

/* Masaüstü: alttaki “menüyü aç” oku kaldır — genişletme boş alan / ikonlardan */
@media (min-width: 1025px) {
    .chat-sidebar.collapsed .chat-sidebar-bottom-expand {
        display: none !important;
    }
}

/* Collapsed hesap — en altta, dar şeritte tam ortada */
.chat-sidebar.collapsed .chat-sidebar-bottom-account.chat-sidebar-bottom-link {
    padding: 8px 0 10px;
    justify-content: center;
}

.chat-sidebar.collapsed .chat-sidebar-bottom-account {
    display: flex !important;
    flex-shrink: 0;
    margin-top: auto;
    width: 100%;
    max-width: 100%;
    min-height: 0;
    height: auto;
    align-self: stretch;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
}
.chat-sidebar.collapsed .chat-sidebar-account-inner {
    gap: 0;
    flex: 0 0 auto;
    justify-content: center;
    width: auto;
    min-width: 0;
}
.chat-sidebar.collapsed .chat-sidebar-user-info { display: none; }
.chat-sidebar.collapsed .chat-sidebar-avatar {
    width: 28px; height: 28px; font-size: 10px;
}
.chat-sidebar.collapsed .chat-sidebar-logout { display: none; }

/* Eski expand-wrap gizle */
.sidebar-expand-wrap { display: none !important; }

.chat-sidebar-header {
    padding: 20px 16px 12px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* Logo satırı: solda marka, sağda daralt (masaüstü) */
.chat-sidebar-header-row {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    width: 100%;
    min-width: 0;
}

.chat-sidebar-header-logos {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
}

.chat-sidebar-header-collapse-btn {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: 6px;
    background: transparent;
    color: var(--sidebar-icon);
    cursor: pointer;
    opacity: 0.72;
    transition: opacity 0.15s ease, background 0.15s ease, color 0.15s ease;
    box-sizing: border-box;
    box-shadow: none;
}

.chat-sidebar-header-collapse-btn:hover {
    opacity: 1;
    background: var(--chat-wa-600);
    color: var(--sidebar-icon);
}

.chat-sidebar-header-collapse-icon {
    width: 18px;
    height: 18px;
    display: block;
}

.chat-sidebar.collapsed .chat-sidebar-header-collapse-btn {
    display: none;
}

.chat-sidebar-logo {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    margin-bottom: 8px;
    padding: 4px 2px;
    background: none;
    border: none;
    cursor: pointer;
    font: inherit;
    color: inherit;
    text-align: left;
    -webkit-tap-highlight-color: transparent;
}

.chat-sidebar-header-logos .chat-sidebar-logo {
    margin-bottom: 0;
}

.chat-sidebar-logo-icon {
    width: 36px;
    height: 36px;
    background: var(--chat-primary);
    border-radius: var(--chat-radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--chat-on-accent);
}

.chat-sidebar-logo-text {
    display: flex;
    align-items: center;
}

.chat-sidebar-logo-text img {
    height: 72px;
    width: auto;
}

/* Sidebar Logo Image */
.chat-sidebar-logo-img,
.chat-sidebar-logo img {
    height: 36px;
    width: auto;
    max-width: 100%;
    display: block;
    object-fit: contain;
    object-position: left center;
    opacity: 0.95;
    transition: opacity 0.2s ease;
}

.chat-sidebar-logo:hover .chat-sidebar-logo-img,
.chat-sidebar-logo:hover img {
    opacity: 1;
}

.chat-sidebar-logo:focus-visible,
.chat-sidebar.collapsed .chat-sidebar-logo-collapsed:focus-visible,
.chat-sidebar-header-expand-btn:focus-visible {
    outline: 2px solid var(--chat-primary);
    outline-offset: 3px;
    border-radius: 6px;
}

/* Collapsed logo - sadece kapalıyken görünür */
.chat-sidebar-logo-collapsed {
    display: none;
}

/* Search button - kapalıyken büyüteç, açıkken gizli (search input kullanılır) */
.chat-sidebar-search-btn {
    display: none;
    width: 100%;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    padding: 9px 12px;
    background: var(--chat-wa-400);
    color: var(--sidebar-icon);
    border: none;
    border-radius: 7px;
    font-family: var(--chat-font);
    font-size: 13px;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}
.chat-sidebar-search-btn:hover {
    background: var(--chat-wa-700);
    color: var(--sidebar-icon);
}
.chat-sidebar-search-btn svg { width: 15px; height: 15px; flex-shrink: 0; }

/* Yeni sohbet (tam genişlik metin) + altta tam genişlik arama */
.chat-sidebar-new-search {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
    padding: 6px 12px 8px;
    flex-shrink: 0;
    border-bottom: none;
    min-width: 0;
    --chat-sidebar-row-h: 32px;
}

/* Chat history search (açık sidebar) */
.chat-history-search-row {
    display: flex;
    align-items: stretch;
    gap: 6px;
    width: 100%;
    min-width: 0;
}

.chat-history-search-wrap {
    position: relative;
    flex: 1;
    min-width: 0;
    padding: 0;
    display: flex;
    align-items: stretch;
}

.chat-sidebar-new-search .chat-history-search-row {
    flex: 0 0 auto;
    width: 100%;
}

.chat-sidebar-new-search .chat-history-search-wrap {
    flex: 1;
    width: auto;
}

.chat-history-favorites-filter-btn {
    flex: 0 0 var(--chat-sidebar-row-h);
    width: var(--chat-sidebar-row-h);
    min-width: var(--chat-sidebar-row-h);
    height: var(--chat-sidebar-row-h);
    min-height: var(--chat-sidebar-row-h);
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--chat-wa-500);
    border: 1px solid var(--chat-wa-800);
    border-radius: 7px;
    color: var(--chat-wa-4000);
    cursor: pointer;
    transition: border-color 0.15s ease, color 0.15s ease;
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
}

.chat-history-favorites-filter-btn svg {
    fill: none;
    stroke: currentColor;
}

.chat-history-favorites-filter-btn:hover {
    border-color: var(--chat-wa-2000);
    color: var(--chat-history-row-label);
    background: var(--chat-wa-500);
}

.chat-history-favorites-filter-btn.is-active {
    border-color: var(--chat-wa-800);
    background: var(--chat-wa-500);
    color: var(--chat-favorites-star-active);
}

.chat-history-favorites-filter-btn.is-active svg {
    fill: var(--chat-favorites-star-active);
    stroke: var(--chat-favorites-star-active);
}
.chat-history-search {
    width: 100%;
    height: var(--chat-sidebar-row-h);
    min-height: var(--chat-sidebar-row-h);
    padding: 0 10px 0 30px;
    line-height: calc(var(--chat-sidebar-row-h) - 2px);
    background: var(--chat-wa-500);
    border: 1px solid var(--chat-wa-800);
    border-radius: 7px;
    color: var(--chat-wa-9000);
    font-size: 12px;
    outline: none;
    transition: border-color 0.15s ease;
    box-sizing: border-box;
}
.chat-history-search::placeholder { color: var(--chat-wa-4000); }
.chat-history-search:focus { border-color: var(--chat-wa-2000); }
.chat-history-search-wrap::before {
    content: '';
    position: absolute;
    left: 9px;
    top: 50%;
    transform: translateY(-50%);
    width: 14px;
    height: 14px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='rgba(255,255,255,0.5)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E") no-repeat center;
    pointer-events: none;
}

/* Ortak sınıf — Sohbete Dön (profil/dosyalarım) için temel kutu */
.chat-new-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: var(--chat-font);
    cursor: pointer;
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
}

a.chat-new-btn,
a.chat-sidebar-collapsed-new {
    text-decoration: none;
    color: inherit;
}

a.chat-new-btn:visited,
a.chat-sidebar-collapsed-new:visited {
    color: inherit;
}

/* Chat sol bar: tam genişlik, ortalanmış metin; koyu temada düğüm arka planı siyah */
.chat-sidebar-new-search .chat-new-btn {
    flex: 0 0 auto;
    align-self: stretch;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    min-height: 36px;
    height: auto;
    padding: 8px 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    background: var(--chat-main-surface);
    color: var(--sidebar-icon);
    border: 1px solid var(--chat-wa-1500);
    border-radius: 7px;
    transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease, transform 0.12s ease;
}

.chat-sidebar-new-search .chat-new-btn-text {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.chat-sidebar-new-search .chat-new-btn:hover {
    background: #0d0d0d;
    border-color: var(--chat-wa-2200);
    color: var(--sidebar-icon);
}

.chat-sidebar-new-search .chat-new-btn:active {
    transform: scale(0.985);
}

@media (max-width: 360px) {
    .chat-sidebar-new-search {
        gap: 5px;
        padding: 5px 10px 7px;
        --chat-sidebar-row-h: 30px;
    }
}

/* History List */
.chat-history {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 8px;
    scrollbar-width: thin;
    scrollbar-color: var(--chat-wa-1000) transparent;
}

.chat-history::-webkit-scrollbar {
    width: 6px;
}

.chat-history::-webkit-scrollbar-track {
    background: transparent;
}

.chat-history::-webkit-scrollbar-thumb {
    background: var(--chat-wa-1000);
    border-radius: 3px;
    transition: background 0.2s ease;
}

.chat-history::-webkit-scrollbar-thumb:hover {
    background: var(--chat-wa-1500);
}

.chat-history-section {
    margin-bottom: 16px;
}

.chat-history-title {
    font-size: 10.5px;
    font-weight: 500;
    color: var(--chat-wa-2800);
    text-transform: uppercase;
    letter-spacing: 0.9px;
    padding: 12px 12px 5px;
    margin-bottom: 0;
}

.chat-history-list {
    display: flex;
    flex-direction: column;
    gap: 1px;
}

/* Sonsuz kaydırma: sadece liste sonuna gelince tetiklenir (1px sentinel) */
.chat-history-scroll-sentinel {
    height: 1px;
    width: 100%;
    flex-shrink: 0;
    pointer-events: none;
    visibility: hidden;
}

.chat-history-load-more-row {
    display: none;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 8px 6px;
    font-size: 12px;
    font-weight: 500;
    color: var(--chat-wa-2600, rgba(255, 255, 255, 0.45));
}

.chat-history-load-more-row.is-visible {
    display: flex;
}

.chat-history-load-more-spinner {
    width: 15px;
    height: 15px;
    border: 2px solid var(--chat-wa-1200, rgba(255, 255, 255, 0.12));
    border-top-color: var(--chat-wa-2800, rgba(255, 255, 255, 0.55));
    border-radius: 50%;
    animation: chat-history-load-spin 0.7s linear infinite;
    flex-shrink: 0;
}

@keyframes chat-history-load-spin {
    to {
        transform: rotate(360deg);
    }
}

.chat-history-item {
    display: flex;
    align-items: center;
    gap: 2px;
    padding: 7px 10px 7px 8px;
    background: transparent;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.12s ease;
    text-align: left;
    width: 100%;
    position: relative;
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
}

.chat-history-item::before {
    content: '';
    position: absolute;
    left: 4px;
    top: 50%;
    transform: translateY(-50%);
    width: 2px;
    height: 0;
    background: #5b5f7a;
    border-radius: 2px;
    transition: height 0.15s ease;
}

.chat-history-item {
    --chat-history-row-label: var(--chat-wa-6500);
}

.chat-history-item:hover {
    background: var(--chat-wa-400);
    --chat-history-row-label: var(--chat-wa-8500);
}

.chat-history-item:hover::before {
    height: 50%;
}

.chat-history-item.active {
    background: var(--chat-wa-600);
    --chat-history-row-label: var(--chat-wa-9200);
}

.chat-history-item.active::before {
    height: 55%;
    background: #5b5f7a;
}

.chat-history-item-icon {
    display: none;
}

.chat-history-item-favorite {
    flex: 0 0 0;
    width: 0;
    height: 22px;
    margin: 0;
    padding: 0;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    border-radius: 3px;
    color: var(--chat-history-row-label);
    cursor: pointer;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.15s ease, flex-basis 0.15s ease, width 0.15s ease, color 0.15s ease, background 0.15s ease;
    align-self: center;
    -webkit-tap-highlight-color: transparent;
}

.chat-history-item-favorite svg {
    display: block;
    width: 11px;
    height: 11px;
    flex-shrink: 0;
    fill: none;
    stroke: currentColor;
}

.chat-history-item-favorite.is-active svg {
    fill: currentColor;
    stroke: currentColor;
}

.chat-history-item:hover .chat-history-item-favorite,
.chat-history-item-favorite:focus-visible {
    flex: 0 0 16px;
    width: 16px;
    opacity: 1;
    pointer-events: auto;
}

.chat-history-item:hover .chat-history-item-favorite:not(.is-active):hover {
    color: var(--chat-history-row-label);
    background: var(--chat-wa-600);
}

.chat-history-item-content {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 0;
    cursor: pointer;
}

.chat-history-item-link {
    display: block;
    width: 100%;
    color: inherit;
    text-decoration: none;
}

.chat-history-item-link--suspended {
    cursor: text;
    pointer-events: none;
}

.chat-history-item-link--suspended .chat-history-item-title-input {
    pointer-events: auto;
}

.chat-history-item-text-stack {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 3px;
}

.chat-history-item-title {
    width: 100%;
    min-width: 0;
    font-size: 13px;
    font-weight: 400;
    color: var(--chat-history-row-label);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.35;
}

.chat-history-item.active .chat-history-item-title {
    font-weight: 450;
}

.chat-history-item-time {
    flex-shrink: 0;
    font-size: 11px;
    color: var(--chat-wa-4000);
    margin-left: 0;
    align-self: flex-start;
    white-space: nowrap;
    line-height: 1.25;
}

.chat-history-item-meta {
    font-size: 11px;
    color: var(--chat-wa-4000);
    margin-top: 2px;
}

.chat-history-item-delete {
    width: 24px;
    min-width: 24px;
    height: 24px;
    background: transparent;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--chat-wa-4000);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.12s ease, background 0.12s ease, color 0.12s ease;
    flex-shrink: 0;
}

.chat-history-item:hover .chat-history-item-delete {
    opacity: 1;
    pointer-events: auto;
}

.chat-history-item-delete:hover {
    background: rgba(239, 68, 68, 0.2);
    color: #ef4444;
}

.chat-history-item-delete.chat-history-delete-as-cancel {
    opacity: 1;
}

.chat-history-item-delete.chat-history-delete-as-cancel:hover {
    background: rgba(148, 163, 184, 0.2);
    color: var(--chat-wa-8500);
}

.chat-history-item-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 4px;
    flex: 0 0 80px;
    width: 80px;
    min-width: 80px;
    align-self: center;
    margin-left: 8px;
}

.chat-history-item-pin {
    width: 24px;
    min-width: 24px;
    height: 24px;
    padding: 0;
    background: transparent;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--chat-history-row-label);
    opacity: 0;
    pointer-events: none;
    flex-shrink: 0;
    transition: opacity 0.12s ease, background 0.12s ease, color 0.12s ease;
    -webkit-tap-highlight-color: transparent;
}

.chat-history-item-edit,
.chat-history-item-save {
    width: 24px;
    min-width: 24px;
    height: 24px;
    padding: 0;
    background: transparent;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--chat-wa-4000);
    opacity: 0;
    pointer-events: none;
    flex-shrink: 0;
    transition: opacity 0.12s ease, background 0.12s ease, color 0.12s ease;
    -webkit-tap-highlight-color: transparent;
}

.chat-history-item-pin.is-active {
    opacity: 1;
    pointer-events: auto;
    color: var(--chat-history-row-label);
}

.chat-history-item:hover .chat-history-item-pin,
.chat-history-item:hover .chat-history-item-edit,
.chat-history-item:hover .chat-history-item-save,
.chat-history-item[data-editing="1"] .chat-history-item-edit,
.chat-history-item[data-editing="1"] .chat-history-item-save {
    opacity: 1;
    pointer-events: auto;
}

.chat-history-item-pin.is-active:hover {
    color: var(--chat-history-row-label);
    background: var(--chat-wa-1000);
}

.chat-history-item--pin-animating {
    position: relative;
    z-index: 3;
    background: var(--chat-wa-500);
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.28);
}

@media (prefers-reduced-motion: reduce) {
    .chat-history-item--pin-animating {
        transition: none !important;
        transform: none !important;
        box-shadow: none;
    }
}

.chat-history-item-edit:hover {
    background: var(--chat-wa-1000);
    color: var(--chat-wa-9000);
}
.chat-history-item-save:hover {
    background: rgba(34, 197, 94, 0.2);
    color: #22c55e;
}
.chat-history-item-title-input {
    flex: 1;
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    /* Liste başlığı (.chat-history-item-title) ile aynı puntoda — düzenlemede büyüme olmasın */
    font-size: 13px;
    font-weight: 400;
    line-height: 1.35;
    color: var(--chat-wa-9000);
    background: var(--chat-wa-800);
    border: 1px solid var(--chat-wa-1500);
    border-radius: 6px;
    padding: 4px 8px;
    outline: none;
    -webkit-text-size-adjust: 100%;
    touch-action: manipulation;
}
.chat-history-item-title-input:focus {
    border-color: var(--chat-primary);
    background: var(--chat-wa-1000);
}

/* Empty History */
.chat-history-empty {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 28px 16px;
    text-align: center;
    min-height: 120px;
}

.chat-history-empty-icon {
    width: 44px;
    height: 44px;
    background: var(--chat-wa-500);
    border: var(--chat-card-border);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 14px;
    color: var(--chat-wa-4500);
    flex-shrink: 0;
}

.chat-history-empty-icon svg {
    width: 20px;
    height: 20px;
    display: block;
    flex-shrink: 0;
}

.chat-history-empty p {
    font-size: 13px;
    color: var(--notr3);
    line-height: 1.55;
    max-width: 220px;
    margin: 0 auto;
}

.chat-history-empty--search .chat-history-empty-icon {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    margin-bottom: 12px;
}

.chat-history-empty--search .chat-history-empty-icon svg {
    width: 18px;
    height: 18px;
}

.chat-history-empty--search p {
    font-size: 12.5px;
    color: var(--notr4);
    letter-spacing: 0.01em;
    max-width: 200px;
}

/* Eski nav kaldırıldı — artık .chat-sidebar-bottom kullanılıyor */
.chat-sidebar-nav { display: none; }

/* ── Sidebar Alt Bölüm — Dosyalarım / Profilim / Hesap ────────── */
.chat-sidebar-bottom {
    display: flex;
    flex-direction: column;
    padding: 6px 10px 14px;
    gap: 0;
    flex-shrink: 0;
}

.chat-sidebar-bottom-link {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 12px;
    background: transparent;
    border-radius: 7px;
    color: var(--sidebar-icon);
    text-decoration: none;
    font-size: 13px;
    font-weight: 400;
    transition: background 0.15s ease, color 0.15s ease;
    cursor: pointer;
    width: 100%;
    box-sizing: border-box;
}

.chat-sidebar-bottom-link:hover {
    background: var(--chat-wa-600);
    color: var(--sidebar-icon);
}

.chat-sidebar-bottom-link svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    color: inherit;
}

.chat-sidebar-bottom-link .chat-sidebar-nav-label {
    white-space: nowrap;
}

.chat-sidebar-beta-badge {
    font-size: 9px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 2px 6px;
    border-radius: 4px;
    line-height: 1.1;
    flex-shrink: 0;
    background: color-mix(in srgb, var(--accent) 24%, transparent);
    color: var(--accent-2);
}

/* Resmi Gazete sidebar promosyonu (abone olmayanlar) */
@keyframes chat-gazete-glow-spin {
    to {
        transform: translate(-50%, -50%) rotate(360deg);
    }
}

.chat-gazete-promo {
    position: relative;
    display: none;
    width: 100%;
    margin: 0 0 6px;
    padding: 0 2px;
    box-sizing: border-box;
}

.chat-gazete-promo.is-visible {
    display: block;
}

/* Dönen çerçeve: arka planda dönen conic gradient + overflow hidden */
.chat-gazete-promo-frame {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    isolation: isolate;
}

.chat-gazete-promo-frame__glow {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 220%;
    height: 220%;
    transform: translate(-50%, -50%);
    background: conic-gradient(
        from 0deg,
        transparent 0deg 195deg,
        rgba(91, 95, 122, 0.12) 215deg,
        rgba(91, 95, 122, 0.45) 248deg,
        rgba(190, 194, 212, 0.88) 266deg,
        rgba(91, 95, 122, 0.4) 284deg,
        rgba(91, 95, 122, 0.14) 300deg,
        transparent 320deg 360deg
    );
    animation: chat-gazete-glow-spin 2.75s linear infinite;
    pointer-events: none;
    z-index: 0;
}

html[data-chat-theme="light"] .chat-gazete-promo-frame__glow {
    background: conic-gradient(
        from 0deg,
        transparent 0deg 195deg,
        rgba(91, 95, 122, 0.08) 215deg,
        rgba(91, 95, 122, 0.32) 248deg,
        rgba(91, 95, 122, 0.78) 266deg,
        rgba(91, 95, 122, 0.34) 284deg,
        rgba(91, 95, 122, 0.1) 300deg,
        transparent 320deg 360deg
    );
}

.chat-gazete-promo-body {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 50px;
    margin: 2px;
    width: calc(100% - 4px);
    padding: 10px 34px 10px 10px;
    box-sizing: border-box;
    text-decoration: none;
    color: var(--chat-text-emphasis, #e4e7ec);
    background: linear-gradient(
        135deg,
        color-mix(in srgb, #5b5f7a 26%, var(--chat-bg)) 0%,
        color-mix(in srgb, #5b5f7a 10%, var(--chat-bg)) 100%
    );
    border: none;
    border-radius: 10px;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.06) inset,
        0 6px 18px rgba(0, 0, 0, 0.2);
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.chat-gazete-promo-body:hover {
    transform: translateY(-1px);
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.08) inset,
        0 8px 22px rgba(0, 0, 0, 0.24);
    color: var(--chat-text-emphasis, #e4e7ec);
}

.chat-gazete-promo-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    flex-shrink: 0;
    border-radius: 10px;
    color: #5b5f7a;
    background: color-mix(in srgb, #5b5f7a 16%, var(--chat-bg));
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.08) inset;
}

.chat-gazete-promo-icon svg {
    width: 18px;
    height: 18px;
}

.chat-gazete-promo-copy {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    min-width: 0;
    flex: 1;
}

.chat-gazete-promo-title {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.01em;
    line-height: 1.25;
    white-space: normal;
    max-width: 100%;
}

.chat-gazete-promo-badge {
    font-size: 9px;
    font-weight: 700;
    text-transform: lowercase;
    letter-spacing: 0.06em;
    padding: 3px 8px;
    border-radius: 999px;
    line-height: 1;
    flex-shrink: 0;
    background: rgba(255, 255, 255, 0.94);
    color: #0a0a0c;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12);
}

.chat-gazete-promo-close {
    position: absolute;
    top: 6px;
    right: 6px;
    width: 20px;
    height: 20px;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: color-mix(in srgb, var(--chat-bg) 55%, transparent);
    color: var(--chat-text-muted, #9ca3af);
    font-size: 14px;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
    transition: color 0.12s ease, background 0.12s ease;
}

.chat-gazete-promo-close:hover {
    color: var(--chat-text-emphasis, #e4e7ec);
    background: color-mix(in srgb, var(--chat-wa-800) 90%, transparent);
}

html[data-chat-theme="light"] .chat-gazete-promo-body {
    background: linear-gradient(135deg, #ffffff 0%, #f0f2f6 100%);
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 1) inset,
        0 6px 18px rgba(91, 95, 122, 0.12);
    color: #111827;
}

html[data-chat-theme="light"] .chat-gazete-promo-body:hover {
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 1) inset,
        0 8px 22px rgba(91, 95, 122, 0.16);
}

html[data-chat-theme="light"] .chat-gazete-promo-icon {
    color: #5b5f7a;
    background: color-mix(in srgb, #5b5f7a 10%, #fff);
}

html[data-chat-theme="light"] .chat-gazete-promo-badge {
    background: #ffffff;
    color: #000000;
    font-weight: 800;
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.06), 0 2px 8px rgba(0, 0, 0, 0.1);
}

html[data-chat-theme="light"] .chat-gazete-promo-close {
    background: rgba(255, 255, 255, 0.85);
    color: #6b7280;
}

/* Tema geçişi: çarpı / kutu — background color-mix ↔ #fff interpolasyonu beyaz patlar */
html.chat-theme-switching .chat-gazete-promo-body,
html.chat-theme-switching .chat-gazete-promo-close,
html.chat-theme-switching .chat-gazete-promo-frame,
html.chat-theme-switching .chat-gazete-promo-frame__glow,
html.chat-theme-switching .chat-gazete-promo-icon,
html.chat-theme-switching .chat-gazete-promo-collapsed-inner,
html.chat-theme-switching .chat-gazete-promo-collapsed-frame__glow {
    transition: none !important;
}

.chat-sidebar.collapsed .chat-gazete-promo {
    display: none !important;
}

/* Kapalı sidebar: Dosyalarım altında gazete ikonu */
.chat-gazete-promo-collapsed {
    display: none !important;
    padding: 0 !important;
    text-decoration: none;
    overflow: visible;
    background: transparent !important;
}

.chat-gazete-promo-collapsed-frame {
    position: relative;
    display: block;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    overflow: hidden;
    isolation: isolate;
    flex-shrink: 0;
}

.chat-gazete-promo-collapsed-frame__glow {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 220%;
    height: 220%;
    transform: translate(-50%, -50%);
    background: conic-gradient(
        from 0deg,
        transparent 0deg 195deg,
        rgba(91, 95, 122, 0.12) 215deg,
        rgba(91, 95, 122, 0.45) 248deg,
        rgba(190, 194, 212, 0.88) 266deg,
        rgba(91, 95, 122, 0.4) 284deg,
        rgba(91, 95, 122, 0.14) 300deg,
        transparent 320deg 360deg
    );
    animation: chat-gazete-glow-spin 2.75s linear infinite;
    pointer-events: none;
    z-index: 0;
}

html[data-chat-theme="light"] .chat-gazete-promo-collapsed-frame__glow {
    background: conic-gradient(
        from 0deg,
        transparent 0deg 195deg,
        rgba(91, 95, 122, 0.08) 215deg,
        rgba(91, 95, 122, 0.32) 248deg,
        rgba(91, 95, 122, 0.78) 266deg,
        rgba(91, 95, 122, 0.34) 284deg,
        rgba(91, 95, 122, 0.1) 300deg,
        transparent 320deg 360deg
    );
}

.chat-gazete-promo-collapsed-inner {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc(100% - 4px);
    height: calc(100% - 4px);
    margin: 2px;
    border-radius: 8px;
    color: #5b5f7a;
    background: var(--chat-bg);
    box-sizing: border-box;
}

.chat-gazete-promo-collapsed-inner svg {
    width: 18px;
    height: 18px;
}

.chat-sidebar.collapsed .chat-gazete-promo-collapsed.is-visible {
    display: flex !important;
    width: 40px;
    height: 40px;
    min-width: 40px;
    min-height: 40px;
    align-items: center;
    justify-content: center;
}

html:not([data-chat-theme="light"]) .chat-sidebar.collapsed .chat-gazete-promo-collapsed.is-visible,
html:not([data-chat-theme="light"]) .chat-sidebar.collapsed .chat-gazete-promo-collapsed.is-visible .chat-gazete-promo-collapsed-inner {
    color: #ffffff;
}

.chat-sidebar.collapsed .chat-gazete-promo-collapsed:hover .chat-gazete-promo-collapsed-inner {
    background: color-mix(in srgb, #5b5f7a 12%, var(--chat-bg));
}

html:not([data-chat-theme="light"]) .chat-sidebar.collapsed .chat-gazete-promo-collapsed.is-visible:hover .chat-gazete-promo-collapsed-inner {
    color: #ffffff;
}

html[data-chat-theme="light"] .chat-gazete-promo-collapsed-inner {
    color: #5b5f7a;
    background: #ffffff;
    box-shadow: 0 2px 12px rgba(91, 95, 122, 0.14);
}

.chat-sidebar.collapsed .chat-sidebar-files-link {
    position: relative;
}

.chat-sidebar.collapsed .chat-sidebar-files-link .chat-sidebar-beta-badge {
    position: absolute;
    top: 1px;
    right: 1px;
    padding: 1px 4px;
    font-size: 7px;
    border-radius: 3px;
    line-height: 1.15;
}

/* Hesap satırı — avatar + ad + logout */
.chat-sidebar-bottom-account {
    cursor: default;
}

.chat-sidebar-account-inner {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    color: inherit;
    flex: 1;
    min-width: 0;
    cursor: default;
}

.chat-sidebar-account-inner:hover {
    color: inherit;
}

.chat-sidebar-avatar {
    width: 22px;
    height: 22px;
    background: #5b5f7a;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--chat-on-accent);
    font-size: 9px;
    font-weight: 600;
    flex-shrink: 0;
}

.chat-sidebar-user-info {
    flex: 1;
    min-width: 0;
}

.chat-sidebar-user-name {
    font-size: 13px;
    font-weight: 400;
    color: var(--sidebar-icon);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.4;
}

.chat-sidebar-bottom-account:hover .chat-sidebar-user-name {
    color: var(--sidebar-icon);
}

.chat-sidebar-user-plan {
    display: none;
}

.chat-sidebar-logout {
    width: 24px;
    height: 24px;
    background: transparent;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--sidebar-icon);
    transition: color 0.15s ease;
    flex-shrink: 0;
    margin-left: auto;
}

.chat-sidebar-logout svg {
    width: 14px;
    height: 14px;
}

.chat-sidebar-logout:hover {
    color: rgba(239, 68, 68, 0.8);
}

/* Eski footer gizle */
.chat-sidebar-footer { display: none; }

/* ── Sidebar tema değiştirme tuşu ────────────────────────── */
.chat-sidebar-theme-btn {
    border: none;
    background: transparent;
    cursor: pointer;
    font-family: var(--chat-font);
    text-align: left;
}

.chat-sidebar-theme-btn .chat-theme-icon-moon {
    display: none;
}

.sidebar-theme-label-light {
    display: none;
}

/* Collapsed modda: icon-only, 40x40, no border */
.chat-sidebar.collapsed .chat-sidebar-theme-btn {
    width: 40px;
    height: 40px;
    padding: 0;
    justify-content: center;
    gap: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--sidebar-icon);
    align-self: center;
    flex-shrink: 0;
    margin-bottom: 6px;
}

.chat-sidebar.collapsed .chat-sidebar-theme-btn span {
    display: none;
}

.chat-sidebar.collapsed .chat-sidebar-theme-btn svg {
    width: 18px;
    height: 18px;
}

.chat-sidebar.collapsed .chat-sidebar-theme-btn:hover {
    background: var(--chat-wa-800);
    color: var(--sidebar-icon);
}

/* ============================================
   MAIN CONTENT + REFERANS PANELİ (sayfa içi)
   ============================================ */
.chat-main-wrap {
    flex: 1;
    display: flex;
    min-width: 0;
    overflow: hidden;
    position: relative;
    --chat-citation-panel-width: clamp(168px, 19vw, 260px);
    --chat-citation-panel-left: max(18px, calc((100% - 900px) / 2 + 22px));
    --chat-citation-panel-gap: 10px;
    background: var(--chat-sidebar-bg);
    padding: 8px;
}

.chat-main {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    overflow-x: hidden;
    background: var(--chat-bg);
    width: 100%;
    max-width: 100%;
    min-width: 0;
    position: relative;
    --chat-prev-prompt-offset: 132px;
    border-radius: 8px;
    border: var(--chat-card-border);
    box-shadow: var(--chat-card-shadow);
}

/* Referans paneli (içtihat/mevzuat) - sayfa içinde açılır, sohbet kullanılabilir kalır */
.chat-ref-panel {
    width: 0;
    flex-shrink: 0;
    overflow: hidden;
    transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    flex-direction: column;
    background: var(--chat-right-panel-bg);
    position: relative;
    border-radius: 8px;
    border: none;
    box-shadow: none;
    box-sizing: border-box;
}

.chat-main-wrap.has-ref-panel .chat-ref-panel {
    /* --chat-ref-panel-min-width / --chat-ref-panel-width: JS measureRefPanelMinWidth + sürükleme */
    width: var(--chat-ref-panel-width, var(--chat-ref-panel-min-width, 320px));
    min-width: var(--chat-ref-panel-min-width, 280px);
    max-width: 60vw;
    margin-left: 7px;
    border: var(--chat-card-border);
    box-shadow: var(--chat-card-shadow);
}

.chat-ref-panel .chat-ref-open-full-btn {
    padding: 6px 12px;
    font-size: 12px;
    background: var(--chat-surface-alt);
    border: 1px solid var(--chat-border);
    border-radius: 6px;
    color: var(--chat-text-secondary);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
    flex-shrink: 0;
}

.chat-ref-panel .chat-ref-panel-header-ictihat,
.chat-ref-panel .chat-ref-panel-header-mevzuat {
    flex-wrap: nowrap;
    gap: 8px;
    padding: 12px 12px;
}

.chat-ref-panel .chat-ref-panel-header-ictihat h3,
.chat-ref-panel .chat-ref-panel-header-mevzuat h3 {
    white-space: nowrap;
    flex-shrink: 0;
}

.chat-ref-panel .chat-ref-panel-header-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
    margin-left: auto;
}

.chat-ref-panel .chat-ref-panel-inner {
    display: flex;
    flex-direction: row;
    width: 100%;
    height: 100%;
    min-height: 0;
    position: relative;
    overflow: hidden;
}

/* Resize şeridi üstte — başlık ile dikey birleşim çizgisi olmasın (içtihat/mevzuat paneli) */
.chat-main-wrap.has-ref-panel .chat-ref-panel .chat-ref-panel-resize-handle {
    z-index: 5;
}

.chat-main-wrap.has-ref-panel .chat-ref-panel .mevzuat-sidebar-content {
    margin-left: -8px;
    z-index: 1;
    position: relative;
}

/* Sürüklenebilir genişlik ayarı - tek ince çizgi */
.chat-ref-panel-resize-handle {
    width: 8px;
    flex-shrink: 0;
    cursor: col-resize;
    display: flex;
    align-items: stretch;
    justify-content: center;
    background: transparent;
    transition: background 0.15s ease;
    -webkit-user-select: none;
    user-select: none;
    position: relative;
}

/* Görünür çizgi yok — sürükleme panelin sol kenarından (işlevsel alan korunur) */
.chat-ref-panel-resize-handle::before {
    display: none !important;
    content: none !important;
}

.chat-ref-panel-resize-handle:hover,
.chat-ref-panel-resize-handle:active,
.chat-ref-panel-resize-handle.chat-ref-panel-resizing {
    background: transparent;
}

.chat-ref-panel-resize-grip {
    display: none;
}

@media (max-width: 768px) {
    .chat-ref-panel-resize-handle {
        display: none;
    }

    .chat-ref-panel .mevzuat-sidebar-content {
        margin-left: 0;
    }
}

.chat-ref-panel .mevzuat-sidebar-content {
    position: static;
    transform: none;
    transition: none;
    flex: 1;
    min-width: 0;
    height: 100%;
    min-height: 0;
    box-shadow: none;
    display: flex;
    flex-direction: column;
}

/* Referans paneli: Chrome tarzı üst sekmeler (içtihat + mevzuat aynı anda) */
.chat-ref-panel .chat-ref-tab-strip {
    position: relative;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: stretch;
    gap: 2px;
    padding: 6px 6px 0;
    border-bottom: 1px solid var(--chat-wa-600);
    flex-shrink: 0;
    min-height: 38px;
    /* Tema değişiminde --chat-panel-surface ile birlikte güncellenir (sabit siyah rgba flaş vermesin) */
    background: color-mix(in srgb, var(--chat-wa-600) 100%, var(--chat-panel-surface));
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: thin;
}

.chat-ref-panel .chat-ref-tab-close-all {
    flex: 0 0 auto;
    align-self: center;
    margin-left: 4px;
    margin-right: 2px;
    width: 26px;
    height: 26px;
    padding: 0;
    border: 1px solid transparent;
    border-radius: 6px;
    background: transparent;
    color: var(--chat-wa-7800);
    cursor: pointer;
    touch-action: manipulation;
    opacity: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: opacity 0.15s ease, background 0.15s ease, border-color 0.15s ease;
}

.chat-ref-panel .chat-ref-tab-close-all:hover {
    opacity: 1;
    background: rgba(255, 255, 255, 0.08);
    border-color: color-mix(in srgb, var(--chat-wa-600) 80%, #fff 20%);
}

.chat-ref-panel .chat-ref-tab-close-all:focus-visible {
    opacity: 1;
    background: rgba(255, 255, 255, 0.08);
    border-color: color-mix(in srgb, var(--chat-wa-600) 80%, #fff 20%);
}

/* Koyu tema: sağ panel üst sekme şeridi — ana koyu yüzey (siyah ton) */
html:not([data-chat-theme="light"]) .chat-ref-panel .chat-ref-tab-strip {
    background: var(--chat-bg);
    border-bottom-color: color-mix(in srgb, var(--chat-wa-600) 85%, var(--chat-bg));
}

.chat-ref-panel .chat-ref-tab {
    flex: 1 1 0;
    min-width: 0;
    max-width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 4px;
    padding: 6px 6px 8px;
    margin-bottom: -1px;
    border-radius: 6px 6px 0 0;
    border: 1px solid transparent;
    border-bottom: none;
    cursor: default;
    background: color-mix(in srgb, rgba(0, 0, 0, 0.22) 100%, var(--chat-panel-surface));
    color: var(--chat-wa-5000);
    /* flex-basis/min-width animasyonu yok: yeni sekmede kardeş sekmeler “kayarak” boyanmasın */
    transition:
        background 0.2s cubic-bezier(0.22, 1, 0.36, 1),
        color 0.2s ease,
        border-color 0.2s ease,
        opacity 0.22s ease,
        padding 0.22s ease,
        margin 0.22s ease,
        box-shadow 0.2s ease;
    position: relative;
    box-sizing: border-box;
}

.chat-ref-panel .chat-ref-tab.is-active {
    background: var(--chat-right-panel-bg);
    border-color: var(--chat-wa-600);
    color: var(--chat-wa-9500);
    z-index: 1;
    box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.12);
}

.chat-ref-panel .chat-ref-tab:hover:not(.is-active) {
    background: rgba(255, 255, 255, 0.05);
}

.chat-ref-panel .chat-ref-tab-label {
    cursor: grab;
    flex: 1;
    min-width: 0;
    font-size: 11px;
    font-weight: 500;
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: left;
}

.chat-ref-panel .chat-ref-tab-close {
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    padding: 0;
    border: none;
    border-radius: 4px;
    background: transparent;
    color: inherit;
    opacity: 0.88;
    cursor: pointer;
    touch-action: manipulation;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity 0.15s ease, background 0.15s ease;
}

.chat-ref-panel .chat-ref-tab-close:hover {
    opacity: 1;
    background: rgba(255, 255, 255, 0.08);
}

.chat-ref-panel .chat-ref-tab-pane {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: opacity 0.16s ease, transform 0.2s cubic-bezier(0.22, 1, 0.36, 1);
}

.chat-ref-panel .chat-ref-tab-pane--exit {
    opacity: 0;
    transform: translateY(8px);
    pointer-events: none;
}

.chat-ref-panel .chat-ref-tab-pane--enter {
    animation: chatRefPaneEnter 0.32s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes chatRefPaneEnter {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes chatRefTabAppear {
    from {
        opacity: 0;
        transform: translate3d(0, -4px, 0) scale(0.97);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1);
    }
}

.chat-ref-panel .chat-ref-tab--appear {
    animation: chatRefTabAppear 0.38s cubic-bezier(0.16, 1, 0.3, 1) both;
}

@media (prefers-reduced-motion: reduce) {
    .chat-ref-panel .chat-ref-tab--appear {
        animation: none;
        opacity: 1;
        transform: none;
    }
}

.chat-ref-panel .chat-ref-tab--closing {
    opacity: 0;
    flex: 0 1 0;
    min-width: 0 !important;
    max-width: 0 !important;
    padding-left: 0;
    padding-right: 0;
    margin-left: 0;
    margin-right: 0;
    overflow: hidden;
    pointer-events: none;
}

.chat-ref-panel .chat-ref-tab--drag-source {
    opacity: 0.34;
    pointer-events: none;
    transition: opacity 0.28s cubic-bezier(0.16, 1, 0.3, 1);
}

.chat-ref-panel .chat-ref-tab--drag-source .chat-ref-tab-label {
    opacity: 0;
}

.chat-ref-panel .chat-ref-tab-strip.chat-ref-tab-strip--drag-active {
    cursor: grabbing;
    overflow: visible;
}

.chat-ref-panel .chat-ref-tab-strip.chat-ref-tab-strip--reorder-mode {
    overflow: visible;
}

.chat-ref-panel .chat-ref-tab-strip.chat-ref-tab-strip--detach-hint {
    outline: none;
    border-radius: 8px 8px 0 0;
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--chat-wa-2000) 28%, transparent);
    background: color-mix(in srgb, var(--chat-wa-2000) 5%, transparent);
    transition: box-shadow 0.32s cubic-bezier(0.16, 1, 0.3, 1), background 0.32s ease;
}

/* Yüzen sekme şeride geri sürüklenirken: yalnız üst bar / sekme önizlemesi (pencere gizli) */
.chat-ref-panel .chat-ref-tab-strip.chat-ref-tab-strip--float-dock-preview {
    outline: none;
    border-radius: 8px 8px 0 0;
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 18%, transparent);
    background: color-mix(in srgb, var(--accent) 5%, var(--chat-bg));
    transition: background 0.2s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.2s ease;
}

.chat-ref-panel .chat-ref-tab.chat-ref-tab--float-dock-preview {
    pointer-events: none;
    opacity: 1;
    border-style: solid;
    border-width: 1px 1px 0 1px;
    border-color: var(--chat-wa-600);
    background: var(--chat-right-panel-bg);
    color: var(--chat-wa-9500);
    z-index: 2;
    box-shadow:
        0 -1px 0 color-mix(in srgb, var(--accent) 28%, transparent),
        0 3px 14px rgba(0, 0, 0, 0.14);
}

/* Şeride “oturdu” anda pencere tamamen kaybolur; sürükleme pointer-capture başlıkta devam eder */
.chat-ref-float-window.chat-ref-float-window--near-strip {
    opacity: 0 !important;
    visibility: hidden;
    pointer-events: none;
    box-shadow: none;
    border-color: transparent;
}

body.chat-ref-tab-dragging-body .chat-ref-panel .mevzuat-sidebar-content.chat-ref-panel-tabbed {
    overflow: visible;
}

body.chat-ref-tab-dragging-body {
    cursor: grabbing !important;
    -webkit-user-select: none;
    user-select: none;
}

/* Sürüklenen sekme başlığı hayaleti — şerit stiline uygun üst yuvarlak sekme görünümü */
.chat-ref-tab-drag-ghost {
    position: fixed;
    z-index: 100000;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: 6px 8px 8px 8px;
    margin: 0;
    border-radius: 6px 6px 0 0;
    border: 1px solid var(--chat-wa-600);
    border-bottom: none;
    box-sizing: border-box;
    background: var(--chat-right-panel-bg);
    color: var(--chat-wa-9500);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.35);
    cursor: grabbing;
    pointer-events: none;
    font-size: 11px;
    font-weight: 500;
    line-height: 1.25;
}

.chat-ref-tab-drag-ghost--active {
    background: var(--chat-right-panel-bg);
    border-color: var(--chat-wa-600);
    color: var(--chat-wa-9500);
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.32);
}

.chat-ref-tab-drag-ghost--inactive {
    background: rgba(0, 0, 0, 0.22);
    border-color: transparent;
    color: var(--chat-wa-5000);
    box-shadow: 0 10px 26px rgba(0, 0, 0, 0.3);
}

.chat-ref-tab-drag-ghost-inner {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
    flex: 1;
    text-align: left;
}

body.chat-ref-tab-dragging-body .chat-ref-tab-drag-ghost.chat-ref-tab-drag-ghost--lifted {
    transform-origin: center top;
    transition: box-shadow 0.34s cubic-bezier(0.16, 1, 0.3, 1), transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    transform: scale(1.022);
}

body.chat-ref-tab-dragging-body .chat-ref-tab-drag-ghost.chat-ref-tab-drag-ghost--lifted.chat-ref-tab-drag-ghost--active {
    box-shadow: 0 18px 44px rgba(0, 0, 0, 0.2);
}

body.chat-ref-tab-dragging-body .chat-ref-tab-drag-ghost.chat-ref-tab-drag-ghost--lifted.chat-ref-tab-drag-ghost--inactive {
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.2);
}

@media (prefers-reduced-motion: reduce) {
    body.chat-ref-tab-dragging-body .chat-ref-tab-drag-ghost.chat-ref-tab-drag-ghost--lifted {
        transform: none;
        transition: none;
    }
}

/* Sekme içeriği panel dışına sürüklenince açılan yüzen pencere (DOM body’de; .chat-ref-panel stilleri burada tekrarlanır) */
.chat-ref-float-window {
    position: fixed;
    z-index: 100050;
    left: auto;
    top: auto;
    transform: none;
    width: min(480px, 92vw);
    height: min(72vh, 720px);
    min-width: 320px;
    min-height: min(360px, 55vh);
    max-width: 96vw;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    background: var(--chat-right-panel-bg);
    color: var(--chat-text-body);
    border: var(--chat-card-border);
    border-radius: 10px;
    box-shadow: var(--chat-card-shadow);
    overflow: hidden;
    box-sizing: border-box;
    font-family: var(--chat-font);
}

.chat-ref-float-window.chat-ref-float-window--preview {
    opacity: 0.65;
    pointer-events: none;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.18);
    border-style: dashed;
    border-width: 1px;
    border-color: color-mix(in srgb, var(--accent) 55%, var(--chat-wa-600));
    background: color-mix(in srgb, var(--chat-right-panel-bg) 80%, rgba(0, 0, 0, 0.08));
    backdrop-filter: blur(4px);
}

@media (prefers-reduced-motion: reduce) {
    .chat-ref-float-window.chat-ref-float-window--preview {
        backdrop-filter: none;
    }
}

@keyframes chatRefFloatSpawn {
    from {
        opacity: 0;
        transform: translate3d(0, 14px, 0) scale(0.982);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1);
    }
}

.chat-ref-float-window.chat-ref-float-window--spawn {
    animation: chatRefFloatSpawn 0.44s cubic-bezier(0.16, 1, 0.3, 1) both;
    transform-origin: 50% 12%;
}

@media (prefers-reduced-motion: reduce) {
    .chat-ref-float-window.chat-ref-float-window--spawn {
        animation: none;
    }
}

/* Yüzen pencere: tüm sütun zinciri panel genişliğine sığsın (metin / buton taşması) */
.chat-ref-float-window .chat-ref-float-body,
.chat-ref-float-window .chat-ref-float-pane-wrap,
.chat-ref-float-window .chat-ref-float-tab-pane {
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

.chat-ref-float-window .mevzuat-sidebar-header-start {
    flex-wrap: wrap;
    align-items: center;
    min-width: 0;
    max-width: 100%;
}

.chat-ref-float-window .mevzuat-sidebar-header-start .mevzuat-sidebar-back-btn {
    flex-shrink: 0;
}

.chat-ref-float-window .mevzuat-sidebar-header-start h3 {
    min-width: 0;
    overflow-wrap: anywhere;
    word-break: break-word;
    white-space: normal;
}

/* Yüzen pencere içi = sağ panel ile aynı flex zinciri (içtihat/mevzuat içeriği görünsün) */
.chat-ref-float-window .chat-ref-float-body {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.chat-ref-float-window .chat-ref-float-body .mevzuat-sidebar-content {
    position: static;
    transform: none;
    flex: 1;
    min-width: 0;
    min-height: 0;
    height: auto;
    display: flex;
    flex-direction: column;
    box-shadow: none;
    overflow: hidden;
}

.chat-ref-float-window .chat-ref-float-pane-wrap {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.chat-ref-float-window .chat-ref-float-tab-pane {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.chat-ref-float-window .chat-ref-tab-pane > .mevzuat-sidebar-header.chat-ref-panel-tab-pane-header {
    flex-shrink: 0;
}

.chat-ref-float-window .mevzuat-sidebar-body.chat-ref-panel-body--split {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    padding: 0;
}

.chat-ref-float-window .mevzuat-sidebar-body.chat-ref-panel-body--split > :not(.chat-ref-panel-scroll) {
    flex-shrink: 0;
}

.chat-ref-float-window .mevzuat-sidebar-header {
    background: var(--chat-right-panel-bg);
    border-bottom: 1px solid var(--chat-border);
    padding: 12px 18px 12px 22px;
    flex-shrink: 0;
    flex-wrap: wrap;
    align-items: flex-start;
    row-gap: 8px;
    min-width: 0;
    max-width: 100%;
}

.chat-ref-float-window .mevzuat-sidebar-header h3,
.chat-ref-float-window .mevzuat-sidebar-header-start h3 {
    color: var(--chat-text-emphasis);
}

.chat-ref-float-window .mevzuat-sidebar-detail-title-wrap {
    margin: 0;
    padding: 12px 18px 12px 22px;
    background: var(--chat-right-panel-bg);
    border-bottom: 1px solid color-mix(in srgb, var(--chat-border) 28%, transparent);
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
}

.chat-ref-float-window .mevzuat-sidebar-detail-title-wrap.chat-karar-kunye-wrap {
    margin: 0;
    position: relative;
    padding-bottom: 13px;
    border-bottom: none !important;
}

.chat-ref-float-window .chat-ref-panel-scroll {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    max-width: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    overflow-wrap: anywhere;
    word-wrap: break-word;
    word-break: break-word;
    padding: 18px 18px 18px 22px;
    padding-right: calc(18px + var(--chat-panel-scrollbar-content-gap));
    box-sizing: border-box;
}

.chat-ref-float-window .chat-ref-tools {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
    flex-shrink: 0;
    padding-left: 22px;
    padding-right: 18px;
}

.chat-ref-float-window .chat-ref-search-wrap {
    flex: 1 1 160px;
    min-width: 0;
    max-width: 100%;
}

.chat-ref-float-window .chat-ref-tools-actions {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    min-width: 0;
    max-width: 100%;
}

.chat-ref-float-window .chat-ref-float-header {
    flex-shrink: 0;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 8px 10px;
    background: var(--chat-wa-400);
    border-bottom: 1px solid var(--chat-wa-800);
    cursor: grab;
    user-select: none;
    -webkit-user-select: none;
}

.chat-ref-float-window .chat-ref-float-header.is-dragging-header {
    cursor: grabbing;
}

.chat-ref-float-window .chat-ref-float-title {
    flex: 1;
    min-width: 0;
    font-size: 12px;
    font-weight: 600;
    color: var(--chat-wa-9500);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.chat-ref-float-window .chat-ref-float-close {
    flex-shrink: 0;
    width: 30px;
    height: 30px;
    padding: 0;
    border: none;
    border-radius: 6px;
    background: transparent;
    color: var(--chat-wa-7000);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s ease, color 0.15s ease;
}

.chat-ref-float-window .chat-ref-float-close:hover {
    background: var(--chat-wa-600);
    color: var(--chat-wa-9500);
}

.chat-ref-float-window .chat-ref-open-full-btn {
    padding: 6px 12px;
    font-size: 12px;
    background: var(--chat-surface-alt);
    border: 1px solid var(--chat-border);
    border-radius: 6px;
    color: var(--chat-text-secondary);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    white-space: normal;
    text-align: center;
    flex: 1 1 auto;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}

.chat-ref-float-window .chat-ref-panel-header-ictihat,
.chat-ref-float-window .chat-ref-panel-header-mevzuat {
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 8px;
    padding: 12px 18px 12px 22px;
    min-width: 0;
}

.chat-ref-float-window .chat-ref-panel-header-ictihat h3,
.chat-ref-float-window .chat-ref-panel-header-mevzuat h3 {
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
    flex: 1 1 auto;
    min-width: 0;
}

.chat-ref-float-window .chat-ref-panel-header-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex: 1 1 auto;
    min-width: 0;
    max-width: 100%;
    margin-left: 0;
    box-sizing: border-box;
}

.chat-ref-float-window .chat-ref-panel-inner {
    display: flex;
    flex-direction: row;
    width: 100%;
    height: 100%;
    min-height: 0;
    position: relative;
    overflow: hidden;
}

/* Yüzen pencerede içtihat künyesi / metin taşması — flex zincirinde min-width: 0 */
.chat-ref-float-window .chat-karar-kunye {
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
}

.chat-ref-float-window .chat-karar-kunye-top {
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 8px 10px;
}

.chat-ref-float-window .chat-karar-kunye-heading {
    flex: 1 1 auto;
    flex-shrink: 1;
    min-width: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
    word-break: break-word;
    white-space: normal;
}

.chat-ref-float-window .mevzuat-sidebar-detail-title-wrap.chat-karar-kunye-wrap::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: 6px;
    transform: translateX(-50%);
    width: calc(100% - 20px);
    max-width: 100%;
    height: 1px;
    border-radius: 999px;
    pointer-events: none;
    background: linear-gradient(
        90deg,
        transparent 0%,
        color-mix(in srgb, var(--accent-2) 22%, transparent) 10%,
        color-mix(in srgb, var(--accent-2) 30%, transparent) 50%,
        color-mix(in srgb, var(--accent-2) 22%, transparent) 90%,
        transparent 100%
    );
}

.chat-ref-float-window .chat-karar-kunye-line,
.chat-ref-float-window .chat-karar-kunye-value {
    overflow-wrap: anywhere;
    word-break: break-word;
}

.chat-ref-float-window button.chat-karar-kunye-copy-wrap {
    flex-shrink: 1;
    min-width: 0;
    max-width: 100%;
}

.chat-ref-float-window .chat-karar-kunye-copy-labels {
    min-width: 0;
    overflow-wrap: anywhere;
}

/* Tek sekme yüzeye alındığında boş dock alanı (Chrome benzeri) */
.chat-ref-panel.chat-ref-panel--dock-empty .chat-ref-tab-pane--dock-empty {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: center;
    flex: 1;
    min-height: 0;
    padding: 12px;
    box-sizing: border-box;
}

.chat-ref-panel-dock-zone--minimal {
    flex: 1;
    min-height: 100px;
    margin: 0;
    border: 1px dashed color-mix(in srgb, var(--chat-wa-2000) 55%, transparent);
    border-radius: 10px;
    background: color-mix(in srgb, var(--chat-right-panel-bg) 94%, var(--chat-wa-400));
}

.chat-ref-tab-strip--dock-empty {
    min-height: 10px;
    border-bottom: 1px solid var(--chat-wa-600);
    background: rgba(0, 0, 0, 0.12);
}

.chat-main-wrap.has-ref-panel .chat-ref-panel.chat-ref-panel--mounting .chat-ref-panel-tabbed {
    opacity: 0;
    transform: translateY(8px);
}

.chat-main-wrap.has-ref-panel .chat-ref-panel.chat-ref-panel--mounted .chat-ref-panel-tabbed {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.34s cubic-bezier(0.22, 1, 0.36, 1), transform 0.38s cubic-bezier(0.22, 1, 0.36, 1);
}

@media (prefers-reduced-motion: reduce) {
    .chat-ref-panel .chat-ref-tab,
    .chat-ref-panel .chat-ref-tab-pane,
    .chat-main-wrap.has-ref-panel .chat-ref-panel.chat-ref-panel--mounted .chat-ref-panel-tabbed {
        transition: none !important;
        animation: none !important;
    }
    .chat-ref-panel .chat-ref-tab-pane--enter,
    .chat-ref-panel .chat-ref-tab--appear {
        animation: none !important;
    }
}

.chat-ref-panel .chat-ref-tab-pane > .mevzuat-sidebar-header.chat-ref-panel-tab-pane-header {
    flex-shrink: 0;
}

/* Tek scroll: iç içe overflow yok; gövde sabit, sadece .chat-ref-panel-scroll kayar */
.chat-ref-panel .mevzuat-sidebar-body.chat-ref-panel-body--split {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    overflow: hidden;
    padding: 16px;
    scrollbar-gutter: auto;
}

.chat-ref-panel .mevzuat-sidebar-body.chat-ref-panel-body--split > :not(.chat-ref-panel-scroll) {
    flex-shrink: 0;
}

/* Panel scrollbar — tek tanım (çakışma yok); sağ rail görünür, ince pro görünüm */
.chat-ref-panel-scroll,
.de-editor-wrapper,
.mevzuat-sidebar-body,
.chat-citation-card-list,
.chat-citation-sidepanel-body {
    scrollbar-width: thin;
    scrollbar-color: var(--chat-panel-scrollbar-thumb) var(--chat-panel-scrollbar-track);
}

.chat-ref-panel-scroll::-webkit-scrollbar,
.de-editor-wrapper::-webkit-scrollbar,
.mevzuat-sidebar-body::-webkit-scrollbar,
.chat-citation-card-list::-webkit-scrollbar,
.chat-citation-sidepanel-body::-webkit-scrollbar {
    width: var(--chat-panel-scrollbar-width);
}

.chat-ref-panel-scroll::-webkit-scrollbar-track,
.de-editor-wrapper::-webkit-scrollbar-track,
.mevzuat-sidebar-body::-webkit-scrollbar-track,
.chat-citation-card-list::-webkit-scrollbar-track,
.chat-citation-sidepanel-body::-webkit-scrollbar-track {
    background: var(--chat-panel-scrollbar-track);
    border-radius: 6px;
}

.chat-ref-panel-scroll::-webkit-scrollbar-thumb,
.de-editor-wrapper::-webkit-scrollbar-thumb,
.mevzuat-sidebar-body::-webkit-scrollbar-thumb,
.chat-citation-card-list::-webkit-scrollbar-thumb,
.chat-citation-sidepanel-body::-webkit-scrollbar-thumb {
    background-color: var(--chat-panel-scrollbar-thumb);
    border-radius: 6px;
    min-height: 40px;
    border: 2px solid transparent;
    background-clip: padding-box;
}

.chat-ref-panel-scroll::-webkit-scrollbar-thumb:hover,
.de-editor-wrapper::-webkit-scrollbar-thumb:hover,
.mevzuat-sidebar-body::-webkit-scrollbar-thumb:hover,
.chat-citation-card-list::-webkit-scrollbar-thumb:hover,
.chat-citation-sidepanel-body::-webkit-scrollbar-thumb:hover {
    background-color: var(--chat-panel-scrollbar-thumb-hover);
}

.chat-ref-panel-scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    scrollbar-gutter: stable;
    padding-right: var(--chat-panel-scrollbar-content-gap);
    box-sizing: border-box;
    font-size: 14px;
    line-height: 1.8;
    color: var(--chat-text);
    text-align: justify;
}

.chat-ref-panel-scroll--pre {
    white-space: pre-wrap;
}

/* Sağ ref panel (içtihat / mevzuat): panel yüzeyi (açık tema: light-chat.css) */
.chat-ref-panel .mevzuat-sidebar-header {
    background: var(--chat-right-panel-bg);
    border-bottom: 1px solid var(--chat-border);
    padding: 12px 16px;
}

.chat-ref-panel .mevzuat-sidebar-header h3,
.chat-ref-panel .mevzuat-sidebar-header-start h3 {
    color: var(--chat-text-emphasis);
}

.chat-ref-panel .mevzuat-sidebar-close {
    color: var(--chat-wa-7800);
}

.chat-ref-panel .mevzuat-sidebar-close:hover {
    background: var(--chat-wa-800);
    color: var(--chat-text-emphasis);
}

.chat-ref-panel .mevzuat-sidebar-body.chat-ref-panel-body--split {
    padding: 0;
}

.chat-ref-panel .mevzuat-sidebar-detail-title-wrap {
    margin: 0;
    padding: 12px 16px;
    background: var(--chat-right-panel-bg);
    border-bottom: 1px solid color-mix(in srgb, var(--chat-border) 28%, transparent) !important;
}

/* Künye ↔ araç: tam genişlik border yok — ortada kısa, soluk, yumuşak uçlu çizgi */
.chat-ref-panel .mevzuat-sidebar-detail-title-wrap.chat-karar-kunye-wrap {
    margin: 0;
    position: relative;
    padding-bottom: 13px;
    border-bottom: none !important;
}

.chat-ref-panel .mevzuat-sidebar-detail-title-wrap.chat-karar-kunye-wrap::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: 6px;
    transform: translateX(-50%);
    width: calc(100% - 20px);
    max-width: 100%;
    height: 1px;
    border-radius: 999px;
    pointer-events: none;
    background: linear-gradient(
        90deg,
        transparent 0%,
        color-mix(in srgb, var(--accent-2) 22%, transparent) 10%,
        color-mix(in srgb, var(--accent-2) 30%, transparent) 50%,
        color-mix(in srgb, var(--accent-2) 22%, transparent) 90%,
        transparent 100%
    );
}

.chat-ref-panel .chat-karar-kunye-accent-line {
    display: none;
}

.chat-ref-panel .chat-ref-tools {
    flex-shrink: 0;
    position: relative;
    background: var(--chat-right-panel-bg);
    border-top: none;
    border-bottom: none;
    margin: 0;
    padding: 8px 16px 13px;
}

.chat-ref-panel .chat-ref-tools::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: 6px;
    transform: translateX(-50%);
    width: calc(100% - 20px);
    max-width: 100%;
    height: 1px;
    border-radius: 999px;
    pointer-events: none;
    background: linear-gradient(
        90deg,
        transparent 0%,
        color-mix(in srgb, var(--accent-2) 16%, transparent) 10%,
        color-mix(in srgb, var(--accent-2) 20%, transparent) 50%,
        color-mix(in srgb, var(--accent-2) 16%, transparent) 90%,
        transparent 100%
    );
}

/* Sadece kopyala (İçtihat referansı — arama yok) */
.chat-ref-panel .chat-ref-tools.chat-ref-tools--no-search {
    justify-content: flex-end;
    padding-top: 6px;
    padding-bottom: 10px;
}

.chat-ref-panel .chat-ref-panel-scroll {
    background: var(--chat-right-panel-bg);
    padding: 16px;
    padding-right: calc(16px + var(--chat-panel-scrollbar-content-gap));
}

.chat-ref-panel .chat-ref-open-full-btn {
    border-color: var(--chat-border);
    color: var(--chat-text-secondary);
    background: var(--chat-wa-500);
}

.chat-ref-panel .chat-ref-open-full-btn:hover {
    border-color: var(--chat-wa-1500);
    background: var(--chat-wa-800);
    color: var(--chat-text-emphasis);
}

.chat-ref-panel .chat-ref-yorum-label {
    font-weight: 700;
    font-size: 14px;
    color: var(--chat-primary);
    margin-bottom: 8px;
    padding-bottom: 0;
    border-bottom: none;
    text-transform: none;
    letter-spacing: 0.01em;
    font-variant: normal;
}

/* İçtihat yorum metni: Türkçe (DM Sans’tan bağımsız yerel glif; locl) */
.chat-ref-panel .chat-ref-panel-scroll[lang="tr"] {
    font-family: system-ui, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
    font-synthesis: none;
    font-feature-settings: "locl" 1;
    text-rendering: optimizeLegibility;
}

.chat-ref-panel .chat-ref-fihrist-fallback {
    margin-bottom: 0;
}

.chat-ref-panel .chat-karar-kunye-heading,
.chat-ref-panel .chat-mevzuat-kunye-heading {
    color: var(--chat-text-emphasis);
}

.chat-ref-panel .chat-karar-kunye-daire {
    color: var(--chat-text-emphasis);
}

.chat-ref-panel .chat-karar-kunye-line,
.chat-ref-panel .chat-karar-kunye-value {
    color: var(--chat-text);
}

.chat-ref-panel .chat-karar-kunye-label {
    color: var(--chat-text-muted);
}

.chat-ref-panel .mevzuat-sidebar-detail-title {
    color: var(--chat-text-emphasis);
}

.chat-ref-panel button.chat-karar-kunye-copy-wrap:hover {
    background: rgba(15, 23, 42, 0.06);
}

.chat-ref-panel button.chat-karar-kunye-copy-wrap:active {
    background: rgba(15, 23, 42, 0.1);
}

.chat-ref-panel .chat-karar-kunye-copy-line1,
.chat-ref-panel .chat-karar-kunye-copy-line2 {
    color: var(--chat-text-emphasis);
}

/* Header (ChatGPT Style) */
.chat-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 20px;
    min-height: 56px;
    background: var(--chat-bg);
    border-bottom: var(--chat-card-border);
    flex-shrink: 0;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    overflow-x: hidden;
    position: relative;
    z-index: 2;
}

.chat-header-title {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 1;
    min-width: 0;
}

.chat-header-title h2 {
    font-size: 15px;
    font-weight: 500;
    color: var(--chat-wa-9000);
    letter-spacing: -0.15px;
}

.chat-title-editable-wrap {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    flex: 1;
}
.chat-title-editable-wrap.is-editing {
    justify-content: flex-start;
}
.chat-title-editable-wrap.is-editing .chat-title-display {
    display: none;
}
.chat-title-edit-group {
    display: none;
    flex: 1;
    min-width: 0;
    max-width: 100%;
    align-items: center;
    justify-content: flex-start;
}
.chat-title-editable-wrap.is-editing .chat-title-edit-group {
    display: flex;
}
/* Tik, başlık metninin hemen yanında; 1fr sütun yok — çubuğun ucuna itilmez */
.chat-title-edit-inner {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    max-width: 100%;
    min-width: 0;
}
.chat-title-display {
    cursor: default;
    white-space: normal;
    overflow-wrap: break-word;
    word-break: break-word;
    line-height: 1.35;
    max-width: 100%;
    /* h2 ile aynı tipografi (düzenleme öncesi/sonrası boyut kayması olmasın) */
    font-size: 15px;
    font-weight: 500;
    color: var(--chat-wa-9000);
    letter-spacing: -0.15px;
    margin: 0;
}
/* Düzenleme sırasında da başlık normal metin gibi dursun, kutucuk görünmesin */
.chat-title-input {
    font-size: 15px;
    font-weight: 500;
    color: var(--chat-wa-9000);
    letter-spacing: -0.15px;
    background: transparent;
    border: none;
    border-radius: 0;
    padding: 0 0 2px;
    outline: none;
    width: auto;
    min-width: 12ch;
    max-width: 100%;
    line-height: 1.35;
    box-shadow: 0 1px 0 0 color-mix(in srgb, var(--chat-wa-9000) 22%, transparent);
    transition: box-shadow 0.15s ease, color 0.15s ease;
    field-sizing: content;
}
@supports not (field-sizing: content) {
    .chat-title-input {
        min-width: min(100%, 28ch);
        width: min(100%, 52ch);
    }
}
.chat-title-editable-wrap.is-editing .chat-title-input:focus {
    box-shadow: 0 1px 0 0 color-mix(in srgb, var(--accent) 55%, var(--chat-wa-9000));
}
.chat-title-input::placeholder {
    color: var(--chat-wa-4000);
}
.chat-title-input:focus {
    outline: none;
}
/* Yanındaki tik butonu minimal */
.chat-title-save-btn {
    flex-shrink: 0;
    width: 26px;
    height: 26px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    border-radius: 4px;
    color: var(--chat-wa-5000);
    cursor: pointer;
    transition: color 0.15s ease, background 0.15s ease;
}
.chat-title-save-btn:hover {
    color: rgba(34, 197, 94, 0.9);
    background: var(--chat-wa-600);
}
.chat-title-save-btn svg {
    width: 15px;
    height: 15px;
}

.chat-header-title span {
    font-size: 13px;
    color: var(--chat-text-muted);
    padding: 4px 12px;
    background: var(--chat-surface-alt);
    border-radius: var(--chat-radius-full);
}

/* Chat model label ("Lavren AI") */
#chat-model {
    color: var(--notr3);
    font-weight: 600;
}

.chat-header-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

.chat-readonly-badge {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.01em;
    color: var(--chat-wa-9400);
    background: color-mix(in srgb, var(--chat-warning) 22%, transparent);
    border: 1px solid color-mix(in srgb, var(--chat-warning) 42%, transparent);
    border-radius: 999px;
    padding: 5px 10px;
    line-height: 1;
    white-space: nowrap;
}

.chat-share-dialog {
    position: fixed;
    inset: 0;
    z-index: 2600;
    display: none;
}

.chat-share-dialog.is-visible {
    display: block;
}

.chat-share-dialog-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.55);
    backdrop-filter: blur(2px);
}

.chat-share-dialog-card {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: min(92vw, 640px);
    max-height: min(84vh, 760px);
    overflow: auto;
    background: color-mix(in srgb, var(--chat-bg) 90%, #11131a 10%);
    border: 1px solid var(--chat-wa-1400);
    border-radius: 16px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.46);
    padding: 22px 22px 18px;
    color: var(--chat-wa-9400);
}

.chat-share-dialog-close {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 30px;
    height: 30px;
    border: 1px solid var(--chat-wa-1000);
    border-radius: 999px;
    background: transparent;
    color: var(--chat-wa-7000);
    cursor: pointer;
    font-size: 20px;
    line-height: 1;
}

.chat-share-dialog-title {
    font-size: 18px;
    font-weight: 700;
    letter-spacing: -0.01em;
    margin: 0 0 8px;
    padding-right: 34px;
}

.chat-share-dialog-subtitle {
    font-size: 12px;
    color: var(--chat-wa-5000);
    margin: 0 0 14px;
    word-break: break-all;
}

.chat-share-dialog-description {
    margin: 0 0 14px;
    font-size: 13px;
    line-height: 1.5;
    color: var(--chat-wa-8200);
}

.chat-share-dialog-toggle-row {
    margin-bottom: 12px;
}

.chat-share-dialog-toggle {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    user-select: none;
}

.chat-share-dialog-toggle input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.chat-share-dialog-toggle-slider {
    width: 44px;
    height: 24px;
    border-radius: 999px;
    background: var(--chat-wa-700);
    border: 1px solid var(--chat-wa-1200);
    position: relative;
    transition: background 0.2s ease, border-color 0.2s ease;
}

.chat-share-dialog-toggle-slider::after {
    content: '';
    position: absolute;
    top: 2px;
    left: 2px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--chat-wa-9400);
    transition: transform 0.2s ease;
}

.chat-share-dialog-toggle input:checked + .chat-share-dialog-toggle-slider {
    background: color-mix(in srgb, var(--accent) 68%, var(--chat-bg));
    border-color: color-mix(in srgb, var(--accent) 52%, transparent);
    box-shadow: none;
}

.chat-share-dialog-toggle input:checked + .chat-share-dialog-toggle-slider::after {
    transform: translateX(20px);
}

.chat-share-dialog-toggle-label {
    font-size: 12px;
    color: var(--chat-wa-9000);
    font-weight: 600;
    line-height: 1.25;
}

.chat-share-dialog-link-row {
    display: flex;
    gap: 8px;
    align-items: center;
    margin-bottom: 10px;
}

.chat-share-dialog-link-row.is-disabled {
    opacity: 0.5;
}

.chat-share-dialog-link-row.is-disabled .chat-share-dialog-copy-btn {
    pointer-events: none;
}

.chat-share-dialog-link-input {
    flex: 1;
    min-width: 0;
    height: 40px;
    border: 1px solid var(--chat-wa-1200);
    border-radius: 10px;
    padding: 0 12px;
    background: var(--chat-wa-300);
    color: var(--chat-wa-9200);
    font-size: 12px;
}

.chat-share-dialog-copy-btn {
    height: 40px;
    border-radius: 10px;
    border: 1px solid var(--chat-wa-1200);
    background: var(--chat-wa-450);
    color: var(--chat-wa-9200);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.01em;
    cursor: pointer;
    padding: 0 14px;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.chat-share-dialog-copy-btn:hover {
    background: var(--chat-wa-700);
    border-color: var(--chat-wa-1800);
}

.chat-share-dialog-feedback {
    min-height: 20px;
    font-size: 12px;
    color: var(--chat-wa-7000);
    margin-bottom: 10px;
}

.chat-share-dialog-feedback.is-success {
    color: color-mix(in srgb, var(--chat-soft-green) 76%, var(--chat-wa-9000));
}

.chat-share-dialog-socials {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
}

.chat-share-dialog-socials.is-disabled {
    opacity: 0.45;
}

.chat-share-dialog-socials.is-disabled .chat-share-dialog-social-btn {
    pointer-events: none;
}

.chat-share-dialog-social-btn {
    width: 82px;
    border: none;
    background: transparent;
    color: var(--chat-wa-8800);
    text-decoration: none;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 6px;
    padding: 4px 2px;
    border-radius: 10px;
    transition: background 0.15s ease, color 0.15s ease;
}

.chat-share-dialog-social-btn:hover {
    background: var(--chat-wa-500);
    color: var(--chat-wa-9400);
}

.chat-share-dialog-social-icon {
    width: 38px;
    height: 38px;
    border-radius: 999px;
    border: 1px solid var(--chat-wa-1200);
    background: var(--chat-wa-450);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.chat-share-dialog-social-icon svg {
    width: 17px;
    height: 17px;
}

.chat-share-dialog-social-label {
    font-size: 11px;
    font-weight: 600;
    line-height: 1.1;
    letter-spacing: 0.01em;
}

.chat-share-dialog-notice {
    margin: 6px 0 10px;
    padding: 12px 14px;
    border-radius: 10px;
    font-size: 13px;
    line-height: 1.5;
}

.chat-share-dialog-notice.is-warn {
    border: 1px solid color-mix(in srgb, var(--chat-warning) 46%, transparent);
    background: color-mix(in srgb, var(--chat-warning) 12%, var(--chat-bg));
}

.chat-share-dialog-notice.is-error {
    border: 1px solid color-mix(in srgb, var(--chat-error) 46%, transparent);
    background: color-mix(in srgb, var(--chat-error) 12%, var(--chat-bg));
}

.chat-header-btn {
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    background: transparent;
    border: 1px solid var(--chat-wa-800);
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--chat-wa-6000);
    /* all kullanma — tema geçişinde renkler beyaza doğru interpolasyon yapıyor */
    transition:
        background 0.15s ease,
        border-color 0.15s ease,
        color 0.15s ease,
        opacity 0.15s ease;
}

.chat-header-btn:hover {
    background: var(--chat-wa-500);
    border-color: var(--chat-wa-1200);
    color: var(--chat-wa-9000);
}

.chat-header-btn:disabled {
    opacity: 0.45;
    cursor: not-allowed;
    background: transparent;
    border-color: var(--chat-wa-800);
    color: var(--chat-wa-5000);
}

/* Paylaş + Belge: dış kart sadece hover/focus anında görünsün */
.chat-share-btn,
.chat-dilekce-toggle:not(.active) {
    background: transparent;
    border-color: transparent;
}

.chat-share-btn {
    color: var(--chat-wa-8200);
}

.chat-share-btn:hover,
.chat-share-btn:focus-visible,
.chat-dilekce-toggle:not(.active):hover,
.chat-dilekce-toggle:not(.active):focus-visible {
    background: var(--chat-wa-500);
    border-color: var(--chat-wa-1200);
}

/* Sohbet herkese açıkken: paylaş — düz 2D (gölge/inset yok); ikon wa + hafif accent */
.chat-share-btn.chat-share-btn--public {
    border: 1px solid color-mix(in srgb, var(--accent) 48%, transparent);
    background: color-mix(in srgb, var(--accent) 40%, var(--chat-panel-surface));
    color: color-mix(in srgb, var(--accent) 22%, var(--chat-wa-6000) 78%);
    box-shadow: none;
}

.chat-share-btn.chat-share-btn--public:hover,
.chat-share-btn.chat-share-btn--public:focus-visible {
    border-color: color-mix(in srgb, var(--accent) 58%, transparent);
    background: color-mix(in srgb, var(--accent) 48%, var(--chat-panel-surface));
    color: color-mix(in srgb, var(--accent) 30%, var(--chat-wa-9000) 70%);
    box-shadow: none;
}

.chat-share-btn:disabled {
    border-color: transparent;
}

.chat-share-btn.chat-share-btn--public:disabled {
    opacity: 0.45;
    box-shadow: none;
}

.chat-theme-toggle {
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    padding: 0;
    background: transparent;
    border: 1px solid var(--chat-wa-800);
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--chat-wa-6000);
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
    position: relative;
}

.chat-theme-toggle:hover {
    background: var(--chat-wa-500);
    border-color: var(--chat-wa-1200);
    color: var(--chat-wa-9000);
}

.chat-theme-toggle svg {
    width: 18px;
    height: 18px;
}

.chat-theme-toggle .chat-theme-icon-moon {
    display: none;
}

html[data-chat-theme="light"] .chat-theme-toggle .chat-theme-icon-sun {
    display: none;
}

html[data-chat-theme="light"] .chat-theme-toggle .chat-theme-icon-moon {
    display: block;
}

/* Dilekçe header toggle button */
.chat-dilekce-toggle {
    display: none;
    position: relative;
    border-color: transparent;
    transition: all 0.2s ease;
}
.chat-dilekce-toggle.active {
    background: transparent;
    border-color: transparent;
    color: var(--chat-wa-9500);
}
.chat-dilekce-toggle.active::after {
    content: none;
}
.chat-dilekce-toggle.active:hover,
.chat-dilekce-toggle.active:focus-visible {
    background: var(--chat-wa-500);
    border-color: var(--chat-wa-1200);
}

/* Mobile Menu Toggle */
.chat-mobile-toggle {
    display: none;
}

/* Messages Container (ChatGPT Style) - yatay padding input container ile aynı (20px) */
.chat-messages {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 24px 20px;
    display: flex;
    flex-direction: column;
    gap: 0;
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
    box-sizing: border-box;
    scrollbar-width: thin;
    scrollbar-color: var(--chat-wa-1000) transparent;
    overflow-anchor: none;
}

.chat-messages::-webkit-scrollbar {
    width: 6px;
}

.chat-messages::-webkit-scrollbar-track {
    background: transparent;
}

.chat-messages::-webkit-scrollbar-thumb {
    background: var(--chat-wa-1000);
    border-radius: 3px;
    transition: background 0.2s ease;
}

.chat-messages::-webkit-scrollbar-thumb:hover {
    background: var(--chat-wa-1500);
}

/* Welcome Screen */
.chat-welcome {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding: 48px 24px;
    text-align: left;
    width: 100%;
    max-width: 100%;
    margin: 0;
    box-sizing: border-box;
    min-height: 0;
}

.chat-welcome-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
    width: 100%;
    padding-left: 24px;
}

.chat-welcome-logo {
    height: 36px;
    width: auto;
    max-width: min(200px, 42vw);
    display: block;
    object-fit: contain;
    object-position: left center;
    flex-shrink: 0;
}
.chat-welcome-logo--light {
    display: none;
    width: 36px;
    max-width: 36px;
    object-fit: contain;
}

.chat-welcome-greeting {
    font-size: 20px;
    font-weight: 600;
    color: var(--chat-text);
}

.chat-welcome-title {
    font-size: 36px;
    font-weight: 600;
    color: var(--chat-text);
    margin-bottom: 32px;
    letter-spacing: -0.3px;
    width: 100%;
    text-align: left;
    padding-left: 24px;
}

.chat-welcome p {
    font-size: 14px;
    color: var(--chat-text-secondary);
    max-width: 450px;
    margin-bottom: 36px;
}

/* Input Area in Welcome Screen */
.chat-input-area-welcome {
    width: 100%;
    max-width: 960px;
    margin: 0 auto 32px;
    box-sizing: border-box;
    padding: 0;
}

.chat-input-area-welcome .chat-input-container {
    max-width: 100%;
    width: 100%;
    margin: 0;
}

.chat-input-area-welcome .chat-input-wrapper {
    max-width: 100%;
    width: 100%;
}

/* Quick Actions (ChatGPT Style) */
.chat-quick-actions {
    display: flex;
    flex-direction: row;
    gap: 8px;
    max-width: 900px;
    width: 100%;
    box-sizing: border-box;
    padding: 0;
    margin: 0 auto;
    justify-content: center;
    flex-wrap: wrap;
}

.chat-quick-action {
    background: transparent;
    border: 1px solid var(--chat-wa-1200);
    border-radius: 12px;
    padding: 10px 16px;
    cursor: pointer;
    transition: all 0.15s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    width: auto;
    box-sizing: border-box;
    white-space: nowrap;
    position: relative;
    overflow: hidden;
}

.chat-quick-action::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--chat-wa-300);
    opacity: 0;
    transition: opacity 0.15s ease;
}

.chat-quick-action:hover {
    background: var(--chat-wa-500);
    border-color: var(--chat-wa-1600);
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.chat-quick-action:hover::before {
    opacity: 1;
}

.chat-quick-action:active {
    transform: translateY(0);
}

.chat-quick-action h3 {
    font-size: 13px;
    font-weight: 400;
    color: var(--chat-wa-8000);
    margin: 0;
    position: relative;
    z-index: 1;
    letter-spacing: -0.1px;
}

.chat-quick-action:hover h3 {
    color: var(--chat-wa-9500);
}

.chat-quick-action p {
    display: none;
}

/* Message Bubbles - Professional ChatGPT Style */
.chat-message {
    display: flex;
    gap: 16px;
    max-width: 800px;
    width: 100%;
    animation: messageSlide 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    box-sizing: border-box;
    min-width: 0;
    margin-bottom: 32px;
    padding: 0;
}

.chat-message.assistant {
    max-width: 960px;
    width: 100%;
}

@keyframes messageSlide {
    from { 
        opacity: 0; 
        transform: translateY(8px); 
    }
    to { 
        opacity: 1; 
        transform: translateY(0); 
    }
}

.chat-message.user {
    flex-direction: row-reverse;
    margin-left: auto;
}

.chat-message-avatar {
    width: 32px;
    height: 32px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 12px;
    font-weight: 600;
    transition: transform 0.2s ease;
}

.chat-message.assistant .chat-message-avatar {
    background: var(--chat-primary);
    color: var(--chat-text-inverse);
}

.chat-message.user .chat-message-avatar {
    background: var(--chat-primary);
    color: var(--chat-text-inverse);
}

.chat-message-content {
    background: transparent;
    border: none;
    border-radius: 0;
    padding: 0;
    width: fit-content;
    min-width: 0;
    max-width: calc(100% - 48px);
    font-size: 15px;
    line-height: 1.75;
    box-sizing: border-box;
    word-wrap: break-word;
    overflow-wrap: break-word;
    overflow-x: hidden;
    color: var(--chat-text);
}

/* Thinking message için özel stil */
#chat-thinking .chat-message-content {
    background: transparent;
    border: none;
    padding: 0;
    width: fit-content;
    max-width: calc(100% - 46px);
}

.chat-message-loading .chat-message-content {
    width: fit-content;
    max-width: calc(100% - 46px);
    min-width: 0;
    background: transparent;
    border: none;
    padding: 0;
}

.chat-message.user .chat-message-content {
    background: var(--chat-primary);
    border: none;
    border-radius: 12px;
    padding: 12px 16px;
    color: var(--chat-text-inverse);
    width: fit-content;
    max-width: calc(100% - 48px);
    margin-left: auto;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    white-space: pre-wrap;
}

/* Assistant message actions - her zaman görünür, hover'da hafif vurgu */
.chat-message.assistant .chat-message-body {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
}

/* Web search / doktrin kaynakçaları - chat tasarımına tam uyumlu */
.chat-message-content .chat-citation-wrap {
    position: relative;
    display: flex;
    width: fit-content;
    margin-top: 8px;
    align-items: center;
    justify-content: flex-start;
}

/* Küçük, nötr bir rozet – sayıyı gösterir (örn. 4+) */
.chat-citation-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-width: 22px;
    height: 24px;
    padding: 0 10px 0 8px;
    border-radius: var(--chat-radius-full);
    border: 1px solid rgba(132, 161, 181, 0.62);
    background:
        radial-gradient(140% 120% at 14% 6%, var(--chat-wa-3200) 0%, rgba(255, 255, 255, 0) 48%),
        linear-gradient(128deg, #84A1B5 0%, color-mix(in srgb, #84A1B5 30%, var(--accent) 70%) 46%, var(--accent) 100%);
    color: var(--chat-citation-badge-text);
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    box-shadow:
        0 8px 18px rgba(0, 0, 0, 0.22),
        inset 0 1px 0 var(--chat-wa-2500);
    letter-spacing: 0.1px;
}

.chat-citation-badge-icon {
    width: 13px;
    height: 13px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: inherit;
}

.chat-citation-badge-icon svg {
    width: 100%;
    height: 100%;
    display: block;
}

.chat-citation-badge-text {
    color: inherit;
    line-height: 1;
}

.chat-citation-badge:hover {
    border-color: rgba(132, 161, 181, 0.86);
    background:
        radial-gradient(140% 120% at 16% 8%, var(--chat-wa-3800) 0%, rgba(255, 255, 255, 0) 52%),
        linear-gradient(128deg, color-mix(in srgb, #84A1B5 92%, #fff 8%) 0%, color-mix(in srgb, #84A1B5 34%, var(--accent) 66%) 48%, color-mix(in srgb, var(--accent) 90%, #0b0b0c 10%) 100%);
    color: var(--chat-citation-badge-text);
    transform: translateY(-0.5px);
}

/* Hover / click ile açılan kaynak kartı */
.chat-citation-card {
    position: absolute;
    right: 0;
    bottom: 100%;
    margin-bottom: 8px;
    min-width: 260px;
    max-width: 360px;
    padding: 10px 11px 9px;
    border-radius: var(--chat-radius-lg);
    background: radial-gradient(circle at top left, rgba(19, 21, 28, 0.98), rgba(12, 14, 20, 0.98));
    border: 1px solid var(--chat-border);
    box-shadow:
        0 20px 40px rgba(0, 0, 0, 0.54),
        0 0 0 1px rgba(0, 0, 0, 0.5);
    font-size: 11px;
    color: var(--chat-text-body);
    z-index: 40;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.14s var(--chat-ease);
    max-height: min(360px, 52vh);
    overflow: hidden;
}

.chat-citation-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 6px;
    font-weight: 500;
    color: var(--chat-text-emphasis);
}

.chat-citation-card-counter {
    font-size: 10px;
    color: var(--chat-text-muted);
}

.chat-citation-card-list {
    list-style: none;
    padding: 0;
    margin: 0;
    max-height: calc(min(360px, 52vh) - 34px);
    overflow-y: auto;
    padding-right: 2px;
}

.chat-citation-card-item + .chat-citation-card-item {
    margin-top: 4px;
    padding-top: 4px;
    border-top: 1px solid var(--chat-wa-400);
}

.chat-citation-card-link {
    color: var(--chat-ref-color);
    text-decoration: none;
    font-weight: 500;
}

.chat-citation-card-link:hover {
    text-decoration: underline;
}

/* web_search grounding: [ ve , ile sayılar tek üst-simge biriminde */
.chat-message-content .chat-web-cite-wrap {
    display: inline;
    white-space: nowrap;
    vertical-align: super;
    font-size: 0.82em;
    line-height: 1.2;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: color-mix(in srgb, var(--chat-ref-color, #2563eb) 72%, var(--chat-text-muted, #64748b));
}
.chat-message-content .chat-web-cite-wrap + .chat-web-cite-wrap {
    margin-left: 0.06em;
}
.chat-message-content .chat-web-cite-wrap .chat-web-cite-link {
    display: inline;
    vertical-align: baseline;
    font-size: inherit;
    font-weight: 700;
    color: var(--chat-ref-color, #2563eb);
    text-decoration: none;
    margin: 0 0.03em;
}
.chat-message-content .chat-web-cite-wrap .chat-web-cite-link:hover {
    text-decoration: underline;
}
.chat-message-content .chat-web-cite-wrap .chat-web-cite-nourl {
    display: inline;
    vertical-align: baseline;
    font-size: inherit;
    font-weight: 600;
    color: var(--chat-text-muted);
    cursor: default;
}

.chat-citation-card-snippet {
    margin-top: 1px;
    font-size: 10px;
    color: var(--chat-text-muted);
}

/* Sol kaynak paneli: uzun, ince çizgili, kaydırılabilir */
.chat-citation-sidepanel {
    position: absolute;
    left: var(--chat-citation-panel-left);
    top: 72px;
    bottom: auto;
    width: var(--chat-citation-panel-width);
    min-width: 0;
    border: 1px solid var(--chat-wa-1200);
    border-radius: 14px;
    background: linear-gradient(
        180deg,
        color-mix(in srgb, var(--chat-bg) 94%, transparent),
        color-mix(in srgb, var(--chat-bg) 82%, var(--dark-accent-3) 18%)
    );
    backdrop-filter: blur(6px);
    box-shadow: 0 22px 42px rgba(0, 0, 0, 0.38);
    z-index: 14;
    opacity: 0;
    transform: translateX(14px);
    pointer-events: none;
    transition: opacity 0.2s var(--chat-ease), transform 0.2s var(--chat-ease);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    max-height: 72vh;
    height: auto;
}

.chat-citation-mobile-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(4, 6, 10, 0.45);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.18s ease;
    z-index: 13;
}

.chat-citation-mobile-backdrop.is-open {
    opacity: 1;
    pointer-events: auto;
}

.chat-citation-sidepanel.is-open {
    opacity: 1;
    transform: translateX(0);
    pointer-events: auto;
}

.chat-citation-sidepanel.is-mobile-modal {
    position: fixed;
    left: 50% !important;
    top: 50% !important;
    bottom: auto !important;
    width: min(88vw, 360px) !important;
    transform: translate(-50%, -50%) translateY(18px);
    opacity: 0;
    pointer-events: none;
    transition:
        opacity 0.24s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.28s cubic-bezier(0.22, 1, 0.36, 1);
    z-index: 20;
    border-radius: 12px;
}

.chat-citation-sidepanel.is-mobile-modal.is-mobile-prep {
    transition: none !important;
}

.chat-citation-sidepanel.is-mobile-modal.is-open {
    transform: translate(-50%, -50%) translateY(0) !important;
    opacity: 1;
    pointer-events: auto;
}

.chat-citation-sidepanel-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    padding: 12px 12px 10px;
    border-bottom: 1px solid var(--chat-wa-800);
}

.chat-citation-sidepanel-title-wrap {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.chat-citation-sidepanel-title {
    font-size: 13px;
    font-weight: 600;
    color: var(--chat-text-emphasis);
    letter-spacing: 0.1px;
}

.chat-citation-sidepanel-counter {
    font-size: 11px;
    color: var(--chat-text-muted);
}

.chat-citation-sidepanel-close {
    width: 20px;
    height: 20px;
    border: 1px solid var(--chat-wa-1600);
    border-radius: 6px;
    background: transparent;
    color: var(--chat-wa-8600);
    cursor: pointer;
    font-size: 14px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.chat-citation-sidepanel-close:hover {
    color: var(--chat-text-emphasis);
    border-color: var(--chat-wa-3000);
    background: var(--chat-wa-800);
}

.chat-citation-sidepanel-body {
    flex: 0 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 8px 10px 12px 12px;
    max-height: 60vh;
}

.chat-citation-sidepanel-list {
    margin: 0;
    padding: 0 0 0 18px;
}

.chat-citation-sidepanel-item + .chat-citation-sidepanel-item {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid var(--chat-wa-600);
}

.chat-citation-sidepanel-link {
    color: var(--chat-ref-color);
    font-size: 12px;
    text-decoration: none;
    font-weight: 500;
    line-height: 1.4;
    word-break: break-word;
}

.chat-citation-sidepanel-link:hover {
    color: #efe9b8;
    text-decoration: underline;
}

.chat-citation-sidepanel-snippet {
    margin-top: 4px;
    font-size: 11px;
    color: var(--chat-text-muted);
    line-height: 1.45;
}

@media (max-width: 1180px) {
    .chat-main-wrap {
        --chat-citation-panel-width: clamp(158px, 18vw, 230px);
        --chat-citation-panel-left: max(14px, calc((100% - 860px) / 2 + 18px));
        --chat-citation-panel-gap: 8px;
    }
}

@media (max-width: 900px) {
    .chat-main-wrap {
        --chat-citation-panel-width: clamp(148px, 18vw, 205px);
        --chat-citation-panel-left: 8px;
        --chat-citation-panel-gap: 6px;
    }
}

@media (max-width: 900px) {
    .chat-citation-sidepanel {
        transition: opacity 0.2s var(--chat-ease), transform 0.2s var(--chat-ease);
    }
    .chat-citation-sidepanel {
        border-radius: 12px;
    }
    .chat-citation-sidepanel-header {
        padding: 11px 11px 9px;
    }
    .chat-citation-sidepanel.is-mobile-modal {
        transition:
            opacity 0.24s cubic-bezier(0.22, 1, 0.36, 1),
            transform 0.28s cubic-bezier(0.22, 1, 0.36, 1) !important;
        will-change: transform, opacity;
    }
}
.chat-message.assistant .chat-message-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    opacity: 1;
    min-height: 26px;
    margin-top: 6px;
    padding: 0;
    transition: opacity 0.2s ease;
    flex-shrink: 0;
}
.chat-message.assistant .chat-message-actions-btn {
    width: 26px;
    height: 26px;
    background: transparent;
    border: 1px solid var(--chat-wa-800);
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--chat-wa-4500);
    transition: all 0.15s ease;
}
.chat-message.assistant .chat-message-actions-btn:hover {
    color: var(--chat-wa-8500);
    border-color: var(--chat-wa-1600);
    background: var(--chat-wa-800);
    transform: translateY(-0.5px);
}
.chat-message.assistant .chat-message-actions-btn.chat-message-copy-btn:hover {
    background: var(--chat-wa-1000);
}
.chat-message.assistant .chat-message-actions-btn.chat-message-report-error-btn:hover {
    background: rgba(251, 191, 36, 0.12);
    border-color: rgba(251, 191, 36, 0.35);
    color: rgba(253, 224, 138, 0.95);
}
.chat-message.assistant .chat-message-actions-btn svg {
    width: 13px;
    height: 13px;
    stroke-width: 1.75;
}

/* Asistan mesajı: tarih/saat — kopyala/hata ile aynı boyutta düğme, küçük popover */
.chat-message-ts-cluster {
    position: relative;
    display: inline-flex;
    flex-shrink: 0;
    vertical-align: middle;
}
.chat-message-timestamp-toggle {
    color: var(--chat-wa-4500);
}
.chat-message-timestamp-toggle:hover {
    color: var(--chat-wa-8500);
}
.chat-message-timestamp-toggle svg {
    display: block;
}
.chat-message-ts-cluster.is-open .chat-message-timestamp-toggle {
    color: var(--chat-wa-8500);
    border-color: var(--chat-wa-1600);
    background: var(--chat-wa-800);
}
.chat-message-timestamp-detail {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    z-index: 80;
    padding: 4px 9px;
    font-size: 10px;
    line-height: 1.35;
    font-weight: 500;
    letter-spacing: 0.02em;
    font-variant-numeric: tabular-nums;
    color: var(--chat-wa-7500);
    white-space: nowrap;
    user-select: none;
    text-align: center;
    border-radius: 6px;
    border: 1px solid var(--chat-wa-1200);
    background: color-mix(in srgb, var(--chat-wa-600) 92%, var(--chat-bg));
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.12);
    opacity: 0;
    visibility: hidden;
    /* Kapalı: sadece yukarı — scale yok (yatay sıçrama hissi vermesin) */
    transform: translateY(-12px);
    transform-origin: top center;
    transition:
        opacity 0.28s cubic-bezier(0.4, 0, 0.2, 1),
        visibility 0s linear 0.3s,
        transform 0.32s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
}
.chat-message-ts-cluster.is-open .chat-message-timestamp-detail {
    opacity: 1;
    visibility: visible;
    transition:
        opacity 0.2s cubic-bezier(0.22, 1, 0.36, 1),
        visibility 0s,
        transform 0.24s cubic-bezier(0.22, 1, 0.36, 1);
    transform: translateY(0);
    pointer-events: auto;
}

@media (prefers-reduced-motion: reduce) {
    .chat-message-timestamp-detail {
        transform: none;
        transition: opacity 0.12s ease, visibility 0.12s;
    }
    .chat-message-ts-cluster.is-open .chat-message-timestamp-detail {
        transform: none;
    }
}

.chat-message.assistant .chat-message-retry-wrap {
    margin-top: 10px;
    padding-top: 8px;
    border-top: 1px solid var(--chat-wa-600);
}
.chat-message.assistant .chat-retry-btn {
    font-size: 13px;
    font-weight: 500;
    padding: 8px 14px;
    border-radius: 8px;
    border: 1px solid var(--chat-wa-1400);
    background: var(--chat-wa-600);
    color: var(--chat-wa-8800);
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease;
}
.chat-message.assistant .chat-retry-btn:hover {
    background: var(--chat-wa-1000);
    border-color: var(--chat-wa-2200);
}

/* User message: solda düzenle (hover’da), sağda balon — dikey ortalı */
.chat-message.user .chat-message-body {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    max-width: calc(100% - 48px);
    margin-left: auto;
    width: fit-content;
}

.chat-message.user .chat-message-content {
    margin-left: 0;
    flex: 1 1 auto;
    min-width: 0;
    width: fit-content;
    max-width: 100%;
}

.chat-message.user .chat-message-text {
    display: block;
}

.chat-message.user .chat-message-user-stack {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 7px;
}

/* Ek varken satır AI ile aynı sohbet sütunu sol hizasında; balon gövdesi sağda kalır (.has-* JS ile) */
.chat-message.user.has-chat-message-attachments {
    max-width: 100%;
    width: 100%;
    margin-left: 0;
    margin-right: 0;
}

.chat-message.user.has-chat-message-attachments .chat-message-user-stack {
    align-items: flex-end;
}

.chat-message.user.has-chat-message-attachments .chat-message-body {
    align-self: flex-end;
}

/* Kullanıcı mesajında ekler: sağa hizalı satır — mesaj balonu gibi sağdan başlar */
.chat-message.user .chat-message-user-stack > .chat-message-attachments {
    display: block;
    width: fit-content;
    max-width: 100%;
    margin: 0 0 0 auto;
    align-self: flex-end;
    position: relative;
    box-sizing: border-box;
}

.chat-message.user .chat-message-user-stack > .chat-message-attachments .chat-message-attachments-list {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    gap: 6px;
    width: 100%;
    max-width: 100%;
    /* Wrapper sağa hizalı; az dosyada wrapper içeriğe sarılır ve doğal olarak sağa yapışır.
       Taşma yoksa padding 0 → chip'ler sağ kenara yapışır. */
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    overflow-x: auto;
    overflow-y: visible;
    touch-action: pan-x pinch-zoom;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
    -ms-overflow-style: none;
    -webkit-overflow-scrolling: touch;
    min-width: 0;
}

/* Taşma varsa sağdaki ok butonu için boşluk bırak */
.chat-message.user .chat-message-user-stack > .chat-message-attachments.is-attachments-overflow .chat-message-attachments-list {
    padding-right: 40px;
}

.chat-message.user .chat-message-user-stack > .chat-message-attachments .chat-message-attachments-list::-webkit-scrollbar {
    display: none;
}

.chat-message.user .chat-message-user-stack > .chat-message-attachments .chat-uploaded-file {
    min-height: 40px;
    padding: 8px 12px;
    gap: 8px;
    font-size: 13px;
    border-radius: 999px;
    max-width: min(220px, 66vw);
    flex: 0 0 auto;
}

.chat-message.user .chat-message-user-stack > .chat-message-attachments .chat-uploaded-file:hover,
.chat-message.user .chat-message-user-stack > .chat-message-attachments .chat-uploaded-image-thumb:hover {
    z-index: 9;
}

.chat-message.user .chat-message-user-stack > .chat-message-attachments .chat-uploaded-file-icon {
    width: 16px;
    height: 16px;
}

.chat-message.user .chat-message-user-stack > .chat-message-attachments .chat-uploaded-file-name {
    max-width: 180px;
    font-size: 13px;
}


.chat-message.user .chat-message-user-stack > .chat-message-attachments .chat-uploaded-image-thumb,
.chat-message.user .chat-message-user-stack > .chat-message-attachments .chat-uploaded-image-thumb img {
    width: 56px;
    height: 56px;
    border-radius: 9px;
    flex: 0 0 auto;
    flex-shrink: 0;
}

.chat-message-attachments-scroll-prev,
.chat-message-attachments-scroll-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    border-radius: 999px;
    border: 1px solid #0b0b0b;
    background: #0b0b0b;
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.16s ease, background 0.16s ease, border-color 0.16s ease;
    z-index: 50;
}

.chat-message-attachments-scroll-prev {
    left: 0;
    right: auto;
}

.chat-message-attachments-scroll-prev svg {
    transform: rotate(180deg);
}

.chat-message-attachments-scroll-next {
    right: 0;
    left: auto;
}

.chat-message-attachments:hover .chat-message-attachments-scroll-prev,
.chat-message-attachments:hover .chat-message-attachments-scroll-next,
.chat-message-attachments:focus-within .chat-message-attachments-scroll-prev,
.chat-message-attachments:focus-within .chat-message-attachments-scroll-next,
.chat-message.user .chat-message-user-stack:hover .chat-message-attachments-scroll-prev,
.chat-message.user .chat-message-user-stack:hover .chat-message-attachments-scroll-next,
.chat-message-attachments-scroll-prev:hover,
.chat-message-attachments-scroll-next:hover {
    opacity: 1;
    pointer-events: auto;
}

/* Dokunmatik / kalem: hover yok — ok her zaman tıklanabilir (taşma varken JS hidden kaldırır) */
@media (hover: none) {
    .chat-message-attachments-scroll-prev:not([hidden]),
    .chat-message-attachments-scroll-next:not([hidden]) {
        opacity: 1;
        pointer-events: auto;
    }
}

.chat-message-attachments-scroll-prev[hidden],
.chat-message-attachments-scroll-next[hidden] {
    display: none !important;
}

.chat-message-attachments-scroll-prev:hover,
.chat-message-attachments-scroll-next:hover {
    border-color: #0b0b0b;
    background: #0b0b0b;
}

html[data-chat-theme="light"] .chat-message-attachments-scroll-prev,
html[data-chat-theme="light"] .chat-message-attachments-scroll-next {
    background: #ffffff;
    border-color: rgba(15, 23, 42, 0.24);
    color: #111827;
}

.chat-message.user .chat-message-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    flex-shrink: 0;
    position: relative;
    align-self: center;
}

.chat-message.user .chat-message-actions-btn {
    width: 26px;
    height: 26px;
    background: transparent;
    border: 1px solid var(--chat-wa-1000);
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--chat-wa-5500);
    transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease, transform 0.2s ease;
}

.chat-message.user .chat-message-actions-btn:hover {
    color: var(--chat-wa-9000);
    border-color: var(--chat-wa-1800);
    background: var(--chat-wa-400);
    transform: translateY(-0.5px);
}

.chat-message.user .chat-message-actions-btn:active {
    transform: translateY(0);
    color: var(--chat-wa-7000);
}

.chat-message.user .chat-message-actions-btn svg {
    width: 13px;
    height: 13px;
    stroke-width: 1.75;
}

/* Mesaj düzenle: yalnızca son kullanıcıda; balonun solunda, yuvarlak, hafif çerçeve; hover / yaklaşınca görünür */
.chat-message.user:not(.is-last-user-for-edit) .chat-message-edit-btn-icon {
    display: none !important;
}

.chat-message.user.is-last-user-for-edit .chat-message-edit-btn-icon {
    width: 32px;
    height: 32px;
    border-radius: 9999px;
    border: none;
    background: color-mix(in srgb, var(--chat-wa-600) 55%, transparent);
    box-shadow:
        0 0 0 1px color-mix(in srgb, var(--chat-wa-2500) 65%, transparent),
        0 1px 3px rgba(0, 0, 0, 0.18);
    opacity: 0;
    transform: scale(0.94);
    pointer-events: none;
    transition:
        opacity 0.22s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.22s cubic-bezier(0.22, 1, 0.36, 1),
        background 0.18s ease,
        box-shadow 0.18s ease;
}

.chat-message.user.is-last-user-for-edit:hover .chat-message-edit-btn-icon,
.chat-message.user.is-last-user-for-edit:focus-within .chat-message-edit-btn-icon,
.chat-message.user.is-last-user-for-edit .chat-message-edit-btn-icon:focus-visible {
    opacity: 1;
    transform: scale(1);
    pointer-events: auto;
}

.chat-message.user.is-last-user-for-edit .chat-message-edit-btn-icon:hover {
    background: color-mix(in srgb, var(--chat-wa-1000) 70%, transparent);
    box-shadow:
        0 0 0 1px color-mix(in srgb, var(--chat-wa-3500) 55%, transparent),
        0 2px 8px rgba(0, 0, 0, 0.2);
    color: var(--chat-wa-9500);
}

@media (prefers-reduced-motion: reduce) {
    .chat-message.user.is-last-user-for-edit .chat-message-edit-btn-icon {
        transition: opacity 0.12s ease;
        transform: none;
    }
    .chat-message.user.is-last-user-for-edit:hover .chat-message-edit-btn-icon,
    .chat-message.user.is-last-user-for-edit:focus-within .chat-message-edit-btn-icon {
        transform: none;
    }
}

/* Dokunmatikte hover yok — düğme sürekli seçilebilir kalsın */
@media (hover: none) {
    .chat-message.user.is-last-user-for-edit .chat-message-edit-btn-icon {
        opacity: 1;
        transform: scale(1);
        pointer-events: auto;
    }
}

/* =================================================================
   KÜTÜPHANEYE KAYDET BUTONU (kullanıcı mesajı hover'ında)
   - tüm kullanıcı mesajlarında görünebilir, hover/focus ile beliren ikon
   ================================================================= */
.chat-message.user .chat-message-save-prompt-btn-icon {
    width: 32px;
    height: 32px;
    border-radius: 9999px;
    border: none;
    background: color-mix(in srgb, var(--chat-wa-600) 55%, transparent);
    box-shadow:
        0 0 0 1px color-mix(in srgb, var(--chat-wa-2500) 65%, transparent),
        0 1px 3px rgba(0, 0, 0, 0.18);
    color: var(--chat-wa-7000);
    opacity: 0;
    transform: scale(0.94);
    pointer-events: none;
    transition:
        opacity 0.22s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.22s cubic-bezier(0.22, 1, 0.36, 1),
        background 0.18s ease,
        box-shadow 0.18s ease,
        color 0.18s ease;
}

.chat-message.user .chat-message-save-prompt-btn-icon svg {
    width: 14px;
    height: 14px;
    stroke-width: 2;
    fill: none;
}

.chat-message.user:hover .chat-message-save-prompt-btn-icon,
.chat-message.user:focus-within .chat-message-save-prompt-btn-icon,
.chat-message.user .chat-message-save-prompt-btn-icon:focus-visible {
    opacity: 1;
    transform: scale(1);
    pointer-events: auto;
}

.chat-message.user .chat-message-save-prompt-btn-icon:hover {
    background: color-mix(in srgb, var(--chat-wa-1000) 70%, transparent);
    box-shadow:
        0 0 0 1px color-mix(in srgb, var(--chat-wa-3500) 55%, transparent),
        0 2px 8px rgba(0, 0, 0, 0.2);
    color: var(--chat-wa-9500);
}

.chat-message.user .chat-message-save-prompt-btn-icon.is-saved {
    color: #10b981;
}
.chat-message.user .chat-message-save-prompt-btn-icon.is-saved svg {
    fill: currentColor;
}

/* Düzenleme modunda gizle */
.chat-message.user.is-editing .chat-message-save-prompt-btn-icon {
    display: none !important;
}

@media (prefers-reduced-motion: reduce) {
    .chat-message.user .chat-message-save-prompt-btn-icon {
        transition: opacity 0.12s ease, color 0.12s ease;
        transform: none;
    }
    .chat-message.user:hover .chat-message-save-prompt-btn-icon,
    .chat-message.user:focus-within .chat-message-save-prompt-btn-icon {
        transform: none;
    }
}

@media (hover: none) {
    .chat-message.user .chat-message-save-prompt-btn-icon {
        opacity: 1;
        transform: scale(1);
        pointer-events: auto;
    }
}

/* Kopyala butonu wrapper - toast pozisyonu için */
.chat-message-copy-wrap {
    position: relative;
    display: inline-flex;
}

/* Kopyalandı bildirimi - butonun hemen altında, sola taşmayacak şekilde */
.chat-copy-toast {
    position: absolute;
    left: 0;
    transform: translateY(-4px);
    top: 100%;
    margin-top: 6px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0.03em;
    color: var(--chat-wa-9000);
    background: var(--chat-wa-800);
    border: 1px solid var(--chat-wa-1000);
    border-radius: 6px;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.35s ease, transform 0.35s ease;
    z-index: 10;
}

.chat-copy-toast.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.chat-copy-toast.is-hiding {
    opacity: 0;
    transform: translateY(4px);
    transition: opacity 0.4s ease, transform 0.4s ease;
}

/* Inline edit: same width as main input area (900px), same styles */
.chat-message.user.is-editing {
    max-width: 900px;
    width: 100%;
}

.chat-message.user.is-editing .chat-message-body {
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    max-width: 100%;
}

.chat-message.user.is-editing .chat-message-actions {
    display: none;
}

/* Düzenle kutusu: sadece genişlik sola doğru açılır / sağa doğru kapanır, pro */
.chat-message.user .chat-message-edit-wrapper {
    display: none;
    flex-direction: column;
    background: var(--light-accent-2);
    border-radius: 24px;
    padding: 8px;
    width: 100%;
    max-width: 860px;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
}

.chat-message.user.is-editing .chat-message-edit-wrapper {
    display: flex;
}

/* önce genişlik animasyonu biter, sonra JS layout’u kapatır */

.chat-message.user.is-editing .chat-message-edit-wrapper:focus-within {
    background: var(--chat-wa-800);
}

.chat-message.user.is-editing .chat-message-edit-controls {
    display: flex;
    align-items: flex-end;
    gap: 12px;
    padding: 4px 4px 4px 12px;
}

.chat-message.user.is-editing .chat-message-edit-input {
    flex: 1;
    border: none;
    outline: none;
    font-family: var(--chat-font);
    font-size: 15px;
    line-height: 1.6;
    color: var(--chat-wa-9000);
    resize: none;
    min-height: 24px;
    max-height: 200px;
    background: transparent;
    padding: 4px 0;
    width: 100%;
    box-sizing: border-box;
    word-wrap: break-word;
    overflow-wrap: break-word;
    overflow-y: auto;
}

.chat-message.user.is-editing .chat-message-edit-input::placeholder {
    color: var(--chat-wa-4000);
}

.chat-message.user.is-editing .chat-message-edit-input::-webkit-scrollbar {
    width: 6px;
}

.chat-message.user.is-editing .chat-message-edit-input::-webkit-scrollbar-track {
    background: transparent;
}

.chat-message.user.is-editing .chat-message-edit-input::-webkit-scrollbar-thumb {
    background: var(--chat-wa-1000);
    border-radius: 3px;
}

.chat-message.user.is-editing .chat-message-edit-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
    align-self: flex-end;
}

.chat-message.user.is-editing .chat-message-edit-btn {
    padding: 6px 14px;
    border-radius: 8px;
    font-family: var(--chat-font);
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease;
    border: none;
}

.chat-message.user.is-editing .chat-message-edit-btn.cancel {
    background: var(--chat-wa-1000);
    color: var(--chat-wa-8000);
}

.chat-message.user.is-editing .chat-message-edit-btn.cancel:hover {
    background: var(--chat-wa-1500);
}

.chat-message.user.is-editing .chat-message-edit-btn.send {
    background: var(--chat-primary);
    color: white;
}

.chat-message.user.is-editing .chat-message-edit-btn.send:hover:not(:disabled) {
    background: var(--chat-primary-light, #7c3aed);
}

.chat-message.user.is-editing .chat-message-edit-btn.send:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Markdown Styling */
.chat-message-content h1,
.chat-message-content h2,
.chat-message-content h3,
.chat-message-content h4,
.chat-message-content h5,
.chat-message-content h6 {
    margin-top: 16px;
    margin-bottom: 10px;
    font-weight: 600;
    color: var(--chat-text-emphasis);
    line-height: 1.4;
}

.chat-message.assistant .chat-message-content h1,
.chat-message.assistant .chat-message-content h2,
.chat-message.assistant .chat-message-content h3,
.chat-message.assistant .chat-message-content h4,
.chat-message.assistant .chat-message-content h5,
.chat-message.assistant .chat-message-content h6 {
    color: var(--chat-text-emphasis);
}

.chat-message-content h1:first-child,
.chat-message-content h2:first-child,
.chat-message-content h3:first-child,
.chat-message-content h4:first-child,
.chat-message-content h5:first-child,
.chat-message-content h6:first-child {
    margin-top: 0;
}

.chat-message-content h1 { 
    font-size: 20px; 
    font-weight: 700;
    border-bottom: 2px solid var(--chat-border);
    padding-bottom: 8px;
}

.chat-message.assistant .chat-message-content h1 {
    border-bottom-color: var(--chat-wa-2000);
}
.chat-message-content h2 { 
    font-size: 18px; 
    font-weight: 700;
}
.chat-message-content h3 { 
    font-size: 17px; 
    font-weight: 600;
}
.chat-message-content h4 { 
    font-size: 16px; 
    font-weight: 600;
}
.chat-message-content h5 { 
    font-size: 15px; 
    font-weight: 600;
}
.chat-message-content h6 { 
    font-size: 14px; 
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.chat-message-content p {
    margin-bottom: 14px;
    line-height: 1.75;
    color: var(--chat-text-body);
}

.chat-message-content p:last-child {
    margin-bottom: 0;
}

.chat-message-content p:empty,
.chat-message-content p:blank {
    display: none;
}
.chat-message-content p:has(> br:only-child) {
    display: none;
}
.chat-message-content > br:last-child {
    display: none;
}

.chat-message-content ul,
.chat-message-content ol {
    margin: 12px 0;
    padding-left: 24px;
    list-style-position: outside;
}

.chat-message-content ul {
    list-style-type: disc;
}

.chat-message-content ol {
    list-style-type: decimal;
}

.chat-message-content li {
    margin-bottom: 6px;
    line-height: 1.6;
    padding-left: 4px;
    color: var(--chat-text-body);
}

.chat-message-content ul ul,
.chat-message-content ol ol,
.chat-message-content ul ol,
.chat-message-content ol ul {
    margin-top: 6px;
    margin-bottom: 6px;
}

.chat-message-content ul li::marker {
    color: var(--chat-primary);
}

.chat-message-content ol li::marker {
    color: var(--chat-primary);
    font-weight: 600;
}


.chat-message-content blockquote {
    border-left: 3px solid var(--chat-primary);
    padding-left: 14px;
    margin: 10px 0;
    color: var(--chat-text-body);
}

.chat-message-content a {
    color: var(--chat-primary);
    text-decoration: none;
}

.chat-message-content a:hover {
    text-decoration: underline;
}

.chat-message.user .chat-message-content a {
    color: var(--chat-accent-light);
}

.chat-message.user .chat-message-content h1,
.chat-message.user .chat-message-content h2,
.chat-message.user .chat-message-content h3,
.chat-message.user .chat-message-content h4,
.chat-message.user .chat-message-content h5,
.chat-message.user .chat-message-content h6 {
    color: white;
    border-bottom-color: var(--chat-wa-3000);
}

/* Tool Badge */
.chat-tool-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background: var(--chat-primary-subtle);
    border-radius: 6px;
    font-size: 11px;
    font-weight: 500;
    color: var(--chat-primary);
    margin-bottom: 12px;
    margin-right: 6px;
    border: 1px solid var(--chat-border);
}

/* Thinking */
.chat-thinking {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 0;
    max-width: fit-content;
    width: fit-content;
    min-width: 0;
}

.chat-thinking-text {
    font-size: 14px;
    color: var(--chat-text-secondary);
    font-weight: 400;
    white-space: nowrap;
}

/* Loading */
.chat-loading {
    display: flex;
    align-items: center;
    gap: 8px;
    width: fit-content;
    max-width: 100%;
}

.chat-loading-dot {
    width: 8px;
    height: 8px;
    background: var(--chat-primary);
    border-radius: 50%;
    animation: loadingPulse 1.4s infinite ease-in-out;
}

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

@keyframes loadingPulse {
    0%, 80%, 100% { transform: scale(0.6); opacity: 0.5; }
    40% { transform: scale(1); opacity: 1; }
}

/* Input Area (ChatGPT Style) */
.chat-input-area {
    padding: 20px 0 24px;
    background: var(--chat-bg);
    flex-shrink: 0;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    overflow-x: hidden;
    overflow-y: visible;
    display: none;
    position: relative;
    z-index: 30;
}

.chat-input-area.visible {
    display: block;
}

/* ============================================
   CHAT DOT NAVIGATION — sağ kenar nokta listesi
   ============================================ */
.chat-dot-nav[hidden] {
    display: none !important;
}

.chat-dot-nav {
    --dot-nav-gap: 10px;
    --dot-nav-dot: 6px;
    position: absolute;
    right: max(8px, calc((100% - 900px) / 2 - 24px));
    top: var(--header-height, 64px);
    bottom: var(--chat-prev-prompt-offset, 132px);
    z-index: 20;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0;
    padding: 0;
    pointer-events: none;
    overflow: visible;
}

/* Her nokta — tıklanabilir buton */
.chat-dot-nav-item {
    pointer-events: all;
    width: var(--dot-nav-dot);
    height: var(--dot-nav-dot);
    min-height: var(--dot-nav-dot);
    padding: 0;
    margin: 0;
    border: none;
    border-radius: 50%;
    background: var(--chat-wa-2200);
    cursor: pointer;
    transition: background 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
    flex-shrink: 0;
    outline: none;
    position: relative;
    z-index: 1;
}

/*
 * Bağlantı çizgisi: üst noktanın altından başlar, tam olarak gap yüksekliğinde.
 * margin-top ile gap eşleştiği için çemberlere girmez, yamuk görünmez.
 */
.chat-dot-nav-item:has(+ .chat-dot-nav-item)::after,
.chat-dot-nav-item:has(+ .chat-dot-nav-end)::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 100%;
    transform: translateX(-50%);
    width: 1px;
    height: var(--dot-nav-gap);
    background: var(--chat-wa-1600);
    pointer-events: none;
    z-index: 0;
}

.chat-dot-nav-item + .chat-dot-nav-item {
    margin-top: var(--dot-nav-gap);
}

.chat-dot-nav-item:hover {
    background: var(--chat-wa-7200);
    transform: scale(1.45);
}

.chat-dot-nav-item:focus-visible {
    outline: 2px solid var(--chat-wa-4500);
    outline-offset: 2px;
}

.chat-dot-nav-item.active {
    background: var(--chat-dot-nav-active-fill);
    transform: scale(1.2);
    box-shadow: 0 0 4px var(--chat-wa-2000);
}

.chat-dot-nav-item.active:hover {
    background: var(--chat-dot-nav-active-fill);
    transform: scale(1.45);
    box-shadow: 0 0 6px var(--chat-wa-3500);
}

/* Son işaret — accent; üstteki gap ile hizalı */
.chat-dot-nav-end {
    width: 13px;
    height: 3px;
    border-radius: 2px;
    background: rgba(91, 95, 122, 0.5);
    margin-top: var(--dot-nav-gap);
    position: relative;
    z-index: 1;
}

.chat-dot-nav-end:hover {
    background: #5b5f7a;
    transform: scaleX(1.12);
}

.chat-dot-nav-end.active {
    background: #5b5f7a;
    box-shadow: 0 0 6px rgba(91, 95, 122, 0.45);
}

.chat-dot-nav-end.active:hover {
    background: #6e7294;
}

/* ============================================
   DOT NAV TOOLTIP
   ============================================ */
.chat-dot-nav-tooltip[hidden] {
    display: none !important;
}

.chat-dot-nav-tooltip {
    position: fixed;
    z-index: 9999;
    pointer-events: none;
    width: 200px;
    background: rgba(14, 14, 18, 0.95);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid var(--chat-wa-700);
    border-radius: 9px;
    padding: 10px 13px;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.4), 0 2px 8px rgba(0, 0, 0, 0.25);
    transform: translateY(-50%);
    animation: dotNavTooltipIn 0.12s ease forwards;
}

@keyframes dotNavTooltipIn {
    from { opacity: 0; transform: translateY(-50%) translateX(4px); }
    to   { opacity: 1; transform: translateY(-50%) translateX(0); }
}

/* Ok işareti — sağ kenar */
.chat-dot-nav-tooltip::after {
    content: '';
    position: absolute;
    right: -5px;
    top: 50%;
    width: 9px;
    height: 9px;
    background: rgba(14, 14, 18, 0.95);
    border-right: 1px solid var(--chat-wa-700);
    border-top: 1px solid var(--chat-wa-700);
    transform: translateY(-50%) rotate(45deg);
    border-radius: 0 2px 0 0;
}

.chat-dot-nav-tooltip-label {
    display: block;
    font-size: 10px;
    font-weight: 500;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--chat-wa-3000);
    margin-bottom: 4px;
}

.chat-dot-nav-tooltip-text {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-size: 12.5px;
    font-weight: 400;
    color: var(--chat-wa-8800);
    line-height: 1.5;
    word-break: break-word;
}

.chat-dot-nav-tooltip-end-icon {
    display: none;
}

/* Chat input çubuğu: fixed, tam metin; varsayılan konum kontrolün ALTINDA (data-placement) */
.chat-input-action-tooltip {
    position: fixed;
    z-index: 10050;
    box-sizing: border-box;
    max-width: min(560px, calc(100vw - 20px));
    padding: 8px 12px;
    border-radius: 9px;
    font-family: var(--chat-font);
    font-size: 12px;
    font-weight: 500;
    line-height: 1.45;
    letter-spacing: -0.01em;
    text-align: left;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
    hyphens: auto;
    pointer-events: none;
    background: rgba(15, 18, 28, 0.96);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow:
        0 4px 6px rgba(0, 0, 0, 0.08),
        0 12px 28px rgba(0, 0, 0, 0.28);
    opacity: 0;
    transform: translate3d(0, -6px, 0);
    transition:
        opacity 0.22s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.28s cubic-bezier(0.22, 1, 0.36, 1),
        box-shadow 0.28s cubic-bezier(0.22, 1, 0.36, 1);
    will-change: opacity, transform;
}

.chat-input-action-tooltip[data-placement="above"] {
    transform: translate3d(0, 6px, 0);
}

.chat-input-action-tooltip.chat-input-action-tooltip--open {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

@media (prefers-reduced-motion: reduce) {
    .chat-input-action-tooltip,
    .chat-input-action-tooltip[data-placement="above"] {
        transition-duration: 0.01ms;
        transform: none;
    }
    .chat-input-action-tooltip.chat-input-action-tooltip--open {
        opacity: 1;
    }
}

.chat-input-action-tooltip[hidden] {
    display: none !important;
}

.chat-input-container {
    max-width: 900px;
    margin: 0 auto;
    width: 100%;
    box-sizing: border-box;
    position: relative;
    overflow: visible;
    padding: 0 20px;
    z-index: 31;
}

/* Tema değişiminde arka plan interpolasyonu beyaz flaş vermesin */
html.chat-theme-switching .chat-input-wrapper,
html.chat-theme-switching .chat-input-area-welcome .chat-input-wrapper {
    transition: none !important;
}

html.chat-theme-switching .chat-sidebar-new-search .chat-new-btn {
    transition: none !important;
}

/* Tema geçişi: ref panel sekme şeridi arka planı gecikmeli/beyaz flaş vermesin */
html.chat-theme-switching .chat-ref-panel .chat-ref-tab-strip,
html.chat-theme-switching .chat-ref-panel .chat-ref-tab {
    transition: none !important;
}

/* Tema geçişi: üst bar (paylaş dahil) — transition yok; yoksa color-mix / #fff tonu beyaz patlar */
html.chat-theme-switching .chat-header-btn,
html.chat-theme-switching .chat-theme-toggle {
    transition: none !important;
}

/* Tema geçişi: sürüm düğmesi — background transition #07080b↔#fff interpolasyonu beyaz flaş verir */
html.chat-theme-switching .de-versions-trigger,
html.chat-theme-switching .de-versions-icon {
    transition: none !important;
}

.chat-input-wrapper {
    display: flex;
    flex-direction: column;
    background: var(--chat-wa-300);
    border: var(--chat-card-border);
    border-radius: 24px;
    padding: 8px;
    transition: background 0.2s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1), border-color 0.2s ease;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    min-width: 0;
    box-shadow:
        0 2px 12px rgba(0, 0, 0, 0.2),
        0 1px 4px rgba(0, 0, 0, 0.14);
    position: relative;
    overflow: visible;
    z-index: 32;
}

.chat-input-controls {
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: 8px 12px 8px 16px;
}

/* Üst satır: sadece yazı alanı */
.chat-input-row {
    display: flex;
    align-items: flex-start;
    min-height: 28px;
    width: 100%;
    position: relative;
}

.chat-input-row .chat-input {
    flex: 1;
    min-width: 0;
    padding: 6px 0 4px 0;
}

/* Dosya yüklenirken: üst satırda (dosya chip’leriyle aynı bölüm), placeholder ile çakışmaz */
.chat-input-upload-loading-row {
    display: none;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    width: 100%;
    flex-basis: 100%;
    padding: 4px 0 6px 0;
    margin: 0 0 4px 0;
    box-sizing: border-box;
    pointer-events: none;
}

.chat-input-upload-loading-row:not([hidden]) {
    display: flex;
}

.chat-input-upload-overlay-inner {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    flex: 1;
}

.chat-input-upload-text {
    font-size: 14px;
    font-weight: 500;
    color: var(--chat-text-secondary);
    line-height: 1.45;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

.chat-input-upload-dots {
    flex-shrink: 0;
}

/* Alt satır: dosya + hızlı araştırma solda; gönder/durdur en sağda sabit */
.chat-input-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding-top: 6px;
    flex-shrink: 0;
    width: 100%;
}

.chat-input-bar .chat-send-btn,
.chat-input-bar .chat-stop-btn {
    margin-left: auto;
    flex-shrink: 0;
}

.chat-input-bar .chat-enchant-wrap {
    order: 48;
    position: relative;
    display: flex;
    align-items: center;
    flex-shrink: 0;
    min-width: 0;
    max-width: 0;
    opacity: 0;
    overflow: hidden;
    pointer-events: none;
    transition:
        max-width 0.4s cubic-bezier(0.22, 1, 0.36, 1),
        opacity 0.28s ease;
}

.chat-input-bar .chat-enchant-wrap--visible {
    max-width: 200px;
    opacity: 1;
    pointer-events: auto;
    overflow: visible;
    z-index: 2;
}

.chat-input-bar .chat-enchant-wrap--visible[title] {
    cursor: help;
}

/*
 * İyileştirme beklerken: çerçeve halkası — transform YOK (mask + rotate = uçma/bozulma).
 * Sadece conic-gradient açısı @property ile döner; kutu geometrisi sabit kalır.
 */
@property --ench-border-angle {
    syntax: '<angle>';
    inherits: false;
    initial-value: 0deg;
}

.chat-input-wrapper.chat-input-wrapper--enchant-loading {
    position: relative;
    z-index: 1;
    isolation: isolate;
}

.chat-input-wrapper.chat-input-wrapper--enchant-loading::before {
    content: '';
    position: absolute;
    inset: -1px;
    border-radius: 25px;
    pointer-events: none;
    z-index: 6;
    box-sizing: border-box;
    padding: 1.5px;
    background: conic-gradient(
        from var(--ench-border-angle),
        transparent 0deg,
        transparent 198deg,
        rgba(129, 140, 248, 0.06) 218deg,
        rgba(165, 180, 252, 0.42) 252deg,
        rgba(238, 242, 255, 0.92) 268deg,
        rgba(199, 210, 254, 0.48) 280deg,
        rgba(129, 140, 248, 0.1) 296deg,
        transparent 316deg,
        transparent 360deg
    );
    animation: chat-input-enchant-border-sweep 2.55s linear infinite;
    will-change: --ench-border-angle;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask-composite: exclude;
}

@keyframes chat-input-enchant-border-sweep {
    from {
        --ench-border-angle: 0deg;
    }
    to {
        --ench-border-angle: 360deg;
    }
}

/* Yeni metin: soldan sağa toplu clip açılışı */
.chat-input.enchant-text-clip-reveal,
.chat-input.chat-input-enchant-brackets.enchant-text-clip-reveal {
    animation: enchant-text-clip-horizontal 0.52s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
}

@keyframes enchant-text-clip-horizontal {
    0% {
        clip-path: inset(0 100% 0 0);
        opacity: 0.94;
    }
    100% {
        clip-path: inset(0 0% 0 0);
        opacity: 1;
    }
}

.chat-enchant-btn .enchant-icon-undo {
    display: none;
    width: 12px;
    height: 12px;
    flex-shrink: 0;
}

.chat-enchant-btn--undo .enchant-icon-wand {
    display: none;
}

.chat-enchant-btn--undo .enchant-icon-undo {
    display: block;
}

.chat-enchant-btn .chat-enchant-label {
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0.01em;
    color: var(--notr1);
    white-space: nowrap;
    line-height: 1;
    font-family: var(--chat-font);
}

.chat-input-wrapper:hover {
    background: var(--chat-wa-500);
    box-shadow:
        0 4px 18px rgba(0, 0, 0, 0.26),
        0 2px 6px rgba(0, 0, 0, 0.18);
}

.chat-input-wrapper:focus-within {
    background: var(--chat-wa-600);
    box-shadow:
        0 5px 22px rgba(0, 0, 0, 0.28),
        0 2px 8px rgba(0, 0, 0, 0.2);
}

/* Koyu tema: input kutusu sol sidebar ile aynı yüzey; hover/odak çok hafif açılım */
html:not([data-chat-theme="light"]) .chat-input-wrapper {
    background: var(--chat-panel-surface);
    box-shadow:
        0 2px 10px rgba(0, 0, 0, 0.2),
        0 1px 3px rgba(0, 0, 0, 0.14);
}

html:not([data-chat-theme="light"]) .chat-input-wrapper:hover {
    background: color-mix(in srgb, var(--chat-panel-surface) 99%, #ffffff 1%);
    box-shadow:
        0 2px 11px rgba(0, 0, 0, 0.21),
        0 1px 3px rgba(0, 0, 0, 0.14);
}

html:not([data-chat-theme="light"]) .chat-input-wrapper:focus-within {
    background: color-mix(in srgb, var(--chat-panel-surface) 98.2%, #ffffff 1.8%);
    box-shadow:
        0 2px 12px rgba(0, 0, 0, 0.22),
        0 1px 3px rgba(0, 0, 0, 0.14);
}

/* Drag and Drop Styles */
.chat-input-wrapper.drag-over {
    border-color: var(--chat-primary);
    background: var(--chat-primary-subtle);
    box-shadow: 0 0 0 3px var(--chat-primary-subtle),
                0 4px 12px rgba(0, 0, 0, 0.15);
    transform: translateY(-2px);
}

.chat-input-area.drag-over {
    position: relative;
}

.chat-input-area.drag-over::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--chat-primary-subtle);
    border: 2px dashed var(--chat-primary);
    border-radius: var(--chat-radius-lg);
    z-index: 1;
    pointer-events: none;
}

.chat-input-area-welcome.drag-over {
    position: relative;
}

.chat-input-area-welcome.drag-over::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--chat-primary-subtle);
    border: 2px dashed var(--chat-primary);
    border-radius: var(--chat-radius-lg);
    z-index: 1;
    pointer-events: none;
}

/* Drag Overlay */
.chat-drag-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(4px);
    z-index: 9998;
    display: none;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}

.chat-drag-overlay.active {
    display: flex;
}

.chat-drag-overlay-content {
    background: var(--chat-surface);
    border: 2px dashed var(--chat-primary);
    border-radius: var(--chat-radius-xl);
    padding: 48px 64px;
    text-align: center;
    max-width: 500px;
    box-shadow: var(--chat-shadow-lg);
}

.chat-drag-overlay-icon {
    width: 64px;
    height: 64px;
    margin: 0 auto 20px;
    color: var(--chat-primary);
    display: flex;
    align-items: center;
    justify-content: center;
}

.chat-drag-overlay-icon svg {
    width: 100%;
    height: 100%;
}

.chat-drag-overlay-text {
    font-size: 18px;
    font-weight: 600;
    color: var(--chat-text);
    margin-bottom: 8px;
}

.chat-drag-overlay-hint {
    font-size: 14px;
    color: var(--chat-text-muted);
}

.chat-input {
    border: none;
    outline: none;
    font-family: var(--chat-font);
    font-size: 16px;
    line-height: 1.6;
    color: var(--chat-wa-9000);
    resize: none;
    min-height: 24px;
    max-height: 200px;
    background: transparent;
    vertical-align: middle;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    min-width: 0;
    word-wrap: break-word;
    overflow-wrap: break-word;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--chat-wa-1000) transparent;
    transition: all 0.2s ease;
}

/* Masaüstü: metin girişi 2 satır yüksekliğinde */
@media (min-width: 769px) {
    .chat-input {
        min-height: 3.2em;
    }
}

.chat-input:focus {
    color: var(--chat-wa-9000);
}

.chat-input::-webkit-scrollbar {
    width: 6px;
}

.chat-input::-webkit-scrollbar-track {
    background: transparent;
}

.chat-input::-webkit-scrollbar-thumb {
    background: var(--chat-wa-1000);
    border-radius: 3px;
}

.chat-input::-webkit-scrollbar-thumb:hover {
    background: var(--chat-wa-1500);
}

.chat-input::placeholder {
    color: var(--chat-wa-4000);
    opacity: 1;
    transition: opacity 0.2s ease;
}

.chat-input:focus::placeholder {
    opacity: 0.6;
}

.chat-send-btn {
    width: 32px;
    height: 32px;
    background: var(--chat-primary);
    border: none;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    transition: all 0.15s ease;
    flex-shrink: 0;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    align-self: flex-end;
}

.chat-send-btn:hover:not(:disabled) {
    background: var(--chat-primary-light, #7c3aed);
    transform: scale(1.05);
    box-shadow: 0 2px 6px rgba(99, 102, 241, 0.3);
}

.chat-send-btn:active:not(:disabled) {
    transform: scale(0.98);
}

.chat-send-btn:disabled {
    background: var(--chat-wa-1000);
    cursor: not-allowed;
    opacity: 0.5;
    box-shadow: none;
}

.chat-send-btn svg {
    width: 18px;
    height: 18px;
}

/* Stop Button */
.chat-stop-btn {
    width: 32px;
    height: 32px;
    background: rgba(239, 68, 68, 0.15);
    border: 1px solid rgba(239, 68, 68, 0.2);
    border-radius: 50%;
    cursor: pointer;
    display: none;
    align-items: center;
    justify-content: center;
    color: #ef4444;
    transition: all 0.15s ease;
    flex-shrink: 0;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    align-self: flex-end;
}

.chat-stop-btn:hover {
    background: rgba(239, 68, 68, 0.25);
    border-color: rgba(239, 68, 68, 0.3);
    transform: scale(1.05);
    box-shadow: 0 2px 6px rgba(239, 68, 68, 0.2);
}

.chat-stop-btn:active {
    transform: scale(0.98);
}

.chat-stop-btn svg {
    width: 18px;
    height: 18px;
}

/* ============================================
   PROMPT ENCHANT — Editörü Aç / araştırma pill ile aynı stil
   ============================================ */
.chat-enchant-btn {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    min-height: 26px;
    font-family: var(--chat-font);
    font-size: 11px;
    font-weight: 500;
    line-height: 1;
    white-space: nowrap;
    flex-shrink: 0;
    align-self: center;
    cursor: pointer;
    border-radius: 999px;
    color: var(--notr1);
    background: transparent;
    border: 1px solid transparent;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, opacity 0.2s ease;
}

.chat-enchant-btn:hover:not(:disabled):not(.enchanting) {
    background: rgba(91, 95, 122, 0.07);
    border-color: rgba(91, 95, 122, 0.12);
    color: var(--notr1);
}

html:not([data-chat-theme="light"]) .chat-enchant-btn:hover:not(:disabled):not(.enchanting) {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.1);
}

.chat-enchant-btn:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

/* 10 karakter altı: native disabled yok — not-allowed / kırmızı imleç yok; ipucu wrap üzerinde */
.chat-enchant-btn.chat-enchant-btn--soft-off {
    opacity: 0.52;
    cursor: inherit;
    pointer-events: none;
}

.chat-input-bar .chat-enchant-wrap--visible.chat-enchant-wrap--soft-hint {
    cursor: help;
    pointer-events: auto;
}

.chat-enchant-btn .enchant-icon-wand {
    width: 12px;
    height: 12px;
    flex-shrink: 0;
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.chat-enchant-btn:hover:not(:disabled):not(.enchanting) .enchant-icon-wand {
    transform: rotate(-10deg);
}

/* İşlem sürerken: ekstra efekt yok, editör pill’i gibi hafif nabız */
.chat-enchant-btn.enchanting {
    cursor: wait;
    animation: enchant-btn-wait-nudge 1.25s ease-in-out infinite;
}

.chat-enchant-btn.enchanting .enchant-icon-wand {
    animation: enchant-wand-wave 1.2s ease-in-out infinite;
}

@keyframes enchant-btn-wait-nudge {
    0%, 100% {
        opacity: 1;
        border-color: transparent;
    }
    50% {
        opacity: 0.9;
        border-color: rgba(91, 95, 122, 0.14);
    }
}

html:not([data-chat-theme="light"]) .chat-enchant-btn.enchanting {
    animation-name: enchant-btn-wait-nudge-dark;
}

@keyframes enchant-btn-wait-nudge-dark {
    0%, 100% {
        opacity: 1;
        border-color: transparent;
    }
    50% {
        opacity: 0.9;
        border-color: rgba(255, 255, 255, 0.12);
    }
}

@keyframes enchant-wand-wave {
    0%, 100% { transform: rotate(0deg); }
    25% { transform: rotate(-18deg) scale(1.06); }
    50% { transform: rotate(8deg) scale(1.02); }
    75% { transform: rotate(-8deg) scale(1.06); }
}

/* API beklerken: textarea’da gradient yok — sadece caret */
.chat-input.enchant-textarea-glow {
    caret-color: var(--chat-wa-9000);
}

html:not([data-chat-theme="light"]) .chat-input.enchant-textarea-glow {
    caret-color: rgba(255, 255, 255, 0.85);
}

/* Enchant sonrası [yer tutucu]: tıklanabilir alanlar (contenteditable) */
.chat-input.chat-input-enchant-brackets {
    white-space: pre-wrap;
    word-wrap: break-word;
    overflow-wrap: break-word;
    cursor: text;
    caret-color: var(--chat-wa-9000);
}

.chat-input.chat-input-enchant-brackets:empty::before {
    content: none;
}

.enchant-bracket-slot {
    display: inline;
    padding: 0 4px;
    margin: 0 1px;
    border-radius: 4px;
    cursor: pointer;
    background: rgba(91, 95, 122, 0.22);
    box-shadow: 0 0 0 1px rgba(91, 95, 122, 0.4);
    transition: background 0.15s ease, box-shadow 0.15s ease;
}

.enchant-bracket-slot:hover {
    background: rgba(91, 95, 122, 0.32);
    box-shadow: 0 0 0 1px rgba(91, 95, 122, 0.55);
}

.enchant-bracket-slot:focus {
    outline: 2px solid rgba(91, 95, 122, 0.65);
    outline-offset: 1px;
}

/* İyileştir: derin araştırmanın hemen yanında; gönder sağda */
.chat-input-bar .chat-send-btn,
.chat-input-bar .chat-stop-btn {
    order: 50;
}

.chat-input-bar .chat-enchant-wrap + .chat-send-btn,
.chat-input-bar .chat-enchant-wrap + .chat-stop-btn {
    margin-left: auto;
}

/* Dosya yükle — yalnızca ikon (varsayılan: kutu yok; hover’da çok hafif) */
.chat-file-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    width: 32px;
    height: 32px;
    min-height: 32px;
    padding: 0;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 50%;
    cursor: pointer;
    color: var(--notr1);
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.15s ease;
    flex-shrink: 0;
    font-family: var(--chat-font);
}

.chat-file-btn-text {
    display: none !important;
}

.chat-file-btn:hover {
    background: rgba(91, 95, 122, 0.07);
    border-color: rgba(91, 95, 122, 0.12);
    color: var(--notr1);
}

html:not([data-chat-theme="light"]) .chat-file-btn:hover {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.1);
}

.chat-file-btn:active {
    transform: scale(0.98);
}

.chat-file-btn svg {
    width: 15px;
    height: 15px;
    flex-shrink: 0;
}

/* Uploaded Files Preview */
.chat-uploaded-files {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 8px 12px 4px 12px;
    margin-bottom: 4px;
    overflow: visible;
    position: relative;
}

/* Yükleme satırı: yatay dosya şeridinin dışında (sütun düzeninde flex-basis:100% taşmayı bozmasın) */
.chat-input-wrapper > .chat-input-upload-loading-row {
    order: 0;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    flex: 0 0 auto;
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
}

/* Dosya chip’leri: yatay kaydır; ok bu kutu üzerinde absolute (içerikle birlikte kaymaz) */
.chat-input-wrapper > .chat-uploaded-files-row-wrap {
    order: 0;
    position: relative;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    flex: 0 0 auto;
    z-index: 40;
}

.chat-input-wrapper > .chat-uploaded-files-row-wrap > .chat-uploaded-files {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    align-content: center;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: auto;
    overflow-y: visible;
    touch-action: pan-x pinch-zoom;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
    padding: 8px 44px 4px 12px;
    margin-bottom: 4px;
    box-sizing: border-box;
    gap: 8px;
}

.chat-input-wrapper > .chat-uploaded-files-row-wrap > .chat-uploaded-files .chat-uploaded-file::before,
.chat-input-wrapper > .chat-uploaded-files-row-wrap > .chat-uploaded-files .chat-uploaded-file::after {
    display: none;
}

.chat-input-area,
.chat-input-container,
.chat-input-wrapper,
.chat-input-wrapper > .chat-uploaded-files-row-wrap > .chat-uploaded-files {
    overflow-y: visible !important;
}

.chat-input-wrapper > .chat-input-controls {
    order: 1;
}

.chat-input-wrapper > .chat-uploaded-files-row-wrap > .chat-uploaded-files::-webkit-scrollbar {
    display: none;
}

.chat-upload-scroll-prev,
.chat-upload-scroll-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    border-radius: 999px;
    border: 1px solid #0b0b0b;
    background: #0b0b0b;
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity .16s ease, background .16s ease, border-color .16s ease;
    z-index: 50;
}

.chat-upload-scroll-prev {
    left: 10px;
    right: auto;
}

.chat-upload-scroll-prev svg {
    transform: rotate(180deg);
}

.chat-upload-scroll-next {
    right: 10px;
    left: auto;
}

.chat-upload-scroll-prev[hidden],
.chat-upload-scroll-next[hidden] {
    display: none !important;
}

.chat-upload-scroll-prev:hover,
.chat-upload-scroll-next:hover {
    background: #0b0b0b;
    border-color: #0b0b0b;
}

.chat-uploaded-files-row-wrap:hover .chat-upload-scroll-prev,
.chat-uploaded-files-row-wrap:hover .chat-upload-scroll-next,
.chat-uploaded-files-row-wrap:focus-within .chat-upload-scroll-prev,
.chat-uploaded-files-row-wrap:focus-within .chat-upload-scroll-next,
.chat-upload-scroll-prev:hover,
.chat-upload-scroll-next:hover {
    opacity: 1;
    pointer-events: auto;
}

@media (hover: none) {
    .chat-upload-scroll-prev:not([hidden]),
    .chat-upload-scroll-next:not([hidden]) {
        opacity: 1;
        pointer-events: auto;
    }
}

html[data-chat-theme="light"] .chat-upload-scroll-prev,
html[data-chat-theme="light"] .chat-upload-scroll-next {
    background: #ffffff;
    border-color: rgba(15, 23, 42, 0.24);
    color: #111827;
}

/* Tema değişiminde dosya chip/oklarda beyaz patlama olmasın */
html.chat-theme-switching .chat-uploaded-file,
html.chat-theme-switching .chat-uploaded-image-thumb img,
html.chat-theme-switching .chat-upload-scroll-prev,
html.chat-theme-switching .chat-upload-scroll-next,
html.chat-theme-switching .chat-message-attachments-scroll-prev,
html.chat-theme-switching .chat-message-attachments-scroll-next {
    transition: none !important;
}

.chat-input-file-hover-tooltip {
    position: fixed;
    z-index: 2147483647;
    max-width: min(460px, 90vw);
    padding: 8px 11px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.35;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    pointer-events: none;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.22);
    border: 1px solid #1f2937;
    background: #0b0b0b;
    color: #ffffff;
}

html[data-chat-theme="light"] .chat-input-file-hover-tooltip {
    background: #ffffff;
    color: #111827;
    border-color: rgba(15, 23, 42, 0.2);
}

.chat-uploaded-file {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    background: var(--chat-surface);
    border: 1px solid var(--chat-border);
    border-radius: 8px;
    font-size: 13px;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    cursor: pointer;
}

.chat-input-wrapper > .chat-uploaded-files-row-wrap > .chat-uploaded-files .chat-uploaded-file {
    flex: 0 0 auto;
    flex-shrink: 0;
    max-width: min(260px, 72vw);
}

.chat-uploaded-file:hover {
    background: var(--chat-surface-alt);
    border-color: var(--chat-primary);
}

/* Tooltip */
.chat-uploaded-file::before {
    content: "↗  " attr(data-file-full-name);
    position: absolute;
    bottom: calc(100% + 10px);
    left: 50%;
    transform: translateX(-50%) translateY(2px);
    background: color-mix(in srgb, var(--chat-surface) 92%, var(--chat-wa-9000) 8%);
    color: var(--chat-text);
    border: 1px solid var(--chat-border);
    padding: 8px 11px;
    border-radius: 8px;
    font-size: 12px;
    white-space: nowrap;
    text-align: left;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease, transform 0.2s ease;
    z-index: 10000;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.22);
    max-width: min(420px, 84vw);
    text-overflow: ellipsis;
    overflow: hidden;
    line-height: 1.35;
    font-weight: 500;
}

.chat-uploaded-file::after {
    content: '';
    position: absolute;
    bottom: calc(100% + 4px);
    left: 50%;
    transform: translateX(-50%);
    border: 6px solid transparent;
    border-top-color: color-mix(in srgb, var(--chat-surface) 92%, var(--chat-wa-9000) 8%);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease;
    z-index: 10001;
}

.chat-uploaded-file:hover::before,
.chat-uploaded-file:hover::after {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

.chat-uploaded-file-icon {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--chat-text-muted);
    opacity: 0.7;
    transition: opacity 0.2s ease;
}

.chat-uploaded-file-icon svg {
    width: 100%;
    height: 100%;
    stroke: currentColor;
}

.chat-uploaded-file:hover .chat-uploaded-file-icon {
    opacity: 1;
    color: var(--chat-primary);
}

/* Resim önizleme — kart yapısı yok, serbest thumbnail */
.chat-uploaded-image-thumb {
    position: relative;
    flex-shrink: 0;
    width: 64px;
    height: 64px;
    border-radius: 8px;
    cursor: default;
}

.chat-input-wrapper > .chat-uploaded-files-row-wrap > .chat-uploaded-files .chat-uploaded-image-thumb {
    flex: 0 0 auto;
    flex-shrink: 0;
}

.chat-uploaded-image-thumb--loading {
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    background: var(--chat-surface-elevated, rgba(0, 0, 0, 0.06));
    border: 1px solid var(--chat-border);
}

.chat-uploaded-image-thumb--loading .chat-uploaded-image-thumb-dots {
    flex-shrink: 0;
    transform: scale(0.92);
    opacity: 0.9;
}

/* Yükleme devam ederken iptal (X) her zaman tıklanabilir */
.chat-uploaded-image-thumb--loading .chat-uploaded-image-remove {
    opacity: 1;
    pointer-events: auto;
}

.chat-uploaded-image-thumb img {
    width: 64px;
    height: 64px;
    object-fit: cover;
    display: block;
    border-radius: 8px;
    border: 1px solid var(--chat-border);
}

.chat-uploaded-image-remove {
    position: absolute;
    top: -7px;
    right: -7px;
    width: 18px;
    height: 18px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--chat-surface-inverse, #1f2937);
    border: 1.5px solid var(--chat-surface, #fff);
    border-radius: 50%;
    color: #fff;
    cursor: pointer;
    opacity: 0;
    transition: opacity 0.15s ease;
    z-index: 10;
    flex-shrink: 0;
    line-height: 1;
}

.chat-uploaded-image-thumb:hover .chat-uploaded-image-remove {
    opacity: 1;
}

.chat-uploaded-file-info {
    flex: 1;
    min-width: 0;
}

.chat-uploaded-file-name {
    color: var(--chat-text);
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 200px;
}

.chat-uploaded-file-size {
    color: var(--chat-text-muted);
    font-size: 11px;
    margin-top: 2px;
}

.chat-uploaded-file-remove {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    padding: 0;
    background: transparent;
    border: none;
    border-radius: var(--chat-radius-sm);
    color: var(--chat-text-muted);
    cursor: pointer;
    transition: var(--chat-transition);
    flex-shrink: 0;
}

.chat-uploaded-file-remove:hover {
    background: var(--chat-surface-alt);
    color: var(--chat-error);
}

.chat-uploaded-file-remove svg {
    width: 14px;
    height: 14px;
}

/* Input Hints */
.chat-input-hints {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    margin-top: 10px;
    font-size: 12px;
    color: var(--chat-text-muted);
}

.chat-input-hint {
    display: flex;
    align-items: center;
    gap: 6px;
}

.chat-input-hint kbd {
    padding: 2px 6px;
    background: var(--chat-surface-alt);
    border: 1px solid var(--chat-border);
    border-radius: 4px;
    font-family: var(--chat-font);
    font-size: 11px;
}

/* İçtihat Results */
.chat-ictihat-results {
    margin-top: 14px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.chat-ictihat-cards-container {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.chat-ictihat-card {
    background: var(--chat-wa-300);
    border: 1px solid var(--chat-wa-800);
    border-radius: 8px;
    padding: 12px 14px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.chat-ictihat-card:hover {
    border-color: var(--chat-wa-1400);
    background: var(--chat-wa-600);
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
}

.chat-ictihat-card-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 6px;
}

.chat-ictihat-card-title {
    font-size: 13px;
    font-weight: 600;
    color: var(--chat-text-emphasis);
}

.chat-ictihat-card-meta {
    font-size: 11px;
    color: var(--chat-text-muted);
    white-space: nowrap;
}

.chat-ictihat-card-excerpt {
    font-size: 12px;
    color: var(--chat-text-secondary);
    line-height: 1.6;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Daha fazla göster butonu */
.chat-ictihat-more-btn {
    margin-top: 8px;
    padding: 8px 16px;
    background: transparent;
    color: var(--chat-primary);
    border: 1px solid var(--chat-primary);
    border-radius: var(--chat-radius-md);
    font-family: var(--chat-font);
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: var(--chat-transition);
}

.chat-ictihat-more-btn:hover {
    background: var(--chat-primary-subtle);
}

/* Pro: Referansları görüntüle / Mevzuat referansları butonları */
.chat-tool-ref-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    background: var(--chat-wa-600);
    color: var(--chat-wa-9500);
    border: 1px solid var(--chat-wa-1200);
    border-radius: 8px;
    font-family: var(--chat-font);
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.02em;
    cursor: pointer;
    transition: all 0.2s ease;
}

.chat-tool-ref-btn:hover {
    background: var(--chat-wa-1000);
    border-color: var(--chat-wa-2000);
    transform: translateY(-1px);
}

 .chat-tool-ref-btn svg {
    flex-shrink: 0;
    opacity: 0.9;
}

/* DEVAM_YOLU chip'leri — genel görünüm (başlık olsun/olmasın) */
.chat-devam-yolu {
    display: inline-block;
    width: auto;
    margin: 4px 8px 4px 0;
    padding: 6px 12px;
    background: var(--chat-primary-subtle);
    color: var(--chat-primary);
    border: 1px solid rgba(91, 95, 122, 0.35);
    border-radius: 999px;
    font-family: var(--chat-font);
    font-size: 12px;
    font-weight: 500;
    line-height: 1.4;
    cursor: pointer;
    transition: background 0.2s ease, border-color 0.2s ease, transform 0.15s ease;
    text-align: center;
}
.chat-devam-yolu:hover {
    background: rgba(91, 95, 122, 0.18);
    border-color: rgba(91, 95, 122, 0.5);
    transform: translateY(-1px);
}
.chat-devam-yolu:focus {
    outline: none;
    box-shadow: 0 0 0 2px rgba(91, 95, 122, 0.35);
}

/* Sırada Yapabileceklerimiz — "Sonraki adımlar" bloğu */
/* Sonraki adımlar bölümü — kopyala butonunun altında, chattan ayrık */
.chat-sonraki-adimlar {
    margin-top: 28px;
    padding-top: 20px;
    border-top: 1px solid var(--chat-wa-400);
}

.chat-sonraki-adimlar-baslik {
    font-size: 11px;
    font-weight: 700;
    color: #9498b2;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin: 0 0 12px 0;
    padding: 0;
}

.chat-sonraki-adimlar-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* Tek tasarım: Sonraki adımlar içinde liste olsa bile madde işareti gösterme */
.chat-sonraki-adimlar ul,
.chat-sonraki-adimlar ol {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}
.chat-sonraki-adimlar li {
    margin-bottom: 8px;
    padding-left: 0 !important;
}
.chat-sonraki-adimlar li::marker {
    content: none !important;
}

.chat-sonraki-adim-item {
    opacity: 0;
    transform: translateY(-6px);
    animation: chat-sonraki-adim-fade-in 0.4s ease forwards;
}

@keyframes chat-sonraki-adim-fade-in {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.chat-sonraki-adimlar .chat-devam-yolu {
    position: relative;
    display: block;
    width: 100%;
    margin: 0;
    padding: 10px 14px 10px 16px;
    background: transparent;
    color: var(--notr2);
    border: none;
    border-radius: 0;
    font-family: var(--chat-font);
    font-size: 12px;
    font-weight: 500;
    line-height: 1.45;
    cursor: pointer;
    transition: background 0.2s ease;
    white-space: normal;
    text-align: left;
    box-sizing: border-box;
}
.chat-sonraki-adimlar .chat-devam-yolu::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    background: linear-gradient(180deg, var(--notr2), var(--chat-primary));
    border-radius: 0 2px 2px 0;
}
.chat-sonraki-adimlar .chat-devam-yolu:hover {
    background: linear-gradient(90deg, rgba(91, 95, 122, 0.08) 0%, rgba(91, 95, 122, 0.03) 100%);
}
.chat-devam-yolu:focus {
    outline: none;
    box-shadow: 0 0 0 2px rgba(91, 95, 122, 0.35);
}

/* İçtihat Modal */
.chat-ictihat-modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
    overflow: hidden; /* Dış scroll'u engelle */
}

/* Kaynakça modalının üstünde içtihat detayı / mevzuat detayı */
.chat-ictihat-modal[data-ictihat-detail="true"],
.chat-ictihat-modal[data-mevzuat="true"] {
    z-index: 10060;
}

.chat-ictihat-modal.show {
    opacity: 1;
    pointer-events: all;
}

.chat-ictihat-modal-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden; /* Overlay'de scroll olmamalı */
}

.chat-ictihat-modal-content {
    position: relative;
    background: var(--chat-right-panel-bg);
    border-radius: var(--chat-radius-lg);
    max-width: 800px;
    width: 100%;
    max-height: 80vh;
    display: flex;
    flex-direction: column;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
    margin: auto;
    overflow: hidden; /* İçerik scroll'u için */
}

.chat-ictihat-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 14px 18px;
    border-bottom: 1px solid var(--chat-border);
    background: var(--chat-right-panel-bg);
    flex-shrink: 0;
}

.chat-ictihat-modal-header h3 {
    font-size: 15px;
    font-weight: 600;
    color: var(--chat-text-emphasis);
    margin-bottom: 6px;
}

/* İçtihat detay modal - Karar No başlığı daha büyük */
.chat-ictihat-modal[data-ictihat-detail="true"] .chat-ictihat-modal-header h3 {
    font-size: 22px;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.chat-ictihat-modal-header p {
    font-size: 13px;
    color: var(--chat-text-secondary);
    margin: 2px 0;
}

.chat-ictihat-searchbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 18px;
    border-bottom: 1px solid var(--chat-border);
    background: var(--chat-right-panel-bg);
    flex-shrink: 0;
}

.chat-ictihat-search-input {
    flex: 1;
    min-width: 0;
    height: 30px;
    border-radius: 8px;
    border: 1px solid var(--chat-border);
    background: var(--chat-surface);
    color: var(--chat-text);
    padding: 0 10px;
    outline: none;
    font-size: 13px;
}

.chat-ictihat-search-actions {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}

.chat-ictihat-search-nav {
    width: 28px;
    height: 28px;
    border-radius: 7px;
    border: 1px solid var(--chat-border);
    background: var(--chat-surface);
    color: var(--chat-text);
    cursor: pointer;
    font-size: 12px;
    line-height: 1;
}

.chat-ictihat-search-count {
    min-width: 44px;
    text-align: center;
    font-size: 12px;
    color: var(--chat-text-secondary);
}

.chat-ictihat-search-hit {
    background: #ffe66b;
    color: #1f2937;
    border-radius: 3px;
    padding: 0 1px;
}

.chat-ictihat-search-hit.is-active {
    background: #ffd84d;
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 2px;
}

html:not([data-chat-theme="light"]) .chat-ictihat-search-hit.is-active {
    text-decoration-color: #ffffff;
}

.chat-ictihat-modal-close {
    width: 28px;
    height: 28px;
    background: transparent;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--chat-text-muted);
    transition: var(--chat-transition);
    flex-shrink: 0;
}

.chat-ictihat-modal-close:hover {
    background: var(--chat-wa-800);
    color: var(--chat-text);
}

.chat-ictihat-modal-close svg {
    width: 14px;
    height: 14px;
}

.chat-ictihat-modal-body {
    padding: 20px;
    overflow-y: auto;
    overflow-x: hidden;
    font-size: 14px;
    line-height: 1.7;
    color: var(--chat-text);
    flex: 1;
    min-height: 0;
    text-align: justify;
}

.chat-ictihat-modal-body strong {
    color: var(--chat-text-emphasis);
    font-weight: 700;
    letter-spacing: 0.01em;
}

/* Kaynakça modal - içtihat kartları (pro); koyu temada kutu siyah ton */
.chat-kaynakca-ictihat-card {
    border: 1px solid var(--chat-border-light);
    border-radius: 8px;
    padding: 12px 14px;
    background: var(--siyah);
    margin-bottom: 10px;
    cursor: pointer;
    transition: border-color 0.2s ease, background 0.2s ease;
}

.chat-kaynakca-ictihat-card:hover {
    border-color: var(--chat-border);
    background: #131316;
}

.chat-kaynakca-ictihat-card-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 8px;
    margin-bottom: 6px;
}

.chat-kaynakca-ictihat-card-title {
    font-weight: 600;
    font-size: 12px;
    color: var(--chat-text-emphasis);
    flex: 1;
}

.chat-kaynakca-ictihat-card-date {
    font-size: 10px;
    color: var(--chat-text-muted);
    white-space: nowrap;
}

.chat-kaynakca-ictihat-card-meta {
    display: flex;
    gap: 6px;
    margin-bottom: 6px;
    align-items: center;
    flex-wrap: wrap;
}

.chat-kaynakca-ictihat-card-daire {
    font-size: 10px;
    padding: 2px 6px;
    background: var(--chat-wa-600);
    border-radius: 3px;
    color: var(--chat-text-secondary);
}

.chat-kaynakca-ictihat-card-link {
    font-size: 10px;
    color: var(--chat-wa-5000);
    font-weight: 500;
}

.chat-kaynakca-ictihat-card-preview {
    font-size: 11px;
    color: var(--chat-text-secondary);
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Kaynakça: Vertex web kaynağı — kartın tamamı harici siteye gider */
a.chat-kaynakca-web-card {
    text-decoration: none;
    color: inherit;
    display: block;
}

a.chat-kaynakca-web-card:hover .chat-kaynakca-ictihat-card-link {
    text-decoration: underline;
}

.chat-ictihat-modal-body::-webkit-scrollbar {
    width: 6px;
}

.chat-ictihat-modal-body::-webkit-scrollbar-track {
    background: transparent;
}

.chat-ictihat-modal-body::-webkit-scrollbar-thumb {
    background: rgba(185, 194, 207, 0.3);
    border-radius: 3px;
}

/* ============================================================
   Hata Bildir — yeni bağımsız card modalı
   ============================================================ */

/* Kapsayıcı */
.chat-error-report-modal {
    position: fixed;
    inset: 0;
    z-index: 10100;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    pointer-events: none;
}

.chat-error-report-modal.show {
    pointer-events: all;
}

/* Arka plan blur — anında gelsin, sadece opaklık geçişi */
.chat-error-report-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.55);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    opacity: 0;
    transition: opacity 0.22s ease;
    cursor: pointer;
}

.chat-error-report-modal.show .chat-error-report-overlay {
    opacity: 1;
}

/* Card — aşağıdan yukarı kayarak açılır */
.chat-error-report-card {
    position: relative;
    width: 100%;
    max-width: 460px;
    background: color-mix(in srgb, var(--chat-bg) 92%, var(--light-accent) 8%);
    border: 1px solid var(--chat-wa-1000);
    border-radius: 16px;
    box-shadow:
        0 24px 48px rgba(0, 0, 0, 0.55),
        0 4px 12px rgba(0, 0, 0, 0.3),
        inset 0 1px 0 var(--chat-wa-600);
    overflow: hidden;
    opacity: 0;
    transform: translateY(14px) scale(0.98);
    transition: opacity 0.22s ease, transform 0.22s cubic-bezier(0.34, 1.22, 0.64, 1);
    will-change: transform, opacity;
}

.chat-error-report-modal.show .chat-error-report-card {
    opacity: 1;
    transform: translateY(0) scale(1);
}

/* Header */
.chat-error-report-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 18px 20px 14px;
    border-bottom: 1px solid var(--chat-wa-700);
}

.chat-error-report-card-title-group {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.chat-error-report-card-icon {
    color: rgba(252, 165, 165, 0.85);
    flex-shrink: 0;
}

.chat-error-report-card-title {
    font-size: 17px;
    font-weight: 700;
    color: var(--chat-wa-9700);
    margin: 0;
    letter-spacing: 0.01em;
    line-height: 1.2;
}

.chat-error-report-card-close {
    flex-shrink: 0;
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    color: var(--chat-wa-4500);
    transition: background 0.15s ease, color 0.15s ease;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
}

.chat-error-report-card-close:hover,
.chat-error-report-card-close:focus-visible {
    background: var(--chat-wa-800);
    color: var(--chat-wa-9000);
}

/* Body */
.chat-error-report-card-body {
    padding: 20px;
}

.chat-error-report-hint {
    font-size: 15px;
    font-weight: 600;
    line-height: 1.45;
    color: var(--chat-wa-8800);
    margin: 0 0 18px;
}

.chat-error-report-label {
    display: block;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--chat-text-muted);
    margin-bottom: 8px;
}

.chat-error-report-label-opt {
    font-size: 10px;
    font-weight: 400;
    opacity: 0.7;
    text-transform: none;
    letter-spacing: 0;
}

.chat-error-report-note {
    width: 100%;
    box-sizing: border-box;
    min-height: 80px;
    padding: 10px 13px;
    /* iOS Safari: computed font-size < 16px iken odakta tüm sayfayı zoomlar; asla düşürme */
    font-size: 16px;
    line-height: 1.5;
    font-family: inherit;
    color: var(--chat-text);
    background: var(--chat-wa-450);
    border: 1px solid var(--chat-wa-1000);
    border-radius: 10px;
    resize: vertical;
    margin-bottom: 18px;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
    touch-action: manipulation;
    -webkit-text-size-adjust: 100%;
}

.chat-error-report-note::placeholder {
    font-size: 16px;
    opacity: 0.45;
}

.chat-error-report-note:focus {
    outline: none;
    border-color: rgba(132, 161, 181, 0.55);
    box-shadow: 0 0 0 3px rgba(132, 161, 181, 0.12);
}

.chat-error-report-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

.chat-error-report-cancel,
.chat-error-report-submit {
    padding: 9px 20px;
    font-size: 13px;
    font-weight: 600;
    font-family: inherit;
    border-radius: 10px;
    cursor: pointer;
    border: 1px solid transparent;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, opacity 0.15s ease;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
}

.chat-error-report-cancel {
    background: transparent;
    border-color: var(--chat-wa-1200);
    color: var(--chat-wa-6500);
}

.chat-error-report-cancel:hover {
    background: var(--chat-wa-600);
    border-color: var(--chat-wa-2000);
    color: var(--chat-wa-8800);
}

.chat-error-report-submit {
    background: var(--accent);
    border-color: transparent;
    color: var(--chat-wa-9600);
}

.chat-error-report-submit:hover:not(:disabled) {
    background: color-mix(in srgb, var(--accent) 85%, #fff 15%);
}

.chat-error-report-submit:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.chat-error-report-status {
    margin: 14px 0 0;
    font-size: 12px;
    line-height: 1.45;
    color: rgba(134, 239, 172, 0.95);
}

.chat-error-report-status.is-error {
    color: rgba(252, 165, 165, 0.95);
}

@media (max-width: 480px) {
    .chat-error-report-modal {
        padding: 12px;
    }

    .chat-error-report-card {
        max-width: 100%;
    }
}

/* ── Mobil Sohbet Geçmişi: Uzun Basınca Bağlam Menüsü ── */
.chat-history-ctx-backdrop {
    position: fixed;
    inset: 0;
    z-index: 9998;
    background: rgba(0, 0, 0, 0.5);
    opacity: 0;
    transition: opacity 0.22s ease;
    display: none;
}
.chat-history-ctx-backdrop.show {
    opacity: 1;
}
.chat-history-ctx-sheet {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 9999;
    background: var(--chat-mobile-ctx-sheet-bg);
    border-radius: 16px 16px 0 0;
    padding-bottom: max(env(safe-area-inset-bottom, 0px), 16px);
    box-shadow: 0 -4px 40px rgba(0, 0, 0, 0.55);
    transform: translateY(100%);
    transition: transform 0.28s cubic-bezier(0.34, 1.1, 0.64, 1);
    display: none;
    user-select: none;
}
.chat-history-ctx-sheet.show {
    transform: translateY(0);
}
.chat-history-ctx-handle {
    width: 36px;
    height: 4px;
    background: var(--chat-wa-1800);
    border-radius: 2px;
    margin: 10px auto 0;
}
.chat-history-ctx-title {
    font-size: 12px;
    font-weight: 500;
    color: var(--chat-wa-3800);
    padding: 12px 20px 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    border-bottom: 1px solid var(--chat-wa-700);
}
.chat-history-ctx-btn {
    display: flex;
    align-items: center;
    gap: 14px;
    width: 100%;
    padding: 16px 20px;
    background: transparent;
    border: none;
    font-family: inherit;
    font-size: 15px;
    font-weight: 400;
    color: var(--chat-wa-8800);
    cursor: pointer;
    text-align: left;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
}
.chat-history-ctx-btn:active {
    background: var(--chat-wa-600);
}
.chat-history-ctx-btn.danger {
    color: rgba(252, 100, 100, 0.9);
}
.chat-history-ctx-btn svg {
    flex-shrink: 0;
    opacity: 0.75;
}

/* Mobilde action butonları gizle; uzun basınca bağlam popup devreye girer */
@media (max-width: 1024px) {
    .chat-history-item-actions {
        display: none !important;
    }
    /* hover yapışkanlığını kaldır — iOS ilk tap'ta :hover atıyor; pointer:coarse ile uyumlu */
    .chat-history-item:hover {
        background: transparent;
    }
    .chat-history-item:hover::before {
        height: 0;
    }
    .chat-history-item:hover .chat-history-item-actions {
        opacity: 0;
        pointer-events: none;
    }
    .chat-history-item.active:hover {
        background: var(--chat-wa-800);
    }
    .chat-history-item.active:hover::before {
        height: 100%;
    }
    /* Touch geri bildirim — basılı tutma sırasında hafif vurgu */
    .chat-history-item:active {
        background: var(--chat-wa-700);
    }
}

/* Long-press: kutucuğun TAM üstüne gelen overlay katmanı */
.chat-history-ctx-overlay {
    position: absolute;
    inset: 0;
    z-index: 5;
    display: flex;
    align-items: stretch;
    border-radius: 6px;
    overflow: hidden;
    background: color-mix(in srgb, var(--light-accent-2) 97%, var(--accent-2) 3%);
    border: 1px solid var(--chat-wa-700);
    box-shadow: 0 1px 8px rgba(0, 0, 0, 0.22);
    opacity: 0;
    transform: scale(0.985);
    transition:
        opacity 0.14s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.17s cubic-bezier(0.34, 1.1, 0.64, 1);
    pointer-events: none;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-user-select: none;
}

.chat-history-ctx-overlay.show {
    opacity: 1;
    transform: scale(1);
    pointer-events: auto;
}

.chat-history-ctx-overlay-btn {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 8px;
    background: transparent;
    border: none;
    font-family: inherit;
    font-size: 11.5px;
    font-weight: 500;
    letter-spacing: 0.025em;
    color: var(--chat-wa-7200);
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
    transition: background 0.1s ease, color 0.1s ease;
}

.chat-history-ctx-overlay-btn:active {
    background: var(--chat-wa-600);
    color: var(--chat-wa-9000);
}

.chat-history-ctx-overlay-btn.danger {
    color: rgba(240, 100, 100, 0.82);
}

.chat-history-ctx-overlay-btn.danger:active {
    color: rgba(240, 100, 100, 1);
}

.chat-history-ctx-overlay-btn svg {
    flex-shrink: 0;
    width: 12px;
    height: 12px;
    opacity: 0.65;
}

.chat-history-ctx-overlay-sep {
    width: 1px;
    align-self: stretch;
    margin: 8px 0;
    background: var(--chat-wa-700);
    flex-shrink: 0;
}

/* Dilekçe editörü paneli: Mobilde kapanış animasyonu yok */
@media (max-width: 900px) {
    #dilekce-editor-panel {
        transition: none !important;
    }
}

/* İçtihat Sonuçları Container */
.ictihat-results-container {
    scrollbar-width: thin;
    scrollbar-color: rgba(185, 194, 207, 0.3) transparent;
}

.ictihat-results-container::-webkit-scrollbar {
    width: 6px;
}

.ictihat-results-container::-webkit-scrollbar-track {
    background: transparent;
}

.ictihat-results-container::-webkit-scrollbar-thumb {
    background: rgba(185, 194, 207, 0.3);
    border-radius: 3px;
}

.ictihat-results-container::-webkit-scrollbar-thumb:hover {
    background: var(--chat-text-muted);
}

/* Mevzuat / İçtihat Sidebar - Pro */
.mevzuat-sidebar {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: 0;
    z-index: 10001;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.25s ease, width 0.25s ease;
}

.mevzuat-sidebar.show {
    opacity: 1;
    pointer-events: all;
    width: 420px;
}

.mevzuat-sidebar-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.45);
    backdrop-filter: blur(8px);
}

.mevzuat-sidebar-content {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: 420px;
    background: var(--chat-right-panel-bg);
    border-left: 1px solid var(--chat-wa-600);
    box-shadow: -8px 0 32px rgba(0, 0, 0, 0.35);
    display: flex;
    flex-direction: column;
    transform: translateX(100%);
    transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

.mevzuat-sidebar.show .mevzuat-sidebar-content {
    transform: translateX(0);
}

.mevzuat-sidebar-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: nowrap;
    padding: 16px 18px;
    border-bottom: 1px solid var(--chat-wa-600);
    flex-shrink: 0;
    background: var(--chat-right-panel-bg);
}

.mevzuat-sidebar-header h3 {
    font-size: 14px;
    font-weight: 600;
    color: var(--chat-wa-9500);
    margin: 0;
    letter-spacing: 0.02em;
}

.mevzuat-sidebar-header-start {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    gap: 8px;
    flex: 1;
    min-width: 0;
}

.mevzuat-sidebar-header-start h3 {
    font-size: 14px;
    font-weight: 600;
    color: var(--chat-wa-9500);
    margin: 0;
    letter-spacing: 0.02em;
}

.mevzuat-sidebar-close {
    width: 28px;
    height: 28px;
    background: transparent;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--chat-wa-5000);
    transition: all 0.2s ease;
}

.mevzuat-sidebar-close:hover {
    background: var(--chat-wa-800);
    color: var(--chat-wa-9000);
}

.mevzuat-sidebar-close svg {
    width: 14px;
    height: 14px;
}

.mevzuat-sidebar-body {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 16px;
    padding-right: calc(16px + var(--chat-panel-scrollbar-content-gap));
    scrollbar-gutter: stable;
    box-sizing: border-box;
    min-height: 0;
}

.mevzuat-sidebar-body strong {
    color: var(--chat-text-emphasis);
    font-weight: 700;
    letter-spacing: 0.01em;
}

.mevzuat-sidebar-item {
    border: 1px solid var(--chat-wa-800);
    border-radius: 8px;
    padding: 12px 14px;
    background: var(--chat-wa-300);
    margin-bottom: 10px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.mevzuat-sidebar-item:hover {
    border-color: var(--chat-wa-1400);
    background: var(--chat-wa-600);
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.2);
}

.mevzuat-sidebar-item-title {
    font-weight: 600;
    font-size: 12px;
    color: var(--chat-text-emphasis);
    letter-spacing: 0.02em;
    margin-bottom: 6px;
}

/* İçtihat — Karar Künyesi (Çıkarım / referans paneli) */
.chat-karar-kunye-wrap {
    margin-bottom: 12px;
}

.mevzuat-sidebar-detail-title-wrap.chat-karar-kunye-wrap {
    margin-bottom: 0;
    padding-bottom: 12px;
    border-bottom: none;
}

.chat-karar-kunye {
    margin-bottom: 0;
}

.chat-karar-kunye-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    flex-wrap: nowrap;
    min-width: 0;
    direction: ltr;
}

.chat-karar-kunye-heading {
    font-size: 15px;
    font-weight: 700;
    color: var(--chat-wa-9600);
    margin: 0;
    padding: 0;
    letter-spacing: 0.03em;
    line-height: 1.15;
    flex-shrink: 0;
}

.chat-mevzuat-kunye-heading {
    letter-spacing: 0.06em;
    font-size: 13px;
}

/* İnce ayırıcı — accent2 (mavi-gri), gölge yok; altında künye satırlarına nefes */
.chat-karar-kunye-accent-line {
    height: 1px;
    margin: 0.28rem 0 0.75rem 0;
    border-radius: 0;
    background: color-mix(in srgb, var(--accent-2) 65%, transparent);
    box-shadow: none;
}

.chat-karar-kunye-lines {
    margin-top: 0;
    padding-top: 2px;
}

.chat-karar-kunye-line {
    font-size: 12px;
    color: var(--chat-text);
    line-height: 1.35;
    margin-bottom: 0.22em;
}

.chat-karar-kunye-line:last-child {
    margin-bottom: 0;
}

.chat-karar-kunye-daire {
    font-weight: 500;
    color: var(--chat-wa-9200);
}

.chat-karar-kunye-label {
    font-weight: 500;
    color: var(--chat-text-muted);
    margin-right: 0.35em;
}

.chat-karar-kunye-value {
    font-weight: 400;
    color: var(--chat-text);
}

/* Tek buton: ikon + 2 satır metin — çerçevesiz, hover’da hafif vurgu; sağdan içeri */
button.chat-karar-kunye-copy-wrap {
    position: relative;
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
    min-width: 0;
    direction: ltr;
    unicode-bidi: isolate;
    margin: 0;
    margin-inline-end: 10px;
    padding: 5px 8px 5px 6px;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    font: inherit;
    text-align: left;
    background: transparent;
    color: inherit;
    box-shadow: none;
    transition:
        background 0.18s ease,
        opacity 0.15s ease,
        box-shadow 0.28s ease;
    -webkit-tap-highlight-color: transparent;
}

button.chat-karar-kunye-copy-wrap:hover {
    background: var(--chat-wa-550);
}

button.chat-karar-kunye-copy-wrap:active {
    opacity: 0.92;
    background: var(--chat-wa-800);
}

button.chat-karar-kunye-copy-wrap:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--accent-2) 45%, transparent);
    outline-offset: 2px;
}

.chat-karar-kunye-copy-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: var(--accent-2);
    pointer-events: none;
    transition:
        color 0.2s ease,
        transform 0.36s cubic-bezier(0.22, 1, 0.36, 1),
        opacity 0.22s ease;
}

button.chat-karar-kunye-copy-wrap:hover .chat-karar-kunye-copy-icon {
    color: color-mix(in srgb, var(--accent-2) 90%, #fff 10%);
}

.chat-karar-kunye-copy-labels {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    line-height: 1.05;
    gap: 0;
    pointer-events: none;
}

.chat-karar-kunye-copy-line1,
.chat-karar-kunye-copy-line2 {
    font-size: 9px;
    font-weight: 600;
    color: var(--notr1);
    letter-spacing: 0.02em;
}

.chat-karar-kunye-copy-line2 {
    margin-top: 1px;
}

/* Kopyalandı: toast yok — buton içi yeşil tik + metin (içtihat/mevzuat künye + ref araç) */
button.chat-karar-kunye-copy-wrap.chat-copy-btn--success {
    background: var(--chat-copy-success-bg);
    box-shadow: inset 0 0 0 1px var(--chat-copy-success-ring);
}

button.chat-karar-kunye-copy-wrap.chat-copy-btn--success:hover {
    background: var(--chat-copy-success-bg-hover);
}

button.chat-karar-kunye-copy-wrap.chat-copy-btn--success .chat-karar-kunye-copy-icon {
    color: var(--chat-soft-green-bright);
    transform: scale(0.78) rotate(-10deg);
    opacity: 0.75;
    transition:
        color 0.22s ease,
        transform 0.42s cubic-bezier(0.34, 1.45, 0.64, 1),
        opacity 0.26s ease;
}

button.chat-karar-kunye-copy-wrap.chat-copy-btn--success.chat-copy-btn--success-in .chat-karar-kunye-copy-icon {
    transform: scale(1) rotate(0deg);
    opacity: 1;
}

.chat-karar-kunye-copy-labels--success {
    min-width: 0;
}

.chat-karar-kunye-copy-success-text {
    display: block;
    font-size: 9.5px;
    font-weight: 700;
    color: var(--chat-soft-green-bright);
    letter-spacing: 0.035em;
    line-height: 1.2;
    white-space: nowrap;
    opacity: 0;
    transform: translateY(5px);
    transition:
        opacity 0.32s cubic-bezier(0.22, 1, 0.36, 1) 0.06s,
        transform 0.4s cubic-bezier(0.22, 1, 0.36, 1) 0.06s,
        color 0.22s ease;
}

button.chat-karar-kunye-copy-wrap.chat-copy-btn--success-in .chat-karar-kunye-copy-success-text {
    opacity: 1;
    transform: translateY(0);
}

.chat-ref-copy-btn.chat-copy-btn--success {
    width: auto;
    min-width: 30px;
    max-width: min(200px, 46vw);
    padding: 0 10px 0 8px;
    gap: 7px;
    justify-content: flex-start;
    border-color: var(--chat-copy-success-border);
    background: var(--chat-copy-success-bg);
    color: var(--chat-soft-green-bright);
    box-shadow: 0 0 0 1px var(--chat-copy-success-ring);
}

.chat-ref-copy-btn.chat-copy-btn--success:hover {
    color: color-mix(in srgb, var(--chat-soft-green-bright) 82%, #ffffff 18%);
    border-color: color-mix(in srgb, var(--chat-copy-success-border) 75%, var(--chat-soft-green-bright) 25%);
    background: var(--chat-copy-success-bg-hover);
}

.chat-ref-copy-btn.chat-copy-btn--success svg {
    flex-shrink: 0;
    color: var(--chat-soft-green);
}

.chat-ref-copy-btn-success-label {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.025em;
    line-height: 1.1;
    white-space: nowrap;
    color: var(--chat-soft-green-bright);
    opacity: 0;
    transform: translateX(-6px);
    transition:
        opacity 0.3s cubic-bezier(0.22, 1, 0.36, 1) 0.08s,
        transform 0.38s cubic-bezier(0.22, 1, 0.36, 1) 0.08s;
}

.chat-ref-copy-btn.chat-copy-btn--success-in .chat-ref-copy-btn-success-label {
    opacity: 1;
    transform: translateX(0);
}

.chat-message.assistant .chat-message-actions-btn.chat-message-copy-btn {
    transition:
        color 0.2s ease,
        border-color 0.2s ease,
        background 0.2s ease,
        transform 0.2s ease,
        box-shadow 0.28s ease;
}

.chat-message.assistant .chat-message-actions-btn.chat-message-copy-btn.chat-copy-btn--success {
    color: var(--chat-soft-green-bright);
    border-color: var(--chat-copy-success-border);
    background: var(--chat-copy-success-bg-hover);
    box-shadow: 0 0 0 1px var(--chat-copy-success-ring);
}

.chat-message.assistant .chat-message-actions-btn.chat-message-copy-btn.chat-copy-btn--success-in svg {
    animation: chat-copy-tick-pop 0.48s cubic-bezier(0.34, 1.45, 0.64, 1) both;
}

@keyframes chat-copy-tick-pop {
    0% {
        transform: scale(0.55) rotate(-12deg);
        opacity: 0.35;
    }
    100% {
        transform: scale(1) rotate(0deg);
        opacity: 1;
    }
}

@media (prefers-reduced-motion: reduce) {
    button.chat-karar-kunye-copy-wrap.chat-copy-btn--success .chat-karar-kunye-copy-icon {
        transform: none;
        opacity: 1;
        transition: color 0.15s ease;
    }

    button.chat-karar-kunye-copy-wrap.chat-copy-btn--success-in .chat-karar-kunye-copy-icon {
        transform: none;
    }

    .chat-karar-kunye-copy-success-text,
    .chat-ref-copy-btn-success-label {
        transition: none;
        opacity: 1;
        transform: none;
    }

    .chat-message.assistant .chat-message-actions-btn.chat-message-copy-btn.chat-copy-btn--success-in svg {
        animation: none;
    }
}

/* Sağ panel mevzuat başlığı - kompakt */
.mevzuat-sidebar-detail-title-wrap {
    margin-bottom: 10px;
}
.mevzuat-sidebar-detail-title {
    font-size: 14px !important;
    font-weight: 600;
    line-height: 1.35;
}
.mevzuat-sidebar-detail-madde {
    font-size: 13px;
    font-weight: 500;
    color: var(--chat-ref-color);
    margin-top: 4px;
    line-height: 1.35;
}

.chat-ref-tools {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 10px 0;
    padding: 4px 0 8px 0;
    border-bottom: 1px solid var(--chat-wa-800);
}

.chat-ref-search-wrap {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.chat-ref-search-input {
    flex: 1;
    min-width: 0;
    height: 30px;
    border-radius: 8px;
    border: 1px solid var(--chat-border);
    background: var(--chat-wa-300);
    color: var(--chat-text);
    padding: 0 9px;
    font-size: 12px;
    outline: none;
}

.chat-ref-search-meta {
    flex-shrink: 0;
    min-width: 38px;
    text-align: center;
    font-size: 10px;
    font-weight: 500;
    color: var(--chat-text-muted);
    border: 1px solid var(--chat-wa-600);
    border-radius: 999px;
    padding: 3px 7px;
    background: var(--chat-wa-250);
}

.chat-ref-search-input:focus {
    border-color: var(--chat-primary);
    box-shadow: 0 0 0 2px rgba(124, 148, 255, 0.18);
}

.chat-ref-tools-actions {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.chat-ref-copy-btn {
    height: 30px;
    border-radius: 8px;
    border: 1px solid var(--chat-border);
    background: var(--chat-wa-300);
    color: var(--chat-text-secondary);
    padding: 0 9px;
    font-size: 12px;
    cursor: pointer;
    transition:
        background 0.18s ease,
        color 0.18s ease,
        border-color 0.18s ease,
        width 0.34s cubic-bezier(0.22, 1, 0.36, 1),
        padding 0.34s cubic-bezier(0.22, 1, 0.36, 1),
        box-shadow 0.26s ease,
        gap 0.26s ease;
}

.chat-ref-copy-btn:hover {
    color: var(--chat-text);
    border-color: var(--chat-wa-1600);
    background: var(--chat-wa-600);
}

.chat-ref-copy-btn {
    width: 30px;
    min-width: 30px;
    padding: 0;
    gap: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.chat-ref-copy-btn svg {
    width: 14px;
    height: 14px;
}

/* Mevzuat referans paneli paragraf ve işaret stilleri */
.mevzuat-ref-paragraph {
    margin: 10px 0;
    padding: 0;
    line-height: 1.8;
    font-size: 14px;
    color: var(--chat-text);
    text-align: justify;
}

.mevzuat-ref-marker {
    display: inline-block;
    min-width: 2.2em;
    font-weight: 600;
    color: var(--chat-ref-color);
    margin-right: 6px;
}

.mevzuat-sidebar-back-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    background: var(--chat-wa-600);
    color: var(--chat-wa-8500);
    border: 1px solid var(--chat-wa-1000);
    border-radius: 6px;
    cursor: pointer;
    font-size: 11px;
    font-weight: 500;
    font-family: var(--chat-font);
    transition: all 0.2s ease;
    margin-bottom: 12px;
}

.mevzuat-sidebar-back-btn:hover {
    background: var(--chat-wa-1000);
    border-color: var(--chat-wa-1800);
    color: var(--chat-text-emphasis);
}

.mevzuat-sidebar-back-btn svg {
    width: 12px;
    height: 12px;
}

/* İçtihat detay başlığı: geri ikonu + "Çıkarım" yan yana (temel .mevzuat-sidebar-back-btn margin'inden sonra tanımlanmalı) */
.mevzuat-sidebar-back-btn.mevzuat-sidebar-back-btn--icon-only {
    margin-bottom: 0;
    padding: 4px 6px;
    gap: 0;
    flex-shrink: 0;
    align-self: center;
}

.mevzuat-sidebar-back-btn.mevzuat-sidebar-back-btn--icon-only svg {
    width: 14px;
    height: 14px;
    display: block;
}

.mevzuat-sidebar-item-link {
    font-size: 10px;
    color: var(--chat-wa-6000);
    font-weight: 500;
}

/* Sol bar mevzuat listesi: “Linke git” harici link ikonu */
.mevzuat-sidebar-external-link-icon {
    flex-shrink: 0;
    color: var(--accent-2);
}

.mevzuat-sidebar-item-preview {
    font-size: 11px;
    color: var(--chat-wa-5000);
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-top: 6px;
}

/* Overlay - sadece mobilde referans paneli açıkken görünür */
.chat-ref-panel-overlay {
    display: none;
}

@media (max-width: 768px) {
    .chat-ictihat-modal-content {
        max-height: 90vh;
    }
    
    .chat-ictihat-modal-header,
    .chat-ictihat-modal-body {
        padding: 16px;
    }
    
    .mevzuat-sidebar.show {
        width: 100%;
    }
    
    .mevzuat-sidebar-content {
        width: 100%;
    }
    
    /* Referans paneli mobilde tam ekran — her zaman fixed, layout dışında, tek GPU katmanı */
    .chat-ref-panel {
        position: fixed !important;
        top: 0;
        right: 0;
        bottom: 0;
        width: 100vw !important;
        max-width: 100vw !important;
        min-width: 0 !important;
        z-index: 101;
        border: none;
        box-shadow: none;
        transform: translateX(100%);
        will-change: transform;
        backface-visibility: hidden;
        -webkit-backface-visibility: hidden;
        /* Kapanış: hızlı ease-in çıkış */
        transition: transform 0.22s cubic-bezier(0.4, 0, 1, 1) !important;
        overflow: hidden;
        border-radius: 0 !important;
        isolation: isolate;
    }

    /* Açılış: yay gibi yumuşak giriş */
    .chat-main-wrap.has-ref-panel .chat-ref-panel {
        transform: translateX(0);
        transition: transform 0.36s cubic-bezier(0.22, 1, 0.36, 1) !important;
    }

    /* Overlay — sadece opacity ile yumuşak karartma (backdrop-filter yok, compositing sorunu olmasın) */
    .chat-ref-panel-overlay {
        display: block !important;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, 0.52);
        z-index: 100;
        cursor: pointer;
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.26s ease;
    }

    .chat-main-wrap.has-ref-panel .chat-ref-panel-overlay {
        opacity: 1;
        pointer-events: auto;
    }
}

/* Dilekçe Preview */
.chat-dilekce-preview {
    margin-top: 14px;
    background: var(--light-accent);
    border: 1px solid var(--chat-border);
    border-radius: var(--chat-radius-md);
    overflow: hidden;
}

.chat-dilekce-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 14px;
    background: var(--chat-surface);
    border-bottom: 1px solid var(--chat-border);
}

.chat-dilekce-title {
    font-size: 13px;
    font-weight: 600;
    color: var(--chat-text);
}

.chat-dilekce-actions {
    display: flex;
    gap: 8px;
}

.chat-dilekce-btn {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    background: var(--chat-primary);
    color: white;
    border: none;
    border-radius: var(--chat-radius-sm);
    font-family: var(--chat-font);
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    transition: var(--chat-transition);
}

.chat-dilekce-btn:hover {
    background: var(--chat-primary-light);
}

.chat-dilekce-btn.secondary {
    background: transparent;
    color: var(--chat-text-secondary);
    border: 1px solid var(--chat-border);
}

.chat-dilekce-btn.secondary:hover {
    background: var(--chat-surface-alt);
}

.chat-dilekce-content {
    padding: 14px;
    font-size: 13px;
    line-height: 1.7;
    max-height: 350px;
    overflow-y: auto;
    white-space: pre-wrap;
    color: var(--chat-text);
}

/* Error State */
.chat-error {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px;
    background: rgba(220, 38, 38, 0.15);
    border: 1px solid rgba(220, 38, 38, 0.3);
    border-radius: var(--chat-radius-md);
}

.chat-error-icon {
    width: 20px;
    height: 20px;
    color: var(--chat-error);
    flex-shrink: 0;
}

.chat-error-content {
    flex: 1;
}

.chat-error-title {
    font-size: 13px;
    font-weight: 600;
    color: var(--chat-error);
    margin-bottom: 4px;
}

.chat-error-message {
    font-size: 12px;
    color: var(--notr2);
}

/* Subscription Required */
.chat-subscription-required {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 28px;
    background: linear-gradient(135deg, var(--chat-primary-subtle) 0%, var(--chat-accent-subtle) 100%);
    border: 1px solid var(--chat-primary);
    border-radius: var(--chat-radius-lg);
    text-align: center;
}

.chat-subscription-icon {
    width: 52px;
    height: 52px;
    background: var(--chat-primary);
    border-radius: var(--chat-radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    margin-bottom: 14px;
}

.chat-subscription-title {
    font-size: 15px;
    font-weight: 600;
    color: var(--chat-text);
    margin-bottom: 6px;
}

.chat-subscription-message {
    font-size: 13px;
    color: var(--chat-text-secondary);
    margin-bottom: 18px;
}

.chat-subscription-btn {
    padding: 10px 22px;
    background: var(--chat-primary);
    color: white;
    border: none;
    border-radius: var(--chat-radius-md);
    font-family: var(--chat-font);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: var(--chat-transition);
}

.chat-subscription-btn:hover {
    background: var(--chat-primary-light);
}

/* Subscription Footer */
.chat-subscription-footer {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 24px;
    padding: 12px 24px;
    background: var(--chat-surface);
    border-top: 1px solid var(--chat-border);
    flex-shrink: 0;
}

.chat-sub-item {
    display: flex;
    flex-direction: column;
    gap: 4px;
    align-items: center;
}

.chat-sub-label {
    font-size: 11px;
    color: var(--chat-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.chat-sub-value {
    font-size: 13px;
    font-weight: 600;
    color: var(--chat-text);
}

.chat-sub-value-big {
    font-size: 18px;
    font-weight: 700;
    color: var(--chat-primary);
}

.chat-sub-highlight .chat-sub-label {
    color: var(--chat-primary);
}

.chat-sub-divider {
    width: 1px;
    height: 32px;
    background: var(--chat-border);
}

.chat-upgrade-btn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 11px 26px;
    background: var(--accent);
    color: var(--chat-text-inverse);
    border: none;
    border-radius: var(--chat-radius-full);
    font-family: var(--chat-font);
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: transform 180ms var(--chat-ease), box-shadow 180ms var(--chat-ease), background 180ms var(--chat-ease);
    overflow: hidden;
    z-index: 0;
}

.chat-upgrade-btn:hover {
    background: var(--dark-accent);
    transform: translate(-50%, -52%);
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.15);
}

.chat-upgrade-btn svg {
    width: 18px;
    height: 18px;
}

/* Animated gradient border around upgrade button */
.chat-upgrade-btn::before {
    content: '';
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: conic-gradient(
        from 0deg,
        var(--siyah),
        var(--notr3),
        var(--siyah),
        var(--notr3),
        var(--siyah)
    );
    z-index: -2;
    animation: chat-upgrade-border 4s linear infinite;
}

.chat-upgrade-btn::after {
    content: '';
    position: absolute;
    inset: 1px;
    border-radius: inherit;
    background: linear-gradient(
        135deg,
        var(--chat-wa-1800),
        var(--chat-wa-200)
    );
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    box-shadow: inset 0 0 0 1px var(--chat-wa-800);
    z-index: -1;
}

@keyframes chat-upgrade-border {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

/* ============================================
   RESPONSIVE
   ============================================ */
@media (max-width: 1024px) {
    .chat-sidebar {
        position: fixed;
        left: -100%;
        top: 0;
        bottom: 0;
        z-index: 1000;
        transition: var(--chat-transition);
    }

    .chat-sidebar-header-collapse-btn {
        display: none !important;
    }
    
    .chat-sidebar.open {
        left: 0;
    }
    
    .chat-sidebar-overlay {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0,0,0,0.5);
        z-index: 999;
    }
    
    .chat-sidebar-overlay.open {
        display: block;
        cursor: pointer;
        touch-action: manipulation;
        -webkit-tap-highlight-color: transparent;
    }
    
    .chat-mobile-toggle {
        display: flex;
    }
    
    .chat-quick-actions {
        max-width: 100%;
    }
}

@media (max-width: 768px) {
    .chat-messages {
        padding: 16px;
        overflow-x: hidden;
    }
    
    .chat-quick-actions {
        max-width: 100%;
        gap: 10px;
    }
    
    .chat-welcome {
        padding: 32px 16px;
        width: 100%;
        max-width: 100%;
    }
    
    .chat-welcome-logo {
        height: 32px;
    }

    .chat-welcome-logo--light {
        width: 32px;
        max-width: 32px;
        height: 32px;
    }
    
    .chat-welcome-header {
        padding-left: 16px;
    }
    
    .chat-welcome-greeting {
        font-size: 18px;
    }
    
    .chat-welcome-title {
        font-size: 26px;
        margin-bottom: 24px;
        padding-left: 16px;
    }
    
    .chat-welcome p {
        font-size: 13px;
        max-width: 100%;
    }
    
    .chat-input-area-welcome {
        margin-bottom: 24px;
    }
    
    .chat-quick-actions {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 8px;
        justify-content: center;
    }
    
    .chat-quick-action {
        flex: 1;
        min-width: calc(33.333% - 6px);
        max-width: calc(33.333% - 6px);
        padding: 12px 14px;
    }
    
    .chat-quick-action h3 {
        font-size: 12px;
    }
    
    .chat-input-area {
        padding: 12px 16px;
        overflow-x: hidden;
    }

    /* Mobilde dot nav gizli — ekran çok dar */
    .chat-dot-nav {
        display: none !important;
    }

    .chat-dot-nav-tooltip {
        display: none !important;
    }
    
    .chat-input-container {
        padding: 0;
        max-width: 100%;
    }
    
    .chat-input-wrapper {
        padding: 6px 6px 6px 14px;
        max-width: 100%;
    }

    .chat-input-controls {
        padding: 6px 8px 6px 10px;
    }

    .chat-input-bar {
        flex-wrap: wrap;
        align-items: center;
        gap: 6px;
        row-gap: 7px;
        width: 100%;
    }

    .chat-input-bar .chat-send-btn,
    .chat-input-bar .chat-stop-btn {
        order: 50;
        margin-left: auto;
    }

    .chat-enchant-btn {
        min-height: 24px;
        padding: 4px 8px;
        gap: 5px;
        font-size: 10px;
    }

    .chat-enchant-btn .enchant-icon-wand {
        width: 11px;
        height: 11px;
    }

    .chat-file-btn,
    .de-open-editor-btn,
    .chat-search-toggle-pill {
        min-height: 24px;
        padding: 4px 8px;
        font-size: 10px;
        gap: 5px;
        max-width: 100%;
    }

    .chat-search-toggle {
        margin: 0;
        flex-shrink: 1;
        min-width: 0;
    }
    
    .chat-input {
        font-size: 16px;
        max-width: 100%;
    }
    
    .chat-message {
        max-width: 100%;
        width: 100%;
    }
    
    .chat-message.assistant {
        max-width: 100%;
    }
    
    .chat-message-content {
        max-width: calc(100% - 46px);
        width: fit-content;
    }
    
    .chat-message-loading .chat-message-content {
        max-width: calc(100% - 46px);
        width: fit-content;
    }
    
    .chat-input-hints {
        display: none;
    }
    
    .chat-header-title span {
        display: none;
    }
    
    .chat-header {
        padding: 12px 16px;
        overflow-x: hidden;
    }

    #dilekce-editor-panel .de-header {
        padding: 12px 16px;
    }
    
    .chat-subscription-footer {
        flex-wrap: wrap;
        gap: 12px;
        padding: 10px 16px;
        overflow-x: hidden;
    }
    
    .chat-sub-divider {
        display: none;
    }
    
    .chat-upgrade-btn {
        width: 100%;
        justify-content: center;
        margin-left: 0;
        margin-top: 8px;
    }
}

/* Sidebar overlay ile aynı kırılım: üst bar (Yeni Sohbet) ekranda sabit, klavye/görünüm değişiminde kaymasın */
@media (max-width: 1024px) {
    .chat-header {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: 50;
        width: 100%;
        max-width: 100vw;
        box-sizing: border-box;
        padding: 12px 16px;
        padding-top: calc(12px + env(safe-area-inset-top, 0px));
        padding-left: calc(16px + env(safe-area-inset-left, 0px));
        padding-right: calc(16px + env(safe-area-inset-right, 0px));
        overflow-x: hidden;
        background: var(--chat-bg);
        border-bottom: var(--chat-card-border);
    }

    .chat-main {
        padding-top: var(--chat-mobile-header-offset, calc(48px + env(safe-area-inset-top, 0px)));
    }

    .chat-header-title h2 {
        font-size: 14px;
    }

    .chat-title-display {
        font-size: 14px;
    }

    /* Başlık düzenlerken metin büyümesin: input ile h2 aynı puntoda */
    .chat-title-input {
        font-size: 14px;
    }

    /* Dilekçe üst şerit: bu kırılımda .chat-header ile aynı iç boşluk (üst çizgi hizası) */
    #dilekce-editor-panel .de-header {
        padding: 12px 16px;
        padding-top: calc(12px + env(safe-area-inset-top, 0px));
        padding-left: calc(16px + env(safe-area-inset-left, 0px));
        padding-right: calc(16px + env(safe-area-inset-right, 0px));
        min-height: 56px;
        box-sizing: border-box;
    }
}

/* Mobile keyboard-aware layout: input bar klavyenin üzerinde, mesajlar sıkışmaz */
@media (max-width: 768px) {
    .chat-app {
        height: 100%;
        max-height: 100%;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
    }

    .chat-main-wrap {
        padding: 0;
        background: var(--chat-bg);
    }

    .chat-main {
        height: 100%;
        position: relative;
        border-radius: 0;
        border: none;
        box-shadow: none;
    }

    .chat-input-area {
        flex-shrink: 0;
        padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
        z-index: 10;
        background: var(--chat-bg);
    }

    .chat-main.mobile-kb-open .chat-input-area {
        padding-bottom: 6px;
    }

    .chat-input-area-welcome {
        padding-bottom: env(safe-area-inset-bottom, 0px);
    }
}

/* Dar mobil: "araştırma" ikinci satırda; pill genişlemesin, gönder ile çakışmasın */
@media (max-width: 520px) {
    .chat-search-toggle-pill {
        white-space: normal;
        align-items: center;
        min-width: 0;
        max-width: 100%;
        flex-shrink: 1;
    }

    .chat-search-toggle-text {
        flex-direction: column;
        align-items: flex-start;
        white-space: normal;
        gap: 0;
        line-height: 1.1;
    }

    .chat-search-toggle-head,
    .chat-search-toggle-tail {
        line-height: 1.1;
    }
}

@media (max-width: 420px) {
    .chat-input-controls {
        padding: 6px 6px 6px 8px;
    }

    .chat-file-btn,
    .de-open-editor-btn,
    .chat-search-toggle-pill {
        min-width: 28px;
        padding: 4px 7px;
        gap: 0;
        justify-content: center;
    }

    .chat-file-btn-text,
    .de-open-editor-btn-text,
    .chat-search-toggle-text {
        display: none !important;
    }

    /* Mobilde: özellik seçilince adını göster; iki satır (Hızlı/Derin + araştırma) */
    .chat-search-toggle-label input[type="checkbox"]:checked + .chat-search-toggle-pill .chat-search-toggle-text {
        display: inline-flex !important;
        flex-direction: column;
        align-items: flex-start;
        margin-left: 4px;
        gap: 0;
        line-height: 1.1;
    }

    /* Editör açık (seçili) durumunda buton adını göster */
    .de-open-editor-btn.open .de-open-editor-btn-text {
        display: inline !important;
        margin-left: 4px;
    }

    .chat-file-btn svg,
    .de-open-editor-btn svg,
    .chat-search-toggle-icon {
        width: 13px;
        height: 13px;
    }
}

@media (max-width: 360px) {
    .chat-search-toggle-label input[type="checkbox"]:checked + .chat-search-toggle-pill {
        align-items: center;
        min-height: 24px;
        height: auto;
        padding-top: 3px;
        padding-bottom: 3px;
    }
}

/* ============================================
   SUGGESTIONS (Quick Replies)
   ============================================ */
.chat-suggestions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}

.chat-suggestion-btn {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    border: none;
    border-radius: 20px;
    padding: 8px 16px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    box-shadow: 0 2px 8px rgba(102, 126, 234, 0.2);
}

.chat-suggestion-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

.chat-suggestion-btn:active {
    transform: translateY(0);
}

/* ============================================
   PRINT
   ============================================ */
@media print {
    .chat-sidebar,
    .chat-header,
    .chat-input-area,
    .chat-quick-actions,
    .chat-suggestions {
        display: none !important;
    }
    
    .chat-main {
        width: 100%;
    }
    
    .chat-messages {
        overflow: visible;
        padding: 0;
    }
}

/* ============================================
   LOADING DOTS
   ============================================ */
.chat-loading-dots {
    display: inline-flex;
    gap: 4px;
    align-items: center;
    width: fit-content;
    max-width: 100%;
}

.chat-loading-dots span {
    width: 6px;
    height: 6px;
    background: var(--chat-text-muted);
    border-radius: 50%;
    animation: chat-loading-bounce 1.4s infinite ease-in-out both;
}

.chat-loading-dots span:nth-child(1) {
    animation-delay: -0.32s;
}

.chat-loading-dots span:nth-child(2) {
    animation-delay: -0.16s;
}

@keyframes chat-loading-bounce {
    0%, 80%, 100% {
        transform: scale(0);
        opacity: 0.5;
    }
    40% {
        transform: scale(1);
        opacity: 1;
    }
}

/* Fix loading animations */
.chat-loading-dots {
    display: inline-flex;
    gap: 4px;
    align-items: center;
    width: fit-content;
    max-width: 100%;
    min-width: 0;
    flex-shrink: 0;
}

.chat-loading-dots span {
    width: 6px;
    height: 6px;
    background: var(--chat-text-muted);
    border-radius: 50%;
    animation: chat-loading-bounce 1.4s infinite ease-in-out both;
    flex-shrink: 0;
    display: block;
}

/* Loading with text */
.chat-loading-with-text {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
/* Top Büyüklüğü */
.chat-normal-loading-lottie {
    width: 52px;
    height: 52px;
    flex-shrink: 0;
}

.chat-normal-loading-lottie svg {
    width: 100%;
    height: 100%;
    display: block;
}

.chat-loading-text {
    font-size: 14px;
    color: var(--chat-text-secondary);
    font-weight: 500;
    line-height: 1.5;
}

.chat-message-loading .chat-message-content {
    background: transparent;
    border: none;
    padding: 0;
    width: fit-content;
    max-width: calc(100% - 46px);
    min-width: 0;
}

/* ============================================
   HIZLI ARAŞTIRMA – Lottie animasyon + aktif adım metni + ... animasyonu
   ============================================ */
.chat-quick-research-progress .chat-message-content {
    padding: 4px 0;
}

.chat-quick-research-line {
    display: flex;
    align-items: center; /* Lottie + metin aynı satırda, dikeyde ortalı */
    gap: -4px;
    flex-wrap: nowrap; /* Metin soldaki animasyonun yanından kopmasın */
}

/* Derin araştırma: eski görünüm gibi alt hizalı */
.chat-deep-research-progress .chat-quick-research-line {
    align-items: flex-end;
}

.chat-quick-research-text {
    display: inline-flex;
    align-items: center; /* Metin ve . . . kendi içinde aynı hizada */
    gap: 6px;
    margin: 0;
    flex: 1 1 auto;
    min-width: 0; /* Dar alanda taşmak yerine satır içi sarılabilsin */
    transform: translateY(-2px);
}

.chat-deep-research-progress .chat-quick-research-text {
    margin-bottom: 2px;
    transform: translateY(-7px);
}

.chat-quick-research-lottie {
    flex-shrink: 0;
    width: 96px;
    height: 96px;
}

.chat-quick-research-lottie svg {
    width: 100%;
    height: 100%;
    display: block;
}

.chat-quick-research-label {
    font-size: 14px;
    font-weight: 500;
    color: var(--chat-text-secondary);
    line-height: 1.5;
    margin: 0;
    transition: opacity 0.2s ease;
    overflow-wrap: anywhere;
}

.chat-quick-research-dots {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    margin: 0;
    align-self: auto;
    transform: none;
}

.chat-quick-research-dots span {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--chat-text-muted);
    animation: chat-quick-research-dots-bounce 1.4s ease-in-out infinite both;
}

.chat-quick-research-dots span:nth-child(1) { animation-delay: -0.32s; }
.chat-quick-research-dots span:nth-child(2) { animation-delay: -0.16s; }
.chat-quick-research-dots span:nth-child(3) { animation-delay: 0s; }

@keyframes chat-quick-research-dots-bounce {
    0%, 80%, 100% { transform: scale(0.6); opacity: 0.5; }
    40% { transform: scale(1); opacity: 1; }
}

/* ============================================
   INLINE REFERANSLAR - paragraf devamında parantez içi
   ============================================ */
.chat-ref-inline {
    display: inline-block;
    white-space: nowrap;
    font-weight: 400;
    cursor: pointer;
    color: var(--chat-text-muted);
    font-size: 0.8em;
    transition: opacity 0.15s ease;
}
.chat-ref-inline:hover {
    opacity: 0.9;
}
.chat-ref-inline .chat-ref-inline-label {
    color: var(--chat-ref-color);
    text-decoration: underline;
}
.chat-ref-inline:hover .chat-ref-inline-label {
    color: var(--chat-ref-color);
}

/* Metin içi (<mark>): kare köşeli sol şerit + hafif zemin; sağda ekstra kutu genişliği yok */
mark.chat-ref-marker-highlight {
    background-color: var(--chat-mevzuat-hl-fill-mark);
    color: inherit;
    font-weight: 500;
    padding: 0.06em 0 0.06em 0.28em;
    margin: 0;
    border: none;
    border-left: 3px solid var(--chat-mevzuat-hl-rail);
    border-radius: 0;
    box-shadow: none;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
    transition: background-color 0.15s var(--chat-ease);
}

/* Hedef paragraf: sol şerit panel içinde biraz sola; gövde metni diğer .mevzuat-ref-paragraph ile aynı hizada
   (-outdent + border + padding-left = 0). */
p.mevzuat-ref-paragraph-highlight {
    --mevzuat-hl-outdent: 12px;
    --mevzuat-hl-rail-w: 3px;
    margin: 10px 0;
    margin-left: calc(-1 * var(--mevzuat-hl-outdent));
    padding: 8px 0 8px calc(var(--mevzuat-hl-outdent) - var(--mevzuat-hl-rail-w));
    border: none;
    border-left: var(--mevzuat-hl-rail-w) solid var(--chat-mevzuat-hl-rail);
    border-radius: 0;
    color: var(--notr1);
    background-color: var(--chat-mevzuat-hl-fill);
    box-shadow: none;
    transition: background-color 0.15s var(--chat-ease);
}

/* Paragraf zaten sol rail ile çerçeveli; içteki <mark> tekrar sol border basmasın (çift çubuk / sıkışma yok) */
p.mevzuat-ref-paragraph-highlight mark.chat-ref-marker-highlight {
    border-left: none;
    padding-left: 0.12em;
}

p.mevzuat-ref-paragraph-highlight .mevzuat-ref-marker {
    color: var(--notr2);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.02em;
}

.chat-ref-search-hit {
    background: rgba(124, 148, 255, 0.24);
    color: inherit;
    border-radius: 3px;
    padding: 0 1px;
}

.chat-ref-search-hit.is-active {
    background: rgba(118, 184, 255, 0.46);
    box-shadow: 0 0 0 1px rgba(118, 184, 255, 0.65);
}

/* ============================================
   MEVZUAT ALINTI STİLLERİ (legacy - artık inline kullanılıyor)
   ============================================ */
.mevzuat-alinti-container {
    margin: 16px 0;
    border-left: 3px solid var(--chat-primary);
    background: var(--chat-surface);
    border-radius: var(--chat-radius-md);
    padding: 0;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    transition: all var(--chat-transition);
}

.mevzuat-alinti-container:hover {
    box-shadow: 0 4px 12px rgba(91, 95, 122, 0.2);
    border-left-color: var(--chat-primary-light);
}

.mevzuat-alinti-header {
    background: var(--chat-wa-600);
    padding: 10px 14px;
    font-size: 12px;
    font-weight: 600;
    color: var(--chat-text-emphasis);
    letter-spacing: 0.35px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    cursor: pointer;
    user-select: none;
    transition: background 0.15s ease;
}

.mevzuat-alinti-header:hover {
    background: var(--chat-wa-1000);
}

.mevzuat-alinti-header-text {
    flex: 1;
    min-width: 0;
}

.mevzuat-alinti-chevron {
    flex-shrink: 0;
    transition: transform 0.2s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    opacity: 0.9;
}

.mevzuat-alinti-chevron svg {
    width: 16px;
    height: 16px;
}

.mevzuat-alinti-container.mevzuat-alinti-expanded .mevzuat-alinti-chevron {
    transform: rotate(180deg);
}

.mevzuat-alinti-content {
    display: none;
    padding: 14px 16px;
    color: var(--chat-text);
    line-height: 1.7;
    font-size: 14px;
    background: var(--chat-surface);
    border-top: 1px solid var(--chat-border);
}

.mevzuat-alinti-container.mevzuat-alinti-expanded .mevzuat-alinti-content {
    display: block;
}

.mevzuat-alinti-content p {
    margin: 0 0 10px 0;
}

.mevzuat-alinti-content p:last-child {
    margin-bottom: 0;
}

.mevzuat-alinti-content strong {
    color: var(--chat-text-emphasis);
    font-weight: 700;
    letter-spacing: 0.01em;
}

/* Mevzuat alıntısı içindeki listeler */
.mevzuat-alinti-content ul,
.mevzuat-alinti-content ol {
    margin: 10px 0;
    padding-left: 24px;
}

.mevzuat-alinti-content li {
    margin: 6px 0;
    color: var(--chat-text-secondary);
}

/* Mevzuat alıntısı içindeki başlıklar */
.mevzuat-alinti-content h1,
.mevzuat-alinti-content h2,
.mevzuat-alinti-content h3 {
    color: var(--chat-text);
    margin: 12px 0 8px 0;
    font-weight: 600;
}

.mevzuat-alinti-content h1 {
    font-size: 18px;
}

.mevzuat-alinti-content h2 {
    font-size: 16px;
}

.mevzuat-alinti-content h3 {
    font-size: 15px;
}

/* ============================================
   YAPILANDIRILMIŞ YANIT FORMATLAMA STİLLERİ
   ============================================ */

/* Bölüm arası boşluklar ve görsel hiyerarşi */
.chat-message-content > h2 {
    margin-top: 24px;
    margin-bottom: 16px;
    padding-bottom: 8px;
    border-bottom: 2px solid var(--chat-wa-1000);
}

.chat-message-content > h2:first-child {
    margin-top: 0;
}

.chat-message-content > h3 {
    margin-top: 20px;
    margin-bottom: 12px;
    color: var(--chat-text-emphasis);
    font-weight: 600;
}

.chat-message-content > h3:first-child {
    margin-top: 0;
}

/* Paragraflar arası boşluk */
.chat-message-content > p {
    margin-bottom: 16px;
    line-height: 1.8;
}

.chat-message-content > p:last-child {
    margin-bottom: 0;
}

/* Liste stilleri - daha iyi görsel hiyerarşi */
.chat-message-content > ul,
.chat-message-content > ol {
    margin: 16px 0;
    padding-left: 28px;
}

.chat-message-content > ul > li,
.chat-message-content > ol > li {
    margin-bottom: 10px;
    line-height: 1.75;
    padding-left: 6px;
}

/* İç içe listeler */
.chat-message-content ul ul,
.chat-message-content ol ol {
    margin-top: 8px;
    margin-bottom: 8px;
    padding-left: 24px;
}

/* Blockquote - önemli notlar için */
.chat-message-content > blockquote {
    border-left: 4px solid var(--chat-primary);
    padding: 12px 16px;
    margin: 20px 0;
    background: rgba(99, 102, 241, 0.08);
    border-radius: 0 8px 8px 0;
    color: var(--chat-text-body);
    font-style: italic;
}

.chat-message-content > blockquote p {
    margin: 0;
    line-height: 1.7;
}

.chat-message-content > blockquote p:not(:last-child) {
    margin-bottom: 8px;
}

/* Kalın metin vurgusu */
.chat-message-content strong {
    color: var(--chat-text-emphasis);
    font-weight: 700;
    letter-spacing: 0.01em;
}

/* Bölüm ayırıcıları (hr) */
.chat-message-content > hr {
    border: none;
    border-top: 1px solid var(--chat-wa-1000);
    margin: 24px 0;
}

/* Lavren AI tabloları ([[LAV_TABLE]]) */
.chat-message-content .chat-lav-table-wrap {
    overflow-x: auto;
    margin: 20px 0;
    -webkit-overflow-scrolling: touch;
}

.chat-message-content .chat-lav-table tr.lav-table-row-partial td,
.chat-message-content .chat-lav-table tr.lav-table-row-partial th {
    opacity: 0.88;
}

/* Tablo stilleri (Markdown / genel) */
.chat-message-content table {
    width: 100%;
    border-collapse: collapse;
    margin: 20px 0;
    font-size: 14px;
}

.chat-message-content table th,
.chat-message-content table td {
    padding: 10px 12px;
    text-align: left;
    border-bottom: 1px solid var(--chat-wa-1000);
}

.chat-message-content table th {
    background: #41455e;
    font-weight: 600;
    color: var(--chat-text-emphasis);
}

.chat-message-content table tr:hover {
    background: var(--chat-wa-300);
}

/* İçerik grupları için daha iyi boşluk */
.chat-message-content > * + h2 {
    margin-top: 32px;
}

.chat-message-content > * + h3 {
    margin-top: 24px;
}

/* Özel vurgu kutuları */
.chat-message-content .highlight-box {
    background: rgba(99, 102, 241, 0.1);
    border-left: 4px solid var(--chat-primary);
    padding: 14px 16px;
    margin: 16px 0;
    border-radius: 0 8px 8px 0;
}

.chat-message-content .warning-box {
    background: rgba(255, 193, 7, 0.1);
    border-left: 4px solid #ffc107;
    padding: 14px 16px;
    margin: 16px 0;
    border-radius: 0 8px 8px 0;
}

.chat-message-content .info-box {
    background: rgba(33, 150, 243, 0.1);
    border-left: 4px solid #2196f3;
    padding: 14px 16px;
    margin: 16px 0;
    border-radius: 0 8px 8px 0;
}

/* Streaming cursor - tamamen kaldırıldı */
.streaming-cursor {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    visibility: hidden !important;
    font-size: 0 !important;
    line-height: 0 !important;
    overflow: hidden !important;
    position: absolute !important;
}

.chat-message.streaming .chat-message-content {
    min-height: 1.5em;
}

/* ============================================
   REFERANS YÜKLEME & GEÇİŞ ANİMASYONLARI
   ============================================ */

/* Streaming sırasında referans tagları gizlenirken gösterilen yükleme göstergesi */
.streaming-ref-loading {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-left: 6px;
    padding: 4px 12px 4px 8px;
    background: var(--chat-primary-subtle);
    border: 1px solid rgba(91, 95, 122, 0.15);
    border-radius: 16px;
    vertical-align: middle;
}

.streaming-ref-loading .streaming-ref-dot {
    width: 7px;
    height: 7px;
    background: var(--chat-primary);
    border-radius: 50%;
    animation: refDotPulse 0.9s ease-in-out infinite;
    flex-shrink: 0;
}

.streaming-ref-loading .streaming-ref-dot:nth-child(1) { animation-delay: 0s; }
.streaming-ref-loading .streaming-ref-dot:nth-child(2) { animation-delay: 0.15s; }
.streaming-ref-loading .streaming-ref-dot:nth-child(3) { animation-delay: 0.3s; }

.streaming-ref-loading .streaming-ref-text {
    font-size: 11px;
    color: var(--chat-text-muted);
    font-weight: 500;
    letter-spacing: 0.02em;
    white-space: nowrap;
    margin-left: 2px;
    animation: refTextPulse 1.5s ease-in-out infinite;
}

@keyframes refDotPulse {
    0%, 100% {
        transform: translateY(0) scale(0.75);
        opacity: 0.4;
    }
    50% {
        transform: translateY(-7px) scale(1.1);
        opacity: 1;
    }
}

@keyframes refTextPulse {
    0%, 100% { opacity: 0.7; }
    50% { opacity: 1; }
}

/* Referans blokları görünür olurken fade + slide-up animasyonu */
@keyframes refFadeSlideIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.mevzuat-alinti-container.ref-animate-in,
.chat-ref-inline.ref-animate-in {
    animation: refFadeSlideIn 0.45s cubic-bezier(0.16, 1, 0.3, 1) both;
}

/* Tool referans butonları (İçtihat / Mevzuat) görünürken animasyon */
.chat-tool-ref-btn.ref-btn-animate-in {
    animation: refFadeSlideIn 0.4s cubic-bezier(0.16, 1, 0.3, 1) both;
}

/* ============================================
   DİLEKÇE EDİTÖRÜ PANELİ
   ============================================ */

/* Panel container */
/* Sürükleyerek yeniden boyutlandırırken width transition ile çakışmasın */
#dilekce-editor-panel:has(#de-resize-handle.de-resizing) {
    transition: none !important;
}

#dilekce-editor-panel {
    width: 0;
    flex-shrink: 0;
    overflow: hidden;
    transition: width 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    flex-direction: column;
    background: var(--chat-right-panel-bg);
    border-left: none;
    position: relative;
    z-index: 50;
    border-radius: 8px;
    border: none;
    box-shadow: none;
    box-sizing: border-box;
}

#dilekce-editor-panel.open {
    width: 48vw;
    min-width: 460px;
    max-width: min(70vw, calc(100vw - 520px));
    margin-left: 8px;
    border: var(--chat-card-border);
    border-left: none;
    box-shadow: var(--chat-card-shadow);
    container-type: inline-size;
    container-name: de-panel;
}

.chat-main-wrap.has-editor-panel .chat-main {
    flex: 1;
    min-width: 340px;
    overflow: hidden;
}

/* Inner layout - sürüm paneli açılınca overlap olmasın */
.de-panel-inner {
    display: flex;
    flex-direction: row;
    width: 100%;
    height: 100%;
    min-height: 0;
    overflow: hidden;
    position: relative;
}

/* Resize handle — işlevsel: 8px; üstte: başlık ile dikey “kesik çizgi” oluşmasın, içerik alanı altta genişler */
#dilekce-editor-panel.open .de-panel-inner .de-resize-handle {
    z-index: 5;
}

/* Resize handle — görsel: 1px ince çizgi (header border ile aynı kalınlık), işlevsel: 8px sürüklenebilir alan */
.de-resize-handle {
    width: 8px;
    flex-shrink: 0;
    cursor: col-resize;
    display: flex;
    align-items: stretch;
    justify-content: center;
    background: transparent;
    transition: background 0.15s ease;
    user-select: none;
    position: relative;
}

/* Dilekçe paneli: genişlik ayarı görünür çizgi olmadan (sol kenar sürüklemesi) */
.de-resize-handle::before {
    display: none !important;
    content: none !important;
}

.de-resize-handle:hover,
.de-resize-handle.de-resizing {
    background: transparent;
}

.de-resize-grip {
    display: none;
}

/* Editör gövdesi */
.de-main-row {
    flex: 1;
    display: flex;
    flex-direction: row;
    align-items: stretch;
    min-height: 0;
    min-width: 0;
    overflow: hidden;
    position: relative;
}

.de-main-editor-column {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
}

/* Content area - toolbar ve header burada; sürüm paneli ile çakışmasın diye taşmaz */
.de-content-area {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
    max-width: 100%;
    height: 100%;
    min-height: 0;
    overflow: hidden;
    position: relative;
    z-index: 2;
}

/* Başlık çubuğu panel soluna kadar tek parça: resize şeridinin sağındaki dikey birleşim çizgisini kaldırır */
#dilekce-editor-panel.open:not(.de-fullscreen) .de-content-area {
    margin-left: -8px;
    z-index: 1;
}

/* Header — tek satır; taşarsa başlık küçülür, butonlar kompakt kalır (satıra sarma yok) */
.de-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap;
    gap: 8px;
    padding: 8px 12px;
    border-bottom: 1px solid var(--chat-border);
    flex-shrink: 0;
    /* Dilekçe panelinde tema bloklarıyla ezilir; varsayılan koyu yüzey */
    background: var(--chat-bg);
    position: relative;
    z-index: 10;
    min-height: 48px;
    box-sizing: border-box;
    min-width: 0;
    overflow: visible;
}

/* Dilekçe üst şerit: sohbet .chat-header ile aynı yükseklik ve alt çizgi hizası */
#dilekce-editor-panel .de-header {
    padding: 10px 20px;
    min-height: 56px;
    border-bottom: var(--chat-card-border);
    box-sizing: border-box;
}

/* Koyu tema: üst başlık panel kabı ile aynı renk; kağıt sol bar tonu */
html:not([data-chat-theme="light"]) #dilekce-editor-panel .de-header {
    background: var(--chat-right-panel-bg);
}

/* Editör: çoklu belge sekmeleri */
.de-tabs-bar {
    display: none;
    flex-shrink: 0;
    border-bottom: 1px solid var(--chat-border);
    background: var(--chat-bg);
    padding: 0 8px 6px;
    box-sizing: border-box;
}
#dilekce-editor-panel .de-tabs-bar {
    background: var(--chat-right-panel-bg);
}
.de-tabs-strip {
    display: flex;
    flex-wrap: nowrap;
    gap: 4px;
    overflow-x: auto;
    overflow-y: hidden;
    align-items: center;
    scrollbar-width: thin;
}
.de-tab-wrap {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    max-width: 220px;
    border-radius: 6px 6px 0 0;
    border: 1px solid var(--chat-border);
    border-bottom: none;
    background: rgba(255, 255, 255, 0.05);
}
.de-tab-wrap-active {
    background: var(--chat-panel-surface);
    border-color: var(--accent, #4a86e8);
}
.de-tab {
    border: none;
    background: transparent;
    color: inherit;
    font-size: 12px;
    padding: 5px 2px 5px 8px;
    cursor: pointer;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 170px;
    text-align: left;
    font-family: inherit;
}
.de-tab-wrap-active .de-tab {
    font-weight: 600;
}
.de-tab-close {
    border: none;
    background: transparent;
    color: inherit;
    opacity: 0.65;
    cursor: pointer;
    font-size: 16px;
    line-height: 1;
    padding: 2px 6px 4px 2px;
    border-radius: 4px;
    font-family: inherit;
}
.de-tab-close:hover {
    opacity: 1;
    background: rgba(255, 255, 255, 0.08);
}

html:not([data-chat-theme="light"]) #dilekce-editor-panel .de-toolbar,
html:not([data-chat-theme="light"]) #dilekce-editor-panel .de-editor-wrapper,
html:not([data-chat-theme="light"]) #dilekce-editor-panel .de-statusbar {
    background: var(--chat-right-panel-bg);
}

html:not([data-chat-theme="light"]) #dilekce-editor-panel .de-page {
    background: var(--chat-panel-surface);
}

html:not([data-chat-theme="light"]) #dilekce-editor-panel #de-lavren-editor.de-native-surface-root,
html:not([data-chat-theme="light"]) #de-lavren-editor .de-native-surface {
    background: transparent !important;
}

.de-header .de-header-info {
    min-width: 0;
    flex: 1 1 auto;
}
.de-header .de-title {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}
.de-header .de-subtitle {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: min(160px, 28vw);
}

.de-header-left {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    flex: 1 1 0;
}

.de-header-icon {
    width: 32px;
    height: 32px;
    background: var(--accent);
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    flex-shrink: 0;
}

.de-header-info {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.de-title {
    font-size: 15px;
    font-weight: 500;
    color: var(--chat-text-emphasis);
    margin: 0;
    letter-spacing: -0.15px;
    line-height: 1.25;
    min-width: 0;
}

.de-subtitle {
    font-size: 11px;
    color: var(--chat-text-muted);
    font-weight: 400;
    line-height: 1.25;
    flex-shrink: 0;
    padding-left: 10px;
    border-left: 1px solid var(--chat-border);
    white-space: nowrap;
}

.de-subtitle:empty {
    display: none;
    padding: 0;
    border: none;
}

.de-header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: nowrap;
    gap: 4px;
    min-width: 0;
    flex-shrink: 0;
}

/* Üst bar butonları — ortak iskelet (Kaynakça dahil) */
.de-header .de-header-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    min-height: 30px;
    padding: 4px 7px;
    border-radius: 6px;
    cursor: pointer;
    font-family: var(--chat-font);
    font-size: 11px;
    font-weight: 500;
    transition: all 0.15s ease;
    box-sizing: border-box;
    flex-shrink: 0;
    white-space: nowrap;
}

.de-header .de-header-btn:not(.de-kaynakca-btn) {
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: var(--notr2);
}

.de-header .de-header-btn:not(.de-kaynakca-btn):hover {
    background: rgba(255, 255, 255, 0.07);
    border-color: rgba(255, 255, 255, 0.16);
    color: var(--notr1);
}

/* Alanları Bul — açık sarı vurgu (Kaynakça ile aynı aile) */
.de-toolbar .de-highlight-fields-btn,
#dilekce-editor-panel .de-highlight-fields-btn {
    background: rgba(253, 224, 71, 0.1);
    border: 1px solid rgba(253, 224, 71, 0.28);
    color: #fde047;
}

.de-toolbar .de-highlight-fields-btn:hover,
#dilekce-editor-panel .de-highlight-fields-btn:hover {
    background: rgba(253, 224, 71, 0.18) !important;
    border-color: rgba(253, 224, 71, 0.42) !important;
    color: #fef08a !important;
}

/* Kaynakça - sarı vurgu (eski Alanları Bul rengi) */
.de-header .de-kaynakca-btn {
    background: rgba(253, 224, 71, 0.08);
    border: 1px solid rgba(253, 224, 71, 0.2);
    color: #fde047;
}

.de-header .de-kaynakca-btn:hover {
    background: rgba(253, 224, 71, 0.15) !important;
    border-color: rgba(253, 224, 71, 0.4) !important;
    color: #fde047 !important;
}

/* Kaynakça butonu görünür olduğunda animasyon */
.de-kaynakca-btn-hidden {
    display: none !important;
    opacity: 0;
    transform: scale(0.9);
    transition: opacity 0.25s ease, transform 0.25s ease;
}

.de-kaynakca-btn-visible {
    animation: de-kaynakca-btn-in 0.35s ease forwards;
}

@keyframes de-kaynakca-btn-in {
    from {
        opacity: 0;
        transform: scale(0.85);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

.de-header .de-header-btn.de-close-btn {
    width: 30px;
    height: 30px;
    min-height: 30px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--notr3);
    border-color: rgba(255, 255, 255, 0.1);
}

.de-header .de-header-btn.de-close-btn:hover {
    background: rgba(239, 68, 68, 0.18);
    border-color: rgba(239, 68, 68, 0.35);
    color: #f87171;
}

/* Tam sayfa / Küçült */
.de-header .de-fullscreen-btn,
.de-header .de-minimize-btn {
    color: var(--notr3);
}

.de-header .de-fullscreen-btn:hover,
.de-header .de-minimize-btn:hover {
    background: rgba(91, 95, 122, 0.25);
    border-color: rgba(132, 161, 181, 0.35);
    color: var(--accent-2);
}

/* Çok dar panel: yalnızca o zaman ikon modu (satır kırılması yok) */
@container de-panel (max-width: 340px) {
    .de-header .de-header-btn span {
        display: none;
    }

    .de-header .de-header-btn {
        padding: 4px 6px;
    }
}

/* Sürüm düğmesi — toolbar satırının en sağı */
.de-versions-wrap {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    margin-left: auto;
    margin-right: 4px;
}

.de-versions-trigger {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 30px;
    padding: 0 12px 0 5px;
    margin: 0;
    border-radius: 999px;
    border: 1px solid var(--de-versions-btn-border, rgba(132, 161, 181, 0.28));
    background: var(--de-versions-btn-bg, #07080b);
    color: var(--de-versions-btn-fg, #e4e7ec);
    cursor: pointer;
    font-family: var(--chat-font);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.01em;
    line-height: 1;
    white-space: nowrap;
    flex-shrink: 0;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);
    /* background/border tema rengi anında değişmeli; transition ara tonlarda beyaz flaş üretir */
    transition: box-shadow 0.15s ease;
}

.de-versions-trigger:hover {
    border-color: var(--de-versions-btn-border-hover, rgba(132, 161, 181, 0.45));
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.14);
}

.de-versions-trigger[aria-expanded="true"] {
    border-color: rgba(132, 161, 181, 0.5);
    box-shadow: 0 0 0 1px rgba(132, 161, 181, 0.22);
}

html:not([data-chat-theme="light"]) .de-versions-trigger {
    --de-versions-btn-bg: #07080b;
    --de-versions-btn-fg: #e4e7ec;
    --de-versions-btn-border: rgba(132, 161, 181, 0.32);
    --de-versions-btn-border-hover: rgba(132, 161, 181, 0.48);
    --de-versions-icon-bg: rgba(132, 161, 181, 0.12);
    --de-versions-icon-border: rgba(132, 161, 181, 0.26);
    --de-versions-badge-bg: rgba(132, 161, 181, 0.38);
    --de-versions-badge-border: #07080b;
}

html[data-chat-theme="light"] .de-versions-trigger {
    --de-versions-btn-bg: #ffffff;
    --de-versions-btn-fg: #1f2937;
    --de-versions-btn-border: rgba(91, 95, 122, 0.22);
    --de-versions-btn-border-hover: rgba(91, 95, 122, 0.38);
    --de-versions-icon-bg: rgba(91, 95, 122, 0.08);
    --de-versions-icon-border: rgba(91, 95, 122, 0.18);
    --de-versions-badge-bg: rgba(91, 95, 122, 0.14);
    --de-versions-badge-border: #ffffff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

html[data-chat-theme="light"] .de-versions-trigger:hover {
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

.de-versions-icon {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    position: relative;
    background: var(--de-versions-icon-bg, rgba(132, 161, 181, 0.12));
    border: 1px solid var(--de-versions-icon-border, rgba(132, 161, 181, 0.26));
    color: inherit;
}

.de-versions-icon svg {
    display: block;
    opacity: 0.92;
}

.de-versions-label {
    padding-right: 1px;
    color: inherit;
}

.de-version-trigger-badge {
    position: absolute;
    top: -4px;
    right: -5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 14px;
    height: 14px;
    padding: 0 3px;
    border-radius: 999px;
    font-size: 9px;
    font-weight: 700;
    line-height: 1;
    color: var(--de-versions-btn-fg, #e4e7ec);
    background: var(--de-versions-badge-bg, rgba(132, 161, 181, 0.38));
    border: 1.5px solid var(--de-versions-badge-border, #07080b);
    pointer-events: none;
}

.de-version-trigger-badge:empty {
    display: none;
}

@container de-panel (max-width: 400px) {
    .de-versions-label {
        display: none;
    }

    .de-versions-trigger {
        padding: 0 7px 0 5px;
        height: 28px;
    }
}

@container de-panel (max-width: 340px) {
    .de-versions-trigger {
        padding: 0 6px 0 4px;
        height: 26px;
    }

    .de-versions-icon {
        width: 20px;
        height: 20px;
    }

    .de-versions-icon svg {
        width: 12px;
        height: 12px;
    }
}

/* Sürüm geçmişi — editör gövdesinde sağdan tam yükseklik dock */
.de-version-dock {
    flex: 0 0 0;
    width: 0;
    min-width: 0;
    max-width: 0;
    align-self: stretch;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-left: none;
    background: var(--chat-panel-surface, rgba(0, 0, 0, 0.12));
    z-index: 3;
    transition:
        width 0.34s cubic-bezier(0.33, 0, 0.2, 1),
        min-width 0.34s cubic-bezier(0.33, 0, 0.2, 1),
        max-width 0.34s cubic-bezier(0.33, 0, 0.2, 1),
        border-color 0.34s cubic-bezier(0.33, 0, 0.2, 1);
}

.de-main-row--versions-open .de-version-dock:not(.closed) {
    flex: 0 0 168px;
    width: 168px;
    min-width: 168px;
    max-width: 168px;
    border-left: 1px solid var(--chat-border, rgba(132, 161, 181, 0.22));
}

.de-version-dock.closed {
    pointer-events: none;
}

.de-version-dock:not(.closed) {
    pointer-events: auto;
}

.de-version-dock .de-version-panel-inner {
    width: 168px;
    min-width: 168px;
    height: 100%;
    flex: 1 1 auto;
    min-height: 0;
    opacity: 0;
    transform: translateX(-100%);
    transition:
        transform 0.34s cubic-bezier(0.33, 0, 0.2, 1),
        opacity 0.28s cubic-bezier(0.33, 0, 0.2, 1);
}

.de-version-dock.de-version-dock--visible .de-version-panel-inner {
    opacity: 1;
    transform: translateX(0);
}

html[data-chat-theme="light"] .de-version-dock {
    background: var(--chat-panel-surface, #fff);
}

html[data-chat-theme="light"] .de-main-row--versions-open .de-version-dock:not(.closed) {
    border-left-color: var(--chat-border, #d1d5db);
}

html:not([data-chat-theme="light"]) .de-version-dock {
    background: var(--chat-right-panel-bg, rgba(22, 24, 32, 0.98));
}

html:not([data-chat-theme="light"]) .de-main-row--versions-open .de-version-dock:not(.closed) {
    border-left-color: rgba(132, 161, 181, 0.22);
}


@media (prefers-reduced-motion: reduce) {
    .de-version-dock,
    .de-version-dock .de-version-panel-inner {
        transition: none !important;
        transform: none !important;
    }
    .de-version-dock.de-version-dock--visible .de-version-panel-inner {
        opacity: 1;
    }
}

.de-version-dock .de-version-panel-inner {
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.de-version-history-title-row {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 4px;
    padding: 8px 6px;
    border-bottom: 1px solid var(--chat-wa-600);
    flex-shrink: 0;
    flex-wrap: wrap;
}

.de-version-history-title {
    font-size: 11px;
    font-weight: 700;
    color: var(--chat-wa-7000);
    letter-spacing: 0.02em;
    flex: 1 1 100%;
    min-width: 0;
}

.de-version-panel-nav {
    display: flex;
    align-items: center;
    gap: 2px;
    flex: 1 1 auto;
}

.de-version-panel-arrow {
    width: 26px;
    height: 26px;
    padding: 0;
    border: none;
    border-radius: 4px;
    background: transparent;
    color: var(--chat-text);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: background 0.12s, color 0.12s;
}

.de-version-panel-arrow:hover:not(:disabled) {
    background: var(--chat-wa-600);
    color: var(--chat-text-emphasis);
}

.de-version-panel-arrow:disabled {
    opacity: 0.35;
    cursor: default;
}

.de-version-panel-counter {
    font-size: 11px;
    font-weight: 600;
    color: var(--chat-text-muted);
    min-width: 52px;
    text-align: center;
    flex-shrink: 0;
    outline: none;
}

.de-version-panel-counter:focus-visible {
    color: var(--chat-text-emphasis);
}

.de-version-history-close {
    width: 22px;
    height: 22px;
    padding: 0;
    border: none;
    border-radius: 4px;
    background: transparent;
    color: var(--chat-wa-5000);
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: background 0.15s, color 0.15s;
}

.de-version-history-close:hover {
    background: var(--chat-wa-1000);
    color: var(--chat-wa-9000);
}

.de-version-history-list {
    flex: 1;
    overflow-y: auto;
    padding: 6px 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}
.de-version-history-item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
    padding: 6px 10px;
    margin: 0 6px;
    border: none;
    border-radius: 4px;
    background: transparent;
    color: var(--chat-text);
    font-size: 11px;
    cursor: pointer;
    transition: background 0.12s, color 0.12s;
}
.de-version-history-item:hover {
    background: var(--chat-wa-600);
    color: var(--chat-text-emphasis);
}
.de-version-history-item.active {
    background: rgba(74, 134, 232, 0.18);
    color: var(--chat-accent-light);
}
.de-version-history-item.viewing {
    background: rgba(168, 139, 250, 0.15);
    color: #a78bfa;
}
.de-version-num {
    font-weight: 600;
}
.de-version-date {
    font-size: 10px;
    color: var(--chat-text-muted);
    margin-top: 1px;
}
.de-version-history-empty {
    padding: 10px 8px;
    font-size: 11px;
    color: var(--chat-text-muted);
    text-align: center;
}

/* Arama paneli (büyüteç altında) */
#de-search-dropdown {
    position: relative;
}

.de-search-panel {
    display: none;
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    min-width: 260px;
    padding: 10px 12px;
    padding-top: 28px;
    background: var(--dark-accent-3);
    border: 1px solid var(--chat-wa-1000);
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
    z-index: 1000;
    flex-direction: column;
    gap: 8px;
}

.de-search-close-btn {
    position: absolute;
    top: 6px;
    right: 8px;
    width: 20px;
    height: 20px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    border-radius: 4px;
    color: var(--chat-wa-5000);
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    transition: all 0.12s ease;
}

.de-search-close-btn:hover {
    background: var(--chat-wa-1000);
    color: var(--chat-wa-9000);
}

.de-search-panel.show {
    display: flex;
}

.de-search-input {
    width: 100%;
    padding: 8px 12px;
    font-family: var(--chat-font);
    font-size: 13px;
    color: var(--chat-wa-9500);
    background: rgba(0, 0, 0, 0.25);
    border: 1px solid var(--chat-wa-1200);
    border-radius: 6px;
    outline: none;
    transition: border-color 0.15s ease;
}

.de-search-input::placeholder {
    color: var(--chat-wa-4000);
}

.de-search-input:focus {
    border-color: rgba(74, 134, 232, 0.5);
}

.de-search-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

.de-search-prev,
.de-search-next {
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 500;
    background: var(--chat-wa-800);
    border: 1px solid var(--chat-wa-1200);
    border-radius: 5px;
    color: var(--chat-wa-8000);
    cursor: pointer;
    transition: all 0.12s ease;
}

.de-search-prev:hover,
.de-search-next:hover {
    background: rgba(74, 134, 232, 0.2);
    border-color: rgba(74, 134, 232, 0.35);
    color: #6d9eeb;
}

.de-search-count {
    font-size: 11px;
    color: var(--notr3);
    margin-left: auto;
}

/* Tam sayfa modu - sol bar dışında tüm ekran */
.chat-main-wrap.has-editor-fullscreen .chat-main {
    display: none !important;
}

.chat-main-wrap.has-editor-fullscreen {
    position: relative;
}

.chat-main-wrap.has-editor-fullscreen #dilekce-editor-panel {
    position: absolute !important;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100% !important;
    min-width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    border-radius: 0;
    border: none;
    box-shadow: none;
}

#dilekce-editor-panel.de-fullscreen .de-resize-handle {
    display: none;
}

#dilekce-editor-panel.de-fullscreen .de-content-area {
    margin-left: 0;
}

/* Dropdown */
.de-dropdown {
    position: relative;
}

.de-dropdown-menu {
    display: none;
    position: absolute;
    top: calc(100% + 4px);
    right: 0;
    min-width: 220px;
    background: var(--dark-accent-3);
    border: 1px solid var(--chat-wa-1000);
    border-radius: 8px;
    padding: 4px;
    z-index: 1000;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
    max-height: 400px;
    overflow-y: auto;
}

.de-dropdown-menu.show {
    display: block;
}

.de-dropdown-item {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 8px 10px;
    background: transparent;
    border: none;
    border-radius: 5px;
    color: var(--chat-wa-8500);
    cursor: pointer;
    font-family: var(--chat-font);
    font-size: 12px;
    font-weight: 400;
    text-align: left;
    transition: all 0.12s ease;
}

.de-dropdown-item:hover {
    background: var(--chat-wa-800);
    color: var(--chat-text-emphasis);
}

.de-snippet-category {
    font-size: 10px;
    font-weight: 600;
    color: var(--notr3);
    text-transform: uppercase;
    letter-spacing: 0.6px;
    padding: 8px 10px 4px;
    margin-top: 4px;
}

.de-snippet-category:first-child {
    margin-top: 0;
}

.de-snippet-menu,
.de-reference-menu {
    min-width: 280px;
    left: 0;
    right: auto;
}

/* Toolbar */
.de-toolbar {
    display: flex;
    align-items: center;
    gap: 2px;
    padding: 6px 12px;
    border-bottom: 1px solid var(--chat-wa-600);
    flex-shrink: 0;
    background: var(--dark-accent-3);
    flex-wrap: wrap;
    position: relative;
    z-index: 9;
    overflow: visible;
}

/* Salt görüntüleme modu (paylaşılan sohbet): dilekçe editörü düzenlenemez.
   Toolbar'daki içerik değiştiren kontroller görsel olarak ve etkileşimsel olarak devre dışı kalır;
   görüntüleme amaçlı butonlar (arama, tam sayfa, dışa aktar dropdown'u, başlık aksiyonları) açık kalır. */
#dilekce-editor-panel.de-readonly .de-toolbar .de-tool-btn:not(.de-search-btn),
#dilekce-editor-panel.de-readonly .de-toolbar .de-tool-btn-text:not(.de-fullscreen-inline-btn),
#dilekce-editor-panel.de-readonly .de-toolbar .de-tool-select,
#dilekce-editor-panel.de-readonly .de-toolbar .de-color-picker-wrap {
    opacity: 0.4;
    pointer-events: none;
    cursor: not-allowed;
}

#dilekce-editor-panel.de-readonly #de-lavren-editor .de-native-surface {
    cursor: default;
}

/* toolbar wraps on small panels */

.de-toolbar-group {
    display: flex;
    align-items: center;
    gap: 1px;
}

.de-toolbar-divider {
    width: 1px;
    height: 20px;
    background: var(--chat-wa-800);
    margin: 0 4px;
    flex-shrink: 0;
}

.de-tool-btn {
    width: 30px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    border-radius: 4px;
    color: var(--chat-wa-6000);
    cursor: pointer;
    transition: all 0.12s ease;
    flex-shrink: 0;
}

.de-tool-btn:hover {
    background: var(--chat-wa-800);
    color: var(--chat-wa-9500);
}

.de-tool-btn.active {
    background: rgba(91, 95, 122, 0.3);
    color: var(--chat-text-inverse);
}

.de-tool-btn-text {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 5px 10px;
    background: transparent;
    border: 1px solid var(--chat-wa-800);
    border-radius: 5px;
    color: var(--chat-wa-7000);
    cursor: pointer;
    font-family: var(--chat-font);
    font-size: 11px;
    font-weight: 500;
    transition: all 0.12s ease;
    white-space: nowrap;
}

.de-tool-btn-text:hover {
    background: var(--chat-wa-600);
    border-color: var(--chat-wa-1400);
    color: var(--chat-text-emphasis);
}

.de-tool-select {
    height: 28px;
    padding: 0 6px;
    background: var(--chat-wa-400);
    border: 1px solid var(--chat-wa-800);
    border-radius: 4px;
    color: var(--chat-wa-8000);
    font-family: var(--chat-font);
    font-size: 11px;
    cursor: pointer;
    transition: all 0.12s ease;
    outline: none;
    appearance: none;
    -webkit-appearance: none;
    padding-right: 18px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='rgba(255,255,255,0.5)' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 4px center;
}

.de-tool-select:hover {
    border-color: var(--chat-wa-1400);
    background-color: var(--chat-wa-800);
}

.de-tool-select:focus {
    border-color: var(--accent);
}

.de-tool-select option {
    background: var(--dark-accent-3);
    color: var(--chat-wa-9000);
}

.de-font-select { min-width: 120px; }
.de-size-select { min-width: 52px; }
.de-spacing-select { min-width: 52px; }

/* Color picker */
.de-color-picker-wrap {
    position: relative;
    display: flex;
}

.de-color-btn {
    position: relative;
    padding-bottom: 5px;
}

.de-color-indicator {
    position: absolute;
    bottom: 3px;
    left: 50%;
    transform: translateX(-50%);
    width: 16px;
    height: 3px;
    border-radius: 1px;
}

/* Custom color palette popup */
.de-cp-popup {
    display: none;
    position: fixed;
    z-index: 9999;
    background: var(--dark-accent-3);
    border: 1px solid var(--chat-wa-1200);
    border-radius: 8px;
    padding: 8px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
    width: 220px;
}

.de-cp-popup.show {
    display: block;
}

.de-cp-grid {
    display: grid;
    grid-template-columns: repeat(10, 1fr);
    gap: 2px;
    margin-bottom: 8px;
}

.de-cp-swatch {
    width: 18px;
    height: 18px;
    border: 1px solid var(--chat-wa-800);
    border-radius: 2px;
    cursor: pointer;
    padding: 0;
    transition: transform 0.1s ease, border-color 0.1s ease;
}

.de-cp-swatch:hover {
    transform: scale(1.25);
    border-color: var(--chat-wa-5000);
    z-index: 2;
    position: relative;
}

.de-cp-swatch.selected {
    border: 2px solid var(--chat-text-emphasis);
    transform: scale(1.2);
    box-shadow: 0 0 4px var(--chat-wa-4000);
}

.de-cp-footer {
    display: flex;
    align-items: center;
    gap: 6px;
    padding-top: 6px;
    border-top: 1px solid var(--chat-wa-800);
}

.de-cp-custom {
    width: 28px;
    height: 24px;
    border: 1px solid var(--chat-wa-1500);
    border-radius: 4px;
    cursor: pointer;
    padding: 0;
    background: transparent;
}

.de-cp-select-btn {
    flex: 1;
    padding: 5px 0;
    background: var(--accent);
    color: var(--chat-on-accent);
    border: none;
    border-radius: 4px;
    font-family: var(--chat-font);
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s ease;
}

.de-cp-select-btn:hover {
    background: var(--accent-main-dark);
}

/* Editor wrapper - siyah arka plan; scroll sadece burada; header/toolbar üstte kalır */
.de-editor-wrapper {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
    min-height: 0;
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 24px 16px;
    background: var(--dark-accent-3);
}

/* scrollbar: :root --chat-panel-scrollbar-* + ortak blok (.chat-ref-panel-scroll, .de-editor-wrapper, .mevzuat-sidebar-body, kaynak panelleri) */

/* Page simulation - gri kart: en az wrapper yüksekliği kadar, yarıda kesilmez */
.de-page {
    position: relative;
    width: 100%;
    max-width: 720px;
    min-height: 900px;
    flex: 1 0 auto;
    background: var(--chat-de-page-bg);
    border: 1px solid var(--chat-wa-600);
    border-radius: 4px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
    display: flex;
    flex-direction: column;
}

/* Lavren belge yüzü — tek scroll: sadece .de-editor-wrapper kayar */
#de-lavren-editor {
    min-height: 800px;
    padding: 40px 48px;
    font-family: 'Times New Roman', serif;
    font-size: 12pt;
    line-height: 1.5;
    color: var(--chat-wa-9000);
    flex-shrink: 0;
}

#de-lavren-editor .de-native-surface {
    padding: 0;
    font-family: 'Times New Roman', serif;
    font-size: 12pt;
    line-height: 1.5;
    color: var(--chat-wa-9000);
    min-height: 800px;
}

#de-lavren-editor .de-native-surface p {
    margin: 0 0 0.75em 0;
    line-height: inherit;
}

#de-lavren-editor .de-native-surface p:last-child {
    margin-bottom: 0;
}

/* Dilekçe editörü panelinde Word'deki "paragraf arası boşluk" görünümünü yakala:
   - Boş satır eklemeden de paragraflar arasında yumuşak bir boşluk olsun. */
#dilekce-editor-panel #de-lavren-editor .de-native-surface p {
    margin-top: 0;
    margin-bottom: 0.6em; /* Word'ün varsayılan 6–8pt "space after"ine yakın */
}

#dilekce-editor-panel #de-lavren-editor .de-native-surface h2.de-heading-uc {
    margin-top: 0.8em;
    margin-bottom: 0.4em;
}

#de-lavren-editor .de-native-surface h1,
#de-lavren-editor .de-native-surface h2,
#de-lavren-editor .de-native-surface h3 {
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

#de-lavren-editor .de-native-surface h1 {
    font-size: 20pt;
    font-weight: 700;
    color: var(--chat-text-emphasis);
    margin: 20px 0 10px;
}

#de-lavren-editor .de-native-surface h2,
#de-lavren-editor .de-native-surface .de-heading-uc {
    font-size: 16pt;
    font-weight: 600;
    color: var(--chat-text-emphasis);
    margin: 18px 0 8px;
}

#de-lavren-editor .de-native-surface h3 {
    font-size: 14pt;
    font-weight: 600;
    color: var(--chat-wa-9500);
    margin: 14px 0 6px;
}

#de-lavren-editor .de-native-surface strong {
    color: var(--chat-text-emphasis);
    font-weight: 700;
}

#de-lavren-editor .de-native-surface u,
#de-lavren-editor .de-native-surface .ql-underline {
    text-decoration: underline;
    text-underline-offset: 2px;
}

#de-lavren-editor .de-native-surface em {
    color: var(--chat-wa-8500);
}

#de-lavren-editor .de-native-surface ul,
#de-lavren-editor .de-native-surface ol {
    padding-left: 24px;
    margin: 0.5em 0 1em 0;
}

#de-lavren-editor .de-native-surface li {
    margin-bottom: 0.5em;
}

/* Dilekçe editöründe içe gömülen tablo (lavren-table embed): kenarsız, Word uyumlu görünüm.
   Editörde de export'ta da kenarsız kalır; sadece düzenlerken hücreleri görmek için
   çok soluk bir hücre çizgisi gösterilir, Word çıktısında görünmez. */
#de-lavren-editor .de-native-surface .lavren-doc-table-wrap {
    margin: 8px 0;
    width: 100%;
    overflow-x: auto;
    user-select: text;
}

#de-lavren-editor .de-native-surface .lavren-doc-table-wrap table.lavren-doc-table,
#de-lavren-editor .de-native-surface .lavren-doc-table-wrap table {
    border-collapse: collapse;
    width: 100%;
    table-layout: fixed;
    font-family: inherit;
    font-size: inherit;
    border: none;
    background: transparent;
}

#de-lavren-editor .de-native-surface .lavren-doc-table-wrap table th,
#de-lavren-editor .de-native-surface .lavren-doc-table-wrap table td {
    border: 1px dashed rgba(120, 128, 145, 0.35);
    padding: 6px 10px;
    text-align: left;
    vertical-align: top;
    background: transparent;
    overflow-wrap: break-word;
    word-wrap: break-word;
}

#de-lavren-editor .de-native-surface .lavren-doc-table-wrap table th {
    font-weight: bold;
    border-bottom: 1px solid rgba(120, 128, 145, 0.55);
}

/* AI düzenleme önerileri (lavren-change-track embed) — Önce/Sonra + Kabul/Red */
#de-lavren-editor .de-native-surface .lavren-change-track-wrap {
    margin: 6px 0 8px;
    padding: 6px 10px 7px 11px;
    border: 1px solid rgba(91, 95, 122, 0.22);
    border-left: 2px solid rgba(91, 95, 122, 0.42);
    border-radius: 4px;
    background: rgba(91, 95, 122, 0.035);
    box-sizing: border-box;
    box-shadow: none;
}
html:not([data-chat-theme="light"]) #de-lavren-editor .de-native-surface .lavren-change-track-wrap {
    background: rgba(91, 95, 122, 0.07);
    border-color: rgba(91, 95, 122, 0.2);
    border-left-color: rgba(91, 95, 122, 0.48);
}
#de-lavren-editor .de-native-surface .lavren-change-track-inner {
    font-family: inherit;
    font-size: 11pt;
    line-height: 1.45;
}
#de-lavren-editor .de-native-surface .lavren-change-track-actions {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    margin-bottom: 8px;
}
#de-lavren-editor .de-native-surface .lavren-track-btn {
    font-size: 11px;
    font-weight: 600;
    padding: 5px 12px;
    border-radius: 4px;
    border: 1px solid transparent;
    cursor: pointer;
}
#de-lavren-editor .de-native-surface .lavren-track-btn-accept {
    background: #047857;
    color: #fff;
    border-color: #065f46;
}
#de-lavren-editor .de-native-surface .lavren-track-btn-reject {
    background: rgba(185, 28, 28, 0.14);
    color: #fecaca;
    border-color: rgba(239, 68, 68, 0.42);
}
#de-lavren-editor .de-native-surface .lavren-track-btn-reject:hover {
    background: rgba(185, 28, 28, 0.26);
    border-color: rgba(248, 113, 113, 0.55);
    color: #fff;
}
html[data-chat-theme="light"] #de-lavren-editor .de-native-surface .lavren-track-btn-reject {
    background: #fef2f2;
    color: #b91c1c;
    border-color: rgba(220, 38, 38, 0.32);
}
html[data-chat-theme="light"] #de-lavren-editor .de-native-surface .lavren-track-btn-reject:hover {
    background: #fee2e2;
    border-color: rgba(220, 38, 38, 0.45);
    color: #991b1b;
}
/* Satır içi diff: kırmızı silinen / yeşil eklenen (JS: _lavrenBuildSuggestDiffInnerHtml) */
#de-lavren-editor .de-native-surface .lavren-change-diff {
    font-family: inherit;
    font-size: 11pt;
    line-height: 1.5;
    padding: 4px 2px 4px 0;
    border-radius: 0;
    background: transparent;
    border: none;
    margin-bottom: 6px;
    white-space: pre-wrap;
    overflow-wrap: break-word;
    word-break: break-word;
    color: inherit;
}
#de-lavren-editor .de-native-surface .lavren-change-diff.lavren-change-formatted {
    white-space: normal;
    font-family: "Times New Roman", Times, serif;
}
#de-lavren-editor .de-native-surface .lavren-change-diff.lavren-change-formatted strong {
    font-weight: bold;
}
#de-lavren-editor .de-native-surface .lavren-change-diff.lavren-change-formatted u {
    text-decoration: underline;
}
#de-lavren-editor .de-native-surface .lavren-change-diff .lavren-diff-block {
    display: block;
    margin: 6px 0;
    padding: 4px 6px;
    border-radius: 4px;
    text-decoration: none;
}
#de-lavren-editor .de-native-surface .lavren-change-diff .lavren-diff-block.lavren-diff-rem {
    background: rgba(254, 226, 226, 0.55);
}
#de-lavren-editor .de-native-surface .lavren-change-diff .lavren-diff-block.lavren-diff-add {
    background: rgba(209, 250, 229, 0.55);
}
#de-lavren-editor .de-native-surface .lavren-change-diff .lavren-change-track-table {
    display: block;
    overflow-x: auto;
    max-width: 100%;
}
#de-lavren-editor .de-native-surface .lavren-change-diff .lavren-change-track-table .lavren-doc-table {
    font-size: 10pt;
    margin: 2px 0;
}
#de-lavren-editor .de-native-surface .lavren-change-diff .lavren-diff-rem {
    padding: 0 2px;
    border-radius: 2px;
    background: rgba(239, 68, 68, 0.22);
    color: #b91c1c;
    text-decoration: line-through;
    text-decoration-color: rgba(185, 28, 28, 0.55);
}
#de-lavren-editor .de-native-surface .lavren-change-diff .lavren-diff-add {
    padding: 0 2px;
    border-radius: 2px;
    background: rgba(16, 185, 129, 0.22);
    color: #047857;
    font-weight: 500;
}
html:not([data-chat-theme="light"]) #de-lavren-editor .de-native-surface .lavren-change-diff {
    background: transparent;
    border: none;
    color: #e2e8f0;
}
html:not([data-chat-theme="light"]) #de-lavren-editor .de-native-surface .lavren-change-diff .lavren-diff-rem {
    background: rgba(248, 113, 113, 0.18);
    color: #fecaca;
    text-decoration-color: rgba(254, 202, 202, 0.5);
}
html:not([data-chat-theme="light"]) #de-lavren-editor .de-native-surface .lavren-change-diff .lavren-diff-add {
    background: rgba(52, 211, 153, 0.2);
    color: #a7f3d0;
}
#de-lavren-editor .de-native-surface .lavren-change-cols {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}
@media (max-width: 640px) {
    #de-lavren-editor .de-native-surface .lavren-change-cols {
        grid-template-columns: 1fr;
    }
}
#de-lavren-editor .de-native-surface .lavren-change-tag {
    display: inline-block;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #64748b;
    margin-bottom: 4px;
}
#de-lavren-editor .de-native-surface .lavren-change-pre {
    white-space: pre-wrap;
    overflow-wrap: break-word;
    word-break: break-word;
    padding: 6px;
    border-radius: 4px;
    border: 1px solid rgba(120, 128, 145, 0.2);
    font-family: ui-monospace, monospace;
    font-size: 10pt;
}
#de-lavren-editor .de-native-surface .lavren-change-old .lavren-change-pre {
    background: rgba(254, 226, 226, 0.45);
}
#de-lavren-editor .de-native-surface .lavren-change-new .lavren-change-pre {
    background: rgba(209, 250, 229, 0.45);
}
#de-lavren-editor .de-native-surface .lavren-change-old .lavren-change-tag { color: #b91c1c; }
#de-lavren-editor .de-native-surface .lavren-change-new .lavren-change-tag { color: #047857; }
#de-lavren-editor .de-native-surface .lavren-change-pre.lavren-change-formatted {
    font-family: "Times New Roman", Times, serif;
    font-size: 11pt;
    line-height: 1.45;
    white-space: normal;
}
#de-lavren-editor .de-native-surface .lavren-change-formatted strong {
    font-weight: bold;
}
#de-lavren-editor .de-native-surface .lavren-change-formatted u {
    text-decoration: underline;
}
#de-lavren-editor .de-native-surface .lavren-change-track-table {
    overflow-x: auto;
    max-width: 100%;
    margin: 4px 0;
}
#de-lavren-editor .de-native-surface .lavren-change-track-table .lavren-doc-table {
    font-size: 10pt;
    margin: 2px 0;
}
#de-lavren-editor .de-native-surface .lavren-change-track-preview {
    padding: 6px;
    border-radius: 4px;
    border: 1px solid rgba(120, 128, 145, 0.2);
    background: rgba(249, 250, 251, 0.6);
}

#dilekce-editor-panel #de-lavren-editor.de-native-surface-root {
    position: relative;
}

#de-lavren-editor .de-native-surface ::selection {
    background: rgba(91, 95, 122, 0.4);
}

/* Tek kaydırma sütunu (.de-editor-wrapper); yüzey genişliyor taşmadan */
#dilekce-editor-panel #de-lavren-editor.de-native-surface-root {
    border: none !important;
    font-family: 'Times New Roman', serif;
    overflow: visible !important;
}

#de-lavren-editor .de-native-surface {
    border: none;
    caret-color: var(--chat-text-emphasis);
    overflow: visible !important;
    height: auto !important;
    min-height: inherit;
}

#dilekce-editor-panel #de-lavren-editor .de-native-surface a {
    color: var(--chat-text);
}

/* İçtihat referansı: tıklanınca ilgili karar kaynağına gider */
#dilekce-editor-panel #de-lavren-editor .de-native-surface a[href^="#ictihat-"],
#dilekce-editor-panel #de-lavren-editor .de-native-surface a.de-ictihat-ref {
    cursor: pointer;
    text-decoration: underline;
    text-decoration-style: dotted;
}
#dilekce-editor-panel #de-lavren-editor .de-native-surface a[href^="#ictihat-"]:hover,
#dilekce-editor-panel #de-lavren-editor .de-native-surface a.de-ictihat-ref:hover {
    text-decoration-style: solid;
}

/* Status bar */
.de-statusbar {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 6px 16px;
    border-top: 1px solid var(--chat-wa-600);
    background: rgba(0, 0, 0, 0.12);
    flex-shrink: 0;
}

.de-status-item {
    font-size: 11px;
    color: var(--notr3);
    font-weight: 400;
}

.de-status-saved {
    margin-left: auto;
    color: var(--accent);
    font-weight: 500;
}

/* Düzenleme önerisi gezgini (status bar) — varsayılan gizli; JS display:flex ile açar */
.de-track-nav {
    display: none;
    align-items: center;
    gap: 6px;
    margin-left: auto;
    padding: 0 4px;
}

.de-track-nav-divider {
    width: 1px;
    height: 20px;
    margin: 0 4px;
    background: rgba(120, 128, 145, 0.45);
    flex-shrink: 0;
}

.de-track-bulk-btn {
    font-size: 11px;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: 4px;
    border: 1px solid transparent;
    cursor: pointer;
    white-space: nowrap;
    line-height: 1.2;
}

.de-track-bulk-accept {
    background: #047857;
    color: #fff;
    border-color: #065f46;
}

.de-track-bulk-accept:hover:not(:disabled) {
    background: #059669;
}

.de-track-bulk-reject {
    background: rgba(185, 28, 28, 0.18);
    color: #fecaca;
    border-color: rgba(239, 68, 68, 0.45);
}

.de-track-bulk-reject:hover:not(:disabled) {
    background: rgba(185, 28, 28, 0.3);
    border-color: rgba(248, 113, 113, 0.55);
    color: #fff;
}

.de-track-bulk-btn:disabled {
    opacity: 0.35;
    cursor: not-allowed;
}

.de-track-nav-counter {
    font-size: 11px;
    font-weight: 600;
    color: var(--notr2, #cbd5e1);
    min-width: 3.2em;
    text-align: center;
    user-select: none;
}

.de-track-nav-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 26px;
    padding: 0;
    border: 1px solid rgba(120, 128, 145, 0.45);
    border-radius: 4px;
    background: rgba(255, 255, 255, 0.08);
    color: var(--notr2, #e2e8f0);
    cursor: pointer;
}

.de-track-nav-btn:hover:not(:disabled) {
    background: rgba(255, 255, 255, 0.16);
    border-color: rgba(148, 163, 184, 0.55);
}

.de-track-nav-btn:disabled {
    opacity: 0.35;
    cursor: not-allowed;
}

#de-lavren-editor .de-native-surface .lavren-change-track-wrap--active {
    outline: none;
    border-color: rgba(91, 95, 122, 0.38);
    border-left: 2px solid #5b5f7a;
    background: rgba(91, 95, 122, 0.06);
    box-shadow: 0 1px 3px rgba(91, 95, 122, 0.1);
}

/* Placeholder highlight glow animation */
.de-placeholder-glow {
    animation: dePlaceholderPulse 3.5s ease-in-out forwards !important;
    border-radius: 2px;
}

@keyframes dePlaceholderPulse {
    0% {
        background-color: rgba(253, 224, 71, 0.35) !important;
    }
    25% {
        background-color: rgba(253, 224, 71, 0.25) !important;
    }
    50% {
        background-color: rgba(253, 224, 71, 0.3) !important;
    }
    80% {
        background-color: rgba(253, 224, 71, 0.15) !important;
    }
    100% {
        background-color: transparent !important;
    }
}

/* Generating overlay */
.de-generating-overlay {
    position: absolute;
    inset: 0;
    background: rgba(7, 8, 11, 0.85);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    padding-top: clamp(120px, 28vh, 280px);
    gap: 16px;
    z-index: 10;
    border-radius: inherit;
    box-sizing: border-box;
}

.de-generating-spinner {
    width: 32px;
    height: 32px;
    border: 3px solid var(--chat-wa-1000);
    border-top-color: var(--accent);
    border-radius: 50%;
    animation: de-spin 0.8s linear infinite;
}

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

.de-generating-text {
    font-size: 13px;
    color: var(--notr2);
    font-weight: 500;
}

/* Compact dilekçe card in chat */
.de-compact-card {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: rgba(91, 95, 122, 0.08);
    border: 1px solid rgba(91, 95, 122, 0.2);
    border-radius: 10px;
    margin-top: 8px;
    transition: all 0.2s ease;
}

.de-compact-card:hover {
    border-color: rgba(91, 95, 122, 0.35);
    background: rgba(91, 95, 122, 0.12);
}

.de-compact-icon {
    width: 38px;
    height: 38px;
    background: var(--accent);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    flex-shrink: 0;
}

.de-compact-info {
    flex: 1;
    min-width: 0;
    overflow: hidden;
}

.de-compact-title {
    font-size: 13px;
    font-weight: 600;
    color: var(--chat-wa-9500);
    margin-bottom: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.de-compact-meta {
    font-size: 11px;
    color: var(--notr3);
}

/* Editörü Aç butonu - pill style (same as search toggles) */
.de-open-editor-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background: transparent;
    color: var(--notr1);
    border: 1px solid transparent;
    border-radius: 999px;
    cursor: pointer;
    font-family: var(--chat-font);
    font-size: 11px;
    font-weight: 500;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
    white-space: nowrap;
    flex-shrink: 0;
    line-height: 1;
    min-height: 26px;
}

.de-open-editor-btn:hover:not(.open) {
    background: rgba(91, 95, 122, 0.07);
    border-color: rgba(91, 95, 122, 0.12);
}

html:not([data-chat-theme="light"]) .de-open-editor-btn:hover:not(.open) {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.1);
}

.de-open-editor-btn.open {
    background: var(--notr2);
    border-color: var(--notr2);
    color: var(--chat-bg);
}

.de-open-editor-btn.open:hover {
    background: var(--notr2);
    border-color: var(--notr2);
    color: var(--chat-bg);
}

.de-open-editor-btn svg {
    width: 12px;
    height: 12px;
    flex-shrink: 0;
}

.de-open-editor-btn.open svg {
    stroke: var(--chat-bg);
}

/* Editör açıkken sağdaki çarpı - sadece .open iken görünür */
.de-open-editor-btn .chat-pill-close {
    display: none;
    margin-left: 2px;
}

.de-open-editor-btn.open .chat-pill-close {
    display: inline-flex;
}

/* Responsive */
@media (max-width: 1200px) {
    #dilekce-editor-panel.open {
        width: 46vw;
        min-width: 380px;
    }
}

@media (max-width: 900px) {
    #dilekce-editor-panel.open {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        width: 92vw;
        max-width: none;
        min-width: 0;
        z-index: 200;
        border: none;
        box-shadow: none;
        margin-left: 0 !important;
    }

    .de-toolbar {
        padding: 4px 8px;
    }

    .de-tool-select {
        font-size: 10px;
    }

    .de-font-select { min-width: 90px; }

    #de-lavren-editor {
        padding: 24px 20px;
    }

    .de-editor-wrapper {
        padding: 12px 8px;
    }
}

@media (max-width: 600px) {

    .de-toolbar-divider:nth-child(n+8) {
        display: none;
    }
}

/* Mobil: editör açılınca direkt tam ekran, çarpı ve bar düzenli */
@media (max-width: 768px) {
    #dilekce-editor-panel.open {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        width: 100vw !important;
        min-width: 0 !important;
        max-width: none !important;
        height: 100vh !important;
        height: 100dvh !important;
        z-index: 300;
        box-shadow: none;
        border-radius: 0;
        border: none;
        margin-left: 0 !important;
    }

    #dilekce-editor-panel.open .de-resize-handle {
        display: none;
    }

    #dilekce-editor-panel.open .de-content-area {
        margin-left: 0;
    }

    #dilekce-editor-panel.open .de-header {
        padding: 6px 8px;
        min-height: 0;
        flex-wrap: nowrap;
        gap: 6px;
    }

    #dilekce-editor-panel.open .de-header-info {
        flex-direction: row;
        align-items: center;
        gap: 6px;
    }

    #dilekce-editor-panel.open .de-subtitle {
        border-left: 1px solid var(--chat-border);
        padding-left: 8px;
    }

    #dilekce-editor-panel.open .de-header-actions {
        flex-wrap: nowrap;
        gap: 3px;
    }

    #dilekce-editor-panel.open .de-header-btn {
        padding: 4px 6px;
        min-height: 28px;
        font-size: 10px;
        gap: 3px;
    }

    #dilekce-editor-panel.open .de-close-btn {
        width: 28px;
        height: 28px;
        min-height: 28px;
        flex-shrink: 0;
        order: 10;
        margin-left: auto;
    }

    #dilekce-editor-panel.open .de-close-btn svg {
        width: 15px;
        height: 15px;
    }

    #dilekce-editor-panel.open .de-title {
        font-size: 12px;
    }

    #dilekce-editor-panel.open .de-subtitle {
        font-size: 10px;
    }
}

/* Web arama modu toggle */
.chat-search-toggle {
    display: inline-flex;
    align-items: center;
    margin: 0 4px;
    flex-shrink: 0;
}

.chat-search-toggle-label {
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    font-size: 11px;
    color: var(--chat-text-muted);
}

.chat-search-toggle-label input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.chat-search-toggle-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 999px;
    border: 1px solid transparent;
    background: transparent;
    color: var(--notr1);
    font-family: var(--chat-font);
    font-size: 11px;
    font-weight: 500;
    white-space: nowrap;
    flex-shrink: 0;
    line-height: 1;
    min-height: 26px;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.chat-search-toggle-label input[type="checkbox"]:not(:checked) + .chat-search-toggle-pill:hover {
    background: rgba(91, 95, 122, 0.07);
    border-color: rgba(91, 95, 122, 0.12);
}

html:not([data-chat-theme="light"]) .chat-search-toggle-label input[type="checkbox"]:not(:checked) + .chat-search-toggle-pill:hover {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.1);
}

.chat-search-toggle-icon {
    width: 12px;
    height: 12px;
    stroke: var(--notr1);
    fill: none;
}

.chat-search-toggle-text {
    display: inline-flex;
    flex-direction: row;
    align-items: baseline;
    gap: 0.28em;
    white-space: nowrap;
    line-height: 1.15;
}

.chat-search-toggle-head,
.chat-search-toggle-tail {
    display: inline-block;
    white-space: nowrap;
}

/* Seçili: arka plan nötr2, yazı chat arka plan rengi */
.chat-search-toggle-label input[type="checkbox"]:checked + .chat-search-toggle-pill {
    border-color: var(--notr2);
    background: var(--notr2);
    color: var(--chat-bg);
    box-shadow: none;
}

.chat-search-toggle-label input[type="checkbox"]:checked + .chat-search-toggle-pill .chat-search-toggle-icon {
    stroke: var(--chat-bg);
}

/* Pill sağında çarpı - seçiliyken görünür, nötr2 renk */
.chat-pill-close {
    display: none;
    align-items: center;
    justify-content: center;
    width: 14px;
    height: 14px;
    margin-left: 2px;
    padding: 0;
    background: none;
    border: none;
    border-radius: 50%;
    cursor: pointer;
    color: var(--chat-bg);
    font-size: 14px;
    line-height: 1;
    flex-shrink: 0;
    transition: none;
}

.chat-pill-close:hover {
    color: var(--chat-bg);
    background: none;
}

.chat-search-toggle-label input[type="checkbox"]:checked + .chat-search-toggle-pill .chat-pill-close {
    display: inline-flex;
}

/* Editör butonundaki çarpı seçiliyken nötr2 (arka plan zaten nötr2) */
.de-open-editor-btn.open .chat-pill-close {
    color: var(--chat-bg);
}

.de-open-editor-btn.open .chat-pill-close:hover {
    color: var(--chat-bg);
    background: none;
}

/* =================================================================
   FLOATING TOOLTIP — pro his (Linear/Vercel/GitHub stili)
   • Buton kompakt kalır, hover'da üstünde küçük dark pill belirir
   • Açılış: 350ms hover-intent gecikme + smooth fade/slide
   • Kapanış: anında (delay yok)
   • Touch cihazlarda devre dışı (pointer: fine)
   ================================================================= */
@media (pointer: fine) {
    [data-tooltip] {
        position: relative;
    }

    /* Input çubuğunda tam metin için #chat-input-action-tooltip (fixed); kesilen ::after kullanılmaz */
    .chat-input-bar [data-tooltip]::after {
        display: none !important;
        content: none !important;
    }

    [data-tooltip]::after {
        content: attr(data-tooltip);
        position: absolute;
        bottom: calc(100% + 8px);
        left: 50%;
        transform: translateX(-50%) translateY(4px);
        background: rgba(15, 18, 28, 0.96);
        color: #fff;
        padding: 5px 9px;
        border-radius: 6px;
        font-family: var(--chat-font);
        font-size: 11.5px;
        font-weight: 500;
        letter-spacing: -0.005em;
        line-height: 1.35;
        white-space: normal;
        text-align: left;
        max-width: min(480px, calc(100vw - 20px));
        word-break: break-word;
        overflow-wrap: anywhere;
        overflow: visible;
        pointer-events: none;
        opacity: 0;
        z-index: 10000;
        box-shadow: 0 4px 14px rgba(0, 0, 0, 0.32);
        transition:
            opacity 0.16s ease,
            transform 0.16s cubic-bezier(0.22, 1, 0.36, 1);
        transition-delay: 0s;
    }

    [data-tooltip]:hover::after,
    [data-tooltip]:focus-visible::after {
        opacity: 1;
        transform: translateX(-50%) translateY(0);
        transition-delay: 0.35s;
    }

    /* Disabled buton tooltip göstermesin */
    [data-tooltip]:disabled::after,
    [data-tooltip][aria-disabled="true"]::after { display: none; }

    /* Light tema için tooltip — yine koyu pill (kontrast doğru) */
    html[data-chat-theme="light"] [data-tooltip]::after {
        background: rgba(20, 24, 35, 0.95);
        box-shadow: 0 6px 16px rgba(15, 23, 42, 0.18);
    }

    /* Yeni sohbet ekranında (çubuk dışı) ::after üst/alt; çubuk içi yine floater */
    .chat-input-area-welcome [data-tooltip]::after {
        top: calc(100% + 8px);
        bottom: auto;
        transform: translateX(-50%) translateY(-4px);
    }

    .chat-input-area-welcome [data-tooltip]:hover::after,
    .chat-input-area-welcome [data-tooltip]:focus-visible::after {
        transform: translateX(-50%) translateY(0);
    }
}

/* =================================================================
   ICON-ONLY INPUT BAR — kompakt ikon butonları
   Yalnızca fare kullanan cihazlarda (touch etkilenmez)
   ================================================================= */
@media (pointer: fine) {

    /* =================================================================
       İkon butonları — kompakt icon-only kalır, hover'da floating tooltip
       (yukarıda [data-tooltip]) belirir. Sadece active/open state'lerde
       inline metin yazısı görünür.
       ================================================================= */

    /* Search toggle: ikon-only, gap 0; SADECE seçiliyken metin açılır */
    .chat-search-toggle-pill {
        gap: 0;
        padding: 4px 8px;
    }

    .chat-search-toggle-text {
        max-width: 0;
        opacity: 0;
        overflow: hidden;
        white-space: nowrap;
        transition:
            max-width 0.42s cubic-bezier(0.22, 1, 0.36, 1),
            opacity 0.32s ease 0.06s;
    }

    .chat-search-toggle-label input[type="checkbox"]:checked + .chat-search-toggle-pill {
        gap: 6px;
        padding: 4px 10px;
    }
    .chat-search-toggle-label input[type="checkbox"]:checked + .chat-search-toggle-pill .chat-search-toggle-text {
        max-width: 170px;
        opacity: 1;
    }

    /* Editörü Aç: ikon-only, açıkken inline label */
    .de-open-editor-btn {
        gap: 0;
        padding: 4px 8px;
        transition:
            background 0.2s ease,
            border-color 0.2s ease,
            color 0.2s ease,
            gap 0.42s cubic-bezier(0.22, 1, 0.36, 1),
            padding 0.42s cubic-bezier(0.22, 1, 0.36, 1);
    }

    .de-open-editor-btn-text {
        max-width: 0;
        opacity: 0;
        overflow: hidden;
        white-space: nowrap;
        transition:
            max-width 0.42s cubic-bezier(0.22, 1, 0.36, 1),
            opacity 0.32s ease 0.06s;
    }

    .de-open-editor-btn.open .de-open-editor-btn-text {
        max-width: 90px;
        opacity: 1;
    }
    .de-open-editor-btn.open {
        gap: 6px;
        padding: 4px 10px;
    }

    /* İyileştir: ikon-only (inline label hiç açılmaz, sadece tooltip) */
    .chat-enchant-btn {
        gap: 0;
        padding: 4px 8px;
    }
    .chat-enchant-btn .chat-enchant-label {
        max-width: 0;
        opacity: 0;
        overflow: hidden;
        white-space: nowrap;
    }

    /* Kütüphane: yazı her zaman görünür (tooltip yok) */
    .chat-library-btn {
        gap: 6px;
        padding: 4px 10px;
    }
    .chat-library-btn-text {
        max-width: none;
        opacity: 1;
        overflow: visible;
        white-space: nowrap;
    }
    /* Kütüphane butonunda floating tooltip ÇIKMASIN (label zaten görünür) */
    .chat-library-btn::after { display: none !important; }
}

/* =================================================================
   PROMT KÜTÜPHANESİ — chat input'taki Kütüphane butonu + modal
   ================================================================= */

/* --- Buton (chat-input-bar içinde, Editörü Aç pill stiliyle eş) --- */
.chat-library-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background: transparent;
    color: var(--notr1);
    border: 1px solid transparent;
    border-radius: 999px;
    cursor: pointer;
    font-family: var(--chat-font);
    font-size: 11px;
    font-weight: 500;
    line-height: 1;
    white-space: nowrap;
    flex-shrink: 0;
    min-height: 26px;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.chat-library-btn:hover {
    background: rgba(91, 95, 122, 0.07);
    border-color: rgba(91, 95, 122, 0.12);
    color: var(--notr1);
}

html:not([data-chat-theme="light"]) .chat-library-btn:hover {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.1);
}

.chat-library-btn:active {
    transform: scale(0.98);
}

.chat-library-btn svg {
    width: 13px;
    height: 13px;
    flex-shrink: 0;
}

/* Sıralama: Kütüphane > Send (gönder en sağda kalsın) */
.chat-input-bar .chat-library-btn {
    order: 49;
    /* margin-left: auto'yu library üstlensin → library + send sağa pinlenir, yan yana durur */
    margin-left: auto;
    flex-shrink: 0;
}

/* Library mevcutsa send/stop'taki auto-margin'i sıfırla → library'nin hemen yanına yapışsın */
.chat-input-bar .chat-library-btn ~ .chat-send-btn,
.chat-input-bar .chat-library-btn ~ .chat-stop-btn {
    margin-left: 0;
}

/* Mobil dar ekranlarda da "Kütüphane" yazısı görünür kalır (kullanıcı isteği) */
@media (max-width: 420px) {
    .chat-library-btn {
        padding: 4px 8px;
        gap: 5px;
    }
    .chat-library-btn-text {
        display: inline !important;
        font-size: 10px;
    }
    .chat-library-btn svg { width: 12px; height: 12px; }
}

/* =================================================================
   MODAL — minimalist pro (Linear/Vercel/Notion estetiği)
   • hairline border'lar, monochrome aktif state, lift/shadow yok
   • aksent yalnız primary CTA ve focus ring'inde minimal kullanılır
   ================================================================= */

/* --- OVERLAY --- */
.pl-modal {
    position: fixed;
    inset: 0;
    z-index: 9000;
    background: rgba(8, 10, 16, 0.5);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 32px;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.18s ease;
    font-family: var(--chat-font);
}
.pl-modal[hidden] { display: none !important; }

html[data-chat-theme="light"] .pl-modal {
    background: rgba(15, 23, 42, 0.32);
}

.pl-modal.pl-open {
    opacity: 1;
    pointer-events: auto;
}

/* --- DIALOG --- */
.pl-dialog {
    /* Tema değişkenleri — ölçülü, neutral-first palet */
    --pl-accent: var(--chat-primary, var(--accent));
    --pl-text: var(--chat-text, var(--notr1));
    --pl-text-soft: color-mix(in srgb, var(--notr1) 62%, transparent);
    --pl-text-mute: color-mix(in srgb, var(--notr1) 38%, transparent);
    --pl-border: color-mix(in srgb, var(--notr1) 11%, transparent);
    --pl-border-strong: color-mix(in srgb, var(--notr1) 18%, transparent);
    --pl-surface: var(--chat-surface);
    --pl-surface-2: color-mix(in srgb, var(--notr1) 3%, var(--chat-surface));
    --pl-surface-hover: color-mix(in srgb, var(--notr1) 5%, var(--chat-surface));

    width: min(820px, 96vw);
    max-height: min(82vh, 760px);
    display: flex;
    flex-direction: column;
    background: var(--pl-surface);
    color: var(--pl-text);
    border-radius: 12px;
    border: 1px solid var(--pl-border);
    box-shadow: 0 24px 64px rgba(0, 0, 0, 0.38);
    overflow: hidden;
    transform: translateY(6px);
    transition: transform 0.2s cubic-bezier(0.22, 1, 0.36, 1);
    position: relative;
    isolation: isolate;
}

html[data-chat-theme="light"] .pl-dialog {
    box-shadow: 0 24px 60px rgba(15, 23, 42, 0.16);
}

.pl-modal.pl-open .pl-dialog { transform: translateY(0); }

/* Tek seferde sadece bir view görünür */
.pl-view {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
}
.pl-view[hidden] { display: none; }

/* --- HEADER --- */
.pl-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 20px;
    flex-shrink: 0;
    border-bottom: 1px solid var(--pl-border);
}

.pl-header-title {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.pl-header-text {
    min-width: 0;
}

.pl-header-text h2,
.pl-editor-heading {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: -0.005em;
    color: var(--pl-text);
    line-height: 1.3;
}

.pl-close,
.pl-back {
    width: 28px;
    height: 28px;
    border-radius: 6px;
    border: 0;
    background: transparent;
    color: var(--pl-text-mute);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
    transition: background 0.12s ease, color 0.12s ease;
}
.pl-close svg, .pl-back svg { width: 15px; height: 15px; stroke-width: 2; }
.pl-close:hover, .pl-back:hover {
    background: color-mix(in srgb, var(--notr1) 8%, transparent);
    color: var(--pl-text);
}

/* --- TABS --- */
.pl-subbar {
    padding: 0 20px;
    flex-shrink: 0;
    border-bottom: 1px solid var(--pl-border);
}

.pl-tabs {
    display: inline-flex;
    align-items: stretch;
    gap: 0;
    margin-bottom: -1px;
}

.pl-tab {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 14px;
    background: transparent;
    border: 0;
    color: var(--pl-text-mute);
    font-family: inherit;
    font-size: 12.5px;
    font-weight: 500;
    cursor: pointer;
    border-bottom: 1.5px solid transparent;
    transition: color 0.12s ease, border-color 0.12s ease;
    position: relative;
}
.pl-tab svg { width: 13px; height: 13px; opacity: 0.85; }
.pl-tab:hover { color: var(--pl-text-soft); }
.pl-tab.is-active {
    color: var(--pl-text);
    border-bottom-color: var(--pl-text);
    font-weight: 600;
}
.pl-tab.is-active svg { opacity: 1; }

.pl-tab-badge {
    min-width: 18px;
    padding: 1px 6px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--notr1) 10%, transparent);
    color: var(--pl-text-mute);
    font-size: 10px;
    font-weight: 600;
    text-align: center;
    line-height: 1.4;
    font-variant-numeric: tabular-nums;
}
.pl-tab.is-active .pl-tab-badge {
    background: color-mix(in srgb, var(--pl-text) 12%, transparent);
    color: var(--pl-text);
}

/* --- TOOLBAR --- */
.pl-toolbar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 20px 8px;
    flex-shrink: 0;
}

.pl-search {
    position: relative;
    flex: 1 1 auto;
    display: flex;
    align-items: center;
}
.pl-search svg {
    position: absolute;
    left: 11px;
    width: 13px;
    height: 13px;
    color: var(--pl-text-mute);
    pointer-events: none;
}

.pl-search-input {
    width: 100%;
    padding: 8px 12px 8px 32px;
    background: var(--pl-surface-2);
    border: 1px solid var(--pl-border);
    border-radius: 8px;
    color: var(--pl-text);
    font-family: inherit;
    font-size: 13px;
    line-height: 1.3;
    outline: none;
    transition: border-color 0.12s ease, background 0.12s ease;
}
.pl-search-input::placeholder { color: var(--pl-text-mute); }
.pl-search-input:focus {
    border-color: var(--pl-border-strong);
    background: var(--pl-surface);
}

.pl-add-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 7px 12px;
    background: var(--pl-text);
    color: var(--pl-surface);
    border: 0;
    border-radius: 8px;
    font-family: inherit;
    font-size: 12.5px;
    font-weight: 600;
    cursor: pointer;
    flex-shrink: 0;
    transition: opacity 0.12s ease;
    letter-spacing: -0.005em;
}
.pl-add-btn svg { width: 12px; height: 12px; }
.pl-add-btn:hover { opacity: 0.85; }
.pl-add-btn:active { opacity: 0.7; }

/* --- CHIPS (kategori filtresi) --- */
.pl-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    padding: 4px 20px 14px;
    flex-shrink: 0;
}

.pl-chip {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    background: transparent;
    color: var(--pl-text-mute);
    border: 0;
    border-radius: 6px;
    font-family: inherit;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.4;
    cursor: pointer;
    transition: background 0.12s ease, color 0.12s ease;
    white-space: nowrap;
}
.pl-chip:hover {
    color: var(--pl-text);
    background: color-mix(in srgb, var(--notr1) 6%, transparent);
}
.pl-chip.is-active {
    background: color-mix(in srgb, var(--notr1) 11%, transparent);
    color: var(--pl-text);
    font-weight: 600;
}

/* --- BODY --- */
.pl-body {
    flex: 1 1 auto;
    overflow-y: auto;
    padding: 4px 20px 20px;
    min-height: 0;
}

.pl-body::-webkit-scrollbar { width: 8px; }
.pl-body::-webkit-scrollbar-track { background: transparent; }
.pl-body::-webkit-scrollbar-thumb {
    background: color-mix(in srgb, var(--notr1) 12%, transparent);
    border-radius: 4px;
    border: 2px solid transparent;
    background-clip: padding-box;
}
.pl-body::-webkit-scrollbar-thumb:hover {
    background: color-mix(in srgb, var(--notr1) 20%, transparent);
    background-clip: padding-box;
}

.pl-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 8px;
}

/* --- CARD (düz, hairline border) --- */
.pl-card {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px 14px;
    background: transparent;
    border: 1px solid var(--pl-border);
    border-radius: 10px;
    transition: border-color 0.12s ease, background 0.12s ease;
    min-height: 0;
}

.pl-card:hover {
    background: var(--pl-surface-hover);
    border-color: var(--pl-border-strong);
}

.pl-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.pl-card-title {
    margin: 0;
    font-size: 13.5px;
    font-weight: 600;
    line-height: 1.4;
    color: var(--pl-text);
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    word-break: break-word;
    letter-spacing: -0.005em;
}

.pl-card-cat {
    flex-shrink: 0;
    padding: 2px 7px;
    border-radius: 4px;
    background: color-mix(in srgb, var(--notr1) 8%, transparent);
    color: var(--pl-text-soft);
    font-size: 10px;
    font-weight: 500;
    line-height: 1.5;
    white-space: nowrap;
    letter-spacing: 0.01em;
}

.pl-card-preview {
    margin: 0;
    flex: 1 1 auto;
    font-size: 12.5px;
    line-height: 1.5;
    color: var(--pl-text-soft);
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    word-break: break-word;
}

.pl-card-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-top: 2px;
}

.pl-card-meta {
    font-size: 10.5px;
    color: var(--pl-text-mute);
    font-variant-numeric: tabular-nums;
}

.pl-card-actions {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    margin-left: auto;
}

/* Edit/delete ikonları hover'da fade-in (Kullan butonu hep görünür) */
.pl-card .pl-icon-btn {
    opacity: 0;
    transition: opacity 0.12s ease, background 0.12s ease, color 0.12s ease;
}
.pl-card:hover .pl-icon-btn,
.pl-card:focus-within .pl-icon-btn { opacity: 1; }

/* --- BUTTONS --- */
.pl-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 6px 12px;
    border: 1px solid transparent;
    border-radius: 7px;
    font-family: inherit;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    line-height: 1.3;
    letter-spacing: -0.005em;
    transition: background 0.12s ease, color 0.12s ease, border-color 0.12s ease, opacity 0.12s ease;
}
.pl-btn:disabled { opacity: 0.5; cursor: not-allowed; }
.pl-btn-sm { padding: 5px 10px; font-size: 11.5px; border-radius: 6px; }

.pl-btn svg { width: 11px; height: 11px; }
.pl-btn-sm svg { width: 11px; height: 11px; }

.pl-btn-primary {
    background: var(--pl-text);
    color: var(--pl-surface);
}
.pl-btn-primary:hover:not(:disabled) { opacity: 0.85; }
.pl-btn-primary:active:not(:disabled) { opacity: 0.72; }

.pl-btn-ghost {
    background: transparent;
    color: var(--pl-text-soft);
    border-color: var(--pl-border-strong);
}
.pl-btn-ghost:hover:not(:disabled) {
    background: color-mix(in srgb, var(--notr1) 6%, transparent);
    color: var(--pl-text);
}

.pl-icon-btn {
    width: 26px;
    height: 26px;
    border-radius: 6px;
    background: transparent;
    border: 0;
    color: var(--pl-text-mute);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.12s ease, color 0.12s ease;
}
.pl-icon-btn svg { width: 12px; height: 12px; }
.pl-icon-btn:hover {
    background: color-mix(in srgb, var(--notr1) 8%, transparent);
    color: var(--pl-text);
}
.pl-icon-btn--danger:hover {
    background: rgba(239, 68, 68, 0.1);
    color: #ef4444;
}

/* --- EMPTY STATE --- */
.pl-empty {
    padding: 64px 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.pl-empty-inner {
    text-align: center;
    max-width: 360px;
    color: var(--pl-text-soft);
}
.pl-empty-inner svg {
    width: 32px;
    height: 32px;
    margin-bottom: 14px;
    color: var(--pl-text-mute);
    stroke-width: 1.5;
    opacity: 0.7;
}
.pl-empty-inner h3 {
    margin: 8px 0 6px;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--pl-text);
    letter-spacing: -0.005em;
}
.pl-empty-inner p {
    margin: 0 0 16px;
    font-size: 12.5px;
    line-height: 1.55;
}

.pl-spinner {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 1.5px solid color-mix(in srgb, var(--notr1) 18%, transparent);
    border-top-color: var(--pl-text);
    margin: 0 auto 10px;
    animation: pl-spin 0.7s linear infinite;
}
@keyframes pl-spin { to { transform: rotate(360deg); } }

/* =================================================================
   EDITOR VIEW
   ================================================================= */
.pl-header--editor {
    padding: 12px 16px;
    align-items: center;
    gap: 8px;
}
.pl-header--editor .pl-header-text { flex: 1 1 auto; }

.pl-editor-body {
    flex: 1 1 auto;
    overflow-y: auto;
    padding: 18px 20px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-height: 0;
}

.pl-editor-body::-webkit-scrollbar { width: 8px; }
.pl-editor-body::-webkit-scrollbar-track { background: transparent; }
.pl-editor-body::-webkit-scrollbar-thumb {
    background: color-mix(in srgb, var(--notr1) 12%, transparent);
    border-radius: 4px;
    border: 2px solid transparent;
    background-clip: padding-box;
}

.pl-field {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}
.pl-field--content {
    flex: 1 1 auto;
    min-height: 220px;
    position: relative;
}

.pl-field-label {
    font-size: 11.5px;
    font-weight: 600;
    color: var(--pl-text-soft);
    letter-spacing: -0.005em;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.pl-field-input,
.pl-field-textarea {
    width: 100%;
    background: var(--pl-surface);
    border: 1px solid var(--pl-border);
    border-radius: 8px;
    color: var(--pl-text);
    font-family: inherit;
    font-size: 13px;
    line-height: 1.5;
    padding: 9px 12px;
    outline: none;
    transition: border-color 0.12s ease, background 0.12s ease;
    box-sizing: border-box;
}

.pl-field-textarea {
    flex: 1 1 auto;
    min-height: 220px;
    font-family: var(--chat-font);
    resize: vertical;
}

.pl-field-input:focus,
.pl-field-textarea:focus {
    border-color: var(--pl-text-mute);
    background: var(--pl-surface);
}

.pl-field-counter {
    font-size: 10.5px;
    font-weight: 500;
    color: var(--pl-text-mute);
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.01em;
}

/* --- KATEGORİ SEÇİCİSİ — minimal, satır içi pill'ler --- */
.pl-cat-picker {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    align-items: center;
    padding: 0;
    background: transparent;
    border: 0;
    min-height: 0;
}

.pl-cat-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 26px;
    padding: 0 10px;
    border-radius: 6px;
    background: transparent;
    border: 1px solid var(--pl-border);
    color: var(--pl-text-soft);
    font-family: inherit;
    font-size: 11.5px;
    font-weight: 500;
    line-height: 1;
    cursor: pointer;
    transition: background 0.12s ease, color 0.12s ease, border-color 0.12s ease;
    white-space: nowrap;
    user-select: none;
}
.pl-cat-chip:hover {
    background: color-mix(in srgb, var(--notr1) 5%, transparent);
    color: var(--pl-text);
    border-color: var(--pl-border-strong);
}
.pl-cat-chip.is-active {
    background: var(--pl-text);
    border-color: var(--pl-text);
    color: var(--pl-surface);
    font-weight: 600;
}
.pl-cat-chip.is-active:hover {
    background: var(--pl-text);
    color: var(--pl-surface);
    opacity: 0.88;
}

.pl-cat-chip--new {
    border-style: dashed;
    color: var(--pl-text-mute);
}
.pl-cat-chip--new:hover {
    color: var(--pl-text);
    border-style: solid;
}
.pl-cat-chip--new svg {
    width: 11px;
    height: 11px;
    flex-shrink: 0;
}

.pl-cat-custom {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-top: 6px;
}
.pl-cat-custom[hidden] { display: none; }
.pl-cat-custom-input {
    flex: 1 1 auto;
    height: 30px;
    padding: 0 10px;
    font-size: 12.5px;
}
.pl-cat-custom-ok,
.pl-cat-custom-cancel {
    flex-shrink: 0;
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    border: 1px solid var(--pl-border);
    background: transparent;
    color: var(--pl-text-mute);
    cursor: pointer;
    transition: background 0.12s ease, color 0.12s ease, border-color 0.12s ease;
}
.pl-cat-custom-ok svg,
.pl-cat-custom-cancel svg { width: 12px; height: 12px; }
.pl-cat-custom-ok:hover {
    color: var(--pl-text);
    border-color: var(--pl-border-strong);
    background: color-mix(in srgb, var(--notr1) 6%, transparent);
}
.pl-cat-custom-cancel:hover {
    color: #ef4444;
    border-color: rgba(239, 68, 68, 0.3);
    background: rgba(239, 68, 68, 0.06);
}

/* --- EDITOR FOOTER --- */
.pl-editor-footer {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 20px;
    border-top: 1px solid var(--pl-border);
    background: transparent;
}

.pl-footer-hint {
    font-size: 11.5px;
    color: var(--pl-text-mute);
    line-height: 1.4;
    min-width: 0;
}
.pl-footer-hint code {
    font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;
    font-size: 10.5px;
    padding: 1px 5px;
    border-radius: 3px;
    background: color-mix(in srgb, var(--notr1) 8%, transparent);
    color: var(--pl-text-soft);
    font-weight: 500;
}

.pl-editor-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}

/* --- TOAST --- */
.pl-toast-host {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    pointer-events: none;
    z-index: 10;
}

.pl-toast {
    pointer-events: auto;
    padding: 7px 14px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 500;
    background: rgba(15, 18, 28, 0.96);
    color: #fff;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.24);
    transform: translateY(6px);
    opacity: 0;
    transition: transform 0.18s ease, opacity 0.18s ease;
    letter-spacing: -0.005em;
}
.pl-toast.pl-toast-show { transform: translateY(0); opacity: 1; }
.pl-toast--success { background: #16a34a; }
.pl-toast--error   { background: #dc2626; }

/* --- MOBILE --- */
@media (max-width: 640px) {
    .pl-modal { padding: 0; }
    .pl-dialog {
        width: 100vw;
        height: 100vh;
        max-height: 100vh;
        border-radius: 0;
        border: 0;
    }
    .pl-list { grid-template-columns: 1fr; }
    .pl-header { padding: 12px 14px; }
    .pl-subbar { padding: 0 14px; }
    .pl-toolbar { padding: 10px 14px 6px; }
    .pl-chips { padding: 4px 14px 12px; }
    .pl-body { padding: 4px 14px 16px; }
    .pl-editor-body { padding: 14px; gap: 14px; }
    .pl-editor-footer { padding: 10px 14px; flex-wrap: wrap; }
    .pl-footer-hint { order: 2; flex-basis: 100%; }
    .pl-editor-actions { order: 1; margin-left: auto; }
    .pl-add-btn span { display: none; }
    .pl-add-btn { padding: 7px 9px; }
    /* Mobilde aksiyonlar her zaman görünür (hover yok) */
    .pl-card .pl-icon-btn { opacity: 1; }
}