@import url('https://fonts.googleapis.com/css2?family=Lora:wght@400;500;600;700&family=Open+Sans:wght@400;600;700&display=swap');

/* ============================================================
   WRU OJS Journal — master stylesheet (JHAI active)
   Journal of Healthcare Analytics and Informatics
   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".
   Set Appearance > Setup > Colour to #000000 to match.
   ============================================================ */

:root {
  /* ---- JHAI (active) — black + gold caduceus identity ---- */
  --brand-header: #000000;   /* header + nav band            */
  --brand-footer: #0A0A0A;   /* footer band + dropdown panel */
  --brand-text:   #E8E2D0;   /* footer base text            */
  --brand-body:   #CFC7B0;   /* footer paragraph text       */
  --brand-link:   #E3B23C;   /* footer link (resting) gold  */
  --brand-strong: #F5D67A;   /* footer <strong> light gold  */
  --brand-muted:  #8A8163;   /* footer bottom strip         */
  --brand-accent: #F5D67A;   /* link / nav hover (gold)     */
}

/* ------------------------------------------------------------
   ALTERNATE PALETTES
   To switch: replace the eight values above with one set below.
   Nothing else in this file changes.

   JHAI (green, original)  header #234D34  footer #0E5029
          text #C7EAD5  body #B9DFC8  link #A9E6C2
          strong #DCF4E6  muted #8FC4A4  accent #6FC893

   JIFSA  header #1A5FB4  footer #0E2C50  text #C7D7EA  body #B9CADF
          link  #A9C4E6  strong #DCE7F4  muted #8FA7C4 accent #6F97C8

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

   JASAT  header #2C3E50  footer #0E2F50  text #C7D8EA  body #B9CCDF
          link  #A9C7E6  strong #DCE8F4  muted #8FAAC4 accent #6F9CC8
   ------------------------------------------------------------ */

/* ============================================================
   Typography — Lora headings + Open Sans body
   Sizes left to the shared theme so all journals match.
   ============================================================ */

body,
.pkp_structure_page,
.pkp_structure_content,
p, li, td, th,
input, button, select, textarea {
  font-family: 'Open Sans', sans-serif;
}

h1, h2, h3, h4, h5, h6,
.pkp_site_name,
.pkp_site_name a,
.cmp_page_header h1,
.obj_article_details .page_title {
  font-family: 'Lora', serif;
}

/* ============================================================
   Justify reading content only (nav, buttons, sidebar untouched)
   ============================================================ */

.page p,
.obj_article_details .item.abstract p,
.obj_article_details .item.abstract div,
.cmp_announcement p,
section.item.description p,
.about_the_journal p,
.page_about p,
.static_page p {
  text-align: justify;
  text-justify: inter-word;
  hyphens: none;
}

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

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

.pkp_structure_footer_wrapper,
.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;
}

.wru-footer .brand-title {
  color: #FFFFFF;
  font-weight: 700;
  font-size: 15px;
  line-height: 1.3;
  margin: 0 0 12px;
}

.wru-footer h4 {
  color: #FFFFFF;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.4px;
  margin: 0 0 14px;
}

.wru-footer p {
  margin: 0 0 12px;
  font-size: 13.5px;
  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: 13.5px;
}

.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-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-size: 12.5px;
  color: var(--brand-muted);
}

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

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

.pkp_navigation_primary a,
.pkp_navigation_primary li a,
.pkp_navigation_search_wrapper a,
.pkp_search a,
.pkp_site_nav_wrapper a {
  color: #FFFFFF !important;
}

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

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

.pkp_navigation_primary li li a {
  color: #FFFFFF;
}

/* ============================================================
   Title band — paint brand colour independent of theme Colour
   (Manuscript theme leaves .pkp_structure_head on its own field)
   ============================================================ */

.pkp_structure_head,
.pkp_head_wrapper,
.pkp_site_name_wrapper {
  background: var(--brand-header) !important;
}

.pkp_site_name a,
.pkp_site_name .is_text {
  color: #FFFFFF !important;
}

/* ============================================================
   Full-bleed header + footer (break out of centered page wrapper)
   ============================================================ */

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

.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; }
}
@media (max-width: 460px) {
  .wru-footer { grid-template-columns: 1fr; }
}

/* ------------------------------------------------------------
   NOTE: footer HTML must use the generic class "wru-footer"
   (and "wru-footer-bottom"), not a per-journal class.
   Header band colour is set here; also set it in
   Appearance > Setup > Colour (#000000) for JHAI.
   ------------------------------------------------------------ */