/**
 * Inventory → Tổng quan kho — compact density (overview tab only).
 * Scope: body.use-new-ui.route-inventory .inv-overview-desk
 * Loads after inventory-intelligence-desktop.css
 */

@media (min-width: 769px) {
  body.use-new-ui.route-inventory .inv-overview-desk {
    display: flex;
    flex-direction: column;
    gap: 10px;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inv-overview-toolbar {
    margin-bottom: 0 !important;
  }

  /* ---- 3 priority KPI cards ---- */
  body.use-new-ui.route-inventory .inv-overview-desk .inventory-priority-grid.inv-hero-strip {
    padding: 0;
    margin: 0;
    border: none;
    background: transparent;
    box-shadow: none;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-priority-grid .inv-hero-metric:hover {
    transform: none;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-priority-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin: 0;
    padding: 0;
    border: none;
    background: transparent;
    box-shadow: none;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-priority-grid .inv-hero-metric--tier-a {
    min-height: 98px !important;
    max-height: none !important;
    height: auto !important;
    padding: 14px 16px !important;
    border-radius: 10px !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-priority-grid .inv-hero-k {
    font-size: 11px !important;
    letter-spacing: 0.05em !important;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-priority-grid .inv-hero-v--primary {
    font-size: clamp(20px, 1.45vw, 26px) !important;
    line-height: 1.08 !important;
  }

  /* ---- Metric strips ---- */
  body.use-new-ui.route-inventory .inv-overview-desk .inventory-metric-strips {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 0;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-metric-strip {
    width: 100%;
    min-width: 0;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-metric-strip-inner {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    min-height: 58px;
    padding: 4px 0;
    border-radius: 10px;
    border: 1px solid rgba(205, 214, 228, 0.72);
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-gutter: stable;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-metric-strip--secondary .inventory-metric-strip-inner {
    background: rgba(248, 250, 252, 0.92);
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-metric-item {
    flex: 1 1 132px;
    min-width: 118px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 1px;
    padding: 8px 14px;
    box-sizing: border-box;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-metric-sep {
    width: 1px;
    align-self: stretch;
    margin: 8px 0;
    background: rgba(226, 232, 240, 0.95);
    flex-shrink: 0;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-metric-k {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #64748b;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-metric-v {
    font-size: clamp(18px, 1.15vw, 21px);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum";
    color: #0f172a;
    line-height: 1.12;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-metric-sub {
    font-size: 10.5px;
    font-weight: 500;
    line-height: 1.25;
    color: #94a3b8;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-metric-item--warn .inventory-metric-v {
    color: #b45309;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-metric-item--bad .inventory-metric-v {
    color: #b91c1c;
  }

  /* ---- Insight panels (dense) ---- */
  body.use-new-ui.route-inventory .inv-overview-desk .inventory-insight-grid {
    gap: 10px !important;
    margin-bottom: 0 !important;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-insight-grid .inv-intel-card {
    padding: 10px 12px !important;
    min-height: 0 !important;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-insight-grid .inv-intel-head h4 {
    font-size: 15px !important;
    margin: 0 0 2px !important;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-insight-grid .inv-intel-sub {
    font-size: 13px !important;
    margin-bottom: 6px !important;
    line-height: 1.35 !important;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-insight-grid .inv-intel-body {
    min-height: 0 !important;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-insight-grid .inv-intel-row {
    min-height: 34px;
    padding: 6px 0 !important;
    font-size: 13px !important;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-insight-grid .inv-intel-meta {
    font-size: 12px !important;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-insight-grid .empty-state--compact {
    padding: 10px 8px !important;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inv-overview-help--compact {
    margin: 0 !important;
    font-size: 12px !important;
    line-height: 1.35 !important;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inv-hero-subnote {
    margin: 0 !important;
    font-size: 12px !important;
  }

  /* ---- Gợi ý nhập — dense list ---- */
  body.use-new-ui.route-inventory .inv-overview-desk .inventory-dense-list.inv-restock-panel {
    padding: 10px 12px !important;
    margin-bottom: 8px !important;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-dense-list .inv-panel-head {
    margin-bottom: 8px !important;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-dense-list .inv-panel-head h3 {
    font-size: 15px !important;
    margin: 0 !important;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-dense-list .inv-panel-sub {
    font-size: 12px !important;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inv-restock-list {
    display: block;
    gap: 0;
    overflow: visible;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-dense-row {
    display: grid;
    grid-template-columns: 72px minmax(120px, 1.4fr) 56px 56px 72px minmax(72px, 0.8fr);
    gap: 8px 10px;
    align-items: center;
    min-height: 36px;
    padding: 4px 6px;
    border-bottom: 1px solid #f1f5f9;
    box-sizing: border-box;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-dense-row--head {
    min-height: 30px;
    padding: 2px 6px 6px;
    border-bottom: 1px solid #e2e8f0;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #64748b;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-dense-row--data:last-child {
    border-bottom: none;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-dense-col--name {
    font-size: 13px;
    font-weight: 650;
    color: #0f172a;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-dense-col--num,
  body.use-new-ui.route-inventory .inv-overview-desk .inventory-dense-col--eta {
    font-size: 13px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    text-align: right;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-dense-col--bar .inv-restock-bar {
    display: block;
    width: 100%;
    max-width: 72px;
    margin-left: auto;
    height: 4px;
    border-radius: 999px;
    background: rgba(226, 232, 240, 0.95);
    overflow: hidden;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-dense-col--bar .inv-restock-bar > span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: rgba(59, 130, 246, 0.72);
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inv-restock-dense-row--hot .inv-restock-bar > span {
    background: rgba(239, 68, 68, 0.78);
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inv-restock-dense-row--warn .inv-restock-bar > span {
    background: rgba(245, 158, 11, 0.82);
  }


  body.use-new-ui.route-inventory .inv-overview-desk .inv-restock-badge {
    font-size: 10px !important;
    padding: 2px 7px !important;
    min-height: 0 !important;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inv-restock-dense-row--hot {
    background: rgba(254, 242, 242, 0.35);
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inv-restock-dense-row--warn {
    background: rgba(254, 252, 232, 0.35);
  }

  /* ---- Alert subpanels (batch tables) ---- */
  body.use-new-ui.route-inventory .inv-overview-desk .inv-alert-grid {
    gap: 10px !important;
    margin-top: 0 !important;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inv-subpanel {
    padding: 10px 12px !important;
    min-height: 0 !important;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inv-subpanel h4 {
    margin: 0 0 8px !important;
    font-size: 14px !important;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inv-alert-table tbody td {
    min-height: 34px !important;
    padding: 6px 10px !important;
  }
}

@media (max-width: 768px) {
  body.use-new-ui.route-inventory .inv-overview-desk .inventory-metric-strips {
    gap: 6px;
    margin-bottom: 8px;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-metric-strip-inner {
    flex-wrap: nowrap;
    min-height: 54px;
    border-radius: 9px;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-metric-item {
    flex: 0 0 auto;
    min-width: 108px;
    padding: 7px 12px;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-metric-v {
    font-size: 17px;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-priority-grid {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-priority-grid .inv-hero-metric--tier-a {
    min-height: 84px !important;
    padding: 12px 14px !important;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-dense-row {
    grid-template-columns: 62px minmax(88px, 1fr) 44px 44px 58px 48px;
    gap: 4px 6px;
    min-height: 34px;
    font-size: 12px;
  }
}

@media (max-width: 1100px) and (min-width: 769px) {
  body.use-new-ui.route-inventory .inv-overview-desk .inventory-priority-grid {
    grid-template-columns: 1fr;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-insight-grid {
    grid-template-columns: 1fr !important;
  }

  body.use-new-ui.route-inventory .inv-overview-desk .inventory-dense-row {
    grid-template-columns: 64px minmax(100px, 1fr) 48px 48px 64px 56px;
    gap: 6px 8px;
  }
}