.tv-rekentool {
	--tv-blue: #1a5fa8;
	--tv-blue-dark: #124878;
	--tv-grey: #6b7280;
	--tv-bg: #f4f7fb;
	--tv-border: #d9e2ec;
	max-width: 640px;
	margin: 0 auto;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
	color: #1f2937;
	box-sizing: border-box;
}
.tv-rekentool *, .tv-rekentool *::before, .tv-rekentool *::after { box-sizing: inherit; }

.tv-steps {
	display: flex;
	justify-content: space-between;
	margin-bottom: 24px;
	border-bottom: 2px solid var(--tv-border);
}
.tv-step {
	flex: 1;
	text-align: center;
	padding: 10px 4px;
	font-size: 14px;
	font-weight: 600;
	color: var(--tv-grey);
	border-bottom: 3px solid transparent;
	margin-bottom: -2px;
}
.tv-step.active {
	color: var(--tv-blue);
	border-bottom-color: var(--tv-blue);
}

.tv-panel h3 {
	margin: 0 0 16px;
	font-size: 19px;
	color: var(--tv-blue-dark);
}

.tv-field { margin-bottom: 16px; }
.tv-field label {
	display: block;
	font-size: 14px;
	font-weight: 600;
	margin-bottom: 6px;
}
.tv-field input {
	width: 100%;
	padding: 11px 12px;
	font-size: 15px;
	border: 1px solid var(--tv-border);
	border-radius: 8px;
	background: #fff;
}
.tv-field input:focus {
	outline: none;
	border-color: var(--tv-blue);
	box-shadow: 0 0 0 3px rgba(26, 95, 168, 0.15);
}
.tv-hint {
	margin: 6px 0 0;
	font-size: 12.5px;
	color: var(--tv-grey);
}

.tv-btn {
	display: inline-block;
	padding: 12px 24px;
	font-size: 15px;
	font-weight: 600;
	border: none;
	border-radius: 8px;
	cursor: pointer;
	margin-top: 8px;
	margin-right: 8px;
}
.tv-btn-next, .tv-btn-pdf {
	background: var(--tv-blue);
	color: #fff;
}
.tv-btn-next:hover, .tv-btn-pdf:hover { background: var(--tv-blue-dark); }
.tv-btn-back {
	background: transparent;
	color: var(--tv-grey);
	border: 1px solid var(--tv-border);
}
.tv-btn-back:hover { background: var(--tv-bg); }
.tv-btn:disabled { opacity: 0.6; cursor: default; }

.tv-error {
	background: #fdecea;
	color: #b42318;
	border: 1px solid #f5c2c0;
	border-radius: 8px;
	padding: 12px 14px;
	margin-bottom: 16px;
	font-size: 14px;
}

/* Resultaatweergave */
.tv-result-hero {
	background: var(--tv-bg);
	border-radius: 12px;
	padding: 20px;
	margin-bottom: 20px;
	text-align: center;
}
.tv-result-hero .tv-label {
	font-size: 13px;
	color: var(--tv-grey);
	text-transform: uppercase;
	letter-spacing: 0.04em;
}
.tv-result-hero .tv-amount {
	font-size: 34px;
	font-weight: 700;
	color: var(--tv-blue-dark);
	margin: 4px 0;
}
.tv-result-hero .tv-amount.tv-netto { color: var(--tv-blue); font-size: 22px; }

.tv-table {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 18px;
	font-size: 14px;
}
.tv-table th {
	text-align: left;
	background: var(--tv-bg);
	padding: 8px 10px;
	font-size: 12.5px;
	text-transform: uppercase;
	color: var(--tv-grey);
}
.tv-table td {
	padding: 8px 10px;
	border-bottom: 1px solid var(--tv-border);
}
.tv-table td.tv-num, .tv-table th.tv-num { text-align: right; }
.tv-table tr.tv-total td { font-weight: 700; border-top: 2px solid var(--tv-border); border-bottom: none; }

.tv-note {
	font-size: 12.5px;
	color: var(--tv-grey);
	line-height: 1.5;
	margin-top: 20px;
}

/* -------------------------------------------------------------------
   PDF via "Afdrukken naar PDF" (window.print), i.p.v. een JS-canvas-
   library. Dit is de meest betrouwbare methode: de browser rendert
   #tv-print-area zelf, zonder tussenkomst van externe bibliotheken.
   Op het scherm blijft #tv-print-area altijd verborgen; alleen tijdens
   het afdrukken (@media print) wordt het zichtbaar en de rest van de
   pagina verborgen.
   ------------------------------------------------------------------- */
#tv-print-area { display: none; }

@media print {
	body * { visibility: hidden !important; }
	#tv-print-area, #tv-print-area * { visibility: visible !important; }
	#tv-print-area, #tv-print-area * {
		box-sizing: border-box;
	}
	#tv-print-area {
		display: block !important;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		margin: 0;
		padding: 6px 30px 0;
		font-family: Calibri, Arial, Helvetica, sans-serif;
		color: #000;
		background: #fff;
		font-size: 12px;
	}

	/* Header: logo + tagline */
	#tv-print-area .tv-pdf-header { margin-bottom: 8px; }
	#tv-print-area .tv-pdf-header img { height: 32px; display: block; }
	#tv-print-area .tv-pdf-tagline { font-size: 11px; color: #000; margin-top: 2px; }

	#tv-print-area h1 { font-size: 14px; font-weight: normal; color: #000; margin: 0 0 8px; }

	/* Tabellen: dunne zwarte randen, zoals in het Word-sjabloon */
	#tv-print-area table {
		width: 100%;
		border-collapse: collapse;
		margin-bottom: 8px;
		font-size: 11px;
		page-break-inside: avoid;
	}
	#tv-print-area table, #tv-print-area th, #tv-print-area td {
		border: 1px solid #000;
	}
	#tv-print-area td, #tv-print-area th {
		padding: 3px 7px;
		text-align: left;
		vertical-align: top;
	}
	#tv-print-area .tv-pdf-summary td:first-child { width: 55%; }
	#tv-print-area .tv-pdf-opbouw th { font-weight: bold; background: #fff; }
	#tv-print-area tr.tv-total td { font-weight: bold; }

	/* Grote resultaatregels */
	#tv-print-area .tv-pdf-result {
		font-size: 15px;
		font-weight: bold;
		margin: 4px 0 8px;
	}

	/* Blauw vak voor de netto-indicatie, kleur overgenomen uit het
	   Word-sjabloon */
	#tv-print-area .tv-pdf-bluebox {
		background: #a6caec;
		padding: 10px 16px;
		margin: 0 0 8px;
	}
	#tv-print-area .tv-pdf-bluebox h2 { font-size: 13px; font-weight: normal; margin: 0 0 6px; }
	#tv-print-area .tv-pdf-bluebox table { border-color: #4472a8; margin-bottom: 6px; }
	#tv-print-area .tv-pdf-bluebox table, #tv-print-area .tv-pdf-bluebox th, #tv-print-area .tv-pdf-bluebox td {
		border-color: #4472a8;
	}
	#tv-print-area .tv-pdf-bluebox .tv-pdf-result { margin: 4px 0 4px; }
	#tv-print-area .tv-pdf-sub { font-weight: normal; font-size: 10px; }
	#tv-print-area .tv-pdf-small { font-size: 9px; line-height: 1.3; margin: 0; }

	#tv-print-area .tv-pdf-advies {
		font-size: 11px;
		line-height: 1.35;
		margin: 8px 0 8px;
	}

	/* Voettekst: datum links, tekst midden, logo rechts */
	#tv-print-area .tv-pdf-footer {
		display: flex;
		align-items: center;
		justify-content: space-between;
		border-top: 1px solid #000;
		padding-top: 5px;
		font-size: 9px;
		font-weight: bold;
		gap: 10px;
	}
	#tv-print-area .tv-pdf-footer-logo img { height: 16px; display: block; }

	/* Juridische disclaimer volgt direct door, geen geforceerde
	   paginabreuk meer — alles moet op één pagina passen. */
	#tv-print-area .tv-pdf-disclaimer {
		font-size: 9px;
		line-height: 1.3;
		margin: 8px 0 0;
	}

	@page { margin: 8px 0; }
}