/* Diseno P5 (Factor Expres) - extraido de FactorWebP5/index.html. Complementa a Tailwind (CDN). */
@layer base{html,body{margin:0;padding:0;}body{overscroll-behavior:none;}main>:first-child{margin-top:0!important;}main>:last-child{margin-bottom:0!important;}}::-webkit-scrollbar{display:none;}

:root{--fe-header-h:119px;}@media (min-width:768px){:root{--fe-header-h:119px;}}main{padding-top:var(--fe-header-h)!important;}html{scroll-padding-top:calc(var(--fe-header-h) + 12px);}main h1,main h2,main h3{overflow-wrap:break-word;hyphens:auto;}main .grid>*{min-width:0;}main p,main li,main small{overflow-wrap:break-word;}#fe-ia{transition:opacity .2s ease;right:max(1rem,env(safe-area-inset-right));bottom:max(1rem,env(safe-area-inset-bottom));}@media (min-width:640px){#fe-ia{right:1.5rem;bottom:1.5rem;}}#fe-ia[data-oculto="true"]{opacity:0;pointer-events:none;visibility:hidden;transition:opacity .2s ease,visibility 0s linear .2s;}@media (prefers-reduced-motion:reduce){#fe-ia,#fe-ia[data-oculto="true"]{transition:none;}}body>footer{padding-bottom:calc(3rem + 72px)!important;}@media (min-width:640px){body>footer{padding-bottom:calc(3rem + 40px)!important;}}@media (max-width:420px){:has(>#tab-credito):has(>#tab-arrendamiento){display:grid!important;grid-template-columns:1fr 1fr 1.45fr!important;gap:4px!important;}#tab-credito,#tab-factoraje,#tab-arrendamiento{font-size:12px!important;letter-spacing:0!important;padding-left:2px!important;padding-right:2px!important;white-space:nowrap;min-width:0;}.term-chip{white-space:nowrap;font-size:14px!important;padding-left:4px!important;padding-right:4px!important;min-width:0;}.term-chip .material-symbols-outlined{font-size:16px!important;}}
/* P5 · AÑADIR al final de <style id="fe-estilos-comunes"> (las 10 páginas).
   Incluye el loader (b) y el soporte del menú móvil y del desplegable Productos (d). */

/* ---- (b) Loader de transición entre páginas ---- */
#fe-loader{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;background:rgba(251,249,248,.72);-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);opacity:0;pointer-events:none;transition:opacity .15s ease;}
#fe-loader[data-activo="true"]{opacity:1;pointer-events:auto;}
#fe-loader .fe-barra{position:absolute;top:0;left:0;height:3px;width:30%;background:linear-gradient(90deg,#0057C2,#00807C);animation:fe-barra 1.1s ease-in-out infinite;}
#fe-loader .fe-spin{width:44px;height:44px;border-radius:50%;border:4px solid #D9E2FF;border-top-color:#0057C2;animation:fe-giro .8s linear infinite;}
@keyframes fe-giro{to{transform:rotate(360deg);}}
@keyframes fe-barra{0%{left:-30%;}100%{left:100%;}}
@media (prefers-reduced-motion:reduce){
  #fe-loader{transition:none;}
  #fe-loader .fe-spin{animation-name:none;border-top-color:#0057C2;border-right-color:#0057C2;}
  #fe-loader .fe-barra{animation-name:none;left:0;width:100%;}
}

/* ---- (d) Desplegable «Productos» de escritorio (abre por clic, teclado o ratón; ver fe-comun) ---- */
#fe-productos-menu[data-open="true"]{display:flex;}
#fe-productos-btn .fe-chevron{transition:transform .15s ease;}
#fe-productos-btn[aria-expanded="true"] .fe-chevron{transform:rotate(180deg);}

/* ---- (d) Menú móvil / tableta (< 1280 px) ---- */
#fe-menu-movil{max-height:calc(100vh - var(--fe-header-h));max-height:calc(100dvh - var(--fe-header-h));overflow-y:auto;overscroll-behavior:contain;}
#fe-menu-movil[hidden]{display:none;}
@media (min-width:1280px){#fe-menu-movil{display:none !important;}}
@media (prefers-reduced-motion:reduce){#fe-productos-btn .fe-chevron{transition:none;}}

/* ---- (c) simuladores.html: filas del desglose, incluidas las que inserta el motor ---- */
.fe-filas>div{display:flex;align-items:baseline;justify-content:space-between;gap:.75rem;}
.fe-filas>div>:first-child{flex:1 1 auto;min-width:0;}
.fe-filas>div>:last-child{flex:0 1 auto;max-width:60%;text-align:right;}

/* ===== inicio v2 (P8 y P5) · AÑADIR al final de <style id="fe-estilos-comunes"> =====
   Mismo bloque para ambas propuestas. Todo va acotado a #simulador-inicio, así que no afecta
   a simuladores.html ni a las páginas de producto. Estados activos en CSS para no depender de
   las variantes aria-*: / [&.active]: del CDN y para que los chips que clona el motor (6 y 48)
   hereden el estilo sin clases extra. */
#simulador-inicio .tab-btn,#simulador-inicio .term-chip{white-space:nowrap;min-width:0;}
#simulador-inicio .tab-btn.active,#simulador-inicio .tab-btn[aria-selected="true"]{background:#0057C2;color:#fff;font-weight:700;box-shadow:0 1px 2px rgba(0,34,82,.18);}
#simulador-inicio .term-chip.active,#simulador-inicio .term-chip[aria-pressed="true"]{background:#B4EDED;color:#002252;border-color:#0057C2;font-weight:700;}
#simulador-inicio .tab-btn:focus-visible,#simulador-inicio .term-chip:focus-visible,#simulador-inicio select:focus-visible,#simulador-inicio input[type="range"]:focus-visible,#simulador-inicio a:focus-visible{outline:2px solid #0057C2;outline-offset:2px;}
#simulador-inicio input[type="range"]{touch-action:pan-y;}
/* Filas del resultado, incluidas las que inserte o clone el motor */
#simulador-inicio .border-l-4>div:has(>span+span){display:flex;align-items:baseline;justify-content:space-between;gap:.75rem;}
#simulador-inicio .border-l-4>div:has(>span+span)>:first-child{flex:1 1 auto;min-width:0;}
#simulador-inicio .border-l-4>div:has(>span+span)>:last-child{flex:0 1 auto;max-width:60%;text-align:right;}
@media (prefers-reduced-motion:reduce){#simulador-inicio *,#simulador-inicio *::before{transition:none!important;}}
