/* ============================================================
   vista-campanas.css · Segmentos y campañas
   Solo reglas prefijadas con .v-campanas
   ============================================================ */

.v-campanas{display:flex;flex-direction:column;gap:14px;min-width:0;}

/* ---------------- Indicadores ---------------- */
.v-campanas__kpis{
  display:grid;gap:14px;
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
}

/* ---------------- Segmentos guardados ---------------- */
.v-campanas__segs{
  display:grid;gap:12px;
  grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
}
.v-campanas__seg{
  border:1px solid var(--linea);border-radius:var(--radio);
  padding:13px 14px;display:flex;flex-direction:column;gap:10px;min-width:0;
  background:#FDFEFF;transition:border-color .14s ease,box-shadow .14s ease;
}
.v-campanas__seg:hover{border-color:#C9D6E4;box-shadow:var(--sombra);}
.v-campanas__seg-cab{display:flex;align-items:flex-start;gap:10px;min-width:0;}
.v-campanas__seg-txt{flex:1 1 auto;min-width:0;}
.v-campanas__seg-nombre{font-size:13.5px;font-weight:600;line-height:1.3;}
.v-campanas__seg-desc{font-size:11.5px;color:var(--suave);margin-top:3px;line-height:1.45;}
.v-campanas__seg-conteo{
  flex:0 0 auto;text-align:right;font-size:24px;font-weight:700;color:var(--marca);
  line-height:1;letter-spacing:-.6px;
}
.v-campanas__seg-conteo span{
  display:block;font-size:9.5px;font-weight:600;letter-spacing:.6px;text-transform:uppercase;
  color:var(--suave);margin-top:3px;
}
.v-campanas__seg-chips{min-width:0;}
.v-campanas__seg-chips .chip{max-width:100%;overflow:hidden;text-overflow:ellipsis;}
.v-campanas__seg-datos{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;
  border-top:1px solid var(--linea);border-bottom:1px solid var(--linea);padding:9px 0;
}
.v-campanas__seg-datos dt{
  font-size:9.5px;font-weight:600;letter-spacing:.5px;text-transform:uppercase;color:var(--suave);
}
.v-campanas__seg-datos dd{font-size:12px;font-weight:600;margin-top:2px;}
.v-campanas__seg-pie{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0;margin-top:auto;}
.v-campanas__seg-pie>.txt-pequeno{flex:1 1 90px;}
.v-campanas__seg-botones{display:flex;gap:6px;flex-wrap:wrap;}

/* ---------------- Dos columnas ---------------- */
.v-campanas__dos{
  display:grid;gap:14px;align-items:start;
  grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);
}

/* ---------------- Constructor ---------------- */
.v-campanas__constructor{display:flex;flex-direction:column;gap:12px;}
.v-campanas__nombre{max-width:420px;}
.v-campanas__filas{display:flex;flex-direction:column;gap:8px;}
.v-campanas__fila{
  display:grid;gap:8px;align-items:start;min-width:0;
  grid-template-columns:52px minmax(0,1fr) minmax(0,.95fr) minmax(0,1.25fr) 30px;
  background:#FBFCFD;border:1px solid var(--linea);border-radius:var(--radio-sm);padding:8px;
}
.v-campanas__y{
  font-size:10px;font-weight:700;letter-spacing:.7px;text-transform:uppercase;color:var(--suave);
  padding-top:9px;text-align:right;
}
.v-campanas__celda{min-width:0;}
.v-campanas__celda--quitar{display:flex;justify-content:flex-end;padding-top:2px;}
.v-campanas__multi{
  border:1px solid var(--linea);border-radius:var(--radio-sm);background:var(--panel);
  padding:6px;margin:0;display:flex;flex-wrap:wrap;gap:4px;
}
.v-campanas__opcion{display:inline-flex;min-width:0;}
.v-campanas__opcion input{position:absolute;opacity:0;width:1px;height:1px;}
.v-campanas__opcion label{
  display:inline-block;padding:2px 9px;border-radius:999px;border:1px solid var(--linea);
  font-size:11px;font-weight:500;color:#41546A;cursor:pointer;background:#F6F8FB;
  max-width:190px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.v-campanas__opcion label:hover{border-color:#C2D2E2;}
.v-campanas__opcion input:checked+label{
  background:rgba(0,141,212,.12);border-color:rgba(0,141,212,.45);color:#02689B;font-weight:600;
}
.v-campanas__opcion input:focus-visible+label{outline:2px solid var(--cyan);outline-offset:2px;}
.v-campanas__constructor-pie{display:flex;flex-wrap:wrap;gap:8px;align-items:center;}

/* ---------------- Vista previa del segmento ---------------- */
.v-campanas__previa{display:flex;flex-direction:column;gap:9px;}
.v-campanas__previa-cab{display:flex;align-items:baseline;gap:10px;min-width:0;}
.v-campanas__previa-num{font-size:28px;font-weight:700;color:var(--marca);line-height:1;letter-spacing:-.8px;}
.v-campanas__previa-txt{font-size:12.5px;color:var(--texto);min-width:0;}
.v-campanas__previa-lista{
  display:grid;gap:6px;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));
}
.v-campanas__previa-lista li{display:flex;flex-direction:column;min-width:0;}
.v-campanas__previa-nom{font-size:12px;font-weight:600;}
.v-campanas__previa-vacia{color:var(--alerta);}

/* ---------------- Comparación entre canales ---------------- */
.v-campanas__canales{display:flex;flex-direction:column;gap:12px;}
.v-campanas__canal{display:flex;align-items:center;gap:10px;min-width:0;}
.v-campanas__canal--sin{opacity:.6;}
.v-campanas__canal-ico{
  width:30px;height:30px;flex:0 0 30px;border-radius:8px;
  background:rgba(0,141,212,.1);color:var(--marca);
  display:inline-flex;align-items:center;justify-content:center;
}
.v-campanas__canal-ico svg{width:16px;height:16px;}
.v-campanas__canal-txt{flex:1 1 110px;min-width:0;display:flex;flex-direction:column;}
.v-campanas__canal-nom{font-size:12.5px;font-weight:600;display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.v-campanas__canal-tasa{flex:0 0 108px;}

/* ---------------- Tasa con barra ---------------- */
.v-campanas__tasa{display:flex;flex-direction:column;gap:4px;min-width:88px;}
.v-campanas__tasa-num{font-size:12px;font-weight:600;}
.v-campanas__col-tasa{min-width:130px;}

/* ---------------- Tabla de campañas ---------------- */
.v-campanas__tabla tbody tr.v-campanas__ficha:hover{background:transparent;}
.v-campanas__linea--abierta>td{background:#F4F8FC;}
.v-campanas__desplegar{
  display:flex;align-items:center;gap:8px;text-align:left;width:100%;min-width:0;
  border-radius:var(--radio-sm);padding:2px 4px 2px 0;
}
.v-campanas__desplegar:hover .principal{color:var(--marca);}
.v-campanas__chevron{
  width:20px;height:20px;flex:0 0 20px;color:var(--suave);
  display:inline-flex;align-items:center;justify-content:center;transition:transform .16s ease;
}
.v-campanas__chevron svg{width:16px;height:16px;}
.v-campanas__chevron--abierto{transform:rotate(180deg);color:var(--marca);}
.v-campanas__linea-txt{display:flex;flex-direction:column;min-width:0;}
.v-campanas__linea-txt .principal{font-size:13px;font-weight:600;}
.v-campanas__canal-celda{display:inline-flex;align-items:center;gap:7px;white-space:nowrap;}
.v-campanas__canal-celda .v-campanas__canal-ico{width:24px;height:24px;flex:0 0 24px;border-radius:6px;}
.v-campanas__canal-celda .v-campanas__canal-ico svg{width:14px;height:14px;}

/* ---------------- Ficha desplegable ---------------- */
.v-campanas__ficha>td{background:#F8FAFD;padding:0 !important;}
.v-campanas__ficha[hidden]{display:none;}
.v-campanas__ficha-caja{
  padding:14px 16px 16px;display:flex;flex-direction:column;gap:14px;
  border-top:1px solid var(--linea);
}
.v-campanas__ficha-cols{
  display:grid;gap:16px;align-items:start;
  grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);
}
.v-campanas__ficha-cols--baja{grid-template-columns:minmax(0,1fr) minmax(0,1fr);}
.v-campanas__h4{
  font-size:10.5px;font-weight:700;letter-spacing:.7px;text-transform:uppercase;
  color:var(--suave);margin-bottom:8px;
}
.v-campanas__dl{display:grid;gap:7px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));}
.v-campanas__dl dt{
  font-size:9.5px;font-weight:600;letter-spacing:.5px;text-transform:uppercase;color:var(--suave);
}
.v-campanas__dl dd{font-size:12.5px;font-weight:500;margin-top:1px;}
.v-campanas__mini{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(88px,1fr));gap:8px;
  margin:11px 0;padding:10px 0;border-top:1px solid var(--linea);border-bottom:1px solid var(--linea);
}
.v-campanas__mini span{display:flex;flex-direction:column;font-size:10.5px;color:var(--suave);}
.v-campanas__mini b{font-size:17px;font-weight:700;color:var(--marca);line-height:1.2;}
.v-campanas__mensaje{
  font-family:'Inter',system-ui,sans-serif;font-size:11.5px;line-height:1.55;color:var(--texto);
  background:var(--panel);border:1px solid var(--linea);border-radius:var(--radio-sm);
  padding:10px 12px;margin:0;white-space:pre-wrap;word-break:break-word;max-height:190px;overflow-y:auto;
}
.v-campanas__dests{display:flex;flex-direction:column;gap:7px;}
.v-campanas__dest{
  display:flex;align-items:center;gap:7px;flex-wrap:wrap;min-width:0;
  background:var(--panel);border:1px solid var(--linea);border-radius:var(--radio-sm);padding:7px 9px;
}
.v-campanas__dest>span:first-child{font-size:12px;font-weight:600;flex:1 1 130px;}

/* ---------------- Gráfico ---------------- */
.v-campanas__grafico{margin:0;}
.v-campanas__grafico-cab{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:6px;}
.v-campanas__leyenda{display:inline-flex;align-items:center;gap:6px;font-size:11px;color:var(--suave);}
.v-campanas__punto{width:9px;height:9px;border-radius:2px;display:inline-block;}
.v-campanas__punto--env{background:#B9CEE0;}
.v-campanas__punto--res{background:var(--cyan);}
.v-campanas__grafico svg{
  width:100%;height:auto;background:var(--panel);
  border:1px solid var(--linea);border-radius:var(--radio-sm);
}
.v-campanas__grafico .v-campanas__eje{stroke:var(--linea);stroke-width:1;}
.v-campanas__grafico .v-campanas__b-env{fill:#B9CEE0;}
.v-campanas__grafico .v-campanas__b-res{fill:var(--cyan);}
.v-campanas__grafico .v-campanas__g-eje{fill:var(--suave);font-size:9.5px;font-family:'Inter',system-ui,sans-serif;}
.v-campanas__grafico .v-campanas__g-dia{fill:#94A3B8;font-size:8.5px;font-family:'Inter',system-ui,sans-serif;}
.v-campanas__grafico .v-campanas__g-num{fill:var(--marca);font-size:9.5px;font-weight:600;font-family:'Inter',system-ui,sans-serif;}
.v-campanas__grafico .v-campanas__g-nada{fill:#B6C3D2;font-size:11px;font-family:'Inter',system-ui,sans-serif;}

/* ---------------- Nota al pie ---------------- */
.v-campanas__nota{
  display:flex;align-items:flex-start;gap:9px;min-width:0;
  background:rgba(0,141,212,.07);border:1px solid rgba(0,141,212,.22);
  border-radius:var(--radio);padding:11px 14px;font-size:12px;color:#0B3A57;
}
.v-campanas__nota svg{width:16px;height:16px;flex:0 0 16px;color:var(--cyan);margin-top:1px;}

/* ---------------- Asistente de campaña (modal) ---------------- */
.v-campanas__asistente{display:flex;flex-direction:column;gap:14px;}
.v-campanas__pasos{display:flex;flex-wrap:wrap;gap:6px;}
.v-campanas__paso-item{
  display:inline-flex;align-items:center;gap:7px;min-width:0;
  font-size:11.5px;font-weight:600;color:var(--suave);
  border:1px solid var(--linea);border-radius:999px;padding:4px 12px 4px 5px;background:#FBFCFD;
}
.v-campanas__paso-num{
  width:20px;height:20px;flex:0 0 20px;border-radius:50%;background:#E7EDF4;color:var(--suave);
  display:inline-flex;align-items:center;justify-content:center;font-size:10.5px;font-weight:700;
}
.v-campanas__paso-item--activo{color:var(--marca);border-color:rgba(0,54,95,.35);background:rgba(0,54,95,.06);}
.v-campanas__paso-item--activo .v-campanas__paso-num{background:var(--marca);color:#fff;}
.v-campanas__paso-item--hecho{color:#217544;border-color:rgba(47,158,91,.35);background:rgba(47,158,91,.08);}
.v-campanas__paso-item--hecho .v-campanas__paso-num{background:var(--ok);color:#fff;}
.v-campanas__paso-cuerpo{display:flex;flex-direction:column;gap:12px;min-width:0;}
/* el contenedor del paso recibe el foco al cambiar de paso (para los lectores de
   pantalla), pero no es un control: no lleva anillo visible */
.v-campanas__paso-cuerpo:focus,
.v-campanas__paso-cuerpo:focus-visible{outline:none;}
/* el shell pinta la flecha con .select, pero `.campo select` la borra por
   especificidad; aqui se restituye solo dentro del asistente */
.v-campanas__asistente .campo select.select{
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2364748B' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 8px center;background-size:15px 15px;
  padding-right:28px;
}
.v-campanas__grupo{border:0;padding:0;margin:0;min-width:0;display:flex;flex-direction:column;gap:8px;}
.v-campanas__leyenda-campo{font-size:11.5px;font-weight:600;color:var(--suave);padding:0;margin-bottom:2px;}
.v-campanas__radio{
  display:flex;align-items:center;gap:10px;min-width:0;cursor:pointer;
  border:1px solid var(--linea);border-radius:var(--radio-sm);padding:9px 11px;background:var(--panel);
}
.v-campanas__radio:hover{border-color:#C2D2E2;background:#FBFCFD;}
.v-campanas__radio input{flex:0 0 16px;width:16px;height:16px;margin:0;accent-color:var(--cyan);}
.v-campanas__radio:has(input:checked){border-color:rgba(0,141,212,.5);background:rgba(0,141,212,.06);}
.v-campanas__radio input:focus-visible{outline:2px solid var(--cyan);outline-offset:2px;}
.v-campanas__radio-txt{display:flex;flex-direction:column;flex:1 1 auto;min-width:0;}
.v-campanas__radio-nom{font-size:12.5px;font-weight:600;}
.v-campanas__radio-num{
  flex:0 0 auto;font-size:15px;font-weight:700;color:var(--marca);
}
.v-campanas__canales-elige{
  display:grid;gap:8px;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));
}
.v-campanas__canal-op{display:block;min-width:0;cursor:pointer;}
.v-campanas__canal-op input{position:absolute;opacity:0;width:1px;height:1px;}
.v-campanas__canal-cara{
  display:flex;flex-direction:column;align-items:flex-start;gap:5px;min-width:0;
  border:1px solid var(--linea);border-radius:var(--radio-sm);padding:10px 11px;
  font-size:12.5px;font-weight:600;background:var(--panel);
}
.v-campanas__canal-op:hover .v-campanas__canal-cara{border-color:#C2D2E2;}
.v-campanas__canal-op input:checked+.v-campanas__canal-cara{
  border-color:rgba(0,141,212,.55);background:rgba(0,141,212,.07);color:var(--marca);
}
.v-campanas__canal-op input:focus-visible+.v-campanas__canal-cara{outline:2px solid var(--cyan);outline-offset:2px;}
.v-campanas__campo{min-width:0;}
.v-campanas__check{display:flex;align-items:flex-start;gap:9px;font-size:12.5px;cursor:pointer;min-width:0;}
.v-campanas__check input{flex:0 0 16px;width:16px;height:16px;margin-top:1px;accent-color:var(--cyan);}
.v-campanas__resumen{
  display:flex;align-items:center;gap:12px;min-width:0;
  background:rgba(0,54,95,.05);border:1px solid var(--linea);border-radius:var(--radio-sm);
  padding:11px 13px;font-size:12.5px;
}
.v-campanas__resumen-num{font-size:26px;font-weight:700;color:var(--marca);line-height:1;letter-spacing:-.6px;}
.v-campanas__modal-intro{margin-bottom:8px;}
.v-campanas__modal-chips{margin-bottom:12px;}

/* ---------------- Adaptación ---------------- */
@media (max-width:1180px){
  .v-campanas__dos{grid-template-columns:minmax(0,1fr);}
  .v-campanas__ficha-cols,
  .v-campanas__ficha-cols--baja{grid-template-columns:minmax(0,1fr);}
}
@media (max-width:760px){
  .v-campanas__fila{grid-template-columns:minmax(0,1fr) 30px;grid-template-areas:none;}
  .v-campanas__y{
    grid-column:1 / -1;text-align:left;padding-top:0;
  }
  .v-campanas__celda{grid-column:1 / 2;}
  .v-campanas__celda--quitar{grid-column:2 / 3;grid-row:2 / 3;}
  .v-campanas__seg-datos{grid-template-columns:repeat(auto-fit,minmax(100px,1fr));}
  .v-campanas__canal-tasa{flex:0 0 84px;}
}
@media (max-width:520px){
  .v-campanas__seg-conteo{font-size:20px;}
  .v-campanas__previa-num{font-size:24px;}
  .v-campanas__mensaje{max-height:150px;}
}