/* Email and phone verification blocks on the order form. Uses the theme's colour tokens. */
.verify-box { display: grid; gap: 10px; margin-top: -4px; padding: 12px 14px; border: 1px dashed var(--line-strong, #c9cbd0); border-radius: 12px; background: var(--paper, #f2f3f5); }
.verify-box__row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
.verify-box__row[hidden] { display: none; }
.verify-box__status { margin: 0; flex: 1 1 220px; font-size: .9rem; color: var(--muted, #4f596c); }
.verify-box input[data-verify-code] { width: 10.5em; padding: 10px 12px; border: 1px solid var(--line-strong, #c9cbd0); border-radius: 10px; font-family: var(--mono, monospace); font-size: 1.05rem; letter-spacing: .25em; text-align: center; background: var(--surface, #fff); color: var(--text, #0b1220); }
.verify-box input[data-verify-code]:focus-visible { outline: 2px solid var(--accent, #e5242e); outline-offset: 2px; }
.verify-box[data-state="ok"] { border-style: solid; border-color: #1f9d57; background: rgba(31, 157, 87, .08); }
.verify-box[data-state="ok"] .verify-box__status { color: #157a3c; font-weight: 600; }
.verify-box[data-state="error"] .verify-box__status,
.verify-box[data-state="warn"] .verify-box__status { color: var(--accent-text, #b81720); }
.verify-box .btn--sm { padding: 8px 14px; font-size: .9rem; }
.verify-box input[data-verify-code]::placeholder { letter-spacing: normal; font-family: var(--font, sans-serif); font-size: .9rem; }