/* =============================================================================
   REGISTRATION ACCOUNT-TYPE MODALS
   Modifier styles only — base panel/backdrop/close-button come from the theme's
   shared modal.css (.waves-modal, .waves-modal__close, #waves-modal-backdrop).
   ========================================================================== */

/* ── Login-page registration trigger (waves-custom-login-buttons plugin) ─── */

.clb-registration {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    margin-top: 20px;
    margin-bottom: 40px;
}

.clb-registration__intro {
    color: var(--text-default);
    margin: 0;
}

.clb-registration__noscript-links {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}

/* ── Account-type selector modal ──────────────────────────────────────────── */

.waves-account-type-modal {
    width: min(620px, 92vw);
}

.waves-account-type-modal__header {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.waves-account-type-modal__title {
    font-family: var(--font-heading);
    font-size: var(--font-size-h4);
    font-weight: 600;
    color: var(--text-muted);
    margin: 0;
}

.waves-account-type-modal__subtitle {
    font-family: var(--font-heading);
    font-size: var(--font-size-h3);
    color: var(--text-heading);
    margin: 0;
}

.waves-account-type-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.waves-account-type-group__label {
    font-size: var(--font-size-small);
    font-weight: 600;
    color: var(--text-muted);
    margin: 0;
}

.waves-account-type-group__buttons {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.waves-account-type-group__buttons > .waves-button {
    flex: 1 1 220px;
    max-width: none;
    justify-content: center;
}

/* ── Page-specific confirmation modals ────────────────────────────────────── */

.waves-registration-confirm {
    width: min(520px, 92vw);
}

.waves-registration-confirm__title {
    font-family: var(--font-heading);
    font-size: var(--font-size-h4);
    color: var(--text-heading);
    margin: 0;
}

.waves-registration-confirm__body,
.waves-registration-confirm__question {
    color: var(--text-default);
    margin: 0;
}

.waves-registration-confirm__hint {
    font-size: var(--font-size-small);
    color: var(--text-muted);
    margin: 0;
}

.waves-registration-confirm__actions {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.waves-registration-confirm__actions > .waves-button {
    max-width: none;
    text-align: center;
}

@media (max-width: 600px) {
    .waves-account-type-group__buttons {
        flex-direction: column;
    }
}