/* =====================================================================
   offert.css — offertflödet: sammanställningen i förfrågan, Annas
   offertverktyg (admin/offertverktyg.html) och offertsidan (sv/offert.html).
   ===================================================================== */

/* ---------- sammanställning med riktpris (förfrågan) ---------- */
.sum-rows{list-style:none;margin:0 0 10px;padding:0}
.sum-rows li{display:flex;justify-content:space-between;gap:14px;padding:7px 0;border-bottom:1px solid var(--line-2);font-size:14.5px}
.sum-rows b{font-family:var(--display);font-weight:700;white-space:nowrap}
.sum-rows i{font-style:normal;color:var(--ph)}
.sum-total{display:flex;justify-content:space-between;align-items:baseline;margin:6px 0 8px}
.sum-total span{font-family:var(--display);font-size:11.5px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--blue-deep)}
.sum-total b{font-family:var(--display);font-size:24px;font-weight:900}
.sum-note,.sum-tom,.sum-info{font-size:13px;color:var(--ink-soft);line-height:1.5;margin:0}
.sum-info{margin-top:10px;color:var(--ink)}

/* ---------- offertverktyget ---------- */
body.tool{padding-bottom:40px}
.tool-head{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:18px var(--gutter);border-bottom:1px solid var(--line);flex-wrap:wrap}
.tool-head .mark{color:#fff}
.tool-tag{margin:0;font-family:var(--display);font-weight:800;font-size:12px;letter-spacing:.2em;text-transform:uppercase}
.tool-tag span{color:var(--ink-soft)}
.tool-main{padding-top:40px}
.tool-intro{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-bottom:30px}
.tool-intro .h-lg{margin:0}
.tool-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:30px;align-items:start}
@media(max-width:960px){.tool-grid{grid-template-columns:minmax(0,1fr)}}
.tool-side{position:sticky;top:20px}
.tool-form fieldset{border:1px solid var(--line-2);background:var(--card);margin:0 0 16px;padding:18px 20px 20px}
.tool-form legend{font-family:var(--display);font-size:11.5px;font-weight:800;letter-spacing:.22em;text-transform:uppercase;color:var(--blue-deep);padding:0 8px}
.tf-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-bottom:12px}
.tool-form label{display:block;font-size:12.5px;color:var(--ink-soft);font-weight:600}
.tool-form input,.tool-form select,.tool-form textarea{display:block;width:100%;margin-top:6px;background:#070C1C;border:1px solid rgba(237,242,251,.2);
  color:var(--ink);font:inherit;font-size:15px;padding:10px 12px;border-radius:var(--radius);color-scheme:dark}
.tool-form input:focus,.tool-form select:focus,.tool-form textarea:focus{outline:none;border-color:var(--blue-deep)}
.tf-full{margin-bottom:12px}
.t-rader{margin:6px 0 14px}
.t-rad{display:grid;grid-template-columns:minmax(0,1fr) 130px 36px;gap:8px;padding:10px 0;border-bottom:1px solid var(--line-2)}
.t-rad input{margin:0}
.t-rad .r-b{grid-column:1/3;font-size:13.5px;padding:7px 10px}
.t-rad .r-x{grid-row:1;grid-column:3;background:none;border:1px solid var(--line);color:var(--ink-soft);border-radius:var(--radius);cursor:pointer;font-size:18px}
.t-rad .r-x:hover{color:#fff;border-color:#fff}
.t-forfragan{border:1px solid var(--line-2);padding:14px 18px}
.t-forfragan summary{cursor:pointer;font-family:var(--display);font-weight:700;font-size:14px}
.t-forfragan p{margin:10px 0 0;white-space:pre-wrap}
.t-lank{width:100%;background:#070C1C;border:1px solid var(--line);color:var(--ink-soft);font-size:12px;padding:8px 10px;margin-top:8px}
.tool-mail{margin-top:50px}
.mail-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:20px}
@media(max-width:1100px){.mail-grid{grid-template-columns:minmax(0,1fr)}}
.mail-card{background:var(--card);border:1px solid var(--line-2);padding:20px}
.mail-card pre{white-space:pre-wrap;font-family:var(--body);font-size:13.5px;line-height:1.6;color:rgba(237,242,251,.86);
  background:#070C1C;border:1px solid var(--line-2);padding:14px;margin:10px 0 14px;max-height:340px;overflow:auto}

/* ---------- offertsidan ---------- */
.offert-page{padding-top:140px}
.offert-wrap{max-width:900px}
.o-head{margin-bottom:34px}
.o-head .h-lg{margin-bottom:24px}
.o-meta{display:flex;flex-wrap:wrap;gap:12px 40px;margin:0;padding:16px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.o-meta dt,.o-info dt{font-family:var(--display);font-size:11px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--blue-deep);margin-bottom:3px}
.o-meta dd,.o-info dd{margin:0;font-size:15.5px}
.o-varning{background:rgba(242,193,78,.1);border:1px solid var(--ph);color:var(--ink);padding:14px 18px;margin:0 0 30px}
.o-halsning{border-left:2px solid var(--blue);padding:4px 0 4px 22px;margin:0 0 40px;font-size:17px;line-height:1.7;color:rgba(237,242,251,.92)}
.o-sign{font-family:var(--display);font-weight:700;margin-top:10px}
.o-sec{padding:30px 0;border-top:1px solid var(--line-2)}
.o-sec>.h-md{margin-bottom:18px;font-size:clamp(20px,2vw,26px)}
.o-info{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px 30px;margin:0}
.o-tab{width:100%;border-collapse:collapse;font-size:15.5px}
.o-tab td{padding:13px 0;border-bottom:1px solid var(--line-2);vertical-align:top}
.o-tab td b{display:block;font-family:var(--display);font-weight:700}
.o-tab td span{display:block;font-size:13.5px;color:var(--ink-soft);margin-top:2px}
.o-tab .num{text-align:right;white-space:nowrap;font-family:var(--display);font-weight:700;padding-left:20px}
.o-tab .o-total td{border-bottom:0;padding-top:16px;font-family:var(--display);font-weight:900;font-size:20px}
.o-not{font-size:14px;color:var(--ink-soft);margin:14px 0 0}
.o-two{display:grid;grid-template-columns:1fr 1fr;gap:40px}
@media(max-width:760px){.o-two{grid-template-columns:1fr}}
.o-two p{color:rgba(237,242,251,.86);font-size:15.5px}
.o-tl{margin-top:4px}
.o-godkann{background:var(--card);border:1px solid rgba(92,140,255,.45);padding:30px;margin-top:20px}
.o-godkann .form{margin-top:20px}
.o-godkann #g-fel{display:none;color:#FF8A8A}
.o-kontakt{margin-top:30px;font-size:14px;color:var(--ink-soft)}
.o-tom{padding:40px 0 80px}
.o-print{display:none}

@media print{
  @page{size:A4;margin:16mm}
  body{background:#fff!important;color:#111!important;padding:0!important}
  .site-head,.nav-panel,.foot,.mcta,.motion-toggle,.o-godkann,.skip{display:none!important}
  .offert-page{padding:0!important}
  .o-kontakt{margin-bottom:0}
  .o-head .h-lg .hl,.o-sec>.h-md,.o-tab td b,.o-tab .o-total td,.o-sign,.tl b{color:#111!important;-webkit-text-fill-color:#111!important}
  .o-head .h-lg .hs,.o-not,.o-tab td span,.o-kontakt,.tl p{color:#555!important}
  .o-meta dd,.o-info dd,.o-tab td,.o-halsning,.o-two p,.check li{color:#222!important}
  .o-meta,.o-sec,.o-tab td{border-color:#ddd!important}
  .eyebrow,.o-meta dt,.o-info dt,.tl .t{color:#2F6BFF!important}
  .o-sec{break-inside:auto;padding:14px 0}
  .o-sec>.h-md{break-after:avoid}
  html{font-size:90%}
  .o-head{margin-bottom:14px}
  .o-head .h-lg{margin-bottom:12px;font-size:26pt}
  .o-halsning{margin-bottom:14px;font-size:11pt}
  .o-sec>.h-md{margin-bottom:8px;font-size:14pt}
  .tl li{padding-bottom:8px}
  .o-tab td{padding:7px 0}
  .check li{padding:3px 0 3px 30px}
  .o-tab,.o-two>div,.tl li,.o-halsning{break-inside:avoid}
  .o-print{display:block!important;margin-top:18px;padding:12px 14px;border:1px solid #ddd;color:#222!important;font-size:10pt}
  a{color:#111!important}
}
.o-tom .btn{letter-spacing:.06em;text-transform:none;font-size:14px;max-width:100%}
