/* Equacom Header v6 — Logo + brand line + redesigned nav buttons + working mobile menu
 * - New isotipo logo (sized to "Equacom News" caps height)
 * - "Equacom News" on a SINGLE line, slogan on a single line beneath
 * - Modern pill buttons (Revista / Audiovisual / Galería)
 * - Redesigned day/night toggle (visible on mobile + desktop)
 * - Mobile menu drawer with overlay click-to-close and an X button
 */

/* ============ BRAND BLOCK ============ */
.equacom-header-v2 .header-zone-left{
    display:flex;align-items:center;gap:14px;
}
.equacom-header-v2 .header-logo-v4{
    display:inline-flex;align-items:center;justify-content:center;
    background:transparent;padding:0;border:0;box-shadow:none;
}
.equacom-header-v2 .header-logo-v4 img{
    height:60px;width:auto;display:block;object-fit:contain;
    background:transparent;
}

/* Brand wordmark: name on one line, slogan on one line */
.eq-brand-wordmark{
    display:flex;flex-direction:column;justify-content:center;
    line-height:1.05;min-width:0;
}
.eq-brand-wordmark .eq-brand-name{
    display:block;white-space:nowrap;
    font-family:'Merriweather', Georgia, serif;
    font-size:2.1rem;font-weight:900;letter-spacing:-.015em;
    color:#0d1b3d;
}
.eq-brand-wordmark .eq-brand-name .accent{color:#2196F3;margin-left:.18em}
.eq-brand-wordmark .eq-slogan-v5{
    display:block;white-space:nowrap;
    font-family:'Merriweather', Georgia, serif;
    font-style:italic;font-weight:400;
    font-size:clamp(.66rem, .55vw + .55rem, .82rem);
    color:#4b5b75;margin-top:3px;letter-spacing:.005em;
}
html.dark .eq-brand-wordmark .eq-brand-name,
body.dark-mode .eq-brand-wordmark .eq-brand-name{color:#f1f5f9}
html.dark .eq-brand-wordmark .eq-slogan-v5,
body.dark-mode .eq-brand-wordmark .eq-slogan-v5{color:#c5d0e4}

/* ============ NAV BUTTONS — modern pills ============ */
.equacom-header-v2 .header-quick-nav{display:flex;gap:10px;align-items:center}
.equacom-header-v2 .hqn-btn-v4{
    display:inline-flex;align-items:center;gap:8px;
    padding:9px 16px;border-radius:999px;
    font-weight:700;font-size:.86rem;letter-spacing:.01em;
    color:#fff;text-decoration:none;border:0;
    background:linear-gradient(135deg,#1a2332,#2b3a55);
    box-shadow:0 4px 12px rgba(15,23,42,.18);
    transition:transform .15s ease, box-shadow .2s ease, filter .2s ease;
    line-height:1;
}
.equacom-header-v2 .hqn-btn-v4 .hqn-ico{font-size:1.05rem;line-height:1}
.equacom-header-v2 .hqn-btn-v4:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(15,23,42,.25);filter:brightness(1.08)}
.equacom-header-v2 .hqn-btn-v4.hqn-blue  {background:linear-gradient(135deg,#1976D2,#2196F3)}
.equacom-header-v2 .hqn-btn-v4.hqn-amber {background:linear-gradient(135deg,#d97706,#f59e0b)}
.equacom-header-v2 .hqn-btn-v4.hqn-purple{background:linear-gradient(135deg,#6d28d9,#8b5cf6)}

/* ============ DAY / NIGHT TOGGLE — redesigned ============ */
.equacom-header-v2 .dark-toggle-v4{
    position:relative;width:54px;height:30px;border-radius:999px;
    background:linear-gradient(135deg,#e0e7ff,#cbd5e1);
    border:1px solid #cbd5e1;cursor:pointer;padding:0;
    display:inline-flex;align-items:center;justify-content:space-between;
    transition:background .25s ease, border-color .25s;
    box-shadow:inset 0 1px 3px rgba(15,23,42,.12);
}
.equacom-header-v2 .dark-toggle-v4 .icon-sun,
.equacom-header-v2 .dark-toggle-v4 .icon-moon{
    width:14px;height:14px;margin:0 7px;flex:0 0 14px;
    opacity:.55;transition:opacity .2s, color .2s;
}
.equacom-header-v2 .dark-toggle-v4 .icon-sun{color:#f59e0b;opacity:1}
.equacom-header-v2 .dark-toggle-v4 .icon-moon{color:#1e293b}
.equacom-header-v2 .dark-toggle-v4::after{
    content:"";position:absolute;top:2px;left:2px;
    width:24px;height:24px;border-radius:50%;
    background:#fff;box-shadow:0 2px 6px rgba(15,23,42,.25);
    transition:transform .28s cubic-bezier(.4,1.4,.6,1);
}
body.dark-mode .equacom-header-v2 .dark-toggle-v4{
    background:linear-gradient(135deg,#1e293b,#0f172a);border-color:#334155;
}
body.dark-mode .equacom-header-v2 .dark-toggle-v4 .icon-sun{opacity:.4;color:#94a3b8}
body.dark-mode .equacom-header-v2 .dark-toggle-v4 .icon-moon{opacity:1;color:#fef3c7}
body.dark-mode .equacom-header-v2 .dark-toggle-v4::after{transform:translateX(24px);background:#1e293b;box-shadow:0 2px 6px rgba(0,0,0,.5)}

/* ============ MOBILE ============ */
@media(max-width:768px){
    /* Override v5: keep dark toggle + hamburger visible, hide quick nav and search */
    .equacom-header-v2 .topbar{display:none !important}
    .equacom-header-v2 .header-main-v4{padding:0}
    .equacom-header-v2 .header-main-v4 .header-main-grid{
        grid-template-columns:auto 1fr auto;
        padding:8px 12px;gap:10px;align-items:center;
    }
    .equacom-header-v2 .header-logo-v4 img{height:38px}
    .eq-brand-wordmark .eq-brand-name{font-size:1.1rem}
    .eq-brand-wordmark .eq-slogan-v5{display:none}

    /* Hide nav pills + search bar on mobile (open via hamburger drawer) */
    .equacom-header-v2 .header-quick-nav,
    .equacom-header-v2 .search-toggle-wrap{display:none !important}

    /* Tools visible: dark toggle + hamburger */
    .equacom-header-v2 .header-tools{display:inline-flex !important;align-items:center;gap:8px}
    .equacom-header-v2 .dark-toggle-v4{display:inline-flex !important;width:48px;height:26px}
    .equacom-header-v2 .dark-toggle-v4::after{width:20px;height:20px}
    body.dark-mode .equacom-header-v2 .dark-toggle-v4::after{transform:translateX(22px)}

    /* Real hamburger button (replaces v5 ::before; that won't be clickable individually) */
    .equacom-header-v2 .header-zone-right::before{content:none !important}
    .eq-mobile-hamburger{
        display:inline-flex;align-items:center;justify-content:center;
        width:42px;height:42px;border-radius:10px;border:0;
        background:#f1f5f9;color:#1a2332;cursor:pointer;
        font-size:22px;line-height:1;padding:0;
    }
    body.dark-mode .eq-mobile-hamburger{background:#1e293b;color:#f1f5f9}

    /* Categories nav (drawer) — closed by default on mobile */
    .equacom-header-v2 .header-categories-nav{display:none !important}
    body.eq-mobile-menu-open .equacom-header-v2 .header-categories-nav{
        display:block !important;position:fixed;top:0;right:0;
        width:84vw;max-width:340px;height:100vh;background:#fff;z-index:10001;
        box-shadow:-12px 0 32px rgba(0,0,0,.25);
        padding:64px 18px 18px;overflow-y:auto;
        animation:eqSlideIn .25s ease;
    }
    body.dark-mode.eq-mobile-menu-open .equacom-header-v2 .header-categories-nav{background:#0f172a;color:#f1f5f9}
    @keyframes eqSlideIn{from{transform:translateX(100%)}to{transform:translateX(0)}}

    body.eq-mobile-menu-open .equacom-header-v2 .header-categories-nav .nav-menu{
        flex-direction:column;align-items:stretch;gap:0;display:flex;list-style:none;padding:0;margin:0;
    }
    body.eq-mobile-menu-open .equacom-header-v2 .header-categories-nav .nav-menu li{
        border-bottom:1px solid #e5e7eb;
    }
    body.dark-mode.eq-mobile-menu-open .equacom-header-v2 .header-categories-nav .nav-menu li{border-bottom-color:#1e293b}
    body.eq-mobile-menu-open .equacom-header-v2 .header-categories-nav .nav-menu a{
        padding:14px 6px;display:block;color:inherit;text-decoration:none;
    }
    body.eq-mobile-menu-open .equacom-header-v2 .header-categories-nav .menu-toggle{display:none}

    /* Close button injected by JS */
    .eq-drawer-close{
        position:fixed;top:14px;right:14px;z-index:10002;
        width:38px;height:38px;border-radius:50%;
        background:#1a2332;color:#fff;border:0;cursor:pointer;
        font-size:20px;line-height:1;display:none;align-items:center;justify-content:center;
        box-shadow:0 4px 14px rgba(0,0,0,.3);
    }
    body.eq-mobile-menu-open .eq-drawer-close{display:inline-flex}

    /* Click-catching overlay */
    body.eq-mobile-menu-open::after{
        content:"";position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:10000;
    }
    /* Prevent body scroll when drawer open */
    body.eq-mobile-menu-open{overflow:hidden;touch-action:none}

    /* Sub-header compact */
    .eq-subheader-inner{grid-template-columns:1fr;gap:4px;padding:6px 12px}
    .eq-sh-datetime{font-size:.72rem;padding:3px 10px;align-self:flex-start}
    .eq-sh-ticker{font-size:.78rem}

    /* Smaller buttons too — though hidden, in case they appear in drawer */
    .hqn-btn-v4{font-size:.8rem;padding:8px 14px}
}

/* ============ DESKTOP — keep single-line brand never breaks ============ */
@media(min-width:769px){
    .equacom-header-v2 .header-main-v4 .header-zone-left{gap:14px;min-width:0}
    .eq-mobile-hamburger{display:none}
}
