/* EA Dashboard — dark theme (บนพื้นฐาน Bootstrap 5.3 data-bs-theme=dark) */
:root {
  --ea-bg: #0b0f1a;
  --ea-card: #131a2b;
  --ea-border: #1e2740;
  --ea-teal: #20c9b0;
  --bs-info-rgb: 32, 201, 176;
  --bs-body-font-family: 'IBM Plex Sans Thai', system-ui, -apple-system, 'Segoe UI', sans-serif;
}
body.ea-body { background: var(--ea-bg); min-height: 100vh; font-family: var(--bs-body-font-family); }

.ea-nav { background: #0e1320; border-bottom: 1px solid var(--ea-border); }
.ea-nav .navbar-toggler:focus { box-shadow: none; }
/* บนมือถือ (<576px) ให้ช่องกรองเต็มความกว้างเป็น 2 คอลัมน์ แทน max-width ตายตัว */
@media (max-width: 575.98px) {
  .ea-filters > .ea-input { max-width: none !important; flex: 1 1 45%; }
}
.ea-card { background: var(--ea-card); border: 1px solid var(--ea-border); }
.ea-input { background: #0e1424; border-color: var(--ea-border); }
.ea-input:focus { background: #0e1424; border-color: var(--ea-teal); box-shadow: 0 0 0 .2rem rgba(32,201,176,.15); }

.btn-info { --bs-btn-color: #04121a; --bs-btn-hover-color: #04121a; --bs-btn-bg: var(--ea-teal); --bs-btn-border-color: var(--ea-teal); }
.text-info { color: var(--ea-teal) !important; }

/* KPI cards */
.ea-kpi { background: var(--ea-card); border: 1px solid var(--ea-border); border-radius: .6rem; padding: 1rem 1.15rem; height: 100%; }
.ea-kpi .lbl { color: #8a93a6; font-size: .7rem; letter-spacing: .06em; text-transform: uppercase; }
.ea-kpi .val { font-size: 1.5rem; font-weight: 700; line-height: 1.3; }

/* live + status dots */
.ea-live { display: inline-flex; align-items: center; gap: .45rem; font-weight: 600; }
.ea-dot { width: .6rem; height: .6rem; border-radius: 50%; display: inline-block; }
.ea-dot-on { background: #2fd47a; box-shadow: 0 0 0 3px rgba(47,212,122,.2); }
.ea-dot-off { background: #e2556a; }

.pos { color: #2fd47a; }
.neg { color: #e2556a; }
/* Bootstrap .table ตั้งสี td ด้วย selector (0,1,1) ที่ทับ .pos/.neg — ต้องเจาะจงกว่าในตาราง */
.table td.pos, .table th.pos { color: #2fd47a !important; }
.table td.neg, .table th.neg { color: #e2556a !important; }

/* account cards */
.acc-card { background: var(--ea-card); border: 1px solid var(--ea-border); border-radius: .6rem; transition: border-color .15s; }
.acc-card:hover { border-color: #2b3861; }
.acc-card .metric .m-lbl { color: #8a93a6; font-size: .68rem; text-transform: uppercase; letter-spacing: .03em; }
.acc-card .metric .m-val { font-weight: 600; font-size: .95rem; }

/* login / error centered */
.ea-login { min-height: calc(100vh - 0px); }

/* calendar (account detail) */
.cal-grid { display: grid; grid-template-columns: repeat(8, 1fr); gap: 6px; min-width: 640px; }
.cal-h { text-align: center; color: #8a93a6; font-size: .72rem; padding: .25rem 0; }
.cal-c { background: #0e1424; border: 1px solid var(--ea-border); border-radius: .4rem; min-height: 66px; padding: .35rem .4rem; font-size: .72rem; }
.cal-c.cal-empty { background: transparent; border: none; }
.cal-c.cal-pos { border-color: rgba(47,212,122,.4); background: rgba(47,212,122,.06); }
.cal-c.cal-neg { border-color: rgba(226,85,106,.4); background: rgba(226,85,106,.06); }
.cal-c.cal-week { background: #131a2b; }
.cal-c .cal-d { font-weight: 600; }
.cal-c .cal-p { font-weight: 700; }
.cal-c .cal-s { color: #8a93a6; font-size: .66rem; }
.card-body:has(> .cal-grid) { overflow-x: auto; }

/* loading overlay (กันแฟลชค่า 0 / สลับสกุลตอนโหลด) */
.ea-loading { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; background: rgba(11,15,26,.8); z-index: 2000; }