/* NLD ICM Dash — design tokens (light + dark), per the NLD design handoff.
   Accent + fonts are injected per-dealer via the inline #nld-icm-brand <style>. */

@import url('https://fonts.googleapis.com/css2?family=Hanken+Grotesk:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap');

.nld-icm {
	/* Brand (overridden by inline #nld-icm-brand) */
	--accent: var(--nld-accent, #E8A33D);
	--accent-ink: var(--nld-accent-ink, #1A1206);
	--accent-soft: var(--nld-accent-soft, rgba(232, 163, 61, 0.14));
	--pos: #2E9E4A;
	--pos-soft: rgba(46, 158, 74, 0.14);
	--neg: #E5484D;
	--neg-soft: rgba(229, 72, 77, 0.14);
	--info: #3B82F6;

	/* Radii */
	--r: 16px;
	--r-sm: 10px;
	--r-xs: 7px;

	/* Type */
	--fh: var(--nld-fh, 'Hanken Grotesk', system-ui, sans-serif);
	--fb: var(--nld-fb, 'Hanken Grotesk', system-ui, sans-serif);
	--fm: 'JetBrains Mono', ui-monospace, monospace;

	/* Light defaults */
	--bg: #F4F6F9;
	--surface: #FFFFFF;
	--s2: #F6F8FB;
	--s3: #EEF1F6;
	--border: #E2E7EE;
	--border-soft: #ECEFF4;
	--text: #131820;
	--muted: #5C6773;
	--faint: #97A1AD;
	--track: #E4E9F0;
	--scrim: rgba(20, 28, 38, 0.45);
	--shadow: 0 1px 2px rgba(20, 28, 38, 0.05), 0 8px 24px rgba(20, 28, 38, 0.08);
	--pop: 0 18px 50px rgba(20, 28, 38, 0.22);
	/* Readable default for drive-away breakdown labels (light mode). */
	--da-label: #5C6773;

	color: var(--nld-text-body, var(--text));
	font-family: var(--fb);
	font-size: 15px;
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
}

/* Dealer-tunable heading colour (per light/dark mode), falls back to scheme text. */
.nld-icm h1, .nld-icm h2, .nld-icm h3, .nld-icm h4,
.nld-icm .nld-form-title, .nld-icm .nld-stage-title, .nld-icm .nld-success-title,
.nld-icm .nld-srp-title, .nld-icm .nld-srp-card-title, .nld-icm .nld-inv-head h1,
.nld-icm .nld-vdp-head h2, .nld-icm .nld-veh-title, .nld-icm .nld-stat-value,
.nld-icm .nld-price-big, .nld-icm .nld-calc-payment {
	color: var(--nld-text-heading, var(--text));
}
/* Accent-coloured numerics keep the accent (override the heading colour). */
.nld-icm .nld-price-big, .nld-icm .nld-calc-payment, .nld-icm .nld-srp-payment, .nld-icm .nld-veh-price {
	color: var(--accent);
}

/* Dark theme (applied via [data-theme="dark"] on the .nld-icm root) */
.nld-icm[data-theme="dark"] {
	--bg: #0B0F14;
	--surface: #161B22;
	--s2: #1C232C;
	--s3: #232C36;
	--border: #26303B;
	--border-soft: #1F2730;
	--text: #E6EDF3;
	--muted: #8B98A5;
	--faint: #5B6672;
	--track: #2A3440;
	--scrim: rgba(5, 8, 11, 0.72);
	--shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 10px 28px rgba(0, 0, 0, 0.3);
	--pop: 0 18px 50px rgba(0, 0, 0, 0.55);
	/* Brighter than --muted so breakdown labels read clearly on dark surfaces. */
	--da-label: #C2CCD6;
}

/* Shared primitives */
.nld-icm *, .nld-icm *::before, .nld-icm *::after { box-sizing: border-box; }

.nld-icm .nld-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	border-radius: var(--r-sm);
	border: 1px solid transparent;
	padding: 11px 16px;
	font-family: var(--fb);
	font-size: 14.5px;
	font-weight: 700;
	cursor: pointer;
	min-height: 44px;
	transition: filter .15s ease, background .15s ease, color .15s ease, border-color .15s ease;
	text-decoration: none;
	line-height: 1;
}
.nld-icm .nld-btn-primary { background: var(--accent); color: var(--accent-ink); }
.nld-icm .nld-btn-primary:hover { filter: brightness(1.05); }
.nld-icm .nld-btn-ghost { background: var(--s2); color: var(--muted); border-color: var(--border); }
.nld-icm .nld-btn-ghost:hover { color: var(--text); border-color: var(--accent); }
.nld-icm .nld-btn-danger { background: var(--neg-soft); color: var(--neg); border-color: transparent; }
.nld-icm .nld-btn[disabled] { opacity: .5; cursor: not-allowed; }

.nld-icm input[type=text], .nld-icm input[type=email], .nld-icm input[type=tel],
.nld-icm input[type=number], .nld-icm input[type=date], .nld-icm input[type=url],
.nld-icm input[type=datetime-local], .nld-icm input[type=search], .nld-icm select, .nld-icm textarea {
	width: 100%;
	background: var(--s2);
	border: 1.5px solid var(--border);
	border-radius: var(--r-sm);
	padding: 11px 13px;
	min-height: 44px;
	font-family: var(--fb);
	font-size: 15px;
	color: var(--text);
	outline: none;
	transition: border-color .15s ease, box-shadow .15s ease;
}
.nld-icm textarea { min-height: auto; }
.nld-icm input:focus, .nld-icm select:focus, .nld-icm textarea:focus {
	border-color: var(--accent);
	box-shadow: 0 0 0 3px var(--accent-soft);
}
.nld-icm select {
	appearance: none;
	-webkit-appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238B98A5' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 12px center;
	padding-right: 34px;
}

.nld-icm .nld-chip {
	display: inline-block;
	font-size: 11px;
	background: var(--s2);
	border: 1px solid var(--border);
	border-radius: var(--r-xs);
	padding: 3px 8px;
	color: var(--muted);
}
/* Inventory-type flag chip (Used / New / Ex-Rental). */
.nld-icm .nld-chip-lot { background: var(--accent-soft); color: var(--accent); border-color: transparent; font-weight: 700; }
.nld-icm .nld-chip-lot-new { background: var(--pos-soft); color: var(--pos); }

.nld-icm .nld-theme-toggle {
	background: var(--s2);
	border: 1px solid var(--border);
	color: var(--text);
	width: 38px;
	height: 38px;
	border-radius: var(--r-sm);
	cursor: pointer;
	font-size: 18px;
	line-height: 1;
}

/* Field rows: wrap to single column on mobile */
.nld-icm .nld-field-row { display: flex; flex-wrap: wrap; gap: 13px; margin-bottom: 14px; }
.nld-icm .nld-field { flex: 1 1 160px; }
.nld-icm .nld-field-full { flex-basis: 100%; }
.nld-icm .nld-field label {
	display: block;
	font-size: 12.5px;
	font-weight: 600;
	color: var(--muted);
	margin-bottom: 5px;
}
.nld-icm tabular { font-variant-numeric: tabular-nums; }