/* Barrierefreiheit (WCAG 2.1 AA) — chilli mind, August 2026 */

/* Skip-Link: unsichtbar bis Tastaturfokus */
.skip-link {
    position: absolute;
    left: -9999px;
    top: 0;
    z-index: 10000;
    background: #fff;
    color: #1a1a1a;
    padding: 12px 24px;
    font-weight: 600;
    text-decoration: none;
}

.skip-link:focus {
    left: 0;
    outline: 3px solid #1a1a1a;
    outline-offset: -3px;
}

/* ---------------------------------------------------------------------------
   Kontrast analog ipsoeco «Variante A» (Kundenentscheid 2026-07-15 auf
   www.ipsoeco.ch, hier übertragen): Türkis-Text auf hellem Grund → #007A68
   (5.27:1 auf Weiss, 4.50:1 auf #ededed), Hover → #00594C (8.3:1).
   Flächen: uk-*-primary #009880 trägt hier auch KLEINEN weissen Text
   (Footer, Karten, Buttons) → abgedunkelt auf #007A68 (5.27:1);
   uk-*-secondary #69c0ac trägt nur GROSSE weisse Titel → auf den
   Haupt-Türkiston #009880 (3.61:1, besteht 3:1 für grossen Text).
   a11y.css lädt VOR theme.1.css → Overrides arbeiten mit html-Präfix-
   Spezifität statt Ladereihenfolge. Dunkle Kontexte (uk-light, Sections,
   Cards) behalten ihre spezifischeren Theme-Regeln (#fff) — nicht anfassen.
--------------------------------------------------------------------------- */

/* Links global (waren #009880 = 3.61:1; einer der Theme-Hover ist #ef7171 = 3.0:1) */
html a,
html .uk-link { color: #007a68; }
html a:hover,
html .uk-link:hover,
html .uk-link-toggle:hover .uk-link { color: #00594c; }

/* Desktop-Navigation (war #69c0ac = 2.15:1, Hover #009881 = 3.61:1;
   Active bleibt Theme-seitig #041d19; weisse Nav in dunklen Kontexten
   bleibt über spezifischere Theme-Regeln erhalten) */
html .uk-navbar-nav > li > a { color: #007a68; }
html .uk-navbar-nav > li:hover > a,
html .uk-navbar-nav > li > a[aria-expanded=true],
html .uk-navbar-nav > li > a:active { color: #00594c; }
html .uk-navbar-toggle { color: #007a68; }

/* Buttons (uk-button-primary war Fläche #009880 mit weissem 16px-Text = 3.61:1;
   uk-button-secondary Fläche #69c0ac = 2.15:1; im dunklen Kontext gewinnen
   die spezifischeren Theme-Regeln, dort sind Buttons weiss) */
html .uk-button-primary { background-color: #007a68; }
html .uk-button-primary:hover { background-color: #00594c; }
html .uk-button-secondary { background-color: #007a68; background-image: none; }
html .uk-button-secondary:hover { background-color: #00594c; background-image: none; }
html .uk-icon-button:hover { background-color: #007a68; background-image: none; }

/* Flächen: primary UND secondary tragen kleinen weissen Text (Footer-
   Widgets, Karten, Fliesstext auf Start-/Übersichtsseiten) → einheitlich
   #007A68 (weiss = 5.27:1, besteht für jede Schriftgrösse). */
html .uk-section-primary:not(.uk-preserve-color) { background: #007a68; }
html .uk-tile-primary:not(.uk-preserve-color) { background-color: #007a68; }
html .uk-card-primary { background-color: #007a68; }
html .uk-section-secondary:not(.uk-preserve-color) { background: #007a68; }
html .uk-tile-secondary:not(.uk-preserve-color) { background-color: #007a68; }

/* Toolbar (Login-Button + WPML-Umschalter, site-weit): Fläche war #009880
   mit kleinem weissem Text = 3.61:1 → #007A68 (5.27:1). Link-Hover war
   theme-seitig rgba(255,255,255,.5) = 2.47:1 → voll weiss. */
html .tm-toolbar-default { background: #007a68; }
html .tm-toolbar-default a:hover,
html .tm-toolbar-default .uk-link:hover { color: #fff; }

/* WPML-Sprachumschalter (Toolbar + Mobile-Dialog): Text war #69c0ac mit
   !important aus dem WPML-CSS = 1.67:1 auf Türkis */
html .wpml-ls .wpml-ls-native,
html .wpml-ls .wpml-ls-display { color: #fff !important; }

/* Meta-/Datums-Text auf weissen Karten (war #f8f8f8 auf Weiss = 1.06:1!) */
html .uk-card-default .uk-text-meta { color: #4a4a4a; }
/* Meta-Text auf Türkis-Flächen: Theme setzt in dunklen Kontexten
   rgba(255,255,255,.5) = 2.47:1 → voll weiss. Selektoren spiegeln die
   Theme-Spezifität (sonst verliert der Override). */
html .tm-toolbar-default .uk-text-meta,
html .uk-card-primary.uk-card-body .uk-text-meta,
html .uk-card-primary > :not([class*=uk-card-media]) .uk-text-meta,
html .uk-light .uk-text-meta,
html .uk-section-primary:not(.uk-preserve-color) .uk-text-meta,
html .uk-section-secondary:not(.uk-preserve-color) .uk-text-meta,
html .uk-tile-primary:not(.uk-preserve-color) .uk-text-meta,
html .uk-tile-secondary:not(.uk-preserve-color) .uk-text-meta { color: #fff; }

/* Headings: Theme setzt ALLE h1–h6/.uk-h* auf #009880 (3.61:1) — h1/h2 sind
   gross genug (≥24px besteht 3:1), h3–h6 fallen bei kleiner Schrift durch
   → #007A68. Weisse Headings in dunklen Kontexten behalten ihre
   spezifischeren Theme-Regeln. */
html h3, html h4, html h5, html h6,
html .uk-h3, html .uk-h4, html .uk-h5, html .uk-h6 { color: #007a68; }

/* Gutenberg-Buttons (Datenschutz-/Cookie-Seiten): Hintergrund kommt als
   Inline-Style/Preset → !important nötig (war #009880 = 3.61:1) */
html .wp-block-button__link { background-color: #007a68 !important; }

/* FAQ-Akkordeon: Fragen-Titel (war #009880 auf #f5f5f5 = 3.31:1 bei
   kleiner Schrift) */
html details summary h3 { color: #007a68; }

/* Utility-Klassen (Theme setzt !important; Datumszeilen in Blog-Posts waren
   #69c0ac = 2.15:1, Team-Karten-Untertitel #009880 = 3.61:1 bei 18px).
   In dunklen Kontexten gewinnen die spezifischeren weissen Theme-Regeln. */
html .uk-text-primary { color: #007a68 !important; }
html .uk-text-secondary { color: #007a68 !important; }

/* em-Auszeichnungen (Theme: #69c0ac = 2.15:1, u.a. Zitate und Formular-
   Hinweise); auf Türkis-Flächen weiss halten (Theme hat dort keine
   eigene em-Regel) */
html em { color: #007a68; }
html .tm-toolbar-default em,
html .uk-light em,
html .uk-section-primary:not(.uk-preserve-color) em,
html .uk-section-secondary:not(.uk-preserve-color) em,
html .uk-tile-primary:not(.uk-preserve-color) em,
html .uk-tile-secondary:not(.uk-preserve-color) em,
html .uk-card-primary em,
html .uk-card-secondary em { color: #fff; }

/* Compliance-Check-Tool (eigenes YOOtheme-HTML-Element mit Inline-Styles →
   !important nötig): Start-Button #009880 = 3.61:1, Intro-Text #8a909a = 2.99:1 */
html #complyant-cc-start-btn { background-color: #007a68 !important; }
html #complyant-cc-screen-intro p { color: #565c66 !important; }

/* Complianz-Cookie-Banner: Farben laufen komplett über CSS-Variablen aus
   der generierten banner-1-optin.css (:root). html:root gewinnt per
   Spezifität — kein DB-Eingriff nötig, überlebt Regenerierung durch
   Admin-Saves. Banner-Fläche war #69c0ac (weisser Text = 2.15:1),
   Akzeptieren-Button #009880 (3.61:1). */
html:root {
    --cmplz_banner_background_color: #007a68;
    --cmplz_banner_border_color: #007a68;
    --cmplz_button_accept_background_color: #00594c;
    --cmplz_button_accept_border_color: #00594c;
}

/* Footer-Rechtslinks (uk-link-muted): Theme setzt in dunklen Kontexten
   rgba(255,255,255,.5) = 2.47:1 → voll weiss (Selektoren spiegeln die
   Theme-Spezifität). */
html .tm-toolbar-default .uk-link-muted a,
html .tm-toolbar-default a.uk-link-muted,
html .uk-light .uk-link-muted a,
html .uk-light a.uk-link-muted,
html .uk-section-primary:not(.uk-preserve-color) .uk-link-muted a,
html .uk-section-primary:not(.uk-preserve-color) a.uk-link-muted,
html .uk-section-secondary:not(.uk-preserve-color) .uk-link-muted a,
html .uk-section-secondary:not(.uk-preserve-color) a.uk-link-muted,
html .uk-tile-primary:not(.uk-preserve-color) .uk-link-muted a,
html .uk-tile-primary:not(.uk-preserve-color) a.uk-link-muted,
html .uk-tile-secondary:not(.uk-preserve-color) .uk-link-muted a,
html .uk-tile-secondary:not(.uk-preserve-color) a.uk-link-muted,
html .uk-card-primary.uk-card-body .uk-link-muted a,
html .uk-card-primary.uk-card-body a.uk-link-muted,
html .uk-card-primary > :not([class*=uk-card-media]) .uk-link-muted a,
html .uk-card-primary > :not([class*=uk-card-media]) a.uk-link-muted,
html .tm-toolbar-default .uk-link-muted a:hover,
html .tm-toolbar-default a.uk-link-muted:hover,
html .uk-light .uk-link-muted a:hover,
html .uk-light a.uk-link-muted:hover,
html .uk-section-primary:not(.uk-preserve-color) .uk-link-muted a:hover,
html .uk-section-primary:not(.uk-preserve-color) a.uk-link-muted:hover,
html .uk-section-secondary:not(.uk-preserve-color) .uk-link-muted a:hover,
html .uk-section-secondary:not(.uk-preserve-color) a.uk-link-muted:hover {
    color: #fff;
}

/* Footer-Rechtslinks: uk-subnav im dunklen Kontext — Theme setzt
   rgba(255,255,255,.5) = 2.47:1 → voll weiss */
html .tm-toolbar-default .uk-subnav > * > :first-child,
html .uk-light .uk-subnav > * > :first-child,
html .uk-section-primary:not(.uk-preserve-color) .uk-subnav > * > :first-child,
html .uk-section-secondary:not(.uk-preserve-color) .uk-subnav > * > :first-child,
html .uk-tile-primary:not(.uk-preserve-color) .uk-subnav > * > :first-child,
html .uk-tile-secondary:not(.uk-preserve-color) .uk-subnav > * > :first-child,
html .uk-card-primary.uk-card-body .uk-subnav > * > :first-child,
html .uk-card-primary > :not([class*=uk-card-media]) .uk-subnav > * > :first-child,
html .tm-toolbar-default .uk-subnav > * > a:hover,
html .uk-light .uk-subnav > * > a:hover,
html .uk-section-primary:not(.uk-preserve-color) .uk-subnav > * > a:hover,
html .uk-section-secondary:not(.uk-preserve-color) .uk-subnav > * > a:hover,
html .uk-tile-primary:not(.uk-preserve-color) .uk-subnav > * > a:hover,
html .uk-tile-secondary:not(.uk-preserve-color) .uk-subnav > * > a:hover {
    color: #fff;
}

/* Ninja-Forms-Submit (Anmeldeformular legal-compliance): war #f74163 mit
   #f7f7f7-Text = 3.32:1 → #d21f45 (4.87:1, bleibt im Rot des Originals) */
html input.ninja-forms-field[type="submit"] {
    background-color: #d21f45 !important;
    border-color: #d21f45 !important;
}