/* Onboarding wizard -- reuses registration.css's .npca-v2-field/.npca-v2-field-row/.npca-v2-button
   rules (all three stylesheets are enqueued together). Design tokens (--match-*) fact-found from
   the live /match/ landing page 2026-07-04 -- see docs/20-v2-runtime-configuration-architecture.md
   addendum. Kept deliberately compact per Nathan's "avoid excessive vertical space" direction. */

.npca-v2-onboarding-section-card {
    border: 2px solid var(--match-border, #E2E8EE);
    border-radius: var(--radius-card, 14px);
}

/* .npca-v2-role-badge lives in dashboard.css (shared with the dashboard's user-identity card;
   dashboard.css is enqueued on both pages). */
.npca-v2-role-badge {
    margin-bottom: 12px;
}

/* Stepper -- one compact row, not a tall vertical panel. */
.npca-v2-stepper {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    list-style: none;
    margin: 0 0 16px;
    padding: 0;
}

.npca-v2-stepper__step a {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: 999px;
    text-decoration: none;
    color: var(--match-ink, #272F3D);
    background: var(--match-surface-tint, #F3F9F5);
    font-size: 0.85em;
    font-weight: 600;
    white-space: nowrap;
}

.npca-v2-stepper__step.is-current a {
    background: var(--brand-primary, #2E7D32);
    color: #fff;
}

.npca-v2-stepper__step.is-done a {
    background: var(--match-border, #E2E8EE);
}

.npca-v2-stepper__index {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.35);
    font-size: 0.85em;
}

/* Fieldsets group a labeled option set (checkbox/radio grids) without extra vertical padding. */
.npca-v2-fieldset {
    border: none;
    padding: 0;
    margin: 0 0 16px;
}

.npca-v2-fieldset legend {
    font-weight: 600;
    margin-bottom: 6px;
    padding: 0;
}

.npca-v2-checkbox-grid,
.npca-v2-radio-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 6px 16px;
}

.npca-v2-checkbox-grid__item,
.npca-v2-radio-grid__item {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: normal;
    cursor: pointer;
}

/* "Select all" master checkbox (2026-07-07) -- see templates/components/checkbox-group.php's
   $checkbox_group_select_all_label and assets/js/onboarding.js's data-select-all-target handler.
   Styled distinctly from a normal grid item (bold, own row, bottom border) since it acts on the
   whole group below it rather than being one more option among many. */
.npca-v2-checkbox-grid__select-all {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
    cursor: pointer;
    padding-bottom: 8px;
    margin-bottom: 8px;
    border-bottom: 1px solid var(--match-border, #E2E8EE);
}

.npca-v2-reveal {
    margin-top: 8px;
}

.npca-v2-required {
    color: #8A1F17;
}

.npca-v2-wizard-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 20px;
}

.npca-v2-onboarding-form textarea {
    width: 100%;
    box-sizing: border-box;
    padding: 10px 12px;
    border: 1px solid #ccc;
    border-radius: calc(var(--radius-card, 14px) / 2);
    font: inherit;
    resize: vertical;
}

.npca-v2-onboarding-form select {
    width: 100%;
    box-sizing: border-box;
    padding: 10px 12px;
    border: 1px solid #ccc;
    border-radius: calc(var(--radius-card, 14px) / 2);
    font: inherit;
}

/* Section D -- legal scaffold, deliberately calm/informational, not alarming. */
.npca-v2-legal-scaffold-notice {
    background: var(--match-surface-tint, #F3F9F5);
    border: 1px solid var(--match-border, #E2E8EE);
    border-radius: var(--radius-card, 14px);
    padding: 12px 16px;
    margin-bottom: 16px;
}

.npca-v2-legal-doc-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.npca-v2-legal-doc-list li {
    padding: 6px 0;
    border-bottom: 1px solid var(--match-border, #E2E8EE);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.npca-v2-legal-doc-list li:last-child {
    border-bottom: none;
}

.npca-v2-badge {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 999px;
    font-size: 0.75em;
    font-weight: 600;
    background: var(--brand-primary, #2E7D32);
    color: #fff;
    white-space: nowrap;
}

.npca-v2-badge--muted {
    background: var(--match-border, #E2E8EE);
    color: var(--match-ink, #272F3D);
}

/* 2026-07-05 visual QA fix: the shared .npca-v2-button base rule (12px 24px padding, no explicit
   font-size) is sized for a standalone page CTA (Continue, Submit) -- in this compact inline list
   row it read as oversized/out of proportion next to a small text badge. Scoped to this list only
   so the base rule (still used correctly elsewhere -- onboarding wizard actions, registration
   submit) is untouched. */
.npca-v2-legal-doc-list .npca-v2-button {
    padding: 4px 14px;
    font-size: 0.85em;
    align-self: center;
}

/* Settings tab email-verification row (2026-07-06) -- pill + inline resend button, sized to sit
   naturally inside a .npca-v2-legal-doc-list row alongside the other (still "Coming soon") items. */
.npca-v2-settings-verify {
    display: flex;
    align-items: center;
    gap: 10px;
}

.npca-v2-settings-verify__form {
    margin: 0;
}

.npca-v2-settings-verify__resend,
.npca-v2-verify-banner__resend {
    font: inherit;
    font-size: 0.85em;
    font-weight: 600;
    padding: 4px 14px;
    border: 1px solid var(--brand-primary, #009245);
    border-radius: 999px;
    background: transparent;
    color: var(--brand-primary, #009245);
    cursor: pointer;
    white-space: nowrap;
}

.npca-v2-settings-verify__resend:hover,
.npca-v2-verify-banner__resend:hover {
    background: var(--brand-primary, #009245);
    color: #fff;
}

.npca-v2-fine-print {
    font-size: 0.85em;
}

/* Section E -- submit readiness states. */
.npca-v2-status-card--attention {
    border-left: 4px solid #8A1F17;
}

.npca-v2-status-card--ready {
    border-left: 4px solid var(--brand-primary, #2E7D32);
}

.npca-v2-error-list {
    margin: 8px 0;
    padding-left: 20px;
}