/* =============================================================================
   MIQNO — ORTAK KONTROLLER (dil + tema düğmesi)

   tf-sayfa.css yüklemeyen sayfalar için (giriş, kayıt, sipariş sorgula, …).
   Kendi tokenlarına bakmaz: her iki tasarım sisteminde de okunur olsun diye
   currentColor ve saydamlık üzerinden çalışır.
   ============================================================================= */

.tf-ortak-kontrol {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: 'Inter', system-ui, sans-serif;
}
/* Sayfa bir yuva sunmadıysa JS gövdeye ekler -> sağ üstte, akıştan bağımsız. */
.tf-ortak-kontrol--serbest {
  position: fixed; top: 14px; right: 16px; z-index: 40;
}

.tf-ortak-dil {
  display: inline-flex; align-items: center;
  border: 1px solid currentColor; border-radius: 999px;
  padding: 2px; opacity: .75;
}
.tf-ortak-dil button {
  appearance: none; border: 0; background: none; cursor: pointer;
  font: inherit; font-size: 11.5px; font-weight: 600; letter-spacing: .04em;
  color: inherit; padding: 3px 9px; border-radius: 999px; line-height: 1;
}
/* SEÇİLİ DİL — ölçüldü ve düzeltildi (24 Ağustos 2026).
   İlk hâli `background: currentColor` + `color: transparent` kullanıyordu:
   currentColor elemanın KENDİ color'ını okur, o da transparent yapılmıştı ->
   dolgu da metin de görünmez oldu (tarayıcıda ölçüldü: background
   rgba(0,0,0,0), color rgba(0,0,0,0) -> seçili düğme tamamen kayboldu).
   Artık nötr yarı saydam bir dolgu: hem koyu hem açık temada okunur ve
   hiçbir palet varsayımı yapmaz. */
.tf-ortak-dil button.on {
  background: rgba(128, 128, 128, .30);
  font-weight: 700;
}

.tf-ortak-tema {
  appearance: none; cursor: pointer; font: inherit; line-height: 1;
  width: 28px; height: 28px; border-radius: 999px;
  border: 1px solid currentColor; background: none; color: inherit;
  opacity: .75; font-size: 13px;
  display: inline-flex; align-items: center; justify-content: center;
}
.tf-ortak-dil:hover, .tf-ortak-tema:hover { opacity: 1; }
.tf-ortak-dil button:focus-visible,
.tf-ortak-tema:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }

/* Dar ekranda kontrol köşede yer kaplamasın. */
@media (max-width: 480px) {
  .tf-ortak-kontrol--serbest { top: 10px; right: 10px; gap: 6px; }
  .tf-ortak-tema { width: 26px; height: 26px; }
}
