/*
 * Frontend waitlist form – Bricks Builder tokens
 * Inputs/selects base styles come from theme + forms.css
 */

.dwl-form-wrap { font-family: inherit; }
.dwl-form { display: flex; flex-direction: column; gap: var(--spacing-xl); }
.dwl-form[hidden] { display: none; }
.dwl-form-inline .dwl-form { flex-direction: row; flex-wrap: wrap; align-items: flex-end; }
.dwl-form-inline .dwl-field { flex: 1 1 200px; }
.dwl-form-inline .dwl-field-submit { flex: 0 0 auto; }

.dwl-field label:not(.dwl-radio) {
    display: block;
    font-size: var(--text-sm);
    line-height: var(--leading-sm);
    font-weight: var(--font-medium);
    color: var(--gray-700);
    margin-bottom: var(--spacing-xs);
}

/* ─── Inputs (based on drpm-listings-v2 Input component) ─── */
.dwl-field input[type="email"],
.dwl-field input[type="text"],
.dwl-field input[type="tel"],
.dwl-field select,
.dwl-field textarea {
    width: 100%;
    min-height: 2.75rem;
    padding: 0.625rem 0.875rem;
    background: var(--white);
    border: 1px solid var(--gray-300);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-xs);
    font-size: var(--text-sm);
    line-height: var(--leading-sm);
    font-weight: var(--font-regular);
    color: var(--gray-900);
    box-sizing: border-box;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
    outline: none;
}
.dwl-field input::placeholder,
.dwl-field textarea::placeholder {
    color: var(--gray-500);
    font-weight: var(--font-regular);
}
.dwl-field input:focus,
.dwl-field select:focus,
.dwl-field textarea:focus {
    border-color: var(--brand-500);
    box-shadow: 0 0 0 4px rgba(80, 124, 109, 0.24), var(--shadow-xs);
}
.dwl-field input:-webkit-autofill,
.dwl-field input:-webkit-autofill:hover,
.dwl-field input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 1000px var(--white) inset;
    -webkit-text-fill-color: var(--gray-900);
    transition: background-color 5000s ease-in-out 0s;
}

.dwl-required { color: var(--brand-600); }

.dwl-email-status { font-size: var(--text-xs); }
.dwl-email-status:not(:empty) { margin-top: var(--spacing-xs); }
.dwl-email-status.dwl-es-ok { color: #17B26A; }
.dwl-email-status.dwl-es-warn { color: #F79009; }
.dwl-email-status.dwl-es-error { color: #F04438; }
.dwl-email-status.dwl-es-info {
    font-size: var(--text-sm);
    font-weight: var(--font-medium);
    color: var(--brand-700);
    background: var(--brand-50);
    border-radius: var(--radius-md);
    padding: var(--spacing-md) var(--spacing-lg);
    margin-top: var(--spacing-md);
}
.dwl-email-status.dwl-es-info a {
    display: block;
    margin-top: var(--spacing-xs);
    color: var(--brand-600);
    font-weight: var(--font-semibold);
    text-decoration: none;
}
.dwl-email-status.dwl-es-info a:hover { color: var(--brand-700); text-decoration: underline; }

/* ─── Subscribe-to field ─── */
.dwl-field-type { display: flex; flex-direction: column; gap: var(--spacing-md); }
.dwl-field-label {
    font-size: var(--text-sm);
    line-height: var(--leading-sm);
    font-weight: var(--font-medium);
    color: var(--gray-700);
}

/* ─── Custom Radio (Untitled UI) ─── */
label.dwl-radio,
.dwl-form-wrap .dwl-radio,
.dwl-manage-wrap .dwl-radio {
    display: inline-flex;
    align-items: flex-start;
    gap: var(--spacing-md);
    font-size: var(--text-xs);
    line-height: var(--leading-xs);
    color: var(--gray-700);
    font-weight: var(--font-medium);
    cursor: pointer;
    user-select: none;
    margin-bottom: 0;
}
.dwl-radio input[type="radio"],
.dwl-radio input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.dwl-radio__dot {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 1.25rem;
    height: 1.25rem;
    background: var(--white);
    border: 1px solid var(--gray-300);
    border-radius: var(--radius-full);
    transition: all 0.15s ease;
    margin-top: 0.0625rem;
}
.dwl-radio__dot::after {
    content: '';
    width: 0.5rem;
    height: 0.5rem;
    border-radius: var(--radius-full);
    background: var(--white);
    opacity: 0;
    transition: opacity 0.15s ease;
}
.dwl-radio:hover .dwl-radio__dot {
    border-color: var(--brand-600);
}
.dwl-radio input[type="radio"]:checked + .dwl-radio__dot {
    background: var(--brand-600);
    border-color: var(--brand-600);
}
.dwl-radio input[type="radio"]:checked + .dwl-radio__dot::after {
    opacity: 1;
}
.dwl-radio input[type="radio"]:focus-visible + .dwl-radio__dot {
    outline: 2px solid var(--brand-600);
    outline-offset: 2px;
}

/* ─── Custom Checkbox (Untitled UI) ─── */
.dwl-checkbox__box {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 1.25rem;
    height: 1.25rem;
    background: var(--white);
    border: 1px solid var(--gray-300);
    border-radius: var(--radius-sm);
    transition: all 0.15s ease;
    margin-top: 0.0625rem;
}
.dwl-checkbox__box svg {
    width: 0.875rem;
    height: 0.875rem;
    color: var(--white);
    opacity: 0;
    transition: opacity 0.15s ease;
}
.dwl-radio:hover .dwl-checkbox__box {
    border-color: var(--brand-600);
}
.dwl-radio input[type="checkbox"]:checked + .dwl-checkbox__box {
    background: var(--brand-600);
    border-color: var(--brand-600);
}
.dwl-radio input[type="checkbox"]:checked + .dwl-checkbox__box svg {
    opacity: 1;
}
.dwl-radio input[type="checkbox"]:focus-visible + .dwl-checkbox__box {
    outline: 2px solid var(--brand-600);
    outline-offset: 2px;
}

/* ─── Consent ─── */
.dwl-consent-label {
    font-size: var(--text-xs);
    line-height: var(--leading-xs);
    color: var(--gray-600);
    font-weight: var(--font-regular);
}
.dwl-consent-label a { color: var(--brand-600); }
.dwl-consent-label a:hover { color: var(--brand-700); }

/* ─── Submit ─── */
.dwl-submit {
    width: 100%;
    padding: var(--spacing-md) var(--spacing-xl);
    background: var(--brand-600);
    color: var(--white);
    border: 1px solid var(--brand-600);
    border-radius: var(--radius-md);
    font-size: var(--text-md);
    line-height: var(--leading-md);
    font-weight: var(--font-semibold);
    cursor: pointer;
    transition: all 0.15s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-md);
    box-shadow: var(--shadow-xs);
}
.dwl-submit:hover { background: var(--brand-700); border-color: var(--brand-700); }
.dwl-submit:focus { outline: none; box-shadow: 0 0 0 2px var(--white), 0 0 0 4px var(--brand-300); }
.dwl-submit:disabled { opacity: .6; cursor: not-allowed; }

/* ─── Messages ─── */
.dwl-message {
    padding: var(--spacing-lg) var(--spacing-xl);
    border-radius: var(--radius-lg);
    font-size: var(--text-sm);
    margin-top: var(--spacing-xs);
}
.dwl-message.dwl-msg-error { background: #FEF3F2; color: #B42318; border: 1px solid #FECDCA; }
.dwl-message.dwl-msg-info { background: var(--brand-50); color: var(--brand-800); border: 1px solid var(--brand-200); }

/* ─── Success ─── */
.dwl-success { text-align: center; padding: var(--spacing-4xl) var(--spacing-xl); animation: dwlFadeIn .4s ease; }
.dwl-success-icon svg { animation: dwlCheck .5s ease .1s both; }
.dwl-success-title { margin: var(--spacing-xl) 0 var(--spacing-md); font-size: var(--display-xs); color: var(--gray-900); }
.dwl-success-text { color: var(--gray-500); font-size: var(--text-sm); margin: 0 0 var(--spacing-lg); }
.dwl-success-link { color: var(--brand-600); font-size: var(--text-sm); font-weight: var(--font-medium); }
.dwl-success-link:hover { color: var(--brand-700); }

@keyframes dwlFadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@keyframes dwlCheck { from { stroke-dashoffset: 24; } to { stroke-dashoffset: 0; } }

/* ─── Demand indicator ─── */
.dwl-demand-indicator {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    padding: var(--spacing-md) var(--spacing-lg);
    background: #FFFAEB;
    border: 1px solid #FEDF89;
    border-radius: var(--radius-lg);
    margin-bottom: var(--spacing-xl);
    font-size: var(--text-sm);
    color: #93370D;
}

/* ─── Preferences ─── */
.dwl-preferences-section { margin-top: calc(-1 * var(--spacing-xs)); }
.dwl-prefs-toggle {
    background: none;
    border: none;
    color: var(--brand-600);
    font-size: var(--text-xs);
    cursor: pointer;
    padding: 0;
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);
    font-weight: var(--font-medium);
}
.dwl-prefs-toggle:hover { color: var(--brand-700); }
.dwl-prefs-toggle .dwl-chevron { font-size: 10px; transition: transform .2s; }
.dwl-prefs-toggle[aria-expanded="true"] .dwl-chevron { transform: rotate(180deg); }
.dwl-prefs-fields {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-lg);
    margin-top: var(--spacing-lg);
    padding: var(--spacing-xl);
    background: var(--gray-50);
    border-radius: var(--radius-lg);
}
.dwl-checkbox-group { display: flex; flex-wrap: wrap; gap: var(--spacing-lg); }

/* ─── Phone error ─── */
.dwl-phone-error {
    font-size: var(--text-xs);
    line-height: var(--leading-xs);
    color: #F04438;
    margin-top: var(--spacing-xs);
}

/* ─── Honeypot ─── */
.dwl-hp { position: absolute; left: -9999px; opacity: 0; height: 0; overflow: hidden; }