:root{
  --bg:#f7f7fb; --card:#ffffff; --text:#1f2937; --muted:#6b7280; --brand:#8b5cf6; --brand2:#f59e0b;
  --line:#e5e7eb; --blue:#e0f2fe; --yellow:#fef9c3; --green:#dcfce7; --red:#fee2e2;
}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:var(--text)}
.topbar{display:flex;justify-content:space-between;align-items:center;padding:18px 24px;background:linear-gradient(135deg,#5b21b6,#f59e0b);color:white;gap:16px}
.topbar h1{margin:0;font-size:24px}.topbar p{margin:4px 0 0;opacity:.9}.top-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
button,.import-label{border:0;border-radius:10px;padding:9px 12px;background:var(--brand);color:white;cursor:pointer;font-weight:600;box-shadow:0 1px 2px rgba(0,0,0,.12)}
button.secondary,.import-label{background:#eef2ff;color:#312e81;border:1px solid #c7d2fe}
button.danger{background:#dc2626}.import-label input{display:none}
.tabs{display:flex;gap:6px;padding:10px 14px;background:white;border-bottom:1px solid var(--line);overflow:auto;position:sticky;top:0;z-index:5}
.tabs button{background:#f3f4f6;color:#374151;box-shadow:none;white-space:nowrap}.tabs button.active{background:#4c1d95;color:white}
main{padding:18px}.tab-panel{display:none}.tab-panel.active{display:block}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px;margin-bottom:16px;box-shadow:0 6px 20px rgba(31,41,55,.04)}
.card h2,.card h3{margin:0 0 10px}.hint{color:var(--muted);font-size:13px;margin-top:4px}.grid{display:grid;gap:12px}.grid.kpi{grid-template-columns:repeat(4,minmax(150px,1fr))}.kpi-card{padding:14px;border-radius:14px;background:#f9fafb;border:1px solid var(--line)}.kpi-card .label{color:var(--muted);font-size:12px}.kpi-card .value{font-size:26px;font-weight:800;margin-top:6px}
.toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:8px 0 12px}.toolbar input,.toolbar select{padding:9px;border:1px solid var(--line);border-radius:9px;min-width:160px}
.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:12px;background:white}.data-table{border-collapse:separate;border-spacing:0;width:100%;font-size:13px;min-width:1100px}.data-table th{position:sticky;top:0;background:#111827;color:white;text-align:left;padding:9px;z-index:1;white-space:nowrap}.data-table td{border-top:1px solid var(--line);padding:6px;vertical-align:middle}.data-table tr:hover td{background:#fafafa}.data-table input,.data-table select{width:100%;min-width:80px;border:1px solid #d1d5db;border-radius:7px;padding:7px;background:white}.data-table .readonly{background:#f3f4f6;color:#374151}.data-table .manual{background:var(--blue)}.data-table .calc-yellow{background:var(--yellow)}.data-table .calc-green{background:var(--green)}.data-table .negative{color:#dc2626;font-weight:700}.data-table .positive{color:#047857;font-weight:700}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:16px}.notice{background:#fffbeb;border:1px solid #fde68a;padding:12px;border-radius:12px}.success{background:#ecfdf5;border-color:#a7f3d0}.error{background:#fef2f2;border-color:#fecaca}.small{font-size:12px;color:var(--muted)}
footer{padding:12px 18px;color:var(--muted);font-size:12px}
@media (max-width:900px){.topbar{align-items:flex-start;flex-direction:column}.grid.kpi{grid-template-columns:1fr 1fr}.two-col{grid-template-columns:1fr}}
button.secondary.dark{background:#6b7280;color:white;border:0}
.data-table.compact{min-width:700px}
.card .data-table.compact th{top:0}
.notice.success b{color:#047857}

/* v4 table usability */
:root{
  --sticky-sku-width: 280px;
  --sticky-product-width: 360px;
}
.table-wrap{max-height:72vh;}
.data-table th{top:0;}
.data-table .sticky-sku,
.data-table .sticky-product{
  position:sticky;
  background:#fff;
  z-index:3;
  box-shadow:2px 0 0 rgba(229,231,235,.9);
}
.data-table th.sticky-sku,
.data-table th.sticky-product{
  background:#111827;
  color:#fff;
  z-index:6;
}
.data-table .sticky-sku{
  left:0;
  min-width:var(--sticky-sku-width);
  width:var(--sticky-sku-width);
  max-width:var(--sticky-sku-width);
}
.data-table .sticky-product{
  left:var(--sticky-sku-width);
  min-width:var(--sticky-product-width);
  width:var(--sticky-product-width);
  max-width:var(--sticky-product-width);
}
.data-table tr:hover td.sticky-sku,
.data-table tr:hover td.sticky-product{background:#f9fafb;}
.data-table td.sticky-product.readonly{background:#f3f4f6;}
.data-table tr:hover td.sticky-product.readonly{background:#e5e7eb;}
.toolbar button.secondary.dark{white-space:nowrap;}

/* sticky SKU / Product polish */
.data-table td.sticky-sku,
.data-table td.sticky-product{
  overflow:visible;
}
.data-table td.sku-select-cell{
  padding:5px 8px;
}
.data-table .sku-dropdown{
  display:block;
  width:100%;
  min-width:0;
  height:36px;
  line-height:1.35;
  padding:7px 34px 7px 10px;
  border-radius:9px;
  border:1px solid #cbd5e1;
  background:#eff6ff;
  color:#0f172a;
  font-weight:600;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8);
}
.data-table .sku-dropdown:focus{
  outline:none;
  border-color:#8b5cf6;
  box-shadow:0 0 0 3px rgba(139,92,246,.14);
}
.data-table td.synced-product-cell{
  padding:5px 8px;
}
.synced-product-text{
  display:block;
  width:100%;
  height:36px;
  min-height:36px;
  padding:8px 10px;
  border-radius:9px;
  border:1px solid #e5e7eb;
  background:#f8fafc;
  color:#334155;
  font-weight:600;
  line-height:1.35;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  user-select:text;
  cursor:text;
}
.synced-product-text:focus{
  outline:none;
  border-color:#94a3b8;
  box-shadow:0 0 0 3px rgba(148,163,184,.16);
}


/* v5 usability: percent inputs and scroll preservation support */
.percent-input{display:flex;align-items:center;gap:4px;min-width:90px}
.percent-input input{min-width:70px!important;text-align:right}
.percent-input span{font-size:12px;color:#374151;font-weight:700}

/* v6 hide row function */
.inline-control{display:flex;align-items:center;gap:6px;background:#f9fafb;border:1px solid var(--line);border-radius:10px;padding:6px 8px;font-size:13px;color:#374151}
.inline-control select{min-width:80px!important;margin-left:2px}
.hidden-row td{background:#f9fafb!important;color:#9ca3af;opacity:.75}
.hidden-row td.sticky-sku,.hidden-row td.sticky-product{background:#f9fafb!important;color:#9ca3af}
.hidden-badge{display:inline-block;border-radius:999px;background:#e5e7eb;color:#4b5563;font-size:11px;font-weight:700;padding:3px 7px;margin-right:4px;vertical-align:middle}
.actions-cell{white-space:nowrap;min-width:170px}
.actions-cell button{margin:2px}

/* v7 hide column function */
.column-panel{margin:10px 0 12px;padding:12px;border:1px solid var(--line);border-radius:12px;background:#f9fafb}
.column-panel-head{display:flex;gap:12px;align-items:center;justify-content:space-between;margin-bottom:10px;color:#374151}
.column-panel-head span{font-size:12px;color:var(--muted)}
.column-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:8px}
.column-toggle{display:flex;align-items:center;gap:7px;background:white;border:1px solid var(--line);border-radius:10px;padding:8px 10px;font-size:13px}
.column-toggle input{width:auto!important;min-width:auto!important}
.column-toggle.locked{opacity:.65;background:#f3f4f6}
.column-toggle em{margin-left:auto;font-size:11px;color:#6b7280;font-style:normal;background:#e5e7eb;border-radius:999px;padding:2px 6px}
.col-hidden{display:none!important}

/* v8 summary panels */
.summary-panel{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px;margin:0 0 16px;box-shadow:0 6px 20px rgba(31,41,55,.04)}
.summary-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:12px}
.summary-head h3{margin:0 0 4px}
.summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;margin-bottom:12px}
.summary-card{border:1px solid var(--line);border-radius:14px;background:#f9fafb;padding:11px 12px;min-height:74px}
.summary-card.highlight{background:var(--green);border-color:#bbf7d0}
.summary-card.soft{background:#eff6ff;border-color:#bfdbfe}
.summary-card.danger{background:var(--red);border-color:#fecaca}
.summary-label{font-size:12px;color:var(--muted);font-weight:700;line-height:1.25}
.summary-value{font-size:18px;font-weight:800;margin-top:6px;color:#111827;word-break:break-word}
.summary-card .negative,.summary-value.negative{color:#dc2626}
.summary-card .positive,.summary-value.positive{color:#047857}
.summary-table-wrap{overflow:auto;border:1px solid var(--line);border-radius:12px;background:#fff;max-height:220px}
.summary-table{min-width:520px!important;font-size:12px}
.summary-table th{top:0}
.toolbar .inline-control select{min-width:220px!important}


/* v9 Promo ID summary selection */
.selected-badge{display:inline-block;border-radius:999px;background:#ede9fe;color:#5b21b6;font-size:11px;font-weight:800;padding:3px 7px;margin-right:4px;vertical-align:middle;border:1px solid #ddd6fe}
.selected-summary{border-color:#c4b5fd;box-shadow:0 8px 26px rgba(91,33,182,.08)}
.actions-cell .selected-badge + button{margin-left:2px}


/* Cloud sync */
.cloud-panel .login-grid{
  display:grid;
  grid-template-columns: minmax(220px, 1fr) minmax(220px, 1fr) auto;
  gap:10px;
  align-items:end;
}
.cloud-panel label{font-size:13px;color:#475569;display:flex;flex-direction:column;gap:6px;}
.cloud-panel input{padding:10px 12px;border:1px solid #cbd5e1;border-radius:10px;}
.sync-status-pill{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;background:#eef2ff;color:#3730a3;font-weight:700;font-size:12px;}
.sync-status-pill.off{background:#fee2e2;color:#991b1b;}
.sync-status-pill.on{background:#dcfce7;color:#166534;}
.cloud-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:12px;}
.cloud-note{font-size:13px;color:#64748b;line-height:1.55;}
.cloud-warning{background:#fff7ed;border:1px solid #fed7aa;color:#9a3412;border-radius:12px;padding:12px;margin-top:12px;}
@media(max-width: 760px){.cloud-panel .login-grid{grid-template-columns:1fr}.cloud-actions button{width:100%;}}


/* v17 branding + summary filters */
.brand-wrap{display:flex;align-items:center;gap:14px;min-width:0}
.brand-logo{width:120px;max-width:28vw;height:auto;display:block;filter:drop-shadow(0 3px 10px rgba(0,0,0,.16))}
.dashboard-hero{display:grid;grid-template-columns:minmax(180px,220px) 1fr;gap:18px;align-items:center}
.dashboard-hero-logo{max-width:210px;width:100%;height:auto;display:block;margin:auto}
.dashboard-hero h2{font-size:28px;margin-bottom:8px}
.dashboard-hero p{font-size:14px;line-height:1.6;margin:0;color:#374151}
.summary-toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:10px 0 12px}
.summary-toolbar input,.summary-toolbar select{padding:9px;border:1px solid var(--line);border-radius:9px;min-width:220px;background:white}
.summary-meta{font-size:12px;color:var(--muted);margin-left:auto}
@media (max-width:900px){.brand-wrap{align-items:flex-start}.brand-logo{width:90px}.dashboard-hero{grid-template-columns:1fr}.dashboard-hero-logo{max-width:180px}}


/* v18 mobile-friendly refinements */
@media (max-width: 760px){
  body{font-size:14px}
  main{padding:10px}
  .topbar{padding:14px 12px;gap:10px}
  .topbar h1{font-size:20px}
  .topbar p{font-size:12px;line-height:1.35}
  .brand-logo{width:78px;max-width:30vw}
  .top-actions{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .top-actions button,.top-actions .import-label{width:100%;text-align:center}
  .tabs{gap:4px;padding:8px;top:0}
  .tabs button{padding:8px 10px;font-size:12px}
  .card{padding:12px;border-radius:12px;margin-bottom:10px}
  .toolbar{display:grid;grid-template-columns:1fr;gap:8px}
  .toolbar button,.toolbar input,.toolbar select,.toolbar .inline-control{width:100%;min-width:0!important}
  .grid.kpi{grid-template-columns:1fr 1fr;gap:8px}
  .kpi-card{padding:10px}
  .kpi-card .value{font-size:20px}
  .summary-grid{grid-template-columns:1fr 1fr;gap:8px}
  .summary-card{padding:9px;min-height:64px}
  .summary-value{font-size:15px}
  .summary-head{flex-direction:column;gap:8px}
  .summary-toolbar{display:grid;grid-template-columns:1fr;gap:8px}
  .summary-toolbar input,.summary-toolbar button,.summary-toolbar select{width:100%;min-width:0}
  .summary-meta{margin-left:0}
  .table-wrap{max-height:65vh;border-radius:10px}
  .data-table{font-size:12px}
  .data-table input,.data-table select{font-size:12px;padding:6px}
  :root{--sticky-sku-width:190px;--sticky-product-width:240px}
  .actions-cell{min-width:210px}
  .dashboard-hero h2{font-size:22px}
  .dashboard-hero-logo{max-width:150px}
  .cloud-panel .login-grid{grid-template-columns:1fr}
  .cloud-actions{display:grid;grid-template-columns:1fr;gap:8px}
  .column-grid{grid-template-columns:1fr}
}

@media (max-width: 430px){
  .grid.kpi,.summary-grid{grid-template-columns:1fr}
  .top-actions{grid-template-columns:1fr}
  .data-table .sticky-product{display:none}
  .data-table th.sticky-product{display:none}
  :root{--sticky-sku-width:190px;--sticky-product-width:240px}
}


/* v19 summary card filter */
.summary-card-filter{
  border:1px dashed #d8b4fe;
  background:#faf5ff;
  border-radius:12px;
  padding:10px 12px;
  margin:10px 0 12px;
}
.summary-card-filter summary{
  cursor:pointer;
  font-weight:800;
  color:#5b21b6;
  user-select:none;
}
.summary-card-filter-body{margin-top:10px}
.summary-card-toggle-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  gap:8px;
}
.summary-card-toggle{
  display:flex;
  align-items:center;
  gap:7px;
  background:white;
  border:1px solid var(--line);
  border-radius:10px;
  padding:8px 10px;
  font-size:13px;
}
.summary-card-toggle input{
  width:auto!important;
  min-width:auto!important;
}
.toolbar.mini{
  margin:10px 0 0;
}
@media (max-width:760px){
  .summary-card-toggle-grid{grid-template-columns:1fr}
  .summary-card-filter{padding:9px}
}


/* v20 clean layout */
.topbar .brand-wrap p{display:none!important}
.dashboard-hero{grid-template-columns:minmax(140px,190px) 1fr}
.dashboard-hero h2{margin:0;font-size:28px}
.dashboard-hero p,.dashboard-hero .hint{display:none!important}
.card h2 + .hint,.card h2 + p.hint{display:none!important}
@media (max-width:760px){
  .dashboard-hero{grid-template-columns:1fr}
  .dashboard-hero h2{text-align:center}
}


/* v22 collapsible summary card filter */
.summary-card-filter{
  padding:0!important;
  overflow:hidden;
}
.summary-card-filter-head{
  cursor:pointer;
  padding:10px 12px;
  margin-bottom:0!important;
  user-select:none;
}
.summary-card-filter-head::marker{
  color:#5b21b6;
}
.summary-card-filter[open] .summary-card-filter-head{
  border-bottom:1px solid #e9d5ff;
  margin-bottom:0!important;
}
.summary-card-filter-body{
  padding:10px 12px 12px;
}


/* v23 table header filters */
.table-filter-row td{
  position:sticky;
  top:36px;
  background:#f8fafc!important;
  z-index:5;
  border-top:1px solid #374151;
  padding:5px!important;
}
.table-filter-row td.sticky-sku,
.table-filter-row td.sticky-product{
  background:#f8fafc!important;
  z-index:8;
}
.table-filter-row .header-filter{
  width:100%;
  min-width:90px;
  border:1px solid #cbd5e1;
  border-radius:8px;
  padding:6px 7px;
  background:#fff;
  color:#111827;
  font-size:12px;
}
.table-filter-row .filter-blank{
  background:#f1f5f9!important;
  min-width:60px;
}
.data-table th{height:36px}
@media (max-width:760px){
  .table-filter-row td{top:34px}
  .table-filter-row .header-filter{font-size:12px;padding:5px}
}


/* v27 no-jump blank filter fix
   When filters return 0 rows, the table content becomes short.
   These fixed table areas prevent the whole page from jumping upward. */
#sku > .table-wrap,
#importLog > .table-wrap,
#promoMargin > .table-wrap,
#promoMarkup > .table-wrap,
#shipping > .table-wrap{
  height:72vh;
  min-height:520px;
  max-height:72vh;
  overflow:auto;
  overscroll-behavior:contain;
}

#sku > .table-wrap table,
#importLog > .table-wrap table,
#promoMargin > .table-wrap table,
#promoMarkup > .table-wrap table,
#shipping > .table-wrap table{
  min-height:100%;
}

@media (max-width:760px){
  #sku > .table-wrap,
  #importLog > .table-wrap,
  #promoMargin > .table-wrap,
  #promoMarkup > .table-wrap,
  #shipping > .table-wrap{
    height:68vh;
    min-height:420px;
    max-height:68vh;
  }
}


/* v1.0 release footer */
.app-footer{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  padding:12px 18px;
  color:var(--muted);
  font-size:12px;
  border-top:1px solid var(--line);
  background:#fff;
}
.app-footer .copyright{
  color:#6b7280;
  white-space:nowrap;
}
@media (max-width:760px){
  .app-footer{
    flex-direction:column;
    align-items:flex-start;
  }
  .app-footer .copyright{
    white-space:normal;
  }
}

/* V1.0 role permission badge */
.role-pill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 10px;
  border-radius:999px;
  background:#eef2ff;
  color:#3730a3;
  border:1px solid #c7d2fe;
  font-size:12px;
  font-weight:700;
  white-space:nowrap;
}
body[data-role="view"] .topbar{
  border-bottom-color:#bfdbfe;
}
body[data-role="view"] input[disabled],
body[data-role="view"] select[disabled],
body[data-role="view"] textarea[disabled]{
  background:#f8fafc;
  color:#64748b;
}


/* V1.0 login cloud download prompt */
.login-cloud-prompt-overlay{
  position:fixed;
  inset:0;
  z-index:99999;
  background:rgba(15,23,42,.50);
  backdrop-filter:blur(5px);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
}
.login-cloud-prompt-card{
  width:min(560px, calc(100vw - 32px));
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:22px;
  box-shadow:0 24px 80px rgba(15,23,42,.28);
  padding:24px;
  color:#111827;
}
.login-cloud-prompt-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
}
.login-cloud-prompt-kicker{
  font-size:12px;
  font-weight:900;
  color:#7c3aed;
  letter-spacing:.08em;
  text-transform:uppercase;
  margin-bottom:6px;
}
.login-cloud-prompt-card h2{
  margin:0;
  font-size:23px;
  line-height:1.2;
}
.login-cloud-x{
  width:34px;
  height:34px;
  border-radius:999px;
  padding:0;
  line-height:1;
  background:#f3f4f6;
  color:#374151;
  border:1px solid #e5e7eb;
  box-shadow:none;
  font-size:22px;
}
.login-cloud-prompt-text{
  color:#4b5563;
  line-height:1.55;
  margin:16px 0 14px;
}
.login-cloud-save-box{
  display:flex;
  flex-direction:column;
  gap:4px;
  background:linear-gradient(135deg,#f5f3ff,#fff7ed);
  border:1px solid #ddd6fe;
  border-radius:16px;
  padding:14px 16px;
  margin:14px 0;
}
.login-cloud-save-box span{
  font-size:12px;
  font-weight:900;
  color:#6b7280;
  text-transform:uppercase;
  letter-spacing:.06em;
}
.login-cloud-save-box b{
  font-size:17px;
  color:#111827;
}
.login-cloud-save-box em{
  font-style:normal;
  color:#6b7280;
  font-size:12px;
}
.login-cloud-error{
  background:#fef2f2;
  color:#991b1b;
  border:1px solid #fecaca;
  border-radius:12px;
  padding:10px 12px;
  font-size:13px;
  margin:12px 0;
}
.login-cloud-prompt-actions{
  display:flex;
  gap:10px;
  margin-top:16px;
}
.login-cloud-prompt-actions button{
  flex:1;
}
.login-cloud-footnote{
  margin:12px 0 0;
  color:#6b7280;
  font-size:12px;
}
@media(max-width:640px){
  .login-cloud-prompt-actions{flex-direction:column;}
  .login-cloud-prompt-card{padding:20px;}
}
.subtle{
  display:block;
  font-size:11px;
  font-weight:600;
  color:#6b7280;
  line-height:1.2;
  margin-top:2px;
}

.shared-locked-field{background:#f3f4f6!important;color:#374151!important;border-color:#e5e7eb!important;cursor:not-allowed;font-weight:600;}
.shared-lock-badge{display:inline-block;font-size:11px;padding:2px 6px;border-radius:999px;background:#eef2ff;color:#3730a3;margin-left:4px;}

/* Shared SKU status badges */
.sku-status-badge{display:inline-block;border-radius:999px;font-size:11px;font-weight:800;padding:3px 8px;border:1px solid #d1d5db;background:#f3f4f6;color:#374151;white-space:nowrap;}
.sku-status-badge.active{background:#dcfce7;color:#166534;border-color:#bbf7d0;}
.sku-status-badge.inactive{background:#fee2e2;color:#991b1b;border-color:#fecaca;}
.mini-summary{margin:10px 0;}
.negative-card .summary-value{color:#b91c1c;}


/* v18.1 one-key Refresh Latest Data button - visible, not white */
.refresh-latest-btn{
  background:linear-gradient(135deg,#2563eb,#7c3aed)!important;
  color:#ffffff!important;
  border:0!important;
  box-shadow:0 6px 16px rgba(37,99,235,.22)!important;
}
.refresh-latest-btn:disabled{
  opacity:.62;
  cursor:not-allowed;
}

/* v18.2 planner SKU dropdowns synced from Shared SKU Master */
.data-table select.sku-dropdown{min-width:240px;max-width:360px;font-weight:700;background:#eef6ff!important;color:#111827!important;}
.notice-inline{display:inline-flex;align-items:center;border:1px solid #bfdbfe;background:#eff6ff;color:#1e3a8a;border-radius:999px;padding:7px 11px;font-size:12px;font-weight:800;}


/* owner row lock */
.locked-row td{
  background:#fff7ed!important;
}
.locked-row td.sticky-sku,
.locked-row td.sticky-product{
  background:#fff7ed!important;
}
.locked-badge{
  display:inline-block;
  border-radius:999px;
  background:#fed7aa;
  color:#9a3412;
  font-size:11px;
  font-weight:800;
  padding:3px 7px;
  margin-right:4px;
  vertical-align:middle;
  border:1px solid #fdba74;
}
.row-lock-control{
  display:inline-flex;
  align-items:center;
  gap:5px;
  border:1px solid #fdba74;
  background:#fff7ed;
  color:#9a3412;
  border-radius:999px;
  padding:4px 8px;
  margin:2px;
  font-size:12px;
  font-weight:800;
  white-space:nowrap;
  vertical-align:middle;
}
.row-lock-control input{
  width:auto!important;
  min-width:auto!important;
  margin:0;
  accent-color:#f59e0b;
}
.row-lock-control input:disabled + span{
  opacity:.75;
}
.data-table input:disabled,
.data-table select:disabled,
.data-table textarea:disabled{
  cursor:not-allowed;
}


/* v18.4 owner sensitive view */
.owner-only-panel .notice{font-size:14px;line-height:1.55}
.staff-promo-summary .notice{margin:0}
.small-role{font-size:16px!important;line-height:1.2;word-break:normal}
body[data-role="staff"] .owner-sensitive,
body[data-role="admin"] .owner-sensitive,
body[data-role="view"] .owner-sensitive{display:none!important}
.view-only-build .top-actions #saveBtn,
.view-only-build .top-actions #resetBtn,
.view-only-build .top-actions #exportBtn,
.view-only-build .top-actions .import-label{display:none!important}


/* Staff/view dashboard filters */
.staff-filter-bar{
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
  margin:8px 0 10px;
}
.staff-filter-bar input{
  min-width:260px;
  max-width:520px;
  width:min(520px, 100%);
  padding:10px 12px;
  border:1px solid #cbd5e1;
  border-radius:10px;
  background:#fff;
  color:#111827;
}
@media (max-width:760px){
  .staff-filter-bar input{width:100%;min-width:0;}
}


/* Staff one-filter dashboard */
.staff-dashboard-search .staff-filter-bar{
  display:flex;
  gap:8px;
  align-items:center;
  flex-wrap:wrap;
}
.staff-dashboard-search .staff-filter-bar input{
  min-width:min(420px,100%);
  flex:1;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:10px;
  background:#fff;
}
@media(max-width:760px){
  .staff-dashboard-search .staff-filter-bar{display:grid;grid-template-columns:1fr;gap:8px}
  .staff-dashboard-search .staff-filter-bar input,.staff-dashboard-search .staff-filter-bar button{width:100%;min-width:0}
}


/* Combined desktop shell: hide inner app header/logo so only one main top bar is shown. */
.topbar{display:none!important;}
.tabs{top:0!important;}


/* Tablet V1.0 desktop-template: 10-row pagination + safe scroll */
html, body{
  height:auto!important;
  min-height:100%!important;
  overflow:auto!important;
  -webkit-overflow-scrolling:touch!important;
}
main{padding:12px!important;padding-bottom:90px!important;}
.table-wrap{
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  overflow-x:auto!important;
  overflow-y:visible!important;
  -webkit-overflow-scrolling:touch!important;
}
.data-table tr.gi2-page-hidden{display:none!important;}
.gi2-table-pagination{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:9px 10px 12px;
  margin:0 0 14px;
  background:#fff;
  border:1px solid #e5e7eb;
  border-top:0;
  border-radius:0 0 12px 12px;
  color:#475569;
  font-size:12px;
}
.gi2-page-info{font-weight:800;line-height:1.35;}
.gi2-page-actions{display:flex;gap:6px;align-items:center;flex-wrap:wrap;}
.gi2-table-pagination button{padding:7px 10px;border-radius:9px;box-shadow:none;min-width:34px;}
.gi2-page-number{background:#eef2ff!important;color:#312e81!important;border:1px solid #c7d2fe!important;}
.gi2-page-number.active{background:#4c1d95!important;color:#fff!important;border-color:#4c1d95!important;}
.gi2-page-ellipsis{padding:0 3px;color:#64748b;font-weight:800;}
.gi2-table-pagination button:disabled{opacity:.6;cursor:not-allowed;}
.data-table .sticky-sku{
  left:0!important;
  width:200px!important;
  min-width:200px!important;
  max-width:200px!important;
  text-align:left!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.data-table th.sticky-sku{z-index:60!important;background:#111827!important;color:#fff!important;}
.data-table td.sticky-sku{z-index:40!important;background:#fff!important;box-shadow:2px 0 0 rgba(229,231,235,.95), 8px 0 14px rgba(15,23,42,.06)!important;}
.data-table td.sticky-sku select,
.data-table td.sticky-sku input,
.data-table .sku-dropdown{width:100%!important;max-width:100%!important;min-width:0!important;text-align:left!important;}
@media(max-width:900px){
  .gi2-table-pagination{align-items:stretch;flex-direction:column;}
  .gi2-page-actions{display:flex;gap:6px;flex-wrap:wrap;}
  .toolbar{display:flex!important;gap:8px!important;flex-wrap:wrap!important;}
  .toolbar button,.toolbar input,.toolbar select,.toolbar .inline-control{width:auto!important;min-width:140px!important;}
}


/* Tablet V1.0 fixed paginator + stable horizontal scroll (final override)
   - One table page = 10 rows
   - Only SKU is sticky on the left
   - Product column is NOT sticky to avoid left-offset/table misalignment
   - Table body no vertical inner scroll; table area only scrolls horizontally */
html, body{
  height:100%!important;
  min-height:100%!important;
  overflow:auto!important;
  -webkit-overflow-scrolling:touch!important;
}
main{
  padding:12px!important;
  padding-bottom:110px!important;
  overflow:visible!important;
}
.tab-panel{overflow:visible!important;}
.table-wrap{
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  overflow-x:auto!important;
  overflow-y:visible!important;
  -webkit-overflow-scrolling:touch!important;
  overscroll-behavior-x:contain!important;
  border-radius:12px 12px 0 0!important;
}
.table-wrap .data-table{
  min-width:1180px!important;
  table-layout:auto!important;
}
.data-table tr.gi2-page-hidden{display:none!important;}
/* Disable product sticky completely on tablet to stop column drift */
.data-table .sticky-product,
.data-table th.sticky-product,
.data-table td.sticky-product,
.table-filter-row td.sticky-product{
  position:static!important;
  left:auto!important;
  z-index:auto!important;
  min-width:240px!important;
  width:240px!important;
  max-width:320px!important;
  box-shadow:none!important;
}
.data-table th.sticky-product{background:#111827!important;color:#fff!important;}
.data-table td.sticky-product{background:#fff!important;}
.data-table td.sticky-product.readonly{background:#f3f4f6!important;}
/* Keep SKU fixed and tidy */
.data-table .sticky-sku,
.data-table th.sticky-sku,
.data-table td.sticky-sku,
.table-filter-row td.sticky-sku{
  position:sticky!important;
  left:0!important;
  min-width:210px!important;
  width:210px!important;
  max-width:210px!important;
  text-align:left!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.data-table th.sticky-sku{
  z-index:80!important;
  background:#111827!important;
  color:#fff!important;
}
.data-table td.sticky-sku,
.table-filter-row td.sticky-sku{
  z-index:60!important;
  background:#fff!important;
  box-shadow:2px 0 0 rgba(229,231,235,.95), 10px 0 16px rgba(15,23,42,.08)!important;
}
.table-filter-row td.sticky-sku{background:#f8fafc!important;}
.data-table td.sticky-sku select,
.data-table td.sticky-sku input,
.data-table .sku-dropdown{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  text-align:left!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.gi2-table-pagination{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
  padding:10px 11px 13px!important;
  margin:0 0 16px!important;
  background:#fff!important;
  border:1px solid #e5e7eb!important;
  border-top:0!important;
  border-radius:0 0 12px 12px!important;
  color:#475569!important;
  font-size:12px!important;
}
.gi2-page-info{font-weight:800!important;line-height:1.35!important;}
.gi2-page-actions{display:flex!important;gap:6px!important;align-items:center!important;flex-wrap:wrap!important;}
.gi2-table-pagination button{
  padding:7px 10px!important;
  border-radius:9px!important;
  box-shadow:none!important;
  min-width:42px!important;
  white-space:nowrap!important;
}
.gi2-page-number{background:#eef2ff!important;color:#312e81!important;border:1px solid #c7d2fe!important;}
.gi2-page-number.active{background:#4c1d95!important;color:#fff!important;border-color:#4c1d95!important;}
.gi2-page-ellipsis{padding:0 3px!important;color:#64748b!important;font-weight:800!important;}
.gi2-table-pagination button:disabled{opacity:.6!important;cursor:not-allowed!important;}
@media(max-width:900px){
  .table-wrap .data-table{min-width:1080px!important;}
  .data-table .sticky-sku,
  .data-table th.sticky-sku,
  .data-table td.sticky-sku,
  .table-filter-row td.sticky-sku{min-width:190px!important;width:190px!important;max-width:190px!important;}
  .gi2-table-pagination{align-items:stretch!important;flex-direction:column!important;}
  .gi2-page-actions{justify-content:flex-start!important;}
  .toolbar{display:flex!important;gap:8px!important;flex-wrap:wrap!important;}
  .toolbar button,.toolbar input,.toolbar select,.toolbar .inline-control{width:auto!important;min-width:120px!important;}
}


/* Tablet V1.0 5-row pagination + no-overlap final override
   - Every main table shows max 5 visible rows per page
   - Page buttons stay below the table
   - Table area scrolls left/right only; page/iframe handles up/down
   - Disable sticky table headers/filter rows to stop covering content */
html, body{
  height:100%!important;
  min-height:0!important;
  overflow:auto!important;
  -webkit-overflow-scrolling:touch!important;
}
main{
  position:relative!important;
  z-index:0!important;
  padding:10px!important;
  padding-bottom:140px!important;
  overflow:visible!important;
}
.card,.summary-panel,.column-panel,.notice{
  position:relative!important;
  z-index:1!important;
  overflow:visible!important;
}
.tab-panel{position:relative!important;overflow:visible!important;}
.table-wrap{
  position:relative!important;
  z-index:1!important;
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  -webkit-overflow-scrolling:touch!important;
  overscroll-behavior-x:contain!important;
  border-radius:12px 12px 0 0!important;
  margin-bottom:0!important;
  background:#fff!important;
}
.table-wrap .data-table{
  min-width:1160px!important;
  table-layout:auto!important;
}
.data-table th,
.table-filter-row td{
  position:static!important;
  top:auto!important;
}
.table-filter-row td{z-index:auto!important;}
/* Product column must scroll normally on tablet. */
.data-table .sticky-product,
.data-table th.sticky-product,
.data-table td.sticky-product,
.table-filter-row td.sticky-product{
  position:static!important;
  left:auto!important;
  z-index:auto!important;
  min-width:240px!important;
  width:240px!important;
  max-width:330px!important;
  box-shadow:none!important;
}
.data-table th.sticky-product{background:#111827!important;color:#fff!important;}
.data-table td.sticky-product{background:#fff!important;}
.data-table td.sticky-product.readonly{background:#f3f4f6!important;}
/* Keep only SKU sticky horizontally. */
.data-table .sticky-sku,
.data-table th.sticky-sku,
.data-table td.sticky-sku,
.table-filter-row td.sticky-sku{
  position:sticky!important;
  left:0!important;
  min-width:190px!important;
  width:190px!important;
  max-width:190px!important;
  text-align:left!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.data-table th.sticky-sku{
  z-index:8!important;
  background:#111827!important;
  color:#fff!important;
}
.data-table td.sticky-sku,
.table-filter-row td.sticky-sku{
  z-index:7!important;
  background:#fff!important;
  box-shadow:2px 0 0 rgba(229,231,235,.95), 8px 0 12px rgba(15,23,42,.08)!important;
}
.table-filter-row td.sticky-sku{background:#f8fafc!important;}
.data-table td.sticky-sku select,
.data-table td.sticky-sku input,
.data-table .sku-dropdown{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  text-align:left!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.data-table tr.gi2-page-hidden{display:none!important;}
.gi2-table-pagination{
  position:relative!important;
  z-index:2!important;
  clear:both!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
  padding:9px 10px 12px!important;
  margin:0 0 18px!important;
  background:#fff!important;
  border:1px solid #e5e7eb!important;
  border-top:0!important;
  border-radius:0 0 12px 12px!important;
  color:#475569!important;
  font-size:12px!important;
}
.gi2-page-info{font-weight:800!important;line-height:1.35!important;}
.gi2-page-actions{display:flex!important;gap:6px!important;align-items:center!important;flex-wrap:wrap!important;}
.gi2-table-pagination button{
  padding:7px 10px!important;
  border-radius:9px!important;
  box-shadow:none!important;
  min-width:42px!important;
  white-space:nowrap!important;
}
.gi2-page-number{background:#eef2ff!important;color:#312e81!important;border:1px solid #c7d2fe!important;}
.gi2-page-number.active{background:#4c1d95!important;color:#fff!important;border-color:#4c1d95!important;}
.gi2-page-ellipsis{padding:0 3px!important;color:#64748b!important;font-weight:800!important;}
.gi2-table-pagination button:disabled{opacity:.6!important;cursor:not-allowed!important;}
@media(max-width:900px){
  .table-wrap .data-table{min-width:1080px!important;}
  .data-table .sticky-sku,
  .data-table th.sticky-sku,
  .data-table td.sticky-sku,
  .table-filter-row td.sticky-sku{min-width:170px!important;width:170px!important;max-width:170px!important;}
  .gi2-table-pagination{align-items:stretch!important;flex-direction:column!important;}
  .gi2-page-actions{justify-content:flex-start!important;}
  .toolbar{display:flex!important;gap:8px!important;flex-wrap:wrap!important;}
  .toolbar button,.toolbar input,.toolbar select,.toolbar .inline-control{width:auto!important;min-width:110px!important;}
}