/* ==========================================================================
   Hoher Kontrast – nur aktiv mit <html data-contrast="high"> (Schalter oben neben dem Menü).
   Ändert ausschließlich Farben, Linien und Unterstreichungen, nie Abstände oder Größen:
   Das Layout bleibt in beiden Modi gleich. Ziel: Texte mindestens 7:1 (WCAG AAA).
   ========================================================================== */

/* Der Schalter selbst (gehört zum normalen Design, wird nur ohne JavaScript ausgeblendet) */
html:not(.js) .contrastbtn { display: none; }
.contrastbtn[aria-pressed="true"] { color: var(--accent); box-shadow: inset 0 0 0 2px var(--accent); }

html[data-contrast="high"] {
  --bg: #000;
  --bg-rgb: 0, 0, 0;
  --surface: #000;
  --surface-2: #000;
  --text: #fff;
  --heading: #ffe600;
  --muted: #e6e6e6;
  --border: #fff;
  --primary: #ffe600;
  --primary-text: #000;
  --primary-soft: #000;
  --link: #ffe600;
  --accent: #ffe600;
  --accent-text: #000;
  --accent-soft: #000;
  --danger: #ff8a8a;
  --success: #6dff9c;
  --shadow: none;
  --shadow-lg: none;
}

/* Fokus deutlich sichtbar (Umriss verschiebt nichts) */
html[data-contrast="high"] :focus-visible { outline: 3px solid #ffe600; outline-offset: 3px; }
html[data-contrast="high"] ::selection { background: #ffe600; color: #000; }

/* Glas-Effekte: nichts scheint mehr durch */
html[data-contrast="high"] .topbar,
html[data-contrast="high"] .tabbar,
html[data-contrast="high"] .dayhead,
html[data-contrast="high"] .stat,
html[data-contrast="high"] .eyebrow--pill {
  background: #000; -webkit-backdrop-filter: none; backdrop-filter: none;
}
html[data-contrast="high"] .topbar { border-bottom-color: #fff; }
html[data-contrast="high"] .tabbar { border-top-color: #fff; }
html[data-contrast="high"] .eyebrow--pill { border-color: #fff; }
html[data-contrast="high"] .menu-sheet__backdrop { background: rgba(0, 0, 0, .85); }

/* Texte über Fotos: dunkle, gleichmäßige Abdeckung statt Verlauf */
html[data-contrast="high"] .hero::after { background: rgba(0, 0, 0, .8); }
html[data-contrast="high"] .page-hero::before { background: none; }
html[data-contrast="high"] .page-hero--image::before { background: rgba(0, 0, 0, .82); }
html[data-contrast="high"] .cta-banner { background: #000; }
html[data-contrast="high"] .cta-banner::after { background: rgba(0, 0, 0, .85); }
html[data-contrast="high"] .album::after { background: linear-gradient(180deg, transparent 30%, rgba(0, 0, 0, .94) 62%); }
html[data-contrast="high"] .album:not(:focus-visible) { outline: 1px solid #fff; outline-offset: -1px; }
html[data-contrast="high"] .photo-grid figcaption { background: rgba(0, 0, 0, .92); }
html[data-contrast="high"] .mosaic__more { background: rgba(0, 0, 0, .85); }
html[data-contrast="high"] .detail-hero::after { background: none; }
html[data-contrast="high"] .hero__text,
html[data-contrast="high"] .cta-banner .prose,
html[data-contrast="high"] .page-hero p,
html[data-contrast="high"] .album__meta { color: #fff; opacity: 1; }
html[data-contrast="high"] .ev__datebadge,
html[data-contrast="high"] .photo-grid .duration,
html[data-contrast="high"] .detail-hero__share,
html[data-contrast="high"] .lightbox__nav {
  background: #000; color: #fff; box-shadow: inset 0 0 0 1px #fff; -webkit-backdrop-filter: none; backdrop-filter: none;
}
html[data-contrast="high"] .detail-hero__credit { color: #fff; background: #000; }
html[data-contrast="high"] .album-teaser__play { background: rgba(0, 0, 0, .7); }
html[data-contrast="high"] .lightbox { background: #000; }

/* Schmuckflächen und Leuchteffekte weg – sie senken nur den Kontrast */
html[data-contrast="high"] .ph,
html[data-contrast="high"] .ph.ph--cat { background: #000; }
html[data-contrast="high"] .split__media::before { background: none; box-shadow: inset 0 0 0 2px #fff; }
html[data-contrast="high"] .btn--primary,
html[data-contrast="high"] .btn--accent,
html[data-contrast="high"] .tabbar__plus span.plus,
html[data-contrast="high"] .done__icon,
html[data-contrast="high"] .photo-grid .play { box-shadow: none; }
html[data-contrast="high"] .feature-card .card__icon { background: #000; color: #ffe600; box-shadow: inset 0 0 0 1px #fff; }
html[data-contrast="high"] .footer,
html[data-contrast="high"] .footer::before { background: #000; }

/* Knöpfe und Markierungen: Gelb mit schwarzer Schrift, sonst weiße Linien */
html[data-contrast="high"] .btn--primary,
html[data-contrast="high"] .chip.is-active,
html[data-contrast="high"] .team-more__faces .team-more__plus,
html[data-contrast="high"] .badge--danger,
html[data-contrast="high"] .badge--cancel { color: #000; }
html[data-contrast="high"] .btn--ghost { border-color: #fff; }
html[data-contrast="high"] .btn--soft:hover,
html[data-contrast="high"] .btn--ghost:hover { background: #fff; color: #000; }
html[data-contrast="high"] .btn--primary:hover,
html[data-contrast="high"] .btn--accent:hover { filter: none; background: #fff; color: #000; }
html[data-contrast="high"] .badge--primary,
html[data-contrast="high"] .badge--young,
html[data-contrast="high"] .badge--free,
html[data-contrast="high"] .badge--outside { background: #000; border-color: #fff; }
html[data-contrast="high"] .chip .count { opacity: 1; }
html[data-contrast="high"] .ev.is-crew { border-color: #ffe600; }
html[data-contrast="high"] .ev.is-cancelled .ev__title { opacity: 1; }

/* Hover sichtbar machen (Flächen sind jetzt alle schwarz) */
html[data-contrast="high"] .iconbtn:hover,
html[data-contrast="high"] .copybtn:hover,
html[data-contrast="high"] .socials a:hover { background: #000; box-shadow: inset 0 0 0 2px #ffe600; color: #ffe600; }
html[data-contrast="high"] .mainnav > a:hover,
html[data-contrast="high"] .navdrop > button:hover,
html[data-contrast="high"] .navdrop:focus-within > button,
html[data-contrast="high"] .navdrop__menu a:hover,
html[data-contrast="high"] .menu-list a:hover,
html[data-contrast="high"] .toc a:hover,
html[data-contrast="high"] .tabbar a:hover { background: #000; color: #ffe600; text-decoration: underline; text-underline-offset: 3px; }
html[data-contrast="high"] .menu-list a.is-active,
html[data-contrast="high"] .toc a.is-active { background: #000; color: #ffe600; box-shadow: inset 0 0 0 2px #ffe600; }
html[data-contrast="high"] .ev:hover,
html[data-contrast="high"] .pc:hover,
html[data-contrast="high"] .feature-card:hover,
html[data-contrast="high"] .pager-nav a:hover,
html[data-contrast="high"] a.contact-card:hover,
html[data-contrast="high"] .album-teaser:hover { border-color: #ffe600; }
html[data-contrast="high"] .album:hover,
html[data-contrast="high"] .logo-tile:hover { box-shadow: 0 0 0 3px #ffe600; }

/* Links im Text immer unterstrichen */
html[data-contrast="high"] main p a:not([class]),
html[data-contrast="high"] main li a:not([class]),
html[data-contrast="high"] .footer a,
html[data-contrast="high"] .crumbs a,
html[data-contrast="high"] .linkmore { text-decoration: underline; text-underline-offset: 3px; }
html[data-contrast="high"] main .toc li a,
html[data-contrast="high"] .footer .socials a { text-decoration: none; }
html[data-contrast="high"] .footer a { color: #fff; }
html[data-contrast="high"] .footer a:hover { color: #ffe600; }

/* Formulare */
html[data-contrast="high"] .field input::placeholder,
html[data-contrast="high"] .field textarea::placeholder,
html[data-contrast="high"] .searchbar input::placeholder { color: #c8c8c8; opacity: 1; }
html[data-contrast="high"] .field input:focus,
html[data-contrast="high"] .field select:focus,
html[data-contrast="high"] .field textarea:focus { border-color: #ffe600; box-shadow: 0 0 0 3px #ffe600; }
html[data-contrast="high"] .checkgrid label:has(input:checked) { background: #ffe600; border-color: #ffe600; color: #000; }
html[data-contrast="high"] .check input:not(:focus-visible),
html[data-contrast="high"] .checkgrid input:not(:focus-visible) { outline: 2px solid #fff; outline-offset: 1px; }
html[data-contrast="high"] .notice--danger,
html[data-contrast="high"] .form-errors { background: #000; border-color: #ff8a8a; }
html[data-contrast="high"] .message--success { border-color: #6dff9c; }
html[data-contrast="high"] .message--error { border-color: #ff8a8a; }