/* ════════════════════════════════════════════════════════════════
   PLATFORMA ADMIN CHROME — S6.4 (2026-04-27)
   ════════════════════════════════════════════════════════════════
   "Bounded-A" reskin: tema-tintet admin-chrome (sidebar accent,
   active states, primary CTAs, links) MEN platform-konstant
   layout/struktur/status. TenantAdmin føler "min forening" uden
   at miste UX-konsistens på tværs af tenants.

   V6.3 roller i play:
     - Brand / Visual Identity Director: subtle accent, not full reskin
     - Frontend Design System Engineer: ÉN ekstra CSS-fil overrider
       eksisterende rules via cascade — ingen edits af base CSS, så
       roll-back = remove this file
     - WCAG Accessibility Engineer: status-handlinger (Slet, Success,
       Warning) er INVARIANTE pr S6 spec — vi tinter ikke destructive
       UX-cues
     - UX Researcher (non-tech): SuperAdmin der svitcher mellem tenants
       ser kun chrome-tone skifte, ikke layout/struktur — navigation
       muscle-memory bevares

   Scope (TINTED):
     ✓ Sidebar active-item accent stripe + bg tint
     ✓ Sidebar hover-state accent
     ✓ Primary CTA-buttons (.platforma-btn-primary)
     ✓ Page-header primary action
     ✓ Website cockpit-tabs active state
     ✓ Cards hover-state accents
     ✓ Page-header breadcrumb-link hover

   NOT scope (INVARIANT):
     ✗ Sidebar background (keeps dark neutral — context-switch safety)
     ✗ Header background (keeps white)
     ✗ Status badges (success/warning/danger — conventional colors)
     ✗ Modal chrome
     ✗ Form input borders + focus-ring (kept platform-default for
       visual consistency in form-validation states)
     ✗ Layout grid + spacing
     ✗ Typography scale

   Load-order: this file MUST be loaded AFTER platforma-layout.css,
   platforma-buttons.css, platforma-tables.css so cascade overrides
   take effect. Wired in _Layout.cshtml.
   ════════════════════════════════════════════════════════════════ */

/* ─── Sidebar: active + hover accent ────────────────────────────
   Original (platforma-layout.css line 372-394) brugte hardcoded gold
   --platforma-warm. Vi swapper til --tenant-primary så accentstribe
   + active-bg tint matcher tema-valg. Dark sidebar bg er bevidst
   uændret — context-switch readability. */

.platforma-nav-item:hover {
    background: color-mix(in srgb, var(--tenant-primary, var(--platforma-warm, #C7A55F)) 12%, transparent);
    box-shadow: inset 2px 0 0 var(--tenant-primary, var(--platforma-warm, #C7A55F));
}

.platforma-nav-item-active {
    background: color-mix(in srgb, var(--tenant-primary, var(--platforma-warm, #C7A55F)) 18%, transparent);
    box-shadow: inset 4px 0 0 var(--tenant-primary, var(--platforma-warm, #C7A55F));
}

.platforma-nav-item-active:hover {
    background: color-mix(in srgb, var(--tenant-primary, var(--platforma-warm, #C7A55F)) 24%, transparent);
}

/* Sidebar tenant-bubble (logo-mark): tint med primary i stedet for hardcoded
   warm-gold. */
.platforma-tenant-bubble {
    background: linear-gradient(135deg,
        var(--tenant-primary, var(--platforma-warm, #C7A55F)),
        var(--tenant-primary-dark, #a07414));
}

/* ─── Primary CTAs ─────────────────────────────────────────────
   Original brugte --platforma-primary (#3699FF blå). Tema-tintet
   så fx Nordic Sand giver bronze-CTA, Nordic Ruby giver rød-CTA. */

.platforma-btn-primary {
    background-color: var(--tenant-primary-dark, var(--platforma-primary));
    border-color: var(--tenant-primary-dark, var(--platforma-primary));
}

.platforma-btn-primary:hover:not(:disabled) {
    /* Mørkere variant — vi mixer i 12% sort for at få "darker" på alle 4 temaer.
       For Sand er primary-dark allerede mørkest, men 12% sort gør det stadig mere "trykbart". */
    background-color: color-mix(in srgb, var(--tenant-primary-dark, var(--platforma-primary)) 88%, #000);
    border-color: color-mix(in srgb, var(--tenant-primary-dark, var(--platforma-primary)) 88%, #000);
}

/* Outline-primary variant for sekundære CTAs der STADIG er tema-aware. */
.platforma-btn-outline-primary {
    border-color: var(--tenant-primary-dark, var(--platforma-primary));
    color: var(--tenant-primary-dark, var(--platforma-primary));
}

.platforma-btn-outline-primary:hover:not(:disabled) {
    background-color: var(--tenant-primary-soft, rgba(0, 158, 247, 0.06));
}

/* ─── Page-header primary action ────────────────────────────────
   _AdminPageHeader emitter "primary"-action med klasse
   .platforma-page-header-action--primary. Den brugte gold-accent
   før (Platforma red brand-pakke). Tema-tinted for visual
   konsistens med sidebar + buttons. */

.platforma-page-header-action--primary {
    background-color: var(--tenant-primary-dark, var(--platforma-primary));
    border-color: var(--tenant-primary-dark, var(--platforma-primary));
    color: var(--tenant-on-primary, #fff);
}

.platforma-page-header-action--primary:hover {
    background-color: color-mix(in srgb, var(--tenant-primary-dark, var(--platforma-primary)) 88%, #000);
    border-color: color-mix(in srgb, var(--tenant-primary-dark, var(--platforma-primary)) 88%, #000);
}

/* Breadcrumb-links hover */
.platforma-page-header-breadcrumb-link:hover {
    color: var(--tenant-primary-dark, var(--platforma-primary));
}

/* ─── Website cockpit-tabs active state ────────────────────────
   .ws-tab.is-active fra platforma-tables.css (S5.7-cockpit). Vi
   tinter active-fill + brand-stripe-top med tenant-primary. */

.ws-tab.is-active {
    background: var(--tenant-primary-soft, rgba(0, 158, 247, 0.08));
    color: var(--tenant-primary-dark, var(--platforma-ink-strong, #1a1a1a));
}

.ws-tab.is-active::before,
.ws-tab.is-active::after {
    background: var(--tenant-primary, var(--platforma-primary));
}

.ws-tab:hover {
    background: var(--tenant-primary-soft, rgba(0, 158, 247, 0.04));
}

/* ─── Card / row hover-states ──────────────────────────────────
   Tabel-rækker + admin-cards får subtil tenant-tint på hover.
   Status-rækker (slettede, advarsler) bevarer deres invariant
   styling via mere specifikke selectors. */

.platforma-table tbody tr:hover {
    background: var(--tenant-primary-soft, var(--platforma-gray-50));
}

/* Filter-bar focus-ring tintet (form-inputs ellers IKKE retinted). */
.platforma-list-panel-filter input:focus-visible,
.platforma-list-panel-filter select:focus-visible {
    outline: none;
    border-color: var(--tenant-primary-dark, var(--platforma-primary));
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--tenant-primary, var(--platforma-primary)) 22%, transparent);
}

/* ─── Side-active markering (.platforma-btn-action hover på admin tabeller) ── */
.platforma-btn-action:hover {
    background: var(--tenant-primary-soft, #E8EEF5);
    border-color: var(--tenant-primary, #2E5C8A);
    color: var(--tenant-primary-dark, #2E5C8A);
}

/* ─── Stat-cards: primary-tone tints i admin-page-header stats ─ */
.platforma-page-header-stat--tone-attn .platforma-page-header-stat-value,
.platforma-page-header-stat--tone-attn .platforma-progress-ring-text {
    /* Attention-tone bruger primary i stedet for hardcoded gold. */
    color: var(--tenant-primary-dark, var(--platforma-warm, #C7A55F));
}

.platforma-progress-ring {
    /* Progress-ring fyld bruger primary. SVG-rendering i AdminPageHeader
       læser conic-gradient via --progress var, vi swap'er stroke-color her. */
    --ring-stroke: var(--tenant-primary, var(--platforma-warm, #C7A55F));
}