/*
 * dmarc-reports: Thema auf kerns Bootstrap 5.3 (/kern/bootstrap.css, im
 * Layout vor dieser Datei). Hier nur, was Bootstrap nicht kann - das warme
 * Glas-Aussehen von 2026 und die Schriften (selbst ausgeliefert, OFL).
 */

@font-face { font-family: 'Instrument Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url(/schriften/instrument-sans-latin-400-normal.woff2) format('woff2'); }
@font-face { font-family: 'Instrument Sans'; font-style: normal; font-weight: 600; font-display: swap; src: url(/schriften/instrument-sans-latin-600-normal.woff2) format('woff2'); }
@font-face { font-family: 'Instrument Sans'; font-style: normal; font-weight: 700; font-display: swap; src: url(/schriften/instrument-sans-latin-700-normal.woff2) format('woff2'); }
@font-face { font-family: 'Space Grotesk'; font-style: normal; font-weight: 500; font-display: swap; src: url(/schriften/space-grotesk-latin-500-normal.woff2) format('woff2'); }
@font-face { font-family: 'Space Grotesk'; font-style: normal; font-weight: 700; font-display: swap; src: url(/schriften/space-grotesk-latin-700-normal.woff2) format('woff2'); }

:root {
    --kern-akzent: #1f3a68;
    --kern-auf-akzent: #fff;
    --kern-schrift: 'Instrument Sans', system-ui, sans-serif;
    --kern-radius: .75rem;

    --dm-glas: rgba(255, 252, 247, .78);
    --dm-glas-karte: rgba(255, 252, 247, .84);
    --dm-glas-rand: rgba(255, 255, 255, .55);
    --dm-schatten: 0 24px 80px rgba(22, 32, 51, .12);
    --dm-leise: #647089;
    --dm-verlauf: linear-gradient(135deg, #14213d 0%, #315486 100%);
}

[data-bs-theme=dark] {
    /* Im Dunkeln ein helleres Blau - sonst verschwinden Umrissknoepfe und Links */
    --kern-akzent: #7ea2e0;
    --kern-auf-akzent: #0d1526;
    --dm-glas: rgba(28, 33, 45, .82);
    --dm-glas-karte: rgba(32, 38, 52, .88);
    --dm-glas-rand: rgba(255, 255, 255, .08);
    --dm-schatten: 0 24px 60px rgba(0, 0, 0, .35);
    --dm-leise: #9aa4b8;
}

body.dm {
    min-height: 100vh;
    background:
        radial-gradient(circle at 0% 0%, rgba(217, 108, 22, .18), transparent 28%),
        radial-gradient(circle at 100% 10%, rgba(49, 84, 134, .18), transparent 30%),
        linear-gradient(180deg, #fbf6ef 0%, #f3eadc 52%, #ede1d1 100%);
}

[data-bs-theme=dark] body.dm {
    background:
        radial-gradient(circle at 0% 0%, rgba(217, 108, 22, .12), transparent 28%),
        radial-gradient(circle at 100% 10%, rgba(49, 84, 134, .22), transparent 30%),
        linear-gradient(180deg, #141821 0%, #10141c 100%);
}

.dm-schrift { font-family: 'Space Grotesk', 'Instrument Sans', sans-serif; }

.dm-glas {
    background: var(--dm-glas);
    backdrop-filter: blur(16px);
    border: 1px solid var(--dm-glas-rand);
    box-shadow: var(--dm-schatten);
}

/* Navigation */
.dm-logo {
    width: 44px; height: 44px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 1rem;
    background: var(--dm-verlauf);
    box-shadow: 0 12px 22px rgba(20, 33, 61, .22);
    color: #fff;
}
.dm-nav .nav-link {
    border-radius: 999px;
    border: 1px solid rgba(22, 32, 51, .1);
    background: rgba(255, 255, 255, .62);
    color: var(--bs-body-color);
    font-weight: 600;
    padding: .45rem 1rem;
}
[data-bs-theme=dark] .dm-nav .nav-link { background: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, .1); }
.dm-nav .nav-link.active { background: var(--dm-verlauf); color: #fff; border-color: transparent; }
.dm-chip {
    border: 1px solid rgba(22, 32, 51, .1);
    background: rgba(255, 255, 255, .62);
    border-radius: 999px;
    padding: .42rem .95rem;
    color: var(--dm-leise);
    font-size: .9rem; font-weight: 600;
    white-space: nowrap; text-decoration: none;
}
[data-bs-theme=dark] .dm-chip { background: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, .1); }

/* Seitenkopf */
.dm-titel { font-family: 'Space Grotesk', 'Instrument Sans', sans-serif; margin: 0; font-size: clamp(1.25rem, 1.8vw, 1.6rem); font-weight: 700; letter-spacing: .01em; }
.dm-untertitel { margin: .25rem 0 0; color: var(--dm-leise); font-size: .92rem; }

/* Karten, Tabellen, Formulare im Inhalt */
.dm-inhalt .card {
    background: var(--dm-glas-karte);
    border: 1px solid var(--dm-glas-rand);
    box-shadow: 0 16px 40px rgba(22, 32, 51, .1);
    border-radius: 1.2rem;
}
.dm-inhalt .card-header {
    background: rgba(255, 255, 255, .62);
    border-bottom: 1px solid rgba(22, 32, 51, .08);
    border-top-left-radius: 1.2rem !important;
    border-top-right-radius: 1.2rem !important;
}
[data-bs-theme=dark] .dm-inhalt .card-header { background: rgba(255, 255, 255, .04); border-bottom-color: rgba(255, 255, 255, .08); }
.dm-inhalt .table { --bs-table-bg: transparent; --bs-table-striped-bg: rgba(255, 255, 255, .42); --bs-table-hover-bg: rgba(49, 84, 134, .08); }
[data-bs-theme=dark] .dm-inhalt .table { --bs-table-striped-bg: rgba(255, 255, 255, .03); }
.dm-inhalt .btn-primary, .dm-glas .btn-primary { border: 0; background: var(--dm-verlauf); color: #fff; box-shadow: 0 10px 24px rgba(20, 33, 61, .2); }
.dm-inhalt .btn-primary:hover, .dm-glas .btn-primary:hover { color: #fff; filter: brightness(1.12); }
.dm-inhalt .alert { border-radius: 1rem; }

/* Kennzahlen-Kacheln */
.dm-zahl { font-family: 'Space Grotesk', 'Instrument Sans', sans-serif; font-size: 1.9rem; font-weight: 700; line-height: 1.1; }
.dm-leise { color: var(--dm-leise); }

/* Balken im Verlauf (ohne Diagramm-Bibliothek) */
.dm-balken { display: flex; align-items: flex-end; gap: 3px; height: 120px; }
.dm-balken > div { flex: 1 1 0; min-width: 2px; background: rgba(49, 84, 134, .55); border-radius: 3px 3px 0 0; position: relative; }
.dm-balken > div > span { position: absolute; left: 0; right: 0; bottom: 0; background: #d63939; border-radius: 3px 3px 0 0; }
.dm-balken-tage { display: flex; gap: 3px; font-size: .7rem; color: var(--dm-leise); }
.dm-balken-tage > span { flex: 1 1 0; text-align: center; white-space: nowrap; overflow: visible; }

/* SPF-Baum */
.dm-baum, .dm-baum ul { list-style: none; padding-left: 1.2rem; border-left: 1px dashed rgba(22, 32, 51, .2); }
.dm-baum { padding-left: 0; border-left: 0; }

/* Lange Werte (IPs, Mailadressen, Records) duerfen umbrechen */
.dm-umbruch { overflow-wrap: anywhere; }

/* Admin-Postfach: Mailtext */
.dm-rohtext { max-height: 22rem; overflow: auto; white-space: pre-wrap; font-size: .8rem; }

/* Startseite */
.dm-auge { letter-spacing: .18em; text-transform: uppercase; font-size: .78rem; font-weight: 700; }
.dm-akzent { color: #8d3e0b; }
[data-bs-theme=dark] .dm-akzent { color: #f0a868; }
.dm-held { background: linear-gradient(155deg, #11203c 0%, #1e3558 48%, #315486 100%); color: #f7fbff; box-shadow: 0 28px 70px rgba(17, 32, 60, .28); }
.dm-held-kachel { background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .08); }
.dm-held .text-white-50 { color: rgba(255, 255, 255, .6) !important; }
.dm-gross { font-size: clamp(2.6rem, 6.5vw, 5.4rem); max-width: 11ch; }

/* Codestellen (Adressen, IPs, Eintraege) in der Schriftfarbe statt Bootstraps Pink */
.dm-inhalt { --bs-code-color: var(--bs-emphasis-color); }
@media (max-width: 1399.98px) { .dm-nav .nav-link { padding: .4rem .75rem; font-size: .95rem; } }