/*
 * Continuum shared Light / Dark segmented switch.
 *
 * Reference behavior: /doc, /checkin and /spaces.
 * This file standardizes the current maintained Continuum surfaces without
 * changing each surface's actual palette or theme persistence logic.
 */

:is(.continuum-theme-toggle,#themeToggle,[data-v3-theme]){
  position:relative!important;
  display:inline-block!important;
  flex:0 0 auto!important;
  width:108px!important;
  min-width:108px!important;
  height:42px!important;
  min-height:42px!important;
  padding:3px!important;
  overflow:hidden!important;
  border:1px solid rgba(121,165,220,.28)!important;
  border-radius:999px!important;
  background:rgba(10,15,22,.92)!important;
  box-shadow:0 7px 20px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.035)!important;
  color:transparent!important;
  font-size:0!important;
  line-height:1!important;
  cursor:pointer!important;
  vertical-align:middle;
}

:is(.continuum-theme-toggle,#themeToggle,[data-v3-theme])>*{
  display:none!important;
}

:is(.continuum-theme-toggle,#themeToggle,[data-v3-theme])::before{
  content:"";
  position:absolute;
  z-index:1;
  top:3px;
  left:3px;
  width:calc(50% - 3px);
  height:34px;
  border-radius:999px;
  background:linear-gradient(135deg,#17304f,#294f7c);
  box-shadow:0 4px 14px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.08);
  transform:translateX(0);
  transition:transform 200ms ease,background 200ms ease,box-shadow 200ms ease;
}

:is(.continuum-theme-toggle,#themeToggle,[data-v3-theme])::after{
  content:"Dark  Light";
  position:absolute;
  z-index:2;
  inset:3px;
  display:block;
  height:34px;
  color:transparent;
  background:linear-gradient(90deg,#fff 0 50%,#77889d 50% 100%);
  -webkit-background-clip:text;
  background-clip:text;
  font:850 10px/34px Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  text-align:center;
  word-spacing:19px;
  white-space:nowrap;
  pointer-events:none;
  transition:background 180ms ease;
}

html[data-theme="light"] :is(.continuum-theme-toggle,#themeToggle,[data-v3-theme]){
  border-color:rgba(52,94,140,.22)!important;
  background:rgba(244,249,253,.96)!important;
  box-shadow:0 7px 20px rgba(45,80,117,.12),inset 0 1px 0 rgba(255,255,255,.9)!important;
}

html[data-theme="light"] :is(.continuum-theme-toggle,#themeToggle,[data-v3-theme])::before{
  background:linear-gradient(135deg,#ffffff,#dbe9f5);
  box-shadow:0 4px 14px rgba(41,71,99,.18),inset 0 1px 0 rgba(255,255,255,.95);
  transform:translateX(100%);
}

html[data-theme="light"] :is(.continuum-theme-toggle,#themeToggle,[data-v3-theme])::after{
  background:linear-gradient(90deg,#738398 0 50%,#16283c 50% 100%);
  -webkit-background-clip:text;
  background-clip:text;
}

:is(.continuum-theme-toggle,#themeToggle,[data-v3-theme]):hover,
:is(.continuum-theme-toggle,#themeToggle,[data-v3-theme]):focus-visible{
  border-color:rgba(99,166,255,.62)!important;
  outline:none!important;
  box-shadow:0 0 0 3px rgba(99,166,255,.10),0 8px 22px rgba(0,0,0,.20)!important;
}

@media(max-width:700px){
  :is(.continuum-theme-toggle,#themeToggle,[data-v3-theme]){
    width:92px!important;
    min-width:92px!important;
  }
  :is(.continuum-theme-toggle,#themeToggle,[data-v3-theme])::after{
    font-size:9px;
    word-spacing:12px;
  }
}

@media(max-width:380px){
  :is(.continuum-theme-toggle,#themeToggle,[data-v3-theme]){
    width:84px!important;
    min-width:84px!important;
  }
  :is(.continuum-theme-toggle,#themeToggle,[data-v3-theme])::after{
    font-size:8px;
    word-spacing:9px;
  }
}

@media(prefers-reduced-motion:reduce){
  :is(.continuum-theme-toggle,#themeToggle,[data-v3-theme])::before,
  :is(.continuum-theme-toggle,#themeToggle,[data-v3-theme])::after{
    transition:none!important;
  }
}
