/**
 * Forms Styles
 * 
 * JetFormBuilder, checkboxes, preferences
 */

.profile-form {
    gap: var(--spacing-xl);
}

.jet-form-builder textarea.jet-form-builder__field {
    resize: none !important;
}

.field-type-checkbox-field .jet-form-builder__field-label.for-checkbox :checked+span::before {
    background-color: var(--color-white) !important;
    background-image: url('data:image/svg+xml;utf8,<svg width="10" height="10" viewBox="0 0 14 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7.00228 1.32488C2.21703 -3.53444 -6.01639 6.10334 7.00228 12C20.021 6.10334 11.7875 -3.53444 7.00228 1.32488Z" fill="%23C60F01"/></svg>') !important;
}

#checkboxes-preferences .jet-checkboxes-list .jet-checkboxes-list-wrapper {
    grid-template-columns: repeat(4, 1fr);
    display: grid;
}

.preferences-list-profile .field-type-checkbox-field .jet-form-builder__fields-group {
    grid-template-columns: repeat(3, 1fr);
    display: grid;
}

.checkboxes-custom-heart .jet-checkboxes-list__checked-icon svg {
    display: none;
}

.checkboxes-custom-heart .jet-checkboxes-list__checked-icon::before {
    content: '';
    display: inline-block;
    width: 14px;
    height: 12px;
    background-image: url('data:image/svg+xml;utf8,<svg width="10" height="10" viewBox="0 0 14 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7.00228 1.32488C2.21703 -3.53444 -6.01639 6.10334 7.00228 12C20.021 6.10334 11.7875 -3.53444 7.00228 1.32488Z" fill="%23C60F01"/></svg>') !important;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.jet-form-builder__label-text {
    gap: 10px;
    display: flex;
    align-items: anchor-center;
}

@media (max-width: 768px) {
    #checkboxes-preferences .jet-checkboxes-list .jet-checkboxes-list-wrapper {
        grid-template-columns: repeat(3, 1fr);
        display: grid;
    }

    .preferences-list-profile .field-type-checkbox-field .jet-form-builder__fields-group {
        grid-template-columns: repeat(2, 1fr);
        display: grid;
    }
}

@media (max-width: 480px) {
    #checkboxes-preferences .jet-checkboxes-list .jet-checkboxes-list-wrapper {
        grid-template-columns: repeat(2, 1fr);
        display: grid;
    }
}