/* ============================================================
   CRM · Gerencia General de Ventas — Fiat Venezuela
   vista-ajustes.css · estilos propios de la vista «Ajustes»
   Todas las reglas cuelgan de .v-ajustes
   ============================================================ */

.v-ajustes{min-width:0;}

/* Ajustes de base necesarios dentro de esta vista:
   los <span> con clase de barra o de línea secundaria deben comportarse
   como bloque para que tomen alto y salto de línea. */
.v-ajustes .barra-progreso,
.v-ajustes .barra-progreso__relleno{display:block;}
.v-ajustes .tabla .principal,
.v-ajustes .tabla .menor{display:block;}
/* el chevron del selector se pierde cuando el <select> vive dentro de .campo */
.v-ajustes .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;
}

/* ---------------- Barra de pestañas ---------------- */
.v-ajustes__tabs{
  display:flex;gap:4px;align-items:center;
  background:var(--panel);border:1px solid var(--linea);border-radius:var(--radio);
  box-shadow:var(--sombra);padding:5px;margin-bottom:14px;
  overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:thin;
}
.v-ajustes__tab{
  display:inline-flex;align-items:center;gap:7px;flex:0 0 auto;
  height:34px;padding:0 13px;border-radius:8px;
  font-size:13px;font-weight:500;color:var(--suave);white-space:nowrap;
  transition:background .14s ease,color .14s ease;
}
.v-ajustes__tab svg{width:16px;height:16px;flex:0 0 16px;}
.v-ajustes__tab:hover{background:#F1F5F9;color:var(--texto);}
.v-ajustes__tab[aria-selected="true"]{
  background:rgba(0,54,95,.08);color:var(--marca);font-weight:600;
}
.v-ajustes__panel:focus{outline:none;}
.v-ajustes__panel:focus-visible{outline:2px solid var(--cyan);outline-offset:3px;}

/* ---------------- Rejillas de dos columnas ---------------- */
.v-ajustes__cols{display:grid;gap:14px;grid-template-columns:minmax(0,1fr);align-items:start;}
@media (min-width:1080px){
  .v-ajustes__cols--catalogos{grid-template-columns:minmax(0,270px) minmax(0,1fr);}
  .v-ajustes__cols--plantillas{grid-template-columns:minmax(0,290px) minmax(0,1fr);}
  .v-ajustes__cols--formulario{grid-template-columns:minmax(0,1fr) minmax(0,370px);}
  .v-ajustes__cols--datos{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);}
}
.v-ajustes__lateral{align-self:start;}

/* ---------------- Selector de catálogo ---------------- */
.v-ajustes__selector{display:flex;flex-direction:column;gap:4px;}
.v-ajustes__selector-item{
  display:flex;align-items:center;gap:8px;width:100%;
  padding:9px 10px;border-radius:8px;border:1px solid transparent;
  font-size:13px;color:var(--texto);text-align:left;
  transition:background .14s ease,border-color .14s ease;
}
.v-ajustes__selector-item:hover{background:#F1F5F9;}
.v-ajustes__selector-item[aria-pressed="true"]{
  background:rgba(0,141,212,.09);border-color:rgba(0,141,212,.28);color:var(--marca);font-weight:600;
}
.v-ajustes__selector-txt{flex:1 1 auto;min-width:0;}
.v-ajustes__cuenta{
  flex:0 0 auto;min-width:24px;text-align:center;
  background:#EEF2F7;color:#41546A;border-radius:999px;
  font-size:11px;font-weight:600;padding:1px 7px;font-variant-numeric:tabular-nums;
}
.v-ajustes__selector-item[aria-pressed="true"] .v-ajustes__cuenta{background:var(--marca);color:#fff;}

.v-ajustes__nota{
  display:flex;gap:8px;margin-top:14px;padding:10px 11px;
  background:#F8FAFC;border:1px dashed var(--linea);border-radius:8px;
  font-size:11.5px;color:var(--suave);line-height:1.45;
}
.v-ajustes__nota svg{width:15px;height:15px;flex:0 0 15px;color:var(--cyan);margin-top:1px;}

.v-ajustes__ayuda{font-size:12.5px;color:var(--suave);margin-bottom:12px;}

/* ---------------- Alta de elementos ---------------- */
.v-ajustes__agregar{display:flex;gap:8px;align-items:flex-end;margin-bottom:14px;flex-wrap:wrap;}
.v-ajustes__agregar .campo{flex:1 1 220px;min-width:0;}

/* ---------------- Tabla de catálogo ---------------- */
.v-ajustes__tabla-catalogo{min-width:620px;}
.v-ajustes__tabla-catalogo td:nth-child(2){min-width:220px;}
.v-ajustes__col-orden{width:74px;white-space:nowrap;}
.v-ajustes__flechas{display:inline-flex;flex-direction:column;gap:2px;vertical-align:middle;}
.v-ajustes__flecha{
  width:22px;height:15px;border-radius:4px;color:var(--suave);
  display:inline-flex;align-items:center;justify-content:center;
  border:1px solid var(--linea);background:var(--panel);
}
.v-ajustes__flecha svg{width:13px;height:13px;}
.v-ajustes__flecha:hover:not([disabled]){background:var(--marca);color:#fff;border-color:var(--marca);}
.v-ajustes__flecha[disabled]{opacity:.35;cursor:not-allowed;}
.v-ajustes__pos{
  display:inline-block;margin-left:8px;font-size:12px;font-weight:600;color:var(--suave);
  vertical-align:middle;
}
.v-ajustes__nombre-celda{display:flex;align-items:center;gap:8px;min-width:0;}
.v-ajustes__nombre{width:100%;min-width:120px;font-weight:500;}
.v-ajustes__color{
  width:12px;height:12px;flex:0 0 12px;border-radius:3px;
  box-shadow:inset 0 0 0 1px rgba(11,27,43,.16);
}
.v-ajustes__col-detalle{max-width:280px;}
.v-ajustes__col-uso{width:150px;}
.v-ajustes__col-acciones{width:1%;white-space:nowrap;text-align:right;}
.v-ajustes__col-acciones .linea-flex{justify-content:flex-end;flex-wrap:nowrap;}
.v-ajustes__uso{display:flex;align-items:center;gap:8px;}
.v-ajustes__uso .barra-progreso{flex:1 1 auto;min-width:44px;}
.v-ajustes__uso>.txt-num{min-width:22px;font-size:12.5px;font-weight:600;}

/* ---------------- Avisos dentro de modales ---------------- */
.v-ajustes__aviso{
  display:flex;gap:10px;padding:11px 12px;border-radius:8px;
  background:#F1F5F9;border:1px solid var(--linea);
}
.v-ajustes__aviso svg{width:18px;height:18px;flex:0 0 18px;color:var(--cyan);margin-top:1px;}
.v-ajustes__aviso--alerta{background:rgba(224,140,27,.08);border-color:rgba(224,140,27,.32);}
.v-ajustes__aviso--alerta svg{color:var(--alerta);}
.v-ajustes__aviso-titulo{font-weight:600;font-size:13px;margin-bottom:2px;}
.v-ajustes__lista-check{margin-top:12px;display:flex;flex-direction:column;gap:7px;}
.v-ajustes__lista-check li{
  display:flex;gap:8px;align-items:flex-start;font-size:12.5px;color:var(--texto);
}
.v-ajustes__lista-check svg{width:15px;height:15px;flex:0 0 15px;color:var(--ok);margin-top:2px;}

/* ---------------- Plantillas ---------------- */
.v-ajustes__plantillas{display:flex;flex-direction:column;gap:5px;}
.v-ajustes__plantilla{
  display:flex;align-items:flex-start;gap:9px;width:100%;text-align:left;
  padding:9px 10px;border-radius:8px;border:1px solid transparent;
  transition:background .14s ease,border-color .14s ease;
}
.v-ajustes__plantilla:hover{background:#F1F5F9;}
.v-ajustes__plantilla[aria-pressed="true"]{background:rgba(0,141,212,.09);border-color:rgba(0,141,212,.28);}
.v-ajustes__plantilla-icono{
  width:28px;height:28px;flex:0 0 28px;border-radius:7px;
  display:inline-flex;align-items:center;justify-content:center;
  background:#EEF2F7;color:var(--marca);
}
.v-ajustes__plantilla[aria-pressed="true"] .v-ajustes__plantilla-icono{background:var(--marca);color:#fff;}
.v-ajustes__plantilla-icono svg{width:15px;height:15px;}
.v-ajustes__plantilla-txt{display:flex;flex-direction:column;gap:1px;min-width:0;}
.v-ajustes__plantilla-nombre{font-size:12.5px;font-weight:600;color:var(--texto);}
.v-ajustes__plantilla-meta{font-size:11px;color:var(--suave);}

.v-ajustes__vars{display:flex;flex-wrap:wrap;gap:6px;}
.v-ajustes__var{
  display:inline-flex;align-items:center;gap:6px;
  padding:4px 9px;border-radius:999px;border:1px dashed rgba(0,141,212,.45);
  background:rgba(0,141,212,.07);color:#02689B;
  font-size:11.5px;font-weight:600;font-variant-numeric:tabular-nums;
  transition:background .14s ease,color .14s ease,border-color .14s ease;
}
.v-ajustes__var:hover{background:var(--cyan);color:#fff;border-color:var(--cyan);}
.v-ajustes__var:hover .v-ajustes__var-rotulo{color:rgba(255,255,255,.85);}
.v-ajustes__var-rotulo{font-weight:500;color:var(--suave);font-size:11px;}
.v-ajustes__cuerpo{min-height:180px;font-size:13px;line-height:1.55;}
.v-ajustes__pie-acciones{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.v-ajustes__select-previa{width:auto;max-width:260px;}

/* ---------------- Vista previa del mensaje ---------------- */
.v-ajustes__previa{
  border:1px solid var(--linea);border-radius:var(--radio);overflow:hidden;background:#FBFCFD;
}
.v-ajustes__previa-barra{
  display:flex;align-items:center;gap:6px;flex-wrap:wrap;
  padding:9px 12px;background:var(--panel);border-bottom:1px solid var(--linea);
}
.v-ajustes__previa-canal{
  display:inline-flex;align-items:center;gap:6px;
  font-size:12px;font-weight:600;color:var(--marca);
}
.v-ajustes__previa-canal svg{width:15px;height:15px;}
.v-ajustes__previa-cab{
  padding:10px 12px;border-bottom:1px dashed var(--linea);font-size:12.5px;
  display:flex;flex-direction:column;gap:3px;
}
.v-ajustes__previa-cab div{min-width:0;overflow-wrap:anywhere;}
.v-ajustes__burbuja{
  margin:12px;padding:12px 14px;border-radius:12px 12px 12px 4px;
  background:var(--panel);border:1px solid var(--linea);box-shadow:var(--sombra);
  font-size:13px;line-height:1.6;overflow-wrap:anywhere;
}
.v-ajustes__burbuja p{margin:0 0 6px;}
.v-ajustes__burbuja p:last-child{margin-bottom:0;}
.v-ajustes__salto{height:4px;}
.v-ajustes__previa-pie{padding:0 12px 12px;font-size:11.5px;color:var(--suave);}

/* ---------------- Equipo ---------------- */
.v-ajustes__tabla-equipo{min-width:830px;}
.v-ajustes__tabla-equipo td,.v-ajustes__tabla-equipo th{padding-left:9px;padding-right:9px;}
.v-ajustes__usuario{display:flex;align-items:center;gap:9px;min-width:0;}
.v-ajustes__usuario-txt{display:flex;flex-direction:column;min-width:0;max-width:190px;}
.v-ajustes__select-corto{width:106px;}
.v-ajustes__select-zona{width:158px;}
.v-ajustes__meta{width:66px;text-align:right;}
.v-ajustes__col-avance{width:132px;}
.v-ajustes__col-avance .v-ajustes__uso{
  flex-direction:column;align-items:stretch;gap:4px;margin-bottom:3px;
}
.v-ajustes__col-avance .txt-num{white-space:nowrap;min-width:0;}
.v-ajustes__fila-inactiva td{opacity:.6;}
.v-ajustes__leyenda{display:flex;flex-wrap:wrap;gap:6px 20px;font-size:11.5px;color:var(--suave);}
.v-ajustes__leyenda span{display:inline-flex;align-items:center;gap:6px;}
.v-ajustes__leyenda svg{width:14px;height:14px;flex:0 0 14px;color:var(--ok);}
.v-ajustes__leyenda strong{color:var(--texto);font-weight:600;}

/* ---------------- Formulario de la landing ---------------- */
.v-ajustes__flujo{
  display:grid;align-items:center;gap:8px;
  grid-template-columns:minmax(0,1fr);
  padding:12px;margin-bottom:14px;
  background:#F8FAFC;border:1px solid var(--linea);border-radius:8px;
}
@media (min-width:520px){
  .v-ajustes__flujo{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr);}
}
.v-ajustes__flujo-paso{
  display:flex;align-items:center;gap:8px;min-width:0;
  padding:8px 10px;background:var(--panel);border:1px solid var(--linea);border-radius:8px;
  font-size:11.5px;color:var(--suave);line-height:1.35;
}
.v-ajustes__flujo-paso>span{min-width:0;overflow-wrap:anywhere;}
.v-ajustes__flujo-paso strong{color:var(--texto);font-size:12.5px;}
.v-ajustes__flujo-paso svg{width:18px;height:18px;flex:0 0 18px;color:var(--cyan);}
.v-ajustes__flujo-paso--fin{border-color:rgba(47,158,91,.4);background:rgba(47,158,91,.06);}
.v-ajustes__flujo-paso--fin svg{color:var(--ok);}
.v-ajustes__flujo-flecha{color:#A9B7C6;display:flex;justify-content:center;}
.v-ajustes__flujo-flecha svg{width:18px;height:18px;}
@media (max-width:519px){
  .v-ajustes__flujo-flecha svg{transform:rotate(90deg);}
}

.v-ajustes__tabla-campos{min-width:500px;}
.v-ajustes__tabla-campos td,.v-ajustes__tabla-campos th{padding-left:9px;padding-right:9px;}
.v-ajustes__tabla-campos td:first-child{min-width:170px;}
.v-ajustes__tabla-campos td:nth-child(3){max-width:150px;}
.v-ajustes__col-switch{width:78px;text-align:right;}
.v-ajustes__codigo{
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:11px;background:#EEF2F7;color:#41546A;padding:1px 5px;border-radius:4px;
}
.v-ajustes__switch{
  position:relative;width:42px;height:24px;border-radius:999px;
  background:#CBD5E1;transition:background .16s ease;display:inline-block;vertical-align:middle;
}
.v-ajustes__switch-bola{
  position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;
  background:#fff;box-shadow:0 1px 3px rgba(16,32,48,.3);transition:transform .16s ease;
}
.v-ajustes__switch[aria-checked="true"]{background:var(--ok);}
.v-ajustes__switch[aria-checked="true"] .v-ajustes__switch-bola{transform:translateX(18px);}

.v-ajustes__landing{
  border:1px solid var(--linea);border-radius:var(--radio);padding:14px;background:#FBFCFD;
}
.v-ajustes__landing-cab{display:flex;flex-direction:column;gap:3px;margin-bottom:12px;}
.v-ajustes__landing-cab strong{font-size:14px;}
.v-ajustes__landing-cab .txt-pequeno{font-size:11.5px;color:var(--suave);}
.v-ajustes__landing-franja{width:38px;height:3px;border-radius:2px;background:var(--rojo);margin-bottom:6px;}
.v-ajustes__landing-campos{display:flex;flex-direction:column;gap:10px;}
.v-ajustes__lp-campo{display:flex;flex-direction:column;gap:4px;min-width:0;}
.v-ajustes__lp-rotulo{font-size:11.5px;font-weight:600;color:var(--suave);}
.v-ajustes__lp-cond{font-size:10.5px;color:#94A3B8;font-style:italic;}
.v-ajustes__req{color:var(--peligro);font-weight:700;margin-left:3px;}
.v-ajustes__landing .entrada[disabled],
.v-ajustes__landing .select[disabled]{background:var(--panel);color:#8A98A8;cursor:default;}
.v-ajustes__landing-btn{width:100%;margin-top:14px;}
.v-ajustes__landing-pie{margin-top:8px;font-size:11px;color:var(--suave);text-align:center;}
@media (min-width:1080px){
  .v-ajustes__previa-form{position:sticky;top:76px;}
}

/* ---------------- Datos ---------------- */
.v-ajustes__resumen{display:grid;gap:10px;grid-template-columns:minmax(0,1fr);}
@media (min-width:560px){
  .v-ajustes__resumen{grid-template-columns:repeat(3,minmax(0,1fr));align-items:end;}
}
.v-ajustes__valor-chico{font-size:15px;letter-spacing:0;line-height:1.35;}
.v-ajustes__unidad{font-size:13px;font-weight:600;color:var(--suave);letter-spacing:0;}
.v-ajustes__grafico{margin:4px 0 0;}
.v-ajustes__grafico svg{width:100%;height:auto;display:block;}
.v-ajustes__grafico figcaption{margin-top:6px;text-align:center;}
.v-ajustes__tabla-datos{min-width:400px;}
.v-ajustes__unidad-tabla{font-size:11px;color:var(--suave);font-weight:500;}

.v-ajustes__dup{
  border:1px solid var(--linea);border-radius:var(--radio);overflow:hidden;margin-bottom:12px;
}
.v-ajustes__dup:last-child{margin-bottom:0;}
.v-ajustes__dup-cab{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  padding:10px 12px;background:rgba(224,140,27,.07);border-bottom:1px solid var(--linea);
}
.v-ajustes__dup-motivo{
  display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:600;color:#96600D;
}
.v-ajustes__dup-motivo svg{width:16px;height:16px;flex:0 0 16px;}
.v-ajustes__dup-fichas{display:grid;gap:1px;background:var(--linea);grid-template-columns:minmax(0,1fr);}
@media (min-width:720px){
  .v-ajustes__dup-fichas{grid-template-columns:repeat(2,minmax(0,1fr));}
}
.v-ajustes__ficha{background:var(--panel);padding:12px;min-width:0;}
.v-ajustes__ficha-cab{display:flex;align-items:center;gap:8px;margin-bottom:9px;min-width:0;}
.v-ajustes__ficha-cab .principal{flex:1 1 auto;font-size:13px;font-weight:600;}
.v-ajustes__ficha-datos{display:grid;gap:5px 12px;grid-template-columns:minmax(0,1fr);}
@media (min-width:420px){
  .v-ajustes__ficha-datos{grid-template-columns:repeat(2,minmax(0,1fr));}
}
.v-ajustes__ficha-datos>div{display:flex;gap:6px;min-width:0;font-size:11.5px;}
.v-ajustes__ficha-datos dt{color:var(--suave);flex:0 0 82px;}
.v-ajustes__ficha-datos dd{margin:0;min-width:0;color:var(--texto);overflow-wrap:anywhere;}

/* ---------------- Adaptación ---------------- */
@media (max-width:1079px){
  .v-ajustes__select-previa{max-width:100%;flex:1 1 200px;}
}
@media (max-width:640px){
  .v-ajustes__tabs{margin-bottom:12px;}
  .v-ajustes__tab span{display:none;}
  .v-ajustes__tab{padding:0 11px;}
  .v-ajustes__tab[aria-selected="true"] span{display:inline;}
  .v-ajustes__nombre{min-width:100px;}
  .v-ajustes__agregar .btn{width:100%;}
  .v-ajustes__dup-cab .btn{flex:1 1 auto;}
}