/* CHECKBOXES */
.checkbox {
    display: flex;
    align-items: center;
    cursor: pointer;
    padding: 5px;
    -webkit-user-select: none; /* Pour les navigateurs WebKit (Chrome, Safari) */
    -moz-user-select: none;    /* Pour les navigateurs Mozilla */
    -ms-user-select: none;     /* Pour Internet Explorer/Edge */
    user-select: none;         /* Standard */
}

.checkbox input[type="checkbox"] {
    display: none;
}

.checkbox label {
    font-size: 14px;
    display: flex;
    align-items: stretch;
}

.checkbox label::before {
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    background-size: contain;
    background-repeat: no-repeat;
    margin-right: 8px;
}

/* Unchecked default */
.checkbox input[type="checkbox"]:not(:checked):not(:disabled) + label::before {
    background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none"%3E%3Crect x="0.5" y="0.5" width="19" height="19" rx="3.5" fill="white" stroke="%23C2C2C2"/%3E%3C/svg%3E');
}

/* Unchecked hover */
.checkbox input[type="checkbox"]:not(:checked):not(:disabled):hover + label::before {
    background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none"%3E%3Crect x="0.5" y="0.5" width="19" height="19" rx="3.5" fill="white" stroke="%23FEB603"/%3E%3C/svg%3E');
}

/* Unchecked focused */
.checkbox input[type="checkbox"]:not(:checked):not(:disabled):focus + label::before {
    background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"%3E%3Crect x="1" y="1" width="22" height="22" rx="5" stroke="%23FFFAF5" stroke-width="2"/%3E%3Crect x="2.5" y="2.5" width="19" height="19" rx="3.5" fill="white" stroke="%23FEB603"/%3E%3C/svg%3E');
}

/* Unchecked disabled */
.checkbox input[type="checkbox"]:not(:checked):disabled + label::before {
    background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none"%3E%3Cg opacity="0.6"%3E%3Crect x="0.5" y="0.5" width="19" height="19" rx="3.5" fill="white" stroke="%23C2C2C2"/%3E%3C/g%3E%3C/svg%3E');
    cursor: not-allowed;
}

/* Checked default */
.checkbox input[type="checkbox"]:checked:not(:disabled) + label::before {
    background-color: #FEB603;
    width: 20px;
    height: 20px;
    border-radius: 3.5px;
    background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none"%3E%3Cpath d="M16.6666 5L7.49998 14.1667L3.33331 10" stroke="white" stroke-linecap="round" stroke-linejoin="round"/%3E%3C/svg%3E');
}

/* Checked hover */
.checkbox input[type="checkbox"]:checked:not(:disabled):hover + label::before {
    background-color: #FFC841;
    width: 20px;
    height: 20px;
    border-radius: 3.5px;
    background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none"%3E%3Cpath d="M16.6666 5L7.49998 14.1667L3.33331 10" stroke="white" stroke-linecap="round" stroke-linejoin="round"/%3E%3C/svg%3E');
}

/* Checked focused */
.checkbox input[type="checkbox"]:checked:not(:disabled):focus + label::before {
    background-color: #FEB603;
    width: 20px;
    height: 20px;
    border-radius: 3.5px;
    background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none"%3E%3Cpath d="M16.6666 5L7.49998 14.1667L3.33331 10" stroke="white" stroke-linecap="round" stroke-linejoin="round"/%3E%3C/svg%3E');
}

/* Checked disabled */
.checkbox input[type="checkbox"]:checked:disabled + label::before {
    background-color: #C2C2C2;
    width: 20px;
    height: 20px;
    border-radius: 3.5px;
    background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none"%3E%3Cg opacity="0.6"%3E%3Cpath d="M16.6666 5L7.49998 14.1667L3.33331 10" stroke="white" stroke-linecap="round" stroke-linejoin="round"/%3E%3C/g%3E%3C/svg%3E');
    cursor: not-allowed;
}

/* Indeterminate default */
.checkbox input[type="checkbox"]:indeterminate:not(:disabled) + label::before {
    border-radius: 2px;
    width: 20px;
    height: 20px;
    background-image: url('data:image/svg+xml,%3Csvg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"%3E%3Cg id="Checkbox/active/disabled/off" opacity="1"%3E%3Crect id="Rectangle 1" width="20" height="20" rx="4" fill="%23FEB603"/%3E%3Cpath id="Vector" d="M15.8333 2.5H4.16667C3.24619 2.5 2.5 3.24619 2.5 4.16667V15.8333C2.5 16.7538 3.24619 17.5 4.16667 17.5H15.8333C16.7538 17.5 17.5 16.7538 17.5 15.8333V4.16667C17.5 3.24619 16.7538 2.5 15.8333 2.5Z" stroke="white" stroke-linecap="round" stroke-linejoin="round"/%3E%3C/g%3E%3C/svg%3E');
}

/* Indeterminate hover */
.checkbox input[type="checkbox"]:indeterminate:not(:disabled):hover + label::before {
    border-radius: 2px;
    width: 20px;
    height: 20px;
    background-image: url('data:image/svg+xml,%3Csvg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"%3E%3Cg id="Checkbox/active/disabled/off" opacity="1"%3E%3Crect id="Rectangle 1" width="20" height="20" rx="4" fill="%23C08A04"/%3E%3Cpath id="Vector" d="M15.8333 2.5H4.16667C3.24619 2.5 2.5 3.24619 2.5 4.16667V15.8333C2.5 16.7538 3.24619 17.5 4.16667 17.5H15.8333C16.7538 17.5 17.5 16.7538 17.5 15.8333V4.16667C17.5 3.24619 16.7538 2.5 15.8333 2.5Z" stroke="white" stroke-linecap="round" stroke-linejoin="round"/%3E%3C/g%3E%3C/svg%3E');
}

/* Indeterminate focused */
.checkbox input[type="checkbox"]:indeterminate:not(:disabled):focus + label::before {
    border-radius: 2px;
    width: 20px;
    height: 20px;
    background-image: url('data:image/svg+xml,%3Csvg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"%3E%3Cg id="Checkbox/active/disabled/off" opacity="1"%3E%3Crect id="Rectangle 1" width="20" height="20" rx="4" fill="%23FFC841"/%3E%3Cpath id="Vector" d="M15.8333 2.5H4.16667C3.24619 2.5 2.5 3.24619 2.5 4.16667V15.8333C2.5 16.7538 3.24619 17.5 4.16667 17.5H15.8333C16.7538 17.5 17.5 16.7538 17.5 15.8333V4.16667C17.5 3.24619 16.7538 2.5 15.8333 2.5Z" stroke="white" stroke-linecap="round" stroke-linejoin="round"/%3E%3C/g%3E%3C/svg%3E');
}

/* Indeterminate disabled */
.checkbox input[type="checkbox"]:indeterminate:disabled + label::before {
    border-radius: 2px;
    width: 20px;
    height: 20px;
    background-image: url('data:image/svg+xml,%3Csvg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg"%3E%3Cg opacity="0.6"%3E%3Cpath d="M1 5C1 2.79086 2.79086 1 5 1H17C19.2091 1 21 2.79086 21 5V17C21 19.2091 19.2091 21 17 21H5C2.79086 21 1 19.2091 1 17V5Z" fill="%23BBBBBB"/%3E%3Cpath d="M16.8333 3.5H5.16667C4.24619 3.5 3.5 4.24619 3.5 5.16667V16.8333C3.5 17.7538 4.24619 18.5 5.16667 18.5H16.8333C17.7538 18.5 18.5 17.7538 18.5 16.8333V5.16667C18.5 4.24619 17.7538 3.5 16.8333 3.5Z" fill="%23BBBBBB"/%3E%3Cpath d="M1 5C1 2.79086 2.79086 1 5 1H17C19.2091 1 21 2.79086 21 5V17C21 19.2091 19.2091 21 17 21H5C2.79086 21 1 19.2091 1 17V5Z" stroke="white" stroke-linecap="round" stroke-linejoin="round"/%3E%3Cpath d="M16.8333 3.5H5.16667C4.24619 3.5 3.5 4.24619 3.5 5.16667V16.8333C3.5 17.7538 4.24619 18.5 5.16667 18.5H16.8333C17.7538 18.5 18.5 17.7538 18.5 16.8333V5.16667C18.5 4.24619 17.7538 3.5 16.8333 3.5Z" stroke="white" stroke-linecap="round" stroke-linejoin="round"/%3E%3C/g%3E%3C/svg%3E');
    cursor: not-allowed;
}