/* crm-pro.css — YODFY CRM V138.1_COMMERCIAL_RELEASE_FIX_LOCK
   Paleta oficial: roxo #7C3AED → azul #2563EB
*/

:root{
  --bg0:#0a0a0f;
  --bg1:#12121a;
  --bg2:#0d0d16;
  --card:#12121a;
  --card2:#1a1a28;
  --stroke:#1e1e2e;
  --stroke2:rgba(124,58,237,.22);
  --txt:#ffffff;
  --muted:#94A3B8;
  --muted2:rgba(148,163,184,.60);
  --accent:#7C3AED;
  --accent2:#10B981;
  --accent3:#2563EB;
  --sophia-gradient:linear-gradient(135deg,#7C3AED,#2563EB);
  --yodfy-gradient:linear-gradient(135deg,#7C3AED,#2563EB);
  --danger:#EF4444;
  --warn:#F59E0B;
  --ok:#10B981;
  --shadow:0 18px 60px rgba(0,0,0,.55);
  --shadow2:0 10px 30px rgba(0,0,0,.40);
  --r12:12px;
  --r16:16px;
  --r20:20px;
  --r24:24px;
  --pad:24px;
  --pad2:18px;
  --gap:16px;
  --gap2:12px;
  --max:1200px;
  --font: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:var(--font);
  color:var(--txt);
  background:
    radial-gradient(1100px 700px at 12% 20%, rgba(124,58,237,.18) 0%, rgba(0,0,0,0) 60%),
    radial-gradient(900px 600px at 90% 18%, rgba(37,99,235,.12) 0%, rgba(0,0,0,0) 58%),
    radial-gradient(1200px 900px at 60% 120%, rgba(124,58,237,.08) 0%, rgba(0,0,0,0) 55%),
    linear-gradient(180deg, var(--bg0) 0%, var(--bg1) 55%, #06060f 100%);
}

a{color:inherit}
img{max-width:100%}
::selection{background:rgba(124,156,255,.28)}
/* scrollbar */
*::-webkit-scrollbar{height:10px;width:10px}
*::-webkit-scrollbar-thumb{background:rgba(255,255,255,.14);border-radius:12px}
*::-webkit-scrollbar-track{background:rgba(0,0,0,.22)}

.crm-container{
  max-width:var(--max);
  margin:0 auto;
  padding:28px 22px 34px;
}

/* ---------- HEADER ---------- */
.page-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  margin-bottom:18px;
}
.page-head h1{
  margin:0 0 6px;
  font-size:54px;
  letter-spacing:-.02em;
  line-height:1.05;
}
.page-head .sub{
  margin:0 0 10px;
  color:var(--muted);
  font-size:15px;
}
.page-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
  justify-content:flex-end;
}

/* chips */
.chips{display:flex;gap:10px;flex-wrap:wrap}
.chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.06);
  border:1px solid var(--stroke);
  color:var(--muted);
  font-size:13px;
  box-shadow:0 10px 28px rgba(0,0,0,.28);
  backdrop-filter: blur(10px);
}
.chip.ok{color:rgba(61,220,151,.95); border-color:rgba(61,220,151,.22); background:rgba(61,220,151,.08);}
.chip.warn{color:rgba(255,209,102,.95); border-color:rgba(255,209,102,.22); background:rgba(255,209,102,.07);}
.chip.bad{color:rgba(255,77,109,.95); border-color:rgba(255,77,109,.22); background:rgba(255,77,109,.07);}

/* ---------- BUTTONS ---------- */
.btn{
  appearance:none;
  border:1px solid rgba(255,255,255,.14);
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.04));
  color:var(--txt);
  padding:10px 14px;
  border-radius:14px;
  cursor:pointer;
  font-weight:600;
  font-size:14px;
  letter-spacing:.01em;
  text-decoration:none;
  box-shadow:0 12px 30px rgba(0,0,0,.35);
  transition: transform .12s ease, border-color .12s ease, background .12s ease, box-shadow .12s ease;
  backdrop-filter: blur(10px);
}
.btn:hover{transform: translateY(-1px); border-color:rgba(124,156,255,.28); box-shadow:0 18px 46px rgba(0,0,0,.45)}
.btn:active{transform: translateY(0px); box-shadow:0 10px 26px rgba(0,0,0,.35)}
.btn.primary{
  border-color:rgba(124,58,237,.45);
  background:var(--sophia-gradient);
  background:linear-gradient(135deg, rgba(124,58,237,.55), rgba(37,99,235,.45));
}
.btn.danger{
  border-color:rgba(255,77,109,.34);
  background:linear-gradient(135deg, rgba(255,77,109,.28), rgba(124,156,255,.12));
}
.btn.ghost{
  background:transparent;
  border-color:rgba(255,255,255,.12);
  box-shadow:none;
}
.btn.small{padding:8px 10px;border-radius:12px;font-size:13px}
.btn.wide{padding:12px 18px;border-radius:16px}

/* ---------- CARDS / SECTIONS ---------- */
.card{
  background:linear-gradient(180deg, rgba(16,27,54,.86), rgba(12,18,40,.80));
  border:1px solid rgba(255,255,255,.10);
  border-radius:var(--r24);
  padding:18px;
  box-shadow:var(--shadow2);
  backdrop-filter: blur(12px);
}
.card.soft{
  background:linear-gradient(180deg, rgba(16,27,54,.65), rgba(12,18,40,.55));
}
.card.highlight{
  padding:20px;
  border-color:rgba(124,156,255,.20);
  box-shadow: 0 20px 70px rgba(0,0,0,.55);
}
.card h2{
  margin:0 0 10px;
  font-size:22px;
  letter-spacing:-.01em;
}
.card h3{
  margin:0 0 8px;
  font-size:15px;
  color:var(--muted);
  font-weight:700;
}

/* big number */
.big-number{
  margin:6px 0 12px;
  font-size:42px;
  font-weight:900;
  letter-spacing:-.02em;
}

/* ---------- GRID ---------- */
.grid{display:grid;gap:12px}
.grid.kpis{grid-template-columns:repeat(6,1fr); margin:14px 0}
.grid.velocity{grid-template-columns:repeat(3,1fr); margin:12px 0 14px}

/* KPI card */
.kpi-card{
  background:linear-gradient(180deg, rgba(16,27,54,.70), rgba(12,18,40,.60));
  border:1px solid rgba(255,255,255,.10);
  border-radius:20px;
  padding:14px 14px;
  box-shadow:0 16px 44px rgba(0,0,0,.40);
  backdrop-filter: blur(12px);
  min-height:92px;
}
.kpi-card strong{
  display:block;
  font-size:30px;
  margin-top:6px;
  letter-spacing:-.02em;
}
.kpi-card .muted{color:var(--muted);font-size:13px}

/* ---------- ALERTS ---------- */
.alert-list{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
  margin-top:10px;
}
.alert-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:14px 16px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.10);
  background:linear-gradient(180deg, rgba(16,27,54,.70), rgba(12,18,40,.55));
  box-shadow:0 14px 40px rgba(0,0,0,.40);
}
.alert-item span{font-weight:900; font-size:18px;}
.alert-item.hot{border-color:rgba(255,77,109,.22)}
.alert-item.hot{color:#ffb3c1}
.alert-item.ok{border-color:rgba(61,220,151,.22); color:#bff7df}
.alert-item.warn{border-color:rgba(255,209,102,.22); color:#ffe3a6}

/* ---------- ACTIONS / FOOTER ---------- */
.actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  align-items:center;
  margin-top:14px;
}
.footer{
  margin-top:18px;
  padding:14px 4px 0;
  color:rgba(232,238,252,.45);
  font-size:13px;
}

/* ---------- FORMS ---------- */
input,select,textarea,button{font-family:inherit}
.field{
  display:flex;
  flex-direction:column;
  gap:6px;
}
label{
  color:var(--muted);
  font-size:13px;
  font-weight:700;
}
.input, input[type="text"], input[type="tel"], input[type="number"], input[type="date"], input[type="email"], input[type="password"], textarea, select{
  width:100%;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
  color:var(--txt);
  border-radius:14px;
  padding:11px 12px;
  outline:none;
  transition:border-color .12s ease, box-shadow .12s ease, transform .12s ease;
}
textarea{min-height:92px; resize:vertical}
input:focus, textarea:focus, select:focus{
  border-color:rgba(124,156,255,.38);
  box-shadow:0 0 0 4px rgba(124,156,255,.12);
}
input::placeholder, textarea::placeholder{color:rgba(232,238,252,.35)}
hr{
  border:none;
  border-top:1px solid rgba(255,255,255,.10);
  margin:14px 0;
}

/* ---------- TABLES ---------- */
.table{
  width:100%;
  border-collapse:separate;
  border-spacing:0 10px;
}
.table th{
  text-align:left;
  font-size:12px;
  color:var(--muted);
  font-weight:800;
  padding:0 10px 6px;
}
.table td{
  background:rgba(255,255,255,.05);
  border-top:1px solid rgba(255,255,255,.10);
  border-bottom:1px solid rgba(255,255,255,.10);
  padding:12px 10px;
}
.table td:first-child{
  border-left:1px solid rgba(255,255,255,.10);
  border-top-left-radius:14px;
  border-bottom-left-radius:14px;
}
.table td:last-child{
  border-right:1px solid rgba(255,255,255,.10);
  border-top-right-radius:14px;
  border-bottom-right-radius:14px;
}

/* ---------- BADGES / PILLS ---------- */
.badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
  color:var(--muted);
  font-size:12px;
  font-weight:800;
}
.badge.ok{border-color:rgba(61,220,151,.25);background:rgba(61,220,151,.08);color:#bff7df}
.badge.warn{border-color:rgba(255,209,102,.25);background:rgba(255,209,102,.08);color:#ffe3a6}
.badge.bad{border-color:rgba(255,77,109,.25);background:rgba(255,77,109,.08);color:#ffb3c1}

/* ---------- PROGRESS ---------- */
.progress-bar{
  width:100%;
  height:14px;
  background:rgba(255,255,255,.08);
  border-radius:999px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
}
.progress-fill{
  height:100%;
  width:0%;
  background:linear-gradient(90deg, rgba(61,220,151,.95), rgba(124,156,255,.95));
  transition:width .6s ease;
}

/* ---------- LOGIN (suporte) ---------- */
.center-screen{
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
}
.login-card{
  width:min(520px, 92vw);
  padding:22px;
  border-radius:26px;
  background:linear-gradient(180deg, rgba(16,27,54,.86), rgba(12,18,40,.78));
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 30px 90px rgba(0,0,0,.62);
}
.login-card h1{margin:0 0 6px;font-size:34px}
.login-card .sub{margin:0 0 14px;color:var(--muted)}

/* ---------- FUNIL (Kanban PRO) ---------- */
.kanban-wrap{
  margin-top:10px;
  padding:18px;
  border-radius:26px;
  background:linear-gradient(180deg, rgba(16,27,54,.70), rgba(12,18,40,.60));
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 30px 90px rgba(0,0,0,.55);
}
.kanban-top{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:14px;
  margin-bottom:14px;
}
.kanban-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.kanban-search{
  display:flex;
  flex-direction:column;
  gap:10px;
  align-items:flex-end;
}
.kanban-board{
  display:grid;
  grid-template-columns:repeat(4, minmax(260px, 1fr));
  gap:14px;
  align-items:start;
}
.kanban-col{
  border-radius:22px;
  background:linear-gradient(180deg, rgba(16,27,54,.62), rgba(12,18,40,.55));
  border:1px solid rgba(255,255,255,.10);
  padding:14px;
  min-height:220px;
  box-shadow:0 16px 44px rgba(0,0,0,.40);
}
.kanban-col-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:12px;
}
.kanban-col-title{
  display:flex;
  gap:10px;
  align-items:center;
  font-weight:900;
  letter-spacing:-.01em;
  font-size:18px;
}
.kanban-col-count{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:28px;
  height:26px;
  padding:0 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
  color:var(--muted);
  font-size:12px;
  font-weight:900;
}
.kanban-col-tag{
  font-size:11px;
  color:rgba(232,238,252,.55);
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.05);
  padding:6px 10px;
  border-radius:999px;
  font-weight:800;
}

/* cards */
.kcard{
  border-radius:20px;
  padding:14px;
  border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  box-shadow:0 18px 46px rgba(0,0,0,.45);
  margin-bottom:12px;
}
.kcard:hover{border-color:rgba(124,156,255,.22)}
.kcard-title{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  font-weight:950;
  font-size:17px;
  letter-spacing:-.01em;
}
.kcard-meta{
  margin-top:10px;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.kpill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.18);
  color:rgba(232,238,252,.72);
  font-size:12px;
  font-weight:800;
}
.kcard-actions{
  display:flex;
  gap:10px;
  margin-top:12px;
  justify-content:space-between;
}
.kcard-actions .btn{box-shadow:none}
.kcard-actions .btn.danger{border-color:rgba(255,77,109,.35)}

/* ---------- FINANCEIRO (suporte) ---------- */
.finance-grid{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:14px;
  margin-top:10px;
}
.mono{
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size:13px;
}

/* ---------- MODAL (genérico) ---------- */
.modal-backdrop{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.62);
  display:none;
  align-items:center;
  justify-content:center;
  padding:18px;
  z-index:9999;
}
.modal{
  width:min(740px, 96vw);
  max-height:calc(100vh - 48px);
  overflow-y:auto;
  /* V155.4 — Parte 8: fundo sólido (era gradiente semi-transparente, deixava
     o conteúdo "lavado"). Mesmo tom já usado em correspondente.html/
     documentacao.html/ocr.html para um visual Enterprise sem transparência. */
  background:#12121a;
  border:1px solid rgba(255,255,255,.14);
  border-radius:26px;
  box-shadow:0 40px 120px rgba(0,0,0,.75);
  padding:18px 18px 40px;
}
.modal-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:10px;
}
.modal-title{font-size:18px;font-weight:950}
.modal-close{border-radius:999px}

/* ---------- TOAST / NOTIFY ---------- */
.toast{
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:10000;
  max-width:min(420px, 92vw);
  padding:12px 14px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(16,27,54,.92);
  box-shadow:0 24px 90px rgba(0,0,0,.65);
  color:var(--txt);
  display:none;
}
.toast.show{display:block}
.toast.ok{border-color:rgba(61,220,151,.25)}
.toast.err{border-color:rgba(255,77,109,.25)}
.toast.warn{border-color:rgba(255,209,102,.25)}
.toast small{display:block;color:var(--muted);margin-top:4px}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 1180px){
  .grid.kpis{grid-template-columns:repeat(3,1fr)}
  .kanban-board{grid-template-columns:repeat(2, minmax(260px,1fr))}
  .finance-grid{grid-template-columns:1fr}
}
@media (max-width: 720px){
  .page-head{flex-direction:column;align-items:flex-start}
  .page-head h1{font-size:42px}
  .alert-list{grid-template-columns:1fr}
  .grid.velocity{grid-template-columns:1fr}
  .grid.kpis{grid-template-columns:repeat(2,1fr)}
  .kanban-board{grid-template-columns:1fr}
}
/* ===== FINAL LOCK — INPUTS PREMIUM (NÃO RETROCEDER) ===== */
.crm-container input,
.crm-container select,
.crm-container textarea{
  background: rgba(255,255,255,.06) !important;
  color: var(--txt, #e8eefc) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 12px !important;
  outline: none !important;
  padding: 10px 12px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06) !important;
}

.crm-container input::placeholder,
.crm-container textarea::placeholder{
  color: rgba(232,238,252,.55) !important;
}

.crm-container input:focus,
.crm-container select:focus,
.crm-container textarea:focus{
  border-color: rgba(124,156,255,.55) !important;
  box-shadow: 0 0 0 3px rgba(124,156,255,.18) !important;
}

/* texto digitável sempre em CAIXA ALTA (visual) */
.crm-container input[type="text"],
.crm-container textarea{
  text-transform: uppercase !important;
}
/* FINAL LOCK — dropdown escuro (remove “caixa branca”) */
:root { color-scheme: dark; }
select { color-scheme: dark; }
select option {
  background: #0f1730;
  color: #e8eefc;
}
/* ===== FUNIL (Board horizontal + Drag & Drop) ===== */

.funil-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin:12px 0 14px;
}

.funil-badges{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid var(--stroke);
  background:rgba(255,255,255,.04);
  color:var(--txt);
  font-size:13px;
}

.pill.ok{ border-color: rgba(61,220,151,.35); }
.pill.warn{ border-color: rgba(255,200,0,.35); }
.pill.danger{ border-color: rgba(255,77,109,.35); }

.funil-wrap{
  width:100%;
  overflow:auto;
  padding-bottom: 10px;
}

.funil-board{
  display:flex;
  gap:14px;
  min-height: 520px;
  padding: 2px;
  align-items: stretch;
}

.funil-col{
  flex: 0 0 300px;
  display:flex;
  flex-direction:column;
  border:1px solid var(--stroke);
  background: rgba(255,255,255,.03);
  border-radius:16px;
  box-shadow: var(--shadow);
}

.funil-col.danger{
  border-color: rgba(255,77,109,.25);
}

.funil-col-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 12px 12px 10px;
  border-bottom:1px solid var(--stroke);
}

.funil-col-head h3{
  margin:0;
  font-size:15px;
  letter-spacing:.2px;
}

.funil-col-head .count{
  min-width: 34px;
  text-align:center;
  padding:4px 10px;
  border-radius:999px;
  border:1px solid var(--stroke);
  background: rgba(0,0,0,.15);
  font-weight:700;
}

.funil-dropzone{
  flex:1;
  padding: 10px;
  display:flex;
  flex-direction:column;
  gap:10px;
  min-height: 420px;
}

.funil-dropzone.over{
  outline: 2px dashed rgba(124,156,255,.65);
  outline-offset: -6px;
  background: rgba(124,156,255,.08);
  border-radius: 14px;
}

.funil-empty{
  opacity:.7;
  font-size:13px;
  padding:10px;
  border:1px dashed var(--stroke2);
  border-radius:12px;
}

.funil-card{
  border:1px solid var(--stroke);
  background: rgba(15,23,48,.85);
  border-radius:14px;
  padding: 10px 10px 8px;
  cursor: grab;
  user-select:none;
}

.funil-card:active{
  cursor: grabbing;
}

.funil-card.dragging{
  opacity:.55;
  transform: scale(.98);
}

.funil-card .title{
  display:flex;
  align-items:center;
  gap:8px;
  font-weight:800;
  margin-bottom:6px;
}

.funil-card .dot{
  width:10px;
  height:10px;
  border-radius:999px;
  background: var(--accent);
  box-shadow: 0 0 18px rgba(124,156,255,.45);
}

.funil-card .meta{
  font-size:12px;
  opacity:.86;
  line-height:1.35;
}

.funil-card .meta.small{
  margin-top:6px;
  opacity:.55;
  font-size:11px;
}

.tag{
  display:inline-flex;
  align-items:center;
  padding:2px 8px;
  border-radius:999px;
  border:1px solid var(--stroke);
  background: rgba(255,255,255,.04);
  margin-left:8px;
}

.funil-toast{
  position: fixed;
  left: 50%;
  bottom: 22px;
  transform: translateX(-50%);
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid var(--stroke);
  background: rgba(0,0,0,.55);
  backdrop-filter: blur(10px);
  opacity: 0;
  pointer-events: none;
  transition: opacity .18s ease, transform .18s ease;
  color: var(--txt);
  font-size: 13px;
  z-index: 9999;
}

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

.funil-toast.ok{ border-color: rgba(61,220,151,.45); }
.funil-toast.warn{ border-color: rgba(255,200,0,.45); }

/* ---------- V120 YODFY CRM — GLOW EFFECTS PREMIUM ---------- */

/* Lead premium: glow dourado pulsante */
.lead-premium {
  box-shadow: 0 0 12px rgba(251,191,36,.3), 0 10px 36px rgba(251,191,36,.18);
  border: 1px solid rgba(251,191,36,.4) !important;
  animation: pulse-gold 3s ease-in-out infinite;
}
@keyframes pulse-gold {
  0%,100% { box-shadow: 0 0 12px rgba(251,191,36,.3), 0 8px 28px rgba(251,191,36,.18); }
  50%      { box-shadow: 0 0 20px rgba(251,191,36,.5), 0 14px 42px rgba(251,191,36,.28); }
}

/* Badge premium */
.badge-premium {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 900;
  background: rgba(255,215,0,.14);
  border: 1px solid rgba(255,215,0,.35);
  color: #ffd700;
  letter-spacing: .03em;
}

/* Card com hover suave */
.card-hover {
  transition: transform .18s ease, box-shadow .18s ease;
}
.card-hover:hover {
  transform: translateY(-2px);
  box-shadow: 0 20px 60px rgba(0,0,0,.45);
}

/* Status badges visuais */
.status-badge {
  display: inline-flex;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 900;
  border: 1px solid rgba(255,255,255,.10);
}
.status-badge.CAPTACAO    { background:rgba(124,156,255,.12); color:#7c9cff; border-color:rgba(124,156,255,.25); }
.status-badge.ATENDIMENTO { background:rgba(255,209,102,.10); color:#ffd166; border-color:rgba(255,209,102,.25); }
.status-badge.DOCUMENTACAO{ background:rgba(140,199,255,.10); color:#8cc7ff; border-color:rgba(140,199,255,.25); }
.status-badge.ANALISE_CREDITO{background:rgba(200,150,255,.10);color:#c896ff;border-color:rgba(200,150,255,.25);}
.status-badge.APROVADO    { background:rgba(61,220,151,.12); color:#3ddc97; border-color:rgba(61,220,151,.30); }
.status-badge.AGENDADO    { background:rgba(255,180,50,.12); color:#ffb432; border-color:rgba(255,180,50,.28); }
.status-badge.FECHADO     { background:rgba(61,220,151,.18); color:#00e98a; border-color:rgba(61,220,151,.40); box-shadow:0 0 12px rgba(61,220,151,.15); }
.status-badge.DESISTENCIA { background:rgba(255,77,109,.10); color:#ff4d6d; border-color:rgba(255,77,109,.25); }

.funil-toast.danger{ border-color: rgba(239,68,68,.45); }

/* ===== V139.2 YODFY CRM BRAND LOCK ===== */

/* YODFY logo wrapper */
.yodfy-brand,.sophia-brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:inherit}
.yodfy-brand .brand-name,.sophia-brand .brand-name{font-size:18px;font-weight:900;letter-spacing:-.01em;background:var(--yodfy-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.yodfy-brand .brand-sub,.sophia-brand .brand-sub{font-size:11px;color:var(--muted);font-weight:600;margin-top:1px}

/* Footer YODFY */
.yodfy-footer,.sophia-footer{text-align:center;padding:22px 0 14px;color:var(--muted);font-size:12px;border-top:1px solid var(--stroke);margin-top:28px}
.yodfy-footer a,.sophia-footer a{color:var(--accent);text-decoration:none}
.yodfy-footer .powered,.sophia-footer .powered{font-size:11px;opacity:.65;margin-top:4px}

/* Botão primário YODFY */
.btn-yodfy,.btn-sophia{background:var(--yodfy-gradient);color:#fff;border:0;font-weight:700;padding:12px 20px;border-radius:14px;cursor:pointer;width:100%;font-size:15px;letter-spacing:.02em;transition:opacity .15s,transform .12s;box-shadow:0 8px 28px rgba(124,58,237,.35)}
.btn-yodfy:hover,.btn-sophia:hover{opacity:.92;transform:translateY(-1px);box-shadow:0 12px 36px rgba(124,58,237,.45)}
.btn-yodfy:active,.btn-sophia:active{transform:translateY(0);opacity:1}

/* FASE 5: elimina risco branco abaixo de imagens de logo em containers */
.topbar-brand img,.login-logo img{display:block;border:none;outline:none;vertical-align:top}

/* Card hover YODFY */
.card-hover:hover{border-color:rgba(124,58,237,.30)!important;box-shadow:0 20px 60px rgba(124,58,237,.12),0 8px 28px rgba(0,0,0,.40)!important}

/* Badge premium YODFY */
.badge-premium{display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border-radius:999px;font-size:11px;font-weight:900;background:rgba(251,191,36,.14);border:1px solid rgba(251,191,36,.35);color:#fbbf24;letter-spacing:.03em}

/* Input focus YODFY */
.crm-container input:focus,
.crm-container select:focus,
.crm-container textarea:focus{
  border-color:rgba(124,58,237,.55)!important;
  box-shadow:0 0 0 3px rgba(124,58,237,.18)!important;
}

/* KPI executivo card */
.kpi-exec{min-height:100px;display:flex;flex-direction:column;justify-content:center;transition:transform .18s,box-shadow .18s}
.kpi-exec:hover{transform:translateY(-2px);box-shadow:0 20px 48px rgba(124,58,237,.18),0 8px 24px rgba(0,0,0,.35)!important}
.kpi-exec .kpi-icon{font-size:22px;margin-bottom:4px}
.kpi-exec .kpi-num{font-size:28px;font-weight:950;letter-spacing:-.03em;line-height:1}
.kpi-exec .kpi-lbl{font-size:11px;color:var(--muted);font-weight:700;margin-top:4px;text-transform:uppercase;letter-spacing:.06em}

/* ═══════════════════════════════════════════════════════════
   V121 DESIGN SYSTEM — YODFY CRM
   Módulos 9, 10, 11: Cards padronizados, Design System
   ═══════════════════════════════════════════════════════════ */

/* ── Dashboard Card Base ─────────────────────────────────── */
.dash-card{
  transition:transform .25s ease,box-shadow .25s ease;
}
.dash-card:hover{
  transform:translateY(-3px);
  box-shadow:0 0 28px rgba(124,58,237,.18),0 8px 24px rgba(0,0,0,.3)!important;
}

/* ── Badge Design System ─────────────────────────────────── */
.badge-standard{display:inline-block;padding:2px 10px;border-radius:20px;font-size:.72rem;font-weight:700;background:rgba(148,163,184,.12);color:var(--muted);border:1px solid rgba(148,163,184,.2)}
.badge-alert{display:inline-block;padding:2px 10px;border-radius:20px;font-size:.72rem;font-weight:700;background:rgba(239,68,68,.12);color:#EF4444;border:1px solid rgba(239,68,68,.25)}
.badge-success{display:inline-block;padding:2px 10px;border-radius:20px;font-size:.72rem;font-weight:700;background:rgba(16,185,129,.12);color:#10B981;border:1px solid rgba(16,185,129,.25)}

/* ── Badges Enterprise (V158.3 — BLOCO 14) ───────────────────
   Família coesa por categoria (OCR/IA/Banco/Correspondente/Cliente/
   Documentação/SLA/Urgência/Status), mesmo grafismo pill do badge-
   standard/alert/success acima — só estende a paleta, não reinventa.
   Prefixo "badge-ent" (não "badge-premium") pra não colidir com o
   .badge-premium local já existente em correspondente.html (usado pro
   selo "★ Premium" de lead, propósito diferente). */
.badge-ent{display:inline-flex;align-items:center;gap:4px;padding:3px 11px;border-radius:20px;font-size:.72rem;font-weight:700;white-space:nowrap;line-height:1.4}
.badge-ent-ocr{background:rgba(6,182,212,.12);color:#06b6d4;border:1px solid rgba(6,182,212,.25)}
.badge-ent-ia{background:rgba(236,72,153,.12);color:#f9a8d4;border:1px solid rgba(236,72,153,.25)}
.badge-ent-status-pendente{background:rgba(148,163,184,.12);color:var(--muted);border:1px solid rgba(148,163,184,.2)}
.badge-ent-status-aprovado{background:rgba(16,185,129,.12);color:#10b981;border:1px solid rgba(16,185,129,.25)}
.badge-ent-status-condicionado{background:rgba(245,158,11,.12);color:#f59e0b;border:1px solid rgba(245,158,11,.25)}
.badge-ent-status-reprovado{background:rgba(239,68,68,.12);color:#ef4444;border:1px solid rgba(239,68,68,.25)}

/* ── Button Design System ────────────────────────────────── */
.button-primary{
  padding:10px 20px;border-radius:10px;font-size:.88rem;font-weight:700;cursor:pointer;
  background:var(--sophia-gradient);color:#fff;border:none;
  transition:.2s;letter-spacing:.02em;
}
.button-primary:hover{opacity:.88;transform:translateY(-1px)}

/* ── Lead Premium Condicional (Módulo 10) ────────────────── */
.lead-premium.sem-premium{
  animation:none!important;
  box-shadow:none!important;
  border-color:var(--stroke)!important;
  opacity:.7;
}
.lead-premium.com-premium{
  animation:pulse-gold 3s ease-in-out infinite;
  border-color:rgba(251,191,36,.4)!important;
  box-shadow:0 0 20px rgba(251,191,36,.2);
}

/* ── Nav btn ─────────────────────────────────────────────── */
.nav-btn{display:inline-block;padding:6px 12px;border-radius:8px;font-size:.82rem;color:var(--muted);text-decoration:none;transition:.2s;font-weight:500}
.nav-btn:hover{background:rgba(124,58,237,.12);color:var(--txt)}
.nav-btn.active{background:rgba(124,58,237,.18);color:var(--txt);font-weight:700}

/* ── View btn (usado em páginas de listagem) ─────────────── */
.view-btn{padding:6px 14px;border-radius:8px;border:1px solid var(--stroke);background:transparent;color:var(--muted);cursor:pointer;font-size:.82rem;transition:.2s;font-weight:500}
.view-btn:hover{border-color:rgba(124,58,237,.4);color:var(--txt)}
.view-btn.active{background:var(--accent);color:#fff;border-color:var(--accent)}

/* ── Topbar unificada (Módulo 12) ────────────────────────── */
.topbar{display:flex;align-items:center;justify-content:space-between;padding:10px 20px;background:var(--bg1);border-bottom:1px solid rgba(124,58,237,.20);gap:12px;position:sticky;top:0;z-index:100;flex-wrap:nowrap;box-shadow:0 1px 12px rgba(0,0,0,.35)}
.topbar-brand{display:flex;align-items:center;gap:10px;text-decoration:none;flex-shrink:0}
.topbar-brand span{font-weight:700;font-size:.95rem;color:var(--txt);white-space:nowrap}
.topbar-nav{display:flex;gap:2px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;flex:1;min-width:0}
.topbar-nav::-webkit-scrollbar{display:none}
.topbar-end{display:flex;align-items:center;gap:8px;flex-shrink:0}
.hamburger{display:none;background:transparent;border:1px solid var(--stroke);border-radius:8px;color:var(--txt);padding:5px 10px;cursor:pointer;font-size:16px;line-height:1}
@media(max-width:820px){
  .hamburger{display:flex;align-items:center;justify-content:center}
  .topbar-nav{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:var(--bg1);flex-direction:column;padding:72px 20px 20px;z-index:99;gap:4px;overflow-y:auto}
  .topbar-nav.open{display:flex}
  .topbar-nav .nav-btn{font-size:1rem;padding:14px 18px;border-radius:12px;border:1px solid var(--stroke)}
  .topbar-nav .nav-btn:hover,.topbar-nav .nav-btn.active{background:rgba(124,58,237,.15)}
  .topbar-nav-close{display:flex;position:absolute;top:16px;right:16px;background:transparent;border:none;color:var(--txt);font-size:24px;cursor:pointer;z-index:100}
}
@media(min-width:821px){.topbar-nav-close{display:none!important}}

/* ═══════════════════════════════════════════════════════════════════
   V140 — PREMIUM UX POLISH
   Animações: transform + opacity exclusivamente · zero reflow
   ═══════════════════════════════════════════════════════════════════ */

/* — Keyframes —————————————————————————————————————————————————————— */
@keyframes yodfy-fade-in{from{opacity:0}to{opacity:1}}
@keyframes yodfy-fade-up{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
@keyframes yodfy-scale-in{from{opacity:0;transform:scale(0.96)}to{opacity:1;transform:scale(1)}}
@keyframes yodfy-spin{to{transform:rotate(360deg)}}
@keyframes yodfy-logo-glow{0%,100%{filter:drop-shadow(0 0px 0px rgba(124,58,237,0))}50%{filter:drop-shadow(0 6px 22px rgba(124,58,237,.42))}}

/* — Page entrance —————————————————————————————————————————————————— */
body{animation:yodfy-fade-in .22s ease both}

/* — Cards: stagger fade-up ————————————————————————————————————————— */
.dash-card{
  animation:yodfy-fade-up .36s ease both;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.dash-card:nth-child(1){animation-delay:.04s}
.dash-card:nth-child(2){animation-delay:.08s}
.dash-card:nth-child(3){animation-delay:.11s}
.dash-card:nth-child(4){animation-delay:.14s}
.dash-card:nth-child(5){animation-delay:.17s}
.dash-card:nth-child(6){animation-delay:.20s}
.dash-card:nth-child(7){animation-delay:.23s}
.dash-card:nth-child(8){animation-delay:.26s}
.dash-card:nth-child(9){animation-delay:.29s}
.dash-card:nth-child(10){animation-delay:.32s}
.dash-card:nth-child(11){animation-delay:.35s}
.dash-card:nth-child(12){animation-delay:.38s}
.dash-card.card-hover:hover{
  transform:translateY(-3px);
  box-shadow:0 28px 72px rgba(0,0,0,.58),0 0 0 1px rgba(124,58,237,.22);
  border-color:rgba(124,58,237,.26);
}

/* — Modal: fade backdrop + scale-in content ———————————————————————— */
/* V168.1 — BLOCO 01/02: causa raiz real do "botão Editar/Excluir não faz
   nada" em admin.html (e do mesmo padrão latente em agenda.html/
   contratos.html/sophia-config.html, que usam o mesmo .modal-backdrop.show
   sem nenhum outro override de display). O JS sempre rodava corretamente
   (buscava o usuário, preenchia o modal, adicionava a classe "show"), mas
   .modal-backdrop base tem display:none e .show nunca sobrescrevia isso —
   só a animação. O modal ficava tecnicamente aberto, só invisível.
   Corrigido no arquivo compartilhado (não duplicado por página).
*/
.modal-backdrop.show{display:flex;animation:yodfy-fade-in .16s ease both}
.modal-backdrop.show .modal{animation:yodfy-scale-in .22s cubic-bezier(.34,1.2,.64,1) both}

/* — Botões: focus ring + disabled + loading spinner ———————————————— */
.btn:focus-visible,.btn-yodfy:focus-visible,.btn-sophia:focus-visible,
button:focus-visible{
  outline:2px solid rgba(124,58,237,.80);
  outline-offset:3px;
  box-shadow:0 0 0 4px rgba(124,58,237,.18),0 10px 26px rgba(0,0,0,.35);
}
.btn[disabled],.btn-yodfy[disabled],.btn-sophia[disabled],
button[disabled],.btn.disabled{
  opacity:.38;pointer-events:none;cursor:not-allowed;
}
.btn-yodfy.loading,.btn-sophia.loading,.btn.loading,button.loading{
  position:relative;pointer-events:none;color:transparent!important;
}
.btn-yodfy.loading::after,.btn-sophia.loading::after,.btn.loading::after,
button.loading::after{
  content:'';position:absolute;inset:0;margin:auto;
  width:16px;height:16px;
  border:2px solid rgba(255,255,255,.25);border-top-color:#fff;
  border-radius:50%;animation:yodfy-spin .55s linear infinite;
}

/* — Scrollbar personalizada ———————————————————————————————————————— */
::-webkit-scrollbar{width:5px;height:5px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:rgba(124,58,237,.28);border-radius:99px}
::-webkit-scrollbar-thumb:hover{background:rgba(124,58,237,.58)}
*{scrollbar-width:thin;scrollbar-color:rgba(124,58,237,.28) transparent}

/* — Tabelas: hover row ————————————————————————————————————————————— */
.leads-table tbody tr,.table-wrap table tbody tr,.table tbody tr{
  transition:background .10s ease;
}
.leads-table tbody tr:hover,.table-wrap table tbody tr:hover,.table tbody tr:hover{
  background:rgba(124,58,237,.07);
}

/* — Inputs: focus ring reforçado ——————————————————————————————————— */
.input:focus,
input[type="text"]:focus,input[type="tel"]:focus,input[type="number"]:focus,
input[type="date"]:focus,input[type="email"]:focus,input[type="password"]:focus,
textarea:focus,select:focus{
  border-color:rgba(124,58,237,.62)!important;
  box-shadow:0 0 0 3px rgba(124,58,237,.18),0 2px 8px rgba(0,0,0,.28)!important;
}

/* — Sidebar backdrop: fade via opacity (sobrepõe display:none do nav.js) — */
#_snav_bd{
  display:block!important;
  opacity:0;pointer-events:none;
  transition:opacity .22s ease;
}
#_snav_bd._sopen{opacity:1!important;pointer-events:auto}

/* — Cards genéricos: hover suave ——————————————————————————————————— */
.card{transition:box-shadow .18s ease,border-color .18s ease}

/* — Links: transição de cor ———————————————————————————————————————— */
a{transition:color .12s ease,opacity .12s ease}

/* ═══════════════════════════════════════════════════════════════════
   V147 — ENTERPRISE POLISH — Empty States · Skeleton · Mobile Tables
   ═══════════════════════════════════════════════════════════════════ */

/* ── Empty state ─────────────────────────────────────────────────── */
.empty-state{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:48px 24px;text-align:center;color:var(--muted);gap:12px;
}
.empty-state-icon{font-size:40px;opacity:.5}
.empty-state-title{font-size:15px;font-weight:700;color:var(--txt);opacity:.7}
.empty-state-sub{font-size:13px;color:var(--muted);max-width:320px;line-height:1.5}

/* ── Skeleton loading ────────────────────────────────────────────── */
@keyframes skeleton-wave{0%{background-position:200% 0}100%{background-position:-200% 0}}
.skeleton{
  background:linear-gradient(90deg,rgba(255,255,255,.06) 25%,rgba(255,255,255,.11) 50%,rgba(255,255,255,.06) 75%);
  background-size:200% 100%;
  animation:skeleton-wave 1.6s ease-in-out infinite;
  border-radius:8px;
  color:transparent!important;
  pointer-events:none;user-select:none;
}
.skeleton-line{height:14px;border-radius:6px;margin:6px 0}
.skeleton-line.w-full{width:100%}
.skeleton-line.w-3-4{width:75%}
.skeleton-line.w-1-2{width:50%}
.skeleton-line.w-1-3{width:33%}

/* ── Table responsive wrapper ────────────────────────────────────── */
.table-responsive{overflow-x:auto;-webkit-overflow-scrolling:touch}
.table-responsive table,.table-responsive .table{min-width:560px}
@media(max-width:640px){
  .table-responsive{border-radius:12px;border:1px solid var(--stroke)}
  .table th,.table td,
  th,td{font-size:12px;padding:8px 8px}
}

/* ── Mobile KPI grids ────────────────────────────────────────────── */
@media(max-width:480px){
  .grid.kpis{grid-template-columns:repeat(2,1fr)}
  .dash-grid-6{grid-template-columns:repeat(2,1fr)!important}
  .dash-grid-6 [style*="grid-column:span"]{grid-column:span 2!important}
}

/* ── Toast mobile ────────────────────────────────────────────────── */
@media(max-width:480px){
  #jrcrmToast{right:8px!important;left:8px!important;bottom:12px!important;border-radius:12px!important}
}

/* ── Modal: garantir scroll em mobile ───────────────────────────── */
.modal{max-height:calc(100dvh - 32px)!important;overflow-y:auto}

/* ── V188.24 — formulário de cadastro do catálogo (wizard por abas):
   grids de 2/3/4 colunas viram 1 coluna em telas estreitas. !important
   necessário pra vencer o grid-template-columns inline (mesmo padrão já
   usado acima em .dash-grid-6). ───────────────────────────────────── */
@media(max-width:640px){
  .ccFormGrid{grid-template-columns:1fr!important}
}

/* ── Status comercial ────────────────────────────────────────────── */
.status-check-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;margin-top:14px}
.status-check-item{
  display:flex;align-items:center;gap:10px;
  background:rgba(255,255,255,.04);border:1px solid var(--stroke);
  border-radius:12px;padding:12px 14px;
  transition:border-color .15s;
}
.status-check-item.ok-item{border-color:rgba(16,185,129,.3)}
.status-check-item.warn-item{border-color:rgba(245,158,11,.3)}
.status-check-item.err-item{border-color:rgba(239,68,68,.3)}
.status-check-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.status-check-dot.ok-dot{background:#10B981}
.status-check-dot.warn-dot{background:#F59E0B;animation:yodfy-spin 1.8s linear infinite}
.status-check-dot.err-dot{background:#EF4444}
.status-check-label{font-size:13px;font-weight:600;flex:1}
.status-check-val{font-size:11px;color:var(--muted)}
