/* ── Light Theme — Professional Fintech UI ─────────────────── */
:root {
  --bg-page:    #f8fafc;
  --bg-card:    #ffffff;
  --bg-hover:   #f8fafc;
  --bg-active:  #eef2ff;
  --border:     #e5e7eb;
  --border-2:   #f1f5f9;
  --text-1:     #1e293b;
  --text-2:     #64748b;
  --text-3:     #94a3b8;
  --accent:     #4f46e5;
  --accent-bg:  #eef2ff;
  --accent-txt: #4f46e5;
  --green-bg:   #dcfce7;
  --green-txt:  #16a34a;
  --amber-bg:   #fef3c7;
  --amber-txt:  #d97706;
  --red-bg:     #fee2e2;
  --red-txt:    #dc2626;
  --blue-bg:    #ede9fe;
  --blue-txt:   #7c3aed;
  --shadow:     0 1px 3px rgba(0,0,0,.08);
}

/* Reset dark background */
body {
  background: var(--bg-page) !important;
  color: var(--text-1) !important;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Sarabun', sans-serif !important;
}

/* Container */
.container { max-width: 1200px !important; }

/* Cards / sections */
.stat-card, .sum-card, .queue-card, .log-item, .ec,
[class*="card"], [class*="Card"] {
  background: var(--bg-card) !important;
  border-color: var(--border) !important;
  color: var(--text-1) !important;
}

/* Inputs / selects */
input, select, textarea {
  background: var(--bg-card) !important;
  border-color: var(--border) !important;
  color: var(--text-1) !important;
}
input::placeholder, textarea::placeholder { color: var(--text-3) !important; }
select option { background: #fff; color: var(--text-1); }

/* Filter box */
.filter-box, .filter-row { background: var(--bg-card) !important; border-color: var(--border) !important; }

/* Top bar */
.top-bar h2, .top-bar h1 { color: var(--text-1) !important; }
.back-btn { color: var(--text-2) !important; background: var(--bg-card) !important; border-color: var(--border) !important; }
.back-btn:hover { color: var(--text-1) !important; }

/* Tables */
table { background: var(--bg-card); }
thead tr { background: var(--bg-page) !important; }
th { color: var(--text-3) !important; border-color: var(--border-2) !important; }
td { color: var(--text-2) !important; border-color: var(--border-2) !important; }
tbody tr:hover td { background: var(--bg-hover) !important; }
.tbl-wrap { border-color: var(--border) !important; border-radius: 12px !important; }

/* Badges - keep semantic colors */
.badge, [class*="badge"], [class*="Badge"] { font-size: 11px !important; }
.b-in, .sb-final_approved, .b-ok  { background: var(--green-bg) !important; color: var(--green-txt) !important; }
.b-out, .b-warn, .sb-pending_approval, .sb-pending { background: var(--amber-bg) !important; color: var(--amber-txt) !important; }
.b-late, .sb-rejected, .b-red { background: var(--red-bg) !important; color: var(--red-txt) !important; }
.sb-draft { background: #f1f5f9 !important; color: var(--text-2) !important; }

/* Buttons */
.btn-blue, .btn-save, .btn-load, .btn-submit-all {
  background: var(--accent) !important;
  color: #fff !important;
  border: none !important;
}
.btn-green { background: var(--green-bg) !important; color: var(--green-txt) !important; border-color: #bbf7d0 !important; }
.btn-red   { background: var(--red-bg)   !important; color: var(--red-txt)   !important; border-color: #fecaca !important; }
.btn-amber { background: var(--amber-bg) !important; color: var(--amber-txt) !important; border-color: #fde68a !important; }

/* Status tabs */
.status-tab { background: var(--bg-card) !important; border-color: var(--border) !important; color: var(--text-2) !important; }
.status-tab.active { background: var(--accent) !important; color: #fff !important; border-color: var(--accent) !important; }
.status-tab span { background: var(--bg-page) !important; color: var(--text-2) !important; }

/* View tabs */
.vtab { background: transparent !important; color: var(--text-2) !important; border-color: var(--border) !important; }
.vtab.active { background: var(--accent-bg) !important; color: var(--accent-txt) !important; border-color: var(--accent) !important; }

/* Modals */
.modal { background: rgba(0,0,0,.4) !important; }
.mc { background: #fff !important; border-color: var(--border) !important; color: var(--text-1) !important; }
.mc h3 { color: var(--text-1) !important; }
.field-label { color: var(--text-2) !important; }

/* Summary numbers */
.sum-num, .stat-num { color: var(--text-1) !important; }
.sum-label, .stat-label { color: var(--text-3) !important; }
.s-pending  { color: var(--amber-txt) !important; }
.s-approved { color: var(--green-txt) !important; }
.s-revision { color: #f59e0b !important; }
.s-rejected { color: var(--red-txt)   !important; }

/* Queue cards */
.queue-card { background: var(--bg-card) !important; border-color: var(--border) !important; }
.queue-card:hover { border-color: var(--accent) !important; }
.qc-title { color: var(--text-1) !important; }
.qc-sub, .qc-meta { color: var(--text-3) !important; }

/* Action buttons */
.btn-approve { background: var(--green-txt) !important; }
.btn-reject  { background: var(--red-bg)   !important; color: var(--red-txt) !important; border-color: #fecaca !important; }
.btn-revision { background: var(--amber-bg) !important; color: var(--amber-txt) !important; border-color: #fde68a !important; }

/* History / misc */
.hist-label { color: var(--text-3) !important; }
.hist-item  { color: var(--text-2) !important; }
.empty, .loading { color: var(--text-3) !important; }

/* Sel bar */
.sel-bar { background: var(--bg-card) !important; border-color: var(--border) !important; }
.sel-count { color: var(--text-2) !important; }

/* Draft table */
.draft-chk { accent-color: var(--accent); }

/* Scrollbar */
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: var(--bg-page); }
::-webkit-scrollbar-thumb { background: var(--border); border-radius: 10px; }
