/* v0300 — offertsidan. (Hette quote-v0279.css t.o.m. v0287; namnet byttes
   för att webbläsaren annars serverar den gamla filen ur cachen.) Samma verktygsrad som kalendern, en hylla med det som
   sällan ändras, och sedan bara raderna.

   Modalerna använder portalens egen .portal-modal (samma som bemanningen och
   projektplanen), inte något eget. Här ligger bara innehållet i dem. */

/* ---- verktygsraden -------------------------------------------------- */
/* Raden ärver allt från calendar-toolbar-v0276.css. Här bara det som är
   offertens eget: summan i mitten och statusväljaren till höger. */
.app-shell .quote-toolbar .quote-toolbar-sum{
  display:flex;
  align-items:baseline;
  gap:7px;
  white-space:nowrap;
}
.app-shell .quote-toolbar .quote-toolbar-sum span{
  font-size:11px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:#68756d;
}
.app-shell .quote-toolbar .quote-toolbar-sum strong{
  font-size:19px;
  font-variant-numeric:tabular-nums;
}
/* controls-v0115.css tvingar .calendar-head-actions till ett tvåkolumnsrutnät
   (display:grid!important). Det var därför knapparna staplades i tre rader mitt
   på offertsidan medan högra halvan stod tom. Här blir de en rad igen. */
.app-shell .resource-calendar-toolbar .calendar-head-actions{
  display:flex!important;
  flex:0 0 auto;
  flex-wrap:wrap;
  align-items:center;
  justify-content:flex-end;
  gap:7px;
  width:auto!important;
  grid-template-columns:none!important;
  margin-left:auto;
}
.app-shell .resource-calendar-toolbar .calendar-head-actions .button{width:auto!important;min-width:0}
.app-shell .quote-toolbar .calendar-head-actions form{margin:0}
.app-shell .quote-toolbar select{
  min-height:32px;
  padding:4px 8px;
  border:1px solid #cfd8d2;
  border-radius:8px;
  font:inherit;
  font-size:13px;
  background:#fff;
}

/* ---- hyllan ---------------------------------------------------------- */
.quote-shelf{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:8px 18px;
  margin:0 0 8px;
  padding:8px 12px;
  border:1px solid var(--line);
  border-radius:10px;
  background:#fbfcfb;
}
.quote-shelf-facts{
  display:flex;
  flex-wrap:wrap;
  gap:4px 22px;
  margin:0;
  min-width:0;
}
.quote-shelf-facts > div{min-width:0}
.quote-shelf-facts dt{
  margin:0;
  font-size:10px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:#8a968f;
}
.quote-shelf-facts dd{
  margin:1px 0 0;
  font-size:13px;
  font-weight:600;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:26ch;
}
.quote-shelf-actions{display:flex;flex-wrap:wrap;gap:6px;margin-left:auto}
.quote-shelf-actions .button{min-height:32px;padding:0 12px;font-size:12.5px}

/* ---- raderna --------------------------------------------------------- */
.quote-lines-panel{padding:10px 12px;margin-bottom:8px}
.quote-lines-panel > h2{display:none}
/* En rad är en rad: beskrivning och typ bredvid varandra, inte staplade. */
.quote-lines{gap:4px}
.quote-line{padding:5px 8px}
.quote-line-main{grid-template-columns:minmax(0,1fr) 132px;gap:6px;align-items:center}
.quote-line .quote-line-kind{min-height:32px;font-size:12px}
.quote-line input{min-height:32px}
.quote-line .button-small{min-height:32px}
.quote-line-new{margin-top:10px;padding-top:10px;gap:8px}
.quote-line-new input,.quote-line-new select{min-height:34px;padding:6px 9px}
.quote-totals{margin-top:10px;padding-top:8px;gap:3px}
.quote-totals div{font-size:12.5px}
.quote-totals .is-total{font-size:15px}
@media(max-width:1100px){
  .quote-line{grid-template-columns:minmax(0,1fr) 62px 62px 84px;row-gap:4px}
  .quote-line .quote-amount{grid-column:1 / 3;text-align:left;align-self:center}
  .quote-line .button-small{grid-column:3;width:auto!important}
  .quote-line .link-button{grid-column:4}
  .quote-line-main{grid-template-columns:minmax(0,1fr) 120px}
}

/* ---- signeringsremsan ------------------------------------------------ */
.quote-sign-strip{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px 14px;
  margin:0 0 12px;
  padding:8px 12px;
  border:1px solid var(--line);
  border-radius:10px;
  background:#fbfcfb;
}
.quote-sign-strip .quote-sign-state{margin:0;padding:4px 10px;font-size:12px}
.quote-sign-strip .quote-sign-note{margin:0;min-width:0;flex:1 1 240px;font-size:12px;color:var(--muted)}
.quote-sign-strip .quote-approval-link{font-size:11px;word-break:break-all}
.quote-sign-strip-actions{display:flex;gap:6px;margin-left:auto}
.quote-sign-strip-actions .button{min-height:32px;padding:0 12px;font-size:12.5px}

/* ---- innehåll i modalerna ------------------------------------------- */
/* Skalet — kort, huvud, kropp, stängkryss, klistrad fot — kommer från
   portal-modal. Nedan bara det som är offertens eget. */
.portal-modal .quote-meta-cols{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
@media(max-width:700px){.portal-modal .quote-meta-cols{grid-template-columns:1fr}}
.portal-modal .quote-meta-form{display:grid;gap:8px;margin:0}
.portal-modal .quote-meta-form label{display:grid;gap:3px;min-width:0;font-size:12px;font-weight:600}
.portal-modal .quote-meta-form input,
.portal-modal .quote-meta-form select,
.portal-modal .quote-meta-form textarea{
  width:100%;min-width:0;min-height:34px;padding:6px 9px;
  border:1px solid #cfd8d2;border-radius:8px;font:inherit;background:#fff;
}
.portal-modal .quote-meta-form textarea{min-height:64px;padding:7px 9px;font-size:13px}
.portal-modal .quote-meta-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}
/* Kund, enhet och kontaktperson på en rad — annars äter vänsterspalten upp
   höjden och texterna hamnar utanför bild. */
.portal-modal .party-picker{display:grid;grid-template-columns:1.15fr .8fr 1.05fr;gap:8px;margin:0}
.portal-modal .party-picker label{display:grid;gap:3px;min-width:0;font-size:12px;font-weight:600}
.portal-modal .party-picker select{width:100%;min-width:0;min-height:34px;padding:6px 9px;border:1px solid #cfd8d2;border-radius:8px;font:inherit;background:#fff}
@media(max-width:900px){
  .portal-modal .party-picker{grid-template-columns:1fr 1fr}
  .portal-modal .party-picker label:last-child{grid-column:1 / -1}
}

.quote-plan-box .quote-plan-lead{margin:0 0 10px;font-size:12px;line-height:1.45;color:var(--muted);max-width:none}
.quote-plan-grid{display:grid!important;grid-template-columns:1fr 1fr;gap:8px 12px}
.quote-plan-grid label{display:grid;gap:3px;font-size:12px;font-weight:600}
.quote-plan-grid label>span{font-size:11.5px;line-height:1.25}
.quote-plan-grid input{min-height:34px;padding:6px 9px;border:1px solid #cfd8d2;border-radius:8px;font:inherit;background:#fff;text-align:right;font-variant-numeric:tabular-nums}
.quote-plan-box .quote-plan-result{
  display:flex!important;align-items:baseline;gap:8px;text-align:left;
  margin-top:10px;padding:8px 12px;border-radius:9px;background:#eef3ee;
}
.quote-plan-box .quote-plan-result b{font-size:20px}
.quote-plan-box .quote-plan-result small{color:var(--muted)}
@media(max-width:560px){.quote-plan-grid{grid-template-columns:1fr}}

[data-modal=quote-send] form{display:grid;gap:8px;margin:0;justify-items:start}
[data-modal=quote-send] label{display:grid;gap:4px;font-size:12px;font-weight:600;width:100%;max-width:280px}
[data-modal=quote-send] select{min-height:34px;padding:6px 9px;border:1px solid #cfd8d2;border-radius:8px;font:inherit;background:#fff}
[data-modal=quote-send] .quote-sign-note{margin:0}
[data-modal=quote-send] .quote-sign-divider{margin:12px 0;border:0;border-top:1px solid var(--line)}

/* ---- prislistan ------------------------------------------------------ */
.rate-lead{margin:0 0 10px;color:var(--muted);font-size:12px;line-height:1.45}
.rate-rows{display:grid;gap:6px}
.rate-row{display:grid;grid-template-columns:minmax(0,1fr) 120px 92px;gap:8px;align-items:center;margin:0}
.rate-row.is-head{font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#8a968f}
.rate-row.is-head span:nth-child(2){text-align:right}
.rate-row input{width:100%;min-width:0;min-height:34px;padding:6px 9px;border:1px solid #cfd8d2;border-radius:8px;font:inherit;background:#fff}
.rate-row input[name=day_rate]{text-align:right;font-variant-numeric:tabular-nums}
.rate-row .button{min-height:34px;width:100%}
.rate-row.is-new{margin-top:6px;padding-top:10px;border-top:1px solid var(--line)}
@media(max-width:560px){
  .rate-row{grid-template-columns:minmax(0,1fr) 96px}
  .rate-row.is-head{display:none}
  .rate-row .button{grid-column:1 / -1}
}

/* ---- uträkningen i klartext ------------------------------------------ */
/* Antal × dagar per person × dagspris. Står under nya raden medan man
   skriver, så att ingen behöver räkna i huvudet. */
.quote-calc{
  grid-column:1 / -1;
  margin:0;
  min-height:16px;
  color:var(--muted);
  font-size:12px;
  font-variant-numeric:tabular-nums;
}
.quote-line .quote-amount.is-changed{color:#245b3e}
.quote-line .quote-amount.is-changed:after{content:' •';color:#b08b1e}
.quote-calc.is-ready{color:#245b3e;font-weight:600}

/* ---- tom offert ------------------------------------------------------ */
/* Raderna ÄR offerten. När det inte finns någon ska sidan säga vad man gör
   härnäst, inte bara konstatera att det är tomt. */
.quote-lines-empty{
  margin:0;padding:12px 16px;text-align:left;
  border:1px dashed var(--line);border-radius:10px;background:#fbfcfb;
}
.quote-lines-empty strong{display:block;font-size:14px}
.quote-lines-empty p{margin:3px 0 6px;color:var(--muted);font-size:12.5px}
.quote-lines-empty ol{margin:0;padding-left:20px;color:var(--ink);font-size:12.5px;line-height:1.6}
.quote-lines-empty li+li{margin-top:2px}
.quote-line-new.is-first{border-top-color:transparent;margin-top:8px;padding-top:0}
.quote-sign-strip-actions .button[disabled]{opacity:.45;cursor:not-allowed;pointer-events:none}

/* ---- bekräftelserutan ------------------------------------------------ */
/* Portalens egen, i stället för webbläsarens confirm() som ser ut som Chrome. */
.portal-modal-confirm{width:min(460px,calc(100% - 30px))}
.portal-modal-confirm .lp-confirm-text{margin:0;color:var(--ink);font-size:13.5px;line-height:1.55}
.portal-modal-confirm .form-actions{margin-top:14px;padding-top:0;border:0}

/* ---- publika sidor --------------------------------------------------- */
/* Godkännandesidan är varken portalen eller inloggningen. Den låg tidigare i
   login-shell, vars dekorativa :before är position:fixed över hela fönstret —
   ett osynligt lager som slukade varje klick, inklusive Godkänn-knappen. */
body.public-shell{
  min-height:100vh;
  margin:0;
  padding:0;
  background:var(--paper);
  color:var(--ink);
}
body.public-shell:before{content:none}
/* Dekorativa lager ska aldrig ta emot klick, var de än ligger. */
.login-shell:before{pointer-events:none}

/* ---- låst offert ----------------------------------------------------- */
/* Innehållet ligger fast så snart offerten lämnat huset. Sidan ska då se
   låst ut, inte bara vägra spara. */
.quote-lock{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 18px;
  margin:0 0 8px;padding:10px 14px;
  border:1px solid #e0d6ae;border-radius:10px;background:#fdf8e8;
}
.quote-lock strong{display:block;font-size:13.5px;color:#6d5000}
.quote-lock p{margin:2px 0 0;max-width:78ch;color:#6d5000;font-size:12.5px;line-height:1.45}
.quote-lock form{margin:0}
.quote-lock .button{min-height:32px;padding:0 12px;font-size:12.5px}
.quote-line.is-locked{background:#fbfcfb;align-items:center}
.quote-line.is-locked .quote-line-main{grid-template-columns:minmax(0,1fr)}
.quote-line.is-locked .quote-line-main span{font-size:13px}
.quote-line.is-locked .quote-line-kind{
  border:0;background:none;padding:0;min-height:0;
  font-size:11px;color:var(--muted);
}
.quote-line.is-locked .num{text-align:right;font-size:13px;font-variant-numeric:tabular-nums}
.quote-lock.is-alarm{border-color:#e5c3bb;background:#fdf1ee}
.quote-lock.is-alarm strong,.quote-lock.is-alarm p{color:#8d2f22}
.approval-sent-note{margin:14px 0 0;color:var(--muted);font-size:12px;line-height:1.5}

/* ---- typväljaren på en rad ------------------------------------------- */
/* Den var pastellfärgad med tunn ram och läste sig som en knapp. Ett fält
   som går att ändra ska se ut som fälten bredvid — samma höjd, samma ram,
   samma vita botten. Ingen egen form för samma sorts sak. */
.quote-line .quote-line-kind{
  min-height:32px;
  padding:5px 9px;
  border:1px solid #cfd8d2;
  border-radius:8px;
  background:#fff;
  color:var(--ink);
  font:inherit;
  font-size:12.5px;
}
/* I läsläge är den ingen kontroll alls, bara en etikett. */
.quote-line.is-locked .quote-line-kind{
  border:0;
  border-radius:0;
  padding:0;
  min-height:0;
  background:none;
  color:var(--muted);
  font-size:11px;
}

/* ---- summorna i samma kolumn som radernas belopp --------------------- */
/* Sammanställningen låg som ett eget högerställt block mot panelkanten,
   medan radernas belopp låg i BELOPP-kolumnen — som slutar tidigare, för
   raderna har två kolumner till för Spara och krysset. Samma rutnät här
   lägger talen rakt under varandra. */
.quote-totals div{
  display:grid;
  grid-template-columns:minmax(0,1fr) 74px 74px 96px 120px 92px 34px;
  gap:8px;
  /* Samma lådmått som en rad — 1 px ram och 8 px indrag — så att kolumnerna
     hamnar på exakt samma ställe oavsett hur många kolumner rutnätet har. */
  border:1px solid transparent;
  padding:0 8px;
  align-items:baseline;
}
.quote-totals div>span{grid-column:1 / 5}
.quote-totals div>b{grid-column:5;text-align:right}
/* Under 1100 px bryts raderna och beloppet flyttar ned till vänster under
   beskrivningen. Då finns ingen beloppskolumn att ligga i linje med, och
   summorna ställs som förut mot panelens högerkant. */
@media(max-width:1100px){
  .quote-totals div{display:flex;justify-content:space-between;padding:0}
}

/* ---- låst offert: inga tomma knappkolumner --------------------------- */
/* Raderna reserverar två kolumner för Spara och krysset. På en låst offert
   finns ingen av dem, och då ska beloppen inte dras in från sidans kant för
   att ge plats åt knappar som inte finns. */
.quote-lines-panel.is-locked .quote-line{
  grid-template-columns:minmax(0,1fr) 74px 74px 96px 120px;
}
.quote-lines-panel.is-locked .quote-line>span:nth-child(6),
.quote-lines-panel.is-locked .quote-line>span:nth-child(7){display:none}
.quote-lines-panel.is-locked .quote-totals div{
  grid-template-columns:minmax(0,1fr) 74px 74px 96px 120px;
}
@media(max-width:1100px){
  .quote-lines-panel.is-locked .quote-line{grid-template-columns:minmax(0,1fr) 62px 62px 84px}
}

/* ---- prislistan med kategori ----------------------------------------- */
.rate-row{grid-template-columns:minmax(0,1fr) 150px 110px}
.rate-row select{
  width:100%;min-width:0;min-height:34px;padding:6px 9px;
  border:1px solid #cfd8d2;border-radius:8px;font:inherit;font-size:12.5px;background:#fff;
}
.rate-row.is-head span:nth-child(3){text-align:right}
.rate-row.is-new input::placeholder{color:#9aa79f}
.rate-new-lead{margin:10px 0 2px;color:var(--muted);font-size:11.5px;font-weight:600}
@media(max-width:560px){
  .rate-row{grid-template-columns:minmax(0,1fr) 96px}
  .rate-row select{grid-column:1 / -1}
}
[data-modal=quote-rate-card] .portal-modal-body{display:block}
[data-modal=quote-rate-card] .form-actions{margin-top:14px}
/* Rollväljaren på en offertrad är samma sorts fält som beskrivningen. */
.quote-line .quote-line-kind{font-size:12.5px}
/* Nya raden: fasta kolumner nu när Typ-väljaren är borta. Auto-fit gav
   Antal lika mycket plats som Beskrivning. */
.quote-line-new{grid-template-columns:200px minmax(0,1fr) 90px 110px 132px}
.quote-line-new .button{grid-column:1}
@media(max-width:900px){.quote-line-new{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}}

/* Etiketten "ur prislistan" ska förklara, inte konkurrera. */
.quote-line-new label>span small{
  font-weight:600;color:var(--muted);font-size:10.5px;letter-spacing:.02em;
}

.quote-lines-empty form{margin:8px 0 0}
.quote-lines-empty .button{min-height:32px;padding:0 12px;font-size:12.5px}
.quote-lines-empty-alt{margin:8px 0 0!important;font-size:12px}

/* ---- raderna som ett formulär ---------------------------------------- */
/* Ingen Spara-knapp per rad längre, alltså en kolumn mindre. Beloppen kan
   flytta ut mot kanten igen, och summorna med dem. */
.quote-lines-form{margin:0}
.quote-lines-panel:not(.is-locked) .quote-line,
.quote-lines-panel:not(.is-locked) .quote-totals div{
  grid-template-columns:minmax(0,1fr) 74px 74px 96px 120px 34px;
}
.quote-lines-panel:not(.is-locked) .quote-line-head span:nth-child(7){display:none}
.quote-lines-panel:not(.is-locked) .quote-totals div{padding-right:6px}
.quote-lines-save{display:flex;justify-content:flex-end;margin-top:10px}
.quote-lines-save .button{min-height:34px}

/* Krysset: portalens eget, som i resurskalendern. */
.quote-line .place-remove{position:static;margin:0;display:flex;justify-content:center}
.quote-line .place-remove button{
  border:0;background:transparent;color:#68756d;font-size:15px;line-height:1;
  padding:2px 5px;cursor:pointer;border-radius:6px;
}
.quote-line .place-remove button:hover{background:#eef1ef;color:#b42318}
@media(max-width:1100px){
  .quote-lines-panel:not(.is-locked) .quote-line,
  .quote-lines-panel:not(.is-locked) .quote-totals div{grid-template-columns:minmax(0,1fr) 62px 62px 84px}
  .quote-line .place-remove{grid-column:4;justify-content:flex-end}
}

/* ---- förhandsgranskning i modal -------------------------------------- */
.quote-preview-modal{width:min(940px,calc(100% - 30px))}
.quote-preview-frame{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#f4f6f3}
.quote-preview-frame iframe{display:block;width:100%;height:min(70vh,760px);border:0}
.quote-preview-modal .form-actions{margin-top:12px}

/* ---- Ny offert: samma täthet som resten ------------------------------ */
/* Panelen var byggd med de gamla luftiga måtten — 40 px fält och en egen rad
   per grupp. Nu samma mått som offertsidans övriga formulär. */
.quote-new-panel{padding:10px 12px;margin-bottom:8px}
.quote-new-panel h2{margin:0 0 8px;font-size:15px}
.quote-new-form{grid-template-columns:minmax(150px,1fr) minmax(150px,1.1fr) repeat(3,minmax(0,1fr)) minmax(0,1fr) minmax(0,1fr) 104px;gap:8px 10px}
.quote-new-form label{font-size:12px;gap:3px}
.quote-new-form input,
.quote-new-form select{min-height:34px;padding:6px 9px;font-size:13px}
.quote-new-form .party-picker{display:contents}
.quote-new-form .party-picker label{display:grid;gap:3px;min-width:0;font-size:12px;font-weight:600}
.quote-new-form .party-picker select{width:100%;min-width:0;min-height:34px;padding:6px 9px;font-size:13px}
.quote-new-form .quote-currency{max-width:none}
.quote-new-form .button{min-height:34px;align-self:end}
/* Skapa-knappen langst till hoger. Den placeras i sista kolumnen i stallet
   for att flyta med falten, sa att den star pa samma kant oavsett hur manga
   falt som far plats pa en rad. */
.quote-new-form .quote-new-submit{grid-column:-2 / -1;justify-self:end;min-width:104px}
.quote-new-empty{margin:10px 0 0;font-size:13px;color:var(--muted)}
@media(max-width:1200px){.quote-new-form{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:760px){
  .quote-new-form{grid-template-columns:1fr 1fr}
}

/* Förhandsgranskningen visar utskriftsvyn, som är en vanlig sida — vit botten
   och en tydlig ram, så att det syns att det är dokumentet man tittar på. */
.quote-preview-frame{background:#fff}

/* ---- dokumentet i förhandsgranskningen -------------------------------- */
/* Ingen iframe: dokumentet skrivs in i modalen. Samma vy som utskriften, i en
   egen skrollruta så att modalen inte växer förbi skärmen. */
.quote-preview-doc{
  max-height:min(66vh,720px);
  overflow:auto;
  border:1px solid var(--line);
  border-radius:10px;
  background:#eef1ee;
  padding:16px;
}
.quote-preview-doc .quote-doc{margin:0 auto;box-shadow:0 6px 24px rgba(17,48,30,.10)}
.quote-preview-doc .quote-doc-actions{display:none}

/* Omfattningen i dokumentet — samma uppställning som i PDF:en. */
.quote-doc-scope{margin:22px 0 18px}
.quote-doc-scope>strong{
  display:block;font:700 10px/1 Inter,system-ui,sans-serif;letter-spacing:.09em;
  text-transform:uppercase;color:#173f2b;margin-bottom:8px;
}
.quote-doc-scope-lead{margin:0 0 12px}
.quote-doc-scope dl{
  display:grid;grid-template-columns:1fr 1fr;gap:2px 28px;margin:0;
}
.quote-doc-scope dl>div{display:flex;justify-content:space-between;gap:14px;padding:2px 0}
.quote-doc-scope dt{margin:0;color:#4a5a51}
.quote-doc-scope dd{margin:0;font-weight:700;text-align:right}
@media(max-width:700px){.quote-doc-scope dl{grid-template-columns:1fr}}

/* ---- Ny offert: fälten kan inte spilla över -------------------------- */
/* Ett rutnätsfält får sin minsta bredd av sitt innehåll om man inte säger
   annat, och då kan en lång rullgardin eller ett långt platshållartext
   trycka ut fältet ur sin kolumn. min-width:0 på barnen och width:100% på
   kontrollerna gör spill omöjligt oavsett vilka andra regler som finns. */
.quote-new-form > *,
.quote-new-form label,
.quote-new-form .party-picker > label{min-width:0}
.quote-new-form input,
.quote-new-form select,
.quote-new-form .party-picker select{
  width:100%;
  min-width:0;
  max-width:100%;
  box-sizing:border-box;
}
.quote-new-form label > span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}


/* ---- v0302 ------------------------------------------------------------- */
/* Ett val som redan ar gjort ska se ut som ett svar, inte som ett falt. */
.quote-meta-given{
  display:grid;gap:2px;
  padding:9px 12px;
  border:1px solid var(--line);
  border-radius:10px;
  background:var(--surface-2,#f4f6f4);
}
.quote-meta-given > span{font-size:12px;font-weight:600;color:var(--muted)}
.quote-meta-given > b{font-size:14px}
.quote-meta-given > small{font-size:11px;color:var(--muted)}

/* Varfor hyllan ar tom ska sta i klartext, inte gissas fram ur tankstreck. */
.quote-shelf-warning{
  margin:10px 0 0;
  padding:9px 12px;
  border:1px solid #e6d9a8;
  border-left:3px solid #c8a93a;
  border-radius:8px;
  background:#fdfaf0;
  font-size:13px;
  line-height:1.45;
}

/* Arbetsdagarna i perioden, raknade medan man andrar datumen. */
.quote-period-days{
  margin:-2px 0 0;
  font-size:12px;
  color:var(--muted);
}

/* ---- v0303: radens egen period ---------------------------------------- */
/* Ett langt uppdrag bemannas med flera omgangar. Raden bar nar just den
   omgangen ar pa plats, sa falten star under radens namn i stallet for i egna
   kolumner — radrutnatet ar redan fullt och skulle bli oläsligt. */
.quote-line-dates{
  display:flex;align-items:center;gap:6px;
  grid-column:1 / -1;
  margin-top:4px;
}
.quote-line-dates > span{
  font-size:11px;font-weight:600;color:var(--muted);
  white-space:nowrap;
}
.quote-line-dates input{
  /* Kompakta och vanstallda. Faltet ska rymma ett datum, inte breda ut sig
     over hela postkolumnen. */
  flex:0 0 auto;width:148px;min-width:0;
  min-height:28px;padding:3px 7px;font-size:12px;
}
@media(max-width:760px){ .quote-line-dates input{flex:1 1 0;width:auto} }
.quote-line-main .quote-line-period{
  display:block;margin-top:2px;
  font-size:11px;color:var(--muted);
}

/* Samma sak i dokumentet: under postens namn, inte i en egen kolumn. */
.quote-doc-line-period{
  display:block;margin-top:2px;
  font-size:10px;color:#68766d;
}

/* ═══ v0305 ══════════════════════════════════════════════════════════════ */

/* ---- en enda högerkant ------------------------------------------------- */
/* Belopp på raderna och summorna slutade redan på samma linje — de delar
   rutnät. Spara raderna var flex-högerställd mot panelens kant, 48 px längre
   ut: krysskolumnen 34 + mellanrummet 8 + summornas 6. Måttet står här, på ett
   ställe, så att alla följer med om radens rutnät ändras. */
:root{ --quote-edge-inset:48px; }
.quote-lines-panel:not(.is-locked) .quote-lines-save{ padding-right:var(--quote-edge-inset); }
/* v0331 — allt högerställt ska sluta på samma linje.
   Beloppen, summorna och Spara raderna slutade på 1418 px; Skicka… och
   Förhandsgranska på 1467, alltså 49 px längre ut. Skillnaden är kryss-kolumnen
   som raderna reserverar. Signeringsraden använder nu samma
   --quote-edge-inset som Spara raderna redan gjorde. Summorna låg redan rätt
   och rörs inte. */
.quote-sign-strip .quote-sign-strip-actions{ padding-right:var(--quote-edge-inset); }
/* Under 1100 px byter raden layout: kryss-kolumnen flyttar till radens
   högerkant och beloppet blir vänsterställt. Då finns ingen kryss-kolumn att
   kompensera för, och insatsen ska vara noll — annars ligger knapparna 48 px
   innanför summorna, vilket de gjorde. */
@media(max-width:1100px){
  :root{ --quote-edge-inset:0px; }
}

/* ---- offertnumret hör till rubriken ------------------------------------ */
/* Hyllan är för det som står i dokumentet. Numret och statusen är sidans egen
   identitet och står över titeln — nio fakta blev en för många på raden. */
.quote-toolbar .consultant-calendar-title .eyebrow{margin:0 0 1px;font-size:10.5px;letter-spacing:.08em}

/* ---- egen period på en rad --------------------------------------------- */
/* Undantaget, inte regeln: Project lead börjar tidigare för förarbetet, en
   assessoromgång är på plats en kortare stund. Knappen bor i radens egen del —
   radens yttre rutnät har exakt sex platser sedan v0288 och ska ha kvar dem. */
.quote-line-main{grid-template-columns:minmax(0,1fr) 132px auto}
.quote-line-period-toggle{
  border:1px solid transparent;background:none;padding:4px 8px;border-radius:7px;cursor:pointer;
  font-size:11px;font-weight:600;color:var(--muted);white-space:nowrap;
}
.quote-line-period-toggle:hover{background:var(--surface-2,#eef1ee);color:var(--ink)}
.quote-line-period-toggle.is-on{background:#e8f0e9;border-color:#cfe0d4;color:#1f5a39}

.quote-line .quote-line-dates{display:none}
.quote-line.is-open .quote-line-dates{
  display:flex;align-items:center;gap:8px;
  grid-column:1 / -1;margin:6px 0 0;padding-top:7px;
  border-top:1px dashed var(--line);
}
.quote-line-dates > span{font-size:11px;font-weight:600;color:var(--muted);white-space:nowrap}
.quote-line-dates input{flex:0 0 auto;width:148px;min-width:0;min-height:28px;padding:3px 7px;font-size:12px}
.quote-line-dates em{font-size:11px;color:var(--muted);font-style:normal}
@media(max-width:760px){ .quote-line-dates input{flex:1 1 0;width:auto} }

/* ---- meningen som säger var dagarna kommer ifrån ----------------------- */
.quote-lines-hint{
  margin:10px 0 0;padding-top:9px;border-top:1px solid var(--line);
  font-size:12.5px;color:var(--muted);line-height:1.5;
}

/* ---- lägg till rad ----------------------------------------------------- */
/* Var ett andra formulär med alla kolumnrubriker en gång till och tog en
   tredjedel av sidan. Nu en knapp och en mening. */
.quote-line-add{
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  margin:10px 0 0;padding-top:10px;border-top:1px solid var(--line);
}
.quote-line-add > span{font-size:12px;color:var(--muted)}

/* ---- ett projekt, en offert -------------------------------------------- */
/* display:flex slar ut webblasarens [hidden]{display:none} — utan den har
   raden blir rutan kvar nar man byter till ett fritt projekt. */
.quote-new-blocked[hidden]{display:none}
.quote-new-blocked{
  display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;
  margin-top:12px;padding:12px 14px;
  border:1px solid #e6d9a8;border-left:3px solid #c8a93a;border-radius:10px;background:#fdfaf0;
}
.quote-new-blocked strong{display:block;font-size:14px}
.quote-new-blocked p{margin:3px 0 0;font-size:12.5px;line-height:1.5;color:var(--muted);max-width:70ch}
.quote-new-blocked-actions{display:flex;gap:8px;flex-wrap:wrap}
/* Fälten göms medan projektet är upptaget — det finns inget att fylla i. */
.quote-new-form.is-blocked > label,
.quote-new-form.is-blocked .party-picker,
.quote-new-form.is-blocked .quote-currency,
.quote-new-form.is-blocked .quote-new-submit{display:none}
.quote-new-form.is-blocked > label:first-of-type{display:grid}

/* ---- skicka-modalens fält ---------------------------------------------- */
/* Legitimering såg ut som webbläsarens eget fält, inte som portalens. */
.quote-send-form{display:grid;gap:8px;margin:0}
.quote-send-form > label{display:grid;gap:3px;min-width:0}
.quote-send-form > label > span{font-size:12px;font-weight:600;color:var(--muted)}
.quote-send-form select,
.quote-send-form input{min-height:34px;padding:6px 9px;font-size:13px;width:100%}
.quote-send-form > .button{justify-self:end}


/* ── v0331, sist i filen ────────────────────────────────────────────────
   Summeringsraderna har 6 px höger-padding som knapparna saknar, satt av ett
   lager längre ned i filen. Regeln måste därför stå SIST för att vinna — inte
   med !important, utan med ordning. Under 1100 px är beloppet i raderna
   vänsterställt, så det finns inget kvar att kompensera för. */
@media(max-width:1100px){
  /* Regeln som satte den heter .quote-lines-panel:not(.is-locked) .quote-totals div
     — :not() räknas som en klass, alltså fyra. Min måste väga lika och stå
     senare. Med tre klasser förlorade den, vilket den gjorde i två försök. */
  .quote-lines-panel:not(.is-locked) .quote-totals > div{ padding-right:0; }
}
