/* ============================================================
   admin_dashboard.css — admin-startsidans (/admin) layout.
   ------------------------------------------------------------
   C.3 (2026-06-15): lyft ur admin/index.html inline <style> (anti-
   pattern #7). Endast layout — alla färger via var(--vm-*), noll hex.
   C.2 (2026-06-15): atelier-typografi — Instrument Serif (italic)
   redaktionell sub-rad + JetBrains Mono KPI-siffror. + 11px→12px-golv
   på eyebrows (anti-pattern #3).
   Scope: .at-* / .lux-* finns bara på /admin → globalt laddad utan
   bieffekt på andra sidor.
   ============================================================ */
.module-workspace { display: flex; flex-direction: column; gap: 24px; padding: 24px; max-width: 1600px; margin: 0 auto; }
.at-hero-inner { display: flex; flex-direction: column; gap: 8px; padding: 24px; }
.at-hero-eyebrow { display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 600; letter-spacing: 0.10em; text-transform: uppercase; color: var(--vm-text-muted); }
.at-hero-eyebrow .at-hero-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--vm-brand-primary); }
.at-hero-title { margin: 0; font-size: 32px; font-weight: 600; color: var(--vm-text-primary); letter-spacing: -0.02em; }
/* C.2: redaktionell italic-serif sub-rad (Instrument Serif), atelier-premium. */
.at-hero-sub { margin: 0; font-family: var(--vm-font-serif); font-style: italic; font-size: 17px; line-height: 1.35; color: var(--vm-text-secondary); }
.at-hero-status { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }

.at-kpi-row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
@media (max-width: 1024px) { .at-kpi-row { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px)  { .at-kpi-row { grid-template-columns: 1fr; } }
.at-kpi { display: flex; align-items: center; gap: 16px; padding: 20px; background: var(--vm-bg-elevated); border: 1px solid var(--vm-border-subtle); border-radius: var(--vm-radius-lg); text-decoration: none; color: var(--vm-text-primary); transition: border-color 180ms, transform 180ms, box-shadow 180ms; }
/* D.1 (2026-06-15): hela tile:n klickbar + hover-lyft + pil glider in från höger. */
.at-kpi:hover { border-color: var(--vm-brand-primary); transform: translateY(-2px); box-shadow: var(--vm-shadow-md); }
@media (prefers-reduced-motion: reduce) { .at-kpi, .at-kpi-chev { transition: none; } .at-kpi:hover { transform: none; } }
.at-kpi-icon { width: 48px; height: 48px; display: flex; align-items: center; justify-content: center; border-radius: var(--vm-radius-md); background: var(--vm-bg-info); color: var(--vm-brand-primary); flex-shrink: 0; }
.at-kpi-icon svg { width: 24px; height: 24px; stroke: currentColor; }
.at-kpi-body { flex: 1; min-width: 0; }
/* C.2: JetBrains Mono på KPI-siffror (tabular figures), atelier-premium. */
.at-kpi-value { font-family: var(--vm-font-mono-v2); font-feature-settings: 'tnum' 1; font-size: 28px; font-weight: 600; color: var(--vm-text-primary); line-height: 1.1; }
.at-kpi-label { font-size: 13px; color: var(--vm-text-muted); margin-top: 2px; }
/* D.1: KPI-etiketter sentence-case (override uppercase-monoliterna i
   vm_typography_pro.css:154 + vm_studio.css:323). Scope: bara dashboard-tiles. */
body[data-path^="/admin"] .at-kpi-label.lux-kpi-label { text-transform: none !important; font-weight: 600 !important; letter-spacing: 0 !important; font-size: 13px !important; color: var(--vm-text-muted) !important; }
/* D.1: pil glider in från höger + färgas på hover (samma känsla som rail-hover). */
.at-kpi-chev { color: var(--vm-brand-primary); font-size: 18px; opacity: 0; transform: translateX(6px); transition: opacity 180ms, transform 180ms; }
.at-kpi:hover .at-kpi-chev { opacity: 1; transform: translateX(0); }

.at-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
@media (max-width: 1024px) { .at-grid { grid-template-columns: 1fr; } }
.at-panel { background: var(--vm-bg-elevated); border: 1px solid var(--vm-border-subtle); border-radius: var(--vm-radius-lg); overflow: hidden; }
.at-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 20px; border-bottom: 1px solid var(--vm-border-subtle); }
.at-panel-titles { display: flex; flex-direction: column; gap: 2px; }
.at-panel-eyebrow { font-size: 12px; font-weight: 600; letter-spacing: 0.10em; text-transform: uppercase; color: var(--vm-text-muted); }
.at-panel-title { font-size: 16px; font-weight: 600; color: var(--vm-text-primary); }
.at-panel-actions { display: flex; align-items: center; gap: 8px; }
.at-panel-meta { padding: 8px 20px; font-size: 12px; color: var(--vm-text-muted); border-bottom: 1px solid var(--vm-border-subtle); }
.at-panel-body { padding: 16px 20px; min-height: 120px; }

.lux-detail-text { font-size: 13px; color: var(--vm-text-muted); }
.lux-central-row { display: grid; grid-template-columns: 2fr 1fr 1.4fr 1fr; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--vm-border-subtle); align-items: center; font-size: 13px; }
.lux-central-head { font-weight: 600; color: var(--vm-text-muted); font-size: 12px; text-transform: uppercase; letter-spacing: 0.10em; }
.lux-event-row { padding: 6px 0; border-bottom: 1px solid var(--vm-border-subtle); font-size: 13px; }

/* ── D.2 (2026-06-15): global sidebar-footer — serverklocka i JetBrains Mono
   (laddas globalt via base.html, gäller hela admin-skalet). ── */
.sidebar-server-time-value { font-family: var(--vm-font-mono-v2); font-feature-settings: 'tnum' 1; letter-spacing: 0.02em; }
