.checkbox-container {
    @apply flex items-center space-x-2 justify-end;
    position: inherit;
}

.checkbox-input {
    @apply appearance-none border border-gray-300 rounded-md w-4 h-4 cursor-pointer transition-colors duration-200 bg-contain bg-center bg-no-repeat;
}

.checkbox-input:checked {
    @apply bg-[--bg-color] border-transparent;
    background-image: url('/resources/assets/img/icon-checkbox-white.png');
}

.checkbox-label {
    @apply text-sm text-gray-700 cursor-pointer;
    user-select: none;
    transition: color 0.2s;
}

.checkbox-input:hover {
    @apply border-[--bg-color];
}