.inventory-dashboard-screen { width: min(100%, 1180px); }
.invdash-header-main { min-width: 0; }
.invdash-global-filters { flex-wrap: wrap; }
.invdash-tabs {
  display: flex; gap: 0; margin: 12px 0 0; padding: 0 0 2px;
  overflow-x: auto; overscroll-behavior-inline: contain; scrollbar-width: thin;
  border-bottom: 1px solid var(--border, #d8dde5);
}
.invdash-tab {
  flex: 1 1 auto; min-height: 38px; padding: 8px 8px;
  border: 1px solid transparent; border-bottom: 3px solid transparent;
  border-radius: 5px 5px 0 0; background: transparent;
  color: var(--muted, #5a6472); font: inherit; font-size: 12px; font-weight: 700;
  white-space: nowrap; text-align: center; cursor: pointer;
}
.invdash-tab:hover { background: rgba(21, 101, 192, 0.07); color: #1565c0; }
.invdash-tab.is-active { color: #0d47a1; background: rgba(21, 101, 192, 0.1); border-color: rgba(21, 101, 192, 0.18); border-bottom-color: #1565c0; }
.invdash-tab:focus-visible { outline: 2px solid #1565c0; outline-offset: -2px; }
.invdash-tab-panels { padding: 0 14px 14px; }
.invdash-tab-panel { min-width: 0; padding-top: 4px; }
.invdash-tab-panel[hidden] { display: none !important; }
.invdash-report-card { margin-top: 8px; padding: 16px; border: 1px solid var(--border, #d8dde5); border-radius: 6px; }
.invdash-report-card p { margin: 0 0 12px; color: var(--muted, #5a6472); }
.invdash-report-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.invdash-item-tabs { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.invdash-item-tab {
  min-height: 36px; padding: 7px 14px; border: 1px solid var(--border, #d8dde5);
  border-radius: 5px; background: var(--surface, #fff); color: var(--muted, #5a6472);
  font: inherit; font-size: 12px; font-weight: 700; cursor: pointer;
}
.invdash-item-tab:hover { color: #1565c0; background: rgba(21, 101, 192, 0.07); }
.invdash-item-tab.is-active { color: #0d47a1; border-color: #1565c0; background: rgba(21, 101, 192, 0.1); }
.invdash-item-tab:focus-visible { outline: 2px solid #1565c0; outline-offset: 2px; }
.invdash-item-panel[hidden] { display: none !important; }
.invdash-item-panel .grid-wrap { width: 100%; overflow-x: auto; }
.invdash-row-title {
  font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em;
  color: var(--muted, #5a6472); margin: 18px 0 4px; padding-bottom: 4px;
  border-bottom: 1px solid var(--border, #e0e0e0);
}
.invdash-cards { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.invdash-health { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.invdash-cards .kpi-card {
  color: #fff; border: none; padding: 14px 12px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.12);
}
.invdash-cards .kpi-card-value { color: #fff; font-size: 22px; }
.invdash-cards .kpi-card-label { color: rgba(255,255,255,0.9); }
.kpi-card-blue   { background: linear-gradient(135deg,#1565c0,#1e88e5); }
.kpi-card-teal   { background: linear-gradient(135deg,#00796b,#26a69a); }
.kpi-card-green  { background: linear-gradient(135deg,#2e7d32,#43a047); }
.kpi-card-indigo { background: linear-gradient(135deg,#3949ab,#5c6bc0); }
.kpi-card-purple { background: linear-gradient(135deg,#6a1b9a,#8e24aa); }
.kpi-card-orange { background: linear-gradient(135deg,#e65100,#fb8c00); }

.invdash-health-card { border-left: 5px solid #9e9e9e; }
.invdash-tone-warn    { border-left-color: #f9a825; }
.invdash-tone-orange  { border-left-color: #ef6c00; }
.invdash-tone-red     { border-left-color: #c62828; }
.invdash-tone-red .kpi-card-value    { color: #c62828; }
.invdash-tone-orange .kpi-card-value { color: #ef6c00; }
.invdash-tone-warn .kpi-card-value   { color: #b8860b; }
.invdash-tone-green   { border-left-color: #2e7d32; }
.invdash-tone-green .kpi-card-value  { color: #2e7d32; }
.invdash-tone-neutral { border-left-color: #607d8b; }

.invdash-movement { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 10px; margin: 8px 0; }
.invdash-move-card h3 { font-size: 12px; margin: 0 0 6px; text-transform: uppercase; letter-spacing: 0.03em; color: var(--muted,#5a6472); }
.invdash-move-row { display: flex; justify-content: space-between; font-size: 13px; padding: 3px 0; border-bottom: 1px dashed var(--border,#eee); }
.invdash-move-row:last-child { border-bottom: none; }
.invdash-move-row strong { font-variant-numeric: tabular-nums; }

.invdash-two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: start; }
/* The global `table { min-width: 980px }` overflows these half-width columns and
   throws the right-hand table (Top Consumed) out of alignment. Let them fit. */
.invdash-two-col > div { min-width: 0; }
.invdash-two-col .grid-wrap { overflow-x: auto; }
.invdash-two-col .grid-wrap table { min-width: 0; }
/* Keep both column headings the same height so the two tables start on the same
   row even when one title wraps and the other does not. */
.invdash-two-col .invdash-row-title { min-height: 2.4em; display: flex; align-items: flex-end; }
.inventory-dashboard-screen td.num, .inventory-dashboard-screen th.num { text-align: right; font-variant-numeric: tabular-nums; }

@media (max-width: 1100px) {
  .invdash-cards, .invdash-health { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .invdash-movement { grid-template-columns: 1fr; }
  .invdash-two-col { grid-template-columns: 1fr; }
}


#inventory-dashboard.inventory-dashboard-active-fallback { display: block; }
body:has(#inventory-dashboard.inventory-dashboard-active-fallback) .dashboard { display: none; }

#inventory-dashboard-host { display: contents; }

/* Inventory Movement History (read-only ledger section) */
.invmove-panel { margin-top: 6px; }
.invmove-filters { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: flex-end; }
.invmove-filters label { display: flex; flex-direction: column; font-size: 12px; gap: 3px; }
.invmove-filters input,
.invmove-filters select { min-width: 130px; }
.invmove-filter-actions { display: flex; gap: 8px; align-items: flex-end; }
.invmove-toolbar {
  display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center;
  justify-content: space-between; margin: 10px 0 2px;
}
.invmove-status { font-size: 12px; color: var(--muted, #5a6472); }
.invmove-pager { display: flex; align-items: center; gap: 8px; }
.invmove-pageinfo { font-size: 12px; color: var(--muted, #5a6472); font-variant-numeric: tabular-nums; }
.invmove-table th, .invmove-table td { white-space: nowrap; }
.invmove-table td:nth-child(3) { white-space: normal; min-width: 180px; }

@media (max-width: 640px) {
  .invdash-tabs { margin-inline: -4px; padding-inline: 0 4px; }
  .invdash-tab { flex: 0 0 auto; min-height: 42px; padding: 9px 8px; }
  .invdash-tab-panels { padding-inline: 8px; }
  .invdash-global-filters label { flex: 1 1 46%; min-width: 0; }
  .invdash-global-filters input,
  .invdash-global-filters select { width: 100%; min-width: 0; }
  .invdash-item-tabs { display: grid; grid-template-columns: 1fr 1fr; }
  .invdash-item-tab { width: 100%; white-space: normal; }
  .invmove-filters { gap: 8px; }
  .invmove-filters label { flex: 1 1 46%; }
  .invmove-filters input,
  .invmove-filters select { min-width: 0; width: 100%; }
  .invmove-filter-actions { flex: 1 1 100%; }
  .invmove-filter-actions .small-button { flex: 1 1 auto; }
  .invmove-toolbar { justify-content: flex-start; }
}


@media print {
  #inventory-dashboard { display: block !important; }
  .invdash-tabs, .invdash-report-card { display: none !important; }
  .invdash-tab-panel[hidden] { display: block !important; }
  .invdash-item-tabs { display: none !important; }
  .invdash-item-panel[hidden] { display: block !important; }
}