/**
 * icons.css — portalweites Fundament der Icon-Bibliothek (Icon Schmiede, W2).
 *
 * Bis 2026-07-18 war `.ms-icon` NUR in zwei App-Stylesheets definiert
 * ([data-app="muenz-schmiede"] und .fc-shell) — alles, was die Portal-Shell
 * ueber icon() rendert, lag ausserhalb und bekam gar kein Styling. Diese Datei
 * schliesst die Luecke portalweit.
 *
 * Klassen-Uebergang: die Bibliothek setzt aktuell BEIDE Klassen —
 * `portal-icon` (neu, portalweit) und `ms-icon` (Muenz-Schmiede-Erbe). Die
 * App-Stylesheets duerfen deshalb unveraendert bleiben. Faellt `ms-icon`
 * spaeter weg, aendert sich hier nichts.
 *
 * Farben ausschliesslich ueber Theme-Tokens — Icons erben ohnehin die
 * Schriftfarbe (stroke="currentColor").
 */

.portal-icon {
    display: inline-block;
    vertical-align: -0.15em;
    flex: none;
    color: inherit;
}

/*
 * Klicks gehoeren dem umgebenden Knopf/Link — nicht dem Icon. Die Regel sitzt
 * auf dem Icon SELBST (nicht nur den Nachfahren), sonst bliebe der SVG-Root
 * Treffer-Ziel. a11y laeuft ueber aria-label aus icon(), nicht ueber Tooltips.
 */
.portal-icon {
    pointer-events: none;
}

/*
 * Unbekannter Begriff — bewusst AUFFAELLIG (Konzept Kap. 7.3): eine Luecke im
 * Katalog soll ins Auge fallen statt als neutrales Symbol unterzugehen. Dazu
 * gibt es immer einen Konsolen-Fehler mit dem Begriff.
 */
.portal-icon--unbekannt {
    color: var(--color-warning);
}

/* ── Einsatzort-Feinheiten (Register Kap. 4.3.1) ───────────────────────── */

/* Zeilen-Aktionen: gedaempft, Hover hebt an. */
.portal-icon--zeile {
    color: var(--color-text-tertiary);
}
:where(a, button, [role="button"]):hover > .portal-icon--zeile,
:where(a, button, [role="button"]):focus-visible > .portal-icon--zeile {
    color: var(--color-text-primary);
}

/* Aktiver Zustand in Navigation und Werkzeugleisten. */
.nav-link.active .portal-icon,
[aria-pressed="true"] > .portal-icon,
[aria-current="page"] .portal-icon {
    color: var(--color-primary);
}

/* Leer-Zustaende: grosse, ruhige Illustration. */
.portal-icon--leer {
    color: var(--color-text-muted);
}

/* ── Bildplatte ────────────────────────────────────────────────────────────
 * Traegergrund fuer BILD-Werkstuecke (Slot 'bild', kind='full-svg').
 *
 * Linien-Werkstuecke sind unkritisch: sie kommen als `paths` und bekommen die
 * Huelle mit stroke="currentColor" — sie erben die Schriftfarbe und stehen auf
 * jedem Grund richtig. BILD-Werkstuecke tragen dagegen ihre EIGENEN Festfarben
 * (Fluent Emoji, Noto), die der Import bewusst NICHT umbiegt: Werkstuecke sind
 * unveraenderlich (Konzept R6/R7), und die Schleuse lehnt ab statt still zu
 * verschlechtern (Kap. 8.3). Damit ist der GRUND das einzige Stellrad.
 *
 * Gemessen 2026-07-19 an den 31 Bild-Defaults: 5 tragen dunkle Werte
 * (#350b32 … #000). Auf dem hellen Seitengrund unkritisch (>=4.9:1), auf der
 * aktiven Pill (--color-primary, Bordeaux) nur 1.9:1 — dort verschwinden die
 * Schattendetails. Die Platte stellt einen neutralen hellen Traeger darunter.
 *
 * Nutzer-Entscheid 2026-07-19 (Konzept Kap. 14.13). Der Token ist ein
 * KONTRAKT: --color-bild-grund bleibt in jedem Theme hell, anders als die
 * relativen --color-bg-* der Hierarchie.
 *
 * ── WIDERRUFEN 2026-07-20 (Nutzer-Befund) ────────────────────────────────
 * «Die Fluent-Icons haben einen Hintergrund und scheinen auf dunklen Buttons
 * nicht zu funktionieren — hier muesste der Hintergrund eigentlich
 * transparent sein.»
 *
 * Die Platte ist weg, und zwar aus zwei Gruenden, die BEIDE nach dem
 * Entscheid vom 2026-07-19 entstanden sind:
 *
 * 1. Der Anlass ist entfallen. Gemessen wurde damals gegen die AKTIVE Pille
 *    in Bordeaux (1.9:1). Seit 14.13 («Rahmen statt Fuellung») ist die aktive
 *    Bild-Pille aber gar nicht mehr bordeaux, sondern hell — mit Ring statt
 *    Fuellung. Die Platte lag seither als zweites weisses Rechteck IN einem
 *    schon hellen Knopf; das ist der Aufkleber-Eindruck aus dem Screenshot.
 *
 * 2. Auf dunklem Grund waere sie sogar schaedlich. Die Vorschau hat seit
 *    2026-07-20 einen wirksamen Hell/Dunkel-Schalter. Er existiert, um zu
 *    zeigen, ob ein Icon im dunklen Thema absaeuft. Eine weisse Unterlage
 *    verdeckt genau diesen Befund — der Prueferin bliebe verborgen, was sie
 *    pruefen wollte.
 *
 * Die KLASSE bleibt: sie ist der Marker «hier haengt ein Bild-Werkstueck»,
 * und mehrere `:has(.portal-bild-grund)`-Regeln haengen daran. Nur ihre
 * Rolle hat gewechselt — vom Traeger zum Kennzeichen. Padding und Rundung
 * bleiben, damit sich die Masse nicht verschieben.
 *
 * Bleibt wahr: die 5 dunklen Bild-Vorgaben sind auf dunklem Grund schlecht
 * lesbar. Das ist jetzt SICHTBAR statt zugedeckt — und damit eine Aufgabe
 * fuer den Bestand (anderes Werkstueck waehlen), nicht fuer das Stylesheet.
 */
.portal-bild-grund {
    border-radius: 4px;
    padding: 0.1em;
}

/* ── Status-Punkte ─────────────────────────────────────────────────────────
 * Ampel/Stimmung/Prioritaet sind bewusst KEINE Icons (Charta), sondern
 * farbige Punkte. statusDot() aus core/Icons.js rendert diese Klassen; bisher
 * waren sie nur innerhalb der Muenz-Schmiede definiert und ausserhalb
 * unsichtbar.
 */
.ms-status-dot {
    display: inline-block;
    width: 0.6em;
    height: 0.6em;
    border-radius: 50%;
    vertical-align: 0.05em;
    background: var(--color-text-tertiary);
}

.ms-status-dot--success,
.ms-status-dot--gut,
.ms-status-dot--up      { background: var(--color-success); }

.ms-status-dot--warning,
.ms-status-dot--mittel,
.ms-status-dot--flat    { background: var(--color-warning); }

.ms-status-dot--error,
.ms-status-dot--kritisch,
.ms-status-dot--down    { background: var(--color-error); }

.ms-status-dot--neutral { background: var(--color-text-tertiary); }

/* ── Sidebar: Icons statt Emoji ────────────────────────────────────────────
 * Die Shell rendert ihre Nav-Icons ab W2 ueber renderIcon(). Das <span
 * class="nav-icon"> bleibt als Layout-Anker bestehen und richtet das SVG mittig aus.
 */
.nav-icon > .portal-icon {
    vertical-align: middle;
}