@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Thai:wght@400;500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap');

/* Files changed for multi-store product v2: services/api/db.js, services/api/api.js, apps/erp-web/app.js, apps/erp-web/style.css */
/* REXRA HQ minimal UI */

:root{
  --color-bg:#f6f7fb;
  --color-surface:#ffffff;
  --color-text:#0f172a;
  --color-muted:#64748b;
  --color-border:#e5e7eb;
  --color-primary:#2563eb;
  --color-primary-strong:#1d4ed8;
  --color-danger:#b91c1c;
  --color-danger-bg:#fef2f2;
  --color-success:#166534;
  --color-success-bg:#dcfce7;
  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-5:20px;
  --radius-sm:10px;
  --radius-md:12px;
  --radius-lg:16px;
  --shadow-sm:0 1px 2px rgba(0,0,0,.06);
  --shadow-md:0 10px 30px rgba(0,0,0,.12);
  --text-xs:12px;
  --text-sm:13px;
  --text-md:14px;
  --text-lg:16px;
  --text-xl:18px;
  --font-ui: "IBM Plex Sans Thai","Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial;
  --font-ui-display: "Space Grotesk","IBM Plex Sans Thai","Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial;

  --bg:var(--color-bg);
  --card:var(--color-surface);
  --text:var(--color-text);
  --muted:var(--color-muted);
  --line:var(--color-border);
  --primary:var(--color-primary);
  --primary2:var(--color-primary-strong);
  --shadow:var(--shadow-sm);
  --radius:var(--radius-lg);

  --z-base:1;
  --z-dropdown:900;
  --z-modal:1200;
  --z-toast:1400;
  --z-overlay-critical:1600;
}

*,*::before,*::after{ box-sizing:border-box; }
html,body{ max-width:100%; overflow-x:hidden; }


.hidden,
.is-hidden{
  display:none !important;
  pointer-events:none !important;
}

.container{ padding:16px; }
@media (max-width:480px){ .container{ padding:12px; } }
body{
  margin:0;
  font-family:var(--font-ui);
  background:var(--bg);
  color:var(--text);
  letter-spacing: .01em;
}
#app{ padding:16px; }


.ds-form-row{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:var(--space-3); margin-bottom:var(--space-3); }
.ds-table-empty{ padding:var(--space-4); color:var(--muted); text-align:center; }
.ds-table-pagination{ display:flex; justify-content:flex-end; align-items:center; color:var(--muted); font-size:var(--text-xs); padding-top:var(--space-2); }

.btn{ font-size:var(--text-sm); font-weight:600; transition:all .15s ease; }
.btn:disabled{ opacity:.55; cursor:not-allowed; }
.btn.ghost{ background:transparent; border-color:transparent; color:var(--text); }
.btn.ghost:hover{ background:#f8fafc; border-color:var(--line); }
.btn.loading{ position:relative; color:transparent !important; pointer-events:none; }
.btn.loading::after{ content:""; width:14px; height:14px; border-radius:999px; border:2px solid rgba(255,255,255,.5); border-top-color:#fff; position:absolute; left:50%; top:50%; margin:-7px 0 0 -7px; animation:spin .8s linear infinite; }

select.input, textarea.input{ font-family:var(--font-ui); }
textarea.input{ min-height:100px; resize:vertical; }


.badge,.status-badge{ border-radius:999px; }
.badge{ display:inline-flex; align-items:center; padding:3px 9px; border:1px solid transparent; font-size:12px; font-weight:600; }
.badge-info{ background:#e0e7ff; color:#1e3a8a; border-color:#c7d2fe; }
.badge-success{ background:var(--color-success-bg); color:var(--color-success); border-color:#bbf7d0; }
.badge-warn{ background:#fef3c7; color:#92400e; border-color:#fde68a; }
.badge-danger{ background:var(--color-danger-bg); color:var(--color-danger); border-color:#fecaca; }
a{ color:var(--primary); text-decoration:none; }
a:hover{ text-decoration:underline; }

.btn{
  border:1px solid var(--line);
  background:#fff;
  border-radius:12px;
  padding:10px 12px;
  cursor:pointer;
}
.btn:hover{ border-color:#cbd5e1; }
.btn.primary{ background:var(--primary); border-color:var(--primary); color:#fff; }
.btn.primary:hover{ background:var(--primary2); }
.btn.outline{ border-color:var(--primary); color:var(--primary); background:#fff; }
.btn.outline:hover{ background:#eef2ff; }
.btn.danger{ border-color:#fecaca; color:#b91c1c; background:#fff; }
.btn.danger:hover{ background:#fef2e2; border-color:#fca5a5; }
.pill{ display:inline-block; padding:2px 8px; border-radius:999px; font-size:11px; background:#fee2e2; color:#991b1b; border:1px solid #fecaca; }
.pill.ok{ background:#dcfce7; color:#166534; border:1px solid #bbf7d0; }
.warn-banner{
  background:#fff7ed;
  border:1px solid #fed7aa;
  color:#9a3412;
  padding:12px 14px;
  border-radius:12px;
}
.warn-banner ul{
  margin:8px 0 0 18px;
}
.warn-title{
  font-weight:800;
}
.limit-row{
  display:grid;
  grid-template-columns: 140px 1fr 140px;
  gap:10px;
  align-items:center;
  padding:6px 0;
  border-bottom:1px solid #f1f1f1;
}
.limit-row:last-child{ border-bottom:none; }
.limit-bar{
  height:10px;
  background:#eef2f7;
  border-radius:999px;
  overflow:hidden;
}
.limit-bar-fill{
  height:100%;
  background:linear-gradient(90deg,#2563eb,#60a5fa);
}
.limit-label{ font-weight:600; }
.limit-value{ text-align:right; font-variant-numeric: tabular-nums; }
tr.is-deleted{ opacity:0.55; }
.btn.small{ padding:8px 10px; border-radius:10px; font-size:13px; }
.btn.tiny{ padding:6px 8px; border-radius:10px; font-size:12px; }
.lang-wrap{ position:relative; display:inline-flex; justify-content:flex-end; align-items:center; }
.lang-btn{ min-width:46px; text-align:center; border-radius:999px; padding:5px 9px; font-size:11px; font-weight:700; letter-spacing:.04em; background:rgba(255,255,255,.68); border-color:rgba(148,163,184,.18); box-shadow:none; }
.lang-btn:hover{ border-color:rgba(148,163,184,.28); background:rgba(255,255,255,.88); }
.lang-menu{
  position:absolute;
  left:0;
  top:calc(100% + 8px);
  right:auto;
  border:1px solid rgba(148,163,184,.24);
  border-radius:16px;
  box-shadow:0 18px 36px rgba(15,23,42,.16);
  padding:8px;
  display:none;
  z-index:var(--z-dropdown);
  min-width:148px;
  background:rgba(255,255,255,.98);
  backdrop-filter:blur(12px);
}
.lang-menu.open{ display:block; }
.lang-item{
  width:100%;
  padding:8px 10px;
  border:none;
  background:transparent;
  text-align:left;
  cursor:pointer;
  border-radius:8px;
  font-size:13px;
}
.lang-item:hover,
.lang-item.active{ background:#eff6ff; color:#0f172a; }

.input{
  width:100%;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:12px;
  outline:none;
  background:#fff;
}
.input:focus{ border-color:var(--primary); box-shadow:0 0 0 3px rgba(37,99,235,.12); }
.lbl{ display:flex; flex-direction:column; gap:6px; font-size:12px; color:var(--muted); }

.hint{ color:var(--muted); font-size:13px; }
.mono{ font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; white-space:pre-wrap; }

.card{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  padding:14px;
  margin:12px 0;
}
.card-title{ font-weight:800; margin-bottom:10px; }
.row{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.grid2{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.grid3{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:10px; }
.form-section{ border-top:1px solid #e2e8f0; padding-top:8px; margin-top:4px; }
.form-section-title{ font-family:var(--font-ui-display); font-size:13px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:#0f172a; }
.form-section-hint{ color:var(--muted); font-size:12px; margin-top:2px; }
.form-field-wrap{ min-width:0; }
.rx-duration{ display:flex; align-items:center; gap:10px; }
.rx-duration__value{ width:50%; min-width:140px; flex:0 0 auto; }
.rx-duration__unit{ width:110px; flex:0 0 auto; }
.rx-duration__hint{ margin-top:4px; }
@media (max-width: 720px){
  .rx-duration__value{ width:100%; flex:1 1 auto; }
  .rx-duration__unit{ width:120px; }
}

/* 3-column layout used by Level 1 and Level 2+ cards */
.level-grid{
  display:grid;
  /* keep 3 columns like Level 1 (left | middle | photo)
     use minmax so the middle column can shrink without forcing the right photo column to drop */
  grid-template-columns: minmax(240px, 280px) minmax(0, 1fr) minmax(280px, 340px);
  gap:16px;
  align-items:start;
}

/* Photo column: keep URL input and preview stacked (used by Level 1 and tiers) */
.photo-col{
  display:flex;
  flex-direction:column;
  gap:10px;
  min-width:0;
}

.auth-wrap{
  min-height:calc(100svh - 32px);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px 16px 28px;
  overflow-y:auto;
  background:#fff;
}
.auth-wrap.rx-auth-wrap{ min-height:100svh; background:transparent; z-index:1; padding-block:clamp(18px,3.5vh,30px) 28px; overflow-x:hidden; }
.auth-card{ width:100%; max-width:440px; margin:auto; }
.auth-card.rx-auth-card{ border-radius:20px; border:1px solid rgba(219,224,239,.92); background:rgba(255,255,255,.98); box-shadow:0 18px 40px rgba(15,23,42,.12); padding:22px; }
.auth-card.auth-card-register{ max-width:min(440px, 100%); overflow-x:hidden; }
.auth-card-login{
  max-width:min(440px, 100%);
}
.auth-topbar{ display:flex; justify-content:flex-end; align-items:flex-start; margin-bottom:8px; min-height:32px; }
.auth-logo{ display:flex; justify-content:center; margin:2px 0 6px; }
.auth-logo img{ width:132px; height:auto; }
.auth-title{ font-size:26px; font-weight:900; letter-spacing:.2px; text-align:center; line-height:1.12; }
.auth-sub{ color:var(--muted); margin-top:4px; margin-bottom:10px; line-height:1.4; }
.auth-form{ display:flex; flex-direction:column; gap:10px; margin-top:8px; width:100%; }
.auth-form > *{ min-width:0; }
.auth-input{
  padding:16px 18px;
  border-radius:999px;
  font-size:16px;
}
.auth-input.rx-auth-input{ padding:12px 16px; }
.auth-pass-wrap{ position:relative; width:100%; max-width:100%; min-width:0; }
.auth-pass-input{ padding-right:84px; }
.auth-pass-toggle{
  position:absolute;
  right:14px;
  top:50%;
  transform:translateY(-50%);
  border:none;
  background:transparent;
  color:#6b7280;
  cursor:pointer;
  font-size:18px;
  line-height:1;
  padding:4px;
}
.auth-pass-toggle:active{ color:#111827; }
.auth-field-control{ position:relative; width:100%; max-width:100%; min-width:0; }
.auth-field-status-icon{
  position:absolute;
  right:16px;
  top:50%;
  transform:translateY(-50%);
  width:20px;
  height:20px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  font-size:12px;
  font-weight:800;
  color:#64748b;
  background:transparent;
  pointer-events:none;
  opacity:0;
  transition:opacity .15s ease, color .15s ease, background-color .15s ease;
}
.auth-field-status-icon[data-state="valid"],
.auth-field-status-icon[data-state="invalid"],
.auth-field-status-icon[data-state="validating"]{ opacity:1; }
.auth-field-status-icon--password{ right:48px; }
.auth-field-control.is-valid .auth-field-status-icon,
.input.is-valid + .auth-field-status-icon,
.auth-validation-text[data-state="valid"]{ color:var(--color-success); }
.auth-field-control.is-invalid .auth-field-status-icon,
.input.is-invalid + .auth-field-status-icon,
.auth-validation-text[data-state="invalid"]{ color:var(--color-danger); }
.auth-field-control.is-validating .auth-field-status-icon,
.auth-validation-text[data-state="validating"]{ color:var(--color-primary); }
.input.is-valid{ border-color:#16a34a; box-shadow:0 0 0 3px rgba(34,197,94,.12); }
.input.is-invalid{ border-color:#dc2626; box-shadow:0 0 0 3px rgba(239,68,68,.12); }
.input.is-validating{ border-color:var(--primary); box-shadow:0 0 0 3px rgba(37,99,235,.12); }
.auth-validation-field{ min-width:0; }
.auth-validation-text{
  min-height:18px;
  margin-top:6px;
  font-size:12px;
  line-height:1.4;
  color:#64748b;
  word-break:break-word;
  overflow-wrap:anywhere;
}
.auth-primary{
  width:100%;
  border-radius:999px;
  padding:14px 18px;
  font-size:18px;
  font-weight:700;
}
.btn.primary.auth-primary{
  background:linear-gradient(135deg, #2563eb 0%, #22d3ee 100%) !important;
  border-color:rgba(37,99,235,.42) !important;
  color:#fff !important;
  box-shadow:0 8px 16px rgba(15,23,42,.06);
}
.btn.primary.auth-primary:hover{
  background:linear-gradient(135deg, #2563eb 0%, #22d3ee 100%) !important;
  border-color:rgba(37,99,235,.42) !important;
  color:#fff !important;
  box-shadow:0 14px 26px rgba(15,23,42,.10);
  filter:brightness(1.02);
}
.auth-primary.rx-auth-btn{ padding:12px 16px; font-size:16px; }
.auth-actions{ display:flex; flex-direction:column; gap:12px; width:100%; }
.auth-msg{ min-height:20px; }
.auth-secondary{
  width:100%;
  border-radius:999px;
  padding:12px 18px;
  border:1px solid var(--primary);
  color:var(--primary);
  background:#fff;
  font-weight:700;
}
.btn.outline:hover{ background:#eef2ff; }
.auth-label{ display:flex; flex-direction:column; gap:6px; margin:2px 0 0 2px; font-size:12px; color:var(--muted); font-weight:600; }
.link-btn{
  border:none;
  background:transparent;
  color:#6b7280;
  font-size:14px;
  cursor:pointer;
  padding:0;
}
.link-btn:hover{ text-decoration:underline; color:#374151; }

.shell{ min-height: calc(100vh - 32px); }
.topbar{
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
  box-shadow:var(--shadow);
  padding:12px 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.brand-row{ display:flex; align-items:center; gap:10px; }
.icon-btn{
  border:1px solid var(--line);
  background:#fff;
  border-radius:12px;
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  cursor:pointer;
  font-size:18px;
}
.icon-btn:hover{ border-color:#cbd5e1; }
.brand{ font-weight:900; font-size:18px; letter-spacing:.3px; display:flex; align-items:center; }
.rexra-brand{ display:flex; align-items:center; gap:10px; }
.rexra-lockup{ display:flex; align-items:flex-start; gap:10px; }
.rexra-lockup-mark{ width:40px; height:40px; display:flex; align-items:center; justify-content:center; transform: translateY(8px); }
.rexra-lockup-mark svg{ display:block; max-height:40px; }
.rexra-lockup-text{ display:flex; flex-direction:column; line-height:1; }
.rexra-lockup-wordmark{ font-weight:800; letter-spacing:2px; color:#1A2942; font-size:16px; line-height:1; }
.rexra-lockup-wordmark .x{ color:#3498DB; }
.brand-wordmark{ font-weight:800; letter-spacing:2px; color:#1A2942; font-size:16px; line-height:1; }
.brand-wordmark .x{ color:#3498DB; }
.brand-tagline-wrap{ display:inline-block; transform-origin:left top; }
.brand-tagline,
.rexra-lockup-tagline{ font-size:11px; letter-spacing:0.18em; text-transform:uppercase; color:#6b7280; margin-top:2px; font-weight:700; white-space:nowrap; }
.rexra-word{ font-weight:800; letter-spacing:2px; color:#1A2942; line-height:1; display:inline-flex; align-items:center; }
.rexra-word .x{ color:#3498DB; }
.rexra-mark svg{ display:block; }
.chip{
  background:#f1f5f9;
  border:1px solid #e2e8f0;
  padding:6px 10px;
  border-radius:999px;
  font-size:12px;
  color:#334155;
}

.main{ display:grid; grid-template-columns:260px 1fr; gap:12px; margin-top:12px; }
.sidebar{
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
  box-shadow:var(--shadow);
  padding:10px;
  height: calc(100vh - 120px);
  overflow:auto;
}
.nav-title{
  font-size:12px;
  color:var(--muted);
  margin:8px 10px 6px;
  font-weight:700;
  letter-spacing:0.18em;
  text-transform:uppercase;
  opacity:.85;
  font-family:var(--font-ui-display);
}
.nav-search-row{ padding:0 8px 8px; }
.nav-search-input{ font-size:var(--text-sm); min-height:38px; }
.nav{
  width:100%;
  text-align:left;
  padding:10px 10px;
  border-radius:12px;
  border:1px solid transparent;
  background:transparent;
  cursor:pointer;
  color:#0f172a;
}
.nav:hover{ background:#f1f5f9; }
.nav.active{ background:#e0e7ff; border-color:#c7d2fe; }
.nav-section{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:10px 12px;
  margin-top:6px;

  font-family:var(--font-ui-display);
  font-size:15.5px;
  font-weight:800;
  letter-spacing:.10em;
  text-transform:uppercase;

  color:#0f172a;
  cursor:pointer;
  border-radius:10px;
}
.nav-section-left{ display:flex; align-items:center; gap:8px; min-width:0; }
.nav-section-icon{ width:20px; text-align:center; opacity:.85; font-size:14px; }
.nav-section:hover{ background:#f1f5f9; color:#1f2937; }
.nav-caret{ font-size:10px; opacity:.7; }
.nav-group{ padding-bottom:6px; }
.nav-group.collapsed{ display:none; }
.nav-item,
.nav-subitem{
  width:100%;
  text-align:left;
  padding:10px 12px;
  border-radius:10px;
  border:1px solid transparent;
  background:transparent;
  cursor:pointer;

  font-family:var(--font-ui-display);
  color:#0f172a;

  font-size:13.8px;
  font-weight:600;
  min-height:40px;
}
.nav-label-row{ display:flex; align-items:center; justify-content:space-between; gap:8px; width:100%; }
.nav-badge-soon{
  display:inline-flex;
  align-items:center;
  padding:1px 7px;
  border-radius:999px;
  border:1px solid #fde68a;
  background:#fffbeb;
  color:#92400e;
  font-size:10px;
  font-weight:700;
  letter-spacing:.02em;
  white-space:nowrap;
}
.nav-item:hover,
.nav-subitem:hover{ background:#f1f5f9; }
.nav-item.active,
.nav-subitem.active{ background:#e0e7ff; border-color:#c7d2fe; font-weight:700; }
.nav-item.active-parent{ color:#1d4ed8; font-weight:700; }

.nav-item.active,
.nav-subitem.active{
  position:relative;
}

.nav-item.active::before,
.nav-subitem.active::before{
  content:"";
  position:absolute;
  left:6px;
  top:10px;
  bottom:10px;
  width:3px;
  border-radius:999px;
  background:linear-gradient(180deg,#2563eb,#60a5fa);
}

.nav-children{
  margin-left:16px;
  padding-left:10px;
  border-left:1px dashed #e2e8f0;
}
.nav-children.collapsed{ display:none; }
.nav-subitem{
  font-family:var(--font-ui-display);
  font-size:13px;
  padding:8px 12px 8px 16px;
  color:#334155;
  font-weight:600;
  letter-spacing:.01em;
}
.nav-item-wrap{ margin-bottom:4px; }


.sdv2-filter-card{ padding:10px 12px; border:1px solid #dbe4f0; background:linear-gradient(180deg,#f8fbff,#ffffff); }
.rx-sticky-filters{
  position:sticky;
  top:88px;
  z-index:8;
  background:linear-gradient(180deg,#f8fbff,#ffffff);
  box-shadow:0 6px 20px rgba(15,23,42,.08);
}
.sdv2-filter-head{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:10px; padding-bottom:8px; border-bottom:1px solid #e6edf7; }
.sdv2-filter-title{ font-size:12px; text-transform:uppercase; letter-spacing:.08em; color:#475569; font-weight:700; }
/* Legacy — kept for backward compat */
.sdv2-filter-main-row{ display:flex; flex-direction:column; gap:10px; }
.sdv2-quick-row{ display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
.sdv2-chip{ border:1px solid #cbd5e1; background:#f8fafc; color:#334155; border-radius:999px; padding:5px 10px; font-size:12px; font-weight:700; cursor:pointer; transition:background .12s,border-color .12s; }
.sdv2-chip:hover{ background:#f1f5f9; border-color:#94a3b8; }
.sdv2-chip.active{ background:#dbeafe; border-color:#93c5fd; color:#1d4ed8; }
.sdv2-action-row{ display:flex; align-items:center; gap:8px; }
.sdv2-advanced-row{ margin-top:8px; padding-top:8px; border-top:1px dashed #dbe4f0; display:flex; gap:8px; flex-wrap:wrap; }
/* Filter redesign — 2-row layout */
.sdv3-f-row1{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; align-items:end; }
.sdv3-f-row2{ display:flex; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap; padding-top:8px; border-top:1px solid #f1f5f9; }
.sdv3-f-chips{ display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
.sdv3-f-actions{ display:flex; align-items:center; gap:8px; flex-shrink:0; }
.sdv3-f-compare{ height:32px; font-size:12px; min-width:128px; padding:0 8px; border:1px solid #cbd5e1; border-radius:6px; background:#fff; color:#334155; cursor:pointer; }
@media(max-width:900px){
  .sdv3-f-row1{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:540px){
  .sdv3-f-row1{ grid-template-columns:1fr 1fr; }
  .sdv3-f-row2{ flex-direction:column; align-items:flex-start; }
  .sdv3-f-actions{ width:100%; justify-content:flex-end; }
}
.sdv2-filter-pill{ background:#f1f5f9; border-color:#cbd5e1; }
.sdv2-kpi-caption{ display:flex; align-items:center; gap:6px; }
.sdv2-kpi-info{ cursor:help; opacity:.75; }
.sdv2-empty-block{ border:1px dashed #dbe4f0; border-radius:10px; padding:14px 12px; background:#f8fafc; text-align:center; }
.sdv2-empty-icon{ font-size:20px; color:#94a3b8; line-height:1; margin-bottom:6px; }
.sdv2-empty-title{ font-weight:700; color:#334155; margin-bottom:4px; }
.hint.muted{ color:#94a3b8; }
.sdv2-filter-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:10px; align-items:start; }
.sdv2-kpi-grid{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; }
.sdv2-kpi{ min-height:112px; background:linear-gradient(180deg,#ffffff,#f8fafc); border-color:#e2e8f0; }
.sdv2-kpi.gp{ border-color:#bfdbfe; background:linear-gradient(180deg,#eff6ff,#f8fafc); }
.sdv2-kpi-value{ font-size:24px; font-weight:800; line-height:1.2; margin:6px 0; letter-spacing:.01em; }
.sdv2-main-grid{ display:grid; grid-template-columns:1.85fr 1fr; gap:12px; }
.sdv2-rank-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.sdv2-chart-svg{ width:100%; height:260px; display:block; }
.sdv2-meter{ margin-top:4px; height:8px; border-radius:999px; background:#e2e8f0; overflow:hidden; }
.sdv2-meter>span{ display:block; height:100%; background:linear-gradient(90deg,#2563eb,#60a5fa); border-radius:999px; }
.sdv2-skeleton{ border-radius:10px; background:linear-gradient(90deg,#e2e8f0 25%,#f1f5f9 37%,#e2e8f0 63%); background-size:400% 100%; animation:sdv2Pulse 1.25s ease infinite; }
.sdv2-skeleton.h16{ height:16px; }
.sdv2-skeleton.h28{ height:28px; }
.sdv2-skeleton.h150{ height:150px; }
.sdv2-skeleton.h160{ height:160px; }
.sdv2-skeleton.h220{ height:220px; }
@keyframes sdv2Pulse{ 0%{ background-position:100% 0; } 100%{ background-position:0 0; } }

/* Sales Dashboard v3 — tab layout + enhanced KPIs */
.sdv3-tabs{ display:flex; gap:4px; border-bottom:2px solid #e2e8f0; }
.sdv3-tab-btn{ border:none; background:transparent; padding:8px 14px; font-size:13px; font-weight:600; color:#64748b; cursor:pointer; border-bottom:2px solid transparent; margin-bottom:-2px; border-radius:6px 6px 0 0; transition:color .15s,border-color .15s; }
.sdv3-tab-btn:hover{ color:#334155; background:#f8fafc; }
.sdv3-tab-btn.active{ color:#2563eb; border-bottom-color:#2563eb; background:transparent; }
.sdv3-kpi-grid{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.sdv3-kpi{ min-height:110px; background:linear-gradient(180deg,#ffffff,#f8fafc); border-color:#e2e8f0; padding:12px 14px; }
.sdv3-kpi.gp{ border-color:#bfdbfe; background:linear-gradient(180deg,#eff6ff,#f8fafc); }
.sdv3-kpi.danger{ border-color:#fecaca; background:linear-gradient(180deg,#fff7f7,#f8fafc); }
.sdv3-kpi-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:6px; }
.sdv3-kpi-label{ font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:#64748b; font-weight:700; flex:1; }
.sdv3-kpi-val{ font-size:22px; font-weight:800; line-height:1.2; margin:6px 0 4px; letter-spacing:.01em; color:#0f172a; }
.sdv3-kpi-foot{ display:flex; align-items:center; justify-content:space-between; gap:6px; min-height:20px; }
.sdv3-delta{ display:inline-flex; align-items:center; gap:2px; font-size:11px; font-weight:700; padding:2px 6px; border-radius:999px; white-space:nowrap; flex-shrink:0; }
.sdv3-delta.up{ background:#dcfce7; color:#166534; }
.sdv3-delta.down{ background:#fee2e2; color:#b91c1c; }
.sdv3-sparkline{ display:block; flex-shrink:0; }
.sdv3-main-grid-8-4{ display:grid; grid-template-columns:2fr 1fr; gap:12px; }
.sdv3-alert{ display:flex; gap:10px; align-items:flex-start; padding:8px 10px; border-radius:10px; border:1px solid; }
.sdv3-alert.ok{ background:#f0fdf4; border-color:#bbf7d0; }
.sdv3-alert.warn{ background:#fffbeb; border-color:#fde68a; }
.sdv3-alert.info{ background:#eff6ff; border-color:#bfdbfe; }
.sdv3-alert-icon{ font-size:14px; font-weight:800; line-height:1.4; flex-shrink:0; }
.sdv3-alert.ok .sdv3-alert-icon{ color:#16a34a; }
.sdv3-alert.warn .sdv3-alert-icon{ color:#d97706; }
.sdv3-alert.info .sdv3-alert-icon{ color:#2563eb; }
.sdv3-alert-body{ flex:1; font-size:12px; }
.sdv3-cmp-good{ color:#16a34a; font-weight:700; }
.sdv3-cmp-bad{ color:#dc2626; font-weight:700; }
.sdv3-section{ margin-top:12px; }
@media(max-width:900px){
  .sdv3-kpi-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .sdv3-main-grid-8-4{ grid-template-columns:1fr; }
  .sdv3-tabs{ overflow-x:auto; flex-wrap:nowrap; }
  .sdv3-tab-btn{ padding:8px 10px; font-size:12px; white-space:nowrap; }
}
@media(max-width:540px){
  .sdv3-kpi-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .sdv3-kpi-val{ font-size:18px; }
}

.sidebar-backdrop{
  position:fixed;
  inset:0;
  background:rgba(15,23,42,.35);
  opacity:0;
  pointer-events:none;
  display:none;
  transition:opacity .2s ease;
  z-index:calc(var(--z-dropdown) - 1);
}

.sidebar-collapsed .main{ grid-template-columns:0 1fr; gap:0; }
.sidebar-collapsed .sidebar{
  width:0;
  min-width:0;
  padding:0;
  border:0;
  box-shadow:none;
  overflow:hidden;
  transform: translateX(-100%);
  pointer-events:none;
}
.sidebar-collapsed .nav-title,
.sidebar-collapsed .nav-children{ display:none; }
.sidebar-collapsed .nav-search-row{ display:none; }
.sidebar-collapsed .nav-section{ justify-content:center; }
.sidebar-collapsed .nav-section .nav-section-left span:not(.nav-section-icon){ display:none; }
.sidebar-collapsed .nav-caret{ display:none; }
.sidebar-collapsed .nav-item,
.sidebar-collapsed .nav-subitem{
  font-size:0;
  padding:12px;
  min-height:40px;
}
.sidebar-collapsed .nav-label-row{ justify-content:center; }
.sidebar-collapsed .nav-badge-soon{ display:none; }
.sidebar-collapsed .nav-item::after,
.sidebar-collapsed .nav-subitem::after{
  content:"";
  display:none;
}

.role-layout{
  display:grid;
  grid-template-columns: 240px 1fr;
  gap:12px;
  margin-top:12px;
}
.role-list{
  border:1px solid var(--line);
  border-radius:14px;
  padding:8px;
  background:#fff;
}
.role-item{
  width:100%;
  text-align:left;
  padding:8px 10px;
  border-radius:10px;
  border:1px solid transparent;
  background:transparent;
  cursor:pointer;
  display:flex;
  justify-content:space-between;
  align-items:center;
}
.role-item span{ color:var(--muted); font-size:12px; }
.role-item.active{ background:#e0e7ff; border-color:#c7d2fe; }
.role-perms{
  border:1px solid var(--line);
  border-radius:14px;
  padding:12px;
  background:#fff;
}
.perm-group{ margin-bottom:12px; }
.perm-group-title{ font-weight:700; margin-bottom:6px; text-transform:uppercase; font-size:11px; color:#475569; }
.perm-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap:6px;
}
.perm-item{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:13px;
  padding:6px 8px;
  border-radius:8px;
  border:1px solid #e2e8f0;
  background:#f8fafc;
}

.page{
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
  box-shadow:var(--shadow);
  padding:14px;
  min-height: calc(100vh - 120px);
  overflow:auto;
}

table{ width:100%; border-collapse:collapse; }
th,td{ padding:10px 8px; border-bottom:1px solid #eef2f7; font-size:13px; text-align:left; }
th{ color:#475569; font-size:12px; text-transform:uppercase; letter-spacing:.04em; }
.td-actions{ white-space:nowrap; }

.modal{
  position:fixed; inset:0;
  background:rgba(15,23,42,.42);
  display:none;
  align-items:center;
  justify-content:center;
  padding:16px;
  /* keep modal above sticky headers */
  z-index:var(--z-modal);
}
.modal-card{
  width:min(860px, 100%);
  background:#fff;
  border-radius:18px;
  border:1px solid var(--line);
  box-shadow:0 10px 30px rgba(0,0,0,.18);
  padding:14px;
  max-height: calc(100vh - 32px);
  overflow:auto;
}
.modal-title{ font-weight:900; font-size:16px; margin-bottom:10px; }
.modal-actions{ display:flex; justify-content:flex-end; gap:10px; margin-top:12px; }

.badge-ok{ display:inline-block; padding:4px 8px; border-radius:999px; background:#dcfce7; color:#166534; font-size:12px; border:1px solid #bbf7d0;}
.badge-warn{ display:inline-block; padding:4px 8px; border-radius:999px; background:#fef9c3; color:#854d0e; font-size:12px; border:1px solid #fde68a;}
.badge-err{ display:inline-block; padding:4px 8px; border-radius:999px; background:#fee2e2; color:#991b1b; font-size:12px; border:1px solid #fecaca;}

.status-badge{ display:inline-flex; align-items:center; padding:4px 10px; border-radius:999px; font-size:12px; font-weight:600; border:1px solid transparent; background:#e2e8f0; color:#1e293b; }
.status-badge.status-draft{ background:#e2e8f0; color:#1e293b; border-color:#cbd5e1; }
.status-badge.status-approved{ background:#fef9c3; color:#854d0e; border-color:#fde68a; }
.status-badge.status-posted{ background:#dcfce7; color:#166534; border-color:#bbf7d0; }
.status-badge.status-voided{ background:#fee2e2; color:#991b1b; border-color:#fecaca; }

.workflow-panel{ margin-top:16px; border:1px solid #e2e8f0; border-radius:12px; padding:12px; background:#f8fafc; }
.workflow-header{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; }
.workflow-status{ display:flex; align-items:center; gap:8px; }
.workflow-label{ font-size:12px; text-transform:uppercase; color:#64748b; letter-spacing:0.04em; }
.workflow-actions{ display:flex; gap:8px; flex-wrap:wrap; }
.workflow-audit-title{ font-weight:600; margin-bottom:8px; color:#0f172a; }
.workflow-audit-body{ display:flex; flex-direction:column; gap:8px; }
.audit-item{ border-left:2px solid #cbd5f5; padding-left:10px; }
.audit-meta{ display:flex; gap:8px; font-size:12px; color:#475569; }
.audit-detail{ display:flex; align-items:center; gap:6px; font-size:13px; color:#0f172a; }
.audit-note{ font-size:12px; color:#64748b; margin-top:4px; }

@media (max-width: 740px){
  .main{ grid-template-columns: 1fr; }
  .sidebar{ height:auto; }
  .grid2,.grid3{ grid-template-columns:1fr; }
  .level-grid{ grid-template-columns:1fr; }
  .role-layout{ grid-template-columns:1fr; }
}

@media (max-width: 900px){
  .main{ grid-template-columns:1fr; }
  .sidebar{
    position:fixed;
    left:12px;
    top:84px;
    width:min(260px, 78vw);
    height: calc(100vh - 110px);
    transform: translateX(-120%);
    transition: transform .2s ease;
    z-index:var(--z-modal);
  }
  .sidebar-open .sidebar{ transform: translateX(0); }
  .sidebar-open .sidebar-backdrop{
    opacity:1;
    pointer-events:auto;
  }
  .sidebar-collapsed .sidebar{
    width:min(260px, 78vw);
    padding:10px;
  }
  .sidebar-collapsed .nav-item,
  .sidebar-collapsed .nav-subitem{
    font-size:14px;
  }
  .sidebar-collapsed .nav-item::after,
  .sidebar-collapsed .nav-subitem::after{
    content:"";
  }
  .sidebar-collapsed .nav-title,
  .sidebar-collapsed .nav-search-row,
  .sidebar-collapsed .nav-children{ display:block; }
  .sidebar-collapsed .nav-section .nav-section-left span{ display:inline; }
}

/* Split layout for Product Management */
.split{
  display:grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap:12px;
}
.split .col{ min-width:0; }

/* Section details */
details.sec{
  border:1px solid #eee;
  border-radius:14px;
  padding:10px 12px;
  margin-top:10px;
  background:#fff;
}
details.sec > summary{
  cursor:pointer;
  font-weight:900;
  list-style:none;
}
details.sec > summary::-webkit-details-marker{ display:none; }
details.sec[open] > summary{ margin-bottom:10px; }

/* Mobile */
@media (max-width: 980px){
  .split{ grid-template-columns: 1fr; }
}
.refctl{display:flex;align-items:center;gap:8px;width:100%;min-width:0}
.refctl-select{flex:1 1 auto;width:100%;min-width:140px;max-width:100%;appearance:auto;-webkit-appearance:menulist;padding-right:28px}
.refctl-btn{flex:0 0 auto;white-space:nowrap;padding:8px 12px;border-radius:10px;min-height:36px;line-height:1.1}
.add-product-page .field-short.refctl-field{flex:0 0 280px;max-width:320px;min-width:240px}

/* Base Unit field must be wide but must not squeeze neighbors */
.add-product-page .field-short.baseunit-field{
  flex: 0 0 320px;
  max-width: 320px;
  min-width: 300px;
}
.add-product-page .field-short.baseunit-field .refctl{
  width: 100%;
  min-width: 0;
}
.add-product-page .field-short.baseunit-field .refctl-select{
  flex: 1 1 auto;
  min-width: 140px;
  width: 100%;
}
.add-product-page .field-short.baseunit-field .refctl-btn{
  flex: 0 0 auto;
  white-space: nowrap;
}


.field-error{color:#b00020;font-size:12px;margin:4px 0 0 0}
.is-invalid{border-color:#b00020 !important; outline:none}

/* ========== Busy overlay (blocks UI while saving/loading) ========== */
.busy-overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.25);
  display:flex;
  align-items:center;
  justify-content:center;
  pointer-events:auto;
  z-index:var(--z-overlay-critical);
}
.busy-overlay.hidden,
.busy-overlay.is-hidden{
  display:none !important;
  pointer-events:none !important;
}
.busy-box{
  background:#fff;
  border:1px solid rgba(0,0,0,.15);
  box-shadow:0 10px 40px rgba(0,0,0,.18);
  border-radius:14px;
  padding:14px 16px;
  min-width:240px;
  display:flex;
  gap:12px;
  align-items:center;
}
.busy-spinner{
  width:18px;
  height:18px;
  border-radius:999px;
  border:2px solid #ddd;
  border-top-color:#444;
  animation:spin 0.9s linear infinite;
}
.busy-msg{
  font-weight:800;
  color:#111;
}
@keyframes spin{to{transform:rotate(360deg)}}
/* ===== Purchasing page helpers ===== */
.label{ font-size:12px; color:var(--muted); margin-bottom:6px; }
.input.small{ padding:8px 10px; border-radius:10px; font-size:14px; }
.table-wrap{ overflow:auto; border:1px solid var(--line); border-radius:14px; }
.table-wrap.wide{ max-width:100%; }
.table-wrap table{ min-width:1100px; } /* allow horizontal scroll for many columns */
.table-wrap thead th{ position:sticky; top:0; background:#fff; z-index:2; }
.pr-guidance-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.pr-guide-item{border:1px solid #e2e8f0;border-radius:10px;padding:8px;background:#fff}
.pr-guide-item.tone-ok{border-color:#bbf7d0;background:#f0fdf4}
.pr-guide-item.tone-warn{border-color:#fde68a;background:#fffbeb}
.pr-guide-title{font-size:12px;font-weight:700;color:#334155}
.pr-guide-detail{margin-top:4px;font-size:12px;color:#0f172a;line-height:1.4}
.pr-ai-summary{display:grid;grid-template-columns:1fr;gap:4px;font-size:12px}
.pr-ai-mount{border:1px dashed #cbd5e1;border-radius:10px;padding:6px 8px;background:#f8fafc}
.pr-ai-next{font-size:12px;color:#0f172a;line-height:1.4}
.pr-ai-opline{margin-top:4px;font-size:12px;color:#0f172a;line-height:1.4}
.pr-lower-layout{display:grid;grid-template-columns:minmax(0,3fr) minmax(240px,1fr);gap:10px;align-items:start}
/* ─── PR Sticky Summary Bar ─── */
.pr-sticky-summary{position:sticky;bottom:0;z-index:4;display:flex;flex-wrap:nowrap;gap:0;padding:0;border:1px solid #dbeafe;border-radius:10px;background:rgba(239,246,255,.97);backdrop-filter:saturate(1.2) blur(4px);overflow:hidden}
.pr-sticky-item{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:12px;color:#1e293b;padding:7px 12px;flex:1 1 auto}
.pr-sticky-item + .pr-sticky-item{border-left:1px solid #bfdbfe}
.pr-sticky-grand{background:rgba(37,99,235,.06);font-weight:700}
.pr-sticky-grand b{color:#1d4ed8;font-size:14px}

/* ─── PR Items Table + Scroll Controls ─── */

/* Wrapper: top rounded border */
.pr-items-table-head-wrap{border:1px solid #e2e8f0;border-bottom:none;border-radius:10px 10px 0 0;background:#f8fafc}
.pr-items-table-head-wrap .table-wrap{margin:0;overflow-x:auto;overflow-y:hidden;scrollbar-width:none}
.pr-items-table-head-wrap .table-wrap::-webkit-scrollbar{display:none}

/* Scroll viewport (vertical) — custom scrollbar matching horizontal theme */
.pr-items-scroll-viewport{position:relative;max-height:clamp(240px,46vh,520px);overflow-y:auto;overflow-x:hidden;padding:0;border:1px solid #e2e8f0;border-top:none;border-radius:0;scrollbar-width:thin;scrollbar-color:#cbd5e1 #f1f5f9}
.pr-items-scroll-viewport::-webkit-scrollbar{width:6px}
.pr-items-scroll-viewport::-webkit-scrollbar-track{background:#f1f5f9;border-radius:999px}
.pr-items-scroll-viewport::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:999px;border:1px solid #e2e8f0}
.pr-items-scroll-viewport::-webkit-scrollbar-thumb:hover{background:#94a3b8}
.pr-items-scroll-viewport .table-wrap{margin:0;overflow-x:auto;overflow-y:visible;scrollbar-gutter:stable;scrollbar-width:none}
.pr-items-scroll-viewport .table-wrap::-webkit-scrollbar{height:0;display:none}

/* Table layout */
.pr-items-table{table-layout:fixed;border-collapse:separate;border-spacing:0}
.pr-items-table td{position:relative;z-index:1;background:#fff}
.pr-items-table th,.pr-items-table td{text-align:center;vertical-align:middle}
.pr-items-table th:first-child,.pr-items-table td:first-child{text-align:left}
.pr-items-table td.pr-cell-value{font-variant-numeric:tabular-nums;text-align:center}
.pr-items-table td.pr-cell-value b{display:block;text-align:center}

/* Sticky first column — strong shadow separator on scroll */
.pr-items-table .pr-sticky-col-cell{
  position:sticky!important;left:0;z-index:2!important;
  background:#fff!important;
  /* crisp right border + soft shadow to visually separate from scrolling content */
  box-shadow:2px 0 0 #e2e8f0, 4px 0 12px rgba(0,0,0,0.07);
  /* clip content strictly to cell — prevent overflow into adjacent columns */
  overflow:hidden;max-width:280px
}
/* Truncate long text inside sticky col */
.pr-items-table .pr-sticky-col-cell b{
  display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:260px
}
.pr-items-table .pr-sticky-col-cell .hint-line{
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:260px;font-size:11px;color:#6b7280
}

/* Sticky header column — same shadow treatment */
.pr-items-table-head thead th{position:sticky;top:0;z-index:3;background:#f8fafc;box-shadow:0 1px 0 #e2e8f0}
.pr-items-table-head thead th.pr-sticky-col-head{
  left:0;z-index:4!important;background:#f8fafc!important;
  box-shadow:2px 0 0 #cbd5e1, 4px 0 12px rgba(0,0,0,0.07), 0 1px 0 #cbd5e1
}

/* ─── Horizontal Scroll Controls — match vertical scrollbar theme ─── */
.pr-items-scroll-controls{display:flex;width:100%;align-items:center;margin-top:0;padding:0;border:none;background:transparent}
.pr-items-scroll-controls-inner{
  display:flex;align-items:center;gap:6px;width:100%;
  padding:5px 8px;
  /* Match the look of the viewport's vertical scrollbar track area */
  background:#f1f5f9;
  border:1px solid #e2e8f0;
  border-top:none;
  border-radius:0 0 10px 10px
}

/* Arrow buttons — small, rounded, subtle */
.pr-items-scroll-arrow{
  flex:0 0 22px;height:22px;
  display:inline-flex;align-items:center;justify-content:center;
  border:1px solid #d1d5db;border-radius:6px;
  background:#fff;color:#64748b;
  font-size:10px;line-height:1;cursor:pointer;padding:0;
  transition:background .15s,color .15s,border-color .15s
}
.pr-items-scroll-arrow:hover{background:#e2e8f0;color:#334155;border-color:#94a3b8}
.pr-items-scroll-arrow:disabled{opacity:.35;cursor:not-allowed;background:#f8fafc}

/* Range slider track+thumb — match vertical scrollbar thumb/track */
.pr-items-scroll-compact{flex:1;min-width:0;padding:0;background:transparent;display:flex;align-items:center}
.pr-items-scroll-range{
  -webkit-appearance:none;appearance:none;
  width:100%;height:12px;background:transparent;cursor:ew-resize;
  padding:0;margin:0
}
/* Track: same color as vertical scrollbar track */
.pr-items-scroll-range::-webkit-slider-runnable-track{
  height:6px;border-radius:999px;
  background:#e2e8f0
}
/* Thumb: same color + proportion as vertical scrollbar thumb */
.pr-items-scroll-range::-webkit-slider-thumb{
  -webkit-appearance:none;appearance:none;
  width:44px;height:6px;
  border:none;border-radius:999px;
  background:#cbd5e1;
  box-shadow:0 0 0 1px #b0bac5;
  margin-top:0;
  transition:background .15s
}
.pr-items-scroll-range:hover::-webkit-slider-thumb{background:#94a3b8;box-shadow:0 0 0 1px #7d8fa3}
.pr-items-scroll-range::-moz-range-track{height:6px;border-radius:999px;background:#e2e8f0}
.pr-items-scroll-range::-moz-range-thumb{
  width:44px;height:6px;
  border:none;border-radius:999px;
  background:#cbd5e1;box-shadow:0 0 0 1px #b0bac5
}
.pr-items-scroll-range:disabled{opacity:.3;cursor:default}

/* ─── PR Items Workarea + Assist Panel ─── */
.pr-items-workarea{margin-top:8px;display:grid;grid-template-columns:minmax(0,3fr) minmax(230px,1fr);gap:10px;align-items:start}
.pr-items-workarea.has-assist{grid-template-columns:minmax(0,3fr) minmax(230px,1fr)}
.pr-items-workarea.assist-collapsed{grid-template-columns:minmax(0,1fr)}
.pr-items-workarea.assist-collapsed .pr-modal-assist-side{display:none}
.pr-items-main-pane{min-width:0}
.pr-modal-assist-side{padding:8px;border:1px solid #e2e8f0;border-radius:10px;background:#f8fafc;position:sticky;top:0;max-height:min(56vh,460px);overflow:auto}
.pr-modal-context-pane .card-title{letter-spacing:.02em;text-transform:uppercase}

/* ─── PR Item Row States ─── */
#pr_items_rows tr.pr-item-row{transition:background-color .16s ease,box-shadow .16s ease}
#pr_items_rows tr.pr-item-row:hover td{background:#f8fbff}
#pr_items_rows tr.pr-item-row:hover .pr-sticky-col-cell{background:#f8fbff!important}
#pr_items_rows tr.pr-item-row.is-selected{box-shadow:inset 3px 0 0 #2563eb,inset 0 0 0 1px #93c5fd}
#pr_items_rows tr.pr-item-row.is-selected td{background:#eaf2ff}
#pr_items_rows tr.pr-item-row.is-selected .pr-sticky-col-cell{background:#dbeafe!important;box-shadow:inset 3px 0 0 #2563eb,4px 0 12px rgba(0,0,0,0.07)}
#pr_items_rows tr.pr-item-row.is-selected td b{color:#0f172a}
.pr-items-total-summary{border:1px solid #e2e8f0;border-radius:10px;background:#fff;padding:8px}
.pr-items-total-row{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:5px 0;font-size:12px;color:#0f172a}
.pr-items-total-row + .pr-items-total-row{border-top:1px dashed #e2e8f0}
.pr-items-total-grand{font-weight:700}
.pr-mobile-label{display:none;font-size:11px;color:#64748b;margin-bottom:4px;text-transform:uppercase;letter-spacing:.02em}
.purch-stage-groups{display:flex;gap:10px;flex-wrap:wrap;min-width:0}
.purch-stage-group{border:1px solid var(--line);border-radius:12px;padding:8px 10px;background:#fff;min-width:0}
.purch-stage-title{font-size:11px;font-weight:700;letter-spacing:.02em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.purch-stage-actions{display:flex;gap:6px;flex-wrap:wrap}
.pr-refs-warning{margin-bottom:10px;border:1px solid #fde68a;background:#fffbeb}
.pr-draft-left-card{min-height:320px}
.pr-draft-filters{padding-bottom:8px;border-bottom:1px solid #f1f5f9}
.pr-draft-list{margin-top:8px}
.pr-draft-row{transition:box-shadow .15s ease,border-color .15s ease}
.pr-draft-row:hover{border-color:#bfdbfe}
.pr-qty-control{align-items:center;justify-content:flex-end;flex-wrap:nowrap;min-width:148px}
.pr-items-table td:not(:first-child) .pr-qty-control{justify-content:center}
.pr-items-table td:not(:first-child) input.input.small,
.pr-items-table td:not(:first-child) select.input.small{margin-left:auto;margin-right:auto}
.pr-items-table td:not(:first-child) .pr-qty-control input.input.small{margin-left:0;margin-right:0}
.pr-qty-control .input.small{min-width:72px}
.pr-qty-stack,.bxgy-qty-stack{display:flex;flex-direction:column;gap:4px;flex:0 0 auto}
.pr-qty-stack .btn.tiny,.bxgy-qty-stack .btn.tiny{min-width:28px;line-height:1;padding:2px 6px}
.pr-qty-step-btn{border-color:#cbd5e1;background:#fff;color:#0f172a;font-weight:700}
.pr-qty-step-btn:hover{background:#f8fafc;border-color:#94a3b8}
.bxgy-qty-control{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:nowrap;min-width:148px}
.bxgy-qty-control .input.small{min-width:68px}
.bxgy-chooser-list{max-height:min(42vh,360px);overflow:auto}
.bxgy-chooser-list .bxgy-unit-cell,
.bxgy-chooser-list .bxgy-qty-cell{text-align:center}
.bxgy-chooser-list .bxgy-qty-cell .bxgy-qty-control{justify-content:center}
.pr-modal-actionbar{position:sticky;bottom:0;z-index:4;display:flex;justify-content:flex-end;gap:8px;padding:10px 0;margin-top:10px;background:linear-gradient(180deg,rgba(255,255,255,0),#fff 20%)}
.pr-gift-rows{display:flex;flex-direction:column;gap:8px;max-height:min(38vh,320px);overflow:auto;padding-right:2px}
.pr-gift-row{display:grid;grid-template-columns:minmax(220px,2fr) minmax(86px,.8fr) minmax(74px,.7fr) minmax(96px,.8fr) minmax(96px,.8fr) minmax(96px,.8fr) minmax(96px,.8fr) minmax(240px,1.6fr) minmax(280px,2fr);gap:8px;border:1px dashed #e2e8f0;border-radius:10px;padding:8px;background:#fff}
.pr-gift-row.pr-gift-row-header{border-style:solid;background:#f8fafc;font-size:12px;font-weight:700;color:#334155}
.pr-gift-col .input.small{width:100%}
.pr-gift-col-product{min-width:0}
.pr-gift-col-allocation .input.small{min-width:240px}
.pr-gift-col-note{min-width:0}
.pr-detail-line-wrap{position:relative;overflow:auto}
.pr-detail-line-table{border-collapse:separate;border-spacing:0}
.pr-detail-line-table thead th{position:relative;z-index:4;background:#f8fafc;will-change:transform;backface-visibility:hidden}
.pr-detail-line-table .pr-detail-sticky-col{position:relative;background:#fff;box-shadow:1px 0 0 #cbd5e1;will-change:transform;backface-visibility:hidden}
.pr-detail-line-table thead .pr-detail-sticky-col{z-index:7;background:#f8fafc}
.pr-detail-line-table tbody .pr-detail-sticky-col{z-index:6}
.purch-pr-modal-wrap{position:fixed;inset:0;z-index:1200;display:flex;align-items:center;justify-content:center;padding:12px}
.purch-pr-modal-backdrop{position:absolute;inset:0;background:rgba(15,23,42,.45)}
.purch-pr-modal-dialog{position:relative;background:#fff;border:1px solid #e5e7eb;border-radius:14px;box-shadow:0 24px 70px rgba(15,23,42,.35);width:min(1200px,96vw);max-height:92vh;display:flex;flex-direction:column;overflow:hidden}
.purch-pr-modal-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px;border-bottom:1px solid #eef2f7}
.purch-pr-modal-body{padding:12px;overflow:auto}
.purch-mobile-detail-wrap{position:fixed;inset:0;z-index:1190;display:flex;align-items:center;justify-content:center;padding:10px}
.purch-mobile-detail-backdrop{position:absolute;inset:0;background:rgba(15,23,42,.45)}
.purch-mobile-detail-dialog{position:relative;background:#fff;border:1px solid #e5e7eb;border-radius:12px;box-shadow:0 16px 50px rgba(15,23,42,.32);width:min(900px,96vw);max-height:92vh;display:flex;flex-direction:column;overflow:hidden}
.purch-mobile-detail-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px;border-bottom:1px solid #eef2f7}
.purch-mobile-detail-body{padding:12px;overflow:auto}
.purch-mobile-detail-body table{display:block;overflow:auto;max-width:100%}
@media (max-width: 760px){
  .purch-stage-row{display:block}
  .purch-stage-groups{display:grid;grid-template-columns:1fr;gap:8px}
  .purch-stage-actions{overflow:auto;flex-wrap:nowrap;padding-bottom:2px}
  .pr-draft-left-card{min-height:unset}
  .purch-pr-modal-wrap{padding:6px}
  .purch-pr-modal-dialog{width:100%;max-height:96vh;border-radius:12px}
  .purch-pr-modal-body{padding:10px}
  .purch-mobile-detail-wrap{padding:6px}
  .purch-mobile-detail-dialog{width:100%;max-height:96vh;border-radius:12px}
  .purch-mobile-detail-body{padding:10px}
  .pr-guidance-grid,.pr-ai-summary{grid-template-columns:1fr}
  .pr-lower-layout{grid-template-columns:1fr;gap:8px}
  .pr-sticky-summary{grid-template-columns:1fr 1fr;position:sticky;bottom:0}
  .pr-sticky-grand{border-left:none;padding-left:0}
  .pr-items-workarea{grid-template-columns:1fr}
  .pr-modal-assist-side{position:static}
  .pr-items-table-head-wrap{display:none}
  .pr-items-scroll-viewport{border-top:1px solid #e2e8f0;border-radius:10px 10px 0 0}
  .pr-items-scroll-viewport{max-height:clamp(240px, 44vh, 460px)}
  .pr-items-scroll-controls{justify-content:stretch}
  .pr-items-scroll-controls-inner{width:100%}
  .pr-items-total-summary{padding:6px 8px}
  .pr-mobile-label{display:block}
  .pr-items-table thead{display:none}
  .pr-items-table,.pr-items-table tbody,.pr-items-table tr,.pr-items-table td{display:block;width:100%}
  .pr-items-table tr.pr-item-row{border:1px solid #e2e8f0;border-radius:12px;padding:10px;margin-bottom:10px;background:#fff}
  .pr-items-table tr.pr-item-row td{padding:0 0 8px 0;border:none}
  .pr-items-table tr.pr-item-row td:last-child{padding-bottom:0}
  .pr-items-table tfoot{display:block;border-top:1px solid #e2e8f0;padding-top:8px}
  .pr-items-table tfoot tr{display:grid;grid-template-columns:1fr auto;gap:8px;padding:4px 0}
  .pr-items-table tfoot td{border:none;padding:0!important}
  .pr-items-table tr.pr-item-row input.input.small,
  .pr-items-table tr.pr-item-row select.input.small{width:100%!important}
  .pr-qty-control{justify-content:flex-start}
  .pr-qty-control .input.small{width:80px!important;max-width:80px}
  .pr-qty-stack,.bxgy-qty-stack{gap:3px}
  .bxgy-qty-control{justify-content:center;min-width:136px}
  .pr-gift-row{grid-template-columns:1fr}
  .pr-modal-actionbar{padding:8px 0}
}

#pr_items_rows tr.row-promo-updated{
  animation: promoRowPulse 1s ease-out;
}

@keyframes promoRowPulse{
  0%{ background: rgba(16,185,129,0.28); }
  100%{ background: transparent; }
}


/* Product V2 store tabs */
.prod-v2-card{ border:1px solid #e5e7eb; }
.prod-v2-store-picker{ display:flex; gap:8px; flex-wrap:wrap; max-height:120px; overflow:auto; padding:6px; border:1px solid #eee; border-radius:8px; }
.prod-v2-tabs{ display:flex; gap:6px; flex-wrap:wrap; }
.prod-v2-errors{ margin-top:8px; border:1px solid #fecaca; background:#fef2f2; color:#991b1b; padding:8px; border-radius:8px; }
.prod-v2-warnings{ margin-top:8px; border:1px solid #fde68a; background:#fffbeb; color:#92400e; padding:8px; border-radius:8px; }


.prod-v2-layout{ width:100%; max-width:100%; margin:0; padding:12px; box-sizing:border-box; }
.prod-v2-card .tab-panel{ margin-top: 10px; padding: 10px; border:1px solid #eee; border-radius:10px; }
.prod-v2-card details > summary{ cursor:pointer; margin: 6px 0; }

.prod-type-tabs{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-bottom:8px; }

/* ===== Variant / Unit card layout (Goods Add/Edit) ===== */
.variant-card{border:1px solid #e5e7eb;border-radius:14px;padding:12px;background:#fff;margin-top:10px}
.variant-header{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.variant-header-left{min-width:0}
.variant-title{font-weight:800;font-size:16px}
.variant-id-pill{display:inline-block;margin-left:8px;padding:2px 8px;border-radius:999px;background:#f3f4f6;border:1px solid #e5e7eb;font-size:12px;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;color:#4b5563;vertical-align:middle}
.variant-subtitle{font-size:12px;color:#6b7280;margin-top:2px}
.variant-header-right{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.chk-active{display:flex;align-items:center;gap:6px;font-size:12px;color:#374151}
.variant-body-grid{display:flex;flex-wrap:nowrap;gap:16px;margin-top:10px;align-items:flex-start;width:100%;max-width:100%;box-sizing:border-box;overflow-x:hidden}
.variant-left{flex:1 1 auto;min-width:0;max-width:100%}
.variant-right{flex:0 0 340px;min-width:340px;max-width:340px}
.variant-left .block{margin-bottom:16px}
.block-title{font-size:12px;font-weight:700;color:#374151;margin-bottom:6px}
.grid-row{display:grid;gap:12px;margin-top:8px}
.grid-1{grid-template-columns:1fr}
.grid-2{grid-template-columns:1fr 1fr}
.grid-4{grid-template-columns:repeat(4,1fr)}
.row-nowrap,.row-nowrap-scroll{display:flex;flex-wrap:nowrap;gap:12px;overflow-x:auto;max-width:100%;min-width:0;padding-bottom:6px;margin-top:8px}
.row-nowrap > .lbl{min-width:170px;flex:0 0 190px}
.variant-top-row > .lbl,.variant-mid-row > .lbl,.unit-top-row > .lbl{min-width:190px;flex-basis:220px}
.unit-sub-row > .lbl:last-child{min-width:260px;flex:1 0 320px}
.variant-grid-wrap,.unit-grid-wrap{overflow:hidden}

.add-product-page .field-short{flex:0 0 150px;max-width:170px;min-width:140px}
.add-product-page .field-short .input,
.add-product-page .field-short input,
.add-product-page .field-short select{width:100%;min-width:0}
.add-product-page .field-wide{flex:1 1 320px;min-width:280px}
.pricing{margin-top:8px}
.media-card{border:1px solid #e5e7eb;border-radius:12px;padding:10px}
.media-preview{margin-top:8px;min-height:220px;border:1px solid #ececec;border-radius:10px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.media-gallery-main{margin-top:8px;min-height:280px;border:1px solid #ececec;border-radius:10px;display:flex;align-items:center;justify-content:center;overflow:hidden;background:#fafafa}
.media-thumbs-strip{margin-top:8px;display:flex;gap:8px;overflow-x:auto;flex-wrap:nowrap;padding-bottom:4px}
.media-thumb{width:64px;height:64px;border:1px solid #d1d5db;border-radius:10px;background:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;flex:0 0 auto;padding:0;overflow:hidden}
.media-thumb img{width:100%;height:100%;object-fit:cover}
.media-thumb.active{border-color:#2563eb;box-shadow:0 0 0 1px #2563eb inset}
.media-thumb.add{font-size:28px;color:#6b7280;background:#f9fafb}

.add-product-page .compact-toprow > .lbl{min-width:120px;flex:0 0 140px;max-width:160px}
.add-product-page .variant-top-row.compact-toprow > .lbl:nth-child(4){flex:0 0 200px;max-width:240px}
.price-row.nowrap-row{display:flex;flex-wrap:nowrap;gap:8px;align-items:center;overflow-x:visible;padding-bottom:4px;margin-top:6px}
.price-row.nowrap-row > *{flex:0 0 auto}
.price-row.nowrap-row select{width:160px;min-width:160px}
.price-row.nowrap-row input{width:140px;min-width:140px}
.bc-price-grid.compact-bc-grid{grid-template-columns:210px 1fr}
.bc-price-grid.compact-bc-grid .bc-col .input{max-width:180px}
.bc-price-grid.compact-bc-grid .unit-barcode-block{min-width:200px}
.media-thumb-item{display:flex;flex-direction:column;align-items:center;gap:2px;flex:0 0 auto}
.mainphoto-flag{display:flex;align-items:center;gap:4px;font-size:10px;color:#374151;user-select:none;line-height:1}
.mainphoto-flag input{width:12px;height:12px}
.mainphoto-hint{margin-top:6px;font-size:11px;color:#6b7280}

.add-product-page .goods-split-grid{display:grid;grid-template-columns:minmax(0, 1fr) minmax(260px, 320px);gap:14px;align-items:start;width:100%;max-width:100%;box-sizing:border-box}
.add-product-page .goods-split-grid.ratio-65-35{display:grid;grid-template-columns:minmax(0, 65fr) minmax(0, 35fr);gap:14px;align-items:start;width:100%;max-width:100%;box-sizing:border-box}
.add-product-page .goods-split-grid.no-wrap{display:flex;flex-wrap:nowrap;gap:14px;align-items:flex-start}
.add-product-page .goods-split-grid.no-wrap > .goods-left-col{flex:1 1 auto;min-width:0}
.add-product-page .goods-split-grid.no-wrap > .goods-right-col{flex:0 0 min(320px, 35%);min-width:260px;max-width:320px}
.add-product-page .goods-left-col{min-width:0;overflow:hidden}

.add-product-page .variant-form-wrap{width:100%;max-width:100%;box-sizing:border-box;border:1px solid #e5e7eb;border-radius:10px;padding:12px 14px;background:#fff}
.add-product-page .unit-form-wrap{width:100%;max-width:100%;min-width:0;box-sizing:border-box;border:1px solid #e5e7eb;border-radius:10px;padding:12px 14px;background:#fff}

.add-product-page .variant-media-wrap{width:30%;max-width:30%;box-sizing:border-box}
.add-product-page .goods-split-grid.no-wrap > .variant-media-wrap{flex:0 0 30%;max-width:30%;min-width:0}
.add-product-page .variant-media-wrap .media-gallery-main,
.add-product-page .variant-media-wrap .media-card{max-width:100%}
.add-product-page .unit-media-wrap{width:30%;max-width:30%;box-sizing:border-box}
.add-product-page .goods-split-grid.no-wrap > .unit-media-wrap{flex:0 0 30%;max-width:30%;min-width:0}
.add-product-page .unit-media-wrap .media-gallery-main,
.add-product-page .unit-media-wrap .media-card{max-width:100%}
.add-product-page .unit-variant-card .goods-split-grid.unit-row.no-wrap{display:flex !important;flex-wrap:nowrap !important;gap:14px;align-items:flex-start !important}
.add-product-page .unit-variant-card .goods-split-grid.unit-row.no-wrap > .goods-left-col{flex:0 1 70% !important;max-width:70% !important;min-width:0}
.add-product-page .unit-variant-card .goods-split-grid.unit-row.no-wrap > .unit-media-wrap{flex:0 0 auto !important;margin-left:auto;align-self:flex-start}
.unit-variant-card .goods-split-grid.unit-row.no-wrap{display:flex;flex-wrap:nowrap;gap:14px;align-items:flex-start}
.unit-variant-card .goods-split-grid.unit-row.no-wrap > .goods-left-col{flex:0 1 70%;min-width:0;max-width:70%}
.unit-variant-card .goods-split-grid.unit-row.no-wrap > .unit-media-wrap{flex:0 0 auto;margin-left:auto;align-self:flex-start}
.add-product-page .goods-right-col{min-width:0;align-self:start;position:relative;z-index:2}
.add-product-page .goods-right-col,
.add-product-page .goods-right-col .media-card,
.add-product-page .goods-right-col .media-gallery-main{max-width:100%}
.add-product-page .goods-left-col input,
.add-product-page .goods-left-col select{max-width:100%}
.add-product-page .goods-left-col .hint{max-width:100%}
.add-product-page .bc-price-scroll-wrap{max-width:100%;overflow-x:auto;overflow-y:hidden;padding-bottom:6px}
.add-product-page .bc-price-scroll-wrap .bc-price-grid{width:max-content;min-width:560px}
.add-product-page .goods-right-col .mainphoto-hint{position:relative;z-index:3;white-space:normal;overflow-wrap:anywhere}

.add-product-page .dim-grid{display:grid;grid-template-columns:repeat(4, minmax(0, 1fr));gap:12px}
.add-product-page .dim-grid .lbl{min-width:0}
.add-product-page .dim-grid input,
.add-product-page .dim-grid select{width:100%;min-width:0}
.units-section{margin-top:16px;border-top:1px solid #eef2f7;padding-top:12px}
.units-header{display:flex;align-items:center;justify-content:space-between;gap:8px}
.units-title{font-weight:700;font-size:13px}
.unit-cards{margin-top:8px}
.unit-card{border:1px solid #e5e7eb;border-radius:12px;padding:10px;margin-top:12px;background:#fff}
.unit-card-header{display:flex;justify-content:space-between;align-items:center;gap:8px}
.unit-card-title{font-weight:700}
.unit-card-actions{display:flex;gap:6px}
.unit-card-body{margin-top:8px}
.unit-barcode-block,.unit-pricing-block{margin-top:10px}

.bc-price-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;align-items:start}
.bc-col .input{max-width:260px}
.price-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px;align-items:center}
.price-row > .input{width:100%;min-width:0}
.price-row > .btn{justify-self:end}
.input.short{max-width:190px}
.mini-title{font-size:12px;font-weight:700;color:#374151;margin-bottom:6px}
.mini-title.pricing-title{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;flex-wrap:wrap}
.pricing-title-right{display:flex;gap:8px;align-items:flex-end;margin-left:auto}
.pricing-title-right .price-col-label{width:140px;min-width:140px;text-align:left;font-size:12px;color:#64748b}
.unit-more{margin-top:10px}
.btn-sm{padding:6px 10px;font-size:12px;line-height:1.2;border-radius:10px}
.btn-danger-outline{border:1px solid #ef4444;color:#ef4444;background:#fff}
.grid-3{grid-template-columns:160px 1fr 160px}
@media (max-width:1100px){
  .grid-3{grid-template-columns:1fr}
}


.unit-card{margin-top:10px}
.unit-card .card-grid{display:grid;grid-template-columns:minmax(0, 1fr) minmax(260px, 320px);gap:12px}
@media (max-width: 620px){
  .unit-card .card-grid{grid-template-columns:1fr}
}


.variant-stack{display:block}
.unit-cards-stack{margin-top:12px}
.unit-variant-card{margin-top:12px;margin-left:0;width:100%;max-width:100%;box-sizing:border-box}

@media (max-width: 1100px){
  .bc-price-grid{grid-template-columns:1fr}
}

@media (max-width: 860px){
  .variant-id-pill{display:block;margin-left:0;margin-top:6px;width:max-content}
}

/* Food Add/Edit */
.food-layout{display:flex;gap:14px;align-items:flex-start;flex-wrap:nowrap}
.food-main{flex:1;min-width:0}
.food-preview{width:340px;flex:0 0 340px}
.food-preview-card{border:1px solid #e5e7eb;border-radius:12px;padding:10px;background:#fff;position:sticky;top:12px}
.food-subtabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.food-subtab{border:1px solid #d1d5db;background:#fff;border-radius:999px;padding:6px 12px;cursor:pointer}
.food-subtab.active{background:#111827;color:#fff;border-color:#111827}
.food-panel{margin-top:0}
.food-v-card{border:1px solid #e5e7eb;border-radius:10px;padding:10px;margin-top:10px}
.food-mod-wrap{flex:1;min-width:0;width:100%;max-width:100%}
.food-mod-group{border:1px solid #e5e7eb;border-radius:10px;padding:8px;margin-top:8px;background:#fff}
.food-mod-wrap .food-mod-group{width:100%;max-width:100%}
.food-layout.food-layout-mod{display:flex;gap:14px;align-items:flex-start;flex-wrap:nowrap}
.food-layout.food-layout-mod .food-main{flex:1;min-width:0}
.food-layout.food-layout-mod .food-preview{flex:0 0 340px;width:340px;max-width:340px;position:sticky;top:12px}
@media (max-width: 900px){
  .food-layout{flex-direction:column}
  .food-layout.food-layout-mod{display:flex;flex-direction:row;flex-wrap:nowrap}
  .food-layout.food-layout-mod .food-main{flex:1;min-width:0}
  .food-layout.food-layout-mod .food-preview{flex:0 0 300px;width:300px}
  .food-preview{width:100%;flex:1}
  .food-preview-card{position:static}
  .food-mod-wrap{width:100%;max-width:100%}
  .food-mod-group{width:100%;max-width:100%}
}
@media (max-width: 760px){
  .food-layout.food-layout-mod{flex-direction:column}
  .food-layout.food-layout-mod .food-preview{width:100%;flex:1}
}


.food-right-panel .media-gallery-main{min-height:260px;margin-top:0}
.media-url-row{display:flex;gap:6px;align-items:center;margin-bottom:8px}
.media-url-row input{flex:1;min-width:0;max-width:220px}
.media-url-row .btn{flex:0 0 auto}
.food-right-panel .food-media-strip{margin-top:10px;display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;flex-wrap:nowrap}
.food-right-panel .food-media-thumb-wrap{position:relative;flex:0 0 auto}
.food-right-panel .food-media-thumb{width:82px;min-width:82px;height:82px;border:1px solid #d1d5db;border-radius:10px;background:#fff;padding:0;display:flex;align-items:center;justify-content:center;cursor:pointer;position:relative;overflow:hidden}
.food-right-panel .food-media-thumb img{width:100%;height:100%;object-fit:cover}
.food-right-panel .food-media-thumb .food-main-label{position:absolute;left:4px;right:4px;bottom:4px;font-size:10px;line-height:1.2;background:rgba(17,24,39,.85);color:#fff;border-radius:999px;padding:2px 6px;display:none;text-align:center}
.food-right-panel .food-media-thumb.is-main{border-color:#2563eb;box-shadow:0 0 0 1px #2563eb inset}
.food-right-panel .food-media-thumb.is-main .food-main-label{display:block}
.food-right-panel .food-thumb-remove{position:absolute;top:-6px;right:-6px;width:20px;height:20px;border:1px solid #d1d5db;border-radius:50%;background:#fff;color:#111827;cursor:pointer;line-height:1;padding:0}
.food-right-panel .food-media-thumb-add{font-size:30px;color:#6b7280;background:#f9fafb}

/* Service Add/Edit */
.service-layout{display:flex;gap:14px;align-items:flex-start}
.service-main{flex:1;min-width:0}
.service-preview{width:340px;flex:0 0 340px}
@media (max-width:1100px){
  .service-layout{flex-direction:column}
  .service-preview{width:100%;flex:1}
  .media-url-row input{max-width:none}
}


@media (max-width: 900px){
  .bc-price-grid.compact-bc-grid{grid-template-columns:1fr}
}


@media (max-width: 720px){
  .add-product-page .variant-form-wrap{width:100%;max-width:100%}
  .add-product-page .variant-media-wrap{width:100%;max-width:100%}
  .add-product-page .unit-form-wrap{width:100%;max-width:100%}
  .add-product-page .unit-media-wrap{width:100%;max-width:100%}
}

@media (max-width: 620px){
  .add-product-page .goods-split-grid{grid-template-columns:1fr}
}

@media (max-width: 620px){
  .add-product-page .goods-split-grid.no-wrap{display:grid;grid-template-columns:1fr}
}

@media (max-width: 620px){
  .add-product-page .unit-variant-card .goods-split-grid.no-wrap{display:flex !important;flex-wrap:nowrap !important;grid-template-columns:none !important}
}

@media (max-width: 620px){
  .add-product-page .goods-split-grid.ratio-65-35{grid-template-columns:1fr}
}

@media (max-width: 1100px){
  .add-product-page .dim-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.thumb-wrap{position:relative;width:64px;height:64px}
.thumb-wrap .media-thumb{width:64px;height:64px}
.thumb-del{position:absolute;top:-6px;right:-6px;width:18px;height:18px;border-radius:999px;border:1px solid #d1d5db;background:#fff;font-size:14px;line-height:16px;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:5}
.thumb-del:hover{border-color:#ef4444;color:#ef4444}

.save-error-summary{margin-top:8px;padding:8px 10px;border:1px solid #fecaca;background:#fef2f2;color:#991b1b;border-radius:8px;font-size:12px}
.save-error-summary ul{margin:6px 0 0 16px;padding:0}


/* Product management responsive */
.pm-toolbar-top,.pm-toolbar-filters,.pm-toolbar-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.pm-search-prominent{min-width:320px;flex:1}
.pm-status-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px;margin-bottom:10px}
.pm-status-chip{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 10px;border-radius:10px;border:1px solid #e2e8f0;background:#f8fafc;color:#334155;cursor:pointer}
.pm-status-chip.ok{background:#f0fdf4;border-color:#bbf7d0;color:#166534}
.pm-status-chip.warn{background:#fffbeb;border-color:#fde68a;color:#92400e}
.pm-status-chip.danger{background:#fef2f2;border-color:#fecaca;color:#991b1b}
.pm-status-chip.muted{background:#f8fafc;border-color:#cbd5e1;color:#64748b}
.pm-status-chip b{font-size:14px}
.pm-bulk-bar{display:inline-flex;gap:6px;flex-wrap:wrap;align-items:center;padding:6px 8px;border:1px solid #dbeafe;border-radius:10px;background:#f8fbff}
.pm-toolbar-filters .lbl{min-width:160px}
.pm-mobile-count{display:none}
.pm-card-list{display:grid;gap:10px}
.pm-card{border:1px solid var(--line2, var(--line)); border-radius:14px; padding:12px; background:#fff;}
.pm-card-head{display:flex;gap:10px;align-items:flex-start}
.pm-card-title{font-weight:700;font-size:16px;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pm-card-sub{color:#64748b;font-size:12px;margin-top:4px}
.pm-card-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}

body.mode-mobile-portrait .pm-toolbar-top,
body.mode-mobile-portrait .pm-toolbar-filters{flex-direction:column;align-items:stretch}
body.mode-mobile-portrait .pm-toolbar-filters .lbl{width:100%;min-width:0}
body.mode-mobile-portrait .pm-toolbar-filters .lbl .input,
body.mode-mobile-portrait .pm-toolbar-top .input{width:100%;min-width:0!important}
body.mode-mobile-portrait .pm-toolbar-filters .lbl{gap:4px}
body.mode-mobile-portrait .pm-toolbar-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
body.mode-mobile-portrait #pm_count{display:none}
body.mode-mobile-portrait .pm-mobile-count{display:block;margin-top:8px;color:var(--muted);font-size:12px}

.hq-reports-card .hq-bar-row{display:grid;grid-template-columns:140px 1fr 110px;gap:8px;align-items:center;margin:4px 0}
.hq-reports-card .hq-bar-wrap{background:#f0f3f7;border-radius:999px;height:8px;overflow:hidden}
.hq-reports-card .hq-bar{background:#3b82f6;height:100%}
.hq-reports-card .hq-bar-label,.hq-reports-card .hq-bar-value{font-size:12px}

:root{
  --bg: var(--rx-bg);
  --card: var(--rx-surface);
  --text: var(--rx-text);
  --muted: var(--rx-muted);
  --line: var(--rx-border);
  --primary: var(--rx-primary);
  --z-dropdown: var(--rx-z-dropdown);
  --z-modal: var(--rx-z-modal);
  --z-toast: var(--rx-z-toast);
}

.modal.hidden,
#hint_modal.hidden,
#busy_overlay.hidden,
#rx_modal:not(.is-open),
#rx_modal_backdrop:not(.is-open){
  pointer-events:none !important;
}

@media (max-width: 1100px){
  .sdv2-kpi-grid-compat{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .sdv2-kpi-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .sdv2-main-grid{ grid-template-columns:1fr; }
  .sdv2-rank-grid{ grid-template-columns:1fr; }
}

@media (max-width: 900px){
  .rx-sticky-filters{
    position:static;
    top:auto;
    z-index:auto;
    box-shadow:none;
  }
  .rx-sticky-preview-top8,
  .rx-sticky-preview-top84{
    position:static;
    top:auto;
  }
}

/* Product + Import polish (minimal high-tech) */
:root{
  --rxp-border:1px solid rgba(15,23,42,.10);
  --rxp-radius:12px;
  --rxp-shadow:0 8px 24px rgba(15,23,42,.06);
  --rxp-surface:#ffffff;
  --rxp-surface-2:#f8fbff;
  --rxp-text-muted:#64748b;
  --rxp-primary:var(--primary, #2563eb);
}
.rx-panel{background:var(--rxp-surface);border:var(--rxp-border);border-radius:var(--rxp-radius);box-shadow:var(--rxp-shadow);padding:12px}
.rx-sticky-preview-top8{position:sticky;top:8px}
.rx-sticky-preview-top84{position:sticky;top:84px}
.rx-segmented{display:inline-flex;gap:4px;padding:2px;border:var(--rxp-border);border-radius:999px;background:var(--rxp-surface-2)}
.rx-seg-btn{min-width:108px}
.rx-segmented .btn{border-radius:999px;box-shadow:none}
.rx-seg-btn.is-active{font-weight:700}
.rx-banner{border-radius:var(--rxp-radius);border:var(--rxp-border);padding:12px;box-shadow:var(--rxp-shadow)}
.rx-banner-info{background:#eff6ff;border-color:#93c5fd}
.rx-banner-success{background:#f0fdf4;border-color:#86efac}
.rx-banner-warn{background:#fff7ed;border-color:#fdba74}
.rx-kv{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;color:var(--rxp-text-muted)}
.rx-divider{height:1px;background:rgba(15,23,42,.08);margin:8px 0}

/* P1-5 minimal high-tech polish layer */
.rx-chip{font-size:12px;padding:2px 8px;border-radius:999px;border:var(--rxp-border,1px solid rgba(15,23,42,.10));background:var(--rxp-surface-2,#f8fbff);color:var(--rxp-text-muted,#64748b)}
.rx-chip-info{background:#eff6ff;border-color:#bfdbfe;color:#1e40af}
.rx-chip-success{background:#f0fdf4;border-color:#bbf7d0;color:#166534}
.rx-chip-warn{background:#fff7ed;border-color:#fed7aa;color:#9a3412}
.rx-chip-neutral{background:#f8fafc;border-color:#e2e8f0;color:#334155}
.rx-accent-top{position:relative;overflow:hidden}
.rx-accent-top::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,rgba(37,99,235,.55),rgba(125,211,252,.3),rgba(0,0,0,0))}
.rx-empty{border:var(--rxp-border,1px solid rgba(15,23,42,.10));border-radius:12px;padding:16px;text-align:center;background:var(--rxp-surface-2,#f8fbff)}
.rx-empty-icon{font-size:20px;line-height:1;margin-bottom:6px;opacity:.75}
.rx-empty-title{font-weight:700;margin-bottom:4px}
.rx-detail > .rx-detail-summary{list-style:none;display:flex;align-items:center;gap:8px}
.rx-detail > .rx-detail-summary::-webkit-details-marker{display:none}
.rx-detail > .rx-detail-summary::before{content:'▸';font-size:12px;color:#64748b;transition:transform .18s ease}
.rx-detail[open] > .rx-detail-summary::before{transform:rotate(90deg)}
.btn{transition:background-color .18s ease,border-color .18s ease,transform .08s ease}
.btn:hover{filter:brightness(.98)}
.btn:active{transform:translateY(.5px)}

/* Product Form V2 minimal+complete */
.prod-v2-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:12px;align-items:start}
.prod-v2-main{display:flex;flex-direction:column;gap:10px}
.prod-v2-sidebar{display:flex;flex-direction:column;gap:10px}
.prod-v2-sidebar .card{border-color:#e2e8f0;background:#fcfdff;box-shadow:0 1px 2px rgba(15,23,42,.02);padding:10px 11px}
.prod-v2-sidebar .card-title{font-size:13px;color:#334155}
.prod-v2-sidebar .hint{font-size:12px;color:#6b7280}
.prod-v2-quick-core{border:1px solid #dbeafe;background:#f8fbff}
.prod-v2-type-seg{display:flex;gap:6px;flex-wrap:wrap}
.prod-v2-draft-banner{padding:8px 10px;border:1px solid #fde68a;background:#fffbeb;border-radius:10px;font-size:13px}
.variant-card-summary{cursor:pointer}
.variant-card-summary .hint{margin-left:6px}
.variant-card-body{padding-top:2px}
.v2-editing-unit-bar{position:sticky;top:8px;z-index:2}
.pf-id-meta{border:1px solid #e2e8f0;background:#f8fafc;padding:8px 10px;border-radius:10px}
.pf-id-meta.variant{margin-bottom:10px}
.pf-id-meta-label{font-size:11px;color:#64748b;text-transform:uppercase;letter-spacing:.04em;font-weight:700}
.pf-id-meta-value{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;font-size:12px;color:#0f172a}
@media (max-width:980px){
  .prod-v2-layout{grid-template-columns:1fr}
}
.v2-unit-head{font-weight:700;color:#64748b;margin-top:8px}
.v2-unit-row{display:grid;grid-template-columns:1.2fr .7fr .6fr .6fr .6fr auto;gap:8px;padding:6px 8px;border:1px solid #e5e7eb;border-radius:8px;margin-top:6px;align-items:center}
.v2-unit-row.is-active{border-color:#2563eb;background:#eff6ff;box-shadow:0 0 0 2px rgba(37,99,235,.15)}
.v2-unit-row.is-active > div:first-child b{color:#1d4ed8}
.rx-price-scroll-wrap{overflow-x:auto;overflow-y:hidden;padding-bottom:4px}
.rx-price-row-grid{display:grid;grid-template-columns:minmax(180px,1.35fr) minmax(120px,.95fr) minmax(120px,.95fr) minmax(86px,.5fr) auto;gap:8px;align-items:end;min-width:740px}
.rx-price-row-grid .rx-price-col .input{width:100%;max-width:none}
.rx-price-row-grid .rx-price-toggle{white-space:nowrap;align-self:center;min-width:0}
.rx-price-row-grid .rx-price-action{display:flex;align-items:center;justify-content:flex-end;padding-bottom:2px}
@media (max-width: 900px){
  .rx-price-row-grid{grid-template-columns:1fr 1fr;align-items:stretch}
  .rx-price-row-grid .rx-price-channel{grid-column:1/-1}
  .rx-price-row-grid .rx-price-toggle{grid-column:1/2;align-self:end}
  .rx-price-row-grid .rx-price-action{grid-column:2/3;justify-content:flex-start;align-self:end}
}
.v2-badge-warn{display:inline-block;margin-left:8px;padding:2px 8px;border-radius:999px;background:#fff7ed;border:1px solid #fdba74;color:#9a3412;font-size:11px}


/* Product Data Beauty Pass (final polish) */
.pm-toolbar-top,.pm-toolbar-filters,.pm-toolbar-actions{gap:10px}
.pm-toolbar-filters .lbl{min-width:170px}
.pm-status-chip{border-radius:12px;padding:9px 11px;font-weight:600;transition:border-color .16s ease, background-color .16s ease, transform .08s ease}
.pm-status-chip:hover{border-color:#cbd5e1;background:#f8fafc;transform:translateY(-.5px)}
.pm-status-chip b{font-size:15px;font-weight:800}
.pm-card-list{gap:12px}
.pm-card{border:1px solid #e2e8f0;border-radius:12px;padding:13px 14px;background:#fff;box-shadow:0 1px 2px rgba(15,23,42,.03)}
.pm-card:hover{border-color:#d1d9e6;box-shadow:0 8px 24px rgba(15,23,42,.06)}
.pm-card-title{font-weight:800;font-size:15px;line-height:1.3}
.pm-card-sub{color:#5f7088;font-size:12px;line-height:1.45}

.prod-v2-main{gap:12px}
.prod-v2-main .card{border-color:#e2e8f0;border-radius:12px;box-shadow:0 1px 2px rgba(15,23,42,.03)}
.prod-v2-main .card-title{font-size:14px;font-weight:800;letter-spacing:.01em;color:#0f172a}
.prod-v2-main .hint{color:#64748b}
.prod-v2-main .lbl{font-size:12px;font-weight:600;color:#475569;gap:7px}
.prod-v2-main .lbl .hint{font-size:12px;font-weight:500;color:#74839a}
.prod-v2-main .input{border-color:#d9e2ef;background:#fff;transition:border-color .16s ease, box-shadow .16s ease, background-color .16s ease}
.prod-v2-main .input:focus{border-color:#2563eb;box-shadow:0 0 0 3px rgba(37,99,235,.10)}
.prod-v2-main .input[readonly],
.prod-v2-main select[disabled],
.prod-v2-main input[disabled]{background:#f8fafc;color:#64748b;border-color:#e2e8f0;opacity:1}

.prod-v2-section-jump{padding:2px 0 2px}
.prod-v2-section-jump .btn.tiny{border-color:#dbe4f2;background:#fff;color:#475569}
.prod-v2-section-jump .btn.tiny:hover{border-color:#c5d2e7;background:#f8fafc}

details.sec{border-color:#e2e8f0;border-radius:12px;padding:11px 12px;background:#fff}
details.sec > summary{font-weight:800;font-size:13px;color:#0f172a;letter-spacing:.01em}
details.sec[open] > summary{margin-bottom:11px}

.v2-unit-row{border-color:#e2e8f0;border-radius:10px;padding:7px 9px}
.v2-unit-row.is-active{border-color:#2563eb;background:#f3f8ff;box-shadow:0 0 0 2px rgba(37,99,235,.10)}
.variant-card-summary b{font-weight:800;color:#0f172a}
.variant-card-summary .hint{color:#6b7d94}

.pf-id-meta{border:1px solid #dce4ef;background:#f8fafc;padding:9px 10px;border-radius:11px}
.pf-id-meta-label{font-size:11px;color:#6b7280;text-transform:uppercase;letter-spacing:.05em;font-weight:700}
.pf-id-meta-value{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;font-size:12px;color:#0f172a;font-weight:600}

/* Import UI */
.imp-page{border-color:#dce5f2;box-shadow:0 10px 28px rgba(15,23,42,.05)}
.imp-page .card-title{font-size:15px;font-weight:800;letter-spacing:.01em;color:#0f172a}
.imp-page .hint{color:#5f7088}
.imp-step-title{font-size:12px;letter-spacing:.02em;color:#475569}
.imp-control-row .input{min-height:40px}
#imp_summary_card,#imp_error_summary_card,#imp_pos_impact_card,#imp_job,#imp_job_actions,#imp_hist,#imp_output{border-color:#dce5f2;border-radius:12px;box-shadow:0 1px 2px rgba(15,23,42,.03)}
#imp_summary_card .card-title,#imp_error_summary_card .card-title,#imp_pos_impact_card .card-title,#imp_job .card-title,#imp_job_actions .card-title,#imp_hist .card-title{font-size:13px;font-weight:800;color:#0f172a}
#imp_recovery_banner{border-radius:12px;border-color:#f2c173;background:#fffbef}
#imp_running_banner{border-radius:12px}
.imp-preview-table{border-collapse:separate;border-spacing:0;width:100%}
.imp-preview-table thead th{position:sticky;top:0;background:#f8fafc;border-bottom:1px solid #e2e8f0;font-size:11px;letter-spacing:.03em;text-transform:uppercase;color:#64748b;padding:8px 9px}
.imp-preview-table tbody td{border-bottom:1px solid #eef2f7;padding:8px 9px;color:#334155}
.imp-preview-table tbody tr:hover td{background:#f8fbff}

#imp_run_modal .modal-card{border-radius:14px;border:1px solid #dbe4f1;box-shadow:0 18px 42px rgba(15,23,42,.16)}
#imp_run_modal .modal-title{font-size:16px;font-weight:800;color:#0f172a;margin-bottom:6px}
#imp_run_modal .modal-actions{margin-top:14px;padding-top:10px;border-top:1px solid #e2e8f0}
#imp_run_kpis .card{margin:0;border:1px solid #e2e8f0;border-radius:10px;box-shadow:none;background:#fff}

#imp_detail_modal .card{border:1px solid #dbe4f1;border-radius:14px;box-shadow:0 18px 44px rgba(15,23,42,.2)}
#imp_detail_modal .card-title{font-size:15px;font-weight:800}

/* Unit wizard modal */
.v2w-modal{display:flex;flex-direction:column;gap:10px}
.v2w-head{padding-bottom:2px}
.v2w-title{font-size:13px;font-weight:800;color:#0f172a;letter-spacing:.01em}
.v2w-grid{gap:10px}
.v2w-preview{padding:8px 10px;border:1px solid #dbe4f2;border-radius:10px;background:#f8fbff;color:#334155;font-weight:600}

/* Promotions & Marketing premium patterns */
.pm-kpiCard{border:1px solid #dbe4f2;border-radius:12px;box-shadow:0 1px 2px rgba(15,23,42,.05)}
.pm-kpiScopeHint{margin-top:6px;padding:6px 10px;border:1px dashed #cbd5e1;border-radius:10px;background:#f8fafc}
.pm-kpiValue{font-size:24px;font-weight:800;line-height:1.2;margin:4px 0 6px;color:#0f172a}
.pm-reviewPanel{border:1px solid #fed7aa;background:#fff7ed}
.pm-kpiGrid .pm-kpiCard{background:linear-gradient(180deg,#fff,#f8fafc)}
.pm-relatedAreas{border:1px solid #dbe4f2;background:linear-gradient(180deg,#ffffff,#f8fbff)}
.pm-couponCodeChip{display:inline-flex;align-items:center;padding:4px 8px;border-radius:999px;border:1px solid #bfdbfe;background:#eff6ff;color:#1e40af;font-weight:800;letter-spacing:.04em;font-size:12px}

.pm-pageTitle{margin:0}
.pm-rowGap8{gap:8px}
.pm-rowWrapGap8{gap:8px;flex-wrap:wrap}
.pm-mt8{margin-top:8px}
.pm-mt10{margin-top:10px}
.pm-mt12{margin-top:12px}
.pm-mb10{margin-bottom:10px}
.pm-inputGrow220{min-width:220px;flex:1}
.pm-inputGrow240{min-width:240px;flex:1}
.pm-inputGrow260{min-width:260px;flex:1}
.pm-inputW170{width:170px}
.pm-inputW180{width:180px}
.pm-inputW210{width:210px}


.pm-aiPanel{border:1px solid #dbeafe;background:linear-gradient(180deg,#ffffff,#f8fbff)}
.pm-aiPanel.is-demoted{border-color:#e2e8f0;background:linear-gradient(180deg,#fff,#f8fafc)}
.pm-quick-summary{display:flex;gap:8px;flex-wrap:wrap;align-items:center;justify-content:space-between;margin:8px 0 4px;padding:8px 10px;border:1px solid #e2e8f0;border-radius:12px;background:#fff}
.pm-quick-summary .hint{margin:0}
.pm-secondary-toolbar{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:6px}
.pm-secondary-toolbar .btn{background:#fff}
.pm-aiChip{background:#eef2ff;border-color:#c7d2fe;color:#3730a3}
.pm-aiList{display:grid;gap:8px}
.pm-aiItem{border:1px solid #e2e8f0;border-radius:10px;padding:8px 10px;background:#fff}
.pm-aiWhy{margin-top:6px;padding:6px 8px;border-left:2px solid #bfdbfe;background:#f8fbff;border-radius:6px}
.pm-aiSummary{padding:8px 10px;border-radius:10px;background:#f8fafc;border:1px solid #e2e8f0;color:#1e293b;margin-bottom:8px}


.pm-filterBar{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.pm-pagerBar{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 10px}
.pm-filterBar-supplier{display:grid;grid-template-columns:minmax(260px,1fr) minmax(200px,220px) minmax(140px,160px);gap:8px;margin-top:10px}
#sp_center_q{min-width:0}
@media (max-width:900px){
  .pm-filterBar-supplier{grid-template-columns:repeat(2,minmax(0,1fr))}
  #sp_center_q{grid-column:1 / -1}
}


.pm-statusBadge{font-weight:700;min-width:72px;justify-content:center}
.pm-statusSplit{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.pm-codeChip{letter-spacing:.05em}
.pm-subLabel{margin-top:6px}
.pm-reviewPanel-spaced{margin-bottom:10px}

.pm-reviewMetric{border:1px solid #e2e8f0;border-radius:10px;padding:8px 10px;background:#fff}
.pm-reviewMetric-attention{border-color:#fdba74;background:#fff7ed}
.pm-reviewMetric-warning{border-color:#bfdbfe;background:#eff6ff}
.pm-reviewMetric-info{border-color:#d1d5db;background:#f9fafb}

.pm-actionRow{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.rx-table td{vertical-align:top}
.rx-table td b{display:block;overflow-wrap:anywhere}
.rx-table .hint{overflow-wrap:anywhere}
.pm-pageTitle{max-width:min(700px,95vw)}
.rx-pageHeader .hint{max-width:min(760px,96vw)}
.rx-table td .hint{line-height:1.35}
.pm-btnBlocked{opacity:.7;background:#f8fafc;border-color:#d1d5db;color:#6b7280;cursor:not-allowed}
.pm-disabledHelp{margin-top:6px;max-width:280px}
.pm-rowArchived{opacity:.68;filter:saturate(.7)}
.pm-itemRailWrap{border:1px solid #dbe4f0;border-radius:12px;padding:10px;background:#f8fbff}
.pm-builderModalOverlay{position:fixed;inset:0;z-index:1200;background:rgba(15,23,42,.55);display:flex;align-items:stretch;justify-content:center;padding:0}
.pm-builderModalCard{width:min(1100px,100%);height:100%;background:#f8fafc;padding:14px;overflow:auto}
.pm-builderModalCard input.input[type="number"]{min-height:32px;padding:4px 8px;line-height:1.2}
.pm-itemRailHeader{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}
.pm-itemFilterGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:8px;margin-top:8px}
.pm-itemCandidateStrip{display:flex;gap:8px;overflow:auto;padding:8px 0}
.pm-itemCandidateCard{display:flex;flex-direction:column;min-width:240px;max-width:240px;border:1px solid #dbe4f0;border-radius:12px;background:#fff;padding:10px;cursor:pointer;text-align:left;gap:8px}
.pm-itemCandidateCard-added{border-color:#86efac;background:#f0fdf4;cursor:not-allowed}
.pm-itemCandidateTop{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;min-height:34px}
.pm-itemCandidateThumbWrap{width:34px;height:34px;flex:0 0 34px;display:flex;align-items:flex-start}
.pm-itemCandidateThumb{width:32px;height:32px;border-radius:6px;object-fit:cover;border:1px solid #e2e8f0;background:#f8fafc}
.pm-itemCandidateIconOnly{font-size:14px;line-height:1;color:#94a3b8;display:inline-block;padding-top:2px}
.pm-itemCandidateTitle{font-size:14px;font-weight:700;line-height:1.3;min-height:36px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pm-itemCandidateFooter{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12px;color:#64748b;line-height:1.2}
.pm-itemCandidateBrand{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pm-itemCandidatePrice{font-weight:600;color:#334155;white-space:nowrap}
.pm-itemCandidateState{font-size:12px;font-weight:700;color:#0f766e;white-space:nowrap;align-self:flex-start;border:1px solid #cbd5e1;border-radius:999px;padding:2px 8px;background:#f8fafc}
.pm-itemRailHeaderRow{display:flex;gap:8px;align-items:center;padding:2px 4px;color:#64748b;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.02em}
.pm-itemRailHeadProduct{flex:1;min-width:220px}
.pm-itemRailHeadQty{width:98px;flex:0 0 98px;text-align:left}
.pm-itemRailHeadUnit{width:124px;flex:0 0 124px;text-align:left}
.pm-itemRailHeadRole{width:116px;flex:0 0 116px;text-align:left}
.pm-itemRailHeadRemove{min-width:60px;flex:0 0 auto;text-align:right}
.pm-tierHeaderRow{display:grid;grid-template-columns:98px 98px 98px auto;gap:8px;align-items:center;padding:2px 4px;color:#64748b;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.02em}
.pm-itemRailList{margin-top:8px;max-height:260px;overflow:auto;display:flex;flex-direction:column;gap:8px;padding-right:4px}
.pm-itemRailRow{display:flex;gap:8px;align-items:flex-end;border:1px solid #e2e8f0;background:#fff;border-radius:10px;padding:8px}
.pm-lineTierRow{padding:4px 6px;gap:6px;align-items:center}
.pm-lineTierRow .pm-itemRailQty,.pm-lineTierRow .pm-itemRailRole{height:30px;min-height:30px}
.pm-itemRailMain{flex:1;min-width:220px;display:flex;flex-direction:column;gap:2px}
.pm-itemRailName{font-size:13px;font-weight:600;line-height:1.2}
.pm-typeGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px}
.pm-typeTile{border:1px solid #dbe4f0;background:#fff;border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:6px;text-align:left;cursor:pointer;transition:border-color .15s ease,background-color .15s ease,box-shadow .15s ease}
.pm-typeTile:hover{border-color:#bfdbfe;background:#f8fbff}
.pm-typeTile-active{border-color:#60a5fa;background:#eff6ff;box-shadow:0 0 0 1px rgba(96,165,250,.2) inset}
.pm-typeTitle{font-size:14px;font-weight:700;line-height:1.3;color:#0f172a}
.pm-typeDesc{font-size:12px;line-height:1.35;color:#475569}
.pm-typeExample{font-size:11px;line-height:1.3;color:#94a3b8}
.pm-itemRailUnit{width:124px;flex:0 0 124px}
.pm-itemRailRole{width:116px;flex:0 0 116px}
.pm-itemRailQty{width:98px;flex:0 0 98px}
.pm-itemRailRemove{flex:0 0 auto}
.pm-inputNumericCompact{min-height:30px;height:30px;padding:3px 8px;line-height:1.1}
.pm-dateRangeBox{grid-column:1/-1;border:1px solid #dbe4f0;border-radius:10px;background:#fff;padding:8px}
.pm-dateRangeTitle{font-size:12px;font-weight:700;color:#334155;margin-bottom:6px}
.pm-dateRangeRow{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.pm-channelBox{grid-column:1/-1;border:1px solid #dbe4f0;border-radius:10px;background:#fff;padding:8px}
.pm-channelBoxHead{display:flex;align-items:center;justify-content:space-between;gap:8px}
.pm-channelActions{gap:6px;margin:6px 0}
.pm-channelList{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:4px;max-height:160px;overflow:auto;border:1px solid #e2e8f0;border-radius:8px;padding:6px;background:#f8fafc}
.pm-channelItem{display:flex;gap:6px;align-items:center;font-size:12px;color:#334155;padding:3px 4px;border-radius:6px}
.pm-channelItem:hover{background:#eef6ff}
.pm-reviewInfoStrip{margin-top:10px;padding:8px 10px;border:1px dashed #d1d5db;border-radius:10px;display:flex;gap:8px;align-items:center;flex-wrap:wrap;background:#f9fafb}
@media (max-width: 860px){
  .pm-builderModalCard{padding:10px}
  .pm-itemRailHeaderRow{display:none}
  .pm-tierHeaderRow{display:none}
  .pm-itemRailRow{flex-wrap:wrap;align-items:stretch}
  .pm-itemRailMain{min-width:0;flex:1 1 100%}
  .pm-itemRailUnit,.pm-itemRailRole,.pm-itemRailQty{width:auto;flex:1 1 120px}
  .pm-itemRailRemove{margin-left:auto}
  .pm-lineTierRow .pm-itemRailQty,.pm-lineTierRow .pm-itemRailRole{flex:1 1 120px}
  .pm-itemCandidateCard{min-width:180px}
  .pm-dateRangeRow{grid-template-columns:1fr}
  .pm-channelBoxHead{flex-direction:column;align-items:flex-start}
  .pm-channelList{grid-template-columns:1fr}
}


.pm-reviewLegend-attention{background:#fff7ed;border-color:#fdba74;color:#9a3412}
.pm-reviewLegend-warning{background:#eff6ff;border-color:#93c5fd;color:#1d4ed8}
.pm-reviewLegend-info{background:#f9fafb;border-color:#d1d5db;color:#374151}
.rx-area-contract{margin-top:12px;border:1px solid #dbe4f2;border-radius:14px;background:linear-gradient(180deg,#ffffff,#f8fbff);padding:14px}
.rx-area-contract .card-title{font-size:15px}
.rx-area-contract-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px;margin-top:10px}
.rx-area-contract-step{border:1px solid #e2e8f0;border-radius:10px;padding:9px 10px;background:#fff}
.rx-area-contract-step b{display:block;font-size:13px;color:#0f172a}
.rx-area-contract-step .hint{margin-top:4px}
.pm-statusContract{border:1px solid #dbe4f2;background:linear-gradient(180deg,#fff,#f8fbff);padding:10px 12px;border-radius:12px;margin:10px 0}

.rx-help-strip{margin-top:10px;padding:8px 10px;border:1px solid #dbe4f2;border-radius:12px;background:linear-gradient(180deg,#fff,#f8fbff);display:flex;gap:8px;flex-wrap:wrap;align-items:center;justify-content:space-between}
.rx-help-strip__main{display:flex;gap:8px;flex-wrap:wrap;align-items:center;min-width:260px}
.rx-help-strip__actions{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.rx-help-strip-collapse summary{list-style:none;display:flex;gap:8px;align-items:center;cursor:pointer}
.rx-help-strip-collapse summary::-webkit-details-marker{display:none}
.rx-help-strip__legend{margin-top:8px;display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.rx-help-strip-muted{background:linear-gradient(180deg,#fff,#f8fafc);border-color:#e2e8f0}
.rx-setup-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:10px}
.rx-setup-tile{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;padding:12px;border-radius:12px;border:1px solid #e2e8f0;background:#fff;text-align:left;cursor:pointer;transition:border-color .15s ease,box-shadow .15s ease,transform .08s ease}
.rx-setup-tile:hover{border-color:#cbd5e1;box-shadow:0 8px 18px rgba(15,23,42,.06);transform:translateY(-1px)}

@media (max-width:1180px){
  #sp_kpis.pm-kpiGrid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:860px){
  #sp_kpis.pm-kpiGrid{grid-template-columns:repeat(2,minmax(0,1fr))}
}


/* Customer Display Studio UX refresh */
.cds-context-bar{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap;margin-bottom:10px}
.cds-context-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.cds-tab-row{display:flex;gap:8px;margin:8px 0 12px;flex-wrap:wrap}
.cds-body{padding:14px}
.cds-preview-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(280px,.7fr);gap:12px;align-items:start}
@media (max-width:980px){.cds-preview-grid{grid-template-columns:1fr}}
.cds-workspace{display:grid;grid-template-columns:minmax(240px,.8fr) minmax(0,1.5fr) minmax(280px,.9fr);gap:12px;align-items:start}
.cds-pane{border:1px solid #dbe4f2;border-radius:12px;background:linear-gradient(180deg,#fff,#f8fbff);padding:12px;display:flex;flex-direction:column;gap:8px}
.cds-controls-rail .lbl,.cds-inspector .lbl{display:flex;flex-direction:column;gap:4px}
.cds-preview-stage{border-radius:12px;border:1px solid rgba(148,163,184,.25);overflow:hidden;min-height:420px}
.cds-lock-box{margin-top:auto;border:1px dashed #cbd5e1;border-radius:10px;padding:8px 10px;background:#f8fafc}
@media (max-width:1200px){.cds-workspace{grid-template-columns:1fr}.cds-controls-rail,.cds-inspector{order:2}.cds-preview-center{order:1}}
.cds-inspector-groups{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:2px}
.cds-inspector-groups .badge{background:#eef2ff;border:1px solid #c7d2fe;color:#3730a3}

.ops-log-header{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:10px;
}
.ops-row-error td{ background:#fff7f7; }
.ops-row-warn td{ background:#fffdf5; }
.limit-bar-fill-warn{ background:linear-gradient(90deg,#f59e0b,#f97316); }

/* Phase 11A productization workspace hardening */
.rx-return-strip{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;padding:10px 12px;border:1px solid #dbe4f2;border-radius:12px;background:linear-gradient(180deg,#fff,#f8fbff);margin-top:10px}
.rx-pack-workspace{border:1px solid #dbe4f2;background:linear-gradient(180deg,#fff,#f8fbff)}
.rx-pack-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px}
.rx-pack-card{border:1px solid #dbe4f2;border-radius:12px;background:#fff;padding:10px;text-align:left;cursor:pointer;display:flex;flex-direction:column;gap:8px}
.rx-pack-card.is-active{border-color:#2563eb;box-shadow:0 0 0 2px rgba(37,99,235,.12)}
.rx-pack-card.is-rec{background:linear-gradient(180deg,#fff,#f0f9ff)}
.rx-pack-list{display:grid;grid-template-columns:1fr;gap:6px}
.rx-pack-list ul{margin:4px 0 0 16px;color:#475569;font-size:12px}
.rx-pack-summary{padding:8px 10px;border:1px dashed #cbd5e1;border-radius:10px;background:#f8fafc}
.rx-feature-group{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.rx-feature-row{border:1px solid #e2e8f0;border-radius:10px;padding:10px;background:#fff}
.rx-feature-row.is-on{border-color:#bbf7d0;background:#f0fdf4}
.rx-feature-row.is-locked{background:#f8fafc}
.rx-prod-hero{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;flex-wrap:wrap;padding:12px;border:1px solid #dbe4f2;border-radius:12px;background:linear-gradient(180deg,#fff,#f8fbff)}
.rx-prod-checklist{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.rx-prod-check{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;padding:8px 10px;border-radius:10px;border:1px solid #e2e8f0;background:#fff}
.rx-prod-check.is-done{border-color:#bbf7d0;background:#f0fdf4}
.rx-prod-check.is-pending{border-color:#fed7aa;background:#fff7ed}
.rx-template-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:10px}
.rx-template-card{border:1px solid #dbe4f2;border-radius:10px;padding:10px;background:#fff}

/* Phase 11B premium finish + governance visual tightening */
.rx-pack-workspace,.rx-prod-hero,.rx-return-strip{box-shadow:0 8px 26px rgba(15,23,42,.05)}
.rx-pack-card{transition:transform .12s ease,border-color .16s ease,box-shadow .16s ease}
.rx-pack-card:hover{transform:translateY(-1px);border-color:#c3d6f5;box-shadow:0 10px 22px rgba(15,23,42,.08)}
.rx-feature-row{position:relative;overflow:hidden}
.rx-feature-row.is-locked::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(248,250,252,.2),rgba(248,250,252,.65));pointer-events:none}
.rx-prod-check.is-pending{border-left:4px solid #f97316}
.rx-prod-check.is-done{border-left:4px solid #22c55e}
.rx-template-card{background:linear-gradient(180deg,#fff,#f8fbff)}

.rx-workspace-header{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap}
.rx-kpi-strip{display:flex;gap:8px;flex-wrap:wrap}
.rx-grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.rx-empty-state{padding:14px;border:1px dashed #cbd5e1;border-radius:12px;background:#f8fafc}

.rx-purch-shell{display:grid;grid-template-columns:minmax(280px, 36%) minmax(0, 1fr);gap:12px;align-items:start}
.rx-purch-stack{display:grid;gap:12px}
.rx-purch-queue{max-height:calc(100vh - 260px);overflow:auto}
.rx-purch-card-list{display:grid;gap:8px}
.rx-purch-card-item{border:1px solid #e2e8f0;border-radius:12px;padding:10px;background:#fff}
.rx-purch-card-head{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.rx-purch-card-title{font-weight:700;color:#0f172a}
.rx-purch-card-meta{font-size:12px;color:#64748b;line-height:1.4}
.rx-purch-line-grid{display:grid;gap:8px}
.rx-purch-line-card{border:1px solid #e2e8f0;border-radius:12px;padding:10px;background:#fff}
.rx-purch-sticky-action{position:sticky;bottom:0;z-index:3;background:linear-gradient(180deg,rgba(255,255,255,.88),#fff);padding:8px 0 calc(8px + env(safe-area-inset-bottom));border-top:1px solid #e2e8f0}
.rx-purch-slim-table{font-size:13px}
.rx-purch-slim-table th,.rx-purch-slim-table td{padding:8px 6px}
.rx-receive-header{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;padding:10px;border:1px solid #e2e8f0;border-radius:12px;background:#fff}
.rx-receive-header-main{display:grid;gap:2px}
.rx-receive-subline{font-size:12px;color:#475569}
.rx-dateField{position:relative}
.rx-dateFieldInput{color:transparent}
.rx-dateFieldInput:focus{color:transparent}
.rx-dateFieldDisplay{position:absolute;inset:0;display:flex;align-items:center;padding:0 12px;color:#0f172a;pointer-events:auto;background:transparent;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rx-dateFieldInput::-webkit-datetime-edit{color:transparent}
.rx-dateFieldInput:disabled + .rx-dateFieldDisplay{color:#94a3b8;background:#f8fafc}
.rx-dateFieldDisplay.is-empty{color:#94a3b8}
.rx-receive-fields-row .lbl{margin:0}
.rx-receive-scan-row{padding:8px;border:1px solid #e2e8f0;border-radius:10px;background:#fff}
.rx-receive-info-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:8px 0}
.rx-receive-table-wrap{overflow:auto;max-width:100%}
.rx-receive-table{min-width:760px}
.rx-receive-table tr.is-scan-hit{background:#eff6ff;outline:2px solid #2f6fed}
.rx-receive-table tr.is-row-complete{opacity:.6}
@media (max-width: 980px){
  .rx-purch-shell{grid-template-columns:1fr}
  .rx-purch-queue{max-height:none;overflow:visible}
  .rx-receive-info-grid{grid-template-columns:1fr}
}

@media (max-width: 720px){
  .rx-workspace-header h1{font-size:20px}
  .rx-kpi-strip{gap:6px}
  .rx-purch-card-item,.rx-purch-line-card{padding:9px}
  .rx-purch-sticky-action{row-gap:8px}
  .rx-purch-sticky-action .btn{width:100%}
  .rx-receive-header{flex-direction:column}
  .rx-receive-scan-row .btn{width:100%}
}

.setup-wizard-card{
  position:relative;
  max-width:min(680px,100%);
  padding:18px 20px 16px;
  overflow-x:hidden;
}

.setup-wizard-form{ gap:10px; margin-top:8px; }
#setup_notice{
  margin:2px 0 0;
  line-height:1.4;
}
.setup-wizard-inline-action{
  margin-top:4px;
  margin-bottom:2px;
}
.setup-wizard-inline-action .btn{
  min-height:36px;
  padding:8px 12px;
}
.setup-wizard-password-hint{
  font-size:12px;
  line-height:1.45;
  color:#475569;
  margin-top:4px;
  margin-bottom:2px;
  padding:6px 8px;
  border-left:3px solid #cbd5e1;
  background:#f8fafc;
  border-radius:8px;
}

.setup-wizard-actions{
  margin-top:8px;
  display:flex;
  flex-direction:column;
  gap:8px;
  padding-top:8px;
  border-top:1px solid #edf2f7;
}
.setup-wizard-actions__hint{
  font-size:12px;
  line-height:1.4;
  color:#64748b;
  margin:0;
}
#setup_msg{
  min-height:18px;
  line-height:1.45;
  color:#475569;
  padding:6px 8px;
  border-radius:8px;
  background:#f8fafc;
}
#setup_msg:empty{
  padding:0;
  min-height:0;
  background:transparent;
}
.setup-wizard-actions__buttons{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:8px;
}
.setup-wizard-actions .btn{
  min-height:44px;
  width:100%;
}
.setup-wizard-actions .hint{
  margin-top:2px;
}
@media (max-height:700px){
  .setup-wizard-card .field{
    margin-bottom:8px;
  }
  .setup-wizard-card .field:last-of-type{
    margin-bottom:0;
  }
  .setup-wizard-card .field label{
    display:block;
    line-height:1.25;
    margin-bottom:4px;
  }
  .setup-wizard-card{
    padding-top:12px;
    padding-bottom:14px;
  }
  .setup-wizard-card .auth-title{
    line-height:1.12;
    margin-bottom:4px;
  }
  .setup-wizard-card .auth-sub{
    line-height:1.3;
    margin-top:0;
    margin-bottom:8px;
  }
  .setup-wizard-actions{
    padding-top:8px;
    gap:6px;
  }
  .setup-wizard-actions__buttons{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:8px;
  }
  .setup-wizard-actions .btn{
    min-height:42px;
  }
  .setup-wizard-password-hint{
    font-size:11px;
    line-height:1.35;
    margin-top:1px;
    margin-bottom:6px;
    padding:5px 7px;
  }
  .setup-wizard-actions__hint{
    font-size:11px;
    line-height:1.35;
    margin-top:0;
    margin-bottom:3px;
  }
  #setup_msg{
    font-size:12px;
    line-height:1.4;
    margin-top:1px;
  }
}

@supports not (min-height: 100svh){
  .auth-wrap{ min-height:calc(100vh - 32px); }
  .auth-wrap.rx-auth-wrap{ min-height:100vh; }
}

@media (max-height:760px){
  .auth-wrap.rx-auth-wrap{ align-items:flex-start; }
}

@media (max-width:640px){
  .auth-wrap.rx-auth-wrap{ padding-inline:14px; padding-bottom:22px; }
  .auth-card.rx-auth-card{ padding:20px 18px; }
  .auth-topbar{ min-height:28px; margin-bottom:6px; }
  .lang-btn{ min-width:44px; padding:5px 8px; }
  .auth-input.rx-auth-input{ padding-inline:14px; }
  .auth-field-status-icon{ right:14px; }
  .auth-field-status-icon--password{ right:46px; }
  .auth-pass-toggle{ right:8px; }
  .auth-validation-text{ font-size:11px; }
  .setup-wizard-actions__buttons{ grid-template-columns:minmax(0,1fr); }
}

/* ===== Progress bar (import modal & general) ===== */
.progress{
  width:100%; background:#e2e8f0; border-radius:999px;
  height:8px; overflow:hidden;
}
.progress-bar{
  height:100%; background:#2563eb; border-radius:999px;
  transition:width .35s ease;
}
@keyframes rx-progress-pulse{
  0%  { opacity:1;   background:#2563eb; }
  50% { opacity:.55; background:#60a5fa; }
  100%{ opacity:1;   background:#2563eb; }
}

/* ===== Import history table ===== */
#imp_hist_wrap .table{ border-collapse:collapse; font-size:13px; }
#imp_hist_wrap .table th{
  background:#f1f5f9; font-weight:600; font-size:12px;
  text-transform:uppercase; letter-spacing:.04em;
  padding:8px 10px; white-space:nowrap;
}
#imp_hist_wrap .table td{ padding:8px 10px; border-bottom:1px solid #e2e8f0; }
#imp_hist_wrap .table tr:last-child td{ border-bottom:none; }
#imp_hist_wrap .table tr:hover td{ background:#f8fafc; }

/* ===== Import progress modal KPI cards ===== */
#imp_run_kpis{ display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:8px; margin-top:12px; }

/* ===== Finance Dashboard v2 (fd2) ===== */
.fd2-kpi-grid{ display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:10px; }
.fd2-main-grid{ display:grid; grid-template-columns:2fr 1fr; gap:12px; align-items:start; }
.fd2-mid-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.fd2-sheet-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.fd2-2col{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.fd2-due-block{ border-radius:10px; padding:10px 12px; margin-bottom:8px; }
.fd2-due-overdue{ background:#fff1f2; border:1px solid #fecaca; }
.fd2-due-today{ background:#fffbeb; border:1px solid #fde68a; }
.fd2-due-week{ background:#f0f9ff; border:1px solid #bae6fd; }
.fd2-due-month{ background:#f8fafc; border:1px solid #e2e8f0; }
.fd2-due-block-title{ font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.07em; margin-bottom:6px; }
.fd2-due-overdue .fd2-due-block-title{ color:#b91c1c; }
.fd2-due-today .fd2-due-block-title{ color:#d97706; }
.fd2-due-week .fd2-due-block-title{ color:#0369a1; }
.fd2-due-month .fd2-due-block-title{ color:#64748b; }
.fd2-due-item{ display:flex; align-items:flex-start; justify-content:space-between; padding:5px 0; border-bottom:1px solid rgba(0,0,0,.05); gap:8px; }
.fd2-due-item:last-child{ border-bottom:none; }
.fd2-due-item-name{ font-size:12px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.fd2-due-item-meta{ font-size:10px; color:#94a3b8; margin-top:1px; }
.fd2-due-item-amt{ font-size:12px; font-weight:800; white-space:nowrap; flex-shrink:0; }
.fd2-due-item.is-overdue .fd2-due-item-amt{ color:#dc2626; }
.fd2-due-item.is-warning .fd2-due-item-amt{ color:#d97706; }
.fd2-tax-row{ display:flex; justify-content:space-between; align-items:center; padding:6px 0; border-bottom:1px solid #f1f5f9; gap:8px; }
.fd2-tax-row:last-child{ border-bottom:none; }
.fd2-sheet-item{ display:flex; justify-content:space-between; align-items:center; padding:5px 0; border-bottom:1px solid #f8fafc; font-size:12px; gap:8px; }
.fd2-sheet-item:last-child{ border-bottom:none; }
.fd2-sheet-label{ color:#64748b; flex:1; }
.fd2-sheet-val{ font-weight:700; white-space:nowrap; }
.fd2-chart-legend{ display:flex; gap:14px; flex-wrap:wrap; padding:6px 0; }
.fd2-legend-item{ display:flex; align-items:center; gap:5px; font-size:11px; color:#64748b; cursor:pointer; user-select:none; }
.fd2-legend-dot{ width:10px; height:10px; border-radius:50%; flex-shrink:0; }
.fd2-mini-stat{ display:flex; flex-direction:column; gap:1px; }
.fd2-mini-stat-label{ font-size:10px; text-transform:uppercase; letter-spacing:.06em; color:#94a3b8; font-weight:600; }
.fd2-mini-stat-val{ font-size:14px; font-weight:800; color:#0f172a; }
.fd2-mini-stats-row{ display:flex; gap:18px; flex-wrap:wrap; padding-top:10px; border-top:1px solid #f1f5f9; margin-top:10px; }
.fd2-hbar{ display:flex; align-items:center; gap:8px; padding:4px 0; }
.fd2-hbar-label{ font-size:12px; width:110px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; flex-shrink:0; color:#475569; }
.fd2-hbar-track{ flex:1; height:8px; background:#f1f5f9; border-radius:4px; overflow:hidden; }
.fd2-hbar-fill{ height:100%; border-radius:4px; transition:width .3s ease; }
.fd2-hbar-val{ font-size:12px; font-weight:700; width:76px; text-align:right; flex-shrink:0; }
.fd2-badge{ display:inline-flex; align-items:center; padding:2px 8px; border-radius:999px; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; }
.fd2-badge.on-budget{ background:#dcfce7; color:#166534; }
.fd2-badge.slightly-high{ background:#fef9c3; color:#854d0e; }
.fd2-badge.over-budget{ background:#fee2e2; color:#b91c1c; }
.fd2-status-dot{ width:8px; height:8px; border-radius:50%; display:inline-block; flex-shrink:0; }
.fd2-status-dot.paid{ background:#22c55e; }
.fd2-status-dot.pending{ background:#f59e0b; }
.fd2-status-dot.overdue{ background:#ef4444; }
.fd2-metric-box{ border-radius:10px; padding:10px 12px; }
.fd2-metric-box.green{ background:#f0fdf4; }
.fd2-metric-box.red{ background:#fff7f7; }
.fd2-metric-box.blue{ background:#eff6ff; }
.fd2-metric-box.gray{ background:#f8fafc; }
.fd2-metric-box-label{ font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; margin-bottom:2px; }
.fd2-metric-box.green .fd2-metric-box-label{ color:#16a34a; }
.fd2-metric-box.red .fd2-metric-box-label{ color:#dc2626; }
.fd2-metric-box.blue .fd2-metric-box-label{ color:#2563eb; }
.fd2-metric-box.gray .fd2-metric-box-label{ color:#64748b; }
.fd2-metric-box-val{ font-size:20px; font-weight:800; color:#0f172a; line-height:1.2; }
.fd2-section-title{ font-size:14px; font-weight:700; margin-bottom:10px; }
.fd2-card-header{ display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:6px; margin-bottom:10px; }
@media(max-width:1280px){ .fd2-kpi-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:900px){
  .fd2-kpi-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .fd2-main-grid{ grid-template-columns:1fr; }
  .fd2-mid-grid{ grid-template-columns:1fr; }
  .fd2-sheet-grid{ grid-template-columns:1fr; }
  .fd2-2col{ grid-template-columns:1fr; }
}
@media(max-width:540px){ .fd2-kpi-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }

/* ═══════════════════════════════════════════════════════════════════════════
   Customer Intelligence Workspace  (.cx-*)
═══════════════════════════════════════════════════════════════════════════ */
.cx-workspace{ max-width:100%; }

/* ── Top Bar ── */
.cx-topbar{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:16px; }
.cx-topbar-left{ min-width:0; }
.cx-breadcrumb{ font-size:12px; color:#94a3b8; margin-bottom:4px; }
.cx-page-title{ font-size:22px; font-weight:800; margin:0 0 2px; color:#0f172a; font-family:'Space Grotesk',sans-serif; letter-spacing:-.01em; }
.cx-page-sub{ font-size:13px; color:#64748b; }
.cx-topbar-actions{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.cx-more-wrap{ position:relative; }
.cx-dropdown{ position:absolute; right:0; top:calc(100% + 6px); background:#fff; border:1px solid #e2e8f0; border-radius:10px; box-shadow:0 8px 24px rgba(15,23,42,.10); min-width:160px; padding:4px; z-index:200; display:none; }
.cx-dropdown.cx-open{ display:block; }
.cx-dd-item{ display:block; width:100%; text-align:left; background:none; border:none; padding:8px 12px; font-size:13px; color:#334155; cursor:pointer; border-radius:7px; }
.cx-dd-item:hover{ background:#f1f5f9; }

/* ── KPI Grid ── */
.cx-kpi-grid{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; margin-bottom:14px; }
.cx-kpi-card{ background:#fff; border:1px solid #e2e8f0; border-radius:12px; padding:14px 16px; position:relative; overflow:hidden; transition:box-shadow .18s; }
.cx-kpi-card:hover{ box-shadow:0 4px 16px rgba(15,23,42,.07); }
.cx-kpi-card::before{ content:""; position:absolute; top:0; left:0; right:0; height:3px; }
.cx-kpi-blue::before{ background:linear-gradient(90deg,#3b82f6,#60a5fa); }
.cx-kpi-green::before{ background:linear-gradient(90deg,#22c55e,#4ade80); }
.cx-kpi-amber::before{ background:linear-gradient(90deg,#f59e0b,#fcd34d); }
.cx-kpi-purple::before{ background:linear-gradient(90deg,#8b5cf6,#a78bfa); }
.cx-kpi-red::before{ background:linear-gradient(90deg,#ef4444,#f87171); }
.cx-kpi-lbl{ font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:#64748b; }
.cx-kpi-val{ font-size:26px; font-weight:800; color:#0f172a; margin:6px 0 4px; font-family:'Space Grotesk',sans-serif; letter-spacing:-.01em; line-height:1; }
.cx-kpi-foot{ font-size:11px; color:#94a3b8; min-height:16px; }

/* ── Filter Bar ── */
.cx-filter-bar{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; padding:10px 0; position:sticky; top:0; z-index:30; background:#f8fafc; margin:-4px -2px 12px; padding-left:2px; padding-right:2px; }
.cx-search-wrap{ position:relative; }
.cx-search-ico{ position:absolute; left:10px; top:50%; transform:translateY(-50%); width:16px; height:16px; color:#94a3b8; pointer-events:none; }
.cx-search-input{ padding:7px 12px 7px 32px; border:1px solid #e2e8f0; border-radius:999px; font-size:13px; outline:none; width:240px; background:#fff; transition:border-color .18s,box-shadow .18s; }
.cx-search-input:focus{ border-color:#93c5fd; box-shadow:0 0 0 3px rgba(147,197,253,.25); }
.cx-chips{ display:flex; gap:5px; flex-wrap:wrap; }
.cx-chip{ padding:4px 12px; border-radius:999px; border:1px solid #e2e8f0; background:#fff; font-size:12px; font-weight:600; color:#475569; cursor:pointer; transition:all .15s; }
.cx-chip:hover{ border-color:#93c5fd; color:#2563eb; background:#eff6ff; }
.cx-chip.active{ background:#dbeafe; border-color:#93c5fd; color:#1d4ed8; }
.cx-row-count{ font-size:12px; color:#94a3b8; margin-left:auto; }

.cx-pagebar{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:10px 12px; margin-bottom:10px;
  border:1px solid #dbe7f8; border-radius:12px;
  background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);
  box-shadow:0 4px 16px rgba(30,64,175,.06);
}
.cx-pagebar-left,.cx-pagebar-right{ display:flex; align-items:center; gap:8px; }
.cx-pagebar-lbl{
  font-size:11px; text-transform:uppercase; letter-spacing:.06em;
  font-weight:700; color:#64748b;
}
.cx-pagebar-select{ min-width:78px; border-radius:999px; }
.cx-pagebar-mid{
  font-size:13px; color:#1e293b; font-weight:600;
  font-variant-numeric: tabular-nums;
}
.cx-page-nav{
  min-width:30px; height:30px; padding:0 8px;
  border-radius:10px; border:1px solid #dbe7f8;
  background:#fff; color:#1e40af;
}
.cx-page-nav:hover:not(:disabled){ border-color:#93c5fd; background:#eff6ff; color:#1d4ed8; }
.cx-page-nav.is-disabled,.cx-page-nav:disabled{
  opacity:.45; cursor:not-allowed; color:#64748b;
  background:#f8fafc; border-color:#e2e8f0;
}

/* ── Main Layout ── */
.cx-main-layout{ display:flex; gap:14px; align-items:flex-start; }
.cx-table-card{ flex:1; min-width:0; padding:0; overflow:hidden; }
.cx-insight-panel{ width:300px; flex-shrink:0; position:sticky; top:60px; max-height:calc(100vh - 80px); overflow-y:auto; }

/* ── Customer Table ── */
.cx-tbl-scroll{ overflow-x:auto; }
.cx-table{ width:100%; border-collapse:collapse; font-size:13px; }
.cx-table th{ padding:10px 14px; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:#64748b; border-bottom:2px solid #e2e8f0; background:#f8fafc; text-align:left; white-space:nowrap; position:sticky; top:0; z-index:2; }
.cx-table td{ padding:11px 14px; border-bottom:1px solid #f1f5f9; vertical-align:middle; }
.cx-row{ cursor:pointer; transition:background .1s; }
.cx-row:hover td{ background:#f0f7ff; }
.cx-row-selected td{ background:#eff6ff; box-shadow:inset 3px 0 0 #3b82f6; }
.cx-cell-customer{ display:flex; align-items:center; gap:10px; }
.cx-avatar{ width:34px; height:34px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:700; flex-shrink:0; }
.cx-row-name{ font-weight:600; color:#0f172a; font-size:13px; }
.cx-row-id{ font-size:11px; color:#94a3b8; font-family:ui-monospace,monospace; }
.cx-contact-cell{ display:flex; flex-direction:column; gap:2px; }
.cx-contact-line{ font-size:12px; color:#334155; }
.cx-email-line{ color:#3b82f6; }
.cx-bday{ font-size:13px; color:#334155; }
.cx-badge-xs{ font-size:10px; padding:1px 6px; }
.cx-pts-val{ font-variant-numeric:tabular-nums; font-weight:700; color:#0f172a; }
.cx-notes{ font-size:12px; color:#64748b; max-width:160px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cx-row-btns{ display:flex; gap:4px; opacity:0; transition:opacity .15s; }
.cx-row:hover .cx-row-btns{ opacity:1; }
.cx-actions-col{ white-space:nowrap; }

/* ── Insight Panel ── */
.cx-panel-inner{ padding:14px; }
.cx-panel-head{ display:flex; align-items:center; gap:10px; margin-bottom:14px; }
.cx-panel-avatar{ width:42px; height:42px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:16px; font-weight:700; flex-shrink:0; }
.cx-panel-headinfo{ flex:1; min-width:0; }
.cx-panel-name{ font-weight:700; font-size:15px; color:#0f172a; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cx-panel-id{ font-size:11px; color:#94a3b8; font-family:ui-monospace,monospace; }
.cx-panel-close{ margin-left:auto; flex-shrink:0; }
.cx-panel-sec{ border-top:1px solid #f1f5f9; padding:10px 0; }
.cx-panel-sec:first-of-type{ border-top:none; }
.cx-panel-sec:first-child{ border-top:none; }
.cx-panel-sec-hd{ font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:#94a3b8; margin-bottom:8px; }
.cx-panel-row{ display:flex; justify-content:space-between; align-items:center; gap:8px; font-size:13px; margin-bottom:5px; }
.cx-panel-lbl{ color:#64748b; flex-shrink:0; }
.cx-panel-email{ color:#3b82f6; font-size:12px; }
.cx-panel-pts{ font-size:18px; font-weight:800; color:#0f172a; font-family:'Space Grotesk',sans-serif; }
.cx-panel-notes{ font-size:13px; color:#475569; line-height:1.5; }
.cx-panel-qbtns{ display:flex; gap:8px; flex-wrap:wrap; }
.cx-flag{ font-size:12px; padding:4px 10px; border-radius:8px; margin-bottom:4px; font-weight:500; }
.cx-flag-green{ background:#f0fdf4; color:#15803d; border:1px solid #bbf7d0; }
.cx-flag-amber{ background:#fffbeb; color:#92400e; border:1px solid #fde68a; }
.cx-flag-blue{ background:#eff6ff; color:#1e40af; border:1px solid #bfdbfe; }
.cx-flag-red{ background:#fef2f2; color:#991b1b; border:1px solid #fecaca; }

/* ── Empty State ── */
.cx-empty{ text-align:center; padding:56px 20px; }
.cx-empty-svg{ width:72px; height:72px; margin-bottom:16px; opacity:.8; }
.cx-empty-title{ font-size:18px; font-weight:700; color:#0f172a; margin-bottom:6px; }
.cx-empty-sub{ font-size:13px; color:#64748b; margin-bottom:20px; }
.cx-empty-btns{ display:flex; gap:10px; justify-content:center; flex-wrap:wrap; }
.cx-error-msg{ color:#dc2626; padding:24px; }

/* ── Full-screen Modal ── */
.cx-fullmodal{ position:fixed; inset:0; background:rgba(15,23,42,.45); display:flex; align-items:center; justify-content:center; z-index:1000; padding:16px; }
.cx-fullmodal-inner{ background:#fff; border-radius:16px; width:100%; max-width:900px; max-height:90vh; display:flex; flex-direction:column; box-shadow:0 24px 64px rgba(15,23,42,.20); overflow:hidden; }
.cx-exp-inner{ max-width:1000px; }
.cx-modal-bar{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding:18px 20px 14px; border-bottom:1px solid #e2e8f0; flex-shrink:0; }
.cx-modal-title{ font-size:17px; font-weight:700; color:#0f172a; font-family:'Space Grotesk',sans-serif; }
.cx-modal-sub{ font-size:12px; color:#64748b; margin-top:2px; }
.cx-modal-foot{ display:flex; justify-content:space-between; align-items:center; padding:14px 20px; border-top:1px solid #e2e8f0; flex-shrink:0; }

/* ── Import Stepper ── */
.cx-stepper{ display:flex; align-items:center; padding:14px 20px; border-bottom:1px solid #f1f5f9; flex-shrink:0; }
.cx-step{ display:flex; align-items:center; gap:8px; flex:1; }
.cx-step-num{ width:26px; height:26px; border-radius:50%; border:2px solid #e2e8f0; display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:700; color:#94a3b8; flex-shrink:0; }
.cx-step-active .cx-step-num{ border-color:#3b82f6; background:#3b82f6; color:#fff; }
.cx-step-done .cx-step-num{ border-color:#22c55e; background:#22c55e; color:#fff; }
.cx-step-lbl{ font-size:12px; font-weight:600; color:#94a3b8; white-space:nowrap; }
.cx-step-active .cx-step-lbl{ color:#1d4ed8; }
.cx-step-done .cx-step-lbl{ color:#15803d; }
.cx-step-line{ flex:1; height:2px; background:#e2e8f0; margin:0 8px; }
.cx-step-done .cx-step-line{ background:#22c55e; }

/* ── Import Body ── */
.cx-imp-body{ flex:1; overflow-y:auto; padding:20px; }
.cx-imp-step1 .cx-dropzone{ border:2px dashed #cbd5e1; border-radius:14px; padding:32px 20px; text-align:center; cursor:pointer; transition:border-color .18s,background .18s; }
.cx-dropzone:hover,.cx-dz-hover{ border-color:#3b82f6; background:#eff6ff; }
.cx-imp-fname{ margin-top:10px; font-size:13px; color:#3b82f6; font-weight:600; }
.cx-imp-guide{ padding:14px 16px; }
.cx-imp-sm-grid{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; }
.cx-imp-sm-card{ background:#f8fafc; border:1px solid #e2e8f0; border-radius:10px; padding:12px; text-align:center; }
.cx-imp-sm-val{ font-size:22px; font-weight:800; font-family:'Space Grotesk',sans-serif; color:#0f172a; }
.cx-imp-sm-lbl{ font-size:11px; color:#64748b; margin-top:4px; text-transform:uppercase; letter-spacing:.04em; }
.cx-sm-create{ border-color:#bbf7d0; background:#f0fdf4; }
.cx-sm-create .cx-imp-sm-val{ color:#15803d; }
.cx-sm-update{ border-color:#bfdbfe; background:#eff6ff; }
.cx-sm-update .cx-imp-sm-val{ color:#1d4ed8; }
.cx-sm-skip{ border-color:#e2e8f0; }
.cx-sm-skip .cx-imp-sm-val{ color:#64748b; }
.cx-sm-error{ border-color:#fecaca; background:#fef2f2; }
.cx-sm-error .cx-imp-sm-val{ color:#dc2626; }
.cx-imp-errlist{ padding:14px 16px; }
.cx-imp-errrow{ display:flex; align-items:center; gap:8px; padding:4px 0; border-bottom:1px solid #fef2f2; }
.cx-imp-ok-badge{ background:#f0fdf4; color:#15803d; border:1px solid #bbf7d0; border-radius:10px; padding:12px 16px; font-weight:600; font-size:13px; margin-top:12px; }
.cx-imp-ptable th,.cx-imp-ptable td{ font-size:12px; }
.cx-pr-create td{ background:#f0fdf4; }
.cx-pr-update td{ background:#eff6ff; }
.cx-pr-skip td{ color:#94a3b8; }
.cx-pr-err td{ background:#fef2f2; }
.cx-imp-result{ text-align:center; padding:32px 20px; }
.cx-imp-result-ico{ width:56px; height:56px; background:#f0fdf4; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:24px; color:#15803d; margin:0 auto 12px; border:2px solid #bbf7d0; }
.cx-imp-result-title{ font-size:20px; font-weight:800; color:#0f172a; font-family:'Space Grotesk',sans-serif; }
.cx-spinner{ width:32px; height:32px; border:3px solid #e2e8f0; border-top-color:#3b82f6; border-radius:50%; animation:cx-spin .7s linear infinite; margin:0 auto; }
@keyframes cx-spin{ to{ transform:rotate(360deg); } }

/* ── Export Layout ── */
.cx-exp-layout{ display:grid; grid-template-columns:220px 1fr 220px; gap:0; flex:1; overflow:hidden; }
.cx-exp-panel{ padding:18px 16px; overflow-y:auto; border-right:1px solid #f1f5f9; }
.cx-exp-out-panel{ border-right:none; border-left:1px solid #f1f5f9; }
.cx-exp-sec-hd{ font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:#94a3b8; margin-bottom:8px; }
.cx-exp-presets{ display:flex; flex-direction:column; gap:6px; }
.cx-exp-preset{ padding:8px 12px; border:1px solid #e2e8f0; border-radius:10px; cursor:pointer; transition:all .15s; }
.cx-exp-preset:hover{ border-color:#93c5fd; background:#eff6ff; }
.cx-exp-preset.active{ border-color:#3b82f6; background:#eff6ff; }
.cx-exp-preset-name{ font-size:13px; font-weight:600; color:#0f172a; }
.cx-exp-filters{ margin-top:4px; }
.cx-exp-cb-row{ display:flex; align-items:center; gap:6px; font-size:13px; color:#334155; cursor:pointer; }
.cx-exp-col-grp{ margin-bottom:12px; }
.cx-exp-col-grp-lbl{ font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:#94a3b8; margin-bottom:6px; }
.cx-exp-col-row{ display:flex; align-items:center; gap:6px; font-size:13px; color:#334155; cursor:pointer; padding:3px 0; }
.cx-exp-out-box{ background:#f8fafc; border:1px solid #e2e8f0; border-radius:12px; padding:14px; }
.cx-exp-out-row{ display:flex; justify-content:space-between; align-items:center; font-size:13px; color:#334155; padding:4px 0; border-bottom:1px solid #f1f5f9; }
.cx-exp-out-row:last-child{ border-bottom:none; }

/* ── Responsive ── */
@media(max-width:1100px){
  .cx-kpi-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); }
  .cx-exp-layout{ grid-template-columns:1fr 1fr; }
  .cx-exp-out-panel{ grid-column:1/-1; border-left:none; border-top:1px solid #f1f5f9; }
}
@media(max-width:800px){
  .cx-kpi-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .cx-main-layout{ flex-direction:column; }
  .cx-insight-panel{ width:100%; position:static; max-height:none; }
  .cx-search-input{ width:180px; }
  .cx-hide-sm{ display:none; }
  .cx-pagebar{ flex-wrap:wrap; gap:10px; }
  .cx-pagebar-mid{ order:3; width:100%; text-align:center; }
  .cx-fullmodal-inner{ max-height:95vh; border-radius:12px; }
  .cx-stepper{ gap:4px; padding:10px 12px; }
  .cx-step-lbl{ display:none; }
  .cx-imp-sm-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); }
  .cx-exp-layout{ grid-template-columns:1fr; }
}
@media(max-width:540px){
  .cx-kpi-grid{ grid-template-columns:1fr 1fr; }
  .cx-topbar{ gap:10px; }
  .cx-topbar-actions{ gap:6px; }
  .cx-imp-sm-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}

/* ──────────────────────────────────────────────────────────
   Stock Adjustment Workspace  (sa = prefix)
   High Technology Minimal design language
────────────────────────────────────────────────────────── */
.sa-root{ display:flex; flex-direction:column; gap:0; }
.sa-topbar{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding:0 0 14px; flex-wrap:wrap; }
.sa-title{ font-size:22px; font-weight:800; color:#0f172a; letter-spacing:-.02em; margin:0; }
.sa-subtitle{ font-size:12px; color:#64748b; margin:2px 0 0; }
.sa-topbar-actions{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.sa-kpi-strip{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:14px; }
.sa-kpi-chip{ display:flex; align-items:center; gap:6px; border:1px solid #e2e8f0; border-radius:20px; padding:5px 12px; font-size:12px; font-weight:600; color:#475569; background:#fff; cursor:pointer; transition:all .12s; white-space:nowrap; }
.sa-kpi-chip:hover{ border-color:#93c5fd; color:#1d4ed8; background:#eff6ff; }
.sa-kpi-chip.sa-active{ border-color:#3b82f6; color:#1d4ed8; background:#dbeafe; }
.sa-kpi-chip .sa-kpi-n{ font-size:14px; font-weight:800; color:#0f172a; }
.sa-kpi-chip.sa-danger .sa-kpi-n{ color:#dc2626; }
.sa-split{ display:grid; grid-template-columns:340px 1fr; gap:12px; align-items:start; }
.sa-list-panel{ display:flex; flex-direction:column; gap:8px; }
.sa-list-filters{ display:flex; gap:6px; flex-wrap:wrap; }
.sa-doc-row{ border:1px solid #e2e8f0; border-radius:12px; padding:10px 12px; background:#fff; cursor:pointer; transition:border-color .12s,box-shadow .12s; }
.sa-doc-row:hover{ border-color:#93c5fd; box-shadow:0 2px 8px rgba(59,130,246,.08); }
.sa-doc-row.sa-selected{ border-color:#3b82f6; box-shadow:0 0 0 3px rgba(59,130,246,.12); background:#f0f7ff; }
.sa-doc-no{ font-size:12px; font-weight:700; color:#0f172a; font-family:monospace; }
.sa-doc-meta{ font-size:11px; color:#64748b; margin-top:2px; }
.sa-doc-pills{ display:flex; gap:4px; flex-wrap:wrap; margin-top:6px; align-items:center; }
.sa-doc-impact{ font-size:11px; font-weight:700; padding:2px 7px; border-radius:999px; }
.sa-doc-impact.sa-pos{ background:#dcfce7; color:#166534; }
.sa-doc-impact.sa-neg{ background:#fee2e2; color:#991b1b; }
.sa-doc-impact.sa-mix{ background:#fef9c3; color:#854d0e; }
.sa-list-empty{ text-align:center; padding:32px 16px; color:#94a3b8; font-size:13px; }
.sa-pill{ display:inline-flex; align-items:center; font-size:11px; font-weight:700; padding:2px 8px; border-radius:999px; letter-spacing:.03em; white-space:nowrap; }
.sa-pill.sa-draft{ background:#f1f5f9; color:#475569; border:1px solid #cbd5e1; }
.sa-pill.sa-approved{ background:#dbeafe; color:#1d4ed8; border:1px solid #93c5fd; }
.sa-pill.sa-posted{ background:#dcfce7; color:#166534; border:1px solid #86efac; }
.sa-pill.sa-voided{ background:#fee2e2; color:#991b1b; border:1px solid #fca5a5; }
.sa-pill.sa-pending{ background:#fef9c3; color:#854d0e; border:1px solid #fde047; }
.sa-workspace{ display:flex; flex-direction:column; gap:10px; }
.sa-ws-empty{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; padding:60px 20px; border:2px dashed #e2e8f0; border-radius:16px; background:#f8fafc; color:#94a3b8; }
.sa-ws-empty-icon{ font-size:36px; }
.sa-ws-empty-title{ font-size:16px; font-weight:700; color:#334155; }
.sa-card{ border:1px solid #e2e8f0; border-radius:14px; background:#fff; }
.sa-card-body{ padding:14px 16px; }
.sa-doc-header-grid{ display:grid; grid-template-columns:repeat(3,1fr) 1fr 1fr; gap:10px 16px; align-items:start; }
.sa-field-group{ display:flex; flex-direction:column; gap:3px; }
.sa-field-label{ font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:#94a3b8; }
.sa-field-value{ font-size:13px; font-weight:600; color:#0f172a; }
.sa-doc-status-bar{ display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; margin-top:12px; padding-top:12px; border-top:1px solid #f1f5f9; }
.sa-workflow-steps{ display:flex; align-items:center; gap:2px; flex-wrap:wrap; }
.sa-ws-step{ display:flex; align-items:center; gap:4px; font-size:11px; font-weight:600; color:#94a3b8; padding:2px 0; }
.sa-ws-step.sa-done{ color:#16a34a; }
.sa-ws-step.sa-current{ color:#2563eb; }
.sa-ws-step-dot{ width:8px; height:8px; border-radius:50%; background:#e2e8f0; flex-shrink:0; }
.sa-ws-step.sa-done .sa-ws-step-dot{ background:#16a34a; }
.sa-ws-step.sa-current .sa-ws-step-dot{ background:#2563eb; box-shadow:0 0 0 3px rgba(37,99,235,.2); }
.sa-ws-arrow{ color:#cbd5e1; margin:0 3px; font-size:10px; }
.sa-add-bar{ border:1px solid #e2e8f0; border-radius:14px; background:#f8fafc; padding:12px 14px; display:flex; gap:8px; align-items:flex-end; flex-wrap:wrap; }
.sa-add-bar .lbl{ flex:1; min-width:130px; }
.sa-search-wrap{ position:relative; flex:2; min-width:180px; }
.sa-search-results{ position:absolute; top:calc(100% + 4px); left:0; right:0; z-index:300; background:#fff; border:1px solid #e2e8f0; border-radius:10px; box-shadow:0 8px 24px rgba(15,23,42,.12); max-height:260px; overflow-y:auto; }
.sa-search-item{ padding:9px 12px; cursor:pointer; border-bottom:1px solid #f8fafc; }
.sa-search-item:last-child{ border-bottom:none; }
.sa-search-item:hover{ background:#eff6ff; }
.sa-si-name{ font-size:12px; font-weight:700; color:#0f172a; }
.sa-si-meta{ font-size:11px; color:#64748b; }
.sa-si-stock{ font-size:11px; font-weight:700; }
.sa-si-stock.ok{ color:#059669; }
.sa-si-stock.low{ color:#d97706; }
.sa-si-stock.zero{ color:#dc2626; }
.sa-lines-table{ width:100%; border-collapse:collapse; font-size:12px; }
.sa-lines-table th{ background:#f8fafc; color:#64748b; font-size:10px; text-transform:uppercase; letter-spacing:.06em; padding:8px 10px; font-weight:700; border-bottom:1px solid #e2e8f0; white-space:nowrap; position:sticky; top:0; z-index:1; }
.sa-lines-table th.r,.sa-lines-table td.r{ text-align:right; }
.sa-lines-table td{ padding:7px 10px; border-bottom:1px solid #f8fafc; vertical-align:middle; }
.sa-lines-table tr:last-child td{ border-bottom:none; }
.sa-lines-table tr:hover td{ background:#fafcff; }
.sa-cell-product{ font-weight:600; color:#0f172a; white-space:nowrap; max-width:130px; overflow:hidden; text-overflow:ellipsis; }
.sa-cell-variant{ font-size:11px; color:#64748b; }
.sa-delta-wrap{ display:flex; align-items:center; gap:4px; }
.sa-delta-btn{ width:22px; height:22px; border:1px solid #e2e8f0; border-radius:4px; background:#f8fafc; color:#475569; font-size:14px; font-weight:700; cursor:pointer; display:flex; align-items:center; justify-content:center; line-height:1; }
.sa-delta-btn:hover{ background:#dbeafe; border-color:#93c5fd; color:#1d4ed8; }
.sa-delta-input{ width:60px; height:28px; text-align:right; border:1px solid #cbd5e1; border-radius:6px; padding:0 5px; font-size:12px; font-weight:700; font-variant-numeric:tabular-nums; }
.sa-delta-input:focus{ outline:none; border-color:#3b82f6; box-shadow:0 0 0 2px rgba(59,130,246,.15); }
.sa-delta-input.sa-pos{ color:#16a34a; }
.sa-delta-input.sa-neg{ color:#dc2626; }
.sa-after-val{ font-weight:700; font-variant-numeric:tabular-nums; }
.sa-after-val.sa-warn{ color:#dc2626; }
.sa-impact-val{ font-variant-numeric:tabular-nums; font-size:11px; color:#64748b; }
.sa-btn-icon{ border:none; background:none; cursor:pointer; padding:4px; border-radius:4px; line-height:1; color:#94a3b8; }
.sa-btn-icon:hover{ background:#fee2e2; color:#dc2626; }
.sa-btn-icon.sa-has-note{ color:#2563eb; }
.sa-lines-empty{ padding:24px; text-align:center; color:#94a3b8; font-size:13px; }
.sa-summary-card{ border:1px solid #e2e8f0; border-radius:14px; background:#fff; padding:14px 16px; display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.sa-stats-row{ display:flex; gap:20px; flex-wrap:wrap; }
.sa-stat{ display:flex; flex-direction:column; gap:1px; }
.sa-stat-lbl{ font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:#94a3b8; }
.sa-stat-val{ font-size:18px; font-weight:800; color:#0f172a; font-variant-numeric:tabular-nums; }
.sa-stat-val.sa-green{ color:#16a34a; }
.sa-stat-val.sa-red{ color:#dc2626; }
.sa-action-btns{ display:flex; gap:8px; flex-wrap:wrap; }
.sa-rail{ border:1px solid #e2e8f0; border-radius:14px; background:#fff; padding:16px; display:flex; flex-direction:column; gap:10px; }
.sa-rail-sec-title{ font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:#94a3b8; margin:0 0 6px; }
.sa-rail-row{ display:flex; justify-content:space-between; align-items:baseline; gap:8px; font-size:12px; padding:2px 0; }
.sa-rail-k{ color:#64748b; }
.sa-rail-v{ font-weight:600; color:#0f172a; text-align:right; font-variant-numeric:tabular-nums; }
.sa-ledger-item{ display:flex; align-items:flex-start; gap:8px; padding:5px 0; border-bottom:1px solid #f8fafc; font-size:11px; }
.sa-ledger-item:last-child{ border-bottom:none; }
.sa-ledger-dot{ width:7px; height:7px; border-radius:50%; margin-top:3px; flex-shrink:0; }
.sa-ldot-in{ background:#16a34a; }
.sa-ldot-out{ background:#dc2626; }
.sa-ldot-adj{ background:#2563eb; }
.sa-warn-bar{ background:#fffbeb; border:1px solid #fde68a; border-radius:10px; padding:8px 12px; font-size:12px; color:#92400e; display:flex; align-items:center; gap:8px; }
.sa-mode-toggle{ display:flex; border:1px solid #e2e8f0; border-radius:8px; overflow:hidden; background:#fff; }
.sa-mode-btn{ border:none; border-right:1px solid #e2e8f0; background:transparent; padding:5px 11px; font-size:11px; font-weight:600; color:#64748b; cursor:pointer; }
.sa-mode-btn:last-child{ border-right:none; }
.sa-mode-btn.sa-active{ background:#dbeafe; color:#1d4ed8; }
.sa-audit-row{ display:flex; gap:10px; font-size:11px; padding:5px 0; border-bottom:1px solid #f8fafc; }
.sa-audit-row:last-child{ border-bottom:none; }
.sa-audit-state{ font-weight:700; color:#0f172a; }
.sa-audit-actor{ color:#64748b; }
.sa-audit-time{ color:#94a3b8; font-variant-numeric:tabular-nums; }
@media(max-width:1100px){
  .sa-split{ grid-template-columns:280px 1fr; }
  .sa-doc-header-grid{ grid-template-columns:1fr 1fr 1fr; }
}
@media(max-width:820px){
  .sa-split{ grid-template-columns:1fr; }
  .sa-list-panel{ max-height:260px; overflow-y:auto; }
  .sa-doc-header-grid{ grid-template-columns:1fr 1fr; }
}
@media(max-width:540px){
  .sa-doc-header-grid{ grid-template-columns:1fr; }
  .sa-summary-card{ flex-direction:column; align-items:flex-start; }
  .sa-action-btns{ width:100%; }
}

/* Inventory custom bounded pages (Stock Balance + Checkstock) */
.inv-page{ display:flex; flex-direction:column; gap:10px; }
.inv-kicker{ font-size:11px; color:#94a3b8; margin-bottom:2px; }
.inv-toolbar{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.inv-toolbar .input{ min-height:32px; font-size:12px; }
.inv-kpis{ display:flex; gap:10px; flex-wrap:wrap; }
.inv-kpi{ border:1px solid #e2e8f0; background:#fff; border-radius:12px; padding:10px 12px; min-width:140px; display:flex; flex-direction:column; gap:2px; }
.inv-kpi b{ font-size:18px; color:#0f172a; font-variant-numeric:tabular-nums; }
.inv-kpi span{ font-size:11px; color:#64748b; }
.inv-note{ border:1px solid #bae6fd; background:#f0f9ff; color:#0369a1; border-radius:10px; padding:8px 10px; font-size:12px; }
.inv-table-wrap{ overflow:auto; max-height:calc(100vh - 290px); }
.inv-state{ display:inline-flex; align-items:center; border-radius:999px; padding:2px 7px; font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.04em; border:1px solid #dbeafe; color:#1d4ed8; background:#eff6ff; }
.inv-state.low{ color:#b45309; background:#fffbeb; border-color:#fde68a; }
.inv-state.zero{ color:#b91c1c; background:#fee2e2; border-color:#fecaca; }
.inv-state.negative{ color:#fff; background:#dc2626; border-color:#dc2626; }
.sa-bulk-tools{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-top:-4px; margin-bottom:2px; }
.inv-import-panel{ border-style:dashed; }
.inv-import-summary{ font-size:12px; font-weight:800; color:#0f172a; margin:8px 0; }
.inv-bulk-input{ width:140px; min-height:28px; font-size:12px; }
.sa-line-note-editor{ border-style:dashed; border-color:#bfdbfe; background:#f8fbff; }

/* ERP pricing matrix (products_pricing) */
.pm-page .pm-toolbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:10px 0}
.pm-page .pm-meta{margin:6px 0 8px}
.pm-table-wrap{margin-top:4px}
.pm-matrix-table th.pm-col-highlight,.pm-matrix-table td.pm-col-highlight{background:#f8fbff}
.pm-price-edit{display:grid;gap:4px;min-width:120px}
.pm-price-val{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.pm-below-cost{color:#b91c1c;font-weight:700;font-size:12px}
.pm-channel-check{display:inline-flex;align-items:center;gap:4px;margin-right:8px;font-size:12px}
.pm-channel-dd summary{cursor:pointer;font-size:12px;font-weight:600}
.pm-channel-list{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.pm-warn{color:#b45309}
.pm-pager{margin-top:10px;justify-content:flex-end}
.pm-search-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;flex:1;min-width:280px}
.pm-search-input{min-width:260px;flex:1}
.pm-filter-label{display:flex;flex-direction:column;gap:4px;font-size:12px}
.pm-filter-summary{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:8px 0}
.pm-filter-chip{cursor:pointer}
.pm-channel-panel{display:flex;flex-direction:column;gap:6px;min-width:220px}
.pm-channel-panel-head{display:flex;flex-direction:column;gap:4px}
.pm-channel-chips{display:flex;gap:6px;flex-wrap:wrap}
.pm-channel-chip{background:#eff6ff;border-color:#bfdbfe;color:#1e40af}
.pm-profit-bar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:8px 0;padding:8px 10px;border:1px solid #dbeafe;border-radius:10px;background:#f8fbff}
.pm-price-card{border:1px solid #e2e8f0;border-radius:10px;padding:8px;background:#fff;display:grid;gap:6px;min-width:130px}
.pm-price-card-invalid{border-color:#fca5a5;background:#fef2f2}
.pm-price-card-title{font-weight:700;font-size:11px;color:#475569;text-transform:uppercase;letter-spacing:.04em}
.pm-active-row{display:flex;align-items:center;gap:6px}
.pm-action-stack{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.pm-margin-ok{font-weight:700;color:#166534}
.pm-row-editing{background:#fffbeb}
.pm-matrix-table .pm-sticky-left{position:sticky;left:0;z-index:2;background:#fff;box-shadow:2px 0 4px rgba(15,23,42,.06)}
.pm-matrix-table .pm-sticky-right{position:sticky;right:0;z-index:2;background:#fff;box-shadow:-2px 0 4px rgba(15,23,42,.06)}
.pm-matrix-table .pm-sticky-profit{position:sticky;right:120px;z-index:1}
.pm-matrix-table th.pm-sticky-left,.pm-matrix-table th.pm-sticky-right,.pm-matrix-table th.pm-sticky-profit{background:#f8fafc}
.pm-table-wrap{overflow:auto;max-height:calc(100vh - 320px)}
.pm-matrix-table th.pm-col-centered,.pm-matrix-table td.pm-col-centered{text-align:center;vertical-align:middle}
.pm-matrix-table .pm-sticky-left{text-align:left}
.pm-price-stack{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:52px;width:100%}
.pm-matrix-table .pm-price-val{justify-content:center}
.pm-profit-click{cursor:pointer}
.pm-profit-click:hover,.pm-matrix-table th.pm-profit-click:hover{background:#eff6ff}
.pm-matrix-table th.pm-col-highlight,.pm-matrix-table td.pm-col-highlight,.pm-price-stack.pm-col-highlight{background:#f8fbff;box-shadow:inset 0 0 0 2px #93c5fd}
.pm-tier-name{font-weight:600}
.pm-tier-meta{font-size:11px;color:#94a3b8}
.pm-profit-head{font-weight:700;line-height:1.2}
.pm-profit-based{font-size:11px;margin-top:2px;color:#64748b}