/* SeixPanel · Recorrido interactivo — estilos (namespaced .sim, no toca la pagina) */
.sim{margin:26px 0 6px}
.sim-cab{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap}
.sim h2{margin:0 0 4px}
.sim-reset{appearance:none;border:2px solid #12203C;background:#fff;color:#12203C;font-weight:800;font-size:.95rem;border-radius:999px;padding:10px 18px;min-height:48px;cursor:pointer;transition:transform .15s ease,background .2s ease}
.sim-reset:hover{background:#EEF2F7}
.sim-reset:active{transform:scale(.96)}
.sim-progreso{background:#E4EAF2;border-radius:999px;height:18px;overflow:hidden;margin:14px 0 6px;position:relative}
.sim-progreso-relleno{height:100%;width:0%;border-radius:999px;background:linear-gradient(90deg,#14D86E,#1FBFF2,#3D9BFF,#A06BFF);transition:width .7s cubic-bezier(.22,1,.36,1)}
.sim-progreso-txt{font-size:.9rem;color:#3D4A5C;font-weight:700;margin:0 0 12px}
.sim-pista{min-height:1.5em;font-weight:700;color:#B54708;margin:0 0 10px}
.sim-pista:empty{display:none}
.sim-etapas{display:grid;gap:14px}
.sim-etapa{background:#F8FAFF;background:linear-gradient(165deg,color-mix(in srgb,var(--c,#0B5FFF) 16%,#fff) 0%,color-mix(in srgb,var(--c,#0B5FFF) 7%,#fff) 55%,color-mix(in srgb,var(--c,#0B5FFF) 3%,#fff) 100%);border:1px solid #D8DEE7;border-left:8px solid var(--c,#0B5FFF);border-radius:14px;padding:16px;position:relative;transition:box-shadow .3s ease,opacity .3s ease,transform .3s ease,border-color .35s ease}
.sim-etapa[data-estado="pendiente"]{opacity:.62}
.sim-etapa[data-estado="activa"]{opacity:1;box-shadow:0 0 0 3px var(--c,#0B5FFF),0 10px 26px rgba(18,32,60,.16)}
.sim-etapa[data-estado="hecha"]{opacity:1;background:#F8FAFF;background:linear-gradient(165deg,color-mix(in srgb,var(--c,#0B5FFF) 27%,#fff) 0%,color-mix(in srgb,var(--c,#0B5FFF) 14%,#fff) 55%,color-mix(in srgb,var(--c,#0B5FFF) 7%,#fff) 100%);border-color:color-mix(in srgb,var(--c,#0B5FFF) 42%,#D8DEE7);border-left:8px solid var(--c,#0B5FFF)}
.sim-etapa-cab{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.sim-num{flex:0 0 auto;width:34px;height:34px;border-radius:50%;background:var(--c,#0B5FFF);color:#12203C;font-weight:900;display:flex;align-items:center;justify-content:center;font-size:1.05rem}
.sim-etapa[data-estado="hecha"] .sim-num{background:var(--c,#0B5FFF)}
.sim-titulo{font-weight:800;color:#12203C;font-size:1.08rem}
.sim-check{margin-left:auto;font-size:1.3rem;color:#067647;opacity:0;transform:scale(.4)}
.sim-etapa[data-estado="hecha"] .sim-check{opacity:1;transform:scale(1);transition:transform .35s cubic-bezier(.34,1.56,.64,1),opacity .2s}
.sim-desc{color:#3D4A5C;margin:0 0 12px}
.sim-escena{min-height:10px}
.sim-escena:empty{display:none}
.sim-btn{appearance:none;width:100%;border:none;border-radius:14px;min-height:58px;padding:12px 16px;font-size:1.08rem;font-weight:900;color:#12203C;background:var(--c,#0B5FFF);cursor:pointer;position:relative;overflow:hidden;box-shadow:0 6px 16px rgba(18,32,60,.18);transition:transform .12s ease,box-shadow .2s ease,filter .2s ease}
.sim-btn:hover{filter:brightness(1.05)}
.sim-btn:active{transform:scale(.97)}
.sim-btn .dedo{display:inline-block;margin-right:8px;animation:sim-toca 1.1s ease-in-out infinite}
@keyframes sim-toca{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
.sim-etapa[data-estado="hecha"] .sim-btn,.sim-etapa[data-estado="hecha"] .sim-btn:hover{background:#E7F6EC;color:#067647;box-shadow:none;cursor:default;filter:none}
.sim-etapa[data-estado="pendiente"] .sim-btn{background:#EDF1F6;color:#5B6B80;box-shadow:none}
.sim-onda{position:absolute;border-radius:50%;background:rgba(255,255,255,.65);transform:scale(0);animation:sim-onda .55s ease-out forwards;pointer-events:none}
@keyframes sim-onda{to{transform:scale(3.2);opacity:0}}
.sim-sacude{animation:sim-sacude .45s ease}
@keyframes sim-sacude{0%,100%{transform:translateX(0)}20%{transform:translateX(-7px)}45%{transform:translateX(6px)}70%{transform:translateX(-4px)}90%{transform:translateX(2px)}}
/* Documentos y tarjetas que aparecen */
.sim-doc{display:none;background:#F8FAFF;background:color-mix(in srgb,var(--c,#0B5FFF) 9%,#fff);border:1.5px dashed var(--c,#0B5FFF);border-radius:12px;padding:12px 14px;margin:0 0 12px}
.sim-doc.visible{display:block;animation:sim-doc-entra .45s cubic-bezier(.22,1,.36,1)}
@keyframes sim-doc-entra{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
.sim-doc .sim-doc-t{font-weight:900;color:#12203C}
.sim-dato{font-family:ui-monospace,Consolas,monospace;font-size:.92rem;background:#EEF2F7;border-radius:6px;padding:1px 6px;display:inline-block}
.sim-chip{display:inline-block;border-radius:999px;padding:2px 12px;font-size:.82rem;font-weight:800;background:#E7F6EC;color:#067647;border:1px solid #ABEFC6}
.sim-chip.abierta{background:#FEF0C7;color:#7A2E0E;border-color:#FDBA74}
.sim-monto{font-size:1.65rem;font-weight:900;color:#12203C;font-variant-numeric:tabular-nums}
.sim-sello{display:inline-block;border:3px solid #067647;color:#067647;font-weight:900;font-size:1.15rem;letter-spacing:.06em;border-radius:10px;padding:4px 16px;transform:rotate(-8deg) scale(1.7);opacity:0;margin:8px 0}
.sim-sello.visible{opacity:1;transform:rotate(-8deg) scale(1);transition:transform .28s cubic-bezier(.34,1.4,.64,1),opacity .15s ease}
/* Barras de comision */
.sim-fila{margin:0 0 12px}
.sim-fila-cab{display:flex;justify-content:space-between;gap:8px;font-weight:700;color:#17202B;flex-wrap:wrap}
.sim-fila-cab .sim-cifra{font-variant-numeric:tabular-nums;color:#12203C}
.sim-barra{background:#E4EAF2;border-radius:999px;height:20px;overflow:hidden;margin-top:4px}
.sim-barra-relleno{height:100%;width:0%;border-radius:999px;background:var(--c,#FFB800);transition:width 1s cubic-bezier(.22,1,.36,1)}
.sim-total{display:flex;justify-content:space-between;gap:8px;border-top:2px solid #12203C;padding-top:8px;font-weight:900;font-size:1.12rem;color:#12203C;font-variant-numeric:tabular-nums}
/* Cadena de verificacion */
.sim-cadena{display:grid;gap:8px;margin:0 0 12px}
.sim-eslabon{display:flex;align-items:center;gap:10px;background:#F2F7F0;background:color-mix(in srgb,#14D86E 9%,#fff);border:1px solid #CDE7C5;border-radius:10px;padding:9px 12px;font-weight:700;color:#3D4A5C;opacity:.45;transform:translateX(-8px);transition:opacity .4s ease,transform .4s ease}
.sim-eslabon.visible{opacity:1;transform:none}
.sim-eslabon .marca{width:26px;height:26px;flex:0 0 auto;border-radius:50%;background:#067647;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:900}
/* Arbol de red */
.sim-arbol{display:grid;gap:0;margin:0 0 6px}
.sim-nodo{display:flex;align-items:center;gap:10px;background:#fff;background:color-mix(in srgb,var(--c,#A06BFF) 8%,#fff);border:2px solid #D8DEE7;border-radius:12px;padding:9px 12px;font-weight:700;color:#17202B;opacity:.35;transform:translateY(8px);transition:all .45s ease;position:relative;z-index:1}
.sim-nodo.visible{opacity:1;transform:none;border-color:var(--c,#A06BFF);box-shadow:0 0 0 3px rgba(167,139,250,.3),0 6px 14px rgba(18,32,60,.12)}
.sim-nodo .rol{font-size:.85rem;color:#3D4A5C;font-weight:600}
.sim-nodo .sim-cifra{margin-left:auto;font-weight:900;color:#12203C;font-variant-numeric:tabular-nums}
.sim-conector{width:3px;height:14px;background:#C9D4E3;margin:0 auto;transition:background .4s ease}
.sim-conector.visible{background:var(--c,#A06BFF)}
.sim-feed{display:grid;gap:6px;margin-top:10px}
.sim-feed div{display:none;background:#F5F3FF;background:color-mix(in srgb,var(--c,#A06BFF) 10%,#fff);border-left:5px solid var(--c,#A06BFF);border-radius:8px;padding:7px 10px;font-size:.95rem}
.sim-feed div.visible{display:block;animation:sim-feed-entra .4s ease}
@keyframes sim-feed-entra{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
/* Documento completo que se abre al cerrar cada fase (como en el CRM real) */
.sim-verdoc{display:none;appearance:none;align-items:center;gap:8px;border:2px solid var(--c,#0B5FFF);background:#fff;background:color-mix(in srgb,var(--c,#0B5FFF) 10%,#fff);color:#12203C;font-weight:800;font-size:.95rem;border-radius:999px;padding:9px 16px;min-height:46px;cursor:pointer;margin:0 0 12px;transition:background .2s ease,transform .12s ease}
.sim-etapa[data-estado="hecha"] .sim-verdoc{display:inline-flex}
.sim-verdoc:hover{background:#F1F5FB;background:color-mix(in srgb,var(--c,#0B5FFF) 18%,#fff)}
.sim-verdoc:active{transform:scale(.97)}
.sim-hoja{display:none;background:#fff;border:1px solid #D8DEE7;border-radius:14px;box-shadow:0 14px 34px rgba(18,32,60,.14);overflow:hidden;margin:0 0 12px;text-align:left}
.sim-hoja.abierta{display:block;animation:sim-hoja-abre .55s cubic-bezier(.22,1,.36,1)}
@keyframes sim-hoja-abre{from{opacity:0;transform:translateY(16px) scale(.985)}to{opacity:1;transform:none}}
.hja-membrete{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;background:var(--c,#0B5FFF);color:#12203C;padding:11px 16px}
.hja-membrete .hja-tipo{font-weight:900;font-size:1.08rem}
.hja-membrete .hja-marca{font-weight:800;font-size:.85rem;opacity:.85}
.hja-cuerpo{padding:14px 16px;background:#fff;background:color-mix(in srgb,var(--c,#0B5FFF) 4%,#fff)}
.hja-meta{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px 16px;margin:0 0 12px}
.hja-meta span{display:block;font-size:.74rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:#3D4A5C}
.hja-meta b{color:#12203C}
.hja-tabla{width:100%;border-collapse:collapse;font-size:.95rem;margin:0 0 6px}
.hja-tabla th{background:#F1F5FB;background:color-mix(in srgb,var(--c,#0B5FFF) 13%,#fff);color:#12203C;text-align:left;padding:7px 9px;font-size:.85rem}
.hja-tabla td{padding:7px 9px;border-top:1px solid #E4EAF2;color:#17202B}
.hja-tabla .num,.hja-tabla th.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.hja-total{display:flex;justify-content:space-between;gap:8px;border-top:2px solid #12203C;padding-top:8px;margin-top:6px;font-weight:900;font-size:1.08rem;color:#12203C;font-variant-numeric:tabular-nums}
.hja-bloque2{background:#F8FAFF;background:color-mix(in srgb,var(--c,#0B5FFF) 9%,#fff);border:1.5px dashed var(--c,#0B5FFF);border-radius:10px;padding:10px 12px;margin-top:12px;color:#17202B}
.hja-checks{display:grid;gap:6px;margin:10px 0 0}
.hja-checks div{font-weight:700;color:#067647}
.hja-pie{font-size:.88rem;color:#3D4A5C;margin:10px 0 0}
/* Cierre */
.sim-cierre{display:none;background:linear-gradient(135deg,#EFF6FF,#ECFDF3);border:2px solid #14D86E;border-radius:16px;padding:18px;margin-top:16px;text-align:center}
.sim-cierre.visible{display:block;animation:sim-pop .5s cubic-bezier(.34,1.4,.64,1)}
@keyframes sim-pop{from{transform:scale(.92);opacity:0}to{transform:scale(1);opacity:1}}
.sim-cierre .grande{font-size:1.3rem;font-weight:900;color:#12203C}
.sim-cierre .cifras{display:flex;justify-content:center;gap:18px;flex-wrap:wrap;margin:10px 0;font-weight:800;color:#17202B;font-variant-numeric:tabular-nums}
.sim-confeti{position:absolute;width:9px;height:9px;border-radius:2px;pointer-events:none;z-index:5}
@media (prefers-reduced-motion:reduce){
.sim *,.sim *::before,.sim *::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
.sim-btn .dedo{animation:none}
}