/* ══════════════════════════════════════════════════════════
   PND ICONS 2030 — Tabler outline, mono graphite, accent #BA7517
   ÁP toàn hệ thống: line mảnh, không tint pastel, không nền tròn.
   Size theo context: 24px KPI, 20px sidebar, 18px button/inline.
   v2 (#7): khử triệt để mọi ô vuông tint / tròn pastel trên KPI +
   card tiền (admin + pub). Icon TRẦN, mono graphite, sharp tech.
   ══════════════════════════════════════════════════════════ */

/* ── 0) Token graphite + accent ─────────────────────────── */
:root {
  --pnd-ink-2030:   var(--pnd-text, #1c1c1e);  /* mực đậm chủ đạo */
  --pnd-ink-soft:   var(--pnd-sub, #48484a);
  --pnd-accent-2030: #BA7517;                  /* cam nhấn icon active */
}

/* Font khử bệt: ép stroke đều, vertical-align ổn định. */
.ti {
  font-style: normal !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  vertical-align: -0.125em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: inherit;
  font-size: 18px;          /* default inline / button */
}

/* ── 1) Sidebar — 20px, mono inherit ────────────────────── */
.sidebar .ti,
.sb-ico,
.nav-link > .ti {
  font-size: 20px;
  color: inherit;
}
.sidebar .nav-link.active > .ti,
.sidebar .nav-link.active .sb-ico,
.sidebar .nav-link:hover > .ti {
  color: var(--pnd-accent-2030) !important;
}

/* ── 2) KPI cards — 24px, graphite (mono), no pastel tint ─ */
.kpi-grid .ti,
.stat-card .ti,
.kpi-card .ti,
.kpi-strip .ti,
.kpi-ico {
  font-size: 24px !important;
  opacity: 1 !important;
  color: var(--pnd-ink-2030) !important;   /* ÉP mono, override inline */
  background: transparent !important;
  border-radius: 0 !important;
}
/* KPI value/label vẫn giữ màu inline (status indicator) — KHÔNG đụng .stat-num */

/* ── 3) Buttons / chips ─────────────────────────────────── */
.btn .ti,
button .ti,
.pnd-btn .ti,
.action-btn .ti {
  font-size: 18px;
}

/* ── 4) Topbar / user avatar / dropdown ─────────────────── */
.topbar .ti,
.pnd-user-btn .ti,
.dropdown-item .ti {
  font-size: 16px;
}

/* ── 5) Inline icon trong table/badge ───────────────────── */
.table .ti,
.res-badge .ti,
.badge .ti {
  font-size: 14px;
}

/* ── 6) BỎ Ô MÀU PASTEL — wrapper KPI + card tiền + analytics
       Áp đồng nhất CHO: v7-kpi-icon / v7-pay-icon / kpi-icon /
       pay-icon / .kpi .ico / .mc .mi + biến tones (.v7-pay-green,
       .v7-pay-amber, .v7-pay-blue, .v7-pay-red, .v7-pay-purple).
       NỀN trong suốt, KHÔNG bo, KHÔNG padding tile, icon TRẦN. */
.v7-kpi-icon,
.v7-pay-icon,
.kpi-icon,
.pay-icon,
.metric-ico,
.stat-ico,
.icon-tile,
.icon-pill,
.icon-chip-bg,
.kpi .ico,
.mc .mi,
.rp-stat-icon,
.feat-ico {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border-radius: 0 !important;
  border: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
  /* giữ flex để icon vẫn nằm vị trí; reset width/height tự co theo icon */
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  color: var(--pnd-ink-2030) !important;
}
/* Biến tones tô màu trên .v7-pay-icon — kill background + ép mono color */
.v7-pay-green,
.v7-pay-amber,
.v7-pay-blue,
.v7-pay-red,
.v7-pay-purple,
.v7-pay-rose,
.v7-pay-violet {
  background: transparent !important;
  background-color: transparent !important;
  color: var(--pnd-ink-2030) !important;
}

/* Icon nằm bên trong các wrapper trên — ép mono + size hợp lý */
.v7-kpi-icon .ti,
.v7-pay-icon .ti,
.kpi-icon .ti,
.pay-icon .ti,
.kpi .ico .ti,
.mc .mi .ti,
.rp-stat-icon .ti,
.feat-ico .ti {
  color: var(--pnd-ink-2030) !important;
  font-size: 24px !important;
}

/* Inline SVG icon (dashboard_tong_quan): mono graphite stroke,
   thin sharp 1.6, no fill. Áp riêng KPI head + money card. */
.kpi .ico svg,
.mc .mi svg,
.rp-stat-icon svg {
  stroke: var(--pnd-ink-2030) !important;
  fill: none !important;
  stroke-width: 1.6 !important;
  width: 22px !important;
  height: 22px !important;
}

/* ── 7) Animation cho icon refresh đang quay ───────────── */
@keyframes pnd-icon-spin {
  to { transform: rotate(360deg); }
}
.ti.spin,
.ti[data-spin="1"],
.ti-loader-2 {                /* loader-2 auto-spin per #7 spec */
  animation: pnd-icon-spin 0.8s linear infinite;
  display: inline-block;
}

/* ── 8) Override leftover bi.* selectors trong CSS cũ ──── */
i.bi { font-size: inherit; }

/* ── 9) Hover/active accent cam #BA7517 trên KPI cards & card tiền */
.v7-kpi-card:hover .ti,
.v7-pay-card:hover .ti,
.stat-card:hover .ti,
.kpi-card:hover .ti,
.kpi:hover .ico svg,
.mc:hover .mi svg,
a:hover .kpi-ico,
a:hover .v7-pay-icon .ti,
a:hover .v7-kpi-icon .ti {
  color: var(--pnd-accent-2030) !important;
  stroke: var(--pnd-accent-2030) !important;
}

/* ── 10) LOGIN feat-ico GIỮ NGUYÊN (user redesign 45e7bf8) ──
   Login feat-ico là khối feature 2030 đã hand-tune, không strip.
   Selector hẹp: chỉ áp khi feat-ico nằm trong body.lg-page. */
body.lg-page .feat-ico,
.lg-page .feat-ico {
  background: revert !important;
  border-radius: revert !important;
  padding: revert !important;
  color: revert !important;
  width: revert !important;
  height: revert !important;
}
