/* =======================================================================
   Identidade nova (CRM de referência): foto de fundo desfocada em tons
   neutros com manchas da cor da marca, vidro fosco escuro, menu lateral
   de ícones, cartões do CRM coloridos por coluna e gráfico em ondas.
   Só muda a aparência; tudo vem das cores da marca (marca.json).
   ======================================================================= */
:root:not([data-theme="light"]){
  --bg:#0c0c0e;
  --glass:rgba(255,255,255,.06);
  --glass-2:rgba(255,255,255,.09);
  --glass-line:rgba(255,255,255,.10);
  --glass-hi:rgba(255,255,255,.08);
  --glass-shadow:0 10px 40px rgba(0,0,0,.28);
  --surface:rgba(255,255,255,.06);
  --surface-2:rgba(255,255,255,.09);
  --line:rgba(255,255,255,.10);
  --line-soft:rgba(255,255,255,.07);
  --c-leads:var(--accent);
}
:root:not([data-theme="light"]) body{
  background:
    radial-gradient(700px 520px at 88% 6%, color-mix(in srgb,var(--accent) 30%,transparent), transparent 70%),
    radial-gradient(600px 480px at 8% 78%, color-mix(in srgb,var(--c-c) 22%,transparent), transparent 70%),
    linear-gradient(180deg,rgba(8,8,10,.35),rgba(8,8,10,.78)),
    url("/static/fundo.jpg") center/cover no-repeat #0c0c0e;
  background-attachment:fixed;
}
/* vidro */
:root:not([data-theme="light"]) .kpi,:root:not([data-theme="light"]) .panel,:root:not([data-theme="light"]) .col,
:root:not([data-theme="light"]) .wa-card,:root:not([data-theme="light"]) .filters,:root:not([data-theme="light"]) .topbar{
  background:rgba(255,255,255,.06)!important;border:1px solid rgba(255,255,255,.10)!important;
  -webkit-backdrop-filter:blur(26px) saturate(140%);backdrop-filter:blur(26px) saturate(140%);
  box-shadow:0 10px 40px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.08)}
.kpi,.panel,.col{border-radius:22px!important}
:root:not([data-theme="light"]) .topbar{background:rgba(12,12,14,.45)!important;border-width:0 0 1px!important;box-shadow:none}
/* card de destaque (MQL) */
:root:not([data-theme="light"]) .kpi.k-mql{background:linear-gradient(140deg,color-mix(in srgb,var(--accent) 72%,transparent),color-mix(in srgb,var(--c-d) 55%,#120f20 40%))!important;border-color:rgba(255,255,255,.18)!important}
.kpi.k-mql .lab,.kpi.k-mql .sub,.kpi.k-mql .cost span{color:rgba(255,255,255,.85)}
/* chips e selects mais escuros, como na referência */
:root:not([data-theme="light"]) select,:root:not([data-theme="light"]) input[type="date"]{background:rgba(0,0,0,.22)!important;border-color:rgba(255,255,255,.08)!important;border-radius:14px}
.chip{border-radius:999px}
.chip[aria-pressed="true"]{background:var(--c-a)!important;color:#14102a!important;border-color:transparent!important}

/* ---------- menu lateral de ícones ---------- */
.abas-dash{position:fixed!important;left:16px;top:50%;transform:translateY(-50%);z-index:60;flex-direction:column;gap:6px!important;
  width:52px;padding:10px 0!important;margin:0!important;border-radius:26px!important;align-items:center;order:0!important;
  background:rgba(255,255,255,.07)!important;border:1px solid rgba(255,255,255,.10)!important;
  -webkit-backdrop-filter:blur(26px) saturate(140%);backdrop-filter:blur(26px) saturate(140%);box-shadow:0 10px 40px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.08)}
.abas-dash a{position:relative;width:38px;height:38px;padding:0!important;border-radius:50%!important;display:grid!important;place-items:center;color:var(--ink-3)!important;background:none}
.abas-dash a svg{width:19px;height:19px}
.abas-dash a:hover{color:var(--ink)!important;background:rgba(255,255,255,.08)}
.abas-dash a[aria-current="page"]{background:rgba(255,255,255,.18)!important;color:var(--ink)!important}
.abas-dash .aba-txt{position:absolute;left:48px;white-space:nowrap;background:rgba(18,18,22,.92);color:var(--ink);font:600 12px/1 var(--sans);padding:7px 10px;border-radius:10px;opacity:0;pointer-events:none;transform:translateX(-4px);transition:.15s}
.abas-dash a:hover .aba-txt{opacity:1;transform:none}
.abas-dash a .bdg{position:absolute!important;top:-3px;right:-4px;margin:0!important;min-width:16px!important;height:16px!important;font-size:9.5px!important;background:var(--accent)!important;color:#fff!important}
body:has(.abas-dash){padding-left:76px}
@media (max-width:760px){
  body:has(.abas-dash){padding-left:0;padding-bottom:76px}
  .abas-dash{top:auto;bottom:12px;left:50%;transform:translateX(-50%);flex-direction:row;width:auto;padding:0 10px!important;height:56px}
  .abas-dash .aba-txt{display:none}
}
:root[data-theme="light"] .abas-dash{background:rgba(255,255,255,.7)!important;border-color:rgba(120,80,150,.15)!important}
:root[data-theme="light"] .abas-dash a[aria-current="page"]{background:var(--accent)!important;color:#fff!important}

/* ---------- CRM: cartões coloridos por coluna ---------- */
.col.f-contato,.col.f-tent2,.col.f-tent3{--cor:color-mix(in srgb,var(--accent) 35%,#6E8CAF)}
.col.f-sql{--cor:var(--c-b)}
.col.f-reuniao{--cor:var(--c-c)}
.col.f-venda{--cor:var(--accent)}
.col.f-perdido{--cor:#5a5a60}
.col.desq.aberta{--cor:#5a5a60}
:root:not([data-theme="light"]) .col{background:rgba(10,10,12,.30)!important}
.col.c-tier,.col.f-venda,.col.f-perdido,.col.f-reuniao,.col.f-sql{border-top:1px solid rgba(255,255,255,.10)!important}
.col h3 span:before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--cor,var(--ink-3));margin-right:7px;vertical-align:1px;box-shadow:0 0 8px var(--cor,transparent)}
:root:not([data-theme="light"]) .card{
  background:color-mix(in srgb,var(--cor,#6E8CAF) 52%,rgba(20,20,26,.55))!important;border:1px solid rgba(255,255,255,.13)!important;
  border-radius:18px!important;padding:12px 14px!important;color:#fff;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 10px 24px -16px rgba(0,0,0,.6)!important}
.card .c-topo{display:block;font-size:10.5px;opacity:.75;margin-bottom:3px}
.card header b{font-size:13.5px}
.card .nivel{display:none}
.card .resp,.card .ultima,.card .nota,.card .peca,.card footer{color:rgba(255,255,255,.78)!important}
.card .c-dest{font-size:15px;font-weight:700;margin-top:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
:root[data-theme="light"] .card .c-dest{color:var(--ink)}
:root:not([data-theme="light"]) .card.atrasado{outline:2px solid var(--c-a);outline-offset:1px}
.card .acoes{border-top:1px solid rgba(255,255,255,.12)}

/* ---------- gráfico em ondas ---------- */
#daily .onda-l{fill:none;stroke:var(--c-leads);stroke-width:2.5}
#daily .onda-m{fill:none;stroke:var(--c-mql);stroke-width:2.4}
#daily .brilho{stroke-width:7;opacity:.45;filter:blur(4px)}
#daily .marca-dia{stroke:rgba(255,255,255,.3);stroke-dasharray:3 4}
/* o blur da barra de cima prende elementos fixos dentro dela: tira o blur para o menu lateral ficar solto */
.topbar:has(.abas-dash){-webkit-backdrop-filter:none!important;backdrop-filter:none!important;background:rgba(12,12,14,.72)!important}
:root[data-theme="light"] .topbar:has(.abas-dash){background:rgba(255,255,255,.82)!important}
.card footer .quando{display:none}