/* 1. Contenedor Base - Dimensiones absolutas para evitar colapso ("punto rojo") */
.simuledu-bg-video {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
  /* FALLBACK PREMIUM: Si el video falla, se verá este hermoso gradiente */
  background: radial-gradient(circle at 50% 50%, #0a192f 0%, #020c1b 100%);
}

/* 2. Video posicionado de forma absoluta */
.simuledu-bg-video video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  object-fit: cover;
  /* Más nítido y colorido */
  filter: brightness(1.02) saturate(1.28) contrast(1.12);
  z-index: 0;
  background-color: transparent; /* Permite ver el fallback si el video crashea */
}

/* 3. Overlay oscuro encima del video */
.simuledu-bg-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 1;
  /* Menos oscuro para que el video se note más */
  background: rgba(5, 20, 35, 0.22);
}

/* 4. Canvas de Partículas */
#particles-canvas {
  z-index: 2 !important;
}
/* Root simuledu.io usa #particles (no #particles-canvas) */
#particles {
  z-index: 2 !important;
}

/* Con video activo, baja la “neblina” de partículas para que el fondo se vea más nítido */
html.has-bg-video #particles-canvas{
  opacity: 0.35;
}
html.has-bg-video #particles{
  opacity: 0.35;
}

/* 5. Elevar el contenido principal para que no lo tape el video ni el canvas */
body > header,
body > section,
body > footer {
  position: relative;
  z-index: 10;
}

/* 6. Limpiar fondos del body Y del html cuando hay video activo */
html.has-bg-video,
html.has-bg-video body {
  background-color: transparent !important;
  background-image: none !important;
}

/* Root simuledu.io: la capa principal suele ser .wrap */
html.has-bg-video .wrap {
  position: relative;
  z-index: 10;
}

/* Ocultar en modo ahorro de accesibilidad - DESACTIVADO POR AHORA PARA EVITAR FALSOS POSITIVOS */
/*
@media (prefers-reduced-motion: reduce) {
  .simuledu-bg-video video { display: none; }
}
*/