/* CRM · Leads › Lista: tabela de leads, colunas (reunião, temperatura, previsão, WhatsApp,
   venda, conclusão), tags, formulários de reunião, venda e recusa. */

/* Abas Leads / Métricas */

.tab-content[hidden] {
  display: none;
}

/* Célula com o número do Callbox + ícone de copiar */

.copy-btn {
  appearance: none;
  border: 1px solid var(--border);
  background: var(--surface2);
  border-radius: 6px;
  padding: 3px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: var(--muted);
  flex: none;
}

.copy-btn:hover {
  color: var(--primary);
  border-color: var(--primary);
}

.copy-btn svg {
  width: var(--ico);
  height: var(--ico);
}

.copy-btn.copied {
  color: var(--success);
  border-color: var(--success);
}

/* Ações do Social Seller (Atendeu ligação / Marcou reunião) */

@media (max-width: 980px) {
  .kpis {
    grid-template-columns: repeat(2, 1fr);
  }

  .charts-grid {
    grid-template-columns: 1fr;
  }
}

/* ── Filtros ─────────────────────────────────────────────────────── */
.filter-bar .c-input[type="search"],
.filter-bar .c-select[type="search"],
.filter-bar .c-textarea[type="search"] {
  min-width: 240px;
  flex: 1 1 240px;
}

.filter-bar .c-select {
  min-width: 150px;
}

/* ── Tabela ─────────────────────────────────────────────────────── */
.c-table-wrap tbody tr.lead-row {
  cursor: pointer;
}

.table-footer {
  padding: 10px 14px;
  font-size: 12px;
  color: var(--muted);
  border-top: 1px solid var(--border);
}

/* ── Painel lateral de detalhes ─────────────────────────────────── */

.detail-section {
  padding: 14px 0;
  border-bottom: 1px solid var(--border);
}

.detail-section:last-child {
  border-bottom: none;
}

.detail-section h3 {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.09em;
  color: var(--subtle);
  margin: 0 0 10px;
}

.detail-grid {
  display: grid;
  grid-template-columns: 170px 1fr;
  gap: 6px 12px;
  margin: 0;
  font-size: 13px;
}

.detail-grid dt {
  color: var(--muted);
}

.detail-grid dd {
  margin: 0;
  color: var(--text);
  word-break: break-word;
}

.detail-grid dd.empty {
  color: #b5b1a8;
}

.wa-card {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 10px 12px;
  margin-bottom: 8px;
  background: var(--surface2);
}

.wa-card .wa-title {
  font-weight: 700;
  font-size: 13px;
  margin-bottom: 6px;
}

.raw-json {
  font-size: 11px;
  background: var(--surface2);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 10px;
  max-height: 280px;
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-all;
}

@media (max-width: 640px) {
  .detail-grid {
    grid-template-columns: 1fr;
    gap: 2px;
  }

  .detail-grid dd {
    margin-bottom: 8px;
  }
}

/* ── Reunião: botão na tabela ───────────────────────────────────────── */
.meeting-btn {
  appearance: none;
  border: 1px dashed var(--border);
  background: var(--surface2);
  border-radius: 999px;
  padding: 5px 12px;
  font-size: 12px;
  font-weight: 700;
  color: var(--muted);
  cursor: pointer;
  white-space: nowrap;
}

.meeting-btn:hover {
  border-color: var(--primary);
  color: var(--primary);
}

.meeting-btn.scheduled {
  border-style: solid;
  border-color: var(--primary);
  background: var(--primary-soft);
  color: var(--primary);
}

.meeting-btn.scheduled.past {
  border-color: var(--border);
  background: var(--surface2);
  color: var(--muted);
}

.history-list {
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: 13px;
}

.history-list li {
  padding: 8px 0;
  border-bottom: 1px dashed var(--border);
}

.history-list li:last-child {
  border-bottom: none;
}

/* ── Modal de reunião ───────────────────────────────────────────────── */

.meeting-current {
  padding: 10px 12px;
  border-radius: 10px;
  background: var(--primary-soft);
  font-size: 13px;
}

.scheduled-at-line {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
}

.form-error {
  margin: 0;
  padding: 8px 12px;
  border-radius: 8px;
  background: #fbe9ec;
  color: #a13544;
  font-size: 13px;
}

/* ── Tags ───────────────────────────────────────────────────────────── */

.tags-cell {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  align-items: center;
  min-width: 90px;
  cursor: pointer;
  border-radius: 8px;
  padding: 2px;
}

.tags-cell:hover .tag-add,
.tags-cell:focus-visible .tag-add {
  color: var(--primary);
  border-color: var(--primary);
}

.tag-add {
  font-size: 11px;
  font-weight: 700;
  color: var(--muted);
  border: 1px dashed var(--border);
  border-radius: 999px;
  padding: 2px 8px;
  white-space: nowrap;
}

.tag-picker {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.tag-toggle {
  appearance: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  color: var(--tag-color);
  background: var(--surface2);
  border: 1px solid color-mix(in srgb, var(--tag-color) 40%, transparent);
}

.tag-toggle .tick {
  font-size: 12px;
}

.tag-toggle.on {
  background: var(--tag-color);
  border-color: var(--tag-color);
  color: #fff;
}

.tag-toggle:disabled {
  opacity: 0.6;
  cursor: wait;
}

.tag-create {
  border-top: 1px solid var(--border);
  padding-top: 14px;
}

.tag-create-row {
  display: flex;
  gap: 8px;
}

.tag-create-row .c-input,
.tag-create-row .c-select,
.tag-create-row .c-textarea {
  flex: 1;
}

.color-swatches {
  display: flex;
  gap: 8px;
}

.swatch {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 2px solid transparent;
  cursor: pointer;
  padding: 0;
}

.swatch.on {
  border-color: var(--text);
  box-shadow: 0 0 0 2px var(--surface-strong) inset;
}

/* ── CRM · Configurações ───────────────────────────────────────────── */
.settings-card {
  padding: 20px;
  margin-bottom: 16px;
}

.settings-card-head h2 {
  font-family: "Syne", sans-serif;
  font-size: 16px;
  margin: 0 0 4px;
}

.settings-card-head .meta {
  margin: 0 0 14px;
}

.settings-form {
  display: flex;
  align-items: flex-end;
  gap: 16px;
  flex-wrap: wrap;
}

.settings-form .c-field:first-child {
  flex: 1 1 240px;
}

.settings-form .field-preview {
  min-width: 140px;
}

.settings-form .color-swatches,
.settings-form .field-preview>div {
  min-height: 38px;
  display: flex;
  align-items: center;
}

.settings-card .form-error {
  margin-top: 12px;
}

.check-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--text);
  text-transform: none;
  letter-spacing: 0;
  font-weight: 500;
}

.row-actions {
  display: flex;
  align-items: center;
  gap: 4px;
  white-space: nowrap;
}

tr.row-inactive td {
  opacity: 0.6;
}

.settings-form .color-swatches {
  align-items: center;
}

/* ── Reunião realizada / potencial cliente ─────────────────────────── */
.meeting-btn.held {
  border-style: solid;
  border-color: var(--success);
  background: var(--success-soft);
  color: var(--success);
}

.potential-cell {
  appearance: none;
  border: none;
  background: none;
  padding: 2px;
  cursor: pointer;
  border-radius: 8px;
}

.potential-cell:hover .tag-add,
.potential-cell:focus-visible .tag-add {
  color: var(--primary);
  border-color: var(--primary);
}

.potential-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.potential-btn {
  appearance: none;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  padding: 10px 12px;
  border-radius: 10px;
  cursor: pointer;
  text-align: left;
  background: var(--surface2);
  border: 1px solid color-mix(in srgb, var(--tag-color) 40%, transparent);
  color: var(--tag-color);
}

.potential-btn strong {
  font-size: 14px;
}

.potential-btn span {
  font-size: 11px;
  color: var(--muted);
}

.potential-btn:hover {
  background: color-mix(in srgb, var(--tag-color) 8%, var(--surface2));
}

.potential-btn.on {
  background: var(--tag-color);
  border-color: var(--tag-color);
  color: #fff;
}

.potential-btn.on span {
  color: rgba(255, 255, 255, 0.85);
}

.potential-btn:disabled {
  opacity: 0.6;
  cursor: wait;
}

/* "Em Desenvolvimento": quinto botão, que abre as quatro temperaturas como tendência */
.potential-btn.potential-dev {
  grid-column: 1 / -1;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border-style: dashed;
  border-color: color-mix(in srgb, var(--tag-color) 55%, transparent);
}

.potential-btn.potential-dev .t {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
}

.potential-btn.potential-dev .cv {
  display: inline-flex;
  color: inherit;
  opacity: 0.8;
}

.potential-btn.potential-dev .cv svg {
  width: var(--ico-only);
  height: var(--ico-only);
  transition: transform 0.15s ease;
}

.potential-btn.potential-dev.on {
  border-style: solid;
  border-radius: 10px 10px 0 0;
}

.potential-btn.potential-dev.on .cv {
  color: #fff;
}

.potential-btn.potential-dev.on .cv svg {
  transform: rotate(180deg);
}

.potential-trend {
  grid-column: 1 / -1;
  display: flex;
  flex-direction: column;
  gap: 7px;
  margin-top: -8px;
  padding: 10px 10px 11px;
  border: 1px solid #6044b8;
  border-top: 0;
  border-radius: 0 0 10px 10px;
  background: color-mix(in srgb, #6044b8 6%, #fff);
}

.potential-trend-label {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: #6044b8;
}

.potential-trend .opts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
}

.potential-trend .opts button {
  appearance: none;
  height: 32px;
  padding: 0 6px;
  border-radius: 8px;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
  cursor: pointer;
  background: #fff;
  border: 1px solid color-mix(in srgb, var(--tag-color) 45%, transparent);
  color: var(--tag-color);
}

.potential-trend .opts button:hover {
  background: color-mix(in srgb, var(--tag-color) 8%, #fff);
}

.potential-trend .opts button.on {
  background: var(--tag-color);
  border-color: var(--tag-color);
  color: #fff;
}

/* Expectativa de fechamento: "Nenhuma" */

.close-none {
  appearance: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  height: 38px;
  padding: 0 12px;
  border: 1px dashed var(--line-strong, #d9d4ca);
  border-radius: var(--r-ctl, 9px);
  background: #f6f3ee;
  font: inherit;
  font-size: 13.5px;
  color: var(--muted);
  text-align: left;
  cursor: pointer;
}

.close-none span {
  font-size: 12px;
  font-weight: 600;
  color: var(--primary);
}

.close-none:hover {
  border-color: var(--primary);
}

.close-none[hidden] {
  display: none;
}

.price-row {
  display: flex;
  gap: 8px;
  align-items: flex-end;
}

.price-row+.price-row {
  margin-top: 4px;
}

.price-row .c-input,
.price-row .c-select,
.price-row .c-textarea {
  flex: 1;
}

.price-field {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.notes-input {
  resize: vertical;
  min-height: 90px;
  font-family: inherit;
  line-height: 1.4;
}

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

.duration-preview>div {
  flex-wrap: wrap;
  gap: 6px;
}

.settings-updated {
  margin: 10px 0 0;
}

/* ── Previsão de fechamento ────────────────────────────────────────── */
.forecast-cell {
  appearance: none;
  border: none;
  background: none;
  padding: 2px;
  cursor: pointer;
  border-radius: 8px;
  white-space: nowrap;
}

.forecast-cell:hover .tag-add,
.forecast-cell:focus-visible .tag-add {
  color: var(--primary);
  border-color: var(--primary);
}

.history-reason {
  margin-top: 4px;
  font-size: 12px;
  color: var(--text);
}

.order-btn {
  appearance: none;
  border: 1px solid var(--border);
  background: var(--surface2);
  border-radius: 6px;
  width: 26px;
  height: 24px;
  font-size: 10px;
  color: var(--muted);
  cursor: pointer;
}

.order-btn:hover:not(:disabled) {
  color: var(--primary);
  border-color: var(--primary);
}

.order-btn:disabled {
  opacity: 0.35;
  cursor: default;
}

.inline-edit {
  display: flex;
  gap: 6px;
  align-items: center;
}

.inline-edit .c-input,
.inline-edit .c-select,
.inline-edit .c-textarea {
  min-width: 240px;
}

/* ── WhatsApp: marcação manual rápida ──────────────────────────────── */
.wa-toggles {
  display: flex;
  flex-wrap: nowrap;
  gap: 3px;
  margin-top: 4px;
}

.wa-toggle {
  appearance: none;
  border: 1px dashed var(--border);
  background: var(--surface2);
  border-radius: 999px;
  padding: 2px 8px;
  font-size: 11px;
  font-weight: 700;
  color: var(--muted);
  cursor: pointer;
  white-space: nowrap;
}

.wa-toggle:hover:not(:disabled) {
  border-color: var(--primary);
  color: var(--primary);
}

.wa-toggle.on {
  border-style: solid;
  border-color: var(--primary);
  background: var(--primary-soft);
  color: var(--primary);
}

.wa-toggle.auto {
  cursor: default;
  opacity: 0.75;
}

.wa-toggle:disabled:not(.auto) {
  opacity: 0.5;
  cursor: wait;
}

.wa-manual {
  margin-top: 10px;
}

/* ── Ajustes de layout ─────────────────────────────────────────────── */
/* Selects com seta própria e respiro horizontal (filtros e formulários). */

.wa-toggle {
  padding: 1px 6px;
  font-size: 10px;
  line-height: 1.5;
}

/* Reunião agendada: data e horário em duas linhas (menos largura na tabela). */
.meeting-btn.stacked {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 1px;
  border-radius: 10px;
  padding: 4px 10px;
  line-height: 1.2;
}

/* ── Vendas ────────────────────────────────────────────────────────── */

.sale-link {
  appearance: none;
  border: 1px dashed var(--border);
  background: none;
  border-radius: 999px;
  padding: 1px 8px;
  font-size: 11px;
  font-weight: 700;
  color: var(--muted);
  cursor: pointer;
  white-space: nowrap;
}

.sale-link:hover {
  border-color: var(--primary);
  color: var(--primary);
}

.sale-grid {
  display: grid;
  grid-template-columns: 1.4fr auto 1fr 1fr 1fr;
  gap: 12px;
  align-items: end;
}

.payments-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.payments-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.pay-row {
  display: grid;
  grid-template-columns: auto 140px 1fr 70px 1fr 110px 28px;
  gap: 6px;
  align-items: center;
  padding: 8px;
  border: 1px solid var(--border);
  border-left: 3px solid var(--success);
  border-radius: 10px;
  background: var(--surface2);
}

.pay-row.planned {
  border-left-color: var(--warning);
}

.pay-row .c-input,
.pay-row .c-select,
.pay-row .c-textarea {
  min-width: 0;
  width: 100%;
}

.pay-status {
  display: flex;
  border: 1px solid var(--border);
  border-radius: 8px;
  overflow: hidden;
}

.pay-status .seg {
  appearance: none;
  border: none;
  background: var(--surface-strong);
  padding: 6px 8px;
  font-size: 11px;
  font-weight: 700;
  color: var(--muted);
  cursor: pointer;
}

.pay-row.received .seg.on {
  background: var(--success);
  color: #fff;
}

.pay-row.planned .seg.on {
  background: var(--warning);
  color: #fff;
}

.pay-remove {
  appearance: none;
  border: none;
  background: none;
  font-size: 18px;
  color: var(--muted);
  cursor: pointer;
}

.pay-remove:disabled {
  opacity: 0.3;
  cursor: default;
}

.pay-equiv {
  grid-column: 3 / -1;
  display: flex;
  align-items: center;
  gap: 8px;
}

.pay-equiv .c-input,
.pay-equiv .c-select,
.pay-equiv .c-textarea {
  max-width: 180px;
}

.sale-summary {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  padding: 10px 12px;
  border-radius: 10px;
  background: var(--primary-soft);
}

.sale-summary div {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.sale-summary strong {
  font-size: 15px;
}

.sale-summary .ok,
.sale-totals .ok {
  color: var(--success);
}

.sale-summary .plan {
  color: var(--warning);
}

.sale-summary .warn,
.sale-totals .warn {
  color: var(--warning);
}

.sale-summary .err {
  color: var(--error);
}

.sale-summary-note {
  grid-column: 1 / -1;
  margin: 0;
}

.sale-cancel-box {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.sale-cancel-box label {
  font-size: 12px;
  font-weight: 700;
  color: var(--error);
}

/* painel de detalhes */
.sale-card {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 12px;
  margin-bottom: 10px;
  background: var(--surface2);
  font-size: 13px;
}

.sale-card.canceled {
  opacity: 0.7;
}

.sale-card-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 8px;
  margin-bottom: 8px;
}

.sale-progress {
  height: 6px;
  border-radius: 999px;
  background: var(--border);
  overflow: hidden;
  margin-bottom: 6px;
}

.sale-progress span {
  display: block;
  height: 100%;
  background: var(--success);
}

.sale-totals {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 14px;
  font-size: 12px;
  color: var(--muted);
  margin-bottom: 8px;
}

.sale-totals strong {
  color: var(--text);
}

.pay-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}

.pay-table td {
  padding: 5px 4px;
  border-top: 1px dashed var(--border);
  white-space: nowrap;
}

.sale-notes {
  margin: 8px 0 0;
  font-size: 12px;
  color: var(--muted);
  white-space: pre-wrap;
}

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

  .pay-row {
    grid-template-columns: 1fr 1fr;
  }

  .pay-row .pay-status,
  .pay-equiv {
    grid-column: 1 / -1;
  }

  .sale-summary {
    grid-template-columns: 1fr 1fr;
  }
}

.small-input {
  width: 80px !important;
  min-width: 0 !important;
}

#tabVendas .c-table-wrap {
  margin-bottom: 20px;
}

/* Coluna "Venda": valor em cima, % recebido embaixo. */
.sale-link.stacked {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1px;
  border-radius: 10px;
  padding: 3px 9px;
  line-height: 1.25;
}

/* ── Barra de ferramentas ──────────────────────────────────────────── */
.v2-toolbar {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}

.v2-search {
  flex: 1 1 240px;
  min-width: 220px;
}

.v2-sep {
  width: 1px;
  height: 22px;
  background: var(--line-strong);
  margin: 0 4px;
}

.crm-v2 .date-inputs .c-input,
.crm-v2 .date-inputs .c-select,
.crm-v2 .date-inputs .c-textarea {
  width: 128px;
  padding-left: 9px;
  padding-right: 6px;
}

.crm-v2 .date-range-label {
  display: none;
}

.v2-filter-panel {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr)) auto;
  gap: 10px;
  align-items: end;
  padding: 12px 14px;
  margin-bottom: 12px;
  background: #fff;
  border: 1px solid var(--line-strong);
  border-radius: var(--r-card);
  box-shadow: var(--shadow-sm);
}

.v2-filter-panel[hidden] {
  display: none;
}

.v2-filter-panel label {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--subtle);
  margin: 0 0 5px;
}

.v2-chips {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin: -4px 0 12px;
}

.v2-chips[hidden] {
  display: none;
}

.v2-chips .c-btn--link {
  font-size: 12px;
  font-weight: 600;
}

/* ── Tabela ────────────────────────────────────────────────────────── */
.crm-v2 .c-table-wrap {
  margin: 0;
  max-height: calc(100vh - 198px);
}

.crm-v2 .c-table-wrap th,
.crm-v2 .c-table-wrap td {
  white-space: nowrap;
}

.crm-v2 .c-table-wrap th {
  z-index: 3;
}

.crm-v2 .c-table-wrap td {
  height: 54px;
  background: #fff;
}

/* 1ª coluna fixa */
.crm-v2 .c-table-wrap th:first-child,
.crm-v2 .c-table-wrap td:first-child {
  position: sticky;
  left: 0;
  z-index: 2;
  padding-left: 16px;
  box-shadow: 1px 0 0 var(--line);
}

.crm-v2 .c-table-wrap th:first-child {
  z-index: 4;
}

.crm-v2 .c-table-wrap.scrolled-x td:first-child,
.crm-v2 .c-table-wrap.scrolled-x th:first-child {
  box-shadow:
    1px 0 0 var(--line-strong),
    8px 0 12px -8px rgba(20, 24, 29, 0.18);
}

.v2-lead .v2-id {
  display: block;
  font-weight: 700;
  color: var(--text);
  font-variant-numeric: tabular-nums;
}

/* Matrícula e identificador sempre completos (sem reticências). */
.v2-lead .v2-sub {
  overflow: visible;
  font-variant-numeric: tabular-nums;
}

.v2-sub {
  display: block;
  margin-top: 2px;
  font-size: 12px;
  color: var(--muted);
  overflow: hidden;
  text-overflow: ellipsis;
}

.v2-main {
  display: block;
  color: var(--text);
}

.v2-phone .v2-main {
  font-variant-numeric: tabular-nums;
}

.crm-v2 .copy-btn.v2-copy {
  border: none;
  background: none;
  padding: 0;
  margin-top: 2px;
  gap: var(--gap-ico);
  font-family: inherit;
  font-size: 12px;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
  border-radius: 4px;
}

.crm-v2 .copy-btn.v2-copy svg {
  width: var(--ico-sm);
  height: var(--ico-sm);
  opacity: 0.55;
}

.crm-v2 .copy-btn.v2-copy:hover {
  color: var(--primary);
}

.crm-v2 .copy-btn.v2-copy:hover svg {
  opacity: 1;
}

.crm-v2 .copy-btn.v2-copy.copied {
  color: var(--success);
}

/* Matrícula e e-mail com o mesmo atalho de copiar do Callbox */
.crm-v2 .copy-btn.v2-copy .t {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* matrícula: mantém o destaque do texto (negrito na lista e no cabeçalho do painel) */
.crm-v2 .copy-btn.v2-copy.v2-copy-id {
  margin-top: 0;
  font-size: inherit;
  font-weight: 700;
  color: var(--text);
  vertical-align: baseline;
}

.crm-v2 .c-drawer__head .copy-btn.v2-copy.v2-copy-id {
  margin-right: 3px;
}

.crm-v2 .copy-btn.v2-copy.v2-copy-id:hover {
  color: var(--primary);
}

.crm-v2 .copy-btn.v2-copy.v2-copy-id.copied {
  color: var(--success);
}

/* e-mail na coluna Nome: reticências quando não cabe, com o ícone sempre visível */
.crm-v2 .v2-sub .copy-btn.v2-copy.v2-copy-mail {
  /* só o texto e o ícone são clicáveis; o resto da célula continua abrindo o painel */
  display: inline-flex;
  vertical-align: top;
  max-width: 100%;
  margin-top: 0;
  font-size: inherit;
  font-variant-numeric: normal;
}

.crm-v2 .copy-btn.v2-copy svg {
  flex: none;
}

/* Ações vazias: discretas, ganham destaque ao passar o mouse na linha */
.crm-v2 .v2-ghost,
.crm-v2 .tag-add,
.crm-v2 .meeting-btn.v2-ghost,
.crm-v2 .sale-link.v2-ghost {
  appearance: none;
  border: 1px solid transparent;
  background: none;
  border-radius: 6px;
  padding: 2px 6px;
  margin-left: -6px;
  font-family: inherit;
  font-size: 12px;
  font-weight: 600;
  color: var(--ghost);
  cursor: pointer;
  white-space: nowrap;
}

.crm-v2 tr.lead-row:hover .v2-ghost,
.crm-v2 tr.lead-row:hover .tag-add {
  color: var(--primary);
  border-color: color-mix(in srgb, var(--primary) 28%, transparent);
  border-style: dashed;
}

.crm-v2 .v2-ghost:hover,
.crm-v2 .tags-cell:hover .tag-add,
.crm-v2 .potential-cell:hover .tag-add,
.crm-v2 .forecast-cell:hover .tag-add {
  background: var(--primary-soft);
  border-style: solid !important;
}

/* Reunião */
.crm-v2 .meeting-btn.v2-meet {
  border: none;
  background: none;
  padding: 0;
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  gap: var(--gap-ico);
  font-family: inherit;
  font-size: 12.5px;
  font-weight: 700;
  color: var(--primary);
  text-align: left;
}

.crm-v2 .meeting-btn.v2-meet svg {
  width: var(--ico);
  height: var(--ico);
  flex: none;
}

.crm-v2 .meeting-btn.v2-meet .two {
  display: flex;
  flex-direction: column;
  line-height: 1.25;
}

.crm-v2 .meeting-btn.v2-meet .two small {
  font-size: 11.5px;
  font-weight: 500;
  color: var(--muted);
}

.crm-v2 .meeting-btn.v2-meet.past {
  color: var(--warning);
}

.crm-v2 .meeting-btn.v2-meet.held {
  color: var(--success);
}

.crm-v2 .meeting-btn.v2-meet:hover {
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* Potencial + previsão */
.v2-deal {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}

/* "+ Temperatura" e "+ Previsão": a moldura conta na altura do botão, para o
   espaço entre os dois ser real (antes as molduras se encostavam). */
.crm-v2 .v2-deal .tag-add {
  display: inline-block;
}

.crm-v2 .potential-cell,
.crm-v2 .forecast-cell {
  padding: 0;
  font-family: inherit;
  line-height: 1.2;
}

.v2-forecast {
  display: inline-flex;
  align-items: center;
  gap: var(--gap-ico);
  font-size: 12px;
  font-weight: 500;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}

.v2-forecast svg {
  width: var(--ico-sm);
  height: var(--ico-sm);
}

/* "Nenhuma" expectativa informada: texto apagado, sem o convite "+ Previsão" */
.v2-forecast.none {
  color: var(--ghost);
}

/* Em Desenvolvimento: selo vazado, com a tendência na cor da temperatura */
.crm-v2 .c-tag.dev {
  background: #fff;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--tag-color) 55%, transparent);
}

.crm-v2 .c-tag.dev em {
  margin-right: 4px;
  font-style: normal;
  font-weight: 600;
  color: #6044b8;
}

.v2-forecast.overdue {
  color: var(--error);
  font-weight: 700;
}

.crm-v2 .tags-cell {
  flex-wrap: nowrap;
  min-width: 0;
  padding: 0;
}

.crm-v2 .tags-cell .tag-add.mini {
  opacity: 0;
  margin-left: 0;
  padding: 1px 6px;
}

.crm-v2 tr.lead-row:hover .tag-add.mini {
  opacity: 1;
}

.v2-more {
  font-size: 11px;
  font-weight: 700;
  color: var(--muted);
}

/* WhatsApp: dois marcadores que são o próprio status */
.crm-v2 .wa-toggles {
  margin: 0;
  gap: 4px;
}

.crm-v2 .wa-toggle {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 22px;
  padding: 0 8px 0 6px;
  border: 1px solid var(--line-strong);
  border-style: solid;
  background: #fff;
  font-family: inherit;
  font-size: 11.5px;
  font-weight: 600;
  color: var(--ghost);
  line-height: 1;
}

.crm-v2 .wa-toggle::before {
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 50%;
  border: 1.5px solid currentColor;
  box-sizing: border-box;
}

.crm-v2 .wa-toggle.on {
  border-color: transparent;
  background: var(--primary-soft);
  color: var(--primary);
  opacity: 1;
}

.crm-v2 .wa-toggle.on::before {
  border: none;
  background: var(--primary) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M2.6 5.2l1.6 1.6 3.2-3.4' fill='none' stroke='%23fff' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/10px no-repeat;
}

.crm-v2 .wa-toggle.on[data-field="repliedMessage"] {
  background: var(--success-soft);
  color: var(--success);
}

.crm-v2 .wa-toggle.on[data-field="repliedMessage"]::before {
  background-color: var(--success);
}

.v2-wa .v2-sub {
  font-size: 11.5px;
  margin-top: 3px;
}

/* Venda */
.crm-v2 .sale-link.v2-sale {
  border: none;
  background: none;
  padding: 0;
  border-radius: 6px;
  display: inline-flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
  font-family: inherit;
  color: var(--text);
}

.v2-sale .v {
  font-size: 13px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.v2-sale .p {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 600;
  color: var(--muted);
}

.v2-sale .bar {
  width: 44px;
  height: 4px;
  border-radius: 999px;
  background: #e8e3da;
  overflow: hidden;
}

.v2-sale .bar i {
  display: block;
  height: 100%;
  background: var(--success);
  border-radius: 999px;
}

.v2-sale.done .p {
  color: var(--success);
}

.crm-v2 td.num .v2-ghost {
  margin-left: 0;
  margin-right: -6px;
}

/* Coluna "Conclusão": "+ Venda" e "+ Recusa" empilhados; recusa registrada em vermelho */
.v2-end {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
}

.crm-v2 tr.lead-row .refusal-link.v2-ghost:hover {
  color: var(--error);
  border-color: color-mix(in srgb, var(--error) 40%, transparent);
  background: var(--error-soft);
}

.crm-v2 .refusal-link.v2-lost {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 3px;
  padding: 0;
  border: none;
  background: none;
  font-family: inherit;
  cursor: pointer;
}

.v2-lost .v {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 22px;
  padding: 0 9px;
  border-radius: 999px;
  background: var(--error-soft);
  color: var(--error);
  font-size: 11.5px;
  font-weight: 700;
  white-space: nowrap;
}

.v2-lost .v::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
}

.v2-lost .p {
  font-size: 11px;
  font-weight: 600;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}

.v2-lost:hover .v {
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--error) 45%, transparent);
}

/* Formulário de recusa */
.refusal-reasons {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.refusal-reasons button {
  appearance: none;
  height: 32px;
  padding: 0 14px;
  border: 1px solid var(--line-strong, #d9d4ca);
  border-radius: 999px;
  background: #fff;
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  color: #3b372f;
  cursor: pointer;
}

.refusal-reasons button:hover {
  border-color: var(--error);
}

.refusal-reasons button.on {
  background: var(--error);
  border-color: var(--error);
  color: #fff;
}

.refusal-adjust {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line-strong, #d9d4ca);
  border-radius: 12px;
  background: #fbf9f5;
}

.refusal-adjust>.t {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--muted);
}

.refusal-item {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.refusal-item[hidden] {
  display: none;
}

.refusal-item+.refusal-item {
  padding-top: 10px;
  border-top: 1px solid var(--line, #e7e2d8);
}

.refusal-item .q {
  font-size: 13px;
  color: #3b372f;
}

.refusal-pick {
  gap: 6px;
}

.refusal-pick[hidden] {
  display: none;
}

.refusal-pick .potential-btn {
  padding: 7px 10px;
  background: #fff;
}

.refusal-pick .potential-btn.on {
  background: var(--tag-color);
}

.refusal-pick .potential-btn strong {
  font-size: 13px;
}

.refusal-pick .potential-btn>span:empty::before {
  content: "\00a0";
}

.refusal-pick .potential-trend {
  margin-top: -6px;
}

.refusal-opts {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}

.refusal-opts button {
  appearance: none;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1px;
  padding: 8px 10px;
  border: 1px solid var(--line-strong, #d9d4ca);
  border-radius: 10px;
  background: #fff;
  font: inherit;
  text-align: left;
  color: #3b372f;
  cursor: pointer;
}

.refusal-opts button strong {
  font-size: 13px;
}

.refusal-opts button span {
  font-size: 11px;
  color: var(--muted);
}

.refusal-opts button.on {
  border-color: var(--primary);
  background: var(--primary-soft);
  color: var(--primary);
  box-shadow: inset 0 0 0 1px var(--primary);
}

.refusal-opts button.on span {
  color: var(--primary);
  opacity: 0.85;
}

.refusal-auto {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 13px;
  color: #3b372f;
}

.refusal-auto>i {
  flex: none;
  display: inline-grid;
  place-items: center;
  width: 18px;
  height: 18px;
  margin-top: 1px;
  border-radius: 50%;
  background: #e7e2d8;
  color: var(--muted);
  font-style: normal;
  font-size: 11px;
  font-weight: 700;
}

.refusal-auto .c-btn--link {
  padding: 0;
  font-size: inherit;
}

.crm-v2 .c-modal textarea.refusal-comment {
  min-height: 58px;
}

.refusal-result {
  padding: 8px 11px;
  border-radius: 9px;
  background: var(--error-soft);
  color: var(--error);
  font-size: 12.5px;
  font-weight: 600;
}

.crm-v2 .c-modal .refusal-error {
  margin: 0 22px 14px;
}

.refusal-kv {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 8px 16px;
  font-size: 13.5px;
}

.refusal-kv>span:nth-child(odd) {
  color: var(--muted);
}

.v2-when {
  display: block;
  color: var(--ink-2);
  font-variant-numeric: tabular-nums;
}

.v2-when i {
  font-style: normal;
  margin: 0 4px;
  color: #c4bfb5;
}

/* Origem do lead, com a cor do bucket. */
.v2-origin {
  display: inline-block;
  margin-top: 3px;
  padding: 1px 7px;
  border-radius: 5px;
  font-size: 11px;
  font-weight: 700;
  line-height: 16px;
  color: color-mix(in srgb, var(--c) 85%, #201c16);
  background: color-mix(in srgb, var(--c) 13%, #fff);
  white-space: nowrap;
}

.crm-v2 .table-footer {
  position: sticky;
  left: 0;
  bottom: 0;
  display: flex;
  justify-content: space-between;
  padding: 9px 16px;
  background: #faf8f4;
  border-top: 1px solid var(--line-strong);
  font-size: 12px;
  z-index: 5;
}