:root {
	--iamqs-blue: #2563eb;
	--iamqs-blue-dark: #1d4ed8;
	--iamqs-orange: #f97316;
	--iamqs-orange-dark: #ea580c;
	--iamqs-tekst: #1a1a1a;
}

/* Alle plugin-wrappers expliciet zwarte tekst geven, ongeacht thema-styling.
   !important is hier bewust: veel WordPress-thema's zetten kleur op p/label/
   input met eigen specificiteit, en die moet altijd verliezen binnen de plugin. */
.iamqs-scan,
.iamqs-report,
.iamqs-registratie {
	color: var(--iamqs-tekst) !important;
	max-width: 1100px;
	margin: 0 auto;
}

.iamqs-scan p,
.iamqs-scan span,
.iamqs-scan label,
.iamqs-scan h3,
.iamqs-scan a,
.iamqs-scan input,
.iamqs-scan textarea,
.iamqs-scan select,
.iamqs-report p,
.iamqs-report span,
.iamqs-report label,
.iamqs-report h3,
.iamqs-report td,
.iamqs-report th,
.iamqs-registratie p,
.iamqs-registratie span,
.iamqs-registratie label,
.iamqs-registratie h2,
.iamqs-registratie input,
.iamqs-registratie select {
	color: var(--iamqs-tekst) !important;
}

.iamqs-report,
.iamqs-registratie {
	max-width: 820px;
}

.iamqs-radar-svg {
	max-width: 640px;
	width: 100%;
	height: auto;
	display: block;
	margin: 0 auto;
}

/* Wit alleen in een echte browser (donker thema op de pagina). Een
   HTML-naar-PDF renderer (bijv. een PDF-generator plugin) rendert
   doorgaans niet als "screen"-media en valt terug op de standaard
   zwarte tekst hierboven — belangrijk, anders is de tekst onzichtbaar
   op een wit PDF-canvas. */
@media screen {
	.iamqs-radar-svg {
		color: #ffffff !important;
	}
}

.iamqs-radar-wrap {
	margin: 0 0 1.5em;
}

.iamqs-registratie {
	max-width: 480px;
}

/* ---------- Layout: sticky zijbalk (JS-gestuurd) + vragenkolom ---------- */

.iamqs-layout {
	display: flex;
	align-items: flex-start;
	gap: 2.5em;
}

.iamqs-sidebar {
	flex: 0 0 280px;
	position: relative;
}

.iamqs-sidebar-inner {
	/* JS zet hier tijdens scrollen inline position:fixed op, en verplaatst
	   het element naar document.body — geen CSS-klasse nodig. */
}

.iamqs-vragen-kolom {
	flex: 1;
	min-width: 0;
}

@media (max-width: 782px) {
	.iamqs-layout {
		flex-direction: column;
	}
	.iamqs-sidebar {
		width: 100%;
	}
}

/* ---------- As-secties ---------- */

.iamqs-as h3,
.iamqs-report h3 {
	margin-top: 2em;
	border-bottom: 3px solid var(--iamqs-orange);
	padding-bottom: 0.3em;
}

/* Hogere specificiteit dan de algemene .iamqs-scan h3 { color: zwart }
   regel hierboven, zodat de as-titels altijd oranje blijven — ook op
   een donkere thema-achtergrond waar zwarte tekst onleesbaar zou zijn. */
.iamqs-scan .iamqs-as h3,
.iamqs-scan .iamqs-vragen-kolom h3,
.iamqs-report h3 {
	color: var(--iamqs-orange) !important;
}

.iamqs-vraag {
	margin: 1.2em 0;
	padding: 1em;
	background: #f7f8fa;
	border-radius: 6px;
	border-left: 3px solid transparent;
}

.iamqs-vraagtekst {
	font-weight: 600;
	margin: 0 0 0.6em;
}

.iamqs-opties label {
	margin-right: 1.2em;
	font-weight: normal;
}

.iamqs-toelichting {
	display: block;
	width: 100%;
	margin-top: 0.6em;
	min-height: 2.5em;
	box-sizing: border-box;
	background: #fff !important;
}

.iamqs-opslag-status {
	display: inline-block;
	margin-top: 0.4em;
	font-size: 0.85em;
	color: #16a34a !important;
}

#iamqs-radar-frontend,
#iamqs-radar-report,
#iamqs-radar {
	margin: 0 0 1.2em;
}

.iamqs-as-score {
	font-weight: normal;
	color: #475569 !important;
}

.iamqs-report-status {
	background: #fef3c7;
	border-left: 4px solid var(--iamqs-orange-dark);
	padding: 0.8em 1em;
}

.iamqs-report-table {
	background: #fff;
}

.iamqs-report-table td,
.iamqs-report-table th {
	vertical-align: top;
	background: #fff;
	color: #1a1a1a !important;
}

.iamqs-report-table thead th {
	background: #eef0f2;
}

/* ---------- Voortgang ---------- */

.iamqs-voortgang-wrap {
	margin-bottom: 1.4em;
}

.iamqs-voortgang-balk-buiten {
	background: #e5e7eb;
	border-radius: 999px;
	height: 10px;
	overflow: hidden;
}

.iamqs-voortgang-balk-binnen {
	background: var(--iamqs-orange);
	height: 100%;
	transition: width 0.3s ease;
}

.iamqs-voortgang-tekst {
	margin: 0.5em 0 0;
	font-size: 0.9em;
}

.iamqs-voortgang-tip {
	margin: 0.6em 0 0;
	font-size: 0.82em;
	font-style: italic;
	opacity: 0.85;
}

/* ---------- As-navigatie (sprongknoppen) ---------- */

.iamqs-as-nav {
	display: flex;
	flex-direction: column;
	gap: 0.4em;
}

.iamqs-as-link {
	display: block;
	padding: 0.5em 0.8em;
	border-radius: 4px;
	border: 1px solid #d1d5db;
	background: #fff;
	text-decoration: none !important;
	font-size: 0.88em;
	transition: background 0.15s ease, border-color 0.15s ease;
}

.iamqs-as-link:hover {
	border-color: var(--iamqs-orange);
}

.iamqs-as-link.active {
	background: var(--iamqs-orange);
	border-color: var(--iamqs-orange);
	color: #fff !important;
}

/* ---------- Formulier / knoppen ---------- */

.iamqs-input {
	width: 100%;
	box-sizing: border-box;
	padding: 0.5em;
	background: #fff !important;
}

.iamqs-button {
	background: var(--iamqs-orange);
	color: #fff !important;
	border: none;
	border-radius: 4px;
	padding: 0.7em 1.4em;
	font-size: 1em;
	cursor: pointer;
	display: inline-block;
	text-decoration: none !important;
}

.iamqs-button:hover {
	background: var(--iamqs-orange-dark);
}

.iamqs-report-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1em;
	flex-wrap: wrap;
}

.iamqs-report-header h2 {
	margin: 0;
}

.iamqs-report-header-knoppen {
	display: flex;
	gap: 0.6em;
	flex-wrap: wrap;
}

.iamqs-genereer-pdf-resultaat {
	flex-basis: 100%;
	font-size: 0.9em;
	color: #16a34a !important;
	word-break: break-all;
}

.iamqs-genereer-pdf-resultaat a {
	color: #16a34a !important;
}

@media print {
	.iamqs-pdf-knop {
		display: none !important;
	}

	body {
		background: #fff !important;
	}

	.iamqs-report {
		color: #000 !important;
		max-width: none;
	}

	.iamqs-report * {
		color: #000 !important;
	}

	.iamqs-report h3 {
		color: #000 !important;
		border-bottom-color: #000 !important;
		break-after: avoid;
		page-break-after: avoid;
	}

	.iamqs-report-table {
		break-inside: auto;
	}

	.iamqs-report-table tr {
		break-inside: avoid;
		page-break-inside: avoid;
	}
}

.iamqs-indienen-wrap {
	margin-top: 2.5em;
	padding-top: 1.5em;
	border-top: 1px solid #d1d5db;
	text-align: right;
}

.iamqs-indienen-button {
	font-size: 1.05em;
	padding: 0.8em 1.8em;
}

.iamqs-vraag--onbeantwoord {
	border-left-color: #dc2626;
	background: #fef2f2;
	box-shadow: 0 0 0 1px #dc2626;
}

.iamqs-indien-waarschuwing {
	margin-top: 0.8em;
	text-align: right;
	color: #dc2626 !important;
	font-weight: 600;
}

/* ---------- Plan van aanpak ---------- */

.iamqs-plan {
	margin-top: 3em;
	padding-top: 1.5em;
	border-top: 2px solid var(--iamqs-orange);
}

.iamqs-plan-titel {
	margin-top: 0;
	border-bottom: none !important;
}

.iamqs-plan-intro {
	max-width: 640px;
	background: #fff;
	color: #1a1a1a !important;
	border-radius: 6px;
	padding: 1em 1.2em;
}

.iamqs-milestones {
	list-style: none;
	margin: 1.5em 0 0;
	padding: 0;
	counter-reset: none;
}

.iamqs-milestone {
	background: #fff;
	border-left: 4px solid var(--iamqs-orange);
	border-radius: 6px;
	padding: 1em 1.2em;
	margin-bottom: 1.2em;
}

.iamqs-milestone-kop {
	display: flex;
	align-items: baseline;
	gap: 0.7em;
	flex-wrap: wrap;
	margin-bottom: 0.7em;
}

.iamqs-milestone-nummer {
	background: var(--iamqs-orange);
	color: #fff !important;
	font-size: 0.8em;
	font-weight: 700;
	padding: 0.2em 0.7em;
	border-radius: 999px;
	white-space: nowrap;
}

.iamqs-milestone-naam {
	font-weight: 700;
	color: #1a1a1a !important;
}

.iamqs-actiepunten {
	list-style: none;
	margin: 0;
	padding: 0;
}

.iamqs-actiepunt {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.5em;
	padding: 0.5em 0;
	border-top: 1px solid #eee;
	color: #1a1a1a !important;
}

.iamqs-actiepunt:first-child {
	border-top: none;
}

.iamqs-prioriteit-badge {
	font-size: 0.72em;
	font-weight: 700;
	text-transform: uppercase;
	padding: 0.15em 0.5em;
	border-radius: 4px;
	color: #fff !important;
	white-space: nowrap;
}

.iamqs-prioriteit-hoog {
	background: #dc2626;
}

.iamqs-prioriteit-vervolg {
	background: #2563eb;
}

.iamqs-actiepunt-tekst {
	flex: 1 1 auto;
	min-width: 200px;
	color: #1a1a1a !important;
}

.iamqs-actiepunt-toelichting {
	flex-basis: 100%;
	font-size: 0.9em;
	font-style: italic;
	color: #52525b !important;
	padding-left: calc(0.5em + 1px);
}

/* ---------- BIO2 h8 indicatieve dekking ---------- */

.iamqs-bio2 {
	margin-top: 3em;
	padding-top: 1.5em;
	border-top: 2px solid var(--iamqs-orange);
}

.iamqs-bio2-titel {
	margin-top: 0;
	border-bottom: none !important;
}

.iamqs-bio2-groep-titel {
	margin: 1.6em 0 0.6em;
	color: var(--iamqs-orange) !important;
	font-size: 1.05em;
	border-bottom: 2px solid var(--iamqs-orange);
	padding-bottom: 0.3em;
	display: inline-block;
}

.iamqs-bio2-disclaimer {
	background: #fff7ed;
	color: #52525b !important;
	border-left: 4px solid var(--iamqs-orange);
	border-radius: 4px;
	padding: 1em 1.2em;
	max-width: 720px;
	font-size: 0.92em;
}

.iamqs-bio2-disclaimer strong {
	color: #1a1a1a !important;
}

.iamqs-bio2-tabel td {
	color: #1a1a1a !important;
}

.iamqs-bio2-badge {
	display: inline-block;
	font-size: 0.78em;
	font-weight: 700;
	padding: 0.2em 0.6em;
	border-radius: 4px;
	color: #fff !important;
	white-space: nowrap;
}

.iamqs-bio2-sterk {
	background: #16a34a;
}

.iamqs-bio2-gedeeltelijk {
	background: #d97706;
}

.iamqs-bio2-zwak {
	background: #dc2626;
}

.iamqs-bio2-geen {
	background: #9ca3af;
}

.iamqs-bio2-buiten-scope {
	background: #64748b;
}

.iamqs-bio2-toelichting {
	font-size: 0.88em;
	font-style: italic;
	color: #71717a !important;
}

/* ---------- Implementatieconsultant (chat) ---------- */

.iamqs-agent {
	max-width: 760px;
	margin: 0 auto;
}

.iamqs-agent-intro p {
	max-width: 640px;
}

.iamqs-agent-berichten {
	display: flex;
	flex-direction: column;
	gap: 0.9em;
	min-height: 200px;
	max-height: 55vh;
	overflow-y: auto;
	background: #fff;
	border-radius: 8px;
	padding: 1.2em;
	margin: 1.2em 0;
}

.iamqs-agent-bericht {
	max-width: 80%;
	padding: 0.7em 1em;
	border-radius: 10px;
	white-space: pre-wrap;
	color: #1a1a1a !important;
	line-height: 1.5;
}

.iamqs-agent-bericht--user {
	align-self: flex-end;
	background: var(--iamqs-orange);
	color: #fff !important;
}

.iamqs-agent-bericht--assistant {
	align-self: flex-start;
	background: #f1f2f4;
}

.iamqs-agent-bericht--laden {
	font-style: italic;
	color: #71717a !important;
}

.iamqs-agent-form {
	display: flex;
	gap: 0.6em;
	align-items: flex-end;
}

.iamqs-agent-input {
	flex: 1;
	padding: 0.7em;
	border-radius: 6px;
	border: 1px solid #d1d5db;
	font-family: inherit;
	resize: vertical;
	color: #1a1a1a !important;
	background: #fff !important;
}

.iamqs-agent-verstuur {
	white-space: nowrap;
}