/**
 * minCore Accessibility Styles
 * Native a11y features - because everyone deserves to browse the web (WCAG 2.1 AAA)
 *
 * Components:
 * - Screen reader utilities (invisible but mighty)
 * - Skip links (the express lane for keyboard users)
 * - Focus management (where are we now?)
 * - StyleSwitcher (font size, line height, letter spacing, word spacing)
 * - ContrastSwitcher (5 color schemes for every eye)
 * - EasytextSwitcher (3 readability levels - from PhD to plain English)
 * - Reduced motion (gentle on sensitive vestibular systems)
 * - NoScript fallbacks (trust no one, not even JavaScript)
 * - Accessibility toolbar (the control center for personalization)
 *
 * @version 2.0.0
 * @since TYPO3 13 LTS
 */

/* ==========================================================================
   CSS Custom Properties (Design Tokens)
   ========================================================================== */

:root {
    /* Focus */
    --mincore-focus-color: #005fcc;
    --mincore-focus-width: 3px;
    --mincore-focus-offset: 2px;
    --mincore-focus-radius: 2px;

    /* Skip Links */
    --mincore-skip-link-bg: #000;
    --mincore-skip-link-color: #fff;

    /* Toolbar */
    --mincore-toolbar-bg: #f5f5f5;
    --mincore-toolbar-border: #ddd;

    /* Font Scaling (defaults) */
    --mincore-fontsize: 100%;
    --mincore-lineheight: 1.5;
    --mincore-letterspacing: 0;
    --mincore-wordspacing: 0;

    /* Floating Controls (BackToTop + Style Switcher, Stefan-Entscheid
       2026-09-06): one shared inset so both house-standard controls sit at
       the same distance from the viewport edge on both the bottom and the
       side, mirrored left/right. Value taken from the pre-existing
       BackToTop.css positioning so today's look does not change. */
    --mincore-control-inset: 1.5rem;
}

/* ==========================================================================
   Screen Reader Only Utilities
   ========================================================================== */

.sr-only,
.mincore-sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.sr-only-focusable:focus,
.sr-only-focusable:active,
.mincore-sr-only-focusable:focus,
.mincore-sr-only-focusable:active {
    position: static !important;
    width: auto !important;
    height: auto !important;
    overflow: visible !important;
    clip: auto !important;
    white-space: normal !important;
}

/* ==========================================================================
   Skip Links
   ========================================================================== */

.mincore-skip-links,
.min-skip-links {
    position: relative;
    z-index: 10000;
}

.mincore-skip-link,
.min-skip-link {
    position: absolute;
    top: -100%;
    left: 0;
    padding: 0.75rem 1.5rem;
    background: var(--mincore-skip-link-bg);
    color: var(--mincore-skip-link-color);
    text-decoration: none;
    font-weight: 700;
    z-index: 10000;
    transition: top 0.2s ease;
    white-space: nowrap;
}

.mincore-skip-link:focus,
.min-skip-link:focus {
    top: 0;
    outline: var(--mincore-focus-width) solid var(--mincore-focus-color);
    outline-offset: var(--mincore-focus-offset);
}

/* Alternative skip-link position (right side for the rebels) */
.mincore-skip-link--right {
    left: auto;
    right: 0;
}

/* ==========================================================================
   Focus Management
   ========================================================================== */

/* Standard Focus-Visible */
:focus-visible {
    outline: var(--mincore-focus-width) solid var(--mincore-focus-color);
    outline-offset: var(--mincore-focus-offset);
    border-radius: var(--mincore-focus-radius);
}

/* Remove default focus for mouse users - keyboard focus is where it's at */
:focus:not(:focus-visible) {
    outline: none;
}

/* Keyboard navigation indicator (for browsers that missed the :focus-visible memo) */
.mincore-keyboard-nav :focus {
    outline: var(--mincore-focus-width) solid var(--mincore-focus-color);
    outline-offset: var(--mincore-focus-offset);
}

/* Focus-Trap Container */
.mincore-focus-trap {
    position: relative;
}

.mincore-focus-trap[aria-modal="true"] {
    z-index: 9999;
}

/* ==========================================================================
   StyleSwitcher - Font Size (4 levels because one size never fits all)
   ========================================================================== */

/* Normal (100%) */
html.mincore-fontsize-normal {
    --mincore-fontsize: 100%;
}

/* Large (125%) - for those who appreciate bigger things */
html.mincore-fontsize-large {
    --mincore-fontsize: 125%;
}

/* Extra large (150%) - go big or go home */
html.mincore-fontsize-xlarge {
    --mincore-fontsize: 150%;
}

/* Mega size (175%) - squinting is so last century */
html.mincore-fontsize-xxlarge {
    --mincore-fontsize: 175%;
}

/* Apply the magic */
html[class*="mincore-fontsize-"] body {
    font-size: var(--mincore-fontsize);
}

/* ==========================================================================
   StyleSwitcher - Line Height (3 levels for the breathing room you deserve)
   ========================================================================== */

/* Normal */
html.mincore-lineheight-normal {
    --mincore-lineheight: 1.5;
}

/* Relaxed - give those lines some personal space */
html.mincore-lineheight-relaxed {
    --mincore-lineheight: 1.75;
}

/* Loose - for when lines need social distancing */
html.mincore-lineheight-loose {
    --mincore-lineheight: 2.0;
}

/* Apply the breathing room */
html[class*="mincore-lineheight-"] body {
    line-height: var(--mincore-lineheight);
}

/* ==========================================================================
   StyleSwitcher - Letter Spacing (3 levels - let those letters breathe)
   ========================================================================== */

/* Normal */
html.mincore-letterspacing-normal {
    --mincore-letterspacing: 0;
}

/* Wide - personal space for letters */
html.mincore-letterspacing-wide {
    --mincore-letterspacing: 0.05em;
}

/* Wider - when letters need their own apartment */
html.mincore-letterspacing-wider {
    --mincore-letterspacing: 0.1em;
}

/* Apply the spacing */
html[class*="mincore-letterspacing-"] body {
    letter-spacing: var(--mincore-letterspacing);
}

/* ==========================================================================
   StyleSwitcher - Word Spacing (2 levels for word elbow room)
   ========================================================================== */

/* Normal */
html.mincore-wordspacing-normal {
    --mincore-wordspacing: 0;
}

/* Wide - words need personal bubbles too */
html.mincore-wordspacing-wide {
    --mincore-wordspacing: 0.1em;
}

/* Apply word spacing */
html[class*="mincore-wordspacing-"] body {
    word-spacing: var(--mincore-wordspacing);
}

/* ==========================================================================
   ContrastSwitcher - 5 color schemes (because eyes come in all sensitivities)
   ========================================================================== */

/* Default (system standard - let the OS decide) */
html.mincore-contrast-default {
    /* Uses system colors or theme colors - respecting user preferences */
}

/* System dark mode detection - we see you, night owls */
html.mincore-contrast-default[data-system-theme="dark"] {
    color-scheme: dark;
}

html.mincore-contrast-default[data-system-theme="light"] {
    color-scheme: light;
}

/* High Contrast Light */
html.mincore-contrast-high-contrast-light,
html[data-contrast="high-contrast-light"] {
    --mincore-text-color: #000;
    --mincore-bg-color: #fff;
    --mincore-link-color: #00008b;
    --mincore-link-visited: #800080;
    --mincore-border-color: #000;
    --mincore-focus-color: #0000ff;
    color-scheme: light;
}

html.mincore-contrast-high-contrast-light body,
html[data-contrast="high-contrast-light"] body {
    color: var(--mincore-text-color);
    background-color: var(--mincore-bg-color);
}

html.mincore-contrast-high-contrast-light a,
html[data-contrast="high-contrast-light"] a {
    color: var(--mincore-link-color);
    text-decoration: underline;
    text-decoration-thickness: 2px;
}

html.mincore-contrast-high-contrast-light a:visited,
html[data-contrast="high-contrast-light"] a:visited {
    color: var(--mincore-link-visited);
}

html.mincore-contrast-high-contrast-light :focus-visible,
html[data-contrast="high-contrast-light"] :focus-visible {
    outline-width: 4px;
    outline-offset: 3px;
}

/* High Contrast Dark */
html.mincore-contrast-high-contrast-dark,
html[data-contrast="high-contrast-dark"] {
    --mincore-text-color: #fff;
    --mincore-bg-color: #000;
    --mincore-link-color: #ffff00;
    --mincore-link-visited: #ff69b4;
    --mincore-border-color: #fff;
    --mincore-focus-color: #00ffff;
    color-scheme: dark;
}

html.mincore-contrast-high-contrast-dark body,
html[data-contrast="high-contrast-dark"] body {
    color: var(--mincore-text-color);
    background-color: var(--mincore-bg-color);
}

html.mincore-contrast-high-contrast-dark a,
html[data-contrast="high-contrast-dark"] a {
    color: var(--mincore-link-color);
    text-decoration: underline;
    text-decoration-thickness: 2px;
}

html.mincore-contrast-high-contrast-dark a:visited,
html[data-contrast="high-contrast-dark"] a:visited {
    color: var(--mincore-link-visited);
}

html.mincore-contrast-high-contrast-dark :focus-visible,
html[data-contrast="high-contrast-dark"] :focus-visible {
    outline-width: 4px;
    outline-offset: 3px;
}

/* Inverted */
html.mincore-contrast-inverted,
html[data-contrast="inverted"] {
    filter: invert(1) hue-rotate(180deg);
}

html.mincore-contrast-inverted img,
html.mincore-contrast-inverted video,
html.mincore-contrast-inverted picture,
html.mincore-contrast-inverted svg,
html[data-contrast="inverted"] img,
html[data-contrast="inverted"] video,
html[data-contrast="inverted"] picture,
html[data-contrast="inverted"] svg {
    filter: invert(1) hue-rotate(180deg);
}

/* Sepia (easy on the eyes - like a warm cup of coffee for your screen) */
html.mincore-contrast-sepia,
html[data-contrast="sepia"] {
    --mincore-text-color: #5c4b37;
    --mincore-bg-color: #f5f0e6;
    --mincore-link-color: #8b4513;
    --mincore-border-color: #c4a77d;
    filter: sepia(0.2);
}

html.mincore-contrast-sepia body,
html[data-contrast="sepia"] body {
    color: var(--mincore-text-color);
    background-color: var(--mincore-bg-color);
}

/* ==========================================================================
   EasytextSwitcher - 3 readability levels (from Shakespeare to plain talk)
   ========================================================================== */

/* Content hiding based on readability level - show only what fits the audience */
html.mincore-easytext-normal [data-mincore-text="flesch"],
html.mincore-easytext-normal [data-mincore-text="easy"],
html[data-easytext="normal"] [data-mincore-text="flesch"],
html[data-easytext="normal"] [data-mincore-text="easy"] {
    display: none !important;
}

html.mincore-easytext-flesch [data-mincore-text="normal"],
html.mincore-easytext-flesch [data-mincore-text="easy"],
html[data-easytext="flesch"] [data-mincore-text="normal"],
html[data-easytext="flesch"] [data-mincore-text="easy"] {
    display: none !important;
}

html.mincore-easytext-easy [data-mincore-text="normal"],
html.mincore-easytext-easy [data-mincore-text="flesch"],
html[data-easytext="easy"] [data-mincore-text="normal"],
html[data-easytext="easy"] [data-mincore-text="flesch"] {
    display: none !important;
}

/* Easy language mode - extra tweaks for maximum clarity */
html.mincore-easytext-easy body,
html[data-easytext="easy"] body {
    line-height: 1.8;
    letter-spacing: 0.02em;
}

html.mincore-easytext-easy p,
html[data-easytext="easy"] p {
    margin-bottom: 1.5em;
    max-width: 65ch;
}

html.mincore-easytext-easy li,
html[data-easytext="easy"] li {
    margin-bottom: 0.75em;
}

/* ==========================================================================
   Reduced Motion
   ========================================================================== */

/* Respect system preference - when the user says "no dancing", we stop dancing */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* User-Override via JavaScript */
html.mincore-reduced-motion *,
html.mincore-reduced-motion *::before,
html.mincore-reduced-motion *::after,
html[data-reduced-motion="true"] *,
html[data-reduced-motion="true"] *::before,
html[data-reduced-motion="true"] *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
}

/* ==========================================================================
   NoScript Fallbacks
   ========================================================================== */

/* NoScript Info Box */
.min-noscript-info {
    background: #fff3cd;
    border: 1px solid #ffc107;
    border-radius: 4px;
    padding: 1rem;
    margin: 1rem 0;
}

.min-noscript-info p {
    margin: 0;
    color: #856404;
}

/* Default: JS not loaded yet - patience, young padawan */
html.mincore-no-js .mincore-js-required {
    display: none;
}

/* When JS is loaded - the magic begins */
html.mincore-js-loaded .mincore-no-js-only {
    display: none;
}

/* Standard text always visible without JS - no JS, no problem */
html.mincore-no-js [data-mincore-text="normal"] {
    display: block !important;
}

html.mincore-no-js [data-mincore-text="flesch"],
html.mincore-no-js [data-mincore-text="easy"] {
    display: none !important;
}

/* ==========================================================================
   Accessibility Toolbar - Responsive
   ========================================================================== */

.mincore-a11y-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    padding: 1rem;
    background: var(--mincore-toolbar-bg);
    border: 1px solid var(--mincore-toolbar-border);
    border-radius: 8px;
    margin-bottom: 1rem;
}

/* Minimal variant: fixed top bar, does NOT push page content down */
.mincore-a11y-toolbar--minimal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 10001;
    margin-bottom: 0;
    border-radius: 0;
    padding: 0.25rem 1rem;
    gap: 0.25rem;
    background: var(--mincore-toolbar-bg, rgba(0, 0, 0, 0.92));
    color: #fff;
    border: none;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.mincore-a11y-toolbar--minimal .mincore-a11y-toolbar__button {
    min-width: 36px;
    min-height: 36px;
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
    border-width: 1px;
}

.mincore-a11y-toolbar__group {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.mincore-a11y-toolbar__label {
    font-weight: 700;
    font-size: 0.875rem;
    margin-right: 0.25rem;
    white-space: nowrap;
}

.mincore-a11y-toolbar__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 48px;
    min-height: 48px;
    padding: 0.5rem 1rem;
    border: 2px solid currentColor;
    background: transparent;
    color: inherit;
    border-radius: 4px;
    cursor: pointer;
    font-size: inherit;
    font-family: inherit;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.mincore-a11y-toolbar__button:hover {
    background: rgba(0, 0, 0, 0.1);
}

.mincore-a11y-toolbar__button:focus-visible {
    outline: var(--mincore-focus-width) solid var(--mincore-focus-color);
    outline-offset: var(--mincore-focus-offset);
}

.mincore-a11y-toolbar__button.is-active,
.mincore-a11y-toolbar__button[aria-pressed="true"] {
    background: var(--mincore-focus-color, #005fcc);
    color: #fff;
    border-color: var(--mincore-focus-color, #005fcc);
}

/* Toolbar Icons (optional) */
.mincore-a11y-toolbar__icon {
    width: 1.25em;
    height: 1.25em;
    margin-right: 0.25em;
}

/* Responsive Toolbar */
@media (max-width: 640px) {
    .mincore-a11y-toolbar {
        flex-direction: column;
    }

    .mincore-a11y-toolbar__group {
        width: 100%;
        justify-content: space-between;
    }

    .mincore-a11y-toolbar__label {
        width: 100%;
        margin-bottom: 0.25rem;
    }
}

/* ==========================================================================
   Language Switcher (EasyText) - Segmented Control Style
   ========================================================================== */

.mincore-language-switcher {
    display: inline-flex;
    border: 2px solid currentColor;
    border-radius: 4px;
    overflow: hidden;
}

.mincore-language-switcher__button {
    padding: 0.5rem 1rem;
    min-height: 48px;
    border: none;
    border-right: 1px solid currentColor;
    background: transparent;
    color: inherit;
    cursor: pointer;
    font-size: inherit;
    font-family: inherit;
    transition: background-color 0.2s ease;
}

.mincore-language-switcher__button:last-child {
    border-right: none;
}

.mincore-language-switcher__button:hover {
    background: rgba(0, 0, 0, 0.1);
}

.mincore-language-switcher__button.is-active,
.mincore-language-switcher__button[aria-pressed="true"] {
    background: currentColor;
    color: var(--mincore-bg-color, #fff);
}

/* ==========================================================================
   Contrast Themes Integration (Windows High Contrast mode support)
   ========================================================================== */

/* System High Contrast Mode (Windows) */
@media (forced-colors: active) {
    .mincore-skip-link:focus,
    .mincore-a11y-toolbar__button:focus-visible,
    :focus-visible {
        outline: 3px solid CanvasText;
        outline-offset: 3px;
    }

    .mincore-a11y-toolbar__button.is-active {
        background: Highlight;
        color: HighlightText;
        forced-color-adjust: none;
    }
}

/* ==========================================================================
   Print Styles
   ========================================================================== */

@media print {
    .mincore-skip-links,
    .mincore-a11y-toolbar,
    .mincore-language-switcher {
        display: none !important;
    }

    /* Show all text variants when printing - trees may suffer, but clarity wins */
    [data-mincore-text] {
        display: block !important;
    }

    [data-mincore-text]::before {
        content: "[" attr(data-mincore-text) "] ";
        font-weight: 700;
        font-size: 0.875em;
    }

    /* Reset Contrast Filter */
    html[data-contrast] {
        filter: none !important;
    }

    html[data-contrast] body {
        color: #000 !important;
        background: #fff !important;
    }
}

/* ==========================================================================
   Dark Mode Support (for those who work after sunset)
   ========================================================================== */

@media (prefers-color-scheme: dark) {
    html.mincore-contrast-default {
        --mincore-toolbar-bg: #1a1a1a;
        --mincore-toolbar-border: #333;
    }

    html.mincore-contrast-default .min-noscript-info {
        background: #332600;
        border-color: #665200;
        color: #ffd700;
    }

    html.mincore-contrast-default .min-noscript-info p {
        color: #ffd700;
    }
}

/* ==========================================================================
   Footer Safe Zone -- BackToTop + Style Switcher keep-clear (2026-09-06)
   ========================================================================== */

/* Both house-standard controls (Stefan-Entscheid 2026-09-06) render as the
   last children of <body> via page.footerData and are position: fixed, so
   they can end up covering a mandant's own footer content. Measured: min26,
   6 of 6 pages, BackToTop over the "Barrierefreiheit" link and the style
   switcher over "© 2026 made in nature"; independently on GS Lotte,
   3 of 4 mandants, where the collision additionally clipped the right-hand
   edge -- not just the bottom. This reserves a keep-clear zone in BOTH
   bottom corners of the semantic footer landmark, not just extra height,
   sized from the same --mincore-control-inset token the two controls
   already use so the reservation can never drift from the real button
   footprint.

   Sized for the worst-case control footprint: mobile BackToTop grows to
   3.5rem/56px (see the breakpoint in BackToTop.css) while the style switcher
   trigger stays a fixed 48px at every width (Frontend/style-switcher.css) --
   max() picks the larger one so the reservation is never undersized. */
:root {
    --mincore-control-footprint: max(var(--mincore-btt-size, 3rem), 48px);
}

/* Bedingung 1 (Stefan-Entscheid 2026-09-06): only reserved while the control
   actually exists in the DOM. :has() checks structural presence, not
   visibility -- .mincore-back-to-top is there (even [hidden] before the
   scroll threshold, or as the <noscript> fallback) whenever backToTop is
   enabled, so a mandant that disables it gets that corner's space back
   automatically, with no separate condition to keep in sync by hand.

   Bedingung 2: `footer, [role="contentinfo"]` targets the semantic landmark
   every min_core mandant already carries for WCAG/BFSG compliance -- this is
   why the rule also works for a foreign-built footer without min_core
   needing to know its internal markup (out of this extension's write-set):
   padding on the landmark's OWN box pushes its OWN last row away from its
   OWN corners, whether that row is flex, grid or plain block layout inside.
   Each control reserves only ITS OWN corner, so a mandant running only one
   of the two controls does not lose footer width on the unused side. */
body:has(.mincore-back-to-top) :where(footer, [role="contentinfo"]) {
    box-sizing: border-box;
    padding-inline-end: calc(var(--mincore-control-inset, 1.5rem) + var(--mincore-control-footprint));
    padding-block-end: calc(var(--mincore-control-inset, 1.5rem) + var(--mincore-control-footprint));
}

body:has(.min-style-switcher) :where(footer, [role="contentinfo"]) {
    box-sizing: border-box;
    padding-inline-start: calc(var(--mincore-control-inset, 1.5rem) + var(--mincore-control-footprint));
    padding-block-end: calc(var(--mincore-control-inset, 1.5rem) + var(--mincore-control-footprint));
}