/* JoyJoy V316 — one compact toggle geometry across the whole personal cabinet. */
body[data-account-page] .account-page{
  --joy-switch-width:46px;
  --joy-switch-height:26px;
  --joy-switch-knob:18px;
  --joy-switch-offset:3px;
  --joy-switch-shift:20px;
  --joy-switch-active:var(--account-accent,#2da44e);
  --joy-switch-off:#d8e0e9;
  --joy-switch-border:#a8b3c2;
  --joy-switch-knob-bg:#fff;
  --profile-switch-width:var(--joy-switch-width);
  --profile-switch-height:var(--joy-switch-height);
  --profile-switch-knob:var(--joy-switch-knob);
  --profile-switch-offset:var(--joy-switch-offset);
  --profile-switch-shift:var(--joy-switch-shift);
}

body[data-account-page="bots"] #panel-bot-control[data-active-bot="tunetune"]{--joy-switch-active:#2997d6}
body[data-account-page="bots"] #panel-bot-control[data-active-bot="shieldy"]{--joy-switch-active:#2da44e}
body[data-account-page="bots"] #panel-bot-control[data-active-bot="gamey"]{--joy-switch-active:#d93f7d}

/* Wrapper-based switches: TuneTune, Shieldy, Gamey, profile and console. */
body[data-account-page] .account-page :is(.normalized-switch,.tt-route-switch,.equalizer-switch,.mini-switch,.switch){
  position:relative!important;
  inset:auto!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 var(--joy-switch-width)!important;
  width:var(--joy-switch-width)!important;
  min-width:var(--joy-switch-width)!important;
  max-width:var(--joy-switch-width)!important;
  height:var(--joy-switch-height)!important;
  min-height:var(--joy-switch-height)!important;
  max-height:var(--joy-switch-height)!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:999px!important;
  background:transparent!important;
  box-shadow:none!important;
  line-height:0!important;
  vertical-align:middle!important;
  overflow:visible!important;
}
body[data-account-page] .account-page :is(.normalized-switch,.tt-route-switch,.equalizer-switch,.mini-switch,.switch)>input[type="checkbox"]{
  position:absolute!important;
  inset:0!important;
  z-index:3!important;
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  opacity:0!important;
  appearance:none!important;
  -webkit-appearance:none!important;
  cursor:pointer!important;
}
body[data-account-page] .account-page :is(.normalized-switch,.tt-route-switch,.equalizer-switch,.mini-switch,.switch)>i{
  position:absolute!important;
  inset:0!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  margin:0!important;
  padding:0!important;
  border:1px solid var(--joy-switch-border)!important;
  border-radius:999px!important;
  background:var(--joy-switch-off)!important;
  box-shadow:inset 0 1px 2px rgba(16,35,63,.10)!important;
  transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease!important;
  pointer-events:none!important;
}
body[data-account-page] .account-page :is(.normalized-switch,.tt-route-switch,.equalizer-switch,.mini-switch,.switch)>i::after{
  content:""!important;
  position:absolute!important;
  top:var(--joy-switch-offset)!important;
  left:var(--joy-switch-offset)!important;
  width:var(--joy-switch-knob)!important;
  height:var(--joy-switch-knob)!important;
  border:0!important;
  border-radius:50%!important;
  background:var(--joy-switch-knob-bg)!important;
  box-shadow:0 2px 5px rgba(16,35,63,.24)!important;
  transform:translateX(0)!important;
  transition:transform .18s ease!important;
  box-sizing:border-box!important;
}
body[data-account-page] .account-page :is(.normalized-switch,.tt-route-switch,.equalizer-switch,.mini-switch,.switch)>input:checked+i{
  border-color:var(--joy-switch-active)!important;
  background:var(--joy-switch-active)!important;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--joy-switch-active) 12%,transparent)!important;
}
body[data-account-page] .account-page :is(.normalized-switch,.tt-route-switch,.equalizer-switch,.mini-switch,.switch)>input:checked+i::after{
  transform:translateX(var(--joy-switch-shift))!important;
}
body[data-account-page] .account-page :is(.normalized-switch,.tt-route-switch,.equalizer-switch,.mini-switch,.switch)>input:focus-visible+i{
  outline:3px solid color-mix(in srgb,var(--joy-switch-active) 22%,transparent)!important;
  outline-offset:2px!important;
}
body[data-account-page] .account-page :is(.normalized-switch,.tt-route-switch,.equalizer-switch,.mini-switch,.switch)>input:disabled+i{
  opacity:.48!important;
  filter:saturate(.55)!important;
}
body[data-account-page] .account-page :is(.normalized-switch,.tt-route-switch,.equalizer-switch,.mini-switch,.switch)>input:disabled{cursor:not-allowed!important}

/* Direct input + rail markup used by toggle rows. */
body[data-account-page] .account-page label.toggle-row>input[type="checkbox"]{
  width:var(--joy-switch-width)!important;
  min-width:var(--joy-switch-width)!important;
  max-width:var(--joy-switch-width)!important;
  height:var(--joy-switch-height)!important;
  min-height:var(--joy-switch-height)!important;
  max-height:var(--joy-switch-height)!important;
}
body[data-account-page] .account-page label.toggle-row>i{
  position:relative!important;
  inset:auto!important;
  display:block!important;
  flex:0 0 var(--joy-switch-width)!important;
  width:var(--joy-switch-width)!important;
  min-width:var(--joy-switch-width)!important;
  max-width:var(--joy-switch-width)!important;
  height:var(--joy-switch-height)!important;
  min-height:var(--joy-switch-height)!important;
  max-height:var(--joy-switch-height)!important;
  margin-left:auto!important;
  padding:0!important;
  border:1px solid var(--joy-switch-border)!important;
  border-radius:999px!important;
  background:var(--joy-switch-off)!important;
  box-shadow:inset 0 1px 2px rgba(16,35,63,.10)!important;
  transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease!important;
  pointer-events:none!important;
}
body[data-account-page] .account-page label.toggle-row>i::after{
  content:""!important;
  position:absolute!important;
  top:var(--joy-switch-offset)!important;
  left:var(--joy-switch-offset)!important;
  width:var(--joy-switch-knob)!important;
  height:var(--joy-switch-knob)!important;
  border:0!important;
  border-radius:50%!important;
  background:var(--joy-switch-knob-bg)!important;
  box-shadow:0 2px 5px rgba(16,35,63,.24)!important;
  transform:translateX(0)!important;
  transition:transform .18s ease!important;
  box-sizing:border-box!important;
}
body[data-account-page] .account-page label.toggle-row>input:checked+i{
  border-color:var(--joy-switch-active)!important;
  background:var(--joy-switch-active)!important;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--joy-switch-active) 12%,transparent)!important;
}
body[data-account-page] .account-page label.toggle-row>input:checked+i::after{transform:translateX(var(--joy-switch-shift))!important}
body[data-account-page] .account-page label.toggle-row>input:focus-visible+i{
  outline:3px solid color-mix(in srgb,var(--joy-switch-active) 22%,transparent)!important;
  outline-offset:2px!important;
}
body[data-account-page] .account-page label.toggle-row>input:disabled+i{opacity:.48!important;filter:saturate(.55)!important}

/* Bare switch inputs used by Shieldy options and subscription auto-renewal. */
body[data-account-page] .account-page input.ui-switch-control[type="checkbox"],
body[data-account-page] .account-page .subscription-autorenew-v151>input[type="checkbox"]{
  position:relative!important;
  display:inline-block!important;
  flex:0 0 var(--joy-switch-width)!important;
  width:var(--joy-switch-width)!important;
  min-width:var(--joy-switch-width)!important;
  max-width:var(--joy-switch-width)!important;
  height:var(--joy-switch-height)!important;
  min-height:var(--joy-switch-height)!important;
  max-height:var(--joy-switch-height)!important;
  margin:0!important;
  padding:0!important;
  border:1px solid var(--joy-switch-border)!important;
  border-radius:999px!important;
  background:var(--joy-switch-off)!important;
  box-shadow:inset 0 1px 2px rgba(16,35,63,.10)!important;
  cursor:pointer!important;
  vertical-align:middle!important;
  appearance:none!important;
  -webkit-appearance:none!important;
  transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease!important;
  box-sizing:border-box!important;
}
body[data-account-page] .account-page input.ui-switch-control[type="checkbox"]::after,
body[data-account-page] .account-page .subscription-autorenew-v151>input[type="checkbox"]::after{
  content:""!important;
  position:absolute!important;
  top:var(--joy-switch-offset)!important;
  left:var(--joy-switch-offset)!important;
  width:var(--joy-switch-knob)!important;
  height:var(--joy-switch-knob)!important;
  border:0!important;
  border-radius:50%!important;
  background:var(--joy-switch-knob-bg)!important;
  box-shadow:0 2px 5px rgba(16,35,63,.24)!important;
  transform:translateX(0)!important;
  transition:transform .18s ease!important;
  box-sizing:border-box!important;
}
body[data-account-page] .account-page input.ui-switch-control[type="checkbox"]:checked,
body[data-account-page] .account-page .subscription-autorenew-v151>input[type="checkbox"]:checked{
  border-color:var(--joy-switch-active)!important;
  background:var(--joy-switch-active)!important;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--joy-switch-active) 12%,transparent)!important;
}
body[data-account-page] .account-page input.ui-switch-control[type="checkbox"]:checked::after,
body[data-account-page] .account-page .subscription-autorenew-v151>input[type="checkbox"]:checked::after{
  transform:translateX(var(--joy-switch-shift))!important;
}
body[data-account-page] .account-page input.ui-switch-control[type="checkbox"]:focus-visible,
body[data-account-page] .account-page .subscription-autorenew-v151>input[type="checkbox"]:focus-visible{
  outline:3px solid color-mix(in srgb,var(--joy-switch-active) 22%,transparent)!important;
  outline-offset:2px!important;
}
body[data-account-page] .account-page input.ui-switch-control[type="checkbox"]:disabled,
body[data-account-page] .account-page .subscription-autorenew-v151>input[type="checkbox"]:disabled{
  opacity:.48!important;
  filter:saturate(.55)!important;
  cursor:not-allowed!important;
}

html[data-theme="dark"] body[data-account-page] .account-page{
  --joy-switch-off:#33445a;
  --joy-switch-border:#5a6f88;
  --joy-switch-knob-bg:#f7f9fc;
}

@media(max-width:620px){
  body[data-account-page] .account-page label.toggle-row{padding-right:62px!important}
}


/* V315: a wrapped switch must render only the wrapper rail, never a second bare input rail. */
body[data-account-page] .account-page :is(.normalized-switch,.tt-route-switch,.equalizer-switch,.mini-switch,.switch)>input.ui-switch-control[type="checkbox"],
body[data-account-page] .account-page :is(.normalized-switch,.tt-route-switch,.equalizer-switch,.mini-switch,.switch)>input[type="checkbox"]{
  position:absolute!important;
  inset:0!important;
  z-index:3!important;
  display:block!important;
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  height:100%!important;
  min-height:0!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  opacity:0!important;
  appearance:none!important;
  -webkit-appearance:none!important;
}
body[data-account-page] .account-page :is(.normalized-switch,.tt-route-switch,.equalizer-switch,.mini-switch,.switch)>input.ui-switch-control[type="checkbox"]::before,
body[data-account-page] .account-page :is(.normalized-switch,.tt-route-switch,.equalizer-switch,.mini-switch,.switch)>input.ui-switch-control[type="checkbox"]::after,
body[data-account-page] .account-page :is(.normalized-switch,.tt-route-switch,.equalizer-switch,.mini-switch,.switch)>input[type="checkbox"]::before,
body[data-account-page] .account-page :is(.normalized-switch,.tt-route-switch,.equalizer-switch,.mini-switch,.switch)>input[type="checkbox"]::after{
  content:none!important;
  display:none!important;
}

