/*
Theme Name: Astra Child - Oposemad
Theme URI: https://oposemad.es
Description: Child theme de Astra para Oposemad. Mantiene la configuración base de Astra y permite personalizaciones específicas.
Author: Oposemad
Author URI: https://oposemad.es
Template: astra
Version: 1.0.0
Text Domain: astra-child
*/

/* ==========================================================================
   1. CUSTOM PROPERTIES (variables CSS — paleta Oposemad)
   ========================================================================== */

:root {
    /* Tipografía de marca. Fuente única de verdad: oposemad.css la reutiliza
       en --font-sans y --font-display. Se define aquí porque style.css se
       encola SIEMPRE, mientras que oposemad.css solo en plantillas Oposemad. */
    --oposemad-font-sans: "Plus Jakarta Sans", -apple-system, system-ui, sans-serif;

    --oposemad-primary: #0F1428;
    --oposemad-primary-dark: #000000;
    --oposemad-primary-light: #E6F0FC;
    --oposemad-secondary: #F47527;
    --oposemad-secondary-dark: #D85F18;
    --oposemad-secondary-light: #FEF3E8;
    --oposemad-text: #0A0F1C;
    --oposemad-text-muted: #64748B;
    --oposemad-bg-muted: #F1F5F9;
    --oposemad-border: #E2E8F0;
    --oposemad-destructive: #EF4444;
    --oposemad-radius: 12px;
    --oposemad-radius-sm: 8px;
    --oposemad-radius-lg: 16px;
}

/* Smooth scroll global */
html {
    scroll-behavior: smooth;
}

/* ==========================================================================
   2. TIPOGRAFÍA GLOBAL
   ==========================================================================

   Astra tiene Inter configurada en el Customizer y la aplica a body, menú,
   botones y controles de formulario. El diseño Oposemad usa Plus Jakarta
   Sans, pero oposemad.css solo se encola en las plantillas Oposemad y casi
   todas sus reglas cuelgan de .oposemad-page. Sin este bloque:

     - el menú principal salía en Inter en TODA la web, incluidas las
       landings, que por lo demás son Plus Jakarta Sans;
     - /acceso-alumnos/, /perfil-alumno/ y los cursos de LearnDash salían
       100% en Inter (0 elementos en Plus Jakarta Sans): al entrar al Aula
       Virtual cambiaba la tipografía entera;
     - el botón de enviar de los formularios (WPForms) salía en Inter 600
       justo al lado de inputs en Plus Jakarta Sans.

   Los selectores replican a propósito los de Astra. Este style.css se encola
   después del CSS dinámico de Astra, así que a igual especificidad gana el
   hijo y no hace falta !important. Si algún día Astra cambia sus selectores
   hay que revisar este bloque — o, mejor, cambiar la fuente global en
   Personalizar → Global → Tipografía y dejar esto como red de seguridad.
   ========================================================================== */

/* Cuerpo y controles de formulario.
   Mismo listado que Astra, para pisar solo font-family y no tocar los
   tamaños ni los pesos que el Customizer tenga configurados. */
body,
button,
input,
select,
textarea,
.ast-button,
.ast-custom-button {
    font-family: var(--oposemad-font-sans);
}

/* Menú principal y menú móvil */
.ast-builder-menu-1,
.main-header-menu,
.main-header-menu .menu-link,
.ast-header-break-point .main-header-menu .menu-link {
    font-family: var(--oposemad-font-sans);
}

/* Botones de Astra, de bloques de WordPress y de plugins de formularios */
.menu-toggle,
.button,
input#submit,
input[type="button"],
input[type="submit"],
input[type="reset"],
#comments .submit,
.search .search-submit,
body .wp-block-file .wp-block-file__button,
.wp-block-button .wp-block-button__link,
.wp-block-search .wp-block-search__button,
.wp-block-buttons .wp-block-button.is-style-outline .wp-block-button__link.wp-element-button,
.ast-outline-button {
    font-family: var(--oposemad-font-sans);
}

/* Encabezados fuera de las plantillas Oposemad.
   Especificidad (0,0,1) a propósito: NO pisa a ".oposemad-page h1..h4"
   (0,1,1) de oposemad.css ni a los estilos inline en DM Serif Display, así
   que los acentos editoriales de las landings se quedan como están. */
h1, h2, h3, h4, h5, h6,
.entry-title,
.ast-archive-title {
    font-family: var(--oposemad-font-sans);
}

/* H1 de los cursos de LearnDash.
   Astra lo resuelve con ".entry-title { font-size: 1.375rem }" y
   ".entry-title { font-weight: normal }", que ganan al "h1 { 3rem/700 }"
   del propio Astra: el título del curso acababa en 22px, sin negrita y en
   gris (#808285), más pequeño que los h3 del temario que lleva debajo.
   single-sfwd-courses.php lo imprime con class="entry-title" para no perder
   compatibilidad con Astra, así que la jerarquía se corrige aquí.
   (0,2,1) para ganar a las dos reglas .entry-title de Astra. */
body.single-sfwd-courses .entry-title {
    font-size: clamp(30px, 4vw, 44px);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.02em;
    color: var(--oposemad-primary);
    margin-bottom: 24px;
}

/* ==========================================================================
   4. AJUSTES GENERALES
   ========================================================================== */

/* Mejora la transición de hover en botones globales de Astra */
.ast-button,
.button,
.wp-block-button__link,
input[type="submit"] {
    transition: all 0.2s ease-in-out !important;
}

/* Ajustes finos a Spectra para que respete radius global */
.wp-block-uagb-buttons .wp-block-uagb-buttons-child__wrapper a {
    transition: all 0.2s ease-in-out;
}

/* ==========================================================================
   5. BOTÓN AULA VIRTUAL (Header)
   ========================================================================== */

.oposemad-aula-button:hover {
    background-color: var(--oposemad-primary) !important;
    color: #FFFFFF !important;
}

/* ── Sticky header global ── */
#masthead {
    position: sticky;
    top: 0;
    z-index: 100;
}

/* El sticky de arriba SOLO funciona si ningún ancestro (html, body, #page,
   #content) tiene overflow distinto de "visible": eso los convierte en
   contenedor de scroll y anula el sticky. Por eso no se debe "tapar" el
   scroll horizontal con overflow-x:hidden en html/body — hay que corregir el
   elemento que desborda.
   Caso real: en móvil la barra superior de Astra lleva márgenes negativos de
   -10px y se sale 10px del viewport, provocando scroll horizontal. */
#masthead .ast-above-header-bar {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* ==========================================================================
   6. HEADER · BREAKPOINT INTERMEDIO (portátiles 13"-15")
   Evita que el menú principal haga wrap entre 1024px y 1480px.
   ========================================================================== */

/* --- 6.1 Compactar el header en pantallas medianas --- */
@media (min-width: 1024px) and (max-width: 1480px) {

    /* Reducir el padding lateral del header para ganar espacio */
    #masthead .ast-container,
    #masthead .site-header-section {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }

    /* Reducir espacio entre items del menú principal */
    #masthead .main-header-menu > .menu-item > .menu-link,
    #masthead .ast-builder-menu-1 .menu-item > .menu-link {
        padding-left: 10px !important;
        padding-right: 10px !important;
        font-size: 14px !important;
        letter-spacing: -0.01em;
    }

    /* Logo: reducir ligeramente el tamaño y ocultar el tagline largo */
    #masthead .site-logo-img img,
    #masthead .custom-logo-link img {
        max-height: 48px !important;
        width: auto !important;
    }

    /* Si el tagline "Oposiciones Primaria Inglés Madrid" se renderiza
       como .site-description o .ast-site-title-wrap p, ocúltalo en este rango */
    #masthead .site-description,
    #masthead .ast-site-description {
        display: none !important;
    }

    /* Compactar el botón "Mi Aula" */
    #masthead .oposemad-aula-button,
    #masthead .ast-custom-button {
        padding: 6px 12px !important;
        font-size: 13px !important;
    }

    /* Reducir gap entre logo, menú y botón */
    #masthead .ast-builder-grid-row {
        gap: 12px !important;
    }
}

/* --- 6.2 Tablet / portátiles pequeños (por si Astra no rompe a móvil aquí) --- */
@media (min-width: 1024px) and (max-width: 1180px) {

    /* Última compactación: menú aún más estrecho */
    #masthead .main-header-menu > .menu-item > .menu-link {
        padding-left: 8px !important;
        padding-right: 8px !important;
        font-size: 13px !important;
    }
}

/* --- 6.3 Forzar que el menú principal no haga wrap NUNCA en desktop --- */
@media (min-width: 1024px) {
    #masthead .main-header-menu,
    #masthead .ast-builder-menu-1 > .menu,
    #masthead .ast-builder-menu .main-header-menu {
        flex-wrap: nowrap !important;
        white-space: nowrap;
    }

    #masthead .main-header-menu > .menu-item {
        flex-shrink: 0;
    }
}

/* --- 6.4 Fix del topbar: evitar solape de "Hola, Oposemad" con icono Facebook --- */
.ast-above-header,
.ahfb-above-header-bar {
    column-gap: 16px;
}

/* nowrap solo en desktop — en móvil puede causar desbordamiento horizontal */
@media (min-width: 768px) {
    .ast-above-header .ast-builder-html-element,
    .ast-above-header .ast-header-account-wrap {
        white-space: nowrap;
    }
}

.oposemad-aula-button {
    display: inline-block;
    padding: 8px 16px;
    border: 1.5px solid var(--oposemad-primary);
    color: var(--oposemad-primary) !important;
    border-radius: 999px;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.2s ease;
    white-space: nowrap;
}
*:focus-visible {
    outline: 3px solid var(--oposemad-secondary);
    outline-offset: 2px;
    border-radius: 4px;
}
.admin-bar #masthead { top: 32px; }
@media (max-width: 782px) {
    .admin-bar #masthead { top: 46px; }
}