/*
 * Ücretsiz PDF Araçları - tema tokenları (gündüz / gece)
 *
 * Kullanım: Faz 1 agent'ı bu dosyanın token bloklarını phase1/style.css'teki
 * mevcut :root bloklarının yerine koyar (ya da bu dosyayı style.css'in başına alır).
 * Bileşen kuralları bu dosyada değil; yalnızca değişkenler ve tema seçimi burada.
 *
 * Mod seçimi:
 *   1) Varsayılan: sistem tercihi (prefers-color-scheme).
 *   2) Kullanıcı düğmeye basarsa <html data-theme="light|dark"> ayarlanır ve
 *      localStorage'da "pdf-tema" anahtarıyla saklanır (design/tema-gecis.js).
 *
 * Kontrast ölçümleri (WCAG 2.x, göreli parlaklık oranı):
 *   Gündüz: metin/zemin 15.6:1, ikincil metin/yüzey 6.9:1, vurgu/yüzey 6.1:1,
 *           hata/yüzey 6.5:1, başarı/yüzey 5.4:1, uyarı metni/uyarı zemini 8.4:1,
 *           kontrol kenarlığı/yüzey 4.6:1, önizleme çerçevesi/önizleme 3.4:1.
 *   Gece:   metin/zemin 15.7:1, ikincil metin/yüzey 6.7:1, vurgu/yüzey 7.2:1,
 *           hata/yüzey 7.4:1, başarı/yüzey 9.4:1, uyarı metni/uyarı zemini 10.0:1,
 *           kontrol kenarlığı/yüzey 4.1:1, önizleme çerçevesi/önizleme 4.2:1.
 *   Metin için AA eşiği 4.5:1 her iki modda sağlanıyor; kontrol kenarlığı ve
 *   önizleme çerçevesi (WCAG 1.4.11, 3:1) de sağlanıyor.
 */

/* ---------- Gündüz (varsayılan) ---------- */
:root {
  --bg: #f6f6f3;            /* sayfa zemini */
  --surface: #ffffff;       /* kart, girdi, açılır alan */
  --text: #1d1d1b;          /* ana metin */
  --text-muted: #5a5a55;    /* ikincil metin, ipuçları */
  --accent: #1f5fbf;        /* bağlantı, birincil düğme zemini, odak */
  --accent-fg: #ffffff;     /* accent üzerindeki metin */
  --focus: #1f5fbf;         /* odak halkası */
  --border: #d6d6cf;        /* dekoratif kenarlık (kart ayırıcı) */
  --control-border: #76766e;/* girdi, düğme çerçevesi (1.4.11) */
  --err: #b3261e;           /* hata metni */
  --ok: #1c7a3c;            /* başarı metni */
  --warn-bg: #fff4d6;       /* uyarı kutusu zemini */
  --warn-fg: #5e4300;       /* uyarı kutusu metni */
  --info-bg: #e8f0fb;       /* bilgi kutusu zemini (sınır bilgisi, uyarı değil) */
  --info-fg: #1d3a66;       /* bilgi kutusu metni (9.9:1 zemin üzerinde) */
  --preview-bg: #e4e4df;    /* PDF / sayfa önizleme zemini */
  --preview-frame: #7a7a72; /* önizleme çerçevesi */
  --page-paper: #ffffff;    /* render edilmiş sayfa kağıdı (her zaman beyaz) */

  /* Tipografi (ayrıntı: design/TİPOGRAFİ.md) */
  --font-sans: Geist, -apple-system, BlinkMacSystemFont, "SF Pro Text", Inter, system-ui, "Segoe UI", Roboto, Arial, sans-serif;
  --font-arabic: "Noto Sans Arabic", Tahoma, "Segoe UI", sans-serif;
  --font-hebrew: "Noto Sans Hebrew", Arial, "Segoe UI", sans-serif;
  --font-cjk-sc: "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
  --font-cjk-jp: "Hiragino Sans", "Yu Gothic", "Noto Sans CJK JP", sans-serif;
  --fs-sm: 0.875rem;        /* 14px: ipucu, alt bilgi */
  --fs-base: 1rem;          /* 16px: gövde metni */
  --fs-md: 1.125rem;        /* 18px: vurgulu metin */
  --fs-lg: 1.25rem;         /* 20px: kart başlığı (h2) */
  --fs-xl: 1.5rem;          /* 24px: sayfa başlığı mobil (h1) */
  --fs-2xl: 2rem;           /* 32px: sayfa başlığı masaüstü (h1) */
  --lh-body: 1.6;
  --lh-heading: 1.25;
  --fw-regular: 400;
  --fw-semibold: 600;
  color-scheme: light;
}

/* ---------- Gece: sistem tercihi (kullanıcı seçimi yoksa) ---------- */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #131315;
    --surface: #1c1c20;
    --text: #ececea;
    --text-muted: #a3a3a0;
    --accent: #7aa8ff;
    --accent-fg: #0b1a33;
    --focus: #7aa8ff;
    --border: #3a3a40;
    --control-border: #7c7c84;
    --err: #ff8a80;
    --ok: #6fd58f;
    --warn-bg: #3a3117;
    --warn-fg: #ffe08a;
    --info-bg: #1b2a44;
    --info-fg: #b7d0ff;
    --preview-bg: #2a2a30;
    --preview-frame: #8a8a94;
    --page-paper: #ffffff;
    color-scheme: dark;
  }
}

/* ---------- Gece: kullanıcı açıkça koyuyu seçti ---------- */
:root[data-theme="dark"] {
  --bg: #131315;
  --surface: #1c1c20;
  --text: #ececea;
  --text-muted: #a3a3a0;
  --accent: #7aa8ff;
  --accent-fg: #0b1a33;
  --focus: #7aa8ff;
  --border: #3a3a40;
  --control-border: #7c7c84;
  --err: #ff8a80;
  --ok: #6fd58f;
  --warn-bg: #3a3117;
  --warn-fg: #ffe08a;
  --info-bg: #1b2a44;
  --info-fg: #b7d0ff;
  --preview-bg: #2a2a30;
  --preview-frame: #8a8a94;
  --page-paper: #ffffff;
  color-scheme: dark;
}

/* ---------- Ortak kullanımlar (bileşenler bu değişkenleri kullanır) ---------- */
body {
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-sans);
  font-size: var(--fs-base);
  font-weight: var(--fw-regular);
  line-height: var(--lh-body);
}

h1, h2, h3 {
  font-weight: var(--fw-semibold);
  line-height: var(--lh-heading);
  letter-spacing: -0.01em;
}

button,
.tab-list a {
  font-weight: var(--fw-semibold);
}

/* Sayfa numaraları ve boyutlar hizalı görünsün */
.num,
.file-list .size {
  font-variant-numeric: tabular-nums;
}

/* Yalnızca ilgili dil sayfada kullanıldığında (şimdilik Türkçe; bu kurallar boşa çalışmaz) */
:lang(ar),
:lang(fa),
:lang(ur) {
  font-family: var(--font-arabic);
}

:lang(he) {
  font-family: var(--font-hebrew);
}

:lang(zh) {
  font-family: var(--font-cjk-sc);
}

:lang(ja) {
  font-family: var(--font-cjk-jp);
}

:focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 2px;
}

/* Önizleme alanı: sayfa görüntüsü her zaman beyaz kağıt üzerinde durur;
   çerçeve ve zemin temaya göre değişir, böylece koyu modda sayfa sınırı kaybolmaz. */
.preview {
  background: var(--preview-bg);
  border: 1px solid var(--preview-frame);
  border-radius: 8px;
  padding: 8px;
}

.preview canvas,
.preview img {
  background: var(--page-paper);
  border: 1px solid var(--preview-frame);
}

/* ---------- Tema geçiş düğmesi ---------- */
.theme-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 8px 14px;
  font: inherit;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--text);
  background: var(--surface);
  border: 1px solid var(--control-border);
  border-radius: 999px;
  cursor: pointer;
}

.theme-toggle[aria-pressed="true"] {
  background: var(--accent);
  color: var(--accent-fg);
  border-color: var(--accent);
}
