/* ============================================================================
   MOBIL-DOCK — flydende glas-dock, DELT af alle 5 produkters mobil-lag.
   ----------------------------------------------------------------------------
   Loades EFTER hvert produkts eget mobil-CSS (cmx-mobile / planner-mobile /
   dm-shell / mail / hrm-common) og vinder derfor uden !important.

   HVORFOR: rude-skinnets §3 hedder "UNIFIED flydende glas-dock" — desktop-
   sidebaren ER allerede en flydende dock (14px kant, 24px radius, frost).
   Denne fil flytter det SAMME sprog ned i tommelfingerens raekkevidde paa
   telefonen. Ingen ny stil; samme grammatik, ny placering.

   GLAS-PRINCIP (rude-skin.css L8, iOS 26): chrome = translucent glas,
   INDHOLD = solid flade. Docken er chrome. Kort roeres ALDRIG herfra.

   ── TEMA (Hammer 2026-07-16: "lyst tema skal vaere lyst, moerkt skal vaere moerkt")
   Docken dikterer INGEN farver. Den arver hvert produkts EGEN overflade-token
   via --dock-surface, saa den foelger produktets eget tema-signal automatisk:
     CMX/PLM/Mail/HRM = [data-theme]      DM = [data-dm-theme]  (eget toggle!)
   Derfor kan der ikke opstaa "moerke widgets paa lyst tema" her: der er ingen
   hardkodet farve at komme efter.

   ── FODAFTRYK-KONTRAKTEN (den vigtige)
   Hvert produkt har en var der betyder "hvor meget lodret plads aeder baren
   fra bunden" (--cmx-tabbar-h / --plm-tabbar-h / --dm-tabbar-h). Den laeses af
   ~8 call-sites pr. produkt: indholdets padding-bottom, FAB'ens bottom, toasts,
   bulk-barer, --a2hs-lift (install-banneret).
   Naar docken loefter sig GAP px fra kanten, VOKSER fodaftrykket med GAP.
   Vi omdefinerer derfor varen til (pille + gap) og saetter pillens egen hoejde
   eksplicit. Saa er ALLE eksisterende call-sites korrekte af sig selv, og vi
   undgaar at jage dem enkeltvis (og misse en).
     var  = pille + gap   → det call-sites vil vide
     pille = --dock-pill-h → barens egen visuelle hoejde
   Call-sites laegger selv safe-area-inset-bottom til, saa varen indeholder den IKKE.

   ── IKKE i denne fil
   .phn-tabbar er IKKE en bundnav. Den er planner-phonerens TOP-bar
   ("Tab-bar (top paa desktop = store pills)", border-bottom). Roer den ikke.
   ============================================================================ */

:root{
  --dock-gap: 12px;          /* afstand til skaermkant; fodaftrykket vokser med denne */
  --dock-r: 24px;            /* = --uc-r paa desktop-docken (rude-skin §3) */
  --dock-blur: 22px;         /* MAALT paa telefon, se dock-perf-maaling. Desktop bruger 38. */
  --dock-sat: 1.5;
  --dock-shadow: 0 8px 28px -8px rgba(0,0,0,.30);
  --dock-mix: 74%;           /* lavere = mere frost synlig. Flad tabbar laa paa 84-92%. */
}

/* ── DELT DOCK-KROP ────────────────────────────────────────────────────────
   Én regelblok for alle fem. Position/hoejde saettes per produkt nedenfor,
   fordi arkitekturen er forskellig (CMX = absolut i fixed shell, resten = fixed). */
body.cmx-active .cmx-tabbar,
body.plm-active .plm-tabbar,
body.dm-body    .dm-tabbar,
body.mm-active  .mm-tabbar,
body.hm-active  .hm-tabbar{
  border-radius: var(--dock-r);
  border: 1px solid var(--dock-line, rgba(127,127,127,.18));
  border-top: 1px solid var(--dock-line, rgba(127,127,127,.18));  /* ophaev border-top-only */
  background: color-mix(in srgb, var(--dock-surface) var(--dock-mix), transparent);
  -webkit-backdrop-filter: blur(var(--dock-blur)) saturate(var(--dock-sat));
  backdrop-filter: blur(var(--dock-blur)) saturate(var(--dock-sat));
  box-shadow: var(--dock-shadow);
  box-sizing: border-box;
}

/* Fald tilbage til solid flade hvis browseren ikke kan frost. Uden dette
   bliver docken naesten gennemsigtig og teksten under den laeser igennem. */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))){
  body.cmx-active .cmx-tabbar,
  body.plm-active .plm-tabbar,
  body.dm-body    .dm-tabbar,
  body.mm-active  .mm-tabbar,
  body.hm-active  .hm-tabbar{
    background: var(--dock-surface);
  }
}

/* ── CALLCENTER MANAGR ─────────────────────────────────────────────────────
   Baren er flex-child i .ms-shell (fixed, inset:0, 100dvh) — bevidst IKKE fixed,
   saa layoutet overlever iOS-URL-bar-kollaps (cmx-mobile.css L72).
   Vi gaar til position:absolute, IKKE fixed: .ms-shell er selv fixed og dermed
   containing block, saa docken forankres til SHELLENS boks (ikke viewportens).
   Kollaps-sikkerheden er dermed bevaret. .ms-body vokser nu til fuld hoejde og
   scroller UNDER docken — det er ogsaa det, der giver frosten noget at fryse. */
body.cmx-active{
  --dock-pill-h: 64px;
  --cmx-tabbar-h: calc(var(--dock-pill-h) + var(--dock-gap));   /* fodaftryk */
  --dock-surface: var(--cmx-surface);
  --dock-line: var(--cmx-line);
}
body.cmx-active .cmx-tabbar{
  position: absolute;
  left: var(--dock-gap); right: var(--dock-gap);
  bottom: calc(var(--dock-gap) + env(safe-area-inset-bottom, 0px));
  min-height: var(--dock-pill-h);
  height: var(--dock-pill-h);
  padding: 6px 4px;                    /* safe-area sidder nu i bottom, ikke i padding */
}
/* .ms-body er flex:1 og var foer afgraenset af tabbaren. Nu skal den selv
   holde plads fri, ellers gemmer docken permanent sidste kort. */
body.cmx-active .ms-body{
  padding-bottom: calc(var(--cmx-tabbar-h) + env(safe-area-inset-bottom, 0px) + 12px);
}

/* ── SHIFT MANAGR ──────────────────────────────────────────────────────────
   Allerede fixed bottom. --plm-tabbar-h laeses af ~8 call-sites (mobile.css
   L158 indhold, L223/L855 FAB+bulk-bar, L971/L974/L1074 toasts, L63 a2hs-lift).
   Omdefineringen goer dem alle korrekte uden at roere dem. */
body.plm-active{
  --dock-pill-h: 64px;
  --plm-tabbar-h: calc(var(--dock-pill-h) + var(--dock-gap));
  --dock-surface: var(--plm-surface);
  --dock-line: var(--plm-line);
}
body.plm-active .plm-tabbar{
  left: var(--dock-gap); right: var(--dock-gap);
  bottom: calc(var(--dock-gap) + env(safe-area-inset-bottom, 0px));
  height: var(--dock-pill-h);
  padding: 6px 4px;
}

/* ── DASHBOARD MANAGR ──────────────────────────────────────────────────────
   Eget tema-toggle: [data-dm-theme="dark"] (profil-sheetet), IKKE data-theme.
   Ved at binde --dock-surface til --dm-card foelger docken det automatisk.
   .dm-main har allerede padding-bottom: var(--dm-tabbar-h) + safe + 40px. */
body.dm-body{
  --dock-pill-h: 60px;
  --dm-tabbar-h: calc(var(--dock-pill-h) + var(--dock-gap));
  --dock-surface: var(--dm-card);
  --dock-line: var(--dm-line);
}
body.dm-body .dm-tabbar{
  left: var(--dock-gap); right: var(--dock-gap);
  bottom: calc(var(--dock-gap) + var(--dm-safe-bottom));
  height: var(--dock-pill-h);
  padding: 8px 4px;
}

/* ── MAIL MANAGR ───────────────────────────────────────────────────────────
   Hardkodet 64px bar; .main har padding-bottom 78px + safe (mail.css L1236),
   hvilket allerede daekker dockens fodaftryk (64+12=76). Ingen ekstra plads noedig. */
body.mm-active{
  --dock-pill-h: 64px;
  --dock-surface: var(--bh-surface);
  --dock-line: var(--bh-line);
}
body.mm-active .mm-tabbar{
  left: var(--dock-gap); right: var(--dock-gap);
  bottom: calc(var(--dock-gap) + env(safe-area-inset-bottom, 0px));
  height: var(--dock-pill-h);
  padding: 0 4px;
}

/* ── HR MANAGR ─────────────────────────────────────────────────────────────
   Hardkodet 64px bar; .hrm-main har padding-bottom 80px + safe (common.css
   L1206) > fodaftrykket 76. Ingen ekstra plads noedig. */
body.hm-active{
  --dock-pill-h: 64px;
  --dock-surface: var(--color-card-solid, var(--color-card));
  --dock-line: var(--color-border);
}
body.hm-active .hm-tabbar{
  left: var(--dock-gap); right: var(--dock-gap);
  bottom: calc(var(--dock-gap) + env(safe-area-inset-bottom, 0px));
  height: var(--dock-pill-h);
  padding: 0 4px;
}

/* ── AKTIV-PILLE ───────────────────────────────────────────────────────────
   Paa en flad tabbar raekker farve alene. I en dock med frost bag sig er
   accent-tekst paa translucent glas skroebelig (kontrasten afhaenger af hvad
   der tilfaeldigvis scroller under). Den aktive fane faar derfor sin egen
   pille — form baerer tilstanden, ikke kun farve.

   🛑 Klassenavnene herunder er LAEST AF DEN LEVENDE DOM (probe 2026-07-16), ikke
   gaettet ud fra BEM-moenstret. De foelger IKKE samme konvention:
     CMX  .cmx-tabbar__item--active     PLM  .plm-tabbar__item--active
     DM   .dm-tab.is-active             Mail .mm-tab.is-active
     HRM  .hm-tab.is-active
   Mit foerste gaet (.dm-tabbar__item.is-active osv.) matchede INTET og gav en
   dock helt uden aktiv-markering paa 3 af 5 produkter. */
body.cmx-active .cmx-tabbar__item--active,
body.plm-active .plm-tabbar__item--active,
body.dm-body    .dm-tab.is-active,
body.mm-active  .mm-tab.is-active,
body.hm-active  .hm-tab.is-active{
  background: color-mix(in srgb, var(--accent, #0A84FF) 16%, transparent);
  border-radius: calc(var(--dock-r) - 7px);
}
/* DM's accent bor i --dm-accent, ikke --accent. */
body.dm-body .dm-tab.is-active{
  background: color-mix(in srgb, var(--dm-accent, #7C5CFF) 16%, transparent);
}

/* ── REDUCERET GENNEMSIGTIGHED ─────────────────────────────────────────────
   Nogle brugere slaar gennemsigtighed fra i systemet. Respektér det: solid dock. */
@media (prefers-reduced-transparency: reduce){
  body.cmx-active .cmx-tabbar,
  body.plm-active .plm-tabbar,
  body.dm-body    .dm-tabbar,
  body.mm-active  .mm-tabbar,
  body.hm-active  .hm-tabbar{
    background: var(--dock-surface);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
}