/*
Theme Name: Sunflower26 Child LTW26 Kampagne
Theme URI: https://mariska-ott.de
Description: Child Theme fuer Sunflower26 – Kampagnenfarben LTW 2026
Author: Mariska Ott
Template: sunflower26
Version: 1.3.0
Text Domain: sunflower26-child-ltw26
*/

/*
==========================================================
AUFBAU DIESES CHILD-THEMES – WO SUCHE ICH WAS?
==========================================================

functions.php
  Laedt diese style.css und tauscht alle festen Farbcodes des
  Parent-Themes gegen die Kampagnenfarben (Farbliste in der Datei).
  -> Taucht irgendwo noch eine ALTE Parent-Farbe auf:
     dort nachsehen.

theme.json
  Farbpalette und Schriften fuer den Block-Editor sowie die
  Farbvariablen (--wp--preset--color--...), die unten
  verwendet werden.
  -> Falsche Farben im Editor oder in einer Variable:
     dort nachsehen.

style.css (diese Datei)
  Nur bewusste Abweichungen vom Parent-Theme sowie Footer-Logo,
  Bildnachweise und Cookie-Banner.
  -> Soll ein einzelnes Element ANDERS aussehen als im
     Parent vorgesehen: hier nachsehen.

Logo (Kopfbereich)
  Kommt aus Design -> Customizer -> Website-Informationen,
  nicht aus dieser Datei.

Zuordnung der Farb-Slugs (theme.json):
  black    = Schwarz  #000000  (Fliesstext helle Variante)
  tanne    = Wald     #1c302a
  klee     = Salbei   #78a08c
  grashalm = Salbei   #78a08c
  sonne    = Limette  #e6fd53
  sand     = Sand     #f5f1e9

Varianten:
  .colorscheme-light = helle Variante
  .colorscheme-green = dunkle Variante

Stand: 27.10.2026
*/


/* ==========================================================
   1. FOOTER-LOGO
   Das Logo im Kopfbereich kommt aus dem Customizer.
   ========================================================== */

/* Footer-Logo ausblenden (samt Kasten, Rahmen und Eckverzierungen) */
.site-footer .footerlogo {
    display: none !important;
}


/* ==========================================================
   2. SEITENTITEL / SCHRAEGE BALKEN
   Farben fixiert: Das Parent tauscht beim Hover die Farben
   der Balken. Mit Wald-Schrift im unteren Balken waere der
   Text dann unsichtbar.
   ========================================================== */

/* Oberer Balken: Dr. Mariska Ott */
.label-top.skew-box,
.label-top.skew-box::before {
    background-color: var(--wp--preset--color--tanne) !important;
}

.label-top {
    color: var(--wp--preset--color--white) !important;
}

/* Unterer Balken: Für Baden-Württemberg */
.label-bottom.skew-box,
.label-bottom.skew-box::before {
    background-color: var(--wp--preset--color--klee) !important;
}

.label-bottom {
    color: var(--wp--preset--color--tanne) !important;
}


/* ==========================================================
   3. LESBARKEIT
   Helle Variante:  Fliesstext Schwarz, Links in Wald,
                    Salbei fuer Flaechen/Rahmen.
   Dunkle Variante: Fliesstext Weiss, Links in Limette,
                    auf hellen Flaechen in Wald.
   Auf Salbei-Flaechen Wald-Schrift statt Weiss.
   ========================================================== */

/* Fliesstext in der hellen Variante: Schwarz */
body.colorscheme-light,
.colorscheme-light .wp-block-accordion-panel {
    color: var(--wp--preset--color--black);
}

.colorscheme-light.post-type-archive-sunflower_event a.event-card article .p-4 .fst-italic,
.colorscheme-light.post-type-archive-sunflower_event a.event-card article .p-4 .event-card__excerpt p {
    color: var(--wp--preset--color--black) !important;
}

/* Fliesstext in der dunklen Variante: Weiss
   (helle Kaesten wie Karten, Formular und Akkordeon behalten dunkle Schrift) */
body.colorscheme-green {
    color: var(--wp--preset--color--white);
}

/* Links im Fliesstext und in Listen: Grundregel */
.entry-content :is(p, .wp-block-list li) a:not(.wp-block-button__link) {
    text-decoration: underline;
    text-underline-offset: 0.15em;
}

/* Helle Variante: Wald auf Weiss */
.colorscheme-light .entry-content :is(p, .wp-block-list li) a:not(.wp-block-button__link) {
    color: var(--wp--preset--color--tanne) !important;
}

/* Dunkle Variante: Limette auf Wald */
.colorscheme-green .entry-content :is(p, .wp-block-list li) a:not(.wp-block-button__link) {
    color: var(--wp--preset--color--sonne) !important;
}

/* Sonderfall: helle Flaechen in dunkler Variante -> Wald
   (Farbbloecke, Kontaktformular, Akkordeon, Details, Zitate, Termin-Infokasten) */
.colorscheme-green :is(.has-white-background-color, .has-sand-background-color, .has-gruener-sand-background-color, .has-kalk-background-color, .has-sonne-background-color, .comment-respond, .wp-block-accordion-item, .wp-block-details, .wp-block-sunflower-accordion, blockquote, .metabox) :is(p, .wp-block-list li) a:not(.wp-block-button__link) {
    color: var(--wp--preset--color--tanne) !important;
}

/* Sonderfall: dunkle Flaechen in heller Variante -> Limette */
.colorscheme-light :is(.has-tanne-background-color, .has-black-background-color) :is(p, .wp-block-list li) a:not(.wp-block-button__link) {
    color: var(--wp--preset--color--sonne) !important;
}

/* Kontaktformular in dunkler Variante (heller Sand-Hintergrund):
   Hinweistexte und Links in Wald */
.colorscheme-green form:has(.comment-form-email) p,
.colorscheme-green form:has(.comment-form-email) :is(p, .wp-block-list li) a:not(.wp-block-button__link),
.colorscheme-green #privacy_policy_url {
    color: var(--wp--preset--color--tanne) !important;
}

/* Hover und Fokus: Unterstreichung in Salbei */
.entry-content :is(p, .wp-block-list li) a:not(.wp-block-button__link):hover,
.entry-content :is(p, .wp-block-list li) a:not(.wp-block-button__link):focus {
    text-decoration-color: var(--wp--preset--color--klee);
}

/* Titel der Beitragskarten (Karten sind immer hell) */
body .latest-posts--grid .archive-article .p-45 .entry-header h2,
body .latest-posts--grid .archive-article .p-45 .entry-header h2 a,
body .latest-posts--grid .archive-article .p-45 .entry-header .h5,
body .latest-posts--grid .archive-article .p-45 .entry-header .h5 a,
body .latest-posts--grid .archive-article .p-45 .entry-header .card-title,
body .latest-posts--grid .archive-article .p-45 .entry-header .card-title a {
    color: var(--wp--preset--color--tanne) !important;
}

/* Termin-Archiv: Wochentag und Titel (Karten sind immer hell) */
.post-type-archive-sunflower_event .weekday,
.post-type-archive-sunflower_event .event-card .h2,
.post-type-archive-sunflower_event .event-card .h2 a,
.post-type-archive-sunflower_event article.event .h2,
.post-type-archive-sunflower_event article.event .h2 a {
    color: var(--wp--preset--color--tanne) !important;
}

/* Termin-Archiv: Filter aktiv, Hover, Fokus */
.post-type-archive-sunflower_event .filter-button-group button.filter.filter-active,
.post-type-archive-sunflower_event .filter-button-group button.filter:hover,
.post-type-archive-sunflower_event .filter-button-group button.filter:focus,
.post-type-archive-sunflower_event .filter-button-group .eventlist.filter-active,
.post-type-archive-sunflower_event .filter-button-group .eventlist:hover,
.post-type-archive-sunflower_event .filter-button-group .eventlist:focus {
    background: var(--wp--preset--color--klee) !important;
    color: var(--wp--preset--color--tanne) !important;
    border-color: var(--wp--preset--color--klee) !important;
}

/* Termin-Archiv: Kalender-Download (ICS), nur helle Variante */
.colorscheme-light.post-type-archive-sunflower_event a.calendar-download,
.colorscheme-light.post-type-archive-sunflower_event a.calendar-download:visited {
    color: var(--wp--preset--color--tanne) !important;
}

.colorscheme-light.post-type-archive-sunflower_event a.calendar-download:hover,
.colorscheme-light.post-type-archive-sunflower_event a.calendar-download:focus {
    color: var(--wp--preset--color--klee) !important;
}

/* Termine auf der Startseite (mit und ohne Bild), einheitlich:
   helle Karten, Datum und Uhrzeit im hellen Gruen,
   Betreff im dunklen Gruen, uebriger Text in Schwarz */

/* Karten ohne Bild: heller Hintergrund statt dunkler Flaechen */
.next-events .row:not(:has(.event-card__media)) > .col-12 article {
    background-color: var(--wp--preset--color--gruener-sand) !important;
}

/* Grundfarbe aller Karten: Schwarz */
.next-events .row > .col-12 article,
.next-events .row > .col-12 article .small {
    color: var(--wp--preset--color--black) !important;
}

/* Datum und Uhrzeit: helles Gruen */
.next-events .row > .col-12 article .date,
.next-events .row > .col-12 article .date time,
.next-events .row > .col-12 article .date::first-line {
    color: var(--wp--preset--color--klee) !important;
}

/* Betreff: dunkles Gruen */
.next-events .row > .col-12 article h2,
.next-events .row > .col-12 article .h2,
.next-events .row > .col-12 article h2 a {
    color: var(--wp--preset--color--tanne) !important;
}

/* Karten ohne Bild: dunklen Pfeil statt weissem anzeigen */
@media (min-width: 950px) {
    .next-events .row:not(:has(.event-card__media)) .event-card__icon--green {
        display: block !important;
    }

    .next-events .row:not(:has(.event-card__media)) .event-card__icon--white {
        display: none !important;
    }
}


/* ==========================================================
   4. GESTALTUNG
   ========================================================== */

/* Mobiles Menue: Hamburger-Linien, nur helle Variante */
.colorscheme-light.hamburger-menu .hamburger span {
    background-color: var(--wp--preset--color--tanne) !important;
}

.colorscheme-light.hamburger-menu .hamburger:hover span,
.colorscheme-light.hamburger-menu .hamburger:focus span {
    background-color: var(--wp--preset--color--klee) !important;
}

/* Social-Media-Icons: Hover bleibt hell (helle Variante) */
.colorscheme-light .social-media-profile:hover,
.colorscheme-light .social-media-profile:focus {
    background-color: var(--wp--preset--color--white) !important;
    color: var(--wp--preset--color--klee) !important;
    border-color: var(--wp--preset--color--klee) !important;
}

/* Pfeil-Grafiken (Bilddateien, daher per Filter in Salbei eingefaerbt) */
body.home .latest-posts--grid article.archive-article img.icon-arrow,
.event-card img[src*="arrow-right.svg"] {
    filter: brightness(0) saturate(100%) invert(61%) sepia(14%)
            saturate(580%) hue-rotate(96deg)
            brightness(91%) contrast(86%);
}


/* Top-Menue (schmale Leiste ueber dem Hauptmenue)
   Helle Variante:  Leiste Wald, Eintraege weiss
   Dunkle Variante: Leiste Salbei, Eintraege Wald */

/* Abstand oben und unten gleich verteilt (Gesamthoehe bleibt gleich) */
.topmenu ul {
    padding-top: calc(var(--grid-margin) / 2);
    padding-bottom: calc(var(--grid-margin) / 2);
}

/* Helle Variante */
.colorscheme-light .topmenu {
    background-color: var(--wp--preset--color--tanne); /* Wald */
}

.colorscheme-light .topmenu .menu-item a {
    color: var(--wp--preset--color--white) !important;
}

.colorscheme-light .topmenu .menu-item a:hover,
.colorscheme-light .topmenu .menu-item a:focus-visible,
.colorscheme-light .topmenu .menu-item.current_page_item a,
.colorscheme-light .topmenu .menu-item.current-menu-item a {
    color: var(--wp--preset--color--sonne) !important; /* Limette */
}

/* Dunkle Variante */
.colorscheme-green .topmenu {
    background-color: var(--wp--preset--color--klee); /* Salbei */
}

.colorscheme-green .topmenu .menu-item a {
    color: var(--wp--preset--color--tanne) !important; /* Wald */
}

.colorscheme-green .topmenu .menu-item a:hover,
.colorscheme-green .topmenu .menu-item a:focus-visible,
.colorscheme-green .topmenu .menu-item.current_page_item a,
.colorscheme-green .topmenu .menu-item.current-menu-item a {
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 0.25em;
}


/* ==========================================================
   5. BILDNACHWEISE
   ========================================================== */

.sunflower-photo-credit {
    background-color: rgba(245, 241, 233, 0.9) !important; /* Sand */
    color: var(--wp--preset--color--tanne) !important;
}

.sunflower-photo-credit a {
    color: var(--wp--preset--color--tanne) !important;
}


/* ==========================================================
   6. COOKIE-BANNER (Plugin Complianz)
   ========================================================== */

:root {
    --cmplz_banner_background_color: var(--wp--preset--color--sand);
    --cmplz_text_color: var(--wp--preset--color--tanne);
    --cmplz_hyperlink_color: var(--wp--preset--color--tanne);

    --cmplz_button_accept_background_color: var(--wp--preset--color--tanne);
    --cmplz_button_accept_border_color: var(--wp--preset--color--tanne);
    --cmplz_button_accept_text_color: var(--wp--preset--color--white);

    --cmplz_button_deny_background_color: var(--wp--preset--color--tanne);
    --cmplz_button_deny_border_color: var(--wp--preset--color--tanne);
    --cmplz_button_deny_text_color: var(--wp--preset--color--white);
}

.cmplz-cookiebanner,
.cmplz-cookiebanner .cmplz-message,
.cmplz-cookiebanner .cmplz-title,
.cmplz-cookiebanner a,
.cmplz-cookiebanner .cmplz-link,
.cmplz-cookiebanner .cmplz-close {
    color: var(--wp--preset--color--tanne) !important;
}

.cmplz-cookiebanner .cmplz-btn.cmplz-accept,
.cmplz-cookiebanner .cmplz-btn.cmplz-deny {
    background-color: var(--wp--preset--color--tanne) !important;
    border-color: var(--wp--preset--color--tanne) !important;
    color: var(--wp--preset--color--white) !important;
}