.toggle-container{align-items:center;gap:16px;display:flex;position:relative}.toggle-label{text-transform:uppercase;border:2px solid var(--textColor);background:linear-gradient(var(--angle),var(--firstGradientColor),var(--secondGradientColor));box-shadow:2px 2px var(--textColor);z-index:1;border-radius:8px;padding:4px 8px;font-size:16px;font-weight:600;position:relative}.switch{--input-focus:#2d8cf0;--input-out-of-focus:#ccc;z-index:0;flex-direction:column;justify-content:center;align-items:center;width:70px;height:36px;display:flex;position:relative}.toggle{opacity:0;position:absolute}.slider{box-sizing:border-box;border:2px solid var(--textColor);box-shadow:4px 4px var(--baseColor);cursor:pointer;background-color:var(--input-out-of-focus);border-radius:9999px;transition:background-color .3s;position:absolute;inset:0;transform:none!important}.slider:before{content:"off";box-sizing:border-box;border:2px solid var(--textColor);background-color:var(--background);width:30px;height:30px;color:var(--textColor);text-align:center;border-radius:9999px;font-size:14px;font-weight:600;line-height:25px;transition:transform .3s;position:absolute;bottom:1px;left:2px}.toggle:checked+.slider{background-color:var(--input-focus)}.toggle:checked+.slider:before{content:"on";transform:translate(32px)}.toggle:disabled+.slider{opacity:.6;cursor:not-allowed}
