.control-button{text-align:center;border-radius:.375rem;min-width:5rem;padding:.5rem 1rem;font-size:.875rem;font-weight:500;transition:all .2s}.button-primary{color:#fff;background-color:#4f46e5}.button-primary:hover:not(:disabled){background-color:#4338ca}.button-primary:disabled{color:#4f46e5;cursor:not-allowed;background-color:#c7d2fe}.button-secondary{color:#4f46e5;background-color:#e0e7ff}.button-secondary:hover:not(:disabled){background-color:#c7d2fe}.button-secondary:disabled{opacity:.6;cursor:not-allowed}.button-active{color:#fff;background-color:#4f46e5}.button-group{flex-wrap:wrap;justify-content:center;gap:.5rem;display:flex}.dark .button-primary{background-color:#6366f1}.dark .button-primary:hover:not(:disabled){background-color:#818cf8}.dark .button-primary:disabled{opacity:.5;background-color:#4338ca}.dark .button-secondary{color:#d1d5db;background-color:#374151}.dark .button-secondary:hover:not(:disabled){background-color:#4b5563}.toggle-button{position:relative;overflow:hidden}.toggle-button .toggle-content{transition:transform .5s,opacity .5s}.toggle-button .toggle-on{opacity:0;transform:translate(100%)}.toggle-button .toggle-off{opacity:1}.toggle-button.active .toggle-on{opacity:1;transform:translate(0)}.toggle-button.active .toggle-off{opacity:0;transform:translate(-100%)}