/* ==========================================================================
   Header público compartido · public-header.css
   Complementa public-shell.css (.lp-nav, .lp-theme-btn, .lp-footer) para
   templates/_site_header.html: menú mobile, estado activo, ticker en vivo y
   ajustes de layout de las páginas que antes no tenían header (auth, estado).
   Solo tokens --nx-* de design-system.css. Cargar después de public-shell.css.
   ========================================================================== */

/* Base mínima: algunas páginas (auth, estado) no traen el reset de .nx-page */
:where(.nx-hdr, .lp-ticker, .lp-footer) a { color: inherit; text-decoration: none; }
:where(.nx-hdr, .lp-footer) ul { list-style: none; margin: 0; padding: 0; }
.nx-hdr, .lp-ticker { font-family: var(--nx-font-sans); line-height: var(--nx-lh-body); }
.nx-hdr .lp-logo-img { display: block; max-height: 40px; width: auto; }
.nx-hdr .nx-btn { white-space: nowrap; }
/* public-shell.css limita [hidden] a .nx-page/.lp: auth y páginas de estado no
   tienen esas clases, y acá hay reglas display:flex que le ganarían al UA. */
:is(.nx-hdr, .lp-ticker, .lp-footer) [hidden], .lp-ticker[hidden] { display: none !important; }

/* Áreas táctiles >= 40px en todo el header */
.nx-hdr .lp-theme-btn { width: 40px; height: 40px; }
.nx-hdr .nx-btn--sm { min-height: 40px; }

/* Estado activo (p. ej. "Noticias" en /noticias) */
.nx-hdr .lp-nav__links a.is-active,
.nx-hdr__plinks a.is-active { color: var(--nx-cyan-text); }
.nx-hdr .lp-nav__links a.is-active {
    text-decoration: underline;
    text-decoration-color: var(--nx-cyan);
    text-decoration-thickness: 2px;
    text-underline-offset: 8px;
}

/* Items con punto (Noticias, Análisis diario) alineados con el resto */
.nx-hdr .lp-nav__links > li { display: flex; align-items: center; }

/* Con "Noticias" + "Análisis diario" + idioma, el menú completo (sobre todo en
   español) no entra en 1180px: los links pasan a la barra desde 1280px, más
   compactos; debajo de eso va el menú hamburguesa. */
.nx-hdr .lp-nav__links { gap: 0.9rem; }
.nx-hdr .lp-nav__actions .nx-hdr__lang { padding-inline: 0.6rem; }
@media (min-width: 1180px) and (max-width: 1279.98px) { .nx-hdr .lp-nav__links { display: none; } }

/* Idioma: en la barra desde 640px; abajo de eso va dentro del menú */
.nx-hdr__lang { display: none; gap: 0.35rem; }
@media (min-width: 640px) { .nx-hdr__lang { display: inline-flex; } }

/* ── Botón hamburguesa (mismo look que el botón de tema) ─────────────── */
.nx-hdr__burger { flex-shrink: 0; }
.nx-hdr__burger .fa-xmark { display: none; }
.nx-hdr__burger[aria-expanded="true"] .fa-bars { display: none; }
.nx-hdr__burger[aria-expanded="true"] .fa-xmark { display: inline-block; }
.nx-hdr__burger[aria-expanded="true"] { color: var(--nx-text-strong); border-color: var(--nx-border-strong); }
.nx-hdr .lp-theme-btn:focus-visible,
.nx-hdr a:focus-visible,
.nx-hdr button:focus-visible { outline: 2px solid var(--nx-accent); outline-offset: 2px; }

/* ── Panel del menú mobile ───────────────────────────────────────────── */
.nx-hdr__panel {
    position: absolute; left: 0; right: 0; top: 100%;
    background: var(--nx-bg);
    border-bottom: 1px solid var(--nx-border);
    box-shadow: var(--nx-shadow-lg);
    max-height: calc(100vh - 65px);
    max-height: calc(100dvh - 65px);
    overflow-y: auto;
    overscroll-behavior: contain;
}
.nx-hdr__plinks { display: flex; flex-direction: column; padding-top: 0.25rem; }
.nx-hdr__plinks a {
    display: flex; align-items: center; gap: 0.5rem;
    min-height: 48px; padding: 0.5rem 0;
    border-bottom: 1px solid var(--nx-border);
    font-size: var(--nx-fs-md); font-weight: 500; color: var(--nx-text-2);
    transition: color var(--nx-dur);
}
.nx-hdr__plinks a:hover { color: var(--nx-cyan-text); }
.nx-hdr__plinks a.is-daily { color: var(--nx-yellow-text); }
.nx-hdr__pactions { display: flex; flex-wrap: wrap; gap: 0.5rem; padding: 0.875rem 0 1rem; }
.nx-hdr__pactions .nx-btn { gap: 0.4rem; }
@media (min-width: 480px) { .nx-hdr__plogin { display: none; } }
@media (min-width: 640px) {
    .nx-hdr__plang { display: none; }
    .nx-hdr__pactions:not(:has(.nx-hdr__plogin)) { display: none; }
}
@media (min-width: 1280px) {
    .nx-hdr__burger, .nx-hdr__panel { display: none !important; }
}

/* Tema dentro del menú solo cuando no entra en la barra (< 360px) */
.nx-hdr__ptheme { display: none; }
@media (max-width: 359.98px) {
    .nx-hdr .lp-nav__actions #nxThemeToggle { display: none; }
    .nx-hdr__ptheme { display: inline-flex; }
}

/* ── Mobile: que logo + tema + CTA + menú entren en 375px ────────────── */
@media (max-width: 479px) {
    .nx-hdr .lp-nav__inner { gap: 0.5rem; }
    .nx-hdr .lp-nav__actions { gap: 0.375rem; }
    .nx-hdr .lp-logo-img { max-height: 26px; }
    .nx-hdr .lp-nav__logo { min-width: 0; flex-shrink: 1; }
    .nx-hdr .lp-nav__actions .nx-btn--primary { padding-inline: 0.7rem; }
}
@media (max-width: 399.98px) {
    .nx-hdr .lp-logo-img { max-height: 22px; }
}

/* ── TICKER (movido desde home.css: ahora lo usan todas las páginas públicas) */
.lp-ticker {
    background: var(--nx-bg-ticker);
    border-bottom: 1px solid var(--nx-border);
    font-family: var(--nx-font-mono);
    font-size: var(--nx-fs-xs);
    color: var(--nx-muted);
    overflow-x: auto;
    white-space: nowrap;
    scrollbar-width: none;
}
.lp-ticker::-webkit-scrollbar { display: none; }
.lp-ticker__inner {
    display: flex; align-items: center; justify-content: space-between; gap: 1.5rem;
    padding-block: 0.4rem;
    min-width: max-content;
}
.lp-ticker__items { display: flex; align-items: center; gap: 1.5rem; }
.lp-ticker__live { display: inline-flex; align-items: center; gap: 0.4rem; color: var(--nx-emerald-text); font-weight: 600; text-transform: uppercase; }
.lp-ticker__item { display: inline-flex; align-items: center; gap: 0.4rem; }
.lp-ticker__sym { color: var(--nx-text-strong); font-weight: 500; }
.lp-ticker__side { color: var(--nx-faint); }
.lp-ticker__side strong { color: var(--nx-accent-text); font-weight: 600; }
@media (min-width: 1024px) { .lp-ticker__inner { min-width: 0; } }
.lp-ticker.lp-fade-in { animation: nx-hdr-fade 0.5s var(--nx-ease) both; }
@keyframes nx-hdr-fade { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .lp-ticker.lp-fade-in { animation: none; } }

/* ── Auth (login, register, forgot, reset, 2FA) con header ──────────── */
/* El split ocupa el resto del viewport debajo del nav (64px): sin doble scroll. */
.nx-hdr ~ .auth-container {
    min-height: calc(100vh - 65px);
    min-height: calc(100dvh - 65px);
}
.nx-hdr ~ .auth-container .auth-right { padding-top: 2rem; overflow: visible; }
.nx-hdr ~ .auth-container .auth-mobile-brand { display: none; }

/* ── Páginas de estado (card centrada) con header ───────────────────── */
.nx-hdr ~ .nx-status,
.nx-hdr ~ .auth-center,
.nx-hdr ~ .tr-wrap {
    min-height: calc(100vh - 65px);
    min-height: calc(100dvh - 65px);
    padding-top: 2rem;
}
.nx-hdr ~ .nx-status > .nx-status__brand,
.nx-hdr ~ .auth-center > .auth-center__brand,
.nx-hdr ~ .tr-wrap > .tr-brand { display: none; }