/* =====================================================
   form.css — Form styling (RULE 24)
   Overrides default WPForms styles so any form on the site
   matches the editorial language: same typography tokens,
   same colour tokens, generous spacing, a single luxury
   submit button. Loaded on any page with a form.

   Selectors are scoped to .wpforms-container (the outer
   WPForms wrapper) so they always win against the
   plugin's default cascade without needing !important.
   ===================================================== */

/* ---- Container reset ---- */

.wpforms-container,
.wpforms-container-full {
    max-width: 100% !important;
    margin: 0 !important;
}

.wpforms-container .wpforms-form {
    font-family: var(--font-body);
    color: var(--color-text);
}

/* ---- Field row spacing ---- */

.wpforms-container .wpforms-field-container .wpforms-field {
    margin: 0 0 var(--space-6) 0 !important;
    padding: 0 !important;
}

.wpforms-container .wpforms-field-container .wpforms-field:last-child {
    margin-bottom: 0 !important;
}

/* ---- Labels (editorial eyebrow style) ---- */

.wpforms-container .wpforms-form label.wpforms-field-label {
    display: block;
    font-family: var(--font-body);
    font-weight: var(--fw-semibold);
    font-size: var(--text-xs);
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.12em;
    margin: 0 0 var(--space-3) 0;
    line-height: 1.4;
}

.wpforms-container .wpforms-form label.wpforms-field-label.wpforms-label-hide,
.wpforms-container .wpforms-form label.wpforms-field-sublabel.wpforms-sublabel-hide {
    display: none;
}

.wpforms-container .wpforms-form .wpforms-field-sublabel {
    font-family: var(--font-body);
    font-size: var(--text-xs);
    color: var(--color-muted);
    margin-top: var(--space-1);
    font-weight: var(--fw-medium);
    letter-spacing: normal;
    text-transform: none;
}

/* Required asterisk in primary orange */
.wpforms-container .wpforms-form .wpforms-required-label,
.wpforms-container .wpforms-form abbr[title="required"] {
    color: var(--color-primary);
    margin-left: 0.2em;
    text-decoration: none;
}

/* ---- Inputs ---- */

.wpforms-container .wpforms-form input[type="text"],
.wpforms-container .wpforms-form input[type="email"],
.wpforms-container .wpforms-form input[type="tel"],
.wpforms-container .wpforms-form input[type="url"],
.wpforms-container .wpforms-form input[type="password"],
.wpforms-container .wpforms-form input[type="number"],
.wpforms-container .wpforms-form input[type="date"],
.wpforms-container .wpforms-form input[type="datetime"],
.wpforms-container .wpforms-form input[type="datetime-local"],
.wpforms-container .wpforms-form input[type="month"],
.wpforms-container .wpforms-form input[type="search"],
.wpforms-container .wpforms-form input[type="time"],
.wpforms-container .wpforms-form input[type="week"],
.wpforms-container .wpforms-form textarea,
.wpforms-container .wpforms-form select {
    width: 100% !important;
    max-width: 100% !important;
    padding: var(--space-4) var(--space-5) !important;
    font-family: var(--font-body) !important;
    font-size: var(--text-body) !important;
    line-height: var(--leading-snug) !important;
    color: var(--color-text) !important;
    background-color: var(--color-white) !important;
    border: 1px solid var(--color-border) !important;
    border-radius: var(--radius-md) !important;
    box-shadow: none !important;
    transition: border-color var(--ease-base), box-shadow var(--ease-base) !important;
    appearance: none;
    -webkit-appearance: none;
    box-sizing: border-box;
    height: auto !important;
}

.wpforms-container .wpforms-form textarea {
    min-height: 160px !important;
    line-height: var(--leading-body) !important;
    resize: vertical !important;
}

/* ---- Focus state ---- */

.wpforms-container .wpforms-form input:focus,
.wpforms-container .wpforms-form textarea:focus,
.wpforms-container .wpforms-form select:focus {
    outline: 0 !important;
    border-color: var(--color-primary) !important;
    box-shadow: 0 0 0 3px rgba( var(--color-primary-rgb), 0.15 ) !important;
}

/* ---- Placeholder ---- */

.wpforms-container .wpforms-form input::placeholder,
.wpforms-container .wpforms-form textarea::placeholder {
    color: var(--color-muted);
    opacity: 1;
}

/* ---- Radio / Checkbox lists ---- */

.wpforms-container .wpforms-form ul.wpforms-field-radio,
.wpforms-container .wpforms-form ul.wpforms-field-checkbox {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.wpforms-container .wpforms-form ul.wpforms-field-radio li,
.wpforms-container .wpforms-form ul.wpforms-field-checkbox li {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    font-family: var(--font-body);
    font-size: var(--text-body);
    color: var(--color-text);
    margin: 0 !important;
    padding: 0 !important;
}

.wpforms-container .wpforms-form input[type="radio"],
.wpforms-container .wpforms-form input[type="checkbox"] {
    width: 18px !important;
    height: 18px !important;
    accent-color: var(--color-primary);
    flex-shrink: 0;
    margin: 0 !important;
}

/* ---- Submit button (editorial luxury) ---- */

.wpforms-container .wpforms-form .wpforms-submit-container {
    margin-top: var(--space-8) !important;
    padding: 0 !important;
}

.wpforms-container .wpforms-form button[type="submit"],
.wpforms-container .wpforms-form button.wpforms-submit,
.wpforms-container .wpforms-form .wpforms-submit {
    display: inline-flex !important;
    align-items: center !important;
    gap: var(--space-3) !important;
    font-family: var(--font-heading) !important;
    font-weight: var(--fw-bold) !important;
    font-size: var(--text-body-lg) !important;
    line-height: 1 !important;
    color: var(--color-white) !important;
    background-color: var(--color-text) !important;
    background-image: none !important;
    border: 2px solid var(--color-text) !important;
    padding: var(--space-4) var(--space-8) !important;
    border-radius: var(--radius-full) !important;
    cursor: pointer !important;
    text-decoration: none !important;
    letter-spacing: -0.01em !important;
    text-shadow: none !important;
    box-shadow: none !important;
    text-transform: none !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    transition:
        background-color var(--ease-base),
        border-color     var(--ease-base),
        color            var(--ease-base),
        transform        var(--ease-base) !important;
}

.wpforms-container .wpforms-form button[type="submit"]:hover,
.wpforms-container .wpforms-form button.wpforms-submit:hover,
.wpforms-container .wpforms-form .wpforms-submit:hover {
    background-color: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
    color: var(--color-white) !important;
    transform: translateY( -1px );
}

.wpforms-container .wpforms-form button[type="submit"]:focus-visible,
.wpforms-container .wpforms-form button.wpforms-submit:focus-visible,
.wpforms-container .wpforms-form .wpforms-submit:focus-visible {
    outline: 2px solid var(--color-primary) !important;
    outline-offset: 4px !important;
}

/* Loading state during submit */
.wpforms-container .wpforms-form button.wpforms-submit[disabled],
.wpforms-container .wpforms-form .wpforms-submit[disabled] {
    opacity: 0.6 !important;
    cursor: not-allowed !important;
    transform: none !important;
}

/* ---- Validation errors ---- */

.wpforms-container .wpforms-form .wpforms-error,
.wpforms-container .wpforms-form label.wpforms-error {
    color: var(--color-error);
    font-family: var(--font-body);
    font-size: var(--text-sm);
    font-weight: var(--fw-medium);
    margin-top: var(--space-2);
    text-transform: none;
    letter-spacing: normal;
}

.wpforms-container .wpforms-form input.wpforms-error,
.wpforms-container .wpforms-form textarea.wpforms-error,
.wpforms-container .wpforms-form select.wpforms-error {
    border-color: var(--color-error) !important;
}

/* ---- Success confirmation ---- */

.wpforms-confirmation-container-full,
.wpforms-confirmation-container {
    background-color: rgba( var(--color-primary-rgb), 0.08 ) !important;
    border: 1px solid var(--color-primary) !important;
    border-radius: var(--radius-lg) !important;
    padding: var(--space-6) var(--space-8) !important;
    font-family: var(--font-body) !important;
    font-size: var(--text-body-lg) !important;
    line-height: var(--leading-body) !important;
    color: var(--color-text) !important;
    margin: 0 !important;
}

.wpforms-confirmation-container-full p,
.wpforms-confirmation-container p {
    margin: 0;
    color: var(--color-text);
}

.wpforms-confirmation-container-full p + p,
.wpforms-confirmation-container p + p {
    margin-top: var(--space-3);
}

/* ---- Multi-column row layout ---- */

.wpforms-container .wpforms-form .wpforms-field-row {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: var(--space-4) !important;
}

@media ( max-width: 640px ) {
    .wpforms-container .wpforms-form .wpforms-field-row {
        grid-template-columns: 1fr !important;
    }

    .wpforms-container .wpforms-form button[type="submit"],
    .wpforms-container .wpforms-form button.wpforms-submit,
    .wpforms-container .wpforms-form .wpforms-submit {
        width: 100% !important;
        justify-content: center !important;
    }
}

/* ---- Reduced motion ---- */

@media ( prefers-reduced-motion: reduce ) {
    .wpforms-container .wpforms-form input,
    .wpforms-container .wpforms-form textarea,
    .wpforms-container .wpforms-form select,
    .wpforms-container .wpforms-form button { transition: none !important; }

    .wpforms-container .wpforms-form button:hover { transform: none !important; }
}