@import url('https://fonts.googleapis.com/css2?family=Source+Serif+4:ital,opsz,wght@0,8..60,400;0,8..60,600;0,8..60,700;1,8..60,400&family=Source+Sans+3:ital,wght@0,400;0,600;0,700;1,400&display=swap');

/* ============================================================
   WRU OJS journal master stylesheet
   World Research Union
   ------------------------------------------------------------
   ONLY the :root block below changes per journal.
   Everything under it is identical across all WRU journals.
   Footer HTML must use class "wru-footer" (see note at bottom).
   Upload through Settings > Website > Appearance > Journal style sheet.
   ============================================================ */

:root {
  /* ---- JAICI (active) ------------------------------------ */
  /* Navy #003366 and gold #C9A227 from the JAICI article       */
  /* template.                                                  */
  --brand-header: #003366;   /* nav band, headings, links    */
  --brand-footer: #001A33;   /* footer band + dropdown panel */
  --brand-text:   #CCD6E0;   /* footer base text             */
  --brand-body:   #B3C2D1;   /* footer paragraph text        */
  --brand-link:   #D9BE5C;   /* footer link (resting), gold  */
  --brand-strong: #EEF2F6;   /* footer <strong>              */
  --brand-muted:  #8FA3B8;   /* footer bottom strip          */
  --brand-accent: #FFFFFF;   /* link / nav hover             */
  /* Header image under a dated file name, so the host's CDN cache of
     OJS's fixed name (pageHeaderLogoImage_en.png) can never show an
     old logo. Upload a new copy under a new name when it changes. */
  --brand-header-image: url("https://landing.wrunion.org/ojs/public/site/images/wrujournals/jaici-header-20260927.png");
}

/* ------------------------------------------------------------
   PALETTES FOR THE OTHER JOURNALS
   To switch journal: replace the eight values above with one
   set below. Nothing else in this file changes.

   JIFSAM header #0B4F29  footer #06301A  text #C9DDD0  body #B5CDBD
          link  #D4BA58  strong #E3EFE7  muted #8FB09B accent #E6CF7A

   JAICI  header #003366  footer #001A33  text #CCD6E0  body #B3C2D1
          link  #D9BE5C  strong #EEF2F6  muted #8FA3B8 accent #FFFFFF
          header-image jaici-header-20260927.png
          (navy and gold from the JAICI article template; the old teal
          palette did not match the published PDFs)

   JBSMR  header #5A2A3A  footer #500E24  text #EAC7D3  body #DFB9C6
          link  #E6A9BD  strong #F4DCE4  muted #C48FA1 accent #C86F8D

   JHAI   header #0B4F29  footer #06301A  text #C9DDD0  body #B5CDBD
          link  #D4BA58  strong #E3EFE7  muted #8FB09B accent #E6CF7A
          header-image jhai-header-20260927.png
          (the JHAI article template uses the same green #0B4F29 as
          JIFSAM and its logo gold is #D7BA60, so the palette matches
          JIFSAM; the logo tells the two apart)

   JASAT  header #38126F  footer #1E0A3C  text #D5CCE4  body #C2B6D8
          link  #C9C9CE  strong #ECE6F6  muted #9C8FB8 accent #FFFFFF
          header-image jasat-header-20260927.png
          (purple from the JASAT article template, silver from its logo)
   ------------------------------------------------------------ */

/* ============================================================
   Typography
   Source Serif 4 for reading text and headings, Source Sans 3
   for navigation, sidebar, forms and metadata. This is the same
   split Springer Nature and ScienceDirect use: a serif for what
   people read, a sans for what they click.
   ============================================================ */

html {
  -webkit-text-size-adjust: 100%;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body,
.pkp_structure_page,
.pkp_structure_content,
.pkp_structure_sidebar,
.pkp_navigation_primary,
.pkp_navigation_user,
.cmp_breadcrumbs,
.cmp_button,
.cmp_form,
input, button, select, textarea, label,
.pkp_button,
.pkp_block,
.obj_article_summary .meta,
.obj_article_details .authors,
.obj_article_details .item .label,
.obj_galley_link {
  font-family: 'Source Sans 3', 'Helvetica Neue', Arial, sans-serif;
}

/* Reading text */
.pkp_structure_main,
.pkp_structure_main p,
.pkp_structure_main li,
.pkp_structure_main td,
.pkp_structure_main th,
.pkp_structure_main blockquote {
  font-family: 'Source Serif 4', Georgia, 'Times New Roman', serif;
  color: #1C1C1C;
}

.pkp_structure_main {
  padding-top: 28px;
}

.pkp_structure_main p,
.pkp_structure_main li {
  font-size: 16px;
  line-height: 1.6;
}

.pkp_structure_main p {
  margin: 0 0 1em;
}

/* Reading content is left aligned, as on SpringerLink and
   ScienceDirect. Justified text without hyphenation opens
   uneven gaps between words on narrow screens. */
.page p,
.obj_article_details .item.abstract p,
.cmp_announcement p,
.page_about p,
.static_page p {
  text-align: left;
  hyphens: manual;
}

/* Headings */
h1, h2, h3, h4, h5, h6,
.pkp_site_name,
.pkp_site_name a,
.page_title,
.cmp_page_header h1,
.obj_article_details .page_title,
.obj_article_summary .title {
  font-family: 'Source Serif 4', Georgia, 'Times New Roman', serif;
  color: #111111;
  font-weight: 600;
  letter-spacing: -0.005em;
}

/* The OJS default theme sets its "Typography" choice on these
   exact selectors. Matching them here (this file loads after the
   theme) makes the WRU fonts win whatever that setting is. */
.pkp_site_name,
.pkp_site_name .is_text,
.pkp_structure_main h1,
.pkp_structure_main h2,
.pkp_structure_main h3,
.obj_article_summary > .title,
.obj_issue_summary .title,
.cmp_breadcrumbs .current h1,
.pkp_page_index .current_issue .current_issue_title,
.cmp_announcements .obj_announcement_summary h2,
.cmp_announcements .obj_announcement_summary h3 {
  font-family: 'Source Serif 4', Georgia, 'Times New Roman', serif;
}

#navigationPrimary a,
.pkp_navigation_search_wrapper a,
.pkp_navigation_user_wrapper a,
.pkp_block .title,
.cmp_breadcrumbs,
.cmp_pagination,
.cmp_manuscript_button,
.block_make_submission a,
.obj_galley_link,
.obj_article_details .main_entry .item .label,
.obj_article_details .entry_details .item .label,
.obj_article_details .citation_display .citation_formats_button,
.obj_article_details .authors,
.obj_article_details .doi,
.obj_issue_toc .heading .pub_id,
.obj_issue_toc .heading .published,
.obj_issue_toc .pages,
.obj_issue_summary .series,
.pkp_page_index .current_issue .read_more,
.cmp_announcements .date,
.cmp_announcements .read_more,
.page_search .search_advanced > legend {
  font-family: 'Source Sans 3', 'Helvetica Neue', Arial, sans-serif;
}

#navigationPrimary a {
  text-transform: none;
  letter-spacing: 0;
}

.pkp_structure_main h1,
.pkp_structure_main .page_title {
  font-size: 28px;
  line-height: 1.25;
  margin: 0 0 18px;
}

.pkp_structure_main h2 {
  font-size: 21px;
  line-height: 1.3;
  margin: 32px 0 10px;
}

/* The Static Pages plugin prints each page's title as the first
   h2 inside .page. Give it the same size as other page titles. */
body .pkp_structure_main .page > h2:first-child {
  font-size: 28px;
  line-height: 1.25;
  margin: 0 0 18px;
}

.pkp_structure_main h3 {
  font-size: 17.5px;
  line-height: 1.35;
  margin: 28px 0 10px;
}

.pkp_structure_main h4 {
  font-family: 'Source Sans 3', 'Helvetica Neue', Arial, sans-serif;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: #3A3A3A;
  margin: 24px 0 8px;
}

.pkp_structure_main h2:first-child,
.pkp_structure_main h3:first-child {
  margin-top: 0;
}

/* Links in reading text */
body .pkp_structure_main a {
  color: var(--brand-header);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}

body .pkp_structure_main a:hover,
body .pkp_structure_main a:focus {
  color: var(--brand-footer);
  text-decoration-thickness: 2px;
}

/* Lists */
.pkp_structure_main ul,
.pkp_structure_main ol {
  margin: 0 0 1.1em;
  padding-left: 1.4em;
}

.pkp_structure_main li {
  margin: 0 0 0.4em;
}

.pkp_structure_main li > ul,
.pkp_structure_main li > ol {
  margin: 0.4em 0 0;
}

/* Tables, for fee tables and board listings */
.pkp_structure_main table {
  width: 100%;
  border-collapse: collapse;
  margin: 0 0 1.5em;
  font-size: 15px;
}

.pkp_structure_main th,
.pkp_structure_main td {
  padding: 10px 12px;
  border-bottom: 1px solid #DADCE0;
  text-align: left;
  vertical-align: top;
}

.pkp_structure_main th {
  font-family: 'Source Sans 3', 'Helvetica Neue', Arial, sans-serif;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.02em;
  color: #333333;
  background: #F4F5F7;
  border-bottom: 2px solid #C9CDD3;
}

/* Quoted model wording (declarations, example statements) */
.pkp_structure_main blockquote {
  margin: 0 0 1.2em;
  padding: 12px 18px;
  border-left: 3px solid var(--brand-header);
  background: #F6F7F9;
  font-style: italic;
}

.pkp_structure_main blockquote p:last-child {
  margin-bottom: 0;
}

/* Small print: effective dates, revision lines */
.pkp_structure_main .wru-meta {
  font-family: 'Source Sans 3', 'Helvetica Neue', Arial, sans-serif;
  font-size: 14px;
  color: #5F6368;
  border-top: 1px solid #E3E5E8;
  padding-top: 12px;
  margin-top: 32px;
}

/* ============================================================
   Editorial board listing
   Used by the static Editorial Board page.
   ============================================================ */

body .pkp_structure_main .wru-board h2 {
  font-family: 'Source Sans 3', 'Helvetica Neue', Arial, sans-serif;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #5F6368;
  border-bottom: 1px solid #E3E5E8;
  padding-bottom: 8px;
  margin: 36px 0 16px;
}

body .pkp_structure_main .wru-board h2:first-child {
  margin-top: 0;
}

.wru-board .member {
  margin: 0 0 20px;
}

.wru-board .member .name {
  font-family: 'Source Serif 4', Georgia, serif;
  font-size: 17px;
  font-weight: 600;
  color: #111111;
  margin: 0 0 2px;
}

.wru-board .member .affiliation {
  font-size: 15px;
  line-height: 1.5;
  color: #3A3A3A;
  margin: 0 0 4px;
}

.wru-board .member .ids {
  font-family: 'Source Sans 3', 'Helvetica Neue', Arial, sans-serif;
  font-size: 14px;
  margin: 0;
}

.wru-board .member .ids a {
  margin-right: 14px;
}

/* ============================================================
   Sidebar and breadcrumbs
   ============================================================ */

.pkp_block .title {
  font-family: 'Source Sans 3', 'Helvetica Neue', Arial, sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #5F6368;
}

.pkp_block .title {
  border-bottom-color: var(--brand-link);
}

.pkp_block a {
  color: var(--brand-header);
}

.cmp_breadcrumbs {
  font-size: 14px;
  color: #5F6368;
}

/* ============================================================
   Footer: four-column dark band
   ============================================================ */

.pkp_brand_footer,
.pkp_structure_footer .pkp_brand_footer {
  display: none;
}

body .pkp_structure_footer_wrapper,
body .pkp_structure_footer {
  background: var(--brand-footer);
  color: var(--brand-text);
  padding: 0;
  min-height: 0;
}

.pkp_structure_footer .pkp_footer_content {
  max-width: 1120px;
  margin: 0 auto;
  padding: 38px 26px 0;
}

.wru-footer {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1.1fr;
  gap: 34px;
  font-family: 'Source Sans 3', 'Helvetica Neue', Arial, sans-serif;
}

.wru-footer .brand-title {
  font-family: 'Source Serif 4', Georgia, serif;
  color: #FFFFFF;
  font-weight: 600;
  font-size: 17px;
  line-height: 1.3;
  margin: 0 0 12px;
}

.wru-footer h4 {
  font-family: 'Source Sans 3', 'Helvetica Neue', Arial, sans-serif;
  color: #FFFFFF;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin: 0 0 14px;
}

.wru-footer p {
  font-family: 'Source Sans 3', 'Helvetica Neue', Arial, sans-serif;
  margin: 0 0 12px;
  font-size: 14px;
  line-height: 1.55;
  color: var(--brand-body);
  text-align: left;
}

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

.wru-footer li {
  margin: 0 0 9px;
  font-size: 14px;
}

.wru-footer a {
  color: var(--brand-link);
  text-decoration: none;
}

.wru-footer a:hover {
  color: var(--brand-accent);
  text-decoration: underline;
}

.wru-footer strong {
  color: var(--brand-strong);
}

/* WRU logo in the footer publisher column (white version) */
.wru-footer .publisher-logo {
  display: block;
  width: 80px;
  height: auto;
  margin: 0 0 14px;
}

.wru-footer-bottom {
  max-width: 1120px;
  margin: 26px auto 0;
  padding: 14px 26px;
  border-top: 1px solid rgba(255,255,255,0.14);
  text-align: center;
  font-family: 'Source Sans 3', 'Helvetica Neue', Arial, sans-serif;
  font-size: 13px;
  color: var(--brand-muted);
}

/* ============================================================
   Rules prefixed with "body" below win over the site-wide
   portal stylesheet, which OJS loads after this file.
   ------------------------------------------------------------
   Masthead: white, like page 1 of the journal's articles.
   The header image carries the journal logo, the title and
   the WRU logo. The navigation sits in a brand band below it.
   ============================================================ */

body .pkp_structure_head {
  background: #FFFFFF;
  border-bottom: 0;
}

.pkp_site_name_wrapper {
  background: #FFFFFF;
}

.pkp_site_name {
  padding-top: 14px;
  padding-bottom: 10px;
}

body .pkp_site_name .is_img img {
  max-height: 110px;
  width: auto;
  max-width: 100%;
  content: var(--brand-header-image);
}

/* User menu (Login, Register, account name) sits on white */
body .pkp_navigation_user_wrapper a,
body .pkp_navigation_user > li > a {
  color: var(--brand-header) !important;
}

.pkp_navigation_user_wrapper a:hover,
.pkp_navigation_user_wrapper a:focus {
  color: var(--brand-footer) !important;
  text-decoration: underline;
}

/* Below 992px the OJS theme squeezes the header into a 40px strip
   with an absolutely placed title. The WRU header image is taller,
   so let the strip grow and keep the image clear of the menu button. */
@media (max-width: 991px) {
  .pkp_site_name_wrapper {
    height: auto;
    min-height: 2.857rem;
  }
  .pkp_site_name {
    position: relative;
    left: auto;
    right: auto;
    padding: 6px 0 6px 3.2rem;
    white-space: normal;
    overflow: visible;
  }
  .pkp_site_name .is_img {
    margin: 0;
  }
  body .pkp_site_name .is_img img {
    max-height: 76px;
  }
  .pkp_site_nav_toggle {
    top: 50%;
    transform: translateY(-50%);
    background: var(--brand-header);
    border-radius: 3px;
  }
  .pkp_site_nav_menu {
    background: var(--brand-header);
  }
}

/* ============================================================
   Primary navigation: brand band, white text
   ============================================================ */

body .pkp_navigation_primary_row,
body .pkp_navigation_primary_wrapper {
  background: var(--brand-header);
}

.pkp_navigation_primary_row {
  border-top: 3px solid var(--brand-link);
}

/* Inner padding for the band on desktop. Set here rather than left to the
   theme, whose compiled CSS does not always include it; without it the
   band starts exactly at the "H" of Home. */
@media (min-width: 992px) {
  body .pkp_navigation_primary_row {
    padding-left: 2.143rem;
    padding-right: 2.143rem;
  }
}

/* body prefix: the Manuscript theme sets 13px bold on these links with a
   more specific selector, so the plain rule lost there. */
body .pkp_navigation_primary a,
body .pkp_navigation_primary > li > a,
body .pkp_navigation_primary li a,
body .pkp_navigation_search_wrapper a,
body .pkp_search a {
  color: #FFFFFF !important;
  font-size: 15px;
  font-weight: 600;
}

.pkp_navigation_primary a:hover,
.pkp_navigation_primary a:focus,
.pkp_navigation_search_wrapper a:hover {
  color: var(--brand-accent) !important;
}

/* ============================================================
   Theme independence
   The host CDN can keep serving an older compiled theme CSS (the
   Manuscript child theme) under the same URL after a journal moves to
   the Default theme. These rules pin what Manuscript changes, so every
   WRU journal looks the same whichever theme CSS arrives.
   ============================================================ */

html,
body {
  background-color: #FFFFFF;
}

body #navigationPrimary a {
  font-size: 15px;
  font-weight: 600;
  text-transform: none;
}

body #navigationPrimary li li a {
  font-weight: 400;
}

body .pkp_navigation_search_wrapper a,
body .pkp_search {
  font-size: 15px;
  text-transform: none;
}

body .pkp_structure_main .current_issue > h2,
body .pkp_structure_main .current_issue .label,
body .pkp_structure_main .read_more,
body .obj_article_summary .title,
body .obj_article_summary .title a {
  text-transform: none;
}

body .pkp_structure_main .current_issue > h2,
body .pkp_block .title {
  border-bottom: 0;
}

/* Galley buttons (PDF): outlined in the brand colour. Manuscript fills
   them with the brand colour, which our link colour then made invisible. */
body .pkp_structure_main a.obj_galley_link,
body a.obj_galley_link {
  color: var(--brand-header) !important;
  background: #FFFFFF;
  border: 1px solid var(--brand-header);
  text-transform: none;
}

body .pkp_structure_main a.obj_galley_link:hover,
body .pkp_structure_main a.obj_galley_link:focus,
body a.obj_galley_link:hover,
body a.obj_galley_link:focus {
  color: #FFFFFF !important;
  background: var(--brand-header);
}

/* Dropdown panels (About, For Authors, Policies) */
.pkp_navigation_primary li ul {
  background: var(--brand-footer);
}

.pkp_navigation_primary li li a {
  color: #FFFFFF;
  font-weight: 400;
}

/* ============================================================
   Full-bleed header and footer (break out of the centred page)
   ============================================================ */

.pkp_structure_head,
.pkp_structure_footer_wrapper {
  width: 100vw;
  margin-left: calc(-50vw + 50%);
}

/* 100vw includes the vertical scrollbar, so the bands above are a few
   pixels wider than the window and a sideways scrollbar appears. Clip it. */
html {
  overflow-x: hidden;
}

@supports (overflow-x: clip) {
  html {
    overflow-x: clip;
  }
}

.pkp_structure_head .pkp_head_wrapper {
  max-width: 1120px;
  margin-left: auto;
  margin-right: auto;
}

/* ============================================================
   Responsive
   ============================================================ */

@media (max-width: 760px) {
  .wru-footer { grid-template-columns: 1fr 1fr; gap: 26px; }
  .pkp_structure_main h1,
  .pkp_structure_main .page_title,
  body .pkp_structure_main .page > h2:first-child { font-size: 24px; }
  .pkp_structure_main h2 { font-size: 19px; }
  .pkp_structure_main p,
  .pkp_structure_main li { font-size: 15.5px; }
  .pkp_structure_main table { font-size: 14px; }
}

@media (max-width: 460px) {
  .wru-footer { grid-template-columns: 1fr; }
  .pkp_structure_main table { display: block; overflow-x: auto; }
  .pkp_structure_main th,
  .pkp_structure_main td { padding: 8px; }
}

/* ------------------------------------------------------------
   NOTE: footer HTML must use the generic class "wru-footer"
   (and "wru-footer-bottom"), not a per-journal class such as
   "jifsa-footer". This is what keeps a single stylesheet usable
   for every journal. The header band colour is set here; also
   confirm it matches in Appearance > Setup > Colour for the
   active journal.
   ------------------------------------------------------------ */
