/* =========================================================
   V354 — Hệ màu thống nhất cho các ô tài chính toàn hệ thống
   Nền nhẹ + số tiền đậm; không thay bố cục hoặc dữ liệu.
   ========================================================= */

.v354-fin-card{
  position:relative;
  overflow:hidden;
  border-color:var(--v354-border,var(--border))!important;
  background:
    linear-gradient(145deg,var(--v354-bg1,var(--card)),var(--v354-bg2,var(--card)))!important;
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease;
}
.v354-fin-card::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:3px;
  background:var(--v354-accent,var(--brand-green));
  opacity:.92;
}
.v354-fin-card:hover{
  transform:translateY(-1px);
  box-shadow:0 7px 22px rgba(15,23,42,.065);
}
.v354-fin-card .eyebrow{
  color:var(--v354-label,var(--muted-foreground))!important;
  font-weight:800!important;
}
.v354-fin-card .stat-figure{
  color:var(--v354-value,var(--foreground))!important;
  font-weight:850!important;
  letter-spacing:-.02em;
}
.v354-fin-card .stat-figure>span:first-child,
.v354-fin-card .stat-figure>span:last-child{
  color:color-mix(in srgb,var(--v354-value,var(--foreground)) 72%,var(--muted-foreground))!important;
}

/* Tổng doanh thu / tổng tiền — xanh ngọc */
.v354-fin-revenue{
  --v354-accent:#138a72;
  --v354-border:color-mix(in srgb,#138a72 27%,var(--border));
  --v354-bg1:color-mix(in srgb,#138a72 7%,var(--card));
  --v354-bg2:color-mix(in srgb,#138a72 2%,var(--card));
  --v354-value:#0f725f;
  --v354-label:#317968;
}

/* Đã thu / thanh toán — xanh dương */
.v354-fin-collected{
  --v354-accent:#3979b9;
  --v354-border:color-mix(in srgb,#3979b9 28%,var(--border));
  --v354-bg1:color-mix(in srgb,#3979b9 7%,var(--card));
  --v354-bg2:color-mix(in srgb,#3979b9 2%,var(--card));
  --v354-value:#2e68a2;
  --v354-label:#4b6f91;
}

/* Lợi nhuận — xanh lá */
.v354-fin-profit{
  --v354-accent:#4d8d3a;
  --v354-border:color-mix(in srgb,#4d8d3a 28%,var(--border));
  --v354-bg1:color-mix(in srgb,#4d8d3a 7%,var(--card));
  --v354-bg2:color-mix(in srgb,#4d8d3a 2%,var(--card));
  --v354-value:#417c31;
  --v354-label:#5b7951;
}

/* Công nợ / phải thu — đỏ gạch */
.v354-fin-debt{
  --v354-accent:#c15b50;
  --v354-border:color-mix(in srgb,#c15b50 27%,var(--border));
  --v354-bg1:color-mix(in srgb,#c15b50 7%,var(--card));
  --v354-bg2:color-mix(in srgb,#c15b50 2%,var(--card));
  --v354-value:#a94a41;
  --v354-label:#8c5d58;
}

/* Chi phí / giá vốn — tím */
.v354-fin-cost{
  --v354-accent:#8066a7;
  --v354-border:color-mix(in srgb,#8066a7 27%,var(--border));
  --v354-bg1:color-mix(in srgb,#8066a7 7%,var(--card));
  --v354-bg2:color-mix(in srgb,#8066a7 2%,var(--card));
  --v354-value:#6b5591;
  --v354-label:#75668b;
}

/* Số đơn / số lượng — vàng đồng */
.v354-fin-count{
  --v354-accent:#c48a35;
  --v354-border:color-mix(in srgb,#c48a35 27%,var(--border));
  --v354-bg1:color-mix(in srgb,#c48a35 7%,var(--card));
  --v354-bg2:color-mix(in srgb,#c48a35 2%,var(--card));
  --v354-value:#a66f1f;
  --v354-label:#876d47;
}

/* Neutral */
.v354-fin-neutral{
  --v354-accent:#64748b;
  --v354-border:color-mix(in srgb,#64748b 22%,var(--border));
  --v354-bg1:color-mix(in srgb,#64748b 4%,var(--card));
  --v354-bg2:var(--card);
}

/* Các ô tiền riêng của menu Xuất báo cáo */
.v354-money-box{
  position:relative;
  overflow:hidden;
  box-shadow:0 2px 10px rgba(15,23,42,.035);
}
.v354-money-box::before{
  content:"";
  position:absolute;
  top:0;left:0;right:0;
  height:3px;
  background:var(--v354-box-accent);
}
.v354-money-revenue{
  --v354-box-accent:#138a72;
  border-color:color-mix(in srgb,#138a72 27%,var(--border))!important;
  background:color-mix(in srgb,#138a72 6%,var(--card))!important;
}
.v354-money-profit{
  --v354-box-accent:#4d8d3a;
  border-color:color-mix(in srgb,#4d8d3a 27%,var(--border))!important;
  background:color-mix(in srgb,#4d8d3a 6%,var(--card))!important;
}
.v354-money-projected{
  --v354-box-accent:#d18a22;
  border-color:color-mix(in srgb,#d18a22 32%,var(--border))!important;
  background:color-mix(in srgb,#d18a22 7%,var(--card))!important;
}
.v354-money-count{
  --v354-box-accent:#64748b;
  border-color:color-mix(in srgb,#64748b 22%,var(--border))!important;
  background:color-mix(in srgb,#64748b 4%,var(--card))!important;
}

/* Dòng tiền ngắn trong phần phạm vi xuất */
.v354-inline-money{
  border-radius:6px;
  padding:5px 8px!important;
}
.v354-inline-revenue{background:color-mix(in srgb,#138a72 7%,transparent)}
.v354-inline-profit{background:color-mix(in srgb,#4d8d3a 7%,transparent)}
.v354-inline-projected{background:color-mix(in srgb,#d18a22 8%,transparent)}

/* Dark mode: giữ độ tương phản, giảm nền màu */
.dark .v354-fin-card{
  --card-mix-adjust:3%;
}
.dark .v354-fin-revenue{--v354-value:#6fd1bc}
.dark .v354-fin-collected{--v354-value:#7db4e8}
.dark .v354-fin-profit{--v354-value:#8bc978}
.dark .v354-fin-debt{--v354-value:#ee9188}
.dark .v354-fin-cost{--v354-value:#b7a0d7}
.dark .v354-fin-count{--v354-value:#e5b96f}

@media(max-width:700px){
  .v354-fin-card{
    min-height:102px;
  }
  .v354-fin-card .stat-figure{
    font-size:clamp(19px,5.2vw,25px)!important;
  }
}