/* JMEDICA 39 — Reduced gap above full-width community banner. Previous Version 38 retained. */
/* JMEDICA 40 - COMPLETE STYLESHEET | VERSION 39 plus final banner gap correction */
/* JMEDICA 38 - FULL STYLESHEET | ALL VERSION 37 RULES PRESERVED */
/* JMEDICA VERSION 35R — COMPLETE CSS (responsive sidebar alignment) */
/* =========================================
   JMEDICA — COMPLETE WEBSITE STYLESHEET
   Header, Layout and Editorial Masthead
   ========================================= */


/* 1. DESKTOP HEADER */

@media (min-width: 768px) {

  .pkp_site_name_wrapper .pkp_site_name,
  .pkp_site_name {
    max-width: none;
  }

  .pkp_site_name .is_img img,
  .pkp_site_name img {
    width: min(780px, 78vw) !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: 140px !important;
    object-fit: contain;
  }
}


/* 2. MOBILE HEADER */

@media (max-width: 767px) {

  .pkp_site_name_wrapper,
  .pkp_site_name,
  .pkp_site_name .is_img {
    height: auto !important;
    min-height: 0 !important;
    max-height: 60px !important;
  }

  .pkp_site_name .is_img img,
  .pkp_site_name img {
    display: block !important;
    width: auto !important;
    max-width: min(220px, 58vw) !important;
    height: auto !important;
    max-height: 42px !important;
    object-fit: contain !important;
  }
}


/* 3. WIDER DESKTOP WEBSITE LAYOUT */

@media (min-width: 992px) {

  .pkp_structure_page {
    max-width: 1440px;
    width: calc(100% - 48px);
    margin-left: auto;
    margin-right: auto;
  }

  .pkp_structure_content {
    max-width: none;
    width: 100%;
  }

  .pkp_structure_main {
    min-width: 0;
  }

  .pkp_page_index .homepage_image img,
  .pkp_page_index .additional_content img,
  .pkp_page_index .homepage_about img {
    max-width: 100%;
    height: auto;
  }
}


/* 4. EDITORIAL MASTHEAD
   Clean section headings and member spacing */

.pkp_page_about .cmp_editors,
.pkp_page_about .cmp_masthead {
  line-height: 1.7;
}

.pkp_page_about .cmp_editors h2,
.pkp_page_about .cmp_editors h3,
.pkp_page_about .cmp_masthead h2,
.pkp_page_about .cmp_masthead h3 {
  color: #19395e;
  font-weight: 700;
  border-bottom: 2px solid #c5a052;
  padding-bottom: 9px;
  margin-top: 28px;
  margin-bottom: 14px;
}

.pkp_page_about .cmp_editors li,
.pkp_page_about .cmp_masthead li {
  margin-bottom: 12px;
  padding-left: 4px;
}

.pkp_page_about .cmp_editors ul,
.pkp_page_about .cmp_masthead ul {
  list-style-type: disc;
  padding-left: 25px;
}


/* 5. MASTHEAD MEMBER NAMES */

.pkp_page_about .cmp_editors li strong,
.pkp_page_about .cmp_masthead li strong {
  color: #19395e;
  font-weight: 600;
}


/* 6. RESPONSIVE EDITORIAL CONTENT */

@media (max-width: 767px) {

  .pkp_page_about .cmp_editors,
  .pkp_page_about .cmp_masthead {
    font-size: 15px;
    line-height: 1.7;
  }

  .pkp_page_about .cmp_editors ul,
  .pkp_page_about .cmp_masthead ul {
    padding-left: 20px;
  }
}

/* =========================================
   7. JMEDICA — OJS 3.5 EDITORIAL MASTHEAD
   Scoped to the public Editorial Masthead page.
   Keeps OJS appointment records unchanged.
   ========================================= */

/* Hide public appointment start/end dates, e.g. 2026–.
   The live HTML uses <span class="date_start"> inside .user_listing. */
.page_masthead .user_listing .date_start,
.page_masthead .user_listing .date_end {
  display: none !important;
}

/* Editorial role headings: navy with a restrained gold underline. */
.page_masthead h2 {
  color: #19395e;
  font-weight: 700;
  border-bottom: 2px solid #c5a052;
  padding-bottom: 8px;
  margin: 28px 0 14px;
}

/* Create readable, properly indented editorial-member lists. */
.page_masthead .user_listing {
  list-style: disc outside !important;
  padding-left: 26px !important;
  margin: 0 0 20px;
}
.page_masthead .user_listing > li {
  display: list-item !important;
  list-style-type: disc !important;
  margin: 0 0 14px;
  padding-left: 5px;
  line-height: 1.6;
}
.page_masthead .user_listing .name {
  color: #19395e;
  font-weight: 600;
}

@media (max-width: 767px) {
  .page_masthead .user_listing {
    padding-left: 22px !important;
  }
  .page_masthead .user_listing > li {
    margin-bottom: 12px;
  }
}

/* =========================================
   8. TEMPORARY: ASAD NOOR MIRZA AFFILIATION
   The second masthead role is Senior Journal Editor,
   and its first member is currently Asad Noor Mirza.
   Hide the incorrect profile text "Dr." on this page.
   Do not remove the correct affiliations of other roles.
   This is cosmetic, not a change to the OJS user profile.
   Remove this block once the profile is corrected.
   ========================================= */
.page_masthead > h2:nth-of-type(2) + ul.user_listing > li:first-child > span.affiliation {
  display: none !important;
}

/* ===================================================================
   9. JMEDICA HOMEPAGE: BALANCED LEFT / CENTER / RIGHT (VERSION 30)

    DESKTOP (992px and wider, responsive columns):

         LEFT                 CENTER                 RIGHT
         4. Indexing          Original homepage      3. Author Services
         2. Reader Guide                            1. Editorial Board

    This is ONE CSS GRID around the existing OJS main and sidebar.
    The existing sidebar remains in the OJS backend; `display: contents`
    allows its four blocks to occupy the two outer grid columns.

    Below 992px, normal OJS responsive layout remains unchanged.
   =================================================================== */

@media (min-width: 992px) {

  /* Three visual columns. No decorative column borders or pseudo-lines. */
  body.pkp_page_index.pkp_op_index .pkp_structure_content.has_sidebar {
    display: grid !important;
    grid-template-columns: minmax(0, min(258px, 19.5vw)) minmax(0, 1fr) minmax(0, min(258px, 19.5vw)) !important;
    /* The spare third row absorbs tall homepage content, so it does
       not create a giant gap between the two sidebar cards. */
    grid-template-rows: max-content max-content max-content minmax(0, 1fr) !important;
    column-gap: 18px !important;
    row-gap: 12px !important;
    align-items: start !important;
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
  }

  /* OJS clearfix pseudo-elements must not become extra grid children. */
  body.pkp_page_index.pkp_op_index .pkp_structure_content.has_sidebar::before,
  body.pkp_page_index.pkp_op_index .pkp_structure_content.has_sidebar::after,
  body.pkp_page_index.pkp_op_index .pkp_structure_sidebar.left::before,
  body.pkp_page_index.pkp_op_index .pkp_structure_sidebar.left::after {
    content: none !important;
    display: none !important;
  }

  /* MAIN CENTRE: original journal content, with its padding intact. */
  body.pkp_page_index.pkp_op_index .pkp_structure_content.has_sidebar > .pkp_structure_main {
    grid-column: 2 !important;
    grid-row: 1 / 5 !important;
    align-self: start !important;
    justify-self: stretch !important;
    float: none !important;
    flex: none !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  /* Let the four EXISTING OJS sidebar blocks enter the outer tracks.
     This changes only the public homepage, not admin pages or data. */
  body.pkp_page_index.pkp_op_index .pkp_structure_content.has_sidebar > .pkp_structure_sidebar.left {
    display: contents !important;
  }

  /* Reset default sidebar block gaps; preserve the gold INNER card border. */
  body.pkp_page_index.pkp_op_index .pkp_structure_sidebar.left > #customblock-jmedica-indexing-roadmap,
  body.pkp_page_index.pkp_op_index .pkp_structure_sidebar.left > #customblock-jmedica-reader-guide,
  body.pkp_page_index.pkp_op_index .pkp_structure_sidebar.left > #customblock-jmedica-author-services,
  body.pkp_page_index.pkp_op_index .pkp_structure_sidebar.left > #customblock-jmedica-editorial-board {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    float: none !important;
    box-sizing: border-box !important;
    align-self: stretch !important;
    height: 100% !important;
    overflow: visible !important;
  }

  /* LEFT: research roadmap on top, reader links immediately below. */
  body.pkp_page_index.pkp_op_index #customblock-jmedica-indexing-roadmap {
    grid-column: 1 !important;
    grid-row: 1 !important;
  }
  body.pkp_page_index.pkp_op_index #customblock-jmedica-reader-guide {
    grid-column: 1 !important;
    grid-row: 2 !important;
  }

  /* RIGHT: author services on top, editorial board immediately below. */
  body.pkp_page_index.pkp_op_index #customblock-jmedica-author-services {
    grid-column: 3 !important;
    grid-row: 1 !important;
  }
  body.pkp_page_index.pkp_op_index #customblock-jmedica-editorial-board {
    grid-column: 3 !important;
    grid-row: 2 !important;
  }

  /* Equal height within each ROW. Preserve all content and links. */
  body.pkp_page_index.pkp_op_index .pkp_structure_sidebar.left > .block_custom > .content {
    width: 100% !important;
    min-width: 0 !important;
    height: 100% !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }
  body.pkp_page_index.pkp_op_index .pkp_structure_sidebar.left > .block_custom > .content > div {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: 100% !important;
    box-sizing: border-box !important;
  }
  /* Narrow text, emails and URLs should wrap, never force horizontal scroll. */
  body.pkp_page_index.pkp_op_index .pkp_structure_sidebar.left .content {
    overflow-wrap: anywhere;
  }
}

/* ===================================================================
   10. JMEDICA HOMEPAGE — REMOVE OJS THEME DIVIDER (VERSION 31)

   OJS default theme can draw a full-height vertical rule with the
   ::after pseudo-element on .pkp_structure_main. With our custom
   left / center / right CSS grid, that legacy separator can appear
   inside the central homepage, including beside the IMPACT wording.

   Scope to the PUBLIC journal homepage only. This does not change
   the site header, banner image, grid widths, navigation, sidebar
   blocks, editorial masthead, or admin pages.
   =================================================================== */
body.pkp_page_index.pkp_op_index .pkp_structure_main::after {
  content: none !important;
  display: none !important;
  width: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
}


/* ===================================================================
   11. JMEDICA HOMEPAGE — TWO MEDICAL GREEN PANELS (VERSION 32)

   New custom blocks (create separately in OJS Custom Block Manager):
     Name: jmedica-journal-scope
     Name: jmedica-get-involved
   Turn OFF "Show Name" for both; the HTML includes its own heading.

   Version 31 divider fix above is retained UNCHANGED.
   The existing four OJS blocks and central homepage are unchanged.
   =================================================================== */

/* Keep these two supplementary panels on the journal homepage only. */
body:not(.pkp_page_index.pkp_op_index) #customblock-jmedica-journal-scope,
body:not(.pkp_page_index.pkp_op_index) #customblock-jmedica-get-involved {
  display: none !important;
}

/* Self-contained color scheme; no dependency on external fonts or icons. */
body.pkp_page_index.pkp_op_index .jmedica-green-card {
  --jmedica-green: #087D53;
  --jmedica-light: #F0FAF3;
  --jmedica-text: #214C36;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin: 0;
  border: 1px solid #C5A052;
  border-radius: 8px;
  overflow: hidden;
  box-sizing: border-box;
  background: var(--jmedica-light);
  color: var(--jmedica-text);
  font-family: inherit;
  box-shadow: 0 2px 7px rgba(14, 54, 40, 0.08);
}
body.pkp_page_index.pkp_op_index .jmedica-green-card--forest {
  --jmedica-green: #245C3B;
  --jmedica-light: #F5FAF0;
  --jmedica-text: #264A34;
}
body.pkp_page_index.pkp_op_index .jmedica-green-card__heading {
  background: var(--jmedica-green);
  color: #FFFFFF !important;
  border-bottom: 3px solid #C5A052;
  padding: 14px 12px 13px;
  text-align: center;
}
body.pkp_page_index.pkp_op_index .jmedica-green-card__title {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  color: #FFFFFF !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}
body.pkp_page_index.pkp_op_index .jmedica-green-card__subtitle {
  margin: 6px 0 0 !important;
  font-size: 11.5px !important;
  line-height: 1.45 !important;
  color: #E6F7EE !important;
}
body.pkp_page_index.pkp_op_index .jmedica-green-card__body {
  padding: 12px 13px 14px;
  background: var(--jmedica-light);
}
body.pkp_page_index.pkp_op_index .jmedica-green-card__list {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
body.pkp_page_index.pkp_op_index .jmedica-green-card__list li {
  margin: 0 !important;
  padding: 9px 0 9px 19px !important;
  position: relative;
  font-size: 13px !important;
  line-height: 1.45 !important;
  color: var(--jmedica-text) !important;
  border-bottom: 1px solid rgba(34, 94, 60, 0.15);
  list-style: none !important;
}
body.pkp_page_index.pkp_op_index .jmedica-green-card__list li:last-child {
  border-bottom: 0;
}
body.pkp_page_index.pkp_op_index .jmedica-green-card__list li::before {
  content: "\2713";
  position: absolute;
  left: 0;
  top: 9px;
  color: var(--jmedica-green);
  font-weight: 700;
}
body.pkp_page_index.pkp_op_index .jmedica-green-card__list strong {
  color: var(--jmedica-text) !important;
  font-weight: 700 !important;
}
body.pkp_page_index.pkp_op_index .jmedica-green-card__note {
  margin: 8px 0 0 !important;
  font-size: 11px !important;
  line-height: 1.5 !important;
  color: #4A6857 !important;
  text-align: center;
}
body.pkp_page_index.pkp_op_index .jmedica-green-card__contact {
  display: block;
  margin: 13px 0 0;
  padding: 10px 8px;
  border-radius: 5px;
  background: var(--jmedica-green);
  color: #FFFFFF !important;
  text-align: center;
  text-decoration: none !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
}
body.pkp_page_index.pkp_op_index .jmedica-green-card__contact:hover,
body.pkp_page_index.pkp_op_index .jmedica-green-card__contact:focus {
  background: #163E29;
  color: #FFFFFF !important;
  text-decoration: underline !important;
}
body.pkp_page_index.pkp_op_index .jmedica-green-card__contact:focus-visible {
  outline: 2px solid #C5A052;
  outline-offset: 3px;
}

@media (min-width: 992px) {
  /* These are the two NEW grid children: third row, one on each side. */
  body.pkp_page_index.pkp_op_index .pkp_structure_sidebar.left > #customblock-jmedica-journal-scope,
  body.pkp_page_index.pkp_op_index .pkp_structure_sidebar.left > #customblock-jmedica-get-involved {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    float: none !important;
    box-sizing: border-box !important;
    align-self: start !important;
    overflow: visible !important;
  }
  body.pkp_page_index.pkp_op_index #customblock-jmedica-journal-scope {
    grid-column: 1 !important;
    grid-row: 3 !important;
  }
  body.pkp_page_index.pkp_op_index #customblock-jmedica-get-involved {
    grid-column: 3 !important;
    grid-row: 3 !important;
  }
  /* Let each added card size naturally; avoids stretching into empty space. */
  body.pkp_page_index.pkp_op_index .pkp_structure_sidebar.left > #customblock-jmedica-journal-scope > .content,
  body.pkp_page_index.pkp_op_index .pkp_structure_sidebar.left > #customblock-jmedica-get-involved > .content,
  body.pkp_page_index.pkp_op_index .pkp_structure_sidebar.left > #customblock-jmedica-journal-scope > .content > div,
  body.pkp_page_index.pkp_op_index .pkp_structure_sidebar.left > #customblock-jmedica-get-involved > .content > div {
    height: auto !important;
    min-height: 0 !important;
  }
}

/* At narrow widths, blocks follow the theme's normal responsive sidebar. */
@media (max-width: 767px) {
  body.pkp_page_index.pkp_op_index .jmedica-green-card__heading {
    padding: 13px 12px;
  }
  body.pkp_page_index.pkp_op_index .jmedica-green-card__body {
    padding: 12px;
  }
}


/* ===================================================================
   12. JMEDICA HOMEPAGE — TWO COMPACT WALNUT-BROWN CARDS (VERSION 33)

   New Custom Block Manager names:
     jmedica-publication-formats  (LEFT, below emerald Journal Scope)
     jmedica-founding-issue       (RIGHT, below forest Get Involved)

   Preserve the Version 31 separator fix and ALL Version 32 styling.
   On desktop the homepage main column spans 4 rows; the bottom row
   absorbs remaining page height without separating the brown cards
   from the green panels. No new vertical lines are introduced.
   =================================================================== */

/* New cards are limited to the public homepage, matching the green panels. */
body:not(.pkp_page_index.pkp_op_index) #customblock-jmedica-publication-formats,
body:not(.pkp_page_index.pkp_op_index) #customblock-jmedica-founding-issue {
  display: none !important;
}

/* Palette: matching walnut headers, parchment backgrounds, antique gold trim. */
body.pkp_page_index.pkp_op_index .jmedica-brown-card {
  --jb-brown: #704A35;
  --jb-ink: #493426;
  --jb-cream: #FBF7F0;
  --jb-gold: #C5A052;
  display: flex;
  flex-direction: column;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  margin: 0;
  border: 1px solid var(--jb-gold);
  border-radius: 8px;
  box-sizing: border-box;
  background: var(--jb-cream);
  color: var(--jb-ink);
  overflow: hidden;
  box-shadow: 0 2px 7px rgba(73, 52, 38, 0.08);
}
body.pkp_page_index.pkp_op_index .jmedica-brown-card__heading {
  padding: 12px 11px 11px;
  background: var(--jb-brown);
  border-bottom: 3px solid var(--jb-gold);
  color: #FFFDF9;
  text-align: center;
}
body.pkp_page_index.pkp_op_index .jmedica-brown-card__title {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  color: #FFFFFF !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}
body.pkp_page_index.pkp_op_index .jmedica-brown-card__subtitle {
  margin: 5px 0 0 !important;
  color: #F4E4CE !important;
  font-size: 11px !important;
  line-height: 1.35 !important;
}
body.pkp_page_index.pkp_op_index .jmedica-brown-card__body {
  flex: 1 1 auto;
  padding: 11px 12px 12px;
  color: var(--jb-ink);
  background: var(--jb-cream);
}
body.pkp_page_index.pkp_op_index .jmedica-brown-card__list {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
body.pkp_page_index.pkp_op_index .jmedica-brown-card__list li {
  margin: 0 !important;
  padding: 7px 0 7px 14px !important;
  position: relative;
  color: var(--jb-ink) !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
  border-bottom: 1px solid #E8DDCE;
  list-style: none !important;
}
body.pkp_page_index.pkp_op_index .jmedica-brown-card__list li:last-child {
  border-bottom: 0;
}
body.pkp_page_index.pkp_op_index .jmedica-brown-card__list li::before {
  content: "\2022";
  position: absolute;
  left: 1px;
  top: 6px;
  color: #99764E;
  font-size: 17px;
  line-height: 1;
}
body.pkp_page_index.pkp_op_index .jmedica-brown-card__list strong {
  color: var(--jb-ink) !important;
  font-weight: 650 !important;
}
body.pkp_page_index.pkp_op_index .jmedica-brown-card__status {
  margin: 2px 0 9px !important;
  padding: 9px 8px;
  border-radius: 5px;
  color: var(--jb-ink) !important;
  background: #F1E8D8;
  text-align: center;
  font-size: 13px !important;
  font-weight: 700 !important;
}
body.pkp_page_index.pkp_op_index .jmedica-brown-card__text {
  margin: 0 0 9px !important;
  color: var(--jb-ink) !important;
  font-size: 12px !important;
  line-height: 1.5 !important;
  text-align: center;
}
body.pkp_page_index.pkp_op_index .jmedica-brown-card__note {
  margin: 9px 0 0 !important;
  padding-top: 9px;
  border-top: 1px solid #E8DDCE;
  color: #735D4D !important;
  font-size: 10.5px !important;
  line-height: 1.45 !important;
  text-align: center;
}

@media (min-width: 992px) {
  /* Make both block wrappers real fourth-row grid children. */
  body.pkp_page_index.pkp_op_index .pkp_structure_sidebar.left > #customblock-jmedica-publication-formats,
  body.pkp_page_index.pkp_op_index .pkp_structure_sidebar.left > #customblock-jmedica-founding-issue {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    float: none !important;
    box-sizing: border-box !important;
    overflow: visible !important;
    align-self: start !important;
    height: auto !important;
  }
  body.pkp_page_index.pkp_op_index #customblock-jmedica-publication-formats {
    grid-column: 1 !important;
    grid-row: 4 !important;
  }
  body.pkp_page_index.pkp_op_index #customblock-jmedica-founding-issue {
    grid-column: 3 !important;
    grid-row: 4 !important;
  }
  /* Do not inherit full-height rules from OJS or the original four blocks. */
  body.pkp_page_index.pkp_op_index .pkp_structure_sidebar.left > #customblock-jmedica-publication-formats > .content,
  body.pkp_page_index.pkp_op_index .pkp_structure_sidebar.left > #customblock-jmedica-founding-issue > .content,
  body.pkp_page_index.pkp_op_index .pkp_structure_sidebar.left > #customblock-jmedica-publication-formats > .content > div,
  body.pkp_page_index.pkp_op_index .pkp_structure_sidebar.left > #customblock-jmedica-founding-issue > .content > div {
    height: auto !important;
    min-height: 0 !important;
    box-sizing: border-box !important;
  }
}

@media (max-width: 767px) {
  body.pkp_page_index.pkp_op_index .jmedica-brown-card__heading {
    padding: 12px;
  }
  body.pkp_page_index.pkp_op_index .jmedica-brown-card__body {
    padding: 12px;
  }
}


/* ===================================================================
   13. JMEDICA HOMEPAGE — MATCH BOTTOM CARD WIDTHS (VERSION 34)

   Both brown cards must occupy the same responsive desktop grid tracks
   as the green panels above them. This does not modify any journal
   content, sidebar links, the center column or the Version 31 fix.
   =================================================================== */
@media (min-width: 992px) {
  body.pkp_page_index.pkp_op_index .pkp_structure_sidebar.left > #customblock-jmedica-publication-formats,
  body.pkp_page_index.pkp_op_index .pkp_structure_sidebar.left > #customblock-jmedica-founding-issue {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    justify-self: stretch !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }
  body.pkp_page_index.pkp_op_index #customblock-jmedica-publication-formats > .content,
  body.pkp_page_index.pkp_op_index #customblock-jmedica-founding-issue > .content,
  body.pkp_page_index.pkp_op_index #customblock-jmedica-publication-formats > .content > *,
  body.pkp_page_index.pkp_op_index #customblock-jmedica-founding-issue > .content > *,
  body.pkp_page_index.pkp_op_index #customblock-jmedica-publication-formats .jmedica-brown-card,
  body.pkp_page_index.pkp_op_index #customblock-jmedica-founding-issue .jmedica-brown-card {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }
}


/* ===================================================================
   14. VERSION 35 — FOUNDING ISSUE (BOTTOM RIGHT) ONLY

   Corrects a centered/narrow inner wrapper as well as the card itself,
   even when OJS adds an extra div/p around a Custom Block. Match the
   desktop right-hand sidebar above; do not touch the left brown card,
   green cards, central content, header or the Version 31 divider fix.
   =================================================================== */

@media (min-width: 992px) {
  /* Match either the standard OJS ID or the actual custom block by
     detecting the unique Founding Issue card within it. */
  body.pkp_page_index.pkp_op_index .pkp_structure_sidebar.left > #customblock-jmedica-founding-issue,
  body.pkp_page_index.pkp_op_index .pkp_structure_sidebar.left > .block_custom:has(.jmedica-brown-card--issue) {
    grid-column: 3 !important;
    grid-row: 4 !important;
    justify-self: stretch !important;
    align-self: start !important;
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    float: none !important;
    box-sizing: border-box !important;
  }

  /* Fix additional containers produced by the OJS rich-text editor.
     This is the important difference from Version 34: it corrects
     NESTED wrappers, not just the direct .content child. */
  body.pkp_page_index.pkp_op_index .pkp_structure_sidebar.left > .block_custom:has(.jmedica-brown-card--issue) .content,
  body.pkp_page_index.pkp_op_index .pkp_structure_sidebar.left > .block_custom:has(.jmedica-brown-card--issue) .content :is(div, p, section, figure):has(.jmedica-brown-card--issue) {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    box-sizing: border-box !important;
  }

  /* The actual visible right-hand card: same width and outer margins
     as the green card directly above. The minimum height is chosen
     to match the natural height of the left Publication Formats card
     at the full desktop column size; the 35R minimum is coordinated. */
  body.pkp_page_index.pkp_op_index .pkp_structure_sidebar.left .jmedica-brown-card--issue {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 261px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }
  body.pkp_page_index.pkp_op_index .pkp_structure_sidebar.left .jmedica-brown-card--issue > .jmedica-brown-card__body {
    display: block !important;
    flex: 1 1 auto !important;
    padding: 11px 12px 12px !important;
    box-sizing: border-box !important;
  }
}


/* ===================================================================
   VERSION 35R — VIEWPORT-SAFE LOWER ROW

   The three-column grid now applies to laptop viewports from 992px.
   The two outer tracks scale down below 1320px instead of causing
   the Founding Issue card to fall back to OJS's narrow sidebar.
   At >=1323px the tracks are the original 258px exactly.
   Keep both bottom cards on one row and a similar minimum height.
   Homepage only. No change to Additional Content or editorial data.
   =================================================================== */
@media (min-width: 992px) and (max-width: 1319px) {
  body.pkp_page_index.pkp_op_index
    .pkp_structure_sidebar.left .jmedica-brown-card--formats,
  body.pkp_page_index.pkp_op_index
    .pkp_structure_sidebar.left .jmedica-brown-card--issue {
    min-height: 275px !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
}


/* ===================================================================
   JMEDICA v38 — GLOBAL MEDICAL COMMUNITY: ONE FULL-WIDTH LOWER BANNER
   Based on the user's approved 37.css (Version 35R).
   Existing rules above are retained byte-for-byte.

   Create an OJS Custom Block called jmedica-community-wide,
   disable "Show Name", and enable it in Sidebar Management.
   OJS block ID should be #customblock-jmedica-community-wide.
   A :has() fallback also supports theme variations.

   On desktop the new block alone occupies row 5, columns 1–3.
   No styles or position changes to existing green/brown/center cards.
   =================================================================== */

/* Hide the new ribbon outside the public JMedica homepage. */
body:not(.pkp_page_index.pkp_op_index) #customblock-jmedica-community-wide,
body:not(.pkp_page_index.pkp_op_index) .block_custom:has(.jm-community-banner) {
  display: none !important;
}

@media (min-width: 992px) {
  /* The existing center remains grid rows 1–4, new ribbon is row 5. */
  body.pkp_page_index.pkp_op_index .pkp_structure_content.has_sidebar {
    grid-template-rows: max-content max-content max-content minmax(0, 1fr) max-content !important;
  }

  body.pkp_page_index.pkp_op_index .pkp_structure_sidebar.left > #customblock-jmedica-community-wide,
  body.pkp_page_index.pkp_op_index .pkp_structure_sidebar.left > .block_custom:has(.jm-community-banner) {
    grid-column: 1 / -1 !important;
    grid-row: 5 !important;
    justify-self: stretch !important;
    align-self: start !important;
    display: block !important;
    float: none !important;
    clear: both !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    overflow: visible !important;
    box-sizing: border-box !important;
  }

  /* Undo OJS's height:100% rules on this new block only. */
  body.pkp_page_index.pkp_op_index #customblock-jmedica-community-wide > .content,
  body.pkp_page_index.pkp_op_index .block_custom:has(.jm-community-banner) > .content,
  body.pkp_page_index.pkp_op_index #customblock-jmedica-community-wide > .content > *,
  body.pkp_page_index.pkp_op_index .block_custom:has(.jm-community-banner) > .content > * {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    box-sizing: border-box !important;
  }
}

/* Banner appearance: no emoji or external icon fonts required. */
body.pkp_page_index.pkp_op_index .jm-community-banner {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 18px 20px 14px !important;
  border: 1px solid #B89854 !important;
  border-radius: 9px !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  color: #F6F9FC !important;
  background: linear-gradient(110deg, #092A51 0%, #123E69 52%, #174B61 100%) !important;
  box-shadow: 0 4px 12px rgba(18, 44, 75, .11) !important;
  font-family: Arial, Helvetica, sans-serif !important;
}

body.pkp_page_index.pkp_op_index .jm-community-banner__intro {
  text-align: center !important;
}
body.pkp_page_index.pkp_op_index .jm-community-banner__eyebrow {
  margin: 0 0 4px !important;
  padding: 0 !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  letter-spacing: 1.5px !important;
  color: #E6C984 !important;
}
body.pkp_page_index.pkp_op_index .jm-community-banner__intro h2 {
  margin: 0 0 5px !important;
  padding: 0 !important;
  border: 0 !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: clamp(18px, 2vw, 23px) !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  color: #FFFFFF !important;
  text-align: center !important;
}
body.pkp_page_index.pkp_op_index .jm-community-banner__lead {
  margin: 0 !important;
  padding: 0 !important;
  font-size: 12px !important;
  line-height: 1.5 !important;
  color: #E2ECF4 !important;
  text-align: center !important;
}
body.pkp_page_index.pkp_op_index .jm-community-banner__institutions {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 9px !important;
  margin: 14px 0 10px !important;
  padding: 0 !important;
}
body.pkp_page_index.pkp_op_index .jm-community-banner__institution {
  display: flex !important;
  gap: 9px !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 8px 7px !important;
  border: 1px solid rgba(236, 210, 156, .52) !important;
  border-radius: 7px !important;
  background: rgba(255,255,255,.08) !important;
  color: #FFFFFF !important;
  box-sizing: border-box !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  text-align: left !important;
}
body.pkp_page_index.pkp_op_index .jm-community-banner__institution > span:last-child {
  color: #FFFFFF !important;
}
body.pkp_page_index.pkp_op_index .jm-community-banner__initial {
  display: inline-flex !important;
  justify-content: center !important;
  align-items: center !important;
  flex: 0 0 28px !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  box-sizing: border-box !important;
  background: #DFC080 !important;
  color: #0F355D !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}
body.pkp_page_index.pkp_op_index .jm-community-banner__people {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 4px 10px !important;
  align-items: baseline !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 8px 0 0 !important;
  border-top: 1px solid rgba(220, 188, 117, .48) !important;
  text-align: center !important;
  color: #E2EDF6 !important;
  font-size: 11.5px !important;
  line-height: 1.5 !important;
}
body.pkp_page_index.pkp_op_index .jm-community-banner__people strong {
  color: #F1D79A !important;
  font-weight: 700 !important;
}
body.pkp_page_index.pkp_op_index .jm-community-banner__people span {
  color: #E2EDF6 !important;
}
body.pkp_page_index.pkp_op_index .jm-community-banner__people b {
  color: #D2AC62 !important;
  font-weight: 700 !important;
  padding: 0 3px !important;
}

@media (min-width: 768px) and (max-width: 1099px) {
  body.pkp_page_index.pkp_op_index .jm-community-banner__institutions {
    grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  }
}
@media (max-width: 767px) {
  body.pkp_page_index.pkp_op_index .jm-community-banner {
    padding: 16px 12px 13px !important;
  }
  body.pkp_page_index.pkp_op_index .jm-community-banner__institutions {
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 7px !important;
  }
  body.pkp_page_index.pkp_op_index .jm-community-banner__institution {
    font-size: 11px !important;
    justify-content: flex-start !important;
  }
}


/* ===================================================================
   JMEDICA VERSION 39 — REDUCE GAP ABOVE FULL-WIDTH COMMUNITY BANNER

   Narrowly scoped: changes the new banner wrapper only, not any of
   the original sidebar, middle infographic, editor block, or footer.
   The preceding grid's fourth row reserves more whitespace than the
   visible panels use on desktop; a modest negative top margin draws
   the banner into that unused area. Because this is a grid margin,
   the grid's overall vertical contribution is also reduced.
   Never apply this overlap correction in the stacked/mobile layout.
   =================================================================== */
@media (min-width: 992px) {
  body.pkp_page_index.pkp_op_index .pkp_structure_sidebar.left > #customblock-jmedica-community-wide,
  body.pkp_page_index.pkp_op_index .pkp_structure_sidebar.left > .block_custom:has(.jm-community-banner) {
    margin-top: calc(clamp(-78px, -6vw, -44px) - 18px) !important;
    margin-bottom: 0 !important;
  }
}

@media (max-width: 991px) {
  body.pkp_page_index.pkp_op_index #customblock-jmedica-community-wide,
  body.pkp_page_index.pkp_op_index .block_custom:has(.jm-community-banner) {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
}

/* Version 40 adjusts only the desktop banner top offset by another 18px. */

/* ========================================================================
   JMEDICA 42 — COMPACT EMERALD / GOLD FOOTER
   Based on approved 40.css. Version 41's grid styles are NOT included.
   Corrects the actual OJS DOM order: branding may precede footer content.
   Footer only; no sidebar, infographic, community banner or card changes.
   ======================================================================== */

.pkp_structure_footer_wrapper {
  background: linear-gradient(112deg, #164A42 0%, #1D6358 55%, #267466 100%) !important;
  color: #FFFFFF !important;
  border-top: 3px solid #C8A864 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Important: flex + explicit ordering prevents the OJS brand from taking
   the large left-hand column and squeezing contacts into the right edge. */
.pkp_structure_footer_wrapper .pkp_structure_footer {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 18px !important;
  width: 100% !important;
  max-width: 1320px !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 auto !important;
  padding: 13px 22px !important;
  box-sizing: border-box !important;
  background: transparent !important;
}

.pkp_structure_footer_wrapper .pkp_footer_content {
  order: 1 !important;
  display: block !important;
  float: none !important;
  flex: 1 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  text-align: center !important;
  color: #FFFFFF !important;
  font: 12px/1.45 Arial, Helvetica, sans-serif !important;
}

.pkp_structure_footer_wrapper .pkp_footer_content p {
  margin: 0 auto 3px !important;
  padding: 0 !important;
  color: #FFFFFF !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
  text-align: center !important;
}
.pkp_structure_footer_wrapper .pkp_footer_content p:last-child {
  margin-bottom: 0 !important;
  color: #F2D69C !important;
  font-size: 11px !important;
}
.pkp_structure_footer_wrapper .pkp_footer_content :is(div,span,strong,b,small) {
  color: inherit !important;
}
.pkp_structure_footer_wrapper .pkp_footer_content :is(a,a:visited) {
  color: #FFE4A8 !important;
  text-decoration: none !important;
  overflow-wrap: anywhere !important;
}
.pkp_structure_footer_wrapper .pkp_footer_content a:hover,
.pkp_structure_footer_wrapper .pkp_footer_content a:focus-visible {
  text-decoration: underline !important;
  color: #FFFFFF !important;
}

.pkp_structure_footer_wrapper .pkp_brand_footer {
  order: 2 !important;
  display: flex !important;
  float: none !important;
  flex: 0 0 138px !important;
  align-items: center !important;
  justify-content: center !important;
  width: 138px !important;
  max-width: 138px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 0 0 15px !important;
  border-left: 1px solid rgba(242,214,156,.65) !important;
  box-sizing: border-box !important;
  background: transparent !important;
}
.pkp_structure_footer_wrapper .pkp_brand_footer a {
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: 120px !important;
  min-width: 0 !important;
  margin: 0 auto !important;
  padding: 0 !important;
}
.pkp_structure_footer_wrapper .pkp_brand_footer img {
  display: block !important;
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: 65px !important;
  object-fit: contain !important;
  filter: brightness(0) invert(1) !important;
}

@media (max-width: 767px) {
  .pkp_structure_footer_wrapper .pkp_structure_footer {
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    gap: 10px !important;
    padding: 14px 12px 12px !important;
  }
  .pkp_structure_footer_wrapper .pkp_footer_content {
    flex: 0 1 auto !important;
    width: 100% !important;
    font-size: 11.5px !important;
  }
  .pkp_structure_footer_wrapper .pkp_footer_content p {
    font-size: 11.5px !important;
    margin-bottom: 5px !important;
  }
  .pkp_structure_footer_wrapper .pkp_brand_footer {
    flex: 0 0 auto !important;
    width: 100% !important;
    max-width: none !important;
    padding: 10px 0 0 !important;
    border-left: 0 !important;
    border-top: 1px solid rgba(242,214,156,.65) !important;
  }
  .pkp_structure_footer_wrapper .pkp_brand_footer a {
    max-width: 105px !important;
  }
  .pkp_structure_footer_wrapper .pkp_brand_footer img {
    max-height: 46px !important;
  }
}
