/* ═══════════════════════════════════════════════════════════════
   QUOTE BUILDER + QUOTE PREVIEW STYLES
   SportSweeper Theme — quote.css
   ═══════════════════════════════════════════════════════════════ */

/* ═══ PAGE LAYOUT ═══ */
.quote-page {
	padding: 3rem 0 4rem;
	min-height: 70vh;
}

.quote-layout {
	display: grid;
	grid-template-columns: 1fr 400px;
	gap: 3.5rem;
	align-items: start;
}

/* ═══ QUOTE BUILDER: LEFT COLUMN ═══ */
.quote-header {
	margin-bottom: 2.5rem;
}

.breadcrumb {
	font-size: 0.8rem;
	color: var(--slate-400);
	margin-bottom: 1rem;
}

.breadcrumb a {
	color: var(--slate-500);
	text-decoration: none;
}

.breadcrumb a:hover {
	color: var(--green-700);
}

.breadcrumb span {
	margin: 0 0.4rem;
	color: var(--slate-300);
}

.quote-header h1 {
	font-family: var(--font-display);
	font-size: 2rem;
	font-weight: 700;
	color: var(--slate-900);
	margin-bottom: 0.5rem;
	letter-spacing: -0.02em;
}

.quote-header p {
	font-size: 1rem;
	color: var(--slate-500);
	max-width: 520px;
}

/* ─── Step Indicators ─── */
.steps-indicator {
	display: flex;
	align-items: center;
	gap: 0;
	margin-bottom: 2.5rem;
}

.step-dot {
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

.step-num {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 0.8rem;
	font-weight: 700;
	flex-shrink: 0;
}

.step-num.active {
	background: var(--green-700);
	color: var(--white);
}

.step-num.upcoming {
	background: var(--slate-100);
	color: var(--slate-400);
}

.step-num.done {
	background: var(--green-100);
	color: var(--green-700);
}

.step-label {
	font-size: 0.8rem;
	font-weight: 500;
}

.step-label.active { color: var(--slate-800); }
.step-label.upcoming { color: var(--slate-400); }
.step-label.done { color: var(--green-700); }

.step-line {
	flex: 1;
	height: 1px;
	background: var(--slate-200);
	margin: 0 1rem;
}

/* ─── Form Sections ─── */
.form-section {
	margin-bottom: 2.5rem;
}

.form-section h3 {
	font-size: 1rem;
	font-weight: 600;
	color: var(--slate-800);
	margin-bottom: 0.25rem;
}

.form-section .section-hint {
	font-size: 0.83rem;
	color: var(--slate-400);
	margin-bottom: 1.25rem;
}

/* ─── Product Selector Cards ─── */
.product-selector {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 0.75rem;
}

.ps-card {
	border: 2px solid var(--slate-200);
	border-radius: var(--radius);
	padding: 1rem 1.25rem;
	cursor: pointer;
	transition: all 0.2s;
	position: relative;
}

.ps-card:hover {
	border-color: var(--green-400);
	background: var(--green-50);
}

.ps-card.selected {
	border-color: var(--green-600);
	background: var(--green-50);
	box-shadow: 0 0 0 1px var(--green-600);
}

.ps-check {
	position: absolute;
	top: 0.75rem;
	right: 0.75rem;
	width: 20px;
	height: 20px;
	border: 2px solid var(--slate-300);
	border-radius: 4px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 0.7rem;
	transition: all 0.2s;
}

.ps-card.selected .ps-check {
	background: var(--green-600);
	border-color: var(--green-600);
	color: var(--white);
}

.ps-name {
	font-weight: 600;
	font-size: 0.9rem;
	color: var(--slate-800);
	margin-bottom: 0.15rem;
	padding-right: 1.5rem;
}

.ps-desc {
	font-size: 0.75rem;
	color: var(--slate-500);
	margin-bottom: 0.5rem;
}

.ps-price {
	font-weight: 700;
	font-size: 1rem;
	color: var(--green-800);
}

.ps-qty {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin-top: 0.65rem;
	padding-top: 0.65rem;
	border-top: 1px solid var(--slate-100);
}

.ps-qty label {
	font-size: 0.75rem;
	color: var(--slate-500);
	font-weight: 500;
}

.ps-qty select {
	padding: 0.3rem 0.5rem;
	border: 1px solid var(--slate-200);
	border-radius: 4px;
	font-size: 0.8rem;
	font-family: var(--font-body);
	background: var(--white);
}

/* ─── Form Fields ─── */
.field-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1rem;
	margin-bottom: 1rem;
}

.field-full {
	margin-bottom: 1rem;
}

.field label {
	display: block;
	font-size: 0.8rem;
	font-weight: 500;
	color: var(--slate-700);
	margin-bottom: 0.35rem;
}

.field label .req {
	color: var(--green-600);
}

.field input,
.field select,
.field textarea {
	width: 100%;
	padding: 0.65rem 0.85rem;
	border: 1px solid var(--slate-200);
	border-radius: var(--radius);
	font-size: 0.88rem;
	font-family: var(--font-body);
	color: var(--slate-800);
	background: var(--white);
	transition: border-color 0.2s;
}

.field input:focus,
.field select:focus,
.field textarea:focus {
	outline: none;
	border-color: var(--green-500);
	box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.1);
}

.field input.error,
.field select.error,
.field textarea.error {
	border-color: #ef4444;
}

.field textarea {
	resize: vertical;
	min-height: 80px;
}

.field .field-hint {
	font-size: 0.72rem;
	color: var(--slate-400);
	margin-top: 0.25rem;
}

.field-error {
	font-size: 0.75rem;
	color: #ef4444;
	margin-top: 0.25rem;
	display: none;
}

.field-error.visible {
	display: block;
}

/* ─── Submit Area ─── */
.submit-area {
	margin-top: 2rem;
}

.btn-generate {
	display: block;
	width: 100%;
	padding: 1rem;
	background: var(--green-700);
	color: var(--white);
	font-size: 1rem;
	font-weight: 700;
	text-align: center;
	border: none;
	border-radius: var(--radius);
	cursor: pointer;
	transition: all 0.2s;
	text-decoration: none;
	font-family: var(--font-body);
}

.btn-generate:hover:not(:disabled) {
	background: var(--green-800);
	transform: translateY(-1px);
	box-shadow: 0 6px 20px rgba(22, 101, 52, 0.25);
}

.btn-generate:disabled {
	opacity: 0.6;
	cursor: not-allowed;
}

.btn-generate.loading::after {
	content: '';
	display: inline-block;
	width: 14px;
	height: 14px;
	border: 2px solid rgba(255, 255, 255, 0.4);
	border-top-color: #fff;
	border-radius: 50%;
	animation: spin 0.7s linear infinite;
	margin-left: 0.6rem;
	vertical-align: middle;
}

@keyframes spin {
	to { transform: rotate(360deg); }
}

.submit-note {
	text-align: center;
	font-size: 0.78rem;
	color: var(--slate-400);
	margin-top: 0.75rem;
	line-height: 1.5;
}

/* Validation banner */
.validation-banner {
	background: #fef2f2;
	border: 1px solid #fecaca;
	border-radius: var(--radius);
	padding: 0.75rem 1rem;
	margin-bottom: 1rem;
	font-size: 0.82rem;
	color: #991b1b;
	display: none;
}

.validation-banner.visible {
	display: block;
}

/* ═══ QUOTE SUMMARY: RIGHT COLUMN ═══ */
.quote-summary {
	position: sticky;
	top: 100px;
}

.summary-card {
	background: var(--slate-50);
	border: 1px solid var(--slate-200);
	border-radius: var(--radius-lg);
	overflow: hidden;
}

.summary-header {
	background: var(--green-950);
	color: var(--white);
	padding: 1.25rem 1.5rem;
}

.summary-header h3 {
	font-family: var(--font-display);
	font-size: 1.1rem;
	font-weight: 700;
}

.summary-header p {
	font-size: 0.75rem;
	color: var(--slate-400);
	margin-top: 0.15rem;
}

.summary-body {
	padding: 1.5rem;
}

.summary-empty {
	text-align: center;
	padding: 2rem 1rem;
	color: var(--slate-400);
	font-size: 0.85rem;
}

.summary-empty .se-icon {
	font-size: 2rem;
	margin-bottom: 0.5rem;
	opacity: 0.5;
}

/* ─── Line Items ─── */
.line-item {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	padding: 0.75rem 0;
	border-bottom: 1px solid var(--slate-200);
}

.line-item:last-of-type {
	border-bottom: none;
}

.li-info {
	flex: 1;
}

.li-name {
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--slate-800);
}

.li-detail {
	font-size: 0.72rem;
	color: var(--slate-400);
}

.li-price {
	font-weight: 600;
	font-size: 0.9rem;
	color: var(--slate-800);
	text-align: right;
	white-space: nowrap;
	margin-left: 0.75rem;
}

.li-unit {
	font-size: 0.7rem;
	color: var(--slate-400);
	font-weight: 400;
}

/* ─── Totals ─── */
.summary-totals {
	border-top: 1px solid var(--slate-200);
	margin-top: 0.5rem;
	padding-top: 1rem;
}

.total-row {
	display: flex;
	justify-content: space-between;
	padding: 0.3rem 0;
	font-size: 0.85rem;
}

.total-row .tr-label {
	color: var(--slate-500);
}

.total-row .tr-value {
	font-weight: 500;
	color: var(--slate-800);
}

.total-row.shipping .tr-value {
	color: var(--green-700);
	font-weight: 600;
}

.total-row.grand {
	margin-top: 0.5rem;
	padding-top: 0.75rem;
	border-top: 2px solid var(--slate-300);
	font-size: 1.1rem;
}

.total-row.grand .tr-label {
	font-weight: 600;
	color: var(--slate-800);
}

.total-row.grand .tr-value {
	font-weight: 700;
	color: var(--green-800);
}

/* ─── Summary Metadata ─── */
.summary-meta {
	background: var(--white);
	border-top: 1px solid var(--slate-200);
	padding: 1rem 1.5rem;
	font-size: 0.75rem;
	color: var(--slate-400);
	line-height: 1.6;
}

.summary-meta strong {
	color: var(--slate-600);
}

/* ─── Help Box ─── */
.help-box {
	margin-top: 1.25rem;
	border: 1px solid var(--slate-200);
	border-radius: var(--radius);
	padding: 1.25rem;
	text-align: center;
}

.help-box h4 {
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--slate-800);
	margin-bottom: 0.35rem;
}

.help-box p {
	font-size: 0.78rem;
	color: var(--slate-500);
	margin-bottom: 0.75rem;
	line-height: 1.5;
}

.help-links {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
}

.help-links a {
	font-size: 0.8rem;
	font-weight: 500;
	color: var(--green-700);
	text-decoration: none;
}

.help-links a:hover {
	color: var(--green-800);
}

/* ═══════════════════════════════════════════════
   QUOTE PREVIEW / PRINT DOCUMENT
   ═══════════════════════════════════════════════ */

.quote-preview-body {
	background: var(--slate-200);
	padding: 2rem;
	min-height: 100vh;
}

/* ─── Toolbar ─── */
.qp-toolbar {
	max-width: 850px;
	margin: 0 auto 1.5rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
}

.qp-toolbar-left a {
	font-size: 0.85rem;
	color: var(--slate-600);
	text-decoration: none;
	font-weight: 500;
}

.qp-toolbar-left a:hover {
	color: var(--green-700);
}

.qp-toolbar-right {
	display: flex;
	gap: 0.5rem;
}

.btn-toolbar {
	padding: 0.55rem 1.25rem;
	border-radius: 6px;
	font-size: 0.85rem;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.15s;
	border: none;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	font-family: var(--font-body);
}

.btn-download {
	background: var(--green-700);
	color: var(--white);
}

.btn-download:hover {
	background: var(--green-800);
}

.btn-print {
	background: var(--white);
	color: var(--slate-700);
	border: 1px solid var(--slate-300);
}

.btn-print:hover {
	background: var(--slate-50);
}

.btn-email-copy {
	background: var(--white);
	color: var(--slate-700);
	border: 1px solid var(--slate-300);
}

.btn-email-copy:hover {
	background: var(--slate-50);
}

/* ─── The Quote Document ─── */
.quote-doc {
	max-width: 850px;
	margin: 0 auto;
	background: var(--white);
	border-radius: 8px;
	box-shadow: 0 4px 24px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.06);
	overflow: hidden;
}

/* ─── Document Header ─── */
.doc-header {
	background: var(--white);
	padding: 2.5rem 3rem;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	border-bottom: 3px solid var(--green-700);
}

.doc-header-left img {
	height: 56px;
	width: auto;
	margin-bottom: 0.75rem;
}

.company-info {
	font-size: 0.75rem;
	color: var(--slate-500);
	line-height: 1.6;
}

.doc-header-right {
	text-align: right;
}

.doc-title {
	font-family: var(--font-display);
	font-size: 2.2rem;
	font-weight: 700;
	color: var(--green-800);
	letter-spacing: 0.05em;
	margin-bottom: 0.75rem;
}

.doc-meta {
	font-size: 0.8rem;
	color: var(--slate-500);
	line-height: 1.8;
}

.doc-meta strong {
	color: var(--slate-700);
	font-weight: 600;
}

.quote-number {
	font-family: var(--font-mono);
	color: var(--green-700);
	font-weight: 600;
	font-size: 0.85rem;
}

/* ─── Document Body ─── */
.doc-body {
	padding: 2.5rem 3rem;
}

/* Prepared For / Ship To */
.address-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 2rem;
	margin-bottom: 2.5rem;
	padding-bottom: 2rem;
	border-bottom: 1px solid var(--slate-100);
}

.address-block h4 {
	font-size: 0.7rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--slate-400);
	margin-bottom: 0.5rem;
}

.address-block .ab-name {
	font-size: 1rem;
	font-weight: 600;
	color: var(--slate-900);
}

.address-block .ab-org {
	font-size: 0.9rem;
	color: var(--slate-700);
	font-weight: 500;
}

.address-block .ab-detail {
	font-size: 0.82rem;
	color: var(--slate-500);
	line-height: 1.6;
	margin-top: 0.25rem;
}

/* Line Items Table */
.items-section {
	margin-bottom: 2rem;
}

.items-table {
	width: 100%;
	border-collapse: collapse;
}

.items-table thead th {
	font-size: 0.7rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--slate-400);
	padding: 0.75rem 0.5rem;
	border-bottom: 2px solid var(--slate-200);
	text-align: left;
}

.items-table thead th.right { text-align: right; }
.items-table thead th.center { text-align: center; }

.items-table tbody td {
	padding: 1rem 0.5rem;
	font-size: 0.88rem;
	border-bottom: 1px solid var(--slate-100);
	vertical-align: top;
}

.items-table tbody td.right { text-align: right; }
.items-table tbody td.center { text-align: center; }

.item-name {
	font-weight: 600;
	color: var(--slate-800);
}

.item-sku {
	font-family: var(--font-mono);
	font-size: 0.7rem;
	color: var(--slate-400);
	margin-top: 0.1rem;
}

.item-desc {
	font-size: 0.78rem;
	color: var(--slate-500);
	margin-top: 0.15rem;
}

/* Totals */
.totals-section {
	display: flex;
	justify-content: flex-end;
	margin-bottom: 2.5rem;
}

.totals-box {
	width: 320px;
}

.totals-row {
	display: flex;
	justify-content: space-between;
	padding: 0.5rem 0;
	font-size: 0.88rem;
}

.totals-row .tl { color: var(--slate-500); }
.totals-row .tv { font-weight: 500; color: var(--slate-800); }
.totals-row.shipping .tv { color: var(--green-700); font-weight: 600; }

.totals-row.grand {
	margin-top: 0.5rem;
	padding-top: 0.75rem;
	border-top: 2px solid var(--slate-800);
	font-size: 1.15rem;
}

.totals-row.grand .tl { font-weight: 600; color: var(--slate-800); }
.totals-row.grand .tv { font-weight: 700; color: var(--green-800); font-size: 1.25rem; }

/* Notes */
.notes-section {
	background: var(--slate-50);
	border: 1px solid var(--slate-100);
	border-radius: 6px;
	padding: 1.25rem 1.5rem;
	margin-bottom: 2.5rem;
}

.notes-section h4,
.terms-section h4,
.acceptance-section h4 {
	font-size: 0.7rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--slate-400);
	margin-bottom: 0.5rem;
}

.notes-section p {
	font-size: 0.82rem;
	color: var(--slate-600);
	line-height: 1.6;
}

/* Terms */
.terms-section {
	margin-bottom: 2.5rem;
}

.terms-section h4 {
	margin-bottom: 0.75rem;
}

.terms-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1rem;
}

.term-item {
	font-size: 0.8rem;
}

.term-item .term-label {
	font-weight: 600;
	color: var(--slate-700);
	margin-bottom: 0.1rem;
}

.term-item .term-value {
	color: var(--slate-500);
}

/* Acceptance / Signature */
.acceptance-section {
	border-top: 1px solid var(--slate-200);
	padding-top: 2rem;
	margin-bottom: 1rem;
}

.acceptance-section h4 {
	margin-bottom: 0.5rem;
}

.acceptance-section > p {
	font-size: 0.8rem;
	color: var(--slate-500);
	margin-bottom: 1.5rem;
	max-width: 500px;
}

.sig-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 2rem;
}

.sig-line {
	border-bottom: 1px solid var(--slate-300);
	height: 40px;
	margin-bottom: 0.35rem;
}

.sig-label {
	font-size: 0.72rem;
	color: var(--slate-400);
	font-weight: 500;
}

/* ─── Document Footer ─── */
.doc-footer {
	background: var(--slate-50);
	border-top: 1px solid var(--slate-100);
	padding: 1.5rem 3rem;
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 0.75rem;
	color: var(--slate-400);
}

.doc-footer a {
	color: var(--green-700);
	text-decoration: none;
	font-weight: 500;
}

.doc-footer-center {
	text-align: center;
}

/* ─── Confirmation Banner ─── */
.confirmation-banner {
	max-width: 850px;
	margin: 1.5rem auto 0;
	background: var(--green-50);
	border: 1px solid var(--green-200);
	border-radius: 8px;
	padding: 1.25rem 1.5rem;
	display: flex;
	align-items: center;
	gap: 1rem;
}

.cb-icon {
	font-size: 1.5rem;
	flex-shrink: 0;
}

.cb-text {
	flex: 1;
}

.cb-text strong {
	font-size: 0.9rem;
	color: var(--green-800);
	display: block;
}

.cb-text p {
	font-size: 0.8rem;
	color: var(--slate-600);
	margin-top: 0.15rem;
}

.cb-actions {
	display: flex;
	gap: 0.5rem;
	flex-shrink: 0;
}

.cb-actions a {
	font-size: 0.8rem;
	font-weight: 600;
	color: var(--green-700);
	text-decoration: none;
	padding: 0.4rem 0.75rem;
	border: 1px solid var(--green-200);
	border-radius: 4px;
}

.cb-actions a:hover {
	background: var(--green-100);
}

/* ─── Error State for Quote Preview ─── */
.qp-error {
	max-width: 850px;
	margin: 3rem auto;
	background: var(--white);
	border-radius: var(--radius-lg);
	padding: 3rem;
	text-align: center;
}

.qp-error h2 {
	font-family: var(--font-display);
	color: var(--slate-800);
	margin-bottom: 0.75rem;
}

.qp-error p {
	color: var(--slate-500);
	margin-bottom: 1.5rem;
}

/* ═══ PRINT STYLES ═══ */
@media print {
	@page { margin: 0.5in 0.6in; size: letter; }

	.quote-preview-body {
		background: white;
		padding: 0;
		font-size: 9pt;
	}

	.qp-toolbar,
	.confirmation-banner {
		display: none !important;
	}

	.quote-doc {
		box-shadow: none;
		border-radius: 0;
		max-width: 100%;
	}

	.doc-header {
		padding: 1rem 0;
	}

	.doc-body {
		padding: 1rem 0;
	}

	.doc-footer {
		padding: 0.5rem 0;
	}

	/* Keep sections together */
	.sig-section, .acceptance-section { page-break-inside: avoid !important; page-break-before: auto; }
	.terms-section, .terms-grid { page-break-inside: avoid !important; }
	.notes-box { page-break-inside: avoid !important; }
	.totals-section, .totals-box { page-break-inside: avoid !important; }
	tr { page-break-inside: avoid !important; }
	.sig-row { page-break-inside: avoid !important; }
	/* Keep the entire bottom section (terms + signature) together */
	.notes-section ~ * { page-break-inside: avoid !important; }

	/* Aggressive print tightening — 2 pages for single-item quote */
	* { line-height: 1.3 !important; }
	.quote-preview-body { font-size: 8.5pt !important; }
	.quote-title { font-size: 18pt !important; letter-spacing: 1px !important; }
	.meta-table td { font-size: 7.5pt !important; padding: 0px 0 !important; }
	.section-label { font-size: 6.5pt !important; margin-bottom: 1px !important; }
	.items-table th { font-size: 7pt !important; padding: 2px 4px !important; }
	.items-table td { padding: 4px !important; font-size: 8.5pt !important; }
	.sig-row { margin-top: 0.4rem !important; }
	.sig-line { height: 16px !important; }
	.term { margin-bottom: 2px !important; font-size: 7.5pt !important; }
	.notes-section { padding: 4px 8px !important; margin-bottom: 0 !important; font-size: 7pt !important; }
	.notes-section h4 { font-size: 8pt !important; margin-bottom: 2px !important; }
	.notes-section p { margin: 0 !important; }

	/* Reduce header and body padding */
	.doc-header { padding: 0.5rem 1.5rem !important; }
	.doc-header-left .co-name { font-size: 12pt !important; }
	.doc-header-left .co-info { font-size: 7pt !important; line-height: 1.3 !important; }
	.doc-body { padding: 0.5rem 1.5rem !important; }
	.doc-footer { padding: 0.3rem 1.5rem !important; font-size: 6.5pt !important; }

	/* Reduce customer info spacing */
	.bill-ship-grid, [class*="bill"], [class*="ship"] { margin-bottom: 0.4rem !important; padding-bottom: 0.4rem !important; }
	.addr-name { font-size: 9pt !important; }
	.addr-detail { font-size: 7.5pt !important; }

	/* Totals tight */
	.totals-section { margin-bottom: 0.3rem !important; margin-top: 0.3rem !important; }
	.totals-row { padding: 1px 0 !important; font-size: 8pt !important; }
	.totals-row.grand { padding-top: 3px !important; margin-top: 3px !important; font-size: 10pt !important; }
	.totals-box { margin-bottom: 0.3rem !important; }

	/* Items section */
	.items-section { margin-bottom: 0.3rem !important; }

	/* Force terms + signature to page 2 together */
	.notes-section { page-break-inside: avoid !important; margin-bottom: 0 !important; padding-bottom: 0.25rem !important; }
	.notes-section + .terms-section { page-break-before: always !important; }
	.totals-section + .notes-section { page-break-inside: avoid !important; }
}

/* ═══ RESPONSIVE ═══ */
@media (max-width: 1024px) {
	.quote-layout {
		grid-template-columns: 1fr;
	}

	.quote-summary {
		position: static;
	}

	.product-selector {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 768px) {
	.field-row {
		grid-template-columns: 1fr;
	}

	.quote-preview-body {
		padding: 1rem;
	}

	.doc-header {
		flex-direction: column;
		gap: 1.5rem;
		padding: 1.5rem;
	}

	.doc-header-right {
		text-align: left;
	}

	.doc-body {
		padding: 1.5rem;
	}

	.doc-footer {
		flex-direction: column;
		gap: 0.5rem;
		text-align: center;
		padding: 1rem 1.5rem;
	}

	.address-row {
		grid-template-columns: 1fr;
	}

	.terms-grid {
		grid-template-columns: 1fr;
	}

	.sig-row {
		grid-template-columns: 1fr;
	}

	.qp-toolbar {
		flex-direction: column;
		align-items: stretch;
	}

	.qp-toolbar-right {
		justify-content: center;
	}

	.confirmation-banner {
		flex-direction: column;
		text-align: center;
	}

	.cb-actions {
		justify-content: center;
	}
}

@media (max-width: 480px) {
	.quote-page {
		padding: 2rem 0 3rem;
	}

	.quote-header h1 {
		font-size: 1.6rem;
	}

	.steps-indicator {
		gap: 0.25rem;
	}

	.step-label {
		display: none;
	}
}