﻿/* INPUT CHECKBOX */


input[type=checkbox].checkbox {
    position: relative;
    width: 20px;
    height: 20px;
    color: var(--primary-color-btn);
    background: var(--background-color-white);
    border-radius: 4px;
    border: 1px solid var(--primary-color-btn);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: 0;
    cursor: pointer;
    transition: background 175ms cubic-bezier(0.1, 0.1, 0.25, 1);
}

    input[type=checkbox].checkbox::before {
        position: absolute;
        content: "";
        display: block;
        top: 0px;
        left: 6px;
        width: 6px;
        height: 13px;
        border-style: solid;
        border-color: #fff;
        border-width: 0 2.5px 2.5px 0;
        transform: rotate(45deg);
        opacity: 0;
    }

    input[type=checkbox].checkbox:checked {
        color: #fff;
        border-color: var(--primary-color);
        background: var(--primary-color);
    }

        input[type=checkbox].checkbox:checked::before {
            opacity: 1;
        }

        input[type=checkbox].checkbox:checked ~ label::before {
            -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
            clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
        }

    input[type=checkbox].checkbox:disabled {
        pointer-events: none;
        filter: none;
        opacity: .5;
    }
