/* Anahtar (toggle / switch) — PAYLASILAN macOS-stili ac/kapa anahtari.
   Tek-merkez: tum moduller `.mac-toggle` kullanir (onceden lookup.css'e gomuluydu).
   Animasyon: tiklama-aninda `.on` class'i client-side toggle edilir (etkilesim.js
   `.mac-toggle[data-anahtar]` delegasyonu) -> CSS transition oynar. Kalicilastirma
   cagiran ekranin isi (orn. ayni elemanda hx-post hx-swap="none"). Kilitli: `.locked`. */
.mac-toggle {
    position: relative;
    width: 38px;
    height: 22px;
    background: var(--border-strong);
    border: none;
    padding: 0;
    border-radius: 12px;
    cursor: pointer;
    transition: background 0.2s ease;
    flex-shrink: 0;
    display: inline-block;
    vertical-align: middle;
}
.mac-toggle::after {
    content: "";
    position: absolute;
    top: 2px;
    left: 2px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.18);
    transition: transform 0.2s ease;
}
.mac-toggle.on { background: var(--green); }
.mac-toggle.on::after { transform: translateX(16px); }
.mac-toggle.locked { opacity: 0.5; cursor: not-allowed; }

/* Knob koyu modda da acik kalir (dekoratif beyaz — kasitli) */
body[data-theme="dark"] .mac-toggle::after { background: #f0f0f2; }

/* ============================================================
   .mac-switch — FORM-ALANI anahtari (checkbox -> macOS switch).
   .mac-toggle buton-tabanli (deger gondermez, hx-post ile kalicilasir); bu ise
   gercek <input type=checkbox> sarmalar, deger form'da kalir (hx-include calisir)
   ve saf CSS :checked ile calisir (JS gerekmez). Tum true/false form/filtre
   alanlari bunu kullanir. Kullanim:
     <label class="mac-switch">
       <input type="checkbox" name="..." value="true" />
       <span class="mac-switch-yuva"></span>
       <span class="mac-switch-yazi">Etiket</span>   (opsiyonel)
     </label>
   NOT: input ile yuva BITISIK olmali (adjacent-sibling secici).
   ============================================================ */
.mac-switch { display: inline-flex; align-items: center; gap: 10px; cursor: pointer; user-select: none; }
.mac-switch > input[type="checkbox"] { position: absolute; opacity: 0; width: 0; height: 0; margin: 0; }
.mac-switch-yuva {
    position: relative;
    width: 38px;
    height: 22px;
    background: var(--border-strong);
    border-radius: 12px;
    transition: background 0.2s ease;
    flex-shrink: 0;
    display: inline-block;
}
.mac-switch-yuva::after {
    content: "";
    position: absolute;
    top: 2px;
    left: 2px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.18);
    transition: transform 0.2s ease;
}
.mac-switch > input:checked + .mac-switch-yuva { background: var(--green); }
.mac-switch > input:checked + .mac-switch-yuva::after { transform: translateX(16px); }
.mac-switch > input:focus-visible + .mac-switch-yuva { outline: 2px solid var(--mac-blue); outline-offset: 2px; }
.mac-switch > input:disabled + .mac-switch-yuva { opacity: 0.5; cursor: not-allowed; }
/* Kendini-savunan: host konteyneri (orn. .ku-alan label) buyuk harf/letter-spacing/agirlik
   dayatabilir; bilesen her yerde ayni gorunsun diye burada acikca sifirlanir. */
.mac-switch-yazi { font-size: 13px; color: var(--text); line-height: 1.25; font-weight: 500; text-transform: none; letter-spacing: 0; }
.mac-switch-yazi small { color: var(--muted); font-weight: 400; }
body[data-theme="dark"] .mac-switch-yuva::after { background: #f0f0f2; }