/*
 * Quản lý kho — khung chung cho 4 tab (bản thiết kế đã duyệt 05/10/2026).
 * Hàng tab gạch chân, dải chỉ số bấm để lọc, hàng đầu một dòng (chế độ xem + bms-search + nút chính 48px + "⋯"),
 * bảng gọn có một nút chính + menu "⋯", điện thoại xem danh sách thẻ và nút xem bảng ngang.
 * Chỉ dùng token --bms-*; nạp sau các file CSS kho cũ nên mọi rule đều nằm dưới phạm vi tab kho.
 */
html body .panel[data-panel="warehouse"] { --wk-gap: 16px; }
html body .panel[data-panel="warehouse"].active { display: grid; gap: var(--wk-gap); align-content: start; }
html body .panel[data-panel="warehouse"] > .wk-section:not([hidden]) { display: grid; gap: var(--wk-gap); min-width: 0; }

/* Hàng tab */
html body .panel[data-panel="warehouse"] .wk-tabs { display: flex; gap: 4px; align-items: flex-end; min-width: 0; margin: 0; padding: 0; overflow-x: auto; border: 0; border-bottom: 1px solid var(--bms-border); border-radius: 0; background: none; scrollbar-width: none; }
html body .panel[data-panel="warehouse"] .wk-tabs::-webkit-scrollbar { display: none; }
html body .panel[data-panel="warehouse"] .wk-tabs > button { display: inline-flex; flex: none; align-items: center; gap: 6px; height: 44px; min-height: 44px; margin: 0 0 -1px; padding: 0 16px; border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: none; box-shadow: none; color: var(--bms-text-muted); font: 600 15px var(--bms-font-ui); white-space: nowrap; cursor: pointer; }
html body .panel[data-panel="warehouse"] .wk-tabs > button:hover { color: var(--bms-text); }
html body .panel[data-panel="warehouse"] .wk-tabs > button.active { border-bottom-color: var(--bms-primary); background: none; color: var(--bms-primary); }
html body .panel[data-panel="warehouse"] .wk-tabs > button[hidden] { display: none; }
html body .panel[data-panel="warehouse"] .wk-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; background: var(--bms-danger); color: var(--bms-surface); font-size: 12px; font-weight: 700; line-height: 1; }
html body .panel[data-panel="warehouse"] .wk-badge[hidden] { display: none; }

/* Dải chỉ số: một dải, bấm để lọc (dùng chung cho cả tab Thiết bị và Đề nghị xuất kho) */
html body .panel[data-panel="warehouse"] :is(.wk-kpis, .sir-metrics) { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 0; min-width: 0; margin: 0; overflow: hidden; border: 1px solid var(--bms-border); border-radius: var(--bms-radius-3); background: var(--bms-surface); }
html body .panel[data-panel="warehouse"] :is(.wk-kpi, .sir-metric) { display: grid; gap: 2px; align-content: start; min-width: 0; margin: 0; padding: 12px 16px; border: 0; border-left: 1px solid var(--bms-border); border-radius: 0; background: none; box-shadow: none; color: inherit; font: inherit; text-align: left; cursor: pointer; }
html body .panel[data-panel="warehouse"] :is(.wk-kpi, .sir-metric):first-child { border-left: 0; }
html body .panel[data-panel="warehouse"] :is(.wk-kpi, .sir-metric) span { overflow: hidden; color: var(--bms-text-muted); font-size: 13.5px; text-overflow: ellipsis; white-space: nowrap; }
html body .panel[data-panel="warehouse"] :is(.wk-kpi, .sir-metric) strong { font: 700 24px/1.2 var(--bms-font-data, var(--bms-font-ui)); font-variant-numeric: tabular-nums; white-space: nowrap; }
html body .panel[data-panel="warehouse"] .wk-kpi small { color: var(--bms-text-muted); font-size: 12.5px; }
html body .panel[data-panel="warehouse"] :is(.wk-kpi, .sir-metric).is-alert strong { color: var(--bms-danger); }
html body .panel[data-panel="warehouse"] .wk-kpi.is-warn strong { color: var(--bms-warning); }
html body .panel[data-panel="warehouse"] .wk-kpi.is-static { cursor: default; }
html body .panel[data-panel="warehouse"] :is(.wk-kpi, .sir-metric)[aria-pressed="true"] { background: var(--bms-primary-soft); box-shadow: inset 0 -3px 0 var(--bms-primary); }
html body .panel[data-panel="warehouse"] :is(.wk-kpi:not(.is-static), .sir-metric):hover { background: var(--bms-surface-subtle); }
html body .panel[data-panel="warehouse"] :is(.wk-kpi, .sir-metric):focus-visible { outline: 2px solid var(--bms-focus); outline-offset: -2px; }

/* Thẻ nội dung + hàng đầu một dòng */
html body .panel[data-panel="warehouse"] .wk-card { min-width: 0; margin: 0; padding: 0; overflow: visible; border: 1px solid var(--bms-border); border-radius: var(--bms-radius-3); background: var(--bms-surface); box-shadow: none; }
html body .panel[data-panel="warehouse"] .wk-head { display: flex; flex-wrap: nowrap; align-items: center; gap: 12px; min-width: 0; padding: 12px 16px; border-bottom: 1px solid var(--bms-border); }
html body .panel[data-panel="warehouse"] .wk-head-title { margin: 0; font-size: 17px; white-space: nowrap; }
html body .panel[data-panel="warehouse"] .wk-sub { color: var(--bms-text-muted); font-size: 14px; white-space: nowrap; }
html body .panel[data-panel="warehouse"] .wk-sub:empty { display: none; }
html body .panel[data-panel="warehouse"] .wk-tools { display: flex; flex-wrap: nowrap; align-items: center; gap: 8px; min-width: 0; margin-left: auto; }
html body .panel[data-panel="warehouse"] .wk-search-host { display: flex; flex: 0 1 340px; min-width: 180px; }
html body .panel[data-panel="warehouse"] .wk-tools > .bms-search { --bms-search-width: 340px; flex: 0 1 340px; width: 340px; min-width: 180px; }
html body .panel[data-panel="warehouse"] .wk-search-host > .bms-search { --bms-search-width: 340px; flex: 1 1 auto; width: 100%; min-width: 0; }
html body .panel[data-panel="warehouse"] .btn.wk-pill { box-sizing: border-box; display: inline-flex; flex: none; align-items: center; justify-content: center; gap: 6px; height: 48px; min-height: 48px; padding: 0 20px; border-radius: 9999px; font-size: 15px; line-height: 1; white-space: nowrap; }
html body .panel[data-panel="warehouse"] .btn.wk-pill[hidden] { display: none; }
html body .panel[data-panel="warehouse"] .btn.wk-icon { width: 48px; padding: 0; font-size: 19px; }
html body .panel[data-panel="warehouse"] .wk-seg { display: inline-flex; flex: none; gap: 2px; height: 48px; padding: 4px; border: 1px solid var(--bms-border); border-radius: 9999px; background: var(--bms-surface-subtle); }
html body .panel[data-panel="warehouse"] .wk-seg button { height: 38px; min-height: 38px; padding: 0 16px; border: 0; border-radius: 9999px; background: none; box-shadow: none; color: var(--bms-text-muted); font: 600 15px var(--bms-font-ui); white-space: nowrap; cursor: pointer; }
html body .panel[data-panel="warehouse"] .wk-seg button[aria-pressed="true"] { background: var(--bms-surface); box-shadow: var(--bms-shadow-1); color: var(--bms-primary); }

/* Trường lọc ẩn theo chế độ xem (Tồn kho / Nhập – xuất – tồn) */
html body .panel[data-panel="warehouse"] .bms-search__popover :is(.warehouse-toolbar-fields > [hidden], .bms-search__actions[hidden]) { display: none !important; }

/* Menu "⋯" (vị trí fixed do app.js tính, không bị khung cuộn bảng cắt) */
html body .panel[data-panel="warehouse"] .wk-menu { position: relative; flex: none; }
html body .panel[data-panel="warehouse"] .wk-menu > [role="menu"] { position: fixed; z-index: 80; display: grid; min-width: 230px; padding: 6px; border: 1px solid var(--bms-border); border-radius: 12px; background: var(--bms-surface); box-shadow: var(--bms-shadow-overlay); }
html body .panel[data-panel="warehouse"] .wk-menu > [role="menu"][hidden] { display: none; }
html body .panel[data-panel="warehouse"] .wk-menu > [role="menu"] button { display: flex; align-items: center; gap: 10px; height: 40px; min-height: 40px; padding: 0 12px; border: 0; border-radius: 8px; background: none; box-shadow: none; color: var(--bms-text); font: 500 15px var(--bms-font-ui); text-align: left; white-space: nowrap; cursor: pointer; }
html body .panel[data-panel="warehouse"] .wk-menu > [role="menu"] button[hidden] { display: none; }
html body .panel[data-panel="warehouse"] .wk-menu > [role="menu"] button:hover { background: var(--bms-surface-subtle); }
html body .panel[data-panel="warehouse"] .wk-menu > [role="menu"] button small { margin-left: auto; padding-left: 12px; color: var(--bms-text-muted); font-size: 12.5px; }
html body .panel[data-panel="warehouse"] .wk-menu > [role="menu"] hr { width: auto; margin: 4px 6px; border: 0; border-top: 1px solid var(--bms-border); }
html body .panel[data-panel="warehouse"] .wk-menu > [role="menu"] .is-danger { color: var(--bms-danger); }

/* Bảng */
html body .panel[data-panel="warehouse"] .wk-card > .table-wrap { max-width: 100%; margin: 0; overflow-x: auto; border: 0; border-radius: 0 0 var(--bms-radius-3) var(--bms-radius-3); box-shadow: none; }
html body .panel[data-panel="warehouse"] table.wk-table { width: 100%; min-width: 1080px; border-collapse: collapse; table-layout: auto; }
html body .panel[data-panel="warehouse"] .wk-table th { position: sticky; top: 0; z-index: 1; padding: 12px; border-bottom: 1px solid var(--bms-border); background: var(--bms-surface-subtle); color: var(--bms-text-muted); font-size: 13.5px; font-weight: 600; letter-spacing: .02em; line-height: 1.4; text-align: left; text-transform: uppercase; white-space: nowrap; }
html body .panel[data-panel="warehouse"] .wk-table td { padding: 12px; border-bottom: 1px solid var(--bms-border); background: none; color: var(--bms-text); font-size: 13.5px; line-height: 1.4; vertical-align: middle; white-space: normal; }
html body .panel[data-panel="warehouse"] .wk-table tbody tr:hover td { background: var(--bms-surface-subtle); }
html body .panel[data-panel="warehouse"] .wk-table tbody tr:last-child td { border-bottom: 0; }
html body .panel[data-panel="warehouse"] .wk-table .num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
html body .panel[data-panel="warehouse"] .wk-table th.num { text-align: right; }
html body .panel[data-panel="warehouse"] :is(.wk-table td, .wk-mcard) small { display: block; margin-top: 2px; color: var(--bms-text-muted); font-size: 13.5px; font-weight: 400; white-space: normal; }
html body .panel[data-panel="warehouse"] .wk-table .warehouse-price-window { display: block; text-transform: none; }
html body .panel[data-panel="warehouse"] :is(.wk-code, .wk-table td.wk-code) { font-family: var(--bms-font-data, ui-monospace, monospace); font-size: 13.5px; font-weight: 600; white-space: nowrap; }
html body .panel[data-panel="warehouse"] .wk-name { font-weight: 600; }
html body .panel[data-panel="warehouse"] .wk-table th.wk-group { border-left: 1px solid var(--bms-border); text-align: center; }
html body .panel[data-panel="warehouse"] .wk-table tr.wk-total td { background: var(--bms-surface-subtle); font-weight: 700; border-bottom: 0; }
html body .panel[data-panel="warehouse"] .wk-table tbody tr[data-warehouse-history] { cursor: pointer; }
html body .panel[data-panel="warehouse"] .wk-tag { display: inline-flex; align-items: center; height: 22px; padding: 0 8px; border-radius: 6px; background: var(--bms-info-soft); color: var(--bms-info); font-size: 13.5px; font-weight: 600; white-space: nowrap; }
html body .panel[data-panel="warehouse"] .wk-in { color: var(--bms-success); }
html body .panel[data-panel="warehouse"] .wk-out { color: var(--bms-danger); }
html body .panel[data-panel="warehouse"] .wk-warn-text { color: var(--bms-warning); font-weight: 600; }
html body .panel[data-panel="warehouse"] .wk-material { display: flex; align-items: flex-start; gap: 10px; min-width: 220px; }
html body .panel[data-panel="warehouse"] .wk-thumb { flex: none; width: 36px; height: 36px; border: 1px solid var(--bms-border); border-radius: 8px; object-fit: cover; background: var(--bms-surface-subtle); }
html body .panel[data-panel="warehouse"] .wk-ref { display: flex; flex-wrap: wrap; gap: 2px 10px; margin-top: 2px; font-size: 13.5px; }
html body .panel[data-panel="warehouse"] .wk-ref .warehouse-purchase-note { display: -webkit-box; max-width: 320px; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 1; }
html body .panel[data-panel="warehouse"] .wk-avail { display: grid; gap: 4px; justify-items: end; }
html body .panel[data-panel="warehouse"] .wk-meter { position: relative; width: 84px; height: 5px; overflow: hidden; border: 1px solid var(--bms-border); border-radius: 9px; background: var(--bms-surface-subtle); }
html body .panel[data-panel="warehouse"] .wk-meter i { position: absolute; inset: 0 auto 0 0; background: var(--bms-success); }
html body .panel[data-panel="warehouse"] .wk-meter.is-low i { background: var(--bms-danger); }
/* Thanh tồn so với 2 lần tồn tối thiểu, chia 10 nấc (không dùng style inline) */
html body .panel[data-panel="warehouse"] .wk-meter[data-fill="0"] i { width: 0%; }
html body .panel[data-panel="warehouse"] .wk-meter[data-fill="1"] i { width: 10%; }
html body .panel[data-panel="warehouse"] .wk-meter[data-fill="2"] i { width: 20%; }
html body .panel[data-panel="warehouse"] .wk-meter[data-fill="3"] i { width: 30%; }
html body .panel[data-panel="warehouse"] .wk-meter[data-fill="4"] i { width: 40%; }
html body .panel[data-panel="warehouse"] .wk-meter[data-fill="5"] i { width: 50%; }
html body .panel[data-panel="warehouse"] .wk-meter[data-fill="6"] i { width: 60%; }
html body .panel[data-panel="warehouse"] .wk-meter[data-fill="7"] i { width: 70%; }
html body .panel[data-panel="warehouse"] .wk-meter[data-fill="8"] i { width: 80%; }
html body .panel[data-panel="warehouse"] .wk-meter[data-fill="9"] i { width: 90%; }
html body .panel[data-panel="warehouse"] .wk-meter[data-fill="10"] i { width: 100%; }
html body .panel[data-panel="warehouse"] .wk-row-actions { display: flex; flex-wrap: nowrap; align-items: center; justify-content: flex-end; gap: 6px; }
html body .panel[data-panel="warehouse"] .btn.wk-row-btn { height: 34px; min-height: 34px; padding: 0 14px; border-radius: 9999px; font-size: 14.5px; white-space: nowrap; }
html body .panel[data-panel="warehouse"] .btn.wk-dots { width: 34px; height: 34px; min-height: 34px; padding: 0; border-radius: 9999px; font-size: 19px; line-height: 1; }
html body .panel[data-panel="warehouse"] .wk-empty { padding: 28px; color: var(--bms-text-muted); text-align: center; }

/* Chip trạng thái: một hệ cho cả kho */
html body .panel[data-panel="warehouse"] .wk-chip { display: inline-flex; align-items: center; gap: 6px; height: 24px; min-height: 24px; padding: 0 10px; border: 1px solid currentColor; border-radius: 999px; background: var(--bms-surface); font-size: 13.5px; font-weight: 700; line-height: 1; white-space: nowrap; }
html body .panel[data-panel="warehouse"] .wk-chip::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
html body .panel[data-panel="warehouse"] .wk-chip.ok { background: var(--bms-success-soft); color: var(--bms-success); }
html body .panel[data-panel="warehouse"] .wk-chip.warn { background: var(--bms-warning-soft); color: var(--bms-warning); }
html body .panel[data-panel="warehouse"] .wk-chip.bad { background: var(--bms-danger-soft); color: var(--bms-danger); }
html body .panel[data-panel="warehouse"] .wk-chip.info { background: var(--bms-info-soft); color: var(--bms-info); }
html body .panel[data-panel="warehouse"] .wk-chip.neutral { background: var(--bms-neutral-soft); color: var(--bms-text-muted); }

/* Băng thông báo trong thẻ */
html body .panel[data-panel="warehouse"] .wk-banner { display: flex; align-items: center; gap: 12px; margin: 12px 16px 0; padding: 10px 14px; border: 1px solid var(--bms-border); border-left: 4px solid var(--bms-danger); border-radius: 10px; background: var(--bms-danger-soft); font-size: 15px; }
html body .panel[data-panel="warehouse"] .wk-banner.info { border-left-color: var(--bms-info); background: var(--bms-info-soft); }
html body .panel[data-panel="warehouse"] .wk-banner .btn { margin-left: auto; }
html body .panel[data-panel="warehouse"] .wk-banner small { display: block; color: var(--bms-text-muted); }
html body .panel[data-panel="warehouse"] .wk-banner-host:empty { display: none; }
html body .panel[data-panel="warehouse"] .wk-banner-host + .table-wrap { margin-top: 12px; }

/* Danh sách thẻ trên điện thoại (ẩn trên máy tính) */
html body .panel[data-panel="warehouse"] .wk-mlist, html body .panel[data-panel="warehouse"] .wk-mfoot { display: none; }
html body .panel[data-panel="warehouse"] .wk-mcard { display: grid; gap: 6px; padding: 12px 14px; border-bottom: 1px solid var(--bms-border); }
html body .panel[data-panel="warehouse"] .wk-mcard[role="button"] { cursor: pointer; }
html body .panel[data-panel="warehouse"] .wk-mcard[role="button"]:focus-visible { outline: 2px solid var(--bms-focus); outline-offset: -2px; }
html body .panel[data-panel="warehouse"] .wk-mcard .r { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-width: 0; }
html body .panel[data-panel="warehouse"] .wk-mcard .wk-meta { color: var(--bms-text-muted); font-size: 14px; }
html body .panel[data-panel="warehouse"] .wk-mcard .q { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; color: var(--bms-text-muted); font-size: 13.5px; }
html body .panel[data-panel="warehouse"] .wk-mcard .q b { display: block; color: var(--bms-text); font-size: 15px; font-variant-numeric: tabular-nums; }
html body .panel[data-panel="warehouse"] .wk-mcard .wk-row-actions { justify-content: flex-start; }

/* Tab Thiết bị & CCDC và Đề nghị xuất kho: cùng hàng công cụ 48px viên thuốc */
html body .panel[data-panel="warehouse"] .sir-toolbar { flex-wrap: nowrap; gap: 8px; min-width: 0; }
html body .panel[data-panel="warehouse"] .sir-toolbar .sir-seg { flex: none; gap: 2px; height: 48px; padding: 4px; overflow: visible; border: 1px solid var(--bms-border); border-radius: 9999px; background: var(--bms-surface-subtle); }
html body .panel[data-panel="warehouse"] .sir-toolbar .sir-seg button { height: 38px; min-height: 38px; padding: 0 16px; border: 0; border-radius: 9999px; font-weight: 600; white-space: nowrap; }
html body .panel[data-panel="warehouse"] .sir-toolbar .sir-seg button[aria-pressed="true"] { background: var(--bms-surface); box-shadow: var(--bms-shadow-1); color: var(--bms-primary); }
html body .panel[data-panel="warehouse"] .sir-toolbar > .bms-search { flex: 1 1 340px; min-width: 180px; }
html body .panel[data-panel="warehouse"] .sir-toolbar > .btn { flex: none; height: 48px; min-height: 48px; padding: 0 20px; border-radius: 9999px; white-space: nowrap; }

html body .panel[data-panel="warehouse"] .wk-card .sir-materials { margin: 0; padding: 16px; border: 0; }
/* Danh sách | chi tiết trong thẻ như mockup: cột danh sách có vạch ngăn, chi tiết không có viền thẻ riêng */
html body .panel[data-panel="warehouse"] .wk-card .sir-split { gap: 0; margin: 0; padding: 0; border: 0; align-items: stretch; }
html body .panel[data-panel="warehouse"] .wk-card .sir-split > .sir-list { padding: 10px; border-right: 1px solid var(--bms-border); }
html body .panel[data-panel="warehouse"] .wk-card .sir-detail-host { padding: 4px 8px; }
html body .panel[data-panel="warehouse"] .wk-card .sir-detail-host > .sir-detail { border: 0; border-radius: 0; box-shadow: none; }
html body .panel[data-panel="warehouse"] .wk-card .sir-detail-host > .sir-empty-state { margin: 12px; }
html body .panel[data-panel="warehouse"] .wk-kpis .wk-kpi.sir-metric { display: grid; }

@media (max-width: 1280px) {
  html body .panel[data-panel="warehouse"] .wk-head .wk-sub { display: none; }
  html body .panel[data-panel="warehouse"] .wk-search-host { flex: 1 1 180px; max-width: 300px; }
  html body .panel[data-panel="warehouse"] .btn.wk-pill:not(.wk-icon) { padding: 0 16px; font-size: 14.5px; }
  html body .panel[data-panel="warehouse"] .wk-seg button { padding: 0 12px; }
}
@media (max-width: 1100px) {
  html body .panel[data-panel="warehouse"] .wk-head { flex-wrap: wrap; }
  html body .panel[data-panel="warehouse"] .wk-tools { width: 100%; margin-left: 0; }
  html body .panel[data-panel="warehouse"] .wk-search-host { flex: 1 1 auto; max-width: none; }
  html body .panel[data-panel="warehouse"] .sir-toolbar { flex-wrap: wrap; }
}
@media (max-width: 767px) {
  html body .panel[data-panel="warehouse"] { --wk-gap: 12px; }
  html body .panel[data-panel="warehouse"] :is(.wk-kpis, .sir-metrics) { display: flex; overflow-x: auto; border-radius: 12px; scrollbar-width: none; }
  html body .panel[data-panel="warehouse"] :is(.wk-kpis, .sir-metrics)::-webkit-scrollbar { display: none; }
  html body .panel[data-panel="warehouse"] :is(.wk-kpi, .sir-metric) { flex: 0 0 auto; min-width: 132px; padding: 10px 14px; }
  html body .panel[data-panel="warehouse"] :is(.wk-kpi, .sir-metric) strong { font-size: 19px; }
  html body .panel[data-panel="warehouse"] .wk-head { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; padding: 12px; }
  html body .panel[data-panel="warehouse"] .wk-head-title { display: none; }
  html body .panel[data-panel="warehouse"] .wk-seg { max-width: 100%; overflow-x: auto; scrollbar-width: none; }
  html body .panel[data-panel="warehouse"] .wk-tools { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; width: 100%; }
  html body .panel[data-panel="warehouse"] .wk-search-host { min-width: 0; max-width: none; }
  html body .panel[data-panel="warehouse"] .btn.wk-primary-text { width: 48px; padding: 0; }
  html body .panel[data-panel="warehouse"] .btn.wk-primary-text span { display: none; }
  html body .panel[data-panel="warehouse"] .wk-card:not(.is-expanded) > .wk-desk { display: none; }
  html body .panel[data-panel="warehouse"] .wk-card:not(.is-expanded) > .wk-mlist { display: block; }
  html body .panel[data-panel="warehouse"] .wk-card[data-view="period"]:not(.is-expanded) > .wk-desk { display: block; }
  html body .panel[data-panel="warehouse"] .wk-card[data-view="period"] > :is(.wk-mlist, .wk-mfoot) { display: none; }
  html body .panel[data-panel="warehouse"] .wk-card .sir-materials { padding: 12px; }
  html body .panel[data-panel="warehouse"] .wk-card .sir-split { grid-template-columns: minmax(0, 1fr); }
  html body .panel[data-panel="warehouse"] .wk-card .sir-split > .sir-list { border-right: 0; }
  html body .panel[data-panel="warehouse"] .wk-mfoot { display: flex; justify-content: center; padding: 12px; }
  html body .panel[data-panel="warehouse"] .wk-card.is-expanded > :is(.wk-head, .wk-banner-host) { display: none; }
  html body .panel[data-panel="warehouse"] .wk-card.is-expanded { display: flex; flex-direction: column; border: 0; border-radius: 0; }
  html body .panel[data-panel="warehouse"] .wk-card.is-expanded > .wk-mfoot { position: sticky; top: 0; z-index: 3; order: -1; justify-content: flex-start; padding: 8px 12px; border-bottom: 1px solid var(--bms-border); background: var(--bms-surface); }
  html body .panel[data-panel="warehouse"] .wk-banner { flex-wrap: wrap; margin: 12px 12px 0; }
  html body .panel[data-panel="warehouse"] .wk-banner .btn { width: 100%; margin-left: 0; }
  html body .panel[data-panel="warehouse"] .sir-toolbar .sir-seg { max-width: 100%; overflow-x: auto; }
  html body .panel[data-panel="warehouse"] .sir-toolbar > .bms-search { flex: 1 1 100%; }
  html body .panel[data-panel="warehouse"] .wk-menu > [role="menu"] { max-width: calc(100vw - 16px); }
  html body .panel[data-panel="warehouse"] .wk-menu > [role="menu"] button small { display: none; }
}
@media print {
  html body .panel[data-panel="warehouse"] :is(.wk-tabs, .wk-tools, .wk-seg, .wk-row-actions, .wk-mlist, .wk-mfoot, .wk-banner-host) { display: none !important; }
  html body .panel[data-panel="warehouse"] .wk-desk { display: block !important; overflow: visible; }
  html body .panel[data-panel="warehouse"] table.wk-table { min-width: 0; }
}

/* Sổ chi tiết nhập – xuất – tồn theo mặt hàng (L11) và chứng từ gốc mở từ số chứng từ. */
html body .panel[data-panel="warehouse"] :is(.wk-kpis, .wk-card)[hidden] { display: none !important; }
html body .panel[data-panel="warehouse"] .wk-ledger-title { flex: 1 1 auto; min-width: 0; }
html body .panel[data-panel="warehouse"] .wk-ledger-title h3 { margin: 0; overflow: hidden; font-size: 17px; text-overflow: ellipsis; white-space: nowrap; }
html body .panel[data-panel="warehouse"] .wk-ledger-kpis { margin: 12px 16px 0; }
html body .panel[data-panel="warehouse"] .wk-ledger-body > .table-wrap { margin-top: 12px; }
html body .panel[data-panel="warehouse"] .wk-ledger tbody tr { cursor: default; }
html body .panel[data-panel="warehouse"] .wk-ledger tr.wk-open-row td { background: var(--bms-surface-subtle); }
html body .panel[data-panel="warehouse"] .wk-ledger :is(td:nth-child(6), td:nth-child(8), td:nth-child(10)) { border-left: 1px solid var(--bms-border); }
html body .panel[data-panel="warehouse"] .wk-ledger tfoot td { background: var(--bms-surface-subtle); font-weight: 700; }
html body .panel[data-panel="warehouse"] .wk-mcard.is-static { cursor: default; }
html body .panel[data-panel="warehouse"] .wk-ledger-text { font-size: 14.5px; }
html body .panel[data-panel="warehouse"] .wk-doclink { padding: 0; border: 0; background: none; color: var(--bms-primary); font: 600 13.5px var(--bms-font-data, var(--bms-font-ui)); white-space: nowrap; text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }
html body .panel[data-panel="warehouse"] .wk-doclink:hover { color: var(--bms-primary-hover); }
html body .panel[data-panel="warehouse"] .wk-doc { display: grid; gap: 14px; }
html body .panel[data-panel="warehouse"] .wk-voucher { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px; align-items: start; }
html body .panel[data-panel="warehouse"] .wk-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px 20px; margin: 0; }
html body .panel[data-panel="warehouse"] .wk-facts dt { color: var(--bms-text-muted); font-size: 13.5px; }
html body .panel[data-panel="warehouse"] .wk-facts dd { margin: 2px 0 0; font-weight: 600; font-variant-numeric: tabular-nums; }
html body .panel[data-panel="warehouse"] .wk-vtotal { display: grid; justify-items: end; gap: 2px; }
html body .panel[data-panel="warehouse"] .wk-vtotal span { color: var(--bms-text-muted); font-size: 13.5px; }
html body .panel[data-panel="warehouse"] .wk-vtotal strong { font-size: 24px; font-variant-numeric: tabular-nums; }
html body .panel[data-panel="warehouse"] .wk-mini { overflow: auto; border: 1px solid var(--bms-border); border-radius: 10px; }
html body .panel[data-panel="warehouse"] .wk-mini table { width: 100%; min-width: 520px; border-collapse: collapse; }
html body .panel[data-panel="warehouse"] .wk-mini th { padding: 8px 10px; border-bottom: 1px solid var(--bms-border); background: var(--bms-surface-subtle); color: var(--bms-text-muted); font-size: 13.5px; font-weight: 600; text-align: left; white-space: nowrap; }
html body .panel[data-panel="warehouse"] .wk-mini td { padding: 8px 10px; border-bottom: 1px solid var(--bms-border); font-size: 14.5px; vertical-align: top; }
html body .panel[data-panel="warehouse"] .wk-mini .num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
html body .panel[data-panel="warehouse"] .wk-mini td small { display: block; color: var(--bms-text-muted); font-size: 12.5px; }
html body .panel[data-panel="warehouse"] .wk-mini tr.is-hl td { background: var(--bms-primary-soft); }
html body .panel[data-panel="warehouse"] .wk-mini tfoot td { border-bottom: 0; background: var(--bms-surface-subtle); font-weight: 700; }
html body .panel[data-panel="warehouse"] .wk-origin { display: grid; gap: 8px; padding: 14px 16px; border: 1px solid var(--bms-border); border-left: 4px solid var(--bms-primary); border-radius: 12px; background: var(--bms-surface-subtle); }
html body .panel[data-panel="warehouse"] .wk-origin h4 { margin: 2px 0 0; font-size: 16px; }
html body .panel[data-panel="warehouse"] .wk-origin small, html body .panel[data-panel="warehouse"] .wk-origin p { margin: 0; color: var(--bms-text-muted); font-size: 14.5px; }
html body .panel[data-panel="warehouse"] .wk-kicker { color: var(--bms-primary); font-size: 12.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
html body .panel[data-panel="warehouse"] .wk-zero-note { margin: 0; padding: 10px 16px 14px; color: var(--bms-text-muted); font-size: 14px; text-align: center; }
html body .panel[data-panel="warehouse"] .wk-zero-note button { padding: 0; border: 0; background: none; color: var(--bms-primary); font: inherit; font-weight: 600; cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
html body .panel[data-panel="warehouse"] .warehouse-zero-field { display: flex; flex-direction: row; align-items: center; gap: 8px; min-height: 40px; cursor: pointer; }
html body .panel[data-panel="warehouse"] .warehouse-zero-field[hidden] { display: none; }
html body .panel[data-panel="warehouse"] .warehouse-zero-field input { width: 18px; height: 18px; margin: 0; accent-color: var(--bms-primary); }
html body .panel[data-panel="warehouse"] .wk-note { margin: 0; padding: 10px 12px; border: 1px dashed var(--bms-border-strong); border-radius: 10px; background: var(--bms-surface-subtle); color: var(--bms-text-muted); font-size: 14px; }
@media (max-width: 767px) {
  html body .panel[data-panel="warehouse"] .wk-ledger-head { grid-template-columns: auto minmax(0, 1fr); }
  html body .panel[data-panel="warehouse"] .wk-ledger-head > .wk-tools { grid-column: 1 / -1; }
  html body .panel[data-panel="warehouse"] .wk-ledger-head > .btn { width: 48px; padding: 0; }
  html body .panel[data-panel="warehouse"] .wk-ledger-head .wk-desk-inline { display: none; }
  html body .panel[data-panel="warehouse"] .wk-ledger-kpis { margin: 12px 12px 0; }
  html body .panel[data-panel="warehouse"] .wk-ledger-body > .wk-desk { display: none; }
  html body .panel[data-panel="warehouse"] .wk-ledger-body > .wk-mlist { display: block; margin-top: 12px; }
  html body .panel[data-panel="warehouse"] .wk-voucher { grid-template-columns: 1fr; }
  html body .panel[data-panel="warehouse"] .wk-vtotal { justify-items: start; }
}

/* Hàng thiếu mã vật tư: huy hiệu cảnh báo, rê chuột xem lý do (không tự sinh mã). */
html body .panel[data-panel="warehouse"] .wk-nocode { display: inline-flex; align-items: center; gap: 4px; height: 24px; padding: 0 8px; border: 1px solid var(--bms-warning); border-radius: 6px; background: var(--bms-warning-soft); color: var(--bms-warning); font-family: var(--bms-font-ui); font-size: 13px; font-weight: 600; white-space: nowrap; cursor: help; }

/* Sổ chi tiết dễ đọc hơn (anh Hiệp 05/10): hàng tiêu đề gọn, cột Tồn tô nền, số tabular. */
html body .panel[data-panel="warehouse"] .wk-ledger thead th { padding: 8px 14px; }
html body .panel[data-panel="warehouse"] .wk-ledger tbody td, html body .panel[data-panel="warehouse"] .wk-ledger tfoot td { padding: 12px 14px; font-size: 14.5px; }
html body .panel[data-panel="warehouse"] .wk-ledger :is(td, th).num { font-variant-numeric: tabular-nums; }
html body .panel[data-panel="warehouse"] .wk-ledger tbody td:nth-child(n+10) { background: color-mix(in srgb, var(--bms-primary) 4%, transparent); }
html body .panel[data-panel="warehouse"] .wk-ledger .wk-doclink { font-size: 14.5px; }
/* Cột Mã không bị một mã dài kéo rộng: cắt bớt, rê chuột xem đủ. */
html body .panel[data-panel="warehouse"] .wk-table td.wk-code { max-width: 180px; overflow: hidden; text-overflow: ellipsis; }
/* Nhập – xuất – tồn: bỏ luật cũ "th:first-child 34%" (styles.css) vốn làm cột Mã và cột SL đầu kỳ phình to, cột Vật tư bị bóp. */
html body .panel[data-panel="warehouse"] #warehouseMaterialTable.warehouse-period-table th { width: auto; }
html body .panel[data-panel="warehouse"] #warehouseMaterialTable.warehouse-period-table th[rowspan] { vertical-align: middle; }
html body .panel[data-panel="warehouse"] #warehouseMaterialTable.warehouse-period-table thead tr:first-child th:first-child { width: 150px; }
html body .panel[data-panel="warehouse"] #warehouseMaterialTable.warehouse-period-table thead tr:first-child th:nth-child(2) { min-width: 280px; }
html body .panel[data-panel="warehouse"] #warehouseMaterialTable.warehouse-period-table td.wk-code { max-width: 150px; }
html body .panel[data-panel="warehouse"] #warehouseMaterialTable.warehouse-period-table tbody tr[data-warehouse-history] > td:nth-child(2) { min-width: 280px; }