/* ==========================================================================
   Purchase Request Center — UI Prototype + Flow Prototype
   (ClinicOS Inventory V3)
   ==========================================================================
   Pure UI/Flow layer — no backend, no API, static in-memory Prototype data
   only. Reuses the existing shared Foundation classes from
   inventory-design.css / item-center.css untouched (.card,
   .inventory-section-card, .inventory-btn-*, .icon-btn, .dialog-*,
   .status-badge, .toggle-switch, .field-grid, .item-more-menu,
   .item-thumb-placeholder, .inventory-empty-state, .query-field,
   .supplier-search-card) — only new page-specific structural classes live
   here, plus one small shared addition (.status-badge-info) for the
   REVIEWING status tier, which is a soft-blue shade of the same palette
   already extended for the Movement Timeline's 盤點 color in item-center.css.
   ========================================================================== *//* ---- Shared: soft-blue status tier (REVIEWING) ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .status-badge-info {
  background: #e6f0fa;
  color: #1c5d8c;
}/* ---- Summary Cards (4 tiles) ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--ids-space-4);
  margin-bottom: var(--ids-space-4);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-summary-card {
  display: flex;
  align-items: center;
  gap: var(--ids-space-3);
  background: var(--color-white);
  border: 1px solid var(--ids-border-soft);
  border-radius: var(--ids-radius-lg);
  padding: var(--ids-space-4);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-summary-icon {
  width: 40px;
  height: 40px;
  border-radius: var(--ids-radius-md);
  background: #eef6fb;
  color: var(--color-navy);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-summary-icon .inv-icon {
  width: 20px;
  height: 20px;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-summary-value {
  font-size: var(--ids-font-xl);
  font-weight: 700;
  color: var(--color-navy);
  line-height: 1.2;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-summary-label {
  font-size: var(--ids-font-xs);
  color: var(--color-text-muted);
  margin-top: 2px;
}/* ---- Permission simulator (section 九) ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-permission-panel {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--ids-space-4);
  background: var(--ids-surface-muted);
  border: 1px solid var(--ids-border-soft);
  border-radius: var(--ids-radius-md);
  padding: var(--ids-space-3) var(--ids-space-4);
  margin-bottom: var(--ids-space-4);
  font-size: var(--ids-font-sm);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-permission-title {
  display: flex;
  align-items: center;
  gap: 6px;
  font-weight: 600;
  color: var(--color-text-muted);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-permission-title .inv-icon {
  width: 16px;
  height: 16px;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-permission-toggle {
  display: flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
}/* ---- Filter row ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-filter-card {
  margin-bottom: var(--ids-space-4);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-filter-row {
  display: flex;
  align-items: flex-end;
  gap: var(--ids-space-3);
  flex-wrap: wrap;
}/* ---- Batch toolbar (V1.2 section 五 — left / center / right, no row of
   6-8 large buttons) ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-batch-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--ids-space-3);
  flex-wrap: wrap;
  padding: var(--ids-space-3) var(--ids-space-4);
  border-bottom: 1px solid var(--ids-border-soft);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-batch-left, :is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-batch-center, :is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-batch-right {
  display: flex;
  align-items: center;
  gap: var(--ids-space-2);
  flex-wrap: wrap;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-select-all {
  display: flex;
  align-items: center;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-batch-count {
  font-size: var(--ids-font-sm);
  font-weight: 600;
  color: var(--color-text);
  white-space: nowrap;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-batch-amount {
  font-size: var(--ids-font-sm);
  color: var(--color-text-muted);
  white-space: nowrap;
}/* ---- List rows (section 十五 — base row shell; zone layout below) ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-row-list {
  display: flex;
  flex-direction: column;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--ids-space-3);
  padding: 8px var(--ids-space-4);
  border-bottom: 1px solid var(--ids-border-soft);
  transition: background 150ms ease;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-row:last-child {
  border-bottom: none;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-row:hover {
  background: var(--ids-surface-hover);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-row.is-terminal {
  opacity: 0.65;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-row-thumb {
  width: 56px;
  height: 56px;
  border-radius: var(--ids-radius-md);
  flex-shrink: 0;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-row-name {
  font-size: var(--ids-font-md);
  font-weight: 700;
  color: var(--color-text);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-qty-input:focus {
  outline: none;
  border-color: var(--color-teal);
  box-shadow: var(--ids-shadow-focus);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-qty-input:disabled {
  background: var(--ids-surface-muted);
  color: var(--color-text-muted);
}/* ---- Purchase Settings Dialog (section 三) ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-settings-dialog {
  width: 480px;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-toggle-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: var(--ids-font-sm);
  color: var(--color-text);
  cursor: default;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-settings-section-title {
  margin-top: var(--ids-space-4);
  margin-bottom: var(--ids-space-2);
  font-size: var(--ids-font-sm);
  font-weight: 600;
  color: var(--color-text);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-mode-group {
  display: flex;
  flex-direction: column;
  gap: 6px;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-mode-option {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: var(--ids-font-sm);
  color: var(--color-text);
  cursor: pointer;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-mode-option.disabled {
  color: var(--color-text-muted);
  cursor: not-allowed;
}/* ---- Create Purchase Order dialog (section 一／五 flow) ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .po-create-dialog {
  width: 640px;
  max-width: 92vw;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .po-create-body {
  padding: var(--ids-space-5) var(--ids-space-6);
  max-height: 65vh;
  overflow-y: auto;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-flow-steps {
  display: flex;
  align-items: center;
  gap: var(--ids-space-2);
  margin-bottom: var(--ids-space-4);
  font-size: var(--ids-font-sm);
  color: var(--color-text-muted);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-flow-step.active {
  color: var(--color-teal);
  font-weight: 600;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-flow-step.done {
  color: #0e6d61;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-flow-step-sep {
  color: var(--ids-border-soft);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .po-supplier-group {
  margin-bottom: var(--ids-space-3);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .po-supplier-count {
  font-size: var(--ids-font-xs);
  color: var(--color-text-muted);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .po-line-list {
  display: flex;
  flex-direction: column;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .po-line-row {
  display: flex;
  align-items: center;
  gap: var(--ids-space-3);
  padding: var(--ids-space-2) 0;
  border-bottom: 1px solid var(--ids-border-soft);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .po-line-row:last-child {
  border-bottom: none;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .po-line-info {
  flex: 2 1 160px;
  min-width: 120px;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .po-line-qty {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 1 1 100px;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .po-qty-input {
  width: 72px;
  height: 32px;
  padding: 0 8px;
  border: 1px solid var(--ids-border-soft);
  border-radius: var(--ids-radius-sm);
  font-size: var(--ids-font-sm);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .po-line-cost {
  flex: 1 1 100px;
  font-size: var(--ids-font-xs);
  color: var(--color-text-muted);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .po-line-subtotal {
  flex: 1 1 100px;
  text-align: right;
  font-size: var(--ids-font-sm);
  font-weight: 600;
  color: var(--color-navy);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .po-grand-total {
  text-align: right;
  font-size: var(--ids-font-sm);
  color: var(--color-text);
  margin-top: var(--ids-space-3);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .po-done-banner {
  display: flex;
  align-items: center;
  gap: var(--ids-space-2);
  background: #e3f5f1;
  color: #0e6d61;
  border-radius: var(--ids-radius-md);
  padding: var(--ids-space-3);
  font-weight: 600;
  margin-bottom: var(--ids-space-4);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .po-done-list {
  display: flex;
  flex-direction: column;
  gap: var(--ids-space-2);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .po-done-group {
  border: 1px solid var(--ids-border-soft);
  border-radius: var(--ids-radius-sm);
  padding: var(--ids-space-2) var(--ids-space-3);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .po-done-row {
  display: flex;
  align-items: center;
  gap: var(--ids-space-3);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .po-done-no {
  font-weight: 600;
  color: var(--color-navy);
  min-width: 140px;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .po-send-btn {
  margin-left: auto;
}/* ---- 供應商通知 row within a PO group (section 十) ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-notify-row {
  display: flex;
  align-items: center;
  gap: var(--ids-space-3);
  margin-top: var(--ids-space-2);
  padding-top: var(--ids-space-2);
  border-top: 1px dashed var(--ids-border-soft);
  font-size: var(--ids-font-sm);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-notify-checkbox {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--color-text);
  white-space: nowrap;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-notify-fixed-method {
  font-size: var(--ids-font-sm);
  color: var(--color-text-muted);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .po-notify-method-select {
  height: 32px;
  padding: 0 8px;
  border: 1px solid var(--ids-border-soft);
  border-radius: var(--ids-radius-sm);
  font-size: var(--ids-font-sm);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .po-notify-method-select:disabled {
  background: var(--ids-surface-muted);
  color: var(--color-text-muted);
}/* ---- Notification Settings dialog (section 十: 供應商設定) ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-notify-supplier-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-notify-supplier-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--ids-space-3);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-notify-supplier-name {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: var(--ids-font-sm);
  color: var(--color-text);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-notify-supplier-name .inv-icon {
  width: 15px;
  height: 15px;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-notify-supplier-select {
  height: 36px;
  padding: 0 8px;
  border: 1px solid var(--ids-border-soft);
  border-radius: var(--ids-radius-sm);
  font-size: var(--ids-font-sm);
}/* ---- Login Reminder Modal (section 四) ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-reminder-overlay {
  align-items: center;
  justify-content: center;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-reminder-panel {
  width: 360px;
  padding: var(--ids-space-6);
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--ids-space-2);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-reminder-icon {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: #fff6e5;
  color: #8a5a00;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: var(--ids-space-2);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-reminder-icon .inv-icon {
  width: 24px;
  height: 24px;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-reminder-title {
  font-size: var(--ids-font-lg);
  font-weight: 700;
  color: var(--color-navy);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-reminder-summary {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: var(--ids-space-2) 0 var(--ids-space-4);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-reminder-line {
  font-size: var(--ids-font-sm);
  color: var(--color-text);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-reminder-danger {
  color: #b3382c;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-reminder-warning {
  color: #8a5a00;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-reminder-actions {
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 100%;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-summary-sub {
  font-size: 11px;
  color: var(--color-text-muted);
  margin-top: 2px;
}/* ---- Notification indicator in the filter bar (section 十四) ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-notify-indicator {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-left: auto;
  font-size: var(--ids-font-sm);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-notify-indicator-label {
  color: var(--color-text-muted);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-notify-indicator-value {
  font-weight: 600;
  color: var(--color-text);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-optional-badge {
  font-size: 11px;
  color: var(--color-text-muted);
  background: var(--ids-surface-muted);
  border: 1px solid var(--ids-border-soft);
  border-radius: 999px;
  padding: 1px 8px;
}/* ---- Split/dropdown "建立採購單" button (section 十二) ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-split-button {
  display: inline-flex;
  position: relative;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-split-main {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-split-arrow {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  border-left: 1px solid rgba(255, 255, 255, 0.3);
  padding-left: 8px;
  padding-right: 8px;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-split-arrow .inv-icon {
  width: 14px;
  height: 14px;
}/* ---- Source badges (section 七) — soft-tint tiers, no emoji ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-source-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  font-weight: 600;
  border-radius: 999px;
  padding: 2px 8px;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-source-badge .inv-icon {
  width: 12px;
  height: 12px;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .source-badge-safety {
  background: #e6f0fa;
  color: #1c5d8c;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .source-badge-manual {
  background: #eef0f2;
  color: #55606b;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .source-badge-reservation {
  background: #f1ecfb;
  color: #6a4bb3;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .source-badge-ai {
  background: #e4f6f2;
  color: #0f7a68;
}/* ---- Five-zone row layout (section 十五) ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-row {
  align-items: stretch;
  gap: 0;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-row-main {
  flex: 1;
  display: flex;
  align-items: flex-start;
  gap: var(--ids-space-4);
  width: 100%;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-zone {
  display: flex;
  flex-direction: column;
  gap: 3px;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-zone-title {
  font-size: 11px;
  font-weight: 600;
  color: var(--color-text-muted);
  margin-bottom: 2px;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-zone-a {
  flex: 1 1 220px;
  min-width: 200px;
  flex-direction: row;
  gap: var(--ids-space-3);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-row-text {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-row-line1 {
  display: flex;
  align-items: center;
  gap: var(--ids-space-2);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-row-line2, :is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-row-line3 {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: var(--ids-font-xs);
  color: var(--color-text-muted);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-zone-b {
  flex: 1 1 200px;
  min-width: 190px;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-zone-c {
  flex: 1 1 220px;
  min-width: 200px;
}/* ---- Zone B: three lightweight stat blocks + one supplementary line
   (V1.2 section 四 — big number, small label, no repeated 安全庫存 text) ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-stat-block-row {
  display: flex;
  gap: var(--ids-space-3);
  margin-bottom: 4px;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-stat-block {
  display: flex;
  flex-direction: column;
  gap: 1px;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-stat-block-value {
  font-size: var(--ids-font-md);
  font-weight: 700;
  color: var(--color-text);
  line-height: 1.2;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-stat-block-label {
  font-size: 11px;
  color: var(--color-text-muted);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-projected-line {
  padding-top: 2px;
  border-top: 1px dashed var(--ids-border-soft);
}/* ---- Zone C: 建議採購量 headline + stepper + supplier/amount ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-suggest-line {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--ids-space-2);
  font-size: var(--ids-font-xs);
  color: var(--color-text-muted);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-suggest-value {
  font-size: var(--ids-font-md);
  font-weight: 700;
  color: var(--color-navy);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-decision-meta-row {
  display: flex;
  gap: var(--ids-space-4);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-decision-meta-row .pr-mini-stat {
  flex: 1 1 50%;
  min-width: 0;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-decision-meta-row .pr-mini-stat strong {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  min-width: 0;
  flex-shrink: 1;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-mini-stat {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--ids-space-2);
  font-size: var(--ids-font-xs);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-mini-stat span {
  color: var(--color-text-muted);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-mini-stat strong {
  color: var(--color-text);
  font-weight: 600;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-mini-stat strong.pr-tier-danger {
  color: #b3382c;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-mini-stat strong.pr-tier-success {
  color: #0e6d61;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-reason-toggle {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  margin-top: 1px;
  border: none;
  background: none;
  padding: 0;
  font-size: 11px;
  color: var(--color-teal);
  cursor: pointer;
  align-self: flex-start;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-reason-toggle .inv-icon {
  width: 12px;
  height: 12px;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-zone-e {
  flex: 0 0 auto;
  flex-direction: row;
  align-items: center;
  gap: 2px;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-row-select-label {
  display: flex;
  align-items: center;
  padding: 0 4px;
}/* ---- Recommendation-reason expansion panel (section 八) ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-reason-panel {
  flex-basis: 100%;
  display: flex;
  flex-wrap: wrap;
  gap: var(--ids-space-2) var(--ids-space-5);
  margin-top: var(--ids-space-3);
  padding: var(--ids-space-3);
  background: var(--ids-surface-muted);
  border-radius: var(--ids-radius-sm);
  font-size: var(--ids-font-xs);
  color: var(--color-text);
}/* ---- Quantity stepper (section 九) ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-qty-stepper-wrap {
  display: flex;
  flex-direction: column;
  gap: 3px;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-qty-stepper {
  display: flex;
  align-items: center;
  gap: 4px;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-qty-step {
  width: 24px;
  height: 24px;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-qty-step .inv-icon {
  width: 13px;
  height: 13px;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-qty-input {
  width: 60px;
  height: 24px;
  text-align: center;
  padding: 0 4px;
  border: 1px solid var(--ids-border-soft);
  border-radius: var(--ids-radius-sm);
  font-size: var(--ids-font-sm);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-qty-unit {
  font-size: var(--ids-font-xs);
  color: var(--color-text-muted);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-qty-meta {
  font-size: 11px;
  color: var(--color-text-muted);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-qty-hint {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  font-size: 11px;
  color: #8a5a00;
  background: #fff6e5;
  border-radius: var(--ids-radius-sm);
  padding: 4px 8px;
  margin-top: 2px;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-qty-snap {
  height: 22px;
  padding: 0 8px;
  font-size: 11px;
}/* ---- Ignored note under a row (section 十) ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-ignored-note {
  flex-basis: 100%;
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: var(--ids-space-2);
  font-size: var(--ids-font-xs);
  color: var(--color-text-muted);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-ignored-note .inv-icon {
  width: 13px;
  height: 13px;
}/* ---- Ignore dialog (section 十) ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-mode-group-row {
  flex-direction: row;
  flex-wrap: wrap;
  gap: var(--ids-space-3);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-ignore-date-input, :is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-ignore-note-input {
  margin-top: var(--ids-space-2);
  width: 100%;
  padding: 8px;
  border: 1px solid var(--ids-border-soft);
  border-radius: var(--ids-radius-sm);
  font-size: var(--ids-font-sm);
  font-family: inherit;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-ignore-note-input {
  min-height: 64px;
  resize: vertical;
}/* ---- PO grouping-mode summary + merge warning (section 十二) ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .po-mode-summary {
  font-size: var(--ids-font-sm);
  color: var(--color-text);
  background: var(--ids-surface-muted);
  border-radius: var(--ids-radius-sm);
  padding: var(--ids-space-2) var(--ids-space-3);
  margin-bottom: var(--ids-space-3);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .po-merge-warning {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: var(--ids-font-xs);
  color: #8a5a00;
  background: #fff6e5;
  border-radius: var(--ids-radius-sm);
  padding: 6px 8px;
  margin-bottom: var(--ids-space-2);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .po-merge-warning .inv-icon {
  width: 13px;
  height: 13px;
}/* ---- Login Reminder: muted "no price permission" line ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-reminder-muted {
  color: var(--color-text-muted);
  font-style: normal;
}/* ---- Responsive ---- */


@media (max-width: 1440px) {:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-zone-a {
    flex-basis: 200px;
    min-width: 180px;
  }
}

@media (max-width: 1200px) {:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-summary-grid {
    grid-template-columns: repeat(2, 1fr);
  }:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-notify-indicator {
    margin-left: 0;
  }
}

@media (max-width: 900px) {:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-row-main {
    flex-wrap: wrap;
  }:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-zone-b, :is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-zone-c {
    flex-basis: 100%;
  }:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-zone-e {
    flex-basis: 100%;
    justify-content: flex-end;
  }
}/* ==========================================================================
   待採購單 Phase 1A (Inventory V3 IA V2「採購管理」第三層) — new list-as-
   工作清單 UI: 5-item quick-filter Summary Strip, two-row filter bar with a
   quick-chip row, a compact scrollable 14-column table (replacing the old
   3-zone card row above), a redesigned batch action bar, a right-side
   Detail Drawer, and a 新增採購需求 Drawer. Everything above this block
   (Purchase Settings Dialog, Ignore/Defer dialog primitives, source badges,
   permission panel, filter card) is reused unchanged. The old 5-zone
   `.pr-row`/`.pr-zone-*` card-row rules above remain in the file but are no
   longer rendered by PurchaseRequestCenterPage.js — left in place rather
   than pruned, per this phase's "最小增量修改，不得整檔覆蓋既有工作" rule.
   ========================================================================== */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-page-shell {
  gap: 0;
}/* ---- A. Header 沿用 .inventory-page-header／.item-page-actions，無需新增
   規則. ---- *//* ---- B. Summary Strip：5 個可作快速篩選入口的工作指標，樣式比照 Material
   Issue Center 的 Summary Strip（無卡片外框，單行 Icon＋數字＋名稱）。 ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-summary-strip {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: var(--ids-space-4);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-strip-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border: 1px solid var(--ids-border-soft);
  border-radius: var(--ids-radius-lg);
  background: var(--color-white);
  cursor: pointer;
  color: var(--color-text-muted);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-strip-item:disabled {
  cursor: default;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-strip-item:hover:not(:disabled) {
  border-color: var(--color-teal);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-strip-item.active {
  border-color: var(--color-teal);
  background: #eef8f7;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-strip-item .inv-icon {
  width: 16px;
  height: 16px;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-strip-item-danger .inv-icon {
  color: #b3382c;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-strip-value {
  font-size: var(--ids-font-lg);
  font-weight: 700;
  color: var(--color-navy);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-strip-item-danger .pr-strip-value {
  color: #b3382c;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-strip-label {
  font-size: var(--ids-font-xs);
  white-space: nowrap;
}/* ---- C. Filter bar 第二列：快速條件＋清除條件 ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-quick-row {
  margin-top: var(--ids-space-3);
  align-items: center;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-quick-chip {
  padding: 6px 14px;
  border: 1px solid var(--ids-border-soft);
  border-radius: 999px;
  background: var(--color-white);
  color: var(--color-text-muted);
  font-size: var(--ids-font-xs);
  cursor: pointer;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-quick-chip:hover {
  border-color: var(--color-teal);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-quick-chip.active {
  background: var(--color-teal);
  border-color: var(--color-teal);
  color: var(--color-white);
  font-weight: 600;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-clear-btn {
  margin-left: auto;
  height: 30px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: var(--ids-font-xs);
}/* ---- D. 待採購清單 — ERP 工作清單（R1 section 二: 14 欄整合為 9 欄，改為
   資訊整合而非增加高度），水平可視需要捲動，勾選／品項固定左側、操作固定
   右側（section 十: 1280 寬度需求）. ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-list-wrap {
  display: flex;
  flex-direction: column;
  min-height: 0;
  flex: 1 1 auto;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-table-scroll {
  overflow-x: auto;
  border: 1px solid var(--ids-border-soft);
  border-radius: var(--ids-radius-lg);
  background: var(--color-white);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-table {
  display: flex;
  flex-direction: column;
  min-width: 1180px;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-table-row {
  display: grid;
  grid-template-columns: 40px 80px 240px 110px 90px 150px 150px 96px 120px;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--ids-border-soft);
  font-size: var(--ids-font-xs);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-table-row:last-child {
  border-bottom: none;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-table-row.is-selected {
  background: #eef8f7;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-table-row.is-terminal {
  color: var(--color-text-muted);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-table-header-row {
  position: sticky;
  top: 0;
  z-index: 3;
  font-weight: 600;
  color: var(--color-text-muted);
  background: var(--ids-surface-muted);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-table-cell {
  overflow: hidden;
  text-overflow: ellipsis;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-col-check, :is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-col-item {
  position: sticky;
  background: inherit;
  z-index: 2;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-col-check {
  left: 0;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-col-item {
  left: 40px;
  cursor: pointer;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-col-actions {
  position: sticky;
  right: 0;
  z-index: 2;
  background: inherit;
  display: flex;
  align-items: center;
  gap: 4px;
  justify-content: flex-end;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-table-header-row .pr-col-check, :is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-table-header-row .pr-col-item, :is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-table-header-row .pr-col-actions {
  background: var(--ids-surface-muted);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-item-name-row {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-item-name {
  font-weight: 600;
  color: var(--color-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-item-meta {
  font-size: 11px;
  color: var(--color-text-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}/* ---- R1 section 六: 特殊狀態 Tag（一般待處理不顯示），置於品項欄名稱旁,
   不再佔用獨立欄位. ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-row-status-tag {
  flex-shrink: 0;
}/* ---- R1 section 三: 庫存狀況整合欄（取代原本目前庫存／安全庫存兩欄）. ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-stock-cell {
  display: flex;
  flex-direction: column;
  gap: 1px;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-stock-current {
  font-weight: 700;
  color: var(--color-text);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-stock-current.pr-text-danger {
  color: #b3382c;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-stock-safety {
  font-size: 11px;
  color: var(--color-text-muted);
}/* ---- R1 section 四: 採購量整合欄（建議採購量＋實際採購量 Stepper 同一
   區塊，取代原本兩個獨立欄位）. ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-qty-cell {
  display: flex;
  flex-direction: column;
  gap: 3px;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-qty-suggest-line {
  font-size: 11px;
  color: var(--color-text-muted);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-no-supplier-tag {
  font-size: 11px;
  color: #8a5a00;
  background: #fff6e5;
  border-radius: 999px;
  padding: 1px 8px;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-text-danger {
  color: #b3382c;
  font-weight: 600;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-suggested-cell {
  font-weight: 600;
  color: var(--color-navy);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-qty-snap-hint {
  margin-top: 2px;
  border: none;
  background: #fff6e5;
  color: #8a5a00;
  border-radius: var(--ids-radius-sm);
  font-size: 10px;
  padding: 1px 6px;
  cursor: pointer;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-row-action {
  height: 26px;
  padding: 0 8px;
  font-size: 11px;
}/* ---- 緊急程度標籤（section 八: 明顯但不刺眼） ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-urgency-tag {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 11px;
  font-weight: 600;
  white-space: nowrap;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-urgency-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  flex-shrink: 0;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-urgency-normal { color: var(--color-text-muted); }:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-urgency-normal .pr-urgency-dot { background: var(--ids-border-soft); }:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-urgency-attention { color: #8a5a00; }:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-urgency-attention .pr-urgency-dot { background: #e5a623; }:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-urgency-urgent { color: #b3382c; }:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-urgency-urgent .pr-urgency-dot { background: #d9483a; }/* ---- F. 批次操作列 ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-batch-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--ids-space-3);
  flex-wrap: wrap;
  padding: 10px 14px;
  margin-bottom: var(--ids-space-3);
  background: #eef8f7;
  border: 1px solid var(--color-teal);
  border-radius: var(--ids-radius-lg);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-batch-left {
  display: flex;
  align-items: center;
  gap: var(--ids-space-3);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-batch-bar .pr-batch-count {
  font-weight: 700;
  color: var(--color-navy);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-batch-bar .pr-batch-amount {
  font-size: var(--ids-font-sm);
  color: var(--color-text-muted);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-batch-actions {
  display: flex;
  align-items: center;
  gap: var(--ids-space-2);
  flex-wrap: wrap;
}/* ---- 不採購 確認對話框（section 五 E: 高風險操作需確認） ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-reject-confirm-dialog {
  width: 440px;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-reject-warning {
  background: #fdf1f0;
  color: #b3382c;
  border-left: 3px solid #d9483a;
}/* ---- R1 section 七: 權限模擬 Prototype Tool 對話框（原本佔主畫面一整列
   的 .pr-permission-panel 本身樣式不變，只是改由這個對話框承載）. ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-permission-dialog {
  width: 520px;
}/* ---- 六、需求詳情 Drawer：右側 Drawer，寬度適合 1280／1600，不遮住整個
   背景（section 六／九）. ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-drawer-overlay {
  position: fixed;
  inset: 0;
  background: rgba(18, 43, 68, 0.32);
  z-index: 70;
  display: flex;
  justify-content: flex-end;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-drawer-panel {
  width: 620px;
  max-width: 92vw;
  height: 100%;
  background: var(--color-white);
  box-shadow: -8px 0 24px rgba(18, 43, 68, 0.16);
  display: flex;
  flex-direction: column;
  min-height: 0;
}/* ---- R1 section 十二: Toast 不得蓋住 Drawer Title — 開啟 Drawer 期間，
   共用的 .toast-container（未修改其本身樣式）往左偏移到 Drawer 外側，避免
   兩者在畫面右上角重疊. ---- */body.pr-drawer-open .toast-container {
  right: 640px;
}

@media (max-width: 1366px) {body.pr-drawer-open .toast-container {
    right: 600px;
  }
}

@media (max-width: 1280px) {body.pr-drawer-open .toast-container {
    right: 570px;
  }
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-drawer-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--ids-space-3);
  padding: var(--ids-space-4) var(--ids-space-5);
  border-bottom: 1px solid var(--ids-border-soft);
  flex-shrink: 0;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-drawer-title {
  font-size: var(--ids-font-lg);
  font-weight: 700;
  color: var(--color-navy);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-drawer-badges {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 6px;
}/* ---- R1 section 九: Drawer 最上方的決策摘要，讓採購人員打開 Drawer 第一
   眼即可判斷要不要買，完整資料留給下方 4 個頁籤. ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-drawer-decision-summary {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: var(--ids-space-3);
  padding: var(--ids-space-3) var(--ids-space-5);
  background: var(--ids-surface-muted);
  border-bottom: 1px solid var(--ids-border-soft);
  flex-shrink: 0;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-drawer-decision-item {
  display: flex;
  flex-direction: column;
  gap: 2px;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-drawer-decision-label {
  font-size: 11px;
  color: var(--color-text-muted);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-drawer-decision-value {
  font-size: var(--ids-font-sm);
  font-weight: 700;
  color: var(--color-navy);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-drawer-decision-value.pr-text-danger {
  color: #b3382c;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-drawer-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding: var(--ids-space-4) var(--ids-space-5);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-drawer-footer {
  flex-shrink: 0;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-detail-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px var(--ids-space-4);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-detail-field {
  display: flex;
  flex-direction: column;
  gap: 2px;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-detail-field-block {
  margin-top: var(--ids-space-3);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-detail-field-label {
  font-size: 11px;
  color: var(--color-text-muted);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-detail-field-value {
  font-size: var(--ids-font-sm);
  color: var(--color-text);
}

@media (max-width: 1366px) {:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-drawer-panel {
    width: 580px;
  }
}/* ---- 七、新增／編輯採購需求 Dialog ----
   INVENTORY-PURCHASE-REQUEST-CREATE-DIALOG-UAT-FIX: this dialog asked for
   640px but rendered at 480px, because the base
   `#inventoryOverlayRoot .dialog-panel` carries `max-width: min(92vw, 480px)`
   and a `width` declaration alone never beats a max-width — the same trap the
   Purchase Return create dialog hit. Both must be set together.
   Selector note: this file is linked BEFORE inventory-overlay-portal.css, so at
   equal specificity that file's .dialog-panel would still win on source order.
   Qualifying with .dialog-panel adds a class and wins outright — the same shape
   inventory-overlay-portal.css itself uses for .dialog-panel.si-dialog-panel.
   ---- */:is(#inventoryHostRoot, #inventoryOverlayRoot) .dialog-panel.pr-add-dialog {
  width: min(720px, calc(100vw - 48px));
  max-width: min(720px, calc(100vw - 48px));
  max-height: calc(100vh - 48px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-add-dialog .dialog-header,
:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-add-dialog .dialog-footer {
  flex: 0 0 auto;
  position: static;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-add-dialog-body {
  display: flex;
  flex-direction: column;
  gap: var(--ids-space-2);
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
}/* THE defect: .pr-add-dialog-body is a column flex container, and a flex item
   whose `overflow` is not `visible` gets an automatic minimum size of 0
   instead of auto. .pr-add-item-picker sets `overflow: hidden`, so as soon as
   this body's content exceeded its height (which it did once the 需求明細
   section was added) the picker was the one child that could shrink all the
   way to zero — collapsing to just its 2px borders and clipping the search
   input and the result list out of existence. Nothing in this scrolling body
   may shrink; the body scrolls instead. */:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-add-dialog-body > * {
  flex: 0 0 auto;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-add-field-grid {
  margin-top: var(--ids-space-2);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-add-item-picker {
  border: 1px solid var(--ids-border-soft);
  border-radius: var(--ids-radius-md);
  overflow: hidden;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-add-item-picker .mi-item-dialog-search {
  padding: var(--ids-space-2) var(--ids-space-3);
  border-bottom: 1px solid var(--ids-border-soft);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-add-item-list {
  max-height: 220px;
  overflow-y: auto;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-add-item-row {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  width: 100%;
  padding: 8px 12px;
  border: none;
  border-bottom: 1px solid var(--ids-border-soft);
  background: var(--color-white);
  cursor: pointer;
  text-align: left;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-add-item-row:last-child {
  border-bottom: none;
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-add-item-row:hover {
  background: var(--ids-surface-muted);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-add-item-empty {
  padding: var(--ids-space-4);
  text-align: center;
  color: var(--color-text-muted);
  font-size: var(--ids-font-sm);
}:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-add-item-selected {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--ids-space-3);
  padding: 10px 12px;
  border: 1px solid var(--color-teal);
  border-radius: var(--ids-radius-md);
  background: #eef8f7;
}/* ---- Responsive (section 十／R1 section 十二): 1280 表格捲動已由
   .pr-table-scroll 處理；Drawer 於窄螢幕縮至 540~560px 避免壓縮主畫面，
   決策摘要改為 3 欄避免文字過度擠壓. ---- */


@media (max-width: 1280px) {:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-drawer-panel {
    width: 550px;
  }:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-drawer-decision-summary {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* ---- INVENTORY-PURCHASE-REQUEST-CREATE-DIALOG-UAT-FIX ----
   商品搜尋 → 加入需求 → 需求明細. The line-list classes introduced when the
   dialog became multi-line had no CSS at all, so added rows rendered as raw
   unstyled text. ---- */
:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-add-item-picker {
  /* Belt and braces: never let this collapse again even if a future layout
     change re-introduces shrinking on the body. */
  flex: 0 0 auto;
  min-height: 0;
}
:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-add-item-row .pr-add-item-action {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: var(--color-teal);
  font-weight: 600;
  white-space: nowrap;
}
:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-add-line-list {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--ids-border-soft);
  border-radius: var(--ids-radius-md);
  overflow: visible;
}
:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-add-line-row {
  display: flex;
  align-items: center;
  gap: var(--ids-space-3);
  padding: var(--ids-space-2) var(--ids-space-3);
  border-bottom: 1px solid var(--ids-border-soft);
}
:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-add-line-row:last-child {
  border-bottom: none;
}
:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-add-line-identity {
  display: flex;
  flex-direction: column;
  gap: 2px;
  flex: 1 1 auto;
  min-width: 0;
}
:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-add-line-qty {
  display: flex;
  flex-direction: column;
  gap: 2px;
  flex: 0 0 120px;
}
:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-add-line-qty > span {
  font-size: var(--ids-font-xs);
  color: var(--color-text-muted);
}
:is(#inventoryHostRoot, #inventoryOverlayRoot) .pr-add-line-qty input {
  width: 100%;
  min-width: 0;
  height: 34px;
  box-sizing: border-box;
  padding: 0 8px;
  border: 1px solid var(--ids-border-soft);
  border-radius: var(--ids-radius-sm);
  font-size: var(--ids-font-sm);
  text-align: right;
}