/* E-commerce Sales Analysis V44 — Clean Clarity
   Final override layer. Purpose: repair legacy neon/white table conflicts,
   tighten the CodeBucks-inspired hero, and prioritize readable dashboard data. */
:root{
  --e44-bg:#0b0c12;
  --e44-surface:#14151d;
  --e44-surface-2:#191a23;
  --e44-surface-3:#20212b;
  --e44-line:#3e404d;
  --e44-line-soft:#2d2f3a;
  --e44-text:#f8f8fb;
  --e44-text-2:#d6d7df;
  --e44-muted:#a7a9b6;
  --e44-purple:#7c3aed;
  --e44-purple-soft:#a78bfa;
  --e44-green:#86efac;
  --e44-red:#fda4af;
  --e44-amber:#fde68a;
}

/* ---------- HERO: cleaner, smaller, no overlap ---------- */
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-v42-command{
  display:block!important;
  position:relative!important;
  min-height:420px!important;
  margin:0 0 22px!important;
  padding:clamp(34px,4vw,62px)!important;
  overflow:hidden!important;
  border:1px solid #292b35!important;
  border-radius:18px!important;
  background:#0b0c12!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-v42-command::before{
  opacity:1!important;
  background:linear-gradient(90deg,#0b0c12 0%,#0b0c12 47%,rgba(11,12,18,.88) 58%,rgba(11,12,18,.20) 82%,transparent 100%)!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-v42-copy{
  position:relative!important;
  z-index:8!important;
  width:min(56%,670px)!important;
  max-width:670px!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-v42-title,
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-v42-title.neon-hero-title{
  max-width:14ch!important;
  color:#fff!important;
  font-size:clamp(2.35rem,4vw,4rem)!important;
  line-height:1.03!important;
  letter-spacing:-.048em!important;
  text-shadow:none!important;
  filter:none!important;
  text-transform:none!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-v42-subtitle{
  max-width:590px!important;
  margin-top:16px!important;
  color:#d1d2da!important;
  font-size:clamp(.94rem,1.1vw,1.05rem)!important;
  line-height:1.62!important;
  font-weight:560!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-v42-meta{
  margin-top:20px!important;
  gap:8px!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-v42-pill{
  min-height:32px!important;
  padding:7px 11px!important;
  border-color:#4a4c58!important;
  color:#e8e8ee!important;
  background:#23242d!important;
  font-size:.71rem!important;
}

/* Quick navigation is now a deliberate row, never pulled over description/meta. */
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-v42-nav{
  position:relative!important;
  z-index:9!important;
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  width:min(56%,670px)!important;
  max-width:670px!important;
  gap:9px!important;
  margin:22px 0 0!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-v42-nav button{
  min-height:62px!important;
  padding:11px 12px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:center!important;
  gap:4px!important;
  border:1px solid #454753!important;
  border-radius:12px!important;
  color:#fff!important;
  background:#1b1c24!important;
  transform:none!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-v42-nav button::after{
  content:"↗"!important;
  position:absolute!important;
  top:9px!important;
  right:10px!important;
  color:#9ea0ad!important;
  font-size:.8rem!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-v42-nav button:hover{
  border-color:#7451b9!important;
  background:#262230!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-v42-nav button[aria-current="page"]{
  border-color:#8b5cf6!important;
  background:#6d2ed8!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-v42-nav button strong{
  color:#fff!important;
  font-size:.74rem!important;
  line-height:1.2!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-v42-nav button span{
  color:#c8c9d2!important;
  font-size:.64rem!important;
  line-height:1.25!important;
}

/* Visual stays clearly on the right and no longer crowds the navigation. */
.ecom-v43-visual{right:0!important;width:48%!important;overflow:hidden!important;}
.ecom-v43-mobile{left:12%!important;width:min(48%,390px)!important;bottom:-2%!important;}
.ecom-v43-data-chip{right:5%!important;bottom:10%!important;}

/* ---------- MAIN TAB RAIL ---------- */
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [role="tablist"]{
  margin-top:0!important;
  padding:6px!important;
  gap:6px!important;
  border:1px solid #41434f!important;
  border-radius:12px!important;
  background:#22232c!important;
  box-shadow:none!important;
  scrollbar-color:#8052dc #22232c!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [role="tab"]{
  min-height:42px!important;
  padding:9px 13px!important;
  border:1px solid transparent!important;
  border-radius:9px!important;
  color:#d2d3db!important;
  background:transparent!important;
  font-size:.75rem!important;
  font-weight:750!important;
  letter-spacing:.01em!important;
  text-transform:none!important;
  box-shadow:none!important;
  transform:none!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [role="tab"][aria-selected="true"],
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [role="tab"][data-state="active"]{
  color:#fff!important;
  border-color:#8b5cf6!important;
  background:#7137dc!important;
}

/* ---------- UNIVERSAL TABLE RESET ----------
   Applies even before JS attributes are attached, so no legacy white cell can flash/persist. */
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table,
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table[data-ecom-table-v42="true"]{
  color:var(--e44-text)!important;
  background:#111219!important;
  border:0!important;
  border-collapse:separate!important;
  border-spacing:0!important;
  box-shadow:none!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table thead,
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table thead tr{
  background:#272832!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table thead tr > th:nth-child(n){
  padding:12px 13px!important;
  color:#f8f8fb!important;
  background:#272832!important;
  border:0!important;
  border-right:1px solid #454752!important;
  border-bottom:1px solid #565864!important;
  font-size:.70rem!important;
  font-weight:820!important;
  line-height:1.25!important;
  letter-spacing:.045em!important;
  text-transform:uppercase!important;
  text-shadow:none!important;
  opacity:1!important;
  white-space:nowrap!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table tbody tr:nth-child(odd),
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table tbody tr:nth-child(even){
  background:transparent!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table tbody tr > td:nth-child(n){
  padding:12px 13px!important;
  color:#ececf2!important;
  background:#13141b!important;
  border:0!important;
  border-right:1px solid #30323c!important;
  border-bottom:1px solid #343640!important;
  font-size:.79rem!important;
  font-weight:590!important;
  line-height:1.45!important;
  text-shadow:none!important;
  opacity:1!important;
  vertical-align:middle!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table tbody tr:nth-child(even) > td:nth-child(n){
  background:#181920!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table tbody tr:hover > td:nth-child(n),
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table[data-ecom-product-inventory-refs-v35="true"] tbody tr:hover > td:nth-child(n){
  color:#fff!important;
  background:#24212c!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table :is(th,td):last-child{border-right:0!important;}

/* Hard override for the exact white Inventory ID cells visible in V43 screenshots. */
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table[data-ecom-product-inventory-refs-v35="true"] tbody td:nth-child(2),
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table[data-ecom-product-inventory-refs-v35="true"] tbody tr:nth-child(odd) td:nth-child(2),
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table[data-ecom-product-inventory-refs-v35="true"] tbody tr:nth-child(even) td:nth-child(2),
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table[data-ecom-product-inventory-refs-v35="true"] tbody tr:hover td:nth-child(2){
  color:#f8f8fb!important;
  background:#171821!important;
  border-right:1px solid #30323c!important;
  border-bottom:1px solid #343640!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table[data-ecom-product-inventory-refs-v35="true"] tbody td:nth-child(2) *,
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table[data-ecom-product-inventory-refs-v35="true"] tbody td:nth-child(2) :is(span,strong,code,div,p,a){
  color:#f8f8fb!important;
  fill:currentColor!important;
  stroke:currentColor!important;
  opacity:1!important;
}

/* Product Category chip: no white-on-white badge. */
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table[data-ecom-product-inventory-refs-v35="true"] tbody td:nth-child(4) > :is(span,div,p,strong),
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table[data-ecom-product-inventory-refs-v35="true"] tbody td:nth-child(4) [class*="badge"],
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table[data-ecom-product-inventory-refs-v35="true"] tbody td:nth-child(4) [class*="rounded"]{
  display:inline-flex!important;
  align-items:center!important;
  min-height:25px!important;
  padding:4px 9px!important;
  color:#f7f2ff!important;
  background:#342651!important;
  border:1px solid #694a99!important;
  border-radius:999px!important;
  opacity:1!important;
  text-shadow:none!important;
  box-shadow:none!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table[data-ecom-product-inventory-refs-v35="true"] tbody td:nth-child(4) *{
  color:#f7f2ff!important;
  opacity:1!important;
}

/* Keep nested table copy visible without flattening semantic status colors. */
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table tbody td > :is(a,code,strong,p,div):not([data-ecom-status-v43]):not([data-ecom-status-v44]),
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table tbody td > span:not([data-ecom-status-v43]):not([data-ecom-status-v44]){
  color:#ececf2!important;
  opacity:1!important;
  text-shadow:none!important;
}

/* Numeric columns: JS adds this for better scanning. */
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table :is(th,td)[data-ecom-numeric-v44="true"]{
  text-align:right!important;
  font-variant-numeric:tabular-nums!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table td[data-ecom-key-v44="true"]{
  color:#fff!important;
  font-weight:760!important;
  font-variant-numeric:tabular-nums!important;
}

/* Actions are compact but legible. */
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table td :is(button,[role="button"]){
  min-width:38px!important;
  min-height:36px!important;
  padding:7px 9px!important;
  color:#f4f4f7!important;
  background:#24252e!important;
  border:1px solid #50525f!important;
  border-radius:10px!important;
  box-shadow:none!important;
  transform:none!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table td :is(button,[role="button"]):hover{
  color:#fff!important;
  background:#302a3d!important;
  border-color:#8056c4!important;
}

/* Table shell and touch helper stay dark, not white. */
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [data-ecom-table-shell-v42="true"],
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-table-touch-tools-v31{
  border-color:#444651!important;
  color:#e8e8ee!important;
  background:#111219!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-table-touch-tools-v31__label,
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [data-ecom-touch-label-readable-v39="true"]{
  color:#e8e8ee!important;
  background:#1b1c24!important;
  border:1px solid #484a56!important;
}

/* ---------- CARDS / COPY ---------- */
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .neon-card,
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .bg-card,
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [data-ecom-v42-card="true"]{
  color:var(--e44-text)!important;
  background:#15161e!important;
  border-color:#393b47!important;
  box-shadow:none!important;
  transform:none!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .neon-card :is(p,li,label,span):not([data-ecom-status-v43]):not([data-ecom-status-v44]){
  color:#d1d2da!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .neon-card :is(h1,h2,h3,h4,h5,h6,strong){
  color:#fff!important;
  text-shadow:none!important;
}

/* Restocking/cohort helper surfaces: dark high-contrast, no paper-white islands. */
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [data-ecom-restock-compact-v39="true"]{
  color:#fecdd3!important;
  background:#2a171c!important;
  border:1px solid #73303d!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [data-ecom-restock-compact-v39="true"] *{color:#fecdd3!important;}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [data-ecom-cohort-description-v39="true"]{
  color:#f7e8ae!important;
  background:#2b2617!important;
  border:1px solid #76642f!important;
}

/* ---------- RESPONSIVE ---------- */
@media(max-width:1120px){
  html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-v42-command{min-height:560px!important;padding-bottom:245px!important;}
  html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-v42-copy,
  html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-v42-nav{width:100%!important;max-width:720px!important;}
  .ecom-v43-visual{width:76%!important;height:48%!important;top:auto!important;bottom:0!important;right:-8%!important;}
  .ecom-v43-mobile{width:min(32%,300px)!important;left:30%!important;}
}
@media(max-width:760px){
  html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-v42-command{
    min-height:590px!important;
    padding:26px 18px 235px!important;
    border-radius:14px!important;
  }
  html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-v42-title,
  html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-v42-title.neon-hero-title{
    max-width:16ch!important;
    font-size:clamp(2rem,9vw,2.9rem)!important;
  }
  html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-v42-nav{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }
  html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-v42-nav button{min-height:58px!important;}
  .ecom-v43-visual{width:110%!important;height:40%!important;right:-24%!important;}
  .ecom-v43-mobile{width:200px!important;left:29%!important;bottom:-8%!important;}
  html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table{min-width:820px!important;}
  html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table thead tr > th:nth-child(n),
  html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table tbody tr > td:nth-child(n){padding:10px 11px!important;font-size:.75rem!important;}
}
@media(max-width:430px){
  html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-v42-command{min-height:610px!important;padding-bottom:225px!important;}
  html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-v42-nav button span{display:block!important;}
  html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-v42-nav button strong{font-size:.70rem!important;}
  html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-v42-nav button span{font-size:.58rem!important;}
  .ecom-v43-data-chip{display:none!important;}
}
