switch {
    background-color: rgba(black, 0.05);
    border: 1px solid $border-color;
    box-shadow: inset-shadow();
    border-radius: rem(16px);
    transition: all duration("in-place") $easing;

    @if $color-scheme == "dark" {
        background-color: rgba(black, 0.10);
    }

    &:checked:not(.mode-switch):not(:backdrop) {
        @extend %outset-background;
        background-color: #{"@accent_color"};

        @if $color-scheme == "light" {
            border-color: #{"shade(@accent_color, 0.85)"};
        } @else if $color-scheme == "dark" {
            background-clip: padding-box;

            slider {
                box-shadow:
                    outset-highlight("full"),
                    0 0 0 1px rgba(black, 0.5),
                    outset-shadow(3);
            }
        }

        &:disabled {
            box-shadow: inset-shadow("disabled");
            background-image: none;
            background-color: #{'mix(@theme_bg_color, @accent_color, 0.5)'};
            @if $color-scheme == "light" {
                border-color: #{'shade(mix(@theme_bg_color, @accent_color, 0.5), 0.75)'};
            } @else if $color-scheme == "dark" {
                border-color: #{'shade(mix(@theme_bg_color, @accent_color, 0.5), 0.5)'};
            }
        }
    }

    image {
        color: transparent;
    }

    slider {
        @extend %outset-background;
        background-color: bg-color(0);
        background-clip: padding-box;
        border-radius: 99px;
        box-shadow:
            outset-highlight("full"),
            0 0 0 1px $border-color,
            outset-shadow(3);
        min-height: rem(24px);
        min-width: rem(24px);
    }

    &.mode-switch slider {
        min-height: rem(16px);
        min-width: rem(16px);
    }

    &:disabled {
        background-color: $insensitive-base-color;
        box-shadow: inset-shadow("disabled");

        slider {
            background-color: bg-color(3);
            box-shadow:
                outset-highlight("full"),
                0 0 0 1px rgba(black, 0.15),
                outset-shadow(2);
        }
    }

    &:focus-visible {
        @if $color-scheme == "light" {
            border-color: #{'@accent_color'};
        }
        color: #{'@selected_fg_color'};
        outline-color: #{'alpha(@accent_color, 0.3)'};
        outline-width: rem(2px);
        outline-style: solid;

        slider {
            @if $color-scheme == "light" {
                box-shadow:
                    outset-highlight("full"),
                    0 0 0 1px #{'@accent_color'},
                    outset-shadow(3);
            }
            color: #{'@selected_fg_color'};
            outline-color: #{'alpha(@accent_color, 0.3)'};
            // Off-by-one to account for padding-box clip
            outline-width: rem(3px);
            outline-style: solid;
        }
    }
}
