/* Gestión Comercial Grupo SI · paleta del manual de marca 2026–2027 */
:root{
  --marino:#16284A; --lima:#8CC63F; --verde:#5C9A28; --azul:#4A6285;
  --gris:#AAB6C4; --fondo:#F1F5F8; --cuerpo:#2E3E56; --nota:#6E7C8C; --rojo:#B23A3A;
  --linea:#DCE3EA; --blanco:#FFFFFF;
  --critico:#B23A3A; --critico-s:#F8E4E4;
  --debil:#B86E12;   --debil-s:#FBEEDB;
  --aceptable:#4A6285; --aceptable-s:#E3EAF3;
  --fortaleza:#4E8A1E; --fortaleza-s:#E7F3DA;
  --radio:10px;
  --sombra:0 1px 2px rgba(22,40,74,.06), 0 4px 16px rgba(22,40,74,.05);
  --letra:"Figtree","Aptos","Segoe UI",Roboto,Arial,sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fondo);color:var(--cuerpo);font:15px/1.55 var(--letra)}
a{color:var(--marino);text-decoration-color:var(--lima);text-underline-offset:3px;text-decoration-thickness:2px}
a:hover{color:var(--verde)}
:focus-visible{outline:3px solid var(--lima);outline-offset:2px}
h1,h2,h3{color:var(--marino);line-height:1.25;text-wrap:balance;margin:0 0 .5em}
h1{font-size:1.65rem;font-weight:800;letter-spacing:-.01em}
h2{font-size:1.15rem;font-weight:700}
h3{font-size:1rem;font-weight:700}
p{margin:0 0 .8em}
code{background:var(--fondo);padding:1px 6px;border-radius:5px;font-size:.92em}
small{font-size:.8em}
.tenue{color:var(--nota)}
.ayuda{font-size:.86rem;color:var(--nota);margin:.35rem 0 1rem}
.eyebrow{font-size:.74rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--verde);margin:0 0 .4rem}
[hidden]{display:none!important}

/* ===== Marco con menú lateral ===== */
.marco{display:grid;grid-template-columns:248px minmax(0,1fr);min-height:100vh}
.lateral{background:var(--blanco);border-right:1px solid var(--linea);padding:22px 16px;display:flex;flex-direction:column;gap:6px;position:sticky;top:0;height:100vh;overflow-y:auto}
.marca img{width:150px;display:block}
.marca-sub{font-size:.78rem;font-weight:700;color:var(--azul);letter-spacing:.06em;text-transform:uppercase;margin:6px 0 14px}
.lateral nav{display:flex;flex-direction:column;gap:2px;flex:1}
.nav-grupo{font-size:.7rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--gris);margin:16px 10px 6px}
.lateral nav a{display:block;padding:8px 10px;border-radius:8px;color:var(--cuerpo);text-decoration:none;font-weight:500}
.lateral nav a:hover{background:var(--fondo);color:var(--marino)}
.lateral nav a.activo{background:var(--marino);color:var(--blanco);font-weight:600;box-shadow:inset 3px 0 0 var(--lima)}
.quien{border-top:1px solid var(--linea);padding-top:12px;margin-top:12px;display:flex;flex-direction:column;font-size:.85rem}
.quien strong{color:var(--marino)}
.quien span{color:var(--nota)}
.quien-links a{color:var(--azul)}
.contenido{min-width:0}
.barra-movil{display:none}
.pagina{max-width:1180px;margin:0 auto;padding:28px 28px 60px}

@media (max-width:900px){
  .marco{grid-template-columns:minmax(0,1fr)}
  .lateral{position:fixed;inset:0 auto 0 0;width:min(290px,86vw);z-index:40;transform:translateX(-102%);transition:transform .2s ease;box-shadow:0 0 40px rgba(22,40,74,.25)}
  .lateral.abierto{transform:none}
  .barra-movil{display:flex;align-items:center;gap:14px;background:var(--blanco);border-bottom:1px solid var(--linea);padding:10px 16px;position:sticky;top:0;z-index:30}
  .barra-movil img{height:30px}
  .btn-menu{font:600 .9rem var(--letra);background:var(--marino);color:var(--blanco);border:0;border-radius:8px;padding:8px 14px}
  .pagina{padding:20px 16px 48px}
}
@media (prefers-reduced-motion:reduce){.lateral{transition:none}}

/* ===== Páginas públicas ===== */
.publico{min-height:100vh;display:flex;flex-direction:column}
.pub-cabecera{background:var(--blanco);border-bottom:4px solid var(--lima);padding:14px 16px;display:flex;justify-content:center}
.pub-cabecera img{height:44px}
.pagina-publica{max-width:720px;width:100%;margin:0 auto;padding:22px 16px 48px;flex:1}
.pub-pie{text-align:center;font-size:.8rem;color:var(--nota);padding:18px 16px 26px}

/* ===== Títulos ===== */
.titulo-pagina{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:20px}
.titulo-pagina h1{margin:0 0 4px}
.bajada{color:var(--azul);margin:0;max-width:70ch}
.titulo-acciones{display:flex;gap:8px;flex-wrap:wrap;align-items:center}

/* ===== Paneles ===== */
.panel{background:var(--blanco);border:1px solid var(--linea);border-radius:var(--radio);padding:20px 22px;margin-bottom:18px;box-shadow:var(--sombra)}
.panel-cab{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap;margin-bottom:8px}
.panel-cab h2{margin:0}
.panel.destacado{border-left:5px solid var(--lima)}
.vacio{text-align:center;padding:40px 22px}
.vacio-txt{color:var(--nota)}
.grilla-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start}
.grilla-2-ancha{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}
@media (max-width:900px){.grilla-2,.grilla-2-ancha{grid-template-columns:minmax(0,1fr)}}
.grilla-2 > .panel{margin-bottom:0}
.grilla-2{margin-bottom:18px}

details.seccion > summary,details.desplegable > summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
details.seccion > summary::-webkit-details-marker,details.desplegable > summary::-webkit-details-marker{display:none}
details.seccion > summary h2{margin:0}
details.seccion > summary::before{content:"▸";color:var(--verde);font-size:.9rem;transition:transform .15s}
details.seccion[open] > summary::before{transform:rotate(90deg)}
details.seccion[open] > summary{margin-bottom:14px}
details.desplegable > summary{font-weight:700;color:var(--marino)}
details.desplegable[open] > summary{margin-bottom:12px}
.panel details.desplegable{margin-top:10px}

/* ===== Avisos ===== */
.aviso{border-radius:8px;padding:11px 14px;margin:0 0 16px;font-size:.93rem;border:1px solid}
.aviso-ok{background:var(--fortaleza-s);border-color:#C8E2AE;color:#2F5A10}
.aviso-error{background:var(--critico-s);border-color:#EBC3C3;color:#7D2222}
.aviso-aviso{background:var(--debil-s);border-color:#EED3AC;color:#734308}
.aviso-info{background:var(--aceptable-s);border-color:#C9D6E6;color:var(--marino)}

/* ===== Botones y formularios ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;font:600 .92rem var(--letra);padding:10px 18px;border-radius:8px;border:1.5px solid transparent;cursor:pointer;text-decoration:none;line-height:1.2}
.btn-primario{background:var(--marino);color:var(--blanco)}
.btn-primario:hover{background:#0E1C36;color:var(--blanco)}
.btn-secundario{background:var(--blanco);color:var(--marino);border-color:var(--gris)}
.btn-secundario:hover{border-color:var(--marino);color:var(--marino)}
.btn-peligro{background:var(--blanco);color:var(--rojo);border-color:#E3B5B5}
.btn-peligro:hover{background:var(--critico-s)}
.btn-chico{padding:6px 11px;font-size:.84rem}
.btn:disabled{opacity:.6;cursor:wait}
.form{display:flex;flex-direction:column;align-items:stretch}
.form label,label[for]{font-weight:600;color:var(--marino);font-size:.9rem;margin:12px 0 5px;display:block}
.form label:first-of-type{margin-top:0}
input,select,textarea{font:inherit;color:var(--cuerpo);background:var(--blanco);border:1.5px solid #CBD5E0;border-radius:8px;padding:9px 11px;width:100%;max-width:100%}
input:focus,select:focus,textarea:focus{border-color:var(--marino);outline:none;box-shadow:0 0 0 3px rgba(140,198,63,.35)}
input[type=checkbox],input[type=radio]{width:auto;accent-color:var(--marino)}
input[type=range]{padding:0;border:0;accent-color:var(--verde)}
input[readonly]{background:var(--fondo)}
textarea{resize:vertical;line-height:1.5}
.corto{max-width:110px}
.form .btn{align-self:flex-start;margin-top:16px}
label.check{display:flex;align-items:flex-start;gap:8px;font-weight:500;color:var(--cuerpo);margin:12px 0 0}
label.check input{margin-top:4px}
.form-linea{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;flex-direction:row}
.form-linea > div{display:flex;flex-direction:column;min-width:160px;flex:1}
.form-linea > div:last-child{flex:0 0 auto}
.form-linea label{margin-top:0!important}
.form-linea .btn{margin-top:0}
.dos-col{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:560px){.dos-col{grid-template-columns:1fr}}
.dos-col label{margin-top:12px}
.botones{display:flex;gap:8px;flex-wrap:wrap}
.botones .btn{margin-top:12px}
.en-linea{display:inline}
.filtros{display:flex;gap:8px;flex-wrap:wrap}
.filtros select{width:auto;min-width:180px}
.copiar{display:flex;gap:8px}
.barra-guardar{position:sticky;bottom:0;background:linear-gradient(transparent,var(--fondo) 30%);padding:18px 0 8px}
.form-eliminar{margin-top:18px;border-top:1px solid var(--linea);padding-top:14px}

/* ===== Acceso ===== */
.caja-acceso{max-width:420px;margin:30px auto;background:var(--blanco);border:1px solid var(--linea);border-radius:var(--radio);padding:28px;box-shadow:var(--sombra)}
.caja-acceso .btn{width:100%;margin-top:18px}
.nota-acceso{font-size:.85rem;color:var(--nota);margin:18px 0 0}

/* ===== Tablas ===== */
.tabla-envoltura{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 -2px}
.tabla{width:100%;border-collapse:collapse;font-size:.92rem}
.tabla th{text-align:left;font-size:.74rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--nota);padding:9px 10px;border-bottom:2px solid var(--linea);white-space:nowrap}
.tabla td{padding:10px;border-bottom:1px solid var(--linea);vertical-align:middle}
.tabla tfoot td{border-bottom:0}
.tabla .num{text-align:right;font-variant-numeric:tabular-nums}
.tabla-compacta td{padding:7px 10px}
.fila-apagada{opacity:.5}
.fila-alerta td{background:#FFF8EC}
.acciones-fila{white-space:nowrap}
.tabla-carga input{min-width:76px;text-align:right}
.tabla select,.tabla input{padding:6px 8px}

/* ===== Chips y barras ===== */
.chip{display:inline-block;font-size:.74rem;font-weight:700;padding:2px 9px;border-radius:99px;white-space:nowrap;vertical-align:middle;letter-spacing:.02em}
.chip-critico{background:var(--critico-s);color:var(--critico)}
.chip-debil{background:var(--debil-s);color:var(--debil)}
.chip-aceptable{background:var(--aceptable-s);color:var(--aceptable)}
.chip-fortaleza{background:var(--fortaleza-s);color:var(--fortaleza)}
.chip-nd{background:var(--fondo);color:var(--nota)}
.barra-fav{display:flex;height:22px;border-radius:6px;overflow:hidden;background:var(--fondo);font-size:.72rem;font-weight:700;font-variant-numeric:tabular-nums;min-width:120px}
.barra-fav span{display:flex;align-items:center;justify-content:center;color:var(--blanco);overflow:hidden;white-space:nowrap}
.bf-desf{background:#C65A5A}
.bf-neu{background:#D5DDE6}
.bf-fav{background:var(--verde)}
.mini-barra{height:8px;background:var(--fondo);border-radius:99px;overflow:hidden;min-width:70px}
.mini-barra span{display:block;height:100%;background:var(--lima);border-radius:99px}
.mini-barra-grande{height:12px;margin-top:6px}
.cifra-grande{font-size:2rem;font-weight:800;color:var(--marino);margin:.2rem 0 .8rem;font-variant-numeric:tabular-nums}
.cifra-grande small{font-size:.9rem;font-weight:500;color:var(--nota)}

.datos-lista{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:6px 16px;margin:0 0 12px}
.datos-lista dt{font-weight:700;color:var(--marino);font-size:.88rem}
.datos-lista dd{margin:0}
@media (max-width:560px){.datos-lista{grid-template-columns:minmax(0,1fr)}.datos-lista dd{margin-bottom:6px}}
.texto-largo{max-width:820px}
.texto-largo h2{margin-top:22px}
.texto-largo h2:first-child{margin-top:0}
.texto-largo li{margin-bottom:6px}

.clave-temporal{font-size:1.1rem;font-weight:700;letter-spacing:.08em}

/* ===================== Gestión comercial ===================== */
.chip-neutro{background:var(--fondo);color:var(--azul)}
.txt-mal{color:var(--critico);font-weight:700}
.txt-ojo{color:var(--debil);font-weight:700}
.mt{margin-top:14px}
.oculto-visual{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.btn-lima{background:var(--lima);color:var(--marino)}
.btn-lima:hover{background:#7DB536;color:var(--marino)}
.btn-nueva{width:100%;margin:0 0 10px}
.globo{display:inline-block;min-width:20px;padding:0 6px;border-radius:99px;background:var(--rojo);color:#fff;font-size:.72rem;font-weight:700;text-align:center;line-height:18px;margin-left:4px}
.lateral nav a.activo .globo{background:var(--lima);color:var(--marino)}
.botonera{display:flex;gap:8px;flex-wrap:wrap}
.codigo{font-family:ui-monospace,Consolas,monospace;font-size:.82rem;background:var(--fondo)}
.panel-alerta{border-left:5px solid var(--critico)}

/* KPIs */
.kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;margin-bottom:18px}
@media (max-width:1100px){.kpis{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:600px){.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
.kpi{background:var(--blanco);border:1px solid var(--linea);border-radius:var(--radio);padding:14px 16px;box-shadow:var(--sombra);display:flex;flex-direction:column;gap:2px;text-decoration:none;color:inherit;border-top:4px solid var(--gris)}
a.kpi:hover{border-color:var(--marino)}
.kpi-num{font-size:1.55rem;font-weight:800;color:var(--marino);font-variant-numeric:tabular-nums;line-height:1.2}
.kpi-et{font-size:.82rem;color:var(--nota)}
.kpi-mal{border-top-color:var(--critico)}
.kpi-mal .kpi-num{color:var(--critico)}
.kpi-ojo{border-top-color:#E0A33A}
.kpi-ojo .kpi-num{color:var(--debil)}
.kpi-bien{border-top-color:var(--lima)}

/* Logos de empresa */
.logo-mini{height:22px;width:auto;max-width:72px;object-fit:contain;flex:none}
.logo-tarjeta{height:46px;width:auto;max-width:150px;object-fit:contain}
.logo-cab{height:58px;width:auto;max-width:170px;object-fit:contain;background:#fff;border:1px solid var(--linea);border-radius:10px;padding:8px}
.logo-texto{font-weight:800;color:var(--marino);font-size:.8rem}

/* Lista de tareas */
.lista-tareas{list-style:none;margin:0;padding:0}
.tarea{display:grid;grid-template-columns:96px minmax(0,1fr) auto;gap:12px;align-items:start;padding:12px 0;border-top:1px solid var(--linea)}
.tarea:first-child{border-top:0}
.tarea-cuando{display:flex;flex-direction:column;font-size:.85rem;color:var(--azul)}
.tarea-cuando strong{color:var(--marino)}
.tarea.vencida .tarea-cuando strong{color:var(--critico)}
.tarea.hoy .tarea-cuando strong{color:var(--verde)}
.tarea-tipo{display:inline-block;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--azul);background:var(--fondo);border-radius:5px;padding:1px 6px;margin-right:4px}
.tarea-op{display:flex;align-items:center;gap:8px;margin-top:4px;font-size:.9rem;flex-wrap:wrap}
.tarea-detalle{font-size:.86rem;margin-top:4px}
@media (max-width:600px){.tarea{grid-template-columns:minmax(0,1fr)}.tarea-cuando{flex-direction:row;gap:8px}}

.lista-op{list-style:none;margin:0;padding:0}
.lista-op li{display:grid;grid-template-columns:76px minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px 0;border-top:1px solid var(--linea)}
.lista-op li:first-child{border-top:0}
@media (max-width:600px){.lista-op li{grid-template-columns:minmax(0,1fr)}}
.lista-simple{margin:0;padding-left:18px}
.lista-simple li{margin:6px 0}
.lista-editable{list-style:none;margin:0 0 10px;padding:0}
.lista-editable > li{border-top:1px solid var(--linea);padding:8px 0}
.lista-editable summary{cursor:pointer}
.lista-editable form{margin-top:10px}
.fila-servicio{display:flex;gap:8px;align-items:center}
.fila-servicio input[name=nombre]{flex:1}

/* Barras simples */
.barras{list-style:none;margin:0;padding:0}
.barras li{display:grid;grid-template-columns:160px minmax(0,1fr) 90px;gap:10px;align-items:center;margin:8px 0;font-size:.9rem}
.barras-pista{position:relative;height:14px;background:var(--fondo);border-radius:99px;overflow:hidden}
.barras-total,.barras-pond{position:absolute;inset:0 auto 0 0;border-radius:99px}
.barras-total{background:#C9D6E6}
.barras-pond{background:var(--marino)}
.barras-val{text-align:right;font-variant-numeric:tabular-nums;font-weight:600}
.muestra{display:inline-block;width:10px;height:10px;border-radius:3px;vertical-align:middle}
.muestra-pond{background:var(--marino)}
.muestra-total{background:#C9D6E6}
@media (max-width:600px){.barras li{grid-template-columns:minmax(0,1fr) 80px}.barras-pista{grid-column:1 / -1;order:3}}
.medidor-mini{display:inline-block;width:60px;height:8px;background:var(--fondo);border-radius:99px;overflow:hidden;vertical-align:middle;margin-right:6px}
.medidor-mini span{display:block;height:100%}
.m-bien{background:var(--verde)}
.m-ojo{background:#E0A33A}
.m-mal{background:var(--critico)}

/* Filtros */
.filtros{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:16px}
.filtros input[type=search]{max-width:300px}
.filtros select{width:auto;max-width:220px}

/* Embudo (kanban) */
.barra-embudo{display:flex;justify-content:space-between;align-items:center;gap:12px 20px;flex-wrap:wrap;margin-bottom:16px}
.barra-embudo .filtros{margin:0}
.leyenda-estados{display:flex;flex-wrap:wrap;gap:6px 16px;list-style:none;margin:0;padding:0;font-size:.84rem;color:var(--azul)}
.leyenda-estados li{display:flex;align-items:center;gap:6px}
.punto{width:10px;height:10px;border-radius:50%;flex:none}
.p-ok{background:var(--lima)}
.p-sin_accion{background:#E0A33A}
.p-vencida{background:var(--critico)}
.p-estancada{background:var(--gris)}
/* Todas las etapas caben en el ancho: solo en pantallas chicas aparece el desplazamiento lateral. */
.kanban{display:grid;grid-template-columns:repeat(var(--columnas,5),minmax(0,1fr));gap:10px;align-items:start}
@media (max-width:1100px){.kanban{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(230px,1fr);overflow-x:auto;padding-bottom:10px}}
.kanban-col{background:#E9EEF3;border-radius:var(--radio);padding:8px;transition:background .15s}
.kanban-col.sobre{background:#D6E8C2}
.kanban-col header{background:var(--blanco);border-radius:8px;padding:10px 12px;margin-bottom:8px;border-top:3px solid var(--marino)}
.kcol-tit{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}
.kanban-col h2{font-size:.92rem;margin:0;line-height:1.25}
.kcol-n{flex:none;min-width:24px;height:22px;padding:0 7px;border-radius:99px;background:var(--fondo);color:var(--marino);font-weight:700;font-size:.8rem;display:flex;align-items:center;justify-content:center}
.kcol-datos{display:flex;justify-content:space-between;align-items:baseline;margin-top:4px;font-size:.8rem;color:var(--nota)}
.kcol-datos strong{font-size:1rem;color:var(--marino);font-variant-numeric:tabular-nums}
.kanban-lista{display:flex;flex-direction:column;gap:8px;min-height:70px}
.kanban-vacio{margin:0;padding:18px 8px;text-align:center;font-size:.82rem;color:var(--nota);border:1.5px dashed #CBD5E0;border-radius:8px}
.tarjeta{background:var(--blanco);border-radius:8px;padding:10px 12px;box-shadow:var(--sombra);border-left:4px solid var(--lima);font-size:.88rem}
.tarjeta[draggable=true]{cursor:grab}
.tarjeta.arrastrando{opacity:.5}
.tarjeta.s-sin_accion{border-left-color:#E0A33A}
.tarjeta.s-vencida{border-left-color:var(--critico)}
.tarjeta.s-estancada{border-left-color:var(--gris)}
.tarjeta-cab{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px;font-size:.75rem}
.tarjeta-tit{display:block;font-weight:700;color:var(--marino);text-decoration:none;line-height:1.3}
.tarjeta-tit:hover{text-decoration:underline}
.tarjeta-cli{color:var(--azul);font-size:.82rem}
.tarjeta-pie{display:flex;justify-content:space-between;margin-top:6px}
.tarjeta-pie small{font-weight:500;color:var(--nota)}
.tarjeta-prox{margin-top:6px;padding-top:6px;border-top:1px dashed var(--linea);font-size:.8rem;color:var(--cuerpo)}

/* Ficha de oportunidad */
.op-cabecera{display:flex;gap:18px;align-items:center;margin-bottom:16px;flex-wrap:wrap}
.op-cab-txt{flex:1;min-width:240px}
.op-cab-txt h1{margin:0 0 4px}
.op-cab-acc{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.op-mini{display:flex;gap:14px;align-items:center}
.etapas-barra{display:flex;gap:4px;margin:0 0 18px;overflow-x:auto;padding-bottom:4px}
.etapa-paso{flex:1 0 auto;margin:0}
.etapa-paso button,.etapa-paso > span{display:block;width:100%;font:600 .82rem var(--letra);padding:9px 18px;border:0;background:#E3E9EF;color:var(--azul);text-align:center;white-space:nowrap;clip-path:polygon(0 0,calc(100% - 10px) 0,100% 50%,calc(100% - 10px) 100%,0 100%,10px 50%)}
.etapa-paso button{cursor:pointer}
.etapa-paso button:hover{background:#CFDAE5;color:var(--marino)}
.etapa-paso.pasada button,.etapa-paso.pasada > span{background:#C9DFB2;color:#2F5A10}
.etapa-paso.actual > span{background:var(--marino);color:#fff}
.etapa-paso.actual.tipo-ganada > span{background:var(--verde)}
.etapa-paso.actual.tipo-perdida > span{background:var(--critico)}
.linea-tiempo{list-style:none;margin:16px 0 0;padding:0 0 0 14px;border-left:2px solid var(--linea)}
.linea-tiempo li{position:relative;padding:0 0 14px 10px}
.linea-tiempo li::before{content:"";position:absolute;left:-21px;top:5px;width:12px;height:12px;border-radius:50%;background:var(--gris);border:2px solid #fff}
.linea-tiempo .lt-nota::before{background:var(--azul)}
.linea-tiempo .lt-hecha::before{background:var(--verde)}
.linea-tiempo .lt-etapa::before{background:var(--marino)}
.linea-tiempo .lt-tarea::before{background:var(--lima)}
.linea-tiempo .lt-reprogramada::before{background:#E0A33A}
.lt-meta{font-size:.78rem;color:var(--nota)}
.lt-texto{font-size:.92rem}
.nota-form textarea{margin-bottom:6px}

/* Formulario de oportunidad */
.paso h2{display:flex;align-items:center;gap:10px}
.paso-n{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:var(--marino);color:#fff;font-size:.9rem;flex:none}
.paso-clave{border:2px solid var(--lima)}
.paso-clave .paso-n{background:var(--lima);color:var(--marino)}
.empresas-elegir{display:grid;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:8px}
.empresa-opcion{margin:0!important;cursor:pointer;position:relative}
.empresa-opcion input{position:absolute;opacity:0}
.empresa-tarjeta{display:flex;align-items:center;justify-content:center;height:58px;border:2px solid var(--linea);border-radius:9px;background:#fff;padding:6px 10px;transition:border-color .15s,box-shadow .15s}
.empresa-tarjeta .logo-tarjeta{height:auto;max-height:34px;max-width:100%}
.empresa-sin-logo{font-weight:800;color:var(--marino);font-size:.88rem;text-align:center;line-height:1.15}
.empresa-opcion:hover .empresa-tarjeta{border-color:var(--gris)}
.empresa-opcion input:checked + .empresa-tarjeta{border-color:var(--marino);box-shadow:0 0 0 3px rgba(140,198,63,.45)}
.empresa-opcion input:focus-visible + .empresa-tarjeta{outline:3px solid var(--lima);outline-offset:2px}
.segmentado{display:inline-flex;flex-wrap:wrap;border:1.5px solid var(--gris);border-radius:9px;overflow:hidden;margin-bottom:12px}
.segmentado label{margin:0!important;padding:8px 14px;cursor:pointer;font-weight:600;font-size:.88rem;color:var(--azul);display:flex;align-items:center;gap:6px}
.segmentado label:has(input:checked){background:var(--marino);color:#fff}
.segmentado input{accent-color:var(--lima)}
.segmentado-ancho{display:flex}
.grilla-campos,.grilla-accion{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px 14px}
.grilla-campos label,.grilla-accion label{margin-top:8px}
.span-2{grid-column:span 2}
.span-3{grid-column:1 / -1}
@media (max-width:760px){.grilla-campos,.grilla-accion{grid-template-columns:minmax(0,1fr)}.span-2,.span-3{grid-column:auto}}
.sub-bloque{margin-top:16px;padding-top:12px;border-top:1px dashed var(--linea)}
.sub-bloque h3{margin:0}
.checks{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}
.check-chip{margin:0!important;display:inline-flex;align-items:center;gap:6px;border:1.5px solid var(--linea);border-radius:99px;padding:6px 12px;font-weight:500!important;cursor:pointer;background:#fff}
.check-chip:has(input:checked){border-color:var(--marino);background:#EAF3DD}
.campo-doble{display:flex;gap:6px}
.campo-doble select{width:auto;flex:none}
.atajos-fecha{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:10px;font-size:.85rem}
.barra-guardar{display:flex;justify-content:flex-end;gap:10px;margin:8px 0 30px;flex-wrap:wrap}
.grilla-empresas{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:18px;margin-bottom:18px}
.grilla-empresas > .panel{margin:0}
.emp-cab{height:60px;display:flex;align-items:center;margin-bottom:8px}
dialog.cuadro-ayuda{border:0;border-radius:12px;padding:22px;max-width:480px;width:calc(100% - 32px);box-shadow:0 20px 60px rgba(22,40,74,.3)}
dialog.cuadro-ayuda::backdrop{background:rgba(22,40,74,.45)}
@media (max-width:600px){.empresas-elegir{grid-template-columns:repeat(3,minmax(0,1fr))}.empresa-tarjeta{height:50px}}
.autocompletar{position:relative}
.autocompletar-lista{position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:20;list-style:none;margin:0;padding:4px;background:#fff;border:1.5px solid var(--gris);border-radius:9px;box-shadow:0 12px 30px rgba(22,40,74,.18);max-height:340px;overflow-y:auto}
.autocompletar-lista li{padding:8px 10px;border-radius:6px;cursor:pointer;display:flex;flex-wrap:wrap;gap:4px 8px;align-items:baseline}
.autocompletar-lista li small{color:var(--nota);margin-left:auto;white-space:nowrap;font-variant-numeric:tabular-nums}
.autocompletar-lista li.activo{background:var(--fondo);box-shadow:inset 3px 0 0 var(--lima)}
.autocompletar-lista mark{background:#E4F1D2;color:inherit;padding:0 1px;border-radius:2px}
.autocompletar-nuevo{color:var(--verde);font-weight:600;border-top:1px solid var(--linea);margin-top:2px}

/* Adjuntos */
.adjuntar{margin-top:12px}
.adjuntar-caja{display:flex!important;flex-direction:column;align-items:center;gap:2px;margin:0!important;padding:16px;border:2px dashed var(--gris);border-radius:10px;background:var(--fondo);text-align:center;cursor:pointer;font-weight:500!important;color:var(--cuerpo)!important;transition:border-color .15s,background .15s}
.adjuntar-caja:hover,.adjuntar.sobre .adjuntar-caja{border-color:var(--verde);background:#EEF6E4}
.adjuntar-caja small{color:var(--nota)}
.adjuntar-input{position:absolute;opacity:0;width:1px;height:1px}
.adjuntar-progreso{list-style:none;margin:8px 0 0;padding:0}
.adjuntar-progreso li{display:grid;grid-template-columns:minmax(0,1fr) 110px auto;gap:10px;align-items:center;font-size:.86rem;padding:4px 0}
.adjuntar-progreso .barra{height:8px;background:var(--linea);border-radius:99px;overflow:hidden}
.adjuntar-progreso .barra span{display:block;height:100%;width:0;background:var(--lima);transition:width .2s}
.adjuntar-progreso .ok{color:var(--verde);font-weight:700}
.adjuntar-progreso .error{color:var(--critico);font-weight:600}
.lista-adjuntos{list-style:none;margin:0;padding:0}
.lista-adjuntos li{display:flex;gap:10px;align-items:center;padding:8px 0;border-top:1px solid var(--linea);flex-wrap:wrap}
.lista-adjuntos li:first-child{border-top:0}
.adj-ext{flex:none;width:44px;height:44px;border-radius:8px;background:var(--marino);color:#fff;font-size:.68rem;font-weight:800;display:flex;align-items:center;justify-content:center;letter-spacing:.04em}
.adj-txt{flex:1;min-width:160px;overflow-wrap:anywhere}
.adj-txt .tenue{font-size:.8rem}
.linea-tiempo .lt-archivo::before{background:var(--azul)}
.pagina:has(.kanban){max-width:1600px}

/* Varias empresas por oportunidad */
.empresa-opcion input:checked + .empresa-tarjeta::after{content:"✓";position:absolute;top:-7px;right:-7px;width:20px;height:20px;border-radius:50%;background:var(--marino);color:#fff;font-size:.72rem;font-weight:800;display:flex;align-items:center;justify-content:center}
.empresa-tarjeta{position:relative}
.empresa-opcion.es-lider .empresa-tarjeta::before{content:"Lidera";position:absolute;bottom:-8px;left:50%;transform:translateX(-50%);background:var(--lima);color:var(--marino);font-size:.64rem;font-weight:800;padding:1px 8px;border-radius:99px;letter-spacing:.04em}
.lider-fila{display:flex;align-items:center;gap:10px;margin-top:16px;flex-wrap:wrap}
.lider-fila label{margin:0}
.lider-fila select{width:auto;min-width:200px}
.serv-emp-tit{font-weight:700;color:var(--marino);font-size:.88rem;margin:10px 0 6px}
.logos-op{display:inline-flex;align-items:center;gap:3px;flex-wrap:wrap}
.logo-mas{font-size:.7rem;color:var(--nota);font-weight:700}
.logo-mini.logo-participa{height:16px;max-width:52px;opacity:.85}
.logos-cab{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.logo-cab.logo-participa{height:40px;max-width:120px}
.lista-op li{grid-template-columns:auto minmax(0,1fr) auto}
