/* ================================================================
   NEURO.WIKI SHELL — Top bar + context-specific sub-header
   Injected on neuro.wiki only. neurotrials.ai is unaffected.
   ================================================================ */

/* ===== SHELL WRAPPER ===== */
#nwb-shell {
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 999999;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}
#nwb-shell * { box-sizing: border-box; }

/* ===== TOP BAR (48px dark) ===== */
.nwb-topbar {
    background: #0f172a;
    border-bottom: 1px solid rgba(255,255,255,0.07);
    position: relative;
}
.nwb-topbar-inner {
    display: flex;
    align-items: center;
    height: 48px;
    padding: 0 20px;
}

/* Logo */
.nwb-logo {
    font-size: 15px;
    font-weight: 800;
    color: #fff;
    text-decoration: none;
    letter-spacing: -0.03em;
    padding-right: 20px;
    margin-right: 4px;
    border-right: 1px solid rgba(255,255,255,0.1);
    white-space: nowrap;
    flex-shrink: 0;
}
.nwb-logo:hover { color: #fff; }
.nwb-logo-dot { color: #3B8DFF; }

/* Pillar tabs */
.nwb-pillars {
    display: flex;
    align-items: center;
    flex: 1;
    min-width: 0;
    overflow: hidden;
}
.nwb-pillar {
    display: flex;
    align-items: center;
    height: 48px;
    padding: 0 13px;
    font-size: 12.5px;
    font-weight: 600;
    color: rgba(255,255,255,0.6);
    text-decoration: none;
    transition: color 0.15s;
    position: relative;
    white-space: nowrap;
    flex-shrink: 0;
}
.nwb-pillar:hover { color: rgba(255,255,255,0.88); }
.nwb-pillar.active { color: #fff; }
.nwb-pillar.active::after {
    content: '';
    position: absolute;
    bottom: 0; left: 0; right: 0;
    height: 2px;
    border-radius: 2px 2px 0 0;
}
.nwb-pillar--trials.active::after   { background: #10B981; }
.nwb-pillar--boards.active::after   { background: #0891B2; }
.nwb-pillar--wiki.active::after     { background: #3B82F6; }
.nwb-pillar--journal.active::after  { background: #F59E0B; }
.nwb-pillar--residents.active::after{ background: #7C3AED; }

/* Top-bar right (auth + NE button) */
.nwb-topbar-right {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
    flex-shrink: 0;
    padding-left: 12px;
}
.nwb-auth-btn {
    font-size: 12.5px;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.15s;
    white-space: nowrap;
}
.nwb-auth-login { color: rgba(255,255,255,0.7); }
.nwb-auth-login:hover { color: #fff; }
.nwb-auth-signup {
    background: #1f7cec;
    color: #fff !important;
    padding: 5px 13px;
    border-radius: 5px;
}
.nwb-auth-signup:hover { background: #1a6dd4; }

/* Hamburger (mobile only) */
.nwb-hamburger {
    display: none;
    background: none;
    border: none;
    color: rgba(255,255,255,0.8);
    font-size: 22px;
    cursor: pointer;
    padding: 4px 8px;
    margin-left: auto;
    line-height: 1;
}

/* Mobile expanded menu */
.nwb-mobile-menu {
    display: none;
    flex-direction: column;
    background: #0f172a;
    border-top: 1px solid rgba(255,255,255,0.07);
}
.nwb-mobile-menu.open { display: flex; }
.nwb-mobile-pillar {
    display: block;
    padding: 11px 20px;
    font-size: 13.5px;
    font-weight: 600;
    color: rgba(255,255,255,0.65);
    text-decoration: none;
    border-left: 3px solid transparent;
    transition: all 0.12s;
}
.nwb-mobile-pillar:hover { color: #fff; background: rgba(255,255,255,0.04); }
.nwb-mobile-pillar.active { color: #fff; border-left-color: #3B8DFF; background: rgba(255,255,255,0.06); }
.nwb-mobile-divider { height: 1px; background: rgba(255,255,255,0.07); margin: 4px 0; }
.nwb-mobile-auth-row {
    display: flex;
    gap: 16px;
    padding: 10px 20px 14px;
}
.nwb-mobile-auth-row a {
    font-size: 13px;
    font-weight: 600;
    color: rgba(255,255,255,0.65);
    text-decoration: none;
}
.nwb-mobile-auth-row a:hover { color: #fff; }

/* ===== SUB-HEADER BASE (navy, 40px) ===== */
.nwb-subheader {
    position: relative;
    background: #1e3a5f;
}

/* Hide upstream wiki SPA's own top-nav — replaced by #nwb-shell sub-header */
.wiki-container .top-nav { display: none !important; }
.nwb-sub-inner {
    display: flex;
    align-items: center;
    height: 40px;
    padding: 0 16px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
.nwb-sub-inner::-webkit-scrollbar { display: none; }

/* NeuroTrials sub-header: reuses existing .h2-spec-bar for JS compat */
.nwb-sub--trials .h2-spec-bar {
    height: 40px;
    padding: 0 16px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
.nwb-sub--trials .h2-spec-bar::-webkit-scrollbar { display: none; }
.nwb-sub--trials .h2-spec-left {
    justify-content: flex-start;
    flex: 1;
    min-width: 0;
}

/* NeuroTrials / NeuroLatest tabs */
.nwb-sub-tabs {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}
.nwb-sub-tab {
    display: flex;
    align-items: center;
    height: 40px;
    padding: 0 13px;
    font-size: 13px;
    font-weight: 700;
    color: rgba(255,255,255,0.6);
    text-decoration: none;
    white-space: nowrap;
    position: relative;
    transition: color 0.15s;
}
.nwb-sub-tab:hover { color: rgba(255,255,255,0.9); }
.nwb-sub-tab.active { color: #fff; }
.nwb-sub-tab.active::after {
    content: '';
    position: absolute;
    bottom: 0; left: 0; right: 0;
    height: 2px;
    background: #B8860B;
    border-radius: 2px 2px 0 0;
}

/* Separator between tabs and specialty pills */
.nwb-sub-sep {
    width: 1px;
    height: 18px;
    background: rgba(255,255,255,0.18);
    margin: 0 6px;
    flex-shrink: 0;
}

/* Generic specialty pill (wiki, journal, boards, residents) */
.nwb-spec {
    display: flex;
    align-items: center;
    height: 40px;
    padding: 0 13px;
    font-size: 13px;
    font-weight: 500;
    color: rgba(255,255,255,0.65);
    text-decoration: none;
    white-space: nowrap;
    flex-shrink: 0;
    transition: color 0.15s, background 0.15s;
    position: relative;
}
.nwb-spec:hover { color: #fff; background: rgba(255,255,255,0.07); }
.nwb-spec.active { color: #fff; font-weight: 700; }
.nwb-spec.active::after {
    content: '';
    position: absolute;
    bottom: 0; left: 0; right: 0;
    height: 2px;
    background: #B8860B;
    border-radius: 2px 2px 0 0;
}

/* ===== PAGE CONTENT OFFSET ===== */
/* top bar 48px + sub-header 40px = 88px total */
#h2-page-content { margin-top: 88px !important; }

body.admin-bar #nwb-shell          { top: 32px; }
body.admin-bar #h2-page-content    { margin-top: 120px !important; }
body.admin-bar #neuroevidence-panel{ top: 80px; height: calc(90vh - 80px); }

/* Wiki pages: sub-header still 40px high, same offset */
#h2-page-content[style*="margin-top:56px"] { margin-top: 88px !important; }

/* ===== FILTER PANEL POSITION ADJUSTMENT ===== */
/* Panel is appended to .h2-spec-bar and positioned absolute top:38px.
   Our .h2-spec-bar is now inside the shell at y=48, so the panel
   opens correctly right below the sub-header. */
.h2-filter-panel { top: 40px; }

/* ===== MOBILE ===== */
@media (max-width: 768px) {
    .nwb-pillars { display: none; }
    .nwb-topbar-right { display: none; }
    .nwb-hamburger { display: block; }
    .nwb-logo { border-right: none; padding-right: 12px; }

    #h2-page-content { margin-top: 88px !important; }
    body.admin-bar #h2-page-content { margin-top: 134px !important; }
    body.admin-bar #nwb-shell { top: 46px; }

    .nwb-sub--trials .h2-spec-bar { padding: 0 8px; }
    .nwb-sub-inner { padding: 0 8px; }
    .nwb-sub-tab { padding: 0 10px; font-size: 12px; }
    .nwb-spec { padding: 0 10px; font-size: 12px; }
    .h2-spec-item { padding: 0 10px !important; font-size: 12px !important; }

    /* NeuroEvidence panel full-screen */
    #neuroevidence-panel { width: 100vw; border-radius: 0; height: calc(92vh - 48px); top: 48px; }
    body.admin-bar #neuroevidence-panel { top: 94px; height: calc(92vh - 94px); }
}

@media (max-width: 782px) {
    body.admin-bar #nwb-shell { top: 46px; }
}

/* ===== HIDE OLD SINGLE-TIER HEADER (safety net) ===== */
/* header.php no longer renders .h2-header, but this guards against
   cached or proxied HTML that still has it. */
header.h2-header { display: none !important; }