/* components/overrides/bootstrap-evf-switch.css
   Purpose:
   - Provide shared checkbox, radio, and switch visual overrides.
   May contain:
   - Shared Bootstrap form-check selectors that consume app color roles from the EVF color files
   Must not contain:
   - Raw palette definitions
   - Long-lived global EVF tokens
   - Bootstrap token remaps
   - Page-local switch tweaks
   Dependencies:
   - Requires colors/bootstrap-evf-colors-base.css and colors/bootstrap-evf-colors-app.css to be loaded first.
   Scope:
   - Shared Bootstrap override selectors only.
*/

.form-check-input {
    border-color: var(--evf-ui-switch-knob-off) !important;
    box-shadow: none !important;
}

.form-switch .form-check-input {
    background-color: var(--evf-ui-switch-track-off) !important;
    background-image: radial-gradient(circle, var(--evf-ui-switch-knob-off) 48%, transparent 49%) !important;
    background-repeat: no-repeat !important;
    background-size: 1em 1em !important;
    background-position: left center !important;
}

.form-switch .form-check-input:checked {
    background-color: var(--evf-ui-switch-track-on) !important;
    border-color: var(--evf-ui-switch-track-on) !important;
    background-image: radial-gradient(circle, var(--evf-ui-switch-knob-on) 48%, transparent 49%) !important;
    background-position: right center !important;
}