/* TEMA "PULSE" — Impulsiona CRM com a linguagem do Pulsedesk (24/09/2026).
Carregar DEPOIS de crm-base.css. Claro por padrão; escuro com .
Fontes:
Classes marcadas NOVO pedem ajuste de marcação. */
:root,[data-theme="claro"]{
--bg:#F5F7FA;
--surface:#EDF1F6;
--card:#FFFFFF;
--raised:#FFFFFF;
--border:#E2E8F0;
--border-strong:#7D899C;
--text:#0B1220;
--muted:#475569;
--muted2:#5F6B7D;
--primary:#0B1220;
--primary-h:#1E293B;
--on-primary:#FFFFFF;
--accent:#0369A1;
--accent-soft:#E0F2FE;
--primary-l:rgba(3,105,161,0.08);
--success:#047857;
--success-soft:#ECFDF5;
--danger:#B91C1C;
--danger-soft:#FEF2F2;
--warn:#B45309;
--warn-soft:#FFF7ED;
--focus:#0369A1;
--overlay:rgba(11,18,32,0.40);
--chart-1:#0369A1;
--chart-2:#0EA5E9;
--chart-3:#7DD3FC;
--chart-4:#BAE6FD;
--chart-5:#E0F2FE;
--shadow-card:0 1px 2px rgba(15,23,42,0.05), 0 4px 12px rgba(15,23,42,0.04);
--shadow-drag:0 12px 28px rgba(15,23,42,0.14);
--shadow-modal:0 24px 60px rgba(15,23,42,0.18);
--shadow-glow:0 1px 2px rgba(15,23,42,0.20);
--space-1:4px;
--space-2:8px;
--space-3:12px;
--space-4:16px;
--space-5:20px;
--space-6:24px;
--space-8:32px;
--radius-sm:8px;
--radius-md:10px;
--radius-lg:14px;
--radius-xl:20px;
--radius-full:999px;
--touch-min:36px;
--header-h:60px;
--mobnav-h:60px;
--font-sans:Geist, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
--font-display:"Plus Jakarta Sans", Geist, -apple-system, "Segoe UI", sans-serif;
}
[data-theme="escuro"]{
--bg:#080C14;
--surface:#0D131F;
--card:#111827;
--raised:#172033;
--border:#1E2736;
--border-strong:#5B6B82;
--text:#F1F5F9;
--muted:#A3AEC0;
--muted2:#8391A7;
--primary:#CFFAFE;
--primary-h:#ECFEFF;
--on-primary:#0B1220;
--accent:#38BDF8;
--accent-soft:rgba(56,189,248,0.12);
--primary-l:rgba(56,189,248,0.10);
--success:#34D399;
--success-soft:rgba(52,211,153,0.12);
--danger:#F87171;
--danger-soft:rgba(248,113,113,0.12);
--warn:#FBBF24;
--warn-soft:rgba(251,191,36,0.12);
--focus:#38BDF8;
--overlay:rgba(0,0,0,0.60);
--chart-1:#7DD3FC;
--chart-2:#38BDF8;
--chart-3:#0284C7;
--chart-4:#075985;
--chart-5:#0C4A6E;
--shadow-card:inset 0 1px 0 rgba(255,255,255,0.05), 0 12px 32px rgba(0,0,0,0.30);
--shadow-drag:0 0 0 1px rgba(56,189,248,0.35), 0 18px 40px rgba(0,0,0,0.50);
--shadow-modal:inset 0 1px 0 rgba(255,255,255,0.06), 0 30px 70px rgba(0,0,0,0.60);
--shadow-glow:0 0 0 1px rgba(207,250,254,0.30), 0 8px 24px rgba(56,189,248,0.18);
color-scheme:dark;
}
body{background:var(--bg);color:var(--text);font-family:var(--font-sans)}
/* Impulsiona CRM · Pulse — linguagem do Pulsedesk (pílulas, Geist + Plus Jakarta Sans, azul-noite e ciano)
aplicada às interfaces do CRM, com tema claro e escuro via [data-theme]. Base original:
Usa os nomes de classe reais do CRM (.btn, .fi, .p-card, .pipe-hd, .kpi-card, .ses-card, #mobNav…)
para virar temas/premium.css carregado depois de crm-base.css. Classes novas (pc-*, kpi-*, nx-*)
exigem ajuste de marcação e estão marcadas com NOVO. */
/* ---------- Base ---------- */
.crm{font-family:var(--font-sans);color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;font-size:14px;line-height:20px}
.crm *{box-sizing:border-box}
.num{font-variant-numeric:tabular-nums}
.crm :focus-visible{outline:2px solid var(--focus);outline-offset:2px}
/* ---------- Botões ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:36px;padding:0 16px;border-radius:var(--radius-full);
font:500 14px/20px var(--font-sans);border:1px solid transparent;cursor:pointer;white-space:nowrap;transition:background .12s,border-color .12s,color .12s}
.btn svg{width:16px;height:16px;flex-shrink:0}
.btn-p{background:var(--primary);color:var(--on-primary);box-shadow:var(--shadow-glow);font-weight:600}
.btn-p:hover{background:var(--primary-h)}
.btn-s{background:var(--card);color:var(--text);border-color:var(--border)}
.btn-s:hover{background:var(--raised)}
.btn-s:hover{border-color:var(--border-strong)}
.btn-d{background:var(--card);color:var(--danger);border-color:var(--border)}
.btn-d:hover{background:var(--danger-soft);border-color:var(--danger)}
.btn-won{background:var(--success-soft);color:var(--success);border-color:transparent}
.btn-ghost{background:transparent;color:var(--muted);border-color:transparent}
.btn-ghost:hover{background:var(--primary-l);color:var(--text)}
.btn-icon{width:36px;padding:0}
.btn-sm{height:32px;padding:0 10px;font-size:13px}
.seg{display:inline-flex;gap:2px;padding:4px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-full)}
.seg .btn{height:30px;padding:0 14px;font-size:13px;border-radius:var(--radius-full);background:transparent;color:var(--muted);border:none}
.seg .btn.on{background:var(--raised);color:var(--text);box-shadow:var(--shadow-card);font-weight:600}
/* ---------- Campos ---------- */
.fl{display:block;font:500 12.5px/16px var(--font-sans);color:var(--muted);margin-bottom:6px}
.fi{width:100%;height:40px;padding:0 12px;border:1px solid var(--border-strong);border-radius:var(--radius-md);background:var(--card);
color:var(--text);font:400 16px/22px var(--font-sans);outline:none;transition:border-color .12s,box-shadow .12s}
.fi::placeholder{color:var(--muted2)}
.fi:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
select.fi{appearance:none;-webkit-appearance:none;padding-right:34px;cursor:pointer;text-overflow:ellipsis;white-space:nowrap;
background:var(--card) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2352525B' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center/12px}
.fi.is-error{border-color:var(--danger)}
.f-help{font-size:12px;line-height:16px;color:var(--muted);margin-top:6px}
.f-help.is-error{color:var(--danger)}
.sb-wrap{position:relative}
.sb-wrap .fi{padding-left:36px}
.sb-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--muted);pointer-events:none}
.pipe-filter-bar{display:flex;gap:8px;align-items:center}
.pipe-filter-bar select.fi{flex:1 1 0;min-width:0}
.pipe-filter-bar .btn{flex-shrink:0;height:40px}
/* ---------- Etiquetas ---------- */
.tag{display:inline-flex;align-items:center;gap:4px;height:22px;padding:0 9px;border-radius:var(--radius-full);
font:500 12px/16px var(--font-sans);color:var(--muted);background:var(--card);border:1px solid var(--border);white-space:nowrap}
.tag svg{width:12px;height:12px}
.tag-soft{background:var(--accent-soft);border-color:transparent;color:var(--accent);font-weight:600}
.tag-won{background:var(--success-soft);border-color:transparent;color:var(--success);font-weight:600}
.tag-lost{background:var(--danger-soft);border-color:transparent;color:var(--danger);font-weight:600}
.stage{display:inline-flex;align-items:center;gap:6px;font:500 13px/18px var(--font-sans);color:var(--text)}
.stage::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--muted2)}
.stage.won{color:var(--success)}.stage.won::before{background:var(--success)}
.stage.lost{color:var(--danger)}.stage.lost::before{background:var(--danger)}
/* ---------- Iniciais ---------- */
.av{width:32px;height:32px;border-radius:var(--radius-full);display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;
background:var(--surface);color:var(--text);font:600 12px/1 var(--font-sans);letter-spacing:.02em}
.av-xs{width:20px;height:20px;font-size:10px}
.av-lg{width:48px;height:48px;font-size:16px}
/* ---------- Cabeçalho ---------- */
.app-header,#appHeader{height:60px;background:var(--card);border-bottom:1px solid var(--border)}
.header-inner{height:100%;display:flex;align-items:center;gap:4px;padding:0 24px}
.header-logo{display:flex;align-items:center;gap:10px;font:700 16px/20px var(--font-display);letter-spacing:-.02em;color:var(--text);margin-right:16px;white-space:nowrap}
.logo-icon{width:28px;height:28px;border-radius:9px;background:var(--primary);color:var(--on-primary);display:flex;align-items:center;justify-content:center;font:700 13px/1 var(--font-sans)}
.nav-item{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 12px;border-radius:var(--radius-full);font:500 13.5px/20px var(--font-sans);color:var(--muted);white-space:nowrap}
.nav-item svg{width:16px;height:16px}
.nav-item:hover{background:var(--primary-l);color:var(--text)}
.nav-item.active{background:var(--accent-soft);color:var(--accent);font-weight:600}
.header-user{margin-left:auto;display:flex;align-items:center;gap:8px}
/* ---------- Menu do celular ---------- */
.mob-nav,#mobNav{display:grid;grid-template-columns:repeat(6,1fr);background:var(--card);border-top:1px solid var(--border);padding:4px 4px calc(4px + env(safe-area-inset-bottom,0px))}
.mob-nav button,#mobNav button{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:52px;
background:none;border:none;color:var(--muted);font:500 11px/14px var(--font-sans);cursor:pointer;-webkit-tap-highlight-color:transparent}
.mob-nav button svg,#mobNav button svg{width:22px;height:22px}
.mob-nav button.active,#mobNav button.active{color:var(--accent);font-weight:600}
.mob-nav button.active::before,#mobNav button.active::before{content:"";position:absolute;top:-4px;left:30%;right:30%;height:2px;border-radius:0 0 2px 2px;background:var(--accent)}
/* ---------- Funil ---------- */
.pipe-col{display:flex;flex-direction:column;min-width:0}
.pipe-hd{display:flex;align-items:center;justify-content:space-between;gap:8px;height:36px;padding:0 4px;margin-bottom:8px}
.pipe-hd .ph-name{font:600 14px/20px var(--font-display);letter-spacing:-.01em;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pipe-hd .ph-meta{font:500 12px/16px var(--font-sans);color:var(--muted2);white-space:nowrap} /* NOVO: quantidade · soma */
.pipe-cards{display:flex;flex-direction:column;gap:8px;padding:8px;background:var(--surface);border-radius:var(--radius-lg);min-height:120px}
.pipe-cards.is-over{background:var(--primary-l);outline:1px dashed var(--accent);outline-offset:-1px}
.p-card{position:relative;background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:12px;box-shadow:var(--shadow-card);cursor:grab;transition:border-color .12s}
.p-card:hover{border-color:var(--border-strong)}
.p-card.is-drag{background:var(--raised);box-shadow:var(--shadow-drag);transform:rotate(1deg);cursor:grabbing}
.pc-top{display:flex;align-items:baseline;gap:8px;padding-right:28px} /* NOVO */
.pc-name{flex:1;min-width:0;font:600 15px/20px var(--font-sans);color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pc-value{font:600 15px/20px var(--font-sans);color:var(--text);font-variant-numeric:tabular-nums;white-space:nowrap}
.pc-value.won{color:var(--success)}
.pc-meta{margin-top:2px;font:400 13px/18px var(--font-sans);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pc-meta b{font-weight:500;color:var(--text)}
.pc-action{display:flex;align-items:center;gap:6px;margin-top:10px;padding:5px 8px;border-radius:var(--radius-sm);background:var(--surface);
font:500 13px/18px var(--font-sans);color:var(--muted)}
.pc-action svg{width:14px;height:14px;flex-shrink:0}
.pc-action .pa-what{color:var(--text)}
.pc-action.is-today{background:var(--warn-soft);color:var(--warn)}
.pc-action.is-today .pa-what{color:var(--warn)}
.pc-action.is-late{background:var(--danger-soft);color:var(--danger)}
.pc-action.is-late .pa-what{color:var(--danger)}
.pc-foot{display:flex;align-items:center;gap:6px;margin-top:10px;font:400 12.5px/16px var(--font-sans);color:var(--muted)}
.pc-foot .pc-origin{margin-left:auto;display:inline-flex;align-items:center;gap:4px;color:var(--muted2);font-size:12px}
.pc-foot .pc-origin svg{width:12px;height:12px}
.pc-more{position:absolute;top:4px;right:4px;width:36px;height:36px;display:flex;align-items:center;justify-content:center;border:none;background:none;
color:var(--muted2);border-radius:var(--radius-full);cursor:pointer}
.pc-more:hover{background:var(--primary-l);color:var(--text)}
.pc-more svg{width:18px;height:18px}
/* ---------- Painel ---------- */
.kpi-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:16px;box-shadow:var(--shadow-card)}
.kpi-label{font:600 11px/14px var(--font-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.kpi-num{white-space:nowrap;margin-top:10px;font:600 30px/36px var(--font-display);letter-spacing:-.03em;color:var(--text);font-variant-numeric:tabular-nums}
.kpi-num.won{color:var(--success)}
.kpi-sub{margin-top:6px;font:400 12px/16px var(--font-sans);color:var(--muted2)}
.kpi-delta{font-weight:600;color:var(--accent)}
.chart-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-xl);padding:20px;box-shadow:var(--shadow-card)}
.chart-card h3{margin:0;font:600 15px/20px var(--font-display);letter-spacing:-.01em}
.chart-card p{margin:2px 0 0;font:400 13px/18px var(--font-sans);color:var(--muted)}
.chart-legend{display:flex;flex-direction:column;gap:8px;font:400 13px/18px var(--font-sans);color:var(--text)}
.chart-legend span{display:flex;align-items:center;gap:8px}
.chart-legend i{width:10px;height:10px;border-radius:2px;flex-shrink:0}
.chart-legend b{margin-left:auto;font-weight:600;font-variant-numeric:tabular-nums}
/* ---------- Degustações ---------- */
.ses-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:16px;box-shadow:var(--shadow-card)}
.ses-card.ses-past{background:var(--surface);box-shadow:none}
.ses-date{font:600 16px/22px var(--font-display);letter-spacing:-.01em;color:var(--text)}
.ses-place{font:400 13px/18px var(--font-sans);color:var(--muted)}
.ses-count{display:flex;justify-content:space-between;margin:14px 0 8px;font:400 13px/18px var(--font-sans);color:var(--muted)}
.ses-count b{color:var(--text);font-weight:600;font-variant-numeric:tabular-nums}
.ses-bar{height:6px;background:var(--surface);border-radius:var(--radius-full);overflow:hidden}
.ses-bar span{display:block;height:100%;background:var(--accent);border-radius:var(--radius-full)}
.ses-bar span.full{background:var(--danger)}
.sg-row{display:flex;align-items:center;gap:12px;min-height:56px;padding:8px 0;border-bottom:1px solid var(--border)}
.sg-main{flex:1;min-width:0}
.sg-name{font:600 14px/20px var(--font-sans);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sg-sub{font:400 12.5px/16px var(--font-sans);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sg-people{display:flex;align-items:center;gap:6px;font:500 12px/16px var(--font-sans);color:var(--muted)}
.sg-people input{width:52px;height:36px;border:1px solid var(--border-strong);border-radius:var(--radius-md);background:var(--card);text-align:center;font:500 16px/1 var(--font-sans);color:var(--text);background:var(--card)}
/* ---------- Janelas ---------- */
.mdl{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-xl);box-shadow:var(--shadow-modal);overflow:hidden}
.mdl-hd{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 12px 12px 20px;border-bottom:1px solid var(--border)}
.mdl-hd h3{margin:0;font:600 16px/22px var(--font-display);letter-spacing:-.01em}
.mdl-bd{padding:20px}
.mdl-ft{display:flex;gap:8px;justify-content:flex-end;padding:12px 20px;border-top:1px solid var(--border);background:var(--card)}
.overline{font:600 11px/14px var(--font-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.perfil-grid{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden} /* NOVO */
.perfil-grid>div{padding:12px 14px}
.perfil-grid>div+div{border-left:1px solid var(--border)}
.perfil-grid .pv{margin-top:6px;font:600 18px/24px var(--font-display);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.nx-box{display:flex;align-items:center;gap:12px;margin-top:12px;padding:12px 14px;border-radius:var(--radius-lg);border:1px solid var(--border);background:var(--surface)} /* NOVO */
.nx-box>svg{width:20px;height:20px;flex-shrink:0;color:var(--muted)}
.nx-box.is-late{background:var(--danger-soft)}
.nx-box.is-late>svg{color:var(--danger)}
.nx-box.is-late .nx-when{color:var(--danger)}
.nx-what{font:600 14px/20px var(--font-sans)}
.nx-when{font:500 13px/18px var(--font-sans);color:var(--muted)}
.dl{display:grid;grid-template-columns:120px 1fr;gap:10px 12px;font:400 14px/20px var(--font-sans)}
.dl dt{color:var(--muted)}
.dl dd{margin:0;color:var(--text)}
/* ---------- Pulse: detalhes ---------- */
.crm{font-family:var(--font-sans)}
.dot-live{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.mdl-ft .btn,.pc-foot,.sg-row{font-family:var(--font-sans)}
/* ============================================================
AJUSTE AO CRM REAL (Claude Code, 24/09/2026)
pulse-base.css é o arquivo do Claude Design, sem alteração.
Este aqui faz as telas que o redesenho não desenhou seguirem a mesma
linguagem e resolve conflitos com as regras de celular do CSS base.
O montador junta os dois: pulse-base.css + pulse-ajustes.css.
Etapa 2 (mais abaixo): perfil, novo lead, indicadores, receita e tema escuro.
============================================================ */
html,body{font-family:var(--font-sans)}
.pg-title{font:700 26px/32px var(--font-display);letter-spacing:-.03em;color:var(--text)}
@media(max-width:768px){.pg-title{font-size:21px;line-height:26px}}
.card{border-radius:var(--radius-xl);box-shadow:var(--shadow-card);border-color:var(--border)}
.logo-icon{border-radius:9px!important}
/* Funil: largura das colunas (o tema zera o mínimo) e trilho */
.pipe-col{min-width:272px}
@media(max-width:768px){.pipe-col{min-width:80vw!important;width:80vw!important}}
@media(min-width:600px) and (max-width:768px){.pipe-col{min-width:calc(50vw - 16px)!important;width:calc(50vw - 16px)!important}}
.pipe-wrap{gap:16px}
.pipe-hd{background:transparent!important;border:none!important;border-radius:0;cursor:pointer}
.pipe-cards{border:none!important}
.pipe-empty{font:400 13px/18px var(--font-sans);color:var(--muted2)}
/* Cartão novo: o CSS base do celular empurrava o conteúdo com padding-right */
.p-card{padding:12px!important}
.p-card>.pc-top{padding-right:32px!important}
.p-card>div:not(.pc-top){padding-right:0!important}
.p-card.sortable-chosen,.p-card.sortable-drag{background:var(--raised)!important;box-shadow:var(--shadow-drag)!important;border-color:var(--border-strong)!important}
.sortable-ghost{opacity:.35;background:var(--primary-l)!important;border:1px dashed var(--accent)!important}
body.pipe-dragging .pipe-cards{background:var(--primary-l)!important}
/* Menu "mais ações" do cartão */
.card-menu{position:fixed;z-index:300;width:220px;max-height:70vh;overflow:auto;background:var(--card);border:1px solid var(--border);
border-radius:var(--radius-lg);box-shadow:var(--shadow-modal);padding:6px}
.card-menu button{display:block;width:100%;text-align:left;background:none;border:none;border-radius:var(--radius-sm);padding:9px 10px;
font:500 14px/20px var(--font-sans);color:var(--text);cursor:pointer;min-height:36px}
.card-menu button:hover{background:var(--surface)}
.card-menu .cm-sep{font:600 11px/14px var(--font-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding:10px 10px 4px;border-top:1px solid var(--border);margin-top:4px}
.card-menu .cm-danger{color:var(--danger);border-top:1px solid var(--border);margin-top:4px}
/* Campos: o tema fixa 40px de altura; área de texto precisa crescer */
textarea.fi{height:auto;min-height:84px;padding:10px 12px;line-height:22px}
input[type=file].fi{height:auto;padding:8px}
/* Iniciais: cor calculada pelo nome sai (no CRM a cor não informa nada) */
.av{background:var(--surface)!important;color:var(--text)!important;border:1px solid var(--border)}
span[style*="border-radius:50%"][style*="font-size:9px"]{background:var(--surface)!important;color:var(--text)!important}
/* Etiquetas e selos das outras telas: neutros; pré/pós-venda em azul suave */
.tag{height:auto;min-height:22px}
.pill,[class*="pill-"]{background:var(--card)!important;color:var(--muted)!important;border:1px solid var(--border)!important}
span[style*="background:#E7F0FF"],span[style*="background:#FEF7E0"],span[style*="background:#25D36622"],span[style*="background:#25D36615"]{
background:var(--card)!important;color:var(--muted)!important;border:1px solid var(--border)!important}
span[style*="background:#E7F0FF"] svg,span[style*="background:#FEF7E0"] svg{filter:grayscale(1);opacity:.6}
span[style*="background:#EDE9FE"],span[style*="background:#D1FAE5"]{background:var(--accent-soft)!important;color:var(--accent)!important;border-color:transparent!important}
/* Textos com cor fixa nas telas antigas: verde só para fechado, vermelho só para atraso */
[style*="color:#1D4ED8"],[style*="color:#0369A1"],[style*="color:#6D28D9"],[style*="color:#7E22CE"],[style*="color:#B45309"],
[style*="color:#065F46"],[style*="color:#4B5563"],[style*="color:#1558B8"],[style*="color:#8A4B00"],[style*="color:#1E40AF"],
[style*="color:#166534"],[style*="color:#92400E"],[style*="color:#78350F"],[style*="color:#047857"],[style*="color:#10B981"]{color:var(--text)!important}
[style*="color:#DC2626"],[style*="color:#B91C1C"],[style*="color:#EF4444"]{color:var(--danger)!important}
#kpi-fechados,#kpi-receita{color:var(--success)!important}
/* Caixas de destaque antigas (próxima ação, valor no perfil): superfície neutra */
[style*="background:#FFFBEB"],[style*="background:#FEF3C7"],[style*="background:#F0FDF4"],[style*="background:#EFF6FF"],
[style*="background:#FEF2F2"],[style*="background:#DCFCE7"]{background:var(--surface)!important;border-color:var(--border)!important}
.perfil-valor{background:var(--surface)!important;border:1px solid var(--border)!important;border-radius:var(--radius-lg)!important}
.perfil-valor div:last-child{font-family:var(--font-display)!important;color:var(--text)!important;letter-spacing:-.02em}
/* Painel: rótulo espaçado, número na fonte de título, 3 por linha no computador */
.kpi-card>p:first-child{font:600 11px/14px var(--font-sans)!important;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)!important}
.kpi-card span[id^="kpi-"]{font:600 30px/36px var(--font-display)!important;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.kpi-card>p:last-child{color:var(--muted2)!important}
.kpi-card svg{stroke:var(--muted2)!important;opacity:1!important}
@media(min-width:769px){.kpi-grid{grid-template-columns:repeat(3,1fr)!important}}
@media(max-width:768px){.kpi-card span[id^="kpi-"]{font-size:22px!important;line-height:28px!important}}
.card h3{font-family:var(--font-display);letter-spacing:-.01em}
#dashPeriodBtns{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-full);padding:4px;gap:2px!important}
#dashPeriodBtns .btn{height:30px;border:none;background:transparent;color:var(--muted);box-shadow:none;font-size:13px}
#dashPeriodBtns .btn.btn-p{background:var(--raised);color:var(--text);box-shadow:var(--shadow-card)}
/* No celular a tira vira um quadro de seis, tres por linha: o canto arredondado da tira
de uma linha so nao serve para duas (25/09). */
@media(max-width:768px){#dashPeriodBtns{border-radius:18px}}
/* Degustações */
.ses-card{border-left:1px solid var(--border)!important}
.ses-bar span{background:var(--accent)!important}
.ses-bar span[style*="#DC2626"]{background:var(--danger)!important}
/* Tabelas */
.tbl th{background:var(--surface);color:var(--muted);letter-spacing:.1em}
/* Destaque de linha só com mouse e tabela de computador. No celular a linha vira cartão e o toque
deixava o "passar o mouse" preso, pintando cada campo em bloco (achado pelo João no iPhone). */
@media(hover:hover) and (min-width:769px){.tbl tr:hover td{background:var(--surface)}}
/* Janelas */
dialog{border-radius:var(--radius-xl)!important;box-shadow:var(--shadow-modal)!important;border-color:var(--border)!important;background:var(--card)}
dialog::backdrop{background:var(--overlay)}
.mdl-hd h2,.mdl-hd h3{font-family:var(--font-display);letter-spacing:-.01em}
dialog :focus:not(:focus-visible){outline:none;box-shadow:none}
/* Agenda */
.cal-dh{background:var(--surface)!important;color:var(--muted)}
.cal-day.today{background:var(--accent-soft)!important}
.cal-num.today-num{background:var(--primary)!important}
.cal-ev{background:var(--accent-soft)!important;color:var(--accent)!important}
.cal-tasting{background:var(--surface)!important;color:var(--text)!important;border-left-color:var(--border-strong)!important}
@media(max-width:768px){.cal-day .cal-ev{background:var(--accent)!important}.cal-day .cal-tasting{background:var(--border-strong)!important}}
.cal-day.cal-sel{outline-color:var(--accent)!important}
/* Menu do celular */
#mobNav{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
#mobMore{background:var(--overlay)!important}
.mob-more-panel{border-radius:var(--radius-xl)!important;box-shadow:var(--shadow-modal)!important}
/* Faixa da demonstração e entrada */
#demoBar{background:var(--surface)!important;color:var(--muted)!important;border-bottom-color:var(--border)!important}
#demoBar button{border-color:var(--border)!important;color:var(--text)!important;border-radius:var(--radius-full)!important}
#demoLoginTip{background:var(--surface)!important;border-color:var(--border)!important;color:var(--muted)!important}
#demoLoginTip code{background:var(--card)!important;color:var(--text)}
.login-card{border-radius:var(--radius-xl)!important;box-shadow:var(--shadow-card)!important}
/* O tema liga o menu do celular em qualquer tela; no computador ele fica escondido */
@media(min-width:769px){#mobNav,#mobMore{display:none!important}}
/* Filtros do funil no computador: largura própria, não esticam na linha toda */
@media(min-width:769px){.pipe-filter-bar select.fi{flex:0 0 auto}}
/* Pós-venda e outros números verdes antigos: verde só para fechado */
[style*="color:#059669"]{color:var(--text)!important}
/* ============================================================
ETAPA 2 (24/09/2026): perfil, novo lead, indicadores, receita, tema escuro
============================================================ */
/* Perfil do lead */
#modalPerfil.pl-perfil .mdl-bd{width:460px!important;max-width:100%!important}
.pl-topo{display:flex;gap:12px;align-items:center}
.pl-nome{font:700 19px/24px var(--font-display);letter-spacing:-.02em;color:var(--text);overflow-wrap:anywhere}
.pl-sub{margin-top:4px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.pl-atalhos{display:flex;gap:8px;margin-top:14px}
.pl-atalho{flex:1 1 0;min-width:0;height:var(--touch-min)!important;text-decoration:none;padding:0 8px!important}
.pl-atalho[disabled]{opacity:.45;cursor:not-allowed}
#modalPerfil .perfil-grid{margin-top:16px}
.nx-box .btn{height:var(--touch-min)}
.nx-box.is-today{background:var(--warn-soft)}
.nx-box.is-today>svg,.nx-box.is-today .nx-when{color:var(--warn)}
.pl-sec{margin:20px 0 10px}
.pl-txt{font:400 14px/21px var(--font-sans);color:var(--text);white-space:pre-wrap;overflow-wrap:anywhere}
.pl-hist{display:flex;flex-direction:column;gap:10px}
.pl-h1{font:500 13px/18px var(--font-sans);color:var(--text)}
.pl-h2{font:400 12px/16px var(--font-sans);color:var(--muted)}
.dl dd{overflow-wrap:anywhere;min-width:0}
@media(max-width:420px){.dl{grid-template-columns:100px 1fr}.pl-atalho svg{display:none}}
/* Novo lead: ordem da conversa; no Editar, o resto vem em "Mais detalhes" */
#modalContato.pl-form .form-grid{grid-template-columns:1fr 1fr!important}
#modalContato.pl-form .form-grid>div{grid-column:1/-1!important;order:100;min-width:0}
#modalContato.pl-form .form-grid>.pl-meio{grid-column:auto!important}
#modalContato.pl-form .form-grid>.pl-mais{order:50;margin-top:6px;padding-top:18px;border-top:1px solid var(--border)}
#modalContato.pl-quick .form-grid>div:not([data-pq]){display:none!important}
#modalContato.pl-quick .mdl-bd{width:460px!important;max-width:100%!important}
@media(min-width:560px){#modalContato.pl-form:not(.pl-quick) .form-grid>div:not([data-pq]):not(.col-span-2):not(.pl-mais){grid-column:auto!important}}
#modalContato input[type=date].fi{min-width:0}
/* Botão de tema no cabeçalho */
#btnTema{color:var(--muted)}
#btnTema:hover{color:var(--text)}
/* O Tailwind do CRM tem uma classe "overline" (risco em cima do texto): aqui ela é só o rótulo espaçado */
.overline{text-decoration:none!important}
@media(max-width:420px){.perfil-grid .overline{letter-spacing:.08em}}
/* Cores das telas antigas: o código usa var(--pl-*, cor antiga). Só o pulse define essas variáveis;
nas versões colorida e limpa vale a cor antiga. Aqui elas apontam para o tema (claro e escuro). */
:root{--pl-muted:var(--muted);--pl-subtle:var(--surface);--pl-faint:var(--muted2);--pl-on-primary:var(--on-primary);
--pl-danger:var(--danger);--pl-danger-bg:var(--danger-soft);
--pl-won:var(--success);--pl-won-bg:var(--success-soft);--pl-won-bd:transparent;
--pl-info:var(--accent);--pl-info-bg:var(--accent-soft);
--pl-chip:var(--muted);--pl-chip-bg:var(--card);--pl-chip-bd:var(--border)}
/* Agenda: dias de outro mês em muted2 (sem apagar pela metade, que caía abaixo de 4,5:1) */
.cal-day.other-m{opacity:1}
/* Data no iPhone (24/09): o Safari escreve "13 de dez. de 2026", centralizado, e quebrava em duas linhas
saindo do campo. Aqui a data fica numa linha, à esquerda, e no celular data e origem ocupam a linha toda. */
input[type=date].fi{-webkit-appearance:none;appearance:none;display:block;white-space:nowrap;overflow:hidden;text-align:left;line-height:38px;min-height:40px}
input[type=date].fi::-webkit-date-and-time-value{text-align:left;margin:0}
input[type=date].fi::-webkit-datetime-edit{padding:0}
@media(max-width:480px){#modalContato.pl-form .form-grid>.pl-quebra{grid-column:1/-1!important}}
/* Período personalizado do Painel: largura para a data por extenso do iPhone, 16px para o iPhone não dar zoom */
#dpDateFrom,#dpDateTo{width:170px!important;font-size:16px!important;padding:0 12px!important;height:40px}
/* Funil (25/09, pedido do João): o quadro fica na área centralizada (do título ao botão "Novo Lead")
e os cartões somem suavemente na borda em vez de cortar reto. O script liga fade-l / fade-r
conforme há colunas escondidas de cada lado. É transparência (máscara), não cor. */
@property --fade-l{syntax:'';inherits:false;initial-value:0px}
@property --fade-r{syntax:'';inherits:false;initial-value:0px}
#pipelineContainer{--fade:64px;transition:--fade-l .2s,--fade-r .2s;
-webkit-mask-image:linear-gradient(to right,transparent 0,#000 var(--fade-l),#000 calc(100% - var(--fade-r)),transparent 100%);
mask-image:linear-gradient(to right,transparent 0,#000 var(--fade-l),#000 calc(100% - var(--fade-r)),transparent 100%)}
#pipelineContainer.fade-l{--fade-l:var(--fade)}
#pipelineContainer.fade-r{--fade-r:var(--fade)}
@media(max-width:768px){#pipelineContainer{--fade:28px}}
/* Coluna do funil (25/09, achado pelo João): a barra de rolagem vertical ficava colada na borda
direita e deixava a coluna com cara de cortada nesse lado. Agora ela é fina, só aparece com o
mouse em cima da coluna, e o espaço dela é reservado dos dois lados (coluna simétrica). */
.pipe-cards{scrollbar-gutter:stable both-edges;scrollbar-width:thin;scrollbar-color:transparent transparent}
.pipe-cards:hover{scrollbar-color:var(--border-strong) transparent}
.pipe-cards::-webkit-scrollbar{width:6px}
.pipe-cards::-webkit-scrollbar-track{background:transparent}
.pipe-cards::-webkit-scrollbar-thumb{background:transparent;border-radius:3px}
.pipe-cards:hover::-webkit-scrollbar-thumb{background:var(--border-strong)}
/* Perfil da casa: abas Dados e Mensagens (29/09/2026) */
.pl-tabs{display:flex;gap:4px;margin-top:16px;border-bottom:1px solid var(--border)}
.pl-tab{background:none;border:none;border-bottom:2px solid transparent;margin-bottom:-1px;padding:8px 12px;font:inherit;font-size:13.5px;font-weight:600;color:var(--muted);cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.pl-tab:hover{color:var(--text)}
.pl-tab.is-on{color:var(--text);border-bottom-color:var(--primary)}
.pl-tab-dot{width:6px;height:6px;border-radius:50%;background:var(--primary);display:inline-block}
.pl-msgs{margin-top:14px}
.pl-msgs textarea.fi{width:100%;line-height:1.55;resize:vertical}
.pl-msgs input.fi{width:100%}
.pl-msg-hd{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px;flex-wrap:wrap}
.pl-msg-acts{display:flex;gap:6px}