/* ==========================================================================
   BJEAS — Custom journal stylesheet (OJS 3.5, Default theme)
   Design: minimal, modern, eye-catching, with a distinct Borneo identity.
   Brand palette (Visual Identity Guideline):
     Borneo Deep Green  #0B6E4F  (primary)
     River Blue         #1F4E79  (secondary)
     Amber Coal         #E0A106  (accent, used sparingly)
     Ivory              #F7F5EF  (soft background tint)
     Neutral Grey       #4A4A4A  (muted text)
   Notes for the implementer:
   - Upload via Settings > Website > Appearance > Advanced > Journal style sheet.
   - If any selector below does not match this OJS version it simply has no
     effect; nothing here changes page structure, only presentation.
   - Never add ISSN / DOI / indexing claims here — those are content, not style.
   ========================================================================== */

/* ---------- Base typography & reading comfort ---------- */
body {
  font-family: "Noto Sans", "Segoe UI", Arial, sans-serif;
  color: #22312c;
  line-height: 1.65;
}

h1, h2, h3 {
  color: #1f4e79;
  letter-spacing: -0.01em;
}

.pkp_structure_main a {
  color: #0b6e4f;
}

.pkp_structure_main a:hover,
.pkp_structure_main a:focus {
  color: #149c71;
}

/* ---------- Header: never let the logo overflow again ----------
   The old 2400x600 banner overflowed on phones because its height was
   unconstrained. These caps keep ANY logo inside the header on every
   screen width. */
.pkp_site_name img,
.pkp_site_name .is_img img,
.pkp_site_name_wrapper img {
  max-height: 76px !important;
  width: auto !important;
  max-width: 100% !important;
  height: auto !important;
}

.pkp_structure_head {
  background: #ffffff;
  border-bottom: 3px solid #0b6e4f;
}

/* Thin amber accent line under the header for a distinctive finish */
.pkp_head_wrapper {
  border-bottom: 2px solid #e0a106;
}

/* ---------- Primary navigation: deep green, white text ---------- */
.pkp_navigation_primary,
.pkp_site_nav_menu,
.pkp_nav_list {
  background: #0b6e4f;
}

.pkp_navigation_primary a,
.pkp_navigation_primary_wrapper a,
.pkp_nav_list a,
.pkp_site_nav_menu a {
  color: #ffffff;
}

.pkp_navigation_primary a:hover,
.pkp_navigation_primary a:focus,
.pkp_nav_list a:hover,
.pkp_nav_list a:focus {
  color: #ffffff;
  background: #149c71;
  text-decoration: none;
}

.pkp_navigation_primary li.active a,
.pkp_nav_list li.active a {
  box-shadow: inset 0 -3px 0 #e0a106;
}

/* Mobile menu toggle stays visible and tappable */
.pkp_site_nav_toggle {
  color: #0b6e4f;
}

/* ---------- Buttons: pill-shaped, green, clear affordance ---------- */
.cmp_button,
.pkp_button,
button.cmp_button {
  background: #0b6e4f;
  border: 1px solid #0b6e4f;
  color: #ffffff;
  border-radius: 999px;
  padding: 0.6em 1.4em;
  font-weight: 600;
}

.cmp_button:hover,
.cmp_button:focus,
.pkp_button:hover,
.pkp_button:focus {
  background: #149c71;
  border-color: #149c71;
  color: #ffffff;
  text-decoration: none;
}

/* Secondary / quiet buttons keep the outline style */
.cmp_button.is_link,
.pkp_button.is_link {
  background: transparent;
  color: #0b6e4f;
}

/* ---------- Sidebar blocks: calm, scannable, on-brand ---------- */
.pkp_block {
  border: 1px solid #e3e8e5;
  border-radius: 12px;
  padding: 1em 1.1em;
  background: #ffffff;
}

.pkp_block .title {
  color: #0b6e4f;
  font-size: 0.82em;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  border-bottom: 2px solid #e0a106;
  padding-bottom: 0.45em;
  margin-bottom: 0.7em;
}

.pkp_block ul li {
  margin-bottom: 0.35em;
}

/* ---------- Issue & article summaries as soft cards ---------- */
.obj_issue_summary,
.obj_article_summary {
  border: 1px solid #e3e8e5;
  border-radius: 12px;
  padding: 1em 1.2em;
  background: #ffffff;
}

.obj_issue_summary .title,
.obj_article_summary .title {
  color: #1f4e79;
}

/* ---------- Page headings: clear hierarchy, generous air ---------- */
.page > h1,
.pkp_page_title {
  color: #1f4e79;
  border-bottom: 2px solid #f7f5ef;
  padding-bottom: 0.4em;
}

/* About / summary text on the homepage: comfortable measure */
.pkp_structure_main .about_section,
.homepage_about {
  max-width: 68ch;
}

/* ---------- Footer: deep green, quiet, distinctive ---------- */
.pkp_structure_footer_wrapper {
  background: #0b6e4f;
  color: #ffffff;
}

.pkp_structure_footer_wrapper a {
  color: #ffffff;
  text-decoration: underline;
}

/* ---------- Small screens: keep the brand visible, nothing clipped ---------- */
@media (max-width: 768px) {
  .pkp_site_name img,
  .pkp_site_name .is_img img {
    max-height: 54px !important;
  }

  .pkp_structure_main {
    padding-left: 0.9em;
    padding-right: 0.9em;
  }

  h1 {
    font-size: 1.5em;
    line-height: 1.25;
  }

  h2 {
    font-size: 1.25em;
  }

  .cmp_button,
  .pkp_button {
    width: 100%;
    text-align: center;
  }
}