/* App-local Forms layout stays scoped to the plugin's CSP-safe data attribute hook. */
form[data-va-forms-form="true"].guancher-contact-form .guancher-contact-form__fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-areas:
        "name-label email-label"
        "name email"
        "phone-label country-label"
        "phone country"
        "message-label message-label"
        "message message"
        "submit submit";
    gap: 0.45rem 1rem;
    align-items: end;
}

form[data-va-forms-form="true"].guancher-contact-form .guancher-contact-form__label {
    margin: 0.45rem 0 0;
    color: var(--text-100);
    font-weight: 600;
}

form[data-va-forms-form="true"].guancher-contact-form .guancher-contact-form__control {
    min-width: 0;
    min-height: 3.1rem;
    margin: 0 0 0.45rem;
    border-color: var(--border-mid);
    background: color-mix(in srgb, var(--input-background) 88%, var(--bg-950));
}

form[data-va-forms-form="true"].guancher-contact-form textarea.guancher-contact-form__control {
    min-height: 10rem;
    resize: vertical;
}

form[data-va-forms-form="true"].guancher-contact-form label[for="contact-name"] {
    grid-area: name-label;
}

form[data-va-forms-form="true"].guancher-contact-form #contact-name {
    grid-area: name;
}

form[data-va-forms-form="true"].guancher-contact-form label[for="email"] {
    grid-area: email-label;
}

form[data-va-forms-form="true"].guancher-contact-form #email {
    grid-area: email;
}

form[data-va-forms-form="true"].guancher-contact-form label[for="contact-phone"] {
    grid-area: phone-label;
}

form[data-va-forms-form="true"].guancher-contact-form #contact-phone {
    grid-area: phone;
}

form[data-va-forms-form="true"].guancher-contact-form label[for="contact-country"] {
    grid-area: country-label;
}

form[data-va-forms-form="true"].guancher-contact-form #contact-country {
    grid-area: country;
}

form[data-va-forms-form="true"].guancher-contact-form label[for="contact-message"] {
    grid-area: message-label;
}

form[data-va-forms-form="true"].guancher-contact-form #contact-message {
    grid-area: message;
}

form[data-va-forms-form="true"].guancher-contact-form .guancher-contact-form__submit {
    grid-area: submit;
    justify-content: center;
    width: 100%;
    min-height: 3.2rem;
    margin-top: 0.35rem;
}

@media (max-width: 680px) {
    form[data-va-forms-form="true"].guancher-contact-form .guancher-contact-form__fields {
        grid-template-columns: minmax(0, 1fr);
        grid-template-areas:
            "name-label"
            "name"
            "email-label"
            "email"
            "phone-label"
            "phone"
            "country-label"
            "country"
            "message-label"
            "message"
            "submit";
        gap: 0.35rem;
    }
}