/*!
 * Version Toggle Styles
 * Controla visibilidad de contenido desktop/mobile y botón flotante
 * Este archivo SIEMPRE está activo (no se desactiva con prefer-web-version)
 */

/* ========================================
   REGLAS GLOBALES (desktop y mobile)
   ======================================== */

/* Por defecto (desktop): mostrar desktop, ocultar mobile */
#desktop-noticias {
  display: block;
}

#mobile-noticias {
  display: none;
}

/* Foto de Nityananda solo en mobile */
.mobile-only-image {
  display: none;
}

/* Botón flotante oculto por defecto */
#floating-version-toggle {
  display: none !important;
}

/* ========================================
   MOBILE (sin prefer-web-version)
   ======================================== */
@media screen and (max-width: 767px) {

  /* En mobile normal: ocultar desktop, mostrar mobile */
  body:not(.prefer-web-version) #desktop-noticias {
    display: none !important;
  }

  body:not(.prefer-web-version) #mobile-noticias {
    display: block !important;
  }

  /* Mostrar foto de Nityananda en mobile */
  body:not(.prefer-web-version) .mobile-only-image {
    display: block;
    margin: 0 auto;
  }

  /* ===== VERSIÓN WEB EN MOBILE (prefer-web-version activo) ===== */

  /* Mostrar desktop-noticias cuando se prefiere versión web */
  body.prefer-web-version #desktop-noticias {
    display: block !important;
  }

  /* Ocultar mobile-noticias cuando se prefiere versión web */
  body.prefer-web-version #mobile-noticias {
    display: none !important;
  }

  /* Ocultar foto de Nityananda en versión web */
  body.prefer-web-version .mobile-only-image {
    display: none !important;
  }

  /* Evitar overflow horizontal en versión web desde mobile */
  body.prefer-web-version {
    overflow-x: hidden !important;
  }

  /* Ocultar navbar mobile cuando se ve versión web */
  body.prefer-web-version #menu {
    display: none !important;
  }

  /* Ajustar escala del contenido desktop para que encaje en mobile */
  body.prefer-web-version #contenedor {
    transform: scale(0.38) !important;
    transform-origin: top left !important;
    width: 263% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  body.prefer-web-version #todaPagina {
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Botón flotante visible solo cuando prefer-web-version está activo */
  body.prefer-web-version #floating-version-toggle {
    display: block !important;
    position: fixed !important;
    bottom: 20px !important;
    right: 20px !important;
    z-index: 2147483647 !important;
    background: linear-gradient(to bottom, #AC1429 0%, #D4526E 100%) !important;
    padding: 12px 30px !important;
    border-radius: 25px !important;
    box-shadow: 0 4px 20px rgba(172, 20, 41, 0.6) !important;
    cursor: pointer !important;
    color: white !important;
    font-family: 'Lato', Helvetica, Arial, sans-serif !important;
    font-size: 16px !important;
    font-weight: bold !important;
  }

  body.prefer-web-version #floating-version-toggle:hover {
    background: linear-gradient(to bottom, #8B1021 0%, #C23750 100%) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(172, 20, 41, 0.5) !important;
  }

  body.prefer-web-version #floating-version-toggle:active {
    transform: translateY(0) !important;
    box-shadow: 0 4px 20px rgba(172, 20, 41, 0.6) !important;
  }

}