/* Serenity Escaneo Flash · aviso flotante (botón con radar + tarjeta con puntaje) */
.sff{--n2:#10293A;--n3:#14344A;--az:#0083AD;--az2:#42A8C6;--bd:#1E4258;--tx:#E8F1F5;--tx2:#9FB6C2;font-family:"Helvetica Neue",Arial,sans-serif;line-height:1.4}
.sff *{box-sizing:border-box}
.sff-boton{position:fixed;right:20px;bottom:20px;z-index:99990;display:flex;align-items:center;gap:10px;padding:8px 18px 8px 8px;border-radius:999px;
  background:linear-gradient(135deg,var(--az),#005f80);color:#fff!important;text-decoration:none!important;font-weight:700;font-size:14px;
  box-shadow:0 12px 26px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.25);transition:transform .25s,opacity .25s}
.sff-boton:hover{transform:translateY(-3px)}
.sff-txt small{display:block;font-weight:400;font-size:11px;color:#d6eef6}
.sff-radar{position:relative;width:38px;height:38px;border-radius:50%;flex:none;background:#0083AD;
  background-image:radial-gradient(circle,#BFE8F4 0 3px,transparent 4px),repeating-radial-gradient(circle,transparent 0 6px,rgba(255,255,255,.35) 7px 8px);
  box-shadow:0 0 0 0 rgba(66,168,198,.5);animation:sff-late 2.4s ease-out infinite;overflow:hidden}
.sff-radar:after{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(rgba(255,255,255,.6),transparent 28%);animation:sff-gira 3s linear infinite}
@keyframes sff-gira{to{transform:rotate(360deg)}}
@keyframes sff-late{70%{box-shadow:0 0 0 14px rgba(66,168,198,0)}100%{box-shadow:0 0 0 0 rgba(66,168,198,0)}}
.sff.sff-abierta .sff-boton{opacity:0;pointer-events:none;transform:translateY(10px)}
.sff-tarjeta{position:fixed;right:20px;bottom:20px;z-index:99991;width:300px;padding:16px;border-radius:16px;color:var(--tx);
  background:linear-gradient(160deg,var(--n3),var(--n2));border:1px solid var(--bd);
  box-shadow:-14px 22px 46px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.06);
  transform:perspective(700px) rotateY(-8deg) translateY(20px);opacity:0;transition:transform .45s cubic-bezier(.2,.8,.2,1),opacity .45s}
.sff .sff-tarjeta[hidden]{display:none}
.sff.sff-abierta .sff-tarjeta{opacity:1;visibility:visible;transform:perspective(700px) rotateY(-8deg) translateY(0)}
.sff-cerrar{position:absolute;right:8px;top:6px;background:none;border:0;color:var(--tx2);font-size:20px;line-height:1;cursor:pointer;padding:4px}
.sff-cerrar:hover{color:#fff}
.sff-tag{display:inline-block;background:#F2A33A;color:#0B1F2A;font-size:10px;font-weight:800;letter-spacing:1px;border-radius:4px;padding:2px 7px;margin-bottom:8px}
.sff-fila{display:flex;gap:12px;align-items:center}
.sff-gauge{width:64px;height:64px;flex:none;filter:drop-shadow(0 6px 8px rgba(0,0,0,.4))}
.sff-arco{stroke-dashoffset:122;transition:stroke-dashoffset 1.2s ease .3s}
.sff.sff-abierta .sff-arco{stroke-dashoffset:0}
.sff-fila strong{display:block;font-size:14px;color:#fff;margin-bottom:3px}
.sff-fila em{font-style:normal;font-size:12px;color:var(--tx2)}
.sff-cta{display:block;margin-top:12px;text-align:center;background:var(--az);color:#fff!important;text-decoration:none!important;border-radius:9px;padding:10px;
  font-weight:700;font-size:13px;box-shadow:0 8px 18px rgba(0,131,173,.35)}
.sff-cta:hover{background:#0095c4}
@media (max-width:600px){
  .sff-boton{padding:6px;right:14px;bottom:14px}.sff-txt{display:none}
  .sff-tarjeta{right:12px;left:12px;bottom:12px;width:auto;transform:translateY(20px)}
  .sff.sff-abierta .sff-tarjeta{transform:none}
}
@media (prefers-reduced-motion:reduce){.sff-radar,.sff-radar:after{animation:none}.sff-tarjeta,.sff-arco,.sff-boton{transition:none}}
/* Esquina izquierda (por defecto: la derecha suele estar ocupada por el carrito o el chat) */
.sff-izquierda .sff-boton{right:auto;left:20px}
.sff-izquierda .sff-tarjeta{right:auto;left:20px;transform:perspective(700px) rotateY(8deg) translateY(20px)}
.sff-izquierda.sff-abierta .sff-tarjeta{transform:perspective(700px) rotateY(8deg) translateY(0)}
@media (max-width:600px){
  .sff-izquierda .sff-boton{left:14px}
  .sff-izquierda .sff-tarjeta,.sff-izquierda.sff-abierta .sff-tarjeta{left:12px;right:12px}
  .sff-izquierda .sff-tarjeta{transform:translateY(20px)}.sff-izquierda.sff-abierta .sff-tarjeta{transform:none}
}

/* Por encima del botón de WhatsApp (izquierda) o del carrito (derecha), que ocupan las esquinas */
.sff .sff-boton,.sff .sff-tarjeta{bottom:104px}
@media (max-width:600px){.sff .sff-boton{bottom:96px}.sff .sff-tarjeta{bottom:92px}}
/* Por encima de los botones flotantes de otros plugins (WhatsApp, carrito) */
.sff .sff-boton{z-index:2147483000}.sff .sff-tarjeta{z-index:2147483001}