/* wf-plan.css – Aprikos Workforce stage 1: «Dagens plan» on the Overview (wf-plan.js, window.WFPLAN).
   Builds on workspace.css (.ws-sec, .ws-row, .ws-actd, .ws-chip, .ws-empty …) and the tokens of workforce.css; every token has a
   fallback so the page also reads without them. Own classes are prefixed wfp-. No horizontal scroll at 375 px.
   Overview v2 (OVERVIEW2-SPEC, Omer 2026-10-02): «Dagens plan» as groups (.wfp-grp), «Timeplan» (.wfp-day) and the «Ordre» card
   (.wfp-ord, one line until opened) in the right column.
   Calmer Overview (Omer 2026-10-05 «Ja, som skissen» – scratchpad ovw/design/overview-mock.html): the hero is ONE band (greeting · figures),
   no chip row, every plan row is ONE line on ONE shared grid (name · context · due badge · the main button in a fixed column · «⋯»), the
   tenders are one line, «I går» and «Oppdatert» one strip. The right column (Timeplan + Ordre) is unchanged. */

/* the plan replaces the old greeting and the two-column A/B/C/D grid; without wf-plan.js the old page shows as before */
.ws-hello:has(+ .ws-home .wfp){display:none}
.ws-home .wfp{grid-column:1/-1;min-width:0}
.wfp{display:flex;flex-direction:column;gap:10px;min-width:0}
.wfp :focus-visible{outline:2px solid var(--focus,var(--deeper,#0A2E2F));outline-offset:2px}
/* site.css:478 `.ad-body section{padding:0;margin:0}` strips the cards – own padding, independent of workforce.css */
.ad-body .wfp section.ws-sec{padding:14px 16px}
.wfp .muted{margin:4px 0;color:var(--muted,#4E6868);font-size:.84rem;line-height:1.45}
.wfp .ws-actd p{font-size:.88rem}
.wfp-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---- hero (Calmer Overview, Omer 2026-10-05): ONE band – the date and the greeting on the left, the five sales figures on the right (the
   label, then the figure with its amount beside it); the focus line only when a focus is set; no chip row, no «Kom i gang» banner ---- */
.wfp-hero{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 24px;min-height:52px}
.wfp-hello{flex:1 1 220px;min-width:0}
.wfp-hello small{display:block;font-family:Jost,system-ui,sans-serif;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--deep,#12494B);line-height:1.3;margin-bottom:2px}
.wfp-hello h2{margin:0;font-size:clamp(1.35rem,2vw,1.6rem);line-height:1.12;overflow-wrap:anywhere}
/* the focus line under the greeting: one line – the text gives way (full text on hover), «Rediger fokus» stays */
.wfp-focus{margin:0;color:var(--muted,#4E6868);font-size:.84rem;line-height:1.4}
.wfp-focus .ws-more{margin:0 0 0 6px;padding:0}
.wfp-hello .wfp-focus{display:flex;align-items:baseline;gap:6px;margin:3px 0 0;white-space:nowrap}
.wfp-hello .wfp-focus span{min-width:0;overflow:hidden;text-overflow:ellipsis}
.wfp-hello .wfp-focus .ws-more{flex:none;margin:0}
.wfp-hello .wfp-coverl{white-space:normal}
.wfp-coverl{color:var(--warn-ink,#7A4A07)}
.wfp-home{margin:0;padding:0;border:0;background:none;font:inherit;color:inherit;text-align:left;cursor:pointer}
.wfp-home:hover{color:var(--deeper,#1B6E70);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:6px}
/* the figures: each tile as wide as its content (the label never reaches the edge), two lines */
.wfp-kpis{flex:0 1 auto;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px;min-width:0}
.wfp-kpi{flex:0 0 auto;display:flex;flex-direction:column;align-items:flex-start;gap:1px;min-width:108px;padding:5px 12px 6px;border:1px solid var(--line,#D9E6E6);border-radius:var(--r-m,12px);background:#fff;box-shadow:var(--sh-card,0 1px 2px rgba(10,46,47,.03));font:inherit;text-align:left;color:var(--darkest,#0A2E2F);cursor:pointer;transition:border-color .15s,box-shadow .15s}
.wfp-kpi span{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;font-family:Jost,system-ui,sans-serif;font-size:10px;font-weight:600;letter-spacing:.045em;line-height:1.3;text-transform:uppercase;color:var(--muted,#4E6868);white-space:nowrap}
.wfp-kpi strong{display:flex;align-items:baseline;gap:6px;font-family:Jost,system-ui,sans-serif;font-size:1.15rem;font-weight:600;line-height:1.15;color:var(--darkest,#0A2E2F)}
.wfp-kpi strong small{font-family:"Source Sans 3",system-ui,sans-serif;font-size:.74rem;font-weight:500;line-height:1;color:var(--muted,#4E6868);white-space:nowrap}
.wfp-kpi:not(:disabled):hover{border-color:var(--deep,#1F7F81);box-shadow:0 6px 18px rgba(10,46,47,.08)}
.wfp-kpi:disabled{cursor:default}
.wfp-kpi[data-k="today"]{background:linear-gradient(160deg,#0A2E2F,#12494B 70%,#155B5D);border-color:transparent}
.wfp-kpi[data-k="today"] span{color:#9FE6E8}
.wfp-kpi[data-k="today"] strong{color:#fff}
.wfp-kpi[data-k="today"] strong small{color:#CFE8E8}
.wfp-kpi[data-k="today"]:focus-visible{outline-color:var(--deeper,#1B6E70)}
.wfp-x{flex:none;width:30px;height:30px;border:0;border-radius:8px;background:none;color:var(--muted,#4E6868);font-size:1.2rem;line-height:1;cursor:pointer}
.wfp-x:hover{background:#fff}

/* ---- layout (OVERVIEW2-SPEC §1): «Dagens plan» | «Timeplan» + «Ordre»; the right column 340–420 px, 300 px at 1100–1279, one column below ---- */
.wfp-grid{display:grid;grid-template-columns:minmax(0,1fr) clamp(340px,30%,420px);gap:14px;align-items:start}
/* the rows adapt to the width of the plan column (container query), not to the window: a folded or unfolded menu changes it too */
.wfp-plan{container:wfplan / inline-size}
.wfp-side{display:flex;flex-direction:column;gap:8px;min-width:0}
.wfp-card .ws-h{margin-bottom:6px}
.wfp-card .ws-h h3{font-size:.95rem}
/* the cards beside the plan are a little tighter, and «Alle … →» sits on the title line (wfp-hl) */
.ad-body .wfp-side section.ws-sec{padding:10px 14px}
.wfp-side .wfp-card .ws-h{margin-bottom:4px}
.wfp-card .ws-h.wfp-hl{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:2px 10px}
.wfp-hl h3{min-width:0}
.wfp-hl>.wfp-all{flex:none;margin:0 0 0 auto;padding:0;font-size:.8rem;white-space:nowrap}
/* the order lists and the «Viser 5 av n» / «Vis alle» line under a card */
.wfp-olist{list-style:none;margin:0;padding:0}
.wfp-olist li{display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:8px;padding:4px 0;border-top:1px solid var(--line,#D9E6E6);font-size:.82rem}
.wfp-olist li:first-child{border-top:0}
.wfp-olist time{color:var(--muted,#4E6868);font-size:.76rem;white-space:nowrap}
.wfp-olist .wfp-fb b,.wfp-olist .wfp-fb small{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.wfp-cf{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:0 14px}
.wfp-cf .ws-more{margin-top:3px;padding:2px 0;font-size:.8rem}
/* «Vis alle (n)» (it has aria-expanded) at the left, a link to another page («Alle ordre →») at the right */
.wfp-cf>.wfp-all:not([aria-expanded]){margin-left:auto}
.wfp-skel{height:44px;border-radius:12px;background:linear-gradient(90deg,var(--bg-soft,#F5FAFA) 25%,#EAF3F3 50%,var(--bg-soft,#F5FAFA) 75%);background-size:200% 100%;animation:wfp-sk 1.4s ease-in-out infinite}
@keyframes wfp-sk{0%{background-position:200% 0}100%{background-position:-200% 0}}

/* ---- plan header: ONE line – «Dagens plan» · the scope as one segmented control (only «Mine» shows its count) · «Vis alt …» (only with a
   focus) · «← Tilbake til oversikt» while filtered · «n forfalt» «n godkjenninger» as small filters · «+ HubSpot-oppgave» ---- */
.wfp-ph{margin-bottom:4px}
.wfp-ph1{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px}
.wfp-ph1 h3{margin:0 4px 0 0;font-size:1.05rem}
.wfp-ro{display:inline-block;margin-left:8px;padding:2px 8px;border-radius:999px;background:var(--bg-soft,#F5FAFA);color:var(--muted,#4E6868);font-family:Jost,system-ui,sans-serif;font-size:.72rem;font-weight:600;vertical-align:middle}
.wfp-tabs{display:inline-flex;align-items:center;gap:0;padding:2px;border:1px solid var(--line,#D9E6E6);border-radius:999px;background:var(--bg-soft,#F5FAFA)}
.wfp-tab{min-height:24px;padding:0 11px;border:0;border-radius:999px;background:none;font:inherit;font-size:.78rem;color:var(--deeper,#0A2E2F);cursor:pointer;white-space:nowrap}
.wfp-tab:hover{color:var(--darkest,#0A2E2F)}
.wfp-tab.on{background:#fff;box-shadow:0 1px 3px rgba(10,46,47,.14);color:var(--darkest,#0A2E2F);font-weight:600}
.wfp-tab b{margin-left:4px;font-family:Jost,system-ui,sans-serif}
.wfp-sw{display:inline-flex;align-items:center;gap:6px;font-size:.78rem;color:var(--muted,#4E6868);cursor:pointer}
.wfp-sp{flex:1 1 0}
.wfp-fch{display:inline-flex;flex-wrap:wrap;gap:6px}
.wfp-fch:empty{display:none}
.wfp-chip{border:1px solid transparent;cursor:pointer;font:inherit;font-size:.84rem;padding:5px 11px}
.wfp-ph1 .wfp-chip{display:inline-flex;align-items:baseline;gap:4px;min-height:26px;padding:3px 10px;border:1px solid var(--line,#D9E6E6);border-radius:999px;background:#fff;font-size:.78rem;color:var(--muted,#4E6868);white-space:nowrap}
.wfp-ph1 .wfp-chip b{font-family:Jost,system-ui,sans-serif;color:var(--deeper,#0A2E2F)}
.wfp-ph1 .wfp-chip.bad{border-color:#F3C9C4;background:#FDF5F4}
.wfp-ph1 .wfp-chip.bad b{color:#A32A22}
.wfp-ph1 .wfp-chip:hover{border-color:var(--deep,#1F7F81)}
.wfp-ph1 .wfp-chip.on{border-color:var(--deeper,#0A2E2F);background:var(--deeper,#0A2E2F);color:#fff}
.wfp-ph1 .wfp-chip.on b{color:#fff}
.wfp-back{padding:2px;border:0;background:none;color:var(--deeper,#1B6E70);font-family:Jost,system-ui,sans-serif;font-weight:600;font-size:.8rem;cursor:pointer;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.wfp-back:hover{color:var(--darkest,#0A2E2F)}
/* a 1280 laptop (plan ≈ 575–606 px): the header stays ONE line – tighter segments and filters */
@container wfplan (max-width:640px){ .wfp-ph1{gap:6px} .wfp-ph1 h3{margin-right:2px} .wfp-tab{padding:0 8px} .wfp-ph1 .wfp-chip{padding:3px 8px} }
.wfp-ai{margin:4px 0 8px;padding:10px 12px;border-radius:var(--r-m,12px);background:#EEF7F7;border:1px solid #CFE6E6;font-size:.86rem}
.wfp-ai ol{margin:6px 0;padding-left:20px}
.wfp-ai em,.wfp-blk em{font-style:normal;color:var(--muted,#4E6868);font-size:.78rem}
.wfp-aim{margin:4px 0 8px}

/* ---- timeline ---- */
.wfp-tl{display:flex;flex-direction:column}
.wfp-blk{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 8px;margin:8px 0 0;padding:0;border:0;background:none;font-family:Jost,system-ui,sans-serif;font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--deep,#12494B);text-align:left}
.wfp-blk:first-child{margin-top:2px}
.wfp-blk.bad{color:#A32A22}
.wfp-blk em{letter-spacing:0;text-transform:none}
.wfp-blk em.wfp-free{white-space:nowrap}
.wfp-lt{width:100%;cursor:pointer;min-height:28px;align-items:center}
.wfp-lt:hover b{text-decoration:underline}
.wfp-blk em.wfp-hid{font-weight:600;color:var(--deep,#12494B)}
.wfp-blk.bad em.wfp-hid{color:#A32A22}
.wfp-later{margin-top:4px;padding-top:2px;border-top:1px solid var(--line,#D9E6E6)}
.wfp-mt{display:flex;flex-wrap:wrap;align-items:center;gap:2px 10px;margin:4px 0;padding:4px 10px;border-radius:10px;background:var(--bg-soft,#F5FAFA);border-left:3px solid var(--deep,#12494B);font-size:.84rem;min-height:32px}
.wfp-mt.ext{border-left-color:#3AC0C3}
.wfp-mt.past{color:var(--muted,#4E6868);border-left-color:#B9CFCF}
.wfp-mt.past .wfp-mtt{font-weight:500}
.wfp-mtt{font-family:Jost,system-ui,sans-serif;font-weight:600;white-space:nowrap}
.wfp-mts{flex:1 1 180px;min-width:0;overflow-wrap:anywhere}
.wfp-mts em{font-style:normal;color:var(--muted,#4E6868);font-size:.78rem}
.wfp-mt .btn{padding:2px 12px;font-size:12px}
.wfp-ol{color:var(--deep,#12494B);font-size:.8rem}
.wfp-slot{margin:0 0 2px;padding:1px 12px;color:var(--muted,#4E6868);font-size:.78rem}
.wfp-allday{margin:4px 0 0;color:var(--muted,#4E6868);font-size:.8rem}
.wfp-past summary{cursor:pointer;color:var(--muted,#4E6868);font-size:.8rem;padding:2px 0}
.wfp-note{margin:6px 0;padding:6px 10px;border-radius:10px;background:var(--bg-soft,#F5FAFA);color:var(--muted,#4E6868);font-size:.82rem;line-height:1.45}
.wfp-note.bad{background:#FBE7E5;color:#A32A22}
.wfp-note .btn{margin-left:6px;padding:3px 12px}
/* review 2026-10-01: which of the plan's sources are still loading or could not be read (never a false ✓ or 0) */
.wfp-srcst{margin:4px 0 6px;padding:5px 10px;border-radius:10px;background:var(--bg-soft,#F5FAFA);color:var(--muted,#4E6868);font-size:.78rem;line-height:1.4}
.wfp-srcst.bad{background:#FBE7E5;color:#A32A22}

/* ---- rows: ONE line on ONE grid (Calmer Overview, Omer 2026-10-05 «juster knappene»): sev · [name · context] · due badge · the main
   button (area «go» – the same x, width and height on every row whatever its label) · «⋯». .wfp-acts is display:contents, so its
   children sit in the grid's go / more cells. The kind is visually hidden (screen readers and the tooltip keep it); «Hvorfor» is in the
   tooltip and the «⋯» panel. A HubSpot confirmation is a second line (cfl), the panel a third (det). ---- */
.wfp .wfp-row{grid-template-columns:10px minmax(0,1fr) 84px 120px 32px;grid-template-areas:"sev l1 due go more";align-items:center;column-gap:12px;row-gap:0;
  min-height:40px;padding:3px 0;box-sizing:border-box;outline-offset:-2px}
.wfp .wfp-row.ws-open{grid-template-areas:"sev l1 due go more" ". det det det det"}
.wfp .wfp-row.wfp-cfm{grid-template-areas:"sev l1 due go more" ". cfl cfl cfl cfl"}
.wfp .wfp-row.wfp-cfm.ws-open{grid-template-areas:"sev l1 due go more" ". cfl cfl cfl cfl" ". det det det det"}
.wfp-row>.ws-sev{grid-area:sev}
.wfp-row:focus{background:#F2F9F9}
.wfp-row.wfp-prep{box-shadow:inset 2px 0 0 #3AC0C3}
.wfp-l1{grid-area:l1;display:flex;align-items:baseline;gap:8px;min-width:0;overflow:hidden;white-space:nowrap}
.wfp-l1 .wfp-kind{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wfp-tg{flex:none;display:inline-block;padding:0 7px;border-radius:999px;font-family:Jost,system-ui,sans-serif;font-size:.68rem;font-weight:600;line-height:1.6}
.wfp-tg.prep{background:#E3F6F6;color:#0F5E60}
.wfp-tg.cov{background:#FDF1E0;color:var(--warn-ink,#7A4A07)}
/* the name keeps its room (up to its own width), the context gives way first */
.wfp-t{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;font-family:Jost,system-ui,sans-serif;font-weight:600;font-size:.92rem;line-height:1.35;color:var(--deeper,#0A2E2F)}
.wfp-cx{flex:0 100000 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;color:var(--muted,#4E6868);font-size:.82rem;line-height:1.35}
.wfp-cx .wfp-lnk{font-size:.82rem}
.wfp-due{grid-area:due;justify-self:end;max-width:100%;overflow:hidden;text-overflow:ellipsis;padding:1px 8px;border-radius:999px;background:#EEF3F3;color:var(--deep,#12494B);font-family:Jost,system-ui,sans-serif;font-size:.72rem;font-weight:600;line-height:1.55;white-space:nowrap;box-sizing:border-box}
.wfp-due.late{background:#FBE7E5;color:#A32A22}
.wfp-due.none{padding:0;background:none}
.wfp-acts{display:contents}
.wfp-acts>.wfp-go,.wfp-acts>.wfp-acg{grid-area:go;min-width:0}
.wfp-acts>.wfp-acg{display:block}
/* ONE button style in ONE column: the same outline, width and height on every row (severity is the dot) */
.wfp .wfp-acts .wfp-go{display:block;width:100%;box-sizing:border-box;margin:0;padding:5px 8px;border:1px solid var(--deep,#12494B);background:#fff;color:var(--deeper,#0A2E2F);font-size:12.5px;line-height:1.3;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-shadow:none;transform:none}
.wfp .wfp-acts .wfp-go:hover{background:var(--bg-soft,#F5FAFA);box-shadow:none;transform:none}
.wfp-more{grid-area:more;justify-self:end;flex:none;width:32px;height:32px;padding:0;border:1px solid transparent;border-radius:8px;background:none;color:var(--deep,#12494B);font-size:1.15rem;font-weight:700;line-height:1;cursor:pointer}
.wfp-more:hover,.wfp-more[aria-expanded="true"]{border-color:var(--line,#D9E6E6);background:var(--bg-soft,#F5FAFA)}
.wfp-row .wfp-det{grid-area:det;margin:6px 0 6px}
/* «Fullføre … i HubSpot?» · «Ja, fullfør» «Avbryt» – under the row (the two buttons do not fit the go column) */
.wfp-cfl{grid-area:cfl;display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;margin:2px 0 4px}
.wfp-cfl .wfp-acg{display:inline-flex;align-items:center;gap:4px}
.wfp-cfl .wfp-acg .btn{padding:4px 12px;font-size:12.5px}
.wfp-dsub{margin:0 0 6px;color:var(--deeper,#0A2E2F);font-weight:500}
.wfp-dm{color:var(--muted,#4E6868);font-size:.82rem!important}
.wfp-dm .none{font-style:italic}
.wfp-det .muted{color:var(--muted,#4E6868)}
.wfp-srcl{font-size:.78rem}
.wfp-cover b{color:var(--warn-ink,#7A4A07)}
.wfp-parts{margin:4px 0 8px;padding-left:18px;font-size:.84rem}
.wfp-tag{display:inline-block;padding:1px 7px;border-radius:999px;background:#E6F4F4;color:#12494B;font-size:.72rem;font-weight:600;white-space:nowrap}

/* ---- the expanded meeting's customer (.wfp-nx), the customer card and the activity drawer ---- */
.wfp-org{margin:4px 0 2px;font-size:.9rem;line-height:1.35}
.wfp-org small{color:var(--muted,#4E6868);font-size:.76rem}
.wfp-facts{margin:2px 0 0;color:var(--deeper,#0A2E2F);font-size:.82rem;line-height:1.45}
.wfp-facts span[title]{cursor:help}
.wfp-nb{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin-top:6px}
.wfp-nb .btn{padding:5px 14px}
.wfp-lks{font-size:.8rem;color:var(--muted,#4E6868)}
.wfp-lks a,.wfp-lnk{color:var(--deep,#12494B);font:inherit;font-size:.8rem;text-decoration:underline;text-underline-offset:3px;background:none;border:0;padding:0;cursor:pointer}
.wfp-dl{display:grid;grid-template-columns:minmax(96px,42%) minmax(0,1fr);gap:5px 12px;margin:6px 0;font-size:.84rem;line-height:1.4}
.wfp-dl dt{color:var(--muted,#4E6868)}
.wfp-dl dd{margin:0;min-width:0;overflow-wrap:anywhere}
.wfp-dl dd small{color:var(--muted,#4E6868);font-size:.72rem}
.wfp-sub{margin:14px 0 6px;font-size:.86rem}
.wfp-ml,.wfp-fl,.wfp-feed{list-style:none;margin:0;padding:0}
.wfp-ml{margin-top:6px;border-top:1px solid var(--line,#D9E6E6)}
.wfp-ml li,.wfp-feed li{display:grid;grid-template-columns:44px minmax(0,1fr) auto;align-items:center;gap:8px;padding:4px 0;border-top:1px solid var(--line,#D9E6E6);font-size:.82rem}
.wfp-ml li:first-child,.wfp-fl li:first-child,.wfp-feed li:first-child{border-top:0}
.wfp-ml time,.wfp-feed time{color:var(--muted,#4E6868);font-size:.76rem;white-space:nowrap}
.wfp-ml span{overflow-wrap:anywhere}
.wfp-ml .ws-more{margin:0}
.wfp-fl li{display:flex;align-items:center;gap:8px;padding:3px 0;border-top:1px solid var(--line,#D9E6E6)}
.wfp-fb{flex:1;min-width:0;min-height:30px;padding:3px 0;border:0;background:none;text-align:left;font:inherit;font-size:.84rem;color:var(--deeper,#0A2E2F);cursor:pointer;overflow-wrap:anywhere}
.wfp-fb b{display:block;font-family:Jost,system-ui,sans-serif;font-weight:600}
.wfp-fb small{display:block;color:var(--muted,#4E6868);font-size:.76rem;line-height:1.35}
.wfp-fl .wfp-fb b,.wfp-fl .wfp-fb small{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.wfp-fb:hover b,.wfp-fb:hover{text-decoration:underline}
.wfp-all{margin-top:4px}

/* ---- the bottom strip (Calmer Overview 2026-10-05): «I går» (the parts are buttons, details in their title) · «Aktivitet (n) →» ·
   «Oppdatert hh:mm · Oppdater» – the sources in its title; a dot before it when one of them is partly connected or failed ---- */
.ad-body .wfp section.wfp-igs{padding:7px 12px}
.wfp-igs{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;padding:7px 12px;border:1px solid var(--line,#D9E6E6);border-radius:var(--r-m,12px);background:#fff;font-size:.82rem;min-width:0}
.wfp-igl{flex:none;font-family:Jost,system-ui,sans-serif;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted,#4E6868);font-weight:600}
.wfp-igp{display:contents}
.wfp-ig{display:inline-flex;align-items:baseline;gap:5px;min-height:26px;padding:1px 12px;border:0;border-left:1px solid var(--line,#D9E6E6);background:none;font:inherit;font-size:.82rem;color:var(--deeper,#0A2E2F);cursor:pointer;text-align:left;white-space:nowrap}
.wfp-ig:first-child{border-left:0;padding-left:0}
.wfp-ig b{font-family:Jost,system-ui,sans-serif;font-weight:600}
.wfp-ig:not(:disabled):hover span{text-decoration:underline}
.wfp-ig:disabled{cursor:default}
.wfp-ig.na span{color:var(--muted,#4E6868)}
.wfp-igs>.wfp-act{flex:none;margin:0 0 0 auto;padding:0;font-size:.8rem;white-space:nowrap}
.wfp-updt{flex:none;display:inline-flex;align-items:baseline;gap:6px;padding-left:12px;border-left:1px solid var(--line,#D9E6E6);color:var(--muted,#4E6868);font-size:.78rem;white-space:nowrap;cursor:help}
.wfp-updt .ws-more{margin:0;padding:0;font-size:.78rem}
.wfp-updt .wfp-dot{margin-right:0}
.wfp-na{color:var(--muted,#4E6868)}
.wfp-dot{display:inline-block;width:8px;height:8px;margin-right:5px;border-radius:50%;background:#9DB5B6;vertical-align:1px}
.wfp-dot.ok{background:var(--ok,#1B7F5C)}.wfp-dot.warn{background:#E8A33D}.wfp-dot.bad{background:#C8372D}.wfp-dot.off{background:transparent;box-shadow:inset 0 0 0 1.5px #9DB5B6}

/* ---- drawer (customer card, activity) and the e-mail draft dialog ---- */
.wfp-drw,.wfp-dlg{position:fixed;inset:0;z-index:var(--z-drawer,4200);display:flex;justify-content:flex-end}
.wfp-dlg{z-index:var(--z-dialog,4300);align-items:center;justify-content:center;padding:16px}
.wfp-scrim{position:absolute;inset:0;background:rgba(10,46,47,.38)}
.wfp-panel{position:relative;display:flex;flex-direction:column;width:min(460px,100%);height:100%;background:#fff;box-shadow:var(--sh-modal,-18px 0 40px rgba(10,46,47,.18))}
.wfp-dh{position:relative;flex:none;padding:22px 60px 18px 22px;background:linear-gradient(170deg,#0A2E2F,#12494B 70%,#155B5D);color:#fff}
.wfp-dh small{display:block;margin-bottom:4px;font-family:Jost,system-ui,sans-serif;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#9FE6E8}
.wfp-dh h2{margin:0;font-size:1.25rem;line-height:1.2;color:#fff;overflow-wrap:anywhere}
.wfp-dh .wfp-x{position:absolute;top:14px;right:14px;color:#fff}
.wfp-dh .wfp-x:hover{background:rgba(255,255,255,.12)}
.wfp-dh :focus-visible{outline:2px solid #3AC0C3;outline-offset:2px}
.wfp-db{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:16px 20px 26px;background:var(--bg-soft,#F5FAFA)}
.wfp-dlgp{position:relative;width:min(560px,100%);max-height:calc(100vh - 32px);overflow-y:auto;padding:20px 22px;border-radius:var(--r-l,16px);background:#fff;box-shadow:var(--sh-modal,0 24px 60px rgba(10,46,47,.25))}
.wfp-dlgp h3{margin:0 0 10px;font-size:1.1rem}
.wfp-pre{margin:8px 0;padding:12px;border-radius:10px;background:var(--bg-soft,#F5FAFA);font:inherit;font-size:.86rem;white-space:pre-wrap;overflow-wrap:anywhere}
.wfp-feed li{grid-template-columns:52px minmax(0,1fr)}

/* ---- the groups of «Dagens plan» (Overview v2; Calmer Overview 2026-10-05): an uppercase header line (title + count, «· n forfalt»,
   «Vis alle (n)», a link on the right), its rows. No «· n skjult», no order pointer. ---- */
.wfp-groups{display:flex;flex-direction:column}
.wfp-grp{margin-top:10px}.wfp-grp:first-child{margin-top:4px}
.wfp-gh{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 8px;padding:0 0 4px;border-bottom:1px solid var(--line,#D9E6E6)}
.wfp-gh h4{margin:0;font-family:Jost,system-ui,sans-serif;font-size:.74rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--deep,#12494B)}
.wfp-gh h4 em{margin-left:6px;font-style:normal;font-weight:500;letter-spacing:0;color:var(--muted,#4E6868)}
.wfp-gx{font-size:.76rem;font-weight:600;color:#A32A22}
.wfp-gr{margin-left:auto;display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 14px;font-size:.78rem}
.wfp-gr .wfp-all,.wfp-gr .wfp-lnk{margin:0;padding:0;font-size:.78rem;white-space:nowrap}
.wfp-gl{display:flex;flex-direction:column}
/* «Vis alle (n)» on the header line (cut group); «Vis færre» also the foot under the rows (open group) */
.wfp-gh .wfp-gall{margin:0;padding:0;font-size:.76rem;font-weight:600}
.wfp-grp>.wfp-gall{display:block;margin:2px 0 0;padding:2px 0;font-size:.8rem;font-weight:600}
/* «Anbud · N med frist · M nye kunngjøringer» (tqHtml): one line on the same grid in a soft band; «⋯» unfolds the tenders under it */
.wfp-grp.wfp-tqg{margin-top:12px}
.wfp .wfp-row.wfp-sum{margin:0 -8px;padding:3px 8px;border:0;border-radius:10px;background:var(--bg-soft,#F5FAFA)}
.wfp-sum .wfp-t{color:var(--darkest,#0A2E2F)}
.wfp-sum .wfp-cx{color:var(--ink,#152E2E)}
.wfp-tqg+.wfp-grp{margin-top:12px}
.wfp-tql{margin-top:2px}
/* the meeting line: first in «Møter og oppgaver», not a row – only below 1100 px; beside the Timeplan (≥ 1100 px) it would say the same,
   and a task group that then holds no row is not drawn either. «Timeplan ↓» jumps to the card. */
.wfp-mline{display:flex;flex-wrap:wrap;align-items:center;gap:2px 10px;margin:4px 0 1px;padding:3px 10px;border-left:3px solid var(--deep,#12494B);border-radius:0 10px 10px 0;background:var(--bg-soft,#F5FAFA);font-size:.84rem;min-height:28px}
.wfp-mlt{flex:1 1 220px;min-width:0;color:var(--deeper,#0A2E2F)}
.wfp-mlt b{font-family:Jost,system-ui,sans-serif;font-weight:600}
.wfp-mline .btn{padding:2px 12px;font-size:12px}
.wfp-tday{display:none}
@media (max-width:1099px){ .wfp-tday{display:inline} }
@media (min-width:1100px){ .wfp-plan .wfp-mline{display:none} .wfp-plan .wfp-grp[data-grp="task"]:not(:has(.wfp-row)){display:none} }
/* the AI-credit note (one slim line, not a row) and the status line (only what is loading or could not be read) */
.wfp-sys{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;margin:6px 0}
.wfp-sys>span:first-child{flex:1 1 260px;min-width:0}
.wfp-sysb{display:inline-flex;gap:6px}
.wfp-sys .btn{margin:0;padding:3px 12px}
.wfp-gst{margin:10px 0 0;color:var(--muted,#4E6868);font-size:.78rem;line-height:1.45}
.wfp-groups .ws-empty{margin:8px 0 4px}
.wfp-groups .wfp-skel{margin-top:8px}
.wfp-tg.slot{background:#EEF3F3;color:var(--deep,#12494B)}
.wfp-later{margin-top:8px}
.ad-body .wfp section.ws-sec.wfp-plan{padding:12px 16px 10px}

/* ---- «Timeplan» (right column, card 1) ---- */
.wfp-day{container:wfpday / inline-size;scroll-margin-top:110px}   /* «Timeplan ↓» lands below the sticky top bar and chip bar */
.wfp-day:focus{outline:none}
.wfp-day:focus-visible{outline:2px solid var(--focus,var(--deeper,#0A2E2F));outline-offset:2px}
.wfp-dayh{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:8px;row-gap:2px}
.wfp-side .wfp-day .ws-h{margin-bottom:2px}
.wfp-dayh h3{margin:0}
.wfp-hrs{color:var(--muted,#4E6868);font-size:.76rem}
.wfp-dayh .wfp-lnk{font-size:.76rem}
.wfp-aib{margin-left:auto;align-self:center;padding:3px 10px!important;font-size:12px!important;white-space:nowrap}
.wfp-dbar{position:relative;height:6px;margin:6px 0 4px;border-radius:3px;background:#E6F0F0;overflow:hidden}
.wfp-dbar i{position:absolute;top:0;bottom:0;left:0}
.wfp-dbar .past{background:rgba(10,46,47,.12)}
.wfp-dbar .seg{background:var(--deep,#12494B);border-radius:3px}
.wfp-dbar .seg.done{background:#8FB3B4}
.wfp-dbar .now{width:2px;margin-left:-1px;background:#C8372D}
.wfp-tp{display:flex;flex-direction:column}
.wfp-tp>.wfp-blk:first-child,.wfp-tp>.wfp-early:first-child{margin-top:2px}
.wfp-tp>.wfp-blk{margin-top:4px}
/* a meeting is one line in the Timeplan: time · subject (ellipsis) · Teams · Outlook; the external domains are in the expanded meeting */
.wfp-tp .wfp-mt{flex-wrap:nowrap;margin:2px 0;padding:2px 8px;gap:8px;min-height:28px;font-size:.82rem}
.wfp-tp .wfp-mts{flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wfp-tp .wfp-mts em{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wfp-tp .wfp-mt{min-height:26px}
.wfp-tp .wfp-mt .btn{flex:none;padding:0;border:0;background:none;color:var(--deep,#12494B);font-size:.76rem;font-weight:600;line-height:1.4;text-decoration:underline;text-underline-offset:3px}
.wfp-tp .wfp-mt .wfp-ol{flex:none;font-size:.76rem}
a.wfp-mts{color:inherit;text-decoration:none}
a.wfp-mts:hover,a.wfp-mts:focus-visible{text-decoration:underline;text-underline-offset:3px}
.wfp-tp .wfp-slot{padding:1px 10px}
.wfp-tp .wfp-slot em{font-style:normal;color:var(--deep,#12494B);font-size:.74rem}
.wfp-early{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 10px;margin:2px 0 0;font-size:.76rem}
.wfp-early .wfp-allday,.wfp-early .wfp-past summary{font-size:.76rem}
.wfp-early{flex-wrap:nowrap}.wfp-early:has(details[open]){flex-wrap:wrap}
.wfp-early .wfp-allday{flex:0 1 auto;min-width:0;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wfp-early .wfp-past{flex:none}
.wfp-early .wfp-past summary{padding:0}
.wfp-early .wfp-past[open]{flex-basis:100%}
.wfp-endl{display:flex;flex-wrap:wrap;gap:0 8px;margin-top:3px;padding:3px 10px 0;border-top:1px dashed var(--line,#D9E6E6);color:var(--muted,#4E6868);font-size:.74rem}
/* fix round 2: each part is one unbroken line; «I morgen: …» moves under the end of the day when both do not fit (no cut words) */
.wfp-endl .wfp-end,.wfp-endl .wfp-tmr{flex:none;white-space:nowrap}
/* references: one line each, a dot for the severity, the kind, the title (ellipsis); a click shows the row in the plan */
.wfp-refs{display:flex;flex-direction:column;margin:0 0 2px}
.wfp-ref{display:flex;align-items:center;gap:7px;width:100%;min-height:24px;margin:0;padding:1px 8px 1px 14px;border:0;border-radius:8px;background:none;text-align:left;font:inherit;font-size:.8rem;color:var(--deeper,#0A2E2F);cursor:pointer;white-space:nowrap;overflow:hidden}
.wfp-ref:hover{background:#F2F9F9}
.wfp-ref:hover .wfp-rt{text-decoration:underline;text-underline-offset:2px}
.wfp-ref.prep{border-left:2px dashed #3AC0C3;border-radius:0 8px 8px 0}
.wfp-rdot{flex:none;width:7px;height:7px;border-radius:50%;background:#9DB5B6}.wfp-rdot.high{background:#E8A33D}.wfp-rdot.critical{background:#C8372D}
.wfp-rk{flex:none;font-family:Jost,system-ui,sans-serif;font-size:.64rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted,#4E6868)}
.wfp-rt{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis}
.wfp-rt time{font-weight:600}
.wfp-nx{margin:0 0 4px 13px}
.wfp-nx .wfp-nb{display:flex;flex-wrap:nowrap;align-items:center;gap:8px;margin:2px 0 0}
.wfp-nx .wfp-org{flex:1 1 auto;min-width:0;margin:0;font-size:.84rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wfp-nx .wfp-nb .btn{flex:none;padding:2px 12px;font-size:12px}
.wfp-nx .wfp-facts{margin:1px 0 0;font-size:.78rem;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}   /* one line – the whole text is in its title */
.wfp-sugh{margin:6px 0 2px;font-family:Jost,system-ui,sans-serif;font-size:.72rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--deep,#12494B)}
.wfp-sug{margin:0 0 4px;padding-left:22px;font-size:.8rem;color:var(--muted,#4E6868)}
.wfp-sug .wfp-ref{padding-left:4px}
.wfp-tf{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 14px;margin:6px 0 0;padding-top:6px;border-top:1px solid var(--line,#D9E6E6);color:var(--muted,#4E6868);font-size:.78rem}
.wfp-tf .ws-more,.wfp-tf .wfp-lnk{margin:0;padding:0;font-size:.78rem}
/* fix round 2: every part of the foot is one unbroken line; the foot wraps between them («Del kundemøter» to a second line in a narrow
   column) – a button label is never cut */
.wfp-tf{gap:2px 8px;font-size:.75rem}
.wfp-tf .ws-more,.wfp-tf .wfp-lnk{font-size:.75rem}
.wfp-tf>*{flex:none;white-space:nowrap}
.wfp-day .wfp-ai{margin:6px 0}
.wfp-aimore{margin:0 0 4px}
@container wfpday (max-width:300px){ .wfp-mt .btn{padding:2px 8px} }
/* fix round 1: the kind word takes 40 % of a 340–420 px column – in the side column the dot and the title carry a reference (the kind
   is in its title); a wide one-column Timeplan (below 1100 px) shows it */
@container wfpday (max-width:419px){ .wfp-rk{display:none} .wfp-tp .wfp-mt .wfp-ol{display:none} }
/* fix round 2: a 300 px Timeplan – the subject may take two lines instead of being cut to a few letters */
@container wfpday (max-width:319px){ .wfp-tp .wfp-mt{align-items:flex-start} .wfp-tp .wfp-mts{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere} }
/* touch screens (one column below 1100 px): the references are 28 px targets */
@media (max-width:1099px){ .wfp-ref{min-height:28px} }

/* ---- «Ordre» (right column, card 2 – the last; one line until opened) ---- */
/* the head (O9): «Ordre» · the counts in short words · ▾ … «Alle ordre →» at the right; fix round 3: the counts wrap whole (each one
   unbroken, two lines at most in a 300–340 px column) instead of being cut with «…» – the whole breakdown is also in the title */
.wfp-card.wfp-ord .ws-h.wfp-hl{display:flex;flex-wrap:nowrap;align-items:baseline;gap:10px;margin-bottom:0;line-height:1.4}
.wfp-card.wfp-ord .ws-h.wfp-hl h3{display:block;flex:1 1 auto;min-width:0;margin:0;overflow:hidden}
.wfp-card.wfp-ord .ws-h.wfp-hl>.wfp-all{flex:none;margin:0 0 0 auto}
.wfp-ord h3{font-size:.95rem;font-weight:400;line-height:1.4}
.wfp-oh,.wfp-oh0{display:flex;align-items:baseline;max-width:100%;min-width:0;padding:0;border:0;background:none;font:inherit;color:inherit;text-align:left;white-space:normal;line-height:1.25}
.wfp-oh{cursor:pointer}
.wfp-oh b,.wfp-oh0 b{flex:none;font-family:Jost,system-ui,sans-serif;font-weight:700;color:var(--ink,#152E2E)}   /* as the «Timeplan» title */
.wfp-oh:hover b{text-decoration:underline;text-underline-offset:3px}
.wfp-ocs{flex:0 1 auto;min-width:0;margin-left:4px;white-space:normal;line-height:1.2}
.wfp-oc{white-space:nowrap;font-family:inherit;font-size:.8rem;font-weight:500;color:var(--muted,#4E6868)}.wfp-oc.bad{color:#A32A22;font-weight:600}
.wfp-chev{flex:none;margin-left:4px;font-size:.8rem;color:var(--deep,#12494B)}
.wfp-o2{margin-top:6px}
.wfp-o2 li{grid-template-columns:10px minmax(0,1fr);gap:8px;padding:2px 0}
.wfp-o2 .wfp-fb{min-height:0;padding:2px 0}
.wfp-o2 .wfp-fb b,.wfp-o2 .wfp-fb small{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.wfp-o2 .wfp-fb b{font-size:.84rem}
.wfp-odot{width:8px;height:8px;border-radius:50%;background:#9DB5B6}.wfp-odot.c1{background:#C8372D}.wfp-odot.c2{background:#E8A33D}.wfp-odot.c4{background:#3AC0C3}
p.wfp-cf{display:block;margin:4px 0 0;color:var(--muted,#4E6868);font-size:.76rem}
/* the open list's foot: «Viser 5 av n · n i Dagens plan» … «Alle ordre →» at the right (fix round 3: moved here from the head line) */
p.wfp-cf.wfp-ocf{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:0 12px}
p.wfp-ocf>.wfp-all{margin-left:auto;font-size:.8rem;white-space:nowrap}

/* ---- responsive (OVERVIEW2-SPEC §1): ≥ 1280 px the right column is clamp(340px,30%,420px); 1100–1279 px 300 px; < 1100 px one column
   (plan, Timeplan, Ordre – the two cards side by side where two fit); 375 px without horizontal scroll ---- */
@media (max-width:1279px) and (min-width:1100px){ .wfp-grid{grid-template-columns:minmax(0,1fr) 300px} }
@media (max-width:1099px){ .wfp-grid{grid-template-columns:1fr} }
@media (max-width:1099px){
  .wfp-side{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));align-items:start}
}
/* the hero on a tablet and a phone: the figures under the greeting, two or three to a row */
@media (max-width:760px){
  .wfp-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(132px,1fr));width:100%;flex-basis:100%}
  .wfp-kpi{min-width:0}
}
/* a phone: three small figures to a row (two rows), the amount under the figure when it does not fit beside it */
@media (max-width:600px){
  .wfp-kpis{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .wfp-kpi{padding:5px 9px 6px}
  .wfp-kpi span{font-size:9px;letter-spacing:.08em}
  .wfp-kpi strong{flex-wrap:wrap;column-gap:4px;font-size:1.1rem}
  .wfp-kpi strong small{max-width:100%;overflow:hidden;text-overflow:ellipsis;font-size:.66rem}
}
@media (max-width:900px){
  .wfp-hero{align-items:flex-start}
  .wfp-igs{column-gap:14px}
  .wfp-ig,.wfp-ig:first-child{border-left:0;padding:0}
  .wfp-updt{border-left:0;padding-left:0}
}
@media (max-width:600px){
  .wfp-dl{grid-template-columns:1fr;gap:2px}
  .wfp-dl dd{margin-bottom:6px}
  .wfp-ml li{grid-template-columns:44px minmax(0,1fr)}
  .wfp-ml li .ws-more{grid-column:2}
  .wfp-igs{gap:2px 8px}
  .wfp-ig{font-size:.78rem;white-space:normal}
  .wfp-dh{padding:18px 56px 16px 16px}
  .wfp-db{padding:12px 12px 22px}
  .wfp-mt{padding:4px 8px}
}
/* a narrow plan column (container query – a folded or unfolded menu changes it too): slimmer columns, the context gives way first.
   ≤ 600 px: a 1280 laptop with the menu open; ≤ 480 px: 1100–1279 px windows (plan ≈ 435–475 px) – still one line */
@container wfplan (max-width:600px){
  .wfp .wfp-row{grid-template-columns:10px minmax(0,1fr) 80px 104px 28px;column-gap:10px}   /* «99+ d over» and a date in another year («14.10.2027») fit */
  .wfp-row>.wfp-more,.wfp-acts>.wfp-more{width:28px;height:28px}
}
/* repair round 2026-10-05: the context is never hidden – it gives way first (flex-shrink) and ends in «…» in a narrow column; on a phone
   (≤ 400 px) it is a small second line under the name. Otherwise two rows read «Oslo Dyreklinikk» and «Oslo Dyreklinikk» */
@container wfplan (max-width:480px){
  .wfp .wfp-row{grid-template-columns:10px minmax(0,1fr) 72px 92px 28px;column-gap:8px}
  .wfp .wfp-acts .wfp-go{padding:5px 4px}
  .wfp-row .wfp-due{padding:1px 5px}   /* «99+ d over» (the longest badge) fits 72 px */
  .wfp-sum .wfp-l1{flex-wrap:wrap;white-space:normal;row-gap:0}
}
/* a phone: the name and «⋯» on line 1, the due badge and the button on line 2 */
@container wfplan (max-width:400px){
  .wfp .wfp-row{grid-template-columns:10px minmax(0,1fr) auto;grid-template-areas:"sev l1 more" ". due go";row-gap:4px}
  .wfp .wfp-row.ws-open{grid-template-areas:"sev l1 more" ". due go" ". det det"}
  .wfp .wfp-row.wfp-cfm{grid-template-areas:"sev l1 more" ". due go" ". cfl cfl"}
  .wfp .wfp-row.wfp-cfm.ws-open{grid-template-areas:"sev l1 more" ". due go" ". cfl cfl" ". det det"}
  .wfp-row>.ws-sev{align-self:start;margin-top:6px}
  .wfp-row .wfp-due{justify-self:start}
  .wfp-row .wfp-due.none{display:none}
  .wfp .wfp-acts .wfp-go{justify-self:end;width:auto;min-width:104px;padding:5px 12px}
  .wfp-acts>.wfp-acg{justify-self:end}
  .wfp-l1{flex-wrap:wrap;white-space:normal;row-gap:1px}
  .wfp-t{flex:1 1 100%;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere}
  .wfp-row:not(.wfp-sum) .wfp-cx{flex:1 1 100%;white-space:nowrap;font-size:.78rem;line-height:1.3}
  .wfp-acts>.wfp-more{width:32px;height:32px}
}

/* «Send fra min e-post» and HubSpot tasks in the day plan (Omer 2026-10-05): the editable draft, the confirm view, the task form,
   «Fullfør» on my HubSpot task rows, the «Sendt» tag and the result line above the plan */
.wfp-dlgsub{margin:-4px 0 8px;color:var(--muted,#4E6868);font-size:.84rem;line-height:1.4;overflow-wrap:anywhere}
.wfp-form{display:grid;gap:8px;margin:4px 0 10px}
.wfp-fld{display:grid;gap:3px;min-width:0;font-size:.8rem;color:var(--muted,#4E6868)}
.wfp-fld>span{font-weight:600}
.wfp-fld input,.wfp-fld textarea,.wfp-fld select{width:100%;box-sizing:border-box;padding:7px 10px;border:1px solid var(--line,#D9E6E6);border-radius:8px;background:#fff;color:var(--deeper,#0A2E2F);font:inherit;font-size:.9rem}
.wfp-fld textarea{resize:vertical;min-height:120px;line-height:1.45}
.wfp-fld input:focus,.wfp-fld textarea:focus,.wfp-fld select:focus{outline:2px solid #3AC0C3;outline-offset:1px}
.wfp-frow{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.wfp-dact .ws-actb{flex-wrap:wrap}
.wfp-mst{margin:4px 0;font-size:.82rem;color:var(--deep,#12494B)}
.wfp-mst.bad{color:#A32A22}
.wfp-cnt{margin:4px 0;font-size:.8rem;color:var(--muted,#4E6868)}
.wfp-rs{margin:4px 0 0;padding-left:18px}
.wfp-chk{display:flex;gap:8px;align-items:flex-start;margin:6px 0;font-size:.84rem}
.wfp-hsa{margin:4px 0 8px;font-size:.84rem;overflow-wrap:anywhere}
.wfp-dlgp .ws-msg{margin:6px 0;padding:6px 10px;border-radius:10px;font-size:.84rem;line-height:1.45}
.wfp-dlgp .ws-msg.bad{background:#FBE7E5;color:#A32A22}
.wfp-mock,.wfp-dlgp .ws-msg.warn{background:#FDF1E0;color:var(--warn-ink,#7A4A07)}
.wfp-acg{display:inline-flex;align-items:center;gap:4px}
.wfp-cfl .wfp-cfq{color:var(--deep,#12494B);font-size:.8rem;font-weight:600;line-height:1.35;white-space:normal}
.wfp-cfl .wfp-cfq.bad{color:#A32A22}
.wfp-tg.sent{background:#E6F4EA;color:#1E6B34}
.wfp-flash{display:flex;align-items:center;gap:8px;margin:6px 0;padding:6px 10px;border-radius:10px;background:#E6F4EA;color:#1E6B34;font-size:.84rem;line-height:1.4}
.wfp-flash.bad{background:#FBE7E5;color:#A32A22}
.wfp-flash span{flex:1;min-width:0;overflow-wrap:anywhere}
.wfp-fx{flex:none;border:0;background:none;color:inherit;font-size:1.1rem;line-height:1;cursor:pointer;padding:2px 6px}
/* «+ HubSpot-oppgave» in the plan head: the height of the scope tabs (28 px) – a .btn.sm (≈ 34 px) made the head and the page
   taller (walk-wf W1, review 2026-10-05) */
.wfp-hsn{white-space:nowrap}
.wfp-ph1 .wfp-hsn{display:inline-flex;align-items:center;box-sizing:border-box;min-height:28px;height:28px;padding:0 10px;font-size:.78rem;line-height:1;white-space:pre}
/* laptops (the plan column ≤ 700 px at 1366 / 1280): only «+» – the name is the button's aria-label and title – so the head keeps one line */
@container wfplan (max-width:700px){ .wfp-ph1 .wfp-hsn{width:28px;padding:0;justify-content:center;font-size:1rem} .wfp-ph1 .wfp-hsn .wfp-hsl{display:none} }
/* with «Vis alt» (a focus is set in Min profil) the header needs that room up to 800 px */
@container wfplan (max-width:800px){ .wfp-ph1:has(.wfp-sw) .wfp-hsn{width:28px;padding:0;justify-content:center;font-size:1rem} .wfp-ph1:has(.wfp-sw) .wfp-hsn .wfp-hsl{display:none} }
/* repair round 2026-10-05: a 1280 × 800 laptop with a focus set (plan ≈ 606 px) – the header broke onto two lines («+» under). At ≤ 640 px the
   switch is the checkbox alone: «Vis alt» stays its aria-label and title (visually hidden, still read aloud) */
@container wfplan (max-width:640px){ .wfp-ph1 .wfp-swl{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap} .wfp-ph1 .wfp-sw{gap:0} }
/* the ↗ of a link button (HubSpot «Oppgaveliste ↗») gives way in a narrow go column – the title and aria-label say «ny fane» */
@container wfplan (max-width:600px){ .wfp .wfp-acts a.wfp-go>span[aria-hidden]{display:none} }
.wfp-dlgp h3:focus{outline:none}
.wfp-dlgp h3:focus-visible{outline:2px solid #3AC0C3;outline-offset:2px}
/* review 2026-10-05: the question before typed text is thrown away (L9), the code of an unknown error (L10), «not a known
   customer address» on the confirm view (L3) */
.wfp-ask{margin:8px 0 0;padding:8px 10px;border-radius:10px}
.wfp-ask p{margin:0 0 6px;font-size:.86rem;line-height:1.4}
.wfp-ask .ws-actb{margin-top:4px}
.wfp-ecode{font-size:.74rem;opacity:.85;white-space:nowrap}
.wfp-cold{margin:6px 0;font-size:.84rem}
@media (max-width:480px){ .wfp-frow{grid-template-columns:1fr} }
@media (prefers-reduced-motion:reduce){.wfp-skel{animation:none}}

/* «Kom i gang» (one-time set-up, Calmer Overview 2026-10-05): a dot on the avatar and an item in the account menu instead of a banner.
   workspace.js owns the bar; until it draws them, wf-plan.js adds both in bind() (onbPaint) */
#wsBar .ws-av .wfp-onbdot{position:absolute;top:-1px;right:-1px;width:11px;height:11px;border-radius:50%;background:#E8A33D;box-shadow:0 0 0 2px #F6FAFA}
.wfp-onbm{display:flex;align-items:center;gap:4px;margin-top:6px;border-radius:9px;background:#FDF5E8}
.ws-menu .wfp-onbm>a,.wfp-onbm>span{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;margin:0;padding:6px 10px;color:var(--deeper,#0A2E2F);text-decoration:none}
.wfp-onbm b{font-family:Jost,system-ui,sans-serif;font-size:.86rem}
.wfp-onbm small{font-size:.78rem;color:var(--warn-ink,#7A4A07)}
.wfp-onbm .wfp-x{width:26px;height:26px;font-size:1rem}
/* «HubSpot-oppfølging» on Pipeline & follow-up (WFPLAN.hsHtml) – the same rows and grid as the Overview */
.wfp-hsw{margin:0 0 14px}
.wfp-hs .wfp-ph1 .wfp-lnk{font-size:.8rem;white-space:nowrap}