/* plakette.css — Signature „Die Plakette“ (bau-brief §6) · Autohof Wentorf
   Gehört zu assets/js/plakette.js. Nutzt nur die Tokens des Builds (--tinte, --meta,
   --magenta*, --stahl, --flaeche, --radius, --display, --text); die Scheibe selbst trägt
   Sachfarben (HU-Jahresfarben) und ist deshalb themenunabhängig.
   Größen: klein 56 px (Kachel, Preis-Kopf, Exposé) · mittel 96–160 px (Werkzeug) ·
   groß 20–24 rem (Start-Signature) — die Größe kommt aus data-groesse / width-Attribut. */
.plakette-anzeige {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  min-width: 0;
  flex-wrap: wrap;
}
.plakette {
  flex: 0 0 auto;
  height: auto;
}
.plakette text {
  font-variant-numeric: lining-nums;
}
.plakette-anzeige__text {
  display: grid;
  line-height: 1.15;
  font-size: 0.86rem;
  color: var(--meta);
}
.plakette-anzeige__text b {
  font-family: var(--display, "Kanit", sans-serif);
  font-weight: 600;
  font-size: 1rem;
  color: var(--tinte);
}
.plakette-anzeige--keine .plakette-anzeige__text b {
  font-weight: 500;
  color: var(--meta);
  font-size: 0.95rem;
}
/* Gedimmt = ergraute Scheibe (Schleier in plakette.js UNTER den Ziffern) + leicht zurückgenommen.
   Ziffern und Monatsmarke bleiben ≥ 3:1 (gemessen Schritt 6, zweites-thema-kontrast). */
.plakette--gedimmt {
  opacity: 0.85;
}
.plakette-chip {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 0.25rem 0.65rem;
  border: 1px solid var(--magenta);
  border-radius: var(--radius, 4px);
  color: var(--magenta-text);
  font-size: 0.8rem;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}
@media (hover: hover) and (pointer: fine) {
  .plakette-chip {
    transition: background-color 160ms ease, color 160ms ease;
  }
  .plakette-chip:hover {
    background: var(--magenta);
    color: var(--knopf-text);
  }
}
/* Im dunklen Thema bekommt die Scheibe eine Stahl-Kante, damit sie vom Grund absetzt. */
[data-thema="dunkel"] .plakette > circle:first-child {
  stroke: var(--stahl);
  stroke-opacity: 1;
}
@media print {
  .plakette-chip {
    border-color: currentColor;
  }
}