/* v0279 — offertsidan. 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 span:first-child{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;
}
