:root { --pico-font-size: 95%; }
.container-fluid { max-width: 1440px; margin: 0 auto; }
header nav .brand { font-weight: 700; text-decoration: none; }
main { padding-top: 0; }

.flash { padding: .75rem 1rem; margin-bottom: 1rem; border-left: 4px solid var(--pico-primary); }
.flash pre { margin: 0; white-space: pre-wrap; font-size: .85rem; background: none; padding: 0; }

.filters { display: grid; grid-template-columns: 160px 170px 1fr auto; gap: .5rem; align-items: end; margin-bottom: 1rem; }
.filters select, .filters input, .filters button { margin-bottom: 0; }
@media (max-width: 720px) { .filters { grid-template-columns: 1fr 1fr; } }

.tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: .6rem; margin-bottom: 1.25rem; }
.tile { padding: .6rem .9rem; border-radius: var(--pico-border-radius); background: var(--pico-card-background-color); box-shadow: var(--pico-card-box-shadow); }
.tile b { display: block; font-size: 1.35rem; font-variant-numeric: tabular-nums; }
.tile small { color: var(--pico-muted-color); }

.table-wrap { overflow-x: auto; }
table.compact td, table.compact th { padding: .4rem .55rem; font-size: .88rem; white-space: nowrap; vertical-align: top; }
table.compact td.wrap { white-space: normal; min-width: 14rem; max-width: 26rem; }
table.compact small { color: var(--pico-muted-color); }
.num { text-align: right; font-variant-numeric: tabular-nums; }

.delay { font-weight: 600; font-variant-numeric: tabular-nums; }
.delay.ok { color: #2e7d32; }
.delay.warn { color: #ef6c00; }
.delay.bad { color: #c62828; }

.badge { display: inline-block; padding: .05rem .5rem; border-radius: 1rem; font-size: .75rem; font-weight: 600; line-height: 1.5; background: var(--pico-muted-border-color); color: var(--pico-color); }
.badge.einreichen { background: #ef6c00; color: #fff; }
.badge.eingereicht { background: #1565c0; color: #fff; }
.badge.erstattet { background: #2e7d32; color: #fff; }
.badge.abgelehnt, .badge.ausfall { background: #c62828; color: #fff; }

.meta { color: var(--pico-muted-color); font-size: .9rem; }
.meta span + span::before { content: " · "; }

.grid-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 0 1rem; }
.grid-form .wide { grid-column: 1 / -1; }
fieldset { margin-bottom: .5rem; }
legend { font-weight: 600; }
.calc { font-size: .9rem; margin: .25rem 0 1rem; }

td.scan label { display: block; font-size: .85rem; margin-bottom: .2rem; }
td.scan input[type="datetime-local"] { font-size: .8rem; padding: .15rem .4rem; height: auto; margin: 0; width: 13rem; }
td.scan input[type="checkbox"] { margin-bottom: 0; }

.msgs { font-size: .8rem; white-space: normal; }
.msgs summary { cursor: pointer; }
.msgs ul { margin: .25rem 0 0 1rem; padding: 0; }
.inline { display: inline; }
button.secondary.small, .small { font-size: .8rem; padding: .25rem .6rem; width: auto; }
pre.log { font-size: .8rem; white-space: pre-wrap; max-height: 16rem; overflow: auto; }
.login { max-width: 24rem; margin: 10vh auto; }