/*
 * ARCIKA JOURNAL — OJS 3.4 default theme
 * Site-wide stylesheet for the portal, JMSI and JAIS.
 * Replace the current SITE stylesheet with this file. Do not append it to
 * the old stylesheet: its broad !important rules force dark backgrounds.
 * The JMSI journal stylesheet currently contains an older header patch;
 * this file loads after it and resets the conflicting dimensions.
 */

@import url("https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap");

:root {
  --arc-navy: #081b32;
  --arc-navy-2: #102e47;
  --arc-teal: #195d70;
  --arc-teal-2: #267e8b;
  --arc-gold: #d5ae53;
  --arc-ink: #172b3e;
  --arc-muted: #5c7080;
  --arc-surface: #ffffff;
  --arc-page: #f3f7f9;
  --arc-line: #dce7eb;
  --arc-shadow: 0 12px 32px rgba(12, 43, 64, .09);
}

html { scroll-behavior: smooth; }

body {
  margin: 0;
  background: var(--arc-page);
  color: var(--arc-ink);
  font: 400 15px/1.7 "Plus Jakarta Sans", "Segoe UI", Arial, sans-serif;
  overflow-wrap: break-word;
}

.pkp_structure_page {
  min-height: 100vh;
  background: radial-gradient(circle at 95% 14%, rgba(38, 126, 139, .09), transparent 30%),
              var(--arc-page);
}

/* Banner: retain the journal's own artwork and its natural proportions. */
#headerNavigationContainer.pkp_structure_head {
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  background: var(--arc-navy) !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: 0 7px 22px rgba(8, 27, 50, .16);
  overflow: visible !important;
  z-index: 20;
}

#headerNavigationContainer .pkp_head_wrapper,
#headerNavigationContainer .pkp_site_name_wrapper,
#headerNavigationContainer .pkp_site_name {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
  background: transparent !important;
}

#headerNavigationContainer .pkp_head_wrapper { position: relative; }
#headerNavigationContainer .pkp_site_name_wrapper { height: auto !important; }
#headerNavigationContainer .pkp_site_name {
  position: relative !important;
  overflow: visible !important;
  line-height: 0;
  white-space: normal !important;
}

#headerNavigationContainer .pkp_site_name > a,
#headerNavigationContainer .pkp_site_name .is_img {
  display: block !important;
  height: auto !important;
  max-height: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 0;
}

#headerNavigationContainer .pkp_site_name .is_img img {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: none !important;
  object-fit: contain !important;
  margin: 0 !important;
  border: 0 !important;
}

/* This also works if a future journal uses text instead of a banner image. */
#headerNavigationContainer .pkp_site_name .is_text {
  display: block;
  padding: 28px max(24px, calc((100vw - 1180px) / 2));
  color: #fff;
  font-weight: 800;
  line-height: 1.3;
}

/* Navigation and account links — separate from the artwork. */
#headerNavigationContainer .pkp_site_nav_menu {
  background: linear-gradient(105deg, var(--arc-navy), var(--arc-navy-2) 64%, #16495e);
  border-bottom: 3px solid var(--arc-gold);
  box-shadow: 0 5px 18px rgba(8, 27, 50, .13);
}

#headerNavigationContainer .pkp_navigation_primary > li > a,
#headerNavigationContainer .pkp_navigation_search_wrapper > a,
#headerNavigationContainer .pkp_navigation_user > li > a {
  color: #eff7fa !important;
  background: transparent !important;
  text-decoration: none !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: .01em;
  border: 0 !important;
  border-radius: 8px;
  text-shadow: none !important;
  white-space: nowrap;
}

#headerNavigationContainer .pkp_navigation_primary > li > a:hover,
#headerNavigationContainer .pkp_navigation_primary > li > a:focus,
#headerNavigationContainer .pkp_navigation_search_wrapper > a:hover,
#headerNavigationContainer .pkp_navigation_user > li > a:hover {
  color: #fff !important;
  background: rgba(255, 255, 255, .12) !important;
}

#headerNavigationContainer .pkp_nav_list ul {
  background: #fff !important;
  border: 1px solid var(--arc-line) !important;
  border-radius: 0 0 12px 12px !important;
  box-shadow: 0 14px 30px rgba(8, 27, 50, .16) !important;
}

#headerNavigationContainer .pkp_nav_list ul a {
  color: var(--arc-ink) !important;
  background: #fff !important;
  padding: 10px 16px !important;
  text-decoration: none !important;
}

#headerNavigationContainer .pkp_nav_list ul a:hover,
#headerNavigationContainer .pkp_nav_list ul a:focus {
  color: var(--arc-teal) !important;
  background: #eaf5f6 !important;
}

@media (min-width: 992px) {
  #headerNavigationContainer .pkp_site_nav_menu {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    display: flex !important;
    align-items: center;
    gap: 20px;
    width: 100% !important;
    min-height: 62px;
    margin: 0 !important;
    padding: 0 max(24px, calc((100vw - 1180px) / 2)) !important;
    box-sizing: border-box;
  }

  #headerNavigationContainer .pkp_navigation_primary_row {
    flex: 1 1 auto;
    width: auto !important;
    min-width: 0;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  #headerNavigationContainer .pkp_navigation_primary_wrapper {
    display: flex !important;
    align-items: center;
    width: 100% !important;
    min-height: 62px;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  #headerNavigationContainer .pkp_navigation_primary {
    display: flex !important;
    align-items: center;
    flex-wrap: wrap !important;
    gap: 4px;
    float: none !important;
    width: auto !important;
    max-width: none !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
  }

  #headerNavigationContainer .pkp_navigation_primary > li > a,
  #headerNavigationContainer .pkp_navigation_search_wrapper > a {
    display: inline-block;
    margin: 0 !important;
    padding: 9px 13px !important;
  }

  #headerNavigationContainer .pkp_navigation_search_wrapper {
    position: static !important;
    float: none !important;
    width: auto !important;
    margin: 0 0 0 auto !important;
    padding: 0 !important;
    border: 0 !important;
    transform: none !important;
  }

  #headerNavigationContainer .pkp_navigation_user_wrapper {
    position: static !important;
    width: auto !important;
    height: auto !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    z-index: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    transform: none !important;
    background: transparent !important;
  }

  #headerNavigationContainer .pkp_navigation_user { display: flex; gap: 7px; padding: 0; }
  #headerNavigationContainer .pkp_navigation_user > li { margin: 0 !important; }
  #headerNavigationContainer .pkp_navigation_user > li > a {
    display: inline-block;
    margin: 0 !important;
    padding: 7px 12px !important;
    border: 1px solid rgba(255, 255, 255, .28) !important;
  }
}

/* Reading area: broad, bright, and steady across index/issue/article pages. */
.pkp_structure_content {
  width: calc(100% - 40px) !important;
  max-width: 1220px !important;
  margin: 0 auto !important;
  padding: 34px 0 54px !important;
  box-sizing: border-box;
  background: transparent !important;
}

.pkp_structure_content.has_sidebar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 284px;
  align-items: start;
  gap: 26px;
}

.pkp_structure_main,
.pkp_structure_sidebar {
  float: none !important;
  min-width: 0;
  width: auto !important;
  margin: 0 !important;
  box-sizing: border-box;
}

.pkp_structure_main {
  padding: 30px clamp(20px, 3vw, 38px) 42px !important;
  background: var(--arc-surface) !important;
  color: var(--arc-ink) !important;
  border: 1px solid var(--arc-line) !important;
  border-radius: 18px !important;
  box-shadow: var(--arc-shadow) !important;
}

.pkp_structure_main:before,
.pkp_structure_main:after { display: none !important; }

.pkp_structure_main p,
.pkp_structure_main li,
.pkp_structure_sidebar p,
.pkp_structure_sidebar li { color: var(--arc-ink); }

.pkp_structure_main h1,
.pkp_structure_main h2,
.pkp_structure_main h3,
.pkp_structure_sidebar h2 {
  color: var(--arc-navy-2);
  font-family: "Plus Jakarta Sans", "Segoe UI", Arial, sans-serif;
  font-weight: 800;
  line-height: 1.3;
  text-shadow: none !important;
}

.pkp_structure_main h1 { font-size: clamp(25px, 3vw, 35px); }
.pkp_structure_main h2 { font-size: clamp(20px, 2.2vw, 26px); }
.pkp_structure_main h3 { font-size: clamp(17px, 1.7vw, 21px); }

.pkp_structure_main a,
.pkp_structure_sidebar a { color: var(--arc-teal); text-underline-offset: 3px; }
.pkp_structure_main a:hover,
.pkp_structure_sidebar a:hover { color: #0d4055; }

.pkp_structure_main :is(h1, h2, h3, h4, h5, h6) a { color: inherit; }
.pkp_structure_main :is(h1, h2, h3, h4, h5, h6) a:hover { color: var(--arc-teal); }

.pkp_structure_main :is(.page_title, .journals > h2, .current_issue > h2, .obj_issue_toc > h2) {
  position: relative;
  padding-bottom: 15px;
  margin-bottom: 26px;
  border-bottom: 1px solid var(--arc-line);
}

.pkp_structure_main :is(.page_title, .journals > h2, .current_issue > h2, .obj_issue_toc > h2)::after {
  content: "";
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 62px;
  height: 3px;
  border-radius: 3px;
  background: linear-gradient(90deg, var(--arc-gold), var(--arc-teal-2));
}

/* Portal journal directory: generous covers, clean information cards. */
.page_index_site .journals { margin-top: 0; }
.page_index_site .journals > h2 {
  position: relative !important;
  width: auto !important;
  height: auto !important;
  overflow: visible !important;
  clip: auto !important;
  clip-path: none !important;
  white-space: normal !important;
  margin: 0 0 26px !important;
}
.page_index_site .journals > ul { list-style: none; padding: 0; margin: 0; }

.page_index_site .journals > ul > li {
  display: grid;
  grid-template-columns: 176px minmax(0, 1fr);
  gap: 25px;
  align-items: start;
  margin: 0 0 22px !important;
  padding: 25px !important;
  background: #fff;
  border: 1px solid var(--arc-line);
  border-radius: 16px;
  box-shadow: 0 8px 23px rgba(12, 43, 64, .06);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.page_index_site .journals > ul > li:hover {
  transform: translateY(-2px);
  border-color: #b5d4da;
  box-shadow: 0 16px 34px rgba(12, 43, 64, .12);
}

.page_index_site .journals .thumb,
.page_index_site .journals .thumb + .body {
  float: none !important;
  width: auto !important;
  padding: 0 !important;
}

.page_index_site .journals .thumb img {
  width: 100%;
  height: auto;
  max-height: 260px;
  object-fit: contain;
  background: #f7f9fa;
  border-radius: 10px;
  border: 1px solid #e8eef0;
}

.page_index_site .journals h3 {
  margin: 0 0 12px;
  font-size: clamp(20px, 2vw, 25px);
  line-height: 1.35;
}

.page_index_site .journals .description { color: var(--arc-muted); font-size: 14px; }
.page_index_site .journals .description p { margin: 0 0 11px; }
.page_index_site .journals .links { margin: 18px 0 0; padding: 0; }
.page_index_site .journals .links li { margin: 0 8px 8px 0; }

/* Shared card treatment for future issues, articles and announcements. */
.page_index_journal > :not(:empty) + :not(:empty) { margin-top: 28px; }
.page_index_journal .additional_content,
.page_index_journal .journal-description { line-height: 1.8; }
.page_index_journal .additional_content img,
.pkp_structure_main .page img { max-width: 100%; height: auto; }

.obj_issue_toc .section,
.obj_issue_summary,
.obj_article_summary,
.cmp_announcements > li,
.page_index_journal .current_issue,
.page_index_journal .cmp_announcements {
  border: 1px solid var(--arc-line);
  border-radius: 14px;
  background: #fff;
}

.obj_article_summary,
.obj_issue_summary,
.cmp_announcements > li {
  padding: 18px 20px !important;
  margin: 0 0 14px !important;
  box-shadow: 0 5px 16px rgba(12, 43, 64, .045);
}

.obj_issue_toc .section {
  margin: 20px 0 !important;
  padding: 20px !important;
}

.obj_issue_toc .section:before { display: none !important; }
.obj_issue_toc .section > h2,
.obj_issue_toc .section > h3 {
  left: auto !important;
  margin: 0 0 15px !important;
  padding: 0 !important;
  color: var(--arc-navy-2) !important;
  font-weight: 800 !important;
}

.obj_article_summary .title,
.obj_article_summary .title a { color: var(--arc-navy-2); font-weight: 800; }
.obj_article_summary .authors,
.obj_article_summary .pages,
.obj_issue_summary .description { color: var(--arc-muted); }

.page_index_journal .current_issue,
.page_index_journal .cmp_announcements { padding: 21px; }
.page_index_journal .current_issue .obj_issue_toc,
.page_index_journal .cmp_announcements ul { margin-bottom: 0; }

/* Sidebar stays calm and useful, with a prominent submission action. */
.pkp_structure_sidebar .pkp_block {
  margin: 0 0 18px !important;
  padding: 16px !important;
  background: #fff !important;
  color: var(--arc-ink) !important;
  border: 1px solid var(--arc-line) !important;
  border-radius: 15px !important;
  box-shadow: var(--arc-shadow) !important;
}

.pkp_structure_sidebar .pkp_block .title {
  margin: -16px -16px 16px;
  padding: 12px 16px;
  color: #fff !important;
  font-size: 14px;
  letter-spacing: .02em;
  border: 0 !important;
  border-radius: 14px 14px 0 0;
  background: linear-gradient(115deg, var(--arc-navy-2), var(--arc-teal));
}

.pkp_structure_sidebar .pkp_block ul { padding-left: 20px; }
.pkp_structure_sidebar .pkp_block li { padding: 2px 0; }
.pkp_structure_sidebar .pkp_block img { max-width: 100%; height: auto; }
.pkp_structure_sidebar .block_web_feed ul { display: flex; flex-wrap: wrap; gap: 8px; padding: 0; list-style: none; }
.pkp_structure_sidebar .block_web_feed li { padding: 0; }

/* Links that OJS renders as buttons. */
.pkp_structure_main :is(.cmp_button, .pkp_button, .obj_galley_link, .galley_link),
.pkp_structure_main input[type="submit"],
.pkp_structure_main button[type="submit"],
.pkp_structure_sidebar .block_make_submission_link,
.page_index_site .journals .links a {
  display: inline-block;
  padding: 10px 17px !important;
  color: #fff !important;
  background: linear-gradient(120deg, #164a62, #21788b) !important;
  border: 1px solid transparent !important;
  border-radius: 9px !important;
  box-shadow: 0 5px 13px rgba(22, 74, 98, .15);
  font: 700 13px/1.35 "Plus Jakarta Sans", "Segoe UI", Arial, sans-serif;
  text-decoration: none !important;
  cursor: pointer;
  transition: filter .18s ease, transform .18s ease;
}

.pkp_structure_main :is(.cmp_button, .pkp_button, .obj_galley_link, .galley_link):hover,
.pkp_structure_main input[type="submit"]:hover,
.pkp_structure_main button[type="submit"]:hover,
.pkp_structure_sidebar .block_make_submission_link:hover,
.page_index_site .journals .links a:hover {
  filter: brightness(1.1);
  transform: translateY(-1px);
}

.page_index_site .journals .links .current a {
  color: var(--arc-navy-2) !important;
  background: #fff !important;
  border-color: #b6ced4 !important;
  box-shadow: none;
}

.pkp_structure_main input:not([type="submit"]),
.pkp_structure_main textarea,
.pkp_structure_main select {
  max-width: 100%;
  color: var(--arc-ink);
  background: #fff;
  border: 1px solid #c7d8dd;
  border-radius: 8px;
}

.pkp_structure_main :is(input, textarea, select):focus {
  border-color: var(--arc-teal-2);
  box-shadow: 0 0 0 3px rgba(38, 126, 139, .14);
}

.pkp_structure_main table { max-width: 100%; border-color: var(--arc-line); }
.pkp_structure_main th { background: #edf4f5; color: var(--arc-navy-2); }
.pkp_structure_main td { border-color: var(--arc-line); }

/* Footer: preserve the publisher details, map and OJS attribution. */
.pkp_structure_footer_wrapper {
  background: linear-gradient(120deg, #071a2f, #103b52) !important;
  border-top: 3px solid var(--arc-gold);
  color: #dceaf0;
}

.pkp_structure_footer {
  width: calc(100% - 40px) !important;
  max-width: 1180px !important;
  margin: 0 auto !important;
  padding: 30px 0 !important;
  box-sizing: border-box;
}

.pkp_structure_footer p,
.pkp_structure_footer strong { color: #e9f2f5; }
.pkp_structure_footer a { color: #f3d37f; }
.pkp_structure_footer a:hover { color: #fff; }
.pkp_structure_footer iframe { max-width: 100%; border: 0; border-radius: 10px; }
.pkp_brand_footer { border-color: rgba(255, 255, 255, .2) !important; }

/* Keyboard navigation remains visible against both dark and light areas. */
:where(a, button, input, select, textarea):focus-visible {
  outline: 3px solid var(--arc-gold) !important;
  outline-offset: 3px;
}

@media (max-width: 991px) {
  #headerNavigationContainer .pkp_site_name_wrapper {
    position: relative;
    padding-bottom: 46px !important;
    background: var(--arc-navy-2) !important;
  }

  #headerNavigationContainer .pkp_site_name .is_img img {
    width: 100% !important;
    height: clamp(112px, 25vw, 175px) !important;
    max-height: none !important;
    object-fit: cover !important;
    object-position: center !important;
  }

  #headerNavigationContainer .pkp_site_nav_toggle {
    position: absolute !important;
    top: auto !important;
    bottom: 0 !important;
    left: 12px !important;
    width: 104px !important;
    height: 46px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  #headerNavigationContainer .pkp_site_nav_toggle > span { left: 24px !important; }
  #headerNavigationContainer .pkp_site_nav_toggle::after {
    content: "Menu";
    position: absolute;
    top: 50%;
    left: 48px;
    transform: translateY(-50%);
    color: #fff;
    font: 700 13px "Plus Jakarta Sans", "Segoe UI", Arial, sans-serif;
  }

  #headerNavigationContainer .pkp_site_nav_menu {
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    display: none;
    width: 100% !important;
    max-height: min(70vh, 600px);
    overflow-y: auto;
    margin: 0 !important;
    padding: 12px 18px 18px !important;
    box-sizing: border-box;
    z-index: 9999;
  }

  #headerNavigationContainer .pkp_site_nav_menu--isOpen { display: block !important; }
  #headerNavigationContainer .pkp_navigation_primary_row,
  #headerNavigationContainer .pkp_navigation_primary_wrapper,
  #headerNavigationContainer .pkp_navigation_primary {
    position: static !important;
    display: block !important;
    width: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  #headerNavigationContainer .pkp_navigation_primary > li { display: block !important; }
  #headerNavigationContainer .pkp_navigation_primary > li > a,
  #headerNavigationContainer .pkp_navigation_search_wrapper > a,
  #headerNavigationContainer .pkp_navigation_user > li > a {
    display: block !important;
    width: 100%;
    margin: 0 !important;
    padding: 9px 10px !important;
    box-sizing: border-box;
  }

  #headerNavigationContainer .pkp_navigation_search_wrapper,
  #headerNavigationContainer .pkp_navigation_user_wrapper {
    position: static !important;
    width: 100% !important;
    height: auto !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
    transform: none !important;
    background: transparent !important;
    border: 0 !important;
  }

  #headerNavigationContainer .pkp_navigation_user { margin-top: 12px; padding: 10px 0 0; border-top: 1px solid rgba(255, 255, 255, .2); }
  #headerNavigationContainer .pkp_nav_list ul {
    position: static !important;
    display: block !important;
    width: 100% !important;
    margin: 0 0 5px 10px !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  #headerNavigationContainer .pkp_nav_list ul a { color: #e2eef2 !important; background: transparent !important; }
  .pkp_structure_content.has_sidebar { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 600px) {
  .pkp_structure_content { width: calc(100% - 24px) !important; padding: 18px 0 34px !important; }
  .pkp_structure_main { padding: 20px 16px 28px !important; border-radius: 13px !important; }
  .page_index_site .journals > ul > li {
    grid-template-columns: minmax(0, 1fr);
    gap: 15px;
    padding: 17px !important;
  }
  .page_index_site .journals .thumb { width: min(180px, 60%) !important; }
  .pkp_structure_footer { width: calc(100% - 32px) !important; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .page_index_site .journals > ul > li,
  .pkp_structure_main a,
  .pkp_structure_sidebar a { transition: none !important; }
}