/* Display preferences supplement the design; images/brand colours are never inverted. */
:root {
	--hz-display-bg: #fff;
	--hz-display-surface: #fff;
	--hz-display-panel: #f8f6ef;
	--hz-display-ink: #1f2933;
	--hz-display-muted: #46515a;
	--hz-display-link: #184d3b;
	--hz-display-line: #64756d;
	--hz-display-strong: #184d3b;
	--hz-display-focus: #1261a0;
	--hz-display-accent: #f5c400;
	color-scheme: light;
}

:root[data-hz-scheme="dark"] {
	--hz-display-bg: #101814;
	--hz-display-surface: #19251f;
	--hz-display-panel: #223329;
	--hz-display-ink: #f1f5f2;
	--hz-display-muted: #cedbd3;
	--hz-display-link: #a3e6be;
	--hz-display-line: #829b8a;
	--hz-display-strong: #102d24;
	--hz-display-focus: #ffd54a;
	color-scheme: dark;
}

:root[data-hz-contrast="high"] {
	--hz-display-bg: #fff;
	--hz-display-surface: #fff;
	--hz-display-panel: #fff;
	--hz-display-ink: #000;
	--hz-display-muted: #000;
	--hz-display-link: #00351f;
	--hz-display-line: #000;
	--hz-display-strong: #000;
	--hz-display-focus: #003eaa;
}

:root[data-hz-scheme="dark"][data-hz-contrast="high"] {
	--hz-display-bg: #000;
	--hz-display-surface: #000;
	--hz-display-panel: #000;
	--hz-display-ink: #fff;
	--hz-display-muted: #fff;
	--hz-display-link: #ffdc3d;
	--hz-display-line: #fff;
	--hz-display-strong: #000;
	--hz-display-focus: #ffdc3d;
}

.hz-display-bar {
	position: relative;
	z-index: 19;
	max-width: 1240px;
	margin: 0 auto;
	padding: 0.4rem 0.75rem;
	color: var(--hz-display-ink);
}

.hz-display > summary {
	width: fit-content;
	max-width: 100%;
	min-height: 44px;
	margin-inline-start: auto;
	padding: 0.5rem 0.8rem;
	border: 1px solid var(--hz-display-line);
	border-radius: 0.65rem;
	background: var(--hz-display-panel);
	color: var(--hz-display-link);
	font-size: 1rem;
	font-weight: 800;
	line-height: 1.5;
	cursor: pointer;
	scroll-margin-top: 6rem;
}

.hz-display > summary { scroll-margin-top: 9rem; }
.hz-display__symbol { margin-inline: 0.3rem; }
.hz-display[open] > summary { margin-block-end: 0.75rem; }

.hz-display__panel {
	padding: clamp(1rem, 3vw, 1.5rem);
	border: 1px solid var(--hz-display-line);
	border-radius: 0.75rem;
	background: var(--hz-display-surface);
	color: var(--hz-display-ink);
}

.hz-display__panel h2 { margin: 0 0 1rem; font-size: 1.3rem; color: inherit; }
.hz-display__panel p { font-size: 1rem; line-height: 1.65; }
.hz-display__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); gap: 1rem; }
.hz-display__grid > * { min-width: 0; }
.hz-display__grid label { display: block; margin-block-end: 0.4rem; font-weight: 800; }
.hz-display select {
	width: 100%;
	min-width: 0;
	min-height: 48px;
	padding: 0.6rem;
	border: 2px solid var(--hz-display-line);
	border-radius: 0.4rem;
	background: var(--hz-display-surface);
	color: var(--hz-display-ink);
	font: inherit;
}
.hz-display__grid .hz-display__checkbox { display: flex; align-items: center; gap: 0.65rem; min-height: 48px; }
.hz-display__checkbox input { flex: 0 0 auto; width: 1.35rem; height: 1.35rem; accent-color: var(--hz-display-link); }
.hz-display__actions { display: flex; flex-wrap: wrap; gap: 0.75rem; }
.hz-display button {
	min-height: 48px;
	max-width: 100%;
	padding: 0.65rem 1rem;
	border: 2px solid var(--hz-display-line);
	border-radius: 0.5rem;
	background: var(--hz-display-panel);
	color: var(--hz-display-ink);
	font: inherit;
	font-weight: 800;
	white-space: normal;
	cursor: pointer;
}
.hz-display__status:empty { display: none; }
.hz-display [hidden] { display: none !important; }
.hz-display :is(summary, select, input, button):focus-visible {
	outline: 3px solid var(--hz-display-focus);
	outline-offset: 3px;
}

/* Shared semantic colours in dark/high-contrast modes. Light design stays intact. */
html:is([data-hz-scheme="dark"], [data-hz-contrast="high"]) body {
	background: var(--hz-display-bg);
	color: var(--hz-display-ink);
}

html:is([data-hz-scheme="dark"], [data-hz-contrast="high"]) :is(
	.site-header, .wp-block-navigation__responsive-container, .header-mobile-action,
	.home-hero, .home-hero__columns, .home-hero__columns > .wp-block-column,
	.battery-hero, .solar-hero, .charger-hero, .charger-hero .wp-block-column,
	.about-hero, .contact-hero, .legal-hero, .workarea-hero, .vat-hero, .local-area-hero, .support-hero,
	.ere-partner-section, .process-section, .support-safety, .battery-benefits,
	.has-cream-background-color, .has-white-background-color,
	.advisor-hero, .advisor-promo, .knowledge-card, .knowledge-intro,
	.hz-shop-category, .hz-shop-toolbar, .hz-survey-product-cta, .hz-contact-product-context,
	.hz-survey-product-cta__certificate
) {
	background: var(--hz-display-panel) !important;
	color: var(--hz-display-ink);
	border-color: var(--hz-display-line);
}

html:is([data-hz-scheme="dark"], [data-hz-contrast="high"]) :is(
	.solution-card:not(.solution-card--primary), .process-list, .ere-partner-card, .battery-benefit, .battery-step,
	.advice-card, .form-card, .contact-card, .contact-form-card, .contact-process__step, .about-method__card, .about-recognition__card,
	.victron-section, .victron-section__card, .victron-section__brand,
	.solar-choice__card, .solar-process__steps, .about-identity-card, .about-solution-link,
	.workarea-regions p, .workarea-method__step, .workarea-solution-card,
	.vat-condition, .vat-process-step, .vat-note, .support-jump-links a,
	.legal-summary, .legal-toc, .legal-section, .workarea-map-card, .workarea-card, .workarea-step,
	.vat-hero__card, .vat-partner__card, .local-area-fact:not(.local-area-fact--photo),
	.local-area-service, .local-area-step, .local-area-hub-link, .local-area-neighbourhoods li,
	.support-card, .support-safety__card, .peblar-recognition, .battery-faq .wp-block-details,
	.battery-advisor__question, .battery-advisor__result, .battery-advisor__notice, .battery-advisor__summary,
	.hz-survey-product-steps li, .woocommerce ul.products li.product,
	.wc-block-grid__product, .wc-block-components-product-card, .wc-block-components-totals-wrapper,
	.wc-block-components-drawer
) {
	background: var(--hz-display-surface) !important;
	color: var(--hz-display-ink);
	border-color: var(--hz-display-line);
	box-shadow: none;
}

html:is([data-hz-scheme="dark"], [data-hz-contrast="high"]) :is(
	h1, h2, h3, h4, h5, h6, p, li, dt, dd, small, label, legend, figcaption, .battery-faq summary,
	.hz-shop-category__content strong, .hz-shop-category__content small,
	.hz-guide-price strong, .hz-guide-price__label, .hz-guide-price__tax,
	.hz-survey-product-steps strong, .hz-survey-product-steps span, .support-card__category,
	.knowledge-topic, .knowledge-card__hint, .card-link, .eyebrow, .workarea-map-card__label,
	.woocommerce .price, .woocommerce-result-count, .woocommerce-breadcrumb
) { color: inherit !important; }

html:is([data-hz-scheme="dark"], [data-hz-contrast="high"]) .hero-proof {
	color: var(--hz-display-ink);
}

/* Category descriptions and arrows have explicit light-design colours upstream. */
html:is([data-hz-scheme="dark"], [data-hz-contrast="high"]) .hz-shop-category__content > span {
	color: var(--hz-display-muted) !important;
}

html:is([data-hz-scheme="dark"], [data-hz-contrast="high"]) .hz-shop-category__arrow {
	color: var(--hz-display-link) !important;
}

html:is([data-hz-scheme="dark"], [data-hz-contrast="high"]) a {
	color: var(--hz-display-link) !important;
}

html:is([data-hz-scheme="dark"], [data-hz-contrast="high"]) :is(
	.benefit-strip, .final-cta, .site-footer, .has-green-background-color,
	.solution-card--primary, .support-card--featured, .local-area-card
) { background: var(--hz-display-strong) !important; color: #fff !important; }

html:is([data-hz-scheme="dark"], [data-hz-contrast="high"]) :is(
	.site-footer, .final-cta, .benefit-strip, .solution-card--primary, .support-card--featured, .local-area-card
) a { color: #ffdc3d !important; }

html:is([data-hz-scheme="dark"], [data-hz-contrast="high"]) :is(
	.wp-element-button, .wp-block-button__link, .battery-advisor__submit, .battery-advisor__advice,
	.hz-survey-loop-button, a.hz-survey-product-cta__button, .hz-shop-filter button,
	.gform_button, .support-card__actions a, .woocommerce a.button, .woocommerce button.button,
	.hz-mobile-survey-cta a
) {
	background: var(--hz-display-accent) !important;
	color: #102017 !important;
	border-color: var(--hz-display-accent) !important;
}

html:is([data-hz-scheme="dark"], [data-hz-contrast="high"]) :is(
	input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="hidden"]), textarea, select
) {
	background: var(--hz-display-surface) !important;
	color: var(--hz-display-ink) !important;
	border-color: var(--hz-display-line) !important;
}

html:is([data-hz-scheme="dark"], [data-hz-contrast="high"]) ::placeholder {
	color: var(--hz-display-muted) !important;
	opacity: 1;
}

html:is([data-hz-scheme="dark"], [data-hz-contrast="high"]) :is(
	.step-badge, .battery-advisor__number, .hz-shop-category__marker, .support-card__mark
) { background: var(--hz-display-accent) !important; color: #102017 !important; }

html:is([data-hz-scheme="dark"], [data-hz-contrast="high"]) :is(.wp-block-paragraph.step-badge, .wp-block-paragraph.vat-condition__icon) {
	color: #102017 !important;
}

html:is([data-hz-scheme="dark"], [data-hz-contrast="high"]) :is(
	.hero-title mark, .battery-title mark, .solar-title mark, .contact-title mark,
	.vat-title mark, .local-area-title mark
) { color: var(--hz-display-link); background: transparent; }

html:is([data-hz-scheme="dark"], [data-hz-contrast="high"]) .brand-link img {
	padding: 4px;
	border-radius: 0.35rem;
	background: #fff;
}

html:is([data-hz-scheme="dark"], [data-hz-contrast="high"]) :is(.gform_validation_errors, .gfield_validation_message, .validation_message) {
	background: var(--hz-display-panel) !important;
	color: var(--hz-display-ink) !important;
	border-color: var(--hz-display-line) !important;
}

html:is([data-hz-scheme="dark"], [data-hz-contrast="high"]) .gfield_required { color: var(--hz-display-ink) !important; }

html:is([data-hz-scheme="dark"], [data-hz-contrast="high"]) :is(.wp-block-navigation__responsive-container-open, .wp-block-navigation__responsive-container-close) {
	background: var(--hz-display-surface) !important;
	color: var(--hz-display-ink) !important;
	border-color: var(--hz-display-line) !important;
}

html:is([data-hz-scheme="dark"], [data-hz-contrast="high"]) :focus-visible {
	outline: 3px solid var(--hz-display-focus) !important;
	outline-offset: 4px;
}

html:is([data-hz-underline="true"], [data-hz-contrast="high"]) a:not(.wp-element-button):not(.button):not(.hz-survey-loop-button):not(.hz-survey-product-cta__button) {
	text-decoration-line: underline !important;
	text-decoration-thickness: 0.12em;
	text-underline-offset: 0.2em;
}

html[data-hz-contrast="high"] :is(.solution-card, .knowledge-card, .battery-advisor__question, .hz-shop-category, .hz-display__panel) {
	border: 2px solid var(--hz-display-line);
	box-shadow: none;
}

/* Use percentages, not a fixed pixel root: browser font/zoom preferences stay effective. */
html[data-hz-text="large"] { font-size: 125%; }
html[data-hz-text="xlarge"] { font-size: 150%; }

html:is([data-hz-text="large"], [data-hz-text="xlarge"]) :is(h1, h2, h3, h4, p, li, a, button, summary, label) {
	overflow-wrap: anywhere;
	hyphens: auto;
}
html:is([data-hz-text="large"], [data-hz-text="xlarge"]) .site-header__inner { flex-wrap: wrap; }
html:is([data-hz-text="large"], [data-hz-text="xlarge"]) .site-navigation { width: 100%; order: 3; }
html:is([data-hz-text="large"], [data-hz-text="xlarge"]) .site-navigation .wp-block-navigation__container { flex-wrap: wrap; }
html:is([data-hz-text="large"], [data-hz-text="xlarge"]) .site-footer__grid > :first-child h2 { white-space: normal; }
html:is([data-hz-text="large"], [data-hz-text="xlarge"]) :is(.wp-block-column, .hz-shop-category__content) { min-width: 0; }
html:is([data-hz-text="large"], [data-hz-text="xlarge"]) .hz-shop-categories { grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr)); }
html:is([data-hz-text="large"], [data-hz-text="xlarge"]) .hz-shop-filter { grid-template-columns: minmax(0, 1fr); }
html:is([data-hz-text="large"], [data-hz-text="xlarge"]) .hz-shop-filter button { width: 100%; }

@media (max-width: 781px) {
	.hz-display-bar { padding-inline: 0; }
	html:is([data-hz-text="large"], [data-hz-text="xlarge"]) .site-header { position: relative; }
	html:is([data-hz-text="large"], [data-hz-text="xlarge"]) .site-header__inner { display: grid; grid-template-columns: minmax(0, 1fr) auto; }
	html:is([data-hz-text="large"], [data-hz-text="xlarge"]) .site-navigation { grid-column: 2; grid-row: 1; width: auto; }
	html:is([data-hz-text="large"], [data-hz-text="xlarge"]) .header-mobile-actions { grid-column: 1 / -1; justify-content: flex-end; }
	html:is([data-hz-text="large"], [data-hz-text="xlarge"]) .header-cta { display: none; }
}

@media (forced-colors: active) {
	.hz-display :is(summary, select, button, input) { border-color: ButtonText; }
}