/* PrimePass — overlay de carga (spinner) y toasts. CSS estático (no pasa por Tailwind). */
.pp-loading {
  position: fixed; inset: 0; background: rgba(15, 23, 42, .45);
  display: none; align-items: center; justify-content: center; z-index: 9999;
  backdrop-filter: blur(1px);
}
.pp-loading.show { display: flex; }
.pp-loading .pp-spinner {
  width: 54px; height: 54px; border: 5px solid rgba(255, 255, 255, .35);
  border-top-color: #1296E8; border-radius: 50%; animation: pp-spin .8s linear infinite;
}

/* Barra de progreso superior: indeterminada, se muestra durante la navegación entre páginas. */
#pp-progress {
  position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 10001;
  overflow: hidden; display: none; pointer-events: none;
}
#pp-progress.show { display: block; }
#pp-progress::before {
  content: ""; position: absolute; top: 0; height: 100%; width: 35%; left: -35%;
  background: linear-gradient(90deg, rgba(18,150,232,0), #1296E8 45%, #3BA7F0 60%, rgba(18,150,232,0));
  animation: pp-progress-move 1.05s ease-in-out infinite;
}
@keyframes pp-progress-move { 0% { left: -35%; } 100% { left: 100%; } }
.pp-loading .pp-loading-txt { color: #fff; margin-top: 14px; font-size: 14px; font-weight: 600; }
.pp-loading .pp-loading-box { display: flex; flex-direction: column; align-items: center; }
@keyframes pp-spin { to { transform: rotate(360deg); } }

#pp-toasts {
  position: fixed; top: 18px; right: 18px; z-index: 10000;
  display: flex; flex-direction: column; gap: 10px; max-width: 400px;
}
.pp-toast {
  padding: 12px 16px; border-radius: 12px; color: #fff; font-size: 14px; line-height: 1.35;
  box-shadow: 0 12px 34px rgba(0, 0, 0, .22); opacity: 0; transform: translateY(-10px);
  transition: opacity .25s ease, transform .25s ease;
}
.pp-toast.show { opacity: 1; transform: none; }
.pp-toast b { font-weight: 700; }
.pp-toast-ok { background: #15803d; }
.pp-toast-error { background: #b91c1c; }
/* #1296E8 solo daba 3.20:1 con el texto blanco del toast; #1677C8 da 4.66:1.
   El azul de marca se queda arriba, en el spinner y la barra de progreso, que
   son decorativos y no llevan texto encima. */
.pp-toast-info { background: #1677C8; }