/* Erbt Schrift und Farben vom Theme; Akzent über Variable anpassbar. */
.cx-hc,
.cx-hc-result {
	--cx-hc-accent: #0a5c8a;
	--cx-hc-error: #b3261e;
	--cx-hc-line: rgba(0, 0, 0, .14);
	--cx-hc-soft: rgba(0, 0, 0, .035);
	max-width: 52rem;
}

.cx-hc-section {
	border: 0;
	border-top: 2px solid var(--cx-hc-accent);
	margin: 2rem 0 0;
	padding: 1rem 0 0;
}
.cx-hc-section legend {
	font-weight: 700;
	font-size: 1.15em;
	padding: 0 .5rem 0 0;
}

.cx-hc-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
	gap: 1rem 1.5rem;
}
.cx-hc-field { margin: 0 0 1rem; }
.cx-hc-field > label,
.cx-hc-label { display: block; font-weight: 600; margin-bottom: .3rem; }
.cx-hc-field input[type="number"],
.cx-hc-field input[type="text"] { width: 100%; max-width: 12rem; }
.cx-hc-field small { display: block; opacity: .75; margin-top: .2rem; }

.cx-hc-choices,
.cx-hc-yn { display: flex; gap: 1.25rem; flex-wrap: wrap; }
.cx-hc-choices label,
.cx-hc-yn label { display: inline-flex; align-items: center; gap: .4rem; cursor: pointer; white-space: nowrap; }

.cx-hc-bmi {
	display: inline-block;
	background: var(--cx-hc-soft);
	padding: .4rem .8rem;
	border-radius: 4px;
	margin: 0 0 1rem;
}
.cx-hc-bmi output { font-weight: 700; }

.cx-hc-questions { list-style: none; margin: 0; padding: 0; }
.cx-hc-question {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: .5rem 1.5rem;
	align-items: center;
	padding: .75rem 0;
	border-bottom: 1px solid var(--cx-hc-line);
}
.cx-hc-question.has-error { box-shadow: inset 3px 0 0 var(--cx-hc-error); padding-left: .75rem; }
@media (max-width: 36rem) {
	.cx-hc-question { grid-template-columns: 1fr; }
}

.cx-hc-consent { margin: 2rem 0 1rem; }
.cx-hc-consent label { display: flex; gap: .6rem; align-items: flex-start; }
.cx-hc-consent input { margin-top: .3em; flex: none; }

.cx-hc-errors {
	border-left: 4px solid var(--cx-hc-error);
	background: rgba(179, 38, 30, .06);
	padding: .75rem 1rem;
	margin: 1rem 0;
}
.cx-hc-errors ul { margin: .25rem 0 0 1.2rem; }
.cx-hc-error { color: var(--cx-hc-error); font-size: .9em; margin: .3rem 0 0; }
[aria-invalid="true"] { border-color: var(--cx-hc-error) !important; }

.cx-hc-hp { position: absolute !important; left: -9999px !important; height: 1px; overflow: hidden; }

/* Ergebnis */
.cx-hc-print-head { display: none; }
.cx-hc-message {
	border-left: 4px solid var(--cx-hc-accent);
	background: var(--cx-hc-soft);
	padding: .75rem 1rem;
	margin: 0 0 1rem;
}
.cx-hc-message--exam,
.cx-hc-message--doctor { border-left-color: #c77700; }
.cx-hc-message p { margin: .3rem 0; }
a.cx-hc-button { display: inline-block; text-decoration: none; }
.cx-hc-own { margin: 1.5rem 0; }
.cx-hc-note { font-size: .9em; opacity: .8; }
.cx-hc-table { width: 100%; border-collapse: collapse; margin: 0 0 1.25rem; }
.cx-hc-table th,
.cx-hc-table td { text-align: left; vertical-align: top; padding: .45rem .5rem; border-bottom: 1px solid var(--cx-hc-line); }
.cx-hc-table th { font-weight: 400; }
.cx-hc-table--answers td { white-space: nowrap; width: 1%; }
.cx-hc-table tr.is-yes { background: rgba(199, 119, 0, .09); }
.cx-hc-disclaimer { font-size: .85em; opacity: .75; }

#cx-hc-print-root { display: none; }

@media print {
	html.cx-hc-printing,
	html.cx-hc-printing body {
		height: auto !important;
		min-height: 0 !important;
		max-height: none !important;
		overflow: visible !important;
		position: static !important;
		display: block !important;
		transform: none !important;
		margin: 0 !important;
		padding: 0 !important;
		background: #fff !important;
	}
	html.cx-hc-printing body > *:not(#cx-hc-print-root) { display: none !important; }
	html.cx-hc-printing #cx-hc-print-root { display: block !important; }

	#cx-hc-print-root .cx-hc-result {
		position: static;
		width: 100%;
		max-width: none;
		font-size: 10.5pt;
		color: #000;
	}
	#cx-hc-print-root .cx-hc-noprint { display: none !important; }
	#cx-hc-print-root .cx-hc-print-head { display: flex; justify-content: space-between; border-bottom: 1px solid #000; padding-bottom: .4rem; margin-bottom: 1rem; }
	#cx-hc-print-root .cx-hc-message { background: none !important; border-left-color: #000 !important; }
	#cx-hc-print-root h3,
	#cx-hc-print-root h4 { break-after: avoid; page-break-after: avoid; }
	#cx-hc-print-root .cx-hc-table tr { break-inside: avoid; page-break-inside: avoid; }
	#cx-hc-print-root .cx-hc-table tr.is-yes { background: #eee !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
	@page { margin: 15mm; }
}
