/* Squuad Interfaz · asterisco, nota de obligatorios y animación de espera */

/* Asterisco: el mismo rojo en todo el portal (el color sale de Ajustes). */
.sqif-ast{color:var(--sqif-rojo,#B42318)!important;font-weight:700;text-decoration:none!important;border:0!important;margin-left:.2em;visibility:visible!important;cursor:inherit}
.sqif-nota{font-size:15px;line-height:1.5;color:#5B6576;margin:0 0 14px;flex-basis:100%;grid-column:1/-1;width:100%}
.sqif-nota .sqif-ast{margin:0 .15em}
.sqif-ast-suelto{margin-left:.3em;align-self:center;font-size:1.1em;line-height:1}

/* Botón trabajando */
.sqif-trabajando{cursor:progress!important}
.sqif-trabajando:not(:has(.sqif-ico)){opacity:.75}
.sqif-ico{display:inline-flex;align-items:center;justify-content:center;width:1.3em;height:1.3em;margin-right:.5em;flex:none;vertical-align:-.28em;pointer-events:none}
.sqif-ico .sqif-ani{width:100%;height:100%}

/* Aviso cuando tarda */
.sqif-aviso{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translate(-50%,16px);max-width:min(92vw,460px);
  background:#0F2A4A;color:#fff;padding:12px 18px;border-radius:12px;font:600 15px/1.45 "Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",sans-serif;text-align:center;
  box-shadow:0 12px 30px -10px rgba(15,42,74,.6);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;z-index:999999}
.sqif-aviso.is-on{opacity:1;transform:translate(-50%,0)}
.sqif-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;margin:-1px;padding:0;border:0}

/* ---------- Dibujos (trazo 24×24, color de la letra del botón) ---------- */
.sqif-ani{display:block;overflow:visible;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.sqif-ani *{transform-box:view-box}
.sqif-ani .relleno{fill:currentColor;stroke:none}
.sqif-ani .papel{fill:var(--sqif-fondo,transparent)}
.sqif-ani .arena{fill:var(--sqif-arena,currentColor);stroke:none}
.sqif-ani .arena-l{stroke:var(--sqif-arena,currentColor)}

/* Balanza */
.sqif-balanza .viga{transform-origin:12px 7px;animation:sqif-viga 2.6s ease-in-out infinite}
.sqif-balanza .pi{animation:sqif-pi 2.6s ease-in-out infinite}
.sqif-balanza .pd{animation:sqif-pd 2.6s ease-in-out infinite}
@keyframes sqif-viga{0%,100%{transform:rotate(0)}15%{transform:rotate(-12deg)}35%{transform:rotate(9deg)}52%{transform:rotate(-5deg)}66%{transform:rotate(2deg)}78%{transform:rotate(0)}}
@keyframes sqif-pi{0%,100%{transform:translateY(0)}15%{transform:translateY(1.46px)}35%{transform:translateY(-1.1px)}52%{transform:translateY(.61px)}66%{transform:translateY(-.24px)}78%{transform:translateY(0)}}
@keyframes sqif-pd{0%,100%{transform:translateY(0)}15%{transform:translateY(-1.46px)}35%{transform:translateY(1.1px)}52%{transform:translateY(-.61px)}66%{transform:translateY(.24px)}78%{transform:translateY(0)}}

/* Círculo que gira (escogido por José, 11/10/2026): el arco gira y se estira */
.sqif-circulo .rueda{transform-origin:12px 12px;animation:sqif-rueda 1.4s linear infinite}
.sqif-circulo .arco{stroke-width:2.4;stroke-dasharray:1 100;animation:sqif-arco 1.4s ease-in-out infinite}
@keyframes sqif-rueda{to{transform:rotate(360deg)}}
@keyframes sqif-arco{0%{stroke-dasharray:1 100;stroke-dashoffset:0}50%{stroke-dasharray:62 100;stroke-dashoffset:-14}100%{stroke-dasharray:62 100;stroke-dashoffset:-99}}

/* Reloj de arena (variante B2): 3,2 s por vuelta y la arena llena hasta las tapas */
.sqif-reloj .giro{transform-origin:12px 12px;animation:sqif-giro 3.2s ease-in-out infinite}
.sqif-reloj .ar{animation:sqif-ar 3.2s linear infinite}
.sqif-reloj .ab{animation:sqif-ab 3.2s linear infinite}
.sqif-reloj .chorro{stroke-dasharray:1.2 1.4;animation:sqif-chorro 3.2s linear infinite}
@keyframes sqif-giro{0%,74%{transform:rotate(0)}92%,100%{transform:rotate(180deg)}}
@keyframes sqif-ar{0%{transform:translateY(0)}70%,100%{transform:translateY(9px)}}
@keyframes sqif-ab{0%{transform:translateY(0)}70%,100%{transform:translateY(-9px)}}
@keyframes sqif-chorro{0%{opacity:0;stroke-dashoffset:0}6%{opacity:1}66%{opacity:1;stroke-dashoffset:-12}70%,100%{opacity:0;stroke-dashoffset:-13}}

/* Calculadora */
.sqif-calc .cifra{stroke-dasharray:10;animation:sqif-cifra 2.6s steps(4,end) infinite}
.sqif-calc .tecla{opacity:.28;animation:sqif-tecla 2.6s ease-out infinite}
@keyframes sqif-cifra{0%{stroke-dashoffset:10}70%,100%{stroke-dashoffset:0}}
@keyframes sqif-tecla{0%,100%{opacity:.28}6%{opacity:1}18%{opacity:.28}}

/* Sello */
.sqif-sello .estampa{animation:sqif-estampa 2.4s cubic-bezier(.5,0,.3,1) infinite}
.sqif-sello .huella{animation:sqif-huella 2.4s linear infinite}
@keyframes sqif-estampa{0%,100%{transform:translateY(0)}28%{transform:translateY(-1.2px)}40%{transform:translateY(4.5px)}54%{transform:translateY(4.5px)}72%{transform:translateY(0)}}
@keyframes sqif-huella{0%,40%{opacity:0}43%{opacity:.95}88%{opacity:.95}100%{opacity:0}}

/* Pluma que firma */
.sqif-pluma .firma{stroke-dasharray:100;animation:sqif-firma 2.8s ease-in-out infinite}
.sqif-pluma .linea{opacity:.4}
.sqif-pluma .pluma{animation:sqif-plum 2.8s ease-in-out infinite}
@keyframes sqif-firma{0%{stroke-dashoffset:100;opacity:1}62%{stroke-dashoffset:0;opacity:1}86%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:0}}
@keyframes sqif-plum{0%{transform:translate(3px,16.5px);opacity:1}62%{transform:translate(21px,15px);opacity:1}80%{transform:translate(21px,13px);opacity:0}100%{transform:translate(3px,16.5px);opacity:0}}

/* Expediente */
.sqif-exp .hoja{animation:sqif-hoja 2.6s ease-in-out infinite}
@keyframes sqif-hoja{0%{transform:translateY(-4px);opacity:0}14%{transform:translateY(-2px);opacity:1}55%{transform:translateY(5px);opacity:1}80%{transform:translateY(5px);opacity:1}94%,100%{transform:translateY(5px);opacity:0}}

/* Quien tiene apagado el movimiento: el dibujo quieto con un pulso suave. */
@keyframes sqif-pulso{0%,100%{opacity:1}50%{opacity:.45}}
@media (prefers-reduced-motion: reduce){
  .sqif-ani *{animation:none!important}
  .sqif-reloj .chorro,.sqif-pluma .pluma{opacity:0}
  .sqif-sello .huella{opacity:.95}
  .sqif-circulo .arco{stroke-dasharray:62 100}
  .sqif-ico .sqif-ani{animation:sqif-pulso 1.6s ease-in-out infinite}
  .sqif-aviso{transition:none}
}
