/* ===============================================================
 SEMPOA — LIGHTWEIGHT OJS STYLESHEET v2.4 (31 Oct 2026)
 Palette : slate #657D8A | maroon #800000 | dark #344C59
 IMPORTANT: REPLACE previous stylesheet; do NOT append to old CSS.
 Target : Public OJS 3.x Default/Default-derived themes.
 CSS only styles existing metadata; it doesn't add article fields.
 =============================================================== */
:root {
 --sp-slate:#657d8a;--sp-dark:#344c59;--sp-red:#800000;
 --sp-text:#263640;--sp-muted:#65747d;--sp-border:#dee5e8;
 --sp-soft:#f6f8f9;
}
/* 1 - Base: no page-wide gradient, webfonts or animations */
body {color:var(--sp-text);}
.pkp_structure_main {min-width:0;}
.pkp_structure_main img {max-width:100%;height:auto;}
.pkp_structure_main a {overflow-wrap:break-word;}

/* 2 - Preserve the user's full-width banner without affecting menu sizing */
.pkp_structure_head {width:100%;box-sizing:border-box;overflow:visible;}
.pkp_structure_head .pkp_head_wrapper,
.pkp_structure_head .pkp_site_name_wrapper,
.pkp_structure_head .pkp_site_name {box-sizing:border-box;}
.pkp_structure_head .pkp_site_name .is_img img,
.pkp_structure_head .pkp_site_name a.is_img img {
 display:block!important;width:100%!important;height:auto!important;
 max-width:100%!important;max-height:none!important;object-fit:contain;border:0;
}
@media(min-width:992px){
 .pkp_structure_head .pkp_head_wrapper {width:100%;max-width:100%;}
 .pkp_structure_head .pkp_site_name_wrapper {width:100%!important;max-width:100%!important;padding-left:0!important;padding-right:0!important;}
 .pkp_structure_head .pkp_site_name {width:100%!important;max-width:none!important;padding:0!important;margin:0!important;white-space:normal!important;}
 .pkp_structure_head .pkp_site_name .is_img,
 .pkp_structure_head .pkp_site_name a.is_img {display:block!important;width:100%!important;max-width:100%!important;margin:0!important;padding:0!important;line-height:0;}
}
/* 3 - Navigation: neutral white typography on dark slate, consistent sizes.
   Restrict styles to desktop menu; mobile uses original theme controls. */
@media(min-width:992px){
 .pkp_navigation_primary_wrapper {background:var(--sp-dark);border-bottom:2px solid var(--sp-red);}
 .pkp_navigation_primary > li > a,
 .pkp_navigation_primary > li > a:link,
 .pkp_navigation_primary > li > a:visited {
  color:#fff!important;background:transparent!important;
  font-family:Arial,Helvetica,sans-serif;font-size:13px;font-weight:600;
  line-height:1.4;letter-spacing:0;text-transform:none;text-shadow:none;
 }
 .pkp_navigation_primary > li > a:hover,
 .pkp_navigation_primary > li > a:focus {color:#fff!important;background:#526a77!important;}
 .pkp_navigation_primary .dropdown-menu,
 .pkp_navigation_primary ul.dropdown-menu,
 .pkp_navigation_primary > li > ul {background:#fff!important;border:1px solid var(--sp-border);}
 .pkp_navigation_primary .dropdown-menu a,
 .pkp_navigation_primary > li > ul a,
 .pkp_navigation_primary .dropdown-menu a:visited {
  color:var(--sp-dark)!important;background:#fff!important;
  font-size:13px;font-weight:500;text-transform:none;line-height:1.45;
 }
 .pkp_navigation_primary .dropdown-menu a:hover,
 .pkp_navigation_primary > li > ul a:hover {color:var(--sp-red)!important;background:#f2f5f6!important;}
}
/* For themes with slate bar on mobile, retain default navigation layout */
@media(max-width:991px){
 .pkp_structure_head .pkp_site_name .is_img img,
 .pkp_structure_head .pkp_site_name a.is_img img {width:100%!important;max-height:none!important;}
}

/* 4 - Page titles, restrained SEMPOA branding */
.pkp_structure_main .page_title,
.pkp_structure_main h1.page_title {color:var(--sp-dark);line-height:1.35;border-bottom:2px solid var(--sp-border);padding-bottom:12px;}
.pkp_structure_main .cmp_breadcrumbs {font-size:12px;color:var(--sp-muted);}

/* 5 - Issue header and section headings */
.obj_issue_toc > .heading {padding-bottom:16px;margin-bottom:18px;border-bottom:1px solid var(--sp-border);}
.obj_issue_toc > .heading .title {color:var(--sp-dark);font-weight:700;line-height:1.4;}
.obj_issue_toc > .heading .published,
.obj_issue_toc > .heading .description {color:var(--sp-muted);line-height:1.65;}
.obj_issue_toc .cover img {border:1px solid var(--sp-border);border-radius:5px;}
.obj_issue_toc .section > .title,
.obj_issue_toc .section > h2,
.obj_issue_toc .section .section_title {
 color:var(--sp-dark);background:#f1f5f7;
 border-left:4px solid var(--sp-red);padding:10px 13px;
 font-size:18px;font-weight:700;line-height:1.4;margin:22px 0 16px;
}

/* 6 - Issue articles: a single flat card per row.
   Most OJS themes use .obj_issue_toc .articles > li.
   Do not turn article lists into CSS grid or touch other list elements. */
.obj_issue_toc .articles {margin:0;padding:0;list-style:none;}
.obj_issue_toc .articles > li {
 position:relative;box-sizing:border-box;
 padding:17px 18px;margin:0 0 12px;
 border:1px solid var(--sp-border);border-left:3px solid var(--sp-slate);
 border-radius:6px;background:#fff;
}
.obj_issue_toc .articles > li:hover {border-left-color:var(--sp-red);background:#fdfefe;}
/* Avoid nested cards if the theme has an article-summary wrapper */
.obj_issue_toc .articles > li .obj_article_summary {background:transparent;border:0;box-shadow:none;padding:0;margin:0;}
.obj_issue_toc .obj_article_summary .title,
.obj_issue_toc .obj_article_summary .title a {
 color:var(--sp-dark);font-weight:700;font-size:17px;
 line-height:1.48;text-decoration:none;overflow-wrap:anywhere;
}
.obj_issue_toc .obj_article_summary .title a:hover {color:var(--sp-red);text-decoration:underline;}
.obj_issue_toc .obj_article_summary .authors,
.obj_issue_toc .obj_article_summary .author {font-size:13px;color:var(--sp-muted);line-height:1.6;margin-top:6px;}
.obj_issue_toc .obj_article_summary .pages,
.obj_issue_toc .obj_article_summary .published,
.obj_issue_toc .obj_article_summary .doi,
.obj_issue_toc .obj_article_summary .meta {font-size:12px;color:var(--sp-muted);line-height:1.6;}
.obj_issue_toc .obj_article_summary .doi a {color:var(--sp-red);}
/* Keep galley links compact; no expensive transitions */
.obj_issue_toc .obj_article_summary .galleys_links,
.obj_issue_toc .obj_article_summary .galleys {margin-top:12px;padding:0;display:flex;gap:7px;flex-wrap:wrap;align-items:center;}
.obj_issue_toc .obj_article_summary .galleys_links li,
.obj_issue_toc .obj_article_summary .galleys li {margin:0;padding:0;list-style:none;}
.obj_issue_toc .obj_article_summary a.obj_galley_link,
.obj_issue_toc .obj_article_summary .obj_galley_link {
 display:inline-block;min-width:48px;box-sizing:border-box;
 padding:6px 11px;border:1px solid #bdcdd4;border-radius:4px;
 color:var(--sp-dark);background:#f1f5f7;
 font-size:12px;font-weight:700;line-height:1.4;text-align:center;text-decoration:none;
}
.obj_issue_toc .obj_article_summary a.obj_galley_link:hover {background:var(--sp-red);border-color:var(--sp-red);color:#fff;}
.obj_issue_toc .obj_article_summary .views,
.obj_issue_toc .obj_article_summary .downloads,
.obj_issue_toc .obj_article_summary .stats {font-size:12px;color:var(--sp-muted);}

/* 7 - Article detail: title, authors, DOI, abstract, references */
.pkp_page_article .obj_article_details > .page_title,
.pkp_page_article .obj_article_details > .title,
.pkp_page_article .obj_article_details .page_title {
 color:var(--sp-dark);font-size:clamp(22px,2.4vw,29px);
 line-height:1.42;font-weight:700;overflow-wrap:anywhere;
}
.pkp_page_article .obj_article_details .authors,
.pkp_page_article .obj_article_details .author {color:var(--sp-muted);line-height:1.6;}
.pkp_page_article .obj_article_details .doi,
.pkp_page_article .obj_article_details .item.doi {font-size:13px;overflow-wrap:anywhere;}
.pkp_page_article .obj_article_details .doi a {color:var(--sp-red);}
.pkp_page_article .obj_article_details .item.abstract,
.pkp_page_article .obj_article_details .abstract {
 background:#f8fafb;border:1px solid var(--sp-border);
 border-left:3px solid var(--sp-slate);border-radius:5px;
 padding:17px 19px;line-height:1.78;overflow-wrap:anywhere;
}
.pkp_page_article .obj_article_details .item > .label,
.pkp_page_article .obj_article_details .item > h2 {color:var(--sp-dark);font-size:16px;font-weight:700;}
.pkp_page_article .obj_article_details .item.references,
.pkp_page_article .obj_article_details .references {line-height:1.7;overflow-wrap:anywhere;}
.pkp_page_article .obj_article_details a.obj_galley_link,
.pkp_page_article .obj_article_details .obj_galley_link {
 display:inline-block;border-radius:4px;border:1px solid var(--sp-red);
 background:#fff;color:var(--sp-red);padding:7px 12px;
 font-size:12px;font-weight:700;text-decoration:none;
}
.pkp_page_article .obj_article_details a.obj_galley_link:hover {background:var(--sp-red);color:#fff;}
/* 8 - Summary cards on journal home/archive: small enhancement only */
.current_issue .obj_issue_summary .title,
.issues_archive .obj_issue_summary .title {color:var(--sp-dark);font-weight:700;}
/* 9 - Mobile density without any movement or animation */
@media(max-width:767px){
 .obj_issue_toc .articles > li {padding:13px 12px;margin-bottom:10px;}
 .obj_issue_toc .obj_article_summary .title,
 .obj_issue_toc .obj_article_summary .title a {font-size:15px;line-height:1.5;}
 .obj_issue_toc .obj_article_summary .authors {font-size:12px;}
 .obj_issue_toc .section > .title,
 .obj_issue_toc .section > h2 {font-size:16px;padding:9px 11px;}
 .pkp_page_article .obj_article_details .item.abstract,
 .pkp_page_article .obj_article_details .abstract {padding:13px;}
}

/* ================================================================
 10 — v2.4 CONTAINED DESKTOP NAVIGATION
 Screenshot alignment: SEMPOA banner and content width ~1160px.
 Do not use 100vw backgrounds or 46px ::before pseudo-elements.
 ================================================================ */
.pkp_structure_head {background:#fff !important;}
@media (min-width:992px) {
  /* Remove the full-viewport pseudo-elements used by v2.2/v2.3. */
  .pkp_structure_head .pkp_navigation_primary_row::before,
  .pkp_structure_head .pkp_navigation_primary_row::after,
  .pkp_structure_head .pkp_navigation_primary_wrapper::before,
  .pkp_structure_head .pkp_navigation_primary_wrapper::after {
    content:none !important;
    display:none !important;
  }
  /* Match the content/banner max width, not the browser viewport. */
  .pkp_structure_head .pkp_navigation_primary_row {
    box-sizing:border-box;
    width:100% !important;
    max-width:1160px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding:0 !important;
    background:#344c59 !important;
    border:0 !important;
    box-shadow:none !important;
    min-height:0 !important;
  }
  .pkp_structure_head .pkp_navigation_primary_wrapper {
    width:100% !important;
    max-width:100% !important;
    margin:0 !important;
    padding:0 !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
  }
  .pkp_structure_head .pkp_navigation_primary {
    box-sizing:border-box;
    margin:0 !important;
    padding:0 16px !important;
    min-height:0 !important;
    background:transparent !important;
    border:0 !important;
  }
  .pkp_structure_head .pkp_navigation_primary > li > a {
    display:block;
    padding:12px 15px !important;
    line-height:20px !important;
    color:#fff !important;
    background:transparent !important;
    font-size:13px !important;
    font-family:Arial,Helvetica,sans-serif !important;
    font-weight:600 !important;
    text-transform:none !important;
  }
  .pkp_structure_head .pkp_navigation_primary > li > a:hover,
  .pkp_structure_head .pkp_navigation_primary > li > a:focus {
    color:#fff !important;
    background:#526a77 !important;
  }
  /* OJS default places the search widget separately on the right. */
  .pkp_structure_head .pkp_navigation_search_wrapper a,
  .pkp_structure_head .pkp_navigation_search_wrapper a:visited {
    color:#fff !important;
  }
  .pkp_structure_head .pkp_navigation_search_wrapper a:hover {
    color:#f0d6d6 !important;
  }
  .pkp_structure_head .pkp_navigation_primary > li > ul {
    background:#fff !important;
  }
}
/* Mobile: no full-width generated bars, preserve OJS hamburger menu. */
@media (max-width:991px) {
  .pkp_structure_head .pkp_navigation_primary_row::before,
  .pkp_structure_head .pkp_navigation_primary_row::after {
    content:none !important;display:none !important;
  }
  .pkp_structure_head .pkp_navigation_primary_row,
  .pkp_structure_head .pkp_navigation_primary_wrapper {
    background:transparent !important;
  }
}
