/* V327 — Thiết kế lại Thông tin nội bộ trên desktop.
   Chỉ thay trình bày, không thay số liệu/công thức/nghiệp vụ. */

@media screen and (min-width:1100px){

  .v327-internal-dashboard{
    overflow:hidden!important;
    border:1px solid color-mix(in srgb,var(--amber-brand) 32%,var(--border))!important;
    border-radius:10px!important;
    background:
      linear-gradient(180deg,
        color-mix(in srgb,var(--amber-brand) 5%,var(--card)) 0%,
        var(--card) 40%,
        var(--card) 100%)!important;
    box-shadow:
      0 1px 2px rgba(15,23,42,.04),
      0 10px 28px rgba(15,23,42,.05)!important;
  }

  /* KPI header */
  .v327-internal-dashboard .v306-internal-kpis{
    display:grid!important;
    grid-template-columns:minmax(220px,1.35fr) repeat(5,minmax(145px,1fr))!important;
    gap:0!important;
    padding:0!important;
    border-bottom:1px solid var(--border)!important;
    background:transparent!important;
  }

  .v327-internal-dashboard .v306-internal-kpis > div{
    min-width:0!important;
    padding:17px 16px 15px!important;
    border-right:1px solid color-mix(in srgb,var(--border) 82%,transparent)!important;
    background:rgba(255,255,255,.34)!important;
  }

  .v327-internal-dashboard .v306-internal-kpis > div:last-child{
    border-right:0!important;
  }

  /* Cột mô tả đầu */
  .v327-internal-dashboard .v306-internal-kpis > div:first-child{
    position:relative!important;
    padding-left:20px!important;
    background:
      linear-gradient(135deg,
        color-mix(in srgb,var(--amber-brand) 11%,var(--card)),
        color-mix(in srgb,var(--brand-green) 4%,var(--card)))!important;
  }

  .v327-internal-dashboard .v306-internal-kpis > div:first-child::before{
    content:""!important;
    position:absolute!important;
    left:0!important;
    top:0!important;
    bottom:0!important;
    width:4px!important;
    background:var(--amber-brand)!important;
  }

  .v327-internal-dashboard .v306-internal-kpis > div:first-child .eyebrow{
    color:var(--amber-brand)!important;
    font-size:11px!important;
    letter-spacing:.08em!important;
    font-weight:800!important;
  }

  .v327-internal-dashboard .v306-internal-kpis > div:first-child .text-muted-foreground{
    margin-top:7px!important;
    max-width:240px!important;
    font-size:11.5px!important;
    line-height:1.5!important;
  }

  /* Các KPI */
  .v327-internal-dashboard .v306-internal-kpis > div:not(:first-child){
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    text-align:left!important;
  }

  .v327-internal-dashboard .v306-internal-kpis > div:not(:first-child) .eyebrow{
    color:var(--muted-foreground)!important;
    font-size:10px!important;
    line-height:1.25!important;
    letter-spacing:.055em!important;
    font-weight:750!important;
  }

  .v327-internal-dashboard .v306-internal-kpis > div:not(:first-child) > div:last-child{
    margin-top:7px!important;
    font-size:17px!important;
    line-height:1.1!important;
    font-weight:800!important;
    letter-spacing:-.015em!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  /* Doanh thu */
  .v327-internal-dashboard .v306-internal-kpis > div:nth-child(2){
    background:color-mix(in srgb,var(--brand-green) 4%,var(--card))!important;
  }
  .v327-internal-dashboard .v306-internal-kpis > div:nth-child(2) > div:last-child{
    color:var(--brand-green)!important;
  }

  /* Giá vốn */
  .v327-internal-dashboard .v306-internal-kpis > div:nth-child(3){
    background:color-mix(in srgb,var(--amber-brand) 3%,var(--card))!important;
  }

  /* Lợi nhuận — ô nổi bật nhất */
  .v327-internal-dashboard .v306-internal-kpis > div:nth-child(6){
    background:
      linear-gradient(145deg,
        color-mix(in srgb,var(--brand-green) 9%,var(--card)),
        color-mix(in srgb,var(--brand-green) 3%,var(--card)))!important;
  }

  .v327-internal-dashboard .v306-internal-kpis > div:nth-child(6) > div:last-child{
    font-size:19px!important;
  }

  /* Detail area */
  .v327-internal-dashboard .v306-internal-detail{
    padding:18px 18px 16px!important;
    background:var(--card)!important;
  }

  .v327-internal-dashboard .v327-internal-detail-title{
    position:relative!important;
    display:flex!important;
    align-items:center!important;
    min-height:30px!important;
    margin:0 0 12px!important;
    padding-left:12px!important;
    color:var(--foreground)!important;
    font-size:12px!important;
    font-weight:800!important;
    letter-spacing:.045em!important;
  }

  .v327-internal-dashboard .v327-internal-detail-title::before{
    content:""!important;
    position:absolute!important;
    left:0!important;
    top:5px!important;
    bottom:5px!important;
    width:3px!important;
    border-radius:2px!important;
    background:var(--amber-brand)!important;
  }

  /* Table container */
  .v327-internal-dashboard .v306-internal-table-wrap{
    overflow:auto!important;
    border:1px solid var(--border)!important;
    border-radius:8px!important;
    background:var(--background)!important;
    box-shadow:inset 0 1px rgba(255,255,255,.4)!important;
  }

  .v327-internal-dashboard .v306-internal-table{
    width:100%!important;
    min-width:980px!important;
    border-collapse:separate!important;
    border-spacing:0!important;
    table-layout:auto!important;
    font-size:12.5px!important;
  }

  /* Header */
  .v327-internal-dashboard .v306-internal-table thead tr{
    border:0!important;
    background:
      linear-gradient(180deg,
        color-mix(in srgb,var(--brand-green) 8%,var(--background)),
        color-mix(in srgb,var(--brand-green) 3%,var(--background)))!important;
  }

  .v327-internal-dashboard .v306-internal-table thead th{
    position:sticky!important;
    top:0!important;
    z-index:2!important;
    padding:11px 12px!important;
    border-bottom:1px solid color-mix(in srgb,var(--brand-green) 26%,var(--border))!important;
    color:color-mix(in srgb,var(--foreground) 82%,var(--brand-green))!important;
    background:inherit!important;
    font-size:10.5px!important;
    line-height:1.25!important;
    font-weight:800!important;
    letter-spacing:.035em!important;
    text-transform:uppercase!important;
    white-space:nowrap!important;
  }

  .v327-internal-dashboard .v306-internal-table thead th:first-child{
    min-width:250px!important;
    text-align:left!important;
  }

  /* Body */
  .v327-internal-dashboard .v306-internal-table tbody tr{
    transition:background-color .14s ease!important;
  }

  .v327-internal-dashboard .v306-internal-table tbody tr:nth-child(even){
    background:color-mix(in srgb,var(--muted) 25%,transparent)!important;
  }

  .v327-internal-dashboard .v306-internal-table tbody tr:hover{
    background:color-mix(in srgb,var(--brand-green) 6%,var(--background))!important;
  }

  .v327-internal-dashboard .v306-internal-table tbody td{
    padding:10px 12px!important;
    border-bottom:1px solid color-mix(in srgb,var(--border) 72%,transparent)!important;
    vertical-align:middle!important;
  }

  .v327-internal-dashboard .v306-internal-table tbody td:first-child{
    min-width:250px!important;
    max-width:360px!important;
    color:var(--foreground)!important;
    font-weight:650!important;
    line-height:1.4!important;
  }

  .v327-internal-dashboard .v306-internal-table tbody td:not(:first-child){
    white-space:nowrap!important;
    font-variant-numeric:tabular-nums!important;
  }

  /* Các cột chi phí nhập có màu nền rất nhẹ để dễ phân biệt */
  .v327-internal-dashboard .v306-internal-table tbody td:nth-child(3),
  .v327-internal-dashboard .v306-internal-table tbody td:nth-child(4),
  .v327-internal-dashboard .v306-internal-table tbody td:nth-child(5){
    background:color-mix(in srgb,var(--amber-brand) 2.5%,transparent)!important;
  }

  /* Thành tiền / lợi nhuận */
  .v327-internal-dashboard .v306-internal-table tbody td:nth-child(7){
    font-weight:750!important;
  }

  .v327-internal-dashboard .v306-internal-table tbody td:nth-child(8){
    font-size:13px!important;
    font-weight:800!important;
  }

  /* Footer tài chính */
  .v327-internal-dashboard .v306-internal-table tfoot td{
    padding:9px 12px!important;
    background:var(--card)!important;
    border-top:0!important;
    font-size:12px!important;
  }

  .v327-internal-dashboard .v306-internal-table tfoot tr:first-child td{
    border-top:2px solid color-mix(in srgb,var(--foreground) 45%,var(--border))!important;
    background:color-mix(in srgb,var(--muted) 36%,var(--card))!important;
    font-weight:800!important;
  }

  .v327-internal-dashboard .v306-internal-table tfoot tr:last-child td{
    border-top:1px dashed color-mix(in srgb,var(--brand-green) 32%,var(--border))!important;
    background:color-mix(in srgb,var(--brand-green) 7%,var(--card))!important;
    font-size:13px!important;
    font-weight:850!important;
  }

  /* Ghi chú giải thích */
  .v327-internal-dashboard .v306-internal-detail > p:last-child{
    margin:12px 2px 0!important;
    padding:10px 12px!important;
    border-left:3px solid color-mix(in srgb,var(--amber-brand) 60%,var(--border))!important;
    border-radius:0 6px 6px 0!important;
    background:color-mix(in srgb,var(--amber-brand) 4%,var(--card))!important;
    color:var(--muted-foreground)!important;
    font-size:10.8px!important;
    line-height:1.55!important;
  }
}

/* 1100–1399: KPI vẫn đẹp nhưng tránh bóp tiền */
@media screen and (min-width:1100px) and (max-width:1399px){
  .v327-internal-dashboard .v306-internal-kpis{
    grid-template-columns:minmax(210px,1.25fr) repeat(5,minmax(125px,1fr))!important;
  }

  .v327-internal-dashboard .v306-internal-kpis > div{
    padding:14px 12px!important;
  }

  .v327-internal-dashboard .v306-internal-kpis > div:not(:first-child) > div:last-child{
    font-size:15px!important;
  }

  .v327-internal-dashboard .v306-internal-kpis > div:nth-child(6) > div:last-child{
    font-size:17px!important;
  }
}

/* 1800px+: tận dụng desktop lớn */
@media screen and (min-width:1800px){
  .v327-internal-dashboard .v306-internal-kpis{
    grid-template-columns:minmax(260px,1.4fr) repeat(5,minmax(170px,1fr))!important;
  }

  .v327-internal-dashboard .v306-internal-kpis > div{
    padding:19px 18px 17px!important;
  }

  .v327-internal-dashboard .v306-internal-kpis > div:not(:first-child) > div:last-child{
    font-size:18px!important;
  }

  .v327-internal-dashboard .v306-internal-kpis > div:nth-child(6) > div:last-child{
    font-size:21px!important;
  }

  .v327-internal-dashboard .v306-internal-detail{
    padding:20px!important;
  }
}

/* Mobile/tablet dưới 1100px: không can thiệp */