/* ============================================================ vm_facit_overrides.css (2026-05-13 runda 6 — cascade-fix landad) ============================================================ Strategi: ALLA facit-fixar samlade här. Laddas SIST i base.html + base_enterprise.html. Vinner reglerna källordning-mässigt över legacy-regler. Runda 6 (2026-05-13): admin_contrast_fix.css + vm_design_system.css submit-button-regler är nu kapslade i :where() → specificity 0. Detta löser Webb-Claudes diagnos från runda 5 där KPI- och knapp- overrides förlorade cascade-kampen mot (0,12,2)-selektorer i admin_contrast_fix. Nu vinner alla regler i denna fil enkelt på källordning + specificity. Runda 6 tokenisering: Alla --vm-accent-* tints bygger nu på --vm-accent-rgb (space-separated RGB). 326 hardkodade gold-rgba över 12 CSS-filer ersatta med rgb(var(--vm-accent-rgb) / X) → tema-byte i /admin/global_settings (även palette-presets) slår igenom KONSEKVENT över hela UI utan kvarvarande gold-rester. PRINCIP: Skriv INGENTING annat var som helst. ALL facit-styling som måste vinna ligger HÄR. Filen ska kunna raderas → systemet återgår till "innan-facit" utan kollateral skada. ============================================================ */ /* ──────────────────────────────────────────────────────────── 1. KPI-VÄRDEN — alltid guld accent (undantag: critical = röd) ──────────────────────────────────────────────────────────── */ :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .at-kpi-value, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .lux-kpi-value, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .access-stat-value, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .vm-kpi-value, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .vm-stat-value, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .ap-kpi-val, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .kpi-value, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .central-summary-value, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .lab-kpi-num, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) [class*="kpi"][class*="value"], :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) [class*="kpi-val"], :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .access-stat strong, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .access-grid-4 .access-stat strong, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .access-grid-3 .access-stat strong, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .access-grid-2 .access-stat strong { color: var(--vm-accent) !important; } :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .lab-kpi-cell-critical .lab-kpi-num, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .lab-kpi-cell.is-critical .lab-kpi-num, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .lab-kpi-cell[data-kpi-key="critical"] .lab-kpi-num, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .kpi-critical [class*="value"], :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .access-stat--critical strong, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .access-stat.is-critical strong { color: var(--vm-danger) !important; } /* 2026-05-29 r7: vm-stat-* status-varianter måste outranka monoliten ovan (spec 0,3,1 + ! → blå-tonar ALLA .vm-stat-value). Använder samma body- selector-prefix för att matcha specificiteten + sätter status-färg per variant. Lärdom 21-mönster (kända monoliter måste excepta:as per variant). */ :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .vm-stat-ok .vm-stat-value { color: var(--vm-status-ok) !important; } :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .vm-stat-warning .vm-stat-value { color: var(--vm-status-warning) !important; } :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .vm-stat-danger .vm-stat-value { color: var(--vm-status-danger) !important; } :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .vm-stat-brand .vm-stat-value, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .vm-stat-info .vm-stat-value { color: var(--vm-brand-primary) !important; } /* ──────────────────────────────────────────────────────────── 2. LEGACY PRIMARY-KNAPPAR — accent guld + override background-image (Webb-Claudes diagnos: gamla linear-gradient(rgba(14,122,210,0.35)) kvarstod eftersom min fix bara satte 'background' men inte 'background-image'. Båda måste rensas.) ──────────────────────────────────────────────────────────── */ :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .btn-primary, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .access-btn-primary, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .access-tab-link.active, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .users-tab.active, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .tab-link.active, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .primary-btn, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .pl-search-btn, /* FAS P (2026-05-16): .pl-badge.aktiv borttagen ur denna multi-selektor — AKTIV är status (grön state), inte action (blå accent). Pillen får sin gröna färg från persons/list.html:54 (state-ok-tokens). */ :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) button.primary, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .btn.btn-primary, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .row-btn.primary, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .btn-primary-link { /* Runda 7: höjt från 0.10 → 0.22 så CTA-knappen får punch */ background: var(--vm-accent-tint-22) !important; background-image: none !important; color: var(--vm-accent) !important; border: 1px solid var(--vm-accent) !important; box-shadow: none !important; } :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .btn-primary:hover, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .access-btn-primary:hover, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .users-tab.active:hover, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .primary-btn:hover, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .pl-search-btn:hover, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) button.primary:hover, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .btn.btn-primary:hover, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .row-btn.primary:hover, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .btn-primary-link:hover { background: var(--vm-accent) !important; background-image: none !important; color: var(--vm-accent-fg) !important; transform: translateY(-1px); box-shadow: 0 4px 12px var(--vm-accent-tint-40) !important; } /* FAS O (2026-05-16): AKTIV-pill ska vara grön (state-color), inte accent (blå). Tidigare överrode regeln pillen till accent — det krockade med designsystem-spec där status = state-color. Pillen får nu sin gröna färg från list.html:54 och access-status-badge-success från vm_components.css. */ .pl-badge.aktiv, .pl-badge.aktiv *, .access-status-badge--success, .access-status-badge--success *, .access-status-badge--active, .access-status-badge--active * { color: var(--vm-state-ok) !important; } /* Row-btn.secondary (hardware "Sätt som standard") */ .row-btn.secondary, .btn-secondary-link { background: var(--vm-bg-elevated) !important; background-image: none !important; color: var(--vm-text-soft) !important; border: 1px solid var(--vm-border) !important; } /* Login-knappen .login-button RIVEN (login-redesign 2026-06-01) — login byggdes om på vm-login-* namespace med tokeniserad knapp i auth/login.html. */ /* ──────────────────────────────────────────────────────────── 3. SIDEBAR-ACTIVE 3PX STRIP — legacy .sidebar-link.active behålls FAS 13 Lager 1-fix-2 2026-05-17: .vm-sidebar-link.is-active borttagen ur både huvud-rule och ::before-listan eftersom !important override:ade FAS 11 (VMDS-13) i vm_components.css:1118 och la till en ::before-strip som inte var i FAS 11-spec. Legacy .sidebar-link.active fortsätter få strip för huvud-sidebar i base.html som inte är migrerad till is-active. ──────────────────────────────────────────────────────────── */ .sidebar-link.active, .app-sidebar .sidebar-link.active { position: relative !important; background: var(--vm-accent-tint-10) !important; } :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .sidebar-link.active::before, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .app-sidebar .sidebar-link.active::before, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) body.app-shell .sidebar-link.active::before, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) body.theme-atelier .sidebar-link.active::before { content: "" !important; position: absolute !important; left: 0 !important; top: 6px !important; bottom: 6px !important; width: 3px !important; border-radius: 0 2px 2px 0 !important; /* Runda 7: explicit background-color istället för shorthand så DevTools visar färgen tydligt. Plus utökade selektorer för att vinna mot ev. theme-prefixade :: before-regler. */ background-color: var(--vm-accent) !important; background-image: none !important; box-shadow: 0 0 12px var(--vm-accent-tint-45) !important; opacity: 1 !important; } /* ──────────────────────────────────────────────────────────── 4. KPI-KORT HOVER-LIFT — utökat till alla faktiska klasser ──────────────────────────────────────────────────────────── */ @media (prefers-reduced-motion: no-preference) { .lux-kpi-card, .at-kpi, .ap-kpi, .lab-kpi-cell, .vm-stat, .access-stat, .central-summary-card, .cs-summary-card, .ap-quick { transition: transform 0.18s cubic-bezier(.16,1,.3,1), box-shadow 0.18s cubic-bezier(.16,1,.3,1), border-color 0.18s cubic-bezier(.16,1,.3,1) !important; } .lux-kpi-card:hover, .at-kpi:hover, .ap-kpi:hover, .lab-kpi-cell:hover, .vm-stat:hover, .access-stat:hover, .central-summary-card:hover, .cs-summary-card:hover, .ap-quick:hover { transform: translateY(-2px) !important; box-shadow: 0 12px 28px rgba(0,0,0,0.32), 0 0 0 1px var(--vm-accent-tint-40), 0 0 24px var(--vm-accent-tint-22) !important; border-color: var(--vm-accent) !important; } } /* ──────────────────────────────────────────────────────────── 5. TID-MODAL token-override RIVEN i FAS Q.1 (2026-05-16) Originalet definierade --vm-bg=#0a0e14, --vm-bg-elevated=#1a1e26 m.fl. ENBART inom .sd-modal — gjorde modalen påtagligt mörkare än resten av appen. Symptom-fix för palette-arkitektur som inte längre finns (FAS H rev palette-attributet). Schemamodalen ärver nu normal --vm-bg-elevated (#232b34) från :root och inline-style i _door_schedule_modal.html som följer tokens. ──────────────────────────────────────────────────────────── */ /* Tvinga text-color på alla hardkodade subtext-element i Tid-modalen */ html body.app-shell .sd-modal, html body.app-shell .sd-modal *:not(.sd-cal-cell.open):not(.sd-cal-cell.closed):not(.sd-cal-cell.locked):not(.sd-cal-cell.excep):not(.sd-tsec.closed-sec):not(.sd-tsec.excep-sec):not(.sd-tsec.closed-sec *):not(.sd-tsec.excep-sec *), html body.theme-atelier .sd-modal, html body.theme-atelier .sd-modal *:not(.sd-cal-cell.open):not(.sd-cal-cell.closed):not(.sd-cal-cell.locked):not(.sd-cal-cell.excep) { /* Ärver dark-text via CSS-variable, men säkerställ ingen hardcoded #111827 vinner */ } :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.app-shell .sd-modal .sd-modal-head strong, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.app-shell .sd-modal .sd-cal-corner, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.app-shell .sd-modal .sd-cal-dh, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.app-shell .sd-modal .sd-cal-hr, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.app-shell .sd-modal .sd-cal-cell, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.app-shell .sd-modal .sd-month-cal th, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.app-shell .sd-modal .sd-month-cal td, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.app-shell .sd-modal .sd-tsec-head, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.app-shell .sd-modal .sd-tsec-head h4, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.app-shell .sd-modal .sd-form-label, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.app-shell .sd-modal .sd-day-lbl, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.app-shell .sd-modal .sd-iv-row, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.app-shell .sd-modal .sd-door-check-item, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.app-shell .sd-modal .sd-door-check-meta, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.app-shell .sd-modal .sd-grp-item, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.app-shell .sd-modal label, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.app-shell .sd-modal p, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.app-shell .sd-modal small { color: rgba(235, 240, 250, 0.94) !important; } :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.app-shell .sd-modal .sd-form-label, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.app-shell .sd-modal .sd-cal-dh, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.app-shell .sd-modal .sd-cal-hr, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.app-shell .sd-modal .sd-month-cal th { color: rgba(165, 185, 215, 0.72) !important; } :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.app-shell .sd-modal-head, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.theme-atelier .sd-modal-head, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.app-shell .sd-modal-foot, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.theme-atelier .sd-modal-foot { background: linear-gradient(180deg, var(--vm-accent-tint-08), transparent) !important; border-color: var(--vm-accent-tint-20) !important; color: var(--vm-accent) !important; } :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.app-shell .sd-modal-head strong, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.theme-atelier .sd-modal-head strong { color: var(--vm-accent) !important; } :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.app-shell .sd-modal-body, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.theme-atelier .sd-modal-body { background: var(--vm-bg-elevated) !important; color: var(--vm-text) !important; } :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.app-shell .sd-modal-close, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.theme-atelier .sd-modal-close { color: var(--vm-text-muted) !important; } /* Tid-modal Spara → accent guld solid (vinner cascade nu via fil-ordning) */ html body.app-shell .sd-modal .vm-btn-primary, html body.theme-atelier .sd-modal .vm-btn-primary { background: var(--vm-accent) !important; background-image: none !important; color: var(--vm-accent-fg) !important; border: 1px solid var(--vm-accent) !important; font-weight: 700 !important; box-shadow: 0 2px 8px var(--vm-accent-tint-30) !important; } :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.app-shell .sd-modal .vm-btn-primary:hover, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.theme-atelier .sd-modal .vm-btn-primary:hover { background: var(--vm-accent-hover, var(--vm-accent)) !important; transform: translateY(-1px); box-shadow: 0 4px 12px var(--vm-accent-tint-45) !important; } /* Tid-modal Avbryt / + Lägg till → mörk ghost (synlig på mörk modal) Batch 18a-fix-v3 (2026-05-21, Prio 1i): :not(.vm-btn-danger) tillagt så att vm-btn-danger inuti .sd-modal slipper denna override och renderar SOLID röd via VMDS-4-regeln. Lärdom 21 (NY). */ html body.app-shell .sd-modal .vm-btn:not(.vm-btn-primary):not(.vm-btn-danger), html body.theme-atelier .sd-modal .vm-btn:not(.vm-btn-primary):not(.vm-btn-danger), html body.app-shell .sd-modal .vm-btn-ghost, html body.theme-atelier .sd-modal .vm-btn-ghost { background: var(--vm-bg-elevated) !important; background-image: none !important; color: var(--vm-text) !important; border: 1px solid var(--vm-border) !important; } /* Tid-modal kalender + sektioner — mörk facit */ html body.app-shell .sd-modal .sd-cal, html body.theme-atelier .sd-modal .sd-cal, html body.app-shell .sd-modal .sd-tsec, html body.theme-atelier .sd-modal .sd-tsec, html body.app-shell .sd-modal .sd-door-checklist, html body.theme-atelier .sd-modal .sd-door-checklist { background: var(--vm-bg-elevated) !important; border-color: var(--vm-border) !important; color: var(--vm-text) !important; } :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.app-shell .sd-modal .sd-cal-corner, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.theme-atelier .sd-modal .sd-cal-corner, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.app-shell .sd-modal .sd-cal-dh, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.theme-atelier .sd-modal .sd-cal-dh, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.app-shell .sd-modal .sd-cal-hr, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.theme-atelier .sd-modal .sd-cal-hr, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.app-shell .sd-modal .sd-tsec-head, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.theme-atelier .sd-modal .sd-tsec-head { background: var(--vm-bg-soft) !important; color: var(--vm-text-soft) !important; border-color: var(--vm-border) !important; } :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.app-shell .sd-modal .sd-cal-cell:not(.open):not(.closed):not(.locked), :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) html body.theme-atelier .sd-modal .sd-cal-cell:not(.open):not(.closed):not(.locked) { background: var(--vm-bg-elevated) !important; border-color: var(--vm-border-soft) !important; } /* Tid-modal inputs — synliga mörk-design (text-on-elevated) */ html body.app-shell .sd-modal input[type="time"], html body.app-shell .sd-modal input[type="date"], html body.app-shell .sd-modal input[type="text"], html body.app-shell .sd-modal input[type="search"], html body.app-shell .sd-modal input[type="number"], html body.app-shell .sd-modal select, html body.app-shell .sd-modal textarea, html body.theme-atelier .sd-modal input[type="time"], html body.theme-atelier .sd-modal input[type="date"], html body.theme-atelier .sd-modal input[type="text"], html body.theme-atelier .sd-modal select, html body.theme-atelier .sd-modal textarea { background: var(--vm-bg) !important; color: var(--vm-text) !important; border-color: var(--vm-border) !important; color-scheme: dark !important; } /* ──────────────────────────────────────────────────────────── 6. FLASH-BANNER — premium accent-tint (Per vill accent-färgade) ──────────────────────────────────────────────────────────── */ .flash-stack { max-width: 720px !important; margin: 14px auto !important; } :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .flash { background: var(--vm-success-soft) !important; border: 1px solid var(--vm-success-soft) !important; color: var(--vm-success) !important; } :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .flash.flash-warning, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .flash.flash-info { background: var(--vm-accent-soft) !important; border-color: var(--vm-accent-soft) !important; color: var(--vm-accent) !important; } :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .flash.flash-error, :is(body[data-palette="linear_gold"], body:not([data-palette]):not([data-palette=""])) .flash.flash-danger { background: var(--vm-danger-soft) !important; border-color: var(--vm-danger-soft) !important; color: var(--vm-danger) !important; } /* ─────────────────────────────────────────────────────────────────── E5 (admin-struktur) 12px-golv för admin-header-primitiven. .vm-admin-eyebrow + .vm-admin-subtitle var sub-12px (0.64–0.78rem) och maskerades av !important-monoliter i vm_premium_pass.css (0.64rem), vm_components.css (0.68rem, vinnaren) och vm_typography_pro.css. Basdef i vm_compact_admin.css är redan satt till var(--vm-text-xs) men förlorar utan !important. Denna fil laddas SIST → vinner. Caps-letterspacing + accent-färg sätts av path-scopad vm_studio.css-regel (orörd). Träffar: /admin/sites, /admin/floors, /admin/hardware_library, /admin/access (base_access eyebrow) + kiosk_settings (E5-migrerad). ─────────────────────────────────────────────────────────────────── */ .vm-admin-eyebrow { font-size: var(--vm-text-xs) !important; } .vm-admin-subtitle { font-size: var(--vm-text-xs) !important; }