/* Copyright (c) 2019-2026 Yananto Mihadi Putra */
/* MIX — warna cover: marun, hijau zaitun, kuning emas, putih.
   Stylesheet tambahan untuk tema default OJS 3 (kelas pkp_*).
   Lebar container mengikuti tema OJS yang sedang digunakan. */
:root {
  --mix-maroon: #882f30;
  --mix-link: #762728;
  --mix-olive: #84a431;
  --mix-pale: #f4f6eb;
  --mix-gold: #ffc247;
  --mix-ink: #303030;
  --mix-line: #e2dfd8;
}
body {
  color: var(--mix-ink);
  background: #f3f2ee;
  background-image: linear-gradient(120deg, #e9ecdE 0%, #faf9f6 60%, #f1e7e4 100%);
}
a { color: var(--mix-link); }
a:hover, a:focus { color: var(--mix-maroon); text-decoration: underline; }
a:focus-visible, button:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible {
  outline: 3px solid var(--mix-link);
  outline-offset: 3px;
}
.pkp_structure_page {
  margin-top: 20px !important;
  margin-bottom: 20px !important;
  background: #fff;
  box-shadow: 0 6px 28px rgba(85, 29, 29, .12);
}
/* Header image tetap proporsional dan mengikuti lebar header. */
.pkp_head_wrapper {
  background: #ffffff;
  border-top: 5px solid var(--mix-maroon);
}
.pkp_site_name_wrapper { padding-left: 0; padding-right: 0; }
.pkp_site_name { margin: 0; padding: 0; white-space: normal; }
.pkp_site_name .is_img { display: block; margin: 0; padding: 0; }
.pkp_site_name .is_img img, .pkp_sitename .is_img img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  max-height: none;
  margin: 0;
}
.pkp_site_name > a:not(.is_img) {
  display: block;
  padding: 24px;
  color: var(--mix-maroon);
  font-weight: 700;
}
/* Navigasi utama dan menu pengguna. */
.pkp_navigation_primary_row {
  background: var(--mix-maroon);
  border-bottom: 4px solid var(--mix-gold);
}
.pkp_navigation_primary_wrapper { background: transparent; }
.pkp_navigation_primary { margin-top: 0; margin-bottom: 0; }
.pkp_navigation_primary > li > a {
  color: #fff;
  border-color: transparent;
}
.pkp_navigation_primary > li > a:hover,
.pkp_navigation_primary > li > a:focus,
.pkp_navigation_primary > li:hover > a,
.pkp_navigation_primary > li:focus-within > a {
  color: var(--mix-gold);
  border-color: var(--mix-gold);
  background: #591e1e;
}
.pkp_navigation_primary ul {
  background: #fff;
  border: 1px solid var(--mix-line);
  border-top: 3px solid var(--mix-gold);
}
.pkp_navigation_primary ul a { color: var(--mix-maroon); }
.pkp_navigation_primary ul a:hover,
.pkp_navigation_primary ul a:focus {
  color: var(--mix-maroon);
  background: var(--mix-pale);
  border-color: var(--mix-link);
}
.pkp_navigation_user_wrapper { background: var(--mix-maroon); }
.pkp_navigation_user { margin-right: 0; padding-right: 16px; }
.pkp_navigation_user > li > a { color: #fff; }
.pkp_navigation_user > li > a:hover,
.pkp_navigation_user > li > a:focus { color: var(--mix-gold); }
.pkp_navigation_user ul { background: #fff; }
.pkp_navigation_user ul a { color: var(--mix-maroon); }
.pkp_navigation_user ul a:hover,
.pkp_navigation_user ul a:focus { color: var(--mix-maroon); background: var(--mix-pale); }
.pkp_head_wrapper .pkp_search .search_controls,
.pkp_head_wrapper .pkp_search .search_controls a { color: #fff; }
.pkp_head_wrapper .pkp_search .search_controls:hover,
.pkp_head_wrapper .pkp_search .search_controls:focus { color: var(--mix-gold); }
.pkp_site_nav_toggle { color: var(--mix-maroon); }
.pkp_structure_main h1, .pkp_structure_main h2,
.pkp_structure_main h3, .obj_article_summary .title a,
.obj_issue_summary .title, .obj_issue_summary .title a {
  color: var(--mix-maroon);
}
.pkp_page_index .current_issue > h2,
.pkp_page_index .additional_content > h2,
.obj_issue_toc .galleys > h2,
.obj_issue_toc .section > h2 {
  border-bottom: 3px solid var(--mix-olive);
  padding-bottom: 10px;
}
.obj_article_details .abstract {
  text-align: justify;
  font-family: Arial, Helvetica, sans-serif;
  line-height: 1.75;
}
.obj_article_summary { border-bottom: 1px solid var(--mix-line); }
.obj_article_summary .authors, .obj_article_summary .pages { color: #62605b; }
.cmp_button, .cmp_form .buttons button, .pkp_button,
.cmp_button_wire, .obj_galley_link, .block_make_submission a {
  background: var(--mix-maroon);
  color: #fff;
  border: 1px solid var(--mix-maroon);
  border-radius: 4px;
  text-shadow: none;
  box-shadow: none;
}
.cmp_button:hover, .cmp_button:focus,
.cmp_form .buttons button:hover, .cmp_form .buttons button:focus,
.pkp_button:hover, .pkp_button:focus,
.cmp_button_wire:hover, .cmp_button_wire:focus,
.obj_galley_link:hover, .obj_galley_link:focus,
.block_make_submission a:hover, .block_make_submission a:focus {
  background: var(--mix-gold);
  color: var(--mix-maroon);
  border-color: var(--mix-maroon);
  text-decoration: none;
}
.pkp_block .title {
  display: block;
  padding: 12px 14px;
  color: #fff;
  background: linear-gradient(100deg, var(--mix-maroon), var(--mix-link));
  border-bottom: 3px solid var(--mix-gold);
  font-weight: 700;
}
.pkp_block .content { padding-top: 12px; }
/* Menu tambahan kanan yang sudah menggunakan kelas hoverTable. */
.hoverTable { width: 100%; border-collapse: collapse; }
.hoverTable th {
  padding: 10px 12px;
  background: linear-gradient(100deg, var(--mix-maroon), var(--mix-link));
  color: #fff;
  border-bottom: 3px solid var(--mix-gold);
}
.hoverTable td {
  padding: 0;
  min-height: 36px;
  vertical-align: middle;
  border-bottom: 1px solid var(--mix-line);
  text-align: center;
  overflow-wrap: anywhere;
  background: #f7f6f0;
  color: var(--mix-maroon);
}
.hoverTable tr:nth-child(even) td { background: #edf1e1; }
.hoverTable td a {
  display: block;
  padding: 10px 12px;
  color: var(--mix-maroon);
  text-decoration: none;
}
.hoverTable td:hover, .hoverTable td:focus-within { background: var(--mix-gold); }
.hoverTable td a:hover, .hoverTable td a:focus {
  color: var(--mix-maroon);
  text-decoration: underline;
}
.pkp_structure_footer_wrapper {
  background: var(--mix-maroon);
  border-top: 5px solid var(--mix-gold);
  color: #fff;
}
.pkp_structure_footer_wrapper a { color: var(--mix-gold); }
.pkp_structure_footer_wrapper a:hover,
.pkp_structure_footer_wrapper a:focus { color: #fff; }
.pkp_footer_content { padding-top: 24px; padding-bottom: 24px; }
.pkp_brand_footer { padding-top: 20px; padding-bottom: 20px; }
.pkp_brand_footer a { display: inline-block; padding: 10px; background: #fff; border-radius: 4px; }
@media (min-width: 992px) {
  .pkp_site_name { position: relative; width: 100%; font-size: 2em; }
}
@media (max-width: 991px) {
  .pkp_structure_page { margin-top: 0 !important; margin-bottom: 0 !important; }
  .pkp_navigation_primary > li > a { padding-left: 16px; padding-right: 16px; }
  .pkp_navigation_user { padding-right: 8px; }
  .pkp_site_name > a:not(.is_img) { padding: 16px; }
}
@media (max-width: 479px) {
  .hoverTable td a { padding: 10px 8px; }
  .obj_article_details .abstract { text-align: left; }
}

/* Teks navigasi putih pada semua status; submenu berlatar marun. */
.pkp_navigation_primary > li > a,
.pkp_navigation_primary > li > a:hover,
.pkp_navigation_primary > li > a:focus,
.pkp_navigation_primary > li:hover > a,
.pkp_navigation_primary > li:focus-within > a,
.pkp_navigation_primary ul a,
.pkp_navigation_primary ul a:hover,
.pkp_navigation_primary ul a:focus,
.pkp_navigation_user > li > a,
.pkp_navigation_user > li > a:hover,
.pkp_navigation_user > li > a:focus,
.pkp_navigation_user ul a,
.pkp_navigation_user ul a:hover,
.pkp_navigation_user ul a:focus,
.pkp_head_wrapper .pkp_search .search_controls,
.pkp_head_wrapper .pkp_search .search_controls:hover,
.pkp_head_wrapper .pkp_search .search_controls:focus,
.pkp_head_wrapper .pkp_search .search_controls a {
  color: #fff;
}
.pkp_navigation_primary ul,
.pkp_navigation_user ul { background: var(--mix-maroon); }
.pkp_navigation_primary ul a:hover,
.pkp_navigation_primary ul a:focus,
.pkp_navigation_user ul a:hover,
.pkp_navigation_user ul a:focus { background: #591e1e; }

/* Prioritas warna navigasi header terhadap aturan bawaan OJS. */
#headerNavigationContainer .pkp_navigation_primary a,
#headerNavigationContainer .pkp_navigation_primary a:link,
#headerNavigationContainer .pkp_navigation_primary a:visited,
#headerNavigationContainer .pkp_navigation_primary a:hover,
#headerNavigationContainer .pkp_navigation_primary a:focus,
#headerNavigationContainer .pkp_navigation_primary a:active,
.pkp_head_wrapper .pkp_navigation_primary a,
.pkp_head_wrapper .pkp_navigation_primary a:visited,
.pkp_head_wrapper .pkp_navigation_primary a:hover,
.pkp_head_wrapper .pkp_navigation_primary a:focus,
.pkp_head_wrapper .pkp_navigation_user a,
.pkp_head_wrapper .pkp_navigation_user a:visited,
.pkp_head_wrapper .pkp_navigation_user a:hover,
.pkp_head_wrapper .pkp_navigation_user a:focus,
.pkp_head_wrapper .pkp_search .search_controls,
.pkp_head_wrapper .pkp_search .search_controls a,
.pkp_head_wrapper .pkp_site_nav_toggle {
  color: #ffffff !important;
}
#headerNavigationContainer .pkp_navigation_primary a *,
.pkp_head_wrapper .pkp_navigation_primary a *,
.pkp_head_wrapper .pkp_navigation_user a *,
.pkp_head_wrapper .pkp_search .search_controls * {
  color: inherit !important;
}
.pkp_head_wrapper .pkp_site_nav_toggle {
  background-color: var(--mix-maroon);
}

/* Aksen hijau zaitun mengikuti elemen geometris cover MIX. */
.pkp_structure_sidebar .pkp_block { border-bottom: 2px solid var(--mix-olive); }
.pkp_structure_footer_wrapper { border-top-color: var(--mix-olive); }
.pkp_navigation_primary_row { border-bottom-color: var(--mix-gold); }
.pkp_head_wrapper .pkp_navigation_primary a:focus-visible,
.pkp_head_wrapper .pkp_navigation_user a:focus-visible {
  outline: 3px solid var(--mix-gold);
  outline-offset: -3px;
}
