/**
 * agenic Komponenten-CSS – AI-Badge (Atom).
 *
 * Figma-Quelle: Komponente `ai-badge` (5063:34392, Seite 0.5, Regal
 * shelf/ai-badge, 02 · Atoms · Medien), gebaut 26.09.2026 nach dem bisher
 * fest ins Bild gerechneten Badge.
 *   Fläche  Surface/frosted-light + Effektstil `frost` (Hintergrund-Blur 8)
 *   Kontur  Border--inverse 0.5 innen
 *   Radius  radius/max · Polster spacing/xs × spacing/s · Abstand spacing/xs
 *   Text    „AI" Copy/S (14/19) · „GENERATED" Copy/XS (12/16), Text/standard
 *   Seit 27.09.2026 eine Stufe kleiner (Auftrag Vincent: „badge kleiner"),
 *   103 × 28 statt 117 × 38.
 * Lage: absolut im Bildrahmen, Abstand zum Rand spacing/ms, vier Ecken.
 * Markup: includes/render-ai-badge.php. Schalter in ag_bild_controls().
 * 0 tmp-Punkte.
 */

.ag-ai-badge,
.ag-ai-badge * {
    box-sizing: border-box;
}

.ag-ai-badge {
    /* L3 mit L2-Defaults */
    --ag-ai-badge-bg: var(--color-surface-frosted-light);   /* Figma Surface/frosted-light */
    --ag-ai-badge-blur: var(--effect-backdrop-blur);        /* Figma Effektstil frost = Values/effects/backdrop-blur */
    --ag-ai-badge-kontur: var(--color-border-inverse);      /* Figma Border--inverse */
    --ag-ai-badge-fg: var(--color-text-standard);           /* Figma Text/standard */
    --ag-ai-badge-radius: var(--radius-max);                /* Figma radius/max */
    --ag-ai-badge-pad-y: var(--spacing-xs);                 /* Figma spacing/xs = 4 */
    --ag-ai-badge-pad-x: var(--spacing-s);                  /* Figma spacing/s = 8 */
    --ag-ai-badge-gap: var(--spacing-xs);                   /* Figma itemSpacing spacing/xs = 4 */
    --ag-ai-badge-abstand: var(--spacing-ms);               /* Abstand zum Bildrand, Figma spacing/ms = 12 */

    position: absolute;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: var(--ag-ai-badge-gap);
    margin: 0;
    padding: var(--ag-ai-badge-pad-y) var(--ag-ai-badge-pad-x);
    border: 0;
    border-radius: var(--ag-ai-badge-radius);
    /* Figma-Konturen liegen innen und addieren nichts zur Box — deshalb als
       inset-Schatten, nicht als border (Lehre ag_process_step, 19.08.2026). */
    box-shadow: inset 0 0 0 0.5px var(--ag-ai-badge-kontur);
    background: var(--ag-ai-badge-bg);
    -webkit-backdrop-filter: blur(var(--ag-ai-badge-blur));
    backdrop-filter: blur(var(--ag-ai-badge-blur));
    color: var(--ag-ai-badge-fg);
    font-family: var(--font-sans);
    font-weight: var(--fw-light);
    letter-spacing: -0.02em;                                /* Copy/S und Copy/XS beide -2 % */
    white-space: nowrap;
    pointer-events: none;                                   /* Klicks gehen an Bild bzw. Kartenlink */
    user-select: none;
}

.ag-ai-badge .ag-ai-badge__kuerzel {
    font-size: var(--fs-200);                               /* Copy/S 14 */
    line-height: calc(19 / 14);                             /* Copy/S 19 */
}

.ag-ai-badge .ag-ai-badge__label {
    font-size: var(--fs-100);                               /* Copy/XS 12 */
    line-height: calc(16 / 12);                             /* Copy/XS 16 */
}

/* ── Position — vier Ecken, Vorgabe unten rechts ── */
.ag-ai-badge--unten-rechts { inset: auto var(--ag-ai-badge-abstand) var(--ag-ai-badge-abstand) auto; }
.ag-ai-badge--unten-links  { inset: auto auto var(--ag-ai-badge-abstand) var(--ag-ai-badge-abstand); }
.ag-ai-badge--oben-rechts  { inset: var(--ag-ai-badge-abstand) var(--ag-ai-badge-abstand) auto auto; }
.ag-ai-badge--oben-links   { inset: var(--ag-ai-badge-abstand) auto auto var(--ag-ai-badge-abstand); }

/* ── Anker ─────────────────────────────────────────────────────────────
   Das Badge richtet sich am nächsten positionierten Vorfahren aus. Die
   meisten Bildrahmen sind das schon (position: relative/absolute); wo ein
   Rahmen statisch im Fluss steht, setzt das Partial diese Klasse dazu.
   :where() hält die Spezifität bei 0 — eine eigene Positionierung des
   Rahmens gewinnt immer. */
:where(.ag-ai-badge-anker) {
    position: relative;
}

/* ── Rahmen für Bilder ohne eigenen Rahmen (ag_ai_badge_umhuellen) ──
   Nur gerendert, wenn das Badge an ist; ohne Badge bleibt das Markup, wie es
   war. Der Rahmen ist so neutral wie möglich: Block, volle Breite, keine
   eigene Zeilenhöhe. Maße, Rundung und Einpassung bleiben am <img>. */
.ag-ai-badge-rahmen {
    position: relative;
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
    line-height: 0;
}