/* =========================================================
   IMBS LAYOUT FIX ONLY (NO HERO/WAVE CHANGES)
   Fixes:
   - Right-side blank space / horizontal overflow
   - Inner pages cut content
   - Sidebar pushed out
   - Footer causing overflow
   ========================================================= */

/* Global safety */
*,
*::before,
*::after { box-sizing: border-box; }

html, body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden !important;
}

/* ---------- MAIN WRAPPER (content + sidebar) ---------- */
.imbs-wrap {
  width: 100% !important;
  max-width: 1320px !important;   /* you can set 1400 if you want */
  margin: 0 auto !important;
  padding: 0 24px !important;
}

.imbs-layout {
  display: flex !important;
  align-items: flex-start !important;
  gap: 32px !important;
  width: 100% !important;
}

.imbs-content {
  flex: 1 1 auto !important;
  min-width: 0 !important; /* CRITICAL: prevents sidebar pushing page wider */
}

.imbs-sidebar {
  flex: 0 0 360px !important;
  width: 360px !important;
  max-width: 360px !important;
}

/* ---------- INNER PAGES CUT FIX ---------- */
/* OJS puts .container inside content; don’t let it shrink/cut */
.imbs-content .container,
.imbs-content .container-fluid,
.imbs-content .page,
.imbs-content .pkp_structure_content,
.imbs-content .pkp_page_content {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Wide tables/images safe */
.imbs-content img { max-width: 100% !important; height: auto !important; }
.imbs-content table { max-width: 100% !important; display: block; overflow-x: auto; }

/* ---------- FOOTER OVERFLOW FIX ---------- */
/* If any footer element uses 100vw, it causes horizontal overflow */
footer,
.footer,
.custom-footer,
.footer-bottom,
.pkp_structure_footer_wrapper,
.pkp_structure_footer {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
}

/* ---------- MOBILE ---------- */
@media (max-width: 991px) {
  .imbs-wrap { padding: 0 16px !important; }
  .imbs-layout { flex-direction: column !important; gap: 18px !important; }
  .imbs-sidebar { width: 100% !important; max-width: 100% !important; flex: 0 0 auto !important; }
}
/* ---------- 1) TOP MENU BAR (dark) ---------- */
#header.fixed-top,
#header.header-scrolled,
#header.scrolled,
#header.sticky{
  background: #0e1a2b !important;
  box-shadow: 0 2px 10px rgba(0,0,0,.35);
}

#header .nav-link,
#header .navbar-brand,
#header i{
  color: #fff !important;
  font-weight: 600;
}

#header .nav-link:hover,
#header i:hover{ opacity: .85; }

#header .dropdown-toggle::after{ border-top-color: #fff !important; }

#header .dropdown-menu{
  background: #fff !important;
  border: 1px solid rgba(0,0,0,.12) !important;
  box-shadow: 0 12px 30px rgba(0,0,0,.12);
}

#header .dropdown-menu .dropdown-item{
  color: #0e1a2b !important;
  font-weight: 600;
}

#header .dropdown-menu .dropdown-item:hover{
  background: #eef4ff !important;
}

/* =========================================================
   SIDEBAR: make EVERY item look like a bordered block/card
   - Works for pkp_block (with/without titles)
   - Works for single <li><a> items (e.g., "Make a Submission")
   ========================================================= */

.imbs-sidebar ._pkp_structure_sidebar{
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ALL sidebar children become card containers */
.imbs-sidebar ._pkp_structure_sidebar > li,
.imbs-sidebar .pkp_block{
  background: #fff !important;
  border: 1px solid rgba(0,0,0,.10) !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  margin: 0 0 18px 0 !important;
  box-shadow: 0 10px 22px rgba(0,0,0,.06) !important;
}

/* Plain single link (<li><a>..</a>) becomes a normal card row */
.imbs-sidebar ._pkp_structure_sidebar > li > a{
  display: block !important;
  padding: 12px 14px !important;
  margin: 0 !important;
  background: transparent !important; /* IMPORTANT: removes dark full-fill */
  color: #0e1a2b !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}
.imbs-sidebar ._pkp_structure_sidebar > li > a:hover{
  background: #f3f6ff !important;
  text-decoration: none !important;
}

/* Title bar smaller */
.imbs-sidebar .pkp_block .title{
  background: #0e1a2b !important;
  color: #fff !important;
  padding: 10px 14px !important;
  margin: 0 !important;
  border: none !important;
  font-size: 16px !important;   /* reduced */
  line-height: 1.25 !important;
  font-weight: 800 !important;
}

/* Content font smaller & consistent */
.imbs-sidebar .pkp_block .content{
  padding: 12px 14px !important;
  color: #111 !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
}

/* Links inside content */
.imbs-sidebar .pkp_block .content a,
.imbs-sidebar a{
  color: #0e1a2b !important;
  font-weight: 600 !important;
}
.imbs-sidebar .pkp_block .content a:hover,
.imbs-sidebar a:hover{
  text-decoration: underline !important;
}

/* =========================================================
   FIX: Sidebar single-item showing as bullet
   (removes marker + styles ANY sidebar list item as a card)
   ========================================================= */

/* Remove bullets/markers everywhere inside sidebar */
.imbs-sidebar ul,
.imbs-sidebar ol{
  list-style: none !important;
  padding-left: 0 !important;
  margin-left: 0 !important;
}

/* Modern marker removal (works even if list-style gets re-added) */
.imbs-sidebar li::marker{ content: "" !important; }

/* Make any direct sidebar list item look like a card */
.imbs-sidebar li{
  list-style: none !important;
}

/* If "Make a Submission" is a plain <li><a>..</a></li> anywhere in sidebar */
.imbs-sidebar li > a{
  display: block !important;
  padding: 12px 14px !important;
  border: 1px solid rgba(0,0,0,.10) !important;
  border-radius: 14px !important;
  background: #fff !important;
  box-shadow: 0 10px 22px rgba(0,0,0,.06) !important;
  color: #0e1a2b !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  margin: 0 0 18px 0 !important;
}

.imbs-sidebar li > a:hover{
  background: #f3f6ff !important;
}

/* =========================================================
   BROWSE BLOCK – make it a normal sidebar card, not dropdown
   ========================================================= */
.imbs-sidebar .dropdown { width: 100% !important; }

.imbs-sidebar #dropdownBrowse{
  display: block !important;
  width: 100% !important;
  pointer-events: auto !important;
  cursor: pointer !important;

  /* match your dark block header */
  background: #0e1a2b !important;
  color: #fff !important;
  padding: 10px 14px !important;
  border-radius: 14px !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}

/* Always show the menu as content (not floating) */
.imbs-sidebar #dropdownBrowse + .dropdown-menu{
  display: block !important;
  position: static !important;
  transform: none !important;
  float: none !important;
  inset: auto !important;

  width: 100% !important;
  margin: 0 !important;
  padding: 12px 14px 14px !important;
  border: 1px solid rgba(0,0,0,.10) !important;
  border-top: none !important;
  border-radius: 0 0 14px 14px !important;
  box-shadow: 0 10px 22px rgba(0,0,0,.06) !important;
  background: #fff !important;
}

/* Remove MDB dropdown show/hide effects */
.imbs-sidebar .dropdown-menu.show{ display:block !important; }

/* Categories label */
.imbs-sidebar #dropdownBrowse + .dropdown-menu > li{
  font-weight: 700 !important;
  margin: 0 0 10px 0 !important;
  color: #111 !important;
}

/* reset lists */
.imbs-sidebar #dropdownBrowse + .dropdown-menu ul{
  list-style: none !important;
  padding: 0 !important;
  margin: 10px 0 0 0 !important;
}
/* category buttons */
.imbs-sidebar #dropdownBrowse + .dropdown-menu ul > li > a{
  display: block !important;
  padding: 10px 12px !important;
  margin: 10px 0 !important;
  background: #fff !important;
  border: 1px solid rgba(0,0,0,.10) !important;
  border-radius: 12px !important;
  color: #0e1a2b !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}
.imbs-sidebar #dropdownBrowse + .dropdown-menu ul > li > a:hover{
  background: #f3f6ff !important;
}
/* Remove the bootstrap/MDB caret arrow from Browse button */
.imbs-sidebar #dropdownBrowse.dropdown-toggle::after,
.imbs-sidebar #dropdownBrowse::after {
  display: none !important;
  content: none !important;
}

/* If the theme adds an icon inside the Browse link */
.imbs-sidebar #dropdownBrowse i,
.imbs-sidebar #dropdownBrowse .caret,
.imbs-sidebar #dropdownBrowse .dropdown-caret {
  display: none !important;
}


/* =========================================================
   BROWSE block: make it look like the other sidebar cards
   (because it's a raw <li><div class="dropdown">...</div></li>)
   ========================================================= */

/* Make the Browse wrapper behave like other card blocks + add the missing gap */
.imbs-sidebar > li:has(#dropdownBrowse),
.imbs-sidebar li > .dropdown:has(#dropdownBrowse){
  background: #fff !important;
  border: 1px solid rgba(0,0,0,.10) !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  margin: 0 0 18px 0 !important;   /* <-- fixes gap to next block */
  box-shadow: 0 10px 22px rgba(0,0,0,.06) !important;
}

/* Make Browse header strip match other block titles */
.imbs-sidebar #dropdownBrowse{
  display: block !important;
  background: #0e1a2b !important;
  color: #fff !important;
  padding: 10px 14px !important;
  font-size: 16px !important;
  line-height: 1.25 !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  border-radius: 0 !important;
  margin: 0 !important;
}

/* Browse content area typography = same as pkp_block content */
.imbs-sidebar #dropdownBrowse + .dropdown-menu{
  position: static !important;      /* keep it inside card */
  float: none !important;
  display: block !important;        /* always visible */
  width: 100% !important;
  margin: 0 !important;
  padding: 12px 14px !important;
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;

  font-size: 14px !important;       /* <-- fixes font mismatch */
  line-height: 1.5 !important;
  color: #111 !important;
  font-family: inherit !important;  /* <-- uses same font as other blocks */
}

/* Optional: make "Categories" heading align with your card styles */
.imbs-sidebar #dropdownBrowse + .dropdown-menu > li{
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Ensure links inside browse look like other sidebar links */
.imbs-sidebar #dropdownBrowse + .dropdown-menu a{
  color: #0e1a2b !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}
.imbs-sidebar #dropdownBrowse + .dropdown-menu a:hover{
  text-decoration: underline !important;
}

/* ---------- 5) FOOTER (match your snapshot) ---------- */
.footer,
.pkp_structure_footer_wrapper,
.pkp_structure_footer{
  background: #0e1a2b !important;
  color: #fff !important;
  width: 100%;
  margin: 0;
  padding: 0;
}

/* Container inside footer */
.footer .container{
  max-width: 1320px;
  margin: 0 auto;
  padding: 34px 24px 18px;
}

/* 4-column layout like screenshot */
.custom-footer .footer-container{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 28px;
}

.custom-footer h3{
  color: #fff !important;
  font-weight: 600;
  margin-bottom: 12px;
}

.custom-footer p,
.custom-footer li,
.custom-footer a{
  color: rgba(255,255,255,.88) !important;
  font-weight: 500;
}

.custom-footer ul{
  padding-left: 0;
  list-style: none;
  margin: 0;
}

.custom-footer li{ margin: 10px 0; }

.custom-footer a:hover{
  color: #fff !important;
  text-decoration: underline;
}

/* Icon buttons on the right column */
.footer-icons{
  display: grid;
  grid-template-columns: repeat(3, 64px);
  gap: 14px;
  align-items: center;
}
.footer-icon{
  width: 64px;
  height: 64px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: rgba(255,255,255,.16);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.10);
}
.footer-icon img{
  width: 30px;
  height: 30px;
}

/* Remove background from copyright/footer bottom strip */
.pkp_structure_footer_wrapper,
.pkp_structure_footer,
.footer-bottom,
.pkp_footer_content,
#pkpFooter,
.pkp_site_footer {
    background: none !important;
    box-shadow: none !important;
    border: none !important;
}

/* Style copyright text cleanly */
.pkp_structure_footer_wrapper .pkp_footer_content,
.footer-bottom,
.pkp_site_footer {
    text-align: center !important;
    padding: 20px 0 !important;
    color: #ffffff !important; /* white text for dark footer */
    font-size: 16px !important;
}


/* ---------- 6) Mobile ---------- */
@media (max-width: 991px){
  .imbs-wrap{ padding: 14px 16px 28px; }
  .imbs-layout{ flex-direction: column; gap: 18px; }
  .imbs-sidebar{ width: 100%; max-width: 100%; }

  .custom-footer .footer-container{
    grid-template-columns: 1fr;
  }
  .footer-icons{
    grid-template-columns: repeat(3, 60px);
  }
}
/* =========================================================
   FORCE JUSTIFIED TEXT for Abstract + Author Bio (Article page)
   (Editor preview uses different CSS; theme overrides on frontend)
   ========================================================= */

.pkp_page_article .obj_article_details .abstract p,
.pkp_page_article .obj_article_details .item.abstract p,
.pkp_page_article .obj_article_details .author_bios p,
.pkp_page_article .obj_article_details .item.authorBio p,
.pkp_page_article .obj_article_details .item p {
  text-align: justify !important;
  text-justify: inter-word;
  hyphens: auto;
}

/* If an image is causing weird whitespace/wrapping in bio */
.pkp_page_article .obj_article_details .author_bios img,
.pkp_page_article .obj_article_details .item.authorBio img {
  float: none !important;
  display: block !important;
  margin: 0 auto 14px auto !important;
  max-width: 100% !important;
  height: auto !important;
}
/* =========================================================
   REMOVE PUBLICATION DATES (Issues + Articles)
   ========================================================= */

/* Article View Page */
.pkp_page_article .published,
.pkp_page_article .pub-date,
.pkp_page_article .item.published,
.pkp_page_article .item.published .value,
.pkp_page_article .sub_item.published,
.obj_article_details .published {
    display: none !important;
}

/* Issue Table of Contents (Issue Page) */
.pkp_page_issue .published,
.pkp_page_issue .pub-date,
.pkp_page_issue .item.published,
.pkp_page_issue .item.published .value,
.obj_issue_toc .published {
    display: none !important;
}

/* General — catch any theme variations */
.published, .pub-date, .publication-date {
    display: none !important;
}