*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0}
:root{padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
[hidden]{display:none!important}
img{max-width:100%}

/* Layout: arbejdsark til venstre, specificeret tilbud + tilbudsbrev til højre (stables på mobil), fast totalbjælke nederst på mobil */
:root{
  --bg:#f2f5f5; --panel:#ffffff; --ink:#1b2526; --muted:#5a6a6b; --line:#dbe3e3;
  --accent:#1f9795; --accent-ink:#ffffff; --soft:#e3f2f1; --neg:#b3402f;
  --paper:#ffffff; --paper-ink:#1b2526; --paper-muted:#667475; --scrim:rgba(15,25,25,.45); --ok-bg:#1d7a46; --ok-ink:#ffffff;
  --display:"Archivo", "Arial Narrow", Arial, sans-serif;
  --body:"Source Sans 3", "Segoe UI", system-ui, sans-serif;
  --mono:"IBM Plex Mono", ui-monospace, Menlo, monospace;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#121919; --panel:#1b2324; --ink:#e6eded; --muted:#97a8a8; --line:#2d3a3b;
  --accent:#3cbab7; --accent-ink:#0f1616; --soft:#1d3433; --neg:#e57a66; --scrim:rgba(0,0,0,.6); --ok-bg:#3fbf76; --ok-ink:#0f1616; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#121919; --panel:#1b2324; --ink:#e6eded; --muted:#97a8a8; --line:#2d3a3b;
  --accent:#3cbab7; --accent-ink:#0f1616; --soft:#1d3433; --neg:#e57a66; --scrim:rgba(0,0,0,.6); --ok-bg:#3fbf76; --ok-ink:#0f1616; color-scheme:dark}
body{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.45}
.wrap{max-width:1180px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-block:20px 110px}
header{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px 16px;margin-bottom:18px}
h1{font-family:var(--display);font-weight:800;font-size:1.7rem;letter-spacing:-.01em;margin:0;text-wrap:balance}
h1 span{color:var(--muted);font-weight:500}
.meta{font-family:var(--mono);font-size:.78rem;color:var(--muted)}
.grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:20px;align-items:start}
@media (max-width:860px){.grid{grid-template-columns:minmax(0,1fr)}}
section.card{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:18px}
h2{font-family:var(--display);font-weight:700;font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 12px}
.stack{display:flex;flex-direction:column;gap:22px}
.fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px 14px}
label.f{display:flex;flex-direction:column;gap:4px;font-size:.9rem;font-weight:600}
input,select{font:inherit;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:9px 10px;min-width:0;width:100%;box-sizing:border-box}
input:focus-visible,select:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
input[type=number]{font-family:var(--mono);text-align:right}
.items{display:flex;flex-direction:column}
.item{display:grid;grid-template-columns:minmax(0,1fr) 110px;gap:10px;align-items:center;padding:10px 0;border-top:1px solid var(--line)}
.item:first-child{border-top:0}
.item .n{font-weight:600}
.item .p{font-family:var(--mono);font-size:.8rem;color:var(--muted)}
.tag{display:inline-block;font-family:var(--mono);font-size:.7rem;background:var(--soft);color:var(--ink);border-radius:4px;padding:1px 6px;margin-left:6px;vertical-align:1px}
.unitbox{position:relative}
.unitbox input{padding-right:38px}
.unitbox i{position:absolute;right:10px;top:50%;transform:translateY(-50%);font-style:normal;font-family:var(--mono);font-size:.78rem;color:var(--muted);pointer-events:none}
.seg{display:flex;flex-wrap:wrap;gap:6px}
.seg button{font:inherit;font-size:.9rem;padding:8px 12px;border-radius:6px;border:1px solid var(--line);background:var(--bg);color:var(--ink);cursor:pointer}
.seg button[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:600}
.hint{font-size:.85rem;color:var(--muted);margin:8px 0 0}
.toggle{display:flex;align-items:center;gap:10px;font-weight:600;cursor:pointer}
.toggle input{width:20px;height:20px;accent-color:var(--accent)}
.extra{display:grid;grid-template-columns:minmax(0,1fr) 80px 110px 36px;gap:8px;margin-bottom:8px}
@media (max-width:480px){.extra{grid-template-columns:minmax(0,1fr) 70px;}.extra .ep{grid-column:1}.extra .del{grid-column:2}}
.btn{font:inherit;font-weight:600;border-radius:6px;padding:9px 14px;cursor:pointer;border:1px solid var(--line);background:var(--panel);color:var(--ink)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.btn:disabled{opacity:.55;cursor:default}
.del{border:1px solid var(--line);background:transparent;color:var(--muted);border-radius:6px;cursor:pointer;font-size:1.1rem}
.offer{position:sticky;top:calc(env(safe-area-inset-top,0px) + 12px)}
.ohead{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.ohead .who{font-weight:600}
.ohead .sm{font-size:.85rem;color:var(--muted)}
.spec{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:.92rem}
th{font-family:var(--display);font-size:.72rem;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);text-align:left;font-weight:700;padding:6px 6px 6px 0;border-bottom:2px solid var(--ink)}
td{padding:8px 6px 8px 0;border-bottom:1px solid var(--line);vertical-align:top}
td.num,th.num{text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap;padding-right:0}
td .sub{display:block;font-size:.78rem;color:var(--muted);font-family:var(--mono)}
tr.disc td{color:var(--neg)}
.totals{margin-top:12px;display:flex;flex-direction:column;gap:4px;font-variant-numeric:tabular-nums}
.totals div{display:flex;justify-content:space-between;gap:12px}
.totals span:last-child{font-family:var(--mono)}
.totals .grand{border-top:2px solid var(--ink);margin-top:6px;padding-top:8px;font-family:var(--display);font-weight:800;font-size:1.25rem}
.totals .grand span:last-child{font-family:var(--display)}
.empty{color:var(--muted);padding:14px 0}
.optlbl{display:inline-flex;align-items:center;gap:6px;margin-top:4px;font-size:.8rem;color:var(--muted);cursor:pointer}
.optlbl input{width:16px;height:16px;accent-color:var(--accent)}
td.opthead{font-family:var(--display);font-size:.72rem;letter-spacing:.07em;text-transform:uppercase;color:var(--ink);background:var(--soft);padding:8px 8px;border-bottom:1px solid var(--line)}
tr.optrow td{background:var(--soft)}
tr.optrow td:first-child{padding-left:8px}
.brevbox{margin-top:18px;padding-top:14px;border-top:1px solid var(--line)}
.actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.note{font-size:.82rem;color:var(--muted);margin-top:10px}
.sample{background:var(--soft);border-radius:6px;padding:8px 12px;font-size:.88rem;display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-bottom:16px}
details summary{cursor:pointer;font-weight:600;margin-top:14px}
/* Forhåndsvisning af brev: et ark papir */
.paper{background:var(--paper);color:var(--paper-ink);border:1px solid var(--line);border-radius:4px;padding:22px 20px;margin-top:10px;font-family:Calibri, Carlito, "Source Sans 3", sans-serif;font-size:.82rem;line-height:1.4;max-height:640px;overflow:auto}
.paper .lh{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;flex-wrap:wrap;margin-bottom:18px}
.paper .lh img{width:170px;height:auto}
.paper .lh small{color:var(--paper-muted);font-size:.72rem;text-align:right}
.paper .title{font-size:1.15rem;font-weight:700;margin:0 0 8px}
.paper .date{text-align:right;margin:0 0 8px}
.paper p{margin:0 0 8px}
.paper .h{font-weight:700;margin:12px 0 4px}
.paper ul{margin:0 0 8px;padding-left:18px}
.paper .row{display:flex;justify-content:space-between;gap:12px;margin:0 0 3px}
.paper .row span:last-child{white-space:nowrap}
.paper .b{font-weight:700}
.medbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 12px;border:1px solid var(--line);background:var(--panel);border-radius:8px;padding:8px 12px;margin-bottom:12px;font-size:.92rem}
.btn.small{padding:5px 10px;font-size:.85rem}
.overlay{position:fixed;inset:0;background:var(--scrim);display:flex;align-items:center;justify-content:center;z-index:20;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.dlg{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:20px;width:100%;max-width:380px;display:flex;flex-direction:column;gap:12px}
.ovhead{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px}
#oversigt table{min-width:640px}
.lnk{font:inherit;font-weight:600;color:var(--accent);background:none;border:0;cursor:pointer;padding:0}
tr.aktiv td{background:var(--soft)}
.erhv[hidden]{display:none!important}
.bar{display:none}
@media (max-width:860px){
  .offer{position:static}
  .bar{display:flex;position:fixed;left:0;right:0;bottom:0;background:var(--ink);color:var(--bg);justify-content:space-between;align-items:center;gap:12px;
    padding-top:12px;padding-bottom:calc(12px + env(safe-area-inset-bottom,0px));padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));z-index:5}
  .bar b{font-family:var(--display);font-size:1.15rem}
  .bar a{color:var(--accent);font-weight:600;text-decoration:none}
}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(80px + env(safe-area-inset-bottom,0px));background:var(--ink);color:var(--bg);padding:8px 14px;border-radius:6px;font-size:.9rem;z-index:9;max-width:90vw}
@media (prefers-reduced-motion:no-preference){.seg button{transition:background .15s}}

/* Tilføjelser til egen server-udgave */
.medknapper{display:flex;gap:6px;flex-wrap:wrap}
.laas{background:var(--soft);border:1px solid var(--accent);border-radius:8px;padding:10px 12px;margin-bottom:12px;font-weight:600}
.dlg.wide{max-width:560px}
.dlg textarea{font:inherit;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:9px 10px;width:100%;box-sizing:border-box;resize:vertical}
.dlg{max-height:calc(100vh - 40px);overflow:auto}
.ovfilter{display:flex;gap:12px;flex-wrap:wrap}
#oversigt table{min-width:760px}
#oversigt td .sub{display:block;font-size:.74rem;color:var(--muted);margin-top:3px;font-family:var(--body)}
.pill{display:inline-block;font-size:.76rem;font-weight:600;border-radius:999px;padding:2px 9px;white-space:nowrap}
.st-kladde{background:var(--line);color:var(--ink)}
.st-sendt{background:var(--soft);color:var(--ink)}
.st-aabnet{background:var(--accent);color:var(--accent-ink)}
.st-ok{background:var(--ok-bg);color:var(--ok-ink)}
.st-fejl{background:var(--neg);color:var(--panel)}
a.lnk{text-decoration:none}
