/* Tasarım seçici: her temada aynı görünür, temalardan bağımsızdır */
.tswitch {
    position: relative; z-index: 120;
    display: flex; align-items: center; gap: 16px;
    min-height: 44px; padding: 6px max(16px, 2vw);
    background: #232624; color: #e8ebe7;
    font: 500 13px/1.2 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    view-transition-name: tswitch;
}
.tswitch-label { color: #a9b0ab; white-space: nowrap; }
.tswitch-list { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; }
.tswitch-list::-webkit-scrollbar { display: none; }
.tswitch-item {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 6px 12px 6px 8px; border-radius: 999px;
    color: #e8ebe7; text-decoration: none; white-space: nowrap;
    border: 1px solid rgba(232, 235, 231, .18);
    transition: background-color .15s, border-color .15s;
}
.tswitch-item:hover { border-color: rgba(232, 235, 231, .5); }
.tswitch-item[aria-current="true"] { background: #e8ebe7; color: #232624; border-color: #e8ebe7; }
.tswitch-item:focus-visible { outline: 2px solid #f0a640; outline-offset: 2px; }
.tswitch-sw { display: inline-flex; }
.tswitch-sw i { width: 12px; height: 12px; border-radius: 50%; border: 1px solid rgba(0, 0, 0, .25); }
.tswitch-sw i + i { margin-left: -4px; }
@media (max-width: 560px) { .tswitch-label { display: none; } }

/* Tasarım değiştirirken: yeni tasarım tıklanan noktadan daire olarak açılır */
html:active-view-transition-type(theme) body * { view-transition-name: none !important; }
@media (prefers-reduced-motion: no-preference) {
    html:active-view-transition-type(theme)::view-transition-old(root) {
        animation: tswitch-old 1.1s cubic-bezier(.7, 0, .2, 1) both;
    }
    html:active-view-transition-type(theme)::view-transition-new(root) {
        animation: tswitch-new 1.1s cubic-bezier(.7, 0, .2, 1) both;
    }
    @keyframes tswitch-old { to { transform: scale(.94); filter: brightness(.45) blur(2px); } }
    @keyframes tswitch-new {
        from { clip-path: circle(0 at var(--vt-x, 50%) var(--vt-y, 0)); }
        to   { clip-path: circle(150vmax at var(--vt-x, 50%) var(--vt-y, 0)); }
    }
}

/* Tam ekran menü açıkken sayfa kaymasın */
html.menu-open { overflow: hidden; }

@media (max-width: 960px), (pointer: coarse) {
    .tswitch-item { min-height: 40px; padding-top: 0; padding-bottom: 0; }
    .tswitch { min-height: 52px; }
}

/* ---------- Telefonda alt hızlı iletişim çubuğu ----------
   Renkler her tasarımın kendi --mbar-* değişkenlerinden gelir. */
.mbar { display: none; }
@media (max-width: 760px) {
    .mbar {
        position: fixed; left: 0; right: 0; bottom: 0; z-index: 150;
        display: flex; gap: 8px;
        padding: 8px 10px calc(8px + env(safe-area-inset-bottom, 0px));
        background: var(--mbar-bg, #1f3a32);
        box-shadow: 0 -6px 24px rgba(0, 0, 0, .18);
        font: 600 16px/1 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    }
    .mbar a {
        flex: 1; display: flex; align-items: center; justify-content: center; gap: 8px;
        min-height: 48px; border-radius: var(--mbar-radius, 6px);
        text-decoration: none; color: var(--mbar-fg, #fff);
        border: 1px solid var(--mbar-line, rgba(255, 255, 255, .3));
    }
    .mbar a:first-child { background: var(--mbar-accent, #c9a76f); color: var(--mbar-accent-fg, #17201d); border-color: transparent; }
    .mbar svg { width: 20px; height: 20px; }
    .mbar a:focus-visible { outline: 2px solid var(--mbar-fg, #fff); outline-offset: 2px; }
    body:has(.mbar) { padding-bottom: calc(68px + env(safe-area-inset-bottom, 0px)); }
    body:has(.mbar) .wa-float, body:has(.mbar) .m-wa { display: none; }
    html.menu-open .mbar, html.cv-open .mbar { display: none; }
    .mbar { view-transition-name: mbar; }
}

/* Büyütülmüş fotoğrafta yatay kaydırma tarayıcıya değil galeriye gitsin; iki parmakla yakınlaştırma açık kalsın */
.lightbox { touch-action: pinch-zoom; }