/* ============================================================
   Quoting capability — view internals.
   Layered on top of bento.css's shared .vita-cap-sample chrome.
   All selectors are scoped to body.vita-service--quoting or to the
   .vita-cap-quote-* namespace so nothing leaks to other pages.

   Sample-panel background is already dark (rgba(15,27,45,0.92)) via
   bento.css:1658 — every internal surface here renders white-on-dark.
   ============================================================ */

/* ── EDITOR: customer header strip ───────────────────────────── */

body.vita-service--quoting .vita-cap-quote-editor__head {
	display: flex;
	align-items: baseline;
	gap: 10px;
	flex-wrap: wrap;
	font-family: var(--wp--preset--font-family--mono), ui-monospace, Menlo, monospace;
	font-size: 11px;
	letter-spacing: 0.06em;
	color: rgba(255, 255, 255, 0.55);
	padding: 0 0 12px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
	margin-bottom: 14px;
}
body.vita-service--quoting .vita-cap-quote-editor__cust {
	color: #fff;
	font-weight: 600;
	letter-spacing: 0.08em;
}
body.vita-service--quoting .vita-cap-quote-editor__sep {
	opacity: 0.35;
}
body.vita-service--quoting .vita-cap-quote-editor__draft {
	margin-left: auto;
	font-size: 10px;
	padding: 2px 8px;
	border-radius: 999px;
	background: color-mix(in srgb, var(--cap-accent) 16%, transparent);
	color: var(--cap-accent, #6BE0B8);
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

/* ── EDITOR: line-item table ─────────────────────────────────── */

body.vita-service--quoting .vita-cap-quote-editor__table {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

body.vita-service--quoting .vita-cap-quote-editor__head-row,
body.vita-service--quoting .vita-cap-quote-editor__row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 60px 90px 100px;
	gap: 10px;
	align-items: center;
	padding: 10px 12px;
	font-family: var(--wp--preset--font-family--sans);
	font-size: 12px;
}

body.vita-service--quoting .vita-cap-quote-editor__head-row {
	font-family: var(--wp--preset--font-family--mono), ui-monospace, Menlo, monospace;
	font-size: 9px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.45);
	padding: 4px 12px;
}

body.vita-service--quoting .vita-cap-quote-editor__head-row span:nth-child(2),
body.vita-service--quoting .vita-cap-quote-editor__row .vita-cap-quote-editor__cell--qty {
	text-align: right;
}
body.vita-service--quoting .vita-cap-quote-editor__head-row span:nth-child(3),
body.vita-service--quoting .vita-cap-quote-editor__row .vita-cap-quote-editor__cell--rate {
	text-align: right;
}
body.vita-service--quoting .vita-cap-quote-editor__head-row span:nth-child(4),
body.vita-service--quoting .vita-cap-quote-editor__row .vita-cap-quote-editor__cell--sub {
	text-align: right;
}

body.vita-service--quoting .vita-cap-quote-editor__row {
	background: rgba(255, 255, 255, 0.03);
	border: 1px solid rgba(255, 255, 255, 0.06);
	border-radius: 8px;
	color: rgba(255, 255, 255, 0.88);
	transition: background-color 120ms ease, border-color 120ms ease;
}
body.vita-service--quoting .vita-cap-quote-editor__row:hover {
	background: rgba(255, 255, 255, 0.05);
}

body.vita-service--quoting .vita-cap-quote-editor__cell--desc {
	color: #fff;
	font-weight: 500;
}
body.vita-service--quoting .vita-cap-quote-editor__cell--qty,
body.vita-service--quoting .vita-cap-quote-editor__cell--rate {
	font-family: var(--wp--preset--font-family--mono), ui-monospace, Menlo, monospace;
	color: rgba(255, 255, 255, 0.85);
}
body.vita-service--quoting .vita-cap-quote-editor__cell--sub {
	font-family: var(--wp--preset--font-family--mono), ui-monospace, Menlo, monospace;
	color: #fff;
	font-weight: 600;
}

/* Editable cell focus + hover affordances */
body.vita-service--quoting .vita-cap-quote-editor__cell[contenteditable="true"] {
	border-radius: 4px;
	padding: 2px 6px;
	margin: -2px -6px;
	outline: 0;
	cursor: text;
	transition: background-color 120ms ease, box-shadow 120ms ease;
}
body.vita-service--quoting .vita-cap-quote-editor__cell[contenteditable="true"]:hover {
	background: color-mix(in srgb, var(--cap-accent) 6%, transparent);
}
body.vita-service--quoting .vita-cap-quote-editor__cell[contenteditable="true"]:focus {
	background: color-mix(in srgb, var(--cap-accent) 10%, transparent);
	box-shadow: 0 0 0 1px var(--cap-accent, #6BE0B8);
}

/* ── EDITOR: totals card ─────────────────────────────────────── */

body.vita-service--quoting .vita-cap-quote-editor__totals {
	margin-top: 14px;
	margin-left: auto;
	width: min(280px, 100%);
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: 10px;
	padding: 14px 16px;
	display: flex;
	flex-direction: column;
	gap: 6px;
	font-family: var(--wp--preset--font-family--mono), ui-monospace, Menlo, monospace;
	font-size: 11px;
	color: rgba(255, 255, 255, 0.75);
	transition: box-shadow 240ms ease, border-color 240ms ease, background-color 240ms ease;
}
body.vita-service--quoting .vita-cap-quote-editor__totals-row {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
}
body.vita-service--quoting .vita-cap-quote-editor__totals-row--grand {
	margin-top: 6px;
	padding-top: 8px;
	border-top: 1px solid rgba(255, 255, 255, 0.12);
	color: #fff;
	font-size: 13px;
	font-weight: 700;
}
body.vita-service--quoting .vita-cap-quote-editor__totals-row--grand span:last-child {
	color: var(--cap-accent, #6BE0B8);
	font-size: 16px;
}
body.vita-service--quoting .vita-cap-quote-editor__totals-note {
	margin-top: 4px;
	font-size: 9px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	opacity: 0.45;
}

/* Pulse animation on the totals card after "Apply margin" fires */
body.vita-service--quoting .vita-cap-quote-editor__totals.is-bumped {
	border-color: color-mix(in srgb, var(--cap-accent) 60%, transparent);
	background: color-mix(in srgb, var(--cap-accent) 10%, transparent);
	box-shadow: 0 0 0 4px color-mix(in srgb, var(--cap-accent) 18%, transparent);
	animation: vita-cap-quote-bump 1.2s ease-out;
}
@keyframes vita-cap-quote-bump {
	0%   { transform: scale(1); }
	30%  { transform: scale(1.015); }
	100% { transform: scale(1); }
}

/* ── EDITOR: send-for-signature CTA ─────────────────────────── */

body.vita-service--quoting .vita-cap-quote-editor__cta {
	margin-top: 14px;
	align-self: flex-end;
	background: var(--cap-accent, #6BE0B8);
	color: #0F1B2D;
	border: 0;
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 600;
	font-size: 12px;
	padding: 10px 18px;
	border-radius: 999px;
	cursor: pointer;
	transition: transform 120ms ease, background-color 120ms ease, opacity 120ms ease;
}
body.vita-service--quoting .vita-cap-quote-editor__cta:hover {
	transform: translateY(-1px);
}
body.vita-service--quoting .vita-cap-quote-editor__cta:focus-visible {
	outline: 2px solid #fff;
	outline-offset: 2px;
}
body.vita-service--quoting .vita-cap-quote-editor.is-sent .vita-cap-quote-editor__cta {
	background: color-mix(in srgb, var(--cap-accent) 20%, transparent);
	color: var(--cap-accent, #6BE0B8);
	cursor: default;
	opacity: 0.9;
}
body.vita-service--quoting .vita-cap-quote-editor.is-sent {
	position: relative;
}
body.vita-service--quoting .vita-cap-quote-editor.is-sent::after {
	content: "Sent · awaiting client signature";
	position: absolute;
	top: 0;
	right: 0;
	font-family: var(--wp--preset--font-family--mono), ui-monospace, Menlo, monospace;
	font-size: 9px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--cap-accent, #6BE0B8);
	background: color-mix(in srgb, var(--cap-accent) 12%, transparent);
	padding: 3px 8px;
	border-radius: 999px;
}

/* ── TEMPLATES view ──────────────────────────────────────────── */

body.vita-service--quoting .vita-cap-sample__templates {
	display: flex;
	flex-direction: column;
	gap: 6px;
}
body.vita-service--quoting .vita-cap-quote-tmpl-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 12px;
	align-items: center;
	background: rgba(255, 255, 255, 0.03);
	border: 1px solid rgba(255, 255, 255, 0.06);
	border-radius: 8px;
	padding: 12px 14px;
	transition: background-color 120ms ease;
}
body.vita-service--quoting .vita-cap-quote-tmpl-row:hover {
	background: rgba(255, 255, 255, 0.06);
}
body.vita-service--quoting .vita-cap-quote-tmpl-row__main {
	display: flex;
	flex-direction: column;
	gap: 3px;
	min-width: 0;
}
body.vita-service--quoting .vita-cap-quote-tmpl-row__name {
	color: #fff;
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 600;
	font-size: 13px;
}
body.vita-service--quoting .vita-cap-quote-tmpl-row__sub {
	font-family: var(--wp--preset--font-family--mono), ui-monospace, Menlo, monospace;
	font-size: 10px;
	color: rgba(255, 255, 255, 0.5);
	letter-spacing: 0.04em;
}
body.vita-service--quoting .vita-cap-quote-tmpl-row__tag {
	font-family: var(--wp--preset--font-family--mono), ui-monospace, Menlo, monospace;
	font-size: 9px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--cap-accent, #6BE0B8);
	background: color-mix(in srgb, var(--cap-accent) 12%, transparent);
	padding: 4px 10px;
	border-radius: 999px;
}

/* ── PRICING view ────────────────────────────────────────────── */

body.vita-service--quoting .vita-cap-sample__pricing {
	display: grid;
	grid-template-columns: 1fr;
	gap: 10px;
}
body.vita-service--quoting .vita-cap-quote-price-card {
	background: rgba(255, 255, 255, 0.03);
	border: 1px solid rgba(255, 255, 255, 0.06);
	border-radius: 8px;
	padding: 14px 16px;
	color: #fff;
}
body.vita-service--quoting .vita-cap-quote-price-card__title {
	font-family: var(--wp--preset--font-family--mono), ui-monospace, Menlo, monospace;
	font-size: 10px;
	font-weight: 500;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.5);
	margin: 0 0 10px;
}
body.vita-service--quoting .vita-cap-quote-price-card__rows {
	display: flex;
	flex-direction: column;
	gap: 6px;
}
body.vita-service--quoting .vita-cap-quote-price-card__row {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	padding: 4px 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.04);
	font-size: 12px;
}
body.vita-service--quoting .vita-cap-quote-price-card__row:last-child {
	border-bottom: 0;
}
body.vita-service--quoting .vita-cap-quote-price-card__row span:first-child {
	color: rgba(255, 255, 255, 0.7);
}
body.vita-service--quoting .vita-cap-quote-price-card__row span:last-child {
	font-family: var(--wp--preset--font-family--mono), ui-monospace, Menlo, monospace;
	color: var(--cap-accent, #6BE0B8);
	font-weight: 500;
}

/* ── HISTORY view ────────────────────────────────────────────── */

body.vita-service--quoting .vita-cap-sample__history {
	display: flex;
	flex-direction: column;
	gap: 4px;
}
body.vita-service--quoting .vita-cap-quote-hist-row {
	display: grid;
	grid-template-columns: 56px minmax(0, 1fr) 76px 80px 72px;
	gap: 10px;
	align-items: center;
	background: rgba(255, 255, 255, 0.03);
	border: 1px solid rgba(255, 255, 255, 0.06);
	border-radius: 6px;
	padding: 8px 12px;
	font-family: var(--wp--preset--font-family--sans);
	font-size: 12px;
	transition: background-color 120ms ease;
}
body.vita-service--quoting .vita-cap-quote-hist-row:hover {
	background: rgba(255, 255, 255, 0.05);
}
body.vita-service--quoting .vita-cap-quote-hist-row__id {
	font-family: var(--wp--preset--font-family--mono), ui-monospace, Menlo, monospace;
	font-size: 10px;
	color: rgba(255, 255, 255, 0.5);
}
body.vita-service--quoting .vita-cap-quote-hist-row__cust {
	color: #fff;
	font-weight: 500;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
body.vita-service--quoting .vita-cap-quote-hist-row__amt {
	font-family: var(--wp--preset--font-family--mono), ui-monospace, Menlo, monospace;
	color: rgba(255, 255, 255, 0.85);
	text-align: right;
	font-size: 11px;
}
body.vita-service--quoting .vita-cap-quote-hist-row__when {
	font-family: var(--wp--preset--font-family--mono), ui-monospace, Menlo, monospace;
	font-size: 10px;
	color: rgba(255, 255, 255, 0.45);
	text-align: right;
	letter-spacing: 0.04em;
}

/* Status badges */
body.vita-service--quoting .vita-cap-quote-status {
	font-family: var(--wp--preset--font-family--mono), ui-monospace, Menlo, monospace;
	font-size: 9px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	padding: 3px 8px;
	border-radius: 999px;
	text-align: center;
}
body.vita-service--quoting .vita-cap-quote-status--draft   { background: rgba(255,255,255,0.08); color: rgba(255,255,255,0.55); }
body.vita-service--quoting .vita-cap-quote-status--sent    { background: rgba(255,136,71,0.18); color: #FF8847; }
body.vita-service--quoting .vita-cap-quote-status--viewed  { background: rgba(107,157,255,0.18); color: #98B6FF; }
body.vita-service--quoting .vita-cap-quote-status--signed  { background: color-mix(in srgb, var(--cap-accent) 18%, transparent); color: var(--cap-accent, #6BE0B8); }
body.vita-service--quoting .vita-cap-quote-status--expired { background: rgba(255,80,80,0.18); color: #FF7070; }

/* ── SETTINGS view ───────────────────────────────────────────── */

body.vita-service--quoting .vita-cap-quote-settings {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 12px;
}
body.vita-service--quoting .vita-cap-quote-settings__field {
	display: flex;
	flex-direction: column;
	gap: 6px;
}
body.vita-service--quoting .vita-cap-quote-settings__field--wide {
	grid-column: 1 / -1;
}
body.vita-service--quoting .vita-cap-quote-settings__field--radios {
	grid-column: 1 / -1;
}
body.vita-service--quoting .vita-cap-quote-settings__label {
	font-family: var(--wp--preset--font-family--mono), ui-monospace, Menlo, monospace;
	font-size: 10px;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.5);
}
body.vita-service--quoting .vita-cap-quote-settings__input,
body.vita-service--quoting .vita-cap-quote-settings__textarea {
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid rgba(255, 255, 255, 0.1);
	border-radius: 6px;
	padding: 8px 10px;
	color: #fff;
	font-family: inherit;
	font-size: 13px;
	transition: border-color 120ms ease, background-color 120ms ease;
}
body.vita-service--quoting .vita-cap-quote-settings__input:focus,
body.vita-service--quoting .vita-cap-quote-settings__textarea:focus {
	outline: 0;
	border-color: var(--cap-accent, #6BE0B8);
	background: color-mix(in srgb, var(--cap-accent) 8%, transparent);
}
body.vita-service--quoting .vita-cap-quote-settings__textarea {
	min-height: 84px;
	resize: vertical;
	font-family: var(--wp--preset--font-family--sans);
	line-height: 1.45;
}

body.vita-service--quoting .vita-cap-quote-settings__radios {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}
body.vita-service--quoting .vita-cap-quote-settings__radio {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 14px;
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid rgba(255, 255, 255, 0.1);
	border-radius: 999px;
	font-size: 12px;
	color: rgba(255, 255, 255, 0.75);
	cursor: pointer;
	transition: background-color 120ms ease, border-color 120ms ease;
}
body.vita-service--quoting .vita-cap-quote-settings__radio:hover {
	background: rgba(255, 255, 255, 0.06);
}
body.vita-service--quoting .vita-cap-quote-settings__radio input {
	accent-color: var(--cap-accent, #6BE0B8);
}

/* ── PROMISE GLYPHS (timer + layers) ─────────────────────────── */

/* Timer glyph — stopwatch silhouette. White-on-coloured-tile. */
.vita-cap-promise__glyph--timer {
	height: 84px;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	position: relative;
}
.vita-cap-promise__glyph--timer::before {
	content: "";
	width: 60px;
	height: 60px;
	border-radius: 50%;
	border: 3px solid rgba(255, 255, 255, 0.85);
	position: relative;
	background:
		linear-gradient(90deg, rgba(255,255,255,0.85) 0 2px, transparent 0) 50% 6px / 2px 8px no-repeat,
		linear-gradient(0deg, rgba(255,255,255,0.85) 0 2px, transparent 0) 6px 50% / 8px 2px no-repeat,
		linear-gradient(0deg, rgba(255,255,255,0.85) 0 2px, transparent 0) calc(100% - 14px) 50% / 8px 2px no-repeat,
		linear-gradient(90deg, rgba(255,255,255,0.85) 0 2px, transparent 0) 50% calc(100% - 14px) / 2px 8px no-repeat;
}
.vita-cap-promise__glyph--timer::after {
	content: "";
	position: absolute;
	left: 30px;
	top: 14px;
	width: 30px;
	height: 30px;
	background:
		linear-gradient(35deg, transparent 47%, rgba(255,255,255,0.95) 47% 53%, transparent 53%) 0 0 / 100% 100% no-repeat,
		linear-gradient(0deg,  transparent 46%, rgba(255,255,255,0.95) 46% 54%, transparent 54%) 0 0 / 4px 18px no-repeat;
	transform-origin: 0% 100%;
	animation: vita-cap-promise-tick 6s steps(12) infinite;
}
@keyframes vita-cap-promise-tick {
	from { transform: rotate(0deg); }
	to   { transform: rotate(360deg); }
}

/* Layers glyph — 3 stacked horizontal slabs offset to suggest depth. */
.vita-cap-promise__glyph--layers {
	height: 84px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	gap: 6px;
}
.vita-cap-promise__glyph--layers::before,
.vita-cap-promise__glyph--layers::after,
.vita-cap-promise__glyph--layers span {
	content: "";
	display: block;
	height: 16px;
	border-radius: 4px;
	background: rgba(255, 255, 255, 0.85);
}
.vita-cap-promise__glyph--layers::before { margin-left: 0;   opacity: 0.55; width: 64px; }
.vita-cap-promise__glyph--layers span    { margin-left: 14px; opacity: 0.80; width: 78px; }
.vita-cap-promise__glyph--layers::after  { margin-left: 28px; opacity: 1;    width: 88px; }

/* Glyph colour overrides per tile colour to keep contrast.
   On the dark-ink (--reporting amber, --scheduling blue) tiles the
   white glyph already works; on the mint --quoting tile (dark text)
   we need dark glyph pieces. */
.vita-cap-promise--quoting .vita-cap-promise__glyph--timer::before {
	border-color: rgba(15, 27, 45, 0.85);
	background:
		linear-gradient(90deg, rgba(15,27,45,0.85) 0 2px, transparent 0) 50% 6px / 2px 8px no-repeat,
		linear-gradient(0deg, rgba(15,27,45,0.85) 0 2px, transparent 0) 6px 50% / 8px 2px no-repeat,
		linear-gradient(0deg, rgba(15,27,45,0.85) 0 2px, transparent 0) calc(100% - 14px) 50% / 8px 2px no-repeat,
		linear-gradient(90deg, rgba(15,27,45,0.85) 0 2px, transparent 0) 50% calc(100% - 14px) / 2px 8px no-repeat;
}
.vita-cap-promise--quoting .vita-cap-promise__glyph--timer::after {
	background:
		linear-gradient(35deg, transparent 47%, rgba(15,27,45,0.95) 47% 53%, transparent 53%) 0 0 / 100% 100% no-repeat,
		linear-gradient(0deg,  transparent 46%, rgba(15,27,45,0.95) 46% 54%, transparent 54%) 0 0 / 4px 18px no-repeat;
}
.vita-cap-promise--quoting .vita-cap-promise__glyph--layers::before,
.vita-cap-promise--quoting .vita-cap-promise__glyph--layers::after,
.vita-cap-promise--quoting .vita-cap-promise__glyph--layers span {
	background: rgba(15, 27, 45, 0.85);
}

/* ══════════════════════════════════════════════════════════════
   RESPONSIVE — Rule 2: phone-app reimagining at <720px.
   Editor table reflows to stacked cards; pricing single-column;
   history compresses to id/cust/status/amt (drop the when col).
   ══════════════════════════════════════════════════════════════ */

/* Pricing — 3 cards side-by-side on desktop, 1-col on tablet/mobile */
@media (min-width: 1024px) {
	body.vita-service--quoting .vita-cap-sample__pricing {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

/* History on tablet — drop the when column to fit narrower main */
@media (min-width: 720px) and (max-width: 1023.98px) {
	body.vita-service--quoting .vita-cap-quote-hist-row {
		grid-template-columns: 56px minmax(0, 1fr) 76px 80px;
	}
	body.vita-service--quoting .vita-cap-quote-hist-row__when {
		display: none;
	}
	body.vita-service--quoting .vita-cap-quote-settings {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* Mobile (<720px) — phone-app reimagining */
@media (max-width: 719.98px) {
	body.vita-service--quoting .vita-cap-quote-editor__head {
		font-size: 10px;
		gap: 6px;
	}
	body.vita-service--quoting .vita-cap-quote-editor__draft {
		margin-left: 0;
	}

	/* Editor: stack the table as cards. Hide header row, label each cell. */
	body.vita-service--quoting .vita-cap-quote-editor__head-row {
		display: none;
	}
	body.vita-service--quoting .vita-cap-quote-editor__row {
		display: grid;
		grid-template-columns: 1fr auto;
		grid-template-areas:
			"desc desc"
			"qty  sub"
			"rate sub";
		gap: 6px 10px;
		padding: 12px 14px;
	}
	body.vita-service--quoting .vita-cap-quote-editor__cell--desc { grid-area: desc; font-size: 13px; }
	body.vita-service--quoting .vita-cap-quote-editor__cell--qty,
	body.vita-service--quoting .vita-cap-quote-editor__cell--rate {
		font-size: 11px;
		text-align: left !important;
		color: rgba(255, 255, 255, 0.7);
	}
	body.vita-service--quoting .vita-cap-quote-editor__cell--qty  { grid-area: qty; }
	body.vita-service--quoting .vita-cap-quote-editor__cell--qty::before {
		content: "Qty ";
		opacity: 0.45;
		font-size: 9px;
		text-transform: uppercase;
		letter-spacing: 0.08em;
		margin-right: 2px;
	}
	body.vita-service--quoting .vita-cap-quote-editor__cell--rate { grid-area: rate; }
	body.vita-service--quoting .vita-cap-quote-editor__cell--rate::before {
		content: "Rate ";
		opacity: 0.45;
		font-size: 9px;
		text-transform: uppercase;
		letter-spacing: 0.08em;
		margin-right: 2px;
	}
	body.vita-service--quoting .vita-cap-quote-editor__cell--sub {
		grid-area: sub;
		align-self: center;
		font-size: 14px;
		text-align: right;
	}

	body.vita-service--quoting .vita-cap-quote-editor__totals {
		width: 100%;
	}
	body.vita-service--quoting .vita-cap-quote-editor__cta {
		align-self: stretch;
		text-align: center;
	}

	body.vita-service--quoting .vita-cap-quote-tmpl-row {
		grid-template-columns: 1fr;
	}
	body.vita-service--quoting .vita-cap-quote-tmpl-row__tag {
		justify-self: start;
	}

	body.vita-service--quoting .vita-cap-quote-hist-row {
		grid-template-columns: 56px minmax(0, 1fr) auto;
		grid-template-areas:
			"id   cust   status"
			"when amt    amt";
		gap: 4px 10px;
	}
	body.vita-service--quoting .vita-cap-quote-hist-row__id     { grid-area: id; }
	body.vita-service--quoting .vita-cap-quote-hist-row__cust   { grid-area: cust; }
	body.vita-service--quoting .vita-cap-quote-status           { grid-area: status; justify-self: end; }
	body.vita-service--quoting .vita-cap-quote-hist-row__amt    { grid-area: amt; text-align: right; }
	body.vita-service--quoting .vita-cap-quote-hist-row__when   { grid-area: when; text-align: left; }

	body.vita-service--quoting .vita-cap-quote-settings {
		grid-template-columns: 1fr;
	}

	/* Hide the absolute "sent" badge inside the editor on mobile — not enough room */
	body.vita-service--quoting .vita-cap-quote-editor.is-sent::after {
		position: static;
		display: inline-block;
		margin-bottom: 8px;
	}
}