/* assets/ssi_grid_font.css
   Font + màu sắc AG Grid — phong cách SSI iBoard
   Đặt file này vào thư mục: assets/

   ⚠️ File trước đây bị dán trùng 2 phiên bản (nội dung lặp + 1 rule
   bị đứt cú pháp ở cuối file). Đã dọn lại thành 1 bản duy nhất và bổ
   sung phần Light mode (trước đây chỉ có màu cho nền tối, khiến chữ
   header/pagination bị chìm màu khi chuyển sang chế độ sáng). */

/* ── 1. Font cơ bản toàn bảng ───────────────────────────────────────────── */
.ag-theme-alpine-dark {
    --ag-font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --ag-font-size: 13px;
}

/* ── 2. Tất cả cell số liệu: Roboto Mono, tabular-nums ─────────────────── */
.ag-theme-alpine-dark .ag-cell {
    font-family: 'Roboto Mono', 'JetBrains Mono', 'SF Mono', monospace;
    font-size: 12.5px;
    font-variant-numeric: tabular-nums;  /* KEY: giữ số thẳng hàng như SSI */
    letter-spacing: 0.2px;
    line-height: 1.4;
}

/* ── 3. Cột MÃ CK: Barlow Semi Condensed — đậm, rộng, dễ đọc như SSI ───── */
.ag-theme-alpine-dark .ag-cell[col-id="Ticker"] {
    font-family: 'Barlow Semi Condensed', 'Inter', sans-serif !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    font-variant-numeric: normal !important;
}

/* ── 4. Cột văn bản (NGÀNH, pattern...): Inter ──────────────────────────── */
.ag-theme-alpine-dark .ag-cell[col-id="Sector"],
.ag-theme-alpine-dark .ag-cell[col-id="Company Common Name"],
.ag-theme-alpine-dark .ag-cell[col-id="Candlestick_Pattern"],
.ag-theme-alpine-dark .ag-cell[col-id="RSI_State"] {
    font-family: 'Inter', sans-serif !important;
    font-variant-numeric: normal !important;
    letter-spacing: 0px !important;
    font-size: 12px !important;
}

/* ── 5. Grade badges (VALUE / GROWTH / MOM. / VGM) ─────────────────────── */
.ag-theme-alpine-dark .ag-cell[col-id="Value Score"],
.ag-theme-alpine-dark .ag-cell[col-id="Growth Score"],
.ag-theme-alpine-dark .ag-cell[col-id="Momentum Score"],
.ag-theme-alpine-dark .ag-cell[col-id="VGM Score"] {
    font-family: 'Inter', sans-serif !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: 0.5px !important;
    font-variant-numeric: normal !important;
}

/* ── 6. Header: Inter uppercase ─────────────────────────────────────────── */
.ag-theme-alpine-dark .ag-header-cell-text {
    font-family: 'Inter', sans-serif !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: 0.8px !important;
    text-transform: uppercase;
}
/* 🌙 Dark: xanh nhạt kiểu terminal | ☀️ Light: xám-xanh dễ đọc trên nền trắng */
[data-theme="dark"] .ag-theme-alpine-dark .ag-header-cell-text { color: #7fa8cc; }
[data-theme="light"] .ag-theme-alpine-dark .ag-header-cell-text { color: #47637d; }

/* ── 7. Row highlight khi select ────────────────────────────────────────── */
.ag-theme-alpine-dark .ag-row-selected {
    background-color: rgba(30, 136, 229, 0.08) !important;
    border-left: 3px solid #1E88E5 !important;
}

/* ── 8. Hover row ────────────────────────────────────────────────────────── */
[data-theme="dark"] .ag-theme-alpine-dark .ag-row:hover {
    background-color: rgba(255, 255, 255, 0.03) !important;
}
[data-theme="light"] .ag-theme-alpine-dark .ag-row:hover {
    background-color: rgba(15, 23, 42, 0.03) !important;
}

/* ── 9. Pagination & footer text ───────────────────────────────────────── */
.ag-theme-alpine-dark .ag-paging-panel,
.ag-theme-alpine-dark .ag-status-bar {
    font-family: 'Inter', sans-serif;
    font-size: 11px;
}
[data-theme="dark"] .ag-theme-alpine-dark .ag-paging-panel,
[data-theme="dark"] .ag-theme-alpine-dark .ag-status-bar { color: #5a8ab0; }
[data-theme="light"] .ag-theme-alpine-dark .ag-paging-panel,
[data-theme="light"] .ag-theme-alpine-dark .ag-status-bar { color: #64748b; }

/* ── 10. Đường kẻ hàng mỏng hơn — gọn như SSI ────────────────────────────── */
[data-theme="dark"] .ag-theme-alpine-dark .ag-row {
    border-bottom-color: rgba(255, 255, 255, 0.04) !important;
}
[data-theme="light"] .ag-theme-alpine-dark .ag-row {
    border-bottom-color: rgba(15, 23, 42, 0.05) !important;
}