/*
Theme Name:   Customify GobMX
Theme URI:    https://www.gob.mx
Description:  Tema hijo de Customify con integración del Framework Gobierno de México v3. Resuelve conflictos de CSS entre Customify y el framework gobmx mediante especificidad controlada y scoping de estilos.
Author:       Tu Institución
Author URI:   https://www.gob.mx
Template:     customify
Version:      1.0.0
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  customify-gobmx
Tags:         gobierno, mexico, child-theme
*/

/* ============================================================
   RESET DE CONFLICTOS: Customify vs Framework GobMX
   El framework gobmx aplica estilos globales a elementos HTML
   base (body, h1-h6, a, ul, etc.) que sobreescriben a Customify.
   Aquí se restauran los valores del tema padre donde sea necesario.
   ============================================================ */

/* --- Tipografía base: restaurar la del tema padre --- */
body {
    font-family: var(--customify-body-font, inherit) !important;
    font-size: var(--customify-body-font-size, 16px) !important;
    color: var(--customify-body-color, #333333) !important;
    line-height: var(--customify-body-line-height, 1.6) !important;
    background-color: var(--customify-bg-color, #ffffff) !important;
}

/* --- Links: usar colores del tema, no del framework --- */
a,
a:hover,
a:focus,
a:visited {
    color: var(--customify-link-color, #0073aa);
    text-decoration: none;
}

a:hover {
    color: var(--customify-link-hover-color, #005177);
    text-decoration: underline;
}

/* --- Headings: evitar que gobmx los sobreescriba --- */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--customify-heading-font, inherit) !important;
    color: var(--customify-heading-color, #222222) !important;
    line-height: 1.3 !important;
    margin-top: 0;
}

/* --- Listas: el framework aplica estilos agresivos a ul/li --- */
.site-content ul,
.site-content ol,
.entry-content ul,
.entry-content ol,
.widget ul,
.widget ol {
    padding-left: 1.5em;
    margin-bottom: 1em;
    list-style: revert;
}

/* --- Imágenes: evitar que gobmx las haga 100% width en contextos no deseados --- */
.site-header img,
.site-logo img,
.custom-logo {
    max-width: none !important;
    width: auto !important;
}

/* --- Header del sitio: aislar del framework --- */
#masthead,
.site-header {
    position: relative;
    z-index: 1000;
}

/* --- Menú de navegación: proteger estilos de Customify --- */
#site-navigation,
.main-navigation,
.primary-menu-container {
    all: revert;
}

.main-navigation ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.main-navigation ul li {
    list-style: none !important;
}

/* --- Footer: separar del framework --- */
#colophon,
.site-footer {
    position: relative;
    z-index: 10;
}

/* ============================================================
   BARRA DE NORMATIVA GOB.MX
   Contenedor específico para alojar el componente del framework
   sin que sus estilos se derramen al resto del sitio.
   ============================================================ */

/* Barra superior institucional */
#gobmx-normativa-header {
    width: 100%;
    position: relative;
    z-index: 9999;
}

/* Barra inferior / footer institucional */
#gobmx-normativa-footer {
    width: 100%;
    position: relative;
    z-index: 10;
    margin-top: 0;
}

/* Asegura que el componente gobmx ocupe su espacio sin desbordarse */
#gobmx-normativa-header *,
#gobmx-normativa-footer * {
    box-sizing: border-box;
}

/* ============================================================
   UTILIDADES DE COMPATIBILIDAD
   ============================================================ */

/* Cuando el framework oculta elementos del tema con display:none */
.customify-visible {
    display: block !important;
}

/* Prevenir que el framework rompa el grid/flexbox del tema */
.site-content,
.content-area,
.site-main {
    min-width: 0;
}

/* ============================================================
   TUS ESTILOS PERSONALIZADOS (agrega aquí abajo)
   ============================================================ */
/* Reducir espacio en la barra de navegación */
.sub-navbar {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    min-height: 32px !important; /* Reduce la altura */
}

/* Reducir espacio del contenedor */
.sub-navbar .container,
.sub-navbar .container-fluid {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* Reducir espacio del encabezado (marca + botón toggler en móvil) */
.sub-navbar .navbar-header {
    min-height: 32px !important;
}

/* Reducir padding de los enlaces */
.sub-navbar .nav-link {
    padding-top: 6px !important;
    padding-bottom: 6px !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
    font-size: 13px !important;
}

/* Reducir espacio de la marca (Semarnat) */
.sub-navbar .navbar-brand {
    padding-top: 6px !important;
    padding-bottom: 6px !important;
    height: auto !important;
    margin-right: 15px !important; /* Reduce espacio entre Semarnat y el menú */
}

/* Reducir margen de la lista del menú */
.sub-navbar .navbar-nav {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* Ajustar el botón toggler en móvil */
.sub-navbar .navbar-toggler {
    padding: 4px 8px !important;
    margin: 5px 0 !important;
}

/* ============================================================
   BOTÓN DE LA BARRA DE NORMATIVA (IDENTIDAD)
   Ocultar por completo el botón hamburguesa que trae la barra
   de identidad (águila, Trámites, Gobierno, buscador). Confirmado
   por inspección del DOM real: usa Bootstrap 5 (data-bs-toggle) y
   la clase única ".navbar-toggler-button", distinta de nuestro
   propio toggler del submenú institucional (que no la tiene),
   así que esto no afecta a tu menú.
   ============================================================ */
.navbar-toggler-button {
    display: none !important;
}

/* ============================================================
   COMPORTAMIENTO RESPONSIVO REAL
   El HTML usa "navbar-expand-md" (clase de Bootstrap 4/5) para
   ocultar el botón hamburguesa en escritorio y mostrar el menú
   horizontal automáticamente, pero el framework gob.mx es
   Bootstrap 3 y no la reconoce. Por eso hay que hacerlo a mano.
   ============================================================ */

/* Escritorio: ocultar hamburguesa, mostrar menú horizontal siempre */
@media (min-width: 768px) {
    .sub-navbar .navbar-toggler {
        display: none !important;
    }

    .sub-navbar .navbar-collapse {
        display: flex !important;
        flex-basis: auto;
    }

    .sub-navbar .navbar-nav {
        display: flex !important;
        flex-direction: row !important;
    }

    .sub-navbar .nav-item {
        float: none !important;
    }
}

/* Móvil/tablet: asegurar que la hamburguesa se vea y el menú
   arranque colapsado hasta que se le dé click */
@media (max-width: 767px) {
    .sub-navbar .navbar-toggler {
        display: block !important;
    }

    .sub-navbar .navbar-collapse {
        display: none;
    }

    .sub-navbar .navbar-collapse.show {
        display: block !important;
    }
}

/* Reducir espacio entre elementos del menú */
.sub-navbar .nav-item {
    margin-right: -5px !important; /* Junta los elementos */
}

/* Ajustar dropdown — .dropdown-item es clase de Bootstrap 4/5;
   el framework gob.mx es Bootstrap 3 y no trae estilos para ella,
   así que sin esto cada link cae en el tamaño por defecto (grande) */
.sub-navbar .dropdown-menu {
    margin-top: 0 !important;
    min-width: auto !important;
    font-size: 13px !important;
    padding: 4px 0 !important;
}

.sub-navbar .dropdown-menu > li > a,
.sub-navbar .dropdown-menu .dropdown-item {
    padding: 6px 15px !important;
    display: block !important;
    line-height: 1.4 !important;
}
/* Eliminar limitaciones de ancho del framework */
.govco-container {
    max-width: 100% !important;
    padding: 0 !important;
}

/* Para páginas individuales que quieras a ancho completo */
.page-template-full-width .govco-container,
.single .govco-container,
.page .govco-container {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
}

/* Eliminar las cajas laterales */
.govco-row {
    margin: 0 !important;
}

.govco-col-md-8,
.govco-col-md-4,
.govco-col-md-12 {
    padding: 0 !important;
}

/* Para imágenes que no se expanden */
img {
    max-width: 100% !important;
    height: auto !important;
    display: block;
}

/* Si quieres eliminar completamente el sidebar en páginas */
.page .govco-col-md-4 {
    display: none !important;
}

.page .govco-col-md-8 {
    width: 100% !important;
    max-width: 100% !important;
}
/* Forzar la visualización del submenú al pasar el cursor — SOLO escritorio.
   En móvil/tablet no existe :hover confiable; ahí el despliegue lo maneja
   el JS de functions.php (reconfigurar_despliegue_menu_gobmx) con clicks. */
@media (min-width: 768px) {
    .site-header .primary-menu-ul li.menu-item-has-children:hover > .sub-menu,
    .site-header .primary-menu-ul li.menu-item-has-children:focus-within > .sub-menu,
    .sub-navbar .dropdown:hover > .dropdown-menu {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: absolute !important;
        z-index: 99999 !important;
    }
}

/* Despliegue por click/tap (todas las resoluciones) — clase agregada por JS */
.sub-navbar .dropdown-menu.show {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    z-index: 99999 !important;
}

/* Menú colapsable principal (hamburguesa) abierto por click — móvil/tablet */
.sub-navbar .navbar-collapse.show {
    display: block !important;
}

/* ============================================================
   POSICIÓN RESPECTO A LA BARRA DE NORMATIVA
   El sub-navbar fluye en el documento (no usa position:fixed),
   así que siempre queda justo debajo de donde gobmx.js inserte
   la barra de identidad. Aquí solo quitamos cualquier espacio
   sobrante entre ambas.
   ============================================================ */
#gobmx-normativa-header {
    margin-bottom: 0 !important;
}

.sub-navbar {
    margin-top: 0 !important;
}

/* --- Alternativa "sticky" (opcional) ---
   Si en algún momento quieres que el submenú se quede pegado al
   hacer scroll (sin taparse con la normativa, a diferencia de
   position:fixed), descomenta esto. position:sticky respeta el
   flujo del documento, así que no se monta encima de la normativa.

.sub-navbar {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 1020;
}
*/

/* En caso de que el marco Gob.mx aplique overflow:hidden a los contenedores padre */
.site-header, 
.header--row, 
.header--row-inner,
.sub-navbar {
    overflow: visible !important;
}