/* =======================================================
   1. ARTICLE TITLES & CARDS (JMMHR NAVY & TEAL)
   ======================================================= */
.obj_article_summary .title a,
.issue-article .title a,
h2.title a,
h3.title a {
    color: #0E406A !important; /* Deep Navy Blue */
    text-decoration: none !important;
    border-bottom: none !important;
}

.obj_article_summary .title a:hover,
.issue-article .title a:hover,
h2.title a:hover,
h3.title a:hover {
    color: #1E8A86 !important; /* Modern Teal Accent on hover */
}

.obj_article_summary .authors,
.issue-article .authors,
.authors {
    color: #577590 !important; /* Professional Slate Blue for authors */
}

/* Full Text PDF Buttons */
.obj_galley_link, 
a.obj_galley_link,
.galley-link,
.obj_galley_link.pdf,
a.obj_galley_link.pdf {
    background-color: #0E406A !important; /* Deep Navy Blue */
    border-color: #0E406A !important;
    color: #ffffff !important;
}

/* Button Hover States */
.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: #1E8A86 !important; /* Shifts to Teal on Hover */
    border-color: #1E8A86 !important;
    color: #ffffff !important;
}

/* Issue Table of Contents Section Headings (EDITORIAL, SCIENTIFIC COMMUNICATION) */
.obj_issue_toc .section h2,
.obj_issue_toc .section h3,
.issue-toc .section .title,
.section_heading h2,
.page_issue .heading {
    color: #0E406A !important; /* Deep Navy Blue */
    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: #0E406A !important; /* Deep Navy Blue */
}

.obj_issue_summary .series,
.issue-toc .series,
.series,
.obj_issue_summary .title + div,
.issue_title + div {
    font-weight: bold !important;
}

/* Article Summary Cards Setup */
.obj_article_summary,
.issue-article {
    background: #ffffff !important;
    border: 1px solid #eef2f5 !important;
    border-radius: 6px !important;
    padding: 20px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important;
}
/* =======================================================
   2. REVISED JMMHR TEAL HEADER & OVERALL PAGE TINTS
   ======================================================= */
/* The main header background - styled with a soft, clean light teal tint */
header,
.pkp_structure_head,
#pkp_structure_head {
    background-color: #E9F4F3 !important; /* Soft light-teal tint (Teal mixed with white) */
    border-bottom: 2px solid #1E8A86 !important; /* Sharp solid teal bottom border strip */
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    height: auto !important;
}

/* Global Content Body Tint Settings */
body, 
.pkp_structure_main, 
#main-content {
    background-color: #F3F8F7 !important; /* Overall background has a matching trace teal shade */
}

/* Primary Top Navigation bar strip turned completely white */
.navbar-default,
.navbar,
.pkp_navigation_primary_wrapper {
    background-color: #ffffff !important; 
    border: none !important;
    border-bottom: 1px solid #C6E2E0 !important; /* Muted teal-gray bottom border line */
    margin-top: -1px !important;     
    position: relative !important;
    z-index: 9999 !important;
}

/* Core menu link colors */
.navbar-default .navbar-nav > li > a,
.navbar .nav > li > a,
.pkp_navigation_primary > li > a,
.pkp_navigation_primary a {
    color: #0E406A !important; /* Authoritative Deep Navy text for contrast */
    font-weight: bold !important;
}

/* Soft teal highlight background when hovering over menu items */
.navbar-default .navbar-nav > li > a:hover,
.navbar .nav > li > a:hover,
.pkp_navigation_primary > li > a:hover {
    background-color: #D2EAE8 !important; /* Active hover background using your teal theme */
    color: #1E8A86 !important; /* Text turns into the exact header teal color */
}
/* =======================================================
   3. BULLETPROOF HOVER DROPDOWN MENU FIX
   ======================================================= */
.dropdown-menu,
.navbar-nav .dropdown-menu,
.navbar-default .navbar-nav .open .dropdown-menu,
.pkp_navigation_primary .dropdown-menu {
    background-color: #0E406A !important; /* Deep Navy Blue background */
    border: 1px solid #1E8A86 !important; /* Polished Teal border accent */
    box-shadow: 0 6px 12px rgba(0,0,0,0.15) !important;
    padding: 6px 0 !important;
    min-width: 260px !important;
    height: auto !important;          
    margin-top: 0 !important;        
}

.dropdown-menu > li > a,
.navbar-nav .dropdown-menu > li > a,
.navbar-default .navbar-nav .open .dropdown-menu > li > a,
.pkp_navigation_primary .dropdown-menu a {
    color: #ffffff !important;
    padding: 10px 20px !important;    
    background: none !important;
    display: block !important;
    font-weight: 500 !important;
    text-align: left !important;
    line-height: 1.5 !important;      
    white-space: normal !important;   
}

.dropdown-menu > li > a:hover,
.navbar-nav .dropdown-menu > li > a:hover,
.pkp_navigation_primary .dropdown-menu a:hover {
    background-color: #1E8A86 !important; /* Highlight shifts to Teal on hover */
    color: #ffffff !important;
    text-decoration: none !important;
}

/* Global Content Body Tint Settings */
body, 
.pkp_structure_main, 
#main-content {
    background-color: #f7f9fa !important;
}

.pkp_structure_body {
    background-color: transparent !important; /* Prevents structural gray background bleed */
}

.obj_article_summary,
.issue-article,
.custom_block,
#JournalInfo {
    background-color: #ffffff !important;
}

/* =======================================================
   4. RIGHT-SIDE SIDEBAR VERTICAL GAP & ISOLATION FIX
   ======================================================= */
/* Standardizes the sidebar framework block on the right layout wing */
.pkp_structure_sidebar,
.sidebar,
#sidebar,
.col-md-3.pkp_structure_sidebar {
    width: 295px !important;       
    min-width: 295px !important;
    max-width: 295px !important;
    float: right !important; 
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important; /* CRITICAL: Includes padding in width metrics to stop overlapping */
}

/* FIXED CONTENT FRAME: Balances proportions and eliminates overlap collision layout defects */
.pkp_structure_main,
#main-content,
.col-md-9.pkp_structure_main {
    width: calc(100% - 325px) !important; /* FIXED: Increased space clearing window from 315px to 325px */
    max-width: calc(100% - 325px) !important;
    float: left !important;
    box-sizing: border-box !important; /* CRITICAL: Keeps width rules strict across browsers */
}

/* Clearfix rule to force parent containers to expand normally around both columns */
.pkp_structure_body .container,
.pkp_structure_body .row,
#main-content-wrapper {
    display: block !important;
    content: "" !important;
    clear: both !important;
}

.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 #d2dfea !important; /* Replaced light green with clean blue-gray line */
    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;
}

/* =======================================================
   5. CENTRAL CONTENT GAP OVERRIDES
   ======================================================= */
.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: 6px !important; 
}
/* =======================================================
   6. GLOBAL FULL-WIDTH NAVY FOOTER COVERAGE FIX
   ======================================================= */
.pkp_structure_footer_wrapper,
.pkp_structure_footer,
footer,
#pkp_structure_footer,
.pkp_structure_footer_wrapper .container {
    background-color: #082640 !important; /* Rich Dark Navy background for authority */
    border-top: 4px solid #1E8A86 !important; /* Thick Teal brand bar on top */
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
}

.pkp_structure_footer .container,
footer .container {
    max-width: 1140px !important;
    margin: 0 auto !important;
}

.pkp_structure_footer a,
footer a,
.pkp_structure_footer span a {
    color: #ffffff !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    transition: color 0.25s ease-in-out !important;
}

.pkp_structure_footer a:hover,
footer a:hover,
.pkp_structure_footer span a:hover {
    color: #00E5FF !important; /* Modern luminous tech-blue for highly legible footer hover links */
    text-decoration: underline !important;
}

/* Journal Announcement Cards block layout */
.page_index_journal .announcements,
.obj_announcement_summary {
    background-color: #ffffff !important;
    border: 1px solid #cedbe7 !important;
    border-top: 4px solid #0E406A !important; /* Solid Navy accent bar */
    border-radius: 6px !important;
    padding: 22px !important;
    margin-bottom: 25px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03) !important;
}

.obj_announcement_summary .title,
.obj_announcement_summary h2 {
    font-size: 18px !important;
    font-weight: bold !important;
    color: #0E406A !important; /* Navy title color */
    margin-top: 0 !important;
    margin-bottom: 10px !important;
}

.navbar-default .navbar-nav > li > a,
.navbar .nav > li > a,
.pkp_navigation_primary a {
    transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out !important;
}

.pkp_structure_main {
    padding-left: 15px !important;
    padding-right: 15px !important;
    box-sizing: border-box !important;
}

.pkp_structure_sidebar {
    padding-top: 0 !important;
}

.obj_galley_link,
a.obj_galley_link {
    font-size: 12px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    font-weight: bold !important;
    border-radius: 4px !important;
    padding: 6px 14px !important;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.06) !important;
    transition: all 0.2s ease-in-out !important;
}

.obj_galley_link:hover,
a.obj_galley_link:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.12) !important;
}

/* =======================================================
   9. TOP-RIGHT USER UTILITY LINKS & DROPDOWN CONTRAST FIX
   ======================================================= */
/* Forces your right corner dashboard links to be Navy Blue for sharp clarity against the background */
.pkp_navigation_user,
.pkp_navigation_user > li > a,
.pkp_navigation_user_wrapper > a,
#navigationUser a {
    color: #0E406A !important;       /* Clean high-contrast Deep Navy Blue text color */
    font-weight: 700 !important;     /* Bold text weighting */
    font-size: 13.5px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

/* Subtle color change when user utility links are active */
.pkp_navigation_user > li > a:hover,
#navigationUser a:hover {
    color: #1E8A86 !important;       /* Shifts to clear brand Teal on active mouse focus */
    text-decoration: underline !important;
}

/* USER DASHBOARD DROPDOWN CARD: Transforms container background to sleek clean white */
.pkp_navigation_user .dropdown-menu,
#navigationUser .dropdown-menu,
.pkp_navigation_user_wrapper .dropdown-menu {
    background-color: #ffffff !important; 
    border: 1px solid #d2dfea !important; /* Elegant light blue-gray container outline line */
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.1) !important;
    padding: 6px 0 !important;
    min-width: 200px !important;
}

/* LINKS INSIDE THE USER DROPDOWN: Clear, legible Navy font */
.pkp_navigation_user .dropdown-menu > li > a,
#navigationUser .dropdown-menu > li > a,
.pkp_navigation_user .dropdown-menu a {
    color: #0E406A !important;           /* Deep Navy text layout color */
    padding: 10px 20px !important;
    background: none !important;
    display: block !important;
    font-weight: 600 !important;
    text-align: left !important;
    text-transform: none !important;     
}

/* Soft light gray-blue highlight block background configuration on user selection */
.pkp_navigation_user .dropdown-menu > li > a:hover,
#navigationUser .dropdown-menu > li > a:hover {
    background-color: #e6eef4 !important; /* Soft clinical ice-blue highlight block background */
    color: #1E8A86 !important; /* Changes text to Teal on hover */
}

/* =======================================================
   23. CRITICAL DROPDOWN DISPLAY LAYER FIXED
   ======================================================= */
/* 1. Prevent the navigation row containers from cutting off or hiding dropdown text boxes */
.pkp_structure_head,
header,
#pkp_structure_head,
.pkp_navigation_primary_wrapper,
.navbar,
.navbar-collapse,
.nav-menu_container {
    overflow: visible !important; /* Forces hidden/cut-off dropdown containers to display completely */
}

/* 2. Push the entire navigation row area to the top layer of the layout stack */
.pkp_navigation_primary_wrapper,
.navbar,
.navbar-nav {
    position: relative !important;
    z-index: 999999 !important; /* Pushes the menu strip above the main body content area */
}

/* 3. Lock the dropdown panel menus explicitly on the highest layer visible */
.dropdown-menu,
.navbar-nav .dropdown-menu,
.navbar-default .navbar-nav .open .dropdown-menu,
.pkp_navigation_primary .dropdown-menu {
    position: absolute !important;
    z-index: 1000000 !important; /* Highest structural index value to prevent clipping */
}

/* 4. Ensure proper spacing structure so the dropdown naturally anchors under the buttons */
.navbar-nav > li {
    position: relative !important;
}
/* =======================================================
   24. CONSOLIDATED MOBILE DEVICE RESPONSIVE QUERIES
   ======================================================= */
@media (max-width: 991px) {
    /* 1. FORCE EXTENDED MIN-HEIGHT: Prevents clipping and lets the full banner expand safely */
    header,
    .pkp_structure_head,
    #pkp_structure_head,
    header[role="banner"] {
        background-color: #f0f4f8 !important; /* Changed from old green to clean medical cool gray */
        background-image: none !important;
        display: block !important;
        visibility: visible !important;
        position: relative !important;
        width: 100% !important;
        height: auto !important;
        min-height: 180px !important;  /* FIXED: Increased from 120px to 180px to stop vertical truncation */
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;   /* CRITICAL: Disables the system from cutting off the logo image */
    }

    /* 2. Rescues the mobile logo container element layout window from collapsing */
    .pkp_site_name_wrapper,
    .pkp_site_name,
    .is_img {
        padding: 20px 10px 15px 10px !important; 
        background: transparent !important;
        display: block !important;
        visibility: visible !important;
        float: none !important;
        margin: 0 auto !important;
        height: auto !important;
        min-height: unset !important;
        max-height: unset !important;
        overflow: visible !important;   /* CRITICAL: Overrides theme clipping frames */
        text-align: center !important; 
    }

    /* 3. FLUID ASPECT RATIO RESET: Instructs the browser to render the full file smoothly */
    .pkp_site_name_wrapper img,
    header img,
    #pkp_structure_head img,
    .pkp_site_name a img,
    .pkp_site_name .is_img img {
        width: 100% !important;         /* Tells the banner to size down matching smaller device viewports */
        max-width: 480px !important;     /* Restricts wide desktop blow up sizing paths on tablets */
        height: auto !important;         /* CRITICAL: Calculates height dynamically based on file pixels */
        max-height: unset !important;    /* FIXED: Erases absolute restrictions cutting your file text in half */
        min-height: unset !important;
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        margin: 0 auto !important; 
        object-fit: contain !important;  /* Strict protection parameter guarding circle emblem layouts */
        aspect-ratio: auto !important;   /* Tells browser engine to look at actual file asset size */
        filter: none !important; 
    }

    /* 4. Content body column collapsing stack fixes */
    .pkp_structure_main,
    #main-content,
    .col-md-9.pkp_structure_main {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 100% !important;
        float: none !important;
        display: block !important;
        padding-left: 15px !important;
        padding-right: 15px !important;
    }

    .pkp_structure_sidebar,
    .sidebar,
    #sidebar,
    .col-md-3.pkp_structure_sidebar {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 100% !important;
        float: none !important;
        display: block !important;
        margin-top: 30px !important;
        padding-left: 15px !important;
        padding-right: 15px !important;
    }

    /* 5. Mobile utility navigation stack parameters */
    .pkp_navigation_user,
    .pkp_navigation_user_wrapper,
    #navigationUser {
        position: relative !important;
        float: none !important;
        display: block !important;
        text-align: center !important;
        margin: 10px auto !important;
        clear: both !important;
        width: 100% !important;
    }

    .pkp_navigation_user a,
    .pkp_navigation_user li a,
    #navigationUser a {
        color: #0E406A !important; /* Changed from white to high-contrast Deep Navy Blue for mobile menus */
        font-weight: bold !important;
    }

    .pkp_navigation_primary_wrapper,
    .navbar,
    .navbar-header,
    .navbar-collapse {
        clear: both !important;
        position: relative !important;
        margin-top: 0 !important;
        background-color: #ffffff !important; 
    }
}

/* =======================================================
   25. COMPREHENSIVE MOBILE RECOVERY & COLLAPSE REPAIR
   ======================================================= */
@media (max-width: 1199px) {
    /* 1. Force the main body page row to act as a vertical column list */
    .pkp_structure_body .row,
    .pkp_structure_body .container,
    .page,
    main {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    /* 2. Forces the central text block to span full width cleanly */
    .pkp_structure_main,
    #main-content,
    .col-md-9.pkp_structure_main,
    div[role="main"] {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 100% !important;
        float: none !important;
        display: block !important;
        padding-left: 15px !important;
        padding-right: 15px !important;
        order: 1 !important; /* Forces text content to stay at the top */
    }

    /* 3. Forces the sidebar blocks to stack entirely beneath the main content text */
    .pkp_structure_sidebar,
    .sidebar,
    #sidebar,
    .col-md-3.pkp_structure_sidebar,
    aside {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 100% !important;
        float: none !important;
        display: block !important;
        margin-top: 25px !important; /* Creates a clean vertical gap between text and sidebar */
        padding-left: 15px !important;
        padding-right: 15px !important;
        order: 2 !important; /* Pushes sidebar cards below everything else */
    }

    /* 4. Keeps sidebar inner cards from running off screen edges */
    .custom-sidebar-card,
    .pkp_structure_sidebar .block,
    .sidebar .block,
    div[id*="customblock"] {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        display: block !important;
    }

    /* 5. Clean layout flow alignment for navigation containers */
    .navbar-collapse,
    .pkp_navigation_primary_wrapper,
    .navbar-header {
        width: 100% !important;
        float: none !important;
        clear: both !important;
    }
}
<div class="custom-sidebar-card" style="background-color: #ffffff; border: 1px solid #C6E2E0; border-radius: 6px; overflow: hidden; box-shadow: 0 4px 10px rgba(30, 138, 134, 0.03); width: 100%; margin-bottom: 15px; box-sizing: border-box; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;">
  
  <!-- Sidebar Card Header Banner Line -->
  <div style="background-color: #0E406A; border-bottom: 3px solid #1E8A86; padding: 12px 15px;">
    <h4 style="color: #ffffff; margin: 0; padding: 0; font-size: 13px; font-weight: bold; text-transform: uppercase; letter-spacing: 0.5px;">
      Indexing &amp; Recognition
    </h4>
  </div>

  <!-- Sidebar Card Inner Content Body -->
  <div class="content" style="padding: 15px; font-size: 12.5px; line-height: 1.6; color: #2C3E50;">
    <p style="margin: 0 0 10px 0;">The journal is actively indexed and archived across elite multidisciplinary repository networks:</p>
    
    <!-- Custom Teal Solid Callout Strip Block (Like the ISSN badge) -->
    <div style="background-color: #1E8A86; color: #ffffff; text-align: center; font-weight: bold; padding: 8px; border-radius: 4px; margin-bottom: 12px; font-size: 12px; letter-spacing: 0.5px;">
      ISSN Portal Verified: <span style="color: #ffffff;">3136-4454</span>
    </div>

    <!-- Meta Attribute Text String Links List -->
    <ul style="list-style: none; padding: 0; margin: 0;">
      <li style="margin-bottom: 6px; padding-bottom: 6px; border-bottom: 1px dashed #E2E8F0;">
        <strong style="color: #0E406A;">Status:</strong> <a href="https://jmmhr.org" style="color: #1E8A86; text-decoration: none; font-weight: 600;">Fully Open Access</a>
      </li>
      <li style="margin-bottom: 6px; padding-bottom: 6px; border-bottom: 1px dashed #E2E8F0;">
        <strong style="color: #0E406A;">Preservation:</strong> PKP PN LOCKSS Engine
      </li>
      <li style="margin-bottom: 0;">
        <strong style="color: #0E406A;">Publisher:</strong> <a href="https://msarinstitute.org" target="_blank" rel="noopener" style="color: #1E8A86; text-decoration: none; font-weight: 600;">MSAR Institute Network</a>
      </li>
    </ul>
  </div>

</div>
