/* Ortak tasarım katmanı: tüm sayfalarda (tanıtım sitesi, panel, süper admin) EN SON yüklenir.
   Bölümler: 1) Karanlık tema  2) Tema düğmesi  3) Erişilebilirlik  4) Ortak bileşenler (iskelet, boş durum, toast) */

/* ───────── 1) KARANLIK TEMA ───────── */
@media screen {
  html[data-theme="dark"] {
    color-scheme: dark;

    /* app.css */
    --bg-gradient: linear-gradient(135deg, #0b1020 0%, #0e1730 45%, #0a0f1d 100%);
    --card-bg: rgba(22, 28, 42, .94);
    --border-soft: #27303b;
    --text-main: #e6ecf5;
    --text-muted: #9aa8bf;
    --primary-soft: #1a2a47;
    --accent-soft: #3a2412;

    /* site.css + superadmin.css */
    --bg: #0b1020;
    --card: #161b25;
    --ink: #e6ecf5;
    --ink-soft: #9aa8bf;
    --border: #27303b;
    --shadow: 0 10px 34px rgba(0, 0, 0, .35);
    --shadow-lg: 0 24px 60px rgba(0, 0, 0, .5);

    /* Marka lacivertinin YAZI olarak kullanıldığı yerler (düğme/arka plan lacivert kalır) */
    --t-lacivert: #a9c3f0;
    --t-lacivert-koyu: #c2d4f5;
    --t-lacivert-acik: #8fb2ee;
    --t-blue-dark: #a9c3f0;
    --t-blue: #8fb2ee;
    --t-primary-blue: #8fb2ee;
  }

  html[data-theme="dark"] body {
    background: #0b1020;
    color: var(--text-main, #e6ecf5);
  }

  /* Form alanları */
  html[data-theme="dark"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
  html[data-theme="dark"] select,
  html[data-theme="dark"] textarea,
  html[data-theme="dark"] .form-control,
  html[data-theme="dark"] .form-select {
    background-color: #111827;
    color: #e6ecf5;
    border-color: #2d3748;
  }
  html[data-theme="dark"] input::placeholder,
  html[data-theme="dark"] textarea::placeholder { color: #6b7a94; }
  html[data-theme="dark"] select option { background: #111827; color: #e6ecf5; }
  html[data-theme="dark"] input:-webkit-autofill {
    -webkit-text-fill-color: #e6ecf5;
    box-shadow: 0 0 0 1000px #111827 inset;
  }

  /* Tablolar, modallar, açılır menüler (Bootstrap + özel) */
  html[data-theme="dark"] .table { --bs-table-color: #dbe4f2; --bs-table-bg: transparent; --bs-table-striped-bg: rgba(255,255,255,.03); --bs-table-hover-bg: rgba(255,255,255,.05); --bs-table-border-color: #27303b; }
  html[data-theme="dark"] .modal-content,
  html[data-theme="dark"] .dropdown-menu { background-color: #161b25; color: #e6ecf5; border-color: #27303b; }
  html[data-theme="dark"] hr { border-color: #27303b; opacity: 1; }
  html[data-theme="dark"] .text-muted { color: #9aa8bf !important; }
  html[data-theme="dark"] .bg-white,
  html[data-theme="dark"] .bg-light { background-color: #161b25 !important; }
  html[data-theme="dark"] .text-dark { color: #e6ecf5 !important; }
  html[data-theme="dark"] .btn-close { filter: invert(1) grayscale(1) brightness(1.6); }

  /* Panel özet rakamları: kart rengi tanımlı değilse varsayılan mavi koyu zeminde okunmuyordu */
  html[data-theme="dark"] .summary-card .summary-value { color: var(--kart-renk, #8fb2ee); }

  /* HTML'e doğrudan yazılmış (satır içi) açık arka planlar */
  html[data-theme="dark"] [style*="background:#fff" i],
  html[data-theme="dark"] [style*="background: #fff" i] { background-color: #161b25 !important; }
  html[data-theme="dark"] [style*="background:#F6F8FC" i],
  html[data-theme="dark"] [style*="background: #F6F8FC" i] { background-color: #111827 !important; }

  /* Görseller: logolar/ekran görüntüleri parlamasın */
  html[data-theme="dark"] img:not([src$=".svg"]):not(.tema-koru) { filter: brightness(.9) contrast(1.02); }
  html[data-theme="dark"] .brand-mark rect[fill="#16366B"] { fill: #7fa3e0; }
  html[data-theme="dark"] ::-webkit-scrollbar-thumb { background: #2d3748; border-radius: 8px; }
  html[data-theme="dark"] ::-webkit-scrollbar-track { background: #0b1020; }
  html[data-theme="dark"] ::selection { background: rgba(242, 118, 28, .45); color: #fff; }

  /* Tema değişirken yumuşak geçiş (yalnızca değişim anında) */
  html.tema-gecis, html.tema-gecis *, html.tema-gecis *::before, html.tema-gecis *::after {
    transition: background-color .3s ease, color .3s ease, border-color .3s ease, fill .3s ease !important;
  }
}

/* ───────── 2) TEMA DÜĞMESİ ───────── */
.tema-dugme {
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer; position: relative; overflow: hidden;
}
.tema-dugme svg { transition: transform .35s cubic-bezier(.2, .8, .3, 1), opacity .25s ease; }
.tema-dugme .tema-gunes { position: absolute; opacity: 0; transform: rotate(-70deg) scale(.5); }
html[data-theme="dark"] .tema-dugme .tema-ay { opacity: 0; transform: rotate(70deg) scale(.5); }
html[data-theme="dark"] .tema-dugme .tema-gunes { opacity: 1; transform: none; }

.tema-site {
  width: 38px; height: 38px; border-radius: 12px; margin: 0 8px;
  border: 1px solid var(--border, #E4EAF3); background: transparent;
  color: var(--t-lacivert, var(--lacivert, #16366B));
}
.tema-site:hover { background: rgba(43, 91, 168, .1); }

.tema-yuzen {
  position: fixed; left: 14px; bottom: 14px; z-index: 900;
  width: 42px; height: 42px; border-radius: 50%;
  border: 1px solid var(--border, #E4EAF3); background: var(--card, #fff);
  color: var(--t-lacivert, #16366B); box-shadow: 0 6px 20px rgba(19, 35, 57, .18);
}
@media (max-width: 767px) {
  .tema-yuzen { bottom: 78px; left: 10px; width: 38px; height: 38px; } /* alt sekme çubuğunun üstünde */
}
@media print { .tema-dugme { display: none !important; } }

/* ───────── 3) ERİŞİLEBİLİRLİK ───────── */
:focus-visible {
  outline: 3px solid rgba(242, 118, 28, .75);
  outline-offset: 2px;
  border-radius: 6px;
}
input:focus-visible, select:focus-visible, textarea:focus-visible { outline-offset: 0; }
.atla-baglanti {
  position: absolute; left: 12px; top: -60px; z-index: 2000;
  background: #16366B; color: #fff; padding: 10px 16px; border-radius: 10px; font-weight: 700;
  transition: top .2s ease;
}
.atla-baglanti:focus { top: 12px; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important; animation-iteration-count: 1 !important;
    transition-duration: .01ms !important; scroll-behavior: auto !important;
  }
}

/* ───────── 3b) DÜZEN İYİLEŞTİRMELERİ ───────── */
/* Dokunmatik ekranlarda hedefler en az ~44px olsun */
@media (pointer: coarse) {
  .ust-ikon, .tema-site, .btn-sm { min-height: 40px; }
  .ust-ikon { min-width: 40px; }
}

/* ───────── 4) ORTAK BİLEŞENLER ───────── */
/* Yüklenen içerik yer tutucusu (iskelet) */
.iskelet {
  position: relative; overflow: hidden; border-radius: 10px;
  background: rgba(100, 116, 139, .16); min-height: 14px;
}
.iskelet::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .45), transparent);
  transform: translateX(-100%); animation: iskelet-akis 1.3s infinite;
}
html[data-theme="dark"] .iskelet::after { background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .07), transparent); }
@keyframes iskelet-akis { to { transform: translateX(100%); } }
.iskelet-satir { height: 14px; margin: 10px 0; }
.iskelet-baslik { height: 22px; width: 45%; margin: 6px 0 14px; }
.iskelet-kart { height: 96px; border-radius: 16px; }

/* Boş durum */
.bos-durum {
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  text-align: center; padding: 34px 18px; color: var(--text-muted, var(--ink-soft, #64748B));
}
.bos-durum .bos-ikon {
  width: 64px; height: 64px; border-radius: 20px; display: grid; place-items: center; font-size: 28px;
  background: var(--primary-soft, #E3ECF9); color: var(--t-primary-blue, var(--primary-blue, #2B5BA8));
}
.bos-durum strong { color: var(--text-main, var(--ink, #132339)); font-size: 16px; }
.bos-durum p { margin: 0; max-width: 360px; font-size: 14px; line-height: 1.5; }

/* Bildirim (toast) */
.tx-toast-alan {
  position: fixed; z-index: 3000; right: 16px; top: 78px;
  display: flex; flex-direction: column; gap: 10px; width: min(380px, calc(100vw - 32px));
  pointer-events: none;
}
.tx-toast {
  pointer-events: auto; display: flex; gap: 12px; align-items: flex-start;
  padding: 14px 16px; border-radius: 14px; font-size: 14px; line-height: 1.45; font-weight: 600;
  background: #132339; color: #fff; box-shadow: 0 14px 40px rgba(0, 0, 0, .28);
  border-left: 5px solid #2B5BA8; animation: tx-toast-gir .28s cubic-bezier(.2, .8, .3, 1);
}
.tx-toast.basari { border-left-color: #16a34a; }
.tx-toast.hata   { border-left-color: #dc2626; }
.tx-toast.uyari  { border-left-color: #F2761C; }
.tx-toast button { margin-left: auto; background: none; border: 0; color: inherit; opacity: .7; cursor: pointer; font-size: 18px; line-height: 1; padding: 0 2px; }
.tx-toast button:hover { opacity: 1; }
.tx-toast.cikiyor { opacity: 0; transform: translateY(-8px); transition: opacity .25s ease, transform .25s ease; }
@keyframes tx-toast-gir { from { opacity: 0; transform: translateY(-10px) scale(.98); } to { opacity: 1; transform: none; } }
@media (max-width: 767px) { .tx-toast-alan { right: 12px; left: 12px; top: 68px; width: auto; } }
