/* emirbalin/header görünümü (prototip/css/site.css "Header" + "Mesai / Mola" bölümleri).
   Davranış durumları (şeffaf/gizli/dolu) eb-temel/assets/css/header.css'te. */
.site-header__ic {
  display: flex; align-items: center; gap: var(--wp--preset--spacing--50);
  height: var(--wp--custom--header--yukseklik);
}

.marka {
  /* Mühür + ad (Tur 19). Mühür yüksekliği header kontrolleriyle aynı (2.50× taban), aralık ~1.07× taban
     (taban = kucuk-yukseklik / 2.5). */
  --marka-muhur-boy: var(--wp--custom--anahtar--kucuk-yukseklik);
  display: inline-flex; align-items: center; gap: calc(var(--marka-muhur-boy) * 1.07 / 2.5);
  color: inherit; text-decoration: none;
  font-family: var(--wp--preset--font-family--baslik); font-weight: var(--wp--custom--font-weight--baslik);
  font-size: 1.35rem; letter-spacing: var(--wp--custom--letter-spacing--baslik);
}
.marka:hover { color: inherit; }
.marka__muhur { flex: none; width: var(--marka-muhur-boy); height: var(--marka-muhur-boy); }
.marka__muhur-zemin { fill: var(--muhur-zemin, #19253b); }
.marka__muhur-harf { fill: var(--muhur-harf, #fbfaf7); }
.marka__muhur-nokta { fill: var(--muhur-nokta, #fc6999); }
/* Şeffaf ↔ opak geçişinde mühür, header'ın rengiyle aynı süre ve eğriyle döner (ani çevrilme yok); ilk boyamada
   durum değişmediği için geçiş çalışmaz. */
.marka__muhur-zemin, .marka__muhur-harf, .marka__muhur-nokta {
  transition: fill var(--wp--custom--duration--menu) var(--wp--custom--ease--standart);
}
/* Renkler ters döner (geometri aynı): koyu temada (data-tema ilk boyamadan önce erken.js ile yazılır) ve şeffaf header'da
   (hero fotoğrafı koyu; lacivert zemin kaybolurdu, kontrast <3:1). */
:root[data-tema="koyu"] .marka__muhur,
.site-header.is-seffaf:not(.menu-acik) .marka__muhur,
html.ust-basla .site-header:not(.menu-acik) .marka__muhur { --muhur-zemin: #fbfaf7; --muhur-harf: #19253b; --muhur-nokta: #df3664; }

/* 1024–1139 px: menü sütunu dar (1100–1125 px aralığında eski boyutla marka–menü binerdi, hinted ölçüm); ad yazısı küçülür ve aralık daralır (marka–menü ≥8 px, Tur 19). Mobil ve ≥1100 değişmez. */
@media (min-width: 1024px) and (max-width: 1139.98px) {
  .marka { gap: 0.5rem; font-size: 1.05rem; }
}

.ana-menu__liste { display: flex; list-style: none; }
.ana-menu__baglanti {
  position: relative;
  display: inline-flex; align-items: center; gap: 0.3em;
  padding: 0.6rem 0.8rem;
  border: 0; background: none; cursor: pointer;
  color: inherit; text-decoration: none;
  font-weight: 500; font-size: var(--wp--preset--font-size--s);
}
.ana-menu__baglanti:hover { color: inherit; }
/* Dokunma alanı hedefi 44×44 (Tur 11): ~41.7px yükseklik yalnızca dikeyde büyütülür (yatayda komşu öğeler
   bitişik, ::after alt çizgi için ayrılmış). */
.ana-menu__baglanti::before { content: ""; position: absolute; inset: -2px 0; }
.ana-menu__baglanti::after {
  content: ""; position: absolute; left: 0.8rem; right: 0.8rem; bottom: 0.3rem; height: 2px;
  border-radius: 2px; background: currentColor;
  transform: scaleX(0); transform-origin: left;
  transition: transform var(--wp--custom--duration--menu) var(--wp--custom--ease--cikis);
}
.ana-menu__baglanti:hover::after, .ana-menu__baglanti[aria-current="page"]::after { transform: scaleX(1); }
.ana-menu__baglanti[aria-current="page"]::after { background: var(--wp--preset--gradient--ana); height: 3px; }
.ana-menu__ok { width: 1em; height: 1em; transition: transform var(--wp--custom--duration--menu) var(--wp--custom--ease--cikis); }
.acik > .ana-menu__alt-dugme .ana-menu__ok { transform: rotate(180deg); }

.ana-menu__oge--alt { position: relative; }
.alt-menu {
  list-style: none;
  color: var(--wp--preset--color--metin);
}
.alt-menu__baglanti {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  padding: 0.7rem 0.9rem;
  border-radius: var(--wp--custom--radius--m);
  color: var(--wp--preset--color--metin); text-decoration: none;
  font-weight: 500; font-size: var(--wp--preset--font-size--s);
  transition: background-color var(--wp--custom--duration--kisa) var(--wp--custom--ease--standart);
}
a.alt-menu__baglanti:hover { background: var(--wp--preset--color--yuzey-2); color: var(--wp--preset--color--metin); }
.alt-menu__baglanti--pasif { color: var(--wp--preset--color--metin-soluk); cursor: default; }

.header-sag { display: flex; flex: none; align-items: center; gap: var(--wp--custom--anahtar--kucuk-aralik); margin-left: auto; }
/* Dil anahtarı, tema düğmesi ve Mesai / Mola ortak anahtar görünümünün küçük varyantındadır (anahtar--kucuk;
   eb-temel/assets/css/anahtar.css): yan yana, tek satır, görünür yükseklik 28.2 px (referans oranı, Tur 14d), tıklama
   alanı 44 px. Ölçüler her genişlikte aynı px değeridir (1024 altında menü görünmediği için oran tabanı 1440'tır).
   Tema düğmesi her genişlikte kompakt (tek hücre, ikon kayarak değişir). */

/* Tema düğmesi: ay ikonunun mürekkebi 24'lük kutunun 20'si, güneşinki 22'si; görünen boyları eşit olsun diye ay 22/20 büyür. */
.tema-dugmesi.anahtar--kucuk > .anahtar__secenek .tema-dugmesi__ay { width: calc(var(--wp--custom--anahtar--kucuk-ikon) * 1.1); height: calc(var(--wp--custom--anahtar--kucuk-ikon) * 1.1); }

/* CTA (header kopyası): kontrollerle aynı yükseklikte küçük hap; tıklama alanı görünmez ::before ile dikeyde 44 px. */
.dugme.header-sag__cta {
  --dugme-yukseklik: var(--wp--custom--anahtar--kucuk-yukseklik);
  position: relative; flex: none; padding: 0 0.95rem; font-size: var(--wp--custom--anahtar--kucuk-cta-yazi);
}
.header-sag__cta::before { content: ""; position: absolute; inset: calc((var(--wp--custom--anahtar--kucuk-yukseklik) - var(--wp--custom--anahtar--yukseklik)) / 2) 0; }

.menu-dugmesi__cizgiler { display: grid; gap: 5px; width: 20px; }
.menu-dugmesi__cizgiler span {
  display: block; height: 2px; border-radius: 2px; background: currentColor;
  transition: transform var(--wp--custom--duration--menu) var(--wp--custom--ease--cikis), opacity var(--wp--custom--duration--kisa);
}
.menu-dugmesi[aria-expanded="true"] .menu-dugmesi__cizgiler span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.menu-dugmesi[aria-expanded="true"] .menu-dugmesi__cizgiler span:nth-child(2) { opacity: 0; }
.menu-dugmesi[aria-expanded="true"] .menu-dugmesi__cizgiler span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* --- Mobil / tablet (<1024px): açılır panel --- */
@media (max-width: 1023.98px) {
  .header-sag__cta { display: none; }
  .ana-menu {
    position: absolute; inset: 100% 0 auto;
    max-height: calc(100svh - var(--wp--custom--header--yukseklik));
    overflow-y: auto;
    padding: var(--wp--preset--spacing--40) var(--wp--custom--layout--kenar) var(--wp--preset--spacing--60);
    background: var(--wp--preset--color--zemin);
    color: var(--wp--preset--color--metin);
    box-shadow: 0 24px 40px -24px rgb(12 20 36 / 0.45);
    opacity: 0; visibility: hidden; transform: translateY(-10px);
    transition: opacity var(--wp--custom--duration--menu) var(--wp--custom--ease--standart), transform var(--wp--custom--duration--menu) var(--wp--custom--ease--cikis), visibility 0s linear var(--wp--custom--duration--menu);
  }
  .menu-acik .ana-menu {
    opacity: 1; visibility: visible; transform: none;
    transition: opacity var(--wp--custom--duration--menu) var(--wp--custom--ease--standart), transform var(--wp--custom--duration--menu) var(--wp--custom--ease--cikis), visibility 0s;
  }
  .ana-menu__liste { flex-direction: column; }
  .ana-menu__liste > li { border-bottom: 1px solid var(--wp--preset--color--cizgi); }
  .ana-menu__baglanti {
    width: 100%; justify-content: space-between;
    padding: 0.95rem 0;
    font-family: var(--wp--preset--font-family--baslik); font-size: var(--wp--preset--font-size--l); font-weight: var(--wp--custom--font-weight--baslik-ince);
  }
  .ana-menu__baglanti::after { left: 0; right: auto; width: 2rem; bottom: 0.55rem; }
  .alt-menu {
    display: grid; grid-template-rows: repeat(var(--alt-sayi, 3), 0fr);
    visibility: hidden;
    transition: grid-template-rows var(--wp--custom--duration--menu) var(--wp--custom--ease--cikis), visibility 0s linear var(--wp--custom--duration--menu);
  }
  .alt-menu > li { overflow: hidden; min-height: 0; }
  .acik > .alt-menu {
    grid-template-rows: repeat(var(--alt-sayi, 3), 1fr); padding-bottom: 0.5rem; visibility: visible;
    transition: grid-template-rows var(--wp--custom--duration--menu) var(--wp--custom--ease--cikis), visibility 0s;
  }
  .alt-menu__baglanti { padding-left: 1rem; }
  .ana-menu__mobil-ek { margin-top: var(--wp--preset--spacing--50); }
  .ana-menu__mobil-ek .dugme { width: 100%; }
}
@media (max-width: 359.98px) { .anahtar.dil-secici { display: none; } }

/* --- Masaüstü (≥1024px): satır içi menü + açılır alt menü --- */
@media (min-width: 1024px) {
  .menu-dugmesi, .ana-menu__mobil-ek { display: none; }
  /* Üç sütunlu ızgara (Tur 14e): marka | menü | kontroller. Menünün konumu kontrollerin genişliğinden bağımsızdır:
     sağ sütun en az bir düzen ölçüsü kadardır (header.sag-sutun; TR/EN ayrı, Tur 14c/14d menü konumu korunur), içerik
     daha genişse (ör. CTA metni panelden uzarsa) sütun büyür, menü sola çekilir; kontrol grubu sütunun sağına yaslanır,
     kendisi sabit genişlik taşımaz. Menü orta sütunun sağına yaslanır; menü ile kontroller arasında en az sütun aralığı
     (spacing-50) kalır. CTA metni mevcut uzunluğun %25 fazlasını aşarsa 1024–1279 px'te menü markaya biner (Tur 14e). */
  .site-header__ic { display: grid; grid-template-columns: auto minmax(0, 1fr) minmax(calc(var(--wp--custom--header--sag-sutun) + var(--wp--preset--spacing--30)), max-content); }
  .site-header__ic:lang(en) { grid-template-columns: auto minmax(0, 1fr) minmax(calc(var(--wp--custom--header--sag-sutun-en) + var(--wp--preset--spacing--30)), max-content); }
  .ana-menu { justify-self: end; }
  .header-sag { justify-self: end; margin-left: 0; }
  .alt-menu {
    position: absolute; top: calc(100% + 0.35rem); left: -0.5rem;
    min-width: 17rem; padding: 0.45rem;
    background: var(--wp--preset--color--yuzey);
    border: 1px solid var(--wp--preset--color--cizgi);
    border-radius: var(--wp--custom--radius--l);
    box-shadow: var(--wp--preset--shadow--kart-hover);
    opacity: 0; visibility: hidden; transform: translateY(-6px) scale(0.98); transform-origin: top left;
    transition: opacity var(--wp--custom--duration--menu) var(--wp--custom--ease--standart), transform var(--wp--custom--duration--menu) var(--wp--custom--ease--cikis), visibility 0s linear var(--wp--custom--duration--menu);
  }
  .alt-menu::before { content: ""; position: absolute; inset: -0.6rem 0 auto; height: 0.6rem; }
  .acik > .alt-menu {
    opacity: 1; visibility: visible; transform: none;
    transition: opacity var(--wp--custom--duration--menu) var(--wp--custom--ease--standart), transform var(--wp--custom--duration--menu) var(--wp--custom--ease--cikis), visibility 0s;
  }
}

/* 1024–1099 px: satır içi menü + 3 anahtar + CTA sığmıyordu (CTA görünüm alanının 38–43 px dışında kalıyordu); menü
   öğelerinin yatay iç boşluğu daraltılır (alt çizgi aynı boşlukla hizalı). 1100 px ve üstü değişmedi. */
@media (min-width: 1024px) and (max-width: 1099.98px) {
  .ana-menu__baglanti { padding-inline: 0.45rem; }
  .ana-menu__baglanti::after { left: 0.45rem; right: 0.45rem; }
}

/* ---------- Mesai / Mola mod anahtarı (yer ayrıldı, pasif; görünüm: ortak .anahtar) ---------- */
.mod-anahtari { position: relative; }
.mod-anahtari--header { display: flex; flex: none; }
.anahtar.mod-anahtari__dugme { font-weight: 600; }
/* Header kopyası (Tur 14d, referans görünüm): hücreler içeriğe göre (Mesai dilimi geniş, Mola dar); seçili Mesai dilimi
   hafif dolgulu (yuzey-2, dekoratif) ve etiket metin renginde; durum yeşil noktayla (≥3:1) ve kalın etiketle taşınır.
   Başlık ızgarada ilk hücreye yerleşir (anahtar hiç ikinci seçeneğe geçmez: pasif). */
.mod-anahtari--header .anahtar--kucuk { grid-template-columns: auto auto; }
.mod-anahtari--header .anahtar--kucuk > .anahtar__secenek { padding: 0 calc(var(--wp--custom--anahtar--kucuk-yatay) + var(--wp--custom--anahtar--kucuk-ic-bosluk)); }
.mod-anahtari--header .anahtar--kucuk > .anahtar__secenek:nth-child(1) { grid-area: 1 / 1; color: var(--wp--preset--color--metin); }
.mod-anahtari--header .anahtar--kucuk > .anahtar__secenek:nth-child(2) { grid-area: 1 / 2; }
.mod-anahtari--header .anahtar--kucuk > .anahtar__baslik { position: relative; grid-area: 1 / 1; width: auto; background-color: var(--wp--preset--color--yuzey-2); }
/* Tur M2: Mola açıkken (aria-checked="true") başlık ikinci hücreye yerleşir; geçişi mod-anahtari.js canlandırır. */
.mod-anahtari--header .anahtar--kucuk[aria-checked="true"] > .anahtar__baslik { grid-area: 1 / 2; transform: none; }
.mod-anahtari__nokta { flex: none; width: var(--wp--custom--anahtar--kucuk-nokta); height: var(--wp--custom--anahtar--kucuk-nokta); border-radius: 50%; background: var(--wp--custom--durum--mesai); }
.mod-anahtari__ipucu {
  position: absolute; top: calc(100% + 0.4rem); left: 50%; transform: translate(-50%, -4px);
  padding: 0.4rem 0.7rem; border-radius: var(--wp--custom--radius--s); white-space: nowrap;
  background: var(--wp--preset--color--ters-zemin); color: var(--wp--preset--color--ters-metin); font-size: var(--wp--preset--font-size--xs); font-weight: 600;
  opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity var(--wp--custom--duration--menu) var(--wp--custom--ease--standart), transform var(--wp--custom--duration--menu) var(--wp--custom--ease--cikis), visibility 0s linear var(--wp--custom--duration--menu);
}
.mod-anahtari.ipucu-acik .mod-anahtari__ipucu { opacity: 1; visibility: visible; transform: translate(-50%, 0); transition-delay: 0s; }
.mod-anahtari--panel .mod-anahtari__ipucu { left: 0; transform: none; }
.mod-anahtari--panel { margin-bottom: var(--wp--preset--spacing--40); color: var(--wp--preset--color--metin); }
@media (max-width: 639.98px) { .mod-anahtari--header { display: none; } }
@media (min-width: 640px) { .mod-anahtari--panel { display: none; } }
