/* -------------------- Farben-Variablen BEGINN -------------------- */
:root {
	/* Kundenfarben */
	--color-kunde: rgb(84 152 34);
	--color-kunde-dunkel: rgb(63 116 25); /* Text & Buttons mit weißer Schrift (Kontrast 5.6:1) */
	--color-kunde-hover: rgb(50 94 19);
	--color-kunde-hell: rgb(238 245 232);
	--color-kunde-text: var(--color-kunde-dunkel);

	/* Grauabstufungen */
	--color-grau-50: rgb(247 248 246);
	--color-grau-100: rgb(238 240 236);
	--color-grau-200: rgb(223 226 220);
	--color-grau-500: rgb(110 115 107);
	--color-grau-700: rgb(66 70 63);
	--color-grau-900: rgb(34 37 32);

	/* Allgemein */
	--color-akzent: var(--color-kunde-dunkel);
	--bg-slideshow: rgb(255 255 255);
	--bg-fallback-farbe: var(--color-grau-100);
	--border-social-media: none;

	/* Barrierefreiheit Panel */
	--access-panel-headline-color: var(--color-grau-700);
	--bcc-shadow: 0px 0px 4px 1px rgb(0 0 0 / .8);
	--bg-access-panel: rgb(255 255 255);
	--access-panel-bs: 0px 0px 4px 2px rgb(95 95 95 / .6);
	--bg-panel-button: var(--color-grau-100);
	--color-readline: rgb(0 0 0);
	--cursor-color: url('../images/icons/cursor-light.png');
	--cursor-pointer: url('../images/icons/cursor-pointer-light.png');
	--cursor-text: url('../images/icons/cursor-text-light.png');
	--access-icon-tooltip-color: var(--color-grau-700);
	--access-icon-tooltip-text: rgb(255 255 255);

	/* Cookie Modal */
	--bg-modal-content: rgb(255 255 255);
	--modal-content-text-color: var(--color-grau-700);
	--modal-header-bg: var(--color-kunde-dunkel);
	--modal-header-text-color: rgb(255 255 255);
	--modal-footer-bg: var(--color-grau-100);
	--placeholder-background: var(--color-grau-100);
	--bg-consent-icons: var(--color-grau-50);
	--color-btn-custom-accept-normal: var(--color-kunde-dunkel);
	--color-btn-custom-accept-hover: var(--color-kunde-hover);
	--color-btn-custom-reject-normal: var(--color-grau-200);
	--color-btn-custom-reject-hover: rgb(201 204 198);

	--background-content: rgb(255 255 255);
	--background-kontaktformular: var(--color-grau-50);
	--img-filter: none;
	--mapsiframe-filter: drop-shadow(2px 4px 6px rgb(0 0 0 / .25));

	/* Navigation */
	--background-navi: rgb(255 255 255);
	--color-navigation: var(--color-grau-900);
	--color-navigation-hover: rgb(255 255 255);
	--color-dropdown-navigation: var(--color-grau-900);
	--dropdown-menu: rgb(255 255 255 / .96);

	/* Top-Info */
	--color-top-info-text: rgb(233 242 225);
	--links-top-info: rgb(255 255 255);
	--links-top-info-hover: rgb(200 230 170);
	--background-top-info: rgb(47 88 19);

	/* Kontaktbox */
	--color-kontaktbox-h4: rgb(255 255 255);
	--bg-kontaktbox: var(--bg-card);
	--bg-main-kontaktbox: rgb(255 255 255);

	/* Sektionen */
	--bg-section-hell: var(--color-grau-50);
	--bg-vorteile: rgb(47 88 19);
	--color-vorteile-text: rgb(233 242 225);
	--gewebe-linie: rgb(255 255 255 / .06);
	--color-bemassung: var(--color-grau-500);
	--bg-chip: rgb(255 255 255);
	--bg-claim: rgb(255 255 255 / .88);
	--plan-linie: rgb(84 152 34 / .1);
	--bg-card: rgb(255 255 255);
	--border-card: var(--color-grau-200);
	--shadow-card: 0 2px 6px rgb(34 37 32 / .05), 0 12px 32px rgb(34 37 32 / .07);
	--shadow-card-hover: 0 4px 10px rgb(34 37 32 / .08), 0 20px 44px rgb(34 37 32 / .12);
	--referenz-overlay: linear-gradient(180deg, rgb(34 37 32 / 0) 35%, rgb(34 37 32 / .85) 100%);

	/* Text */
	--color-ueberschriften: var(--color-grau-900);
	--color-subline: var(--color-grau-500);
	--color-kicker: var(--color-kunde-text);

	--color-text: var(--color-grau-700);
	--color-links: var(--color-kunde-text);
	--color-links-hover: var(--color-kunde-hover);

	/* Call to action Box */
	--call2action-background: var(--color-kunde-hell);
	--call2action-color-link-main: var(--color-kunde-text);
	--call2action-color-link-hover: var(--color-kunde-hover);

	/* Float Kontakt */
	--color-float-contact-icon: rgb(255 255 255);
	--color-float-contact-background: var(--color-kunde-dunkel);
	--bg-float-contact: rgb(255 255 255 / .5);

	/* Review-Slider */
	--title-review: var(--color-grau-900);
	--background-review-slider: var(--color-grau-50);

	/* Footer */
	--color-footer-text: rgb(206 214 200);
	--color-footer-links-main: rgb(255 255 255);
	--color-footer-links-hover: rgb(160 210 110);
	--footer-icon-color: rgb(160 210 110);
	--background-footer: rgb(26 32 23);

	/* Social Media */
	--color-facebook: rgb(60 89 151);
	--bg-social-button: rgb(255 255 255);
	--color-social-button: var(--color-kunde-dunkel);

	/* Glas Effekt */
	--glas-background: rgb(255 255 255 / .4);
	--glas-border: rgb(255 255 255 / .3);

	/* -------------------- Schrift-Variablen ANFANG -------------------- */

		--font-ueberschriften: "poppins", sans-serif;
		--font-fliesstext: "futura-pt", sans-serif;
		--font-navigation: "futura-pt", sans-serif;

/* -------------------- Schrift-Variablen ENDE -------------------- */
}

[data-theme="dark"] {
	/* Kundenfarben */
	--color-kunde-text: rgb(140 200 90); /* helleres Grün für Text auf dunklem Grund */
	--color-kunde-hell: rgb(38 50 30);

	/* Allgemein */
	--color-akzent: var(--color-kunde-dunkel);
	--bg-slideshow: rgb(27 30 26);
	--bg-fallback-farbe: rgb(46 50 44);
	--border-social-media: 2px solid rgb(255 255 255);

	/* Barrierefreiheit Panel */
	--access-panel-headline-color: rgb(59 59 59);
	--bcc-shadow: none;
	--bg-access-panel: rgb(59 59 59);
	--access-panel-bs: none;
	--bg-panel-button: rgb(152 152 152);
	--color-readline: rgb(255 255 255);
	--cursor-color: url('../images/icons/cursor-dark.png');
	--cursor-pointer: url('../images/icons/cursor-pointer-dark.png');
	--cursor-text: url('../images/icons/cursor-text-dark.png');
	--access-icon-tooltip-color: rgb(255 255 255);
	--access-icon-tooltip-text: rgb(51 51 51);

	/* Cookie Modal */
	--bg-modal-content: rgb(36 40 35);
	--modal-content-text-color: rgb(255 255 255);
	--modal-header-bg: rgb(36 40 35);
	--modal-header-text-color: rgb(255 255 255);
	--modal-footer-bg: rgb(46 50 44);
	--placeholder-background: rgb(46 50 44);
	--bg-consent-icons: rgb(66 70 63);
	--color-btn-custom-accept-normal: var(--color-kunde-dunkel);
	--color-btn-custom-accept-hover: var(--color-kunde-hover);
	--color-btn-custom-reject-normal: rgb(205 205 205);
	--color-btn-custom-reject-hover: rgb(173 173 173);

	--background-content: rgb(27 30 26);
	--background-kontaktformular: rgb(32 36 31);
	--img-filter: brightness(0.85);
	--mapsiframe-filter: grayscale(100%) invert(90%) contrast(95%);

	/* Navigation */
	--background-navi: rgb(27 30 26);
	--color-navigation: rgb(255 255 255);
	--color-navigation-hover: rgb(255 255 255);
	--color-dropdown-navigation: rgb(255 255 255);
	--dropdown-menu: rgb(27 30 26 / .96);

	/* Top-Info */
	--color-top-info-text: rgb(220 232 210);
	--links-top-info: rgb(255 255 255);
	--links-top-info-hover: rgb(200 230 170);
	--background-top-info: rgb(30 52 15);

	/* Kontaktbox */
	--color-kontaktbox-open: rgb(255 255 255);
	--color-kontaktbox-h4: rgb(255 255 255);
	--bg-kontaktbox: var(--bg-card);
	--bg-main-kontaktbox: rgb(27 30 26);

	/* Sektionen */
	--bg-section-hell: rgb(32 36 31);
	--bg-vorteile: rgb(30 52 15);
	--color-vorteile-text: rgb(220 232 210);
	--gewebe-linie: rgb(255 255 255 / .05);
	--color-bemassung: rgb(160 166 156);
	--bg-chip: rgb(40 44 39);
	--bg-claim: rgb(27 30 26 / .85);
	--plan-linie: rgb(140 200 90 / .08);
	--bg-card: rgb(40 44 39);
	--border-card: rgb(58 63 56);
	--shadow-card: 0 2px 6px rgb(0 0 0 / .25), 0 12px 32px rgb(0 0 0 / .25);
	--shadow-card-hover: 0 4px 10px rgb(0 0 0 / .3), 0 20px 44px rgb(0 0 0 / .35);
	--referenz-overlay: linear-gradient(180deg, rgb(0 0 0 / 0) 35%, rgb(0 0 0 / .85) 100%);

	/* Text */
	--color-ueberschriften: rgb(255 255 255);
	--color-subline: rgb(190 195 187);
	--color-kicker: var(--color-kunde-text);
	--color-text: rgb(230 232 228);
	--color-links: var(--color-kunde-text);
	--color-links-hover: rgb(180 225 140);

	/* Call to action Box */
	--call2action-background: rgb(38 50 30);
	--call2action-color-link-main: var(--color-kunde-text);
	--call2action-color-link-hover: rgb(180 225 140);

	/* Float Kontakt */
	--color-float-contact-icon: rgb(255 255 255);
	--color-float-contact-background: var(--color-kunde-dunkel);
	--bg-float-contact: rgb(27 30 26 / .5);

	/* Review-Slider */
	--title-review: rgb(255 255 255);
	--background-review-slider: rgb(32 36 31);

	/* Footer */
	--color-footer-text: rgb(200 208 194);
	--color-footer-links-main: rgb(255 255 255);
	--color-footer-links-hover: rgb(160 210 110);
	--footer-icon-color: rgb(160 210 110);
	--background-footer: rgb(16 19 14);

	/* Social Media */
	--bg-social-button: rgb(40 44 39);
	--color-social-button: var(--color-kunde-text);

	/* Glas Effekt */
	--glas-background: rgb(33 37 41 / .4);
	--glas-border: rgb(33 37 41 / .3);
}
/* -------------------- Farben-Variablen ENDE -------------------- */