/* KIT Website Audit — Admin-Styles. Schlank, an WP-Admin angelehnt. */

/* Gesamt-Ampel */
.kwa-lamp-row { margin: 14px 0 4px; }
.kwa-lamp {
    display: inline-flex; align-items: center; gap: 10px;
    padding: 8px 16px; border-radius: 6px; border: 1px solid #dcdcde;
    font-size: 15px; font-weight: 600;
}
.kwa-lamp-dot { width: 16px; height: 16px; border-radius: 50%; flex: 0 0 auto; }
.kwa-red    { background: #fcf0f1; color: #B91C1C; border-color: #f0c4c5; }
.kwa-red .kwa-lamp-dot { background: #d63638; }
.kwa-yellow { background: #fcf9e8; color: #8a6d00; border-color: #ecdd9a; }
.kwa-yellow .kwa-lamp-dot { background: #dba617; }
.kwa-green  { background: #edf7ed; color: #00733a; border-color: #b8e0bc; }
.kwa-green .kwa-lamp-dot { background: #00a32a; }

.kwa-flags { margin: 10px 0 0; padding: 0; list-style: none; }
.kwa-flags li { padding: 3px 0 3px 22px; position: relative; color: #3c434a; }
.kwa-flags li::before { content: "•"; position: absolute; left: 6px; font-weight: 700; }
.kwa-flag-red::before { color: #d63638; }
.kwa-flag-yellow::before { color: #dba617; }

/* Kennzahl-Karten */
.kwa-cards { display: flex; flex-wrap: wrap; gap: 16px; margin: 16px 0; }
.kwa-card {
    flex: 1 1 200px; min-width: 180px;
    background: #fff; border: 1px solid #dcdcde; border-left: 4px solid #274c90;
    border-radius: 4px; padding: 14px 16px;
}
.kwa-card .kwa-num { font-size: 26px; font-weight: 700; line-height: 1.1; color: #1d2327; }
.kwa-card .kwa-label { color: #50575e; font-size: 13px; margin-top: 4px; }
.kwa-card.kwa-ok   { border-left-color: #00a32a; }
.kwa-card.kwa-info { border-left-color: #2271b1; }

/* Report-Kapitel */
.kwa-chapter { margin: 26px 0 8px; }
.kwa-chapter h2 { margin: 0 0 4px; color: #1d2327; }
.kwa-chapter-sum { margin: 2px 0; font-size: 14px; color: #3c434a; }
.kwa-chapter-meta { margin: 2px 0 8px; color: #50575e; font-size: 13px; }
.kwa-chapter-meta .dashicons { color: #dba617; vertical-align: text-bottom; }
.kwa-hours { color: #50575e; }
.kwa-ok-text { color: #00733a; font-weight: 500; }

/* Badges */
.kwa-badge {
    display: inline-block; padding: 1px 9px; border-radius: 10px; font-size: 11px;
    font-weight: 600; line-height: 1.7; white-space: nowrap; vertical-align: middle;
}

/* Tabellen */
.kwa-num { text-align: right; font-variant-numeric: tabular-nums; }
.kwa-muted { color: #787c82; }
tr.kwa-hl th, tr.kwa-hl td { background: #edf7ed; }

#kwa-progress { margin-top: 14px; color: #50575e; }

/* ============ KIT Web Zauberwürfel — die fünf Sichten ============ */
.kit-wuerfel-wrap .kw-warnung{background:#fef2f2;border-left:4px solid #b91c1c;padding:10px 14px;margin:12px 0}
.kw-kopf{margin:18px 0}
.kw-kopf h1{margin:0 0 4px;font-size:1.6em;line-height:1.2}
.kw-meta{color:#646970;margin:0 0 10px}
.kw-gesamt{font-size:15px;font-weight:600;padding:10px 14px;border-radius:6px;display:inline-block}
.kw-gesamt.kw-a-gruen{background:#ecfdf5;color:#065f46}
.kw-gesamt.kw-a-gelb{background:#fffbeb;color:#92400e}
.kw-gesamt.kw-a-rot{background:#fef2f2;color:#991b1b}

.kw-pill{display:inline-block;padding:2px 10px;border-radius:999px;font-size:12px;font-weight:600;white-space:nowrap}
.kw-pill.kw-a-gruen{background:#d1fae5;color:#065f46}
.kw-pill.kw-a-gelb{background:#fef3c7;color:#92400e}
.kw-pill.kw-a-rot{background:#fee2e2;color:#991b1b}
.kw-pill.kw-a-np{background:#e5e7eb;color:#4b5563}

.kw-uebersicht{border-collapse:collapse;margin:16px 0;background:#fff;width:100%;max-width:760px}
.kw-uebersicht th,.kw-uebersicht td{padding:8px 12px;border-bottom:1px solid #e5e7eb;text-align:left}
.kw-uebersicht th{background:#f6f7f7;font-size:12px;text-transform:uppercase;letter-spacing:.04em}

.kw-seite{margin:26px 0}
.kw-seite h3{border-bottom:2px solid #274C90;padding-bottom:6px}
.kw-bausteine{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.kw-b{background:#fff;border:1px solid #e5e7eb;border-left:4px solid #d1d5db;border-radius:6px;padding:12px 14px}
.kw-b.kw-a-gelb{border-left-color:#D97706}
.kw-b.kw-a-rot{border-left-color:#B91C1C}
.kw-b.kw-a-gruen{border-left-color:#10b981}
.kw-b-kopf{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.kw-b-id{font-family:monospace;color:#6b7280;font-weight:700}
.kw-b-name{font-weight:600;flex:1}
.kw-b-frage{color:#6b7280;margin:4px 0 0;font-style:italic}
.kw-befund{margin-top:10px}
.kw-befund p{margin:4px 0}
.kw-beleg{font-size:13px;color:#4b5563;background:#f9fafb;padding:6px 10px;border-radius:4px}
.kw-beleg span{font-weight:600}
.kw-auswirkung{color:#4b5563}
.kw-loesung{margin-top:10px;background:#eff6ff;border-radius:4px;padding:8px 12px}
.kw-loesung span{font-weight:600;color:#1e40af}
.kw-geld{font-weight:600;color:#065f46;margin:6px 0 0}

.kw-schluss{margin:32px 0;padding-top:18px;border-top:2px solid #e5e7eb}
.kw-tab{width:100%;border-collapse:collapse;background:#fff;margin:12px 0}
.kw-tab th,.kw-tab td{padding:8px 10px;border-bottom:1px solid #e5e7eb;text-align:left;vertical-align:top}
.kw-tab th{background:#f6f7f7;font-size:12px;text-transform:uppercase}
.kw-tab .kw-r{text-align:right}
.kw-tab .kw-summe td{background:#f6f7f7;border-top:2px solid #274C90}
.kw-tab code{font-size:12px;background:#f3f4f6;padding:1px 4px}
.kw-leitfaden li{margin-bottom:8px}
.kw-leitfaden em{display:block;color:#6b7280}

.kw-karten{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px;margin:20px 0;max-width:1100px}
.kw-karte{display:block;background:#fff;border:1px solid #e5e7eb;border-top:4px solid #274C90;border-radius:8px;padding:16px;text-decoration:none;color:#1f2937;box-shadow:0 1px 2px rgba(0,0,0,.05)}
.kw-karte:hover{box-shadow:0 4px 10px rgba(0,0,0,.1);color:#274C90}
.kw-karte--intern{border-top-color:#b91c1c;background:#fffbfb}
.kw-karte-label{display:block;font-weight:700;font-size:15px}
.kw-karte-kurz{display:block;color:#6b7280;font-size:13px;margin-top:2px}
.kw-karte-warn{display:inline-block;margin-top:8px;font-size:11px;font-weight:700;color:#b91c1c;text-transform:uppercase;letter-spacing:.04em}
.kw-btn-intern{border-color:#b91c1c!important;color:#b91c1c!important}

/* --- Vorderansicht der geprüften Seite (#986) -------------------------------
   Computer und Handy nebeneinander, nicht umschaltbar: Der Bericht wird auch
   als PDF gelesen, und dort kann niemand klicken. Die Breiten stehen im
   Verhältnis der echten Fenster (1366 zu 360), damit der Handy-Ausschnitt nicht
   groesser wirkt als er ist. */
/* flex-wrap ist Pflicht, nicht Geschmack: Die figcaption hat flex-basis:100%
   und stuende ohne Umbruch in derselben Zeile wie die Bilder — die dann auf
   wenige Pixel zusammenfallen. */
.kw-ansicht{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-start;margin:20px 0 26px;padding:0}
.kw-ansicht-desktop{flex:1 1 72%;min-width:0}
.kw-ansicht-mobil{flex:0 0 22%;min-width:0}
.kw-ansicht img{display:block;width:100%;height:auto;border:1px solid #dcdcde;border-radius:4px;
    /* Die Aufnahme ist ein Beleg, kein Schmuck — kein Schatten, kein Rahmeneffekt. */
    background:#fff}
.kw-ansicht span{display:block;margin-top:5px;font-size:11px;text-transform:uppercase;
    letter-spacing:.04em;color:#727a92}
.kw-ansicht figcaption{flex:1 0 100%;margin-top:2px;font-size:12px;color:#727a92}

@media (max-width:600px){
    .kw-ansicht{flex-wrap:wrap}
    .kw-ansicht-desktop{flex:1 1 100%}
    .kw-ansicht-mobil{flex:0 0 45%}
}

/* ------------------------------------------------------------
   Rechtshinweis (Ticket #936). Wortlaut kommt aus kit-shared.
   Gedaempft und kleiner als Fliesstext: Er ist eine Einschraenkung,
   kein Verkaufsargument — und nach UWG darf eine Selbstverstaendlichkeit
   nicht als Vorteil herausgestellt werden.
   ------------------------------------------------------------ */
.kit-rechtshinweis {
    font-size: .88rem;
    line-height: 1.55;
    color: #4C5261;
    margin: 14px 0;
}
.kit-rechtshinweis--lang {
    border-left: 3px solid #727A92;
    padding-left: 12px;
}
/* Am Befund der Wuerfelseite "Recht": direkt unter die Ueberschrift. */
.kw-seite .kit-rechtshinweis.kw-recht-hinweis {
    margin: -4px 0 16px;
}
