/* Multi-step registration (signup.html + signup-flow.js).
   Built on auth-redesign.css: same tokens, same field and button styles.
   Only what the four screens add lives here. */

.reg-counter{font-size:12.5px;font-weight:700;color:var(--ax-muted);margin:2px 0 10px;text-align:center}
.reg-counter-n{color:var(--ax-ink)}
.reg-bar{display:flex;gap:6px;margin:0 0 20px}
.reg-bar span{flex:1;height:4px;border-radius:4px;background:var(--ax-line);transition:background .25s}
.reg-bar span.on{background:var(--ax-grad)}

/* Inline field errors: under the field, in red, naming what is wrong. */
.reg-err{font-size:12px;color:#d93036;margin-top:6px;line-height:1.4;min-height:0}
.reg-err:empty{display:none}
.field.has-err .lf-input,
.field.has-err .phone-input{border-color:#e5484d;box-shadow:0 0 0 4px rgba(229,72,77,.10)}
.field.has-err .checkbox input{border-color:#e5484d}

/* More than two fields failing at once: a summary on top of the step. */
.reg-summary{border:1px solid #f3c2c4;background:#fff5f5;color:#9b1c22;border-radius:12px;padding:10px 14px;font-size:13px;line-height:1.45;margin-bottom:16px}
.reg-summary[hidden]{display:none}
.reg-summary ul{margin:6px 0 0;padding-left:18px}
.reg-summary a{color:inherit;text-decoration:underline}

/* Selects styled like the text inputs. */
.reg-select select{flex:1;border:none;outline:none;background:transparent;font-size:14px;color:var(--ax-ink);height:100%;min-width:0;font-family:inherit;cursor:pointer}

.reg-fieldset{border:none;margin:0 0 4px;padding:0}
.reg-fieldset legend{font-size:13px;font-weight:700;color:var(--ax-ink);margin-bottom:10px;padding:0}
.reg-row{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:12px}
@media (max-width:420px){.reg-row{grid-template-columns:1fr;gap:0}}

/* VAT number with its country prefix shown. */
.reg-prefixed{gap:0}
.reg-prefix{flex:none;font-weight:700;font-size:13px;color:var(--ax-muted);padding-right:10px;margin-right:10px;border-right:1px solid var(--ax-line);letter-spacing:.02em}
.reg-dial-locked{display:flex;align-items:center;font-weight:700;color:var(--ax-ink);cursor:default;user-select:none}

.reg-vat-result{margin-top:8px;font-size:12.5px;border-radius:10px;padding:8px 12px;line-height:1.45}
.reg-vat-result[hidden]{display:none}
.reg-vat-result.ok{background:#ecfbf5;color:#0b6e52;border:1px solid #bfeedd}
.reg-vat-result.pending{background:#fff8eb;color:#8a5a00;border:1px solid #f6dfae}
.reg-checking{text-align:center;margin-top:10px}
.reg-checking[hidden]{display:none}

/* Password rules: advisory meter above, the four gates as a live checklist. */
.reg-rules{list-style:none;margin:10px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:4px 12px;font-size:12px;color:var(--ax-muted)}
.reg-rules li{position:relative;padding-left:18px}
.reg-rules li::before{content:'';position:absolute;left:0;top:4px;width:10px;height:10px;border-radius:50%;border:2px solid #c9d1e3;box-sizing:border-box}
.reg-rules li.met{color:var(--ax-green)}
.reg-rules li.met::before{border-color:var(--ax-green);background:var(--ax-green)}
@media (max-width:420px){.reg-rules{grid-template-columns:1fr}}

.reg-consent{margin-top:4px}

/* Verification screen. */
.reg-change{text-align:center;margin:-6px 0 14px;font-size:13px}
.reg-alert{border:1px solid #f3c2c4;background:#fff5f5;color:#9b1c22;border-radius:12px;padding:10px 14px;font-size:13px;margin-bottom:14px}
.reg-alert[hidden]{display:none}
.reg-ttl{text-align:center}
.reg-verify-err{text-align:center}
.otp-row.busy .otp-cell{opacity:.6}
.otp-row.locked .otp-cell{background:#f3f4f8;cursor:not-allowed}

/* Continue is aria-disabled (not disabled) until the step passes, so a press
   can still reveal every missing field. */
.reg-continue[aria-disabled="true"]{opacity:.55;cursor:not-allowed;animation:none;transform:none}
.reg-continue[aria-disabled="true"]:hover{transform:none}

/* The decorative blobs make the shell 600+ px wide inside its overflow:hidden.
   A hidden overflow can still be scrolled by script and by scroll-into-view,
   which slid this taller page sideways on phones. clip cannot scroll at all;
   browsers without it keep the hidden from auth-redesign.css. */
@supports (overflow: clip) { .auth-shell { overflow: clip; } }
