/* KTM Voyage CRM — Calculations module styles [CAL]
   Brand tokens (gold #ccb52d, navy, Lato/Playfair) come from base.css.
   Adds: list toolbar with filters/sort/export, the Excel-like pricing editor
   (cost-line table + per-pax-tier totals matrix), margin warning states,
   version list, cancellation staffel card and the price-list picker.
   Responsive down to 390px; tables scroll inside their own wrapper. */

/* ---------- page head (list + editor) ---------- */
.page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:16px;flex-wrap:wrap}
.page-head h1{font-family:"Playfair Display",Georgia,serif;font-size:26px;color:#292109;margin:0}
.page-intro{color:var(--muted);font-size:13.5px;margin:6px 0 0;max-width:72ch;line-height:1.55}

.calc-backlink{display:inline-block;font-size:13px;color:var(--muted);text-decoration:none;margin-bottom:6px;padding:4px 0;min-height:24px}
.calc-backlink:hover{color:#292109;text-decoration:underline}
.calc-head-op{color:var(--muted);font-weight:400;font-size:18px}
.calc-head-meta{display:flex;align-items:center;gap:8px;margin-top:8px;flex-wrap:wrap}
.calc-head-actions{display:flex;gap:10px;align-items:flex-start;flex-wrap:wrap}

.calc-vbadge{display:inline-flex;align-items:center;background:#292109;color:var(--gold);font-weight:700;font-size:11.5px;border-radius:20px;padding:2px 10px;letter-spacing:.03em}
.calc-season-badge,.calc-bkg-badge{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;font-weight:700;color:var(--muted);background:#f4f2ea;border:1px solid var(--line);border-radius:20px;padding:2px 10px;white-space:nowrap}
.calc-bkg-badge{color:#2f6ea5;background:rgba(47,110,165,.1);border-color:rgba(47,110,165,.25)}

/* ---------- notices ---------- */
.calc-note{background:#f4f2ea;border:1px solid var(--line);border-radius:var(--radius);padding:11px 15px;font-size:13px;color:var(--muted);margin-bottom:14px}
.calc-note-locked{background:#eef6ee;border-color:#bcd9bc;color:#2c5e2c}
.calc-warn-banner{background:#fdf3e4;border:1px solid #ecc98f;border-left:5px solid #cf7a1d;border-radius:var(--radius);padding:12px 15px;font-size:13.5px;font-weight:600;color:#8a5410;margin-bottom:14px}

/* ---------- list toolbar ---------- */
.calc-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.calc-toolbar .calc-search{flex:1 1 220px;min-width:180px;min-height:42px;padding:9px 13px;border:1px solid var(--line);border-radius:8px;font-size:14px;background:#fff}
.calc-toolbar select{min-height:42px;padding:8px 11px;border:1px solid var(--line);border-radius:8px;font-size:13.5px;background:#fff;cursor:pointer}
.calc-toolbar .btn{min-height:42px}
.calc-count{font-size:12.5px;font-weight:700;color:var(--muted);white-space:nowrap;padding:0 2px}
.calc-toolbar-spacer{flex:1 0 0}

/* sortable list headers */
.calc-list-table th.sortable{cursor:pointer;user-select:none;white-space:nowrap}
.calc-list-table th.sortable:hover{color:#292109;background:#f6f4ee}
.calc-list-table th.sorted{color:#292109}

/* ---------- editor layout ---------- */
.calc-grid-top,.calc-grid-bottom{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}
.calc-card{padding:16px 18px;margin-bottom:16px}
.calc-grid-top .calc-card,.calc-grid-bottom .calc-card{margin-bottom:0}
.calc-card h3{font-size:15px;color:#292109;margin:0 0 4px}
.calc-card .hint{color:var(--muted-2);font-size:12.5px;margin:0 0 10px;line-height:1.5}
.calc-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:8px}
.calc-line-btns{display:flex;gap:8px;flex-wrap:wrap}
.calc-meta-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px 14px}
.calc-opt-hint{margin:2px 0 12px 26px}
.calc-card .check{display:flex;align-items:center;gap:8px;min-height:40px;cursor:pointer;font-size:13.5px}
.calc-card .field{margin-bottom:10px}

/* ---------- cost lines table ---------- */
.calc-lines-card{margin-bottom:16px}
.calc-lines-wrap{margin-top:6px}
.calc-lines-table{min-width:860px}
.calc-lines-table th{white-space:nowrap}
.calc-lines-table select,.calc-lines-table input{min-height:40px;padding:7px 9px;border:1px solid var(--line);border-radius:8px;font-size:13px;background:#fff;max-width:100%}
.calc-lines-table td{vertical-align:middle}
.calc-lines-table input[data-field="label"]{min-width:150px;width:100%}
.calc-nights input{width:64px;text-align:center}
.calc-na{color:var(--muted-2)}
.calc-amount .money-wrap{min-width:118px}
.calc-amount .money-wrap input{width:84px;min-height:40px}
.calc-rowbtns{white-space:nowrap;text-align:right}
.calc-lines-empty{padding:26px;text-align:center;color:var(--muted);font-size:13.5px;display:grid;gap:12px;justify-items:center}

/* icon buttons (pricelist / delete per row) — big enough to tap */
.iconbtn{display:inline-grid;place-items:center;width:40px;height:40px;border:1px solid var(--line);border-radius:8px;background:#fff;cursor:pointer;font-size:15px;color:var(--muted);margin-left:6px}
.iconbtn:hover{background:#f4f2ea;color:#292109}

/* ---------- per-pax totals matrix (his Excel, but tidy) ---------- */
.calc-totals-wrap{margin-top:6px}
.calc-totals-table{min-width:560px}
.calc-totals-table td,.calc-totals-table th{vertical-align:middle}
.calc-rowlabel{font-weight:700;color:var(--muted);font-size:12.5px;white-space:nowrap;min-width:150px}
.calc-rowlabel .hint{font-weight:400;margin:2px 0 0}
.calc-tiercol{text-align:right;font-variant-numeric:tabular-nums;min-width:132px}
.calc-tiercol.num{white-space:nowrap}
.calc-tier-head{display:flex;align-items:center;justify-content:flex-end;gap:6px}
.calc-tier-head input{width:72px;min-height:40px;text-align:center;font-weight:700;border:1px solid var(--line);border-radius:8px;font-size:14px}
.calc-tier-head span{color:var(--muted);font-size:12px;font-weight:700}
.calc-mini{width:64px;min-height:36px;text-align:center;border:1px solid var(--line);border-radius:8px}
.calc-agerow td{padding-top:4px;padding-bottom:4px}
.calc-agerow .calc-rowlabel,.calc-agerow{color:var(--muted-2)}

.calc-bus{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:700;border-radius:20px;padding:3px 10px;white-space:nowrap}
.calc-bus-minibus{color:#5d5636;background:rgba(204,181,45,.14)}
.calc-bus-bus30{color:#2f6ea5;background:rgba(47,110,165,.12)}
.calc-bus-coach{color:#2c5e2c;background:rgba(60,130,60,.12)}

.calc-totals-table .money-wrap{justify-content:flex-end;margin-left:auto;max-width:150px}
.calc-totals-table .money-wrap input{width:84px;min-height:40px}
.calc-margin-warn input{border-color:#cf7a1d;background:#fdf3e4}
.calc-margin-warn .money-cur{border-color:#cf7a1d;background:#f8e3c4;color:#8a5410}
.calc-warn-inline{font-size:11px;font-weight:700;color:#cf7a1d;margin-top:3px;white-space:nowrap}

.calc-finalrow td{background:#fbf7e6;border-top:2px solid var(--gold);border-bottom:2px solid var(--gold)}
.calc-final{font-family:"Playfair Display",Georgia,serif;font-size:19px;font-weight:700;color:#292109}

/* ---------- versions ---------- */
.calc-versions{list-style:none;margin:6px 0 0;padding:0}
.calc-versions li{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:8px;margin-bottom:8px;min-height:44px;background:#fff}
.calc-versions li[data-action]{cursor:pointer}
.calc-versions li[data-action]:hover{background:#fbfaf5;border-color:var(--gold)}
.calc-versions li.on{border-color:var(--gold);background:#fbf7e6}
.calc-vdate{margin-left:auto;color:var(--muted-2);font-size:12px;white-space:nowrap}

/* ---------- cancellation staffel ---------- */
.calc-staffel ul{list-style:none;margin:6px 0 0;padding:0}
.calc-staffel li{padding:8px 0 8px 26px;position:relative;font-size:13px;color:var(--ink);border-bottom:1px dashed var(--line)}
.calc-staffel li:last-child{border-bottom:none;font-weight:700}
.calc-staffel li::before{content:"•";position:absolute;left:8px;color:var(--gold);font-weight:700}

/* ---------- price-list picker (modal) ---------- */
.calc-pl-list{list-style:none;margin:8px 0 0;padding:0;max-height:52vh;overflow-y:auto}
.calc-pl-list li{display:flex;align-items:center;gap:12px;padding:11px 12px;border:1px solid var(--line);border-radius:8px;margin-bottom:8px;cursor:pointer;min-height:44px;background:#fff}
.calc-pl-list li:hover{background:#fbf7e6;border-color:var(--gold)}
.calc-pl-label{font-weight:600;font-size:13.5px}
.calc-pl-meta{color:var(--muted-2);font-size:12px;margin-left:auto;white-space:nowrap}
.calc-pl-list b{white-space:nowrap;font-variant-numeric:tabular-nums}

/* ---------- responsive (usable at 390px) ---------- */
@media (max-width:900px){
  .calc-grid-top,.calc-grid-bottom{grid-template-columns:1fr}
}
@media (max-width:640px){
  .calc-meta-grid{grid-template-columns:1fr}
  .page-head h1{font-size:21px}
  .calc-head-actions{width:100%}
  .calc-head-actions .btn{flex:1}
  .calc-toolbar .calc-search{flex-basis:100%}
  .calc-toolbar select{flex:1}
  .calc-toolbar .btn{flex:1;justify-content:center}
  .calc-count{order:5;flex-basis:100%;text-align:right}
  .calc-tiercol{min-width:118px}
  .calc-versions li{flex-wrap:wrap}
  .calc-vdate{flex-basis:100%;margin-left:0}
  .calc-pl-meta{display:none}
}

/* ---------- print (list or editor via the 🖨 button) ---------- */
@media print{
  .calc-toolbar,.calc-head-actions,.calc-line-btns,.iconbtn,.calc-rowbtns,.calc-backlink{display:none!important}
  .calc-card,.calc-versions li{box-shadow:none;border-color:#ccc}
  .calc-finalrow td{background:#f6f4ee!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .calc-lines-table,.calc-totals-table{min-width:0}
}

/* ---------- P2 polish: long program/supplier names never overflow ---------- */
.page-head h1{overflow-wrap:anywhere;min-width:0}
.calc-pl-label{overflow-wrap:anywhere;min-width:0}
.calc-versions li{min-width:0}

/* ================================================================== *
   [QCA] calc-power QoL: margin heatmap, what-if slider, version compare,
   cost-line templates and offer text blocks.
 * ================================================================== */

/* ---------- margin heatmap (per-tier margin cells + legend) ---------- */
.calc-totals-table td.calc-heat-red{background:rgba(196,61,61,.10);box-shadow:inset 3px 0 0 #c43d3d}
.calc-totals-table td.calc-heat-amber{background:rgba(207,122,29,.10);box-shadow:inset 3px 0 0 #cf7a1d}
.calc-totals-table td.calc-heat-green{background:rgba(60,130,60,.10);box-shadow:inset 3px 0 0 #3c823c}
.calc-heat-legend{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:10px;font-size:12px;color:var(--muted)}
.calc-heat-legend b{font-size:12px;color:var(--muted)}
.calc-heat-legend span{display:inline-flex;align-items:center;gap:6px}
.calc-heat-dot{display:inline-block;width:12px;height:12px;border-radius:50%}
i.calc-heat-dot.calc-heat-green{background:#3c823c}
i.calc-heat-dot.calc-heat-amber{background:#cf7a1d}
i.calc-heat-dot.calc-heat-red{background:#c43d3d}

/* ---------- mid grid (what-if + text blocks) ---------- */
.calc-grid-mid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}
.calc-grid-mid .calc-card{margin-bottom:0}

/* ---------- what-if pax slider ---------- */
.calc-whatif-slider{display:flex;align-items:center;gap:12px;margin:8px 0 14px}
.calc-whatif-range{flex:1;accent-color:var(--gold);min-height:40px;cursor:pointer}
.calc-whatif-num{width:76px;min-height:42px;text-align:center;font-weight:700;font-size:15px;border:1px solid var(--line);border-radius:8px}
.calc-whatif-paxlbl{font-size:12.5px;font-weight:700;color:var(--muted)}
.calc-whatif-result{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.calc-wi-tile{border:1px solid var(--line);border-radius:8px;padding:10px 12px;background:#fbfaf5;display:grid;gap:4px;align-content:start}
.calc-wi-tile small{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.calc-wi-tile b{font-size:16px;font-variant-numeric:tabular-nums;color:#292109}
.calc-wi-tile.calc-wi-final{background:#fbf7e6;border-color:var(--gold)}
.calc-wi-tile.calc-wi-final b{font-family:"Playfair Display",Georgia,serif;font-size:19px}
.calc-wi-tile.calc-heat-red{background:rgba(196,61,61,.08);border-color:rgba(196,61,61,.4)}
.calc-wi-tile.calc-heat-amber{background:rgba(207,122,29,.08);border-color:rgba(207,122,29,.4)}
.calc-wi-tile.calc-heat-green{background:rgba(60,130,60,.08);border-color:rgba(60,130,60,.35)}
.calc-whatif-empty{padding:18px;text-align:center;color:var(--muted);font-size:13px;grid-column:1/-1}

/* ---------- version compare (modal) ---------- */
.calc-cmp-pick{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.calc-cmp-pick .field{flex:1 1 180px;margin:0}
.calc-cmp-pick select{width:100%;min-height:42px;border:1px solid var(--line);border-radius:8px;padding:8px 10px;font-size:13.5px;background:#fff}
.calc-cmp-vs{font-size:18px;color:var(--muted);padding-bottom:10px}
.calc-cmp-h{font-size:14px;color:#292109;margin:16px 0 8px}
.calc-cmp-meta{list-style:none;margin:0;padding:0}
.calc-cmp-meta li{padding:7px 0 7px 22px;position:relative;font-size:13px;border-bottom:1px dashed var(--line)}
.calc-cmp-meta li::before{content:"±";position:absolute;left:4px;color:var(--gold);font-weight:700}
.calc-cmp-tier{margin-bottom:10px}
.calc-cmp-table{min-width:480px}
.calc-cmp-table .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
tr.calc-cmp-changed td{background:#fdfaf0}
.calc-cmp-delta{font-weight:700}
.calc-cmp-delta.calc-cmp-zero{color:var(--muted-2);font-weight:400}
.calc-cmp-delta.calc-cmp-good{color:#2c5e2c}
.calc-cmp-delta.calc-cmp-bad{color:#c43d3d}
.calc-cmp-delta.calc-cmp-neu{color:#2f6ea5}
.calc-cmp-lines{margin:8px 0 4px;font-size:12.5px}
.calc-cmp-lines b{font-size:12.5px}
.calc-cmp-lines ul{list-style:none;margin:4px 0 0;padding:0}
.calc-cmp-lines li{padding:5px 0 5px 18px;position:relative;border-bottom:1px dashed var(--line)}
.calc-cmp-lines-add li::before{content:"＋";position:absolute;left:0;color:#2c5e2c;font-weight:700}
.calc-cmp-lines-del li::before{content:"−";position:absolute;left:0;color:#c43d3d;font-weight:700}
.calc-cmp-lines-chg li::before{content:"±";position:absolute;left:0;color:#cf7a1d;font-weight:700}

/* ---------- cost-line templates (modal) ---------- */
.calc-tpl-list{list-style:none;margin:0 0 12px;padding:0;max-height:40vh;overflow-y:auto}
.calc-tpl-list li{display:flex;align-items:center;gap:10px;padding:9px 10px;border:1px solid var(--line);border-radius:8px;margin-bottom:8px;background:#fff}
.calc-tpl-list .check{flex:1;margin:0}
.calc-tpl-list .check span{display:grid;gap:2px}
.calc-tpl-list .check small{color:var(--muted-2);font-size:12px;font-weight:400}
.calc-tpl-list .iconbtn{margin-left:auto;flex:none}

/* ---------- offer text blocks (editor card + manager modal) ---------- */
.calc-txt-list{display:grid;gap:6px}
.calc-txt-item{align-items:flex-start!important}
.calc-txt-item input{margin-top:3px}
.calc-txt-item span{display:grid;gap:2px}
.calc-txt-item small{color:var(--muted-2);font-size:12px;line-height:1.45;font-weight:400}
.calc-txt-empty{padding:16px;text-align:center;color:var(--muted);font-size:13px;background:#fbfaf5;border:1px dashed var(--line);border-radius:8px}
.calc-txt-mgr{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.calc-txt-form h4{margin:0 0 10px;font-size:14px;color:#292109}
.calc-txt-form .btn{margin-top:4px}
.calc-txt-mgr-list{display:grid;gap:10px;align-content:start;max-height:56vh;overflow-y:auto}
.calc-txt-mgr-item{border:1px solid var(--line);border-radius:8px;padding:10px 12px;display:grid;gap:3px;background:#fff}
.calc-txt-mgr-item.on{border-color:var(--gold);background:#fbf7e6}
.calc-txt-mgr-item small{color:var(--muted-2);font-size:12px;overflow-wrap:anywhere}
.calc-txt-mgr-btns{display:flex;gap:8px;margin-top:6px;align-items:center}
.calc-txt-mgr-btns .iconbtn{margin-left:auto}

/* ---------- offerte print view: chosen text blocks ---------- */
.doc-txtblocks .doc-txtblock{font-size:12.5px;line-height:1.6;margin:0 0 8px}

/* ---------- responsive ---------- */
@media (max-width:900px){
  .calc-grid-mid{grid-template-columns:1fr}
  .calc-txt-mgr{grid-template-columns:1fr}
}
@media (max-width:640px){
  .calc-whatif-result{grid-template-columns:1fr 1fr}
  .calc-cmp-pick .field{flex-basis:100%}
  .calc-cmp-vs{display:none}
}

/* ---------- print: what-if and controls are screen-only ---------- */
@media print{
  .calc-whatif,.calc-heat-legend{display:none!important}
  .calc-txt-card .btn{display:none!important}
  .calc-totals-table td.calc-heat-red,.calc-totals-table td.calc-heat-amber,.calc-totals-table td.calc-heat-green{background:none;box-shadow:none}
}
