/* KTM Voyage CRM — dashboard + reports styles [RPT].
   index.html links reports.css only — dashboard styles live HERE by contract
   (there is no dashboard.css). Base tokens/components come from css/base.css. */

/* ================================================================== *
 * Shared bits (both pages)
 * ================================================================== */
.card-sub{color:var(--muted);font-size:12.5px;font-weight:400;margin:0 0 10px}
.card .ch .card-sub{margin:0;white-space:nowrap}
.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.pos{color:var(--ok);font-weight:700}
.neg{color:var(--bad);font-weight:700}

/* ================================================================== *
 * Dashboard
 * ================================================================== */
.dash-kpis{margin-bottom:16px}
.dash-hero{margin-bottom:16px}
.dash-hero .cb{padding-top:10px}

/* Hero YoY pax chart (SVG scales with its box; scrolls on tiny screens) */
.dash-hero .cb{overflow-x:auto}
.paxchart{width:100%;min-width:520px;height:auto;display:block}
.yoy-delta{font-weight:700;font-size:12px;margin-left:auto;white-space:nowrap}
.yoy-delta.up{color:var(--ok)}
.yoy-delta.down{color:var(--bad)}

/* Action-needed / deadlines lists */
.dash-lists{margin-bottom:16px}
.dash-list{list-style:none;margin:0;padding:0}
.dash-list li+li{border-top:1px solid #f0eee7}
.dash-list a{display:flex;align-items:center;gap:12px;padding:11px 6px;border-radius:8px;min-height:44px}
.dash-list a:hover{background:#fbfaf5}
.dash-list .dl-main{min-width:0;flex:1}
.dash-list .dl-main b{display:block;font-size:13.5px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dash-list .dl-main small{color:var(--muted);font-size:12px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dash-list .dl-date{flex:0 0 auto;font-weight:700;font-size:12px;color:#8a7a1d;background:rgba(204,181,45,.16);border-radius:6px;padding:5px 9px;font-variant-numeric:tabular-nums}
.dash-list .flag{flex:0 0 auto}
.dash-empty{padding:22px 12px;text-align:center;color:var(--muted);font-size:13px}
.dash-empty.ok{color:var(--ok);font-weight:700}
.dash-empty.sm{padding:12px 8px}
.dash-recent .ch .btn{flex:0 0 auto}

/* ------------------------------------------------------------------ *
 * Dashboard widgets [QDA] — configurable grid, skeletons, widget bodies
 * ------------------------------------------------------------------ */
.btn-personalize{flex:0 0 auto;white-space:nowrap}

.dash-widgets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-bottom:16px}
.dash-widgets .widget{margin:0;display:flex;flex-direction:column}
.dash-widgets .widget .cb{flex:1}
.dash-widgets .w-wide{grid-column:1/-1}
.widget .ch h3{display:flex;align-items:center;gap:7px;min-width:0}
.widget .ch .w-ic{flex:0 0 auto;font-size:16px}
.widget .ch .btn{flex:0 0 auto}

/* Skeleton loader (shimmer) — shown while a widget fetches its data */
.wskel{display:flex;flex-direction:column;gap:10px;padding:8px 0}
.wskel i{display:block;height:13px;border-radius:7px;
  background:linear-gradient(90deg,#f1efe6 25%,#faf9f3 50%,#f1efe6 75%);
  background-size:200% 100%;animation:wshimmer 1.2s linear infinite}
.wskel i:nth-child(2){width:78%}
.wskel i:nth-child(3){width:55%}
.wskel i:nth-child(4){width:88%}
@keyframes wshimmer{from{background-position:200% 0}to{background-position:-200% 0}}
@media(prefers-reduced-motion:reduce){.wskel i{animation:none}}

/* Widget error + footers + "+n more" link */
.w-error{padding:18px 12px;text-align:center;color:var(--muted);font-size:13px}
.w-error .btn{margin-top:10px}
.w-foot{margin-top:10px;padding-top:9px;border-top:1px solid #f0eee7;color:var(--muted);font-size:12.5px}
.w-foot b{color:var(--ink)}
.w-more{display:block;text-align:center;padding:9px 6px;font-weight:700;font-size:12.5px;color:#8a7a1d;border-radius:8px}
.w-more:hover{background:#fbfaf5}

/* Release radar: missed deadlines in red above the upcoming list */
.radar-late-h{font-size:11.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--bad);margin:2px 0 4px}
.radar-late{margin-bottom:8px;border-bottom:1px solid #f0eee7;padding-bottom:6px}
.dash-list .dl-date.late{color:#a03024;background:rgba(202,80,60,.14)}

/* Today: arrivals | departures columns */
.today-cols{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.today-h{font-size:12.5px;font-weight:700;color:var(--muted);margin-bottom:4px}
.today-h b{color:var(--ink)}

/* Cashflow: horizontal per-month bars (finance) */
.cf-row{display:flex;align-items:center;gap:9px;padding:6px 0;font-size:13px}
.cf-row+.cf-row{border-top:1px solid #f7f5ee}
.cf-lab{flex:0 0 92px;color:var(--muted);font-weight:700;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cf-bar{flex:1;height:10px;background:#f4f2ea;border-radius:5px;overflow:hidden}
.cf-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--gold),var(--gold-2));border-radius:5px}
.cf-amt{flex:0 0 auto;font-variant-numeric:tabular-nums;white-space:nowrap}
.cf-amt.muted{color:var(--muted);font-weight:400}
.cf-row small{flex:0 0 auto;color:var(--muted);font-variant-numeric:tabular-nums}
.cf-row.cf-red .cf-lab{color:var(--bad)}
.cf-row.cf-red .cf-bar i{background:linear-gradient(90deg,#ca503c,#e07a64)}
.cf-row.cf-red .cf-amt{color:var(--bad);font-weight:700}

/* Top partners: pax share bars */
.tp-row{display:grid;grid-template-columns:minmax(80px,140px) 1fr auto auto;align-items:center;gap:9px;padding:7px 0;font-size:13px}
.tp-row+.tp-row{border-top:1px solid #f7f5ee}
.tp-name{font-weight:700;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tp-bar{height:9px;background:#f4f2ea;border-radius:5px;overflow:hidden}
.tp-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--gold),var(--gold-2));border-radius:5px}
.tp-pax{font-variant-numeric:tabular-nums}
.tp-row small{color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums}

/* Occupancy: one bar per property */
.occ-month{font-size:12px;font-weight:700;color:var(--muted);margin-bottom:6px;text-transform:capitalize}
.occ-row{display:grid;grid-template-columns:minmax(90px,150px) 1fr auto auto;align-items:center;gap:9px;padding:8px 0;font-size:13px}
.occ-row+.occ-row{border-top:1px solid #f7f5ee}
.occ-name{font-weight:700;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.occ-bar{height:12px;background:#f4f2ea;border-radius:6px;overflow:hidden}
.occ-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--gold),var(--gold-2));border-radius:6px}
.occ-pct{font-variant-numeric:tabular-nums}
.occ-row small{color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums}

/* Subsidy pipeline: status → count rows with dotted leaders */
.pipe-row{display:flex;align-items:center;gap:9px;padding:7px 0;font-size:13px}
.pipe-row+.pipe-row{border-top:1px solid #f7f5ee}
.pipe-dots{flex:1;border-bottom:2px dotted #e6e2d4;margin-bottom:4px}
.pipe-row b{font-variant-numeric:tabular-nums;min-width:22px;text-align:right}
.pipe-row small{color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}

/* Personalise modal: big click targets for show/hide + reorder */
.wp-hint{margin:0 0 12px;color:var(--muted);font-size:13px}
.wprefs{list-style:none;margin:0;padding:0}
.wprefs li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 4px;min-height:48px}
.wprefs li+li{border-top:1px solid #f0eee7}
.wprefs .check{display:flex;align-items:center;gap:10px;font-size:14px;cursor:pointer;min-width:0;flex:1}
.wprefs .check input{width:19px;height:19px;flex:0 0 auto;accent-color:var(--gold)}
.wprefs .check span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wp-move{display:flex;gap:5px;flex:0 0 auto}
.wp-move .btn{min-width:40px;min-height:36px;padding:4px 8px}
.wp-move .btn[disabled]{opacity:.3;cursor:default}

/* Widgets: responsive + print (kept inside the dashboard section) */
@media(max-width:900px){
  .dash-widgets{grid-template-columns:1fr}
}
@media(max-width:640px){
  .today-cols{grid-template-columns:1fr}
  .cf-lab{flex-basis:76px}
  .tp-row{grid-template-columns:minmax(70px,110px) 1fr auto auto}
  .occ-row{grid-template-columns:minmax(80px,120px) 1fr auto auto}
  .btn-personalize{width:100%}
}
@media print{
  .dash-widgets{grid-template-columns:1fr 1fr}
  .btn-personalize,.widget .ch .btn,.w-more{display:none}
  .wskel i{animation:none}
}

/* ================================================================== *
 * Reports
 * ================================================================== */
.season-pick{display:flex;align-items:center;gap:9px;font-size:12px;font-weight:700;color:var(--muted);letter-spacing:.02em}
.season-pick select{padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:#fff;font-size:14px;font-weight:700;color:var(--ink);min-height:40px;font-variant-numeric:tabular-nums}
.season-pick select:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(204,181,45,.18)}

.rep-sub{color:var(--muted);font-size:13px;margin:-6px 0 12px}
.rep-filters input[type="search"]{min-height:40px;min-width:200px;flex:0 1 260px}
.rep-filters .btn{min-height:40px}
.rep-body{min-height:120px}
.rep-empty{padding:44px 24px;text-align:center;color:var(--muted);background:#fff;border:1px dashed var(--line);border-radius:var(--radius);font-size:13.5px}

/* Sortable headers */
.rep-table th .sortmark{font-size:9px;opacity:.45;margin-left:3px}
.rep-table th.sorted{color:#292109}
.rep-table th.sorted .sortmark{opacity:1;color:#8a7a1d}

/* Totals row */
.rep-table tr.totals td{font-weight:700;background:#faf8f1;border-top:2px solid var(--line);border-bottom:none}

/* Per partner: share bar */
.sharecell{min-width:130px}
.sharebar{display:inline-block;height:9px;max-width:calc(100% - 44px);background:linear-gradient(90deg,var(--gold),var(--gold-2));border-radius:5px;vertical-align:middle;margin-right:7px}
.sharecell small{color:var(--muted);font-variant-numeric:tabular-nums}

/* Per month: grouped double header */
.rep-months th{text-align:center}
.rep-months thead tr:first-child th{border-bottom:1px solid #ddd8cc}
.rep-months thead tr:first-child th:first-child{text-align:left}
.rep-months td:first-child{font-weight:700}
.rep-months td.num{color:var(--ink)}

/* P&L cards */
.pnl-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px}
.pnl-card .cb{padding-top:12px}
.pnl-combined{border:2px solid var(--gold);background:#fffdf4}
.pnl-line{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px solid #f0eee7;font-size:13.5px}
.pnl-line span{color:var(--muted)}
.pnl-line b{font-variant-numeric:tabular-nums;white-space:nowrap}
.pnl-line.pnl-result{border-top:2px solid var(--line);border-bottom:none;margin-top:4px;padding-top:11px;font-size:15px}
.pnl-line.pnl-result span{color:var(--ink);font-weight:700}
.pnl-line.pnl-result.pos b{color:var(--ok)}
.pnl-line.pnl-result.neg b{color:var(--bad)}
.pnl-line.pnl-small{font-size:12px;border-bottom:none;padding:4px 0}
.pnl-line.pnl-small b{color:var(--muted);font-weight:600}

/* ================================================================== *
 * Print — the active report table prints clean (chrome is hidden by print.css)
 * ================================================================== */
@media print{
  .dash-hero .cb{overflow:visible}
  .paxchart{min-width:0}
  .rep-sub{margin-top:0}
  .season-pick{display:none}
  .pnl-grid{grid-template-columns:1fr 1fr}
  .dash-list a{min-height:0;padding:6px 0}
}

/* ================================================================== *
 * Responsive — usable at 390px (tables scroll in .tablewrap, forms stack)
 * ================================================================== */
@media(max-width:640px){
  .season-pick{width:100%;justify-content:space-between}
  .season-pick select{flex:1;max-width:200px}
  .rep-filters input[type="search"]{flex:1 1 100%;min-width:0}
  .rep-filters .count{margin-left:0;order:3}
  .rep-filters .btn{flex:1 1 auto}
  .rep-table th,.rep-table td{padding:9px 10px}
  .pnl-grid{grid-template-columns:1fr}
  .dash-list a{padding:12px 4px}
  .kpi b{font-size:24px}
}

/* ---------- P2 polish: long labels never overflow ---------- */
.pnl-line span{overflow-wrap:anywhere}
