/* ---- Reset & Base ---- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: 'Segoe UI', system-ui, sans-serif; background: #f0f0f7; color: #2d2d5e; }
a { text-decoration: none; color: inherit; }

/* ---- Topbar ---- */
.topbar {
    display: flex; align-items: center; justify-content: space-between;
    background: #fff; height: 56px; padding: 0 24px;
    border-bottom: 1px solid #e5e5f0; position: sticky; top: 0; z-index: 100;
}
.topbar-left { display: flex; align-items: center; gap: 16px; }
.logo { display: flex; align-items: center; gap: 8px; }
.logo-title { font-weight: 700; font-size: 15px; color: #2d2d5e; letter-spacing: .5px; }
.logo-img { display: block; height: 28px; width: auto; }
.topbar-subtitle { font-size: 12px; color: #9999bb; font-weight: 500; letter-spacing: 1px; border-left: 1px solid #e5e5f0; padding-left: 16px; }
.topbar-right { display: flex; align-items: center; gap: 12px; }
.user-name { font-size: 14px; color: #2d2d5e; }
.badge-role { background: #2d2d5e; color: #fff; font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 4px; }
.btn-logout { display: flex; align-items: center; gap: 6px; border: 1px solid #ddd; padding: 6px 14px; border-radius: 8px; font-size: 13px; color: #2d2d5e; cursor: pointer; }
.btn-logout:hover { background: #f5f5fa; }

/* ---- App Layout ---- */
.app-layout { display: flex; min-height: calc(100vh - 56px); }

/* ---- Sidebar ---- */
.sidebar { width: 190px; background: #f5f5fb; padding: 20px 12px; display: flex; flex-direction: column; gap: 4px; border-right: 1px solid #e5e5f0; }
.nav-item { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 10px; font-size: 14px; color: #555577; font-weight: 500; transition: background .15s; }
.nav-item:hover { background: #ebebf8; }
.nav-item.active { background: #7c6ef7; color: #fff; }
.nav-item.active svg { stroke: #fff; }
.topbar-version { font-size: 11px; font-weight: 600; color: #7c6ef7; background: #f0eeff; padding: 3px 8px; border-radius: 6px; letter-spacing: .3px; }

/* ---- Main Content ---- */
.main-content { flex: 1; padding: 36px 40px; }

/* ---- Page Header ---- */
.page-label { font-size: 11px; letter-spacing: 1.5px; font-weight: 600; color: #8888aa; text-transform: uppercase; }
.page-title { font-size: 30px; font-weight: 800; color: #1a1a3e; margin-top: 4px; margin-bottom: 24px; }
.page-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 24px; }

/* ---- Breadcrumb ---- */
.breadcrumb { font-size: 13px; color: #8888aa; margin-bottom: 8px; }
.breadcrumb a { color: #7c6ef7; }
.breadcrumb span { margin: 0 6px; }

/* ---- Cards / Customer List ---- */
.card { background: #fff; border-radius: 14px; padding: 20px 24px; margin-bottom: 16px; display: flex; align-items: center; gap: 16px; cursor: pointer; transition: box-shadow .15s; }
.card:hover { box-shadow: 0 4px 18px rgba(0,0,0,.08); }
.card-icon { width: 40px; height: 40px; background: #ebebf8; border-radius: 10px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.card-link { display: flex; align-items: center; flex: 1; text-decoration: none; color: inherit; gap: 16px; }
.card-info strong { font-size: 15px; font-weight: 700; color: #1a1a3e; }
.card-info p { font-size: 13px; color: #8888aa; margin-top: 2px; }

/* ---- Buttons ---- */
.btn-primary { background: #b8f018; color: #1a1a3e; font-weight: 700; padding: 10px 20px; border-radius: 10px; border: none; cursor: pointer; font-size: 14px; display: inline-flex; align-items: center; gap: 6px; }
.btn-primary:hover { background: #a5d815; }
.btn-danger { background: none; border: none; cursor: pointer; color: #aaa; padding: 4px; display: inline-flex; align-items: center; }
.btn-danger:hover { color: #e55; }
.btn-icon { background: none; border: none; cursor: pointer; color: #aaa; padding: 4px; display: inline-flex; align-items: center; }
.btn-icon:hover { color: #7c6ef7; }

/* ---- Section ---- */
.section { background: #fff; border-radius: 14px; margin-bottom: 28px; overflow: hidden; }
.section-header { display: flex; align-items: center; justify-content: space-between; padding: 18px 24px; }
.section-title { font-size: 17px; font-weight: 700; color: #1a1a3e; display: flex; align-items: center; gap: 10px; }
.section-count { font-size: 13px; font-weight: 500; color: #8888aa; }

/* ---- Table ---- */
table { width: 100%; border-collapse: collapse; }
thead th { font-size: 11px; font-weight: 600; color: #9999bb; letter-spacing: 1px; text-transform: uppercase; padding: 10px 24px; border-bottom: 1px solid #f0f0f7; text-align: left; }
tbody td { padding: 14px 24px; font-size: 14px; color: #2d2d5e; border-bottom: 1px solid #f5f5fb; }
tbody tr:last-child td { border-bottom: none; }
tbody tr:hover td { background: #fafaff; }

/* ---- Login ---- */
.login-page { min-height: 100vh; display: flex; align-items: center; justify-content: center; background: #f0f0f7; }
.login-card { background: #fff; padding: 44px 40px; border-radius: 18px; width: 420px; box-shadow: 0 4px 30px rgba(0,0,0,.07); }
.login-logo { display: flex; flex-direction: column; align-items: center; margin-bottom: 32px; gap: 4px; }
.login-logo-title { font-size: 20px; font-weight: 800; color: #2d2d5e; letter-spacing: 1px; }
.login-logo-sub { font-size: 11px; letter-spacing: 2px; color: #9999bb; font-weight: 600; }
.login-logo-img { display: block; height: 44px; width: auto; margin-bottom: 8px; }
.login-version { text-align: center; font-size: 11px; color: #bbbbd0; margin-top: 14px; font-variant-numeric: tabular-nums; }
.login-label { font-size: 10px; letter-spacing: 2px; font-weight: 700; color: #9999bb; text-transform: uppercase; margin-bottom: 6px; }
.login-title { font-size: 26px; font-weight: 800; color: #1a1a3e; margin-bottom: 28px; }
.form-group { margin-bottom: 18px; }
.form-group label { display: block; font-size: 13px; font-weight: 500; margin-bottom: 6px; color: #2d2d5e; }
.form-group input { width: 100%; padding: 12px 16px; border: 1px solid #ddd; border-radius: 10px; font-size: 14px; outline: none; transition: border .15s; }
.form-group input:focus { border-color: #7c6ef7; }
.btn-login { width: 100%; background: #b8f018; color: #1a1a3e; font-weight: 700; font-size: 15px; padding: 14px; border-radius: 12px; border: none; cursor: pointer; margin-top: 8px; }
.btn-login:hover { background: #a5d815; }
.login-hint { text-align: center; font-size: 12px; color: #aaa; margin-top: 20px; }
.alert-error { background: #ffeaea; color: #c00; border-radius: 8px; padding: 10px 16px; margin-bottom: 16px; font-size: 13px; }

/* ---- Location detail ---- */
.location-address { font-size: 14px; color: #8888aa; margin-bottom: 28px; }

/* ---- Modal ---- */
.modal-backdrop { display: none; position: fixed; inset: 0; background: rgba(0,0,0,.3); z-index: 200; align-items: center; justify-content: center; }
.modal-backdrop.open { display: flex; }
.modal { background: #fff; border-radius: 16px; padding: 32px; width: 420px; }
.modal h3 { font-size: 18px; font-weight: 700; margin-bottom: 20px; }
.modal .form-group input { width: 100%; padding: 10px 14px; border: 1px solid #ddd; border-radius: 8px; font-size: 14px; }
.modal-actions { display: flex; gap: 10px; justify-content: flex-end; margin-top: 20px; }
.btn-secondary { background: #f0f0f7; color: #2d2d5e; border: none; padding: 10px 20px; border-radius: 8px; font-size: 14px; cursor: pointer; font-weight: 600; }

/* ---- Import ---- */
.import-box { background: #fff; border-radius: 14px; padding: 32px; }
.import-box h2 { font-size: 18px; font-weight: 700; margin-bottom: 16px; }

.import-dropzone {
    background: #fff; border: 2px dashed #c8c8e8; border-radius: 16px;
    padding: 48px 24px; text-align: center; cursor: pointer; transition: border-color .2s, background .2s;
}
.import-dropzone:hover, .import-dropzone.drag-over { border-color: #7c6ef7; background: #f8f7ff; }
.drop-icon { width: 60px; height: 60px; background: #ebebf8; border-radius: 14px; display: inline-flex; align-items: center; justify-content: center; margin-bottom: 14px; }
.drop-title { font-size: 16px; font-weight: 700; color: #1a1a3e; margin-bottom: 4px; }
.drop-sub { font-size: 13px; color: #9999bb; }

/* ---- Log Badges ---- */
.log-badge { display: inline-block; font-size: 11px; font-weight: 600; padding: 3px 10px; border-radius: 6px; }
.log-badge--system { background: #ebe9ff; color: #5b4ecf; }
.log-badge--import { background: #e0f0ff; color: #1a6ab5; }
.log-badge--employee { background: #e8f8e0; color: #2a7a00; }
.log-badge--department { background: #fff3e0; color: #b36200; }
.log-badge--location { background: #fce8f0; color: #a0004a; }
.log-badge--customer { background: #e0f8f8; color: #006060; }
.log-badge--default { background: #f0f0f7; color: #555577; }

/* ---- Dashboard ---- */
/* Reihenfarben (validiert, dataviz-Pruefskript 25.09.2026): Anlieferungen
   #7c6ef7, Abholungen #8fbf00. Das Gruen liegt unter 3:1 auf Weiss - deshalb
   Legende, Tooltip und Tabellenansicht; Text traegt nie die Reihenfarbe. */
.dash-header { margin-bottom: 20px; }
.dash-header .page-title { margin-bottom: 0; }
.dash-range { display: inline-flex; background: #fff; border-radius: 10px; padding: 4px; gap: 2px; }
.dash-range a { font-size: 13px; font-weight: 600; color: #555577; padding: 7px 14px; border-radius: 8px; }
.dash-range a:hover { background: #f0f0f7; }
.dash-range a.active { background: #1a1a3e; color: #fff; }

.dash-kpis { display: grid; grid-template-columns: 1.4fr repeat(4, 1fr); gap: 16px; margin-bottom: 20px; }
.dash-hero { background: #1a1a3e; color: #fff; border-radius: 14px; padding: 22px 24px; display: flex; flex-direction: column; justify-content: space-between; min-height: 150px; }
.dash-hero-label { font-size: 12px; font-weight: 600; letter-spacing: 1px; text-transform: uppercase; color: #c9c3ff; }
.dash-hero-value { font-size: 56px; font-weight: 800; line-height: 1; margin: 10px 0; }
.dash-hero-sub { font-size: 13px; color: #c9c3ff; }
.dash-flag { background: #b8f018; color: #1a1a3e; font-weight: 700; padding: 3px 10px; border-radius: 6px; display: inline-block; }
.dash-tile { background: #fff; border-radius: 14px; padding: 20px 22px; display: flex; flex-direction: column; justify-content: space-between; }
.dash-tile-label { font-size: 12px; font-weight: 600; color: #8888aa; }
.dash-tile-value { font-size: 30px; font-weight: 800; color: #1a1a3e; margin: 8px 0 6px; }
.dash-tile-delta { font-size: 12px; color: #8888aa; }

.dash-card { background: #fff; border-radius: 14px; padding: 22px 24px; margin-bottom: 20px; }
.dash-card--flush { padding: 0; overflow: hidden; }
.dash-card-pad { padding: 22px 24px 12px; }
.dash-card-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; flex-wrap: wrap; }
.dash-card-title { font-size: 16px; font-weight: 700; color: #1a1a3e; }
.dash-card-sub { font-size: 12px; color: #8888aa; margin-top: 3px; }
.dash-legend { display: flex; gap: 18px; font-size: 13px; color: #555577; }
.dash-legend span { display: inline-flex; align-items: center; gap: 7px; }
.dash-key { width: 12px; height: 12px; border-radius: 3px; display: inline-block; }
.dash-key--an, .dash-bar--an, .dash-hbar-fill { background: #7c6ef7; fill: #7c6ef7; }
.dash-key--ab, .dash-bar--ab { background: #8fbf00; fill: #8fbf00; }

.dash-chart { margin-top: 16px; }
.dash-chart svg { width: 100%; height: auto; display: block; overflow: visible; }
.dash-grid { stroke: #efeff6; stroke-width: 1; }
.dash-grid--base { stroke: #d9d9e8; }
.dash-axis { font-size: 11px; fill: #9999bb; font-variant-numeric: tabular-nums; }
.dash-hit { outline: none; cursor: default; }
.dash-hit-area { fill: transparent; }
.dash-hit:hover .dash-hit-area, .dash-hit:focus-visible .dash-hit-area { fill: #f5f4ff; }
.dash-hit:focus-visible .dash-hit-area { stroke: #7c6ef7; stroke-width: 1.5; }

.dash-table { margin-top: 12px; font-size: 13px; }
.dash-table summary { cursor: pointer; color: #7c6ef7; font-weight: 600; font-size: 13px; }
.dash-table table { margin-top: 10px; }
.dash-table thead th, .dash-table tbody td { padding: 8px 12px; }
.num { text-align: right !important; font-variant-numeric: tabular-nums; }

.dash-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.dash-grid-2--wide { grid-template-columns: 1.6fr 1fr; }
.dash-grid-2 > .dash-card { margin-bottom: 20px; }

.dash-hbars { display: flex; flex-direction: column; gap: 4px; margin-top: 16px; }
.dash-hbar { display: grid; grid-template-columns: minmax(120px, 42%) 1fr 36px; align-items: center; gap: 12px; padding: 7px 8px; border-radius: 8px; outline: none; }
.dash-hbar:hover, .dash-hbar:focus-visible { background: #f5f4ff; }
.dash-hbar:focus-visible { box-shadow: inset 0 0 0 1.5px #7c6ef7; }
.dash-hbar-label { font-size: 13px; color: #2d2d5e; overflow-wrap: anywhere; }
.dash-hbar-track { height: 12px; }
.dash-hbar-fill { display: block; height: 12px; border-radius: 0 4px 4px 0; min-width: 2px; }
.dash-hbar-value { font-size: 13px; font-weight: 700; color: #1a1a3e; text-align: right; font-variant-numeric: tabular-nums; }

.dash-status { display: inline-block; font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 6px; margin-left: 6px; white-space: nowrap; }
.dash-status--ok { background: #e8f8e0; color: #2a7a00; }
.dash-status--warn { background: #fff3e0; color: #b36200; }
.dash-status--crit { background: #ffeaea; color: #c00; }
.dash-status--info { background: #f0f0f7; color: #555577; }
.dash-tile-delta .dash-status { margin-left: 0; }

.dash-facts { display: flex; flex-direction: column; margin-top: 12px; }
.dash-facts > div { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid #f0f0f7; }
.dash-facts > div:last-child { border-bottom: none; }
.dash-facts dt { font-size: 13px; color: #555577; }
.dash-facts dd { font-size: 18px; font-weight: 800; color: #1a1a3e; display: flex; align-items: center; }

.dash-row { cursor: pointer; }
.dash-muted { font-size: 12px; font-weight: 400; color: #9999bb; margin-top: 2px; }
.dash-empty { font-size: 13px; color: #aaa; padding: 24px 0; }
.dash-card-pad.dash-empty { padding: 12px 24px 28px; }

.dash-tooltip { position: fixed; z-index: 300; pointer-events: none; background: #1a1a3e; color: #fff; font-size: 12px; font-weight: 500; padding: 7px 10px; border-radius: 8px; box-shadow: 0 6px 20px rgba(26,26,62,.25); white-space: nowrap; }

@media (max-width: 1200px) {
    .dash-kpis { grid-template-columns: repeat(2, 1fr); }
    .dash-hero { grid-column: 1 / -1; }
    .dash-grid-2, .dash-grid-2--wide { grid-template-columns: 1fr; }
}

/* ---- Alerts ---- */
.alert-success { background: #e8f8e0; color: #2a7a00; border-radius: 8px; padding: 10px 16px; margin-bottom: 16px; font-size: 13px; }

/* ---- Security & Compliance (/Security) ---- */
.sec-sub { font-size: 14px; color: #555577; margin-top: 6px; }
.sec-actions { display: flex; gap: 10px; }
.sec-actions a { text-decoration: none; }
.sec-status { display: flex; gap: 28px; margin-top: 18px; align-items: flex-start; }
.sec-ampel { background: #2b2b3a; border-radius: 22px; padding: 14px; display: flex; flex-direction: column; gap: 12px; flex-shrink: 0; }
.sec-licht { width: 64px; height: 64px; border-radius: 50%; display: block; opacity: .22; }
.sec-licht.an { opacity: 1; box-shadow: 0 0 22px currentColor; }
.sec-licht--rot { background: #e5484d; color: #e5484d; }
.sec-licht--gelb { background: #f5b014; color: #f5b014; }
.sec-licht--gruen { background: #3cc35c; color: #3cc35c; }
.sec-status-rechts { flex: 1; min-width: 0; }
.sec-urteil { display: flex; gap: 16px; align-items: center; border-radius: 12px; padding: 18px 20px; }
.sec-urteil--gruen { background: #e9f8ec; color: #1f8a3a; }
.sec-urteil--gelb { background: #fff6dd; color: #9a6a00; }
.sec-urteil--rot { background: #fdecec; color: #c0262b; }
.sec-urteil--grau { background: #f0f0f7; color: #555577; }
.sec-urteil svg { flex-shrink: 0; }
.sec-urteil-titel { font-size: 22px; font-weight: 800; }
.sec-urteil-text { font-size: 14px; color: #2d2d5e; margin-top: 4px; }
.sec-liste { margin-top: 14px; }
.sec-liste > div { display: flex; justify-content: space-between; gap: 16px; padding: 11px 2px; border-bottom: 1px solid #f0f0f7; font-size: 14px; }
.sec-liste dt { color: #555577; }
.sec-liste dd { font-weight: 700; color: #1a1a3e; text-align: right; }
.sec-gut { color: #1f8a3a !important; }
.sec-warn { color: #9a6a00 !important; }
.sec-schlecht { color: #c0262b !important; }
.sec-offen { color: #9a6a00 !important; }
.sec-hinweis { display: block; font-size: 12px; font-weight: 600; color: #9a6a00; }
.sec-leer { font-size: 13px; color: #8888aa; margin-top: 14px; }
.sec-logik { list-style: none; margin-top: 12px; }
.sec-logik li { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid #f0f0f7; font-size: 14px; color: #2d2d5e; }
.sec-punkt { width: 18px; height: 18px; border-radius: 50%; flex-shrink: 0; }
.sec-punkt--gruen { background: #3cc35c; }
.sec-punkt--gelb { background: #f5b014; }
.sec-punkt--rot { background: #e5484d; }
.sec-link { font-size: 13px; font-weight: 600; color: #7c6ef7; text-decoration: none; }
.sec-ereignisse { list-style: none; margin-top: 10px; }
.sec-ereignisse li { display: flex; gap: 14px; align-items: center; padding: 10px 0; border-bottom: 1px solid #f0f0f7; }
.sec-art { width: 34px; height: 34px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-weight: 800; flex-shrink: 0; }
.sec-art--ok { background: #3cc35c; color: #fff; }
.sec-art--info { background: #ebebf8; color: #4a4ad0; }
.sec-art--warnung { background: #fff0c2; color: #9a6a00; }
.sec-art--fehler { background: #fdecec; color: #c0262b; }
.sec-ereignis-text { display: block; font-size: 14px; color: #1a1a3e; }
.sec-ereignis-zeit { display: block; font-size: 12px; color: #8888aa; margin-top: 2px; }
.sec-tabelle { margin-top: 12px; font-size: 13px; }
.sec-tabelle td { padding: 9px 24px; border-bottom: 1px solid #f5f5fa; vertical-align: top; }
.sec-stufe { font-size: 12px; font-weight: 700; padding: 2px 8px; border-radius: 6px; white-space: nowrap; }
.sec-stufe--ok { background: #e9f8ec; color: #1f8a3a; }
.sec-stufe--hinweis, .sec-stufe--offen { background: #fff6dd; color: #9a6a00; }
.sec-stufe--fehler { background: #fdecec; color: #c0262b; }
.sec-stufe--info { background: #f0f0f7; color: #555577; }
.sec-bericht { margin-top: 12px; white-space: pre-wrap; overflow-wrap: anywhere; font: 12px/1.5 Consolas, "Courier New", monospace; background: #f7f7fb; border-radius: 10px; padding: 16px; max-height: 70vh; overflow: auto; }
.sec-roh { margin-top: 18px; }
.sec-roh summary { cursor: pointer; font-size: 13px; font-weight: 600; color: #7c6ef7; }
@media (max-width: 900px) { .sec-status { flex-direction: column; } .sec-ampel { flex-direction: row; } }

/* ---- Release-Bericht als Markdown (Services/MarkdownAnzeige.cs) ---- */
.md-bericht { margin-top: 12px; font-size: 14px; line-height: 1.6; color: #2d2d5e; overflow-wrap: anywhere; }
.md-bericht p { margin: 10px 0; }
.md-h { color: #1a1a3e; line-height: 1.3; }
h2.md-h { font-size: 20px; font-weight: 800; margin: 26px 0 10px; }
h3.md-h { font-size: 16px; font-weight: 800; margin: 26px 0 8px; padding-bottom: 6px; border-bottom: 1px solid #f0f0f7; }
h4.md-h, h5.md-h, h6.md-h { font-size: 14px; font-weight: 700; margin: 18px 0 6px; }
.md-bericht > .md-h:first-child { margin-top: 4px; }
.md-meta { display: flex; flex-wrap: wrap; gap: 8px 22px; margin: 4px 0 8px; padding: 12px 16px; background: #f7f7fb; border-radius: 10px; font-size: 13px; }
.md-meta > div { display: flex; gap: 6px; }
.md-meta dt { color: #8888aa; }
.md-meta dd { font-weight: 600; color: #1a1a3e; }
.md-code { margin: 10px 0; padding: 14px 16px; background: #f7f7fb; border-radius: 10px; overflow: auto; font: 12px/1.5 Consolas, "Courier New", monospace; color: #1a1a3e; }
.md-bericht code { font: 12px Consolas, "Courier New", monospace; background: #f0f0f7; padding: 1px 5px; border-radius: 4px; }
.md-code code { background: none; padding: 0; }
.md-tabelle-rahmen { margin: 10px 0; overflow-x: auto; }
.md-tabelle { width: 100%; border-collapse: collapse; font-size: 13px; }
.md-tabelle th { text-align: left; font-weight: 700; color: #555577; background: #f7f7fb; padding: 8px 12px; border-bottom: 1px solid #ebebf5; white-space: nowrap; }
.md-tabelle td { padding: 8px 12px; border-bottom: 1px solid #f5f5fa; vertical-align: top; }
.md-tabelle tr:last-child td { border-bottom: none; }
.md-liste { margin: 8px 0 8px 22px; }
.md-liste li { margin: 4px 0; }
.md-liste li.md-tief { margin-left: 22px; }
.md-liste li.md-check { list-style: none; margin-left: -22px; display: flex; gap: 10px; align-items: flex-start; }
.md-haken { flex-shrink: 0; width: 16px; height: 16px; margin-top: 3px; border: 1.5px solid #b8b8d0; border-radius: 4px; display: inline-flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 800; color: #fff; }
.md-check--erledigt .md-haken { background: #3cc35c; border-color: #3cc35c; }
.md-zitat { margin: 10px 0; padding: 10px 14px; border-left: 3px solid #7c6ef7; background: #f7f7fb; border-radius: 0 8px 8px 0; color: #555577; }
.md-hr { border: none; border-top: 1px solid #ebebf5; margin: 20px 0; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }