/* ===========================================================================
   D-MIND · Tema: "gold-light" — Altın Açık
   ---------------------------------------------------------------------------
   Krem zemin, lacivert başlıklar, turuncu ve altın vurgular.
   Navbar ve footer bu temada da KOYU kalır; bu yüzden o iki bölge için ayrı
   token'lar tanımlanmıştır (aksi hâlde açık metin token'ları koyu zemine
   düşer ve okunmaz olur).

   ERİŞİLEBİLİRLİK: Tüm metin/zemin ikilileri WCAG 2.1 AA'ya göre ölçülmüştür
   (normal metin 4.5:1, büyük başlık 3:1). Müşteri paletindeki bazı tonlar bu
   eşiği geçmediği için koyulaştırılmıştır; her biri aşağıda "AA DÜZELTMESİ"
   notuyla, ölçülen oranıyla birlikte belirtilmiştir.

   Bu dosya YALNIZCA [data-theme="gold-light"] kapsamında çalışır;
   dark-default temasına ve app.css'e ait hiçbir değer etkilenmez.
   =========================================================================== */

/* El yazısı slogan fontu. Yalnızca bu tema yüklendiğinde istenir; dark-default
   ziyaretçisi bu isteği hiç yapmaz.
   TÜRKÇE KAPSAM: Caveat'ın latin-ext alt kümesi U+0100-02BA aralığını kapsar;
   font dosyasının cmap tablosu okunarak ğ Ğ ş Ş ı İ ç Ç ö Ö ü Ü gliflerinin
   TAMAMININ mevcut olduğu doğrulandı.
   NOT: @import kuralı bu dosyadaki İLK kural olmak zorundadır. */
@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@600;700&display=swap');

[data-theme="gold-light"] {

  /* Tarayıcının yerel bileşenleri (kaydırma çubuğu, açılır liste) açık şemaya
     göre çizilsin. dark-default'a dokunulmaz. */
  color-scheme: light;

  /* ---------- Zeminler ---------- */

  --color-bg: #F4F1EA;                 /* krem sayfa zemini */
  --color-bg-alt: #ECE7DC;             /* ikincil zemin — yönetim paneli gövdesi */

  /* ---------- Yüzeyler ---------- */

  --color-surface: #FFFFFF;            /* kart, form alanı, sepet çekmecesi */
  --color-surface-alt: #FAF8F3;        /* panel yüzeyi — bg ile surface arası */
  --color-surface-hover: #F0EDE4;      /* kart üzerine gelme */

  /* ---------- Metin ----------
     Ölçüm zeminleri: bg #F4F1EA, bg-alt #ECE7DC, surface #FFFFFF,
     surface-alt #FAF8F3, surface-hover #F0EDE4, accent-soft #F3E3C2. */

  --color-text: #3A4356;               /* en düşük oran 7,83:1 */
  --color-heading: #1C2536;            /* koyu lacivert — en düşük 12,12:1 */
  --color-text-body: #454F63;          /* okuma metni — en düşük 6,50:1 */

  /* AA DÜZELTMESİ: müşteri paletindeki #6B7280 krem zeminde 4,29:1 kalıyordu
     (gereken 4,5). #58616F'e koyulaştırıldı → en düşük 4,94:1. */
  --color-text-muted: #58616F;

  --color-text-muted-2: #5D6573;       /* en düşük 4,64:1 */
  --color-text-subtle: #5F6775;        /* etiket/tablo başlığı — en düşük 4,50:1 */

  /* Yalnızca dekoratif kullanılıyor (anahtar topuzu); footer'daki metin kullanımı
     aşağıdaki bileşen katmanında ayrıca eziliyor. */
  --color-text-faint: #6E7787;

  /* ---------- Birincil eylem (ALTIN) ----------
     Bu tema turuncu yerine altın vurgu kullanır. Dolgu altın olduğu için üzerindeki
     metin KOYU olmak zorunda; beyaz metin altın üzerinde okunmaz.
     Koyu lacivert metin altın üzerinde 6,83:1, hover tonunda 5,52:1 — ikisi de
     normal metin eşiğini (4,5) rahatça geçer. */
  --color-primary: #D9A441;
  --color-primary-hover: #C8912F;
  --color-primary-text: #1C2536;

  /* EK TOKEN — hero başlığının vurgu satırındaki ALTIN.
     Müşteri altını #D9A441 krem zeminde yalnızca 1,99:1 verdiği için (büyük metin
     eşiği 3,0'ı bile geçmiyor) koyulaştırıldı: #A87C22 → 3,34:1. Bu, yerini aldığı
     turuncunun (3,31:1) okunabilirliğiyle birebir aynıdır. Yalnızca 40-86px /
     ağırlık 800 başlıkta kullanılır; küçük metinde KULLANILMAMALIDIR. */
  --color-heading-accent: #A87C22;

  /* ---------- Vurgu (altın / bronz) ----------
     AA DÜZELTMESİ: müşteri paletindeki altın #D9A441 krem zeminde metin olarak
     yalnızca 1,99:1 veriyor — okunamaz. Açık zeminde METİN/kenarlık olarak
     kullanılan vurgu bronza koyulaştırıldı → en düşük 4,62:1. */
  --color-accent: #845E13;
  --color-accent-hover: #674710;       /* en düşük 6,67:1 */

  /* EK TOKEN — müşterinin altını, DEĞİŞTİRİLMEDEN. Yalnızca KOYU navbar/footer
     üzerinde ve dolgu olarak kullanılır (randevu butonu, aktif menü alt çizgisi,
     footer başlıkları): koyu lacivert üzerinde 8,13:1. */
  --color-accent-bright: #D9A441;
  --color-accent-bright-hover: #C8912F;

  --color-accent-soft: #F3E3C2;        /* açık altın bilgi kutusu zemini */
  --color-accent-softer: #FAF3E4;
  --color-accent-selection: rgba(217, 164, 65, 0.38);

  /* ---------- Bağlantılar ----------
     EK TOKEN: app.css'te bağlantılar --color-accent kullanır; bu temada vurgu
     bronz olduğu için bağlantılar ayrı bir turuncu ton alır (istenen "linkler
     turuncu, hover koyu turuncu"). Krem zeminde 5,45:1 / hover 7,07:1. */
  --color-link: #AC3C1A;
  --color-link-hover: #8F3214;

  /* ---------- Kenarlıklar ---------- */

  --color-border: #E3DDD0;
  --color-border-soft: #EFEAE0;

  /* ---------- Durum renkleri ----------
     AA DÜZELTMESİ: #C0392B, bg-alt (4,41:1) ve açık altın kutu zemininde
     (4,29:1) eşiği geçmiyordu; #A93226'ya koyulaştırıldı → en düşük 5,21:1. */
  --color-danger: #A93226;
  --color-danger-text: #9C2D22;        /* en düşük 5,90:1 */
  --color-danger-soft: #F7E4E1;

  /* Uyarı / dikkat (engellemeyen bilgilendirme). Açık zeminde sarı okunmadığı için
     metin tonu kehribara koyulaştırıldı; kutu zemini açık sarı kalır. */
  --color-warning: #B8860B;
  --color-warning-text: #6B4A05;       /* en düşük 7,11:1 (uyarı kutusu zemininde) */
  --color-warning-soft: #FBF0D6;

  /* ---------- Etkileşim dışı ---------- */

  --color-disabled-bg: #E3DDD0;

  /* ---------- Gölge ve karartma ---------- */

  --color-shadow: rgba(28, 37, 54, 0.10);
  --color-overlay: rgba(28, 37, 54, 0.55);
  --color-overlay-strong: rgba(28, 37, 54, 0.62);
  --color-overlay-soft: rgba(28, 37, 54, 0.45);

  /* ---------- Üst menü (bu temada da KOYU) ---------- */

  --color-navbar-bg: #10151F;
  --color-navbar-text: #F5F2EA;        /* 16,34:1 */
  --color-navbar-text-active: #D9A441; /* 8,13:1 */
  --color-navbar-brand: #F5F2EA;
  /* EK TOKEN — koyu navbar içindeki ayırıcı çizgiler. Açık --color-border
     koyu zeminde parlak bir şerit oluşturduğu için ayrı tutuldu. */
  --color-navbar-border: #232C3C;

  /* ---------- Alt bilgi (bu temada da KOYU) ---------- */

  --color-footer-bg: #10151F;
  /* EK TOKEN'LAR — footer koyu olduğu için açık zemin metin token'ları burada
     kullanılamaz; bileşen katmanında bunlarla eziliyor. */
  --color-footer-text: #C3C8D2;        /* 10,89:1 */
  --color-footer-faint: #9AA1AF;       /* 7,04:1 */

  /* ---------- Odak ---------- */

  --color-focus: #AC3C1A;              /* krem zeminde 5,45:1 */

  /* ---------- Sabit marka renkleri ---------- */

  --color-whatsapp: #1FA855;
  --color-whatsapp-text: #ffffff;

  /* ---------- Gradyanlar ----------
     Hero paneli (kavisli zemin, görsel, istatistik kartı) Faz 6'nın konusu;
     çakışmamak için bu fazda gradyan tanımlanmadı. */
  --gradient-hero: none;

  /* ---------- Tipografi ---------- */

  --font-body: Archivo, system-ui, sans-serif;
  --font-heading: Archivo;
  /* El yazısı yığını. Caveat dosyanın başındaki @import ile yüklenir; yüklenemezse
     sistemdeki el yazısı fontlarına, hiçbiri yoksa genel cursive'e düşer. */
  --font-script: Caveat, "Segoe Script", "Brush Script MT", cursive;
}

/* ===========================================================================
   BİLEŞEN KATMANI — yalnızca gold-light
   ---------------------------------------------------------------------------
   app.css tek bir token setiyle çalışacak şekilde yazıldı ve koyu temayı
   varsayıyor. Açık zemin + koyu navbar/footer birleşimi bazı bileşenlerde
   token anlamını tersine çevirdiği için aşağıdaki kurallar gerekiyor.
   Seçicilerin tümü [data-theme="gold-light"] ile başlar; başka tema etkilenmez.
   =========================================================================== */

/* ---------- Tema değiştirici — bu temanın kendi durumu ---------- */
[data-theme="gold-light"] .theme-chip[data-theme-id="gold-light"] {
  opacity: 1;
  transform: scale(1);
  box-shadow: inset 0 0 0 1px rgba(128, 128, 128, 0.45), 0 0 0 2px var(--color-accent-bright);
}
[data-theme="gold-light"] .theme-switch-tip[data-theme-id="gold-light"] { display: none; }
/* Anahtar koyu navbar üzerinde durur: kenarlık ve ipucu ona göre ayarlanır. */
[data-theme="gold-light"] .theme-switch { border-color: var(--color-navbar-border); }
[data-theme="gold-light"] .theme-switch:hover { border-color: var(--color-accent-bright); }
[data-theme="gold-light"] .theme-switch-tip {
  background: var(--color-navbar-bg);
  color: var(--color-navbar-text);
  border-color: var(--color-navbar-border);
}
[data-theme="gold-light"] .mobile-theme-switch { color: var(--color-navbar-text); }

/* ---------- Bağlantılar ----------
   :where() ile özgüllük sıfırlanıyor: böylece kural yalnızca "çıplak" <a>
   etiketlerini boyar, kendi rengini belirleyen bileşenleri (.post-card,
   .wa-float, .main-nav a …) EZMEZ. */
[data-theme="gold-light"] :where(a) { color: var(--color-link); }
[data-theme="gold-light"] :where(a):hover { color: var(--color-link-hover); }

/* ---------- Üst menü: koyu zemin, açık metin ---------- */
[data-theme="gold-light"] .site-header { border-bottom-color: var(--color-navbar-border); }
[data-theme="gold-light"] .brand { color: var(--color-navbar-text); }

/* NOT: Aktif menü alt çizgisi ve buton okları artık app.css'te — her iki temada
   da geçerli oldukları için ortak katmana taşındılar. */

/* Sepet butonu ve mobil menü açma butonu koyu navbar üzerinde:
   app.css bunlara açık zemin metin rengini verirdi (koyu üstünde koyu). */
[data-theme="gold-light"] .cart-btn {
  border-color: var(--color-navbar-border);
  color: var(--color-navbar-text);
}
[data-theme="gold-light"] .cart-btn:hover {
  border-color: var(--color-accent-bright);
  color: var(--color-accent-bright);
}
[data-theme="gold-light"] .nav-toggle {
  background: transparent;
  border-color: var(--color-navbar-border);
  color: var(--color-navbar-text);
}

/* "RANDEVU AL": pill form. Renkleri artık --color-primary ailesinden geliyor
   (altın dolgu + koyu metin) — ayrıca ezmeye gerek yok. */
[data-theme="gold-light"] .header-cta { border-radius: 999px; }

/* Mobil menü paneli koyu navbar'ın devamıdır. */
[data-theme="gold-light"] .mobile-nav {
  background: var(--color-navbar-border);
  border-top-color: var(--color-navbar-border);
}
[data-theme="gold-light"] .mobile-nav a,
[data-theme="gold-light"] .mobile-nav button {
  background: var(--color-navbar-bg);
  color: var(--color-navbar-text);
}
[data-theme="gold-light"] .mobile-nav a.active { color: var(--color-navbar-text-active); }
[data-theme="gold-light"] .mobile-nav button { color: var(--color-accent-bright); }

/* ---------- Butonlar ---------- */

/* Birincil (ÜCRETSİZ ÖN GÖRÜŞME): turuncu dolgu, beyaz metin, hafif yuvarlak köşe.
   NOT: mevcut işaretlemede takvim ikonu yok; olsaydı korunurdu — bu kural
   yalnızca renk ve köşe yarıçapına dokunur, içeriğe dokunmaz. */
[data-theme="gold-light"] .btn-primary { border-radius: var(--radius-lg); }

/* İkincil (HİZMETLERİ İNCELE): beyaz zemin, ince koyu kenarlık, koyu metin.
   (Ok app.css'te ortak.) Kenarlık 2px→1px indiği için dolgu 13px→14px alınarak
   buton yüksekliği birincil butonla aynı tutuldu. */
[data-theme="gold-light"] .btn-outline {
  background: var(--color-surface);
  color: var(--color-heading);
  border: 1px solid var(--color-heading);
  border-radius: var(--radius-lg);
  padding: 14px 24px;
}
[data-theme="gold-light"] .btn-outline:hover {
  background: var(--color-heading);
  color: var(--color-surface);
  border-color: var(--color-heading);
}

/* ---------- "Petek Süreç" varyantının renk token'ları ----------
   Bu varyantın paleti diğerlerinden ayrıdır: panel koyu YEŞİL, altıgenler krem
   dolgulu ve altın çerçevelidir. Değerler HeroRegistry'deki slot varsayılanlarıyla
   BİREBİR aynı olmalıdır — panel "varsayılan" rozetinde ve "Varsayılana Dön"de
   bunları gösterir.
   Özgüllük (0,3,0); panelden gelen override aynı özgüllükte ama <head>'de
   stil bloğu olarak SONRA basıldığı için onu ezer. */
[data-theme="gold-light"] .hero[data-hero="honeycomb"] {
  --hero-panel-bg: #1E2A23;    /* koyu yeşil panel */
  --hero-hex-accent: #D9A441;  /* altıgen çerçevesi ve ikon */
  --hero-hex-fill: #FFFDF6;    /* altıgen dolgusu */
  --hero-badge-bg: #151C17;    /* numara rozeti zemini */
  --hero-ring: #C9A24B;        /* halka çizgisi ve oklar */
  --hero-accent: #D9A441;      /* nokta ızgarası + el yazısı slogan */
  /* Altıgenin İÇİ her temada krem olduğu için metin renkleri de sabittir. */
  --hero-hex-title: #1C2536;   /* krem üzerinde 12,4:1 */
  --hero-hex-text: #58616F;    /* krem üzerinde 5,9:1 */
}

/* ---------- Hero renk token'ları ----------
   Bu temada hero'nun bazı renkleri site genelindekinden AYRILIR. Renk doğrudan
   `.hero h1 { color: … }` gibi yazılmaz; hero token'ı yeniden bağlanır. Böylece
   panelden yapılan override (aynı token'ı ezer) burayı da geçerli olarak ezebilir.
   Yeniden bağlanmayan token'lar app.css'teki varsayılanlarında kalır. */
[data-theme="gold-light"] .hero {
  /* Vurgu satırı altın (büyük metin, 3,34:1 ≥ 3,0). */
  --hero-heading-accent: var(--color-heading-accent);
  /* İkincil buton bu temada koyu lacivert çerçeveli. */
  --hero-outline: var(--color-heading);
  /* Başlık dekorundaki nokta: parlak altın (bronz vurgudan ayrı). */
  --hero-heading-dot: var(--color-accent-bright);
}

/* Başlığın altında kısa yatay çizgi + altın nokta. Dekor da hero token'ını
   izler ki başlık vurgusu değiştirildiğinde onunla birlikte değişsin. */
[data-theme="gold-light"] .hero h1::after {
  content: "";
  display: block;
  margin-top: 28px;
  width: 92px;
  height: 10px;
  background:
    linear-gradient(var(--hero-heading-accent), var(--hero-heading-accent)) 0 50% / 56px 3px no-repeat,
    radial-gradient(circle at 84px 50%, var(--hero-heading-dot) 0 5px, transparent 5px);
}

/* ---------- Üst etiket (eyebrow): bronz, harf aralıklı ---------- */
[data-theme="gold-light"] .eyebrow {
  color: var(--color-accent);
  letter-spacing: 0.18em;
  font-weight: 600;
}

/* ---------- Alt bilgi: koyu zemin, açık metin ----------
   app.css footer metinlerine açık zemin token'larını verir; koyu footer'da
   bunlar okunmaz olurdu. */
[data-theme="gold-light"] .site-footer { border-top-color: var(--color-navbar-border); }
[data-theme="gold-light"] .foot-h { color: var(--color-accent-bright); }
[data-theme="gold-light"] .foot-links a { color: var(--color-footer-text); }
[data-theme="gold-light"] .foot-links a:hover { color: var(--color-accent-bright); }
[data-theme="gold-light"] .foot-bottom p { color: var(--color-footer-faint); }
[data-theme="gold-light"] .foot-bottom a { color: var(--color-footer-faint); }
[data-theme="gold-light"] .foot-bottom a:hover { color: var(--color-accent-bright); }
/* Footer içindeki bülten girdisi koyu zemine oturur. */
[data-theme="gold-light"] .site-footer .input {
  background: var(--color-navbar-border);
  border-color: var(--color-navbar-border);
  color: var(--color-navbar-text);
}
[data-theme="gold-light"] .site-footer .input:focus { border-color: var(--color-accent-bright); }

/* ---------- Kartlar / blog listesi ----------
   Açık zeminde 2px'lik kenarlıklar tek başına yeterli ayrım vermiyor; kartlara
   paletteki --color-shadow ile çok hafif bir derinlik ekleniyor. */
[data-theme="gold-light"] .tiles,
[data-theme="gold-light"] .tbl-wrap,
[data-theme="gold-light"] .panel {
  box-shadow: 0 1px 3px var(--color-shadow);
}
[data-theme="gold-light"] .post-card:hover { border-color: var(--color-primary); }

/* ===========================================================================
   HERO ve İSTATİSTİK KARTI — yalnızca RENKLER
   ---------------------------------------------------------------------------
   Düzen/geometri app.css'te tema-nötr olarak durur. Burada sadece bu temanın
   renkleri ve panel görseli tanımlanır.
   =========================================================================== */

[data-theme="gold-light"] {
  /* Panel bu temada KOYU kalır — krem sayfa üzerinde güçlü bir kontrast bloğu. */
  --hero-panel-bg: #10151F;

  /* USTA dosya: img/brain.png (şeffaf, 2400x1350, 2,27 MB) — düzenleme gerekirse
     ondan yeniden dışa aktarılır. Kullanılan img/brain-hero.jpg içeriğe kırpılmış,
     900px'e küçültülmüş ve zemini PANEL RENGİNE (#10151F) gömülmüş sürümdür:
     2,27 MB yerine 181 KB.
     PANEL RENGİ DEĞİŞİRSE GÖRSEL YENİDEN ÜRETİLMELİDİR. */
  --hero-brain-image: url("../../img/brain-hero.jpg");

  /* Nokta, kıvılcım, slogan ve rozet vurgusu — koyu panel üzerinde parlak altın. */
  --hero-accent: var(--color-accent-bright);

  /* İstatistik kartı: beyaz kart, koyu lacivert çip, altın vurgu çizgisi.
     Çizgi için parlak altın değil, başlıkla aynı koyu altın kullanılıyor —
     beyaz kart üzerinde parlak altın seçilmiyor. */
  --stat-chip-bg: var(--color-heading);
  --stat-chip-fg: var(--color-accent-bright);
  --stat-underline-color: var(--color-heading-accent);
}