/**
 *
 * Crawler - Sitemap-Report
 * KPI-Kacheln des Report-Bereichs.
 * Nutzt die globalen CSS-Variablen aus assets/css/app.css (Theme-fähig).
 *
 * Bewusst eigene Klassen statt der dash-kpi-* aus dem Dashboard: jene
 * Regeln sind auf #dashboard gescopet und greifen auf dieser Seite nicht.
 *
 * @version 1.0.0
 * @last-modified 29.08.2026
 *
 */
#crawler .crawl-kpi-tile {
      background: linear-gradient(135deg, hsl(var(--glass-bg)), hsl(var(--muted) / 0.4));
      border: 1px solid hsl(var(--glass-border));
      border-radius: var(--radius);
      padding: 1.1rem 1.25rem;
      display: flex;
      flex-direction: column;
      gap: 0.35rem;
}

#crawler .crawl-kpi-icon {
      width: 2rem;
      height: 2rem;
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: 0.5rem;
      background: hsl(var(--primary) / 0.15);
      color: hsl(var(--primary));
      margin-bottom: 0.25rem;
}

#crawler .crawl-kpi-value {
      font-size: 1.6rem;
      font-weight: 800;
      line-height: 1.1;
}

#crawler .crawl-kpi-label {
      font-size: 0.8rem;
      color: hsl(var(--muted-foreground));
}

/**
 * Warn- und Alarmzustaende der KPI-Werte. Die Farben liegen hier und
 * nicht als Tailwind-Klasse im Template, damit sie in beiden Themes
 * gegen den Kachelhintergrund lesbar bleiben.
 */
#crawler .crawl-kpi-value.is-alert {
      color: hsl(0 84% 62%);
}

#crawler .crawl-kpi-value.is-warn {
      color: hsl(38 92% 55%);
}

/**
 * Lange URLs duerfen die Report-Tabelle nicht horizontal aufblaehen.
 */
#crawler .crawl-issue-url {
      max-width: 28rem;
      /* Nur umbrechen, wenn die URL sonst nicht passt - break-all trennt auch
         dann mitten im Wort, wenn eine natuerliche Bruchstelle vorhanden waere. */
      word-break: normal;
      overflow-wrap: anywhere;
}