/* ════════════════════════════════════════════════════════════════════
   ui-kit.css — Lớp component design-system (warm minimal) cho TOÀN APP.
   Nạp SAU app.css & css từng view, TRƯỚC quote-minimal.css.
   Chỉ dùng token trong tokens.css. Gỡ <link> này = revert toàn bộ.
   Nguyên tắc: chỉ chỉnh MÀU / FONT / BO GÓC / ĐỔ BÓNG — không đổi
   kích thước/bố cục để tránh vỡ layout các view.
   ════════════════════════════════════════════════════════════════════ */

/* ── 1. THỐNG NHẤT FONT — mọi chữ & số dùng chung 1 font (trừ icon tabler),
       số canh cột bằng tabular-nums. Thay thế toàn bộ 'Google Sans Mono'. ── */
body{font-variant-numeric:tabular-nums}
body *:not(.ti){font-family:var(--ff) !important}

/* ── 2. NÚT — bo góc 8px, chữ đậm vừa (giữ nguyên kích thước của app) ── */
.btn{border-radius:var(--r-md);font-weight:600}

/* ── 3. Ô NHẬP — bo góc đồng nhất, focus viền cam ── */
.modal-inp,.modal select,.filter-select,.pipeline-search,.meta-input,.svc-search{
  border-radius:var(--r-md)}
.modal-inp:focus,.filter-select:focus,.pipeline-search:focus,.meta-input:focus,.svc-search:focus{
  border-color:var(--accent)}

/* ── 4. THẺ SỐ LIỆU (KPI) — nền trắng, bóng mềm, bo góc lớn ── */
.stat-card{background:var(--surface);border-radius:var(--r-lg);box-shadow:var(--sh-1)}

/* ── 5. PILL LỌC trạng thái ── */
.f-btn{border-radius:var(--r-pill)}

/* ── 6. MODAL — bo góc & bóng đồng nhất ── */
.modal,.modal-box{border-radius:var(--r-xl);box-shadow:var(--sh-2)}

/* ── 7. SIDEBAR — bo góc mục nav đồng nhất ── */
.nav-btn{border-radius:var(--r-md)}