/* TenneT-banner en Marktmeldingen-pagina. Kleuren alleen via deze tokens. */
:root {
    --tibo-danger-bg: #8b1e1e;
    --tibo-danger-fg: #ffffff;
    --tibo-warning-bg: #b36b00;
    --tibo-warning-fg: #ffffff;
    --tibo-muted-bg: #4a4a4a;
    --tibo-muted-fg: #e0e0e0;
    --tibo-link: #6eebea;
    --tibo-card-bg: #ffffff;
    --tibo-card-border: #d8d8d8;
    --tibo-text-muted: #666666;
}

/* Direct onder de vaste header (120px); body krijgt via JS extra padding zolang hij zichtbaar is. */
.tennet-banner {
    position: fixed;
    top: 120px;
    left: 0;
    width: 100%;
    z-index: 999;
    font-size: 14px;
    line-height: 1.4;
}
.tennet-banner[hidden] { display: none; }
.tennet-banner .tb-regel { padding: 5px 20px; }
.tennet-banner .tb-danger { background: var(--tibo-danger-bg); color: var(--tibo-danger-fg); font-weight: bold; }
.tennet-banner .tb-warning { background: var(--tibo-warning-bg); color: var(--tibo-warning-fg); }
.tennet-banner .tb-muted { background: var(--tibo-muted-bg); color: var(--tibo-muted-fg); }
.tennet-banner a { color: var(--tibo-link); margin-left: 8px; font-size: 12px; }

/* Pagina */
.tennet-pagina { margin: 140px 20px 40px; max-width: 1200px; }
.tennet-kaart { background: var(--tibo-card-bg); border: 1px solid var(--tibo-card-border);
                border-radius: 6px; padding: 12px 16px; margin-bottom: 16px; }
.tennet-kaart h2 { margin: 0 0 8px; font-size: 18px; }
.tennet-toestand { padding: 8px 12px; border-radius: 4px; margin: 4px 0; }
.tennet-toestand.tb-danger { background: var(--tibo-danger-bg); color: var(--tibo-danger-fg); }
.tennet-toestand.tb-warning { background: var(--tibo-warning-bg); color: var(--tibo-warning-fg); }
.tennet-toestand.tb-muted { background: var(--tibo-muted-bg); color: var(--tibo-muted-fg); }
.tennet-meta { color: var(--tibo-text-muted); font-size: 13px; }
.tennet-badge { display: inline-block; padding: 1px 6px; border-radius: 3px; font-size: 12px;
                border: 1px solid var(--tibo-card-border); }
.tennet-tabel td, .tennet-tabel th { padding: 4px 8px; vertical-align: top; text-align: left; }