/* lead-wizard.css — shared layout classes for the LEAD wizard mockups.
 * These live in CampaignCreate.vue's <style scoped> in the real app (NOT in wizard.css),
 * so they are reproduced here once and linked by every screen-09L*.html.
 * Load order per screen:  tokens.css (app shell) → wizard.css (real tokens + w-*) → lead-wizard.css */

.wizard-root .wizard-header { margin-bottom: 24px; }
.wizard-root .wizard-header .w-h1 { margin: 0 0 16px; }
.wizard-root .save-status { margin: 12px 0 0; font-size: 11px; color: #706b64; font-family: var(--f-mono); }
.wizard-root .wizard-body { min-height: 400px; margin-bottom: 24px; }
.wizard-root .wizard-footer { display: flex; justify-content: space-between; align-items: center; padding-top: 8px; }
.wizard-root .wizard-footer .is-step-one { opacity: .5; }
.wizard-root .wizard-forward { display: flex; align-items: center; gap: 12px; }
.wizard-root .wizard-gate-hint { margin: 0; font-size: 11px; color: #8a2618; }
.wizard-root .wizard-step { display: flex; flex-direction: column; gap: 16px; }
.wizard-root .w-crumb { font-size: 12px; color: var(--n-500); text-decoration: none; display: inline-flex; align-items: center; gap: 4px; margin-bottom: 6px; }

/* currency input (Step2BudgetBidding.vue scoped) */
.wizard-root .budget-input { display: flex; align-items: stretch; }
.wizard-root .budget-input .currency-prefix { display: inline-flex; align-items: center; padding: 0 10px; border: 1px solid var(--n-200); border-right: 0; border-radius: var(--r-md) 0 0 var(--r-md); background: var(--n-50); color: var(--n-600); font-size: 13px; }
.wizard-root .budget-input .w-input { border-radius: 0 var(--r-md) var(--r-md) 0; }
.wizard-root .amount-suffix { display: inline-flex; align-items: center; padding: 0 10px; border: 1px solid var(--n-200); border-left: 0; border-radius: 0 var(--r-md) var(--r-md) 0; background: var(--n-50); color: var(--n-600); font-size: 13px; }
.wizard-root .amount-suffix.left { border-left: 1px solid var(--n-200); border-radius: 0 var(--r-md) var(--r-md) 0; }