/* Quản lý kho Zamio (DDR-022). Khung panel, dải tab, thẻ kho, thanh công cụ và bảng đều dùng lại class
   có sẵn của cascade (.warehouse-panel, .warehouse-section-tabs, .warehouse-card, .warehouse-toolbar,
   .warehouse-table, .inventory-filters, .inventory-drawer) — đã đối chiếu: Zamio có đủ các rule này, xem
   design/warehouse-redesign/source-notes.md. File này chỉ khai phần Zamio cần khác. Chỉ token --bms-*. */

/* Nguồn kẹp min-width 1080px cho bảng 14 cột; bảng của Zamio ít cột hơn nên để tự co. */
[data-panel="warehouse"] .zwh-table { min-width: 0; }
[data-panel="warehouse"] .zwh-table :is(th, td) { vertical-align: middle; }
[data-panel="warehouse"] .zwh-table td small { display: block; margin-top: 2px; color: var(--bms-text-muted); font: 500 12px/1.35 var(--bms-font-ui); }
[data-panel="warehouse"] .zwh-table th:nth-child(n+5):nth-child(-n+8),
[data-panel="warehouse"] .zwh-table td:nth-child(n+5):nth-child(-n+8) { text-align: right; }
[data-panel="warehouse"] .zwh-table td.zwh-num { font: 600 13px/1.4 var(--bms-font-data); }

/* Khả dụng âm phải nhìn thấy: nguồn kẹp về 0 nên kho thiếu trông như vừa đủ. */
[data-panel="warehouse"] .zwh-negative { color: var(--bms-danger); font-weight: 700; }
[data-panel="warehouse"] .zwh-demand-cell { color: var(--bms-warning); font-weight: 700; }
[data-panel="warehouse"] .zwh-demand-cell.is-ok { color: var(--bms-text-muted); font-weight: 500; }

[data-panel="warehouse"] .zwh-shared-note { margin-top: var(--bms-space-3); }
[data-panel="warehouse"] .warehouse-toolbar-fields { display: flex; align-items: flex-end; gap: var(--bms-space-3); flex-wrap: wrap; }
[data-panel="warehouse"] .warehouse-toolbar-fields label { display: flex; flex-direction: column; gap: var(--bms-space-1); color: var(--bms-text-muted); font: 600 12px/1.3 var(--bms-font-ui); }

/* Thẻ kho: nguồn mở drawer tuyệt đối trong panel; Zamio neo cố định bên phải màn hình. */
[data-panel="warehouse"] .zwh-drawer[hidden] { display: none; }
[data-panel="warehouse"] .zwh-drawer { position: fixed; inset: 0 0 0 auto; z-index: 40; width: min(520px, 100%); padding: var(--bms-space-5); overflow: auto; background: var(--bms-surface); border-left: 1px solid var(--bms-border); box-shadow: var(--bms-shadow-3); }
[data-panel="warehouse"] .zwh-drawer header { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--bms-space-3); margin-bottom: var(--bms-space-4); }
[data-panel="warehouse"] .zwh-drawer h3 { margin: 0; color: var(--bms-text); font: 700 16px/1.3 var(--bms-font-ui); }
[data-panel="warehouse"] .zwh-card-line { display: grid; grid-template-columns: max-content 1fr auto; gap: var(--bms-space-3); padding: var(--bms-space-2) 0; border-bottom: 1px solid var(--bms-border); font: 500 13px/1.5 var(--bms-font-ui); }
[data-panel="warehouse"] .zwh-card-line time { color: var(--bms-text-muted); font: 600 12px/1.5 var(--bms-font-data); }
[data-panel="warehouse"] .zwh-card-line b { color: var(--bms-text); font: 700 13px/1.5 var(--bms-font-data); text-align: right; white-space: nowrap; }
[data-panel="warehouse"] .zwh-card-line.is-out b { color: var(--bms-danger); }
[data-panel="warehouse"] .zwh-card-line.is-in b { color: var(--bms-success); }

/* Cascade gán grid-area theo thứ tự con cho .metric-grid của panel dashboard-style, đẩy thẻ thứ 2 lên đầu.
   Hai dải chỉ số ở đây là danh sách phẳng nên bỏ hẳn named area (cùng cách đã dùng cho #dashMoneyGrid). */
[data-panel="warehouse"] .warehouse-metrics { grid-template-areas: none; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); }
[data-panel="warehouse"] .warehouse-metrics > .metric { grid-area: auto; }
/* Giữ nguyên quy tắc order/tô màu của cascade — thứ tự thẻ ở app.js đã xếp theo đúng khuôn đó. */