/* Koyu / açık tema anahtarı (site ve admin ortak) */
.theme-toggle {
  position: relative; flex: none; width: 60px; height: 32px; padding: 0; border-radius: 999px; cursor: pointer;
  border: 1px solid rgba(148, 170, 220, .28); background: #1b2742; overflow: hidden;
  transition: background .5s ease, border-color .5s ease, box-shadow .3s;
}
.theme-toggle:hover { box-shadow: 0 0 0 4px rgba(34, 211, 238, .14); }
.theme-toggle:focus-visible { outline: 2px solid #22d3ee; outline-offset: 2px; }

/* arka plandaki yıldızlar (koyu) / bulut (açık) */
.theme-toggle .tt-stars, .theme-toggle .tt-cloud { position: absolute; inset: 0; transition: opacity .5s ease, transform .6s cubic-bezier(.2, .7, .2, 1); }
.theme-toggle .tt-stars { opacity: 1; background:
  radial-gradient(1.5px 1.5px at 38px 9px, #fff, transparent),
  radial-gradient(1px 1px at 46px 20px, #cbd5e1, transparent),
  radial-gradient(1.5px 1.5px at 30px 22px, #e2e8f0, transparent),
  radial-gradient(1px 1px at 22px 8px, #fff, transparent); }
.theme-toggle .tt-cloud { opacity: 0; transform: translateY(14px); background:
  radial-gradient(9px 6px at 18px 22px, rgba(255, 255, 255, .95), transparent 70%),
  radial-gradient(7px 5px at 28px 24px, rgba(255, 255, 255, .85), transparent 70%); }

.theme-toggle .tt-knob {
  position: absolute; top: 3px; left: 3px; width: 24px; height: 24px; border-radius: 50%;
  display: grid; place-items: center; color: #04101f;
  background: linear-gradient(135deg, #e2e8f0, #94a3b8);
  box-shadow: 0 2px 8px rgba(0, 0, 0, .35);
  transition: transform .55s cubic-bezier(.68, -.4, .27, 1.4), background .5s ease;
}
.theme-toggle .tt-knob svg { position: absolute; width: 15px; height: 15px; transition: transform .6s cubic-bezier(.2, .7, .2, 1), opacity .35s ease; }
.theme-toggle .tt-moon { opacity: 1; transform: rotate(0) scale(1); }
.theme-toggle .tt-sun { opacity: 0; transform: rotate(-90deg) scale(.4); }

:root[data-theme="light"] .theme-toggle { background: linear-gradient(135deg, #7dd3fc, #38bdf8); border-color: rgba(255, 255, 255, .5); }
:root[data-theme="light"] .theme-toggle .tt-stars { opacity: 0; transform: translateY(-14px); }
:root[data-theme="light"] .theme-toggle .tt-cloud { opacity: 1; transform: none; }
:root[data-theme="light"] .theme-toggle .tt-knob { transform: translateX(28px); background: linear-gradient(135deg, #fde68a, #fbbf24); }
:root[data-theme="light"] .theme-toggle .tt-moon { opacity: 0; transform: rotate(90deg) scale(.4); }
:root[data-theme="light"] .theme-toggle .tt-sun { opacity: 1; transform: rotate(0) scale(1); }

@media (prefers-reduced-motion: reduce) {
  .theme-toggle, .theme-toggle * { transition: none !important; }
}
