/* =====================================================================
 * Admin AgroRota — dark mode com paleta cobre/teal
 * ===================================================================== */
:root {
  --bg-0: #0a0d14;
  --bg-1: #0f131c;
  --bg-2: #161b28;
  --bg-3: #1e2536;
  --border: rgba(255,255,255,0.08);
  --border-strong: rgba(255,255,255,0.16);
  --text: #ffffff;
  --text-2: rgba(255,255,255,0.72);
  --text-3: rgba(255,255,255,0.45);
  --primary: #3aa0ad;
  --primary-h: #4dbac9;
  --accent: #d49462;
  --accent-h: #c58a52;
  --green: #10b981;
  --red: #ef4444;
  --yellow: #f59e0b;
  --blue: #3b82f6;
  --radius: 12px;
  --radius-sm: 8px;
  --shadow: 0 4px 14px rgba(0,0,0,.25);
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; }
body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  background: var(--bg-0);
  color: var(--text);
  font-size: 14px;
  line-height: 1.5;
}
button, input, select { font: inherit; color: inherit; }
h1, h2, h3, h4 { color: var(--text); }
a { color: var(--primary); text-decoration: none; }
a:hover { color: var(--primary-h); }

/* ─── Login ──────────────────────────────────────────────────── */
.tela-login {
  position: fixed; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background:
    radial-gradient(800px 600px at 10% 0%, rgba(58,160,173,.15), transparent 70%),
    radial-gradient(800px 600px at 90% 100%, rgba(212,148,98,.15), transparent 70%),
    var(--bg-0);
  z-index: 100;
}
.login-card {
  width: 100%;
  max-width: 380px;
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: 18px;
  padding: 36px 32px;
  box-shadow: var(--shadow);
}
.login-logo {
  width: 60px; height: 60px;
  border-radius: 16px;
  background: linear-gradient(135deg, var(--accent), var(--accent-h));
  color: #fff;
  font-weight: 800; font-size: 20px;
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 18px;
  box-shadow: 0 8px 20px rgba(212,148,98,.4);
}
.login-card h1 { font-size: 22px; text-align: center; margin-bottom: 4px; }
.login-sub { color: var(--text-3); text-align: center; font-size: 13px; margin-bottom: 28px; }
.login-card label {
  display: block;
  font-size: 12px;
  color: var(--text-3);
  margin-bottom: 6px;
  margin-top: 14px;
  text-transform: uppercase;
  letter-spacing: 1px;
}
.login-card input {
  width: 100%;
  padding: 11px 14px;
  background: var(--bg-0);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  outline: none;
  transition: border .15s;
}
.login-card input:focus { border-color: var(--primary); }
.login-erro {
  margin-top: 14px;
  padding: 10px 14px;
  background: rgba(239,68,68,.1);
  border: 1px solid rgba(239,68,68,.3);
  color: #fca5a5;
  border-radius: var(--radius-sm);
  font-size: 13px;
}

/* ─── Botões ─────────────────────────────────────────────────── */
.btn {
  display: inline-flex; align-items: center; justify-content: center;
  gap: 8px;
  padding: 10px 18px;
  border-radius: var(--radius-sm);
  border: 1px solid transparent;
  font-weight: 600;
  font-size: 14px;
  cursor: pointer;
  transition: all .15s;
}
.btn-primary { background: var(--primary); color: #fff; width: 100%; margin-top: 22px; padding: 12px; }
.btn-primary:hover:not(:disabled) { background: var(--primary-h); }
.btn-primary:disabled { opacity: .6; cursor: wait; }
.btn-ghost {
  background: transparent;
  border-color: var(--border-strong);
  color: var(--text-2);
}
.btn-ghost:hover { background: var(--bg-3); color: var(--text); }
.btn-icone {
  width: 32px; height: 32px;
  border-radius: 50%;
  background: var(--bg-3);
  color: var(--text-2);
  border: none;
  font-size: 14px;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}
.btn-icone:hover { background: var(--bg-1); color: var(--red); }
.btn-link {
  background: transparent;
  border: none;
  color: var(--text-2);
  font-size: 16px;
  cursor: pointer;
  padding: 4px 8px;
  text-decoration: none;
}
.btn-link:hover { color: var(--text); }

/* ─── Layout app ─────────────────────────────────────────────── */
#app {
  display: grid;
  grid-template-columns: 240px 1fr;
  min-height: 100vh;
}
.sidebar {
  background: var(--bg-1);
  border-right: 1px solid var(--border);
  padding: 22px 16px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.brand {
  display: flex; align-items: center; gap: 12px;
  padding: 0 6px 18px;
  border-bottom: 1px solid var(--border);
}
.brand-logo {
  width: 38px; height: 38px;
  border-radius: 10px;
  background: var(--accent);
  display: flex; align-items: center; justify-content: center;
  font-weight: 800; color: #fff;
}
.brand strong { display: block; font-size: 14px; }
.brand span { display: block; font-size: 11px; color: var(--text-3); }

.menu { display: flex; flex-direction: column; gap: 2px; }
.menu-item {
  background: transparent;
  border: none;
  color: var(--text-2);
  padding: 10px 12px;
  text-align: left;
  border-radius: var(--radius-sm);
  cursor: pointer;
  font-size: 14px;
}
.menu-item:hover:not(:disabled) { background: var(--bg-3); color: var(--text); }
.menu-item.active {
  background: var(--bg-3);
  color: var(--primary);
  font-weight: 600;
}
.menu-item:disabled { opacity: .4; cursor: not-allowed; }

.user-card {
  margin-top: auto;
  display: grid;
  grid-template-columns: 36px 1fr auto;
  gap: 10px;
  align-items: center;
  padding: 10px;
  background: var(--bg-2);
  border-radius: var(--radius-sm);
}
.user-avatar {
  width: 36px; height: 36px;
  border-radius: 50%;
  background: var(--primary);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-weight: 700;
}
.user-card strong { display: block; font-size: 13px; }
.user-card span { display: block; font-size: 11px; color: var(--text-3); text-transform: capitalize; }

/* ─── Conteúdo principal ────────────────────────────────────── */
.conteudo {
  padding: 24px 32px 60px;
  overflow-y: auto;
  max-height: 100vh;
}
.topo {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 24px;
}
.topo h1 { font-size: 24px; }
.meta-tempo { font-size: 12px; color: var(--text-3); }

/* ─── KPIs ───────────────────────────────────────────────────── */
.kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 14px;
  margin-bottom: 24px;
}
.kpi, .kpi-skel {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 18px 20px;
}
.kpi-skel { height: 100px; opacity: .5; animation: pulse 1.5s infinite; }
@keyframes pulse { 50% { opacity: .25; } }
.kpi-rotulo { font-size: 12px; color: var(--text-3); text-transform: uppercase; letter-spacing: 1px; }
.kpi-valor { display: block; font-size: 26px; font-weight: 800; margin: 6px 0 4px; }
.kpi-sub { font-size: 12px; color: var(--text-3); }

/* ─── Cards / 2-cols ─────────────────────────────────────────── */
.duas-colunas {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-bottom: 20px;
}
@media (max-width: 900px) { .duas-colunas { grid-template-columns: 1fr; } }
.card {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 18px 20px;
}
.card h3 { font-size: 14px; margin-bottom: 14px; color: var(--text-2); text-transform: uppercase; letter-spacing: 1px; }

.linha-cat {
  display: grid;
  grid-template-columns: 130px 1fr 30px;
  gap: 10px;
  align-items: center;
  padding: 6px 0;
}
.cat-nome { font-size: 13px; color: var(--text-2); }
.cat-barra { height: 6px; background: var(--bg-3); border-radius: 3px; overflow: hidden; }
.cat-barra-fill { height: 100%; background: linear-gradient(90deg, var(--primary), var(--accent)); }
.linha-cat strong { text-align: right; font-size: 13px; }

.linha-recente {
  display: flex; justify-content: space-between; align-items: center;
  padding: 10px 0;
  border-bottom: 1px solid var(--border);
}
.linha-recente:last-child { border-bottom: none; }
.linha-recente strong { font-size: 13px; }
.recente-sku { display: block; font-size: 11px; color: var(--text-3); font-family: ui-monospace, monospace; }

.status-pill {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  color: #fff;
}

.alerta-fotos {
  background: rgba(245,158,11,.08);
  border-color: rgba(245,158,11,.3);
}
.alerta-fotos strong { color: var(--yellow); display: block; margin-bottom: 4px; }
.alerta-fotos p { color: var(--text-2); margin-bottom: 12px; font-size: 13px; }

.vazio { color: var(--text-3); font-size: 13px; padding: 12px 0; }
.erro { color: #fca5a5; padding: 14px; background: rgba(239,68,68,.08); border-radius: var(--radius-sm); }
.loading { color: var(--text-3); padding: 30px; text-align: center; }

/* ─── Filtros de ativos ──────────────────────────────────────── */
.filtros-bar {
  display: flex; gap: 10px; flex-wrap: wrap;
  margin-bottom: 18px;
  background: var(--bg-2);
  padding: 14px;
  border-radius: var(--radius);
  border: 1px solid var(--border);
}
.filtros-bar input, .filtros-bar select {
  background: var(--bg-0);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  padding: 8px 12px;
  font-size: 13px;
  outline: none;
}
.filtros-bar input { flex: 1; min-width: 240px; }
.filtros-bar input:focus, .filtros-bar select:focus { border-color: var(--primary); }
.checkbox-inline {
  display: flex; align-items: center; gap: 6px;
  font-size: 13px; color: var(--text-2);
  padding: 0 8px;
  cursor: pointer;
}

/* ─── Tabela de ativos ───────────────────────────────────────── */
.ativos-tabela {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
}
.tabela {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.tabela thead {
  background: var(--bg-3);
}
.tabela th {
  text-align: left;
  padding: 10px 12px;
  font-size: 11px;
  color: var(--text-3);
  text-transform: uppercase;
  letter-spacing: .5px;
  border-bottom: 1px solid var(--border-strong);
}
.tabela td {
  padding: 10px 12px;
  border-bottom: 1px solid var(--border);
  vertical-align: middle;
}
.tabela tr:last-child td { border-bottom: none; }
.tabela tbody tr:hover { background: var(--bg-3); }
.cel-foto {
  width: 48px; height: 48px; object-fit: cover;
  border-radius: 6px;
  display: block;
}
.cel-sem-foto {
  width: 48px; height: 48px;
  background: var(--bg-0);
  border-radius: 6px;
  display: flex; align-items: center; justify-content: center;
  color: var(--text-3);
}
.cel-sku {
  font-size: 11px;
  font-family: ui-monospace, monospace;
  color: var(--text-2);
  background: var(--bg-0);
  padding: 3px 7px;
  border-radius: 4px;
}
.muted { color: var(--text-3); font-size: 12px; }
.sel-status {
  background: var(--bg-0);
  border: 1px solid var(--border-strong);
  border-radius: 6px;
  padding: 5px 8px;
  font-size: 12px;
  cursor: pointer;
}
.contagem { color: var(--text-3); padding: 10px 14px; font-size: 12px; }

/* ─── Botão Novo ativo ───────────────────────────────────────── */
.btn-novo {
  background: var(--accent);
  color: #fff;
  padding: 8px 16px;
  border: none;
  font-size: 13px;
}
.btn-novo:hover { background: var(--accent-h); }

/* ─── Modal grande de ativo ──────────────────────────────────── */
.modal {
  position: fixed; inset: 0;
  z-index: 200;
  display: flex; align-items: center; justify-content: center;
  padding: 18px;
}
.modal[hidden] { display: none; }
.modal-backdrop {
  position: absolute; inset: 0;
  background: rgba(0,0,0,.7);
  backdrop-filter: blur(4px);
}
.modal-card {
  position: relative;
  background: var(--bg-1);
  border: 1px solid var(--border-strong);
  border-radius: 16px;
  width: 100%;
  max-width: 920px;
  max-height: 94vh;
  display: flex;
  flex-direction: column;
  box-shadow: 0 30px 80px rgba(0,0,0,.5);
  overflow: hidden;
}
.modal-head {
  display: flex; justify-content: space-between; align-items: center;
  padding: 18px 24px;
  border-bottom: 1px solid var(--border);
  background: var(--bg-2);
}
.modal-head h2 { font-size: 18px; }
.modal-corpo {
  padding: 22px 24px;
  overflow-y: auto;
  flex: 1;
}
.modal-rodape {
  display: flex; justify-content: flex-end; gap: 10px;
  padding: 14px 20px;
  border-top: 1px solid var(--border);
  background: var(--bg-2);
}
.modal-rodape .btn { width: auto; min-width: 110px; margin-top: 0; }

/* ─── Form grid ──────────────────────────────────────────────── */
.form-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px 16px;
  margin-bottom: 24px;
}
.form-grid .campo { display: flex; flex-direction: column; }
.form-grid .campo.span-2 { grid-column: span 2; }
.form-grid .campo.textarea { grid-column: span 4; }
.form-grid label {
  font-size: 11px;
  color: var(--text-3);
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 5px;
}
.form-grid input, .form-grid select, .form-grid textarea {
  background: var(--bg-0);
  border: 1px solid var(--border-strong);
  border-radius: 6px;
  padding: 9px 12px;
  font-size: 13px;
  outline: none;
  font-family: inherit;
}
.form-grid input:focus, .form-grid select:focus, .form-grid textarea:focus {
  border-color: var(--primary);
}
.form-grid textarea { resize: vertical; min-height: 60px; }

@media (max-width: 700px) {
  .form-grid { grid-template-columns: 1fr 1fr; }
  .form-grid .campo.span-2 { grid-column: span 2; }
  .form-grid .campo.textarea { grid-column: span 2; }
}

/* ─── Bloco de fotos ─────────────────────────────────────────── */
.bloco-fotos {
  border-top: 1px solid var(--border);
  padding-top: 20px;
}
.bloco-head {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 14px;
}
.bloco-head h3 { font-size: 15px; }
.contador-fotos { font-size: 12px; color: var(--text-3); }
.dica { font-size: 12px; color: var(--text-3); margin-top: 12px; }

/* Dropzone */
.dropzone {
  border: 2px dashed var(--border-strong);
  background: var(--bg-2);
  border-radius: var(--radius);
  padding: 28px 20px;
  text-align: center;
  cursor: pointer;
  transition: all .15s;
}
.dropzone:hover {
  border-color: var(--primary);
  background: var(--bg-3);
}
.dropzone.dragover {
  border-color: var(--accent);
  background: rgba(212,148,98,.1);
}
.dropzone-conteudo strong { display: block; font-size: 14px; }
.dropzone-conteudo span { font-size: 12px; color: var(--text-3); margin-top: 4px; display: block; }

/* Progresso */
.progresso-upload {
  margin-top: 12px;
  padding: 10px;
  background: var(--bg-2);
  border-radius: var(--radius-sm);
}
.progresso-barra {
  height: 6px;
  background: var(--bg-0);
  border-radius: 3px;
  overflow: hidden;
  margin-bottom: 6px;
}
.progresso-barra #progresso-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--primary), var(--accent));
  transition: width .2s;
}
.progresso-upload span { font-size: 12px; color: var(--text-2); }

/* Galeria */
.galeria-admin {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 10px;
  margin-top: 14px;
}
.foto-item {
  position: relative;
  aspect-ratio: 4/3;
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: 8px;
  overflow: hidden;
  cursor: move;
  transition: transform .15s, box-shadow .15s;
}
.foto-item.dragging { opacity: .5; transform: scale(.95); }
.foto-item.drag-over { border-color: var(--primary); }
.foto-item img {
  width: 100%; height: 100%; object-fit: cover; display: block;
}
.foto-item.principal::before {
  content: 'PRINCIPAL';
  position: absolute;
  top: 6px; left: 6px;
  background: var(--accent);
  color: #fff;
  font-size: 9px;
  font-weight: 800;
  padding: 3px 7px;
  border-radius: 3px;
  letter-spacing: .5px;
  z-index: 2;
}
.foto-acoes {
  position: absolute;
  top: 6px; right: 6px;
  display: flex; gap: 4px;
  z-index: 2;
}
.foto-acao {
  width: 24px; height: 24px;
  background: rgba(0,0,0,.7);
  border: none;
  color: #fff;
  border-radius: 50%;
  font-size: 12px;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}
.foto-acao:hover { background: var(--red); }
.foto-tipo-badge {
  position: absolute;
  bottom: 6px; left: 6px;
  font-size: 10px;
  background: rgba(0,0,0,.7);
  color: #fff;
  padding: 2px 6px;
  border-radius: 3px;
  z-index: 2;
}

/* Toast / feedback */
.toast {
  position: fixed;
  bottom: 24px; right: 24px;
  z-index: 300;
  padding: 12px 20px;
  background: var(--bg-2);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow);
  font-size: 13px;
  animation: slideIn .25s;
}
.toast.sucesso { border-left: 4px solid var(--green); }
.toast.erro { border-left: 4px solid var(--red); }
@keyframes slideIn { from { opacity: 0; transform: translateX(20px); } }

/* ─── Funil de leads ─────────────────────────────────────────── */
.leads-funil {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 10px;
  margin-bottom: 20px;
}
@media (max-width: 1000px) { .leads-funil { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 600px)  { .leads-funil { grid-template-columns: repeat(2, 1fr); } }
.funil-bloco {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 12px;
  border-top: 3px solid;
  cursor: pointer;
  transition: transform .15s, background .15s;
}
.funil-bloco:hover { background: var(--bg-3); transform: translateY(-1px); }
.funil-bloco.ativo { background: var(--bg-3); }
.funil-bloco span {
  font-size: 11px;
  color: var(--text-3);
  text-transform: uppercase;
  letter-spacing: .5px;
}
.funil-bloco strong {
  display: block;
  font-size: 22px;
  margin-top: 4px;
}

/* ─── Lista de leads ─────────────────────────────────────────── */
.leads-lista {
  display: flex; flex-direction: column;
  gap: 10px;
}
.lead-card {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 14px;
  align-items: center;
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-left: 4px solid;
  border-radius: var(--radius-sm);
  padding: 14px 18px;
  cursor: pointer;
  transition: all .15s;
}
.lead-card:hover { background: var(--bg-3); transform: translateX(2px); }
.lead-info strong { font-size: 14px; }
.lead-info small { color: var(--text-3); font-size: 12px; display: block; margin-top: 2px; }
.lead-ativo {
  font-size: 12px;
  color: var(--text-2);
  text-align: right;
}
.lead-ativo code {
  background: var(--bg-0);
  padding: 2px 6px;
  border-radius: 3px;
  font-size: 10px;
}
.lead-data { font-size: 11px; color: var(--text-3); white-space: nowrap; }

/* ─── Modal lead ─────────────────────────────────────────────── */
.lead-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
@media (max-width: 800px) { .lead-grid { grid-template-columns: 1fr; } }
.lead-col h3 {
  font-size: 13px;
  color: var(--text-2);
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 12px;
}
.form-vertical { display: flex; flex-direction: column; gap: 8px; }
.form-vertical label {
  font-size: 11px;
  color: var(--text-3);
  text-transform: uppercase;
  letter-spacing: .5px;
  margin-top: 6px;
}
.form-vertical input, .form-vertical select, .form-vertical textarea {
  background: var(--bg-0);
  border: 1px solid var(--border-strong);
  border-radius: 6px;
  padding: 9px 12px;
  font-size: 13px;
  outline: none;
  font-family: inherit;
}
.form-vertical input:focus, .form-vertical select:focus, .form-vertical textarea:focus {
  border-color: var(--primary);
}
.form-vertical textarea { resize: vertical; min-height: 60px; }
.form-vertical textarea.textarea-grande {
  min-height: 160px;
  font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  font-size: 12px;
  line-height: 1.6;
  background: var(--bg-2);
  white-space: pre-wrap;
}
.form-2col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

/* Nova interação */
.nova-interacao {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 16px;
}
.nova-interacao select, .nova-interacao textarea {
  background: var(--bg-0);
  border: 1px solid var(--border-strong);
  border-radius: 6px;
  padding: 8px 12px;
  font-size: 13px;
  outline: none;
  font-family: inherit;
}
.nova-interacao .btn { width: auto; margin: 0; padding: 8px 16px; align-self: flex-end; }

.lista-interacoes {
  display: flex; flex-direction: column;
  gap: 8px;
  max-height: 420px;
  overflow-y: auto;
}
.interacao-item {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-left: 3px solid var(--primary);
  border-radius: 6px;
  padding: 10px 12px;
}
.interacao-item .head {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 4px;
  font-size: 11px;
  color: var(--text-3);
}
.interacao-item .head strong { color: var(--text); font-size: 12px; }
.interacao-item .corpo {
  font-size: 13px;
  color: var(--text-2);
  white-space: pre-wrap;
}

.btn-link-excluir { color: var(--red); }
.btn-link-excluir:hover { color: #fca5a5; }

/* ═══════════════ MARKETING IA ═══════════════════════════════ */
.marketing-lista {
  display: flex; flex-direction: column;
  gap: 16px;
}
.mkt-bloco {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 0;
  overflow: hidden;
}
.mkt-bloco-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 18px;
  background: var(--bg-3);
  border-bottom: 1px solid var(--border);
}
.mkt-bloco-head .mkt-titulo {
  display: flex; align-items: center; gap: 10px;
}
.mkt-thumb {
  width: 40px; height: 40px;
  object-fit: cover;
  border-radius: 6px;
  background: var(--bg-0);
}
.mkt-thumb-vazio {
  width: 40px; height: 40px;
  border-radius: 6px;
  background: var(--bg-0);
  display: flex; align-items: center; justify-content: center;
  color: var(--text-3); font-size: 18px;
}
.mkt-titulo strong { display: block; font-size: 14px; }
.mkt-titulo small { font-size: 11px; color: var(--text-3); font-family: ui-monospace, monospace; }
.mkt-acoes { display: flex; gap: 8px; }

.mkt-corpo { padding: 14px 18px; }
.mkt-secao { margin-bottom: 14px; }
.mkt-secao:last-child { margin-bottom: 0; }
.mkt-secao-head {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 8px;
}
.mkt-secao-head h4 {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--text-2);
  margin: 0;
}
.mkt-conteudo {
  background: var(--bg-0);
  border: 1px solid var(--border);
  border-left: 3px solid var(--primary);
  border-radius: 6px;
  padding: 12px 14px;
  font-size: 13px;
  line-height: 1.55;
  white-space: pre-wrap;
  color: var(--text-2);
  font-family: ui-monospace, "SF Mono", monospace;
  max-height: 320px;
  overflow-y: auto;
}
.mkt-conteudo.copywriter { border-left-color: var(--accent); }

.mkt-status {
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .5px;
  padding: 3px 8px;
  border-radius: 999px;
}
.mkt-status.sucesso     { background: rgba(16,185,129,.15); color: var(--green); }
.mkt-status.publicado   { background: rgba(58,160,173,.15); color: var(--primary); }
.mkt-status.executando  { background: rgba(245,158,11,.15); color: var(--yellow); }
.mkt-status.falha       { background: rgba(239,68,68,.15);  color: var(--red); }
.mkt-status.pendente    { background: rgba(107,114,128,.15); color: var(--text-3); }

.mkt-meta {
  font-size: 11px;
  color: var(--text-3);
  display: flex; gap: 12px; flex-wrap: wrap;
  margin-top: 8px;
}

.btn-mini {
  padding: 6px 12px;
  font-size: 12px;
  background: var(--bg-0);
  border: 1px solid var(--border-strong);
  border-radius: 6px;
  color: var(--text-2);
  cursor: pointer;
}
.btn-mini:hover { background: var(--bg-3); color: var(--text); }
.btn-mini.primario { background: var(--primary); color: #fff; border-color: var(--primary); }
.btn-mini.primario:hover { background: var(--primary-h); }
.btn-mini.copiar  { background: var(--accent); color: #fff; border-color: var(--accent); }
.btn-mini.copiar:hover { background: var(--accent-h); }

/* Botão de resumo IA */
.btn-secondary {
  background: linear-gradient(135deg, var(--accent), var(--accent-h));
  color: #fff;
  border: none;
  padding: 9px 18px;
  font-size: 13px;
  width: auto;
  margin: 0;
  cursor: pointer;
  border-radius: var(--radius-sm);
  font-weight: 600;
}
.btn-secondary:hover { background: linear-gradient(135deg, var(--accent-h), #8b5828); }
.btn-secondary:disabled { opacity: .6; cursor: wait; }

/* Mini variante pra rodapés de modal */
.btn-mini-modal { padding: 8px 14px; font-size: 12px; }

/* Badge "material pronto" na tabela de ativos */
.badge-mkt {
  display: inline-block;
  margin-left: 6px;
  padding: 2px 7px;
  border-radius: 999px;
  background: rgba(212,148,98,.15);
  border: 1px solid rgba(212,148,98,.4);
  color: var(--accent);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .3px;
  vertical-align: middle;
}
.badge-mkt[title]:hover { cursor: help; }

.resumo-ia-bloco {
  margin-bottom: 18px;
  display: flex; flex-direction: column; gap: 10px;
}
.resumo-ia-conteudo {
  background: linear-gradient(135deg, rgba(58,160,173,.08), rgba(212,148,98,.08));
  border: 1px solid rgba(58,160,173,.25);
  border-left: 3px solid var(--primary);
  border-radius: var(--radius-sm);
  padding: 14px 16px;
  font-size: 13px;
  line-height: 1.55;
  color: var(--text-2);
  white-space: pre-wrap;
  animation: fadeIn .25s;
}
.resumo-ia-conteudo .badge {
  display: inline-block;
  font-size: 10px;
  padding: 2px 8px;
  border-radius: 999px;
  margin-bottom: 8px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .5px;
}
.resumo-ia-conteudo .badge.ia { background: rgba(58,160,173,.2); color: var(--primary); }
.resumo-ia-conteudo .badge.fallback { background: rgba(245,158,11,.2); color: var(--yellow); }
@keyframes fadeIn { from { opacity: 0; transform: translateY(-4px); } }

/* Cor da borda do lead card por status (definida via inline style no JS) */

/* ─── Oportunidades — Kanban Market Intel ─────────────────────── */
.opo-kanban {
  display: grid;
  grid-template-columns: repeat(5, minmax(220px, 1fr));
  gap: 14px;
  margin-top: 16px;
  overflow-x: auto;
}
.opo-coluna {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  display: flex; flex-direction: column;
  min-height: 320px;
}
.opo-coluna-header {
  border-top: 4px solid var(--primary);
  border-top-left-radius: var(--radius);
  border-top-right-radius: var(--radius);
  padding: 12px 14px 10px;
  display: flex; justify-content: space-between; align-items: center;
  background: rgba(255,255,255,.02);
}
.opo-coluna-header strong {
  font-size: 13px;
  color: var(--text);
  letter-spacing: .2px;
}
.opo-coluna-count {
  background: var(--bg-3);
  color: var(--text-2);
  border-radius: 999px;
  padding: 2px 9px;
  font-size: 11px;
  font-weight: 700;
}
.opo-coluna-cards {
  padding: 10px;
  display: flex; flex-direction: column;
  gap: 10px;
  flex: 1;
}
.opo-vazio {
  text-align: center;
  color: var(--text-3);
  font-size: 11px;
  font-style: italic;
  padding: 28px 0;
}
.opo-card {
  background: var(--bg-1);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 11px 12px;
  display: flex; flex-direction: column;
  gap: 8px;
  cursor: pointer;
  transition: border-color .15s, transform .15s;
}
.opo-card:hover {
  border-color: var(--primary);
  transform: translateY(-1px);
}
.opo-card-top {
  display: flex; justify-content: space-between; align-items: center;
  gap: 6px;
}
.opo-tag-seg {
  background: rgba(212,148,98,.15);
  border: 1px solid rgba(212,148,98,.4);
  color: var(--accent);
  border-radius: 999px;
  padding: 2px 8px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .3px;
}
.opo-tag-urg {
  color: #fff;
  border-radius: 999px;
  padding: 2px 8px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .3px;
}
.opo-card-titulo {
  margin: 0;
  font-size: 13px;
  font-weight: 700;
  color: var(--text);
  line-height: 1.3;
}
.opo-card-precos {
  display: flex; gap: 12px;
  font-size: 11px;
}
.opo-card-precos span {
  display: flex; flex-direction: column;
}
.opo-card-precos small {
  color: var(--text-3);
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: .5px;
}
.opo-card-precos strong { color: var(--text); font-size: 12px; }
.opo-card-precos .opo-margem strong { color: var(--green, #3ec47a); }
.opo-card-sinais {
  margin: 0;
  font-size: 11px;
  color: var(--yellow, #f1c40f);
  font-style: italic;
  line-height: 1.35;
}
.opo-card-fonte {
  margin: 0;
  font-size: 10px;
  color: var(--text-3);
}
.opo-card-acoes {
  display: flex; flex-wrap: wrap; gap: 5px;
  margin-top: 2px;
}
.opo-card-acao,
.opo-card-copiar-msg {
  background: var(--bg-3);
  border: 1px solid var(--border);
  color: var(--text-2);
  padding: 4px 8px;
  font-size: 10px;
  border-radius: 999px;
  cursor: pointer;
  font-weight: 600;
}
.opo-card-acao:hover,
.opo-card-copiar-msg:hover {
  background: var(--primary);
  color: #fff;
  border-color: var(--primary);
}
.opo-card-acao:disabled,
.opo-card-copiar-msg:disabled { opacity: .5; cursor: wait; }

/* V2: badge "link verificado" e botão "ver anúncio" */
.opo-card-verificado {
  border-left: 3px solid #3ec47a;
  background: linear-gradient(180deg, rgba(62,196,122,.04), transparent 50%);
}
.opo-badge-verif {
  display: inline-block;
  background: rgba(62,196,122,.18);
  border: 1px solid rgba(62,196,122,.5);
  color: #3ec47a;
  border-radius: 999px;
  padding: 1px 7px;
  font-size: 9px;
  font-weight: 700;
  margin-left: 6px;
  letter-spacing: .3px;
}
.opo-card-link {
  background: #3ec47a;
  color: #fff !important;
  text-decoration: none !important;
  padding: 5px 12px;
  font-size: 11px;
  border-radius: 999px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  transition: background .15s;
}
.opo-card-link:hover { background: #2da661; }

/* V3: Cards de LEILÃO (caçador de leilões) */
.opo-card-leilao {
  border-left: 4px solid #ff9a00 !important;
  background: linear-gradient(180deg, rgba(255,154,0,.06), transparent 60%);
}
.opo-leilao-banner {
  display: flex; justify-content: space-between; align-items: center;
  background: linear-gradient(90deg, #ff9a00, #e67e22);
  color: #fff;
  padding: 6px 10px;
  border-radius: var(--radius-sm);
  margin-bottom: 8px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .3px;
}
.opo-leilao-casa { text-transform: uppercase; }
.opo-leilao-countdown {
  background: rgba(0,0,0,.25);
  padding: 2px 8px;
  border-radius: 999px;
  font-variant-numeric: tabular-nums;
}
.opo-card-avaliar {
  background: linear-gradient(135deg, #b07338, #d49a00);
  border: none;
  color: #fff;
  padding: 5px 11px;
  font-size: 11px;
  font-weight: 700;
  border-radius: 999px;
  cursor: pointer;
  transition: transform .1s, box-shadow .1s;
}
.opo-card-avaliar:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 10px rgba(212,154,0,.4);
}
.opo-card-avaliar:disabled { opacity: .6; cursor: wait; transform: none; }

/* V3 Polish: botão Modo Leilões ativo */
.btn.active-mode {
  background: linear-gradient(135deg, #ff9a00, #e67e22) !important;
  color: #fff !important;
  border-color: transparent !important;
  box-shadow: 0 4px 12px rgba(255,154,0,.3);
}

/* ════════════════════════════════════════════════════════════════
 * 🚀 DISTRIBUIDOR INTELIGENTE
 * ════════════════════════════════════════════════════════════════ */
.distr-topbar {
  background: linear-gradient(135deg, #1a1f2e 0%, #2d1a08 100%);
  border: 1px solid #B07338;
  border-radius: 12px;
  padding: 24px;
  margin-bottom: 24px;
}
.distr-topbar h2 { margin: 0 0 8px; color: #fff; font-size: 24px; }
.distr-topbar .muted { color: #c4a87a; margin: 0 0 16px; font-size: 14px; }
.distr-acoes-topo { display: flex; gap: 12px; flex-wrap: wrap; }

.distr-secao { margin-bottom: 32px; }
.distr-secao h3 {
  color: #B07338; border-bottom: 1px solid #2a2f3e;
  padding-bottom: 8px; margin-bottom: 16px; font-size: 16px;
}

.distr-cards-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 16px;
}

.distr-canal-card {
  background: #14181f; border: 1px solid #2a2f3e; border-radius: 10px;
  padding: 16px; transition: all .2s;
}
.distr-canal-card.ativo { border-left: 3px solid #4ade80; }
.distr-canal-card.inativo { border-left: 3px solid #6b7280; opacity: 0.7; }
.distr-canal-card:hover { transform: translateY(-2px); border-color: #B07338; }

.distr-canal-header {
  display: flex; justify-content: space-between; align-items: center;
  gap: 8px; margin-bottom: 8px;
}
.distr-canal-header strong { color: #fff; font-size: 15px; }
.distr-canal-meta {
  display: flex; gap: 12px; font-size: 12px; color: #8b95a7;
  margin-bottom: 8px; flex-wrap: wrap;
}
.distr-canal-notas {
  font-size: 12px; color: #c4a87a; margin: 8px 0;
  padding: 6px 10px; background: rgba(176, 115, 56, 0.08);
  border-radius: 6px;
}
.distr-canal-stats {
  display: flex; gap: 12px; font-size: 11px; color: #6b7280;
  margin: 8px 0;
}
.distr-canal-link { margin: 12px 0 8px; font-size: 13px; }
.distr-canal-link a { color: #4ade80; text-decoration: none; }
.distr-canal-link a:hover { text-decoration: underline; }
.canal-sem-link { color: #f59e0b; }

.distr-canal-acoes { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
.btn-pequeno { padding: 6px 12px; font-size: 12px; }

/* Modal Overlay — usado pelo Distribuidor (compat com admin antigo) */
.modal-overlay {
  position: fixed; inset: 0;
  background: rgba(0, 0, 0, 0.7);
  display: flex; align-items: center; justify-content: center;
  z-index: 9999; padding: 20px;
  animation: fadeIn 0.2s ease-out;
}
@keyframes fadeIn { from { opacity: 0 } to { opacity: 1 } }
.modal-conteudo {
  background: #14181f; border: 1px solid #2a2f3e; border-radius: 12px;
  padding: 28px; max-width: 560px; width: 100%;
  max-height: 90vh; overflow-y: auto;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6);
}
.modal-conteudo h2 {
  color: #fff; margin: 0 0 20px;
  font-size: 20px; border-bottom: 1px solid #2a2f3e; padding-bottom: 12px;
}
.modal-conteudo form { display: flex; flex-direction: column; gap: 4px; }
.modal-conteudo label {
  font-size: 12px; color: #c4a87a; margin-top: 12px;
  font-weight: 600; text-transform: uppercase; letter-spacing: 0.4px;
}
.modal-conteudo input[type="text"],
.modal-conteudo input[type="url"],
.modal-conteudo input[type="number"],
.modal-conteudo input:not([type]),
.modal-conteudo select,
.modal-conteudo textarea {
  background: #0e1219; border: 1px solid #2a2f3e; border-radius: 6px;
  padding: 10px 12px; color: #d4dae4; font-size: 14px;
  font-family: inherit; width: 100%;
}
.modal-conteudo input:focus, .modal-conteudo select:focus, .modal-conteudo textarea:focus {
  outline: none; border-color: #B07338; box-shadow: 0 0 0 2px rgba(176, 115, 56, 0.2);
}
.modal-conteudo label:has(input[type="checkbox"]) {
  display: flex; align-items: center; gap: 8px; text-transform: none;
  font-size: 14px; color: #d4dae4; margin-top: 16px; cursor: pointer;
}
.modal-conteudo input[type="checkbox"] { width: auto; margin: 0; }
.modal-acoes {
  display: flex; gap: 12px; justify-content: flex-end;
  margin-top: 24px; padding-top: 20px; border-top: 1px solid #2a2f3e;
}
.modal-grande .modal-conteudo { max-width: 900px; max-height: 90vh; overflow-y: auto; }
.distr-resumo { color: #4ade80; font-weight: 600; margin: 12px 0 20px; }
.distr-mensagens-lista { display: flex; flex-direction: column; gap: 20px; }
.distr-msg-card {
  background: #0e1219; border: 1px solid #2a2f3e;
  border-radius: 10px; padding: 16px;
}
.distr-msg-header {
  display: flex; justify-content: space-between;
  margin-bottom: 12px; align-items: center;
}
.distr-msg-texto {
  width: 100%; background: #1a1f2e; color: #d4dae4;
  border: 1px solid #2a2f3e; border-radius: 6px;
  padding: 12px; font-family: 'Courier New', monospace;
  font-size: 13px; line-height: 1.5; resize: vertical;
}
.distr-msg-acoes {
  display: flex; gap: 8px; margin-top: 10px;
  align-items: center; flex-wrap: wrap;
}
.btn-sucesso { background: #4ade80 !important; color: #064e3b !important; }
.aviso-pequeno { font-size: 11px; color: #f59e0b; }

.badge {
  background: rgba(176, 115, 56, 0.15); color: #B07338;
  padding: 2px 8px; border-radius: 10px; font-size: 10px;
  font-weight: 600; text-transform: uppercase;
}

/* ════════════════════════════════════════════════════════════════
 * 🎯 DISPARO EM MASSA
 * ════════════════════════════════════════════════════════════════ */
.dm-canais-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 6px;
  margin: 8px 0;
}
.dm-canal-item {
  background: #0e1219; border: 1px solid #2a2f3e; border-radius: 6px;
  padding: 8px 10px; display: flex; align-items: center; gap: 8px;
  cursor: pointer; transition: all .15s; font-size: 13px; color: #d4dae4;
}
.dm-canal-item:hover { border-color: #B07338; background: rgba(176, 115, 56, 0.05); }
.dm-canal-item input { margin: 0; cursor: pointer; }
.dm-canal-item small { font-size: 10px; opacity: .7; }
.dm-fb-aviso {
  background: rgba(245, 158, 11, 0.08); border: 1px solid rgba(245, 158, 11, 0.3);
  border-radius: 8px; padding: 14px; margin-top: 12px;
}
.dm-fb-aviso a { color: #B07338; text-decoration: underline; }
.dm-fb-aviso .muted { font-size: 11px; margin: 4px 0 0; }
.aviso-pequeno {
  font-size: 11px; color: #f59e0b; padding: 6px 10px;
  background: rgba(245, 158, 11, 0.08); border-radius: 4px;
}
.aviso-pequeno a { color: #f59e0b; text-decoration: underline; }

/* ════════════════════════════════════════════════════════════════
 * 🔌 META CONEXÕES (OAuth Facebook + Instagram)
 * ════════════════════════════════════════════════════════════════ */
.meta-conexoes-topbar {
  background: linear-gradient(135deg, #1a1f2e 0%, #2d1a08 100%);
  border: 1px solid #B07338; border-radius: 12px;
  padding: 20px; margin-bottom: 20px;
}
.meta-conexoes-topbar h2 { margin: 0 0 6px; color: #fff; font-size: 22px; }
.meta-conexoes-topbar p.muted { margin: 0 0 12px; }
.meta-app-status {
  background: rgba(0,0,0,0.3); padding: 8px 14px; border-radius: 8px;
  font-size: 13px; display: inline-block;
}
.meta-loading { color: #8b95a7; padding: 30px; text-align: center; }

.meta-conexoes-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 16px;
}
.meta-conexao-card {
  background: #0e1219; border: 1px solid #2a2f3e; border-radius: 10px;
  padding: 18px; display: flex; flex-direction: column; gap: 12px;
  transition: all .2s;
}
.meta-conexao-card.conectado { border-left: 4px solid #4ade80; }
.meta-conexao-card.desconectado { border-left: 4px solid #6b7280; opacity: .85; }
.meta-conexao-card.stats-card { border-left: 4px solid #B07338; }
.meta-conexao-header {
  display: flex; gap: 12px; align-items: flex-start;
}
.meta-conexao-icone { font-size: 32px; }
.meta-conexao-header h3 { margin: 0 0 4px; color: #fff; font-size: 16px; }
.meta-conexao-header p { margin: 2px 0; font-size: 13px; color: #d4dae4; }
.meta-conexao-header p.muted { color: #8b95a7; font-size: 12px; }
.meta-conexao-acoes {
  display: flex; gap: 8px; flex-wrap: wrap; margin-top: auto;
}
.meta-aviso {
  display: inline-block; padding: 4px 10px; border-radius: 6px;
  font-size: 11px; font-weight: 600;
}
.meta-aviso.ok { background: rgba(74,222,128,0.12); color: #4ade80; }
.meta-aviso.atencao { background: rgba(245,158,11,0.12); color: #f59e0b; }
.meta-aviso.erro { background: rgba(239,68,68,0.12); color: #ef4444; }
.meta-stats-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px;
  margin-top: 8px;
}
.meta-stats-grid div {
  display: flex; flex-direction: column; align-items: center;
  text-align: center; padding: 8px; background: #14181f; border-radius: 6px;
}
.meta-stats-grid strong { color: #fff; font-size: 14px; }
.meta-stats-grid small { color: #8b95a7; font-size: 10px; margin-top: 2px; }

/* ════════════════════════════════════════════════════════════════
 * 📤 DISTRIBUIR ATIVO — modal unificado + badges
 * ════════════════════════════════════════════════════════════════ */
.distr-opcoes-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 14px;
  margin-bottom: 20px;
}
.distr-opcao {
  background: #0e1219; border: 1px solid #2a2f3e; border-radius: 10px;
  padding: 16px; display: flex; flex-direction: column; gap: 8px;
  transition: all .2s;
}
.distr-opcao:hover { transform: translateY(-2px); border-color: #B07338; }
.distr-opcao-pronta { border-left: 3px solid #4ade80; }
.distr-opcao-esperando { border-left: 3px solid #f59e0b; opacity: .8; }
.distr-opcao-icone { font-size: 28px; }
.distr-opcao h3 { font-size: 15px; color: #fff; margin: 0; }
.distr-opcao p {
  color: #c4a87a; font-size: 12px; line-height: 1.5;
  margin: 0; flex: 1;
}
.distr-opcao code {
  background: #1a1f2e; color: #B07338;
  padding: 1px 5px; border-radius: 3px; font-size: 11px;
}
.distr-opcao .btn { text-decoration: none; margin-top: 6px; }
.status-tag {
  align-self: flex-start; padding: 3px 8px; border-radius: 10px;
  font-size: 10px; font-weight: 600; text-transform: uppercase;
}
.status-pronto { background: rgba(74, 222, 128, 0.15); color: #4ade80; }
.status-esperando { background: rgba(245, 158, 11, 0.15); color: #f59e0b; }

/* Badge de dias em estoque */
.badge-tempo {
  display: inline-block; padding: 2px 8px; border-radius: 10px;
  font-size: 10px; font-weight: 700; margin-left: 4px;
  vertical-align: middle;
}
.badge-tempo-ok      { background: rgba(74, 222, 128, 0.10); color: #4ade80;  border: 1px solid rgba(74, 222, 128, 0.3); }
.badge-tempo-atencao { background: rgba(245, 158, 11, 0.12); color: #f59e0b;  border: 1px solid rgba(245, 158, 11, 0.3); }
.badge-tempo-alerta  { background: rgba(239, 68, 68, 0.15);  color: #ef4444;  border: 1px solid rgba(239, 68, 68, 0.4);
                       animation: pulsoAlerta 1.5s ease-in-out infinite; }
@keyframes pulsoAlerta {
  0%, 100% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.4); }
  50%      { box-shadow: 0 0 0 4px rgba(239, 68, 68, 0); }
}

/* Botão Distribuir na tabela */
.btn-link.btn-distribuir {
  color: #B07338;
}
.btn-link.btn-distribuir:hover { color: #f59e0b; }

/* ════════════════════════════════════════════════════════════════
 * 💰 CUSTOS DO ATIVO
 * ════════════════════════════════════════════════════════════════ */
.custos-secao { margin: 16px 0; }
.custos-loading { color: #8b95a7; padding: 20px; text-align: center; }
.custos-resumo-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}
.custos-kpi {
  background: #0e1219; border: 1px solid #2a2f3e; border-radius: 8px;
  padding: 12px; display: flex; flex-direction: column; gap: 4px;
}
.custos-kpi small { color: #8b95a7; font-size: 11px; text-transform: uppercase; letter-spacing: .4px; }
.custos-kpi strong { color: #fff; font-size: 18px; }
.custos-kpi em { color: #8b95a7; font-style: normal; font-size: 11px; }
.custos-kpi.destaque { border-color: #B07338; background: rgba(176, 115, 56, 0.08); }
.custos-acoes-topo {
  display: flex; gap: 8px; flex-wrap: wrap;
  margin-bottom: 12px; align-items: center;
}
.custos-acoes-topo .btn { text-decoration: none; }
.custos-tabela {
  width: 100%; border-collapse: collapse;
  background: #0e1219; border-radius: 8px; overflow: hidden;
}
.custos-tabela th {
  background: #1a1f2e; color: #B07338; font-size: 11px;
  text-align: left; padding: 8px 10px; text-transform: uppercase;
  letter-spacing: .4px;
}
.custos-tabela td {
  padding: 10px; color: #d4dae4; font-size: 13px;
  border-top: 1px solid #2a2f3e;
}
.custos-tabela td.valor { text-align: right; font-weight: 600; color: #fff; }
.custos-tabela td.vazio { text-align: center; color: #8b95a7; padding: 24px; font-style: italic; }
.custos-tabela tr:hover td { background: rgba(176, 115, 56, 0.05); }
.custos-tabela small.muted { color: #8b95a7; font-style: italic; }
.btn-icone {
  background: transparent; border: none; cursor: pointer;
  font-size: 14px; opacity: .6; transition: opacity .2s;
}
.btn-icone:hover { opacity: 1; }

/* V3 Polish: Banner de urgência temporal */
.opo-leiloes-banner {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 10px;
  margin: 14px 0;
  padding: 14px;
  background: linear-gradient(135deg, rgba(255,154,0,.06), rgba(212,154,0,.06));
  border: 1px solid rgba(255,154,0,.3);
  border-radius: var(--radius);
}
.opo-leiloes-kpi {
  background: var(--bg-2);
  border-radius: var(--radius-sm);
  padding: 12px;
  text-align: center;
}
.opo-leiloes-kpi-urgente {
  background: linear-gradient(135deg, #ff5e3a, #e74c3c);
  color: #fff;
}
.opo-leiloes-kpi-urgente .opo-leiloes-num,
.opo-leiloes-kpi-urgente .opo-leiloes-lbl { color: #fff; }
.opo-leiloes-kpi-desc { opacity: .7; }
.opo-leiloes-num {
  display: block;
  font-size: 28px;
  font-weight: 800;
  color: var(--accent);
  line-height: 1;
  margin-bottom: 4px;
}
.opo-leiloes-lbl {
  display: block;
  font-size: 11px;
  color: var(--text-2);
  text-transform: uppercase;
  letter-spacing: .3px;
}

/* V3 Polish: lista vertical de leilões (modo Próximos Pregões) */
.opo-leiloes-lista {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 12px;
}
.opo-leiloes-lista .opo-card {
  background: var(--bg-2);
}

/* V3 Polish: botão "Buscar no [casa]" — visual menos forte que link direto */
.opo-card-link-busca {
  background: var(--bg-3) !important;
  color: var(--text-2) !important;
  border: 1px dashed var(--border) !important;
}
.opo-card-link-busca:hover {
  background: var(--bg-1) !important;
  color: var(--text) !important;
}

.vazio-grande {
  grid-column: 1 / -1;
  text-align: center;
  padding: 60px 30px;
  background: var(--bg-2);
  border: 1px dashed var(--border);
  border-radius: var(--radius);
  color: var(--text-2);
}
.vazio-grande h3 {
  margin: 0 0 8px;
  color: var(--text);
}
.vazio-grande p { margin: 4px 0; font-size: 13px; }

@media (max-width: 1200px) {
  .opo-kanban { grid-template-columns: repeat(3, minmax(220px, 1fr)); }
}
@media (max-width: 700px) {
  .opo-kanban { grid-template-columns: 1fr; }
}

/* ─── Painel IA & Custos (Polish #3) ──────────────────────────── */
.painel-secao-titulo {
  margin: 30px 0 12px;
  font-size: 14px;
  color: var(--text);
  font-weight: 700;
  letter-spacing: .3px;
  border-bottom: 1px solid var(--border);
  padding-bottom: 8px;
}
.painel-secao-titulo:first-of-type { margin-top: 18px; }

.painel-agentes-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
}
.painel-agente-card {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-left: 3px solid var(--primary);
  border-radius: var(--radius-sm);
  padding: 14px;
}
.painel-agente-card header {
  display: flex; align-items: center; gap: 8px;
  margin-bottom: 10px;
}
.painel-agente-icone { font-size: 18px; }
.painel-agente-card dl {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 4px 12px;
  margin: 0;
  font-size: 12px;
}
.painel-agente-card dt { color: var(--text-3); }
.painel-agente-card dd { margin: 0; color: var(--text-2); text-align: right; }
.painel-agente-card dd strong { color: var(--accent); }

.painel-segmentos {
  display: flex; flex-direction: column;
  gap: 10px;
}
.painel-segmento-linha {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 12px 14px;
}
.painel-segmento-cabeca {
  display: flex; align-items: center;
  gap: 14px;
  margin-bottom: 6px;
  font-size: 13px;
}
.painel-segmento-cabeca span { flex: 1; color: var(--text); font-weight: 600; }
.painel-segmento-cabeca strong { color: #3ec47a; font-size: 14px; }
.painel-segmento-cabeca small { color: var(--text-3); font-size: 11px; }
.painel-segmento-barra {
  height: 6px;
  background: var(--bg-3);
  border-radius: 999px;
  overflow: hidden;
}
.painel-segmento-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--primary), var(--accent));
  border-radius: 999px;
  transition: width .3s;
}

.painel-ciclos { overflow-x: auto; }
.painel-ciclos code {
  background: var(--bg-3);
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 11px;
}

.painel-saude {
  display: flex; flex-direction: column;
  gap: 8px;
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 14px 16px;
}
.painel-saude-linha {
  display: flex; align-items: center; gap: 10px;
  font-size: 13px;
  color: var(--text-2);
}
.painel-saude-dot {
  width: 10px; height: 10px;
  border-radius: 50%;
  display: inline-block;
}
.painel-saude-dot.ok    { background: #3ec47a; box-shadow: 0 0 8px rgba(62,196,122,.6); }
.painel-saude-dot.warn  { background: #f1c40f; box-shadow: 0 0 8px rgba(241,196,15,.6); }
.painel-saude-dot.error { background: #e74c3c; box-shadow: 0 0 8px rgba(231,76,60,.6); }

/* ─── Avaliador de Ofertas (Fase Eta) ─────────────────────────── */
.avaliador-intro {
  background: linear-gradient(135deg, rgba(58,160,173,.08), rgba(212,148,98,.08));
  border: 1px solid rgba(58,160,173,.25);
  border-left: 3px solid var(--primary);
  border-radius: var(--radius-sm);
  padding: 12px 16px;
  margin-bottom: 18px;
  font-size: 13px;
  color: var(--text-2);
}
.avaliador-form {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 18px;
  display: flex; flex-direction: column;
  gap: 14px;
}
.avaliador-linha {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 12px;
}
.avaliador-form label {
  display: flex; flex-direction: column;
  gap: 4px;
  font-size: 11px;
  color: var(--text-3);
  text-transform: uppercase;
  letter-spacing: .3px;
  font-weight: 600;
}
.avaliador-form input,
.avaliador-form select,
.avaliador-form textarea {
  background: var(--bg-1);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  color: var(--text);
  padding: 9px 11px;
  font-size: 13px;
  font-family: inherit;
  text-transform: none;
}
.avaliador-form input:focus,
.avaliador-form select:focus,
.avaliador-form textarea:focus {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 2px rgba(58,160,173,.2);
}
.avaliador-form textarea { resize: vertical; min-height: 70px; }
.avaliador-checkbox {
  flex-direction: row !important;
  align-items: center;
  font-size: 12px !important;
  color: var(--text-2) !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  font-weight: 500 !important;
  gap: 8px !important;
}
.avaliador-checkbox input { width: auto; }
.avaliador-acoes {
  display: flex; align-items: center; gap: 12px;
  margin-top: 4px;
}

.avaliador-resultado {
  margin-top: 24px;
}

.av-veredito-card {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-left: 5px solid var(--primary);
  border-radius: var(--radius);
  padding: 18px 22px;
  margin-bottom: 18px;
}
.av-veredito-cabeca {
  display: flex; align-items: center; gap: 14px;
  margin-bottom: 8px;
}
.av-veredito-icone { font-size: 36px; }
.av-veredito-cabeca small {
  display: block;
  font-size: 10px;
  color: var(--text-3);
  text-transform: uppercase;
  letter-spacing: 1px;
}
.av-veredito-cabeca strong {
  font-size: 24px;
  font-weight: 800;
  letter-spacing: .5px;
}
.av-justificativa {
  margin: 8px 0 12px;
  font-size: 14px;
  line-height: 1.55;
  color: var(--text);
}
.av-alerta-positivo,
.av-alerta-neutro,
.av-alerta-negativo {
  padding: 10px 14px;
  border-radius: var(--radius-sm);
  font-size: 13px;
  margin-top: 8px;
  border-left: 3px solid;
}
.av-alerta-positivo { background: rgba(62,196,122,.1); border-color: #3ec47a; color: #3ec47a; }
.av-alerta-neutro   { background: rgba(241,196,15,.1); border-color: #f1c40f; color: #d4a300; }
.av-alerta-negativo { background: rgba(231,76,60,.1); border-color: #e74c3c; color: #e74c3c; font-weight: 600; }

.av-lista { margin: 0; padding-left: 18px; }
.av-lista li {
  font-size: 13px;
  color: var(--text-2);
  margin-bottom: 6px;
  line-height: 1.45;
}
.av-lista-riscos li { color: var(--yellow, #d4a300); }

.av-manutencoes {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
}
.av-manutencao-card {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 12px 14px;
  display: flex; flex-direction: column;
  gap: 4px;
}
.av-manutencao-card[data-prio="alta"]  { border-left: 3px solid #e74c3c; }
.av-manutencao-card[data-prio="media"] { border-left: 3px solid #f1c40f; }
.av-manutencao-card[data-prio="baixa"] { border-left: 3px solid #3ec47a; }
.av-manutencao-card strong { font-size: 13px; color: var(--text); }
.av-custo { font-size: 14px; color: var(--accent); font-weight: 700; }
.av-prioridade {
  font-size: 10px; text-transform: uppercase;
  font-weight: 700; letter-spacing: .3px;
  align-self: flex-start;
  padding: 2px 7px; border-radius: 999px;
}
.av-prio-alta  { background: rgba(231,76,60,.2); color: #e74c3c; }
.av-prio-media { background: rgba(241,196,15,.2); color: #d4a300; }
.av-prio-baixa { background: rgba(62,196,122,.2); color: #3ec47a; }

.av-manutencao-total {
  grid-column: 1 / -1;
  display: flex; justify-content: space-between;
  padding: 12px 14px;
  background: var(--bg-3);
  border-radius: var(--radius-sm);
  font-size: 14px;
  margin-top: 4px;
}
.av-manutencao-total span { color: var(--accent); font-weight: 700; }

.av-rodape {
  margin-top: 22px;
  font-size: 11px;
  color: var(--text-3);
  text-align: center;
  font-style: italic;
}

.avaliador-historico { overflow-x: auto; }
.av-historico-linha { cursor: pointer; transition: background .15s; }
.av-historico-linha:hover { background: var(--bg-3); }

/* ═══════════════════════════════════════════════════════════════
   Cockpit Social (Fase Delta — Redes Sociais)
   ═══════════════════════════════════════════════════════════════ */
.rs-intro {
  background: linear-gradient(135deg, rgba(58,160,173,.08), rgba(212,148,98,.08));
  border: 1px solid rgba(58,160,173,.25);
  border-left: 3px solid var(--primary);
  border-radius: var(--radius-sm);
  padding: 12px 16px;
  margin-bottom: 14px;
  font-size: 13px;
}
.rs-meta-status {
  margin-top: 6px;
  font-size: 12px;
  color: var(--text-2);
}
.rs-tabs {
  display: flex; flex-wrap: wrap; gap: 4px;
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 4px;
  margin-bottom: 16px;
}
.rs-tab {
  background: transparent;
  border: none;
  color: var(--text-2);
  padding: 9px 14px;
  font-size: 12px;
  font-weight: 600;
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: all .15s;
}
.rs-tab:hover { background: var(--bg-3); color: var(--text); }
.rs-tab.active {
  background: var(--primary);
  color: #fff;
}
.rs-panel { animation: fadeIn .2s; }
.rs-form-bloco {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 14px;
  margin-bottom: 16px;
  display: flex; flex-direction: column;
  gap: 10px;
}
.rs-form-bloco label {
  display: flex; flex-direction: column;
  gap: 4px;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .3px;
  color: var(--text-3);
}
.rs-form-bloco input,
.rs-form-bloco select,
.rs-form-bloco textarea {
  background: var(--bg-1);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  color: var(--text);
  padding: 8px 10px;
  font-size: 13px;
  text-transform: none;
}

/* Cards de post gerado */
.rs-post-card {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-left: 3px solid var(--accent);
  border-radius: var(--radius-sm);
  padding: 14px 16px;
  margin-bottom: 12px;
}
.rs-post-card header {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 8px;
}
.rs-post-horario {
  font-size: 11px;
  color: var(--text-3);
  background: var(--bg-3);
  padding: 2px 8px;
  border-radius: 999px;
}
.rs-post-copy {
  background: var(--bg-1);
  padding: 10px 12px;
  border-radius: var(--radius-sm);
  font-size: 13px;
  line-height: 1.5;
  white-space: pre-wrap;
  margin: 6px 0;
}
.rs-post-cta { font-size: 12px; color: var(--accent); font-weight: 600; }
.rs-post-hash { font-size: 11px; color: var(--primary); }
.rs-post-acoes { margin-top: 8px; }

/* Calendário */
.rs-calendario .rs-tipo {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
}
.rs-tipo-ativo     { background: rgba(58,160,173,.2); color: var(--primary); }
.rs-tipo-educativo { background: rgba(241,196,15,.2); color: #d4a300; }
.rs-tipo-bastidor  { background: rgba(155,92,217,.2); color: #9b5cd9; }

/* Templates DM */
.rs-template-card {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 12px 14px;
  margin-bottom: 8px;
}
.rs-template-card header {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 6px;
}
.rs-tmpl-cat {
  font-size: 10px;
  background: var(--bg-3);
  color: var(--text-3);
  padding: 2px 7px;
  border-radius: 999px;
  text-transform: uppercase;
}
.rs-tmpl-resposta {
  background: var(--bg-1);
  padding: 8px 10px;
  border-radius: var(--radius-sm);
  font-size: 12px;
  line-height: 1.4;
  margin: 4px 0 6px;
}
.rs-template-card footer {
  display: flex; justify-content: space-between; align-items: center;
}
.rs-tmpl-usos { font-size: 10px; color: var(--text-3); }

/* Prospects */
.rs-prospect-card {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 12px 14px;
  margin-bottom: 8px;
}
.rs-prospect-card[data-score="alto"]  { border-left: 3px solid #3ec47a; }
.rs-prospect-card[data-score="medio"] { border-left: 3px solid #f1c40f; }
.rs-prospect-card[data-score="baixo"] { border-left: 3px solid #7b8497; }
.rs-prospect-card header {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 4px;
}
.rs-prospect-score {
  font-size: 11px; font-weight: 700;
  background: var(--bg-3);
  padding: 2px 8px;
  border-radius: 999px;
}
.rs-prospect-nome { font-size: 13px; color: var(--text); margin: 2px 0; }
.rs-prospect-bio { font-size: 12px; color: var(--text-2); font-style: italic; margin: 2px 0; }
.rs-prospect-meta { font-size: 11px; color: var(--text-3); }
.rs-prospect-notas { font-size: 12px; color: var(--text-2); margin-top: 4px; }
.rs-prospect-card footer {
  display: flex; justify-content: space-between; align-items: center;
  margin-top: 8px;
}
.rs-prospect-status {
  font-size: 10px; padding: 2px 7px;
  border-radius: 999px;
  text-transform: uppercase;
}
.rs-status-novo         { background: rgba(74,139,255,.2); color: #4a8bff; }
.rs-status-contatado    { background: rgba(155,92,217,.2); color: #9b5cd9; }
.rs-status-respondeu    { background: rgba(241,196,15,.2); color: #d4a300; }
.rs-status-lead_quente  { background: rgba(62,196,122,.2); color: #3ec47a; }
.rs-status-descartado   { background: rgba(123,132,151,.2); color: #7b8497; }

/* Inbox Copilot */
.rs-dm-card {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-left: 5px solid var(--primary);
  border-radius: var(--radius);
  padding: 14px 16px;
  margin: 14px 0;
}
.rs-dm-card header {
  display: flex; align-items: center; gap: 12px;
  margin-bottom: 8px;
}
.rs-dm-icone { font-size: 28px; }
.rs-dm-resposta {
  background: var(--bg-1);
  border-radius: var(--radius-sm);
  padding: 10px 12px;
  margin-top: 8px;
}
.rs-dm-resposta p { margin: 4px 0; font-size: 13px; line-height: 1.45; }
.rs-dm-acao { font-size: 12px; color: var(--accent); margin-top: 8px; }

/* ─── Responsivo ─────────────────────────────────────────────── */
@media (max-width: 900px) {
  #app { grid-template-columns: 1fr; }
  .sidebar {
    flex-direction: row;
    align-items: center;
    border-right: none;
    border-bottom: 1px solid var(--border);
    padding: 12px 14px;
    overflow-x: auto;
  }
  .brand { border: none; padding: 0; }
  .menu { flex-direction: row; flex: 1; }
  .menu-item { white-space: nowrap; }
  .user-card { grid-template-columns: 36px auto auto; }
  .conteudo { padding: 18px; max-height: none; }
  .tabela { font-size: 11px; }
  .tabela th, .tabela td { padding: 6px 8px; }
}