/* ==========================================================================
   variablen.css
   Farb- und Schrift-Variablen für Light- und Darkmode.
   Muss VOR zz--custom.css und float-contact.css eingebunden werden.
   ========================================================================== */

/* -------------------- Farben-Variablen BEGINN -------------------- */
:root {
--color-akzent: #003668;
--color-links-hover: #018bd2;
--color-links: #003668;
--color-footer-links: #fff;
--color-navigation: #000;
--color-navigation-hover: #fff;
--dropdown-menu: rgba(255, 255, 255, 0.80);
--color-dropdown-navigation: #000;
--color-ueberschriften: #003668;
--color-kontaktbox-h4: #004176;
--color-text: #333;
--color-hauptfarbe: #fff;                              /* war undefiniert; Weiß = bisherige Optik im Lightmode */
--color-footer-text: #fff;
--color-top-info-text: #531E20;
--farbverlauf: linear-gradient(45deg, var(--color-akzent) 0%,  var(--color-links) 100%);
--farbverlauf-kontaktbox: linear-gradient(90deg, rgba(0,103,156,1) 0%, rgba(1,139,210,1) 50%, rgba(0,103,156,1) 100%);
--color-facebook: #3b5998;
--color-whatsapp: #25D366;
--color-tiktok: #000;
--color-insta: linear-gradient(35deg, #feda75 0%, #fa7e1e 25%, #d62976 50%, #962fbf 75%, #4f5bd5 100%);
--background-navi: #fff;
/*--background-top-info: url('../images/background/');*/
/*--background-content: url('../images/background/');*/
--background-review-slider: url('../images/background/bg-review--518537484.jpg');
/*--background-kontaktformular: url('../images/background/');*/
--background-footer: #003668;
--slider-overlay: brightness(1.0);
--footer-maps-filter: invert(0);
--background-mietobjekt: #fff;

/* -------------------- Float-Contact (neu) -------------------- */
--float-contact-panel-bg: rgba(255, 255, 255, 0.50);   /* Glas-Hintergrund der Leiste rechts */
--float-contact-ring: #fff;                            /* innerer Rand (border) */
--float-contact-outline: #000;                         /* äußerer Rand (outline) */
--float-contact-shadow: #cccccc;
--float-contact-hover-bg: #018bd2;                     /* vorher identisch mit Akzent -> kein sichtbarer Hover */
--float-contact-hover-text: #fff;                      /* vorher --color-navigation (#000 auf Blau) */
--float-contact-element-bg: #fff;                      /* Kreis-mit-Plus: ausfahrende Elemente */
--float-contact-element-text: #333;

/* -------------------- Datenschutz-Button (.btn-success) -------------------- */
--btn-ds-text: #333;
--btn-ds-bg: var(--color-hauptfarbe);
--btn-ds-border: #333;
--btn-ds-hover-text: #fff;            /* vorher #333 auf #003668 = 1,0:1, unlesbar */
--btn-ds-hover-bg: #003668;
--btn-ds-hover-border: #003668;
--btn-ds-active-text: #fff;           /* vorher #333 auf #999 */
--btn-ds-active-bg: #002444;
--btn-ds-active-border: #002444;
--btn-ds-disabled-text: #6c757d;
--btn-ds-disabled-bg: #e9ecef;
--btn-ds-disabled-border: #ced4da;
--btn-ds-focus-rgb: 1, 139, 210;      /* vorher beiger Fokusring aus Fremdvorlage */

/* -------------------- Theme- und Sprachschalter -------------------- */
--switch-mode-bg: #000;
--switch-mode-border: #003668;        /* vorher #000 auf #000 = unsichtbar */
--switch-mode-ball: rgba(255, 255, 255, 0.8);
--switch-lang-bg: var(--background-navi);
--switch-lang-border: #000;
--switch-lang-ball: rgba(0, 54, 104, 0.85); /* vorher weiß auf weiß */
--switch-focus: #018bd2;

/* -------------------- Kontakt-Kacheln (Telefon / E-Mail) -------------------- */
--kontakt-item-bg: #fff;
--kontakt-item-border: #dde3ea;
--kontakt-item-label: #6c757d;
--kontakt-item-link: #003668;
--kontakt-item-icon-bg: rgba(0, 54, 104, 0.08);
--kontakt-item-icon: #003668;
--kontakt-item-hover: #018bd2;
--kontakt-item-icon-hover-bg: #003668;
--kontakt-item-icon-hover: #fff;

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

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

    --main-gruen: #8ac043;
    --main-blau: #003668;
    --main-hellblau: #018bd2;

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

[data-theme="dark"] {
--color-akzent: #018bd2;
--color-links-hover: #66c2f0;                          /* war #003668 = kaum sichtbar auf Dunkel */
--color-links: #018bd2;
--color-footer-links: #fff;
--color-navigation: #fff;
--color-navigation-hover: #fff;
--dropdown-menu: rgba(0, 0, 0, 0.80);
--color-dropdown-navigation: #fff;
--color-ueberschriften: #018bd3;
--color-kontaktbox-h4: #fff;                           /* ersetzt das ungenutzte --color-kontaktbox-open */
--color-text: #fff;
--color-hauptfarbe: #003668;                           /* war undefiniert -> Verlauf/Button ohne Farbe */
--color-top-info-text: #fff;
--color-footer-text: #fff;
--farbverlauf: linear-gradient(45deg, var(--color-akzent) 0%,  var(--color-hauptfarbe) 100%);
--farbverlauf-kontaktbox: linear-gradient(185deg, rgba(0,54,104,1) 0%, rgba(0,111,168,1) 100%);
--color-facebook: #3b5998;
--color-whatsapp: #25D366;
--color-tiktok: #000;
--color-insta: linear-gradient(35deg, #feda75 0%, #fa7e1e 25%, #d62976 50%, #962fbf 75%, #4f5bd5 100%);
--background-navi: #212529;
/*--background-top-info: url('');*/
--background-content: #222;
--background-review-slider: url('../images/background/bg-review-inv--518537484.jpg');
/*--background-kontaktformular: url('../images/background/');*/
--background-kontaktformular: #222;
--background-footer: #212529;
--slider-overlay: brightness(0.5);
--footer-maps-filter: invert(0.9);
--background-mietobjekt: #3f3f3f;

/* -------------------- Float-Contact (neu) -------------------- */
--float-contact-panel-bg: rgba(33, 37, 41, 0.60);      /* dunkles Glas statt weißem Kasten */
--float-contact-ring: #212529;
--float-contact-outline: #fff;                         /* schwarze Outline war auf Dunkel unsichtbar */
--float-contact-shadow: rgba(0, 0, 0, 0.6);
--float-contact-hover-bg: #003668;
--float-contact-hover-text: #fff;
--float-contact-element-bg: #212529;                   /* vorher weiß + weiße Schrift = unsichtbar */
--float-contact-element-text: #fff;

/* -------------------- Datenschutz-Button (.btn-success) -------------------- */
--btn-ds-text: #fff;
--btn-ds-bg: var(--color-hauptfarbe);
--btn-ds-border: #fff;
--btn-ds-hover-text: #003668;         /* vorher #fff auf #018bd2 = 3,7:1 */
--btn-ds-hover-bg: #fff;
--btn-ds-hover-border: #fff;
--btn-ds-active-text: #003668;        /* vorher #fff auf #999 = 2,8:1 */
--btn-ds-active-bg: #cfe8f6;
--btn-ds-active-border: #cfe8f6;
--btn-ds-disabled-text: #adb5bd;
--btn-ds-disabled-bg: #3f3f3f;
--btn-ds-disabled-border: #6c757d;
--btn-ds-focus-rgb: 102, 194, 240;

/* -------------------- Theme- und Sprachschalter -------------------- */
--switch-mode-bg: #000;
--switch-mode-border: #fff;
--switch-mode-ball: rgba(255, 255, 255, 0.8);
--switch-lang-bg: var(--background-navi);
--switch-lang-border: #fff;
--switch-lang-ball: rgba(255, 255, 255, 0.8);
--switch-focus: #66c2f0;

/* -------------------- Kontakt-Kacheln (Telefon / E-Mail) -------------------- */
--kontakt-item-bg: #2b2b2b;
--kontakt-item-border: #444;
--kontakt-item-label: #adb5bd;
--kontakt-item-link: #fff;
--kontakt-item-icon-bg: rgba(1, 139, 210, 0.18);
--kontakt-item-icon: #66c2f0;
--kontakt-item-hover: #66c2f0;
--kontakt-item-icon-hover-bg: #018bd2;
--kontakt-item-icon-hover: #fff;
}
/* -------------------- Farben-Variablen ENDE -------------------- */
