/* -------------------- Farben-Variablen BEGINN -------------------- */
:root {
	/* Kundenfarben */
	--tb-blau: rgb(30 64 147);            /* Logo #1e4093 */
	--tb-blau-dunkel: rgb(21 46 107);
	--tb-blau-tint: rgb(232 237 248);
	--tb-grau-logo: rgb(134 139 140);     /* Logo #868b8c */
	--tb-grau-50: rgb(247 248 248);
	--tb-grau-100: rgb(238 240 241);
	--tb-grau-200: rgb(223 226 227);
	--tb-grau-300: rgb(201 205 206);
	--tb-grau-600: rgb(90 95 98);
	--tb-grau-800: rgb(49 53 57);
	--tb-tinte: rgb(19 23 30);

	/* Designsystem – Rollen */
	--tb-bg: rgb(255 255 255 / .8);
	--tb-bg-alt: var(--tb-grau-50);
	--tb-bg-card: rgb(255 255 255);
	--tb-bg-invers: var(--tb-tinte);
	--tb-text: var(--tb-grau-800);
	--tb-text-muted: var(--tb-grau-600);
	--tb-text-invers: rgb(255 255 255 / .74);
	--tb-heading: var(--tb-tinte);
	--tb-heading-invers: rgb(255 255 255);
	--tb-line: var(--tb-grau-200);
	--tb-line-strong: var(--tb-grau-300);
	--tb-line-invers: rgb(255 255 255 / .14);
	--tb-accent: var(--tb-blau);
	--tb-accent-hover: var(--tb-blau-dunkel);
	--tb-accent-text: var(--tb-blau);
	--tb-accent-soft: var(--tb-blau-tint);
	--tb-on-accent: rgb(255 255 255);
	--tb-raster: rgb(30 64 147 / .06);
	--tb-img-shade: rgb(19 23 30 / .55);
	--tb-img-bg: var(--tb-grau-100);
	--tb-focus: rgb(30 64 147 / .45);
	--tb-radius: 2px;
	--tb-ease: cubic-bezier(.2, .7, .2, 1);
	--tb-hero-min-height: 600px;          /* Mindesthöhe Slider nur mit Hero-Overlay (Desktop) */

	/* Allgemein */
	--color-akzent: var(--tb-blau);
	--bg-slideshow: rgb(255 255 255);
	--bg-fallback-farbe: var(--tb-grau-logo);
	--border-social-media: 1px solid var(--tb-line-invers);
	
	/* Barrierefreiheit Panel */
	--access-panel-headline-color: var(--tb-tinte);
	--bcc-shadow: 0 0 4px 1px rgb(0 0 0 / .8);
	--bg-access-panel: rgb(255 255 255);
	--access-panel-bs: 0 0 4px 2px rgb(95 95 95 / .6);
	--bg-panel-button: var(--tb-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(--tb-grau-800);
	--access-icon-tooltip-text: rgb(255 255 255);

	/* Cookie Modal */
	--bg-modal-content: rgb(255 255 255);
	--modal-content-text-color: var(--tb-grau-800);
	--modal-header-bg: var(--tb-tinte);
	--modal-header-text-color: rgb(255 255 255);
	--modal-footer-bg: var(--tb-grau-100);
	--placeholder-background: var(--tb-grau-100);
	--bg-consent-icons: var(--tb-grau-50);
	--color-btn-custom-accept-normal: var(--tb-blau);
	--color-btn-custom-accept-hover: var(--tb-blau-dunkel);
	--color-btn-custom-reject-normal: var(--tb-grau-200);
	--color-btn-custom-reject-hover: var(--tb-grau-300);

	--background-content: var(--tb-bg);
	/*--background-content: url('../images/background/');*/
	--background-kontaktformular: var(--tb-bg-alt);
	--img-filter: none;
	--mapsiframe-filter: grayscale(100%);

	/* Navigation */
	--background-navi: rgb(255 255 255 / .94);
	--color-navigation: var(--tb-tinte);
	--color-navigation-hover: var(--tb-blau);
	--color-dropdown-navigation: var(--tb-tinte);
	--dropdown-menu: rgb(255 255 255);

	/* Top-Info */
	--color-top-info-text: rgb(255 255 255 / .8);
	--links-top-info: rgb(255 255 255);
	--links-top-info-hover: rgb(255 255 255);
	--background-top-info: var(--tb-tinte);

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

	/* Text */
	--color-ueberschriften: var(--tb-heading);
	--color-subline: var(--tb-text-muted);

	--color-text: var(--tb-text);
	--color-links: var(--tb-accent-text);
	--color-links-hover: var(--tb-accent-hover);

	/* Call to action Box */
	--call2action-background: var(--tb-bg-alt);
	--call2action-color-link-main: var(--tb-accent-text);
	--call2action-color-link-hover: var(--tb-accent-hover);

	/* Float Kontakt */
	--color-float-contact-icon: rgb(255 255 255);
	--color-float-contact-background: var(--tb-blau);
	--bg-float-contact: rgb(255 255 255 / .6);

	/* Review-Slider */
	--title-review: var(--tb-heading);
	--background-review-slider: var(--tb-grau-100);

	/* Footer */
	--color-footer-text: rgb(255 255 255 / .78);
	--color-footer-links-main: rgb(255 255 255);
	--color-footer-links-hover: rgb(196 211 246);
	--footer-icon-color: rgb(170 192 242);
	--background-footer: var(--tb-blau-dunkel);

	/* Social Media */
	--color-facebook: var(--tb-blau);
	
	/* Glas Effekt */
	--glas-background: rgb(255 255 255 / .7);
	--glas-border: rgb(255 255 255 / .4);

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

		--font-ueberschriften: "archivo", "Helvetica Neue", Arial, sans-serif;
		--font-fliesstext: "hanken-grotesk", "Hanken Grotesk", "Helvetica Neue", Arial, sans-serif;
		--font-navigation: "hanken-grotesk", "Hanken Grotesk", "Helvetica Neue", Arial, sans-serif;
		--tb-font-mono: "ibm-plex-mono", "IBM Plex Mono", ui-monospace, Menlo, monospace;

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

[data-theme="dark"] {
	/* Designsystem – Rollen */
	--tb-bg: rgb(16 19 24);
	--tb-bg-alt: rgb(23 27 34);
	--tb-bg-card: rgb(27 32 40);
	--tb-bg-invers: rgb(10 12 16);
	--tb-text: rgb(207 211 214);
	--tb-text-muted: rgb(152 158 161);
	--tb-text-invers: rgb(255 255 255 / .7);
	--tb-heading: rgb(245 246 247);
	--tb-heading-invers: rgb(255 255 255);
	--tb-line: rgb(255 255 255 / .09);
	--tb-line-strong: rgb(255 255 255 / .18);
	--tb-line-invers: rgb(255 255 255 / .12);
	--tb-accent: rgb(61 99 199);
	--tb-accent-hover: rgb(46 80 170);
	--tb-accent-text: rgb(142 170 238);
	--tb-accent-soft: rgb(30 64 147 / .22);
	--tb-raster: rgb(142 170 238 / .06);
	--tb-img-shade: rgb(0 0 0 / .6);
	--tb-img-bg: rgb(30 35 43);
	--tb-focus: rgb(142 170 238 / .55);

	/* Allgemein */
	--color-akzent: rgb(61 99 199);
	--bg-slideshow: rgb(16 19 24);
	--bg-fallback-farbe: rgb(60 64 66);
	--border-social-media: 1px solid rgb(255 255 255 / .2);

	/* Barrierefreiheit Panel */
	--access-panel-headline-color: rgb(10 12 16);
	--bcc-shadow: none;
	--bg-access-panel: rgb(27 32 40);
	--access-panel-bs: none;
	--bg-panel-button: rgb(60 64 66);
	--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: var(--tb-grau-800);

	/* Cookie Modal */
	--bg-modal-content: rgb(27 32 40);
	--modal-content-text-color: rgb(255 255 255);
	--modal-header-bg: rgb(10 12 16);
	--modal-header-text-color: rgb(255 255 255);
	--modal-footer-bg: rgb(23 27 34);
	--placeholder-background: rgb(27 32 40);
	--bg-consent-icons: rgb(40 46 55);
	--color-btn-custom-accept-normal: rgb(61 99 199);
	--color-btn-custom-accept-hover: rgb(46 80 170);
	--color-btn-custom-reject-normal: var(--tb-grau-300);
	--color-btn-custom-reject-hover: var(--tb-grau-logo);

	--background-content: var(--tb-bg);
	--background-kontaktformular: var(--tb-bg-alt);
	--img-filter: brightness(.88);
	--mapsiframe-filter: grayscale(100%) invert(90%) contrast(95%);

	/* Navigation */
	--background-navi: rgb(16 19 24 / .92);
	--color-navigation: rgb(245 246 247);
	--color-navigation-hover: rgb(142 170 238);
	--color-dropdown-navigation: rgb(245 246 247);
	--dropdown-menu: rgb(23 27 34);

	/* Top-Info */
	--color-top-info-text: rgb(255 255 255 / .7);
	--links-top-info: rgb(255 255 255);
	--links-top-info-hover: rgb(255 255 255);
	--background-top-info: rgb(10 12 16);

	/* Kontaktbox */
	--color-kontaktbox-open: rgb(255 255 255);
	--color-kontaktbox-h4: rgb(255 255 255);
	--bg-kontaktbox: rgb(30 64 147);
	--bg-main-kontaktbox: var(--tb-bg);

	/* Text */
	--color-ueberschriften: var(--tb-heading);
	--color-subline: var(--tb-text-muted);
	--color-text: var(--tb-text);
	--color-links: var(--tb-accent-text);
	--color-links-hover: rgb(185 204 246);

	/* Call to action Box */
	--call2action-background: var(--tb-bg-alt);
	--call2action-color-link-main: var(--tb-accent-text);
	--call2action-color-link-hover: rgb(185 204 246);

	/* Float Kontakt */
	--color-float-contact-icon: rgb(255 255 255);
	--color-float-contact-background: rgb(61 99 199);
	--bg-float-contact: rgb(16 19 24 / .6);

	/* Review-Slider */
	--title-review: var(--tb-heading);
	--background-review-slider: var(--tb-bg-alt);

	/* Footer */
	--color-footer-text: rgb(255 255 255 / .68);
	--color-footer-links-main: rgb(255 255 255);
	--color-footer-links-hover: rgb(160 184 240);
	--footer-icon-color: rgb(160 184 240);
	--background-footer: rgb(10 12 16);

	/* Social Media */
	--color-facebook: rgb(61 99 199);
	
	/* Glas Effekt */
	--glas-background: rgb(16 19 24 / .6);
	--glas-border: rgb(255 255 255 / .08);
}
/* -------------------- Farben-Variablen ENDE -------------------- */