/* =====================================================================
   FOREXHANE · çok dil bileşenleri (site.css'e ek; _dil/dil_uret.py'nin yönetilen bloklarıyla birlikte)
   - .dil-secici   üst menüde dil seçici (<details>)
   - .dil-altbilgi altbilgide dil satırı
   - .dil-oneri    "bu sayfa X dilinde de var" ince çubuğu (i18n.js çizer)
   - [data-dil="ceviri"] yalnız çeviri sayfalarında görünen notlar
   Renkler site.css'in değişkenlerinden; açık tema [data-theme="light"] ile kendiliğinden uyar.
   ===================================================================== */

/* yalnız çeviride görünen notlar: Türkçe sayfada hiç yer kaplamaz */
html[lang="tr"] [data-dil="ceviri"] { display: none !important; }
.dil-not {
  max-width: 64ch; margin: 14px 0 0; padding: 10px 14px;
  border-left: 2px solid var(--emerald); border-radius: 0 10px 10px 0;
  background: rgba(47, 181, 119, .07); color: var(--text-2); font-size: 13.5px; line-height: 1.55;
}
.legal-doc .dil-not { margin: -6px 0 26px; }
[data-theme="light"] .dil-not { background: rgba(28, 138, 90, .07); }

/* ---------- üst menü: dil seçici ---------- */
.dil-secici { position: relative; flex: none; }
.dil-dugme {
  list-style: none; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  height: 34px; padding: 0 10px 0 9px; border-radius: 999px;
  border: 1px solid var(--line-soft); background: rgba(138, 147, 166, .16); color: var(--text-2);
  font-family: var(--f-display); font-weight: 700; font-size: 12px; letter-spacing: .08em; line-height: 1;
  cursor: pointer; user-select: none; -webkit-user-select: none; white-space: nowrap;
  transition: border-color .25s, color .25s, background .25s;
}
.dil-dugme::-webkit-details-marker { display: none; }
.dil-dugme::marker { content: ""; }
.dil-dugme:hover, .dil-secici[open] > .dil-dugme { border-color: rgba(47, 181, 119, .45); color: var(--text); }
.dil-dugme:focus-visible { outline: 2px solid var(--emerald-l); outline-offset: 3px; }
.dil-dugme .dil-ic { width: 15px; height: 15px; flex: none; color: var(--emerald-l); }
.dil-dugme .dil-ok { width: 11px; height: 11px; flex: none; transition: transform .2s var(--ease); }
.dil-secici[open] > .dil-dugme .dil-ok { transform: rotate(180deg); }
.dil-liste {
  position: absolute; top: calc(100% + 8px); right: 0; z-index: 31; min-width: 188px;
  margin: 0; padding: 4px; list-style: none; border-radius: 10px;
  background: var(--night); border: 1px solid var(--line-soft);
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .3), 0 4px 6px -4px rgba(0, 0, 0, .3);
}
.dil-liste li { margin: 0; }
.dil-liste a {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  min-height: 40px; padding: 8px 10px; border-radius: 6px;
  color: var(--text); font-size: 14px; font-weight: 500; text-decoration: none; transition: background .18s, color .18s;
}
.dil-liste a:hover, .dil-liste a:focus-visible { background: rgba(255, 255, 255, .08); }
.dil-liste a:focus-visible { outline: 2px solid var(--emerald-l); outline-offset: -2px; }
.dil-liste a[aria-current="page"] { color: var(--emerald-l); font-weight: 700; }
.dil-liste a[aria-current="page"] .dil-liste-kod::before { content: "✓ "; }
.dil-liste-kod { font-family: var(--f-display); font-size: 11px; font-weight: 700; letter-spacing: .1em; color: var(--muted); }
[data-theme="light"] .dil-liste { background: #ffffff; border-color: rgba(0, 0, 0, .1); box-shadow: 0 18px 40px -22px rgba(0, 0, 0, .35); }
[data-theme="light"] .dil-liste a:hover, [data-theme="light"] .dil-liste a:focus-visible { background: rgba(0, 0, 0, .05); }
/* hamburger menü genişliğinde (≤1100 px): burger düğmesiyle aynı 44 px kutu */
@media (max-width: 1100px) {
  .dil-dugme { height: 44px; min-width: 44px; padding: 0 9px; gap: 4px; border-radius: 12px; border-color: var(--line); background: rgba(18, 23, 34, .7); font-size: 11.5px; }
  [data-theme="light"] .dil-dugme { background: var(--surface-2, rgba(255, 255, 255, .88)); }
  .dil-dugme .dil-ok { display: none; }
  .dil-dugme .dil-ic { width: 14px; height: 14px; }
  .dil-liste a { min-height: 44px; }
}
@media (max-width: 420px) {
  .dil-dugme { padding: 0 6px; gap: 3px; }
  .dil-dugme .dil-ic { width: 13px; height: 13px; }
}
/* 390 px altı (360/375 px telefonlar): üst çubukta logo + seçici + tema + menü sığmıyor; seçici menünün içine geçer */
.dil-menu { display: none; }
@media (max-width: 389px) {
  .nav .dil-secici { display: none; }
  .dil-menu { display: flex; flex-wrap: wrap; align-items: center; gap: 0 16px; padding: 14px 2px 0; font-size: 14px; }
  .dil-menu a { display: inline-flex; align-items: center; min-height: 44px; color: var(--text-2); }
  .dil-menu a[aria-current="page"] { color: var(--emerald-l); font-weight: 700; }
}
/* yasal sayfa üst çubuğu: "Ana sayfaya dön" düğmesi mobilde 38 px; çubuk yüksekliği değişmesin diye seçici de 38 px,
   dokunma alanı görünmez bir katmanla 44 px'e uzatılır */
@media (max-width: 600px) {
  .legal-top .dil-dugme { position: relative; height: 38px; min-width: 38px; }
  .legal-top .dil-dugme::after { content: ""; position: absolute; left: 0; right: 0; top: -3px; bottom: -3px; }
  /* yasal çubukta seçici sağ grubun BAŞINDA (≤480 px'te ikinci satırın solunda): liste sağa doğru açılır, ekranın sol
     kenarından taşmaz (390 px'te 24–36 px taşıyordu). Sağında her zaman tema düğmesi + "Ana sayfaya dön" var (≥188 px). */
  .legal-top .dil-liste { left: 0; right: auto; }
}
/* her genişlikte güvenlik payı: liste görünür alanın iki yanında en az 8 px boşluk bırakacak kadar daralabilir */
.dil-liste { max-width: calc(100vw - 16px); }

/* ---------- altbilgi: dil satırı ---------- */
.dil-altbilgi { display: flex; flex-wrap: wrap; align-items: center; gap: 0 18px; margin-top: 30px; font-size: 13px; }
.dil-altbilgi .dil-ic { width: 15px; height: 15px; flex: none; color: var(--muted); margin-right: -8px; }
.dil-altbilgi a { display: inline-flex; align-items: center; min-height: 32px; color: var(--text-2); text-decoration: none; transition: color .25s; }
.dil-altbilgi a:hover { color: var(--emerald-l); }
.dil-altbilgi a[aria-current="page"] { color: var(--text); font-weight: 600; text-decoration: underline; text-decoration-color: var(--emerald); text-underline-offset: 5px; }
.legal-doc .dil-altbilgi { margin-top: 40px; }
@media (max-width: 900px) { .dil-altbilgi a { min-height: 44px; } .dil-altbilgi { gap: 0 16px; } }

/* ---------- dil önerisi çubuğu (sayfanın üstünde; hiçbir şeyin üstünü örtmez, içeriği aşağı iter) ---------- */
html[data-dil-oneri] { --dil-oneri-h: 44px; scroll-padding-top: calc(90px + var(--dil-oneri-h)); }
html[data-dil-oneri] body { padding-top: var(--dil-oneri-h); }
html[data-dil-oneri] .nav { top: var(--dil-oneri-h); }
@media (max-width: 600px) { html[data-dil-oneri] { --dil-oneri-h: 60px; } }
.dil-oneri {
  position: fixed; top: 0; left: 0; right: 0; z-index: 55;
  background: #06080C; border-bottom: 1px solid rgba(47, 181, 119, .28); color: var(--text-2);
  font-size: 13.5px; line-height: 1.35;
}
.dil-oneri-ic {
  max-width: var(--wrap); margin: 0 auto; min-height: 43px; padding: 4px var(--gutter);
  display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 2px 10px;
}
.dil-oneri-ayr { color: var(--muted); }
.dil-oneri-a { display: inline-flex; align-items: center; min-height: 32px; color: var(--emerald-l); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.dil-oneri-a:hover { color: var(--text); }
.dil-oneri-k {
  flex: none; display: grid; place-items: center; width: 32px; height: 32px; margin-left: 4px;
  border: 0; border-radius: 8px; background: transparent; color: var(--muted); cursor: pointer; transition: color .2s, background .2s;
}
.dil-oneri-k:hover { color: var(--text); background: rgba(242, 242, 242, .07); }
.dil-oneri-k svg { width: 14px; height: 14px; }
.dil-oneri a:focus-visible, .dil-oneri-k:focus-visible { outline: 2px solid var(--emerald-l); outline-offset: 2px; }
[data-theme="light"] .dil-oneri { background: #F4F1EA; border-bottom-color: rgba(28, 138, 90, .3); }
[data-theme="light"] .dil-oneri-k:hover { background: rgba(0, 0, 0, .05); }
@media (max-width: 600px) {
  .dil-oneri { font-size: 12.5px; }
  .dil-oneri-ic { justify-content: flex-start; flex-wrap: nowrap; gap: 0 8px; min-height: 59px; padding-top: 4px; padding-bottom: 4px; }
  .dil-oneri-m { flex: 1 1 auto; min-width: 0; }
  .dil-oneri-ayr { display: none; }
  .dil-oneri-a { flex: none; min-height: 44px; max-width: 46%; text-align: right; }
  .dil-oneri-k { width: 44px; height: 44px; margin-left: 0; margin-right: -10px; }
}
@media (prefers-reduced-motion: reduce) { .dil-dugme, .dil-dugme .dil-ok, .dil-liste a, .dil-altbilgi a { transition: none; } }