/* ══════════════════════════════════════════════════════════════
   INVECTORY — Tema sóbrio (macOS)
   Carregado por último em todas as páginas do app.
   Claro é o padrão; o escuro segue os mesmos tokens.
   Teal da marca = única cor de destaque. Vermelho / laranja / verde = status.
══════════════════════════════════════════════════════════════ */

/* ── TOKENS · CLARO (padrão) ── */
:root,
html[data-theme="light"],
html[data-theme="light"] body,
html[data-theme="light"] body.light-mode{
  --f-ui:-apple-system,BlinkMacSystemFont,"SF Pro Text","Inter","Helvetica Neue",Arial,sans-serif;
  --f-mono:"SF Mono",ui-monospace,Menlo,Consolas,monospace;
  --f-brand:"Montserrat",-apple-system,sans-serif;

  --bg:#eceef1;            /* fundo da página: cinza claro para destacar os quadros */
  --bg2:#ffffff;           /* quadros, cards, tabelas */
  --bg3:#f4f5f7;           /* campos, cabeçalho de tabela, botões secundários */
  --bg4:#e2e4e8;           /* trilhos de barra, divisórias fortes */
  --bar:rgba(246,247,249,.86);
  --glass:#ffffff;
  --sidebar-bg:rgba(228,231,235,.92);
  --border:rgba(0,0,0,.08);
  --border2:rgba(0,0,0,.13);
  --row-hover:rgba(0,0,0,.025);
  --shadow:0 12px 32px rgba(0,0,0,.12),0 1px 3px rgba(0,0,0,.06);
  --card-shadow:0 1px 2px rgba(0,0,0,.04);

  --ink:#1d1d1f;
  --ink2:#515154;
  --ink3:#86868b;

  --brand:#0f9a85;
  --brand-soft:rgba(15,154,133,.10);
  --brand-ink:#ffffff;
  --teal:#0f9a85;
  --teal2:#4a7fa8;
  --blue:#0f9a85;          /* destaques que eram azul passam a ser teal */
  --info:#2f6fb0;
  --green:#248a3d;
  --amber:#b86e00;
  --orange:#c45100;
  --red:#d70015;
  --purple:#6e6e8f;        /* séries secundárias em cinza azulado, sem roxo vivo */

  --teal-g:rgba(15,154,133,.10);
  --blue-g:rgba(15,154,133,.10);
  --green-g:rgba(36,138,61,.10);
  --amber-g:rgba(184,110,0,.10);
  --red-g:rgba(215,0,21,.08);
  --purple-g:rgba(110,110,143,.10);

  --r:10px;--r-sm:7px;--r-lg:12px;
  color-scheme:light;
}

/* ── TOKENS · ESCURO ── */
html[data-theme="dark"],
html[data-theme="dark"] body,
html[data-theme="dark"] body.light-mode{
  --bg:#1c1c1e;
  --bg2:#2c2c2e;
  --bg3:#353537;
  --bg4:#48484a;
  --bar:rgba(30,30,32,.86);
  --glass:#2c2c2e;
  --sidebar-bg:rgba(36,36,38,.94);
  --border:rgba(255,255,255,.08);
  --border2:rgba(255,255,255,.14);
  --row-hover:rgba(255,255,255,.035);
  --shadow:0 12px 32px rgba(0,0,0,.45),0 1px 3px rgba(0,0,0,.3);
  --card-shadow:none;

  --ink:#f5f5f7;
  --ink2:#c7c7cc;
  --ink3:#8e8e93;

  --brand:#3cc4ad;
  --brand-soft:rgba(60,196,173,.14);
  --brand-ink:#0b1f1b;
  --teal:#3cc4ad;
  --teal2:#7fb2d9;
  --blue:#3cc4ad;
  --info:#64a8ff;
  --green:#30d158;
  --amber:#ff9f0a;
  --orange:#ff8a3d;
  --red:#ff453a;
  --purple:#9a9ab8;

  --teal-g:rgba(60,196,173,.14);
  --blue-g:rgba(60,196,173,.14);
  --green-g:rgba(48,209,88,.14);
  --amber-g:rgba(255,159,10,.14);
  --red-g:rgba(255,69,58,.14);
  --purple-g:rgba(154,154,184,.14);
  color-scheme:dark;
}

/* ── BASE ── */
body{
  font-family:var(--f-ui);
  background:var(--bg);
  color:var(--ink);
  font-feature-settings:"tnum" 1;
  -webkit-font-smoothing:antialiased;
}
button,input,select,textarea{font-family:inherit;}
h1,h2,h3,h4{letter-spacing:-.015em;}
code,kbd,.mono{font-family:var(--f-mono);}

/* Logotipo continua em Montserrat (manual da marca) */
.inv-logo-name,.logo-name,.idx-logo-name,.login-logo-name{font-family:var(--f-brand);font-weight:600;}
.inv-logo-name em,.logo-name span{color:var(--brand);}

/* ── MOVIMENTO: sem pulsação, brilho ou entrada animada ── */
@keyframes pulse{from{opacity:1}to{opacity:1}}
@keyframes pdot{from{opacity:1}to{opacity:1}}
@keyframes aipulse{from{opacity:1}to{opacity:1}}
@keyframes aiPulse{from{opacity:1}to{opacity:1}}
@keyframes fadeUp{from{opacity:1}to{opacity:1}}
@keyframes slideIn{from{opacity:1}to{opacity:1}}
@keyframes breathe{from{transform:none}to{transform:none}}
@keyframes floatY{from{transform:none}to{transform:none}}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;}
}

/* ── TITLEBAR / SIDEBAR ── */
.inv-titlebar,.header,.idx-nav{background:var(--bar);border-bottom:1px solid var(--border);}
.inv-tb-btn,.sidebar-toggle{background:transparent;border:1px solid transparent;color:var(--ink2);}
.inv-tb-btn:hover,.sidebar-toggle:hover{background:var(--row-hover);border-color:var(--border);color:var(--ink);}
.theme-switch{background:var(--bg3);border-color:var(--border);}
.ts-btn{display:flex;align-items:center;justify-content:center;color:var(--ink3);}
.ts-btn.active{background:var(--bg2);color:var(--ink);box-shadow:0 1px 2px rgba(0,0,0,.08);}
.client-dot,.pipeline-dot,.ai-pulse{box-shadow:none;background:var(--green);}
.inv-ai-btn{background:var(--bg2);border:1px solid var(--border2);color:var(--ink);}
.inv-ai-btn:hover{background:var(--bg3);transform:none;}
.inv-avatar,#avatarWrap > div:first-child{background:var(--bg4)!important;color:var(--ink)!important;}
.avd-role{background:var(--brand-soft);color:var(--brand);}

.inv-sidebar{background:var(--sidebar-bg);}
.sb-label,.admin-nav-label{font-size:11px;font-weight:600;text-transform:none;letter-spacing:0;color:var(--ink3);}
.sb-item{color:var(--ink);border-radius:7px;font-size:13px;}
.sb-item:hover{background:var(--row-hover);}
.sb-item.active,[data-theme="light"] .sb-item.active{background:var(--brand-soft);color:var(--brand);font-weight:500;}
.sb-icon{display:flex;align-items:center;justify-content:center;width:18px;height:18px;color:var(--ink3);}
.sb-item.active .sb-icon{color:var(--brand);}
.sb-badge{background:var(--bg4);color:var(--ink2);font-weight:600;}
.sb-badge.red{background:var(--red-g);color:var(--red);}
.sb-badge.amber{background:var(--amber-g);color:var(--amber);}
.sb-badge.green,.sb-badge.blue{background:var(--brand-soft);color:var(--brand);}

/* ── ÍCONES SVG (substituem os emojis) ── */
.ico{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;vertical-align:-3px;}
.inv-tb-btn .ico,.sidebar-toggle .ico{width:17px;height:17px;}
.avd-item .ico{color:var(--ink3);}

/* ── TÍTULOS E RÓTULOS ── */
.page-title,.s-h2{font-family:var(--f-ui);font-weight:600;letter-spacing:-.02em;font-style:normal;}
.page-title em{font-style:normal;color:inherit;}
.page-eyebrow,.page-breadcrumb,.kpi-label,.sem-label,.mix-title,.impacto-stat-lbl,.tipo-card-label,
.sku-stat-label,.exec-kpi-label,.ps6-sl,.ps6-clbl,.level-chip-lbl,.inv-kpi-label,.sp-sec,.inv-form-label,
.ai-sec-lbl,.ai-ckpi-lbl,.hs-ctrl-lbl,.sum-label,.cl-lbl,.flabel,.sec-title,.stat-label,.form-label{
  text-transform:none;letter-spacing:0;font-size:11.5px;font-weight:500;
}
.page-eyebrow,.page-breadcrumb{color:var(--ink3);}

/* ── CARDS: borda fina, sem brilho, sem barra colorida ── */
.kpi-card,.table-card,.side-card,.tab-card,.ps-card,.metas-card,.inv-card,.acoes-card,.sem-item,
.ai-action-card,.mod,.hcard,.stat-card,.sum-card,.cl-card{
  background:var(--bg2);
  border:1px solid var(--border);
  box-shadow:var(--card-shadow);
  backdrop-filter:none;-webkit-backdrop-filter:none;
}
.kpi-card,.table-card,.side-card,.inv-card,.acoes-card{border-radius:var(--r);}
.kpi-card::before,.ai-action-card::before,.mod::after{display:none;}
.kpi-card:hover,.ai-action-card:hover,.mod:hover{transform:none;border-color:var(--border2);}
.kpi-glow,.kpi-icon{display:none!important;}
.kpi-value,.kpi-val,.exec-kpi-val,.inv-kpi-value,.sem-count,.ps6-sv{
  font-family:var(--f-ui);font-weight:600;letter-spacing:-.02em;font-variant-numeric:tabular-nums;
}
/* números grandes em cor neutra; o status vai no texto de apoio */
.kpi-value.teal,.kpi-value.blue,.kpi-value.purple{color:var(--ink);}
.ai-action-card.sel{background:var(--brand-soft);border-color:var(--brand);box-shadow:none;}

/* ── TABELAS ── */
thead th,.hier-table thead th,table.inv-table thead th,.gst-banner-table th,.flow-matrix th,.ps6-t thead th{
  text-transform:none;letter-spacing:0;font-size:11.5px;font-weight:600;color:var(--ink3);background:var(--bg3);
}
tbody tr:hover{background:var(--row-hover);}
td,th{font-variant-numeric:tabular-nums;}

/* ── CONTROLES ── */
.filter-select,.inv-filter select,select.filter-select{
  background-color:var(--bg2);border:1px solid var(--border2);border-radius:var(--r-sm);color:var(--ink);font-size:12px;
}
.chip{background:var(--bg2);border-color:var(--border2);color:var(--ink2);border-radius:999px;}
.chip.active{background:var(--brand-soft);color:var(--brand);border-color:transparent;}
.acoes-tab.active,.nav-pill.active{color:var(--brand);border-bottom-color:var(--brand);}
.export-btn,.expand-all-btn,.ps6-btn{background:var(--bg2);border:1px solid var(--border2);color:var(--ink);font-family:var(--f-ui);}
.export-btn:hover,.expand-all-btn:hover,.ps6-btn:hover{background:var(--bg3);}
.inv-btn.primary,.btn-primary,.ps6-btnsave,.idx-btn-p,.login-btn{
  background:var(--brand);color:var(--brand-ink);border:none;box-shadow:none;
}
.inv-btn.primary:hover,.btn-primary:hover,.ps6-btnsave:hover,.idx-btn-p:hover,.login-btn:hover{
  background:var(--brand);filter:brightness(.94);transform:none;box-shadow:none;
}
.inv-form-input:focus,.inv-form-select:focus,input:focus-visible,select:focus-visible,textarea:focus-visible{
  border-color:var(--brand);outline:none;box-shadow:0 0 0 3px var(--brand-soft);
}
:focus-visible{outline:2px solid var(--brand);outline-offset:2px;}

/* ── BADGES DE STATUS ── */
.badge,.tag,.wos-pill{border-radius:5px;font-weight:500;}
.badge-teal,.badge-blue{background:var(--brand-soft);color:var(--brand);}
.badge-green{background:var(--green-g);color:var(--green);}
.badge-amber{background:var(--amber-g);color:var(--amber);}
.badge-red{background:var(--red-g);color:var(--red);}

/* ── GRADIENTES → cores sólidas ── */
.logo-mark{background:var(--brand);}
.impacto-banner,.ai-ctx-card.md,.ai-ctx-card.wos{background:var(--bg2);border:1px solid var(--border);}
.ipg-fill,.ai-md-bar-fill{background:var(--amber);}
.exec-progress-fill,.ai-wos-after{background:var(--brand);opacity:1;}
.ai-msg.ai .ai-msg-avatar{background:var(--brand);color:var(--brand-ink);}

/* ── MENUS, MODAIS, TOASTS: os únicos com sombra ── */
.inv-avatar-dropdown,.inv-modal,.modal,.inv-toast{box-shadow:var(--shadow);}
.inv-modal-ov{background:rgba(0,0,0,.35);}

/* placeholder de foto sem emoji */
.sku-photo-placeholder{background:var(--bg3);color:var(--ink3);}

/* ── LOGIN (index.html) ── */
.app-grid{display:none;}
.app-card{background:var(--bg2);border:1px solid var(--border);box-shadow:var(--shadow);backdrop-filter:none;-webkit-backdrop-filter:none;border-radius:14px;}
.app-title{font-family:var(--f-ui);font-weight:600;letter-spacing:-.02em;}
.app-label{text-transform:none;letter-spacing:0;font-size:12px;font-weight:500;}
.app-input{background:var(--bg3);border-color:var(--border2);border-radius:8px;}
.app-input:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft);}
.app-btn{background:var(--brand);color:var(--brand-ink);font-family:var(--f-ui);font-weight:600;border-radius:8px;}
.app-btn:hover{background:var(--brand);filter:brightness(.94);transform:none;box-shadow:none;}
.app-benefit-ic{background:var(--brand-soft);border:none;color:var(--brand);}
.app-forgot:hover,.app-footer a{color:var(--brand);}
.app-loading-prog{background:var(--brand);}
.app-ok{color:var(--green);background:var(--green-g);border-color:transparent;}

/* ── ADMIN / CLIENTES ── */
.admin-nav-icon{display:inline-flex;align-items:center;justify-content:center;width:18px;color:var(--ink3);}
.admin-nav-item.active .admin-nav-icon{color:var(--brand);}
.btn-primary-sm{background:var(--brand);color:var(--brand-ink);border-color:transparent;}
.prem-badge{background:var(--brand-soft);color:var(--brand);}
.confirm-icon:empty{display:none;}
.admin-nav-item.active{background:var(--brand-soft);color:var(--brand);}
.btn-primary-sm{background:var(--brand)!important;color:var(--brand-ink)!important;border-color:var(--brand)!important;}
.prem-badge{border-color:transparent!important;}
.cl-btn-cfg{background:var(--brand-soft);color:var(--brand);border-color:transparent;}
.sp-trial{background:var(--purple-g);color:var(--ink2);border-color:transparent;}

/* ── AÇÕES (acoes_impacto.html) e aba Ações do dashboard ── */
.action-card::before,.sum-card::after{display:none;}
.action-card{background:var(--bg2);box-shadow:var(--card-shadow);}
.action-card:hover{transform:none;}
.action-card.sel{background:var(--brand-soft);border-color:var(--brand);box-shadow:none;}
.ac-glow,.ac-icon,.impact-icon,.ai-ac-ico{display:none!important;}
.ac-name,.sec-label,.ikpi-lbl,.ckpi-lbl{text-transform:none;letter-spacing:0;font-size:11.5px;font-weight:500;}
.ac-name{color:var(--ink2);font-size:12px;}
.execute-btn{background:var(--brand);color:var(--brand-ink);}
.impact-banner.has{background:var(--bg2);border-color:var(--brand);}
.ctx-card.md-card,.ctx-card.wos-card{background:var(--bg2);border:1px solid var(--border);}
.md-bar-fill{background:var(--amber);}
.wos-after,.wos-mini-after{background:var(--brand)!important;}
.urg-pill.u1,.urg-pill.u2{border-color:transparent;}
.cl-avatar{background:var(--bg4);color:var(--ink);}
/* cabeçalhos de tabela em caixa normal em qualquer tabela */
th{text-transform:none!important;letter-spacing:0!important;}

/* ── ANÁLISE HISTÓRICA: seleção em teal, botão Carregar sem azul ── */
.hs-period-btn.on{color:var(--brand);background:var(--brand-soft);border-color:transparent;}
.hs-period-btn .ico{width:14px;height:14px;}
button[onclick="hsLoadDrill()"]{color:var(--brand)!important;background:var(--brand-soft)!important;border-color:transparent!important;}
