/**
 * HydroFyn farvelag
 *
 * Sitets brandfarver som CSS-variabler - defineret een gang her og brugt med
 * fallback i hydrofyn-filters, -katalog, -search og -swatches. Vaerdierne er
 * maalt i ejerens mockup 2026-09-10 (pixel-mode over flader, mest maettede
 * pixel for glyffer).
 *
 * Kontrast: hvid paa --hf-primaer 14,8:1; --hf-guld paa --hf-primaer 6,9:1;
 * --hf-orangebrun paa --hf-primaer kun 4,1:1 - derfor kun til flueben og
 * logotype, aldrig til loebende tekst.
 */

:root {
	--hf-primaer: #1B2939;
	--hf-primaer-rgb: 27, 41, 57;
	--hf-primaer-moerk: #11171F;
	--hf-primaer-dyb: #19232D;
	--hf-primaer-lys: #26374A;
	--hf-guld: #D1AD66;
	--hf-orangebrun: #C17443;
	--hf-baggrund: #F5F5F2;
	--hf-tekst: #16212F;
	--hf-tekst-svag: #5b6b7a;
	--hf-link: #1F6794;
	--hf-groen: #497D59;
	--hf-flade: #F4F5F6;
	--hf-flade-hover: #E9ECEF;
	--hf-kant: #e7ecf1;
	--hf-kant-cta: #CCD2D6;
	--hf-header-bredde: 1425px;
}

/* ---- Globale overstyringer (ejerens valg: fra vores CSS, ikke kittet) ----
   Elementor-kittet saetter sine farver med hoej specificitet; !important er
   noedvendigt, som i de andre plugins. Minimalt saet: sidebaggrund og de
   koeb-knapper, der stadig er blaa. Kurv og kasse roeres ikke i foerste
   omgang. */

body {
	background-color: var(--hf-baggrund) !important;
}

/* Kittets globale linkfarve er den gamle lyseblaa (.elementor-kit-4 a). Den
   arves af produktlinks og badges. body-klassen giver een klasse mere end
   kittets regel; :where() tilfoejer ingen specificitet, saa Elementor-knapper
   og vores egne komponenter (hf-*) holdes udenfor. */
body.elementor-kit-4 a:where(:not(.elementor-button):not(.button):not([class*="hf-"]):not([class*="elementor-"])) {
	color: var(--hf-link);
}

ul.products li.product a.add_to_cart_button:not(.hf-cta--vaelg):not(.added),
form.cart .single_add_to_cart_button {
	background-color: var(--hf-primaer) !important;
	border-color: var(--hf-primaer) !important;
	color: #fff !important;
}

ul.products li.product a.add_to_cart_button:not(.hf-cta--vaelg):not(.added):hover,
ul.products li.product a.add_to_cart_button:not(.hf-cta--vaelg):not(.added):focus,
form.cart .single_add_to_cart_button:hover,
form.cart .single_add_to_cart_button:focus {
	background-color: var(--hf-primaer-moerk) !important;
	border-color: var(--hf-primaer-moerk) !important;
	color: #fff !important;
}