/* Signup page — CSP-safe styles (extracted from inline style= attributes) */

.auth-card--signup { max-width: 440px; }

/* ── Step progress indicator ─────────────────────────────────────── */
.signup-progress { display: flex; align-items: center; gap: .5rem; margin-bottom: 1.25rem; }
.signup-step-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--color-border); transition: background .2s; }
.signup-step-dot--active { background: var(--color-brand); }
.signup-step-line { flex: 1; height: 2px; background: var(--color-border); border-radius: 1px; }
.signup-step-fill { width: 0%; height: 100%; background: var(--color-brand); border-radius: 1px; transition: width .3s ease; }
.signup-step-label { font-size: .78rem; color: var(--color-muted); margin-left: .25rem; white-space: nowrap; }

/* ── Shared step headings ────────────────────────────────────────── */
.signup-title { margin-bottom: .25rem; }
.signup-subtitle { margin-bottom: 1.25rem; }

/* ── Password strength bar ───────────────────────────────────────── */
.pwd-strength-bg { height: 4px; border-radius: 2px; background: var(--color-border); margin-top: .375rem; overflow: hidden; }
.pwd-strength-bar { height: 100%; width: 0; border-radius: 2px; transition: width .2s, background .2s; }

/* ── Checkbox + label rows ───────────────────────────────────────── */
.form-group--check { display: flex; flex-direction: row; align-items: flex-start; gap: .5rem; margin-top: .5rem; }
.form-check-input { margin-top: 3px; flex-shrink: 0; }
.form-check-label { font-size: .875rem; line-height: 1.4; cursor: pointer; }
.form-check-note { color: var(--color-muted); }

/* ── Step 1 error + CTA ─────────────────────────────────────────── */
.signup-error { color: var(--color-danger, #dc2626); font-size: .82rem; margin: .5rem 0; }
.signup-next-btn { margin-top: .75rem; }

/* ── Step 2 button row ───────────────────────────────────────────── */
.signup-btn-row { display: flex; gap: .75rem; margin-top: .75rem; }
.signup-back-btn { flex: 0 0 auto; }
.signup-submit-btn { flex: 1; }

/* ── Misc field notes ────────────────────────────────────────────── */
.field-note { font-size: .75rem; color: var(--color-muted); }
