/* Copyright (c) 2019-2026 Yananto Mihadi Putra */
/* JTM — warna cover: navy, biru teknik, biru muda, putih, kuning.
   Stylesheet tambahan untuk tema default OJS 3 (kelas pkp_*).
   Lebar container mengikuti tema OJS yang sedang digunakan. */
:root {
  --jtm-navy: #080878;
  --jtm-blue: #2455a4;
  --jtm-sky: #5995d8;
  --jtm-pale: #eaf3f8;
  --jtm-yellow: #ffe354;
  --jtm-ink: #243348;
  --jtm-line: #d6e1ed;
}
body {
  color: var(--jtm-ink);
  background: #edf3fa;
  background-image: linear-gradient(120deg, #dae7f7 0%, #f4f8fc 60%, #e4f0f3 100%);
}
a { color: var(--jtm-blue); }
a:hover, a:focus { color: var(--jtm-navy); text-decoration: underline; }
a:focus-visible, button:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible {
  outline: 3px solid var(--jtm-blue);
  outline-offset: 3px;
}
.pkp_structure_page {
  margin-top: 20px !important;
  margin-bottom: 20px !important;
  background: #fff;
  box-shadow: 0 6px 28px rgba(8, 8, 120, .12);
}
/* Header image tetap proporsional dan mengikuti lebar header. */
.pkp_head_wrapper {
  background: linear-gradient(110deg, #2455a4 0%, #5995d8 52%, #dbeef0 100%);
}
.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(--jtm-navy);
  font-weight: 700;
}
/* Navigasi utama dan menu pengguna. */
.pkp_navigation_primary_row {
  background: var(--jtm-navy);
  border-bottom: 4px solid var(--jtm-yellow);
}
.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(--jtm-yellow);
  border-color: var(--jtm-yellow);
  background: #15158c;
}
.pkp_navigation_primary ul {
  background: #fff;
  border: 1px solid var(--jtm-line);
  border-top: 3px solid var(--jtm-yellow);
}
.pkp_navigation_primary ul a { color: var(--jtm-navy); }
.pkp_navigation_primary ul a:hover,
.pkp_navigation_primary ul a:focus {
  color: var(--jtm-navy);
  background: var(--jtm-pale);
  border-color: var(--jtm-blue);
}
.pkp_navigation_user_wrapper { background: var(--jtm-navy); }
.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(--jtm-yellow); }
.pkp_navigation_user ul { background: #fff; }
.pkp_navigation_user ul a { color: var(--jtm-navy); }
.pkp_navigation_user ul a:hover,
.pkp_navigation_user ul a:focus { color: var(--jtm-navy); background: var(--jtm-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(--jtm-yellow); }
.pkp_site_nav_toggle { color: var(--jtm-navy); }
.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(--jtm-navy);
}
.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(--jtm-yellow);
  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(--jtm-line); }
.obj_article_summary .authors, .obj_article_summary .pages { color: #526177; }
.cmp_button, .cmp_form .buttons button, .pkp_button,
.cmp_button_wire, .obj_galley_link, .block_make_submission a {
  background: var(--jtm-navy);
  color: #fff;
  border: 1px solid var(--jtm-navy);
  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(--jtm-yellow);
  color: var(--jtm-navy);
  border-color: var(--jtm-navy);
  text-decoration: none;
}
.pkp_block .title {
  display: block;
  padding: 12px 14px;
  color: #fff;
  background: linear-gradient(100deg, var(--jtm-navy), var(--jtm-blue));
  border-bottom: 3px solid var(--jtm-yellow);
  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(--jtm-navy), var(--jtm-blue));
  color: #fff;
  border-bottom: 3px solid var(--jtm-yellow);
}
.hoverTable td {
  padding: 0;
  min-height: 36px;
  vertical-align: middle;
  border-bottom: 1px solid var(--jtm-line);
  text-align: center;
  overflow-wrap: anywhere;
  background: #f0f6fc;
  color: var(--jtm-navy);
}
.hoverTable tr:nth-child(even) td { background: #e4eef9; }
.hoverTable td a {
  display: block;
  padding: 10px 12px;
  color: var(--jtm-navy);
  text-decoration: none;
}
.hoverTable td:hover, .hoverTable td:focus-within { background: var(--jtm-yellow); }
.hoverTable td a:hover, .hoverTable td a:focus {
  color: var(--jtm-navy);
  text-decoration: underline;
}
.pkp_structure_footer_wrapper {
  background: var(--jtm-navy);
  border-top: 5px solid var(--jtm-yellow);
  color: #fff;
}
.pkp_structure_footer_wrapper a { color: var(--jtm-yellow); }
.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 navy. */
.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(--jtm-navy); }
.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: #242496; }

/* 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(--jtm-navy);
}
