/* ============================================================
   ajour Dark Mode
   Wird per <link id="dark-css"> bei Bedarf geladen.
   Alle Werte überschreiben das bestehende CSS via [data-theme="dark"].
   ============================================================ */

[data-theme="dark"] {

  /* Basis */
  --dm-bg:           #111827;
  --dm-bg-alt:       #1f2937;
  --dm-bg-card:      #1a2234;
  --dm-bg-dark:      #0d1117;
  --dm-text:         #e2e8f0;
  --dm-text-muted:   #94a3b8;
  --dm-border:       #2d3748;
  --dm-skincolor:    #e20a16;

  color-scheme: dark;
}

/* Body & Grundfarben */
[data-theme="dark"] body {
  background-color: var(--dm-bg);
  color: var(--dm-text);
}

/* Topbar */
[data-theme="dark"] .ttm-topbar-wrapper {
  background-color: var(--dm-bg-dark) !important;
  border-bottom: 1px solid var(--dm-border);
}
[data-theme="dark"] .ttm-topbar-wrapper .top-contact li,
[data-theme="dark"] .ttm-topbar-wrapper .top-contact li a {
  color: var(--dm-text-muted) !important;
}

/* Header / Navigation — bleibt hell (Logo nur auf hellem Grund lesbar) */
[data-theme="dark"] #site-header-menu,
[data-theme="dark"] .ttm-stickable-header,
[data-theme="dark"] .site-header-menu-inner {
  background-color: #ffffff !important;
  border-bottom: 1px solid #e5e7eb;
}
[data-theme="dark"] #site-navigation .menu > ul > li > a {
  color: #1e2637 !important;
}
[data-theme="dark"] #site-navigation .menu > ul > li > a:hover {
  color: var(--dm-skincolor) !important;
}
[data-theme="dark"] #site-navigation .menu ul {
  background-color: #ffffff !important;
  border: 1px solid #e5e7eb;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}
[data-theme="dark"] #site-navigation .menu ul li a {
  color: #1e2637 !important;
}
/* Mobile Hamburger-Linien bleiben dunkel auf hellem Nav-Hintergrund */
[data-theme="dark"] .ttm-menu-toggle .toggle-block {
  background-color: #1e2637 !important;
}

/* Preloader — weiß lassen (GIF-Hintergrund) */
[data-theme="dark"] #status {
  background-color: #ffffff !important;
}

/* About-Sektion */
[data-theme="dark"] .ttm-row.aboutus-section {
  background-color: var(--dm-bg);
}
[data-theme="dark"] h1, [data-theme="dark"] h2,
[data-theme="dark"] h3, [data-theme="dark"] h4,
[data-theme="dark"] h5, [data-theme="dark"] h6 {
  color: var(--dm-text) !important;
}
[data-theme="dark"] p {
  color: var(--dm-text-muted);
}
/* 3-Spalten-Leiste: rote + dunkle Boxen behalten immer weißen Text */
[data-theme="dark"] .ttm-bgcolor-skincolor h1,
[data-theme="dark"] .ttm-bgcolor-skincolor h2,
[data-theme="dark"] .ttm-bgcolor-skincolor h3,
[data-theme="dark"] .ttm-bgcolor-skincolor h4,
[data-theme="dark"] .ttm-bgcolor-skincolor h5,
[data-theme="dark"] .ttm-bgcolor-skincolor h6 {
  color: #fff !important;
}
[data-theme="dark"] .ttm-bgcolor-skincolor p,
[data-theme="dark"] .ttm-bgcolor-skincolor a {
  color: rgba(255,255,255,0.9) !important;
}
[data-theme="dark"] .ttm-bgcolor-darkgrey .featured-title h5,
[data-theme="dark"] .ttm-bgcolor-darkgrey .featured-desc p,
[data-theme="dark"] .ttm-bgcolor-darkgrey .featured-desc a {
  color: #fff !important;
}
[data-theme="dark"] .title-desc p {
  color: var(--dm-text-muted);
}
[data-theme="dark"] .sep-line {
  background: var(--dm-border);
}
[data-theme="dark"] .about-text-box a,
[data-theme="dark"] .about-text-box span {
  color: var(--dm-text-muted);
}

/* 3er Icon-Leiste (Fernwartung / Hotline / Vor Ort) */
[data-theme="dark"] .featured-icon-box.style1.ttm-bgcolor-darkgrey {
  background-color: #0d1117 !important;
}

/* Produkt-Sektion (grauer Hintergrund) */
[data-theme="dark"] .ttm-bgcolor-grey,
[data-theme="dark"] .history-section,
[data-theme="dark"] .contact-box-section {
  background-color: var(--dm-bg-alt) !important;
}
[data-theme="dark"] .ttm-row-wrapper-bg-layer {
  background-color: var(--dm-bg-alt) !important;
}

/* Produkt-Kacheln */
[data-theme="dark"] .ttm-history-box-details {
  background-color: var(--dm-bg-card) !important;
  border: 1px solid var(--dm-border);
}
[data-theme="dark"] .ttm-historybox-title h5 {
  color: var(--dm-text) !important;
}
[data-theme="dark"] .ttm-historybox-description {
  color: var(--dm-text-muted);
}
[data-theme="dark"] .ttm-history-box-border {
  border-color: var(--dm-border) !important;
}

/* Team-Karten */
[data-theme="dark"] .featured-imagebox-team.style1 .featured-content {
  background-color: var(--dm-bg-card) !important;
}
[data-theme="dark"] .featured-imagebox-team .featured-title h5 {
  color: var(--dm-text) !important;
}
[data-theme="dark"] .featured-imagebox-team p.category {
  color: var(--dm-text-muted) !important;
}
[data-theme="dark"] .featured-content.box-shadow {
  box-shadow: 0 4px 20px rgba(0,0,0,0.4) !important;
}

/* Kontakt-Boxen (style8) */
[data-theme="dark"] .featured-icon-box.style8 {
  background-color: var(--dm-bg-card) !important;
  border: 1px solid var(--dm-border);
}
[data-theme="dark"] .featured-icon-box.style8 .featured-title h5,
[data-theme="dark"] .featured-icon-box.style8 p,
[data-theme="dark"] .featured-icon-box.style8 a {
  color: var(--dm-text) !important;
}

/* Footer */
[data-theme="dark"] .second-footer,
[data-theme="dark"] .bottom-footer-text {
  background-color: var(--dm-bg-dark) !important;
  border-top: 1px solid var(--dm-border);
}

/* Footer Word-Cloud */
[data-theme="dark"] ul.cloud a {
  color: var(--dm-text-muted) !important;
}
[data-theme="dark"] ul.cloud a:hover {
  color: var(--dm-skincolor) !important;
}

/* Footer Nav */
[data-theme="dark"] .footer-nav-menu li a {
  color: var(--dm-text-muted) !important;
}
[data-theme="dark"] .footer-nav-menu li a:hover {
  color: var(--dm-text) !important;
}

/* Allgemeine Links */
[data-theme="dark"] a {
  color: var(--dm-text);
}
[data-theme="dark"] a:hover {
  color: var(--dm-skincolor);
}

/* Magnific Popup (AGB / Impressum / DSGVO) */
[data-theme="dark"] .white-popup {
  background-color: var(--dm-bg-alt) !important;
  color: var(--dm-text) !important;
}
[data-theme="dark"] .white-popup h2.project-title {
  color: var(--dm-text) !important;
}
[data-theme="dark"] .white-popup p.project-desc,
[data-theme="dark"] .white-popup p.project-desc strong {
  color: var(--dm-text-muted) !important;
}
[data-theme="dark"] .white-popup a {
  color: var(--dm-skincolor) !important;
}
[data-theme="dark"] .white-popup table {
  border-color: var(--dm-border) !important;
  color: var(--dm-text-muted);
}
[data-theme="dark"] .white-popup th {
  background: var(--dm-bg-card) !important;
  color: var(--dm-text) !important;
}

/* Cookie-Banner */
[data-theme="dark"] #ajour-cookie-banner {
  background: #0d1117;
  border-top: 1px solid var(--dm-border);
}
[data-theme="dark"] .cookie-settings-box {
  background: var(--dm-bg-alt);
  color: var(--dm-text);
}
[data-theme="dark"] .cookie-category {
  border-color: var(--dm-border);
}

/* Google Maps Consent-Overlay */
[data-theme="dark"] .maps-consent-overlay {
  background: var(--dm-bg-alt);
}
[data-theme="dark"] .maps-consent-overlay p {
  color: var(--dm-text-muted);
}

/* TTM Icon Elemente */
[data-theme="dark"] .ttm-icon_element-bgcolor-white {
  background-color: var(--dm-bg-alt) !important;
}

/* Separator */
[data-theme="dark"] .separator .sep-line {
  background: var(--dm-border) !important;
}

/* about overlay */
[data-theme="dark"] .about-overlay-01 {
  background-color: rgba(30, 38, 55, 0.92) !important;
}
[data-theme="dark"] .about-overlay-01 p {
  color: var(--dm-text) !important;
}

/* TTM List Icons */
[data-theme="dark"] .ttm-list li {
  color: var(--dm-text-muted);
}

/* Toggle-Button im Menü */
#dm-toggle {
  background: none;
  border: none;
  cursor: pointer;
  font-size: 18px;
  line-height: 1;
  padding: 0;
  color: #1e2637;
  vertical-align: middle;
  display: inline-flex;
  align-items: center;
}
#dm-toggle:hover {
  opacity: 0.7;
}
/* Im Dark Mode: Nav ist weiß, Button bleibt dunkel */
[data-theme="dark"] #dm-toggle {
  color: #1e2637 !important;
}

/* Smooth Transition beim Umschalten */
body, .ttm-topbar-wrapper, #site-header-menu,
.ttm-stickable-header, .site-header-menu-inner,
.featured-icon-box, .featured-content, .white-popup,
.ttm-history-box-details, .featured-imagebox-team .featured-content,
.second-footer, .bottom-footer-text, .ttm-bgcolor-grey,
h1, h2, h3, h4, h5, h6, p, a {
  transition: background-color 0.25s ease, color 0.2s ease, border-color 0.25s ease;
}

/* Vertikale Trennlinie in Team-Überschrift ausblenden */
[data-theme="dark"] .section-title.style2 .title-header:after {
  display: none;
}
