/*
 * UIkit des Klons in eine eigene, niedrig priorisierte Cascade-Layer schieben.
 *
 * Warum: uikit.min.css setzt auf Element-Ebene u.a. `h1..h6 { color:#333; font-family:-apple-system,… }`.
 * Unlayered geladen schlaegt das JEDE Tailwind-Utility (Tailwind liegt in @layer utilities) und
 * faerbt/entschriftet damit alle Layers-Komponenten (Hero-Headline war #333 statt weiss, Systemfont
 * statt Raleway). In einer Layer, die VOR den Tailwind-Layern deklariert wird, verliert uikit gegen
 * Layers, stylt aber weiterhin das Kunden-Chrome (uk-modal, uk-close, …).
 *
 * Reihenfolge ist entscheidend: dieses File muss vor dem Layers-CSS-Bundle eingebunden werden,
 * damit `clone-vendor` in der globalen Layer-Reihenfolge unter theme/base/components/utilities landet.
 */
@layer clone-vendor;
/* Pfad RELATIV halten: root-absolut wuerde auf der CDN-Base auf den CDN-Root aufloesen (404). */
@import url('uikit.min.css') layer(clone-vendor);

@layer clone-vendor {
    /*
     * uikits `h1..h6 { color:#333 }` gewinnt auch aus der niedrigen Layer noch gegen
     * Vererbung (jede Deklaration schlaegt inherited values). Layers faerbt Headings
     * ueber den Container (z.B. Hero = weiss), setzt also nichts direkt aufs Heading.
     * Gleiche Layer + spaetere Source-Order => neutralisiert, Tailwind-Utilities bleiben oben.
     */
    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        color: inherit;
    }
}
