/* ============================================================
   CONSULTING TECCO — Admin Panel Theme
   Overrides Filament 3 defaults to match the public site's
   design system (tecco.css palette + Manrope/Newsreader fonts).
   ============================================================ */

/* ── Variables ─────────────────────────────────────────────── */
:root {
  --paper:    #EFEEEA;
  --paper-2:  #E1DFD8;
  --paper-3:  #F8F6F0;
  --ink:      #1A2230;
  --ink-soft: #2E3B4F;
  --mute:     #565E6E;
  --rule:     #BFC4CC;
  --accent:   oklch(0.42 0.10 240);
  --error:    #9C2518;
  --radius:   4px;

  --serif: "Newsreader", "Times New Roman", Georgia, serif;
  --sans:  "Manrope", system-ui, -apple-system, sans-serif;
  --mono:  "JetBrains Mono", "Courier New", monospace;
}

/* ── Body & layout backgrounds ─────────────────────────────── */
.fi-body {
  background-color: var(--paper) !important;
  font-family: var(--sans) !important;
  color: var(--ink) !important;
}

.fi-simple-layout {
  background-color: var(--paper) !important;
}

/* ── Login card ─────────────────────────────────────────────── */
.fi-simple-main {
  background-color: var(--paper-3) !important;
  border-radius: var(--radius) !important;
  border: 1px solid var(--rule) !important;
  box-shadow: 0 2px 24px rgba(26, 34, 48, 0.07) !important;
  padding: 2.5rem !important;
}

/* Etiqueta "SISTEMA INTERNO" encima del brand name en el login */
.fi-simple-header::before,
.fi-simple-header-ctn::before {
  content: "SISTEMA INTERNO";
  display: block;
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.20em;
  color: var(--mute);
  text-transform: uppercase;
  margin-bottom: 12px;
  text-align: center;
}

/* ── Brand heading en login ("Tecco · Admin") ──────────────── */
.fi-simple-header-heading {
  font-family: var(--serif) !important;
  font-weight: 400 !important;
  font-style: italic;
  color: var(--ink) !important;
  letter-spacing: -0.01em;
}

/* Brand logo / nombre del panel */
.fi-logo,
.fi-brand-name {
  font-family: var(--mono) !important;
  color: var(--mute) !important;
  font-size: 0.72rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

/* ── Form labels ────────────────────────────────────────────── */
.fi-fo-field-wrp-label,
.fi-fo-field-wrp-label label,
.fi-fo-field-wrp-header label,
label.fi-label,
.fi-label {
  font-family: var(--sans) !important;
  color: var(--ink-soft) !important;
  font-weight: 500 !important;
  font-size: 0.85rem !important;
}

/* ── Inputs ─────────────────────────────────────────────────── */
.fi-input-wrp {
  background-color: var(--paper-3) !important;
  border-radius: var(--radius) !important;
  box-shadow: none !important;
  border: 1px solid var(--rule) !important;
}

.fi-input {
  font-family: var(--sans) !important;
  color: var(--ink) !important;
  background-color: transparent !important;
}

.fi-input::placeholder {
  color: var(--mute) !important;
}

/* Focus ring en inputs */
.fi-input-wrp:focus-within {
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent) !important;
}

/* ── Checkbox ───────────────────────────────────────────────── */
.fi-checkbox-input {
  border-radius: 2px !important;
}

/* ── "Recordarme" label ─────────────────────────────────────── */
.fi-fo-field-wrp-label ~ * label,
.fi-checkbox-label,
.fi-checkbox ~ label,
span.fi-checkbox-label {
  color: var(--mute) !important;
  font-family: var(--sans) !important;
  font-size: 0.85rem !important;
}

/* ── Submit button ──────────────────────────────────────────── */
.fi-btn-color-primary {
  border-radius: var(--radius) !important;
  font-family: var(--sans) !important;
  font-weight: 600 !important;
  letter-spacing: 0.01em;
}

.fi-btn-color-primary:focus-visible {
  outline: 2px solid var(--accent) !important;
  outline-offset: 3px !important;
}

/* ── Sidebar ────────────────────────────────────────────────── */
.fi-sidebar {
  background-color: var(--ink) !important;
  border-right: none !important;
}

.fi-sidebar-nav-groups {
  padding-top: 0.5rem;
}

.fi-sidebar-item-label,
.fi-sidebar-group-label {
  font-family: var(--sans) !important;
}

/* Nav items — estado inactivo */
.fi-sidebar .fi-sidebar-item-button {
  background-color: transparent !important;
  color: rgba(239, 238, 234, 0.6) !important;
  border-radius: var(--radius) !important;
}

.fi-sidebar .fi-sidebar-item-button:hover,
.fi-sidebar .fi-sidebar-item-button:focus-visible {
  background-color: rgba(239, 238, 234, 0.08) !important;
  color: var(--paper) !important;
}

/* Nav item activo — fondo accent, ícono más luminoso */
.fi-sidebar .fi-sidebar-item-active .fi-sidebar-item-button,
.fi-sidebar .fi-sidebar-item-button[aria-current="page"] {
  background-color: oklch(0.42 0.10 240 / 0.22) !important;
  color: var(--paper) !important;
}

.fi-sidebar .fi-sidebar-item-active .fi-sidebar-item-icon {
  color: oklch(0.65 0.08 240) !important;
}

/* Etiquetas de grupo del sidebar — mono */
.fi-sidebar-group-label {
  color: rgba(239, 238, 234, 0.35) !important;
  font-family: var(--mono) !important;
  font-size: 0.65rem !important;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

/* Header del sidebar con el nombre del panel */
.fi-sidebar-header {
  background-color: var(--ink) !important;
  border-bottom: 1px solid rgba(239, 238, 234, 0.08) !important;
}

.fi-sidebar-header .fi-brand-name,
.fi-sidebar-header .fi-logo {
  color: var(--paper) !important;
  font-family: var(--serif) !important;
  font-style: italic;
  font-weight: 400;
}

/* ── Topbar ─────────────────────────────────────────────────── */
.fi-topbar {
  background-color: var(--paper-3) !important;
  border-bottom: 1px solid var(--rule) !important;
  box-shadow: none !important;
}

/* ── Área de contenido principal ────────────────────────────── */
.fi-main,
.fi-main-ctn {
  background-color: var(--paper) !important;
}

/* ── Page heading (h1 dentro de las páginas del panel) ──────── */
.fi-header-heading {
  font-family: var(--serif) !important;
  font-weight: 400 !important;
  font-style: italic;
  color: var(--ink) !important;
  letter-spacing: -0.01em;
}

/* ── Widgets de stats ───────────────────────────────────────── */
.fi-wi-stats-overview-stat,
.fi-wi-account {
  background-color: var(--paper-3) !important;
  border: 1px solid var(--rule) !important;
  border-radius: var(--radius) !important;
  box-shadow: none !important;
}

/* Label de la stat (ej. "Cotizaciones nuevas") */
.fi-wi-stats-overview-stat-label {
  font-family: var(--mono) !important;
  font-size: 0.68rem !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: var(--mute) !important;
}

/* Valor numérico de la stat */
.fi-wi-stats-overview-stat-value {
  font-family: var(--serif) !important;
  font-size: 2.25rem !important;
  font-weight: 400 !important;
  color: var(--ink) !important;
}

/* ── Tablas ─────────────────────────────────────────────────── */
.fi-ta-ctn {
  background-color: var(--paper-3) !important;
  border: 1px solid var(--rule) !important;
  border-radius: var(--radius) !important;
  box-shadow: none !important;
}

.fi-ta-header-cell {
  background-color: var(--paper-2) !important;
  color: var(--mute) !important;
  font-family: var(--mono) !important;
  font-size: 0.68rem !important;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.fi-ta-row {
  border-top: 1px solid var(--rule) !important;
}

.fi-ta-cell {
  color: var(--ink) !important;
  font-family: var(--sans) !important;
}

/* ── Badges ─────────────────────────────────────────────────── */
.fi-badge {
  border-radius: 2px !important;
  font-family: var(--mono) !important;
  font-weight: 500 !important;
  font-size: 0.68rem !important;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

/* ── Modales / slide-overs ──────────────────────────────────── */
.fi-modal-window,
.fi-slide-over {
  background-color: var(--paper-3) !important;
}

/* ── Secciones / cards de formulario ───────────────────────── */
.fi-section {
  background-color: var(--paper-3) !important;
  border: 1px solid var(--rule) !important;
  border-radius: var(--radius) !important;
  box-shadow: none !important;
}

.fi-section-header-heading {
  font-family: var(--serif) !important;
  font-style: italic;
  color: var(--ink) !important;
}

/* ── Notificaciones ─────────────────────────────────────────── */
.fi-no-notification {
  background-color: var(--ink) !important;
  color: var(--paper) !important;
  border-radius: var(--radius) !important;
  border: none !important;
  box-shadow: 0 4px 20px rgba(26, 34, 48, 0.2) !important;
}

/* ============================================================
   PIPELINE KANBAN
   ============================================================ */

/* Colores por etapa */
.stage--lead        { --stage-color: #6B7280; --stage-bg: #F3F4F6; }
.stage--contactado  { --stage-color: #2563EB; --stage-bg: #EFF6FF; }
.stage--cotizado    { --stage-color: oklch(0.42 0.10 240); --stage-bg: oklch(0.96 0.02 240); }
.stage--negociacion { --stage-color: #B45309; --stage-bg: #FFFBEB; }
.stage--ganado      { --stage-color: #15803D; --stage-bg: #F0FDF4; }
.stage--perdido     { --stage-color: #9C2518; --stage-bg: #FEF2F2; }

/* ── Summary strip ──────────────────────────────────────────── */
.pipeline-summary {
  display: flex; flex-wrap: wrap; gap: 8px;
  margin-bottom: 20px;
}
.pipeline-summary__pill {
  display: flex; align-items: center; gap: 6px;
  padding: 5px 12px;
  background: var(--stage-bg);
  border: 1px solid color-mix(in srgb, var(--stage-color) 25%, transparent);
  border-radius: 20px;
}
.pipeline-summary__count {
  font-family: var(--mono); font-size: 13px; font-weight: 600;
  color: var(--stage-color);
  min-width: 14px; text-align: center;
}
.pipeline-summary__label {
  font-family: var(--sans); font-size: 12px; color: var(--stage-color);
}

/* ── Filtros ────────────────────────────────────────────────── */
.pipeline-filters {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  padding: 4px 0 8px;
}
.pipeline-filter-search {
  flex: 1;
  min-width: 200px;
  max-width: 320px;
}
.pipeline-filter-search__icon {
  display: none;
}
.pipeline-filter-search__input {
  width: 100%;
  padding: 6px 10px;
  font-family: var(--sans);
  font-size: 12px;
  color: var(--ink);
  background: var(--paper-3);
  border: 1px solid var(--rule);
  border-radius: 4px;
  outline: none;
  box-sizing: border-box;
  transition: border-color .15s;
}
.pipeline-filter-search__input:focus {
  border-color: var(--accent);
}
.pipeline-filter-search__input::placeholder {
  color: var(--mute);
}
.pipeline-filter-select {
  padding: 6px 28px 6px 10px;
  font-family: var(--sans);
  font-size: 12px;
  color: var(--ink);
  background-color: var(--paper-3);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 20 20' fill='%23565E6E'%3E%3Cpath fill-rule='evenodd' d='M5.23 7.21a.75.75 0 0 1 1.06.02L10 11.168l3.71-3.938a.75.75 0 1 1 1.08 1.04l-4.25 4.5a.75.75 0 0 1-1.08 0l-4.25-4.5a.75.75 0 0 1 .02-1.06z' clip-rule='evenodd'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 8px center;
  border: 1px solid var(--rule);
  border-radius: 4px;
  outline: none;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  transition: border-color .15s;
}
.pipeline-filter-select:focus {
  border-color: var(--accent);
}
.pipeline-filter-check {
  display: flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  padding: 6px 10px;
  background: var(--paper-3);
  border: 1px solid var(--rule);
  border-radius: 4px;
  transition: border-color .15s;
}
.pipeline-filter-check:has(input:checked) {
  border-color: #D97706;
  background: #FEF3C7;
}
.pipeline-filter-check__input {
  width: 13px;
  height: 13px;
  accent-color: var(--accent);
  cursor: pointer;
  flex-shrink: 0;
}
.pipeline-filter-check__label {
  font-family: var(--sans);
  font-size: 12px;
  color: var(--ink);
  white-space: nowrap;
  user-select: none;
}
.pipeline-filter-clear {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 6px 10px;
  font-family: var(--sans);
  font-size: 12px;
  color: var(--mute);
  background: transparent;
  border: 1px solid var(--rule);
  border-radius: 4px;
  cursor: pointer;
  transition: color .15s, border-color .15s;
}
.pipeline-filter-clear:hover {
  color: var(--error);
  border-color: var(--error);
}

/* ── Board ──────────────────────────────────────────────────── */
.kanban-board {
  display: flex; gap: 12px;
  overflow-x: auto; padding-bottom: 16px;
  align-items: flex-start;
  min-height: 60vh;
}
.kanban-board::-webkit-scrollbar { height: 6px; }
.kanban-board::-webkit-scrollbar-track { background: var(--paper-2); border-radius: 3px; }
.kanban-board::-webkit-scrollbar-thumb { background: var(--rule); border-radius: 3px; }

/* ── Column ─────────────────────────────────────────────────── */
.kanban-col {
  flex: 0 0 230px;
  display: flex; flex-direction: column;
  background: var(--paper-2);
  border-radius: 10px;
}
.kanban-col__header {
  display: flex; flex-direction: column; gap: 4px;
  padding: 10px 12px;
  background: var(--stage-bg);
  border-bottom: 2px solid var(--stage-color);
  border-radius: 10px 10px 0 0;
}
.kanban-col__header-top {
  display: flex; align-items: center; justify-content: space-between;
}
.kanban-col__title {
  font-family: var(--sans); font-size: 12px; font-weight: 700;
  color: var(--stage-color); text-transform: uppercase; letter-spacing: .06em;
}
.kanban-col__count {
  font-family: var(--mono); font-size: 11px; font-weight: 600;
  background: var(--stage-color); color: #fff;
  width: 18px; height: 18px; border-radius: 50%;
  display: grid; place-items: center;
}
.kanban-col__valor {
  font-family: var(--mono); font-size: 11px; font-weight: 700;
  color: var(--stage-color); opacity: 0.85;
}
.kanban-col__cards {
  flex: 1; padding: 8px; display: flex; flex-direction: column; gap: 8px;
  min-height: 80px;
}
.kanban-col__empty {
  font-family: var(--sans); font-size: 12px; color: var(--mute);
  text-align: center; padding: 20px 8px;
  border: 1px dashed var(--rule); border-radius: 6px;
}

/* ── Card ───────────────────────────────────────────────────── */
.kanban-card {
  background: var(--paper-3);
  border: 1px solid var(--rule);
  border-radius: 2px;
  padding: 10px 11px;
  cursor: grab;
  transition: box-shadow .15s, border-color .15s;
}
.kanban-card:hover {
  box-shadow: 0 2px 8px rgba(0,0,0,.08);
  border-color: var(--mute);
}
.kanban-card--ghost  { opacity: .4; }
.kanban-card--chosen { cursor: grabbing; box-shadow: 0 8px 24px rgba(0,0,0,.15); }
.kanban-card--drag   { opacity: .9; }

.kanban-card__top {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 6px; margin-bottom: 4px;
}
.kanban-card__company {
  font-family: var(--sans); font-size: 12.5px; font-weight: 700;
  color: var(--ink); line-height: 1.3;
}
.kanban-card__name {
  font-family: var(--sans); font-size: 11.5px; color: var(--mute);
  margin: 0 0 5px;
}
.kanban-card__service {
  font-family: var(--sans); font-size: 11px; color: var(--ink-soft);
  margin: 0 0 8px; line-height: 1.4;
}
.kanban-card__footer {
  display: flex; align-items: center; justify-content: space-between;
  margin-top: 6px; padding-top: 6px;
  border-top: 1px solid var(--rule);
}
.kanban-card__valor {
  font-family: var(--mono); font-size: 10.5px; font-weight: 700;
  color: var(--accent);
}
.kanban-card__date {
  font-family: var(--mono); font-size: 10px; color: var(--mute);
}
.kanban-card__actions { display: flex; gap: 2px; }
.kanban-card__btn {
  background: none; border: none; cursor: pointer;
  color: var(--mute); padding: 3px; border-radius: 4px;
  display: grid; place-items: center;
  transition: background .12s, color .12s;
  text-decoration: none;
}
.kanban-card__btn:hover { background: var(--paper-2); color: var(--ink); }
.kanban-card__btn svg { width: 14px; height: 14px; }

/* Badge origen en card */
.kanban-card__origen {
  font-family: var(--mono); font-size: 9px; font-weight: 600;
  padding: 2px 5px; border-radius: 4px; white-space: nowrap; flex-shrink: 0;
}
.kanban-origen--web        { background: #F3F4F6; color: #374151; }
.kanban-origen--llamada    { background: #EFF6FF; color: #1D4ED8; }
.kanban-origen--whatsapp   { background: #F0FDF4; color: #166534; }
.kanban-origen--correo     { background: #FFFBEB; color: #92400E; }
.kanban-origen--presencial { background: oklch(0.96 0.02 240); color: oklch(0.42 0.10 240); }

/* Move menu dropdown */
.kanban-card__move { position: relative; }
.kanban-move-menu {
  position: absolute; bottom: calc(100% + 4px); right: 0; z-index: 9999;
  background: #fff; border: 1px solid var(--rule); border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0,0,0,.12);
  padding: 4px; min-width: 160px;
  display: flex; flex-direction: column; gap: 2px;
}
.kanban-move-item {
  display: flex; align-items: center; gap: 8px;
  background: none; border: none; cursor: pointer;
  font-family: var(--sans); font-size: 12px; color: var(--ink);
  padding: 6px 8px; border-radius: 6px; text-align: left;
  transition: background .1s;
}
.kanban-move-item::before {
  content: ''; width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0;
}
.kanban-move-item:hover { background: var(--paper-2); }

.stage-dot--lead::before        { background: #6B7280; }
.stage-dot--contactado::before  { background: #2563EB; }
.stage-dot--cotizado::before    { background: oklch(0.42 0.10 240); }
.stage-dot--negociacion::before { background: #B45309; }
.stage-dot--ganado::before      { background: #15803D; }
.stage-dot--perdido::before     { background: #9C2518; }

/* ── Pipeline Funnel Widget ─────────────────────────────────── */
.pf-wrap {
  display: flex;
  align-items: center;
  gap: 32px;
  flex-wrap: wrap;
  padding: 8px 0;
}
.pf-stages {
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1;
  min-width: 260px;
}
.pf-stage {
  display: flex;
  align-items: center;
  gap: 10px;
}
.pf-conv {
  width: 52px;
  text-align: right;
  flex-shrink: 0;
}
.pf-conv__pct {
  display: block;
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 600;
  color: var(--mute);
  line-height: 1;
}
.pf-conv__label {
  display: block;
  font-family: var(--sans);
  font-size: 10px;
  color: var(--rule);
}
.pf-conv--empty {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--rule);
}
.pf-bar {
  display: flex;
  align-items: center;
  padding: 7px 12px;
  border-radius: 4px;
  transition: width .3s ease;
  min-width: 64px;
}
.pf-bar--lead        { background: #E5E7EB; }
.pf-bar--contactado  { background: #DBEAFE; }
.pf-bar--cotizado    { background: oklch(0.93 0.03 240); }
.pf-bar--negociacion { background: #FEF3C7; }
.pf-bar__count {
  font-family: var(--mono);
  font-size: 13px;
  font-weight: 700;
  color: var(--ink);
}
.pf-bar__label {
  margin-left: 10px;
  font-family: var(--sans);
  font-size: 12px;
  color: var(--mute);
  white-space: nowrap;
}
.pf-results {
  display: flex;
  flex-direction: column;
  gap: 12px;
  flex-shrink: 0;
}
.pf-divider {
  height: 1px;
  background: var(--rule);
  margin: 2px 0;
}
.pf-result {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1px;
}
.pf-result__num {
  font-family: var(--mono);
  font-size: 22px;
  font-weight: 700;
  line-height: 1;
}
.pf-result__label {
  font-family: var(--sans);
  font-size: 11px;
  color: var(--mute);
  text-transform: uppercase;
  letter-spacing: .05em;
}
.pf-result--total   .pf-result__num { color: var(--ink); }
.pf-result--ganado  .pf-result__num { color: #15803D; }
.pf-result--perdido .pf-result__num { color: #9C2518; }
.pf-result--tasa    .pf-result__num { color: oklch(0.42 0.10 240); }

/* ── Próxima acción en tarjeta Kanban ───────────────────────── */
.kanban-accion {
  display: flex;
  align-items: center;
  gap: 5px;
  margin: 5px 0 2px;
  padding: 4px 0;
  border-top: 1px dashed var(--rule);
  min-width: 0;
  color: var(--mute);
}
.kanban-accion--hoy {
  color: #92400E;
}
.kanban-accion--vencida {
  color: #991B1B;
}
.kanban-accion__icon {
  width: 12px;
  height: 12px;
  flex-shrink: 0;
  opacity: 0.7;
}
.kanban-accion__text {
  font-family: var(--sans);
  font-size: 11px;
  color: inherit;
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.kanban-accion__fecha {
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 600;
  flex-shrink: 0;
  opacity: 0.85;
}

/* ── Leads fríos ────────────────────────────────────────────── */
/* Acento izquierdo sutil en lugar de borde superior llamativo */
.kanban-card--frio    { border-left: 3px solid #D97706; }
.kanban-card--critico { border-left: 3px solid #DC2626; }

/* Badge de inactividad: solo texto y color, sin fondo llamativo */
.kanban-frio {
  display: flex;
  align-items: center;
  gap: 4px;
  margin: 4px 0 2px;
}
.kanban-frio__icon {
  width: 10px;
  height: 10px;
  flex-shrink: 0;
  color: #B45309;
}
.kanban-frio--critico .kanban-frio__icon {
  color: #DC2626;
}
.kanban-frio__text {
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 600;
  color: #B45309;
}
.kanban-frio--critico .kanban-frio__text {
  color: #DC2626;
}

/* Pill "Pipeline total" en el resumen superior */
.pipeline-summary__pill--valor {
  background: oklch(0.95 0.03 240);
  border: 1px solid oklch(0.80 0.06 240);
  gap: 6px;
}
.pipeline-summary__pill--valor .pipeline-summary__label {
  font-size: 10px; text-transform: uppercase; letter-spacing: .05em;
  color: var(--accent); opacity: 0.7;
}
.pipeline-summary__pill--valor .pipeline-summary__count {
  color: var(--accent); font-size: 13px;
}

/* Pill "Fríos" en el resumen superior */
.pipeline-summary__pill--frio {
  display: flex;
  align-items: center;
  gap: 4px;
  background: #FEF3C7;
  color: #92400E;
  border: 1px solid #FDE68A;
}
.pipeline-summary__pill--frio .pipeline-summary__count,
.pipeline-summary__pill--frio .pipeline-summary__label {
  color: #92400E;
}

/* ── Canal Conversión Widget ────────────────────────────────── */
.cc-table { display: flex; flex-direction: column; gap: 0; margin-top: 4px; }
.cc-header {
  display: grid;
  grid-template-columns: 1fr 52px 64px 1fr;
  gap: 8px;
  padding: 0 4px 6px;
  border-bottom: 1px solid var(--rule);
  margin-bottom: 4px;
}
.cc-header__canal,
.cc-header__num,
.cc-header__bar {
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 600;
  color: var(--mute);
  text-transform: uppercase;
  letter-spacing: .05em;
}
.cc-header__num { text-align: right; }
.cc-row {
  display: grid;
  grid-template-columns: 1fr 52px 64px 1fr;
  gap: 8px;
  align-items: center;
  padding: 7px 4px;
  border-bottom: 1px solid var(--rule);
}
.cc-row:last-child { border-bottom: none; }
.cc-row__canal {
  display: flex;
  align-items: center;
  gap: 7px;
  font-family: var(--sans);
  font-size: 12.5px;
  color: var(--ink);
}
.cc-origen {
  font-family: var(--mono);
  font-size: 9px;
  font-weight: 700;
  padding: 2px 5px;
  border-radius: 3px;
  flex-shrink: 0;
}
.cc-origen--web        { background: #E5E7EB; color: #374151; }
.cc-origen--llamada    { background: #DBEAFE; color: #1D4ED8; }
.cc-origen--whatsapp   { background: #DCFCE7; color: #15803D; }
.cc-origen--correo     { background: #FEF3C7; color: #92400E; }
.cc-origen--presencial { background: #EDE9FE; color: #6D28D9; }
.cc-row__num {
  font-family: var(--mono);
  font-size: 12px;
  font-weight: 600;
  color: var(--ink-soft);
  text-align: right;
}
.cc-row__bar-wrap {
  display: flex;
  align-items: center;
  gap: 8px;
}
.cc-bar {
  height: 6px;
  border-radius: 3px;
  flex-shrink: 0;
  transition: width .3s ease;
}
.cc-row__pct {
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}