/* * High-Contrast-Modus (behindertengerecht, WCAG AA) * * Aktivierung über (Toggle im Header, * Persistenz via localStorage "mws-highcontrast"). Überschreibt die pro * Client kompilierten Theme-Farben, daher durchgehend !important. */ /* Flächen: Weiß, Text: Schwarz */ html.high-contrast body, html.high-contrast .body, html.high-contrast .main, html.high-contrast .bgcol_page, html.high-contrast .bgcol_akzent, html.high-contrast .bgcol_filter, html.high-contrast .bgcol_footer, html.high-contrast .bgcol_suche:not(hr), html.high-contrast #header .header-body, html.high-contrast .header-nav-bar, html.high-contrast #footer, html.high-contrast .footer, html.high-contrast .card, html.high-contrast .card-body, html.high-contrast .product { background-color: #fff !important; background-image: none !important; color: #000 !important; } /* Textfarben */ html.high-contrast .textcol_h1, html.high-contrast .textcol_h2, html.high-contrast .textcol_h3, html.high-contrast .textcol_text, html.high-contrast .textcol_infotext, html.high-contrast .textcol_akzent, html.high-contrast .textcol_footer, html.high-contrast .textcol_footer_headline, html.high-contrast .text-muted, html.high-contrast .text-color-dark, html.high-contrast h1, html.high-contrast h2, html.high-contrast h3, html.high-contrast h4, html.high-contrast h5, html.high-contrast h6, html.high-contrast p, html.high-contrast li, html.high-contrast label { color: #000 !important; } /* Trennlinien sichtbar halten (hr nutzt background-color als Linienfarbe) */ html.high-contrast hr, html.high-contrast hr.bgcol_suche { background-color: #000 !important; opacity: 1 !important; } /* Links: Schwarz und unterstrichen */ html.high-contrast a:not(.btn) { color: #000 !important; text-decoration: underline !important; } /* Buttons: Schwarz auf Weiß mit klarem Rahmen, invertiert bei Hover/Fokus */ html.high-contrast .btn-primary, html.high-contrast .btn-secondary, html.high-contrast .btn-modern, html.high-contrast input[type="submit"] { background-color: #000 !important; background-image: none !important; border: 2px solid #000 !important; color: #fff !important; } html.high-contrast .btn-primary:hover, html.high-contrast .btn-primary:focus, html.high-contrast .btn-secondary:hover, html.high-contrast .btn-secondary:focus, html.high-contrast .btn-modern:hover, html.high-contrast .btn-modern:focus, html.high-contrast input[type="submit"]:hover, html.high-contrast input[type="submit"]:focus { background-color: #fff !important; color: #000 !important; } /* Formularfelder */ html.high-contrast .form-control, html.high-contrast .form-select, html.high-contrast select, html.high-contrast textarea { background-color: #fff !important; color: #000 !important; border: 2px solid #000 !important; } html.high-contrast ::placeholder { color: #333 !important; opacity: 1 !important; } /* Warenkorb-Badge u. ä. */ html.high-contrast .cart-info, html.high-contrast .cart-qty, html.high-contrast .badge { background-color: #000 !important; color: #fff !important; } /* Deutlicher Fokus-Indikator */ html.high-contrast *:focus { outline: 3px solid #000 !important; outline-offset: 2px !important; }