/*************************************************************************/
/* MODERN BOOTSTRAP SWITCH - OVERRIDES ONLY                              */
/*************************************************************************/

:root {
    --switch-border: #d7dee5;
    --switch-background: #ffffff;
    --switch-on-background: #5f6f7c;
    --switch-on-text: #ffffff;
    --switch-off-background: #f5f7f9;
    --switch-off-text: #596879;
    --switch-label-background: #ffffff;
    --switch-accent: var(--panel-accent, #b18849);
}


/*************************************************************************/
/* WRAPPER                                                               */
/*************************************************************************/

.bootstrap-switch {
    background-color: var(--switch-background);
    border-color: var(--switch-border);
    border-radius: 6px;
    box-shadow: 0 1px 2px rgba(31, 45, 61, .06);
    transition: border-color .15s ease, box-shadow .15s ease;
}

    .bootstrap-switch:hover {
        border-color: #c9d2db;
    }

    .bootstrap-switch.bootstrap-switch-focused {
        border-color: var(--switch-accent);
        box-shadow: 0 0 0 2px rgba(177, 136, 73, .12);
    }


    /*************************************************************************/
    /* ON                                                                    */
    /*************************************************************************/

    .bootstrap-switch .bootstrap-switch-handle-on,
    .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary,
    .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success,
    .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-info {
        color: var(--switch-on-text);
        background-color: var(--switch-on-background);
        border-color: transparent;
    }


    /*************************************************************************/
    /* OFF                                                                   */
    /*************************************************************************/

    .bootstrap-switch .bootstrap-switch-handle-off,
    .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-default,
    .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-warning,
    .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-danger {
        color: var(--switch-off-text);
        background-color: var(--switch-off-background);
        border-color: transparent;
    }


    /*************************************************************************/
    /* CENTER LABEL                                                          */
    /*************************************************************************/

    .bootstrap-switch .bootstrap-switch-label {
        color: #7d8995;
        background-color: var(--switch-label-background);
        border-color: var(--switch-border);
    }


    /*************************************************************************/
    /* TYPOGRAPHY                                                            */
    /*************************************************************************/

    .bootstrap-switch .bootstrap-switch-handle-on,
    .bootstrap-switch .bootstrap-switch-handle-off,
    .bootstrap-switch .bootstrap-switch-label {
        font-size: 11px;
        font-weight: 600;
        text-shadow: none;
    }


    /*************************************************************************/
    /* DISABLED                                                              */
    /*************************************************************************/

    .bootstrap-switch.bootstrap-switch-disabled,
    .bootstrap-switch.bootstrap-switch-readonly {
        opacity: .55;
    }