/* ============================================================
   tokens.css — TEK KAYNAK design token katmanı.
   Token Reference (Docs/design/Token Reference.dc.html) ile eşlenir.
   Tasarım değişince SADECE bu dosya güncellenir; tüm CSS/component
   var(--rn-*) üzerinden bağlıdır.
   ============================================================ */
:root {
    /* ---- Semantik diff palette (Token Reference) ---- */
    --rn-blue: #2F6BED;          /* All / primary / total */
    --rn-blue-bg: #E7EEFC;       /* info / target-extra (core eksiği yok) açık mavi tint */
    --rn-source: #0B7A57;        /* Source / only-in-left — koyu yeşil (text) */
    --rn-source-accent: #13A37A; /* INSERT yeşil (border/badge) */
    --rn-source-bg: #E7F6F0;     /* kaynak hücre açık yeşil tint */
    --rn-diff: #B0710A;          /* UPDATE / different — text */
    --rn-diff-accent: #D98A14;   /* different border */
    --rn-diff-bg: #FBF1DF;       /* modified hücre açık sarı tint */
    --rn-target: #C0354C;        /* Target / only-in-right — koyu kırmızı (text) */
    --rn-target-accent: #D6455D; /* DELETE kırmızı (border/badge) */
    --rn-target-bg: #FBE9EC;     /* hedef hücre açık pembe tint */
    --rn-iden: #5A6B7D;          /* identical / cosmetic — nötr gri */

    /* ---- Header gradient (SQL diff panel başlık — grid DEĞİL) ---- */
    --rn-grad-from: #2E63D6;
    --rn-grad-to: #1E3FD9;
    --rn-grad: linear-gradient(120deg, #2E63D6, #1E3FD9);

    /* ---- Grid başlık katmanları (gri ton merdiveni — Token Reference) ----
       Üst başlık en koyu, alt-başlık daha açık, gövde beyaz. */
    --rn-head-1: #DEE4EE;     /* üst seviye grid başlık (en koyu kat) */
    --rn-head-2: #EBEFF5;     /* ara kat (gerekirse) */
    --rn-head-ink: #3A4761;   /* başlık metni (gri zemin üzerinde koyu) */

    /* ---- Nötr / yüzey gri ton merdiveni (Token Reference "Başlık katmanları") ---- */
    --rn-bg: #EDEFF4;            /* sayfa zemini */
    --rn-surface: #EEF1F6;       /* başlık/sub-header gri yüzey */
    --rn-surface-2: #F4F6FA;     /* hover / ikincil yüzey */
    --rn-surface-3: #F8FAFD;     /* en açık yüzey */
    --rn-border: #E3E7EF;        /* standart kenarlık */
    --rn-border-2: #E1E7F0;      /* yüzey ayraç kenarlığı */

    /* ---- Metin tonları ---- */
    --rn-ink: #1B2435;           /* ana metin */
    --rn-ink-2: #27324A;         /* değer / koyu ikincil */
    --rn-muted: #5A6B86;         /* meta / label */
    --rn-muted-2: #7A8AA3;       /* daha soluk meta */
    --rn-muted-3: #94A2B8;       /* en soluk */
    --rn-faint: #C2CBD8;         /* tire / placeholder */

    /* ---- Sidebar nav aktif vurgu ---- */
    --rn-nav-active-bg: #E1ECFE;   /* aktif route açık mavi tint (eski #EAF1FE'den biraz daha belirgin) */

    /* ---- Şekil ---- */
    --rn-radius: 8px;
    --rn-radius-lg: 12px;

    /* ---- Ortak control yüksekliği (#38) ---- */
    /* Toolbar buton / input / dropdown / primary yüksekliği tek kaynak.
       [2026-06-23] kullanıcı kararı: TÜM control'ler nav satırıyla orantılı 26px
       (tek yoğunluk birimi — nav/grid/toolbar/buton/dropdown hepsi 26). Primary
       artık boyutla değil RENKLE ayrışır. */
    --rn-control-h: 26px;
    --rn-control-h-primary: 26px;
    /* İkincil/düşük-öncelik başlık şeridi kontrolü (SQL diff toolbar gibi).
       Bu tip şeritler TOPLAM --rn-grid-row-h (26px) olur; içlerindeki nav/search
       bu küçük birimi kullanır ki şerit yer kaplamasın. */
    --rn-control-h-sm: 20px;
    /* Ortak control GÖVDE FONTU (ca-2) — toolbar input / picker / search / derinlik
       gibi kontrollerin metni. Tek kaynak; aksi halde input'lar body 16px'ini
       devralıyor (kural: gövde 12–13px). Değer büyütünce tüm kontrol metni ferahlar. */
    --rn-control-font: 12px;

    /* ---- Beyaz yüzey (dark'ta flip eder — hex literal #fff yerine kullan) ---- */
    --rn-white: #ffffff;          /* kart / panel / input zemini */
    --rn-hover: #F4F7FC;          /* ghost buton hover zemini */
    --rn-control-border: #DDE3EC; /* toolbar control kenarlığı */
    --rn-shadow-pop: rgba(16,30,60,.18);  /* dropdown / popover gölgesi */
    --rn-hl: #FFE9A8;             /* arama eşleşme highlight (mark) zemini */

    /* ---- Grid / liste ölçüleri (DATA-YOĞUN COMPACT — tek kaynak) ----
       Token Reference "Yoğunluk" katmanı. SC / DC / RC grid'leri ve SQL diff
       panel bu token'lardan beslenir; compact'lık tek noktadan ayarlanır
       (primary color gibi). Değer büyütünce tüm grid'ler ferahlar. */
    --rn-grid-row-h: 26px;            /* satır yüksekliği (eski 32) */
    --rn-grid-font: 11.5px;           /* gövde font (eski 12) */
    --rn-grid-cell-pad-x: 8px;        /* hücre yatay padding */
    --rn-grid-head-font: 10px;        /* başlık font (eski 11) */
    --rn-grid-head-pad-x: 10px;       /* başlık yatay padding (eski 12) */
    --rn-grid-head-pad-y: 5px;        /* başlık dikey padding (eski 9) */
    --rn-grid-doubled-font: 11px;     /* doubled grid mono font (eski 11.5) */
    --rn-grid-doubled-pad-x: 7px;     /* doubled hücre yatay (eski 8) */
    --rn-grid-doubled-pad-y: 4px;     /* doubled hücre dikey (eski 8) */
    --rn-grid-group-pad-y: 3px;       /* grup başlık dikey (eski 4) */
    --rn-grid-group-font: 11.5px;     /* grup satır metni (eski 12.5) */

    /* ---- Sidebar nav yoğunluğu (Claude sidebar referansı — COMPACT, tek kaynak) ----
       Sol menü satır padding/gap/ikon tek noktadan. Değer büyütünce sol menü ferahlar. */
    --rn-nav-item-pad-y: 3px;         /* nav item dikey padding (eski 8 → Claude sidebar ~26px yoğunluğu) */
    --rn-nav-item-pad-x: 12px;        /* nav item yatay padding (eski 14) */
    --rn-nav-gap: 9px;                /* ikon ↔ label arası (eski 11) */
    --rn-nav-icon: 15px;              /* sidebar nav ikon boyutu (eski 17–18) */

    /* Başlık metin dönüşümü — uppercase YERINE capitalize (kullanıcı tercihi, tek kaynak) */
    --rn-head-transform: capitalize;

    /* SQL diff panel (Schema Compare alt panel) — temel tipografi deploy editörüyle ORTAK (dr-13).
       Font/satır-yüksekliği aşağıdaki --rn-code-*'tan beslenir → diff pane + deploy editör tek-kaynak. */
    --rn-diff-font: var(--rn-code-font);
    --rn-diff-line-h: var(--rn-code-line-h);
    --rn-diff-toolbar-pad-y: 4px;     /* SQL view başlık bar dikey (eski 6) */
    --rn-diff-toolbar-pad-x: 10px;    /* SQL view başlık bar yatay (eski 12) */

    /* ---- Kod/script bloğu (.rn-code-block — dr-13 tek-kaynak) ----
       Tüm <pre> / SQL / deploy editörleri bu token'lardan beslenir.
       Compact IBM Plex Mono; değer büyütünce tüm kod blokları ferahlar. */
    --rn-code-font: 12px;             /* kod gövde font (IBM Plex Mono) */
    --rn-code-line-h: 1.55;           /* kod satır yüksekliği */
    --rn-code-pad-y: 10px;            /* kod blok dikey padding */
    --rn-code-pad-x: 14px;            /* kod blok yatay padding */
    --rn-code-bg: var(--rn-surface-3);/* kod blok zemini (en açık yüzey, dark flip eder) */
    --rn-code-max-h: 420px;           /* varsayılan max yükseklik */
}

/* ============================================================
   DARK MODE (feat-5) — [data-theme="dark"] altında --rn-* flip.
   Sözleşme: js/theme.js → <html data-theme="dark">. Sadece RENK
   token'ları override edilir; boyut/yoğunluk token'ları :root'tan
   miras kalır (tek kaynak). Anlam renkleri (yeşil/sarı/kırmızı/mavi)
   koyu zeminde okunur kalacak şekilde biraz açıldı; tint'ler koyu
   zemin için düşük-doygunlukta yeniden tanımlandı.
   ============================================================ */
[data-theme="dark"] {
    /* ---- Semantik diff palette — koyu zeminde okunur (text biraz açık) ---- */
    --rn-blue: #5B8DF7;
    --rn-blue-bg: #1E2A44;       /* info / target-extra koyu mavi tint */
    --rn-source: #34C796;        /* only-in-left text */
    --rn-source-accent: #2BB985; /* INSERT border/badge */
    --rn-source-bg: #16302A;     /* kaynak hücre koyu yeşil tint */
    --rn-diff: #E0A93E;          /* UPDATE text */
    --rn-diff-accent: #D98A14;   /* different border */
    --rn-diff-bg: #322817;       /* modified koyu sarı tint */
    --rn-target: #F0758A;        /* only-in-right text */
    --rn-target-accent: #E55D74; /* DELETE border/badge */
    --rn-target-bg: #361A20;     /* hedef hücre koyu pembe tint */
    --rn-iden: #97A4B8;          /* identical nötr gri */

    /* ---- Header gradient ---- */
    --rn-grad-from: #2E63D6;
    --rn-grad-to: #1E3FD9;
    --rn-grad: linear-gradient(120deg, #2E63D6, #1E3FD9);

    /* ---- Grid başlık katmanları (koyu) ---- */
    --rn-head-1: #2A3142;
    --rn-head-2: #232838;
    --rn-head-ink: #B7C2D6;

    /* ---- Nötr / yüzey gri ton merdiveni (koyu — açıktan koyuya ters çevrildi) ---- */
    --rn-bg: #14171F;            /* sayfa zemini (en koyu) */
    --rn-surface: #1C212C;       /* başlık/sub-header yüzey */
    --rn-surface-2: #232A38;     /* hover / ikincil yüzey */
    --rn-surface-3: #283040;     /* en açık yüzey */
    --rn-border: #2C3340;        /* standart kenarlık */
    --rn-border-2: #333B4A;      /* yüzey ayraç kenarlığı */

    /* ---- Metin tonları (koyu zemin → açık metin) ---- */
    --rn-ink: #E6EAF2;           /* ana metin */
    --rn-ink-2: #D2D9E6;         /* değer / ikincil */
    --rn-muted: #97A4B8;         /* meta / label */
    --rn-muted-2: #7E8CA3;       /* daha soluk meta */
    --rn-muted-3: #67748B;       /* en soluk */
    --rn-faint: #4A5468;         /* tire / placeholder */

    /* ---- Sidebar nav aktif vurgu (koyu mavi tint) ---- */
    --rn-nav-active-bg: #1E2A44;

    /* ---- Beyaz yüzey + control yüzeyleri (dark flip) ---- */
    --rn-white: #1B202B;          /* kart / panel / input zemini */
    --rn-hover: #232A38;          /* ghost buton hover */
    --rn-control-border: #353E4E; /* toolbar control kenarlığı */
    --rn-shadow-pop: rgba(0,0,0,.55);  /* dropdown gölgesi koyuda daha belirgin */
    --rn-hl: #5c4a1a;             /* arama eşleşme highlight — koyuda amber, açık metinle okunur */
}