/* GLOBAL PROPERTY VIEW - moerk premium-stil. Én stilfil for alle moduler. */
:root{
    --pv-skrift: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
               Helvetica, Arial, sans-serif;
  --pv-skrift-tal: ui-monospace, SFMono-Regular, Menlo, monospace;
  --pv-bund:var(--dl-midnat,#060d1a); --pv-flade:rgba(9,18,33,.93); --pv-kant:#2a4468;
  --pv-tekst:var(--dl-blaek-lys,#e8eefb); --pv-svag:#8ba3c7; --pv-blaa:var(--dl-data,#3d8bff);
  --pv-groen:var(--dl-ok,#2fd08a); --pv-gul:var(--dl-obs,#f5b544); --pv-grå:#6b7f9e;
}
.erpv-overlay{position:absolute;inset:0;pointer-events:none;z-index:6}
#erPvLinjer{position:absolute;inset:0;pointer-events:none;z-index:5}

.erpv-chip{position:absolute;pointer-events:auto;cursor:grab;
  background:var(--pv-flade);border:1px solid var(--pv-kant);border-radius:10px;
  padding:8px 8px;min-width:118px;max-width:236px;
  box-shadow:0 10px 28px rgba(0,0,0,.6);user-select:none;
  font-family:'Public Sans',system-ui,sans-serif;
  transition:border-color .12s,box-shadow .12s}
.erpv-chip:hover{border-color:var(--pv-blaa);box-shadow:0 12px 34px rgba(0,0,0,.72)}
.erpv-chip.traek{cursor:grabbing;border-color:var(--pv-blaa);z-index:9}
.erpv-chip .l{font-size:9px;letter-spacing:.7px;text-transform:uppercase;color:var(--pv-svag);font-weight:600}
.erpv-chip .v{font-size:13px;font-weight:700;color:#fff;margin-top:2px;line-height:1.25}
.erpv-chip.uk .v{color:#9fb0c9;font-weight:600}
.erpv-chip .k{font-size:9.5px;color:var(--pv-svag);margin-top:4px;display:flex;align-items:center;gap:4px}
.erpv-chip .m{width:6px;height:6px;border-radius:50%;background:var(--pv-groen);flex:0 0 6px}
.erpv-chip.be .m{background:var(--pv-blaa)}
.erpv-chip.uk .m{background:var(--pv-grå)}
.erpv-chip .mere{display:none;margin-top:8px;padding-top:8px;border-top:1px solid #22395a;
  font-size:10.5px;color:#9fb0c9;line-height:1.5}
.erpv-chip.aaben .mere{display:block}
.erpv-chip .luk{position:absolute;top:3px;right:6px;color:#5f739a;font-size:13px;
  cursor:pointer;line-height:1;display:none}
.erpv-chip:hover .luk{display:block}

.erpv-stempel{position:absolute;right:18px;top:18px;z-index:8;display:flex;align-items:center;gap:8px;
  background:var(--pv-flade);border:1px solid var(--pv-kant);border-radius:10px;padding:8px 12px;
  font-family:'Public Sans',system-ui,sans-serif}
.erpv-stempel b{font-size:11.5px;letter-spacing:.5px;color:#fff}
.erpv-stempel span{font-size:10.5px;color:var(--pv-svag)}
.erpv-stempel i{width:8px;height:8px;border-radius:50%;display:block}
.erpv-ver i{background:var(--pv-groen)}
.erpv-gen i{background:var(--pv-blaa)}
.erpv-est i{background:var(--pv-gul)}

.erpv-panel{position:absolute;left:18px;top:106px;z-index:8;display:flex;flex-direction:column;max-height:calc(100% - 124px);overflow-y:auto;overscroll-behavior:contain;padding-right:4px;
  gap:8px;width:198px;font-family:'Public Sans',system-ui,sans-serif}
.erpv-panel .kasse{background:var(--pv-flade);border:1px solid var(--pv-kant);border-radius:10px;padding:8px}
.erpv-panel .titel{font-size:9px;letter-spacing:.8px;text-transform:uppercase;color:var(--pv-svag);
  font-weight:700;margin:0 0 8px 2px}
.erpv-panel button{display:block;width:100%;text-align:left;background:transparent;border:0;
  color:#c3d2e8;font:inherit;font-size:11.5px;padding:8px 8px;border-radius:10px;cursor:pointer}
.erpv-panel button:hover{background:#132842}
.erpv-panel button.on{background:var(--pv-blaa);color:#fff;font-weight:600}
.erpv-panel .lagknap{display:flex;align-items:center;justify-content:space-between}
.erpv-panel .prik{width:7px;height:7px;border-radius:50%;background:var(--pv-kant)}
.erpv-panel button.on .prik{background:#fff}

.erpv-ingen-kort{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  text-align:center;padding:24px;color:var(--pv-svag);font-size:12.5px;line-height:1.6;
  font-family:'Public Sans',system-ui,sans-serif}

/* --- Draw & Analyse: faelles tegne- og maalepanel --- */
.ertegn-panel{position:absolute;right:18px;bottom:18px;z-index:9;width:250px;
  background:var(--pv-flade);border:1px solid var(--pv-kant);border-radius:10px;padding:8px;
  font-family:'Public Sans',system-ui,sans-serif;box-shadow:0 12px 32px rgba(0,0,0,.55)}
.ertegn-knapper{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:8px}
.ertegn-knapper button{flex:1 1 auto;background:transparent;border:1px solid var(--pv-kant);
  color:#c3d2e8;font:inherit;font-size:11px;padding:8px 8px;border-radius:10px;cursor:pointer}
.ertegn-knapper button:hover{background:#132842}
.ertegn-knapper button.on{background:var(--pv-groen);border-color:var(--pv-groen);color:#04241a;font-weight:700}
.ertegn-tal>div{display:flex;justify-content:space-between;align-items:baseline;
  padding:4px 2px;border-top:1px solid #1b2f4c}
.ertegn-tal .l{font-size:9px;letter-spacing:.7px;text-transform:uppercase;color:var(--pv-svag);font-weight:600}
.ertegn-tal .v{font-size:13px;font-weight:700;color:#fff}
.ertegn-kilde{margin-top:8px;padding-top:8px;border-top:1px solid #1b2f4c;
  font-size:9.5px;color:var(--pv-svag);line-height:1.5}

/* --- Kort, Plan & Byg: faelles kortlagspanel --- */
.erkl-panel{position:absolute;right:18px;bottom:18px;z-index:9;width:266px;max-height:62vh;overflow-y:auto;overscroll-behavior:contain;
  overflow:auto;background:var(--pv-flade);border:1px solid var(--pv-kant);border-radius:10px;
  padding:8px;font-family:'Public Sans',system-ui,sans-serif;box-shadow:0 12px 32px rgba(0,0,0,.55)}
.erkl-panel .titel{font-size:9px;letter-spacing:.8px;text-transform:uppercase;
  color:var(--pv-svag);font-weight:700;margin:0 0 8px 2px}
.erkl-skel{font-size:9px;letter-spacing:.8px;text-transform:uppercase;color:var(--pv-gul);
  font-weight:700;margin:8px 0 4px 2px}
.erkl-lag{border-top:1px solid #1b2f4c;padding:8px 0}
.erkl-knap{display:flex;width:100%;align-items:center;justify-content:space-between;gap:8px;
  background:transparent;border:0;color:#c3d2e8;font:inherit;font-size:11.5px;
  padding:4px 4px;border-radius:10px;cursor:pointer;text-align:left}
.erkl-knap:hover:not(:disabled){background:#132842}
.erkl-knap:disabled{cursor:not-allowed;color:#7f8ea6}
.erkl-knap .prik{width:7px;height:7px;border-radius:50%;background:var(--pv-kant);flex:0 0 7px}
.erkl-lag.on .erkl-knap .prik{background:var(--pv-gul)}
.erkl-lag.vent .erkl-knap .prik{background:transparent;border:1px dashed #5f739a}
.erkl-lag .k{font-size:9.5px;color:var(--pv-svag);padding:0 4px}
.erkl-lag .besked{font-size:9.5px;color:#9fb0c9;line-height:1.5;padding:4px 4px 0}
.erkl-lag.tom .besked{color:var(--pv-gul)}

/* --- Noegletal og grafer --- */
.erkpi-panel{font-family:'Public Sans',system-ui,sans-serif}
.erkpi-panel .titel{font-size:9px;letter-spacing:.8px;text-transform:uppercase;
  color:var(--pv-svag);font-weight:700;margin:0 0 8px 2px}
.erkpi-kort-raekke{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px;
  font-size:12px;color:var(--pv-svag)}
.erkpi-kort{flex:1 1 168px;min-width:168px;background:var(--pv-flade);
  border:1px solid var(--pv-kant);border-radius:10px;padding:12px 12px}
.erkpi-kort .l{font-size:9px;letter-spacing:.7px;text-transform:uppercase;
  color:var(--pv-svag);font-weight:600}
.erkpi-kort .v{font-size:21px;font-weight:700;color:#fff;margin-top:4px;line-height:1.2;
  font-variant-numeric:proportional-nums}
.erkpi-kort.uk .v{font-size:15px;color:#9fb0c9;font-weight:600}
.erkpi-kort .k{font-size:9.5px;color:var(--pv-svag);margin-top:8px;
  display:flex;align-items:center;gap:4px}
.erkpi-kort .m{width:6px;height:6px;border-radius:50%;background:var(--pv-groen);flex:0 0 6px}
.erkpi-kort.be .m{background:var(--pv-blaa)}
.erkpi-kort.uk .m{background:#6b7f9e}
.erkpi-kort .s{font-size:9px;color:#7f8ea6;margin-top:4px;line-height:1.5}
.erkpi-graf{background:var(--pv-flade);border:1px solid var(--pv-kant);
  border-radius:10px;padding:12px 12px}
.erkpi-svg{width:100%;height:auto;display:block}
.erkpi-tick{fill:var(--pv-svag);font-size:7.5px;
  font-family:'Public Sans',system-ui,sans-serif;font-variant-numeric:tabular-nums}
.erkpi-top{fill:var(--pv-tekst);font-size:8.5px;font-weight:700;
  font-family:'Public Sans',system-ui,sans-serif}
.erkpi-ram{cursor:default}
.erkpi-tom{font-size:11px;color:var(--pv-gul);line-height:1.6;padding:8px 2px}
.erkpi-vis-tabel{margin-top:8px;background:transparent;border:1px solid var(--pv-kant);
  color:#c3d2e8;font:inherit;font-size:10.5px;padding:4px 8px;border-radius:10px;cursor:pointer}
.erkpi-vis-tabel:hover{background:#132842}
.erkpi-tabel{width:100%;margin-top:8px;border-collapse:collapse;font-size:11px;color:#c3d2e8}
.erkpi-tabel caption{text-align:left;font-size:9px;letter-spacing:.7px;
  text-transform:uppercase;color:var(--pv-svag);font-weight:700;padding-bottom:4px}
.erkpi-tabel th,.erkpi-tabel td{border-top:1px solid #1b2f4c;padding:4px 2px;text-align:left}
.erkpi-tabel td:last-child,.erkpi-tabel th:last-child{text-align:right;
  font-variant-numeric:tabular-nums}
.erkpi-vaelg{display:flex;gap:4px;margin:0 0 8px 0}
.erkpi-vaelg button{background:transparent;border:1px solid var(--pv-kant);color:#c3d2e8;
  font:inherit;font-size:11px;padding:4px 8px;border-radius:10px;cursor:pointer}
.erkpi-vaelg button:hover{background:#132842}
.erkpi-vaelg button.on{background:var(--pv-blaa);border-color:var(--pv-blaa);color:#fff;font-weight:600}

/* --- Valgt raekke i en liste der fodrer de faelles komponenter --- */
.erbfe-valgt {
  outline: 2px solid var(--pv-blaa);
  outline-offset: -2px;
  background: rgba(61,139,255,.10);
}

/* ================= Faelles visuelle former (er_visuel.js) ================= */
.ervis-blok{background:var(--pv-flade);border:1px solid var(--pv-kant);border-radius:10px;
  padding:12px 16px;margin:12px 0;color:var(--pv-tekst)}
.ervis-titel{font-size:13px;font-weight:600;letter-spacing:.2px;margin-bottom:8px}
.ervis-tom{font-size:12.5px;color:var(--pv-svag);line-height:1.5}
.ervis-note{font-size:12px;color:var(--pv-svag);margin-top:8px;line-height:1.5}
.ervis-kilde{font-size:11px;color:var(--pv-svag);margin-top:8px;
  border-top:1px solid var(--pv-kant);padding-top:8px}

/* Skala */
.ervis-skala{display:flex;flex-wrap:wrap;gap:4px}
.ervis-trin{flex:1 1 auto;min-width:34px;text-align:center;font-size:12px;padding:8px 4px;
  border:1px solid var(--pv-kant);border-radius:6px;color:var(--pv-svag);background:transparent}
.ervis-trin.paa{background:var(--pv-blaa);border-color:var(--pv-blaa);color:#02101f;font-weight:700}

/* Fremdrift */
.ervis-fremdrift{display:flex;flex-direction:column;gap:8px}
.ervis-raekke{display:grid;grid-template-columns:minmax(90px,28%) 1fr auto;gap:8px;align-items:center}
.ervis-mrk{font-size:12px;color:var(--pv-svag);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ervis-spor{background:rgba(255,255,255,.05);border-radius:6px;height:14px;overflow:hidden}
.ervis-baand{display:block;height:100%;max-height:24px;background:var(--pv-blaa);border-radius:0 6px 6px 0}
.ervis-tal{font-size:12px;font-variant-numeric:tabular-nums;text-align:right}

/* Kortliste */
.ervis-kort{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px}
.ervis-kortelement{border:1px solid var(--pv-kant);border-radius:10px;overflow:hidden;
  background:rgba(255,255,255,.02);display:flex;flex-direction:column}
.ervis-billede{width:100%;height:104px;object-fit:cover;display:block}
.ervis-intetbillede{height:104px;display:flex;align-items:center;justify-content:center;
  font-size:11px;color:var(--pv-svag);background:rgba(255,255,255,.03);text-align:center;padding:0 8px}
.ervis-kortkrop{padding:8px 12px;display:flex;flex-direction:column;gap:4px}
.ervis-korttitel{font-size:12.5px;font-weight:600;line-height:1.35}
.ervis-kortunder{font-size:11.5px;color:var(--pv-svag)}
.ervis-chip{align-self:flex-start;font-size:10.5px;padding:2px 8px;border-radius:999px;
  border:1px solid var(--pv-kant);color:var(--pv-svag)}
.ervis-groen{color:var(--pv-groen);border-color:var(--pv-groen)}
.ervis-gul{color:var(--pv-gul);border-color:var(--pv-gul)}
.ervis-blaa{color:var(--pv-blaa);border-color:var(--pv-blaa)}

@media (max-width:640px){
  .ervis-raekke{grid-template-columns:1fr auto;grid-template-areas:"m t" "s s"}
  .ervis-mrk{grid-area:m}.ervis-tal{grid-area:t}.ervis-spor{grid-area:s}
  .ervis-kort{grid-template-columns:1fr 1fr}
}

/* ================= Faelles sidechrome for de deklarative skaerme ========= */
body.er-krop{margin:0;background:var(--pv-bund);color:var(--pv-tekst);
  font:15px/1.5 var(--pv-skrift);-webkit-font-smoothing:antialiased}
.er-top{padding:16px 16px 12px;border-bottom:1px solid var(--pv-kant)}
.er-top h1{margin:0;font-size:19px;font-weight:650;letter-spacing:-.2px}
.er-sub{display:block;margin-top:4px;font-size:12px;color:var(--pv-svag)}
.er-side{max-width:1180px;margin:0 auto;padding:16px 16px 48px}
.er-vaelg{display:flex;flex-wrap:wrap;gap:8px;align-items:end;margin:8px 0 4px}
.er-vaelg label{font-size:12px;color:var(--pv-svag);display:block;margin-bottom:4px}
.er-vaelg input{background:var(--pv-flade);border:1px solid var(--pv-kant);border-radius:10px;
  color:var(--pv-tekst);padding:8px 12px;font-size:13.5px;min-width:190px}
.er-vaelg input:focus{outline:2px solid var(--pv-blaa);outline-offset:1px;border-color:var(--pv-blaa)}
.er-hjaelp{font-size:12px;color:var(--pv-svag);margin:2px 0 8px;line-height:1.5}
.er-kort3d{height:380px;border:1px solid var(--pv-kant);border-radius:10px;overflow:hidden;margin:12px 0}
@media (max-width:640px){
  .er-side{padding:12px 12px 32px}
  .er-top{padding:12px 12px 8px}
  .er-kort3d{height:280px}
}
.ervis-vaelg{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
.ervis-vaelg button{background:transparent;border:1px solid var(--pv-kant);color:var(--pv-svag);
  border-radius:999px;padding:4px 12px;font-size:11.5px;cursor:pointer}
.ervis-vaelg button.on{background:var(--pv-blaa);border-color:var(--pv-blaa);color:#02101f;font-weight:600}

/* --- Smal flade -------------------------------------------------
   Under 820 px er der ikke plads til at holde datakortene fri af
   hinanden. Saa flyder de ikke: billedet faar sin egen hoejde,
   betjeningen laegger sig under det, og datakortene stiller sig i
   en liste. Intet ligger oven i hinanden, og billedet staar frit. */
.erpv-smal{display:flex;flex-direction:column;
  height:auto !important;min-height:0 !important;overflow:visible !important}
.erpv-smal [data-erpv-kort]{order:1;position:relative !important;
  inset:auto !important;height:240px;border-radius:10px;overflow:hidden}
.erpv-smal #erPvLinjer{display:none}
.erpv-smal .erpv-panel{order:2;position:static !important;
  left:auto !important;top:auto !important;max-height:none !important;
  overflow:visible !important;padding-right:0;
  flex-direction:row;flex-wrap:wrap;gap:8px;margin-top:8px}
.erpv-smal .erpv-panel .kasse{flex:1 1 160px}
.erpv-smal .erpv-overlay{order:3;position:static;pointer-events:auto;
  display:flex;flex-direction:column;gap:8px;margin-top:8px}
.erpv-smal .erpv-chip{position:static !important;
  left:auto !important;top:auto !important;width:100%;
  box-sizing:border-box;cursor:default}
.erpv-smal .erpv-chip .luk{display:none}
.erpv-smal .erpv-stempel{order:4;position:static !important;
  margin-top:8px;align-self:flex-start}

/* --- Smal flade: kortlags- og tegnepanelet skal ogsaa flyde ------
   Reglen ovenfor lader datakortene stille sig i en liste under
   billedet. Kortlagspanelet (.erkl-panel) og tegnepanelet kom til
   senere og blev staaende absolut i hoejre side - derfor laa de
   oven i datakortene paa telefon. Her foelger de samme regel:
   de flyder med i listen. Kun geometri - ingen farver, intet
   fjernet. */
.erpv-smal .erkl-panel,.erpv-smal .ertegn-panel{order:5;
  position:static !important;left:auto !important;right:auto !important;
  bottom:auto !important;top:auto !important;width:auto !important;
  max-height:none !important;overflow:visible !important;margin-top:8px}
