/* CraftForms — Default Form Skin */

.wp-block-craftforms-form:not([class*="is-style-"]),
.wp-block-craftforms-form.is-style-default {

    /* ========================================
       Skin Variables
       ======================================== */

    --cf-color-invalid: #c44d4d;
    --cf-color-valid: #51a88a;
    --cf-color-error-text: var(--cf-color-invalid);
    --cf-input-padding: var(--wp--preset--spacing--20, 0.5rem);
    --cf-field-gap: var(--wp--preset--spacing--20, 0.5rem);
    --cf-options-gap: var(--wp--preset--spacing--20, 0.5rem);

    /* ========================================
       Field Wrapper Gap (label / input / error)
       ======================================== */

    .wp-block-craftforms-text-input-field,
    .wp-block-craftforms-textarea-field,
    .wp-block-craftforms-select-field,
    .wp-block-craftforms-radio-field,
    .wp-block-craftforms-checkboxes-field,
    .wp-block-craftforms-booking-datepicker-field,
    .wp-block-craftforms-file-field {
        gap: var(--cf-field-gap);
    }

    /* ========================================
       Input / Select / Textarea Padding
       ======================================== */

    .wp-block-craftforms-text-input,
    .wp-block-craftforms-textarea,
    .wp-block-craftforms-select {
        padding: var(--cf-input-padding);
        margin: 0;
    }

    /* ========================================
       Datepicker Input Padding
       ======================================== */

    .craftforms-datepicker-input {
        padding: var(--cf-input-padding);
    }

    /* ========================================
       Options Group Gap
       ======================================== */

    .craftforms-options-group {
        gap: var(--cf-options-gap);
    }

    /* ========================================
       InfoBlock — reset constrained layout margin
       ======================================== */

    .wp-block-craftforms-infoblock.is-layout-constrained > * {
        margin-block-start: 0;
    }

    /* ========================================
       Form Error Color
       ======================================== */

    .wp-block-craftforms-form-error {
        color: var(--cf-color-error-text);
        font-size: 0.8em;
    }
}