/* Theme Switch — pill toggle, 44px min hit, sync light/dark */
.theme-switch-wrapper{display:flex;align-items:center;gap:10px}
.theme-switch{
  position:relative;display:inline-block;
  width:54px;height:30px;flex-shrink:0;
  cursor:pointer;vertical-align:middle;
}
.theme-switch input{
  position:absolute;opacity:0;width:0;height:0;pointer-events:none;
}
.slider{
  position:absolute;inset:0;
  background:var(--bg-muted);
  border:1px solid var(--border);
  border-radius:999px;
  cursor:pointer;
  transition:background .22s ease,border-color .22s ease,box-shadow .22s ease;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 6px;
  box-shadow:inset 0 1px 2px rgba(15,23,42,.08);
}
[data-theme="dark"] .slider{
  background:#1E293B;border-color:#334155;
  box-shadow:inset 0 1px 3px rgba(0,0,0,.35);
}
.slider::before{
  content:"";
  position:absolute;left:3px;top:3px;
  width:22px;height:22px;border-radius:50%;
  background:#fff;
  box-shadow:0 2px 8px rgba(15,23,42,.18),0 1px 2px rgba(15,23,42,.12);
  transition:transform .28s cubic-bezier(.16,1,.3,1),background .22s ease,box-shadow .22s ease;
}
[data-theme="dark"] .slider::before{background:#F8FAFC}
input:checked + .slider{
  background:var(--primary);
  border-color:var(--primary);
  box-shadow:0 0 0 4px var(--primary-ring);
}
input:checked + .slider::before{transform:translateX(24px)}
input:focus-visible + .slider{box-shadow:0 0 0 4px var(--primary-ring);outline:2px solid var(--primary);outline-offset:2px}

/* icons inside slider */
.icon-sun,.icon-moon{
  position:relative;z-index:1;
  font-size:12px;line-height:1;
  transition:opacity .2s ease,transform .22s ease,color .22s ease;
  pointer-events:none;
}
.icon-sun{color:#D97706;opacity:.95}
.icon-moon{color:#64748B;opacity:.65}
input:checked + .slider .icon-sun{opacity:.25;color:#fff;transform:scale(.9)}
input:checked + .slider .icon-moon{opacity:1;color:#fff;transform:scale(1.05)}
input:not(:checked) + .slider .icon-sun{opacity:.3}
input:not(:checked) + .slider .icon-moon{opacity:1}

/* enlarged hit area — 44px */
.theme-switch::after{
  content:"";position:absolute;inset:-7px;border-radius:999px;
}