/* ============================================
   ZENIT — Estilos Base
   ============================================ */

html {
  scroll-behavior: smooth;
  scroll-padding-top: 5rem;
}

body {
  background-color: #05070B;
  color: #F8FAFC;
  font-family: 'Inter', sans-serif;
  overflow-x: hidden;
}

/* Fondo cuadrícula decorativa */
.grid-bg {
  background-size: 48px 48px;
  background-image: 
    linear-gradient(to right, rgba(255, 255, 255, 0.035) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255, 255, 255, 0.035) 1px, transparent 1px);
}

/* Glow radial superior */
.radial-glow-top {
  background: radial-gradient(circle 900px at 50% -10%, rgba(0, 102, 255, 0.2), rgba(0, 229, 255, 0.05) 50%, transparent 80%);
}

/* Modal backdrop blur */
.modal-backdrop {
  backdrop-filter: blur(16px);
}

/* ============================================
   Navegación — ScrollSpy activo
   ============================================ */

.nav-link.active {
  color: #00E5FF !important;
  position: relative;
}

.nav-link.active::after {
  content: '';
  position: absolute;
  bottom: -6px;
  left: 0;
  width: 100%;
  height: 2px;
  background: #00E5FF;
  border-radius: 9999px;
  box-shadow: 0 0 10px #00E5FF;
}

/* Navegación móvil — activo */
.mobile-nav-link.active {
  color: #00E5FF !important;
  background: rgba(0, 102, 255, 0.15);
  border-left: 3px solid #00E5FF;
}

/* ============================================
   Botón Copiar Correo con Tooltip & Feedback
   ============================================ */

.copy-email-btn {
  position: relative;
  cursor: pointer;
  user-select: none;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  outline: none;
}

.copy-email-btn:focus-visible {
  outline: 2px solid #00E5FF;
  outline-offset: 4px;
  border-radius: 6px;
}

/* Tooltip flotante */
.copy-email-btn .copy-tooltip {
  position: absolute;
  bottom: calc(100% + 10px);
  left: 0;
  pointer-events: none;
  opacity: 0;
  transform: translateY(6px);
  transition: opacity 0.2s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.2s cubic-bezier(0.16, 1, 0.3, 1),
              background 0.2s, border-color 0.2s;
  background: rgba(8, 14, 26, 0.96);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(0, 229, 255, 0.35);
  color: #00E5FF;
  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.8),
              0 0 15px rgba(0, 229, 255, 0.15);
  border-radius: 8px;
  padding: 5px 10px;
  font-size: 11px;
  font-family: 'JetBrains Mono', monospace;
  font-weight: 600;
  white-space: nowrap;
  z-index: 40;
  display: flex;
  align-items: center;
  gap: 6px;
}

/* Triángulo indicador inferior */
.copy-email-btn .copy-tooltip::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 16px;
  border-width: 5px;
  border-style: solid;
  border-color: rgba(8, 14, 26, 0.96) transparent transparent transparent;
  transition: border-color 0.2s;
}

/* Mostrar tooltip al pasar el cursor (Desktop) */
@media (hover: hover) and (pointer: fine) {
  .copy-email-btn:hover .copy-tooltip {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Estado Copiado (Feedback en Desktop y Móvil/Touch) */
.copy-email-btn.is-copied .copy-tooltip {
  opacity: 1 !important;
  transform: translateY(0) !important;
  background: rgba(4, 28, 20, 0.96) !important;
  border-color: rgba(52, 211, 153, 0.6) !important;
  color: #34D399 !important;
  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.8),
              0 0 18px rgba(52, 211, 153, 0.25) !important;
}

.copy-email-btn.is-copied .copy-tooltip::after {
  border-color: rgba(4, 28, 20, 0.96) transparent transparent transparent !important;
}

.copy-email-btn.is-copied .mail-icon {
  display: none !important;
}

.copy-email-btn.is-copied .check-icon {
  display: inline-block !important;
  animation: popIn 0.25s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.copy-email-btn.is-copied .email-address-text {
  color: #34D399 !important;
}

@keyframes popIn {
  0% { transform: scale(0.6); opacity: 0; }
  100% { transform: scale(1); opacity: 1; }
}

/* ============================================
   Reproductor de Video Nativo Zenit
   ============================================ */

#sistemaZenitPlayer,
#zenitPromoPlayer,
#zenitVideoPlayer {
  accent-color: #00E5FF;
}

/* Ocultar botón de descarga en controles del navegador */
#sistemaZenitPlayer::-webkit-media-controls-download-button,
#zenitPromoPlayer::-webkit-media-controls-download-button,
#zenitVideoPlayer::-webkit-media-controls-download-button {
  display: none !important;
}

#sistemaZenitPlayer::-internal-media-controls-download-button,
#zenitPromoPlayer::-internal-media-controls-download-button,
#zenitVideoPlayer::-internal-media-controls-download-button {
  display: none !important;
}

#sistemaZenitOverlay,
#zenitPromoOverlay,
#videoPlayOverlay {
  transition: opacity 0.35s cubic-bezier(0.16, 1, 0.3, 1),
              background 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}