.styled-checkbox {
    position: absolute;
    opacity: 0;
}

    .styled-checkbox ~ label {
        position: relative;
        cursor: pointer;
        padding: 0;
    }

        .styled-checkbox ~ label:before {
            content: '';
            margin: 0 6px;
            display: inline-block;
            vertical-align: top;
            width: 20px;
            height: 20px;
            background: white;
            border: 1px solid #A16348;
            border: 1px solid var(--main-color);
        }

    .styled-checkbox:hover ~ label:before {
        background: #fbd9ca;
        background: var(--main-color-light);
    }

    .styled-checkbox:focus ~ label:before {
        /*box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.12);*/
    }

    .styled-checkbox:checked ~ label {
        color: #A16348;
        color: var(--main-color);
        font-weight: bold;
    }

        .styled-checkbox:checked ~ label:before {
            background: #A16348;
            background: var(--main-color);
        }

    .styled-checkbox:disabled ~ label {
        color: #b8b8b8;
        cursor: auto;
    }

        .styled-checkbox:disabled ~ label:before {
            box-shadow: none;
            background: #ddd;
        }

    .styled-checkbox:checked ~ label:after {
        content: '';
        position: absolute;
        right: 16px;
        top: 4px;
        width: 6px;
        height: 12px;
        border: solid #fff;
        border-width: 0 3px 3px 0;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
    }