body { font-family: Arial, sans-serif; background:#f6f7fb; color:#222; margin:0; }
.container { max-width: 1100px; margin: 24px auto; padding: 0 16px; }
h1 { margin-bottom: 8px; }
.muted { color:#666; margin-top:0; }
.panel { background:#fff; border-radius:12px; padding:16px; box-shadow:0 2px 12px rgba(0,0,0,.06); margin-bottom:16px; }
.workspace-tabs { display:flex; gap:10px; margin-bottom:10px; flex-wrap:wrap; padding:10px; border:1px solid #dbe3ee; border-radius:14px; background:linear-gradient(180deg, #f8fbff 0%, #eef4ff 100%); box-shadow:0 8px 24px rgba(15,23,42,0.05); }
.workspace-tab { border:1px solid #cbd5e1; background:#ffffff; color:#1e293b; padding:9px 16px; border-radius:10px; cursor:pointer; font-weight:700; box-shadow:0 1px 2px rgba(15,23,42,0.04); }
.workspace-tab.active { background:#1e293b; color:#fff; border-color:#1e293b; box-shadow:0 8px 18px rgba(30,41,59,0.22); }
.workspace-context-bar { display:flex; justify-content:space-between; align-items:flex-end; gap:12px; margin:0 0 12px; padding:4px 2px 10px; border-bottom:1px solid #e5e7eb; }
.workspace-context-title { font-size:20px; font-weight:800; color:#0f172a; }
.workspace-context-subtitle { font-size:14px; color:#64748b; }
.tabs { display:flex; gap:8px; margin-bottom:16px; }
.workspace-subtabs { display:none; padding:10px 0 4px; border-bottom:1px solid #eef2f7; margin-bottom:18px; }
.workspace-subtabs.active { display:flex; }
.tab { border:1px solid #ddd; background:#f8fafc; padding:8px 14px; border-radius:999px; cursor:pointer; color:#334155; }
.tab.active { background:#222; color:#fff; border-color:#222; }
.subtabs { display:flex; gap:8px; margin:12px 0 16px; flex-wrap:wrap; }
.subtab { border:1px solid #ddd; background:#f7f7f7; padding:8px 14px; border-radius:8px; cursor:pointer; }
.subtab.active { background:#1f2937; color:#fff; }
.purchase-subtab-panel { display:none; }
.purchase-subtab-panel.active { display:block; }
.tab-panel { display:none; }
.tab-panel.active { display:block; }
.grid { display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap:12px; }
label { display:flex; flex-direction:column; gap:6px; font-size:14px; }
label.full { grid-column: 1 / -1; }
.section-title { margin: 18px 0 10px; font-weight: 700; color:#111827; }
.preview-card { margin-top: 12px; background:#f8fafc; border:1px solid #dbeafe; border-radius:10px; padding:12px; display:grid; gap:8px; }
.hint { grid-column: 1 / -1; font-size: 14px; color:#555; background:#f3f4f6; border-radius:8px; padding:10px 12px; }
input, select { padding:10px; border:1px solid #ccc; border-radius:8px; }
.candidate-chip { margin: 4px 6px 0 0; padding: 6px 10px; border-radius: 999px; border: 1px solid #93c5fd; background: #eff6ff; color: #1d4ed8; cursor: pointer; }
.duplicate-list { display: grid; gap: 16px; margin-top: 16px; }
.duplicate-group { border: 1px solid #e5e7eb; border-radius: 12px; padding: 14px; background: #fafafa; }
.duplicate-title { font-weight: 700; margin-bottom: 10px; }
.duplicate-items { display: grid; gap: 8px; margin-bottom: 12px; }
.duplicate-item { display: flex; gap: 8px; align-items: flex-start; }
.deprecated-item { opacity: 0.65; }
.actions { display:flex; gap:12px; margin-top:16px; }
button { padding:10px 14px; border:none; border-radius:8px; background:#1f6feb; color:#fff; cursor:pointer; }
button[disabled] { background:#bbb; cursor:not-allowed; }
.secondary-btn { background:#e5e7eb; color:#111827; }
.danger-btn { background:#b91c1c; color:#fff; }
pre { background:#0f172a; color:#e2e8f0; padding:16px; border-radius:10px; overflow:auto; white-space:pre-wrap; }
.result-card { background:#f8fafc; border:1px solid #e5e7eb; border-radius:10px; padding:14px; margin-bottom:12px; }
.workbench-control-shell {
  display:grid;
  gap:14px;
}
.workbench-control-panel {
  position:sticky;
  top:0;
  z-index:5;
  background:#ffffff;
  border:1px solid #e5e7eb;
  border-radius:12px;
  padding:14px;
  box-shadow:0 8px 22px rgba(15,23,42,0.06);
}
.workbench-control-panel.compact-panel {
  padding:12px 14px;
}
.workbench-summary-bar {
  background:#eef6ff;
  border:1px solid #dbeafe;
}
.workbench-summary-card {
  background:#f8fbff;
}
.workbench-action-row {
  flex-wrap:wrap;
}
.workbench-scroll-panel {
  overflow:auto;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  border-radius:12px;
  background:#fbfdff;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.8), inset 0 0 0 1px rgba(219,234,254,0.55);
}
/* removed generic sticky overlay because it conflicts with sticky table headers */
.workbench-scroll-panel-md { max-height:420px; }
.workbench-scroll-panel-lg { max-height:560px; }
.workbench-scroll-panel-xl { max-height:640px; }
.workbench-scroll-panel-xxl { max-height:780px; }
.workbench-scroll-panel::-webkit-scrollbar { width:10px; height:10px; }
.workbench-scroll-panel::-webkit-scrollbar-thumb { background:#cbd5e1; border-radius:999px; border:2px solid #f8fafc; }
.workbench-scroll-panel::-webkit-scrollbar-track { background:#eef2f7; border-radius:999px; }
.global-toast { position:fixed; top:20px; right:20px; max-width:420px; z-index:2000; padding:12px 14px; border-radius:10px; box-shadow:0 12px 28px rgba(15,23,42,0.18); font-size:14px; line-height:1.45; background:#111827; color:#fff; border:1px solid rgba(255,255,255,0.08); }
.global-toast.toast-ok { background:#166534; }
.global-toast.toast-error { background:#991b1b; }
.global-toast.toast-info { background:#1f2937; }
.global-toast.hidden { display:none; }
.card-grid { display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:12px; }
.warn-box { margin-top:12px; padding:12px; border-radius:8px; background:#fff7ed; color:#9a3412; }
.ok-box { margin-top:12px; padding:12px; border-radius:8px; background:#ecfdf5; color:#166534; }
.error { color:#b91c1c; }
.error-box { margin-top:12px; padding:12px; border-radius:8px; background:#fef2f2; color:#991b1b; border:1px solid #fecaca; }
.order-cost-rows { display:grid; gap:12px; margin-top:16px; }
.order-cost-row { border:1px solid #e5e7eb; border-radius:12px; padding:12px; background:#fafafa; }
.order-cost-row-grid { display:grid; grid-template-columns: 1fr 2fr 1fr auto; gap:12px; align-items:end; }
.order-cost-row-result { margin-top:10px; font-size:14px; color:#374151; }
.order-cost-row-actions { display:flex; gap:8px; }
.drawer.hidden { display:none; }
.drawer { position:fixed; inset:0; z-index:1000; }
.drawer-backdrop { position:absolute; inset:0; background:rgba(15, 23, 42, 0.35); }
.drawer-panel { position:absolute; top:0; right:0; width:min(720px, 100%); height:100%; background:#fff; box-shadow:-8px 0 24px rgba(0,0,0,.15); display:flex; flex-direction:column; }
.drawer-header { display:flex; justify-content:space-between; align-items:flex-start; padding:16px; border-bottom:1px solid #e5e7eb; }
.drawer-body { padding:16px; overflow:auto; display:grid; gap:4px; }
.drawer-actions { position:sticky; bottom:0; background:#fff; padding-top:12px; }
.data-table { width:100%; border-collapse:separate; border-spacing:0; table-layout:auto; font-size:14px; }
.data-table th { position:sticky; top:0; background:#f8fafc; z-index:1; text-align:left; font-weight:700; color:#111827; padding:12px 10px; border-bottom:1px solid #dbe3ee; white-space:nowrap; }
.data-table td { padding:12px 10px; border-bottom:1px solid #eef2f7; vertical-align:top; line-height:1.45; }
.data-table tbody tr:nth-child(even) { background:#fafcff; }
.data-table tbody tr:hover { background:#f3f8ff; }
.data-table .col-sku { min-width:170px; font-family:Consolas, monospace; word-break:break-all; }
.data-table .col-sku.internal { min-width:92px; }
.data-table .col-product { min-width:220px; max-width:320px; }
.data-table .col-category { min-width:56px; }
.data-table .col-num { text-align:right; white-space:nowrap; }
.data-table .col-choice { min-width:92px; }
.data-table .col-status { min-width:180px; }
.data-table .emphasis { font-weight:700; color:#111827; }
#replenishment-recommendation #replenTableWrap { position:relative; padding:0; isolation:isolate; }
#replenishment-recommendation .workbench-control-shell { gap:10px; }
#replenishment-recommendation .workbench-control-panel { padding-bottom:10px; }
#replenishment-recommendation .workbench-summary-card { margin-bottom:8px; }
#replenishment-recommendation .hint { margin-bottom:10px; }
#replenishment-recommendation .actions.workbench-action-row { margin-top:12px; }
#replenishment-recommendation .data-table .col-product { min-width:260px; max-width:380px; }
#replenishment-recommendation .data-table .col-status { min-width:220px; }
#replenishment-recommendation .data-table .col-choice { min-width:108px; }
#replenishment-recommendation #replenTable th[data-sticky-col="recommended"],
#replenishment-recommendation #replenTable .sticky-replen-recommended {
  position: sticky;
  right: 260px;
  z-index: 2;
  min-width: 128px;
  width: 128px;
  background: #ffffff;
  box-shadow: -1px 0 0 #e5e7eb, -10px 0 18px rgba(15, 23, 42, 0.04);
}
#replenishment-recommendation #replenTable th[data-sticky-col="status"],
#replenishment-recommendation #replenTable .sticky-replen-status {
  position: sticky;
  right: 0;
  z-index: 3;
  min-width: 260px;
  width: 260px;
  background: #ffffff;
  box-shadow: -2px 0 0 #dbe3ee, -12px 0 20px rgba(15, 23, 42, 0.06);
}
#replenishment-recommendation #replenTable thead th[data-sticky-col] {
  background:#f8fafc;
}
#replenishment-recommendation #replenTable thead th {
  z-index:6;
}
#replenishment-recommendation #replenTable th[data-sticky-col="recommended"] {
  z-index:7;
}
#replenishment-recommendation #replenTable th[data-sticky-col="status"] {
  z-index:8;
}
#replenishment-recommendation #replenTable tbody tr:nth-child(even) .sticky-replen-col {
  background: #fafcff;
}
#replenishment-recommendation #replenTable tbody tr:nth-child(odd) .sticky-replen-col {
  background: #ffffff;
}
#replenishment-recommendation #replenTable tbody tr:hover .sticky-replen-col {
  background: #f3f8ff;
}
#replenishment-recommendation #replenTable td {
  background-clip: padding-box;
}
#replenishment-recommendation #replenTable .sticky-replen-recommended {
  text-align: left;
}
#replenishment-recommendation #replenTable .sticky-replen-recommended .emphasis,
#replenishment-recommendation #replenTable .sticky-replen-recommended .cell-subtext {
  text-align: left;
}
#replenishment-recommendation #replenTable .sticky-replen-recommended .cell-subtext button {
  margin-top: 6px;
}
.cell-subtext { margin-top:4px; font-size:12px; color:#6b7280; line-height:1.35; }
.badge { display:inline-flex; align-items:center; padding:3px 8px; border-radius:999px; font-size:12px; font-weight:700; }
.badge-error { background:#fee2e2; color:#b91c1c; }
.badge-warn { background:#fef3c7; color:#92400e; }
.badge-ok { background:#dcfce7; color:#166534; }
.badge-muted { background:#e5e7eb; color:#374151; }
.is-active-status { background:#1f2937; color:#fff; }
.inline-badge-row { display:flex; gap:8px; flex-wrap:wrap; margin-top:6px; }
.mini-badge { display:inline-flex; align-items:center; padding:2px 8px; border-radius:999px; font-size:12px; font-weight:700; }
.mini-badge-plan { background:#ede9fe; color:#5b21b6; }
.mini-badge-source { background:#e0f2fe; color:#075985; }
.plan-block { margin-top:8px; padding:10px 12px; border-radius:8px; background:#f5f3ff; color:#4c1d95; border:1px solid #ddd6fe; }
.plan-grid { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:6px 12px; margin-top:6px; }
.plan-note { margin-top:6px; color:#5b21b6; }
.pool-meta-grid { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:6px 12px; margin-top:8px; }
.pool-section-box { margin-top:8px; padding:10px 12px; border-radius:8px; border:1px solid #dbeafe; background:#f8fbff; }
.pool-section-box.system-box { border-color:#dbeafe; background:#f8fbff; }
.pool-section-box.plan-box { border-color:#ddd6fe; background:#f5f3ff; }
.pool-section-title { font-size:12px; font-weight:700; letter-spacing:.02em; text-transform:uppercase; color:#475569; }
.pool-inline-actions { display:flex; gap:8px; flex-wrap:wrap; }
@media (max-width: 800px) { .grid, .card-grid, .order-cost-row-grid { grid-template-columns: 1fr; } .tabs, .workspace-tabs { flex-wrap:wrap; } .data-table { font-size:13px; } .data-table th, .data-table td { padding:10px 8px; } .workbench-control-panel { position:static; padding:12px; } .workbench-scroll-panel-md, .workbench-scroll-panel-lg, .workbench-scroll-panel-xl, .workbench-scroll-panel-xxl { max-height:420px; } .workspace-context-bar { align-items:flex-start; flex-direction:column; } }