/**
 * CSS PERSONALIZADO MEGASTORE
 * Fecha: 12 de Diciembre, 2025
 * Propósito: Ocultar secciones no deseadas y aplicar mejoras visuales
 */

/* ============================================================================
   OCULTAR SECCIONES NO DESEADAS
   ============================================================================ */

/* Ocultar página "Nosotros" / "About" */
a[href="/about"],
a[href="/nosotros"],
a[href="#/about"],
a[href="#/nosotros"],
.about-section,
.about-page,
.section-about,
[class*="about"],
[data-page="about"],
nav a[href*="about"],
nav a[href*="nosotros"] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    width: 0 !important;
    overflow: hidden !important;
    position: absolute !important;
    left: -9999px !important;
}

/* Ocultar página "Preguntas Frecuentes" / "FAQ" */
a[href="/faq"],
a[href="/preguntas-frecuentes"],
a[href="#/faq"],
a[href="#/preguntas-frecuentes"],
.faq-section,
.faq-page,
.section-faq,
[class*="faq"],
[data-page="faq"],
nav a[href*="faq"],
nav a[href*="preguntas"] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    width: 0 !important;
    overflow: hidden !important;
    position: absolute !important;
    left: -9999px !important;
}

/* Ocultar duplicados de "Contacto" (mantener solo uno) */
.contact-duplicate,
.contact-secondary,
[data-contact="duplicate"] {
    display: none !important;
}

/* Ocultar "Cancelación y Devoluciones" */
a[href="/cancelacion"],
a[href="/devoluciones"],
a[href="/cancelacion-devoluciones"],
a[href="#/cancelacion"],
a[href="#/devoluciones"],
.cancelacion-section,
.devoluciones-section,
nav a[href*="cancelacion"],
nav a[href*="devoluciones"] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    width: 0 !important;
    overflow: hidden !important;
    position: absolute !important;
    left: -9999px !important;
}

/* Ocultar "Zonas de Cobertura" */
a[href="/zonas"],
a[href="/cobertura"],
a[href="/zonas-cobertura"],
a[href="#/zonas"],
a[href="#/cobertura"],
.zonas-section,
.cobertura-section,
nav a[href*="zonas"],
nav a[href*="cobertura"] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    width: 0 !important;
    overflow: hidden !important;
    position: absolute !important;
    left: -9999px !important;
}

/* Ocultar "Propiedad Intelectual" */
a[href="/propiedad-intelectual"],
a[href="/propiedad"],
a[href="#/propiedad-intelectual"],
.propiedad-section,
nav a[href*="propiedad"] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    width: 0 !important;
    overflow: hidden !important;
    position: absolute !important;
    left: -9999px !important;
}

/* Ocultar Newsletter "Recibe Ofertas Exclusivas" */
.newsletter-section,
.newsletter-signup,
.newsletter-form,
.subscribe-newsletter,
.offers-signup,
[class*="newsletter"],
[data-component="newsletter"],
form[action*="newsletter"],
form[action*="subscribe"] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    max-height: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* ============================================================================
   OCULTAR TEXTOS ESPECÍFICOS POR CONTENIDO
   ============================================================================ */

/* Ocultar elementos que contengan emails antiguos (selectores genéricos) */
[href="mailto:legal@megastore.com"],
[href="mailto:privacidad@megastore.com"],
[href="mailto:info@megastore.com"] {
    pointer-events: none !important;
}

/* Ocultar enlaces a redes sociales antiguas si existen como links directos */
a[href*="facebook.com/megastore"]:not([href*="megastorerr"]),
a[href*="instagram.com/megastore"]:not([href*="megastorerr"]),
a[href*="tiktok.com/@megastore"]:not([href*="megastorerr"]) {
    pointer-events: none !important;
    opacity: 0.5 !important;
}

/* ============================================================================
   MEJORAS VISUALES Y DE ESPACIADO
   ============================================================================ */

/* Reducir espacios vacíos dejados por elementos ocultos */
.footer-links,
.main-nav,
.header-nav,
nav ul,
.menu-list {
    gap: 0.5rem !important;
}

/* Asegurar que los contenedores se ajusten cuando se ocultan elementos */
.footer-links > *:not([style*="display: none"]),
.main-nav > *:not([style*="display: none"]),
nav > *:not([style*="display: none"]) {
    margin: 0 0.5rem !important;
}

/* ============================================================================
   OPTIMIZACIONES DE RENDIMIENTO
   ============================================================================ */

/* Desactivar animaciones en elementos ocultos para mejorar rendimiento */
[style*="display: none"],
[style*="visibility: hidden"],
.hidden,
.d-none {
    animation: none !important;
    transition: none !important;
}

/* ============================================================================
   RESPONSIVE - Asegurar que funcione en todos los dispositivos
   ============================================================================ */

/* Móviles */
@media (max-width: 767px) {
    a[href*="about"],
    a[href*="faq"],
    a[href*="nosotros"],
    a[href*="preguntas"],
    .newsletter-section,
    .newsletter-signup {
        display: none !important;
        visibility: hidden !important;
    }
}

/* Tablets */
@media (min-width: 768px) and (max-width: 1023px) {
    a[href*="about"],
    a[href*="faq"],
    a[href*="nosotros"],
    a[href*="preguntas"],
    .newsletter-section,
    .newsletter-signup {
        display: none !important;
        visibility: hidden !important;
    }
}

/* Desktop */
@media (min-width: 1024px) {
    a[href*="about"],
    a[href*="faq"],
    a[href*="nosotros"],
    a[href*="preguntas"],
    .newsletter-section,
    .newsletter-signup {
        display: none !important;
        visibility: hidden !important;
    }
}

/* ============================================================================
   CORRECCIONES ESPECÍFICAS PARA VUE.JS
   ============================================================================ */

/* Vue.js usa clases dinámicas, estos selectores las capturan */
[class*="about-"],
[class*="faq-"],
[class*="newsletter-"],
[class*="-about"],
[class*="-faq"],
[class*="-newsletter"] {
    /* No ocultamos todo porque puede afectar otros componentes */
    /* Se manejarán con JavaScript */
}

/* ============================================================================
   IMPORTANTE: NOTAS DE MANTENIMIENTO
   ============================================================================ */

/*
 * NOTA 1: Este CSS oculta elementos del DOM pero NO los elimina.
 * Los elementos siguen existiendo en el código fuente HTML.
 *
 * NOTA 2: Este archivo debe cargarse DESPUÉS de los CSS principales
 * para asegurar que los !important funcionen correctamente.
 *
 * NOTA 3: Si el frontend se reconstruye desde cero, este archivo
 * puede ser eliminado ya que los nuevos componentes no tendrán
 * las secciones no deseadas.
 *
 * NOTA 4: Los selectores son deliberadamente amplios para capturar
 * múltiples variantes de los mismos elementos (con/sin #, español/inglés)
 *
 * NOTA 5: Para depuración, comentar las secciones específicas
 * que se quieran ver temporalmente.
 */

/* ============================================================================
   FIN DEL ARCHIVO
   ============================================================================ */