/* ═══════════════════════════════════════════════════════════
   KUAFORY — 5 Tema Sistemi (v2)
   ═══════════════════════════════════════════════════════════ */

[data-theme] {
  --black:       var(--t-bg);
  --dark:        #FFFFFF;
  --dark-2:      var(--t-bg2);
  --dark-3:      var(--t-bg3);
  --border:      var(--t-border);
  --gold:        var(--t-accent);
  --gold-light:  var(--t-accent-light);
  --gold-dim:    var(--t-accent-dim);
  --white:       var(--t-text);
  --white-dim:   var(--t-text-dim);
  --white-faint: var(--t-text-faint);
  --shadow:      0 2px 16px var(--t-shadow);
}

/* ── 1: Sıcak Sarı ─────────────────────────────────────── */
[data-theme="warm-yellow"] {
  --t-bg:           #FFF8E6; --t-bg2: #FFF4D6; --t-bg3: #FFEFC0;
  --t-border:       #DECA80;
  --t-accent:       #B87E08; --t-accent-light: #D09018;
  --t-accent-dim:   rgba(184,126,8,0.12);
  --t-text:         #2A2010; --t-text-dim: rgba(42,32,16,0.62);
  --t-text-faint:   rgba(42,32,16,0.06);
  --t-shadow:       rgba(140,90,0,0.12);
}

/* ── 2: Okyanus Mavisi ──────────────────────────────────── */
[data-theme="ocean-blue"] {
  --t-bg:           #EAF4FB; --t-bg2: #F0F8FF; --t-bg3: #DCF0FC;
  --t-border:       #90C4E4;
  --t-accent:       #1068A0; --t-accent-light: #1A7AB5;
  --t-accent-dim:   rgba(16,104,160,0.11);
  --t-text:         #0E2030; --t-text-dim: rgba(14,32,48,0.62);
  --t-text-faint:   rgba(14,32,48,0.06);
  --t-shadow:       rgba(0,70,130,0.12);
}

/* ── 3: Adaçayı Yeşili ─────────────────────────────────── */
[data-theme="sage-green"] {
  --t-bg:           #F3EEE4; --t-bg2: #F8F5EF; --t-bg3: #EDE8DE;
  --t-border:       #C8C2B0;
  --t-accent:       #456838; --t-accent-light: #5B7E4A;
  --t-accent-dim:   rgba(69,104,56,0.12);
  --t-text:         #1A1810; --t-text-dim: rgba(26,24,16,0.62);
  --t-text-faint:   rgba(26,24,16,0.06);
  --t-shadow:       rgba(40,70,25,0.12);
}

/* ── 4: Lila Mor ────────────────────────────────────────── */
[data-theme="lila-purple"] {
  --t-bg:           #F4F0FA; --t-bg2: #F8F4FF; --t-bg3: #EDE4F8;
  --t-border:       #B8A4DC;
  --t-accent:       #6038B0; --t-accent-light: #7C50C8;
  --t-accent-dim:   rgba(96,56,176,0.11);
  --t-text:         #14102A; --t-text-dim: rgba(20,16,42,0.62);
  --t-text-faint:   rgba(20,16,42,0.06);
  --t-shadow:       rgba(70,35,140,0.12);
}

/* ── 5: Karanlık ────────────────────────────────────────── */
[data-theme="dark"] {
  --t-bg:           #0a0a0a; --t-bg2: #1a1a1a; --t-bg3: #222222;
  --t-border:       #2a2a2a;
  --t-accent:       #c9a84c; --t-accent-light: #e8c97a;
  --t-accent-dim:   rgba(201,168,76,0.15);
  --t-text:         #f5f0e8; --t-text-dim: rgba(245,240,232,0.60);
  --t-text-faint:   rgba(245,240,232,0.08);
  --t-shadow:       rgba(0,0,0,0.45);
  --dark:           #111111;
}

/* ═══════════════════════════════════════════════════════════
   AÇIK TEMALAR (dark hariç)
   ═══════════════════════════════════════════════════════════ */

[data-theme]:not([data-theme="dark"]) body {
  background: var(--black);
  color: var(--white);
  font-weight: 400;
}

/* Makas + saç teli dekoratif arka plan */
[data-theme]:not([data-theme="dark"]) body::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='520' height='520'%3E%3Cg opacity='0.055' stroke='%23000' stroke-linecap='round' fill='none'%3E%3Cg transform='translate(40,38) rotate(-22)'%3E%3Cpath d='M0 0 L72 14' stroke-width='4.5'/%3E%3Cpath d='M0 0 L72 -14' stroke-width='4.5'/%3E%3Ccircle cx='-12' cy='11' r='11' stroke-width='4'/%3E%3Ccircle cx='-12' cy='-11' r='11' stroke-width='4'/%3E%3Ccircle cx='0' cy='0' r='4' fill='%23000' stroke='none'/%3E%3C/g%3E%3Cg transform='translate(320,400) rotate(14)'%3E%3Cpath d='M0 0 L60 12' stroke-width='4'/%3E%3Cpath d='M0 0 L60 -12' stroke-width='4'/%3E%3Ccircle cx='-10' cy='9' r='9' stroke-width='3.5'/%3E%3Ccircle cx='-10' cy='-9' r='9' stroke-width='3.5'/%3E%3Ccircle cx='0' cy='0' r='3.5' fill='%23000' stroke='none'/%3E%3C/g%3E%3Cg transform='translate(420,55) rotate(38)'%3E%3Cpath d='M0 0 L46 9' stroke-width='3.5'/%3E%3Cpath d='M0 0 L46 -9' stroke-width='3.5'/%3E%3Ccircle cx='-8' cy='7' r='7.5' stroke-width='3'/%3E%3Ccircle cx='-8' cy='-7' r='7.5' stroke-width='3'/%3E%3Ccircle cx='0' cy='0' r='3' fill='%23000' stroke='none'/%3E%3C/g%3E%3Cpath d='M-10 95 C65 72,130 112,200 88 S320 52,400 92 S490 130,560 105' stroke-width='1.5'/%3E%3Cpath d='M-10 148 C60 128,125 162,195 140 S315 106,393 144 S488 178,558 155' stroke-width='1.2'/%3E%3Cpath d='M-10 420 C70 400,140 436,210 412 S335 376,415 416 S508 450,575 428' stroke-width='1.4'/%3E%3Cpath d='M-10 468 C75 448,148 480,218 458 S345 422,425 460 S515 492,582 470' stroke-width='1.1'/%3E%3Cg transform='translate(18,230) rotate(-12)'%3E%3Crect x='0' y='0' width='48' height='7' rx='2' fill='%23000' stroke='none'/%3E%3Crect x='4' y='7' width='2.5' height='16' rx='1.2' fill='%23000' stroke='none'/%3E%3Crect x='10' y='7' width='2.5' height='20' rx='1.2' fill='%23000' stroke='none'/%3E%3Crect x='16' y='7' width='2.5' height='16' rx='1.2' fill='%23000' stroke='none'/%3E%3Crect x='22' y='7' width='2.5' height='20' rx='1.2' fill='%23000' stroke='none'/%3E%3Crect x='28' y='7' width='2.5' height='16' rx='1.2' fill='%23000' stroke='none'/%3E%3Crect x='34' y='7' width='2.5' height='20' rx='1.2' fill='%23000' stroke='none'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  background-size: 520px 520px;
  background-repeat: repeat;
}

[data-theme]:not([data-theme="dark"]) .topbar {
  background: rgba(255,255,255,0.92);
  backdrop-filter: blur(12px);
  border-bottom: 1.5px solid var(--border);
  box-shadow: 0 1px 8px var(--t-shadow);
}
[data-theme]:not([data-theme="dark"]) .topbar-logo { color: var(--white); }
[data-theme]:not([data-theme="dark"]) .topbar-logo span { color: var(--gold); }
[data-theme]:not([data-theme="dark"]) .topbar-user { color: var(--white-dim); }

[data-theme]:not([data-theme="dark"]) .sidebar {
  background: rgba(255,255,255,0.78);
  backdrop-filter: blur(8px);
  border-right: 1px solid var(--border);
}

[data-theme]:not([data-theme="dark"]) a { color: var(--gold); }
[data-theme]:not([data-theme="dark"]) a:hover { color: var(--gold-light); }

[data-theme]:not([data-theme="dark"]) input,
[data-theme]:not([data-theme="dark"]) select,
[data-theme]:not([data-theme="dark"]) textarea {
  background: var(--dark-2); border-color: var(--border);
  color: var(--white); font-weight: 400;
}
[data-theme]:not([data-theme="dark"]) input:focus,
[data-theme]:not([data-theme="dark"]) select:focus,
[data-theme]:not([data-theme="dark"]) textarea:focus {
  border-color: var(--gold); background: #fff;
  box-shadow: 0 0 0 3px var(--gold-dim);
}
[data-theme]:not([data-theme="dark"]) input::placeholder { color: var(--white-dim); }

[data-theme]:not([data-theme="dark"]) .card,
[data-theme]:not([data-theme="dark"]) .stat-card {
  background: var(--dark); border-color: var(--border); box-shadow: var(--shadow);
}
[data-theme]:not([data-theme="dark"]) .btn-gold { background: var(--gold); color: #fff; }
[data-theme]:not([data-theme="dark"]) .btn-gold:hover { background: var(--gold-light); }
[data-theme]:not([data-theme="dark"]) .btn-outline {
  border-color: var(--border); color: var(--white); background: transparent;
}
[data-theme]:not([data-theme="dark"]) .btn-outline:hover {
  border-color: var(--gold); color: var(--gold); background: var(--gold-dim);
}
[data-theme]:not([data-theme="dark"]) .spinner {
  border-color: rgba(255,255,255,0.35); border-top-color: #fff;
}
[data-theme]:not([data-theme="dark"]) .modal { background: var(--dark); border-color: var(--border); }
[data-theme]:not([data-theme="dark"]) .modal-overlay { background: rgba(0,0,0,0.28); }
[data-theme]:not([data-theme="dark"]) .tab-btn { color: var(--white-dim); }
[data-theme]:not([data-theme="dark"]) .tab-btn.active { color: var(--gold); border-bottom-color: var(--gold); }
[data-theme]:not([data-theme="dark"]) .tab-nav { border-bottom-color: var(--border); }
[data-theme]:not([data-theme="dark"]) thead th { color: var(--white-dim); border-bottom-color: var(--border); font-weight: 600; }
[data-theme]:not([data-theme="dark"]) tbody td { border-bottom-color: var(--white-faint); }
[data-theme]:not([data-theme="dark"]) tbody tr:hover { background: var(--white-faint); }
[data-theme]:not([data-theme="dark"]) .nav-item { color: var(--white-dim); }
[data-theme]:not([data-theme="dark"]) .nav-item:hover { color: var(--white); background: var(--white-faint); }
[data-theme]:not([data-theme="dark"]) .nav-item.active { color: var(--gold); border-left-color: var(--gold); background: var(--gold-dim); }
[data-theme]:not([data-theme="dark"]) .alert-error   { background: rgba(170,30,30,0.13);  border: 2px solid rgba(170,30,30,0.55);  color: #8c1414; font-weight: 600; }
[data-theme]:not([data-theme="dark"]) .alert-success  { background: rgba(20,100,35,0.13);  border: 2px solid rgba(20,100,35,0.55);  color: #145c22; font-weight: 600; }
[data-theme]:not([data-theme="dark"]) .alert-warning  { background: rgba(120,70,0,0.13);   border: 2px solid rgba(120,70,0,0.55);   color: #6b3c00; font-weight: 600; }
[data-theme]:not([data-theme="dark"]) .badge-pending   { background: var(--gold-dim); color: var(--gold); }
[data-theme]:not([data-theme="dark"]) .badge-approved  { background: rgba(35,90,35,0.12); color: #1d5c1d; }
[data-theme]:not([data-theme="dark"]) .badge-rejected  { background: rgba(160,40,40,0.12); color: #a02828; }
[data-theme]:not([data-theme="dark"]) .badge-expired   { background: var(--white-faint); color: var(--white-dim); }
[data-theme]:not([data-theme="dark"]) .badge-completed { background: rgba(35,90,35,0.12); color: #1d5c1d; }
[data-theme]:not([data-theme="dark"]) .badge-noshow    { background: rgba(150,90,0,0.12); color: #704800; }

/* Font ağırlığı / okunabilirlik */
[data-theme]:not([data-theme="dark"]) .form-label,
[data-theme]:not([data-theme="dark"]) .nav-section,
[data-theme]:not([data-theme="dark"]) .stat-label { font-weight: 600; color: var(--white-dim); }
[data-theme]:not([data-theme="dark"]) .page-title,
[data-theme]:not([data-theme="dark"]) .section-title,
[data-theme]:not([data-theme="dark"]) .modal-title { color: var(--white); font-weight: 500; }
[data-theme]:not([data-theme="dark"]) .page-subtitle,
[data-theme]:not([data-theme="dark"]) .section-sub { color: var(--white-dim); font-weight: 400; }

/* Karanlık tema: dekorasyon yok, orijinal stil */
[data-theme="dark"] body::before { display: none; }
[data-theme="dark"] body { font-weight: 300; background: var(--t-bg); color: var(--t-text); }

@media (max-width: 768px) {
  [data-theme]:not([data-theme="dark"]) .sidebar {
    background: rgba(255,255,255,0.95);
    backdrop-filter: blur(10px);
    border-top: 1px solid var(--border);
  }
}

/* ═══════════════════════════════════════════════════════════
   TEMA SEÇİCİ
   ═══════════════════════════════════════════════════════════ */

#kf-theme-picker {
  position: fixed !important;
  bottom: 1.25rem;
  right: 1.25rem;
  z-index: 99999 !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
}

#kf-theme-toggle {
  width: 44px; height: 44px;
  border-radius: 50%;
  background: var(--gold, #5B7E4A);
  color: #fff; border: none; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 3px 14px rgba(0,0,0,0.22);
  transition: transform 0.2s, box-shadow 0.2s;
  font-size: 19px; line-height: 1;
  -webkit-tap-highlight-color: transparent;
}
#kf-theme-toggle:hover { transform: scale(1.10); box-shadow: 0 5px 20px rgba(0,0,0,0.28); }
#kf-theme-toggle:active { transform: scale(0.96); }

#kf-theme-panel {
  display: none; flex-direction: column; gap: 7px;
  background: rgba(255,255,255,0.97);
  border: 1px solid rgba(0,0,0,0.12);
  border-radius: 14px; padding: 10px 8px;
  box-shadow: 0 6px 28px rgba(0,0,0,0.16);
  backdrop-filter: blur(12px);
  order: -1;
}
#kf-theme-panel.open { display: flex; }

.kf-theme-dot {
  width: 28px; height: 28px; border-radius: 50%;
  border: 2.5px solid transparent;
  cursor: pointer; outline: none; position: relative;
  transition: transform 0.15s, border-color 0.15s;
  -webkit-tap-highlight-color: transparent;
}
.kf-theme-dot:hover { transform: scale(1.18); }
.kf-theme-dot.active { border-color: rgba(0,0,0,0.42); box-shadow: 0 0 0 2px rgba(255,255,255,0.85) inset; }
.kf-theme-dot::after {
  content: attr(title);
  position: absolute; right: 36px; top: 50%; transform: translateY(-50%);
  background: rgba(0,0,0,0.78); color: #fff; font-size: 11px;
  padding: 3px 8px; border-radius: 6px; white-space: nowrap;
  pointer-events: none; opacity: 0; transition: opacity 0.15s;
}
.kf-theme-dot:hover::after { opacity: 1; }

@media (max-width: 768px) {
  #kf-theme-picker { bottom: 72px; right: 0.75rem; }
}