/*--------------------------------------------------------------
# Theoheat VAT Toggle
--------------------------------------------------------------*/


/*--------------------------------------------------------------
# Wrapper
--------------------------------------------------------------*/

.theo-vat-toggle {

    display: flex;

    width: 100%;

    align-items: center;
    justify-content: flex-end;
}

/*--------------------------------------------------------------
# VAT Labels
--------------------------------------------------------------*/

.theo-vat-toggle {
    gap: 8px;
}

.theo-vat-label {
    white-space: nowrap;
    font-size: 12px;
    line-height: 1;
    color: #333333;
}

/* Hide the Tax Switch plugin's own single label */
.theo-vat-toggle .wdevs-tax-switch-label-text {
    display: none !important;
}


/*--------------------------------------------------------------
# Tax Switch Plugin Wrapper
--------------------------------------------------------------*/

.theo-vat-toggle .wp-block-wdevs-tax-switch {

    margin: 0;
    padding: 0;
}


/*--------------------------------------------------------------
# Desktop Switch
--------------------------------------------------------------*/

.theo-vat-toggle
.wp-block-wdevs-tax-switch
.wdevs-tax-switch
.wdevs-tax-switch-label {

    width: 46px;
    height: 24px;
}


.theo-vat-toggle
.wp-block-wdevs-tax-switch
.wdevs-tax-switch
.wdevs-tax-switch-slider::before {

    width: 18px;
    height: 18px;

    bottom: 3px;
    left: 3px;
}


.theo-vat-toggle
.wp-block-wdevs-tax-switch
.wdevs-tax-switch
.wdevs-tax-switch-checkbox:checked
+
.wdevs-tax-switch-slider::before {

    transform: translateX(22px);
}


/*--------------------------------------------------------------
# Label
--------------------------------------------------------------*/

.theo-vat-toggle
.wdevs-tax-switch-label-text {

    white-space: nowrap;
}


/*--------------------------------------------------------------
# Admin Diagnostic
--------------------------------------------------------------*/

.theo-vat-toggle-error {

    display: inline-block;

    padding: 4px 8px;

    color: #b32d2e;
    background: #ffffff;

    border: 1px solid #b32d2e;

    font-size: 12px;
}


/*--------------------------------------------------------------
# Mobile
--------------------------------------------------------------*/

@media only screen and (max-width: 767px) {

    .theo-vat-toggle
    .wp-block-wdevs-tax-switch
    .wdevs-tax-switch
    .wdevs-tax-switch-label {

        width: 32px;
        height: 15px;
    }


    .theo-vat-toggle
    .wp-block-wdevs-tax-switch
    .wdevs-tax-switch
    .wdevs-tax-switch-slider::before {

        width: 11px;
        height: 11px;

        bottom: 2px;
        left: 2px;
    }


    .theo-vat-toggle
    .wp-block-wdevs-tax-switch
    .wdevs-tax-switch
    .wdevs-tax-switch-checkbox:checked
    +
    .wdevs-tax-switch-slider::before {

        transform: translateX(16px);
    }


    .theo-vat-toggle
    .wdevs-tax-switch-label-text {

        font-size: 12px;
    }

}