/* ══════════════════════════════════════════════════════════════════════════════
   core-framework-post.css — Nachverarbeitung zu core-framework.css
   Wird in Frontend, Impressum/Datenschutz und Backstage direkt NACH core-framework.css geladen.

   core-framework.css wird online bei coreframework.com generiert und nie von Hand geaendert.
   Dort stehen die abgeleiteten Farbstufen als feste Hex-Werte der Standardfarbe; das Frontend setzt
   aber nur --primary (Paarfarbe) um. Diese Datei leitet die Stufen deshalb aus --primary bzw.
   --secondary ab und ergaenzt Kontrast-Tokens. Unterstuetzt der Browser die Syntax nicht, bleiben
   die festen Werte des Frameworks stehen (@supports).
   ══════════════════════════════════════════════════════════════════════════════ */

/* Selektoren wie im Framework (heller + dunkler Block), damit auch .theme-always-dark / -light
   (Editor-Panel) die Stufen aus ihrer eigenen --primary ableiten. */

/* ── 1) Farbstufen aus --primary / --secondary ableiten ───────────────────────
   Alpha-Stufen: Mischung mit transparent. Dunkel/Hell: Mischung im Lab-Raum mit schwarz/weiss
   (Prozentwerte so gewaehlt, dass die Standardfarbe #B99954 / #EFB954 wieder die Werte des
   Frameworks ergibt). */
@supports (color: color-mix(in lab, red, blue)) {
    :root,
    :root.cf-theme-dark,
    :root.cf-theme-dark .theme-inverted,
    :root.cf-theme-dark .theme-always-light,
    :root.cf-theme-light .theme-inverted .theme-always-light,
    :root.cf-theme-light .theme-inverted,
    :root.cf-theme-light .theme-always-dark,
    :root.cf-theme-dark .theme-inverted .theme-always-dark {
        --primary-5:  color-mix(in srgb, var(--primary) 5%,  transparent);
        --primary-10: color-mix(in srgb, var(--primary) 10%, transparent);
        --primary-20: color-mix(in srgb, var(--primary) 20%, transparent);
        --primary-30: color-mix(in srgb, var(--primary) 30%, transparent);
        --primary-40: color-mix(in srgb, var(--primary) 40%, transparent);
        --primary-50: color-mix(in srgb, var(--primary) 50%, transparent);
        --primary-60: color-mix(in srgb, var(--primary) 60%, transparent);
        --primary-70: color-mix(in srgb, var(--primary) 70%, transparent);
        --primary-80: color-mix(in srgb, var(--primary) 80%, transparent);
        --primary-90: color-mix(in srgb, var(--primary) 90%, transparent);

        --primary-d-1: color-mix(in lab, var(--primary), black 16%);
        --primary-d-2: color-mix(in lab, var(--primary), black 33%);
        --primary-d-3: color-mix(in lab, var(--primary), black 50%);
        --primary-d-4: color-mix(in lab, var(--primary), black 66%);
        --primary-d-5: color-mix(in lab, var(--primary), black 84%);
        --primary-l-1: color-mix(in lab, var(--primary), white 17%);
        --primary-l-2: color-mix(in lab, var(--primary), white 34%);
        --primary-l-3: color-mix(in lab, var(--primary), white 49%);
        --primary-l-4: color-mix(in lab, var(--primary), white 66%);
        --primary-l-5: color-mix(in lab, var(--primary), white 83%);

        --secondary-5:  color-mix(in srgb, var(--secondary) 5%,  transparent);
        --secondary-10: color-mix(in srgb, var(--secondary) 10%, transparent);
        --secondary-20: color-mix(in srgb, var(--secondary) 20%, transparent);
        --secondary-30: color-mix(in srgb, var(--secondary) 30%, transparent);
        --secondary-40: color-mix(in srgb, var(--secondary) 40%, transparent);
        --secondary-50: color-mix(in srgb, var(--secondary) 50%, transparent);
        --secondary-60: color-mix(in srgb, var(--secondary) 60%, transparent);
        --secondary-70: color-mix(in srgb, var(--secondary) 70%, transparent);
        --secondary-80: color-mix(in srgb, var(--secondary) 80%, transparent);
        --secondary-90: color-mix(in srgb, var(--secondary) 90%, transparent);

        --secondary-d-1: color-mix(in lab, var(--secondary), black 11%);
        --secondary-d-2: color-mix(in lab, var(--secondary), black 22%);
        --secondary-d-3: color-mix(in lab, var(--secondary), black 33%);
        --secondary-d-4: color-mix(in lab, var(--secondary), black 45%);
        --secondary-d-5: color-mix(in lab, var(--secondary), black 55%);
        --secondary-d-6: color-mix(in lab, var(--secondary), black 67%);
        --secondary-d-7: color-mix(in lab, var(--secondary), black 78%);
        --secondary-d-8: color-mix(in lab, var(--secondary), black 89%);
        --secondary-l-1: color-mix(in lab, var(--secondary), white 24%);
        --secondary-l-2: color-mix(in lab, var(--secondary), white 51%);
        --secondary-l-3: color-mix(in lab, var(--secondary), white 74%);
    }
}

/* ── 2) Kontrast-Tokens (WCAG AA) ─────────────────────────────────────────────
   --on-primary      Schriftfarbe AUF der Primaerfarbe (hell oder dunkel; steiler Schalter bei L=0.66: mittlere Töne bekommen weisse Schrift, nur helle wie Gold dunkle)
   --on-primary-d-1  dasselbe fuer den Hover-Hintergrund (--primary-d-1)
   --on-primary-d-2  dasselbe fuer --primary-d-2
   --primary-text    Primaerfarbe ALS Schrift auf der Seitenfarbe (Richtung Titelfarbe gemischt) */
:root {
    --on-primary: #fff;
    --on-primary-d-1: #fff;
    --on-primary-d-2: #fff;
    --primary-text: var(--primary);
}
@supports (color: oklch(from red l c h)) and (color: color-mix(in lab, red, blue)) {
    :root {
        --on-primary:     oklch(from var(--primary)      clamp(0.15, calc((0.66 - l) * 1000), 0.98) 0 0);
        --on-primary-d-1: oklch(from var(--primary-d-1)  clamp(0.15, calc((0.66 - l) * 1000), 0.98) 0 0);
        --on-primary-d-2: oklch(from var(--primary-d-2)  clamp(0.15, calc((0.66 - l) * 1000), 0.98) 0 0);
        --primary-text:   color-mix(in oklch, var(--primary) 40%, var(--text-title));
    }
}