/* ============================================
   IEJRD - COMPLETE CUSTOM CSS (CLEAN)
   Last updated: Feb 17, 2026
   ============================================ */

/* ---- GLOBAL ---- */
body, html {
    overflow-x: hidden !important;
}

/* ============================================
   1. HEADER - Remove white background from title
   ============================================ */
.main-header__title span {
    background: transparent !important;
    background-color: transparent !important;
    color: #ffffff !important;
    text-shadow:
        0 0 10px rgba(0, 0, 0, 0.9),
        2px 2px 6px rgba(0, 0, 0, 0.9) !important;
    font-weight: 700 !important;
    padding: 0 !important;
}

.main-header__title a,
.main-header__title a.is_text {
    color: #ffffff !important;
    text-shadow:
        0 0 10px rgba(0, 0, 0, 0.9),
        2px 2px 6px rgba(0, 0, 0, 0.9) !important;
}

/* ============================================
   2. NAVIGATION - Transparent & readable
   ============================================ */
.main-header__nav .nav-link,
.main-header__nav .navbar-nav .nav-link,
.navbar-nav .nav-item .nav-link {
    background: transparent !important;
    background-color: transparent !important;
    color: #ffffff !important;
    text-shadow:
        0 0 10px rgba(0, 0, 0, 0.9),
        2px 2px 4px rgba(0, 0, 0, 0.9) !important;
    font-weight: 600 !important;
    font-size: 15px !important;
    border: none !important;
    box-shadow: none !important;
}

.main-header__nav .nav-link:hover,
.navbar-nav .nav-item .nav-link:hover {
    background: rgba(255, 255, 255, 0.2) !important;
    border-radius: 6px !important;
}

/* ============================================
   3. DROPDOWN - Hover open + dark styling
   ============================================ */
.main-header__nav .nav-item.dropdown:hover > .dropdown-menu,
.navbar-nav .nav-item.dropdown:hover > .dropdown-menu {
    display: block !important;
    margin-top: 0 !important;
}

.dropdown-menu {
    background: rgba(15, 23, 42, 0.95) !important;
    border: none !important;
    border-radius: 8px !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3) !important;
    padding: 8px 0 !important;
}

.dropdown-menu a,
.dropdown-menu .dropdown-item {
    color: #e2e8f0 !important;
    padding: 10px 20px !important;
    font-size: 14px !important;
    transition: all 0.2s ease !important;
    background: transparent !important;
}

.dropdown-menu a:hover,
.dropdown-menu .dropdown-item:hover {
    background: rgba(96, 165, 250, 0.2) !important;
    color: #ffffff !important;
}

/* ============================================
   4. CURRENT ISSUE SECTION
   ============================================ */
.immersion_issue_current,
.current_issue_title,
#immersion_content_main .current_issue {
    background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%) !important;
    padding: 40px !important;
    border-radius: 0 !important;
    color: #ffffff !important;
}

.immersion_issue_current h2,
.current_issue_title h2,
.issue-summary h2 {
    color: #ffffff !important;
    font-size: 14px !important;
    text-transform: uppercase !important;
    letter-spacing: 3px !important;
    font-weight: 400 !important;
    margin-bottom: 10px !important;
}

.immersion_issue_current .lead,
.issue-summary h3,
.issue-summary .series_title {
    color: #ffffff !important;
    font-size: 28px !important;
    font-weight: 700 !important;
}

.immersion_issue_current .published,
.issue-summary .published {
    color: #90caf9 !important;
    font-size: 13px !important;
    letter-spacing: 1px !important;
}

/* ============================================
   5. ARTICLE CARDS
   ============================================ */
.obj_article_summary,
.article_summary {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-left: 4px solid #3b82f6 !important;
    border-radius: 8px !important;
    padding: 24px 28px !important;
    margin-bottom: 20px !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important;
}

.obj_article_summary:hover,
.article_summary:hover {
    box-shadow: 0 6px 20px rgba(59, 130, 246, 0.15) !important;
    border-left-color: #1e40af !important;
    transform: translateY(-2px) !important;
}

.obj_article_summary .title a,
.article_summary .title a {
    color: #1e293b !important;
    font-size: 17px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    line-height: 1.5 !important;
    transition: color 0.3s ease !important;
}

.obj_article_summary .title a:hover,
.article_summary .title a:hover {
    color: #3b82f6 !important;
}

.obj_article_summary .authors,
.article_summary .meta .authors {
    color: #64748b !important;
    font-size: 13px !important;
    font-style: italic !important;
    margin-bottom: 8px !important;
}

/* PDF/Galley buttons */
.obj_article_summary a.obj_galley_link,
.obj_article_summary .btn,
.article_summary a.obj_galley_link {
    background: linear-gradient(135deg, #3b82f6, #1e40af) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 20px !important;
    padding: 6px 20px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    text-decoration: none !important;
    display: inline-block !important;
    margin-top: 10px !important;
    transition: all 0.3s ease !important;
}

.obj_article_summary a.obj_galley_link:hover,
.obj_article_summary .btn:hover,
.article_summary a.obj_galley_link:hover {
    background: linear-gradient(135deg, #1e40af, #3b82f6) !important;
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3) !important;
    transform: translateY(-1px) !important;
}

/* Articles section heading */
#immersion_content_main h3,
.page_issue_current h3 {
    font-size: 22px !important;
    font-weight: 700 !important;
    color: #1e293b !important;
    text-transform: uppercase !important;
    letter-spacing: 2px !important;
    padding-bottom: 12px !important;
    border-bottom: 3px solid #3b82f6 !important;
    display: inline-block !important;
    margin-bottom: 30px !important;
}

/* Page background */
#immersion_content_main,
main {
    background: #f5f7fa !important;
}

.page_issue_current .obj_article_summary,
.issue-toc .obj_article_summary {
    max-width: 900px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* ============================================
   6. FOOTER - Full width premium
   ============================================ */

/* Remove ALL constraints from OJS footer wrappers */
footer.main-footer,
#immersion_content_footer,
footer.main-footer > div,
#immersion_content_footer > div,
footer .container,
footer .container-fluid {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    background: #1e293b !important;
}

/* Hide OJS/PKP branding */
.pkp_brand_footer,
a.pkp_brand_footer_link,
footer .pkp_brand_footer {
    display: none !important;
}

/* Main footer wrapper */
.premium-footer {
    width: 100% !important;
    max-width: 100% !important;
    position: relative !important;
    left: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #1e293b !important;
    color: #cbd5e1 !important;
    font-family: 'Roboto', sans-serif !important;
    box-sizing: border-box !important;
    border-top: 4px solid #3b82f6 !important;
}

/* Footer content area */
.footer-main-content {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 45px 40px 35px !important;
    box-sizing: border-box !important;
}

/* 4-column grid */
.footer-grid {
    display: grid !important;
    grid-template-columns: 1.4fr 1fr 1fr 1.2fr !important;
    gap: 35px !important;
}

/* Column headings */
.footer-heading {
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 1.5px !important;
    margin: 0 0 20px 0 !important;
    padding: 0 !important;
    border: none !important;
}

/* Footer detail text */
.footer-detail {
    color: #94a3b8 !important;
    font-size: 13.5px !important;
    margin: 0 0 8px 0 !important;
    line-height: 1.7 !important;
}

.footer-detail strong {
    color: #e2e8f0 !important;
    font-weight: 600 !important;
}

.footer-detail em {
    color: #93c5fd !important;
    font-style: italic !important;
}

.footer-detail a {
    color: #60a5fa !important;
    text-decoration: none !important;
    transition: color 0.3s ease !important;
}

.footer-detail a:hover {
    color: #ffffff !important;
}

/* Footer links list */
.footer-links {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.footer-links li {
    margin: 0 0 10px 0 !important;
}

.footer-links li a {
    color: #94a3b8 !important;
    text-decoration: none !important;
    font-size: 13.5px !important;
    transition: all 0.3s ease !important;
    display: inline-block !important;
}

.footer-links li a:hover {
    color: #60a5fa !important;
    padding-left: 5px !important;
}

/* Bottom bar */
.footer-bottom-bar {
    background: #0f172a !important;
    text-align: center !important;
    padding: 30px 40px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.footer-copyright {
    color: #e2e8f0 !important;
    font-size: 14px !important;
    margin: 0 0 12px 0 !important;
    line-height: 1.6 !important;
}

.footer-copyright strong {
    color: #ffffff !important;
}

.footer-license {
    color: #64748b !important;
    font-size: 12.5px !important;
    margin: 0 0 8px 0 !important;
    line-height: 1.7 !important;
    max-width: 1000px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.footer-license strong {
    color: #94a3b8 !important;
}

/* ============================================
   7. RESPONSIVE
   ============================================ */
@media (max-width: 768px) {
    .footer-grid {
        grid-template-columns: 1fr !important;
        gap: 25px !important;
    }
    .footer-main-content {
        padding: 30px 20px !important;
    }
    .footer-bottom-bar {
        padding: 20px !important;
    }
}

@media (max-width: 1024px) and (min-width: 769px) {
    .footer-grid {
        grid-template-columns: 1fr 1fr !important;
    }
}
/* ============================================
   FORCE FULL WIDTH - NUCLEAR OPTION
   ============================================ */
footer,
footer.main-footer {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(-50vw + 50%) !important;
    background: #1e293b !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

/* Also hide the PKP branding that sits outside the footer */
.pkp_brand_footer,
footer + div,
.main-footer ~ div,
a[href*="pkp.sfu.ca"],
div[class*="pkp_brand"] {
    display: none !important;
}
/* ============================================
   HOMEPAGE IMAGE / LOGO SIZE FIX
   ============================================ */

/* Reduce the homepage banner/logo image */
.homepage_image,
.homepage_image img,
.pkp_structure_head .homepage_image img {
    max-height: 200px !important;
    width: auto !important;
    max-width: 300px !important;
}

/* If the logo is inside the header as a block */
.main-header .main-header__identity img,
.main-header img.logo {
    max-height: 80px !important;
    width: auto !important;
}

/* Target the specific white box container */
.main-header__title {
    max-width: 300px !important;
}
/* ============================================
   HIDE JOURNAL TITLE TEXT IN HEADER
   ============================================ */

/* Hide the text title above the nav */
.main-header__title,
.main-header__identity .main-header__title,
h1.main-header__title {
    display: none !important;
}