/* E-commerce Sales Analysis V45 — Dynamic Readable UI
   Final override layer: clearer generator cards, semantic inventory statuses,
   cleaner table controls, and a calmer CodeBucks-inspired dark interface. */
:root{
  --e45-bg:#0b0c12;
  --e45-panel:#14151d;
  --e45-panel-2:#191a23;
  --e45-panel-3:#22232d;
  --e45-border:#3d3f4c;
  --e45-border-strong:#555866;
  --e45-text:#f7f7fb;
  --e45-text-2:#d8d9e2;
  --e45-muted:#aeb0bd;
  --e45-purple:#7c3aed;
  --e45-purple-2:#9b6cff;
  --e45-cyan:#67e8f9;
  --e45-green:#86efac;
  --e45-amber:#fcd34d;
  --e45-orange:#fdba74;
  --e45-red:#fda4af;
}

html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main{
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  color:var(--e45-text)!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main :is(h1,h2,h3,h4){
  text-wrap:balance;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main h2{
  letter-spacing:-.035em!important;
}

/* ---------- Data Generator: informative, balanced, and readable ---------- */
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [data-ecom-generator-header-v45="true"]{
  position:relative!important;
  padding:4px 0 2px 17px!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [data-ecom-generator-header-v45="true"]::before{
  content:"";
  position:absolute;
  left:0;
  top:6px;
  bottom:5px;
  width:4px;
  border-radius:999px;
  background:linear-gradient(180deg,var(--e45-purple-2),#d946ef);
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [data-ecom-generator-header-v45="true"] h2{
  color:#fff!important;
  font-size:clamp(1.7rem,2.3vw,2.2rem)!important;
  line-height:1.08!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [data-ecom-generator-header-v45="true"] p{
  max-width:820px!important;
  margin-top:7px!important;
  color:#c9cad4!important;
  font-size:.94rem!important;
  line-height:1.55!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-generator-flow-v45{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:13px;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-generator-flow-v45 span{
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-height:30px;
  padding:6px 10px;
  border:1px solid #3f4150;
  border-radius:999px;
  background:#171821;
  color:#cfd0d9!important;
  font-size:.71rem;
  font-weight:700;
  letter-spacing:.01em;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-generator-flow-v45 span::before{
  content:"";
  width:6px;
  height:6px;
  border-radius:50%;
  background:#9b6cff;
  box-shadow:0 0 0 3px rgba(155,108,255,.12);
}

html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [data-ecom-gen-card-v45]{
  position:relative!important;
  min-height:205px!important;
  overflow:hidden!important;
  border:1px solid #3d3f4c!important;
  border-radius:16px!important;
  background:linear-gradient(145deg,#171820 0%,#13141b 72%)!important;
  box-shadow:none!important;
  transform:none!important;
  transition:border-color .2s ease,transform .2s ease,background .2s ease!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [data-ecom-gen-card-v45]::before{
  content:"";
  position:absolute;
  top:0;
  left:22px;
  right:22px;
  height:3px;
  border-radius:0 0 999px 999px;
  background:linear-gradient(90deg,var(--e45-purple),#d946ef);
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [data-ecom-gen-card-v45]:hover{
  border-color:#65568c!important;
  background:linear-gradient(145deg,#1b1a26 0%,#15151e 72%)!important;
  transform:translateY(-2px)!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [data-ecom-gen-card-v45] > div{
  position:relative;
  z-index:1;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [data-ecom-gen-card-v45] [data-ecom-gen-count-v45="true"]{
  color:#fff!important;
  font-size:clamp(2rem,3vw,2.65rem)!important;
  line-height:1!important;
  letter-spacing:-.045em!important;
  font-variant-numeric:tabular-nums!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [data-ecom-ready-v45]{
  display:inline-flex!important;
  align-items:center!important;
  gap:7px!important;
  min-height:29px!important;
  padding:5px 10px!important;
  border:1px solid #684bb5!important;
  border-radius:999px!important;
  background:#281b48!important;
  color:#eee9ff!important;
  font-size:.72rem!important;
  font-weight:800!important;
  line-height:1!important;
  letter-spacing:.01em!important;
  opacity:1!important;
  box-shadow:none!important;
  text-shadow:none!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [data-ecom-ready-v45]::before{
  content:"";
  width:7px;
  height:7px;
  flex:0 0 7px;
  border-radius:50%;
  background:#a78bfa;
  box-shadow:0 0 0 3px rgba(167,139,250,.14);
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [data-ecom-ready-v45][data-state="empty"]{
  border-color:#5b5d69!important;
  background:#25262e!important;
  color:#d4d5dd!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [data-ecom-ready-v45][data-state="empty"]::before{
  background:#8b8d99;
  box-shadow:none;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-gen-card-copy-v45{
  margin:3px 0 0!important;
  color:#bfc1cc!important;
  font-size:.78rem!important;
  line-height:1.48!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-gen-card-rel-v45{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:11px;
  color:#dfdbea!important;
  font-size:.69rem!important;
  font-weight:750!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-gen-card-rel-v45::before{
  content:"↳";
  color:#a78bfa;
  font-size:.86rem;
}

/* Generator settings and explanation cards must not fall back to white/neon V31 surfaces. */
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [data-ecom-generation-grid-v31="true"] label,
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-inventory-setting-v31 label{
  color:#e8e8ef!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-inventory-setting-v31 input{
  color:#f7f7fb!important;
  background:#101118!important;
  border:1px solid #4a4c59!important;
  border-radius:10px!important;
  box-shadow:none!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-inventory-helper-v31{
  padding:10px 12px!important;
  border:1px solid #4b4268!important;
  border-left:3px solid #8b5cf6!important;
  border-radius:10px!important;
  background:#1b1827!important;
  color:#dcd7eb!important;
  font:650 .76rem/1.5 Inter,ui-sans-serif,system-ui,sans-serif!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-generate-inventory-v31{
  border:1px solid #7c3aed!important;
  border-radius:10px!important;
  background:#6d28d9!important;
  color:#fff!important;
  box-shadow:none!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-generate-inventory-v31:hover{
  background:#7c3aed!important;
  color:#fff!important;
}

/* ---------- Inventory explanation strip ---------- */
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-inventory-legend-v45{
  width:100%;
  margin:0 0 10px;
  padding:13px 14px;
  border:1px solid #3d3f4c;
  border-radius:13px;
  background:#13141b;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-inventory-legend-v45__head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:10px;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-inventory-legend-v45__head strong{
  color:#fff!important;
  font-size:.83rem!important;
  letter-spacing:.01em;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-inventory-legend-v45__head span{
  max-width:760px;
  color:#aeb0bd!important;
  font-size:.71rem!important;
  line-height:1.45;
  text-align:right;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-inventory-legend-v45__items{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-inventory-legend-v45__item{
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-height:28px;
  padding:5px 9px;
  border:1px solid #3f414d;
  border-radius:9px;
  background:#181920;
  color:#d9dae2!important;
  font-size:.68rem!important;
  font-weight:700!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-inventory-legend-v45__item i{
  display:block;
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--legend-dot,#a78bfa);
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-inventory-legend-v45__item[data-tone="healthy"]{--legend-dot:#4ade80}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-inventory-legend-v45__item[data-tone="low"]{--legend-dot:#60a5fa}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-inventory-legend-v45__item[data-tone="reorder"]{--legend-dot:#fbbf24}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-inventory-legend-v45__item[data-tone="critical"]{--legend-dot:#fb923c}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-inventory-legend-v45__item[data-tone="out"]{--legend-dot:#fb7185}

/* ---------- Inventory status chips: never pale-on-pale ---------- */
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [data-ecom-stock-status-v45]{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  min-width:86px!important;
  min-height:30px!important;
  padding:5px 10px!important;
  border:1px solid currentColor!important;
  border-radius:999px!important;
  font-family:Inter,ui-sans-serif,system-ui,sans-serif!important;
  font-size:.70rem!important;
  font-weight:850!important;
  line-height:1!important;
  letter-spacing:.01em!important;
  text-shadow:none!important;
  box-shadow:none!important;
  opacity:1!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [data-ecom-stock-status-v45]::before{
  content:"";
  width:7px;
  height:7px;
  flex:0 0 7px;
  border-radius:50%;
  background:currentColor;
  opacity:.9;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [data-ecom-stock-status-v45="healthy"]{
  color:#a7f3d0!important;background:#123128!important;border-color:#2e7d5d!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [data-ecom-stock-status-v45="low"]{
  color:#bfdbfe!important;background:#172b49!important;border-color:#3b6ca8!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [data-ecom-stock-status-v45="reorder"]{
  color:#fde68a!important;background:#372b12!important;border-color:#8a681e!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [data-ecom-stock-status-v45="critical"]{
  color:#fed7aa!important;background:#3b2014!important;border-color:#a45025!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [data-ecom-stock-status-v45="out-of-stock"]{
  color:#fecdd3!important;background:#3d171f!important;border-color:#a53f52!important;
}

/* ---------- Tables: modern enterprise readability ---------- */
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table{
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table thead tr > th:nth-child(n){
  height:44px!important;
  padding:11px 12px!important;
  color:#e9eaf0!important;
  background:#272832!important;
  border-right:1px solid #444651!important;
  border-bottom:1px solid #565865!important;
  font-family:Inter,ui-sans-serif,system-ui,sans-serif!important;
  font-size:.66rem!important;
  font-weight:800!important;
  line-height:1.2!important;
  letter-spacing:.055em!important;
  text-transform:uppercase!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table tbody tr > td:nth-child(n){
  min-height:52px!important;
  padding:11px 12px!important;
  color:#ececf2!important;
  font-family:Inter,ui-sans-serif,system-ui,sans-serif!important;
  font-size:.76rem!important;
  font-weight:570!important;
  line-height:1.42!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table td[data-ecom-key-v44="true"],
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table td[data-ecom-key-v45="true"]{
  font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace!important;
  font-size:.72rem!important;
  font-weight:750!important;
  letter-spacing:-.01em!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table [data-ecom-generated-v45="true"]{
  color:#d4d5dd!important;
  font-variant-numeric:tabular-nums!important;
  white-space:nowrap!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main table tbody tr:hover > td:nth-child(n){
  background:#211f2b!important;
}

/* Horizontal table guidance should feel like part of the UI, not a neon debug control. */
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root .ecom-table-touch-tools-v31{
  min-height:38px!important;
  margin:6px 0 8px!important;
  padding:4px 0!important;
  gap:7px!important;
  color:#cfd0d9!important;
  font:700 .70rem/1.35 Inter,ui-sans-serif,system-ui,sans-serif!important;
  letter-spacing:0!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root .ecom-table-touch-tools-v31__label{
  max-width:760px!important;
  color:#b7b9c4!important;
  font:650 .70rem/1.4 Inter,ui-sans-serif,system-ui,sans-serif!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root .ecom-table-touch-tools-v31 button{
  width:38px!important;
  min-width:38px!important;
  height:34px!important;
  border:1px solid #5b4b83!important;
  border-radius:9px!important;
  background:#1b1923!important;
  color:#e9e5f5!important;
  box-shadow:none!important;
  font:800 1rem/1 Inter,ui-sans-serif,system-ui,sans-serif!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root .ecom-table-touch-tools-v31 button:hover,
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root .ecom-table-touch-tools-v31 button:focus-visible{
  border-color:#8b5cf6!important;
  background:#2b2143!important;
  color:#fff!important;
  outline:2px solid rgba(167,139,250,.42)!important;
  outline-offset:2px!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root [data-ecom-touch-scroll-v31="true"]{
  scrollbar-color:#7c3aed #111219!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root [data-ecom-touch-scroll-v31="true"]::-webkit-scrollbar{
  height:10px!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root [data-ecom-touch-scroll-v31="true"]::-webkit-scrollbar-track{
  background:#111219!important;
  border:1px solid #30323c!important;
  border-radius:999px!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root [data-ecom-touch-scroll-v31="true"]::-webkit-scrollbar-thumb{
  min-width:64px!important;
  background:#6d44bd!important;
  border:2px solid #111219!important;
  border-radius:999px!important;
}

/* ---------- PWA install: compact and aligned with the dashboard ---------- */
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] .pwa-install-fab{
  right:max(14px,env(safe-area-inset-right))!important;
  bottom:max(14px,calc(env(safe-area-inset-bottom) + 10px))!important;
  min-height:42px!important;
  max-width:min(210px,calc(100vw - 28px))!important;
  padding:9px 13px!important;
  border:1px solid #8b5cf6!important;
  border-radius:12px!important;
  background:#6d28d9!important;
  color:#fff!important;
  box-shadow:0 10px 28px rgba(0,0,0,.28)!important;
  font:800 .69rem/1 Inter,ui-sans-serif,system-ui,sans-serif!important;
  letter-spacing:.02em!important;
  text-transform:none!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] .pwa-install-fab:hover,
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] .pwa-install-fab:focus-visible{
  transform:translateY(-1px)!important;
  background:#7c3aed!important;
  box-shadow:0 12px 32px rgba(0,0,0,.34)!important;
  outline:2px solid rgba(167,139,250,.5)!important;
  outline-offset:2px!important;
}
html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] .neon-install{
  border:1px solid #66518f!important;
  border-radius:9px!important;
  background:#23212c!important;
  color:#eee9ff!important;
  font-family:Inter,ui-sans-serif,system-ui,sans-serif!important;
  letter-spacing:.01em!important;
  text-transform:none!important;
}

@media (prefers-reduced-motion:no-preference){
  html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [data-ecom-gen-card-v45]{
    animation:ecom-v45-card-in .35s ease both;
  }
  html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [data-ecom-gen-card-v45="customers"]{animation-delay:.04s}
  html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [data-ecom-gen-card-v45="orders"]{animation-delay:.08s}
}
@keyframes ecom-v45-card-in{from{opacity:.35;transform:translateY(8px)}to{opacity:1;transform:none}}

@media(max-width:860px){
  html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main [data-ecom-gen-card-v45]{min-height:178px!important;}
  html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-inventory-legend-v45__head{display:block;}
  html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-inventory-legend-v45__head span{display:block;margin-top:4px;text-align:left;}
}
@media(max-width:540px){
  html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-generator-flow-v45{display:grid;grid-template-columns:1fr 1fr;}
  html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-generator-flow-v45 span:last-child{grid-column:1/-1;}
  html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root .ecom-table-touch-tools-v31__label{font-size:.66rem!important;}
  html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-inventory-legend-v45__items{display:grid;grid-template-columns:1fr 1fr;}
  html body[data-project-key="ECOMMERCE_SALES_ANALYSIS"] #root main .ecom-inventory-legend-v45__item{min-width:0;}
}