/* =======================================================
   1. ARTICLE TITLES & CARDS (JSAMR NAVY BLUE #002060)
   ======================================================= */
.obj_article_summary .title a,
.issue-article .title a,
h2.title a,
h3.title a {
    color: #002060 !important;
    text-decoration: none !important;
    border-bottom: none !important;
}

.obj_article_summary .authors,
.issue-article .authors,
.authors {
    color: #334e80 !important; 
}

.obj_galley_link, 
a.obj_galley_link,
.galley-link,
.obj_galley_link.pdf,
a.obj_galley_link.pdf {
    background-color: #002060 !important;
    border-color: #002060 !important;
    color: #ffffff !important;
}

.obj_galley_link:hover, 
a.obj_galley_link:hover,
.galley-link:hover,
.obj_galley_link.pdf:hover,
a.obj_galley_link.pdf:hover {
    background-color: #001030 !important;
    border-color: #001030 !important;
    color: #ffffff !important;
}

.obj_issue_toc .section h2,
.obj_issue_toc .section h3,
.issue-toc .section .title,
.section_heading h2,
.page_issue .heading {
    color: #002060 !important;
    font-weight: bold !important;
    border-bottom: none !important;
}

.current_issue .heading,
.issue_title,
h1.page_title,
.obj_issue_summary .title,
.issue-toc .current-issue-title {
    color: #002060 !important;
}

.obj_issue_summary .series,
.issue-toc .series,
.series,
.obj_issue_summary .title + div,
.issue_title + div {
    font-weight: bold !important;
}

.obj_article_summary,
.issue-article {
    background: #ffffff !important;
    border: 1px solid #cedbe7 !important; 
    border-radius: 6px !important;
    padding: 22px !important;
    box-shadow: 0 2px 10px rgba(0, 32, 96, 0.02) !important; 
}

/* =======================================================
   2. POLISHED DIM BLUISH HEADER NAVIGATION & HEIGHT REDUCTION
   ======================================================= */
.pkp_structure_head,
header,
.pkp_site_name_wrapper {
    background-color: #eaf0f6 !important; 
    border: none !important;
    box-shadow: none !important;
}

/* FIXED: Reduced bottom padding to zero to close the gap to the menu */
.pkp_site_name_wrapper {
    text-align: center !important;
    padding: 25px 0 0px 0 !important; 
    display: block !important;
}

/* FIXED: Increased max-height from 105px to 140px for a larger logo */
.pkp_site_name_wrapper img {
    max-width: 100% !important;
    max-height: 140px !important; 
    height: auto !important;
    margin: 0 auto !important;
    display: block !important;
}

.navbar-default,
.navbar,
.pkp_navigation_primary_wrapper {
    background-color: #002060 !important; 
    background-image: none !important;
    border: none !important;
    border-bottom: 2px solid #001030 !important;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05) !important;
}

/* Reduced height padding from 14px to 8px to make the ribbon sleek */
.navbar-default .navbar-nav > li > a,
.navbar .nav > li > a,
.pkp_navigation_primary a,
.pkp_navigation_user a {
    color: #ffffff !important;
    font-weight: 600 !important;
    font-size: 13.5px !important;
    text-shadow: none !important;
    padding: 8px 16px !important; 
}

.navbar-default .navbar-nav > li > a:hover,
.navbar .nav > li > a:hover,
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover {
    background-color: #001030 !important; 
    color: #ffffff !important;
}

/* =======================================================
   3. FIXED USER DROPDOWN MENUS (WHITE TEXT FOCUS)
   ======================================================= */
.dropdown-menu,
.navbar-nav .dropdown-menu,
.navbar-default .navbar-nav .open .dropdown-menu,
.pkp_navigation_user .dropdown-menu,
.pkp_navigation_user_wrapper .dropdown-menu {
    background-color: #002060 !important; 
    border: 1px solid #001030 !important;
    box-shadow: 0 6px 12px rgba(0,0,0,0.175) !important;
    padding: 5px 0 !important;
    min-width: 200px !important;
}

.dropdown-menu > li > a,
.navbar-nav .dropdown-menu > li > a,
.navbar-default .navbar-nav .open .dropdown-menu > li > a,
.pkp_navigation_user .dropdown-menu a,
.pkp_navigation_user .dropdown-menu li a {
    color: #ffffff !important; 
    padding: 8px 20px !important;
    background: none !important;
    display: block !important;
    font-weight: 500 !important;
    text-align: left !important;
}

.dropdown-menu > li > a:hover,
.navbar-nav .dropdown-menu > li > a:hover,
.navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
.pkp_navigation_user .dropdown-menu a:hover,
.dropdown-menu > li > a:focus {
    background-color: #001030 !important; 
    color: #ffffff !important;
    text-decoration: none !important;
}

body, 
.pkp_structure_body, 
.pkp_structure_main, 
#main-content {
    background-color: #f8fafc !important; 
}

.page_issue .description,
.obj_article_summary,
.issue-article,
.custom_block,
.custom-sidebar-card,
#JournalInfo {
    background-color: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 6px !important;
    padding: 24px !important;
    margin-bottom: 20px !important;
    box-shadow: 0 2px 8px rgba(0, 32, 96, 0.02) !important;
}

/* =======================================================
   4. INTUITIVE RESPONSIVE GRID LAYOUT MASTER CONTROLS
   ======================================================= */
@media (min-width: 992px) {
    /* Step 1: Force primary layout container row to align side-by-side cleanly using Flexbox */
    .pkp_structure_content,
    .page_article .container,
    .row {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: flex-start !important;
        justify-content: space-between !important;
    }

    /* Step 2: Main center panel content configuration */
    .pkp_structure_main,
    #main-content,
    .col-md-9.pkp_structure_main {
        width: calc(100% - 315px) !important; 
        max-width: calc(100% - 315px) !important;
        float: none !important;
    }

    /* Step 3: RESET structural page wrappers so titles and authors flow across 100% width */
    .obj_article_details,
    article.obj_article_details {
        display: block !important; 
        width: 100% !important;
    }

    /* Step 4: TARGET NATIVE TEXT ENTRY COLUMN INDEPENDENTLY */
    .obj_article_details .main_entry,
    .article-details-main,
    .obj_article_details > .article-main {
        width: 60% !important;
        max-width: 60% !important;
        float: left !important;
        display: block !important;
    }

    /* Step 5: WIDEN AND PAD THE NATIVE OJS SIDEBAR COLUMN WRAPPER */
    /* This completely pulls text elements out to the column margins and fixes double lines */
    .obj_article_details .entry_details,
    .article-details-sidebar,
    .obj_article_details > .sidebar {
        width: 38% !important; 
        max-width: 38% !important;
        float: right !important;
        display: block !important;
        margin-top: 0 !important;
        padding-left: 25px !important; /* Forces a safe buffer distance from the dividing line */
        box-sizing: border-box !important;
    }

    /* Step 6: INDEPENDENT METADATA CARD UTILITY EXPANSION */
    /* Forces elements like License, Published, and Issue text strings to stretch and fill the space fully */
    .obj_article_details .entry_details .item,
    .article-details-sidebar .item,
    .obj_article_details .entry_details div[class^="item"] {
        width: 100% !important;
        display: block !important;
        padding-left: 0 !important;
        margin-left: 0 !important;
    }

    /* Step 7: Stabilizes external green/yellow marketing column boundaries and adds a gap */
    .pkp_structure_sidebar,
    .sidebar,
    #sidebar,
    .col-md-3.pkp_structure_sidebar {
        width: 295px !important;       
        min-width: 295px !important;
        max-width: 295px !important;
        float: none !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        display: block !important;
        flex-shrink: 0 !important;
        margin-left: 20px !important; /* Creates the clean buffer gap before the marketing column */
    }
}

@media (max-width: 991px) {
    .pkp_structure_page {
        padding-top: 15px !important;
        margin-top: 0 !important;
        clear: both !important;
    }

    .pkp_structure_head, header {
        height: auto !important;
        min-height: 140px !important;
        display: block !important;
        position: relative !important;
        clear: both !important;
    }

    /* FIXED: Adjusted mobile wrapper padding for tighter spacing */
    .pkp_site_name_wrapper {
        padding: 15px 10px 5px 10px !important;
        display: block !important;
        float: none !important;
        width: 100% !important;
        text-align: center !important;
    }

    /* FIXED: Increased mobile logo max-height from 70px to 95px */
    .pkp_site_name_wrapper img {
        max-height: 95px !important;
        width: auto !important;
        display: inline-block !important;
    }

    .pkp_structure_sidebar, .sidebar, #sidebar, .col-md-3.pkp_structure_sidebar,
    .pkp_structure_main, #main-content, .col-md-9.pkp_structure_main,
    .obj_article_details, .obj_article_details .main_entry, .obj_article_details .entry_details,
    .article-details-main, .article-details-sidebar {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 100% !important;
        float: none !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
        display: block !important;
    }
    
    .pkp_structure_sidebar {
        margin-top: 30px !important;
    }
    
    .page_index_journal hr,
    .page_index_journal [style*="border-top"],
    .page_index_journal .pkp_structure_main::before {
        border: none !important;
        background: none !important;
        display: none !important;
    }
    
    .page_index_journal [class*="announcement"],
    .page_index_journal article.announcement,
    .obj_announcement_summary {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding: 18px !important;
    }
}

/* =======================================================
   5. RIGHT-SIDE SIDEBAR CLEANUP STRUCTURES
   ======================================================= */
.pkp_structure_sidebar .block,
.sidebar .block,
.sidebar .panel,
.custom_block,
div[id^="customblock-"],
div[id*="customblock"] {
    margin-bottom: 12px !important; 
    margin-top: 0 !important;
    padding: 0 !important;          
    background: transparent !important; 
    border: none !important;        
    width: 100% !important;
}

.custom-sidebar-card {
    background-color: #ffffff !important; 
    border: 1px solid #cedbe7 !important; 
    border-radius: 6px !important; 
    overflow: hidden !important; 
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important; 
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* =======================================================
   6. CENTRAL CONTENT GAPS & FOOTER CONTROLS
   ======================================================= */
.obj_issue_toc .section, 
.issue-toc .section, 
.section, 
.issue-toc [class*="section-"] {
    margin-bottom: 4px !important; 
    padding-bottom: 0 !important;
}

.obj_issue_toc .section + .section, 
.issue-toc .section + .section, 
div.section + div.section,
.obj_issue_toc .section h2, 
.obj_issue_toc .section h3, 
.issue-toc .section .title {
    margin-top: 4px !important; 
    padding-top: 0 !important;
}

.obj_article_summary, 
.issue-article {
    margin-bottom: 8px !important; 
}

.pkp_structure_footer_wrapper, 
.pkp_structure_footer, 
footer, 
#pkp_structure_footer {
    background-color: #001030 !important; 
    border-top: 4px solid #002060 !important; 
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 40px !important;
}

.pkp_structure_footer a, 
footer a { 
    color: #ffffff !important; 
}

.pkp_structure_footer a:hover, 
footer a:hover { 
    color: #ffcc00 !important; 
}

/* =======================================================
   7. BULLETPROOF HOMEPAGE ANNOUNCEMENT CARD LAYOUT - JSAMR
   ======================================================= */
.page_index_journal [class*="announcement"], 
.page_announcement [class*="announcement"], 
[class*="obj_announcement"],
.announcements_list li, 
.announcement-summary, 
article.announcement {
    background-color: #ffffff !important; 
    border: 1px solid #cedbe7 !important; 
    border-top: 5px solid #002060 !important;
    border-radius: 6px !important; 
    padding: 25px !important; 
    margin-bottom: 25px !important; 
    box-shadow: 0 4px 12px rgba(0, 32, 96, 0.03) !important;
    list-style-type: none !important;
}

[class*="announcement"] h1, 
[class*="announcement"] h2, 
[class*="announcement"] h3, 
[class*="announcement"] h4, 
[class*="announcement"] .title {
    color: #002060 !important; 
    font-weight: bold !important; 
    font-size: 18px !important; 
    display: block !important;
}

[class*="announcement"] ul { 
    padding-left: 20px !important; 
    margin-top: 8px !important; 
    margin-bottom: 15px !important; 
}

[class*="announcement"] li { 
    margin-bottom: 5px !important; 
    list-style-type: disc !important; 
}

[class*="announcement"] a[href*="submission"], 
[class*="announcement"] .description a, 
[class*="announcement"] a.read_more, 
.obj_announcement_summary .read_more {
    display: inline-block !important; 
    background-color: #002060 !important; 
    color: #ffffff !important; 
    font-weight: bold !important;
    text-transform: uppercase !important; 
    padding: 10px 20px !important; 
    border-radius: 4px !important; 
    margin-top: 15px !important;
}

/* =======================================================
   8. INNER PAGES BREADCRUMB BACKGROUND STRIP CLEANUP
   ======================================================= */
.cmp_breadcrumbs, 
.breadcrumbs, 
.pkp_structure_main [class="breadcrumb"], 
.pkp_structure_main ul.breadcrumb, 
.pkp_structure_main ol.breadcrumb, 
.pkp_structure_breadcrumb_wrapper {
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    box-shadow: none !important;
    padding: 10px 0 !important;
    margin-bottom: 15px !important;
    width: auto !important;
}

.cmp_breadcrumbs a, 
.breadcrumbs a, 
.breadcrumb a, 
.breadcrumb > li + li::before {
    color: #444444 !important;
    text-shadow: none !important;
    font-weight: 500 !important;
}

.cmp_breadcrumbs a:hover, 
.breadcrumbs a:hover, 
.breadcrumb a:hover {
    color: #002060 !important;
    text-decoration: underline !important;
}

/* =======================================================
   9. TOP-RIGHT USER UTILITY LINKS CONTRAST COLOR FIX
   ======================================================= */
.pkp_navigation_user,
.pkp_navigation_user > li > a,
.pkp_navigation_user_wrapper > a {
    color: #002060 !important;
    font-weight: 600 !important;
    font-size: 13px !important;
}
/* =======================================================
   10. MOBILE HAMBURGER MENU VIZIBILITY FIX
   ======================================================= */
@media (max-width: 991px) {
    /* Forces the mobile menu button background to be visible */
    .navbar-toggle, 
    button.navbar-toggle,
    .pkp_navigation_primary_wrapper .navbar-toggle {
        border: 2px solid #002060 !important;
        background-color: #ffffff !important; /* Crisp white button background */
        padding: 9px 10px !important;
        margin-top: 8px !important;
        margin-bottom: 8px !important;
        display: block !important;
        border-radius: 4px !important;
    }

    /* Highlights the three individual horizontal lines inside the button */
    .navbar-toggle .icon-bar,
    button.navbar-toggle .icon-bar {
        background-color: #002060 !important; /* Deep navy blue lines */
        display: block !important;
        width: 22px !important;
        height: 3px !important; /* Slightly thicker for better visibility */
        border-radius: 1px !important;
    }
    
    /* Spacing between the three horizontal lines */
    .navbar-toggle .icon-bar + .icon-bar {
        margin-top: 4px !important;
    }
    
    /* Darkens the button background when tapped/hovered on mobile */
    .navbar-toggle:hover, 
    .navbar-toggle:focus {
        background-color: #eaf0f6 !important;
    }
}
/* =======================================================
   11. MOBILE USER MENU LINKS CONTRAST FIX (REGISTER/LOGIN)
   ======================================================= */
@media (max-width: 991px) {
    /* Forces Register and Login links to be white on mobile background */
    .pkp_navigation_user a,
    .pkp_navigation_user li a,
    ul.pkp_navigation_user > li > a,
    #navigationUser a {
        color: #ffffff !important;
        opacity: 1 !important;
        font-weight: 600 !important;
        display: block !important;
        padding: 10px 16px !important;
    }

    /* Adds a subtle hover effect if tapped on mobile */
    .pkp_navigation_user a:hover,
    .pkp_navigation_user li a:hover {
        color: #ffcc00 !important; /* Elegant gold highlight on press */
        background-color: #001030 !important;
    }
}
