/* ============================================================
   02-costsheet.css
   ----------------------------------------------------------
   NOTE: T-Go-Hub Beta 29 does NOT have a separate CostSheet
   <style> block in the source HTML. CostSheet styles are
   embedded in 01-core.css (Hub V3 CSS — Office 365 design).
   This file is kept as a placeholder so the planned load
   order is preserved and future CostSheet-specific styles
   can be added here without re-architecting the layout.
   ============================================================ */

/* ============================================================
   T-Costsheet Office 365 UX shell
   Replaces the old flat Costflow surface with Fluent-style
   context header, command bar, pivot tabs and carded content.
   Existing Costsheet logic still renders inside #cs-main-container.
   ============================================================ */
#costsheetPage{background:var(--bg-app);min-height:calc(100vh - 48px)}
.cs365-shell{min-height:100%;background:var(--bg-app)}
.cs365-header{background:linear-gradient(135deg,#fff 0%,#f4fffd 100%);border-bottom:1px solid var(--line);padding:22px 28px;position:relative;overflow:hidden}
.cs365-header:before{content:"";position:absolute;right:-120px;top:-140px;width:360px;height:360px;border-radius:50%;background:rgba(20,184,166,.08);pointer-events:none}
.cs365-breadcrumb{font-size:12px;color:var(--ink-secondary);margin-bottom:10px;position:relative}
.cs365-title-row{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;position:relative}
.cs365-title{font-size:26px;font-weight:700;letter-spacing:-.02em;display:flex;align-items:center;gap:12px}
.cs365-title .tgo-module-logo{width:46px;height:46px;flex-shrink:0}
.cs365-sub{margin-top:5px;color:var(--ink-secondary)}
.cs365-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.cs365-pill{border:1px solid var(--line-strong);background:#fff;border-radius:999px;padding:5px 10px;font-size:12px;color:var(--ink-secondary)}
.cs365-pill.status{background:#fff8d6;color:#8a6a00;border-color:#f6df7b;font-weight:700}
.cs365-total{text-align:right;background:#fff;border:1px solid var(--line);border-radius:10px;padding:14px 18px;min-width:240px;box-shadow:var(--shadow-4)}
.cs365-total span,.cs365-total small{display:block;color:var(--ink-secondary);font-size:12px}.cs365-total b{display:block;font-size:22px;color:var(--costsheet);margin:2px 0}
.cs365-command{background:#fff;border-bottom:1px solid var(--line);padding:10px 28px;display:flex;gap:8px;align-items:center;flex-wrap:wrap;position:sticky;top:48px;z-index:16}
.cs365-btn{height:32px;border:1px solid var(--line-strong);background:#fff;border-radius:4px;padding:0 12px;font:inherit;font-size:13px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.cs365-btn:hover{background:var(--bg-canvas)}.cs365-btn.primary{background:var(--ms-blue);border-color:var(--ms-blue);color:#fff}.cs365-btn.primary:hover{background:var(--ms-blue-hover)}.cs365-btn.accent{background:var(--costsheet);border-color:var(--costsheet);color:#fff}
.cs365-sep{width:1px;height:22px;background:var(--line-strong);margin:0 4px}.cs365-spacer{flex:1}
.cs365-tabs{background:#fff;border-bottom:1px solid var(--line);padding:0 28px;display:flex;gap:0;overflow-x:auto;position:sticky;top:101px;z-index:15}
.cs365-tabs button{height:auto;padding:13px 16px;border:0;border-bottom:2px solid transparent;background:transparent;color:var(--ink-secondary);font:inherit;font-size:13px;cursor:pointer;white-space:nowrap;border-radius:0;margin:0;display:inline-flex;align-items:center;gap:8px}
.cs365-tabs button:hover{background:transparent;color:var(--ink-primary)}
.cs365-tabs button.on{background:transparent;color:var(--costsheet);border-bottom-color:var(--costsheet);font-weight:700;box-shadow:none}
.cs365-tabs button .ic{font-size:15px}
.cs365-content{padding:22px 28px;max-width:1500px;margin:0 auto}
#costsheetPage #cs-main-container{background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 1px 2px rgba(0,0,0,.04);padding:0;overflow:hidden}
#costsheetPage .cs-scope .main{margin:0!important;width:100%;background:#fff}
#costsheetPage .cs-scope .page,#costsheetPage .cs-scope .module-content,#costsheetPage .cs-scope .content{background:#fff}
#costsheetPage .data-table,#costsheetPage .card,#costsheetPage .panel,#costsheetPage .cs-card{border-radius:8px;border-color:var(--line)}
#costsheetPage .module-toolbar{position:relative;top:auto;border-bottom:1px solid var(--line);background:#fbfbfb}
@media(max-width:900px){.cs365-title-row{flex-direction:column}.cs365-total{text-align:left;width:100%}.cs365-command,.cs365-tabs{top:48px;position:relative}.cs365-content{padding:14px}.cs365-header{padding:18px}}

/* ============================================================
   T-Costsheet Office 365 UX polish v2
   Scope: visual only. Keeps existing functions, data flow and IDs.
   ============================================================ */
#costsheetPage{
  --cs-accent: var(--costsheet);
  --cs-accent-soft: var(--costsheet-soft);
  --cs-page-max: 1480px;
  --cs-r: 4px;
  --cs-r-lg: 6px;
  --cs-border: #e1dfdd;
  --cs-border-soft: #edebe9;
  --cs-card-shadow: 0 1px 2px rgba(0,0,0,.06);
  background:#faf9f8;
}
#costsheetPage .cs365-shell{background:#faf9f8;padding:16px 20px 24px;}
#costsheetPage .cs365-header,
#costsheetPage .cs365-command,
#costsheetPage .cs365-tabs,
#costsheetPage .cs365-content{max-width:var(--cs-page-max);margin-left:auto;margin-right:auto;}
#costsheetPage .cs365-header{
  padding:18px 20px;
  border:1px solid var(--cs-border);
  border-radius:var(--cs-r-lg) var(--cs-r-lg) 0 0;
  background:linear-gradient(135deg,#fff 0%,#fbfffe 68%,#f3fbfa 100%);
  box-shadow:var(--cs-card-shadow);
}
#costsheetPage .cs365-header:before{width:260px;height:260px;right:-92px;top:-118px;background:rgba(20,184,166,.06);}
#costsheetPage .cs365-breadcrumb{font-size:11px;margin-bottom:8px;color:#605e5c;}
#costsheetPage .cs365-title-row{align-items:center;gap:16px;}
#costsheetPage .cs365-title{font-size:22px;line-height:1.15;font-weight:700;gap:10px;}
#costsheetPage .cs365-title .tgo-module-logo{width:38px!important;height:38px!important;}
#costsheetPage .cs365-sub{font-size:13px;margin-top:4px;color:#605e5c;}
#costsheetPage .cs365-meta{margin-top:12px;gap:6px;}
#costsheetPage .cs365-pill{height:26px;display:inline-flex;align-items:center;border-color:var(--cs-border);background:#fff;padding:0 10px;border-radius:13px;font-size:11.5px;}
#costsheetPage .cs365-pill.status{background:#fff4ce;border-color:#f8d66d;color:#8a6a00;}
#costsheetPage .cs365-total{
  min-width:210px;padding:12px 14px;border-radius:var(--cs-r);border-color:var(--cs-border);box-shadow:none;background:#fff;
}
#costsheetPage .cs365-total b{font-size:19px;line-height:1.2;color:#0f766e;}
#costsheetPage .cs365-command{
  position:sticky;top:48px;z-index:18;
  padding:8px 12px;
  border-left:1px solid var(--cs-border);border-right:1px solid var(--cs-border);border-bottom:1px solid var(--cs-border);
  background:#fff;box-shadow:0 1px 1px rgba(0,0,0,.03);gap:6px;
}
#costsheetPage .cs365-btn,
#costsheetPage .btn{
  min-height:30px;height:30px;border-radius:var(--cs-r);border-color:#d2d0ce;background:#fff;color:#323130;
  padding:0 10px;font-size:12.5px;font-weight:600;box-shadow:none;transition:background .12s,border-color .12s,box-shadow .12s;
}
#costsheetPage .cs365-btn:hover,
#costsheetPage .btn:hover{background:#f3f2f1;border-color:#c8c6c4;}
#costsheetPage .cs365-btn.primary,
#costsheetPage .btn.btn-g{background:#0078d4;border-color:#0078d4;color:#fff;}
#costsheetPage .cs365-btn.primary:hover,
#costsheetPage .btn.btn-g:hover{background:#106ebe;border-color:#106ebe;}
#costsheetPage .cs365-btn.accent{background:#0f766e;border-color:#0f766e;color:#fff;}
#costsheetPage .cs365-sep{height:20px;background:#d2d0ce;margin:0 2px;}
#costsheetPage .cs365-tabs{
  position:sticky;top:96px;z-index:17;
  padding:0 12px;border-left:1px solid var(--cs-border);border-right:1px solid var(--cs-border);border-bottom:1px solid var(--cs-border);
  background:#fff;min-height:43px;
}
#costsheetPage .cs365-tabs button{height:43px;padding:0 14px;font-size:13px;border-bottom-width:2px;}
#costsheetPage .cs365-tabs button.on{color:#0f766e;border-bottom-color:#0f766e;}
#costsheetPage .cs365-content{padding:16px 0 0;}
#costsheetPage #cs-main-container{
  border:0;border-radius:0;background:transparent;box-shadow:none;overflow:visible;
}
#costsheetPage .cs-scope .main{min-height:360px;background:transparent!important;}
#costsheetPage .cs-scope .empty{background:#fff;border:1px solid var(--cs-border-soft);border-radius:var(--cs-r-lg);}

/* Generic inner surfaces */
#costsheetPage .data-table,
#costsheetPage .card,
#costsheetPage .panel,
#costsheetPage .cs-card,
#costsheetPage .policy-panel,
#costsheetPage .ptcard,
#costsheetPage .umcard,
#costsheetPage .po-card,
#costsheetPage .pobox,
#costsheetPage .apbox{
  background:#fff!important;border:1px solid var(--cs-border)!important;border-radius:var(--cs-r-lg)!important;box-shadow:var(--cs-card-shadow)!important;
}
#costsheetPage .module-toolbar,
#costsheetPage .toolbar,
#costsheetPage .tb,
#costsheetPage .pagebar,
#costsheetPage .data-table-toolbar{
  background:#fff!important;border:1px solid var(--cs-border)!important;border-radius:var(--cs-r-lg)!important;padding:10px 12px!important;margin-bottom:12px!important;gap:8px;box-shadow:var(--cs-card-shadow);
}
#costsheetPage .data-table-toolbar{border-radius:var(--cs-r-lg) var(--cs-r-lg) 0 0!important;margin-bottom:0!important;border-bottom-color:var(--cs-border-soft)!important;}

/* Tables */
#costsheetPage table{border-collapse:separate;border-spacing:0;}
#costsheetPage th,
#costsheetPage .deal-table thead th,
#costsheetPage .cf2-table th{
  background:#f8f8f8!important;color:#605e5c!important;font-size:11px!important;font-weight:700!important;letter-spacing:.04em;text-transform:uppercase;border-bottom:1px solid var(--cs-border)!important;
}
#costsheetPage td,
#costsheetPage .deal-table tbody td,
#costsheetPage .cf2-table td{border-bottom:1px solid #f3f2f1!important;vertical-align:middle;}
#costsheetPage tr:hover td{background:#fafafa;}
#costsheetPage .num,
#costsheetPage .deal-amount{text-align:right;font-variant-numeric:tabular-nums;}

/* Inputs */
#costsheetPage input,
#costsheetPage select,
#costsheetPage textarea,
#costsheetPage .sinp,
#costsheetPage .ci{
  border:1px solid #d2d0ce!important;border-radius:var(--cs-r)!important;background:#fff!important;color:#201f1e!important;min-height:30px;
}
#costsheetPage input:focus,
#costsheetPage select:focus,
#costsheetPage textarea:focus,
#costsheetPage .sinp:focus,
#costsheetPage .ci:focus{outline:none!important;border-color:#0078d4!important;box-shadow:0 0 0 2px rgba(0,120,212,.14)!important;}

/* Sales pipeline kanban */
#costsheetPage .pipeline,
#costsheetPage .pgrid,
#costsheetPage .kanban{gap:10px;}
#costsheetPage .pcol{
  background:#f3f2f1!important;border:1px solid var(--cs-border)!important;border-radius:var(--cs-r-lg)!important;overflow:hidden;box-shadow:none!important;
}
#costsheetPage .pch{border-radius:0!important;border-bottom:1px solid rgba(0,0,0,.08)!important;padding:10px 12px!important;font-weight:700;}
#costsheetPage .dc{
  margin:8px!important;border:1px solid #e1dfdd!important;border-radius:var(--cs-r)!important;background:#fff!important;box-shadow:0 1px 2px rgba(0,0,0,.05)!important;padding:10px 11px!important;
}
#costsheetPage .dc:hover{box-shadow:0 2px 6px rgba(0,0,0,.10)!important;transform:none!important;}
#costsheetPage .dn{font-weight:700;color:#201f1e;}
#costsheetPage .dcu,#costsheetPage .dm{color:#605e5c;}

/* Project / template cards */
#costsheetPage .card,
#costsheetPage .ptcard{transition:box-shadow .12s,border-color .12s;}
#costsheetPage .card:hover,
#costsheetPage .ptcard:hover{border-color:#c8c6c4!important;box-shadow:0 2px 8px rgba(0,0,0,.10)!important;transform:none!important;}

/* Policy cards */
#costsheetPage .policy-grid{gap:10px!important;}
#costsheetPage .policy-card{border:1px solid #edebe9!important;border-radius:var(--cs-r)!important;background:#fafafa!important;box-shadow:none!important;}
#costsheetPage .policy-head{border-bottom:1px solid #edebe9!important;padding-bottom:10px!important;margin-bottom:10px!important;}
#costsheetPage .policy-title{font-size:15px;font-weight:700;color:#201f1e;}
#costsheetPage .policy-sub{font-size:12px;color:#605e5c;}

/* Badges and statuses */
#costsheetPage .badge,
#costsheetPage .stage-draft,
#costsheetPage .stage-quoted,
#costsheetPage .stage-won,
#costsheetPage .stage-pending,
#costsheetPage .dcsc,
#costsheetPage .rpill{
  border-radius:999px!important;font-size:11px!important;font-weight:700!important;padding:3px 8px!important;
}

/* Modals: keep Office style and readable proportions */
#costsheetPage .md,
#costsheetPage .modal,
#costsheetPage [id^="md-"] > div > div{
  border-radius:6px!important;border:1px solid var(--cs-border)!important;box-shadow:0 16px 40px rgba(0,0,0,.20)!important;
}

@media(max-width:900px){
  #costsheetPage .cs365-shell{padding:10px;}
  #costsheetPage .cs365-header{padding:14px;border-radius:var(--cs-r-lg) var(--cs-r-lg) 0 0;}
  #costsheetPage .cs365-title-row{align-items:flex-start;}
  #costsheetPage .cs365-total{min-width:0;width:100%;}
  #costsheetPage .cs365-command,#costsheetPage .cs365-tabs{top:auto;position:relative;}
  #costsheetPage .cs365-content{padding-top:12px;}
}

/* ═══════════════════════════════════════════════════════════
   v17.0.0 — Mini Policy Badges (CS Card)
   ═══════════════════════════════════════════════════════════ */
.cs-mini-badges{
  display:flex;
  flex-wrap:wrap;
  gap:4px;
  margin:6px 0 4px;
}
.mini-badge{
  display:inline-flex;
  align-items:center;
  padding:2px 7px;
  border-radius:10px;
  font-size:10px;
  font-weight:700;
  white-space:nowrap;
  border:1px solid transparent;
  letter-spacing:0.02em;
}
.mb-fast { background:#EAF3EC; color:#1B6B45; border-color:#A8D4B6; }   /* small / ≤500k */
.mb-check{ background:#FFF7E6; color:#B86B00; border-color:#F0D090; }   /* medium / 500k-2M */
.mb-heavy{ background:#FFF0EE; color:#C0392B; border-color:#F5C0BB; }   /* large / >2M */
.mb-risk { background:#FFE9E9; color:#A80000; border-color:#F5A0A0; font-weight:800; }
.mb-tt   { background:#EFEDFE; color:#3F3680; border-color:#C7BFEB; }
.mb-boq  { background:#FAECE7; color:#993C1D; border-color:#F1C1B1; }
.mb-fast { background:#EAF3EC; color:#1B6B45; border-color:#A8D4B6; }


/* V1.17 - Costsheet creation/template drawer and compact one-line CS V2 tabs */
.mdbg.tgo-drawer-bg{
  align-items:stretch !important;
  justify-content:flex-end !important;
  padding:0 !important;
}
.mdbg.tgo-drawer-bg .md{
  width:min(980px,96vw) !important;
  max-width:96vw !important;
  height:100vh !important;
  max-height:100vh !important;
  border-radius:18px 0 0 18px !important;
  overflow-y:auto !important;
  padding:22px 24px !important;
  box-shadow:-20px 0 60px rgba(15,23,42,.22) !important;
}
.tgo-drawer-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:14px;
  margin:-2px 0 16px;
  padding-bottom:12px;
  border-bottom:1px solid var(--bd);
  position:sticky;
  top:-22px;
  background:var(--sf);
  z-index:2;
}
.tgo-drawer-head h3{margin:0 0 4px !important;}
.tgo-drawer-sub{font-size:12px;color:var(--mu);line-height:1.45;}
.cs-v2-tabs{
  display:flex !important;
  flex-wrap:nowrap !important;
  gap:6px !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  white-space:nowrap !important;
  padding:6px 2px 8px !important;
  margin-top:10px !important;
  -webkit-overflow-scrolling:touch;
}
.cs-v2-tabs .tab{
  flex:0 0 auto !important;
  white-space:nowrap !important;
  padding:8px 12px !important;
  min-width:max-content !important;
}
@media (max-width:720px){
  .mdbg.tgo-drawer-bg .md{width:100vw !important;max-width:100vw !important;border-radius:0 !important;padding:18px 14px !important;}
  .tgo-drawer-head{top:-18px;}
  .cs-v2-tabs .tab{padding:7px 10px !important;font-size:13px !important;}
}


/* V1.18: Project Template and Unit Price editors use true full-page workspaces. */
.mdbg.tgo-fullpage-bg{
  align-items:stretch !important;
  justify-content:stretch !important;
  padding:0 !important;
  background:#f8fafc !important;
  overflow:hidden !important;
}
.mdbg.tgo-fullpage-bg .md{
  width:100vw !important;
  max-width:100vw !important;
  height:100vh !important;
  max-height:100vh !important;
  border-radius:0 !important;
  margin:0 !important;
  padding:22px 28px 86px !important;
  overflow:auto !important;
  box-shadow:none !important;
}
.tgo-fullpage-head{
  position:sticky;
  top:-22px;
  z-index:5;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  background:#fff;
  margin:-22px -28px 18px;
  padding:18px 28px 14px;
  border-bottom:1px solid var(--bd);
  box-shadow:0 1px 0 rgba(15,23,42,.03);
}
.tgo-fullpage-head h3{margin:0 0 4px !important;}
.tgo-fullpage-table{
  max-height:none !important;
  overflow:auto !important;
  border-radius:12px;
}
.tgo-fullpage-table table{min-width:900px;}
.mdbg.tgo-fullpage-bg .mda{
  position:sticky;
  bottom:-86px;
  background:#fff;
  border-top:1px solid var(--bd);
  margin:18px -28px -86px;
  padding:14px 28px;
}
@media(max-width:720px){
  .mdbg.tgo-fullpage-bg .md{padding:18px 14px 78px !important;}
  .tgo-fullpage-head{top:-18px;margin:-18px -14px 14px;padding:14px;}
  .mdbg.tgo-fullpage-bg .mda{margin:16px -14px -78px;padding:12px 14px;}
}


/* V1.19 — Office 365 style alignment for CS / TP / UP master pages */
.tgo365-page-head{align-items:center!important;background:#fff;border:1px solid var(--bd);border-radius:14px;padding:14px 16px;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.tgo365-actionbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.tgo365-primary{font-weight:700;box-shadow:0 2px 8px rgba(16,124,16,.16)}
.tgo365-master-shell{background:#f8fafc;border:1px solid #e5e7eb;border-radius:16px;padding:14px;min-height:260px}
.tgo365-table{border-radius:12px!important;box-shadow:0 1px 2px rgba(0,0,0,.04);overflow:auto!important;background:#fff!important}
.tgo365-table table{min-width:960px}
.tgo365-table th{background:#f3f6fb!important;color:#374151!important;font-weight:700!important;white-space:nowrap}
.tgo365-table td{vertical-align:middle!important}
.tgo365-row-actions{display:flex;gap:6px;align-items:center;justify-content:flex-end;flex-wrap:wrap}
.tgo365-danger{color:var(--rd)!important;border-color:#F5C0BB!important;background:#fff7f7!important}
.tgo365-full-head{border-bottom:1px solid #e5e7eb!important;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.tgo365-editor-grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:14px;margin-bottom:14px}
.tgo365-panel{background:#fff;border:1px solid #e5e7eb;border-radius:14px;padding:14px;box-shadow:0 1px 2px rgba(0,0,0,.035)}
.tgo365-panel-title{font-weight:800;color:#111827;margin-bottom:8px;font-size:14px}
.tgo365-panel-sub{font-size:12px;color:var(--mu);margin-top:2px}
.tgo365-panel-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.tgo365-summary{background:linear-gradient(135deg,#ffffff,#f3f7ff);border:1px solid #dbeafe;border-radius:14px;padding:12px;box-shadow:0 1px 2px rgba(0,0,0,.035)}
.tgo365-metrics{display:grid;grid-template-columns:1fr;gap:8px}
.tgo365-metric{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:10px 12px}
.tgo365-metric .k{font-size:11px;color:#6b7280;font-weight:700;text-transform:uppercase;letter-spacing:.03em}
.tgo365-metric .v{font-size:20px;font-weight:800;margin-top:2px;color:#111827}
.tgo365-metric .s{font-size:11px;color:#6b7280;margin-top:2px}
.tgo365-metric.sell .v{color:#2563eb}.tgo365-metric.cost .v{color:#b45309}.tgo365-metric.profit .v{color:#107c10}
.tgo365-footer-actions{position:sticky!important;bottom:0;background:#fff!important;border-top:1px solid #e5e7eb!important;margin-left:-24px!important;margin-right:-24px!important;padding:12px 24px!important;z-index:5}
.tgo365-tp .ptcard{box-shadow:0 1px 2px rgba(0,0,0,.04);border-radius:14px!important}
.tgo365-up .ptcard{box-shadow:0 1px 2px rgba(0,0,0,.04);border-radius:14px!important}
@media(max-width:920px){.tgo365-editor-grid{grid-template-columns:1fr}.tgo365-actionbar{justify-content:flex-start}.tgo365-page-head{align-items:flex-start!important}}