/* Interaktionsschicht: individuelle Hover-, Fokus- und Aktivfarben.
   Keine Seite sollte diese Zuständigkeit durch neue globale Hoverregeln umgehen. */
/* FÖHRE — zentrale Hover-/Aktivfarben auf Basis der fünf Designfarben.
   KAPITEL-REGELN: Start / Über uns = orange; Leistungen = grün;
   Bibliothek / Artikel = schwarz; Referenzen bleiben unverändert.
   AUSNAHMEN: Bibliotheks-Übersichtszeile = orange auf hellgrau;
   Footer = orange auf allen Seiten; geöffnetes Hauptmenü eigenständig.
   Keine neuen Farbkorrekturen in anderen CSS-Dateien ergänzen. */
:root {
  --foehre-hover-orange: var(--foehre-color-orange);
  --foehre-hover-green: var(--foehre-color-green);
  --foehre-hover-black: var(--foehre-color-black);
  --foehre-menu-active: var(--foehre-color-orange);
  --foehre-menu-green: var(--foehre-color-green);
  --foehre-menu-white: var(--foehre-color-paper);
}
body:is(.design-home,.design-about) {
  --foehre-section-hover: var(--foehre-hover-orange);
}
body.design-services {
  --foehre-section-hover: var(--foehre-hover-green);
}
body:is(.design-library-index,.library-page) {
  --foehre-section-hover: var(--foehre-hover-black);
}

/* Seiteninhalt: Kapitel-Akzent ohne Auswirkung auf den unabhängigen Header, das Menü und den Footer. */
html body:is(.design-home,.design-about,.design-services,.design-library-index,.library-page)
  main :is(a,button,summary):is(:hover,:focus-visible),
html body:is(.design-home,.design-about,.design-services,.design-library-index,.library-page)
  main :is(a,button,summary):is(:hover,:focus-visible) :is(span,strong,em,small,time,svg) {
  color: var(--foehre-section-hover);
}
/* Kapitelnavigation samt Pfeil: gleicher Akzent wie die übrige Seite. */
html body:is(.design-home,.design-about,.design-services,.design-library-index,.library-page)
  a.foehre-chapter-cta.is-interactive:is(:hover,:focus-visible),
html body:is(.design-home,.design-about,.design-services,.design-library-index,.library-page)
  a.foehre-chapter-cta.is-interactive:is(:hover,:focus-visible) :is(.foehre-chapter-cta-label,.foehre-chapter-cta-icon) {
  color: var(--foehre-section-hover);
}
/* Suchfeld, Suchtreffer und Artikelnavigation in der Bibliothek: schwarz. */
html body:is(.design-library-index,.library-page)
  :is(.foehre-search-field,.library-sidebar,.library-main,.design-library-main)
  :is(a,button,svg):is(:hover,:focus-visible),
html body:is(.design-library-index,.library-page)
  .foehre-search-field:is(:hover,:focus-within) > svg {
  color: var(--foehre-hover-black);
  stroke: var(--foehre-hover-black);
}
html body:is(.design-library-index,.library-page)
  :is(.foehre-search-field,.foehre-search-field:is(:hover,:focus-within)) input[type="search"]:is(:hover,:focus),
html body:is(.design-library-index,.library-page)
  .foehre-search-field:is(:hover,:focus-within) input[type="search"]::placeholder {
  color: var(--foehre-hover-black);
}
/* Bibliotheksübersicht: normaler Kaskaden-Zustand mit gleichem Akzent
   für Eintrag, Titel und Jahreszahl; das Hintergrundverhalten ist unabhängig. */
html body.design-library-index main #library-topics a.design-library-entry:is(:hover,:focus-visible) {
  background: var(--foehre-color-paper);
}
html body.design-library-index main #library-topics a.design-library-entry:is(:hover,:focus-visible),
html body.design-library-index main #library-topics a.design-library-entry:is(:hover,:focus-visible) * {
  color: var(--foehre-hover-orange);
}
/* Footer hat eine EIGENE, seitenunabhängige Farbe — auch Referenzen. */
html body .site-footer.design-footer :is(a,button):is(:hover,:focus-visible),
html body .site-footer.design-footer :is(a,button):is(:hover,:focus-visible) :is(span,svg,i,strong,em) {
  color: var(--foehre-hover-orange);
}
/* Geöffnetes Hauptmenü: keine Kapitel-Hoverfarben erben.
   Neutral: grüne Symbole, grüner Text, aktive Seite orange.
   Preview: farbiger Grund, WORT und LOGO weiß; andere Zeilen ausgeblendet.
   Normale (nicht-hovered) Zeilen bleiben hit-testbar, damit man ohne
   Rücksprung in den grauen Zustand direkt zwischen Zeilen wechseln kann. */
html body #site-mobile-menu.design-menu-overlay {
  --foehre-section-hover: var(--foehre-hover-orange);
  --foehre-menu-preview: var(--foehre-color-paper);
  /* The menu preview keeps colour and logo contrast together. */
  --foehre-menu-preview-text: var(--foehre-menu-white);
  --foehre-menu-preview-icon-filter: brightness(0) invert(1);
}
html body #site-mobile-menu.design-menu-overlay .site-mobile-nav.design-menu-items .design-menu-link,
html body #site-mobile-menu.design-menu-overlay .site-mobile-nav.design-menu-items .design-menu-link .design-menu-label {
  color: var(--foehre-menu-green);
}
html body #site-mobile-menu.design-menu-overlay:not(.is-menu-item-hover)
  .site-mobile-nav.design-menu-items .design-menu-link[aria-current="page"],
html body #site-mobile-menu.design-menu-overlay:not(.is-menu-item-hover)
  .site-mobile-nav.design-menu-items .design-menu-link[aria-current="page"] .design-menu-label {
  color: var(--foehre-menu-active);
}
html body #site-mobile-menu.design-menu-overlay .site-mobile-nav.design-menu-items .design-menu-link .design-menu-icon img {
  filter: none;
}
html body #site-mobile-menu.design-menu-overlay.is-hover-about {background-color:var(--foehre-color-green);}
html body #site-mobile-menu.design-menu-overlay.is-hover-services {background-color:var(--foehre-color-ochre);}
html body #site-mobile-menu.design-menu-overlay.is-hover-library {background-color:var(--foehre-color-orange);}
/* References preview is neutral-grey on ALL pages, with the original dark-green logo.
   Other previews retain their section colours and light foreground. */
html body #site-mobile-menu.design-menu-overlay.is-hover-refs {
  background-color:var(--foehre-color-paper);
  --foehre-menu-preview-text:var(--foehre-color-green);
  --foehre-menu-preview-icon-filter:none;
}
@media (hover:hover) {
  html body #site-mobile-menu.design-menu-overlay.is-menu-item-hover
    .site-mobile-nav.design-menu-items .design-menu-link:not(.is-hovered-link) {
    opacity:0;
    visibility:visible;
    pointer-events:auto;
  }
  html body #site-mobile-menu.design-menu-overlay.is-menu-item-hover
    .site-mobile-nav.design-menu-items .design-menu-link.is-hovered-link {
    opacity:1;
    visibility:visible;
  }
}
html body #site-mobile-menu.design-menu-overlay.is-menu-item-hover
  .site-mobile-nav.design-menu-items .design-menu-link.is-hovered-link,
html body #site-mobile-menu.design-menu-overlay.is-menu-item-hover
  .site-mobile-nav.design-menu-items .design-menu-link.is-hovered-link .design-menu-label {
  color: var(--foehre-menu-preview-text);
}
html body #site-mobile-menu.design-menu-overlay.is-menu-item-hover
  .site-mobile-nav.design-menu-items .design-menu-link.is-hovered-link .design-menu-icon img {
  filter: var(--foehre-menu-preview-icon-filter);
}
html body #site-mobile-menu.design-menu-overlay:is(.is-hover-about,.is-hover-services,.is-hover-library,.is-hover-refs)
  :is(.design-menu-home,.design-menu-languages a,.design-menu-close) {
  color: var(--foehre-menu-preview-text);
}
html body #site-mobile-menu.design-menu-overlay:not(.is-menu-item-hover)
  .design-menu-home[aria-current="page"],
html body #site-mobile-menu.design-menu-overlay:not(.is-menu-item-hover)
  .design-menu-languages a[aria-current="page"] {
  color: var(--foehre-menu-active);
}
html body #site-mobile-menu.design-menu-overlay:not(.is-menu-item-hover)
  :is(.design-menu-home,.design-menu-languages a):is(:hover,:focus-visible) {
  color: var(--foehre-hover-orange);
}

html body {
  --foehre-header-normal:var(--foehre-color-black);
  --foehre-header-hover:var(--foehre-color-orange);
  --foehre-header-current:var(--foehre-color-orange);
}
html body.design-about {
  --foehre-header-normal:var(--foehre-color-paper);
}
html body.design-services {
  --foehre-header-normal:var(--foehre-color-paper);
  --foehre-header-hover:var(--foehre-color-green);
  --foehre-header-current:var(--foehre-color-green);
}
html body:is(.design-library-index,.library-page) {
  --foehre-header-normal:var(--foehre-color-paper);
  --foehre-header-hover:var(--foehre-color-black);
  --foehre-header-current:var(--foehre-color-black);
}

/* Inaktive Sprachlinks, Trenner und MENÜ: gut lesbare Grundfarbe. */
html body .site-header.design-header .design-languages,
html body .site-header.design-header .design-languages span[aria-hidden],
html body .site-header.design-header .design-languages a:not([aria-current="page"]):not(:hover):not(:focus-visible),
html body .site-header.design-header .design-menu-trigger:not(:hover):not(:focus-visible) {
  color:var(--foehre-header-normal);
  opacity:1;
}

/* Aktive Sprache bleibt in jeder Situation in ihrer Kapitelfarbe. */
html body .site-header.design-header .design-languages a[aria-current="page"] {
  color:var(--foehre-header-current);
  opacity:1;
}

/* Hover und Tastaturfokus folgen nur für Header-Controls der Kapitelfarbe. */
html body .site-header.design-header .design-languages a:not([aria-current="page"]):is(:hover,:focus-visible),
html body .site-header.design-header .design-menu-trigger:is(:hover,:focus-visible) {
  color:var(--foehre-header-hover);
  opacity:1;
}

/* Mobile Burger-Linien müssen dieselbe Farbe wie MENÜ bekommen. */
html body .site-header.design-header .design-menu-trigger:not(:hover):not(:focus-visible) .design-menu-burger path {
  stroke:var(--foehre-header-normal);
}
html body .site-header.design-header .design-menu-trigger:is(:hover,:focus-visible) .design-menu-burger path {
  stroke:var(--foehre-header-hover);
}

/* While previewing any one of the four menu sections, the language
   dividers must turn white along with language labels and the close icon. */
html body #site-mobile-menu.design-menu-overlay.is-menu-item-hover
  .design-menu-languages span[aria-hidden] {
  color:var(--foehre-color-paper);
  opacity:1;
}