/*
 * Alamo Ad Valorem onboarding. Every rule is scoped to .aav-onb; nothing here touches the host theme.
 *
 * Skins (set by [aav_onboarding skin="..."]):
 *   site  (default): matches the current alamoadvalorem.com theme (navy #282E3F, gold #B1976B, Poppins/Roboto).
 *   brand: the 2026 brand kit (carbon/ivory, slate, tan, Source Serif 4/Inter) for the redesign.
 * Only the token blocks differ; components read tokens. Sizes are px so a theme's root font size can't shrink them.
 * All text/background pairs are WCAG AA (ratios noted per token).
 */

/* ---------- Tokens ---------- */

.aav-onb {
	--aav-band: #282e3f;          /* header band (site navy) */
	--aav-band-text: #ffffff;     /* 13.5:1 on band */
	--aav-band-muted: #c9ccd4;    /* 8.4:1 on band */
	--aav-band-accent: #b1976b;   /* 4.84:1 on band */
	--aav-band-line: rgba(255, 255, 255, 0.16);
	--aav-surface: #ffffff;
	--aav-surface-alt: #f7f4ee;   /* notices, summary, document */
	--aav-heading: #1c1b1b;       /* 17.2:1 on white */
	--aav-text: #363636;          /* 12.1:1 */
	--aav-muted: #5c5f66;         /* 6.4:1 on white, 5.8:1 on alt */
	--aav-accent: #b1976b;        /* fills and rules only; never text on white */
	--aav-accent-text: #7a6337;   /* 5.7:1 on white, 5.2:1 on alt */
	--aav-on-accent: #282e3f;     /* 4.84:1 on accent */
	--aav-strong: #282e3f;        /* hover fill, 13.5:1 with white */
	--aav-line: #e4e1da;          /* decorative dividers */
	--aav-control: #767b85;       /* control borders, 4.25:1 on white */
	--aav-error: #a12622;         /* 7.5:1 on white */
	--aav-focus: #282e3f;
	--aav-band-focus: #b1976b;
	--aav-disabled-bg: #ece9e3;
	--aav-disabled-text: #4a4d55; /* 7.0:1 on disabled bg */
	--aav-radius: 3px;
	--aav-font-heading: Poppins, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;
	--aav-font-body: Roboto, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;
	--aav-font-label: var(--aav-font-heading); /* eyebrows, buttons, table heads */
	--aav-heading-weight: 600;
	--aav-button-case: uppercase;
	--aav-pad: 40px;
}

.aav-onb[data-skin="brand"] {
	--aav-band: #14191c;
	--aav-band-text: #f8f5ef;
	--aav-band-muted: #9c9891;
	--aav-band-accent: #b1976b;
	--aav-band-line: #333a3b;
	--aav-surface: #efebe3;
	--aav-surface-alt: #f8f5ef;
	--aav-heading: #0f1315;
	--aav-text: #3e403e;        /* graphite: body text on ivory */
	--aav-muted: #3e403e;
	--aav-accent: #6e5a34;
	--aav-accent-text: #6e5a34;
	--aav-on-accent: #efebe3;
	--aav-strong: #0f1315;
	--aav-line: #c9c4b9;
	--aav-control: #3e403e;
	--aav-focus: #6e5a34;
	--aav-disabled-bg: #e3ded4;
	--aav-disabled-text: #3e403e;
	--aav-error: #b3261e;       /* error-deep: form errors on light backgrounds */
	--aav-radius: 0;
	--aav-font-heading: "Source Serif 4", Georgia, "Times New Roman", serif;
	--aav-font-body: Inter, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;
	--aav-font-label: var(--aav-font-body);
	--aav-heading-weight: 400;
	--aav-button-case: none;
}

/* ---------- Root and scoped reset (neutralizes theme element rules) ---------- */

.aav-onb {
	container: aav-onb / inline-size; /* Layout follows the theme's content column, not the viewport. */
	margin: 0 0 32px;
	border: 1px solid var(--aav-line);
	background: var(--aav-surface);
	color: var(--aav-text);
	font-family: var(--aav-font-body);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.6;
	text-align: left;
	-webkit-font-smoothing: antialiased;
}

.aav-onb *,
.aav-onb *::before,
.aav-onb *::after { box-sizing: border-box; }

.aav-onb h2,
.aav-onb h3,
.aav-onb h4 {
	clear: none;
	margin: 0;
	padding: 0;
	color: var(--aav-heading);
	font-family: var(--aav-font-heading);
	font-weight: var(--aav-heading-weight);
	letter-spacing: 0;
	text-transform: none;
}

.aav-onb p,
.aav-onb ul,
.aav-onb ol,
.aav-onb dl,
.aav-onb dd,
.aav-onb fieldset,
.aav-onb legend,
.aav-onb form,
.aav-onb table { margin: 0; padding: 0; }

.aav-onb p { color: inherit; font-size: 16px; line-height: 1.6; }
.aav-onb ul,
.aav-onb ol { list-style: none; }
.aav-onb li { margin: 0; padding: 0; }
.aav-onb dt { padding: 0; font-weight: 400; }
.aav-onb fieldset { min-width: 0; border: 0; }
.aav-onb legend { display: block; width: auto; border: 0; color: inherit; font-size: 15px; line-height: 1.4; }
.aav-onb label { display: block; margin: 0; }
.aav-onb small { font-size: 14px; font-weight: 400; }
.aav-onb strong { font-weight: 600; }
.aav-onb table { border-collapse: collapse; border-spacing: 0; }
.aav-onb th,
.aav-onb td { border: 0; }

.aav-onb button {
	margin: 0;
	box-shadow: none;
	font-family: var(--aav-font-body);
	letter-spacing: 0;
	text-shadow: none;
	transition: background-color 150ms ease-out, color 150ms ease-out, border-color 150ms ease-out;
}

.aav-onb :focus-visible { outline: 2px solid var(--aav-focus); outline-offset: 2px; }
.aav-onb .aav-onb__head :focus-visible { outline-color: var(--aav-band-focus); }

.aav-onb .sr-only {
	position: absolute !important; width: 1px; height: 1px; overflow: hidden;
	clip: rect(0 0 0 0); white-space: nowrap;
}

/* ---------- Header band ---------- */

.aav-onb .aav-onb__head {
	padding: 36px var(--aav-pad) 0;
	background: var(--aav-band);
	color: var(--aav-band-text);
}

.aav-onb .aav-onb__eyebrow {
	margin: 0 0 10px;
	color: var(--aav-accent-text);
	font-family: var(--aav-font-label);
	font-size: 14px;
	font-weight: 500;
	line-height: 1.3;
	letter-spacing: 1px;
	text-transform: uppercase;
}
.aav-onb .aav-onb__head .aav-onb__eyebrow { color: var(--aav-band-accent); }

.aav-onb .aav-onb__title {
	margin: 0 0 10px;
	color: var(--aav-band-text);
	font-size: 32px;
	line-height: 1.2;
}

.aav-onb .aav-onb__lead { max-width: 62ch; margin: 0; color: var(--aav-band-muted); font-size: 16px; }

.aav-onb .aav-onb__demo {
	margin: 24px 0 0;
	padding: 14px 16px;
	border: 1px solid var(--aav-band-accent);
	border-radius: var(--aav-radius);
}
.aav-onb .aav-onb__demo-text { color: var(--aav-band-text); font-size: 15px; line-height: 1.5; }
.aav-onb .aav-onb__demo-label {
	margin-right: 4px;
	color: var(--aav-band-accent);
	font-family: var(--aav-font-label);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 1px;
	text-transform: uppercase;
}

.aav-onb .aav-onb__scenarios { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 12px; }
.aav-onb .aav-onb__scenarios-label { margin-right: 4px; color: var(--aav-band-muted); font-size: 14px; }

.aav-onb .aav-onb__chip {
	min-height: 36px;
	padding: 6px 12px;
	border: 1px solid var(--aav-band-accent);
	border-radius: var(--aav-radius);
	background: transparent;
	color: var(--aav-band-text);
	font-size: 14px;
	font-weight: 400;
	line-height: 1.3;
	text-transform: none;
	cursor: pointer;
}
.aav-onb .aav-onb__chip:hover { background: rgba(177, 151, 107, 0.18); color: var(--aav-band-text); }
.aav-onb .aav-onb__chip[aria-pressed="true"] { background: var(--aav-band-accent); color: var(--aav-band); font-weight: 500; }

/* Progress */
.aav-onb .aav-onb__steps {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	margin: 28px 0 0;
	border-top: 1px solid var(--aav-band-line);
}
.aav-onb .aav-onb__steps li {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 14px 8px 14px 0;
	border-bottom: 3px solid transparent;
	color: var(--aav-band-muted);
	font-size: 15px;
	line-height: 1.3;
}
.aav-onb .aav-onb__steps li[data-state="current"] { border-bottom-color: var(--aav-band-accent); color: var(--aav-band-text); font-weight: 500; }
.aav-onb .aav-onb__steps li[data-state="done"] { color: var(--aav-band-text); }
.aav-onb .aav-onb__step-num {
	display: inline-flex;
	flex: 0 0 26px;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	border: 1px solid var(--aav-band-muted);
	border-radius: 50%;
	font-size: 13px;
	font-weight: 500;
}
.aav-onb .aav-onb__steps li[data-state="current"] .aav-onb__step-num { border-color: var(--aav-band-accent); background: var(--aav-band-accent); color: var(--aav-band); }
.aav-onb .aav-onb__steps li[data-state="done"] .aav-onb__step-num { border-color: var(--aav-band-accent); color: var(--aav-band-accent); }

/* ---------- Body ---------- */

.aav-onb .aav-onb__body { padding: 32px var(--aav-pad) 40px; }
.aav-onb .aav-onb__body--rail { display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: 36px; }
.aav-onb .aav-onb__panel { min-width: 0; }

.aav-onb .aav-onb__panel h2 { margin: 0 0 6px; font-size: 26px; line-height: 1.25; }
.aav-onb .aav-onb__panel > p { max-width: 70ch; margin: 0 0 20px; color: var(--aav-muted); }
.aav-onb .muted { color: var(--aav-muted); }

.aav-onb .aav-onb__group { padding: 22px 0 4px; border-top: 1px solid var(--aav-line); }
.aav-onb .aav-onb__group h3,
.aav-onb .aav-onb__summary h3 { margin: 0 0 14px; font-size: 19px; line-height: 1.3; }

/* Fields */
.aav-onb .aav-onb__row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 20px; }
.aav-onb .aav-onb__row--3 { grid-template-columns: minmax(0, 2fr) minmax(0, 0.7fr) minmax(0, 1fr); }
.aav-onb .aav-onb__row--street { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }

.aav-onb .aav-onb__field { display: flex; flex-direction: column; gap: 6px; min-width: 0; margin: 0 0 18px; }
.aav-onb .aav-onb__field > label,
.aav-onb .aav-onb__field > legend { color: var(--aav-heading); font-size: 15px; font-weight: 500; line-height: 1.4; }
.aav-onb .aav-onb__field small { color: var(--aav-muted); font-size: 14px; line-height: 1.45; }

.aav-onb input[type="text"],
.aav-onb input[type="email"],
.aav-onb input[type="tel"],
.aav-onb input[type="search"],
.aav-onb select {
	width: 100%;
	max-width: 100%;
	height: 48px;
	margin: 0;
	padding: 0 12px;
	border: 1px solid var(--aav-control);
	border-radius: var(--aav-radius);
	background-color: #ffffff;
	box-shadow: none;
	color: var(--aav-heading);
	font-family: var(--aav-font-body);
	font-size: 16px; /* 16px stops iOS zooming on focus */
	line-height: 1.4;
	opacity: 1;
	-webkit-appearance: none;
	appearance: none;
}
.aav-onb select {
	padding-right: 36px;
	background-image: linear-gradient(45deg, transparent 50%, var(--aav-heading) 50%), linear-gradient(135deg, var(--aav-heading) 50%, transparent 50%);
	background-position: calc(100% - 18px) 21px, calc(100% - 13px) 21px;
	background-repeat: no-repeat;
	background-size: 5px 5px, 5px 5px;
	cursor: pointer;
}
.aav-onb input:focus,
.aav-onb select:focus { border-color: var(--aav-focus); outline: 2px solid var(--aav-focus); outline-offset: 0; }
.aav-onb input::placeholder { color: var(--aav-muted); opacity: 1; }
.aav-onb [aria-invalid="true"] { border: 2px solid var(--aav-error); }
.aav-onb .aav-onb__field-error { color: var(--aav-error); font-size: 14px; font-weight: 500; line-height: 1.4; }

/* Radio choices */
.aav-onb .aav-onb__choice { display: flex; flex-direction: row; flex-wrap: wrap; gap: 10px; margin: 0 0 18px; }
.aav-onb .aav-onb__choice legend { width: 100%; margin: 0 0 8px; color: var(--aav-heading); font-size: 15px; font-weight: 500; }
.aav-onb .aav-onb__choice label {
	display: flex;
	align-items: center;
	gap: 10px;
	min-height: 48px;
	padding: 0 16px;
	border: 1px solid var(--aav-control);
	border-radius: var(--aav-radius);
	background: #ffffff;
	color: var(--aav-heading);
	font-size: 15px;
	font-weight: 400;
	cursor: pointer;
}
.aav-onb .aav-onb__choice input[type="radio"],
.aav-onb .aav-onb__choice input[type="checkbox"] {
	flex: none;
	width: 18px;
	height: 18px;
	margin: 0;
	accent-color: var(--aav-strong);
	vertical-align: middle;
}
.aav-onb .aav-onb__choice label:has(input:checked) { border: 2px solid var(--aav-strong); padding: 0 15px; background: var(--aav-surface-alt); font-weight: 500; }
/* Stacked choices with long labels (Form 50-162 Step 6 boxes): one per line, room to wrap. */
.aav-onb .aav-onb__choice--stack { flex-direction: column; gap: 8px; }
.aav-onb .aav-onb__choice--stack label,
.aav-onb .aav-onb__choice--stack label:has(input:checked) { padding-top: 10px; padding-bottom: 10px; line-height: 1.4; }

/* Buttons */
.aav-onb .aav-onb__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 48px;
	padding: 0 24px;
	border: 2px solid var(--aav-accent);
	border-radius: var(--aav-radius);
	background: var(--aav-accent);
	color: var(--aav-on-accent);
	font-family: var(--aav-font-label);
	font-size: 14px;
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: 0.5px;
	text-align: center;
	text-transform: var(--aav-button-case);
	cursor: pointer;
}
.aav-onb .aav-onb__btn::after { content: "→"; font-family: var(--aav-font-body); }
.aav-onb .aav-onb__btn:hover:not(:disabled) { border-color: var(--aav-strong); background: var(--aav-strong); color: #ffffff; }
.aav-onb .aav-onb__btn--secondary { border-color: var(--aav-strong); background: #ffffff; color: var(--aav-strong); }
.aav-onb .aav-onb__btn--secondary::after { content: "+"; }
.aav-onb .aav-onb__btn:disabled {
	border-color: var(--aav-disabled-bg);
	background: var(--aav-disabled-bg);
	color: var(--aav-disabled-text);
	cursor: not-allowed;
}
.aav-onb .aav-onb__btn:disabled::after { content: none; }

.aav-onb .aav-onb__link {
	min-height: 44px;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none;
	color: var(--aav-accent-text);
	font-size: 15px;
	font-weight: 500;
	line-height: 1.2;
	text-decoration: underline;
	text-decoration-color: transparent;
	text-underline-offset: 3px;
	text-transform: none;
	cursor: pointer;
}
.aav-onb .aav-onb__link:hover { background: none; color: var(--aav-strong); text-decoration-color: currentColor; }

.aav-onb .aav-onb__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px 24px;
	margin-top: 20px;
	padding-top: 20px;
	border-top: 1px solid var(--aav-line);
}
.aav-onb .aav-onb__actions .muted { font-size: 14px; }
.aav-onb .aav-onb__actions--end { justify-content: flex-end; }

/* Search */
.aav-onb .aav-onb__search { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr) auto; gap: 0 12px; align-items: end; }
.aav-onb .aav-onb__search .aav-onb__btn { margin-bottom: 18px; }
/* Google address suggestions: a list that drops below an address box (brand guide v1.3). */
.aav-onb .aav-onb__field--suggest { position: relative; }
.aav-onb .aav-onb__suggestions {
	position: absolute;
	z-index: 20;
	top: 100%;
	left: 0;
	right: 0;
	margin: 2px 0 0;
	padding: 4px 0;
	list-style: none;
	border: 1px solid var(--aav-control);
	border-radius: var(--aav-radius);
	background: #ffffff;
	box-shadow: 0 8px 20px rgba(15, 19, 21, 0.12);
}
.aav-onb .aav-onb__suggestions[hidden] { display: none; }
.aav-onb .aav-onb__suggestion { margin: 0; padding: 10px 12px; color: var(--aav-heading); font-size: 15px; line-height: 1.4; cursor: pointer; }
.aav-onb .aav-onb__suggestion:hover,
.aav-onb .aav-onb__suggestion[aria-selected="true"] { background: var(--aav-surface-alt); }
.aav-onb .aav-onb__suggestions-by { margin: 0; padding: 6px 12px 4px; color: var(--aav-muted); font-size: 12px; text-align: right; }
.aav-onb .aav-onb__group > p.muted { margin: 0 0 12px; font-size: 14px; }

/* Records */
.aav-onb .aav-onb__record {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 8px 16px;
	align-items: start;
	padding: 16px 0;
	border-top: 1px solid var(--aav-line);
}
.aav-onb .aav-onb__record:last-child { border-bottom: 1px solid var(--aav-line); }
.aav-onb .aav-onb__record-title { margin: 0; color: var(--aav-heading); font-weight: 500; overflow-wrap: anywhere; }
.aav-onb .aav-onb__record-meta { margin: 2px 0 0; color: var(--aav-muted); font-size: 14px; line-height: 1.5; overflow-wrap: anywhere; }
.aav-onb .aav-onb__record-body { grid-column: 1 / -1; }

.aav-onb .aav-onb__tag {
	display: inline-block;
	margin: 0 6px 2px 0;
	padding: 1px 8px;
	border: 1px solid var(--aav-control);
	border-radius: var(--aav-radius);
	color: var(--aav-text);
	font-size: 13px;
	line-height: 1.5;
	white-space: nowrap;
	vertical-align: 1px;
}
.aav-onb .aav-onb__tag--demo {
	border-color: var(--aav-band);
	background: var(--aav-band);
	padding: 2px 8px;
	color: var(--aav-band-accent);
	font-family: var(--aav-font-label);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.8px;
	text-transform: uppercase;
}

/* Notices */
.aav-onb .aav-onb__notice {
	margin: 12px 0;
	padding: 12px 16px;
	border-left: 4px solid var(--aav-accent);
	background: var(--aav-surface-alt);
	color: var(--aav-text);
}
.aav-onb .aav-onb__notice strong { color: var(--aav-heading); font-weight: 600; }
.aav-onb .aav-onb__notice p { margin: 4px 0 0; color: var(--aav-text); font-size: 15px; }
.aav-onb .aav-onb__notice--quiet { border-left-color: var(--aav-control); }
.aav-onb .aav-onb__notice--error { border-left-color: var(--aav-error); }
.aav-onb .aav-onb__notice--error strong { color: var(--aav-error); }
.aav-onb .aav-onb__provisional { max-width: 420px; margin-top: 12px; }

/* Selected accounts group */
.aav-onb .aav-onb__group--selected { margin-top: 8px; padding: 22px 20px 4px; border: 2px solid var(--aav-accent); border-radius: var(--aav-radius); background: var(--aav-surface-alt); }

/* Tables */
.aav-onb .aav-onb__table-wrap { margin: 8px 0 16px; overflow-x: auto; }
.aav-onb .aav-onb__table { width: 100%; font-size: 15px; }
.aav-onb .aav-onb__table th,
.aav-onb .aav-onb__table td {
	padding: 12px 12px 12px 0;
	border: 0;
	border-bottom: 1px solid var(--aav-line);
	background: none;
	color: var(--aav-text);
	text-align: left;
	vertical-align: top;
}
.aav-onb .aav-onb__table th {
	color: var(--aav-muted);
	font-family: var(--aav-font-label);
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.8px;
	text-transform: uppercase;
}
.aav-onb .aav-onb__table .aav-onb__tag--demo { display: block; width: fit-content; margin: 0 0 6px; }
.aav-onb .aav-onb__table td.rate { color: var(--aav-heading); font-family: var(--aav-font-heading); font-size: 18px; font-weight: 600; white-space: nowrap; }
.aav-onb .aav-onb__table tr[aria-current="true"] td { background: var(--aav-surface-alt); color: var(--aav-heading); font-weight: 600; }
.aav-onb .aav-onb__table tr[aria-current="true"] td:first-child { box-shadow: inset 4px 0 0 var(--aav-accent); }
.aav-onb .aav-onb__table tr td:first-child,
.aav-onb .aav-onb__table tr th:first-child { padding-left: 12px; }

/* Agreement document preview */
.aav-onb .aav-onb__doc { margin-top: 8px; padding: 28px; border: 1px solid var(--aav-line); background: var(--aav-surface-alt); }
.aav-onb .aav-onb__doc h3 { margin: 0 0 6px; font-size: 22px; line-height: 1.3; }
.aav-onb .aav-onb__doc > p.muted { margin: 0 0 8px; }
.aav-onb .aav-onb__doc-eyebrow { display: inline-block; margin-bottom: 14px; padding: 3px 10px; background: var(--aav-band); color: var(--aav-band-accent); font-size: 12px; }
.aav-onb .aav-onb__doc .aav-onb__table td { background: none; }
.aav-onb .aav-onb__slot { padding: 16px 0; border-top: 1px solid var(--aav-line); }
.aav-onb .aav-onb__slot h4 { margin: 0 0 4px; font-size: 16px; line-height: 1.4; }
.aav-onb .aav-onb__slot p { color: var(--aav-muted); font-size: 15px; }
.aav-onb .aav-onb__slot ul { margin: 6px 0 8px; }
.aav-onb .aav-onb__slot li { position: relative; padding-left: 16px; color: var(--aav-text); font-size: 15px; }
.aav-onb .aav-onb__slot li::before { content: ""; position: absolute; top: 0.7em; left: 2px; width: 6px; height: 6px; background: var(--aav-accent); }
.aav-onb #aav-enroll-reason { margin-top: 10px; font-size: 14px; }

/* Summary rail */
.aav-onb .aav-onb__summary {
	position: sticky;
	top: 110px; /* below the theme's sticky header */
	align-self: start;
	padding: 20px;
	border-top: 3px solid var(--aav-accent);
	background: var(--aav-surface-alt);
}
.aav-onb .aav-onb__summary dl { margin: 0 0 12px; }
.aav-onb .aav-onb__summary dl div { display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--aav-line); }
.aav-onb .aav-onb__summary dt { color: var(--aav-muted); font-size: 15px; }
.aav-onb .aav-onb__summary dd { margin: 0; color: var(--aav-heading); font-size: 15px; font-weight: 600; text-align: right; }
.aav-onb .aav-onb__summary p { margin: 0 0 8px; color: var(--aav-muted); font-size: 14px; line-height: 1.5; }
/* "New clients only": bold with a tan bar so returning clients don't miss it. */
.aav-onb .aav-onb__summary p.aav-onb__summary-note { margin: 16px 0 0; padding: 12px 14px; border-left: 4px solid var(--aav-accent); background: var(--aav-surface); color: var(--aav-heading); font-size: 15px; font-weight: 600; line-height: 1.45; }
.aav-onb .aav-onb__status { min-height: 0; font-size: 14px; }
.aav-onb .aav-onb__noscript { padding: 24px var(--aav-pad); }

/* ---------- Agreement document and signature ---------- */

/* Script face for typed signatures (self-hosted; the server renders the stored image with the same file). */
@font-face { font-family: "AAV Signature"; src: url("../fonts/DancingScript.ttf") format("truetype"); font-weight: 400 700; font-display: swap; }

.aav-onb .aav-onb__agreement { margin: 8px 0 20px; padding: 32px 36px; border: 1px solid var(--aav-line); background: var(--aav-surface-alt); color: var(--aav-heading); font-size: 15px; line-height: 1.55; overflow-wrap: anywhere; }
.aav-onb .aav-onb__agreement table { width: 100%; border-collapse: collapse; }
.aav-onb .aav-onb__agreement td,
.aav-onb .aav-onb__agreement th { padding: 0; border: 0; background: none; color: inherit; font-size: inherit; }
.aav-onb .aav-onb__agreement table.head { border-bottom: 1px solid var(--aav-heading); }
.aav-onb .aav-onb__agreement table.head td { padding: 0 0 14px; vertical-align: bottom; }
.aav-onb .aav-onb__agreement table.head img { display: block; width: 150px; height: auto; }
.aav-onb .aav-onb__agreement table.head td.ref { color: var(--aav-muted); font-size: 13px; text-align: right; }
.aav-onb .aav-onb__agreement .eyebrow { margin: 24px 0 0; color: var(--aav-accent-text); font-family: var(--aav-font-label); font-size: 12px; font-weight: 500; letter-spacing: 1.5px; text-transform: uppercase; }
.aav-onb .aav-onb__agreement h1 { margin: 6px 0 0; color: var(--aav-heading); font-family: var(--aav-font-heading); font-size: 26px; font-weight: var(--aav-heading-weight); line-height: 1.2; }
.aav-onb .aav-onb__agreement .intro { margin: 12px 0 0; font-size: 16px; }
.aav-onb .aav-onb__agreement table.parties { margin: 18px 0 6px; border-top: 1px solid var(--aav-line); }
.aav-onb .aav-onb__agreement table.parties td { width: 50%; padding: 10px 12px 10px 0; border-bottom: 1px solid var(--aav-line); vertical-align: top; }
.aav-onb .aav-onb__agreement table.parties td + td { padding-left: 12px; border-left: 1px solid var(--aav-line); }
.aav-onb .aav-onb__agreement .lbl { display: block; margin-bottom: 3px; color: var(--aav-muted); font-family: var(--aav-font-label); font-size: 11px; font-weight: 500; letter-spacing: 1px; text-transform: uppercase; }
.aav-onb .aav-onb__agreement h2 { margin: 20px 0 4px; color: var(--aav-heading); font-family: var(--aav-font-heading); font-size: 19px; font-weight: var(--aav-heading-weight); line-height: 1.3; }
.aav-onb .aav-onb__agreement h2 .n { display: inline-block; min-width: 30px; color: var(--aav-accent-text); font-family: var(--aav-font-label); font-size: 12px; font-weight: 500; letter-spacing: 1px; }
.aav-onb .aav-onb__agreement p { margin: 0 0 8px; color: var(--aav-text); font-size: 15px; }
.aav-onb .aav-onb__agreement .formula { margin: 6px 0 8px; padding: 10px 14px; border-left: 3px solid var(--aav-accent); background: var(--aav-surface); color: var(--aav-heading); font-weight: 500; }
.aav-onb .aav-onb__agreement .notice,
.aav-onb .aav-onb__agreement .small { color: var(--aav-muted); font-size: 13px; }
.aav-onb .aav-onb__agreement .notice { margin-top: 16px; padding-top: 10px; border-top: 1px solid var(--aav-line); }
.aav-onb .aav-onb__agreement .sign { margin-top: 18px; }
.aav-onb .aav-onb__agreement table.sign-grid { border-top: 1px solid var(--aav-heading); }
.aav-onb .aav-onb__agreement table.sign-grid > tbody > tr > td { width: 50%; padding: 12px 14px 4px 0; vertical-align: top; }
.aav-onb .aav-onb__agreement table.sign-grid > tbody > tr > td + td { padding-left: 14px; border-left: 1px solid var(--aav-line); }
.aav-onb .aav-onb__agreement table.sign-grid .lbl { white-space: nowrap; }
.aav-onb .aav-onb__agreement table.sign-grid table.row,
.aav-onb .aav-onb__agreement table.sign-grid table.row tbody,
.aav-onb .aav-onb__agreement table.sign-grid table.row tr { display: block; }
.aav-onb .aav-onb__agreement table.sign-grid table.row td { display: block; width: 100%; text-align: left; }
.aav-onb .aav-onb__agreement table.sign-grid table.row td.lbl { width: 100%; padding: 6px 0 0; border-bottom: none; }
.aav-onb .aav-onb__agreement table.sign-grid table.row td.val { padding: 0 0 6px; border-bottom: 1px solid var(--aav-line); }
.aav-onb .aav-onb__agreement table.sig { margin: 2px 0 6px; border-bottom: 1px solid var(--aav-control); }
.aav-onb .aav-onb__agreement table.sig td { height: 54px; vertical-align: bottom; }
.aav-onb .aav-onb__agreement table.sig td:empty::after { content: "Signature is applied when you sign"; color: var(--aav-muted); font-size: 13px; }
.aav-onb .aav-onb__agreement table.sig img { max-width: 100%; max-height: 50px; }
.aav-onb .aav-onb__agreement table.row td { padding: 4px 0; border-bottom: 1px solid var(--aav-line); font-size: 14px; }
.aav-onb .aav-onb__agreement table.row td.lbl { width: 40%; margin: 0; }
.aav-onb .aav-onb__agreement table.row td.val { text-align: right; }
.aav-onb .aav-onb__agreement .record { margin-top: 14px; padding: 10px 12px; border: 1px solid var(--aav-line); color: var(--aav-muted); font-size: 13px; }
.aav-onb .aav-onb__agreement .record b { color: var(--aav-heading); font-weight: 500; }
.aav-onb .aav-onb__agreement .appendix { margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--aav-heading); }
.aav-onb .aav-onb__agreement table.schedule { margin-top: 10px; font-size: 14px; }
.aav-onb .aav-onb__agreement table.schedule th { padding: 6px 8px 6px 0; border-bottom: 1px solid var(--aav-heading); color: var(--aav-muted); font-family: var(--aav-font-label); font-size: 11px; font-weight: 500; letter-spacing: 1px; text-align: left; text-transform: uppercase; }
.aav-onb .aav-onb__agreement table.schedule td { padding: 8px 8px 8px 0; border-bottom: 1px solid var(--aav-line); vertical-align: top; }
.aav-onb .aav-onb__agreement table.schedule .num { padding-right: 0; text-align: right; white-space: nowrap; }

.aav-onb .aav-onb__list { margin: 0 0 8px; }
.aav-onb .aav-onb__list li { position: relative; padding-left: 16px; color: var(--aav-text); font-size: 15px; }
.aav-onb .aav-onb__list li::before { content: ""; position: absolute; top: 0.7em; left: 2px; width: 6px; height: 6px; background: var(--aav-accent); }

.aav-onb .aav-onb__tabs { display: flex; gap: 8px; margin: 0 0 12px; }
.aav-onb .aav-onb__tab { min-height: 44px; padding: 0 18px; border: 1px solid var(--aav-control); border-radius: var(--aav-radius); background: transparent; color: var(--aav-heading); font-size: 15px; font-weight: 500; text-transform: none; cursor: pointer; }
.aav-onb .aav-onb__tab[aria-pressed="true"] { border-color: var(--aav-accent); background: var(--aav-accent); color: var(--aav-on-accent); }
.aav-onb .aav-onb__pad { border: 1px solid var(--aav-control); background: var(--aav-surface-alt); }
.aav-onb .aav-onb__pad-canvas { display: block; width: 100%; height: auto; aspect-ratio: 10 / 3; touch-action: none; cursor: crosshair; }
.aav-onb .aav-onb__pad-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 6px 12px; border-top: 1px dashed var(--aav-line); font-size: 14px; }
.aav-onb .aav-onb__sig-typed { padding: 22px 20px 14px; border: 1px solid var(--aav-control); border-bottom-color: var(--aav-heading); background: var(--aav-surface-alt); color: var(--aav-heading); font-family: "AAV Signature", "Dancing Script", cursive; font-size: 44px; line-height: 1.2; overflow-wrap: anywhere; }
.aav-onb .aav-onb__consent { margin: 18px 0 4px; }
.aav-onb .aav-onb__consent label { display: flex; align-items: flex-start; gap: 12px; min-height: 44px; color: var(--aav-heading); font-size: 15px; line-height: 1.5; cursor: pointer; }
.aav-onb .aav-onb__consent input[type="checkbox"] { flex: 0 0 22px; width: 22px; height: 22px; margin: 2px 0 0; accent-color: var(--aav-strong); }

/* ---------- Container-width layouts ---------- */

@container aav-onb (max-width: 820px) {
	.aav-onb .aav-onb__body--rail { grid-template-columns: minmax(0, 1fr); gap: 20px; }
	.aav-onb .aav-onb__summary { position: static; order: -1; padding: 14px 16px; }
	.aav-onb .aav-onb__summary h3 { margin-bottom: 6px; font-size: 16px; }
	.aav-onb .aav-onb__summary dl { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 12px; margin-bottom: 8px; }
	.aav-onb .aav-onb__summary dl div { flex-direction: column; gap: 0; border-bottom: 0; padding: 4px 0; }
	.aav-onb .aav-onb__summary dd { text-align: left; }
}

@container aav-onb (max-width: 640px) {
	.aav-onb .aav-onb__head,
	.aav-onb .aav-onb__body { --aav-pad: 20px; }
	.aav-onb .aav-onb__head { padding-top: 24px; }
	.aav-onb .aav-onb__title { font-size: 26px; }
	.aav-onb .aav-onb__panel h2 { font-size: 22px; }
	.aav-onb .aav-onb__row,
	.aav-onb .aav-onb__row--street,
	.aav-onb .aav-onb__search { grid-template-columns: minmax(0, 1fr); }
	.aav-onb .aav-onb__row--3 { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
	.aav-onb .aav-onb__row--3 > :first-child { grid-column: 1 / -1; }
	.aav-onb .aav-onb__choice label { flex: 1 1 100%; }
	.aav-onb .aav-onb__scenarios { gap: 6px; }
	.aav-onb .aav-onb__scenarios-label { flex: 1 1 100%; }
	.aav-onb .aav-onb__chip { min-height: 36px; padding: 5px 10px; font-size: 13px; }
	.aav-onb .aav-onb__steps li { flex-direction: column; align-items: flex-start; gap: 6px; font-size: 13px; }
	.aav-onb .aav-onb__step-label { display: none; }
	.aav-onb .aav-onb__steps li[data-state="current"] .aav-onb__step-label { display: block; }
	.aav-onb .aav-onb__summary dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.aav-onb .aav-onb__record { grid-template-columns: minmax(0, 1fr); }
	.aav-onb .aav-onb__record > .aav-onb__btn { justify-self: start; }
	.aav-onb .aav-onb__actions { flex-direction: column-reverse; align-items: stretch; }
	.aav-onb .aav-onb__actions .aav-onb__btn { width: 100%; }
	.aav-onb .aav-onb__doc { padding: 18px 16px; }
	.aav-onb .aav-onb__agreement { padding: 18px 14px; }
	.aav-onb .aav-onb__agreement table.head td.ref { font-size: 12px; }
	/* Appendix A as stacked rows on phones, like the rate schedule above. */
	.aav-onb .aav-onb__agreement table.schedule thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
	.aav-onb .aav-onb__agreement table.schedule tr { display: block; padding: 10px 0; border-bottom: 1px solid var(--aav-line); }
	.aav-onb .aav-onb__agreement table.schedule td { display: flex; justify-content: space-between; gap: 12px; padding: 2px 0; border: 0; font-size: 14px; text-align: right; }
	.aav-onb .aav-onb__agreement table.schedule td::before { content: attr(data-label); color: var(--aav-muted); text-align: left; }
	.aav-onb .aav-onb__agreement table.schedule td.acct { white-space: normal; }
	.aav-onb .aav-onb__sig-typed { font-size: 34px; }
	.aav-onb .aav-onb__agreement table.parties,
	.aav-onb .aav-onb__agreement table.parties tbody,
	.aav-onb .aav-onb__agreement table.parties tr,
	.aav-onb .aav-onb__agreement table.parties td { display: block; width: 100%; }
	.aav-onb .aav-onb__agreement table.parties td + td { padding-left: 0; border-left: 0; border-top: 1px solid var(--aav-line); }
	.aav-onb .aav-onb__agreement table.sign-grid,
	.aav-onb .aav-onb__agreement table.sign-grid > tbody,
	.aav-onb .aav-onb__agreement table.sign-grid > tbody > tr,
	.aav-onb .aav-onb__agreement table.sign-grid > tbody > tr > td { display: block; width: 100%; }
	.aav-onb .aav-onb__agreement table.sign-grid > tbody > tr > td + td { padding-left: 0; border-left: 0; border-top: 1px solid var(--aav-line); }
	/* Rate schedule as stacked rows: no sideways scrolling on phones. */
	.aav-onb .aav-onb__table--schedule thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
	.aav-onb .aav-onb__table--schedule tr { display: block; padding: 12px 0; border-bottom: 1px solid var(--aav-line); }
	.aav-onb .aav-onb__table--schedule td { display: flex; justify-content: space-between; gap: 16px; padding: 3px 0; border: 0; text-align: right; }
	.aav-onb .aav-onb__table--schedule tr td:first-child { display: block; padding: 0 0 6px; text-align: left; }
	.aav-onb .aav-onb__table--schedule td::before { content: attr(data-label); color: var(--aav-muted); font-family: var(--aav-font-body); font-size: 14px; font-weight: 400; text-align: left; }
	.aav-onb .aav-onb__table--schedule td:first-child::before { content: none; }
}

/* Signing overlay */
.aav-onb .aav-onb__overlay {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(0, 0, 0, 0.55);
}
.aav-onb .aav-onb__overlay-card {
	max-width: 380px;
	padding: 36px 32px;
	border-radius: var(--aav-radius);
	background: var(--aav-surface);
	text-align: center;
}
.aav-onb .aav-onb__overlay-card p { margin: 0 0 6px; color: var(--aav-heading); font-size: 16px; font-weight: 500; }
.aav-onb .aav-onb__overlay-card p.muted { font-weight: 400; font-size: 14px; }
.aav-onb .aav-onb__spinner {
	width: 36px;
	height: 36px;
	margin: 0 auto 18px;
	border: 4px solid var(--aav-line);
	border-top-color: var(--aav-accent);
	border-radius: 50%;
	animation: aav-spin 0.8s linear infinite;
}
@keyframes aav-spin { to { transform: rotate(360deg); } }

@media (prefers-reduced-motion: reduce) {
	.aav-onb *,
	.aav-onb *::after { transition: none !important; }
}

/* Existing-client pop-up and property update request (reuses the signing overlay).
   Sizes follow the AAV brand guide: the title is a small title at the h4 step
   (22.9px on phones to 28.6px on desktop), text at the small step (16px), the contact
   line at caption (14px), and spacing on the 16 / 26px steps. The dialog sits outside the
   page column, so it gets its own phone rules below instead of the container query. */
.aav-onb .aav-onb__dialog {
	width: calc(100% - 32px); /* the 16px margin on each side */
	max-width: 520px;
	max-height: calc(100vh - 32px);
	max-height: calc(100dvh - 32px); /* the visible height on phones, where supported */
	margin: 16px;
	padding: 30px 28px;
	overflow-y: auto;
	overscroll-behavior: contain;
	text-align: left;
}
.aav-onb .aav-onb__dialog h2 {
	margin: 0 0 16px;
	font-size: clamp(22.9px, calc(20.78px + 0.543vw), 28.6px);
	line-height: 1.2;
	text-wrap: balance;
}
.aav-onb .aav-onb__dialog p {
	margin: 0 0 16px;
	color: var(--aav-text);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.55;
}
.aav-onb .aav-onb__dialog .aav-onb__actions {
	justify-content: flex-end;
	margin-top: 26px;
	padding-top: 26px;
}
.aav-onb .aav-onb__dialog .aav-onb__actions + p.muted {
	margin: 16px 0 0;
	color: var(--aav-muted);
	font-size: 14px;
	line-height: 1.5;
	text-align: center;
}
.aav-onb .aav-onb__dialog .aav-onb__notice { margin: 16px 0 0; }
.aav-onb .aav-onb__dialog a { color: var(--aav-accent-text); text-decoration: underline; text-underline-offset: 2px; overflow-wrap: anywhere; }
.aav-onb .aav-onb__dialog textarea {
	width: 100%;
	max-width: 100%;
	min-height: 72px;
	padding: 10px 12px;
	border: 1px solid var(--aav-control);
	border-radius: var(--aav-radius);
	background: #ffffff;
	color: var(--aav-heading);
	font-family: var(--aav-font-body);
	font-size: 16px; /* 16px stops iOS zooming on focus */
	line-height: 1.4;
	resize: vertical;
}
.aav-onb .aav-onb__dialog textarea:focus { border-color: var(--aav-focus); outline: 2px solid var(--aav-focus); outline-offset: 0; }
@media (max-width: 640px) {
	.aav-onb .aav-onb__dialog { width: calc(100% - 24px); max-height: calc(100dvh - 24px); margin: 12px; padding: 24px 20px; }
	.aav-onb .aav-onb__dialog .aav-onb__row { grid-template-columns: minmax(0, 1fr); }
	.aav-onb .aav-onb__dialog .aav-onb__actions { flex-direction: column-reverse; align-items: stretch; margin-top: 20px; padding-top: 20px; }
	.aav-onb .aav-onb__dialog .aav-onb__actions .aav-onb__btn { width: 100%; }
	.aav-onb .aav-onb__dialog .aav-onb__actions .aav-onb__link { align-self: center; }
}