/* Gravity Forms on Baseline: the plugin's layout CSS stays, its theme layers are dropped
   (inc/compat/gravity-forms.php). Inputs, textareas and selects take the theme's control styles
   from components.css; this file covers what is left: gaps, labels, descriptions, validation. */

.gform_wrapper {
    --gf-form-gap: var(--wp--preset--spacing--24);
    --gf-label-gap: var(--wp--preset--spacing--8);
    --gf-error: #b32d2e;
}

.gform_wrapper .gform_fields {
    display: grid;
    row-gap: var(--gf-form-gap);
    /* Foundation lays fields on a 12-column grid with no column gap below 640px (a narrow form
       cannot afford one); the gap arrives with the wider layout, the same as foundation's own. */
    column-gap: 0;
}
@media (min-width: 640px) {
    .gform_wrapper .gform_fields {
        column-gap: var(--wp--preset--spacing--24);
    }
}

.gform_wrapper .gfield_label,
.gform_wrapper legend.gfield_label {
    display: block;
    margin: 0 0 var(--gf-label-gap);
    font-size: var(--wp--preset--font-size--display-2);
    font-weight: 600;
    line-height: 1.43;
}

.gform_wrapper .gfield_required {
    margin-left: 0.25em;
    color: var(--wp--preset--color--gray-070);
    font-weight: 400;
}

.gform_wrapper .gfield_description,
.gform_wrapper .gform_required_legend {
    margin: var(--gf-label-gap) 0 0;
    font-size: var(--wp--preset--font-size--paragraph-small);
    color: var(--wp--preset--color--gray-070);
}

.gform_wrapper .gfield_description.gfield_validation_message,
.gform_wrapper .validation_message {
    color: var(--gf-error);
}

.gform_wrapper .gform_validation_errors {
    padding: var(--wp--preset--spacing--16);
    border: 1px solid var(--gf-error);
    border-radius: 6px;
    margin: 0 0 var(--gf-form-gap);
}
.gform_wrapper .gform_validation_errors > h2 {
    margin: 0;
    font-size: var(--wp--preset--font-size--display-2);
    line-height: 1.43;
}

.gform_wrapper .gfield_error input,
.gform_wrapper .gfield_error textarea,
.gform_wrapper .gfield_error select {
    border-color: var(--gf-error);
}

/* Choice lists (checkboxes, radios) stack with a small gap and keep the control on the first line. */
.gform_wrapper .gfield_checkbox,
.gform_wrapper .gfield_radio {
    display: grid;
    gap: var(--wp--preset--spacing--8);
}
.gform_wrapper .gchoice {
    display: flex;
    align-items: flex-start;
    gap: var(--wp--preset--spacing--8);
}
.gform_wrapper .gchoice input {
    margin: 0.3em 0 0;
    width: auto;
}

.gform_wrapper .gform_footer {
    margin-top: var(--gf-form-gap);
}
.gform_wrapper .gform_footer .wp-block-button__link {
    cursor: pointer;
}

.gform_wrapper .gform_confirmation_message {
    padding: var(--wp--preset--spacing--16);
    border-left: 3px solid var(--wp--preset--color--gray-090);
}