/* CHECK-IN EXPIRADA */
.expirada-check {
  width: 24px;
  height: 24px;
  border-radius: 5px;
  border: 2px solid var(--border);
  background: var(--bg3);
  color: #c0392b;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.18s;
  flex-shrink: 0;
  margin-left: 2px;
}

.expirada-check:hover {
  border-color: #c0392b;
  background: #fbeeea;
  color: #fff;
}

.expirada-check--on {
  background: #c0392b;
  border-color: #c0392b;
  color: #fff;
}

/* CHECK-IN APÓLICE ENVIADA */
.apolice-check {
  width: 24px;
  height: 24px;
  border-radius: 5px;
  border: 2px solid var(--border);
  background: var(--bg3);
  color: var(--s-negot);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.18s;
  flex-shrink: 0;
  margin-left: 2px;
}

.apolice-check:hover {
  border-color: var(--s-negot);
  background: rgba(125,60,152,0.1);
}

.apolice-check--on {
  background: var(--s-negot);
  border-color: var(--s-negot);
  color: #fff;
}


/* ════════════════════════════════════════════════════════════
   GRUPO MRX — Dashboard Leads Instagram
   Folha de estilos principal  |  Mobile-first & Responsive
   ════════════════════════════════════════════════════════════ */

/* ── THEME VARIABLES ── */
:root {
  --royal:       #1a3c8f;
  --royal-mid:   #2451b3;
  --royal-light: #3a6fd8;
  --royal-pale:  rgba(26, 60, 143, 0.12);
  --gold:        #b8943a;
  --teal:        #12b8a3;

  /* Brilho do menu (hover/aba ativa) — azul royal no claro, branco no escuro */
  --menu-glow: var(--royal-light);

  /* STATUS */
  --s-declined: #c0392b;
  --s-waiting:  #d4ac0d;
  --s-negot:    #7d3c98;
  --s-sold:     #1e8449;
  --s-future:      #c0589a;
  --s-programada:  #0da898;

  /* GENDER */
  --g-female: #c0589a;
  --g-male:   #1a3c8f;

  /* TRANSITIONS */
  --transition: 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-lift: 0.22s cubic-bezier(0.2, 0.8, 0.3, 1);

  /* PULSE — gradiente de marca e escala de raio unificada */
  --grad-brand: linear-gradient(135deg, var(--royal-mid), var(--teal));
  --r-xs:   8px;
  --r-sm:   10px;
  --r-md:   16px;
  --r-lg:   22px;
  --r-pill: 999px;
}

[data-theme="dark"] {
  /* Azul royal profundo em vez de cinza-preto neutro — o fundo, os cards e as
     bordas agora carregam o mesmo matiz de --royal, só bem mais escuro. */
  --bg:      #0a1220;
  --bg2:     #101c33;
  --bg3:     #16243f;
  --border:  #263759;
  /* Texto "normal" é sempre branco — text2/text3 usam o mesmo branco com opacidade
     em vez de tons cinza-azulados, pra não ler como "cinza apagado" no escuro. */
  --text:    #ffffff;
  --text2:   rgba(255, 255, 255, 0.78);
  --text3:   rgba(255, 255, 255, 0.56);
  --card:    #101c33;
  --card2:   #16243f;
  --shadow:  0 2px 18px rgba(0, 4, 20, 0.55);

  /* Acentos "neon leve" — mais claros/saturados que a base (pensada pro modo claro)
     pra saltar aos olhos sobre o fundo azul-marinho escuro. */
  --royal-light: #5b93ff;
  --teal:        #2dd4bf;
  --gold:        #ffd166;

  /* Brilho do menu vira branco no escuro (era azul royal no claro) */
  --menu-glow: #ffffff;

  --wash-1:  rgba(58, 111, 216, 0.18);
  --wash-2:  rgba(18, 184, 163, 0.10);

  /* Sombra neutra, sem halo azul/teal em volta dos cards — só profundidade. */
  --glow:       0 1px 2px rgba(0,0,0,.35), 0 6px 18px -8px rgba(0,0,0,.5);
  --glow-hover: 0 1px 2px rgba(0,0,0,.4),  0 10px 26px -10px rgba(0,0,0,.6);
  --glow-strong:       0 1px 2px rgba(0,0,0,.3),  0 6px 18px -8px rgba(0,0,0,.45);
  --glow-strong-hover: 0 1px 3px rgba(0,0,0,.35), 0 10px 26px -10px rgba(0,0,0,.55);

  /* STATUS — versões mais claras para manter contraste legível sobre fundo escuro */
  --s-declined:   #f87171;
  --s-waiting:    #fbbf24;
  --s-negot:      #c084fc;
  --s-sold:       #34d399;
  --s-future:     #f472b6;
  --s-programada: #2dd4bf;

  /* GENDER */
  --g-female: #f472b6;
  --g-male:   #6f93ef;
}

[data-theme="light"] {
  --bg:      #f5f5f5;
  --bg2:     #ffffff;
  --bg3:     #ebebeb;
  --border:  #d8d8d8;
  --text:    #111111;
  --text2:   #555555;
  --text3:   #999999;
  --card:    #ffffff;
  --card2:   #f9f9f9;
  --shadow:  0 2px 16px rgba(0, 0, 0, 0.08);

  --wash-1:  rgba(58, 111, 216, 0.07);
  --wash-2:  rgba(18, 184, 163, 0.05);
  --glow:       0 1px 2px rgba(20,24,34,.04), 0 0 0 1px rgba(36,81,179,.08), 0 12px 26px -14px rgba(36,81,179,.22);
  --glow-hover: 0 1px 2px rgba(20,24,34,.05), 0 0 0 1px rgba(36,81,179,.16), 0 20px 36px -16px rgba(36,81,179,.28);

  /* Aura mais forte — reservada para os cards de destaque (KPI, gráfico, login) */
  --glow-strong:       0 1px 2px rgba(20,24,34,.03), 0 0 0 1px rgba(36,81,179,.08), 0 6px 16px -10px rgba(36,81,179,.16), 0 14px 30px -18px rgba(18,184,163,.12);
  --glow-strong-hover: 0 1px 3px rgba(20,24,34,.04), 0 0 0 1px rgba(36,81,179,.12), 0 8px 20px -10px rgba(36,81,179,.2),  0 18px 36px -18px rgba(18,184,163,.16);
}

/* ── THEME TRANSITIONS — só durante a troca, não o tempo todo ──────────────
   Antes: transition-property ficava aplicada a *todo elemento, sempre*, mesmo
   fora da troca de tema — isso fazia o navegador observar/computar transições
   em milhares de nós parados o tempo todo (pesado, sem necessidade nenhuma).
   Agora: só existe a classe `.theme-transitioning` (aplicada por ~200ms via JS
   no toggleTheme) — no resto do tempo os elementos não carregam transition
   nenhuma de cor, então a navegação normal fica mais leve, e a troca de tema
   em si é uma janela curta e controlada, não um estado permanente. */
html.theme-transitioning, html.theme-transitioning *, html.theme-transitioning *::before, html.theme-transitioning *::after {
  transition-property: background-color, color, border-color;
  transition-duration: 0.15s;
  transition-timing-function: ease-out;
}
/* Tabelas grandes (a lista de leads chega a milhares de linhas) — animar
   background/color de cada <tr>/<td> ao trocar de tema é o que deixava a
   troca inteira travada: o navegador tenta re-pintar todas as linhas ao
   mesmo tempo. O efeito visual de uma célula de tabela "esfumaçando" a cor
   é imperceptível de qualquer forma, então essas trocam instantâneo. */
html.theme-transitioning table, html.theme-transitioning tr, html.theme-transitioning td, html.theme-transitioning th,
html.theme-transitioning tbody, html.theme-transitioning thead {
  transition-duration: 0s;
}

/* ── SMOOTH SCROLL GLOBAL ── */
html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}

/* ── RESET & BASE ── */
*, *::before, *::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html { height: 100%; }

body {
  font-family: 'Inter', sans-serif;
  font-weight: 400;
  background:
    radial-gradient(circle at 14% -10%, var(--wash-1), transparent 42%),
    radial-gradient(circle at 100% 0%, var(--wash-2), transparent 40%),
    var(--bg);
  background-attachment: fixed;
  color: var(--text);
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  overflow-x: clip; /* clip ≠ hidden: não cria scroll container, evita que body bloqueie scroll da janela */
  scrollbar-gutter: stable; /* reserva espaço do scrollbar, evita reflow no grid */
}

h1, h2, h3 { font-family: 'Inter', sans-serif; font-weight: 700; }

button {
  cursor: pointer;
  font-family: 'Inter', sans-serif;
}

/* ── EFEITO DE PROFUNDIDADE — feedback tátil de clique em todos os botões ──
   Especificidade zero via :where(), então qualquer regra :active mais específica
   (classe própria) continua vencendo; isso só entra como base para quem não tem uma. */
:where(button, .lead-name-link):not(:disabled) {
  transition: transform 0.1s cubic-bezier(0.4,0,0.2,1), filter 0.1s ease;
}
:where(button, .lead-name-link):not(:disabled):active {
  transform: scale(0.96);
  filter: brightness(0.96);
}
@media (prefers-reduced-motion: reduce) {
  :where(button, .lead-name-link):active { transform: none; filter: none; }
  .login-btn:hover, .add-lead-btn:hover { animation: none; }
}

input, select {
  font-family: 'Inter', sans-serif;
}

/* ── LOADING INDICATOR ── */
.loading-indicator {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.75rem;
  color: var(--royal-light);
  font-weight: 700;
  letter-spacing: 0.4px;
}

.loading-dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--royal-light);
  animation: blink 0.9s infinite alternate;
}

@keyframes blink {
  from { opacity: 0.3; transform: scale(0.8); }
  to   { opacity: 1;   transform: scale(1.1); }
}

/* ── TOAST ── */
.toast {
  position: fixed;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%) translateY(80px);
  background: var(--card);
  border: 1px solid var(--border);
  border-left: 3px solid var(--royal-light);
  color: var(--text);
  padding: 10px 20px;
  border-radius: 5px;
  font-size: 0.82rem;
  font-weight: 700;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
  z-index: 999;
  opacity: 0;
  transition: all 0.3s ease;
  white-space: nowrap;
}

.toast.show {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}

.toast.error { border-left-color: var(--s-declined); }
.toast.success { border-left-color: var(--s-sold); }
.toast.warning { border-left-color: var(--s-waiting); }

/* ── SIDEBAR ── */
.sidebar {
  position: fixed;
  top: 0;
  left: 0;
  width: 240px;
  height: 100vh;
  height: 100dvh;
  background: var(--bg2);
  border-right: 1px solid var(--border);
  z-index: 200;
  display: flex;
  flex-direction: column;
  transform: translateX(-240px);
  will-change: transform;
  transition: transform          0.26s cubic-bezier(0.4, 0, 0.2, 1),
              background-color   0.3s  cubic-bezier(0.4, 0, 0.2, 1),
              border-color       0.3s  cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 4px 0 24px rgba(0, 0, 0, 0.18);
}

.sidebar.open { transform: translateX(0); }

.sidebar-header {
  position: relative;
  padding: 22px 20px 18px;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}

.sidebar-brand-label {
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  color: var(--text3);
  margin-bottom: 4px;
}

.sidebar-brand-name {
  font-family: 'Inter', sans-serif;
  font-size: 1rem;
  font-weight: 700;
}

.sidebar-close {
  position: absolute;
  top: 18px;
  right: 14px;
  background: none;
  border: none;
  color: var(--text3);
  cursor: pointer;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--r-xs);
  transition: color 0.18s, background 0.18s, transform 0.18s;
  flex-shrink: 0;
}

.sidebar-close:hover { color: var(--royal-light); background: var(--royal-pale); }
.sidebar-close:active { transform: scale(0.96); }

.sidebar-nav {
  padding: 12px 0;
  flex: 1;
}

.nav-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 20px;
  color: var(--text2);
  font-size: 0.875rem;
  font-weight: 400;
  letter-spacing: 0.3px;
  border-left: 2px solid transparent;
  border-top: none;
  border-right: none;
  border-bottom: none;
  background: none;
  width: 100%;
  text-align: left;
  transition: all 0.2s;
}

.nav-item:hover {
  color: var(--text);
  background: var(--bg3);
}

.nav-item.active {
  color: var(--royal-light);
  border-left-color: transparent;
  background: var(--royal-pale);
  font-weight: 700;
}

.nav-icon {
  width: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.nav-icon svg {
  width: 17px;
  height: 17px;
  flex-shrink: 0;
  transition: filter 0.28s cubic-bezier(.4,0,.2,1);
}

/* Mesmo brilho de ícone do menu recolhido, aplicado também no menu aberto */
.nav-item:hover .nav-icon svg {
  filter: drop-shadow(0 0 5px var(--menu-glow));
}
.nav-item.active .nav-icon svg {
  filter: drop-shadow(0 0 4px var(--menu-glow));
}

.sidebar-footer {
  padding: 16px 20px;
  border-top: 1px solid var(--border);
  font-size: 0.75rem;
  color: var(--text3);
}

.sidebar-credit {
  font-size: 0.72rem;
  color: var(--text3);
  letter-spacing: 0.3px;
  opacity: 0.7;
}

/* SIDEBAR OVERLAY */
.sidebar-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.4);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  z-index: 199;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.28s ease;
}

.sidebar-overlay.show {
  opacity: 1;
  pointer-events: auto;
}

/* ── MINI SIDEBAR ── */
.mini-sidebar {
  position: fixed;
  top: 0;
  left: 0;
  width: 54px;
  height: 100vh;
  height: 100dvh;
  background: var(--bg2);
  border-right: 1px solid var(--border);
  z-index: 198;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 12px 0 16px;
  gap: 2px;
  box-shadow: 2px 0 10px rgba(0,0,0,0.08);
}

.mini-sidebar-toggle, .mini-nav-btn { position: relative; z-index: 1; }

.mini-sidebar-toggle {
  background: none;
  border: none;
  color: var(--text2);
  width: 40px;
  height: 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4.5px;
  margin-bottom: 14px;
  transition: color 0.2s, background-color 0.2s;
  border-radius: var(--r-sm);
  cursor: pointer;
  flex-shrink: 0;
}

.mini-sidebar-toggle:hover {
  color: var(--text);
  background: var(--bg3);
}

.mini-sidebar-toggle:active { transform: scale(0.96); }

.mini-sidebar-toggle span {
  display: block;
  width: 20px;
  height: 2px;
  background: currentColor;
  border-radius: var(--r-pill);
  transition: transform 0.32s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s ease, width 0.2s ease;
}

/* Morfa em X quando o sidebar está aberto (espelha .hamburger-btn) */
.mini-sidebar-toggle.open {
  color: var(--royal-light);
  background: var(--royal-pale);
}
.mini-sidebar-toggle.open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.mini-sidebar-toggle.open span:nth-child(2) { opacity: 0; width: 0; }
.mini-sidebar-toggle.open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

.mini-nav-btn {
  position: relative;
  background: none;
  border: none;
  color: var(--text3);
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  transition: color 0.28s cubic-bezier(.4,0,.2,1), filter 0.28s cubic-bezier(.4,0,.2,1), transform 0.28s cubic-bezier(.4,0,.2,1);
  flex-shrink: 0;
}

/* Sem bloco/fundo — só o ícone realça e brilha (azul royal no claro, branco no escuro) */
.mini-nav-btn:hover {
  color: var(--menu-glow);
  filter: drop-shadow(0 0 6px var(--menu-glow));
  transform: scale(1.1);
}
.mini-nav-btn:active { transform: scale(0.95); }

.mini-nav-btn.active {
  color: var(--menu-glow);
  filter: drop-shadow(0 0 5px var(--menu-glow));
}

.mini-nav-btn svg {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
}

.mini-alert-badge {
  position: absolute;
  top: 5px;
  right: 5px;
  background: #2451b3;
  color: #fff;
  font-size: 0.58rem;
  font-weight: 700;
  min-width: 14px;
  height: 14px;
  border-radius: 7px;
  padding: 0 3px;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

/* Nav label — sempre visível dentro do sidebar; o translateX do container cuida da animação.
   flex:1 + ellipsis evita que o texto invada o badge de contador quando o número é grande
   (ex: "1808" em Conformidade LGPD) ou o rótulo é longo. */
.nav-label {
  white-space: nowrap;
  display: inline-block;
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ── TOPBAR ── */
.topbar {
  position: sticky;
  top: 0;
  z-index: 220;
  background: var(--bg2);
  border-bottom: 1px solid var(--border);
  padding: 0 28px;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  box-shadow: var(--shadow);
  gap: 12px;
  margin-left: 54px; /* espaço para mini-sidebar */
}

.topbar-left {
  display: flex;
  align-items: center;
  gap: 18px;
  min-width: 0;
  flex: 1;
}

.topbar-right {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-shrink: 0;
}

.hamburger-btn {
  background: none;
  border: none;
  color: var(--text2);
  width: 40px;
  height: 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4.5px;
  border-radius: var(--r-sm);
  cursor: pointer;
  transition: color 0.2s, background-color 0.2s;
  flex-shrink: 0;
}

.hamburger-btn:hover { color: var(--text); background: var(--bg3); }
.hamburger-btn:active { transform: scale(0.96); }

.hamburger-btn span {
  display: block;
  width: 20px;
  height: 2px;
  background: currentColor;
  border-radius: var(--r-pill);
  transition: transform 0.32s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s ease, width 0.2s ease;
}

/* Morfa em X quando o sidebar está aberto */
.hamburger-btn.open {
  color: var(--royal-light);
  background: var(--royal-pale);
}
.hamburger-btn.open span:nth-child(1) {
  transform: translateY(6.5px) rotate(45deg);
}
.hamburger-btn.open span:nth-child(2) {
  opacity: 0;
  width: 0;
}
.hamburger-btn.open span:nth-child(3) {
  transform: translateY(-6.5px) rotate(-45deg);
}

/* Logo */
.logo-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
}

.logo-img {
  width: 38px;
  height: 38px;
  object-fit: contain;
  object-position: center;
  border-radius: 0;
  flex-shrink: 0;
  filter: drop-shadow(0 1px 5px rgba(0, 0, 0, 0.18));
  transition: opacity 0.2s ease, transform 0.2s ease;
}

.logo-img:hover {
  opacity: 0.88;
  transform: scale(1.08);
}

.topbar-divider {
  width: 1px;
  height: 28px;
  background: var(--border);
  flex-shrink: 0;
}

.page-title {
  font-size: 0.8rem;
  color: var(--text3);
  font-weight: 300;
  letter-spacing: 0.5px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* THEME TOGGLE */
.theme-toggle {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--bg3);
  border: 1px solid var(--border);
  border-radius: 20px;
  padding: 3px 3px 3px 10px;
}

.theme-icon {
  display: flex;
  align-items: center;
  position: relative;
  width: 16px;
  height: 16px;
  color: var(--text2);
}

.theme-icon .icon-sun,
.theme-icon .icon-moon {
  position: absolute;
  transition: opacity 0.3s ease, transform 0.3s ease;
}

/* Modo claro: mostra sol, esconde lua */
[data-theme="light"] .icon-sun  { opacity: 1; transform: scale(1) rotate(0deg); }
[data-theme="light"] .icon-moon { opacity: 0; transform: scale(0.6) rotate(20deg); }

/* Modo escuro: mostra lua, esconde sol */
[data-theme="dark"] .icon-sun  { opacity: 0; transform: scale(0.6) rotate(-20deg); }
[data-theme="dark"] .icon-moon { opacity: 1; transform: scale(1) rotate(0deg); }

/* Tooltip externo dos donuts */
#donut-tooltip,
#bar-tooltip {
  position: absolute;
  background: var(--card, #fff);
  color: var(--text, #111);
  border: 1px solid var(--border, #ddd);
  border-top: 2px solid var(--teal, #12b8a3);
  border-radius: var(--r-xs, 8px);
  padding: 6px 12px;
  font-family: 'Inter', sans-serif;
  font-size: 0.78rem;
  font-weight: 500;
  pointer-events: none;
  white-space: nowrap;
  box-shadow: var(--glow-hover, 0 4px 16px rgba(0,0,0,0.15));
  transition: opacity 0.15s ease;
  opacity: 0;
  z-index: 9999;
}

.toggle-switch {
  position: relative;
  width: 34px;
  height: 18px;
  background: var(--border);
  border-radius: 99px;
  border: none;
  transition: background 0.2s;
}

.toggle-switch.on,
[data-theme="dark"] .toggle-switch { background: var(--royal-mid); }

.toggle-knob {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 14px;
  height: 14px;
  background: white;
  border-radius: 50%;
  transition: transform 0.2s;
  pointer-events: none;
}

.toggle-switch.on .toggle-knob,
[data-theme="dark"] .toggle-switch .toggle-knob { transform: translateX(16px); }

/* ── MAIN LAYOUT ── */
.main {
  flex: 1;
  min-width: 0; /* evita overflow em flex item */
  padding: 28px;
  padding-bottom: 100px; /* espaço extra para o conteúdo nunca ficar embaixo do termômetro (position:fixed, bottom-right) */
  margin-left: 54px; /* espaço para mini-sidebar */
  /* overflow-x é tratado no body — não definir aqui evita criar scroll container interno */
}

/* ── PAGE SECTIONS ── */
.page { display: none; }
.page.active {
  display: block;
  animation: pageIn 0.38s cubic-bezier(0.22,1,0.36,1) both;
}
@keyframes pageIn {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── CARD ENTER ANIMATION ── */
@keyframes cardIn {
  from { opacity: 0; transform: translateY(12px) scale(0.97); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

.kpi-grid.is-entering .kpi-card,
.insight-grid.is-entering .insight-card {
  animation: cardIn 0.38s cubic-bezier(0.22, 1, 0.36, 1) both;
}
.kpi-grid.is-entering .kpi-card:nth-child(1),
.insight-grid.is-entering .insight-card:nth-child(1) { animation-delay:   0ms; }
.kpi-grid.is-entering .kpi-card:nth-child(2),
.insight-grid.is-entering .insight-card:nth-child(2) { animation-delay:  50ms; }
.kpi-grid.is-entering .kpi-card:nth-child(3),
.insight-grid.is-entering .insight-card:nth-child(3) { animation-delay: 100ms; }
.kpi-grid.is-entering .kpi-card:nth-child(4),
.insight-grid.is-entering .insight-card:nth-child(4) { animation-delay: 150ms; }
.kpi-grid.is-entering .kpi-card:nth-child(5),
.insight-grid.is-entering .insight-card:nth-child(5) { animation-delay: 200ms; }
.kpi-grid.is-entering .kpi-card:nth-child(6),
.insight-grid.is-entering .insight-card:nth-child(6) { animation-delay: 250ms; }

/* ── SECTION HEADER ── */
.page-header {
  margin-bottom: 24px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
}

.page-header h2 {
  font-size: 1.4rem;
  font-weight: 700;
  letter-spacing: -0.3px;
}

.page-header p {
  font-size: 0.82rem;
  color: var(--text3);
  margin-top: 4px;
  font-weight: 300;
}

/* ── KPI GRID ── */
.kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 16px;
  margin-bottom: 28px;
}

.kpi-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 18px 20px;
  box-shadow: var(--glow-strong);
  position: relative;
  overflow: hidden;
  transition: transform var(--transition-lift), box-shadow var(--transition-lift),
              background-color 0.3s cubic-bezier(0.4, 0, 0.2, 1),
              color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  will-change: transform;
}

/* ── SKELETON SYSTEM ─────────────────────────────────────────────────────── */
@keyframes skelShimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* Base shimmer block — compose with size classes */
.skel-block {
  border-radius: 5px;
  background: linear-gradient(90deg, var(--border) 25%, var(--bg3) 50%, var(--border) 75%);
  background-size: 200% 100%;
  animation: skelShimmer 1.5s ease-in-out infinite;
}

/* Stagger so all cards don't pulse in sync */
.kpi-skeleton:nth-child(2) .skel-block,
.insight-card:nth-child(2) .skel-block { animation-delay: 0.1s; }
.kpi-skeleton:nth-child(3) .skel-block,
.insight-card:nth-child(3) .skel-block { animation-delay: 0.2s; }
.kpi-skeleton:nth-child(4) .skel-block,
.insight-card:nth-child(4) .skel-block { animation-delay: 0.3s; }
.kpi-skeleton:nth-child(5) .skel-block,
.insight-card:nth-child(5) .skel-block { animation-delay: 0.15s; }
.kpi-skeleton:nth-child(6) .skel-block,
.insight-card:nth-child(6) .skel-block { animation-delay: 0.25s; }

/* KPI card skeleton lines */
.skel-label  { height: 10px; width: 58%; margin-bottom: 14px; }
.skel-value  { height: 28px; width: 38%; margin-bottom: 10px; border-radius: 6px; }
.skel-sub    { height: 9px;  width: 72%; }
.skel-ins-big{ height: 22px; width: 50%; margin-bottom: 10px; border-radius: 6px; }

.kpi-skeleton { pointer-events: none; }

/* Chart overlay — sits atop blank canvas until Chart.js renders */
.chart-skel-overlay {
  position: absolute; inset: 0; z-index: 2;
  border-radius: 6px;
  background: var(--card);
  overflow: hidden;
  transition: opacity 0.35s ease;
}
.chart-skel-overlay::after {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(90deg, var(--border) 25%, var(--bg3) 50%, var(--border) 75%);
  background-size: 200% 100%;
  animation: skelShimmer 1.5s ease-in-out infinite;
}
.chart-skel-overlay.chart-skel-out {
  opacity: 0;
  pointer-events: none;
}

.kpi-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--glow-strong-hover);
}

.kpi-card-label {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--text3);
  margin-bottom: 10px;
}

.kpi-card-value {
  font-family: 'Inter', sans-serif;
  /* Tamanho fixo (não depende de vw) — unidade vw acompanha a largura da
     JANELA, não a do card, então em zooms diferentes ela e a largura real
     do grid desalinhavam e o valor ora quebrava no meio, ora era cortado
     com "...". Um tamanho fixo sempre cabe no card e nunca esconde dígito. */
  font-size: 1.35rem;
  font-weight: 700;
  line-height: 1.1;
  white-space: nowrap;
}

.kpi-card-sub {
  font-size: 0.75rem;
  color: var(--text3);
  margin-top: 8px;
}

.kpi-accent {
  display: block;
  flex-shrink: 0;
  width: 3px;
  min-height: 28px;
  align-self: stretch;
  border-radius: 2px;
}

/* ── CHARTS ── */
.charts-grid-2 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr));
  gap: 20px;
  margin-bottom: 24px;
}

.charts-grid-3 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr));
  gap: 20px;
  margin-bottom: 24px;
}

.chart-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 20px;
  box-shadow: var(--glow-strong);
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform var(--transition-lift), box-shadow var(--transition-lift);
}
.chart-card:hover { transform: translateY(-2px); box-shadow: var(--glow-strong-hover); }

.chart-card-title {
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--text3);
  margin-bottom: 16px;
  padding-right: 34px;
}

.chart-card-title strong { color: var(--text); }

.chart-wrap { position: relative; flex: 1 1 auto; min-height: 0; }

/* ── DONUT CENTER TEXT (HTML overlay, sem plugin Chart.js) ── */
.donut-center {
  position: absolute;
  transform: translate(-50%, -50%);
  text-align: center;
  pointer-events: none;
  line-height: 1.2;
}
.donut-lbl {
  font-family: 'Inter', sans-serif;
  font-size: 0.58rem;
  font-weight: 700;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  color: var(--text3);
}
.donut-val {
  font-family: 'Inter', sans-serif;
  font-weight: 700;
  font-size: 1.35rem;
  color: var(--text);
}
.donut-val-lg {
  font-size: 1.75rem;
}

/* ── TABLE SECTION ── */
.table-toolbar {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--r-md) var(--r-md) 0 0;
  padding: 14px 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  border-bottom: none;
  box-shadow: var(--glow);
  position: relative;
  z-index: 1;
}

.table-filters {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

.filter-chip {
  padding: 4px 12px;
  border-radius: var(--r-pill);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.4px;
  border: 1px solid var(--border);
  background: transparent;
  color: var(--text3);
  transition: background-color 0.18s, border-color 0.18s, color 0.18s, transform 0.12s, box-shadow 0.18s;
}

.filter-chip:hover {
  border-color: var(--royal-mid);
  color: var(--royal-light);
  transform: translateY(-1px);
}

.filter-chip[data-filter]:not([data-filter="todos"]):hover {
  background: rgba(128, 128, 128, 0.07);
}

.filter-chip:active { transform: scale(0.96); }

.filter-chip.active {
  background: var(--grad-brand);
  border-color: transparent;
  color: #fff;
  box-shadow: 0 4px 14px -6px rgba(36,81,179,.6);
}

.filter-chip.active[data-filter="Pendente de Tratativa"] {
  background: rgba(136,136,136,0.15);
  border-color: rgba(136,136,136,0.65) !important;
}
.filter-chip.active[data-filter="Venda Declinada"] {
  background: rgba(192,57,43,0.15);
  border-color: rgba(192,57,43,0.65) !important;
}
.filter-chip.active[data-filter="Aguardando Retorno"] {
  background: rgba(212,172,13,0.15);
  border-color: rgba(212,172,13,0.65) !important;
}
.filter-chip.active[data-filter="Em Negociação"] {
  background: rgba(125,60,152,0.15);
  border-color: rgba(125,60,152,0.65) !important;
}
.filter-chip.active[data-filter="Em Fechamento"] {
  background: rgba(230,126,34,0.15);
  border-color: rgba(230,126,34,0.65) !important;
}
.filter-chip.active[data-filter="Venda Realizada"] {
  background: rgba(30,132,73,0.15);
  border-color: rgba(30,132,73,0.65) !important;
}
.filter-chip.active[data-filter="Negociação Futura"] {
  background: rgba(192,88,154,0.15);
  border-color: rgba(192,88,154,0.65) !important;
}
.filter-chip.active[data-filter="Venda Programada"] {
  background: rgba(13,168,152,0.15);
  border-color: rgba(13,168,152,0.65) !important;
}

.search-box {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--bg3);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 6px 10px 6px 12px;
}

.search-box input {
  background: none;
  border: none;
  outline: none;
  color: var(--text);
  font-size: 0.82rem;
  flex: 1;
  min-width: 100px;
  max-width: 260px;
}

.search-box input::placeholder { color: var(--text3); }

.search-icon {
  color: var(--text3);
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

.search-clear {
  display: flex;
  align-items: center;
  justify-content: center;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--text3);
  padding: 2px;
  border-radius: 3px;
  transition: color 0.15s, background 0.15s;
  flex-shrink: 0;
}

.search-clear:hover {
  color: var(--text);
  background: var(--border);
}

.add-lead-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  background: var(--grad-brand);
  background-size: 100% auto;
  border: none;
  color: #fff;
  padding: 8px 16px;
  border-radius: var(--r-sm);
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.3px;
  box-shadow: 0 6px 16px -6px rgba(36,81,179,.55);
  transition: background-position 0.4s ease, background-size 0.4s ease;
  white-space: nowrap;
}

.add-lead-btn:hover {
  background-position: right center;
  background-size: 200% auto;
  animation: ctaPulseGlowSm 1.5s infinite;
}
.add-lead-btn:active { transform: scale(0.96); }

@keyframes ctaPulseGlowSm {
  0%   { box-shadow: 0 6px 16px -6px rgba(36,81,179,.55), 0 0 0 0 rgba(76,227,247,.5); }
  70%  { box-shadow: 0 6px 16px -6px rgba(36,81,179,.55), 0 0 0 10px rgba(76,227,247,0); }
  100% { box-shadow: 0 6px 16px -6px rgba(36,81,179,.55), 0 0 0 0 rgba(76,227,247,0); }
}

/* ── EXPORT BUTTONS ── */
.export-btns {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}

.export-btn {
  display: flex;
  align-items: center;
  gap: 5px;
  background: transparent;
  border: 1px solid var(--border);
  color: var(--text2);
  padding: 7px 13px;
  border-radius: var(--r-xs);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.2px;
  white-space: nowrap;
  transition: background 0.18s, border-color 0.18s, color 0.18s, transform 0.1s ease;
}

.export-btn:hover {
  background: rgba(26,60,143,0.08);
  border-color: var(--royal-light);
  color: var(--royal-light);
}
.export-btn:active { transform: scale(0.96); }

.export-btn-all {
  border-color: rgba(30,132,73,0.4);
  color: var(--s-sold);
}

.export-btn-all:hover {
  background: rgba(30,132,73,0.08);
  border-color: var(--s-sold);
  color: var(--s-sold);
}

.export-btn--pdf {
  border-color: rgba(192,57,43,0.35);
  color: rgba(192,57,43,0.85);
}
.export-btn--pdf:hover {
  background: rgba(192,57,43,0.08);
  border-color: rgba(192,57,43,0.7);
  color: rgba(192,57,43,1);
}

/* ── SELEÇÃO EM MASSA (Controle de Leads) ─────────────────────────────── */
.bulk-mode-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  background: var(--bg3);
  border: 1px solid var(--border);
  color: var(--text2);
  padding: 8px 16px;
  border-radius: var(--r-sm);
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.3px;
  white-space: nowrap;
  cursor: pointer;
  transition: var(--transition);
}
.bulk-mode-btn:hover { border-color: var(--royal-light); color: var(--royal-light); }
.bulk-mode-btn.active {
  background: var(--grad-brand);
  border-color: transparent;
  color: #fff;
  box-shadow: 0 4px 14px -4px rgba(36,81,179,.6);
}

.bulk-action-bar {
  background: var(--card);
  border: 1px solid var(--border);
  position: relative;
  overflow: hidden;
  border-radius: var(--r-md);
  padding: 12px 16px;
  margin-bottom: 12px;
  box-shadow: var(--glow);
  animation: bulkBarIn 0.25s cubic-bezier(.4,0,.2,1);
}
.bulk-action-bar::before {
  content: '';
  position: absolute;
  top: 0; bottom: 0; left: 0;
  width: 3px;
  background: linear-gradient(180deg, var(--royal), var(--royal-light), #a8c4f0);
}
@keyframes bulkBarIn {
  from { opacity: 0; transform: translateY(-6px); }
  to   { opacity: 1; transform: translateY(0); }
}
.bulk-action-bar-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
}
.bulk-count {
  font-size: 0.85rem;
  color: var(--text2);
  white-space: nowrap;
}
.bulk-count strong { color: var(--royal-light); font-size: 0.95rem; }

.bulk-daterange {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.76rem;
  color: var(--text3);
  flex-wrap: wrap;
}
.bulk-daterange input[type="date"] {
  border: 1px solid var(--border);
  background: var(--bg3);
  color: var(--text);
  border-radius: var(--r-xs);
  padding: 5px 8px;
  font-size: 0.78rem;
}
.bulk-select-filtered-btn {
  background: transparent;
  border: 1px solid var(--border);
  color: var(--text2);
  padding: 6px 12px;
  border-radius: var(--r-xs);
  font-size: 0.76rem;
  font-weight: 600;
  cursor: pointer;
  transition: var(--transition);
  white-space: nowrap;
}
.bulk-select-filtered-btn:hover { border-color: var(--royal-light); color: var(--royal-light); }

.bulk-status-select {
  border: 1px solid var(--border);
  background: var(--bg3);
  color: var(--text);
  border-radius: var(--r-xs);
  padding: 7px 10px;
  font-size: 0.8rem;
  font-weight: 600;
  cursor: pointer;
}

.bulk-apply-btn {
  background: var(--grad-brand);
  border: none;
  color: #fff;
  padding: 8px 18px;
  border-radius: var(--r-sm);
  font-size: 0.8rem;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 4px 14px -4px rgba(36,81,179,.6);
  transition: var(--transition);
  white-space: nowrap;
}
.bulk-apply-btn:hover { filter: brightness(1.08); }
.bulk-apply-btn:disabled { opacity: 0.6; cursor: not-allowed; }

.bulk-cancel-btn {
  background: transparent;
  border: 1px solid var(--border);
  color: var(--text3);
  padding: 8px 14px;
  border-radius: var(--r-sm);
  font-size: 0.78rem;
  font-weight: 600;
  cursor: pointer;
  transition: var(--transition);
  white-space: nowrap;
  margin-left: auto;
}
.bulk-cancel-btn:hover { border-color: var(--s-declined); color: var(--s-declined); }

.bulk-col { width: 34px; text-align: center; padding: 0 4px !important; }
.bulk-col input[type="checkbox"] { width: 15px; height: 15px; cursor: pointer; accent-color: var(--royal-light); }
tr.bulk-row--selected td { background: rgba(58,111,216,0.06); }

.table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; }

.leads-table {
  width: 100%;
  border-collapse: collapse;
  background: var(--card);
  border: 1px solid var(--border);
  border-top: none;
  min-width: 600px;
}

.leads-table thead th {
  padding: 10px 14px;
  text-align: center;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.9px;
  text-transform: uppercase;
  color: var(--text3);
  background: var(--card2);
  border-bottom: 2px solid var(--teal);
  white-space: nowrap;
  user-select: none;
  cursor: pointer;
}

.leads-table thead th:hover { color: var(--text); }
.leads-table thead th[data-sort]:hover { color: var(--royal-light); }

.leads-table tbody tr {
  border-bottom: 1px solid var(--border);
  transition: background 0.12s;
}

.leads-table tbody tr:hover { background: var(--royal-pale); }
.leads-table tbody tr:last-child { border-bottom: none; }

.leads-table tbody td {
  padding: 11px 14px;
  font-size: 0.82rem;
  white-space: nowrap;
  text-align: center;
  vertical-align: middle;
}

.leads-table tbody td.col-name { font-weight: 700; }
.leads-table tbody td.col-muted { color: var(--text3); font-size: 0.75rem; }
.lead-name-link {
  background: none; border: none; padding: 0; margin: 0;
  font: inherit; font-weight: 700; color: inherit; cursor: pointer;
  text-align: left; text-decoration: underline dotted var(--border);
  text-underline-offset: 3px;
}
.lead-name-link:hover { color: var(--royal-light); text-decoration-color: var(--royal-light); }

/* Nome (col 2) — header e dados à esquerda */
.leads-table thead th:nth-child(2),
.leads-table tbody td:nth-child(2) { text-align: left; }

/* Produto Fechado (col 3) — esquerda só na tabela de Faturamento */
#page-faturamento .leads-table thead th:nth-child(3),
#page-faturamento .leads-table tbody td:nth-child(3) { text-align: left; }

/* STATUS PILLS */
.pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 9px;
  border-radius: var(--r-pill);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.4px;
  white-space: nowrap;
}

.pill-declined { background: rgba(192, 57, 43, 0.12);  color: var(--s-declined); }
.pill-waiting  { background: rgba(212, 172, 13, 0.12); color: var(--s-waiting); }
.pill-negot    { background: rgba(125, 60, 152, 0.12); color: var(--s-negot); }
.pill-closing  { background: rgba(230, 126, 34, 0.12); color: #e67e22; }
.pill-sold     { background: rgba(30, 132, 73, 0.12);  color: var(--s-sold); }
.pill-future      { background: rgba(192, 88, 154, 0.12); color: var(--s-future); }
.pill-programada  { background: rgba(13, 168, 152, 0.12); color: var(--s-programada); }
.pill-pending     { background: rgba(100, 100, 100, 0.12); color: var(--text3); }

/* BRADESCO BADGE */
.badge-yes { background: rgba(30, 132, 73, 0.1);  color: var(--s-sold);     font-size: 0.7rem; font-weight: 700; padding: 2px 8px; border-radius: var(--r-pill); }
.badge-no  { background: rgba(192, 57, 43, 0.1);  color: var(--s-declined); font-size: 0.7rem; font-weight: 700; padding: 2px 8px; border-radius: var(--r-pill); }
.badge-unk { background: rgba(100, 100, 100, 0.1); color: var(--text3);     font-size: 0.7rem; font-weight: 700; padding: 2px 8px; border-radius: var(--r-pill); }
.origem-badge { font-size: 0.7rem; font-weight: 600; padding: 2px 7px; border-radius: 3px; white-space: nowrap; }
.origem-insta { background: rgba(131, 56, 236, 0.12); color: #9b59d0; }
.origem-ind   { background: rgba(41, 182, 246, 0.12);  color: #1a8abf; }
.origem-lp    { background: rgba(27, 175, 122, 0.14);  color: #199e70; }

/* ACTION BUTTONS */
.action-wrap { display: flex; gap: 4px; }

.action-btn {
  background: none;
  border: 1px solid var(--border);
  color: var(--text3);
  padding: 4px 9px;
  border-radius: 3px;
  font-size: 0.72rem;
  transition: all 0.15s;
}

.action-btn:hover { border-color: var(--royal-mid); color: var(--royal-light); }
.action-btn.del:hover { border-color: var(--s-declined); color: var(--s-declined); }

/* PAGINATION */
.table-footer {
  background: var(--card2);
  border: 1px solid var(--border);
  border-top: none;
  border-radius: 0 0 var(--r-md) var(--r-md);
  box-shadow: var(--glow);
  padding: 10px 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 0.75rem;
  color: var(--text3);
  flex-wrap: wrap;
  gap: 8px;
}

.page-btns { display: flex; gap: 4px; flex-wrap: wrap; align-items: center; }

.page-btn {
  padding: 4px 10px;
  border-radius: var(--r-xs);
  border: 1px solid var(--border);
  background: none;
  color: var(--text2);
  font-size: 0.78rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.15s;
  min-width: 30px;
  text-align: center;
}

.page-btn.active {
  background: var(--grad-brand);
  border-color: transparent;
  color: #fff;
  font-weight: 700;
  box-shadow: 0 3px 10px -4px rgba(36,81,179,.6);
}

.page-btn:hover:not(.active):not(:disabled) {
  border-color: var(--royal-mid);
  color: var(--royal-light);
  background: rgba(100, 60, 220, 0.06);
}

.page-btn:active:not(:disabled) { transform: scale(0.96); }

.page-btn:disabled {
  opacity: 0.3;
  cursor: default;
}

.page-arrow {
  font-size: 1rem;
  line-height: 1;
  padding: 3px 11px;
  color: var(--text2);
}

.page-ellipsis {
  color: var(--text3);
  font-size: 0.78rem;
  padding: 0 2px;
  user-select: none;
  letter-spacing: 1px;
}

/* ── KANBAN VIEW ─────────────────────────────────────────────────── */
.leads-view-toggle {
  display: flex;
  background: var(--bg3);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 3px;
  gap: 2px;
}
.view-btn {
  display: flex;
  align-items: center;
  gap: 5px;
  background: none;
  border: none;
  color: var(--text3);
  cursor: pointer;
  padding: 5px 10px;
  border-radius: 4px;
  font-size: 0.76rem;
  font-weight: 600;
  transition: background 0.15s, color 0.15s;
  white-space: nowrap;
}
.view-btn:hover { color: var(--text); }
.view-btn.active {
  background: var(--card);
  color: var(--royal-light);
  box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

.kanban-board {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  padding: 4px 0 18px;
  scrollbar-width: thin;
  scrollbar-color: var(--border) transparent;
  min-height: 320px;
  align-items: flex-start;
  margin-top: 12px;
}
.kanban-board::-webkit-scrollbar { height: 5px; }
.kanban-board::-webkit-scrollbar-thumb { background: var(--border); border-radius: 3px; }

.kanban-col {
  flex: 0 0 210px;
  background: var(--bg3);
  border: 1px solid var(--border);
  border-top-width: 3px;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  max-height: calc(100vh - 300px);
  min-height: 120px;
}
.kanban-col-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 12px 8px;
  flex-shrink: 0;
}
.kanban-col-title {
  font-size: 0.68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.7px;
  color: var(--text2);
}
.kanban-col-count {
  font-size: 0.7rem;
  font-weight: 700;
  background: var(--border);
  color: var(--text3);
  border-radius: 10px;
  padding: 1px 7px;
  min-width: 22px;
  text-align: center;
}
.kanban-cards {
  flex: 1;
  overflow-y: auto;
  padding: 4px 8px 10px;
  display: flex;
  flex-direction: column;
  gap: 7px;
  scrollbar-width: thin;
  scrollbar-color: var(--border) transparent;
}
.kanban-cards::-webkit-scrollbar { width: 3px; }
.kanban-cards::-webkit-scrollbar-thumb { background: var(--border); border-radius: 2px; }
.kanban-empty {
  color: var(--text3);
  font-size: 0.76rem;
  text-align: center;
  padding: 18px 0;
  opacity: 0.7;
}
.kanban-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--r-xs);
  padding: 9px 10px;
  cursor: grab;
  transition: border-color 0.15s, box-shadow 0.15s, opacity 0.15s, transform 0.15s;
  user-select: none;
  /* Sem isso, o navegador pode interpretar o gesto de arrastar como scroll/swipe
     nativo (o board rola na horizontal, a coluna rola na vertical) e "roubar" o
     toque do nosso touchmove no meio do arraste — em PWA instalado isso pode
     disparar a navegação de voltar do sistema, parecendo que o app fechou. */
  touch-action: none;
}
.kanban-card:hover {
  border-color: var(--royal-mid);
  box-shadow: var(--glow);
  transform: translateY(-1px);
}
.kanban-card.dragging {
  opacity: 0.2;
  cursor: grabbing;
}
.kanban-col.drag-over {
  background: var(--royal-pale);
  border-color: var(--royal-mid);
  outline: 2px dashed var(--royal-mid);
  outline-offset: -2px;
}
.kanban-col.drag-over .kanban-empty {
  color: var(--royal-light);
  font-weight: 600;
}
.kanban-card-name {
  display: block;
  width: 100%;
  background: none;
  border: none;
  padding: 0;
  font-size: 0.81rem;
  font-weight: 700;
  color: var(--royal-light);
  cursor: pointer;
  text-align: left;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-bottom: 5px;
}
.kanban-card-name:hover { text-decoration: underline; }
.kanban-card-meta {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 0.71rem;
  color: var(--text3);
  margin-top: 4px;
}
.kanban-card-agend {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.69rem;
  color: var(--royal-light);
  margin-top: 5px;
  opacity: 0.85;
}

/* ── MODAL ── */
.modal-overlay {
  display: flex;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
  z-index: 500;
  align-items: center;
  justify-content: center;
  padding: 16px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.25s ease;
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
}

.modal-overlay.show {
  opacity: 1;
  pointer-events: auto;
}

.modal {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  padding: 28px;
  width: 520px;
  max-width: 100%;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: var(--glow-hover), 0 20px 60px rgba(0, 0, 0, 0.4);
  transform: translateY(16px) scale(0.97);
  opacity: 0;
  transition: transform 0.32s cubic-bezier(0.22,1,0.36,1), opacity 0.25s ease,
              background-color 0.3s cubic-bezier(0.4, 0, 0.2, 1),
              border-color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  will-change: transform, opacity;
  overscroll-behavior: contain;
}

.modal-overlay.show .modal {
  transform: translateY(0) scale(1);
  opacity: 1;
}

.modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 22px 14px;
  border-bottom: 1px solid var(--border);
}

.modal-title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--text1);
  margin: 0;
}

.modal-close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border: none;
  background: transparent;
  color: var(--text3);
  border-radius: 4px;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
  flex-shrink: 0;
}

.modal-close:hover {
  background: var(--hover);
  color: var(--text1);
}

.modal-body {
  padding: 20px 22px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.modal h3 {
  font-size: 1.1rem;
  margin-bottom: 20px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--border);
}

.form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

.form-group {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.form-group.full { grid-column: 1 / -1; }

.form-label {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.7px;
  text-transform: uppercase;
  color: var(--text3);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
}

.doc-detected-badge {
  font-size: 0.65rem;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 3px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}
.doc-badge-cpf  { background: #1a3c8f22; color: #1a3c8f; border: 1px solid #1a3c8f44; }
.doc-badge-cnpj { background: #7d3c9822; color: #7d3c98; border: 1px solid #7d3c9844; }

.pj-field { display: none; }

.form-input,
.form-select {
  padding: 9px 12px;
  border-radius: 4px;
  border: 1px solid var(--border);
  background: var(--bg3);
  color: var(--text);
  font-size: 0.85rem;
  outline: none;
  transition: border-color 0.18s, box-shadow 0.18s,
              background-color 0.3s cubic-bezier(0.4, 0, 0.2, 1),
              color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.form-input:focus,
.form-select:focus {
  border-color: var(--royal-mid);
  box-shadow: 0 0 0 3px rgba(36, 81, 179, 0.14);
}

.form-select option { background: var(--bg2); }

/* ── PRODUÇÃO CARDS ── */
.prod-cards-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 20px;
  margin-bottom: 28px;
}
.prod-cards-grid .prod-card {
  animation: prodCardIn 0.42s cubic-bezier(0.22,1,0.36,1) both;
}
.prod-cards-grid .prod-card:nth-child(1) { animation-delay:  0ms; }
.prod-cards-grid .prod-card:nth-child(2) { animation-delay: 70ms; }
.prod-cards-grid .prod-card:nth-child(3) { animation-delay:140ms; }
.prod-cards-grid .prod-card:nth-child(4) { animation-delay:210ms; }
.prod-cards-grid .prod-card:nth-child(5) { animation-delay:280ms; }
@keyframes prodCardIn {
  from { opacity: 0; transform: translateY(18px) scale(0.97); }
  to   { opacity: 1; transform: translateY(0)   scale(1);    }
}

.prod-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 18px;
  padding: 22px 22px 20px;
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 10px;
  transition: transform 0.22s cubic-bezier(0.22,1,0.36,1), box-shadow 0.22s, border-color 0.22s,
              background-color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.prod-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 16px 40px rgba(0,0,0,0.22);
}

.prod-card-accent {
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  border-radius: 18px 18px 0 0;
}
.prod-card--blue   .prod-card-accent  { background: linear-gradient(90deg,#1a3c8f,#3a6fd8,#60a5fa); }
.prod-card--green  .prod-card-accent  { background: linear-gradient(90deg,#15803d,#22c55e,#86efac); }
.prod-card--purple .prod-card-accent  { background: linear-gradient(90deg,#6d28d9,#a855f7,#d8b4fe); }
.prod-card--red    .prod-card-accent  { background: linear-gradient(90deg,#991b1b,#ef4444,#fca5a5); }
.prod-card--meta-orange .prod-card-accent { background: linear-gradient(90deg,#92400e,#f59e0b,#fde68a); }
.prod-card--meta-blue   .prod-card-accent { background: linear-gradient(90deg,#1a3c8f,#3a6fd8,#60a5fa); }
.prod-card--meta-green  .prod-card-accent { background: linear-gradient(90deg,#15803d,#22c55e,#86efac); }

.prod-card-glow {
  position: absolute;
  width: 160px;
  height: 160px;
  border-radius: 50%;
  top: -40px; right: -40px;
  pointer-events: none;
  opacity: 0.55;
}
.prod-card--blue   .prod-card-glow  { background: radial-gradient(circle, rgba(58,111,216,0.18) 0%, transparent 70%); }
.prod-card--green  .prod-card-glow  { background: radial-gradient(circle, rgba(34,197,94,0.16) 0%, transparent 70%); }
.prod-card--purple .prod-card-glow  { background: radial-gradient(circle, rgba(168,85,247,0.16) 0%, transparent 70%); }
.prod-card--red    .prod-card-glow  { background: radial-gradient(circle, rgba(239,68,68,0.18) 0%, transparent 70%); }
.prod-card--meta-orange .prod-card-glow { background: radial-gradient(circle, rgba(245,158,11,0.18) 0%, transparent 70%); }
.prod-card--meta-blue   .prod-card-glow { background: radial-gradient(circle, rgba(58,111,216,0.18) 0%, transparent 70%); }
.prod-card--meta-green  .prod-card-glow { background: radial-gradient(circle, rgba(34,197,94,0.16)  0%, transparent 70%); }

.prod-card-icon {
  width: 46px;
  height: 46px;
  border-radius: 13px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-bottom: 2px;
}
.prod-card--blue   .prod-card-icon { background: rgba(58,111,216,0.14); color: #60a5fa; }
.prod-card--green  .prod-card-icon { background: rgba(34,197,94,0.14);  color: #22c55e; }
.prod-card--purple .prod-card-icon { background: rgba(168,85,247,0.14); color: #a855f7; }
.prod-card--red    .prod-card-icon { background: rgba(239,68,68,0.14);   color: #f87171; }

.prod-card-label {
  font-size: 0.67rem;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--text3);
}
.prod-card-value {
  /* Tamanho fixo — vw desalinha da largura real do card em zooms diferentes.
     Nunca esconde dígito: fica sempre inteiro, sem quebrar nem cortar. */
  font-size: 1.7rem;
  font-weight: 800;
  line-height: 1;
  color: var(--text);
  white-space: nowrap;
  min-width: 0;
}
.prod-card-sub {
  font-size: 0.71rem;
  color: var(--text3);
  margin-top: 2px;
}

/* Meta card layout */
.prod-card--meta {
  gap: 12px;
}
.prod-meta-row {
  display: flex;
  align-items: center;
  gap: 18px;
}
.prod-ring-wrap {
  position: relative;
  width: 96px;
  height: 96px;
  flex-shrink: 0;
}
.prod-ring-svg {
  width: 100%;
  height: 100%;
  transform: rotate(-90deg);
}
.prod-ring-track {
  fill: none;
  stroke: var(--border);
  stroke-width: 8;
}
.prod-ring-fill {
  fill: none;
  stroke-width: 8;
  stroke-linecap: round;
  transition: stroke-dashoffset 1.2s cubic-bezier(0.22, 1, 0.36, 1);
}
.prod-card--meta-orange .prod-ring-fill { stroke: #f59e0b; }
.prod-card--meta-blue   .prod-ring-fill { stroke: #3a6fd8; }
.prod-card--meta-green  .prod-ring-fill { stroke: #22c55e; filter: drop-shadow(0 0 6px rgba(34,197,94,0.5)); }

.prod-ring-center {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.prod-ring-pct {
  font-size: 1.25rem;
  font-weight: 800;
  line-height: 1;
  color: var(--text);
  text-align: center;
}
.prod-mes-select {
  background: var(--bg3);
  border: 1px solid var(--border);
  border-radius: 8px;
  color: var(--text);
  font-size: 0.82rem;
  padding: 7px 12px;
  cursor: pointer;
  outline: none;
  transition: border-color 0.15s;
  min-width: 160px;
}
.prod-mes-select:focus { border-color: var(--royal-mid); }
.prod-mes-select option { background: var(--bg2); }

.prod-card-label-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.prod-meta-edit-btn {
  display: flex;
  align-items: center;
  gap: 4px;
  background: none;
  border: 1px solid var(--border);
  border-radius: 6px;
  color: var(--text3);
  font-size: 0.68rem;
  padding: 3px 8px;
  cursor: pointer;
  transition: color 0.15s, border-color 0.15s;
  white-space: nowrap;
}
.prod-meta-edit-btn:hover { color: var(--text2); border-color: var(--text3); }

.prod-ring-sem-meta {
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--text3);
  text-align: center;
  line-height: 1.3;
}

/* Popover de edição de meta */
.prod-meta-popover {
  position: fixed;
  z-index: 9999;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  box-shadow: 0 12px 36px rgba(0,0,0,0.28);
  padding: 16px;
  width: 220px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  animation: popIn 0.18s cubic-bezier(0.22,1,0.36,1);
}
@keyframes popIn {
  from { opacity: 0; transform: translateY(-6px) scale(0.97); }
  to   { opacity: 1; transform: translateY(0)   scale(1);    }
}
.prod-meta-pop-title { font-size: 0.8rem; font-weight: 700; color: var(--text); }
.prod-meta-pop-hint  { font-size: 0.68rem; color: var(--text3); margin-top: -4px; }
.prod-meta-pop-input {
  background: var(--bg3);
  border: 1px solid var(--border);
  border-radius: 8px;
  color: var(--text);
  font-size: 0.9rem;
  font-weight: 600;
  padding: 8px 10px;
  width: 100%;
  outline: none;
  box-sizing: border-box;
  transition: border-color 0.15s;
}
.prod-meta-pop-input:focus { border-color: var(--royal-mid); }
.prod-meta-pop-btns { display: flex; gap: 8px; }
.prod-meta-pop-cancel {
  flex: 1;
  background: var(--bg3);
  border: 1px solid var(--border);
  border-radius: 7px;
  color: var(--text2);
  font-size: 0.78rem;
  padding: 7px;
  cursor: pointer;
  transition: background 0.15s;
}
.prod-meta-pop-cancel:hover { background: var(--border); }
.prod-meta-pop-save {
  flex: 1;
  background: var(--royal-mid);
  border: none;
  border-radius: 7px;
  color: #fff;
  font-size: 0.78rem;
  font-weight: 700;
  padding: 7px;
  cursor: pointer;
  transition: background 0.15s;
}
.prod-meta-pop-save:hover { background: var(--royal-light); }

.prod-meta-info { display: flex; flex-direction: column; gap: 3px; }
.prod-meta-info-value { font-size: 1.2rem; font-weight: 800; color: var(--text); line-height: 1; }
.prod-meta-info-label { font-size: 0.67rem; color: var(--text3); text-transform: uppercase; letter-spacing: 0.8px; }
.prod-meta-info-goal  { font-size: 0.72rem; color: var(--text2); margin-top: 4px; }

/* Lista de vendas */
.prod-badge {
  display: inline-block;
  padding: 2px 9px;
  border-radius: 20px;
  font-size: 0.72rem;
  font-weight: 600;
}
.prod-badge--pago      { background: rgba(34,197,94,0.13);  color: #16a34a; }
.prod-badge--pendente  { background: rgba(234,179,8,0.13);  color: #b45309; }
.prod-badge--expirada  { background: rgba(239,68,68,0.12);  color: #dc2626; }
.prod-row--expirada td { opacity: .55; text-decoration: line-through; }
.prod-row--expirada td:last-child,
.prod-row--expirada .prod-badge--expirada { opacity: 1; text-decoration: none; }

/* Implantados — Sinistro Morte do Titular */
.impl-card--morte { opacity: .7; }
.impl-card--morte .impl-card-name s,
.impl-card--morte .impl-meta-item s { color: var(--text2); }
.impl-status--morte { background: rgba(107,114,128,0.15); color: #6b7280; border-color: rgba(107,114,128,0.3); font-weight: 700; }

.prod-ficha-btn {
  background: none;
  border: 1px solid var(--border);
  color: var(--text2);
  font-size: 0.72rem;
  padding: 3px 10px;
  border-radius: 6px;
  cursor: pointer;
  transition: border-color 0.15s, color 0.15s;
}
.prod-ficha-btn:hover { border-color: var(--royal-mid); color: var(--royal-light); }

/* ── RANKING MASTER ──────────────────────────────────────────────────── */
/* ─── PRODUÇÃO MASTER — RANKING REDESIGN ─────────────────────────── */

.rank-scoreboard {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 1fr 1px 1fr;
  background: linear-gradient(135deg, #1a3a8f 0%, #2251cc 50%, #1a3a8f 100%);
  border-radius: 20px;
  margin-bottom: 20px;
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(96,165,250,0.22);
  box-shadow: 0 10px 48px rgba(26,58,143,0.55), inset 0 1px 0 rgba(255,255,255,0.08);
}
.rank-scoreboard::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, #60a5fa 0%, #a78bfa 35%, #f472b6 60%, #fbbf24 85%, #60a5fa 100%);
}
.rank-scoreboard::after {
  content: '';
  position: absolute; inset: 0;
  background: radial-gradient(ellipse at 30% 50%, rgba(255,255,255,0.06) 0%, transparent 60%),
              radial-gradient(ellipse at 70% 50%, rgba(255,255,255,0.04) 0%, transparent 60%);
  pointer-events: none;
}
.rank-scoreboard-stat { padding: 30px 48px; text-align: center; }
.rank-scoreboard-label {
  font-size: 0.63rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: 1.5px; margin-bottom: 10px;
  color: rgba(255,255,255,0.55);
}
.rank-scoreboard-num {
  font-size: 3.4rem; font-weight: 900; line-height: 1; margin-bottom: 6px;
}
.rank-scoreboard-stat--day   .rank-scoreboard-num { color: #fde68a; text-shadow: 0 0 28px rgba(253,230,138,0.5); }
.rank-scoreboard-stat--month .rank-scoreboard-num { color: #fff; text-shadow: 0 0 28px rgba(255,255,255,0.3); }
.rank-scoreboard-sub { font-size: 0.82rem; color: rgba(255,255,255,0.5); margin-top: 4px; }
.rank-scoreboard-divider { background: rgba(255,255,255,0.1); }
.rank-scoreboard--mes-only { grid-template-columns: 1fr; }
.rank-scoreboard--mes-only .rank-scoreboard-stat { padding: 36px 48px; }

/* Leaderboard */
.rank-board { grid-column: 1 / -1; display: flex; flex-direction: column; gap: 10px; }

.rank-row {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 16px;
  display: grid;
  grid-template-columns: 62px 46px 1fr 90px 116px;
  align-items: stretch;
  overflow: hidden;
  transition: transform 0.18s cubic-bezier(0.22,1,0.36,1), box-shadow 0.18s, border-color 0.18s;
  animation: prodCardIn 0.42s cubic-bezier(0.22,1,0.36,1) both;
}
.rank-row:hover { transform: translateY(-2px); box-shadow: 0 10px 32px rgba(0,0,0,0.2); }
.rank-row--gold   { border-color: rgba(251,191,36,0.45); }
.rank-row--silver { border-color: rgba(148,163,184,0.4); }
.rank-row--bronze { border-color: rgba(217,119,6,0.42); }

/* Position cell */
.rank-row-pos {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 2px; padding: 16px 0; border-right: 1px solid var(--border);
  background: var(--bg2);
}
.rank-row--gold   .rank-row-pos { background: rgba(251,191,36,0.07); border-color: rgba(251,191,36,0.2); }
.rank-row--silver .rank-row-pos { background: rgba(148,163,184,0.05); border-color: rgba(148,163,184,0.18); }
.rank-row--bronze .rank-row-pos { background: rgba(217,119,6,0.06); border-color: rgba(217,119,6,0.18); }
.rank-row-medal  { font-size: 1.55rem; line-height: 1; }
.rank-medal {
  width: 38px; height: 38px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 1rem; font-weight: 900; letter-spacing: -0.5px; font-style: normal;
}
.rank-medal--gold   { background: linear-gradient(135deg, #f59e0b, #fbbf24); color: #7c2d12; box-shadow: 0 2px 8px rgba(245,158,11,.45); }
.rank-medal--silver { background: linear-gradient(135deg, #94a3b8, #cbd5e1); color: #1e293b; box-shadow: 0 2px 8px rgba(148,163,184,.4); }
.rank-medal--bronze { background: linear-gradient(135deg, #b45309, #d97706); color: #fff;    box-shadow: 0 2px 8px rgba(180,83,9,.4); }
.rank-row-posnum { font-size: 0.9rem; font-weight: 800; color: var(--text3); }

/* Avatar cell */
.rank-avatar {
  width: 34px; height: 34px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 0.75rem; font-weight: 800; flex-shrink: 0;
  align-self: center; margin: 0 6px;
  background: rgba(99,102,241,0.14); color: var(--text3);
}
.rank-avatar--gold   { background: rgba(251,191,36,0.22);  color: #d97706; }
.rank-avatar--silver { background: rgba(148,163,184,0.2);  color: #64748b; }
.rank-avatar--bronze { background: rgba(217,119,6,0.18);   color: #b45309; }

/* Body: name + today + progress */
.rank-row-body {
  padding: 14px 14px 14px 8px;
  display: flex; flex-direction: column; justify-content: center; gap: 9px; min-width: 0;
}
.rank-row-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; min-width: 0; }
.rank-row-name {
  font-size: 0.95rem; font-weight: 700; color: var(--text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.rank-today-badge {
  display: inline-flex; align-items: center; gap: 3px;
  background: rgba(239,68,68,0.1); color: #ef4444;
  border: 1px solid rgba(239,68,68,0.28);
  border-radius: 99px; padding: 2px 9px;
  font-size: 0.63rem; font-weight: 700; white-space: nowrap; flex-shrink: 0;
}
.rank-progress-wrap { display: flex; align-items: center; gap: 8px; }
.rank-progress-bar  { flex: 1; height: 7px; background: var(--border); border-radius: 99px; overflow: hidden; min-width: 60px; }
.rank-progress-fill {
  height: 100%; border-radius: 99px; width: 0%;
  background: linear-gradient(90deg, #2451b3, #60a5fa);
  transition: width 0.9s cubic-bezier(0.22,1,0.36,1);
}
.rank-progress-fill--hit { background: linear-gradient(90deg, #15803d, #22c55e); }
.rank-progress-pct     { font-size: 0.7rem; font-weight: 700; color: var(--text3); white-space: nowrap; min-width: 34px; text-align: right; }
.rank-progress-pct--hit { color: #22c55e; }

/* Stats cell: count + value */
.rank-row-stats {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 14px 8px; border-left: 1px solid var(--border); text-align: center; gap: 1px;
}
.rank-row-count      { font-size: 2.1rem; font-weight: 900; color: var(--text); line-height: 1; }
.rank-row-countlabel { font-size: 0.58rem; font-weight: 600; color: var(--text3); text-transform: uppercase; letter-spacing: 0.7px; }
.rank-row-val        { font-size: 0.7rem; font-weight: 600; color: var(--text2); margin-top: 3px; }

/* Meta cell */
.rank-row-meta-col {
  display: flex; flex-direction: column; align-items: flex-end; justify-content: center;
  padding: 12px 14px; border-left: 1px solid var(--border); gap: 3px;
}
.rank-meta-label    { font-size: 0.6rem; font-weight: 600; color: var(--text3); text-transform: uppercase; letter-spacing: 0.7px; }
.rank-meta-val      { font-size: 0.82rem; font-weight: 700; color: var(--text); }
.rank-falta         { font-size: 0.65rem; color: var(--text3); text-align: right; }
.rank-falta--hit    { font-size: 0.65rem; color: #22c55e; font-weight: 700; text-align: right; }
.rank-meta-edit-btn {
  margin-top: 5px; background: none;
  border: 1px solid var(--border); color: var(--text3);
  font-size: 0.6rem; padding: 3px 8px; border-radius: 6px; cursor: pointer;
  transition: border-color 0.15s, color 0.15s;
}
.rank-meta-edit-btn:hover { border-color: var(--royal-mid); color: var(--royal-light); }
.rank-no-access { font-size: 0.72rem; color: var(--text3); font-style: italic; }

.tel-duplicate-warn {
  display: flex;
  align-items: center;
  gap: 8px;
  background: rgba(234, 179, 8, 0.1);
  border: 1px solid rgba(234, 179, 8, 0.32);
  border-radius: 7px;
  padding: 7px 10px;
  font-size: 0.76rem;
  color: var(--text2);
  margin-top: 5px;
}
.tel-duplicate-warn svg { color: #d4a007; flex-shrink: 0; }
.tel-dup-link {
  margin-left: auto;
  background: none;
  border: 1px solid rgba(234, 179, 8, 0.38);
  border-radius: 5px;
  color: #d4a007;
  font-size: 0.72rem;
  padding: 3px 9px;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.15s;
}
.tel-dup-link:hover { background: rgba(234, 179, 8, 0.14); }

.modal-footer {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 16px 22px 20px;
  border-top: 1px solid var(--border);
}

.btn-cancel {
  padding: 8px 18px;
  border-radius: 4px;
  border: 1px solid var(--border);
  background: none;
  color: var(--text2);
  font-size: 0.82rem;
  font-weight: 700;
  transition: all 0.15s;
}

.btn-cancel:hover { border-color: var(--text3); }

.btn-save {
  padding: 8px 20px;
  border-radius: 4px;
  border: none;
  background: var(--royal);
  color: #fff;
  font-size: 0.82rem;
  font-weight: 700;
  transition: background 0.15s, transform 0.12s;
}

.btn-save:hover { background: var(--royal-mid); }
.btn-save:active { transform: scale(0.96); }
.btn-save:disabled { background: var(--text3); cursor: not-allowed; }

/* ── INSIGHT BARS ── */
.bar-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}

.bar-label {
  font-size: 0.78rem;
  color: var(--text2);
  min-width: 120px;
}

.bar-track {
  flex: 1;
  height: 5px;
  background: var(--bg3);
  border-radius: 99px;
  overflow: hidden;
}

.bar-fill {
  height: 100%;
  border-radius: 99px;
  transition: width 1s ease;
}

.bar-val {
  font-size: 0.72rem;
  color: var(--text3);
  min-width: 30px;
  text-align: right;
  font-weight: 700;
}

/* ── FUNNEL ── */
.funnel-step {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 12px;
}

.funnel-outer {
  flex: 1;
  height: 42px;
  background: var(--bg3);
  border-radius: 4px;
  overflow: hidden;
  position: relative;
  display: flex;
  align-items: center;
}

/* bar: animated background, no text */
.funnel-bar {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  border-radius: 4px;
  transition: width 0.9s cubic-bezier(0.25, 1, 0.5, 1);
}

/* label: sits above the bar, always legible */
.funnel-label {
  position: relative;
  z-index: 1;
  padding-left: 14px;
  font-size: 0.82rem;
  font-weight: 700;
  color: #fff;
  white-space: nowrap;
  text-shadow: 0 1px 4px rgba(0,0,0,0.45);
  pointer-events: none;
}

/* keep .funnel-inner for backward compat (legacy, unused now) */
.funnel-inner {
  height: 100%;
  display: flex;
  align-items: center;
  padding-left: 14px;
  font-size: 0.82rem;
  font-weight: 700;
  transition: width 1s ease;
  border-radius: 4px;
}

.funnel-meta { text-align: right; min-width: 70px; }

.funnel-count {
  font-family: 'Inter', sans-serif;
  font-size: 1.1rem;
  font-weight: 700;
}

.funnel-pct { font-size: 0.7rem; color: var(--text3); font-weight: 700; }

/* ── INSIGHT CARDS ── */
.insight-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 16px;
  margin-bottom: 24px;
}

.insight-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 20px;
  box-shadow: var(--glow);
  transition: transform var(--transition-lift), box-shadow var(--transition-lift);
}
.insight-card:hover { transform: translateY(-2px); box-shadow: var(--glow-hover); }

.insight-card-label {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--text3);
  margin-bottom: 10px;
}

.insight-card-big {
  font-family: 'Inter', sans-serif;
  font-size: 1.3rem;
  font-weight: 700;
  line-height: 1;
  white-space: normal;
  word-break: break-word;
}

.insight-card-desc {
  font-size: 0.78rem;
  color: var(--text3);
  margin-top: 6px;
}

/* ── CAMPANHA ATIVA BADGE ── */
.campanha-ativa-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.78rem;
  font-weight: 700;
  color: #1e8449;
  margin-top: 4px;
}

.campanha-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #1e8449;
  box-shadow: 0 0 0 0 rgba(30, 132, 73, 0.4);
  animation: pulseDot 1.8s infinite;
}

@keyframes pulseDot {
  0%   { box-shadow: 0 0 0 0 rgba(30, 132, 73, 0.45); }
  70%  { box-shadow: 0 0 0 7px rgba(30, 132, 73, 0); }
  100% { box-shadow: 0 0 0 0 rgba(30, 132, 73, 0); }
}

/* ── SISTEMA DE ACESSOS (Master only) ── */
.sistema-acesso-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}
.sistema-acesso-sub {
  font-size: 0.78rem;
  color: var(--text3);
  margin: 0 0 0;
}
.sistema-acesso-divider {
  border: none;
  border-top: 1px solid var(--border);
  margin: 28px 0 24px;
}
.sistema-user-card {
  background: var(--bg2);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 18px 18px 14px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  box-shadow: var(--glow);
  transition: box-shadow var(--transition-lift), border-color 0.18s, transform var(--transition-lift);
}
.sistema-user-card:hover {
  box-shadow: var(--glow-hover);
  border-color: var(--royal);
  transform: translateY(-2px);
}
.sistema-status-badge {
  display: inline-block;
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 2px 8px;
  border-radius: 20px;
  margin-top: 4px;
}
.novo-vendedor-box {
  max-width: 420px;
  width: 100%;
  padding: 0;
}

/* ── EQUIPE MRX ── */
.equipe-nivel-titulo {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text3);
  margin: 28px 0 12px;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--border);
}
.equipe-nivel-titulo:first-child { margin-top: 0; }

.equipe-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 14px;
}

.equipe-card {
  background: var(--bg2);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 20px 18px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  position: relative;
  box-shadow: var(--glow);
  transition: box-shadow var(--transition-lift), border-color 0.18s, transform var(--transition-lift);
}
.equipe-card:hover {
  box-shadow: var(--glow-hover);
  border-color: var(--royal);
  transform: translateY(-2px);
}

.equipe-card-top {
  display: flex;
  align-items: center;
  gap: 14px;
}
.equipe-avatar {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  font-weight: 700;
  color: #fff;
  flex-shrink: 0;
  letter-spacing: 0.02em;
  overflow: hidden;
}
.equipe-avatar img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  border-radius: 50%;
}
.equipe-card-info { flex: 1; min-width: 0; }
.equipe-card-nome {
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--text1);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.equipe-card-cargo {
  font-size: 0.75rem;
  color: var(--text3);
  margin-top: 2px;
}
.equipe-card-footer {
  display: flex;
  justify-content: flex-end;
  gap: 6px;
  margin-top: 2px;
}
.equipe-btn {
  background: none;
  border: 1px solid var(--border);
  border-radius: 7px;
  padding: 4px 12px;
  font-size: 0.73rem;
  cursor: pointer;
  color: var(--text2);
  transition: background 0.15s, border-color 0.15s;
}
.equipe-btn:hover { background: var(--bg3); border-color: var(--royal); color: var(--royal-light); }
.equipe-btn.danger:hover { border-color: #c0392b; color: #e74c3c; background: rgba(192,57,43,0.07); }

@media (max-width: 600px) {
  .equipe-grid { grid-template-columns: 1fr; }
}

/* ── REATIVAÇÃO DE LEADS ── */
.reativ-kpi-row {
  display: flex; gap: 14px; margin-bottom: 24px; flex-wrap: wrap;
}
.reativ-kpi {
  flex: 1; min-width: 140px;
  background: var(--bg2); border: 1px solid var(--border); border-radius: 12px;
  padding: 14px 18px; display: flex; flex-direction: column; gap: 4px;
}
.reativ-kpi-value { font-size: 1.6rem; font-weight: 800; line-height: 1; }
.reativ-kpi-label { font-size: 0.72rem; color: var(--text3); font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; }
.reativ-kpi.red   .reativ-kpi-value { color: #dc2626; }
.reativ-kpi.amber .reativ-kpi-value { color: #d97706; }
.reativ-kpi.blue  .reativ-kpi-value { color: var(--royal-light); }

.reativ-section-label {
  display: flex; align-items: center; gap: 8px;
  font-size: 0.68rem; font-weight: 700; letter-spacing: 0.08em;
  text-transform: uppercase; color: var(--text3);
  margin: 24px 0 12px; padding-bottom: 6px; border-bottom: 1px solid var(--border);
}
.reativ-section-label:first-of-type { margin-top: 0; }
.reativ-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.reativ-dot.red    { background: #dc2626; }
.reativ-dot.amber  { background: #f59e0b; }

.reativ-cards-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 14px; margin-bottom: 8px;
}
.reativ-card {
  background: var(--bg2); border: 1px solid var(--border);
  border-radius: var(--r-md); overflow: hidden;
  box-shadow: var(--glow);
  display: flex; transition: box-shadow var(--transition-lift), border-color 0.18s, transform var(--transition-lift);
}
.reativ-card:hover { box-shadow: var(--glow-hover); border-color: var(--royal); transform: translateY(-2px); }
.reativ-card-body {
  flex: 1; min-width: 0;
  padding: 14px;
  display: flex; flex-direction: column; gap: 10px;
}
.reativ-card-top { display: flex; align-items: flex-start; gap: 10px; }
.reativ-avatar {
  width: 38px; height: 38px; border-radius: 50%;
  background: var(--grad-brand); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 0.84rem; font-weight: 700; flex-shrink: 0;
}
.reativ-card-info { flex: 1; min-width: 0; }
.reativ-card-nome {
  font-size: 0.9rem; font-weight: 600; color: var(--text1);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.reativ-card-motivo { font-size: 0.72rem; font-weight: 600; margin-top: 2px; }
.reativ-dias {
  font-size: 0.74rem; font-weight: 700;
  padding: 3px 8px; border-radius: 20px; white-space: nowrap; flex-shrink: 0;
}
.reativ-dias--red   { background: rgba(220,38,38,0.12); color: #dc2626; }
.reativ-dias--amber { background: rgba(245,158,11,0.12); color: #d97706; }

.reativ-card-dates {
  display: flex; align-items: center; gap: 8px;
  background: var(--bg3); border-radius: 8px;
  padding: 7px 10px;
}
.reativ-date-item { display: flex; flex-direction: column; gap: 1px; }
.reativ-date-label {
  font-size: 0.6rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.04em; color: var(--text3);
}
.reativ-date-val { font-size: 0.78rem; font-weight: 700; color: var(--text2); }
.reativ-date-val--target { color: var(--royal-light); }
.reativ-date-arrow { color: var(--text3); flex-shrink: 0; }

.reativ-card-meta {
  display: flex; flex-wrap: wrap; gap: 6px;
  font-size: 0.72rem; color: var(--text3);
}
.reativ-btn-followup {
  background: var(--royal); color: #fff; border: none;
  border-radius: 8px;
  padding: 9px 14px;
  font-size: 0.78rem; font-weight: 600; cursor: pointer;
  transition: background 0.15s;
  width: 100%;
  margin-top: auto;
  text-align: center;
}
.reativ-btn-followup:hover { background: var(--royal-mid); }

.reativ-empty-state {
  text-align: center; padding: 60px 20px; color: var(--text3);
}
.reativ-empty-state svg { opacity: 0.3; }
.reativ-empty-state h3 { color: var(--text2); margin: 16px 0 8px; font-size: 1.05rem; }
.reativ-empty-state p  { font-size: 0.84rem; max-width: 420px; margin: 0 auto; }

/* ── FOLLOW-UP PANEL ── */
.followup-panel {
  position: fixed;
  inset: 0;
  padding-top: 60px; /* reserva espaço para topbar (z-index maior) */
  background: var(--bg);
  z-index: 210;
  transform: translateX(100%);
  visibility: hidden;
  transition: transform 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94),
              visibility 0s linear 0.28s;
  overflow-y: auto;
  overscroll-behavior: contain;
}
.followup-panel.open {
  transform: translateX(0);
  visibility: visible;
  transition: transform 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94),
              visibility 0s linear 0s;
}

.followup-inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 24px 28px 80px;
}

.followup-header {
  display: flex; align-items: center; gap: 12px;
  padding: 4px 0 20px;
  margin-bottom: 24px;
  border-bottom: 1px solid var(--border);
  position: sticky; top: 0;
  background: var(--bg);
  z-index: 2;
}
.followup-back-btn {
  background: none; border: 1px solid var(--border);
  border-radius: 8px; padding: 7px 14px;
  font-size: 0.82rem; cursor: pointer; color: var(--text2);
  transition: background 0.15s; flex-shrink: 0;
}
.followup-back-btn:hover { background: var(--bg3); }
#followupLeadName {
  flex: 1; font-size: 1.1rem; font-weight: 700; color: var(--text1);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.followup-reativar-btn {
  background: linear-gradient(135deg, #16a34a, #15803d);
  color: #fff; border: none; border-radius: 9px;
  padding: 9px 20px; font-size: 0.82rem; font-weight: 700;
  cursor: pointer; transition: opacity 0.15s; flex-shrink: 0;
}
.followup-reativar-btn:hover { opacity: 0.85; }

.followup-body {
  display: grid; grid-template-columns: 1fr 1fr; gap: 28px;
}

.followup-section-title {
  font-size: 0.66rem; font-weight: 700; letter-spacing: 0.08em;
  text-transform: uppercase; color: var(--text3);
  margin-bottom: 12px; padding-bottom: 6px;
  border-bottom: 1px solid var(--border);
}
.followup-ia-title,
.followup-hist-title {
  display: flex; align-items: center; justify-content: space-between;
}

.followup-lead-grid { display: flex; flex-direction: column; gap: 10px; }
.followup-field { display: flex; flex-direction: column; gap: 2px; }
.followup-field-label {
  font-size: 0.63rem; font-weight: 700; letter-spacing: 0.06em;
  text-transform: uppercase; color: var(--text3);
}
.followup-field-value { font-size: 0.85rem; color: var(--text1); }

.followup-resp-card {
  display: flex; align-items: center; gap: 12px;
  padding: 14px; background: var(--bg2);
  border: 1px solid var(--border); border-radius: var(--r-md);
  box-shadow: var(--glow);
}
.followup-resp-avatar {
  width: 44px; height: 44px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-weight: 700; font-size: 1rem; flex-shrink: 0;
  overflow: hidden;
}
.followup-resp-avatar img {
  width: 100%; height: 100%; object-fit: contain; border-radius: 50%;
}
.followup-resp-nome  { font-size: 0.92rem; font-weight: 600; color: var(--text1); }
.followup-resp-cargo { font-size: 0.74rem; color: var(--text3); }
.followup-resp-email { font-size: 0.74rem; }
.followup-resp-email a { color: var(--royal-light); text-decoration: none; }

.reativ-ia-btn {
  background: var(--royal); color: #fff; border: none;
  border-radius: 7px; padding: 4px 13px;
  font-size: 0.74rem; font-weight: 600; cursor: pointer;
  transition: opacity 0.15s;
}
.reativ-ia-btn:hover    { opacity: 0.85; }
.reativ-ia-btn:disabled { opacity: 0.45; cursor: not-allowed; }

.reativ-ia-output {
  font-size: 0.83rem; line-height: 1.75; color: var(--text1);
  background: var(--bg2); border: 1px solid var(--border);
  border-radius: 10px; padding: 14px;
  min-height: 60px; max-height: 480px; overflow-y: auto;
}
.reativ-ia-output:empty::before {
  content: 'Clique em "Gerar Sugestão" para que a MRX IA analise este lead e crie uma estratégia personalizada de reativação.';
  color: var(--text3); font-style: italic; font-size: 0.8rem;
}
.reativ-ia-output h2 { font-size: 0.92rem; color: var(--royal-light); margin: 14px 0 5px; }
.reativ-ia-output h3 { font-size: 0.86rem; color: var(--royal-light); margin: 12px 0 4px; }
.reativ-ia-output strong { color: var(--text1); }
.reativ-ia-output ul, .reativ-ia-output ol { padding-left: 18px; }
.reativ-ia-output li { margin: 3px 0; }
.reativ-ia-output p  { margin: 6px 0; }

.followup-historico {
  margin-top: 32px; padding-top: 24px; border-top: 1px solid var(--border);
}

.reativ-add-hist-btn {
  background: none; border: 1px solid var(--royal);
  color: var(--royal-light); border-radius: 7px;
  padding: 4px 12px; font-size: 0.74rem; font-weight: 600;
  cursor: pointer; transition: background 0.15s;
}
.reativ-add-hist-btn:hover { background: rgba(26,60,143,0.1); }

.reativ-hist-form {
  background: var(--bg2); border: 1px solid var(--border);
  border-radius: 10px; padding: 14px; margin-bottom: 20px;
  display: flex; flex-direction: column; gap: 10px;
}
.reativ-hist-form-row { display: flex; gap: 10px; }
.reativ-hist-tipo-sel { width: 180px; flex-shrink: 0; }

.reativ-hist-list {
  display: flex; flex-direction: column;
  position: relative; padding-left: 22px;
}
.reativ-hist-list::before {
  content: ''; position: absolute; left: 6px; top: 8px; bottom: 8px;
  width: 2px; background: var(--border);
}
.reativ-hist-entry {
  display: flex; gap: 14px; position: relative; padding-bottom: 20px;
}
.reativ-hist-dot {
  width: 14px; height: 14px; border-radius: 50%;
  position: absolute; left: -22px; top: 3px;
  border: 2px solid var(--bg); flex-shrink: 0;
}
.reativ-hist-content { flex: 1; min-width: 0; }
.reativ-hist-header {
  display: flex; align-items: center; gap: 8px;
  margin-bottom: 4px; flex-wrap: wrap;
}
.reativ-hist-tipo { font-size: 0.74rem; font-weight: 700; }
.reativ-hist-meta { font-size: 0.71rem; color: var(--text3); }
.reativ-hist-del {
  background: none; border: none; cursor: pointer;
  color: var(--text3); font-size: 0.74rem;
  margin-left: auto; opacity: 0; transition: opacity 0.15s;
}
.reativ-hist-entry:hover .reativ-hist-del { opacity: 1; }
.reativ-hist-text { font-size: 0.83rem; color: var(--text2); line-height: 1.5; }
.reativ-hist-empty {
  color: var(--text3); font-size: 0.82rem; padding: 16px 0; font-style: italic;
}

@media (max-width: 768px) {
  .followup-body     { grid-template-columns: 1fr; }
  .reativ-cards-grid { grid-template-columns: 1fr; }
  .followup-inner    { padding: 16px 16px 80px; }
}


/* ── MRX IA ── */
.mrxia-title {
  background: linear-gradient(135deg, var(--royal), #1a3c8f);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.nav-item-mrxia { }
.nav-item-equipe { border-top: 1px solid var(--border); margin-top: 6px; padding-top: 10px; }

.mini-nav-mrxia { position: relative; }
.mini-nav-mrxia::after {
  content: 'IA';
  position: absolute;
  bottom: -2px;
  right: -2px;
  font-size: 8px;
  font-weight: 800;
  background: linear-gradient(135deg, var(--royal), #1a3c8f);
  color: #fff;
  border-radius: 4px;
  padding: 0 2px;
  line-height: 12px;
}

/* ── MRX IA HISTÓRICO ── */
.mrxia-history-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.35);
  z-index: 500;
  backdrop-filter: blur(2px);
}
.mrxia-history-overlay.open { display: block; }

.mrxia-history-drawer {
  position: fixed;
  top: 0;
  right: -360px;
  width: 340px;
  max-width: 92vw;
  height: 100dvh;
  background: var(--bg2);
  border-left: 1px solid var(--border);
  z-index: 501;
  display: flex;
  flex-direction: column;
  transition: right 0.28s cubic-bezier(0.4,0,0.2,1);
  box-shadow: -8px 0 32px rgba(0,0,0,0.18);
}
.mrxia-history-drawer.open { right: 0; }

.mrxia-history-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 18px;
  border-bottom: 1px solid var(--border);
  font-weight: 700;
  font-size: 0.9rem;
  color: var(--text1);
  flex-shrink: 0;
}

.mrxia-history-close {
  background: none;
  border: none;
  cursor: pointer;
  color: var(--text3);
  font-size: 1rem;
  padding: 4px 6px;
  border-radius: 6px;
  transition: background 0.15s, color 0.15s;
}
.mrxia-history-close:hover { background: var(--bg3); color: var(--text1); }

.mrxia-history-list {
  flex: 1;
  overflow-y: auto;
  padding: 8px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.mrxia-history-empty {
  text-align: center;
  color: var(--text3);
  font-size: 0.82rem;
  padding: 32px 16px;
}

.mrxia-history-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 10px 10px 12px;
  border-radius: 10px;
  border: 1px solid transparent;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
}
.mrxia-history-item:hover { background: var(--bg3); border-color: var(--border); }
.mrxia-history-item--active { background: var(--royal-pale); border-color: var(--royal-mid); }

.mrxia-history-item-body { flex: 1; min-width: 0; }

.mrxia-history-item-title {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--text1);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mrxia-history-item-meta {
  font-size: 0.72rem;
  color: var(--text3);
  margin-top: 2px;
}

.mrxia-history-del {
  background: none;
  border: none;
  cursor: pointer;
  color: var(--text3);
  padding: 4px;
  border-radius: 5px;
  opacity: 0;
  transition: opacity 0.15s, color 0.15s, background 0.15s;
  flex-shrink: 0;
}
.mrxia-history-item:hover .mrxia-history-del { opacity: 1; }
.mrxia-history-del:hover { color: #c0392b; background: rgba(192,57,43,0.1); }

.mrxia-quick-bar {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}
.mrxia-quick-section {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.mrxia-quick-label {
  font-size: 0.68rem;
  font-weight: 700;
  color: var(--text3);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding-right: 2px;
  white-space: nowrap;
}

.mrxia-quick {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 13px;
  border-radius: 20px;
  border: 1.5px solid var(--border);
  background: var(--bg3);
  color: var(--text2);
  font-size: 0.76rem;
  font-weight: 600;
  cursor: pointer;
  transition: border-color 0.15s, color 0.15s, background 0.15s, transform 0.1s ease;
  white-space: nowrap;
}
.mrxia-quick:hover { border-color: #1a3c8f; color: #1a3c8f; background: rgba(26,60,143,0.08); }
.mrxia-quick:active { transform: scale(0.96); }
.mrxia-quick--primary { border-color: #1a3c8f; color: #1a3c8f; background: rgba(26,60,143,0.06); }
.mrxia-quick--primary:hover { background: rgba(26,60,143,0.14); }
.mrxia-quick--lead { border-color: var(--s-negot); color: var(--s-negot); background: rgba(125,60,152,0.06); }
.mrxia-quick--lead:hover { background: rgba(125,60,152,0.14); }

/* Lead selector panel */
.mrxia-lead-selector {
  border: 1.5px solid var(--border);
  border-radius: 10px;
  background: var(--bg2);
  margin-bottom: 10px;
  overflow: hidden;
}
.mrxia-sel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 14px;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--text2);
  border-bottom: 1px solid var(--border);
}
.mrxia-sel-close {
  background: none;
  border: none;
  cursor: pointer;
  color: var(--text3);
  padding: 2px;
  line-height: 1;
}
.mrxia-sel-close:hover { color: var(--text1); }
.mrxia-sel-search {
  width: 100%;
  box-sizing: border-box;
  border: none;
  border-bottom: 1px solid var(--border);
  background: var(--bg2);
  color: var(--text1);
  font-size: 0.82rem;
  padding: 9px 14px;
  outline: none;
}
.mrxia-sel-search::placeholder { color: var(--text3); }
.mrxia-sel-list {
  max-height: 200px;
  overflow-y: auto;
}
.mrxia-sel-item {
  padding: 10px 14px;
  cursor: pointer;
  border-bottom: 1px solid var(--border);
  transition: background 0.12s;
}
.mrxia-sel-item:last-child { border-bottom: none; }
.mrxia-sel-item:hover { background: var(--bg3); }
.mrxia-sel-name { font-size: 0.82rem; font-weight: 600; color: var(--text1); }
.mrxia-sel-meta { font-size: 0.72rem; color: var(--text3); margin-top: 2px; }
.mrxia-sel-empty { padding: 16px 14px; font-size: 0.8rem; color: var(--text3); text-align: center; }

/* Lead card (em análise) */
.mrxia-lead-card {
  border: 1.5px solid var(--s-negot);
  border-radius: var(--r-sm);
  background: rgba(125,60,152,0.06);
  padding: 10px 14px;
  margin-bottom: 10px;
  box-shadow: 0 4px 14px -8px rgba(125,60,152,.35);
}
.mrxia-lc-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}
.mrxia-lc-info { display: flex; flex-direction: column; gap: 2px; }
.mrxia-lc-name { font-size: 0.85rem; font-weight: 700; color: var(--text1); }
.mrxia-lc-meta { font-size: 0.72rem; color: var(--text3); }
.mrxia-lc-clear {
  background: none;
  border: none;
  cursor: pointer;
  color: var(--text3);
  padding: 4px;
  line-height: 1;
  flex-shrink: 0;
}
.mrxia-lc-clear:hover { color: #c0392b; }
.mrxia-lc-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.mrxia-lc-btn {
  padding: 5px 12px;
  border-radius: 16px;
  border: 1.5px solid var(--s-negot);
  background: none;
  color: var(--s-negot);
  font-size: 0.74rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.12s;
}
.mrxia-lc-btn:hover { background: rgba(125,60,152,0.14); }

.mrxia-chat {
  flex: 1;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 8px 0 16px;
  min-height: 320px;
  max-height: calc(100vh - 380px);
}

.mrxia-welcome {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 40px 20px;
  color: var(--text3);
  gap: 10px;
}
.mrxia-welcome-icon {
  width: 56px;
  height: 56px;
  border-radius: var(--r-lg);
  background: linear-gradient(135deg, rgba(58,111,216,0.14), rgba(18,184,163,0.14));
  box-shadow: var(--glow);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--royal-light);
  margin-bottom: 4px;
}
.mrxia-welcome h3 { color: var(--text1); font-size: 1.1rem; margin: 0; }
.mrxia-welcome p  { font-size: 0.85rem; max-width: 420px; margin: 0; line-height: 1.5; }

.mrxia-msg {
  display: flex;
  gap: 10px;
  align-items: flex-start;
}
.mrxia-msg--user {
  flex-direction: row-reverse;
}

.mrxia-avatar {
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background: none;
  color: var(--royal);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-left: 8px;
  filter: drop-shadow(0 0 0px rgba(26,60,143,0.6));
  animation: mrxiaAvatarPulse 2.8s ease-in-out infinite;
}

@keyframes mrxiaAvatarPulse {
  0%   { filter: drop-shadow(0 0 2px rgba(26,60,143,0.7)); }
  60%  { filter: drop-shadow(0 0 8px rgba(26,60,143,0.15)); }
  100% { filter: drop-shadow(0 0 2px rgba(26,60,143,0.7)); }
}


.mrxia-bubble {
  max-width: 82%;
  padding: 12px 16px;
  border-radius: 14px;
  font-size: 0.875rem;
  line-height: 1.65;
}
.mrxia-bubble--user {
  background: var(--grad-brand);
  color: #fff;
  border-bottom-right-radius: 4px;
  box-shadow: 0 6px 18px -8px rgba(36,81,179,.5);
}
.mrxia-bubble--ai {
  background: var(--bg3);
  border: 1px solid var(--border);
  color: var(--text1);
  border-bottom-left-radius: 4px;
  box-shadow: var(--glow);
}

.mrxia-bubble--ai h2 { font-size: 1rem; margin: 14px 0 4px; color: var(--text1); }
.mrxia-bubble--ai h3 { font-size: 0.9rem; margin: 12px 0 4px; color: var(--royal-mid); }
.mrxia-bubble--ai h4 { font-size: 0.84rem; margin: 10px 0 3px; color: var(--text2); }
.mrxia-bubble--ai p  { margin: 4px 0; }
.mrxia-bubble--ai ul, .mrxia-bubble--ai ol { margin: 4px 0 4px 18px; padding: 0; }
.mrxia-bubble--ai li { margin-bottom: 3px; }
.mrxia-bubble--ai strong { color: var(--text1); }
.mrxia-bubble--ai code {
  background: var(--bg2);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 1px 5px;
  font-family: monospace;
  font-size: 0.82rem;
}

@keyframes blink { 0%,100%{opacity:1} 50%{opacity:0} }
.mrxia-cursor { animation: blink 0.9s infinite; display: inline-block; margin-left: 2px; }

/* Três pontinhos de "pensando" */
.mrxia-typing-dots {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 2px;
  height: 24px;
}
.mrxia-typing-dots span {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--royal);
  opacity: 0.4;
  animation: mrxiaDot 1.2s ease-in-out infinite;
}
.mrxia-typing-dots span:nth-child(1) { animation-delay: 0s; }
.mrxia-typing-dots span:nth-child(2) { animation-delay: 0.2s; }
.mrxia-typing-dots span:nth-child(3) { animation-delay: 0.4s; }

@keyframes mrxiaDot {
  0%, 80%, 100% { transform: translateY(0);   opacity: 0.35; }
  40%            { transform: translateY(-6px); opacity: 1;    }
}

.mrxia-input-bar {
  display: flex;
  gap: 8px;
  align-items: flex-end;
  padding: 12px 0 0;
  border-top: 1px solid var(--border);
  margin-top: 8px;
}

.mrxia-input {
  flex: 1;
  padding: 10px 14px;
  border-radius: 12px;
  border: 1.5px solid var(--border);
  background: var(--bg3);
  color: var(--text1);
  font-size: 0.875rem;
  resize: none;
  outline: none;
  line-height: 1.5;
  max-height: 160px;
  overflow-y: auto;
  transition: border-color 0.15s;
  font-family: inherit;
}
.mrxia-input:focus { border-color: #1a3c8f; }
.mrxia-input::placeholder { color: var(--text3); }

.mrxia-send-btn {
  width: 42px;
  height: 42px;
  border-radius: var(--r-sm);
  border: none;
  background: var(--grad-brand);
  color: #fff;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 6px 16px -6px rgba(36,81,179,.55);
  transition: filter 0.15s, transform 0.1s, box-shadow 0.15s;
}
.mrxia-send-btn:hover   { filter: brightness(1.08); box-shadow: 0 8px 20px -6px rgba(36,81,179,.65); }
.mrxia-send-btn:active  { transform: scale(0.96); }
.mrxia-send-btn:disabled { opacity: 0.4; cursor: not-allowed; }

/* ── FATURAMENTO — BOTÃO OLHO ── */
.fat-visibility-btn {
  background: none;
  border: none;
  cursor: pointer;
  color: var(--royal);
  padding: 6px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.15s, background 0.15s;
  opacity: 0.75;
}

.fat-visibility-btn:hover { opacity: 1; background: rgba(26,60,143,0.08); }

/* ── OLHO ANIMADO ── */
@keyframes slashDraw {
  from { stroke-dashoffset: 31.11; opacity: 0; transform: translateY(2px); }
  to   { stroke-dashoffset: 0;     opacity: 1; transform: translateY(0); }
}
@keyframes slashErase {
  from { stroke-dashoffset: 0; opacity: 1; transform: translateY(0); }
  to   { stroke-dashoffset: 0; opacity: 0; transform: translateY(-3px); }
}

.fat-eye-slash {
  stroke-dasharray: 31.11;
  stroke-dashoffset: 0;
  transform-origin: center;
  transform-box: fill-box;
}
.fat-eye-pupil {
  transition: opacity 0.18s ease;
}

/* estados estáticos */
#fatEyeIcon[data-state="closed"] .fat-eye-slash {
  stroke-dashoffset: 0;
  opacity: 1;
}
#fatEyeIcon[data-state="open"] .fat-eye-slash {
  opacity: 0;
  stroke-dashoffset: 0;
}
#fatEyeIcon[data-state="open"] .fat-eye-pupil,
#fatEyeIcon[data-state="opening"] .fat-eye-pupil {
  opacity: 1;
}
#fatEyeIcon[data-state="closed"] .fat-eye-pupil,
#fatEyeIcon[data-state="closing"] .fat-eye-pupil {
  opacity: 0.35;
}

/* animações em transição */
#fatEyeIcon[data-state="opening"] .fat-eye-slash {
  animation: slashErase 0.28s cubic-bezier(0.4, 0, 0.6, 1) forwards;
}
#fatEyeIcon[data-state="closing"] .fat-eye-slash {
  animation: slashDraw 0.32s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
}

/* ── FATURAMENTO FILTROS ── */
.fat-filter-bar {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 16px;
}

.fat-filter-chips {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

.fat-chip {
  padding: 5px 14px;
  border-radius: 20px;
  border: 1.5px solid var(--border);
  background: var(--bg3);
  color: var(--text2);
  font-size: 0.78rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s, color 0.15s, border-color 0.15s, transform 0.1s ease;
}

.fat-chip:hover { border-color: var(--royal-mid); color: var(--text1); }
.fat-chip:active { transform: scale(0.96); }

.fat-chip--active                        { background: var(--grad-brand); border-color: transparent; color: #fff; box-shadow: 0 4px 14px -6px rgba(36,81,179,.6); }
.fat-chip--pagas.fat-chip--active        { background: #1e8449; border-color: #1e8449; color: #fff; }
.fat-chip--pendentes.fat-chip--active    { background: #b8943a; border-color: #b8943a; color: #fff; }
.fat-chip--expiradas.fat-chip--active    { background: #c0392b; border-color: #c0392b; color: #fff; }

.fat-month-select {
  padding: 5px 10px;
  border-radius: 8px;
  border: 1.5px solid var(--border);
  background: var(--bg3);
  color: var(--text1);
  font-size: 0.78rem;
  cursor: pointer;
  outline: none;
}

.fat-month-select:focus { border-color: var(--royal-mid); }

.origem-filter-select {
  padding: 5px 10px;
  border-radius: 8px;
  border: 1.5px solid var(--border);
  background: var(--bg3);
  color: var(--text1);
  font-size: 0.78rem;
  cursor: pointer;
  outline: none;
}
.origem-filter-select:focus { border-color: var(--royal-mid); }
.origem-filter-select option { background: var(--bg2); }

/* ── STATUS ATIVA (big area) ── */
.status-ativa-inline {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.status-dot-blue {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #1a3c8f;
  box-shadow: 0 0 0 0 rgba(26, 60, 143, 0.4);
  animation: pulseDotBlue 1.8s infinite;
  flex-shrink: 0;
}

@keyframes pulseDotBlue {
  0%   { box-shadow: 0 0 0 0 rgba(26, 60, 143, 0.45); }
  70%  { box-shadow: 0 0 0 7px rgba(26, 60, 143, 0); }
  100% { box-shadow: 0 0 0 0 rgba(26, 60, 143, 0); }
}

/* ── SCROLLBAR ── */
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--border); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--royal-mid); }

/* ── DOCUMENTOS MODAL ── */
.docs-modal {
  width: min(600px, 96vw);
  max-height: 85vh;
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 0;
  overscroll-behavior: contain;
}

.docs-modal-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding: 20px 22px 14px;
  border-bottom: 1px solid var(--border);
}

.docs-modal-header h3 {
  font-size: 1rem;
  font-weight: 700;
  color: var(--text1);
  margin: 0;
}

.docs-modal-sub {
  font-size: 0.72rem;
  color: var(--text3);
  margin: 3px 0 0;
}

.docs-upload-area {
  margin: 14px 22px 0;
  border: 2px dashed var(--border);
  border-radius: 8px;
  padding: 16px;
  text-align: center;
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
}

.docs-upload-area:hover,
.docs-upload-area.drag-over {
  border-color: var(--accent);
  background: var(--accent)0d;
}

.docs-upload-icon {
  color: var(--text3);
  margin-bottom: 6px;
}

.docs-upload-hint {
  font-size: 0.72rem;
  color: var(--text3);
  margin: 0 0 10px;
}

.btn-doc-upload {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.5px;
  padding: 6px 16px;
  border-radius: 4px;
  border: 1px solid var(--accent);
  background: transparent;
  color: var(--accent);
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}

.btn-doc-upload:hover {
  background: var(--accent);
  color: #fff;
}

.docs-list {
  flex: 1;
  overflow-y: auto;
  padding: 10px 22px 0;
  min-height: 60px;
  max-height: 320px;
}

.docs-loading,
.docs-empty {
  font-size: 0.78rem;
  color: var(--text3);
  text-align: center;
  padding: 18px 0;
}

.doc-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid var(--border);
}

.doc-item:last-child {
  border-bottom: none;
}

.doc-item-icon {
  font-size: 1.5rem;
  line-height: 1;
  flex-shrink: 0;
}

.doc-item-info {
  flex: 1;
  min-width: 0;
}

.doc-item-name {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--text1);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.doc-item-meta {
  font-size: 0.68rem;
  color: var(--text3);
  margin-top: 2px;
}

.doc-item-actions {
  display: flex;
  gap: 4px;
  flex-shrink: 0;
}

.doc-action-btn {
  width: 28px;
  height: 28px;
  border-radius: 4px;
  border: 1px solid var(--border);
  background: var(--bg3);
  color: var(--text2);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.15s, color 0.15s;
}

.doc-action-btn:hover {
  background: var(--accent);
  color: #fff;
  border-color: var(--accent);
}

.doc-remove-btn:hover {
  background: #c0392b;
  border-color: #c0392b;
}

.doc-btn {
  padding: 4px 7px;
  color: var(--text2);
}

.doc-btn:hover {
  background: var(--accent)22;
  color: var(--accent);
}

.docs-modal .modal-footer {
  padding: 14px 22px;
  border-top: 1px solid var(--border);
  margin-top: 12px;
}

/* ── CONTROLE DE FATURAMENTO ── */
.fat-total-row {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 12px;
  padding: 12px 18px 4px;
  border-top: 1px solid var(--border);
  margin-top: 4px;
}

.fat-total-label {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--text3);
}

.fat-total-val {
  font-size: 1.1rem;
  font-weight: 800;
  color: var(--s-sold);
  font-family: 'Inter', sans-serif;
}

.fat-valor-cell {
  font-weight: 700;
  color: var(--s-sold);
  font-size: 0.85rem;
}

.fat-edit-btn {
  background: none;
  border: 1px solid var(--border);
  color: var(--text3);
  padding: 3px 8px;
  border-radius: 3px;
  font-size: 0.82rem;
  transition: all 0.15s;
  cursor: pointer;
}

.fat-edit-btn:hover {
  border-color: var(--s-sold);
  color: var(--s-sold);
}

.fat-ficha-btn {
  background: none;
  border: 1px solid var(--border);
  color: var(--text3);
  padding: 4px 8px;
  border-radius: 3px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all 0.15s;
  cursor: pointer;
}

.fat-ficha-btn:hover {
  border-color: var(--royal-mid);
  color: var(--royal-light);
}

/* ── CHECK-IN DE PAGAMENTO ── */
.pago-check {
  width: 24px;
  height: 24px;
  border-radius: 5px;
  border: 2px solid var(--border);
  background: var(--bg3);
  color: transparent;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.18s;
  flex-shrink: 0;
}

.pago-check:hover {
  border-color: var(--s-sold);
  color: rgba(30, 132, 73, 0.35);
}

.pago-check--on {
  background: var(--s-sold);
  border-color: var(--s-sold);
  color: #fff;
}

.pago-check--on:hover {
  background: #c0392b;
  border-color: #c0392b;
  color: #fff;
}

.fat-row--pago td {
  opacity: 0.6;
}

.fat-row--pago .fat-valor-cell {
  text-decoration: line-through;
  opacity: 0.7;
}

.fat-row--pago td:nth-child(2) {
  opacity: 1;
  font-style: italic;
  color: var(--s-sold);
}

/* ── LINHA EXPIRADA (tabela faturamento) ── */
.fat-row--expirada td {
  opacity: 0.65;
}

.fat-row--expirada .fat-valor-cell {
  text-decoration: line-through;
  color: var(--s-declined);
  opacity: 0.8;
}

.fat-row--expirada td:nth-child(2) {
  opacity: 1;
  font-style: italic;
  color: var(--s-declined);
}

.data-expirada {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--s-declined);
}

/* ── FICHA COMPLETA MODAL ── */
.ficha-modal {
  width: min(560px, 100%);
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.ficha-modal::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, color-mix(in srgb, var(--royal) 75%, black), var(--royal), color-mix(in srgb, var(--royal) 55%, white));
  z-index: 1;
}

.ficha-header {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 20px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--border);
  position: relative;
}

/* Mini selo "Lead RD" — canto superior esquerdo da ficha. Não é um status,
   só um indicativo visual de que o lead veio da agência RD Station. */
.rd-lead-badge {
  position: absolute;
  top: 14px;
  left: -6px;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.4px;
  color: #fff;
  background: linear-gradient(135deg, #0da898, #0891b2);
  padding: 3px 8px 3px 7px;
  border-radius: 0 5px 5px 0;
  box-shadow: 0 2px 6px rgba(8, 145, 178, 0.35);
  z-index: 2;
  cursor: default;
}

/* ── Página Projeto RD Station ── */
.rd-bar-list { display: flex; flex-direction: column; gap: 10px; }

.rd-bar-row {
  display: grid;
  grid-template-columns: 128px 1fr 74px;
  align-items: center;
  gap: 10px;
}
.rd-bar-label {
  font-size: 0.76rem;
  font-weight: 600;
  color: var(--text2);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rd-bar-track {
  height: 7px;
  background: var(--bg3);
  border-radius: 4px;
  overflow: hidden;
}
.rd-bar-fill {
  height: 100%;
  border-radius: 4px;
  transition: width 0.4s ease;
}
.rd-bar-val {
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--text1);
  text-align: right;
  white-space: nowrap;
}
.rd-bar-extra {
  font-size: 0.68rem;
  font-weight: 600;
  color: var(--text3);
}
.rd-empty {
  font-size: 0.8rem;
  color: var(--text3);
  text-align: center;
  padding: 28px 0;
}

.rd-destaque-motivo {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 4px 0 2px;
}
.rd-destaque-motivo-label {
  font-size: 1.3rem;
  font-weight: 800;
  color: #c0392b;
}
.rd-destaque-motivo-sub {
  font-size: 0.8rem;
  color: var(--text3);
  font-weight: 600;
}

@media (max-width: 560px) {
  .rd-bar-row { grid-template-columns: 92px 1fr 60px; gap: 6px; }
  .rd-bar-label { font-size: 0.7rem; }
}

.ficha-avatar {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--royal-pale);
  color: var(--royal-light);
  font-weight: 800;
  font-size: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border: 2px solid var(--royal);
}

.ficha-header-info {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.ficha-name {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--text);
}

.ficha-close-btn {
  background: none;
  border: none;
  color: var(--text3);
  font-size: 1rem;
  cursor: pointer;
  padding: 4px 8px;
  border-radius: 3px;
  transition: color 0.15s;
  position: absolute;
  right: 0;
  top: 0;
}
.ficha-close-btn:hover { color: var(--text); }

.ficha-body { flex: 1; overflow-y: auto; min-height: 0; margin-bottom: 0; }

/* ── FICHA TABS ──────────────────────────────────────────────────── */
.ficha-modal .ficha-header { flex-shrink: 0; margin-bottom: 0; }
.ficha-modal .modal-footer  { flex-shrink: 0; margin-top: 0; }

.ficha-tabs {
  display: flex;
  border-bottom: 1px solid var(--border);
  margin: 16px 0 18px;
  flex-shrink: 0;
  overflow-x: auto;
  scrollbar-width: none;
}
.ficha-tabs::-webkit-scrollbar { display: none; }

.ficha-tab {
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  padding: 7px 14px;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--text3);
  cursor: pointer;
  white-space: nowrap;
  transition: color 0.15s, border-color 0.15s;
  margin-bottom: -1px;
  border-radius: 0;
  letter-spacing: 0.2px;
}
.ficha-tab:hover { color: var(--text); }
.ficha-tab.active { color: var(--royal-light); border-bottom-color: var(--royal); }

.ficha-tab-panel { display: none; }
.ficha-tab-panel.active { display: block; }

.ficha-tab-empty {
  color: var(--text3);
  font-size: 0.82rem;
  padding: 24px 0;
  text-align: center;
}

/* ── FICHA DOCS TAB ──────────────────────────────────────────────── */
.ficha-docs-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
}
.ficha-docs-count {
  font-size: 0.74rem;
  color: var(--text3);
  font-weight: 600;
}
.ficha-docs-upload-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 0.76rem;
  font-weight: 600;
  color: var(--royal-light);
  cursor: pointer;
  padding: 5px 12px;
  border: 1px solid var(--royal);
  border-radius: 5px;
  transition: background 0.15s;
  user-select: none;
}
.ficha-docs-upload-btn:hover { background: var(--royal-pale); }
.ficha-doc-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 0;
  border-bottom: 1px solid var(--border);
}
.ficha-doc-item:last-child { border-bottom: none; }
.ficha-doc-icon { color: var(--text3); flex-shrink: 0; }
.ficha-doc-info { flex: 1; min-width: 0; }
.ficha-doc-name {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ficha-doc-meta { font-size: 0.72rem; color: var(--text3); margin-top: 2px; }
.ficha-doc-actions { display: flex; gap: 4px; flex-shrink: 0; }

.ficha-section-title {
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--text3);
  margin-bottom: 12px;
}

.ficha-declinio-text {
  font-size: 0.88rem;
  font-weight: 600;
  color: #c0392b;
  background: rgba(192,57,43,0.08);
  border: 1px solid rgba(192,57,43,0.25);
  border-radius: var(--r-sm);
  padding: 10px 12px;
}
[data-theme="dark"] .ficha-declinio-text { color: #f87171; background: rgba(248,113,113,0.1); border-color: rgba(248,113,113,0.3); }

.ficha-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px 20px;
  margin-bottom: 16px;
}

.ficha-field {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.ficha-field-label {
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  color: var(--text3);
}

.ficha-field-val {
  font-size: 0.88rem;
  color: var(--text);
  font-weight: 500;
}

.ficha-produto {
  font-weight: 700;
  color: var(--royal-light);
}

.ficha-valor {
  font-weight: 800;
  font-size: 1rem;
  color: var(--s-sold);
}

.ficha-divider {
  height: 1px;
  background: var(--border);
  margin: 16px 0;
}

.ficha-descricao-wrap {
  background: var(--bg3);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 12px 14px;
  margin-top: 4px;
}

.ficha-desc-label {
  font-size: 0.65rem;
  font-weight: 800;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  color: var(--text3);
  margin-bottom: 6px;
}

/* ── OBSERVAÇÃO DE STATUS NA FICHA (PAGO / EXPIRADA) ─────────────── */
.ficha-obs-status {
  margin: 12px 0 0;
  padding: 10px 14px;
  border-radius: 8px;
  font-size: 0.82rem;
  font-weight: 600;
  line-height: 1.4;
}

.ficha-obs-pago {
  background: rgba(30, 132, 73, 0.1);
  border: 1px solid rgba(30, 132, 73, 0.3);
  color: var(--s-sold);
}

.ficha-obs-expirada {
  background: rgba(192, 57, 43, 0.08);
  border: 1px solid rgba(192, 57, 43, 0.25);
  color: var(--s-declined);
}

.ficha-desc-text {
  font-size: 0.85rem;
  color: var(--text2);
  line-height: 1.55;
  white-space: pre-wrap;
}

/* ── BOTÃO NOVO CONTRATO NA FICHA ───────────────────────────────── */
.ficha-add-venda-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 10px;
  border-radius: 6px;
  border: 1px solid var(--royal);
  background: transparent;
  color: var(--royal-light);
  font-size: 0.75rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s;
}
.ficha-add-venda-btn:hover { background: var(--royal-pale); }

/* ── LISTA DE CONTRATOS NA FICHA ────────────────────────────────── */
.ficha-venda-item {
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 10px 12px;
  margin-bottom: 8px;
  background: var(--bg2);
}
.ficha-venda-item-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
}
.ficha-venda-item-num {
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--text2);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.ficha-venda-badge {
  font-size: 0.68rem;
  font-weight: 600;
  padding: 2px 7px;
  border-radius: 10px;
}
.ficha-venda-badge--pago     { background: rgba(30,132,73,0.15); color: #1e8449; }
.ficha-venda-badge--expirada { background: rgba(192,57,43,0.12); color: #c0392b; }
.ficha-venda-badge--pendente { background: rgba(184,148,58,0.15); color: #b8943a; }
.ficha-venda-badge--apolice     { background: rgba(125,60,152,0.15); color: var(--s-negot); cursor: pointer; transition: var(--transition); }
.ficha-venda-badge--apolice-off { background: var(--bg3); color: var(--text3); border: 1px dashed var(--border); cursor: pointer; transition: var(--transition); }
.ficha-venda-badge--apolice:hover, .ficha-venda-badge--apolice-off:hover { filter: brightness(1.08); }
[data-theme="dark"] .ficha-venda-badge--pago     { color: #34d399; }
[data-theme="dark"] .ficha-venda-badge--expirada { color: #f87171; }
[data-theme="dark"] .ficha-venda-badge--pendente { color: #fbbf24; }
[data-theme="dark"] .ficha-venda-badge--apolice  { color: #c084fc; }
.ficha-venda-edit-btn {
  margin-left: auto;
  border: none;
  background: transparent;
  color: var(--text3);
  cursor: pointer;
  padding: 3px 5px;
  border-radius: 4px;
  transition: background 0.15s, color 0.15s;
}
.ficha-venda-edit-btn:hover { background: var(--bg3); color: var(--royal); }
.ficha-venda-item-body {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  font-size: 0.82rem;
}
.ficha-venda-produto  { font-weight: 600; color: var(--text); }
.ficha-venda-valor    { color: #1e8449; font-weight: 700; }
[data-theme="dark"] .ficha-venda-valor { color: #34d399; }
.ficha-venda-pgto     { color: var(--text3); font-size: 0.76rem; }
.ficha-venda-proposta {
  font-size: 0.72rem; font-weight: 600;
  color: var(--royal-light);
  background: var(--royal-pale);
  border: 1px solid rgba(58,111,216,0.2);
  border-radius: 5px; padding: 1px 7px;
  white-space: nowrap;
}

/* ── FICHA TIMELINE ──────────────────────────────────────────────── */
.ficha-timeline-add-btn {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 0.73rem; font-weight: 600;
  color: var(--royal-light);
  background: var(--royal-pale);
  border: 1px solid rgba(58,111,216,0.22);
  border-radius: 7px; padding: 4px 10px;
  cursor: pointer; transition: background 0.15s;
}
.ficha-timeline-add-btn:hover { background: rgba(58,111,216,0.14); }

.ficha-timeline-form {
  background: var(--card2, var(--bg));
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 12px;
  margin: 10px 0 4px;
}
.ficha-timeline-textarea {
  width: 100%; box-sizing: border-box;
  background: var(--bg); color: var(--text1);
  border: 1px solid var(--border);
  border-radius: 7px; padding: 8px 10px;
  font-size: 0.82rem; resize: vertical;
  font-family: inherit; min-height: 64px;
}
.ficha-timeline-textarea:focus { outline: none; border-color: var(--royal-light); }
.ficha-timeline-form-actions {
  display: flex; align-items: center; gap: 8px; margin-top: 8px;
}
.ficha-timeline-tipo {
  font-size: 0.78rem; padding: 5px 8px; flex: 0 0 auto;
}
.ficha-timeline-save-btn, .ficha-timeline-cancel-btn {
  padding: 5px 14px; font-size: 0.78rem; border-radius: 7px;
}
.ficha-timeline-cancel-btn { margin-left: auto; }

.ficha-timeline-loading {
  font-size: 0.78rem; color: var(--text3);
  padding: 14px 0 6px; text-align: center;
}

.ficha-timeline-list { padding: 10px 0 2px; }

.ftl-item {
  display: flex; gap: 12px;
  position: relative;
}
.ftl-left {
  display: flex; flex-direction: column; align-items: center;
  flex: 0 0 14px;
}
.ftl-dot {
  width: 12px; height: 12px; border-radius: 50%;
  flex-shrink: 0; margin-top: 3px; z-index: 1;
}
.ftl-line {
  width: 2px; flex: 1; min-height: 14px;
  background: var(--border);
  margin-top: 3px;
}
.ftl-content {
  flex: 1; padding-bottom: 18px; min-width: 0;
}
.ftl-header {
  display: flex; align-items: center; gap: 6px;
  flex-wrap: wrap;
}
.ftl-title {
  font-size: 0.78rem; font-weight: 700; flex-shrink: 0;
}
.ftl-meta {
  font-size: 0.71rem; color: var(--text3); margin-left: auto;
  white-space: nowrap;
}
.ftl-del {
  background: none; border: none; cursor: pointer;
  color: var(--text3); padding: 0 2px; opacity: 0.6;
  transition: opacity 0.15s, color 0.15s;
  line-height: 1;
}
.ftl-del:hover { opacity: 1; color: #dc2626; }
.ftl-desc {
  font-size: 0.79rem; color: var(--text2);
  margin-top: 3px; line-height: 1.45;
  word-break: break-word;
}
.ftl-empty {
  font-size: 0.8rem; color: var(--text3);
  padding: 10px 0 4px; text-align: center;
}

/* ── CONFIRM MODAL ───────────────────────────────────────────────── */
.confirm-modal {
  max-width: 420px; width: calc(100% - 40px);
  text-align: center; padding: 32px 28px 26px;
  border-radius: var(--r-lg);
}
.confirm-modal-icon {
  width: 56px; height: 56px; border-radius: 50%;
  background: rgba(220,38,38,0.1); color: #dc2626;
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 18px;
}
.confirm-modal-title {
  font-size: 1.05rem; font-weight: 700;
  color: var(--text1); margin: 0 0 10px;
}
.confirm-modal-body {
  font-size: 0.86rem; color: var(--text2);
  line-height: 1.55; margin: 0 0 26px;
}
.confirm-modal-body strong { color: var(--text1); font-weight: 600; }
.confirm-modal-footer {
  display: flex; gap: 10px; justify-content: center;
}
.confirm-modal-footer .btn-cancel { min-width: 100px; }
.btn-danger {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 18px; border-radius: 8px;
  font-size: 0.84rem; font-weight: 600;
  background: #dc2626; color: #fff;
  border: none; cursor: pointer;
  transition: background 0.15s;
}
.btn-danger:hover { background: #b91c1c; }
.btn-danger:disabled { opacity: 0.6; cursor: not-allowed; }

/* ── RELATÓRIO DE INDICAÇÕES ─────────────────────────────────────── */
.ind-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-bottom: 20px;
}
.ind-kpi-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 16px 18px;
  display: flex;
  align-items: center;
  gap: 14px;
  position: relative;
  overflow: hidden;
  box-shadow: var(--glow-strong);
  transition: transform var(--transition-lift), box-shadow var(--transition-lift);
}
.ind-kpi-card:hover { transform: translateY(-2px); box-shadow: var(--glow-strong-hover); }
.ind-kpi-icon {
  width: 42px;
  height: 42px;
  border-radius: 10px;
  background: var(--royal-pale);
  color: var(--royal-light);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.ind-kpi-label {
  font-size: 0.7rem;
  color: var(--text3);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.ind-kpi-val {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--text);
  margin-top: 2px;
  line-height: 1.1;
}
.ind-kpi-val--green { color: #1e8449; }
[data-theme="dark"] .ind-kpi-val--green { color: #34d399; }

.ind-main-grid {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.ind-section-header {
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
}
.ind-section-title {
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--text);
}
.ind-section-sub {
  font-size: 0.76rem;
  color: var(--text3);
}

/* ── SORT TOGGLE ── */
.ind-sort-wrap {
  display: flex; gap: 4px; flex-wrap: wrap; flex-shrink: 0;
}
.ind-sort-btn {
  font-size: 0.72rem; font-weight: 600;
  padding: 4px 12px; border-radius: 20px;
  border: 1px solid var(--border);
  background: var(--bg3); color: var(--text3);
  cursor: pointer; font-family: inherit;
  transition: all .15s; white-space: nowrap;
}
.ind-sort-btn:hover {
  border-color: var(--royal-light);
  color: var(--royal-light);
  background: var(--royal-pale);
}
.ind-sort-btn--active {
  background: var(--royal-pale);
  border-color: var(--royal-light);
  color: var(--royal-light);
  font-weight: 700;
}

/* ── NOTA DE QUALIDADE (GRADE) ── */
.ind-grade {
  display: inline-flex; align-items: center; justify-content: center;
  width: 27px; height: 27px; border-radius: 8px;
  font-size: 0.76rem; font-weight: 800; border: 1px solid;
  cursor: default;
}
.ind-grade--a { background: rgba(39,174,96,.13); color: #1e8449; border-color: rgba(39,174,96,.32); }
.ind-grade--b { background: rgba(52,152,219,.13); color: #2471a3; border-color: rgba(52,152,219,.32); }
.ind-grade--c { background: rgba(243,156,18,.13); color: #b7770d; border-color: rgba(243,156,18,.32); }
.ind-grade--d { background: rgba(230,126,34,.13); color: #b94e08; border-color: rgba(230,126,34,.32); }
.ind-grade--f { background: rgba(192,57,43,.13); color: #922b21; border-color: rgba(192,57,43,.32); }


.ind-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 0.83rem;
}
.ind-table thead th {
  background: var(--bg2);
  padding: 12px 12px;
  text-align: left;
  font-size: 0.68rem;
  font-weight: 700;
  color: var(--text3);
  text-transform: uppercase;
  letter-spacing: 0.07em;
  white-space: nowrap;
  border-bottom: 2px solid var(--border);
}
.ind-th-num { text-align: right !important; }
.ind-table tbody tr {
  border-bottom: 1px solid var(--border);
  transition: background 0.15s;
}
.ind-table tbody tr:last-child { border-bottom: none; }
.ind-table tbody tr:hover { background: var(--bg2); }
.ind-table tbody td { padding: 12px; color: var(--text2); vertical-align: middle; }

/* Realce sutil pras 3 primeiras posições, na mesma linha inteira */
.ind-row--gold   { background: rgba(251,191,36,0.045); }
.ind-row--silver { background: rgba(148,163,184,0.04); }
.ind-row--bronze { background: rgba(217,119,6,0.045); }
.ind-row--gold:hover, .ind-row--silver:hover, .ind-row--bronze:hover { background: var(--bg2); }

.ind-rank { width: 48px; text-align: center; }
.ind-rank-num { font-size: 0.88rem; font-weight: 800; color: var(--text3); }

.ind-indicador-cell { display: flex; align-items: center; gap: 10px; min-width: 210px; }
.ind-avatar {
  width: 32px; height: 32px; border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: 0.7rem; font-weight: 800;
  background: rgba(99,102,241,0.14); color: var(--text3);
}
.ind-row--gold   .ind-avatar { background: rgba(251,191,36,0.22); color: #d97706; }
.ind-row--silver .ind-avatar { background: rgba(148,163,184,0.2);  color: #64748b; }
.ind-row--bronze .ind-avatar { background: rgba(217,119,6,0.18);   color: #b45309; }
.ind-indicador-info { min-width: 0; flex: 1; }
.ind-nome-text {
  font-weight: 700;
  color: var(--text);
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ind-bar-wrap {
  height: 6px;
  background: var(--border);
  border-radius: 99px;
  margin-top: 6px;
  min-width: 70px;
  overflow: hidden;
}
.ind-bar-fill {
  height: 100%;
  border-radius: 99px;
  background: linear-gradient(90deg, #2451b3, #60a5fa);
  transition: width 0.6s cubic-bezier(0.22,1,0.36,1);
}
.ind-num {
  text-align: right;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.ind-ativos-badge {
  background: rgba(184,148,58,0.15);
  color: #b8943a;
  font-size: 0.7rem;
  font-weight: 600;
  padding: 2px 7px;
  border-radius: 10px;
}
.ind-ver-btn {
  font-size: 0.74rem;
  padding: 5px 11px;
  white-space: nowrap;
}
@media (max-width: 700px) {
  .ind-kpi-grid { grid-template-columns: repeat(2, 1fr); }
  .ind-table thead th:nth-child(7),
  .ind-table tbody td:nth-child(7),
  .ind-table thead th:nth-child(8),
  .ind-table tbody td:nth-child(8) { display: none; }
  /* Qualidade das Indicações: stack chart + highlights vertically */
  .ind-qual-body { grid-template-columns: 1fr; }
  .ind-qual-chart-wrap { height: 260px; }
  .ind-qual-highlights { flex-direction: row; flex-wrap: wrap; }
  .ind-qual-card { flex: 1; min-width: 140px; }
}

/* ── QUALIDADE DAS INDICAÇÕES ─────────────────────────────────── */
.ind-qual-section {
  padding: 18px 20px;
  margin-top: 16px;
}
.ind-qual-body {
  display: grid;
  grid-template-columns: 1fr 280px;
  gap: 20px;
  align-items: start;
}
.ind-qual-chart-wrap {
  position: relative;
  min-height: 220px;
  height: 340px; /* overridden by JS based on number of entries */
}
.ind-qual-chart-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  color: var(--text3);
  font-size: 0.82rem;
}
.ind-qual-highlights {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding-top: 4px;
}
.ind-qual-card {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--bg2);
  box-shadow: var(--glow);
}
.ind-qual-card-icon {
  width: 36px;
  height: 36px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.ind-qual-card-icon--gold   { background: rgba(161,123,32,.14); color: #a17b20; }
.ind-qual-card-icon--blue   { background: rgba(58,111,216,.12); color: #3a6fd8; }
.ind-qual-card-icon--purple { background: rgba(109,40,217,.12); color: #6d28d9; }
.ind-qual-card-body { min-width: 0; }
.ind-qual-card-title {
  font-size: 0.67rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text3);
  margin-bottom: 3px;
}
.ind-qual-card-name {
  font-size: 0.87rem;
  font-weight: 700;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ind-qual-card-taxa {
  font-size: 0.81rem;
  font-weight: 700;
  color: var(--royal-light);
  margin-top: 2px;
}
.ind-qual-card-extra {
  font-size: 0.74rem;
  color: #1e8449;
  font-weight: 600;
  margin-top: 1px;
}
.ind-qual-card-sub {
  font-size: 0.71rem;
  color: var(--text3);
  margin-top: 2px;
}
@media (max-width: 900px) {
  .ind-qual-body { grid-template-columns: 1fr; }
  .ind-qual-chart-wrap { height: 280px; }
}

/* ── PROCESSO DE VENDA — CHECKLIST ──────────────────────────────── */
.processo-checklist {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 8px;
}
.processo-step {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  border-radius: 8px;
  border: 1px solid var(--border);
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
  user-select: none;
}
.processo-step:hover { background: var(--bg2); }
.processo-step--done {
  background: rgba(79, 140, 255, 0.05);
  border-color: rgba(79, 140, 255, 0.3);
}
.processo-step-icon {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 2px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 0.72rem;
  font-weight: 700;
  transition: background 0.15s, border-color 0.15s, color 0.15s;
}
.processo-step--done .processo-step-icon {
  background: var(--royal);
  border-color: var(--royal);
  color: #fff;
}
.processo-step-num {
  font-size: 0.68rem;
  color: var(--text3);
  font-weight: 600;
  width: 12px;
  text-align: center;
  flex-shrink: 0;
}
.processo-step-label {
  font-size: 0.83rem;
  color: var(--text2);
  flex: 1;
}
.processo-step--done .processo-step-label {
  color: var(--text1);
  font-weight: 500;
}
/* Mini indicador na tabela */
.processo-mini {
  display: flex;
  gap: 3px;
  margin-top: 4px;
}
.processo-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--border);
}
.processo-dot--done { background: var(--royal); }

.ficha-agend-box {
  background: var(--royal-pale);
  border: 1px solid rgba(58, 111, 216, 0.3);
  border-radius: 6px;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 4px;
}

.ficha-agend-date-wrap {
  display: flex;
  align-items: center;
  gap: 8px;
}

.ficha-agend-date {
  font-size: 1rem;
  font-weight: 700;
  color: var(--royal-light);
  letter-spacing: 0.2px;
}

.ficha-agend-obs {
  font-size: 0.84rem;
  color: var(--text2);
  line-height: 1.55;
  white-space: pre-wrap;
  border-top: 1px solid rgba(58, 111, 216, 0.2);
  padding-top: 10px;
}

.ficha-agend-obs-textarea,
.ficha-desc-textarea {
  width: 100%;
  box-sizing: border-box;
  font-size: 0.84rem;
  font-family: 'Inter', sans-serif;
  line-height: 1.55;
  color: var(--text);
  background: var(--bg3);
  border: 1.5px solid var(--border);
  border-radius: 6px;
  padding: 8px 10px;
  resize: vertical;
  min-height: 72px;
  outline: none;
  transition: border-color 0.15s;
}
.ficha-agend-obs-textarea {
  border-top: 1px solid rgba(58, 111, 216, 0.2);
  background: transparent;
  border: none;
  border-top: 1px solid rgba(58, 111, 216, 0.2);
  border-radius: 0;
  padding: 10px 0 0;
}
.ficha-agend-obs-textarea:focus,
.ficha-desc-textarea:focus {
  border-color: var(--royal-mid);
}

/* ── VENDA MODAL ── */
.venda-modal {
  width: min(500px, 100%);
  position: relative;
  overflow: hidden;
}
.venda-modal::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, color-mix(in srgb, var(--s-sold) 75%, black), var(--s-sold), color-mix(in srgb, var(--s-sold) 55%, white));
  z-index: 1;
}

.venda-modal-header {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 20px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--border);
}

.venda-modal-icon {
  width: 42px;
  height: 42px;
  border-radius: 8px;
  background: rgba(30, 132, 73, 0.12);
  color: var(--s-sold);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.venda-modal-header h3 {
  margin: 0;
  padding: 0;
  border: none;
  font-size: 1rem;
}

.venda-modal-sub {
  font-size: 0.75rem;
  color: var(--text3);
  margin: 2px 0 0;
}

.venda-textarea {
  resize: vertical;
  min-height: 70px;
  font-family: 'Inter', sans-serif;
}

.btn-venda-save {
  background: var(--s-sold) !important;
  display: flex;
  align-items: center;
}

.btn-venda-save:hover { background: #176338 !important; }

/* ── CHIPS DE FORMA DE PAGAMENTO (modal venda) ── */
.pgto-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.pgto-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 14px;
  border-radius: 6px;
  border: 1.5px solid var(--border);
  background: var(--bg3);
  color: var(--text2);
  font-family: 'Inter', sans-serif;
  font-size: 0.8rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.15s;
  user-select: none;

}

.pgto-chip:hover {
  border-color: var(--royal-mid);
  color: var(--royal-mid);
}
.pgto-chip:active { transform: scale(0.96); }

.pgto-chip--on {
  background: var(--grad-brand);
  border-color: transparent;
  color: #fff;
  box-shadow: 0 4px 14px -6px rgba(36,81,179,.6);
}

.pgto-chip--on:hover {
  filter: brightness(1.08);
}

/* ── CARGO (Adicionar Usuário) ── */
.nv-cargo-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.nv-cargo-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 16px;
  border-radius: 6px;
  border: 1.5px solid var(--border);
  background: var(--bg3);
  color: var(--text2);
  font-family: 'Inter', sans-serif;
  font-size: 0.8rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.15s;
  user-select: none;
}
.nv-cargo-chip:hover { border-color: var(--royal-mid); color: var(--royal-mid); }
.nv-cargo-chip:active { transform: scale(0.96); }
.nv-cargo-chip--on {
  background: var(--grad-brand);
  border-color: transparent;
  color: #fff;
  box-shadow: 0 4px 14px -6px rgba(36,81,179,.6);
}
.nv-cargo-chip--on:hover { filter: brightness(1.08); }

/* ── BADGES DE FORMA DE PAGAMENTO (tabela faturamento) ── */
.pgto-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 3px;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.3px;
  white-space: nowrap;
}

.pgto-badge--pix    { background: rgba(0,178,137,0.12); color: #00b289; }
.pgto-badge--boleto { background: rgba(184,148,58,0.12); color: var(--gold); }
.pgto-badge--debito { background: rgba(26,60,143,0.12); color: var(--royal-mid); }
.pgto-badge--cartao { background: rgba(125,60,152,0.12); color: var(--s-negot); }

.data-pgto {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--s-sold);
}

/* ════════════════════════════════════════════════════════════
   RESPONSIVE — ver css/mobile.css para tablet e mobile
   ════════════════════════════════════════════════════════════ */
/* ════════════════════════════════════════════════════════════
   LOGIN OVERLAY
   ════════════════════════════════════════════════════════════ */

.login-overlay {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  background:
    radial-gradient(circle at 18% 12%, var(--wash-1), transparent 45%),
    radial-gradient(circle at 100% 100%, var(--wash-2), transparent 42%),
    var(--bg);
  padding: 16px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.22s ease;
}

/* Sem sessão válida: overlay já visível antes do JS carregar (sem flash do dashboard) */
[data-needs-login] .login-overlay {
  opacity: 1;
  pointer-events: auto;
}

.login-overlay.login-visible {
  opacity: 1;
  pointer-events: auto;
}

.login-overlay[hidden] { display: none !important; }

.login-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  box-shadow: var(--glow-strong-hover);
  padding: 40px 36px 36px;
  width: 100%;
  max-width: 400px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  position: relative;
  overflow: hidden;
  transform: translateY(18px) scale(0.97);
  transition: transform 0.4s cubic-bezier(0.22,1,0.36,1), opacity 0.35s ease;
  opacity: 0;
}

.login-overlay.login-visible .login-card {
  transform: translateY(0) scale(1);
  opacity: 1;
}

.login-logo-wrap {
  width: 68px;
  height: 68px;
  border-radius: 50%;
  background: linear-gradient(135deg, rgba(58,111,216,0.14), rgba(18,184,163,0.14));
  box-shadow: var(--glow-strong);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
  overflow: hidden;
}

.login-logo-img {
  width: 68px;
  height: 68px;
  object-fit: contain;
}

.login-title {
  font-size: 1.5rem;
  font-weight: 800;
  background: var(--grad-brand);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  margin-bottom: 4px;
  letter-spacing: -0.3px;
}

.login-subtitle {
  font-size: 0.83rem;
  color: var(--text2);
  margin-bottom: 28px;
  text-align: center;
}

.login-form {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.login-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.login-field label {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--text2);
  letter-spacing: 0.3px;
}

.login-field input {
  width: 100%;
  background: var(--bg3);
  border: 1.5px solid var(--border);
  border-radius: var(--r-sm);
  color: var(--text);
  font-family: 'Inter', sans-serif;
  font-size: 0.92rem;
  padding: 10px 14px;
  outline: none;
  transition: border-color var(--transition), box-shadow var(--transition), background-color var(--transition);
}

.login-field input:focus {
  border-color: var(--royal-mid);
  background: var(--bg2);
  box-shadow: 0 0 0 3px rgba(58,111,216,.15);
}

.login-pass-wrap {
  position: relative;
}

.login-pass-wrap input {
  padding-right: 42px;
}

.pass-eye-btn {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  cursor: pointer;
  color: var(--text3);
  padding: 4px;
  display: flex;
  align-items: center;
  transition: color var(--transition);
}

.pass-eye-btn:hover { color: var(--text); }

.login-error {
  font-size: 0.83rem;
  color: var(--s-declined);
  background: rgba(192, 57, 43, 0.08);
  border: 1px solid rgba(192, 57, 43, 0.2);
  border-radius: var(--r-xs);
  padding: 8px 12px;
  margin: 0;
}

.login-btn {
  width: 100%;
  background: var(--grad-brand);
  background-size: 100% auto;
  color: #fff;
  border: none;
  border-radius: var(--r-sm);
  font-family: 'Inter', sans-serif;
  font-size: 0.95rem;
  font-weight: 700;
  padding: 12px;
  cursor: pointer;
  box-shadow: 0 8px 20px -8px rgba(36,81,179,.55);
  transition: background-position 0.4s ease, background-size 0.4s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 4px;
}

.login-btn:hover:not(:disabled) {
  background-position: right center;
  background-size: 200% auto;
  animation: ctaPulseGlow 1.5s infinite;
}
.login-btn:active:not(:disabled) { transform: scale(0.97); filter: brightness(0.96); }
.login-btn:disabled { opacity: 0.6; cursor: not-allowed; }

@keyframes ctaPulseGlow {
  0%   { box-shadow: 0 8px 20px -8px rgba(36,81,179,.55), 0 0 0 0 rgba(76,227,247,.5); }
  70%  { box-shadow: 0 8px 20px -8px rgba(36,81,179,.55), 0 0 0 12px rgba(76,227,247,0); }
  100% { box-shadow: 0 8px 20px -8px rgba(36,81,179,.55), 0 0 0 0 rgba(76,227,247,0); }
}

.login-forgot-link {
  display: block;
  width: 100%;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--text3);
  font-size: 0.78rem;
  text-align: center;
  padding: 10px 0 2px;
  transition: color 0.15s;
}
.login-forgot-link:hover { color: var(--royal-mid); }

.forgot-desc {
  font-size: 0.83rem;
  color: var(--text2);
  margin: 0 0 16px;
  line-height: 1.5;
}

.forgot-sent-msg {
  background: rgba(39,174,96,0.10);
  border: 1px solid rgba(39,174,96,0.25);
  border-radius: 8px;
  padding: 14px 16px;
  font-size: 0.84rem;
  color: #1d8a56;
  text-align: center;
  line-height: 1.55;
  margin-bottom: 14px;
}

[data-theme="dark"] .forgot-sent-msg {
  background: rgba(39,174,96,0.12);
  color: #4ecb8c;
}

.login-spinner {
  width: 16px;
  height: 16px;
  border: 2px solid rgba(255,255,255,0.3);
  border-top-color: #fff;
  border-radius: 50%;
  animation: spin 0.7s linear infinite;
  display: inline-block;
}

@keyframes spin { to { transform: rotate(360deg); } }

/* ── AI INSIGHT CARD ─────────────────────────────────────────────────────── */
.ai-insight-card {
  margin-top: 24px;
}

.ai-insight-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 16px;
}

.ai-insight-header .chart-card-title {
  margin-bottom: 0;
  flex: 1;
}

.refresh-insight-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: var(--royal);
  color: #fff;
  border: none;
  border-radius: 4px;
  padding: 6px 14px;
  font-family: 'Inter', sans-serif;
  font-size: 0.78rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s, transform 0.1s;
  flex-shrink: 0;
  white-space: nowrap;
}

.refresh-insight-btn:hover { background: var(--royal-mid); }
.refresh-insight-btn:active { transform: scale(0.96); }
.refresh-insight-btn:disabled { opacity: 0.6; cursor: not-allowed; transform: none; }

.ai-insight-body {
  min-height: 80px;
  font-size: 0.875rem;
  line-height: 1.75;
  color: var(--text);
}

.ai-insight-body p {
  margin: 0 0 0.6em;
}

.ai-insight-body p:last-child {
  margin-bottom: 0;
}

/* ── AI INSIGHT CONTENT RENDERER ─────────────────────────────── */
.ai-insight-content {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.ai-insight-content .ai-section-title {
  font-size: 0.92rem;
  font-weight: 700;
  color: var(--royal);
  margin: 16px 0 6px;
  letter-spacing: 0.1px;
  border-bottom: 1px solid var(--border);
  padding-bottom: 5px;
}

.ai-insight-content .ai-section-title:first-child {
  margin-top: 0;
}

[data-theme="dark"] .ai-insight-content .ai-section-title {
  color: var(--royal-light);
}

.ai-insight-content .ai-list {
  list-style: none;
  margin: 4px 0 8px;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.ai-insight-content .ai-list li {
  position: relative;
  padding-left: 18px;
  line-height: 1.65;
  color: var(--text);
}

.ai-insight-content .ai-list li::before {
  content: '▸';
  position: absolute;
  left: 0;
  color: var(--royal-mid);
  font-size: 0.78rem;
  top: 3px;
}

.ai-insight-content .ai-list li.ai-li-num::before {
  content: '';
}

.ai-insight-content .ai-list li.ai-li-num {
  padding-left: 0;
}

.ai-insight-content .ai-li-counter {
  font-weight: 700;
  color: var(--royal-mid);
  margin-right: 2px;
}

.ai-insight-content span {
  display: block;
  line-height: 1.7;
}

/* badge na nav (contador de alertas) */
.nav-alert-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 99px;
  background: #2451b3;
  color: #fff;
  font-size: 0.62rem;
  font-weight: 700;
  margin-left: auto;
  animation: pulseBadge 1.8s infinite;
  flex-shrink: 0;
}

@keyframes pulseBadge {
  0%, 100% { box-shadow: 0 0 0 0 rgba(36, 81, 179, 0.6); }
  50%       { box-shadow: 0 0 0 6px rgba(36, 81, 179, 0); }
}

/* ── ALERTA CARDS ────────────────────────────────────────────────────────── */
/* ── ALERT CATEGORIES ── */
.alert-category {
  margin-bottom: 36px;
}

.alert-category-header {
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  padding: 8px 14px;
  border-radius: 6px;
  margin-bottom: 16px;
  border-left: 3px solid;
  cursor: pointer;
  user-select: none;
}

.alert-cat-chevron {
  flex-shrink: 0;
  transition: transform 0.2s ease;
  opacity: 0.7;
}

.alert-cat-collapsed .alert-cat-chevron {
  transform: rotate(-90deg);
}

.alert-cat-collapsed .alert-category-body {
  display: none;
}

.alert-cat-collapsed {
  margin-bottom: 12px;
}

.alert-cat-futuro {
  background: rgba(192, 88, 154, 0.08);
  color: var(--s-future);
  border-left-color: var(--s-future);
}

.alert-cat-programada {
  background: rgba(13, 168, 152, 0.08);
  color: var(--s-programada);
  border-left-color: var(--s-programada);
}

.alert-cat-followup {
  background: rgba(230, 126, 34, 0.08);
  color: #e67e22;
  border-left-color: #e67e22;
}

.alert-cat-esfriando {
  background: rgba(243, 156, 18, 0.08);
  color: #d68910;
  border-left-color: #f39c12;
}

.alert-cat-resultado {
  background: rgba(192, 57, 43, 0.07);
  color: #c0392b;
  border-left-color: #e74c3c;
}

/* ── RESULTADO DO AGENDAMENTO ─────────────────────────────────────────────── */
.resultado-grid {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 4px 0 6px;
}

.resultado-card {
  display: flex;
  border-radius: var(--r-md);
  border: 1px solid var(--border);
  background: var(--bg2);
  box-shadow: var(--glow);
  overflow: hidden;
  transition: box-shadow var(--transition-lift), transform var(--transition-lift);
}
.resultado-card:hover { box-shadow: var(--glow-hover); transform: translateY(-2px); }

.resultado-card-accent {
  width: 3px;
  flex-shrink: 0;
  background: linear-gradient(180deg, #991b1b, #e74c3c, #fca5a5);
}

.resultado-card-inner {
  flex: 1;
  padding: 12px 14px;
  min-width: 0;
}

.resultado-card-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.resultado-card-info { flex: 1; min-width: 0; }

.resultado-card-name {
  font-size: 0.88rem;
  font-weight: 700;
  color: var(--text1);
  margin-bottom: 4px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.resultado-card-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  margin-bottom: 5px;
}

.resultado-tag {
  font-size: 0.68rem;
  font-weight: 700;
  padding: 1px 7px;
  border-radius: 10px;
  white-space: nowrap;
}
.resultado-tag--fut { background: rgba(192,88,154,0.14); color: var(--s-future); }
.resultado-tag--prog { background: rgba(13,168,152,0.14); color: var(--s-programada); }

.resultado-produto {
  font-size: 0.68rem;
  color: var(--text3);
}

.resultado-card-date {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.74rem;
  color: var(--text2);
  margin-bottom: 5px;
}
.resultado-ago { color: #c0392b; font-weight: 600; }

.resultado-wa-row {
  display: flex;
  align-items: center;
  gap: 8px;
}
.resultado-wa {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.7rem;
  font-weight: 600;
  color: #27ae60;
  text-decoration: none;
  padding: 2px 7px;
  border-radius: 10px;
  border: 1px solid rgba(39,174,96,0.35);
  background: rgba(39,174,96,0.08);
  transition: background 0.12s;
}
.resultado-wa:hover { background: rgba(39,174,96,0.16); }
.resultado-tel { font-size: 0.72rem; color: var(--text3); }

.resultado-actions {
  display: flex;
  flex-direction: column;
  gap: 5px;
  flex-shrink: 0;
}

.resultado-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 11px;
  border-radius: 6px;
  font-size: 0.74rem;
  font-weight: 600;
  cursor: pointer;
  border: 1.5px solid;
  transition: background 0.12s, opacity 0.12s;
  white-space: nowrap;
}
.resultado-btn--ok {
  color: #1a7d2e;
  border-color: rgba(26,125,46,0.4);
  background: rgba(26,125,46,0.08);
}
.resultado-btn--ok:hover { background: rgba(26,125,46,0.18); }

.resultado-btn--no {
  color: #c0392b;
  border-color: rgba(192,57,43,0.4);
  background: rgba(192,57,43,0.07);
}
.resultado-btn--no:hover { background: rgba(192,57,43,0.16); }

.resultado-btn--re {
  color: #7d6000;
  border-color: rgba(243,156,18,0.45);
  background: rgba(243,156,18,0.08);
}
.resultado-btn--re:hover { background: rgba(243,156,18,0.18); }

.resultado-remarcar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--border);
}
.resultado-remarcar-label {
  font-size: 0.74rem;
  color: var(--text2);
  white-space: nowrap;
}
.resultado-remarcar-input {
  padding: 5px 9px;
  border-radius: 6px;
  border: 1.5px solid var(--border);
  background: var(--bg3);
  color: var(--text1);
  font-size: 0.78rem;
  outline: none;
}
.resultado-remarcar-input:focus { border-color: var(--royal-light); }
.resultado-btn--save {
  color: #1a3c8f;
  border-color: rgba(26,60,143,0.4);
  background: rgba(26,60,143,0.08);
}
.resultado-btn--save:hover { background: rgba(26,60,143,0.18); }
.resultado-btn--cancel {
  color: var(--text3);
  border-color: var(--border);
  background: none;
}
.resultado-btn--cancel:hover { background: var(--bg3); }

/* ── MAPA DE CALOR REGIONAL ──────────────────────────────────────────────── */
.heatmap-section { padding: 16px 20px 14px; margin-bottom: 24px; }

.heatmap-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 18px;
}

.hm-tab-group { display: flex; gap: 4px; }
.hm-tab {
  padding: 5px 13px;
  border-radius: 6px;
  border: 1.5px solid var(--border);
  background: none;
  color: var(--text2);
  font-size: 0.75rem;
  font-weight: 600;
  cursor: pointer;
  transition: border-color 0.13s, color 0.13s, background 0.13s;
}
.hm-tab:hover { background: var(--bg3); }
.hm-tab--active { border-color: var(--royal-light); color: var(--royal-light); background: rgba(26,60,143,0.08); }

.heatmap-body {
  display: flex;
  gap: 28px;
  align-items: flex-start;
  flex-wrap: wrap;
}

.heatmap-map-wrap { overflow-x: auto; flex-shrink: 0; }

.heatmap-map {
  display: grid;
  grid-template-columns: repeat(10, 42px);
  grid-template-rows: repeat(9, 42px);
  gap: 3px;
  width: fit-content;
}

.hm-tile {
  border-radius: 6px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1px;
  cursor: default;
  transition: transform 0.12s, box-shadow 0.12s;
  border: 1.5px solid transparent;
  position: relative;
  z-index: 1;
}
.hm-tile:hover {
  transform: scale(1.18);
  z-index: 10;
  box-shadow: 0 4px 14px rgba(0,0,0,0.18);
  border-color: rgba(255,255,255,0.25);
}
.hm-tile--empty { opacity: 0.35; cursor: default; }
.hm-tile--empty:hover { transform: none; box-shadow: none; }

.hm-uf  { font-size: 0.65rem; font-weight: 800; line-height: 1; }
.hm-val { font-size: 0.56rem; font-weight: 600; line-height: 1; opacity: 0.88; }

/* Ranking */
.heatmap-rank { flex: 1; min-width: 220px; }

.hm-rank-header {
  display: grid;
  grid-template-columns: 1fr 38px 48px 72px;
  gap: 4px;
  font-size: 0.65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text3);
  padding: 0 4px 6px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 4px;
}
.hm-rank-header span:not(:first-child) { text-align: right; }

.hm-rank-row {
  display: grid;
  grid-template-columns: 1fr 38px 48px 72px;
  align-items: center;
  gap: 4px;
  padding: 5px 4px;
  border-radius: 6px;
  transition: background 0.1s;
}
.hm-rank-row:hover { background: var(--bg3); }
.hm-rank-row--gold   { background: rgba(212,175,55,0.07); }
.hm-rank-row--silver { background: rgba(160,160,160,0.06); }
.hm-rank-row--bronze { background: rgba(180,115,60,0.06); }

.hm-rank-state { display: flex; align-items: center; gap: 6px; min-width: 0; }
.hm-rank-n { font-size: 0.68rem; font-weight: 700; color: var(--text3); width: 14px; text-align: right; flex-shrink: 0; }
.hm-rank-uf-tag { font-size: 0.62rem; font-weight: 800; padding: 2px 5px; border-radius: 4px; flex-shrink: 0; }
.hm-rank-info { min-width: 0; flex: 1; }
.hm-rank-name { font-size: 0.74rem; font-weight: 600; color: var(--text1); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hm-rank-bar-wrap { height: 3px; background: var(--border); border-radius: 2px; margin-top: 3px; overflow: hidden; }
.hm-rank-bar-fill { height: 100%; border-radius: 2px; }

.hm-rank-v { font-size: 0.71rem; font-weight: 600; text-align: right; white-space: nowrap; }
.hm-rank-v--leads { color: rgba(26,60,143,0.85); }
.hm-rank-v--taxa  { color: rgba(22,128,66,0.85); }
.hm-rank-v--valor { color: rgba(161,123,32,0.85); }

.hm-rank-empty { font-size: 0.8rem; color: var(--text3); text-align: center; padding: 24px 0; }

/* Legend */
.heatmap-legend { margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--border); }
.hm-legend-wrap { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.hm-legend-label { font-size: 0.73rem; font-weight: 600; color: var(--text2); white-space: nowrap; }
.hm-legend-scale { display: flex; align-items: center; gap: 6px; }
.hm-legend-scale span { font-size: 0.65rem; color: var(--text3); }
.hm-legend-grad { width: 80px; height: 8px; border-radius: 4px; }
.hm-legend-note { font-size: 0.65rem; color: var(--text3); font-style: italic; margin-left: auto; }

/* ── BADGE DIAS SEM CONTATO (tabela de leads) ── */
.dias-frio-badge {
  display: inline-flex; align-items: center;
  font-size: 0.6rem; font-weight: 700; letter-spacing: 0.02em;
  padding: 1px 5px; border-radius: 4px;
  margin-left: 5px; vertical-align: middle; line-height: 1.5;
  cursor: default;
}
.dias-frio-badge--atencao {
  background: rgba(243,156,18,.15);
  color: #b7770d;
  border: 1px solid rgba(243,156,18,.35);
}
.dias-frio-badge--alerta {
  background: rgba(230,126,34,.15);
  color: #b94e08;
  border: 1px solid rgba(230,126,34,.35);
}
.dias-frio-badge--critico {
  background: rgba(192,57,43,.15);
  color: #922b21;
  border: 1px solid rgba(192,57,43,.35);
}

.alert-cat-count {
  margin-left: auto;
  font-size: 0.68rem;
  font-weight: 700;
  padding: 1px 7px;
  border-radius: 10px;
  background: currentColor;
  color: var(--bg);
  opacity: 0.9;
}

.alerts-cat-empty {
  font-size: 0.78rem;
  color: var(--text3);
  padding: 12px 0 0 4px;
}

.alert-level-section {
  margin-bottom: 28px;
}

.alert-level-title {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--text3);
  margin-bottom: 12px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border);
}

.alert-level-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}

@keyframes dot-glow-royal {
  0%, 100% { box-shadow: 0 0 2px 1px rgba(58,111,216,0.4); opacity: 1; }
  50%       { box-shadow: 0 0 8px 4px rgba(58,111,216,0.65); opacity: 0.8; }
}

.alert-section-futuro .alert-level-title {
  color: var(--royal-light);
}
.alert-section-futuro .alert-level-dot {
  background: var(--royal-light) !important;
  animation: dot-glow-royal 2s ease-in-out infinite;
}

.alert-level-count {
  margin-left: auto;
  background: var(--bg3);
  border: 1px solid var(--border);
  border-radius: 99px;
  padding: 1px 8px;
  font-size: 0.65rem;
}

.alert-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(320px, 100%), 1fr));
  gap: 14px;
}

.alert-card {
  background: var(--card);
  border: 1px solid var(--border);
  position: relative;
  overflow: hidden;
  border-radius: var(--r-md);
  padding: 16px 18px;
  box-shadow: var(--glow);
  display: flex;
  flex-direction: column;
  gap: 10px;
  transition: transform var(--transition-lift), box-shadow var(--transition-lift);
}
.alert-card::before {
  content: '';
  position: absolute;
  top: 0; bottom: 0; left: 0;
  width: 3px;
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--accent, var(--border)) 75%, black),
    var(--accent, var(--border)),
    color-mix(in srgb, var(--accent, var(--border)) 55%, white));
}

.alert-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--glow-hover);
}

.alert-card-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: nowrap;
}

.alert-card-ficha-btn {
  background: none;
  border: 1px solid var(--border);
  color: var(--text3);
  border-radius: 4px;
  width: 26px;
  height: 26px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
  transition: border-color 0.15s, color 0.15s, background 0.15s;
}
.alert-card-ficha-btn:hover {
  border-color: var(--royal-light);
  color: var(--royal-light);
  background: var(--royal-pale);
}

.alert-card-name {
  font-size: 0.92rem;
  font-weight: 700;
  color: var(--text);
  line-height: 1.3;
  word-break: break-word;
}

.alert-card-tel {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 0.78rem;
  color: var(--text3);
  margin-top: 2px;
}

.alert-level-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 10px;
  border-radius: 3px;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  white-space: nowrap;
  flex-shrink: 0;
}

.alert-card-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--border);
  margin-top: auto;
}

.alert-card-date {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.75rem;
  color: var(--text2);
  font-weight: 600;
}

.alert-card-countdown {
  font-size: 0.72rem;
  color: var(--text3);
  font-weight: 600;
  text-align: right;
  white-space: nowrap;
}

/* ── FOLLOW-UP CARDS (só o botão de ficha sobrevive — resto do componente foi substituído) ── */
.fu-ficha-btn {
  background: none;
  border: 1px solid var(--border);
  color: var(--text3);
  border-radius: 5px;
  width: 26px;
  height: 26px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
  transition: border-color 0.15s, color 0.15s, background 0.15s;
}
.fu-ficha-btn:hover {
  border-color: var(--royal-light);
  color: var(--royal-light);
  background: var(--royal-pale);
}


/* Cores por nível */
.alert-agora   { --accent: #c0392b; }
.alert-10min   { --accent: #e74c3c; }
.alert-30min   { --accent: #e67e22; }
.alert-hoje    { --accent: #f39c12; }
.alert-1dia    { --accent: #f1c40f; }
.alert-4dias   { --accent: #3498db; }
.alert-7dias   { --accent: #2ecc71; }
.alert-futuro  { --accent: var(--border); }
.alert-vencido { --accent: var(--text3); opacity: 0.7; }

.alerts-empty {
  text-align: center;
  padding: 60px 20px;
  color: var(--text3);
  font-size: 0.88rem;
}

.alerts-empty svg { margin-bottom: 14px; opacity: 0.35; }

/* Toast de alerta especial */
.toast-alert {
  border-left-color: var(--s-future) !important;
  max-width: 340px;
  white-space: normal !important;
}

.toast-alert-name { font-weight: 700; color: var(--s-future); }
.toast-alert-info { font-size: 0.75rem; color: var(--text3); margin-top: 3px; font-weight: 400; }
.agend-banner {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  background: var(--royal-pale);
  border: 1px solid rgba(58, 111, 216, 0.3);
  border-radius: 6px;
  margin-bottom: 12px;
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--royal-light);
  letter-spacing: 0.2px;
}

.agend-picker {
  background: var(--bg3);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 14px;
}

.agend-cal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}

.agend-cal-nav {
  background: none;
  border: 1px solid var(--border);
  color: var(--text2);
  border-radius: 4px;
  width: 28px;
  height: 28px;
  cursor: pointer;
  font-size: 1.1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.15s, border-color 0.15s;
  flex-shrink: 0;
  font-family: 'Inter', sans-serif;
}

.agend-cal-nav:hover {
  background: var(--bg2);
  border-color: var(--royal-light);
  color: var(--royal-light);
}

.agend-cal-month {
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--text);
  letter-spacing: 0.2px;
}

.agend-cal-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 3px;
  margin-bottom: 4px;
}

.agend-cal-wday {
  text-align: center;
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.5px;
  color: var(--text3);
  padding: 4px 0;
  text-transform: uppercase;
}

.agend-cal-day {
  text-align: center;
  font-size: 0.75rem;
  padding: 7px 2px;
  border-radius: 4px;
  cursor: pointer;
  color: var(--text2);
  border: 1px solid transparent;
  transition: background 0.12s, border-color 0.12s, color 0.12s;
  line-height: 1;
  font-family: 'Inter', sans-serif;
  font-weight: 400;
}

.agend-cal-day:hover {
  background: var(--bg2);
  border-color: var(--border);
}

.agend-cal-day.today {
  border-color: var(--royal-light);
  color: var(--royal-light);
  font-weight: 700;
}

.agend-cal-day.selected {
  background: var(--royal-light);
  color: #fff;
  font-weight: 700;
  border-color: var(--royal-light);
}

.agend-cal-day.today.selected {
  background: var(--royal-light);
  color: #fff;
}

.agend-cal-day.empty {
  cursor: default;
  pointer-events: none;
}

.agend-time-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--border);
}

.agend-time-label {
  font-size: 0.68rem;
  font-weight: 700;
  color: var(--text3);
  letter-spacing: 0.6px;
  text-transform: uppercase;
  flex-shrink: 0;
}

.agend-time-sep {
  font-weight: 700;
  color: var(--text3);
  font-size: 1rem;
}

.agend-time-select {
  padding: 6px 10px;
  border-radius: 4px;
  border: 1px solid var(--border);
  background: var(--bg2);
  color: var(--text);
  font-size: 0.82rem;
  font-family: 'Inter', sans-serif;
  outline: none;
  cursor: pointer;
  transition: border-color 0.15s;
}

.agend-time-select:focus { border-color: var(--royal-mid); }

.agend-result {
  margin-top: 12px;
  background: var(--bg2);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 9px 12px;
  font-size: 0.78rem;
  color: var(--text3);
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
}

.agend-result.has-value {
  color: var(--royal-light);
  border-color: rgba(58, 111, 216, 0.35);
  background: var(--royal-pale);
  font-weight: 600;
}

/* badge exibido na tabela para leads com agendamento */
.agend-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.65rem;
  font-weight: 700;
  color: var(--royal-light);
  background: var(--royal-pale);
  border: 1px solid rgba(58, 111, 216, 0.25);
  border-radius: 3px;
  padding: 2px 6px;
  margin-top: 3px;
  white-space: nowrap;
}

/* ── ETAPA — cores para o modal de seleção ── */
.etapa-fill--blue  { background: var(--royal) !important; color: var(--royal) !important; }
.etapa-fill--teal  { background: #0da898     !important; color: #0da898     !important; }
.etapa-fill--green { background: #16a34a     !important; color: #16a34a     !important; }

/* ── ETAPA DE NEGOCIAÇÃO — mini barra na tabela ── */
.etapa-mini-btn {
  display: flex; flex-direction: column; gap: 6px;
  background: rgba(125,60,152,0.06);
  border: 1px solid rgba(125,60,152,0.18);
  border-radius: 10px;
  cursor: pointer; padding: 7px 10px; text-align: left;
  width: 100%; min-width: 118px;
  transition: background .15s, border-color .15s, box-shadow .15s;
}
.etapa-mini-btn:hover {
  background: rgba(125,60,152,0.12);
  border-color: rgba(125,60,152,0.38);
  box-shadow: 0 3px 12px rgba(125,60,152,0.15);
}
.etapa-mini-row {
  display: flex; align-items: center; justify-content: space-between;
  gap: 6px; width: 100%;
}
.etapa-mini-label {
  flex: 1; font-size: 0.69rem; color: var(--s-negot); font-weight: 700;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.etapa-mini-pct {
  flex-shrink: 0; font-size: 0.65rem; font-weight: 800;
  color: var(--s-negot);
  background: rgba(125,60,152,0.12);
  border: 1px solid rgba(125,60,152,0.22);
  border-radius: 99px; padding: 1px 7px;
}
.etapa-mini-track {
  height: 4px; border-radius: 99px;
  background: rgba(125,60,152,0.1); overflow: hidden; width: 100%;
}
.etapa-mini-fill {
  height: 100%; border-radius: 99px;
  background: linear-gradient(90deg, #5b1670 0%, #7d3c98 55%, #b06ec4 100%);
  box-shadow: 0 1px 3px rgba(125,60,152,.3);
  transition: width 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}
.etapa-mini-dots {
  display: flex; gap: 4px; align-items: center;
}
.etapa-dot {
  width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0;
  background: var(--bg3);
  border: 1.5px solid rgba(125,60,152,0.22);
  transition: background .2s, border-color .2s, transform .2s, box-shadow .2s;
}
.etapa-dot--done {
  background: var(--s-negot);
  border-color: var(--s-negot);
  box-shadow: 0 0 0 1.5px rgba(125,60,152,0.2);
}
.etapa-dot--cur {
  background: var(--bg);
  border: 2px solid var(--s-negot);
  transform: scale(1.4);
  box-shadow: 0 0 0 2px rgba(125,60,152,0.22);
}

/* ── ETAPA MODAL ── */
.etapa-modal { max-width: 480px; }

/* Barra de progresso hero no topo do modal */
.etapa-progress-hero {
  margin: 0 0 16px;
  padding: 16px 18px 15px;
  background: linear-gradient(135deg, rgba(125,60,152,0.05) 0%, rgba(13,168,152,0.03) 100%);
  border: 1px solid rgba(125,60,152,0.16);
  border-radius: 14px;
  position: relative;
  overflow: hidden;
}
.etapa-progress-hero::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--s-negot) 0%, #0da898 100%);
  border-radius: 14px 14px 0 0;
}
.etapa-progress-top {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 14px; gap: 12px;
}
.etapa-progress-lbl {
  font-size: 0.6rem; color: var(--text3); font-weight: 700;
  letter-spacing: 0.07em; text-transform: uppercase; margin-bottom: 3px;
}
.etapa-progress-name {
  font-size: 1rem; font-weight: 700; color: var(--s-negot); line-height: 1.2;
}
/* Circular badge — substitui o bloco numérico simples */
.etapa-progress-pct {
  flex-shrink: 0;
  width: 50px; height: 50px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 0.88rem; font-weight: 900; line-height: 1;
  border: 2.5px solid currentColor;
  background: rgba(125,60,152,0.08);
}
.etapa-fill--teal.etapa-progress-pct  { background: rgba(13,168,152,0.1)  !important; }
.etapa-fill--green.etapa-progress-pct { background: rgba(22,163,74,0.1)   !important; }
.etapa-fill--blue.etapa-progress-pct  { background: rgba(26,60,143,0.1)   !important; }
.etapa-progress-track {
  height: 10px; border-radius: 99px;
  background: rgba(125,60,152,0.1);
  box-shadow: inset 0 1px 3px rgba(0,0,0,.07);
  overflow: hidden; margin-bottom: 14px;
}
.etapa-progress-fill {
  height: 100%; border-radius: 99px;
  background: linear-gradient(90deg, #5b1670 0%, #7d3c98 60%, #b06ec4 100%);
  box-shadow: 0 1px 6px rgba(125,60,152,.35);
  transition: width 0.45s cubic-bezier(0.22, 1, 0.36, 1), background 0.3s;
}
.etapa-fill--teal.etapa-progress-fill  { background: linear-gradient(90deg, #0a7a72 0%, #0da898 60%, #3fd1c3 100%) !important; box-shadow: 0 1px 6px rgba(13,168,152,.4); }
.etapa-fill--green.etapa-progress-fill { background: linear-gradient(90deg, #14532d 0%, #16a34a 60%, #4ade80 100%) !important; box-shadow: 0 1px 6px rgba(22,163,74,.4); }
.etapa-fill--blue.etapa-progress-fill  { background: linear-gradient(90deg, #1a3c8f 0%, #3a6fd8 60%, #7fa8f0 100%) !important; box-shadow: 0 1px 6px rgba(26,60,143,.4); }
.etapa-progress-steps {
  display: flex; align-items: center; justify-content: space-between;
  position: relative;
}
.etapa-progress-steps::before {
  content: '';
  position: absolute; top: 50%; left: 6px; right: 6px; height: 2px;
  background: rgba(125,60,152,0.12); transform: translateY(-50%); z-index: 0;
}
.etapa-pdot {
  width: 12px; height: 12px; border-radius: 50%; flex-shrink: 0;
  background: var(--bg3); border: 2px solid var(--border);
  position: relative; z-index: 1;
  transition: background .2s, transform .2s, box-shadow .2s, border-color .2s;
}
.etapa-pdot--done {
  background: #16a34a;
  border-color: #16a34a;
  box-shadow: 0 0 0 2px rgba(22,163,74,0.18);
}
.etapa-pdot--cur  {
  background: var(--bg);
  border: 3px solid var(--s-negot);
  transform: scale(1.45);
  box-shadow: 0 0 0 3px rgba(125,60,152,0.2);
}

/* ── ETAPA MODAL — seletor de etapas ── */
.etapa-sel-list {
  display: flex; flex-direction: column; gap: 7px;
  margin: 0 0 2px;
}
.etapa-sel-item {
  display: flex; align-items: center; gap: 12px;
  padding: 10px 14px;
  border: 1.5px solid var(--border);
  border-radius: 10px;
  background: var(--card);
  cursor: pointer; text-align: left;
  font-family: inherit; width: 100%;
  transition: border-color .15s, background .15s;
}
.etapa-sel-item:hover {
  border-color: var(--royal-light);
  background: var(--royal-pale);
}
.etapa-sel-item--active {
  border-color: var(--royal);
  background: var(--royal-pale);
}
.etapa-sel-item--done {
  border-color: rgba(30,132,73,.35);
  background: rgba(30,132,73,.06);
}
.etapa-sel-num {
  flex-shrink: 0; width: 26px; height: 26px; border-radius: 50%;
  background: var(--border); color: var(--text2);
  font-size: .75rem; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
}
.etapa-sel-item--active .etapa-sel-num { background: var(--royal); color: #fff; }
.etapa-sel-item--done   .etapa-sel-num { background: #16a34a; color: #fff; font-size: .8rem; }
.etapa-sel-body { flex: 1; display: flex; flex-direction: column; gap: 1px; }
.etapa-sel-name { font-size: .82rem; font-weight: 600; color: var(--text1); }
.etapa-sel-item--active .etapa-sel-name { color: var(--royal); }
.etapa-sel-item--done   .etapa-sel-name { color: #16a34a; }
.etapa-sel-pct  { font-size: .68rem; color: var(--text3); }
.etapa-sel-check {
  font-size: .7rem; font-weight: 600; flex-shrink: 0;
  color: var(--royal); background: var(--royal-pale);
  border: 1px solid rgba(58,111,216,.3);
  border-radius: 5px; padding: 2px 7px;
}

/* ── ETAPA — seletor inline na ficha ── */
.ficha-etapa-steps {
  display: flex; gap: 6px; flex-wrap: wrap; margin-top: 10px;
}
.ficha-etapa-step {
  flex: 1; min-width: 90px; padding: 9px 10px 8px;
  border-radius: 8px; border: 1.5px solid var(--border);
  background: var(--bg3); cursor: pointer; text-align: center;
  transition: border-color 0.15s, background 0.15s;
  display: flex; flex-direction: column; align-items: center; gap: 3px;
  font-family: inherit;
}
.ficha-etapa-step:hover {
  border-color: var(--royal-light);
  background: var(--royal-pale);
}
.ficha-etapa-step--active {
  border-color: var(--royal);
  background: var(--royal-pale);
}
.ficha-etapa-step--done {
  border-color: rgba(30,132,73,0.4);
  background: rgba(30,132,73,0.07);
}
.ficha-etapa-step-label {
  font-size: 0.68rem; font-weight: 600; color: var(--text2); line-height: 1.2;
}
.ficha-etapa-step--active .ficha-etapa-step-label { color: var(--royal); }
.ficha-etapa-step--done   .ficha-etapa-step-label { color: #16a34a; }
.ficha-etapa-step-pct { font-size: 0.62rem; color: var(--text3); font-weight: 500; }
.ficha-etapa-step--active .ficha-etapa-step-pct { color: var(--royal-light); }
.ficha-etapa-step--done   .ficha-etapa-step-pct { color: rgba(22,163,74,0.7); }
.ficha-etapa-step-dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--border); margin-top: 2px;
}
.ficha-etapa-step--active .ficha-etapa-step-dot { background: var(--royal); }
.ficha-etapa-step--done   .ficha-etapa-step-dot { background: #16a34a; }

/* ── DESKTOP LAYOUT — offset content for mini sidebar ── */
/* Must be at end of file to override shorthand padding rules above */
@media (min-width: 1025px) {
  .hamburger-btn { display: none; }
}

/* Removida a regra que posicionava o sidebar abaixo da topbar (top:60px) em
   telas ≥901px: openSidebar()/closeSidebar() (app.js) sempre forçam top:0 +
   altura cheia via inline style, em qualquer tamanho de tela — essa regra CSS
   nunca vencia enquanto aberto (inline sempre tem prioridade), só entrava em
   vigor por ~300ms durante a transição de fechamento (o setTimeout que limpa
   o inline style), causando um salto/corte visível bem na hora de fechar.
   Como o zoom do navegador desloca a largura efetiva pelos breakpoints, esse
   conflito ficava mais ou menos visível dependendo do zoom. Removendo a regra
   concorrente, CSS e JS concordam sempre: o menu cobre a tela inteira a partir
   do topo em qualquer tamanho/zoom, sem estado intermediário divergente. */

/* ═══════════════════════════════════════════════════════════════
   TOPBAR USER SELECTOR
═══════════════════════════════════════════════════════════════ */
.topbar-user-static {
  display: flex; align-items: center; gap: 7px;
  background: var(--bg2); border: 1px solid var(--border);
  border-radius: 8px; padding: 5px 11px;
  font-size: 0.78rem; font-weight: 600; color: var(--text1);
  white-space: nowrap;
}
.topbar-user-avatar {
  width: 24px; height: 24px; border-radius: 50%;
  background: var(--bg3); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 0.6rem; font-weight: 700; flex-shrink: 0;
  overflow: hidden;
}
.topbar-user-avatar img {
  width: 100%; height: 100%; object-fit: cover; border-radius: 50%;
}
.topbar-user-name { color: var(--text1); }

.topbar-master-badge {
  font-size: 0.6rem;
  font-weight: 800;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: #fff;
  background: linear-gradient(135deg, #e67e22, #e74c3c);
  padding: 2px 6px;
  border-radius: 4px;
  flex-shrink: 0;
}

/* Sino de alertas na topbar */
.topbar-bell-btn {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  background: transparent;
  border: 1px solid var(--border);
  border-radius: 8px;
  cursor: pointer;
  color: var(--text2);
  transition: background 0.15s, color 0.15s, border-color 0.15s;
  flex-shrink: 0;
}
.topbar-bell-btn:hover {
  background: var(--bg2);
  color: var(--royal);
  border-color: var(--royal-mid);
}
.topbar-bell-badge {
  position: absolute;
  top: -5px;
  right: -5px;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  background: #e74c3c;
  color: #fff;
  border-radius: 10px;
  font-size: 9px;
  font-weight: 700;
  line-height: 16px;
  text-align: center;
  pointer-events: none;
  box-shadow: 0 1px 4px rgba(0,0,0,0.25);
}

/* ── SINO DE ALERTAS — mini pop-up ────────────────────────────────────── */
.topbar-bell-wrap { position: relative; }

.bell-popup {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  width: 340px;
  max-width: calc(100vw - 24px);
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  box-shadow: var(--glow-hover);
  z-index: 500;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-6px) scale(0.98);
  transform-origin: top right;
  transition: opacity 0.16s ease, transform 0.16s ease, visibility 0.16s;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.bell-popup.show {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
}
.bell-popup-header {
  padding: 12px 16px;
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--text);
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.bell-popup-list {
  max-height: 360px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
}
.bell-popup-empty {
  padding: 28px 16px;
  text-align: center;
  color: var(--text3);
  font-size: 0.8rem;
}
.bell-popup-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 16px;
  border: none;
  border-bottom: 1px solid var(--border);
  width: 100%;
  background: none;
  cursor: pointer;
  text-align: left;
  font-family: inherit;
  color: var(--text);
  transition: background-color 0.15s;
}
.bell-popup-item:last-child { border-bottom: none; }
.bell-popup-item:hover { background: var(--bg3); }
.bell-popup-item:active { transform: scale(0.98); }
.bell-popup-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}
.bell-popup-item-body { flex: 1; min-width: 0; }
.bell-popup-item-name {
  display: block; /* sem isso o text-overflow:ellipsis não funciona em <span> e o nome
                      comprido invade o texto "Faltam..." — também garante que o status
                      sempre caia numa linha própria abaixo, nunca ao lado do nome */
  font-size: 0.82rem;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bell-popup-item-meta {
  display: block;
  font-size: 0.72rem;
  color: var(--text3);
  margin-top: 1px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bell-popup-item-when {
  font-size: 0.7rem;
  font-weight: 700;
  flex-shrink: 0;
  white-space: nowrap;
}
.bell-popup-viewall {
  padding: 11px 16px;
  font-size: 0.78rem;
  font-weight: 600;
  text-align: center;
  color: var(--royal-light);
  background: var(--bg2);
  border: none;
  border-top: 1px solid var(--border);
  cursor: pointer;
  flex-shrink: 0;
  transition: background-color 0.15s;
}
.bell-popup-viewall:hover { background: var(--bg3); }

.topbar-logout-btn {
  background: transparent;
  border: none;
  cursor: pointer;
  color: var(--text3);
  padding: 2px 0 0 2px;
  display: flex;
  align-items: center;
  opacity: 0.6;
  transition: opacity 0.15s, color 0.15s;
  flex-shrink: 0;
}
.topbar-logout-btn:hover { opacity: 1; color: #e74c3c; }

.equipe-btn--hist {
  background: rgba(58,111,216,.10); color: var(--accent);
  border: 1px solid rgba(58,111,216,.25);
}
.equipe-btn--hist:hover { background: rgba(58,111,216,.18); }

/* ═══════════════════════════════════════════════════════════════
   ACTIVITY DRAWER
═══════════════════════════════════════════════════════════════ */
.atv-overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,.55);
  z-index: 9980; opacity: 0; pointer-events: none;
  transition: opacity 0.25s;
}
.atv-overlay.show { opacity: 1; pointer-events: all; }

.atv-drawer {
  position: fixed; top: 0; right: 0; bottom: 0;
  width: min(420px, 100vw);
  background: var(--bg2); border-left: 1px solid var(--border);
  box-shadow: -8px 0 32px rgba(0,0,0,.18);
  z-index: 9981; display: flex; flex-direction: column;
  transform: translateX(100%); transition: transform 0.28s cubic-bezier(.4,0,.2,1);
}
.atv-drawer.show { transform: translateX(0); }

.atv-drawer-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 18px; border-bottom: 1px solid var(--border);
  flex-shrink: 0; gap: 10px;
}
.atv-drawer-member { display: flex; align-items: center; gap: 12px; }
.atv-drawer-avatar {
  width: 40px; height: 40px; border-radius: 50%;
  background: var(--accent); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 0.85rem; font-weight: 700; flex-shrink: 0;
}
.atv-drawer-nome { font-size: 0.95rem; font-weight: 700; color: var(--text1); }
.atv-drawer-cargo { font-size: 0.75rem; color: var(--text3); }
.atv-drawer-close {
  width: 30px; height: 30px; border-radius: 6px;
  background: var(--bg3); border: 1px solid var(--border);
  color: var(--text2); cursor: pointer; font-size: 1rem;
  display: flex; align-items: center; justify-content: center;
  transition: background 0.12s;
}
.atv-drawer-close:hover { background: var(--bg4,var(--bg3)); }

.atv-feed {
  flex: 1; overflow-y: auto; padding: 16px 18px;
  display: flex; flex-direction: column; gap: 10px;
}

.atv-bubble {
  display: flex; gap: 10px; align-items: flex-start;
  padding: 10px 12px; border-radius: 10px;
  background: var(--bg2); border: 1px solid var(--border);
  animation: bubbleIn 0.18s ease;
}
@keyframes bubbleIn {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}
.atv-bubble-icon {
  width: 30px; height: 30px; border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.atv-bubble-icon svg { width: 14px; height: 14px; }
.atv-bubble-body { flex: 1; min-width: 0; }
.atv-bubble-desc { font-size: 0.82rem; color: var(--text1); line-height: 1.4; }
.atv-bubble-time { font-size: 0.71rem; color: var(--text3); margin-top: 4px; }

/* Diff de campos (versionamento de cadastro) */
.atv-diff {
  margin: 6px 0 2px;
  border: 1px solid var(--border);
  border-radius: 7px;
  overflow: hidden;
  background: var(--bg3);
}
.atv-diff-row {
  display: grid;
  grid-template-columns: 120px 1fr 14px 1fr;
  align-items: center;
  gap: 6px;
  padding: 4px 8px;
  border-bottom: 1px solid var(--border);
  font-size: 0.71rem;
}
.atv-diff-row:last-child { border-bottom: none; }
.atv-diff-campo {
  font-weight: 700;
  color: var(--text2);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.atv-diff-de {
  color: var(--text3);
  text-decoration: line-through;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.atv-diff-para {
  color: var(--text1);
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.atv-diff-row svg { color: var(--text3); }

/* Status highlight no diff */
.atv-diff-row:has(.atv-diff-campo:empty) { display: none; }

/* ── LOG DE EXCLUSÃO ── */
.atv-exclusao {
  margin-top: 8px;
  border: 1px solid rgba(220,38,38,.22);
  border-radius: 8px;
  overflow: hidden;
  font-size: 0.75rem;
}
.atv-exclusao-header {
  display: flex;
  align-items: center;
  gap: 6px;
  background: rgba(220,38,38,.08);
  color: #dc2626;
  padding: 6px 10px;
  font-size: 0.71rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.atv-exclusao-row {
  display: flex;
  gap: 8px;
  padding: 4px 10px;
  border-top: 1px solid rgba(220,38,38,.08);
}
.atv-exclusao-row:last-child { padding-bottom: 7px; }
.atv-exclusao-label {
  color: var(--text3);
  font-weight: 600;
  min-width: 62px;
  flex-shrink: 0;
}
.atv-exclusao-val {
  color: var(--text2);
  font-weight: 500;
  word-break: break-word;
}

.atv-empty, .atv-loading {
  text-align: center; color: var(--text3);
  font-size: 0.82rem; padding: 40px 20px;
}
.atv-loading { display: flex; align-items: center; justify-content: center; gap: 8px; }

/* ═══════════════════════════════════════════════════════════════
   LGPD — PÁGINA E COMPONENTES
═══════════════════════════════════════════════════════════════ */

/* Mini-sidebar LGPD badge */
.mini-nav-lgpd { color: #16a34a; }
.nav-item-lgpd .nav-icon svg { stroke: #16a34a; }

/* KPI grid LGPD */
.lgpd-kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 14px;
  margin-bottom: 22px;
}
.lgpd-kpi-card {
  background: var(--bg2);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 16px 18px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  position: relative;
  overflow: hidden;
  box-shadow: var(--glow);
  transition: transform var(--transition-lift), box-shadow var(--transition-lift);
}
.lgpd-kpi-card:hover { transform: translateY(-2px); box-shadow: var(--glow-hover); }
.lgpd-kpi-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  border-radius: 12px 12px 0 0;
}
.lgpd-kpi--total::before { background: var(--accent); }
.lgpd-kpi--ok::before    { background: #16a34a; }
.lgpd-kpi--pend::before  { background: #dc2626; }
.lgpd-kpi--taxa::before  { background: #7c3aed; }
.lgpd-kpi--anon::before  { background: #6b7280; }
.lgpd-kpi-icon { color: var(--text3); }
.lgpd-kpi--ok .lgpd-kpi-icon   { color: #16a34a; }
.lgpd-kpi--pend .lgpd-kpi-icon { color: #dc2626; }
.lgpd-kpi--taxa .lgpd-kpi-icon { color: #7c3aed; }
.lgpd-kpi-val {
  font-size: 1.8rem;
  font-weight: 800;
  letter-spacing: -1px;
  color: var(--text1);
  line-height: 1;
}
.lgpd-kpi-label {
  font-size: 0.73rem;
  color: var(--text3);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.4px;
}

/* Aviso legal */
.lgpd-aviso {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  background: rgba(22,163,74,.07);
  border: 1px solid rgba(22,163,74,.25);
  border-radius: 9px;
  padding: 10px 14px;
  font-size: 0.78rem;
  color: var(--text2);
  line-height: 1.5;
  margin-bottom: 22px;
}
.lgpd-aviso svg { color: #16a34a; flex-shrink: 0; margin-top: 2px; }

/* Seções */
.lgpd-section {
  background: var(--bg2);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
  margin-bottom: 20px;
}
.lgpd-section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 13px 18px;
  border-bottom: 1px solid var(--border);
  gap: 10px;
}
.lgpd-section-title {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--text1);
  margin: 0;
}
.lgpd-section-title svg { color: #dc2626; }
.lgpd-section-count {
  font-size: 0.75rem;
  color: var(--text3);
  background: var(--bg3);
  border-radius: 20px;
  padding: 2px 10px;
  font-weight: 600;
}

/* ── Venda Programada — Projeção Mensal ─────────────────────── */
.vp-proj-total {
  padding: 10px 16px 8px;
  font-size: 0.85rem;
  color: var(--text2);
  border-bottom: 1px solid var(--border);
  margin-bottom: 12px;
}
.vp-proj-months {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  padding: 0 16px 16px;
}
.vp-proj-month-card {
  flex: 1 1 160px;
  min-width: 140px;
  max-width: 280px;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 12px 14px;
  background: var(--card-bg);
  box-shadow: var(--glow);
}
.vp-proj-month-label {
  font-size: 0.75rem;
  color: var(--text3);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 4px;
}
.vp-proj-month-val {
  font-size: 1.2rem;
  font-weight: 700;
  color: #0da898;
  margin-bottom: 2px;
}
.vp-proj-month-count {
  font-size: 0.73rem;
  color: var(--text3);
  margin-bottom: 8px;
}
.vp-proj-lead-list {
  border-top: 1px solid var(--border);
  padding-top: 6px;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.vp-proj-lead-item {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  font-size: 0.75rem;
  color: var(--text2);
  padding: 1px 0;
}
.vp-proj-lead-item span:first-child {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.vp-proj-lead-item span:last-child {
  flex-shrink: 0;
  font-weight: 600;
  color: #0da898;
}

/* ── IMPLANTADOS ─────────────────────────────────────────────────────────── */
.impl-header-controls {
  display: flex;
  align-items: center;
  gap: 12px;
}

.impl-mes-label {
  display: flex;
  flex-direction: column;
  font-size: 0.68rem;
  font-weight: 600;
  color: var(--text3);
  text-transform: uppercase;
  letter-spacing: 0.4px;
  gap: 4px;
}

.impl-mes-input {
  padding: 5px 10px;
  border-radius: 7px;
  border: 1px solid var(--border);
  background: var(--bg2);
  color: var(--text1);
  font-size: 0.82rem;
  cursor: pointer;
}
.impl-mes-input:focus { outline: none; border-color: var(--royal-light); }

/* KPI Grid */
.impl-kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(205px, 1fr));
  gap: 14px;
  margin-bottom: 22px;
}

.impl-kpi-card {
  display: flex;
  align-items: center;
  gap: 13px;
  padding: 14px 16px;
  background: var(--bg2);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  position: relative;
  overflow: hidden;
  box-shadow: var(--glow-strong);
  transition: transform var(--transition-lift), box-shadow var(--transition-lift);
}
.impl-kpi-card:hover { transform: translateY(-2px); box-shadow: var(--glow-strong-hover); }
.impl-kpi-card > div:last-child {
  min-width: 0;
  flex: 1;
}

.impl-kpi-icon {
  width: 38px;
  height: 38px;
  border-radius: 9px;
  background: rgba(58,111,216,0.1);
  color: var(--royal-light);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.impl-kpi-label {
  font-size: 0.68rem;
  color: var(--text3);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  margin-bottom: 3px;
}

.impl-kpi-val {
  /* Tamanho fixo — nada de vw. "vw" acompanha a largura da JANELA, não a do
     card, então em zooms diferentes as duas medidas desalinhavam e o valor
     ou quebrava no meio do número ou era cortado com "...", escondendo
     dígitos. Fixo sempre cabe no card (ver largura mínima do grid abaixo)
     e nunca esconde parte do valor, em nenhum zoom. */
  font-size: 0.86rem;
  font-weight: 800;
  color: var(--text1);
  letter-spacing: -0.3px;
  line-height: 1.15;
  white-space: nowrap;
}
.impl-kpi-val--blue   { color: #3a6fd8; }
.impl-kpi-val--green  { color: #1e8449; }
.impl-kpi-val--red    { color: #c0392b; }
.impl-kpi-val--orange { color: #e67e22; }
.impl-kpi-val--teal   { color: #0da898; }
[data-theme="dark"] .impl-kpi-val--blue   { color: #6f93ef; }
[data-theme="dark"] .impl-kpi-val--green  { color: #34d399; }
[data-theme="dark"] .impl-kpi-val--red    { color: #f87171; }
[data-theme="dark"] .impl-kpi-val--orange { color: #fb923c; }
[data-theme="dark"] .impl-kpi-val--teal   { color: #2dd4bf; }

/* Filters */
.impl-filters-bar {
  display: flex;
  gap: 10px;
  margin-bottom: 18px;
  flex-wrap: wrap;
}

.impl-search {
  flex: 1;
  min-width: 200px;
  padding: 8px 12px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--bg2);
  color: var(--text1);
  font-size: 0.84rem;
}
.impl-search:focus { outline: none; border-color: var(--royal-light); }

.impl-filter-sel {
  padding: 8px 12px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--bg2);
  color: var(--text1);
  font-size: 0.84rem;
  cursor: pointer;
}
.impl-filter-sel:focus { outline: none; border-color: var(--royal-light); }

/* Client Cards */
.impl-card {
  background: var(--bg2);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  margin-bottom: 12px;
  overflow: hidden;
  box-shadow: var(--glow);
  transition: transform var(--transition-lift), box-shadow var(--transition-lift),
              background-color 0.3s cubic-bezier(0.4, 0, 0.2, 1),
              border-color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.impl-card:hover { transform: translateY(-2px); box-shadow: var(--glow-hover); }

.impl-card-header {
  display: flex;
  align-items: center;
  gap: 13px;
  padding: 14px 16px 12px;
}

.impl-avatar {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 0.78rem;
  color: #fff;
  flex-shrink: 0;
  letter-spacing: 0.5px;
}

.impl-card-info {
  flex: 1;
  min-width: 0;
}

.impl-card-name {
  font-weight: 700;
  font-size: 0.9rem;
  color: var(--text1);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.impl-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 4px;
  align-items: center;
}

.impl-meta-item {
  font-size: 0.74rem;
  color: var(--text3);
}

.impl-valor-tag {
  font-size: 0.73rem;
  font-weight: 700;
  color: #1e8449;
  background: rgba(30,132,73,0.1);
  border-radius: 10px;
  padding: 1px 8px;
}

.impl-card-right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
  flex-shrink: 0;
}

.impl-status {
  font-size: 0.7rem;
  font-weight: 700;
  padding: 2px 10px;
  border-radius: var(--r-pill);
  text-transform: uppercase;
  letter-spacing: 0.4px;
  position: relative;
}
.impl-status--adimpl   { background: rgba(30,132,73,0.12);  color: #1e8449; }
.impl-status--inadimpl { background: rgba(192,57,43,0.12);  color: #c0392b; padding-left: 18px; }
[data-theme="dark"] .impl-status--adimpl   { color: #34d399; }
[data-theme="dark"] .impl-status--inadimpl { color: #f87171; }
.impl-status--inadimpl::before {
  content: '';
  position: absolute; left: 8px; top: 50%; transform: translateY(-50%);
  width: 5px; height: 5px; border-radius: 50%; background: #c0392b;
  animation: canRiscoPulse 1.8s ease-out infinite;
}
.impl-status--neutro   { background: var(--bg3);             color: var(--text3); }

.impl-rate {
  font-size: 0.68rem;
  color: var(--text3);
  font-weight: 600;
}

/* Month Grid */
.impl-months-row {
  display: flex;
  border-top: 1px solid var(--border);
  overflow-x: auto;
}

.impl-mc {
  flex: 1;
  min-width: 42px;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 8px 4px 10px;
  cursor: pointer;
  border-right: 1px solid var(--border);
  transition: background .18s ease, color .18s ease;
  user-select: none;
}
.impl-mc--pulse {
  animation: implMcPulse .32s cubic-bezier(.36,.07,.19,.97);
}
@keyframes implMcPulse {
  0%   { transform: scale(1); }
  40%  { transform: scale(1.18); }
  70%  { transform: scale(0.95); }
  100% { transform: scale(1); }
}
.impl-mc:last-child { border-right: none; }

.impl-mc-lbl {
  font-size: 0.62rem;
  font-weight: 600;
  color: var(--text3);
  letter-spacing: 0.2px;
  margin-bottom: 5px;
  text-transform: uppercase;
}

.impl-mc-ico {
  font-size: 0.85rem;
  line-height: 1;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
}

/* States */
.impl-mc--pago {
  background: rgba(30,132,73,0.05);
}
.impl-mc--pago:hover { background: rgba(30,132,73,0.12); }
.impl-mc--pago .impl-mc-ico {
  background: rgba(30,132,73,0.18);
  color: #1e8449;
}

.impl-mc--pendente {
  background: rgba(192,57,43,0.04);
}
.impl-mc--pendente:hover { background: rgba(192,57,43,0.1); }
.impl-mc--pendente .impl-mc-ico {
  background: rgba(192,57,43,0.15);
  color: #c0392b;
}
.impl-mc--pendente .impl-mc-lbl { color: #c0392b; }

.impl-mc--vazio {
  background: transparent;
}
.impl-mc--vazio:hover { background: rgba(58,111,216,0.06); }
.impl-mc--vazio .impl-mc-ico { color: var(--text3); }

.impl-mc--futuro {
  background: transparent;
  opacity: 0.35;
  cursor: default;
}
.impl-mc--futuro .impl-mc-ico { color: var(--text3); }

.impl-mc--venc-soon {
  background: rgba(183,119,13,0.07) !important;
}
.impl-mc--venc-soon .impl-mc-lbl { color: #b7770d !important; }
.impl-mc--venc-soon .impl-mc-ico { color: #b7770d !important; }

.impl-mc-day {
  font-size: 0.58rem;
  font-weight: 600;
  color: var(--text3);
  line-height: 1;
  margin-top: 3px;
  letter-spacing: 0;
}

.impl-venc-badge {
  font-size: 0.7rem;
  font-weight: 600;
  color: #b7770d;
  background: rgba(183,119,13,0.1);
  border: 1px solid rgba(183,119,13,0.2);
  border-radius: 9px;
  padding: 1px 8px;
  white-space: nowrap;
}

/* ── Vencimento Alerts Section ──────────────────────────────── */
.venc-alerts-section {
  background: rgba(183,119,13,0.05);
  border: 1px solid rgba(183,119,13,0.22);
  border-radius: 12px;
  padding: 14px 16px;
  margin-bottom: 14px;
}
.venc-alerts-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 11px;
  cursor: pointer;
  user-select: none;
}
.venc-alerts-header:hover { opacity: .85; }
.venc-alerts-section--collapsed .venc-alerts-header { margin-bottom: 0; }
.venc-alerts-section--collapsed .venc-alerts-list   { display: none; }
.venc-alerts-chevron {
  color: var(--text3);
  flex-shrink: 0;
  transition: transform .2s;
  margin-left: auto;
}
.venc-alerts-section--collapsed .venc-alerts-chevron { transform: rotate(-90deg); }
.venc-alerts-icon { display: inline-flex; color: var(--royal-light); flex-shrink: 0; }
.venc-alerts-title {
  font-size: 0.87rem;
  font-weight: 700;
  color: var(--text1);
  flex: 1;
}
.venc-alerts-count {
  font-size: 0.7rem;
  font-weight: 800;
  background: #b7770d;
  color: #fff;
  border-radius: 9px;
  padding: 1px 8px;
}
.venc-alerts-list { display: flex; flex-direction: column; gap: 7px; }
.venc-chip {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 9px 13px;
  border-radius: 9px;
  border: 1px solid transparent;
  background: var(--bg2);
}
.venc-chip--urgente { border-color: rgba(192,57,43,0.35); background: rgba(192,57,43,0.05); }
.venc-chip--critico { border-color: rgba(230,126,34,0.35); background: rgba(230,126,34,0.05); }
.venc-chip--aviso   { border-color: rgba(183,119,13,0.25); background: rgba(183,119,13,0.04); }
.venc-chip-info { flex: 1; min-width: 0; }
.venc-chip-nome {
  font-size: 0.84rem;
  font-weight: 600;
  color: var(--text1);
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.venc-chip-dia {
  font-size: 0.71rem;
  color: var(--text3);
  display: block;
}
.venc-chip-days {
  font-size: 0.76rem;
  font-weight: 700;
  color: #b7770d;
  white-space: nowrap;
  flex-shrink: 0;
}
.venc-chip--urgente .venc-chip-days { color: #c0392b; }
.venc-chip--critico .venc-chip-days { color: #e67e22; }
.venc-chip-wa {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 11px;
  background: #25D366;
  color: #fff;
  border-radius: 8px;
  font-size: 0.71rem;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
  flex-shrink: 0;
}
.venc-chip-wa:hover { background: #1ebe5a; }

/* Empty state */
.impl-empty {
  text-align: center;
  padding: 52px 20px;
  color: var(--text3);
}
.impl-empty svg { opacity: 0.25; margin-bottom: 14px; }
.impl-empty p   { font-size: 0.9rem; margin: 0 0 6px; }
.impl-empty-sub { font-size: 0.8rem !important; }
.vp-proj-empty {
  padding: 20px 16px;
  color: var(--text3);
  font-size: 0.82rem;
}

/* ── Venda Programada — Ficha VP section ────────────────────── */
.ficha-vp-card {
  background: rgba(13, 168, 152, 0.08);
  border: 1px solid rgba(13, 168, 152, 0.28);
  border-radius: 8px;
  padding: 14px 16px;
}
.ficha-vp-card-title {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--s-programada);
}
.ficha-vp-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 10px;
}
.ficha-vp-valor {
  color: var(--s-programada) !important;
  font-weight: 700;
  font-size: 1.05rem;
}

/* Tabela LGPD */
.lgpd-table-wrap { overflow-x: auto; }
.lgpd-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.82rem;
}
.lgpd-table th {
  text-align: left;
  padding: 9px 14px;
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.4px;
  color: var(--text3);
  background: var(--bg3);
  border-bottom: 1px solid var(--border);
  white-space: nowrap;
}
.lgpd-table td {
  padding: 9px 14px;
  border-bottom: 1px solid var(--border);
  color: var(--text2);
  vertical-align: middle;
}
.lgpd-table tr:last-child td { border-bottom: none; }
.lgpd-table tr:hover td { background: var(--bg3); }
.lgpd-td-id { color: var(--text3); font-size: 0.75rem; }
.lgpd-td-actions { display: flex; gap: 5px; flex-wrap: wrap; }
.lgpd-empty {
  text-align: center;
  padding: 24px;
  color: var(--text3);
  font-size: 0.81rem;
}
.lgpd-empty--ok { color: #16a34a; }

/* Botões de ação LGPD */
.lgpd-btn {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 4px 9px; border-radius: 6px; border: 1px solid;
  font-size: 0.73rem; font-weight: 600; cursor: pointer;
  transition: background 0.12s;
  white-space: nowrap;
}
.lgpd-btn--reg {
  background: rgba(58,111,216,.08); color: var(--accent);
  border-color: rgba(58,111,216,.25);
}
.lgpd-btn--reg:hover { background: rgba(58,111,216,.16); }
.lgpd-btn--exp {
  background: rgba(22,163,74,.08); color: #16a34a;
  border-color: rgba(22,163,74,.25);
}
.lgpd-btn--exp:hover { background: rgba(22,163,74,.15); }
.lgpd-btn--anon {
  background: rgba(220,38,38,.07); color: #dc2626;
  border-color: rgba(220,38,38,.22);
}
.lgpd-btn--anon:hover { background: rgba(220,38,38,.14); }

/* Anonimizados list */
.lgpd-anon-list { padding: 10px 14px; display: flex; flex-direction: column; gap: 6px; }
.lgpd-anon-item {
  display: flex; align-items: center; gap: 8px;
  font-size: 0.8rem; color: var(--text2);
  padding: 6px 10px;
  background: var(--bg3);
  border-radius: 7px;
}
.lgpd-anon-item svg { color: #6b7280; flex-shrink: 0; }
.lgpd-anon-date { margin-left: auto; color: var(--text3); font-size: 0.72rem; }

/* Row badge in leads table */
.lgpd-row-badge {
  display: inline-flex; align-items: center; justify-content: center;
  width: 16px; height: 16px; border-radius: 50%;
  font-size: 0.6rem; font-weight: 700; line-height: 1;
  margin-left: 4px; vertical-align: middle; flex-shrink: 0;
}
.lgpd-row-badge--ok   { background: rgba(22,163,74,.15); color: #16a34a; }
.lgpd-row-badge--pend { background: rgba(220,38,38,.12); color: #dc2626; }
.lgpd-row-badge--anon { background: rgba(107,114,128,.15); color: #6b7280; font-size: 0.7rem; }

/* ─── Consent block in modal ─────────────────────────────────── */
.lgpd-consent-block {
  margin: 16px 0 0;
  border: 1px solid rgba(22,163,74,.3);
  border-radius: 10px;
  background: rgba(22,163,74,.04);
  overflow: hidden;
}
.lgpd-consent-header {
  display: flex; align-items: center; gap: 7px;
  padding: 9px 14px;
  background: rgba(22,163,74,.09);
  font-size: 0.78rem;
  font-weight: 700;
  color: #16a34a;
  border-bottom: 1px solid rgba(22,163,74,.15);
}
.lgpd-consent-row { padding: 12px 14px; }
.lgpd-toggle-label {
  display: flex; align-items: center; gap: 10px;
  cursor: pointer; font-size: 0.82rem; color: var(--text1);
  user-select: none;
}
.lgpd-checkbox { display: none; }
.lgpd-toggle-track {
  width: 36px; height: 20px; border-radius: 20px;
  background: var(--border); border: 1px solid var(--border);
  position: relative; transition: background 0.2s;
  flex-shrink: 0;
}
.lgpd-checkbox:checked ~ .lgpd-toggle-track { background: #16a34a; border-color: #16a34a; }
.lgpd-toggle-knob {
  position: absolute; top: 2px; left: 2px;
  width: 14px; height: 14px; border-radius: 50%;
  background: #fff; transition: left 0.2s;
}
.lgpd-checkbox:checked ~ .lgpd-toggle-track .lgpd-toggle-knob { left: 18px; }
.lgpd-consent-details {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  padding: 0 14px 12px;
}
.lgpd-consent-note {
  grid-column: 1 / -1;
  font-size: 0.72rem;
  color: var(--text3);
  line-height: 1.5;
  padding: 7px 10px;
  background: rgba(22,163,74,.06);
  border-radius: 6px;
  border-left: 3px solid rgba(22,163,74,.4);
}

/* ── AGENDA PAGE CALENDAR ───────────────────────────────────── */
.agenda-page-cal-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 18px 20px;
  margin-bottom: 20px;
  box-shadow: var(--glow);
}
.agenda-page-cal-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
}
.agenda-page-cal-btn {
  background: var(--bg3);
  border: 1px solid var(--border);
  border-radius: 7px;
  color: var(--text2);
  width: 32px; height: 32px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  transition: background 0.12s, border-color 0.12s, color 0.12s;
}
.agenda-page-cal-btn:hover {
  background: var(--royal-pale);
  border-color: var(--royal-light);
  color: var(--royal-light);
}
.agenda-page-cal-title {
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--text);
  letter-spacing: 0.2px;
}
.agenda-page-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 4px;
}
.agenda-page-dow {
  text-align: center;
  font-size: 0.6rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--text3);
  padding: 2px 0 8px;
}
.agenda-page-cell {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 7px 2px 5px;
  border-radius: 8px;
  font-size: 0.82rem;
  font-weight: 400;
  color: var(--text2);
  border: 1px solid transparent;
  background: none;
  cursor: pointer;
  transition: background 0.12s, border-color 0.12s, color 0.12s;
  font-family: 'Inter', sans-serif;
  min-height: 46px;
  gap: 4px;
}
.agenda-page-cell:hover:not(.agenda-page-cell--empty) {
  background: var(--bg2);
  border-color: var(--border);
}
.agenda-page-cell--empty {
  cursor: default;
  pointer-events: none;
}
.agenda-page-cell--today {
  border-color: var(--royal-light);
  color: var(--royal-light);
  font-weight: 700;
}
.agenda-page-cell--selected {
  background: var(--royal-light) !important;
  border-color: var(--royal-light) !important;
  color: #fff !important;
}
.agenda-page-cell--selected .agenda-page-dot,
.agenda-page-cell--selected .agenda-page-dot--future,
.agenda-page-cell--selected .agenda-page-dot--programada { background: rgba(255,255,255,0.85) !important; }
.agenda-page-dots {
  display: flex; gap: 3px; align-items: center;
}
.agenda-page-dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--royal-light); flex-shrink: 0;
}
.agenda-page-dot--future    { background: var(--s-future); }
.agenda-page-dot--programada { background: var(--s-programada); }
.agenda-page-dot--more { background: var(--text3); }

/* Selected-day panel */
.agenda-page-day-panel {
  background: var(--card);
  border: 1px solid var(--royal-light);
  border-radius: 12px;
  padding: 16px 18px;
  margin-bottom: 20px;
}
.agenda-page-day-header {
  display: flex; align-items: center; gap: 8px;
  font-size: 0.9rem; font-weight: 700; color: var(--royal-light);
  margin-bottom: 12px; padding-bottom: 10px;
  border-bottom: 1px solid var(--border);
}
.agenda-page-day-item {
  display: flex; align-items: center; gap: 12px;
  padding: 10px 0; border-bottom: 1px solid var(--border);
}
.agenda-page-day-item:last-child { border-bottom: none; }
.agenda-page-day-time {
  font-size: 0.88rem; font-weight: 700; color: var(--text);
  min-width: 40px; flex-shrink: 0;
  font-variant-numeric: tabular-nums;
}
.agenda-page-day-info { flex: 1; min-width: 0; }
.agenda-page-day-nome {
  font-size: 0.88rem; font-weight: 600; color: var(--text1);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.agenda-page-day-meta {
  display: flex; align-items: center; gap: 8px; margin-top: 4px; flex-wrap: wrap;
}
.agenda-page-day-tel { font-size: 0.74rem; color: var(--text3); }
.agenda-page-day-ficha-btn {
  width: 30px; height: 30px; border-radius: 7px;
  background: var(--bg3); border: 1px solid var(--border);
  color: var(--text2); display: flex; align-items: center; justify-content: center;
  cursor: pointer; flex-shrink: 0;
  transition: background 0.12s, border-color 0.12s, color 0.12s;
}
.agenda-page-day-ficha-btn:hover {
  background: var(--royal-pale);
  border-color: var(--royal-light);
  color: var(--royal-light);
}
.agenda-page-day-empty {
  text-align: center; color: var(--text3); font-size: 0.82rem; padding: 18px 0 6px;
}

/* ══════════════════════════════════════════════════════════════
   CANCELADOS — página, régua, cards, insights, modal
══════════════════════════════════════════════════════════════ */

/* Botão "Registrar Cancelamento" na aba Implantados */
.btn-cancel-reg {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 14px;
  font-size: 0.78rem; font-weight: 700;
  background: rgba(192,57,43,.10);
  color: #c0392b;
  border: 1px solid rgba(192,57,43,.30);
  border-radius: 7px;
  cursor: pointer;
  transition: background .15s, border-color .15s, transform 0.1s ease;
  flex-shrink: 0;
}
.btn-cancel-reg:hover {
  background: rgba(192,57,43,.18);
  border-color: rgba(192,57,43,.55);
}
.btn-cancel-reg:active { transform: scale(0.96); }

/* ── RÉGUA DE PERMANÊNCIA ── */
.can-regua-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 18px 20px;
  margin-bottom: 22px;
  box-shadow: var(--glow);
}
.can-regua-title {
  font-size: 0.72rem; font-weight: 700; letter-spacing: .8px;
  text-transform: uppercase; color: var(--text3);
  margin-bottom: 14px;
}
.can-regua-bar-wrap {
  display: flex;
  align-items: stretch;
  height: 40px;
  border-radius: 10px;
  overflow: hidden;
  width: 100%;
  background: var(--bg3);
  box-shadow: inset 0 2px 5px rgba(0,0,0,.12), inset 0 -1px 2px rgba(0,0,0,.08);
}
.can-regua-seg {
  display: flex; align-items: center; justify-content: center;
  transition: flex .5s cubic-bezier(.22,1,.36,1);
  min-width: 2px;
  overflow: hidden;
}
.can-regua-seg--risco {
  background: linear-gradient(90deg, #7f1d1d 0%, #dc2626 65%, #f87171 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14), inset 0 -1px 0 rgba(0,0,0,.18);
}
.can-regua-seg--saudavel {
  background: linear-gradient(90deg, #14532d 0%, #16a34a 55%, #4ade80 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14), inset 0 -1px 0 rgba(0,0,0,.18);
}
.can-regua-divisor {
  position: relative;
  width: 2px;
  background: rgba(255,255,255,.35);
  flex-shrink: 0;
  overflow: visible;
  z-index: 2;
}
.can-regua-div-chip {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 0.6rem;
  font-weight: 800;
  letter-spacing: .03em;
  color: var(--text);
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 2px 6px;
  white-space: nowrap;
  pointer-events: none;
  box-shadow: 0 1px 3px rgba(0,0,0,.12);
}
.can-regua-stats {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 10px;
  flex-wrap: wrap;
  gap: 8px;
}
.can-regua-stat {
  display: flex;
  align-items: center;
  gap: 7px;
}
.can-regua-dot {
  width: 9px; height: 9px; border-radius: 50%; flex-shrink: 0;
}
.can-regua-dot--risco    { background: #dc2626; }
.can-regua-dot--saudavel { background: #16a34a; }
.can-regua-stat-pct {
  font-size: 1.05rem;
  font-weight: 800;
  letter-spacing: -.02em;
  line-height: 1;
}
.can-regua-stat-pct--risco    { color: #dc2626; }
.can-regua-stat-pct--saudavel { color: #16a34a; }
.can-regua-stat-label {
  font-size: 0.75rem;
  color: var(--text3);
  font-weight: 500;
}

/* ── CHARTS GRID ── */
.can-charts-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr));
  gap: 14px;
  margin-bottom: 22px;
}
.can-charts-grid > * { min-width: 0; }
.can-charts-grid .chart-card { padding: 14px 16px; }
.can-chart-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 16px 18px;
  box-shadow: var(--glow);
}
.can-chart-title {
  font-size: 0.72rem; font-weight: 700; letter-spacing: .8px;
  text-transform: uppercase; color: var(--text3);
  margin-bottom: 12px;
}
.can-chart-canvas-wrap {
  position: relative; height: 200px;
}

/* ── INSIGHTS ── */
.can-insights-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 18px 20px;
  margin-bottom: 22px;
  box-shadow: var(--glow);
}
.can-insights-title {
  font-size: 0.72rem; font-weight: 700; letter-spacing: .8px;
  text-transform: uppercase; color: var(--text3);
  margin-bottom: 14px;
}
.can-insights-list {
  display: flex; flex-direction: column; gap: 8px;
}
.can-insight {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 10px 14px;
  border-radius: 8px;
  font-size: 0.82rem;
  line-height: 1.4;
  color: var(--text2);
  background: var(--bg3);
  border: 1px solid var(--border);
}
.can-insight--warn {
  background: rgba(230,126,34,.07);
  border-color: rgba(230,126,34,.3);
  color: #b94e08;
}
.can-insight--crit {
  background: rgba(192,57,43,.07);
  border-color: rgba(192,57,43,.3);
  color: #922b21;
}
.can-insight-icon { flex-shrink: 0; margin-top: 1px; }

/* ── LISTA DE CANCELAMENTOS ── */
.can-history-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  box-shadow: var(--glow);
  padding: 18px 20px;
  margin-top: 20px;
}
.can-list-header {
  display: flex; align-items: center; justify-content: space-between;
  gap: 10px; margin-bottom: 14px; flex-wrap: wrap;
}
.can-list-title {
  font-size: 0.72rem; font-weight: 700; letter-spacing: .8px;
  text-transform: uppercase; color: var(--text3);
}
.can-list-header .impl-search { max-width: 240px; }

.can-item {
  display: flex; align-items: flex-start; gap: 12px;
  background: var(--card);
  border: 1px solid var(--border);
  position: relative;
  overflow: hidden;
  border-radius: var(--r-md);
  padding: 14px 16px;
  margin-bottom: 10px;
  box-shadow: var(--glow);
  transition: transform var(--transition-lift), box-shadow var(--transition-lift), border-color .15s;
  --accent: var(--border);
}
.can-item::before {
  content: '';
  position: absolute;
  top: 0; bottom: 0; left: 0;
  width: 3px;
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--accent) 75%, black),
    var(--accent),
    color-mix(in srgb, var(--accent) 55%, white));
}
.can-item:hover { transform: translateY(-2px); box-shadow: var(--glow-hover); }
.can-item--risco {
  --accent: #c0392b;
  background: rgba(192,57,43,.03);
}
.can-item--saudavel {
  --accent: #27ae60;
}
.can-item-avatar {
  width: 38px; height: 38px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: 0.78rem; color: #fff;
  letter-spacing: 0.5px; flex-shrink: 0;
}
.can-item-body {
  flex: 1; min-width: 0;
}
.can-item-top {
  display: flex; align-items: flex-start;
  justify-content: space-between; gap: 14px;
}
.can-item-info {
  flex: 1; min-width: 0;
}
.can-item-nome {
  font-size: 0.92rem; font-weight: 700; color: var(--text1);
  line-height: 1.3;
}
.can-item-tags {
  display: flex; flex-wrap: wrap; gap: 6px;
  margin-top: 7px;
}
.can-tag {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 0.73rem; color: var(--text3);
  background: var(--bg3); border: 1px solid var(--border);
  border-radius: var(--r-xs); padding: 3px 8px;
  white-space: nowrap;
}
.can-tag svg { flex-shrink: 0; opacity: .65; }
.can-tag--valor {
  font-weight: 700; color: #1e8449;
  background: rgba(30,132,73,.1); border-color: rgba(30,132,73,.25);
}
.can-item-right {
  display: flex; flex-direction: column; align-items: flex-end;
  gap: 6px; flex-shrink: 0;
}
.can-item-right-top {
  display: flex; align-items: center; gap: 8px;
}
.can-item-badge {
  font-size: 0.65rem; font-weight: 700; letter-spacing: .3px;
  padding: 2px 8px; border-radius: var(--r-pill); border: 1px solid;
  white-space: nowrap;
  position: relative;
}
.can-badge--risco {
  background: rgba(192,57,43,.1); color: #c0392b;
  border-color: rgba(192,57,43,.3);
  padding-left: 16px;
}
.can-badge--risco::before {
  content: '';
  position: absolute; left: 7px; top: 50%; transform: translateY(-50%);
  width: 5px; height: 5px; border-radius: 50%; background: #c0392b;
  animation: canRiscoPulse 1.8s ease-out infinite;
}
@keyframes canRiscoPulse {
  0%   { box-shadow: 0 0 0 0 rgba(192,57,43,.55); }
  70%  { box-shadow: 0 0 0 6px rgba(192,57,43,0); }
  100% { box-shadow: 0 0 0 0 rgba(192,57,43,0); }
}
.can-badge--ok {
  background: rgba(39,174,96,.1); color: #1e8449;
  border-color: rgba(39,174,96,.3);
}
.can-item-meses {
  font-size: 0.73rem; font-weight: 600; color: var(--text3);
}
.can-item-obs {
  font-size: 0.75rem; color: var(--text3);
  padding-top: 8px; margin-top: 10px;
  border-top: 1px solid var(--border);
  font-style: italic;
  line-height: 1.4;
}

/* ── MODAL CÁLCULO ── */
.can-modal-calc {
  background: var(--bg3);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 12px 16px;
  margin-bottom: 14px;
}
.can-calc-item {
  display: flex; justify-content: space-between; align-items: center;
  font-size: 0.8rem; padding: 3px 0;
}
.can-calc-label { color: var(--text3); }
.can-calc-val   { font-weight: 700; color: var(--text); }
.can-calc-val--risco    { color: #c0392b; }
.can-calc-val--saudavel { color: #27ae60; }
[data-theme="dark"] .can-calc-val--risco    { color: #f87171; }
[data-theme="dark"] .can-calc-val--saudavel { color: #34d399; }

/* ══════════════════════════════════════════════════════════════
   SINISTROS — página, painel lateral, chat
══════════════════════════════════════════════════════════════ */

/* KPI grid */
.sin-kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px,1fr));
  gap: 12px;
  margin-bottom: 20px;
}
.sin-kpi-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 14px 16px;
  display: flex; align-items: center; gap: 12px;
  position: relative;
  overflow: hidden;
  box-shadow: var(--glow-strong);
  transition: transform var(--transition-lift), box-shadow var(--transition-lift);
}
.sin-kpi-card:hover { transform: translateY(-2px); box-shadow: var(--glow-strong-hover); }
.sin-kpi-icon {
  width: 36px; height: 36px; border-radius: 9px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.sin-kpi-label {
  font-size: 0.68rem; font-weight: 600; letter-spacing: .3px;
  text-transform: uppercase; color: var(--text3);
}
.sin-kpi-val {
  font-size: 1.55rem; font-weight: 800; color: var(--text);
  line-height: 1.1; margin-top: 2px;
}

/* Filtros */
.sin-filters {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  margin-bottom: 16px;
}
.sin-search {
  background: var(--bg2); border: 1px solid var(--border);
  border-radius: 7px; padding: 7px 12px;
  font-size: 0.82rem; color: var(--text); outline: none;
  flex: 1; min-width: 160px;
  transition: border-color .15s;
}
.sin-search:focus { border-color: var(--royal-light); }
.sin-filter-sel {
  background: var(--bg2); border: 1px solid var(--border);
  border-radius: 7px; padding: 7px 10px;
  font-size: 0.8rem; color: var(--text); outline: none;
  cursor: pointer;
}

/* Cards da lista */
.sin-card {
  display: flex; align-items: center;
  background: var(--card);
  border: 1px solid var(--border);
  position: relative;
  border-radius: var(--r-md);
  padding: 0;
  margin-bottom: 10px;
  cursor: pointer;
  box-shadow: var(--glow);
  transition: box-shadow var(--transition-lift), border-color .15s, transform var(--transition-lift);
  overflow: hidden;
}
.sin-card::before {
  content: '';
  position: absolute;
  top: 0; bottom: 0; left: 0;
  width: 3px;
  background: linear-gradient(180deg, #1a3c8f, #3498db, #a8d3f5);
}
.sin-card:hover {
  box-shadow: var(--glow-hover);
  transform: translateY(-2px);
  border-color: rgba(52,152,219,.5);
}
.sin-card-body { flex: 1; padding: 14px 16px; }
.sin-card-arrow {
  font-size: 1.4rem; color: var(--text3);
  padding: 0 14px; flex-shrink: 0; user-select: none;
}
.sin-card-top {
  display: flex; align-items: flex-start;
  justify-content: space-between; gap: 10px;
}
.sin-card-nome {
  font-size: 0.92rem; font-weight: 700; color: var(--text);
}
.sin-card-meta {
  display: flex; align-items: center; gap: 7px; flex-wrap: wrap;
  margin-top: 5px;
}
.sin-badge {
  font-size: 0.65rem; font-weight: 700; letter-spacing: .3px;
  padding: 2px 8px; border-radius: 10px; border: 1px solid;
  white-space: nowrap;
}
.sin-tipo-tag {
  font-size: 0.68rem; color: var(--text3);
  background: var(--bg3); border-radius: 5px;
  padding: 2px 7px; border: 1px solid var(--border);
}
.sin-card-date { font-size: 0.7rem; color: var(--text3); }
.sin-card-aside {
  display: flex; flex-direction: column; align-items: flex-end; gap: 4px; flex-shrink: 0;
}
.sin-card-resp  { font-size: 0.7rem; color: var(--text3); }
.sin-card-valor { font-size: 0.75rem; font-weight: 700; color: var(--text2); }
.sin-comments-tag {
  font-size: 0.68rem; color: var(--text3);
}
.sin-card-motivo {
  font-size: 0.78rem; color: var(--text2); margin-top: 7px;
  line-height: 1.4;
}

/* Feedback badges inline */
.sin-fb { font-size: 0.68rem; font-weight: 700; padding: 2px 7px; border-radius: 10px; }
.sin-fb--pos { background: rgba(39,174,96,.1);  color: #1e8449; }
.sin-fb--neg { background: rgba(192,57,43,.1);  color: #c0392b; }
[data-theme="dark"] .sin-fb--pos { color: #34d399; }
[data-theme="dark"] .sin-fb--neg { color: #f87171; }
.sin-fb--neu { background: rgba(127,140,141,.1); color: #7f8c8d; }

/* Empty state */
.sin-empty {
  text-align: center; color: var(--text3);
  font-size: 0.88rem; padding: 60px 20px; line-height: 1.7;
}

/* ── PAINEL LATERAL ── */
.sin-overlay {
  position: fixed; inset: 0;
  background: rgba(0,0,0,.45); z-index: 9100;
  opacity: 0; pointer-events: none;
  transition: opacity .25s;
}
.sin-overlay.show { opacity: 1; pointer-events: all; }

.sin-panel {
  position: fixed; top: 0; right: 0; bottom: 0;
  width: min(460px, 100vw);
  background: var(--bg2); border-left: 1px solid var(--border);
  box-shadow: -8px 0 32px rgba(0,0,0,.18);
  z-index: 9101; display: flex; flex-direction: column;
  transform: translateX(100%);
  transition: transform .28s cubic-bezier(.4,0,.2,1);
  overflow: hidden;
}
.sin-panel.open { transform: translateX(0); }

.sin-panel-header {
  display: flex; align-items: flex-start; justify-content: space-between;
  padding: 18px 20px 14px; border-bottom: 1px solid var(--border); flex-shrink: 0;
  gap: 10px;
}
.sin-panel-nome {
  font-size: 1rem; font-weight: 700; color: var(--text);
}
.sin-panel-tipo {
  font-size: 0.75rem; color: var(--text3); margin-top: 3px;
}
.sin-panel-close {
  background: var(--bg3); border: 1px solid var(--border);
  border-radius: 7px; width: 32px; height: 32px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; flex-shrink: 0; color: var(--text2);
  transition: background .12s, color .12s;
}
.sin-panel-close:hover { background: var(--bg4, var(--bg3)); color: var(--text); }

/* Status stepper */
.sin-panel-status-bar {
  display: flex; gap: 6px; padding: 12px 20px; flex-shrink: 0;
  border-bottom: 1px solid var(--border); flex-wrap: wrap;
}
.sin-step {
  flex: 1; min-width: 80px;
  padding: 6px 8px; border-radius: 7px;
  border: 1.5px solid var(--border);
  background: var(--bg3); color: var(--text3);
  font-size: 0.72rem; font-weight: 600;
  cursor: pointer; text-align: center;
  transition: border-color .15s, background .15s, color .15s;
  font-family: inherit;
}
.sin-step:hover { border-color: var(--royal-light); color: var(--royal-light); background: var(--royal-pale); }
.sin-step--active { font-weight: 700; }

/* Sections inside panel */
.sin-panel-section {
  padding: 14px 20px; border-bottom: 1px solid var(--border); flex-shrink: 0;
}
.sin-panel-section-title {
  font-size: 0.65rem; font-weight: 700; letter-spacing: .8px;
  text-transform: uppercase; color: var(--text3); margin-bottom: 10px;
}
.sin-detail-row {
  display: flex; justify-content: space-between; align-items: center;
  font-size: 0.8rem; padding: 4px 0;
  border-bottom: 1px solid var(--border);
}
.sin-detail-row:last-child { border-bottom: none; }
.sin-detail-label { color: var(--text3); }
.sin-detail-val   { font-weight: 600; color: var(--text); text-align: right; }
.sin-panel-obs {
  font-size: 0.78rem; color: var(--text2); margin-top: 10px;
  padding: 8px 12px; background: var(--bg3); border-radius: 7px;
  border: 1px solid var(--border); line-height: 1.45; font-style: italic;
}
.sin-panel-motivo {
  font-size: 0.83rem; color: var(--text2); line-height: 1.5;
}
.sin-delete-btn {
  display: inline-flex; align-items: center; gap: 5px;
  margin-top: 12px; font-size: 0.72rem; color: var(--text3);
  background: none; border: 1px solid var(--border);
  border-radius: 6px; padding: 4px 10px; cursor: pointer;
  transition: color .12s, border-color .12s, background .12s;
}
.sin-delete-btn:hover {
  color: #c0392b; border-color: rgba(192,57,43,.4);
  background: rgba(192,57,43,.07);
}

/* ── CHAT ── */
.sin-chat {
  flex: 1; display: flex; flex-direction: column;
  overflow: hidden; border-bottom: none; padding: 0;
}
.sin-chat > .sin-panel-section-title {
  padding: 14px 20px 0; flex-shrink: 0;
}
.sin-chat-bubbles {
  flex: 1; overflow-y: auto;
  padding: 10px 20px 14px; display: flex; flex-direction: column; gap: 8px;
}
.sin-chat-empty, .sin-chat-loading {
  font-size: 0.8rem; color: var(--text3); text-align: center; padding: 20px 0;
}
.sin-bubble {
  background: var(--card); border: 1px solid var(--border);
  border-radius: 9px; padding: 9px 13px;
  animation: bubbleIn .18s ease;
}
.sin-bubble-header {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 5px;
}
.sin-bubble-autor { font-size: 0.72rem; font-weight: 700; color: var(--royal-light); }
.sin-bubble-time  { font-size: 0.68rem; color: var(--text3); }
.sin-bubble-text  { font-size: 0.82rem; color: var(--text2); line-height: 1.45; }

.sin-chat-input-wrap {
  display: flex; gap: 8px; padding: 10px 16px 14px; flex-shrink: 0;
  border-top: 1px solid var(--border); background: var(--bg2);
}
.sin-chat-input {
  flex: 1; background: var(--bg3); border: 1px solid var(--border);
  border-radius: 8px; padding: 8px 12px; resize: none;
  font-size: 0.82rem; color: var(--text); font-family: inherit;
  outline: none; transition: border-color .15s;
  line-height: 1.4;
}
.sin-chat-input:focus { border-color: var(--royal-light); }
.sin-chat-send {
  align-self: flex-end;
  background: var(--royal); color: #fff;
  border: none; border-radius: 8px;
  padding: 8px 16px; font-size: 0.82rem; font-weight: 700;
  cursor: pointer; white-space: nowrap;
  transition: opacity .15s;
  font-family: inherit;
}
.sin-chat-send:hover   { opacity: .87; }
.sin-chat-send:disabled{ opacity: .5; cursor: default; }

/* ── MODAL NOVO SINISTRO ── */
.sin-modal { max-width: 540px; width: 100%; }
.sin-modal-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.sin-modal-grid .full { grid-column: 1 / -1; }
.sin-modal-grid .form-group { margin-bottom: 0; }

/* ══════════════════════════════════════════════════════════════
   SAZONALIDADE — seção no Visão Geral
══════════════════════════════════════════════════════════════ */
.sazon-section {
  margin-bottom: 6px;
}
.sazon-section-header {
  display: flex; align-items: flex-start; gap: 10px;
  margin-bottom: 18px; padding-bottom: 12px;
  border-bottom: 1px solid var(--border);
}
.sazon-section-title {
  display: block;
  font-size: 0.75rem; font-weight: 800;
  text-transform: uppercase; letter-spacing: 1px;
  color: var(--text2);
}
.sazon-section-sub {
  font-size: 0.72rem; color: var(--text3);
  display: block; margin-top: 3px;
}
.sazon-chart-header {
  display: flex; align-items: flex-start;
  justify-content: space-between; gap: 10px; flex-wrap: wrap;
}
.sazon-chart-sub {
  font-size: 0.7rem; color: var(--text3);
  font-weight: 400; margin-top: 3px;
}
.sazon-peak-badge {
  font-size: 0.67rem; font-weight: 700;
  padding: 3px 10px; border-radius: 10px; white-space: nowrap;
  background: rgba(58,111,216,.1);
  color: var(--royal-light);
  border: 1px solid rgba(58,111,216,.25);
  flex-shrink: 0; align-self: flex-start; margin-top: 2px;
}
.sazon-peak-badge--green {
  background: rgba(39,174,96,.1);
  color: #1e8449;
  border-color: rgba(39,174,96,.25);
}
.sazon-insight-row {
  font-size: 0.76rem; color: var(--text2);
  padding: 10px 14px; margin-top: 10px;
  background: var(--bg3); border-radius: 8px;
  border: 1px solid var(--border);
  line-height: 1.5;
  display: flex; align-items: flex-start; gap: 6px;
  flex-wrap: wrap;
}
.sazon-insight-row:empty { display: none; }
.sazon-insight-icon { flex-shrink: 0; }

/* Urgency alerts section divider */
.agenda-urgency-header {
  display: flex; align-items: center; gap: 7px;
  font-size: 0.72rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.6px;
  color: var(--text3); padding-bottom: 14px;
  border-bottom: 1px solid var(--border); margin-bottom: 20px;
}



@media (max-width: 600px) {

  /* ── Modal as bottom sheet on mobile ── */
  .modal-overlay {
    align-items: flex-end;
    padding: 0;
  }
  .modal {
    width: 100%;
    max-width: 100%;
    border-radius: 18px 18px 0 0;
    max-height: 92dvh;
    padding: 20px 16px 28px;
    transform: translateY(100%);
  }
  .modal-overlay.show .modal {
    transform: translateY(0);
  }

  /* ── LGPD consent details: single column ── */
  .lgpd-consent-details {
    grid-template-columns: 1fr;
  }

  /* ── LGPD KPI grid: 2 columns ── */
  .lgpd-kpi-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 10px;
  }

  /* ── LGPD action buttons in table: stack vertically ── */
  .lgpd-td-actions {
    flex-direction: column;
    gap: 4px;
  }
  .lgpd-btn--anon,
  .lgpd-btn--exp,
  .lgpd-btn--reg {
    width: 100%;
    justify-content: center;
  }

  /* ── Production cards: 2 columns ── */
  .prod-cards-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  /* ── Equipe card footer: wrap so Histórico goes full width ── */
  .equipe-card-footer { flex-wrap: wrap; }
  .equipe-btn--hist   { flex: 1 0 100%; justify-content: center; }

  /* ── Equipe grid: already 1 col at 600px, keep it ── */
  .equipe-grid { grid-template-columns: 1fr !important; }

  /* ── Activity drawer: full width on mobile ── */
  .atv-drawer {
    width: 100vw;
    border-left: none;
    border-top: 1px solid var(--border);
  }

  /* ── Tables: ensure horizontal scroll on small screens ── */
  .table-wrap,
  .lgpd-table-wrap {
    -webkit-overflow-scrolling: touch;
  }

  /* ── Funnel bars ── */
  .funnel-step { padding: 10px 12px; }

  /* ── Table toolbar: stack vertically ── */
  .table-toolbar { flex-direction: column; align-items: flex-start; }
  .table-toolbar .btn { width: 100%; justify-content: center; }

  /* ── Reativação / followup cards ── */
  .followup-body {
    grid-template-columns: 1fr !important;
  }
  .reativ-card { padding: 14px; }
  .reativ-cards-grid { gap: 10px; }

  /* ── iOS/Android input zoom fix (font < 16px triggers auto-zoom) ── */
  input, select, textarea {
    font-size: 16px !important;
  }

  /* ── Topbar divider: not needed without page title ── */
  .topbar-divider { display: none; }

  /* ── Termômetro: pill menor no mobile, widget continua fixo no canto ── */
  .termo-pill {
    padding: 6px 12px 6px 10px;
    gap: 6px;
  }
  .termo-pill-bar-track { width: 44px; }
  .termo-pill-pct { min-width: 24px; font-size: 0.78rem; }
  /* Painel: mesma largura máxima em mobile */
  .termo-panel { width: min(248px, calc(100vw - 40px)); }
}

/* ── ORÇAMENTOS ─────────────────────────────────────────────────────────── */
#orcFormCard {
  scroll-margin-top: 76px; /* topbar 60px + 16px de respiro */
}

.orc-dado-card {
  background: var(--bg3);
  border: 1px solid var(--border);
  border-radius: var(--r-xs);
  padding: 10px 14px;
  min-width: 140px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.orc-dado-label {
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  color: var(--text3);
}
.orc-dado-val {
  font-size: 0.92rem;
  font-weight: 700;
  color: var(--text);
  letter-spacing: 0.3px;
}
.orc-copy-btn {
  background: none;
  border: 1px solid var(--border);
  border-radius: 4px;
  color: var(--text3);
  font-size: 0.65rem;
  padding: 2px 7px;
  cursor: pointer;
  align-self: flex-start;
  margin-top: 2px;
  transition: background 0.15s, color 0.15s;
}
.orc-copy-btn:hover { background: var(--royal-pale); color: var(--royal-light); border-color: var(--royal-light); }

.orc-coberturas-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 6px;
}
.orc-cobertura-item {
  display: flex;
  align-items: center;
  gap: 6px;
  background: var(--bg3);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 6px 10px;
  font-size: 0.78rem;
  color: var(--text2);
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s, color 0.15s;
}
.orc-cobertura-item input[type="checkbox"] { accent-color: var(--royal); width: 14px; height: 14px; }
.orc-cobertura-item:has(input:checked) {
  background: var(--royal-pale);
  border-color: var(--royal-light);
  color: var(--royal-light);
  font-weight: 600;
}

.orc-pill {
  display: inline-block;
  background: var(--royal-pale);
  color: var(--royal-light);
  border-radius: 3px;
  font-size: 0.62rem;
  font-weight: 700;
  padding: 2px 6px;
  margin: 1px;
  white-space: nowrap;
}

.orc-bradesco-btn:hover { background: #990000 !important; border-color: #990000 !important; }

/* ── RÉGUA DE RELACIONAMENTO PÓS-IMPLANTAÇÃO ─────────────────────────────── */
.regra-rel-section {
  background: var(--bg2);
  border: 1px solid var(--border);
  border-radius: 14px;
  margin-bottom: 20px;
  overflow: hidden;
}
.regra-rel-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 18px;
  cursor: pointer; user-select: none;
  transition: background .12s;
  gap: 12px;
}
.regra-rel-header:hover { background: var(--bg3); }
.regra-rel-title-area {
  display: flex; align-items: center; gap: 10px; min-width: 0;
}
.regra-rel-icon {
  width: 32px; height: 32px; flex-shrink: 0;
  background: linear-gradient(135deg, #1a3c8f, #3a6fd8);
  border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  color: #fff;
}
.regra-rel-title {
  font-size: .94rem; font-weight: 700; color: var(--text1); white-space: nowrap;
}
.regra-rel-subtitle {
  font-size: .73rem; color: var(--text3); margin-top: 1px;
}
.regra-rel-badge {
  background: #e74c3c; color: #fff;
  font-size: .7rem; font-weight: 700;
  border-radius: 99px; padding: 2px 8px;
  min-width: 20px; text-align: center; flex-shrink: 0;
}
.regra-rel-chevron {
  color: var(--text3); flex-shrink: 0;
  transition: transform .2s;
}
.regra-rel-section--collapsed .regra-rel-chevron { transform: rotate(-90deg); }
.regra-rel-section--collapsed .regra-rel-body    { display: none; }
.regra-rel-body { padding: 0 16px 16px; }
.regra-rel-list { }
.regra-rel-empty { color: var(--text3); font-size: .85rem; padding: 16px 4px; }

.regra-group { margin-bottom: 14px; }
.regra-group-label {
  font-size: .72rem; font-weight: 700; color: var(--text3);
  text-transform: uppercase; letter-spacing: .05em;
  margin: 10px 0 8px; padding: 0 2px;
}

.regra-card {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px;
  padding: 11px 14px;
  border-radius: var(--r-sm);
  background: var(--bg);
  border: 1px solid var(--border);
  position: relative;
  overflow: hidden;
  margin-bottom: 7px;
  transition: box-shadow .12s;
}
.regra-card::before {
  content: '';
  position: absolute;
  top: 0; bottom: 0; left: 0;
  width: 3px;
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--accent, transparent) 75%, black),
    var(--accent, transparent),
    color-mix(in srgb, var(--accent, transparent) 55%, white));
}
.regra-card:hover { box-shadow: 0 2px 8px rgba(0,0,0,.07); }
.regra-card-left {
  display: flex; align-items: center; gap: 11px; min-width: 0; flex: 1;
}
.regra-avatar {
  width: 36px; height: 36px; border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: .75rem; font-weight: 700; color: #fff;
}
.regra-card-info { min-width: 0; }
.regra-card-name {
  font-size: .88rem; font-weight: 600; color: var(--text1);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.regra-card-produto { font-size: .73rem; color: var(--text3); }
.regra-card-acao    { font-size: .79rem; color: var(--text2); margin-top: 2px; }
.regra-card-right {
  display: flex; flex-direction: column; align-items: flex-end;
  gap: 6px; flex-shrink: 0;
}
.regra-tipo-badge {
  font-size: .71rem; font-weight: 600;
  border: 1px solid transparent; border-radius: 99px;
  padding: 3px 10px; white-space: nowrap;
}
.regra-wa-btn {
  display: flex; align-items: center; gap: 5px;
  font-size: .76rem; font-weight: 600; color: #25D366;
  background: rgba(37,211,102,.1); border: 1px solid rgba(37,211,102,.3);
  border-radius: 8px; padding: 5px 11px;
  text-decoration: none; transition: background .12s;
  white-space: nowrap;
}
.regra-wa-btn:hover { background: rgba(37,211,102,.22); }

/* Bom Mês chips */
.regra-bom-mes-grid {
  display: flex; flex-wrap: wrap; gap: 7px;
}
.regra-bom-mes-chip {
  display: flex; align-items: center; gap: 7px;
  background: var(--bg); border: 1px solid var(--border);
  border-radius: 99px; padding: 4px 11px 4px 5px;
  transition: border-color .12s;
}
.regra-bom-mes-chip:hover { border-color: rgba(13,168,152,.4); }
.regra-bm-avatar {
  width: 24px; height: 24px; border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: .58rem; font-weight: 700; color: #fff;
}
.regra-bm-name { font-size: .78rem; font-weight: 500; color: var(--text1); }
.regra-bm-wa {
  color: #25D366; display: flex; align-items: center;
  text-decoration: none; opacity: .65; transition: opacity .12s; margin-left: 2px;
}
.regra-bm-wa:hover { opacity: 1; }

/* ── TERMÔMETRO DO MÊS ───────────────────────────────────────────────────── */
.termo-widget {
  position: fixed !important;
  bottom: 20px;
  right: 20px;
  z-index: 800;
  font-family: Inter, sans-serif;
}

/* Termômetro é só pra desktop — some no celular/tablet (a barra de progresso
   flutuante no canto atrapalha mais do que ajuda em tela pequena). */
@media (max-width: 768px) {
  .termo-widget { display: none !important; }
}

/* Pill — estado colapsado */
.termo-pill {
  display: flex; align-items: center; gap: 8px;
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 99px;
  padding: 8px 14px 8px 10px;
  cursor: pointer;
  box-shadow: 0 4px 18px rgba(0,0,0,.13);
  transition: box-shadow .15s, transform .22s cubic-bezier(.22,1,.36,1), opacity .22s cubic-bezier(.22,1,.36,1);
  user-select: none;
}
.termo-pill:hover { box-shadow: 0 6px 24px rgba(0,0,0,.2); transform: translateY(-2px); }
.termo-pill-icon { font-size: 1rem; line-height: 1; }
.termo-pill-bar-track {
  width: 68px; height: 6px;
  background: var(--bg3); border-radius: 99px; overflow: hidden;
}
.termo-pill-bar {
  height: 100%; border-radius: 99px; width: 0%;
  transition: width .5s cubic-bezier(.22,1,.36,1), background .3s;
}
.termo-pill-pct {
  font-size: .82rem; font-weight: 700; color: var(--text1);
  min-width: 30px; text-align: right;
}

/* Painel — flutua acima do pill */
.termo-panel {
  position: absolute;
  bottom: calc(100% + 10px);
  right: 0;
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 16px;
  box-shadow: 0 8px 32px rgba(0,0,0,.2);
  width: 248px;
  overflow: hidden;
  /* animação: sobe ao abrir, desce ao fechar */
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transform: translateY(10px) scale(0.96);
  transform-origin: bottom right;
  transition:
    opacity  .28s cubic-bezier(.22,1,.36,1),
    transform .32s cubic-bezier(.22,1,.36,1),
    visibility 0s linear .32s;
}
.termo-widget--expanded .termo-pill {
  opacity: 0;
  pointer-events: none;
  transform: translateY(5px) scale(0.93);
}
.termo-widget--expanded .termo-panel {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0) scale(1);
  transition:
    opacity  .28s cubic-bezier(.22,1,.36,1),
    transform .32s cubic-bezier(.22,1,.36,1),
    visibility 0s linear 0s;
}

.termo-panel-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 14px 10px;
  border-bottom: 1px solid var(--border);
  cursor: pointer; user-select: none;
}
.termo-panel-header:hover { background: var(--bg2); }
.termo-panel-title { font-size: .86rem; font-weight: 700; color: var(--text1); }
.termo-close-btn {
  background: none; border: none; cursor: pointer;
  color: var(--text3); font-size: .88rem; line-height: 1;
  padding: 2px 5px; border-radius: 4px; transition: background .1s;
}
.termo-close-btn:hover { background: var(--bg3); color: var(--text1); }

.termo-panel-body { padding: 14px; }
.termo-mes-label {
  font-size: .72rem; font-weight: 700; color: var(--text3);
  text-transform: uppercase; letter-spacing: .05em; margin-bottom: 10px;
}
.termo-sem-meta { font-size: .82rem; color: var(--text3); font-style: italic; margin-bottom: 12px; }

.termo-bar-wrap {
  height: 10px; background: var(--bg3); border-radius: 99px; overflow: hidden; margin-bottom: 6px;
}
.termo-bar-fill {
  height: 100%; border-radius: 99px;
  transition: width .5s cubic-bezier(.22,1,.36,1), background .3s;
}
.termo-pct-label { font-size: 1.4rem; font-weight: 800; margin-bottom: 12px; line-height: 1; }

.termo-stats {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 7px; margin-bottom: 12px;
}
.termo-stat {
  background: var(--bg2); border: 1px solid var(--border);
  border-radius: 9px; padding: 8px 10px;
}
.termo-stat-val {
  font-size: .83rem; font-weight: 700; color: var(--text1); line-height: 1.2;
}
.termo-stat-val--green { color: #27ae60; }
.termo-stat-val--red   { color: #e74c3c; }
[data-theme="dark"] .termo-stat-val--green { color: #34d399; }
[data-theme="dark"] .termo-stat-val--red   { color: #f87171; }
.termo-stat-lbl {
  font-size: .66rem; color: var(--text3); margin-top: 3px;
  text-transform: uppercase; letter-spacing: .04em;
}

.termo-actions { border-top: 1px solid var(--border); padding-top: 10px; }
.termo-meta-btn {
  display: flex; align-items: center; justify-content: center; gap: 6px;
  background: none; border: 1px solid var(--border); border-radius: 8px;
  padding: 7px 12px; cursor: pointer; font-size: .78rem;
  color: var(--text2); width: 100%; transition: background .12s;
  font-family: inherit;
}
.termo-meta-btn:hover { background: var(--bg2); color: var(--text1); border-color: var(--text3); }

/* ─── Dependentes & Beneficiários (modal + ficha) ──────────────── */
.dep-section {
  margin: 18px 0 10px;
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
}
.dep-section-hdr {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 9px 14px;
  background: var(--bg2);
  border-bottom: 1px solid var(--border);
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--text2);
  letter-spacing: 0.02em;
}
.dep-group {
  padding: 10px 14px 12px;
  border-bottom: 1px solid var(--border);
}
.dep-group:last-child { border-bottom: none; }
.dep-group-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--text3);
  margin-bottom: 9px;
}
.dep-add-btn {
  background: none;
  border: 1px solid var(--royal-light);
  color: var(--royal-light);
  border-radius: 5px;
  padding: 3px 10px;
  font-size: 0.72rem;
  font-weight: 600;
  cursor: pointer;
  transition: background .15s, color .15s;
  font-family: inherit;
}
.dep-add-btn:hover { background: var(--royal-light); color: #fff; }
.dep-rows { display: flex; flex-direction: column; gap: 6px; }
.dep-row {
  display: flex;
  gap: 5px;
  align-items: center;
}
.dep-inp {
  font-size: 0.78rem;
  padding: 5px 8px;
  border: 1px solid var(--border);
  border-radius: 5px;
  background: var(--bg);
  color: var(--text);
  font-family: inherit;
  min-width: 0;
}
.dep-inp-nome  { flex: 1; }
.dep-inp-nasc  { width: 90px; flex-shrink: 0; }
.dep-inp-pct   { width: 62px; flex-shrink: 0; padding-right: 18px; }
.dep-pct-wrap  { position: relative; display: inline-flex; flex-shrink: 0; }
.dep-pct-wrap::after {
  content: '%';
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 0.75rem;
  color: var(--text3);
  pointer-events: none;
}
.dep-pct-wrap input::-webkit-outer-spin-button,
.dep-pct-wrap input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.dep-pct-wrap input[type="number"] { -moz-appearance: textfield; }
.dep-sel {
  font-size: 0.78rem;
  padding: 5px 5px;
  border: 1px solid var(--border);
  border-radius: 5px;
  background: var(--bg);
  color: var(--text);
  flex-shrink: 0;
  font-family: inherit;
}
.dep-sel-parent { width: 112px; }
.dep-sel-sexo   { width: 58px;  }
.dep-del-btn {
  background: none;
  border: none;
  color: var(--text3);
  cursor: pointer;
  font-size: 1.1rem;
  line-height: 1;
  padding: 2px 5px;
  border-radius: 4px;
  flex-shrink: 0;
  transition: color .12s, background .12s;
}
.dep-del-btn:hover { color: #c0392b; background: rgba(192,57,43,.1); }
.dep-empty {
  font-size: 0.75rem;
  color: var(--text3);
  text-align: center;
  padding: 6px 0;
  font-style: italic;
}
.dep-pct-total {
  font-size: 0.76rem;
  text-align: right;
  margin-top: 6px;
  font-weight: 600;
}
/* Ficha dependentes display */
.ficha-dep-group { margin-bottom: 12px; }
.ficha-dep-group-title {
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--text3);
  margin-bottom: 8px;
}
.ficha-dep-list { display: flex; flex-direction: column; gap: 6px; }
.ficha-dep-row {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.8rem;
  padding: 6px 10px;
  background: var(--bg2);
  border-radius: 7px;
  border: 1px solid var(--border);
}
.ficha-dep-nome { font-weight: 600; color: var(--text); flex: 1; }
.ficha-dep-tag {
  font-size: 0.68rem;
  padding: 2px 7px;
  border-radius: 10px;
  background: var(--royal-pale);
  color: var(--royal-light);
  font-weight: 600;
}
.ficha-dep-pct {
  font-size: 0.75rem;
  color: var(--text2);
  font-weight: 600;
  margin-left: auto;
}

/* ─── Exportação Geral (aba Backups) ───────────────────────────── */
.expgeral-card {
  background: var(--bg2);
  border: 1.5px solid rgba(58,111,216,0.25);
  border-radius: var(--r-lg);
  padding: 22px 24px 18px;
  margin-bottom: 20px;
  position: relative;
  overflow: hidden;
  box-shadow: var(--glow);
}
.expgeral-card::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(58,111,216,0.05) 0%, transparent 60%);
  pointer-events: none;
}
.expgeral-header {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  margin-bottom: 14px;
}
.expgeral-icon {
  width: 44px;
  height: 44px;
  border-radius: 10px;
  background: var(--royal-pale);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--royal-light);
  flex-shrink: 0;
}
.expgeral-info { flex: 1; }
.expgeral-title {
  font-size: 0.98rem;
  font-weight: 700;
  color: var(--text);
  margin-bottom: 5px;
}
.expgeral-desc {
  font-size: 0.78rem;
  color: var(--text2);
  line-height: 1.55;
}
.expgeral-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 16px;
}
.expgeral-tag {
  font-size: 0.68rem;
  font-weight: 600;
  padding: 3px 10px;
  border-radius: 20px;
  background: var(--royal-pale);
  color: var(--royal-light);
  border: 1px solid rgba(58,111,216,0.2);
  letter-spacing: 0.02em;
}
.expgeral-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.expgeral-btn {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 20px;
  border-radius: 8px;
  border: none;
  font-size: 0.84rem;
  font-weight: 700;
  cursor: pointer;
  font-family: inherit;
  transition: transform 0.15s, box-shadow 0.15s, filter 0.15s;
  position: relative;
}
.expgeral-btn:hover { transform: translateY(-1px); box-shadow: 0 4px 14px rgba(0,0,0,0.18); }
.expgeral-btn:active { transform: translateY(1px) scale(0.97); box-shadow: 0 1px 4px rgba(0,0,0,0.15); }
.expgeral-btn:disabled { opacity: 0.6; cursor: not-allowed; transform: none; box-shadow: none; }
.expgeral-btn--excel {
  background: linear-gradient(135deg, #1e7e34 0%, #28a745 100%);
  color: #fff;
}
.expgeral-btn--json {
  background: linear-gradient(135deg, #1a3c8f 0%, #3a6fd8 100%);
  color: #fff;
}
.expgeral-btn--pdf {
  background: linear-gradient(135deg, #7b1e1e 0%, #c0392b 100%);
  color: #fff;
}
.expgeral-btn-sub {
  font-size: 0.68rem;
  font-weight: 400;
  opacity: 0.82;
  margin-left: 2px;
}

/* ── CHART EXPAND BUTTON (todos os gráficos) ── */
.chart-expand-btn {
  position: absolute;
  top: 13px;
  right: 13px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border: 1px solid var(--border);
  border-radius: 5px;
  background: var(--card);
  color: var(--text3);
  cursor: pointer;
  opacity: 0;
  transition: opacity 0.15s, background 0.15s, color 0.15s, border-color 0.15s, transform 0.1s ease;
  z-index: 3;
}

.chart-card:hover .chart-expand-btn {
  opacity: 1;
}

.chart-expand-btn:hover {
  background: var(--royal-light, rgba(26,60,143,0.08));
  color: var(--royal-mid, #2451b3);
  border-color: var(--royal-mid, #2451b3);
  opacity: 1;
}

/* ── CHART FULLSCREEN MODAL ── */
.chart-fs-overlay {
  display: flex;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.78);
  z-index: 2000;
  align-items: center;
  justify-content: center;
  padding: 24px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.22s ease;
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
}

.chart-fs-overlay.open {
  opacity: 1;
  pointer-events: auto;
}

.chart-fs-modal {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  box-shadow: var(--glow-hover), 0 32px 90px rgba(0, 0, 0, 0.55);
  width: calc(100vw - 48px);
  height: calc(100vh - 48px);
  max-width: 1400px;
  max-height: 900px;
  display: flex;
  flex-direction: column;
  opacity: 0;
  transition: opacity 0.2s ease;
  overflow: hidden;
}

.chart-fs-overlay.open .chart-fs-modal {
  opacity: 1;
}

.chart-fs-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 22px 14px;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}

.chart-fs-title {
  font-family: 'Inter', sans-serif;
  font-size: 0.8rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--text3);
}

.chart-fs-title strong { color: var(--text); }

.chart-fs-close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: transparent;
  color: var(--text3);
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}

.chart-fs-close:hover {
  background: rgba(192,57,43,0.1);
  color: #c0392b;
  border-color: #c0392b;
}

.chart-fs-body {
  flex: 1;
  min-height: 0;
  padding: 20px 22px 22px;
  position: relative;
  overflow: hidden;
}

.chart-fs-body canvas {
  display: block;
  width: 100% !important;
  height: 100% !important;
}

@media (max-width: 600px) {
  .chart-fs-overlay { padding: 12px; }
  .chart-fs-modal { width: calc(100vw - 24px); height: calc(100vh - 24px); border-radius: 10px; }
  .chart-fs-body { padding: 10px 12px 14px; }
}

/* ── TIMELINE: SELETOR DE PERÍODO ── */
.tl-period-nav {
  display: flex;
  gap: 4px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}

.tl-period-btn {
  font-family: 'Inter', sans-serif;
  font-size: 0.68rem;
  font-weight: 600;
  padding: 3px 10px;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: transparent;
  color: var(--text3);
  cursor: pointer;
  line-height: 1.6;
  transition: background 0.15s, color 0.15s, border-color 0.15s, transform 0.1s ease;
}
.tl-period-btn:active { transform: scale(0.96); }

.tl-period-btn.active {
  background: var(--royal-mid);
  border-color: var(--royal-mid);
  color: #fff;
}

.tl-period-btn:not(.active):hover {
  border-color: var(--royal-mid);
  color: var(--royal-mid);
}

.tl-custom-range {
  display: none;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}

.tl-custom-range.open { display: flex; }

.tl-range-label {
  font-family: 'Inter', sans-serif;
  font-size: 0.7rem;
  color: var(--text3);
  white-space: nowrap;
}

.tl-date-input {
  font-family: 'Inter', sans-serif;
  font-size: 0.72rem;
  padding: 3px 7px;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: var(--bg2, var(--bg));
  color: var(--text);
  cursor: pointer;
  transition: border-color 0.15s;
}

.tl-date-input:focus {
  outline: none;
  border-color: var(--royal-mid);
}

.tl-apply-btn {
  font-family: 'Inter', sans-serif;
  font-size: 0.7rem;
  font-weight: 600;
  padding: 3px 12px;
  border: 1px solid var(--royal-mid);
  border-radius: 4px;
  background: var(--royal-mid);
  color: #fff;
  cursor: pointer;
  transition: opacity 0.15s, transform 0.1s ease;
}
.tl-apply-btn:active { transform: scale(0.96); }

.tl-apply-btn:hover { opacity: 0.85; }

/* ── VENDA MODAL: PRODUTO / PACOTE CHIPS ── */
.produto-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 4px;
}

.produto-chip {
  font-family: 'Inter', sans-serif;
  font-size: 0.75rem;
  font-weight: 500;
  padding: 6px 14px;
  border: 1.5px solid var(--border);
  border-radius: var(--r-sm);
  background: transparent;
  color: var(--text2);
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 6px;
  transition: background 0.15s, border-color 0.15s, color 0.15s, box-shadow 0.15s, transform 0.1s ease;
  white-space: nowrap;
}
.produto-chip:active { transform: scale(0.96); }

.produto-chip:hover:not(.produto-chip--on) {
  border-color: var(--royal-mid);
  color: var(--royal-mid);
}

.produto-chip--on {
  background: var(--grad-brand);
  border-color: transparent;
  color: #fff;
  box-shadow: 0 4px 14px -6px rgba(36,81,179,.6);
}

/* Chip de pacote — maior por ter mais texto */
.pacote-chip {
  padding: 8px 14px;
  font-size: 0.72rem;
  flex: 1;
  min-width: 180px;
  justify-content: flex-start;
}

.pacote-badge {
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.5px;
  padding: 2px 6px;
  border-radius: 3px;
  text-transform: uppercase;
  flex-shrink: 0;
}

.pacote-basico   { background: rgba(26,60,143,0.15); color: var(--royal-mid); }
.pacote-completo { background: rgba(30,132,73,0.15); color: #1e8449; }

.produto-chip--on .pacote-basico   { background: rgba(255,255,255,0.25); color: #fff; }
.produto-chip--on .pacote-completo { background: rgba(255,255,255,0.25); color: #fff; }

/* ── VENDA MODAL: SEGURADORA CHIPS ── */
.seguradora-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 4px;
}

.seguradora-chip {
  font-family: 'Inter', sans-serif;
  font-size: 0.78rem;
  font-weight: 500;
  padding: 9px 18px;
  border: 1.5px solid var(--border);
  border-radius: 8px;
  background: transparent;
  color: var(--text2);
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 9px;
  transition: background 0.15s, border-color 0.15s, color 0.15s, transform 0.1s ease;
  flex: 1;
  min-width: 160px;
}
.seguradora-chip:active { transform: scale(0.96); }

.seg-logo {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  font-size: 0.68rem;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  letter-spacing: 0;
}

.seg-bradesco-logo  { background: rgba(204,9,47,0.15);  color: #cc092f; }
.seg-sulamerica-logo { background: rgba(0,89,176,0.15); color: #0059b0; }

.seg-chip-bradesco:hover:not(.seguradora-chip--on)  { border-color: #cc092f; color: #cc092f; }
.seg-chip-sulamerica:hover:not(.seguradora-chip--on) { border-color: #0059b0; color: #0059b0; }

.seg-chip-bradesco.seguradora-chip--on  {
  background: rgba(204,9,47,0.1);
  border-color: #cc092f;
  color: #cc092f;
  box-shadow: 0 4px 14px -8px rgba(204,9,47,.5);
}
.seg-chip-sulamerica.seguradora-chip--on {
  box-shadow: 0 4px 14px -8px rgba(0,89,176,.5);
  background: rgba(0,89,176,0.1);
  border-color: #0059b0;
  color: #0059b0;
}


/* ═══════════════════════════════════════════════════════════════
   MODO ESCURO — acentos coloridos em neon leve
   Gerado automaticamente a partir das cores fixas (light-mode) do
   arquivo — mesmo matiz, mais claro/saturado pra saltar sobre o fundo
   azul-marinho escuro em vez de aparecer apagado.
═══════════════════════════════════════════════════════════════ */
[data-theme="dark"] .expirada-check { color: #f0786b; }
[data-theme="dark"] .pill-closing { color: #fbb374; }
[data-theme="dark"] .origem-insta { color: #bd83ec; }
[data-theme="dark"] .origem-ind { color: #50c3fa; }
[data-theme="dark"] .origem-lp { color: #46f6b9; }
[data-theme="dark"] .doc-badge-cpf { color: #4a7bf3; }
[data-theme="dark"] .doc-badge-cnpj { color: #bd61e3; }
[data-theme="dark"] .prod-card--green .prod-card-icon { color: #62f598; }
[data-theme="dark"] .prod-badge--pago { color: #43f986; }
[data-theme="dark"] .prod-badge--pendente { color: #fa9242; }
[data-theme="dark"] .prod-badge--expirada { color: #f87777; }
[data-theme="dark"] .rank-medal--gold { color: #f87244; }
[data-theme="dark"] .rank-medal--silver { color: #5a8ee2; }
[data-theme="dark"] .rank-avatar--gold { color: #fbae55; }
[data-theme="dark"] .rank-avatar--silver { color: #78a6e7; }
[data-theme="dark"] .rank-avatar--bronze { color: #fa9242; }
[data-theme="dark"] .rank-progress-pct--hit { color: #62f598; }
[data-theme="dark"] .rank-falta--hit { color: #62f598; }
[data-theme="dark"] .tel-duplicate-warn svg { color: #fbcf51; }
[data-theme="dark"] .tel-dup-link { color: #fbcf51; }
[data-theme="dark"] .campanha-ativa-badge { color: #50ed92; }
[data-theme="dark"] .equipe-btn.danger:hover { color: #fb8074; }
[data-theme="dark"] .reativ-kpi.red .reativ-kpi-value { color: #f87777; }
[data-theme="dark"] .reativ-kpi.amber .reativ-kpi-value { color: #fbae55; }
[data-theme="dark"] .reativ-dias--red { color: #f87777; }
[data-theme="dark"] .reativ-dias--amber { color: #fbae55; }
[data-theme="dark"] .mrxia-history-del:hover { color: #f0786b; }
[data-theme="dark"] .mrxia-quick:hover { color: #4a7bf3; }
[data-theme="dark"] .mrxia-quick--primary { color: #4a7bf3; }
[data-theme="dark"] .mrxia-lc-clear:hover { color: #f0786b; }
[data-theme="dark"] .ficha-declinio-text { color: #f0786b; }
[data-theme="dark"] .ficha-venda-badge--pago { color: #50ed92; }
[data-theme="dark"] .ficha-venda-badge--expirada { color: #f0786b; }
[data-theme="dark"] .ficha-venda-badge--pendente { color: #e8c87b; }
[data-theme="dark"] .ficha-venda-valor { color: #50ed92; }
[data-theme="dark"] .ftl-del:hover { color: #f87777; }
[data-theme="dark"] .confirm-modal-icon { color: #f87777; }
[data-theme="dark"] .ind-kpi-val--green { color: #50ed92; }
[data-theme="dark"] .ind-grade--a { color: #50ed92; }
[data-theme="dark"] .ind-grade--b { color: #4fafed; }
[data-theme="dark"] .ind-grade--c { color: #fab542; }
[data-theme="dark"] .ind-grade--d { color: #fa8b42; }
[data-theme="dark"] .ind-grade--f { color: #ed5d4f; }
[data-theme="dark"] .ind-row--gold .ind-avatar { color: #fbae55; }
[data-theme="dark"] .ind-row--silver .ind-avatar { color: #78a6e7; }
[data-theme="dark"] .ind-row--bronze .ind-avatar { color: #fa9242; }
[data-theme="dark"] .ind-ativos-badge { color: #e8c87b; }
[data-theme="dark"] .ind-qual-card-icon--gold { color: #f0c04c; }
[data-theme="dark"] .ind-qual-card-icon--blue { color: #7ba4f4; }
[data-theme="dark"] .ind-qual-card-icon--purple { color: #aa79f6; }
[data-theme="dark"] .ind-qual-card-extra { color: #50ed92; }
[data-theme="dark"] .pgto-badge--pix { color: #42fad0; }
[data-theme="dark"] .forgot-sent-msg { color: #4defa2; }
[data-theme="dark"] .alert-cat-followup { color: #fbb374; }
[data-theme="dark"] .alert-cat-esfriando { color: #fbbd5b; }
[data-theme="dark"] .alert-cat-resultado { color: #f0786b; }
[data-theme="dark"] .resultado-ago { color: #f0786b; }
[data-theme="dark"] .resultado-btn--ok { color: #4def6e; }
[data-theme="dark"] .resultado-btn--no { color: #f0786b; }
[data-theme="dark"] .resultado-btn--re { color: #facf42; }
[data-theme="dark"] .resultado-btn--save { color: #4a7bf3; }
[data-theme="dark"] .dias-frio-badge--atencao { color: #fab542; }
[data-theme="dark"] .dias-frio-badge--alerta { color: #fa8b42; }
[data-theme="dark"] .dias-frio-badge--critico { color: #ed5d4f; }
[data-theme="dark"] .etapa-sel-item--done .etapa-sel-name { color: #43f986; }
[data-theme="dark"] .ficha-etapa-step--done .ficha-etapa-step-label { color: #43f986; }
[data-theme="dark"] .atv-exclusao-header { color: #f87777; }
[data-theme="dark"] .mini-nav-lgpd { color: #43f986; }
[data-theme="dark"] .lgpd-kpi--ok .lgpd-kpi-icon { color: #43f986; }
[data-theme="dark"] .lgpd-kpi--pend .lgpd-kpi-icon { color: #f87777; }
[data-theme="dark"] .lgpd-kpi--taxa .lgpd-kpi-icon { color: #a674fb; }
[data-theme="dark"] .lgpd-aviso svg { color: #43f986; }
[data-theme="dark"] .lgpd-section-title svg { color: #f87777; }
[data-theme="dark"] .vp-proj-month-val { color: #42fae7; }
[data-theme="dark"] .vp-proj-lead-item span:last-child { color: #42fae7; }
[data-theme="dark"] .impl-kpi-val--blue { color: #7ba4f4; }
[data-theme="dark"] .impl-kpi-val--green { color: #50ed92; }
[data-theme="dark"] .impl-kpi-val--red { color: #f0786b; }
[data-theme="dark"] .impl-kpi-val--orange { color: #fbb374; }
[data-theme="dark"] .impl-kpi-val--teal { color: #42fae7; }
[data-theme="dark"] .impl-valor-tag { color: #50ed92; }
[data-theme="dark"] .impl-status--adimpl { color: #50ed92; }
[data-theme="dark"] .impl-status--inadimpl { color: #f0786b; }
[data-theme="dark"] .impl-mc--pago .impl-mc-ico { color: #50ed92; }
[data-theme="dark"] .impl-mc--pendente .impl-mc-ico { color: #f0786b; }
[data-theme="dark"] .impl-mc--pendente .impl-mc-lbl { color: #f0786b; }
[data-theme="dark"] .impl-venc-badge { color: #fab542; }
[data-theme="dark"] .venc-chip-days { color: #fab542; }
[data-theme="dark"] .venc-chip--urgente .venc-chip-days { color: #f0786b; }
[data-theme="dark"] .venc-chip--critico .venc-chip-days { color: #fbb374; }
[data-theme="dark"] .lgpd-empty--ok { color: #43f986; }
[data-theme="dark"] .lgpd-btn--exp { color: #43f986; }
[data-theme="dark"] .lgpd-btn--anon { color: #f87777; }
[data-theme="dark"] .lgpd-row-badge--ok { color: #43f986; }
[data-theme="dark"] .lgpd-row-badge--pend { color: #f87777; }
[data-theme="dark"] .lgpd-consent-header { color: #43f986; }
[data-theme="dark"] .btn-cancel-reg { color: #f0786b; }
[data-theme="dark"] .can-regua-stat-pct--risco { color: #f87777; }
[data-theme="dark"] .can-regua-stat-pct--saudavel { color: #43f986; }
[data-theme="dark"] .can-insight--warn { color: #fa8b42; }
[data-theme="dark"] .can-insight--crit { color: #ed5d4f; }
[data-theme="dark"] .can-tag--valor { color: #50ed92; }
[data-theme="dark"] .can-badge--risco { color: #f0786b; }
[data-theme="dark"] .can-badge--ok { color: #50ed92; }
[data-theme="dark"] .can-calc-val--risco { color: #f0786b; }
[data-theme="dark"] .can-calc-val--saudavel { color: #57ee97; }
[data-theme="dark"] .sin-fb--pos { color: #50ed92; }
[data-theme="dark"] .sin-fb--neg { color: #f0786b; }
[data-theme="dark"] .sin-delete-btn:hover { color: #f0786b; }
[data-theme="dark"] .sazon-peak-badge--green { color: #50ed92; }
[data-theme="dark"] .termo-stat-val--green { color: #57ee97; }
[data-theme="dark"] .termo-stat-val--red { color: #fb8074; }
[data-theme="dark"] .dep-del-btn:hover { color: #f0786b; }
[data-theme="dark"] .chart-fs-close:hover { color: #f0786b; }
[data-theme="dark"] .pacote-completo { color: #50ed92; }
[data-theme="dark"] .etapa-fill--teal { color: #42fae7 !important; }
[data-theme="dark"] .etapa-fill--green { color: #43f986 !important; }
[data-theme="dark"] .impl-mc--venc-soon .impl-mc-lbl { color: #fab542 !important; }
[data-theme="dark"] .impl-mc--venc-soon .impl-mc-ico { color: #fab542 !important; }