/* ============================================================
   T-Go v1.0.2z -- Global UX Theme + Costsheet Status Colors
   Scope: visual-only. No DB/data-flow changes.
   ============================================================ */
:root{
  --tgo-font-family:'IBM Plex Sans Thai','Noto Sans Thai','Tahoma','Segoe UI',Arial,sans-serif;
  --tgo-font-size:13px;
  --tgo-line-height:1.55;
  --tgo-radius:10px;
  --tgo-radius-sm:8px;
  --tgo-border:#e5e7eb;
  --tgo-border-strong:#d1d5db;
  --tgo-surface:#ffffff;
  --tgo-bg:#f8fafc;
  --tgo-ink:#111827;
  --tgo-muted:#6b7280;
  --tgo-shadow:0 1px 2px rgba(15,23,42,.05),0 8px 20px rgba(15,23,42,.04);
  --tgo-primary:#2563eb;
  --tgo-primary-soft:#eff6ff;
  --tgo-success:#15803d;
  --tgo-success-soft:#ecfdf3;
  --tgo-warning:#b45309;
  --tgo-warning-soft:#fff7ed;
  --tgo-danger:#b42318;
  --tgo-danger-soft:#fef2f2;
  --tgo-neutral-soft:#f8fafc;
}
html,body{font-family:var(--tgo-font-family);font-size:var(--tgo-font-size);line-height:var(--tgo-line-height);color:var(--tgo-ink);}
body,button,input,select,textarea{font-family:var(--tgo-font-family);}
button,.btn,.cs365-btn,.tgo-btn,[role="button"]{font-size:13px;line-height:1.25;border-radius:var(--tgo-radius-sm);}
input,select,textarea{font-size:13px;border-radius:var(--tgo-radius-sm);}
table th{font-size:12px;font-weight:700;color:#475569;letter-spacing:.01em;}
table td{font-size:13px;}
.badge,.pill,.tag,.status-pill,.rpill,.phase-tag,.dcsc{font-size:11.5px;font-weight:700;line-height:1.15;border-radius:999px;display:inline-flex;align-items:center;gap:4px;}
.card,.panel,.data-table,.tgo-card,.module-card{border-radius:var(--tgo-radius);}

/* Unified status color vocabulary used across modules when class names overlap */
.badge.s-dft,.s-dft,.status-draft,[data-status="draft"]{background:#f8fafc!important;color:#475569!important;border-color:#cbd5e1!important;}
.badge.s-pnd,.s-pnd,.status-pending,[data-status="pending"],[data-status="submitted"]{background:#fff7ed!important;color:#b45309!important;border-color:#fed7aa!important;}
.badge.s-apv,.s-apv,.status-approved,[data-status="approved"]{background:#ecfdf3!important;color:#15803d!important;border-color:#bbf7d0!important;}
.badge.s-rjt,.s-rjt,.status-rejected,[data-status="rejected"]{background:#fef2f2!important;color:#b42318!important;border-color:#fecaca!important;}
.badge.status-cancelled,.status-cancelled,[data-status="cancelled"],[data-status="canceled"]{background:#f4f4f5!important;color:#52525b!important;border-color:#d4d4d8!important;}

/* Costsheet page hierarchy and status visibility */
#costsheetPage{font-size:13px;background:#f8fafc;}
#costsheetPage .cs365-title{letter-spacing:-.02em;}
#costsheetPage .cs365-sub,#costsheetPage .ps,#costsheetPage .muted{font-size:12.5px;color:#64748b;}
#costsheetPage .cs365-tabs button,#costsheetPage .tabs .tab{font-size:13px;font-weight:650;}
#costsheetPage .cs365-content{padding-top:16px;}
#costsheetPage .pt,#costsheetPage .section-title,#costsheetPage .cs-section-title{font-size:15px;font-weight:750;color:#0f172a;}
#costsheetPage .ctit,#costsheetPage .card-title{font-size:14px;font-weight:750;color:#0f172a;}

/* Status legend/filter buttons in Costsheet list */
#costsheetPage .cs-status-filter-bar,
#costsheetPage .cs-filterbar,
#costsheetPage .cs-view-toggle{display:flex;gap:6px;align-items:center;flex-wrap:wrap;}
#costsheetPage .cs-status-key{display:inline-flex;align-items:center;gap:6px;margin-left:auto;color:#64748b;font-size:12px;}
#costsheetPage .cs-status-key span{display:inline-flex;align-items:center;gap:4px;}
#costsheetPage .cs-dot{width:8px;height:8px;border-radius:999px;display:inline-block;}
#costsheetPage .cs-dot.draft{background:#94a3b8;}#costsheetPage .cs-dot.pending{background:#f59e0b;}#costsheetPage .cs-dot.approved{background:#22c55e;}#costsheetPage .cs-dot.rejected{background:#ef4444;}

#costsheetPage .badge.s-dft{background:#f1f5f9!important;color:#475569!important;border:1px solid #cbd5e1!important;}
#costsheetPage .badge.s-pnd{background:#fff7ed!important;color:#b45309!important;border:1px solid #fdba74!important;}
#costsheetPage .badge.s-apv{background:#ecfdf3!important;color:#15803d!important;border:1px solid #86efac!important;}
#costsheetPage .badge.s-rjt{background:#fef2f2!important;color:#b42318!important;border:1px solid #fca5a5!important;}

/* Costsheet rows/cards get a visible left rail by status. JS adds these classes; :has is a browser fallback. */
#costsheetPage .cs-status-row,#costsheetPage .cs-status-card{position:relative;}
#costsheetPage .cs-status-row td:first-child,#costsheetPage .cs-status-card{border-left-width:4px!important;border-left-style:solid!important;}
#costsheetPage .cs-st-draft td:first-child,#costsheetPage .cs-st-draft.cs-status-card{border-left-color:#94a3b8!important;background:linear-gradient(90deg,#f8fafc 0,#fff 42px)!important;}
#costsheetPage .cs-st-pending td:first-child,#costsheetPage .cs-st-pending.cs-status-card{border-left-color:#f59e0b!important;background:linear-gradient(90deg,#fff7ed 0,#fff 48px)!important;}
#costsheetPage .cs-st-approved td:first-child,#costsheetPage .cs-st-approved.cs-status-card{border-left-color:#22c55e!important;background:linear-gradient(90deg,#ecfdf3 0,#fff 48px)!important;}
#costsheetPage .cs-st-rejected td:first-child,#costsheetPage .cs-st-rejected.cs-status-card{border-left-color:#ef4444!important;background:linear-gradient(90deg,#fef2f2 0,#fff 48px)!important;}
#costsheetPage tr:has(.badge.s-dft) td:first-child{border-left:4px solid #94a3b8!important;}
#costsheetPage tr:has(.badge.s-pnd) td:first-child{border-left:4px solid #f59e0b!important;}
#costsheetPage tr:has(.badge.s-apv) td:first-child{border-left:4px solid #22c55e!important;}
#costsheetPage tr:has(.badge.s-rjt) td:first-child{border-left:4px solid #ef4444!important;}
#costsheetPage .card:has(.badge.s-dft),#costsheetPage .cs-card:has(.badge.s-dft){border-left:4px solid #94a3b8!important;}
#costsheetPage .card:has(.badge.s-pnd),#costsheetPage .cs-card:has(.badge.s-pnd){border-left:4px solid #f59e0b!important;}
#costsheetPage .card:has(.badge.s-apv),#costsheetPage .cs-card:has(.badge.s-apv){border-left:4px solid #22c55e!important;}
#costsheetPage .card:has(.badge.s-rjt),#costsheetPage .cs-card:has(.badge.s-rjt){border-left:4px solid #ef4444!important;}

/* Costsheet filter/status buttons. JS tags buttons by text, CSS makes them distinct. */
#costsheetPage button.cs-filter-draft{background:#f8fafc!important;border-color:#cbd5e1!important;color:#475569!important;}
#costsheetPage button.cs-filter-pending{background:#fff7ed!important;border-color:#fdba74!important;color:#b45309!important;}
#costsheetPage button.cs-filter-approved{background:#ecfdf3!important;border-color:#86efac!important;color:#15803d!important;}
#costsheetPage button.cs-filter-rejected{background:#fef2f2!important;border-color:#fca5a5!important;color:#b42318!important;}
#costsheetPage button.cs-filter-all{background:#eff6ff!important;border-color:#bfdbfe!important;color:#1d4ed8!important;}
#costsheetPage button.on.cs-filter-draft,#costsheetPage button.active.cs-filter-draft{box-shadow:inset 0 -2px 0 #64748b;}
#costsheetPage button.on.cs-filter-pending,#costsheetPage button.active.cs-filter-pending{box-shadow:inset 0 -2px 0 #f59e0b;}
#costsheetPage button.on.cs-filter-approved,#costsheetPage button.active.cs-filter-approved{box-shadow:inset 0 -2px 0 #22c55e;}
#costsheetPage button.on.cs-filter-rejected,#costsheetPage button.active.cs-filter-rejected{box-shadow:inset 0 -2px 0 #ef4444;}

/* Global list readability */
.tgo-row-number,.row-number,.col-index{font-variant-numeric:tabular-nums;color:#64748b;font-weight:700;}
.data-table tbody tr:hover,table tbody tr:hover{background:#f8fafc;}

@media(max-width:900px){
  html,body{font-size:12.5px;}
  .btn,.cs365-btn,button,input,select,textarea{font-size:12.5px;}
  #costsheetPage .cs365-title{font-size:20px;}
}