/* =========================================================
   HTAS - TAMPILAN OJS FORMAL (CSS FINAL v6 - EB Garamond + Inter, teks rata kanan-kiri)
   Upload sebagai Journal style sheet. File ini MENGGANTIKAN CSS lama.
   ========================================================= */

/* Font: EB Garamond (judul) + Inter (antarmuka). Baris @import harus tetap paling atas. */
@import url("https://fonts.googleapis.com/css2?family=EB+Garamond:wght@400;500;600;700&family=Inter:wght@400;500;600;700&display=swap");

:root {
  --htas-green: #2B5240;
  --htas-green-deep: #1F4535;
  --htas-ink: #1F2D26;
  --htas-cream: #F6F4EC;
  --htas-paper: #FBFAF5;
  --htas-line: #E6E8DC;
  --htas-chip: #E8EBDD;
  --htas-gold: #C8A15A;
  --htas-serif: "EB Garamond", Georgia, serif;
  --htas-sans: "Inter", Arial, sans-serif;

  /* Tinggi baris atas header (logo + akun) */
  --htas-head-h: 106px;

  /* Posisi tengah teks P-ISSN/E-ISSN pada gambar logo, dihitung dari tepi kiri logo,
     dalam satuan "kali tinggi logo". Geser ke kiri: kecilkan angka. Ke kanan: besarkan. */
  --htas-issn-k: 8.4;

  /* Ornamen (opsional). Isi dengan url("LINK-GAMBAR") bila sudah ada.
     Contoh: --htas-header-orn: url("https://.../header.png"); */
  --htas-header-orn: url("https://drive.pastibisa.app/324_qlULp6JFwC4nUbGY7PTZW0FJgQqmSXUx345WMF9m.png");
  --htas-block-orn: none;

  /* Background halaman (area kosong kiri-kanan di luar konten & sidebar) */
  --htas-page-bg: url("https://drive.pastibisa.app/324_mTFDboxdmZ5E257yGwECNf6EPbS8071AWLyhuQkE.png");
}

/* =========================================================
   1. DASAR HALAMAN
   ========================================================= */
html {
  background: var(--htas-cream) var(--htas-page-bg) center top / cover no-repeat fixed !important;
}

html, body {
  color: var(--htas-ink);
  font-family: var(--htas-sans);
}

body {
  background: transparent !important;
  background-image: none !important;
}

.pkp_brand_footer { display: none; }

.pkp_structure_page {
  max-width: none !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* =========================================================
   2. HEADER (logo + akun di atas, menu di bawah)
   ========================================================= */
.pkp_structure_head {
  position: relative;
  z-index: 100;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background:
    linear-gradient(to bottom, #EEF0E4 0, #EEF0E4 var(--htas-head-h), var(--htas-paper) var(--htas-head-h)) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--htas-line) !important;
}

/* Banner ornamen: selalu selebar header, ikut zoom in/out, terpotong dari tengah */
.pkp_structure_head::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: var(--htas-head-h);
  background: var(--htas-header-orn) center center / cover no-repeat;
  pointer-events: none;
  z-index: 0;
}

.pkp_head_wrapper {
  position: relative;
  z-index: 1;
  box-sizing: border-box;
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 24px !important;
  background: transparent !important;
}

/* ---------- Logo: tampil utuh (tanpa mask/pudar), memenuhi satu baris header ---------- */
.pkp_site_name_wrapper,
.pkp_site_name,
.pkp_site_name a {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.pkp_site_name {
  display: flex !important;
  align-items: center;
  min-height: 0 !important;
  height: var(--htas-head-h);
}

.pkp_site_name a {
  display: flex !important;
  align-items: center;
  height: 100%;
  max-width: 100%;
}

.pkp_site_name img {
  display: block;
  width: auto !important;
  height: var(--htas-head-h) !important;
  max-width: 100% !important;
  max-height: none !important;
  object-fit: contain;
  object-position: left center;
  /* mask-image DIHAPUS: logo tampil seperti aslinya, tepi tidak memudar */
  -webkit-mask-image: none !important;
          mask-image: none !important;
}

/* ---------- Menu utama ---------- */
.pkp_site_nav_menu { background: transparent !important; }

.pkp_navigation_primary {
  display: flex !important;
  flex-wrap: nowrap;
  margin: 0 !important;
}

.pkp_navigation_primary > li { float: none !important; margin: 0 !important; white-space: nowrap; }

.pkp_navigation_primary > li > a {
  padding: 18px 18px !important;
  border-bottom: 3px solid transparent !important;
  background: transparent !important;
  color: var(--htas-green) !important;
  font: 500 13px/1 var(--htas-sans) !important;
  letter-spacing: .04em;
  text-transform: uppercase;
  transition: border-color .2s ease, color .2s ease;
}

.pkp_navigation_primary > li > a:hover,
.pkp_navigation_primary > li > a:focus,
.pkp_navigation_primary > li:focus-within > a,
.pkp_page_index .pkp_navigation_primary > li:first-child > a {
  border-bottom-color: var(--htas-gold) !important;
  background: transparent !important;
  color: var(--htas-green-deep) !important;
}

.pkp_navigation_primary ul {
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--htas-line) !important;
  border-radius: 12px !important;
  box-shadow: 0 12px 30px rgba(33,61,49,.14) !important;
}

.pkp_navigation_primary ul a {
  color: var(--htas-ink) !important;
  font: 400 14px/1.4 var(--htas-sans) !important;
  letter-spacing: 0;
  text-transform: none;
}

.pkp_navigation_search_wrapper a.pkp_search {
  background: transparent !important;
  color: var(--htas-green) !important;
  font: 500 13px/1 var(--htas-sans) !important;
  letter-spacing: .04em;
  text-transform: uppercase;
}

/* ---------- Register | Login ---------- */
/* Reset posisi bawaan OJS (absolute + transform + padding) */
.pkp_navigation_user_wrapper {
  position: static !important;
  top: auto !important;
  right: auto !important;
  left: auto !important;
  transform: none !important;
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

.pkp_navigation_user {
  display: flex !important;
  align-items: center;
  flex-wrap: nowrap;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none;
  background: transparent !important;
}

.pkp_navigation_user > li {
  float: none !important;
  display: flex;
  align-items: center;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  white-space: nowrap;
}

/* Pemisah garis tipis antara Register dan Login */
.pkp_navigation_user > li + li {
  margin-left: 16px !important;
  padding-left: 16px !important;
  border-left: 1px solid #BFC9B8;
}
.pkp_navigation_user > li + li::before { content: none !important; }

.pkp_navigation_user > li > a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--htas-green) !important;
  font: 500 13px/1 var(--htas-sans) !important;
  text-decoration: none !important;
  white-space: nowrap;
  transition: color .2s ease;
}

/* Ikon */
.pkp_navigation_user > li > a::before {
  content: "\f007";
  font: normal 14px/1 FontAwesome;
}
.pkp_navigation_user > li > a[href*="login"]::before { content: "\f090"; }

/* Semua state: tidak boleh hitam */
.pkp_navigation_user > li > a:link,
.pkp_navigation_user > li > a:visited,
.pkp_navigation_user > li > a:active,
.pkp_navigation_user > li > a:focus,
.pkp_navigation_user > li:hover > a,
.pkp_navigation_user > li:focus-within > a {
  background: transparent !important;
  color: var(--htas-green) !important;
  outline: none;
  box-shadow: none !important;
}

.pkp_navigation_user > li > a:hover {
  background: transparent !important;
  color: var(--htas-gold) !important;
}

.pkp_navigation_user > li > a:focus-visible {
  outline: 2px solid var(--htas-gold);
  outline-offset: 3px;
  border-radius: 4px;
}

/* ---------- Layout header desktop ----------
   Kolom akun memakai max-content: lebarnya tidak pernah menyusut,
   jadi saat zoom in/out Register | Login tetap utuh di pojok kanan atas.
   Hanya logo yang menyesuaikan diri. */
@media (min-width: 992px) {
  .pkp_head_wrapper {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) max-content;
    grid-template-rows: var(--htas-head-h) 54px;
    grid-template-areas:
      "logo user"
      "nav  search";
    align-items: center;
    column-gap: 20px;
  }

  .pkp_site_name_wrapper { grid-area: logo; min-width: 0; overflow: hidden; }

  .pkp_site_nav_menu,
  .pkp_navigation_primary_row,
  .pkp_navigation_primary_wrapper { display: contents !important; }

  .pkp_navigation_user_wrapper {
    grid-area: user;
    justify-self: end;
    align-self: start;            /* menempel di atas */
    position: relative !important;
    z-index: 3;                   /* di atas ornamen */
    padding-top: 14px !important;
    white-space: nowrap;          /* tidak pernah turun baris */
    flex-shrink: 0;
  }

  .pkp_navigation_primary { grid-area: nav; min-width: 0; }

  .pkp_navigation_search_wrapper {
    grid-area: search;
    margin: 0 !important;
    padding: 0 !important;
    justify-self: end;
  }
}

/* Layar lebar (>= 1200px): Register | Login berada di tengah teks ISSN pada logo,
   tetap di baris atas. Di bawah 1200px otomatis kembali ke pojok kanan atas. */
@media (min-width: 1200px) {
  .pkp_site_name_wrapper {
    grid-area: auto;
    grid-column: 1 / -1;
    grid-row: 1;
  }

  .pkp_navigation_user_wrapper {
    grid-area: auto;
    grid-column: 1 / -1;
    grid-row: 1;
    justify-self: start;
    align-self: start;
    margin-left: calc(var(--htas-head-h) * var(--htas-issn-k)) !important;
    transform: translateX(-50%) !important;   /* titik tengah, bukan tepi kiri */
  }
}

/* Layar desktop sempit / browser di-zoom: rapatkan header */
@media (min-width: 992px) and (max-width: 1279px) {
  .pkp_head_wrapper { padding: 0 16px !important; column-gap: 12px; }
  .pkp_site_name img { max-width: 100% !important; }
  .pkp_navigation_primary > li > a { padding: 18px 12px !important; font-size: 12px !important; }
  .pkp_navigation_user > li + li { margin-left: 12px !important; padding-left: 12px !important; }
  .pkp_navigation_user > li > a,
  .pkp_navigation_search_wrapper a.pkp_search { font-size: 12px !important; }
}

/* Pengaman: jangan ada scroll horizontal dari header */
.pkp_structure_page { overflow-x: clip; }

/* =========================================================
   3. ISI HALAMAN + SIDEBAR DI KANAN
   ========================================================= */
.pkp_structure_content {
  display: flex !important;
  align-items: flex-start;
  gap: 32px;
  max-width: 1480px !important;
  margin: 32px auto !important;
  padding: 0 24px !important;
  background: transparent !important;
  border: 0 !important;
}

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

.pkp_structure_main {
  order: 1;
  flex: 1 1 0;
  min-width: 0;
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 28px 34px 36px !important;
  background: var(--htas-paper) !important;
  border: 1px solid var(--htas-line) !important;
  border-radius: 14px;
  box-shadow: 0 6px 20px rgba(33,61,49,.06);
}

.pkp_structure_main h1,
.pkp_structure_main h2 {
  font-family: var(--htas-serif) !important;
  font-weight: 600;
  color: var(--htas-green-deep) !important;
}

.pkp_structure_main a { color: var(--htas-green); }
.pkp_structure_main a:hover { color: #6F8B72; }

/* Teks rata kanan-kiri (justify) di semua halaman */
.pkp_structure_main p,
.pkp_structure_main li,
.pkp_structure_main .item.abstract,
.pkp_structure_main .description {
  text-align: justify;
  text-justify: inter-word;
  hyphens: auto;
  -webkit-hyphens: auto;
}

.cmp_breadcrumbs {
  display: block !important;
  margin: 0 !important;
  padding: 0 0 14px !important;
  background: transparent !important;
  font: 400 12.5px/1.5 var(--htas-sans) !important;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.cmp_breadcrumbs a { color: var(--htas-green) !important; text-decoration: none !important; }

/* Teks beranda memakai huruf serif seperti mockup */
.pkp_page_index .additional_content > div {
  font-family: var(--htas-sans) !important;
  text-align: justify !important;
}

/* Kartu Journal Information tetap rata kiri */
.pkp_page_index .additional_content > .htas-journal-card {
  text-align: left !important;
}

.pkp_structure_sidebar {
  order: 2;
  flex: none;
  float: none !important;
  position: static !important;
  width: 348px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

/* =========================================================
   4. SIDEBAR: kartu, judul, item menu
   ========================================================= */
.pkp_structure_sidebar .pkp_block {
  margin: 0 0 28px !important;
  padding: 0 !important;
  overflow: hidden;
  background: var(--htas-paper) !important;
  border: 1px solid var(--htas-line) !important;
  border-radius: 14px;
  box-shadow: 0 6px 20px rgba(33,61,49,.08);
}

/* Membuang tampilan kotak dari inline style blok */
.pkp_structure_sidebar .block_custom .content > div {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
}

/* Judul kartu (SUBMISSION, JOURNAL POLICIES) dengan ikon */
.pkp_structure_sidebar .block_custom .content > div > div:first-child {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 20px !important;
  background:
    var(--htas-block-orn) right bottom / auto 100% no-repeat,
    linear-gradient(135deg, #2F5846 0%, #1F4535 100%) !important;
  border: 0 !important;
  color: #fff !important;
  font: 600 16px/1.2 var(--htas-sans) !important;
  letter-spacing: .02em;
  text-align: left !important;
}

.pkp_structure_sidebar .block_custom .content > div > div:first-child::before {
  font: normal 20px/1 FontAwesome;
  color: #fff;
}

#customblock-submission .content > div > div:first-child::before { content: "\f0f6"; }
#customblock-additional-menu .content > div > div:first-child::before { content: "\f132"; }

/* Item menu */
.pkp_structure_sidebar .block_custom .content a {
  min-height: 58px !important;
  margin: 0 12px !important;
  padding: 10px 8px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--htas-line) !important;
  border-radius: 10px;
  background: transparent !important;
  color: var(--htas-green-deep) !important;
  font: 400 14.5px/1.4 var(--htas-sans) !important;
  transition: background-color .2s ease, transform .2s ease, color .2s ease !important;
}

.pkp_structure_sidebar .block_custom .content a:last-child { border-bottom: 0 !important; }

/* Tanda panah di sisi kanan setiap item */
.pkp_structure_sidebar .block_custom .content a::after {
  content: "\f105";
  margin-left: auto;
  padding-left: 12px;
  font: normal 18px/1 FontAwesome;
  color: #6C7B70;
  transition: transform .2s ease, color .2s ease;
}

/* ---------- Animasi ---------- */
.pkp_structure_sidebar .block_custom .content a:hover {
  background: #EEF2E4 !important;
  color: var(--htas-green) !important;
  transform: translateX(-4px);
}

.pkp_structure_sidebar .block_custom .content a:hover::after {
  color: var(--htas-green);
  transform: translateX(4px);
}

.pkp_structure_sidebar .block_custom .content a:active { transform: translateX(-4px) scale(.97); }

.pkp_structure_sidebar .block_custom .content a:focus-visible {
  outline: 2px solid var(--htas-gold);
  outline-offset: 2px;
}

/* ---------- Ikon bulat per menu ---------- */
.pkp_structure_sidebar .block_custom .content a > span {
  width: 38px !important; min-width: 38px !important; height: 38px !important;
  margin-right: 14px !important;
  border-radius: 50% !important;
  background: var(--htas-chip) !important;
  color: var(--htas-green) !important;
  font-size: 0 !important;
  transition: transform .3s cubic-bezier(.34,1.56,.64,1), background-color .2s ease !important;
}

.pkp_structure_sidebar .block_custom .content a > span::before {
  content: var(--ic, "\f111");
  font: normal 16px/1 FontAwesome;
}

/* Efek pop pada ikon saat menu di-hover */
.pkp_structure_sidebar .block_custom .content a:hover > span {
  transform: scale(1.15) rotate(-6deg);
  background: #DCE3CE !important;
}

/* Pilihan ikon per menu (urutan sesuai blok sekarang) */
#customblock-submission a:nth-of-type(1) { --ic: "\f093"; }
#customblock-submission a:nth-of-type(2) { --ic: "\f0f6"; }
#customblock-submission a:nth-of-type(3) { --ic: "\f002"; }
#customblock-submission a:nth-of-type(4) { --ic: "\f1c2"; }
#customblock-submission a:nth-of-type(5) { --ic: "\f132"; }
#customblock-submission a:nth-of-type(6) { --ic: "\f0c0"; }
#customblock-additional-menu a:nth-of-type(1)  { --ic: "\f140"; }
#customblock-additional-menu a:nth-of-type(2)  { --ic: "\f05d"; }
#customblock-additional-menu a:nth-of-type(3)  { --ic: "\f24e"; }
#customblock-additional-menu a:nth-of-type(4)  { --ic: "\f071"; }
#customblock-additional-menu a:nth-of-type(5)  { --ic: "\f0e2"; }
#customblock-additional-menu a:nth-of-type(6)  { --ic: "\f05e"; }
#customblock-additional-menu a:nth-of-type(7)  { --ic: "\f25e"; }
#customblock-additional-menu a:nth-of-type(8)  { --ic: "\f073"; }
#customblock-additional-menu a:nth-of-type(9)  { --ic: "\f09d"; }
#customblock-additional-menu a:nth-of-type(10) { --ic: "\f13e"; }
#customblock-additional-menu a:nth-of-type(11) { --ic: "\f187"; }
#customblock-additional-menu a:nth-of-type(12) { --ic: "\f0d0"; }
#customblock-additional-menu a:nth-of-type(13) { --ic: "\f1c0"; }

/* =========================================================
   5. FOOTER
   ========================================================= */
.pkp_structure_footer_wrapper,
.pkp_structure_footer {
  max-width: none !important;
  margin: 0 !important;
  background: var(--htas-green-deep) !important;
  border: 0 !important;
  color: #DCE8D8;
}

.pkp_structure_footer a { color: #E6D3A8 !important; }
.pkp_footer_content { max-width: 1280px; margin: 0 auto; padding: 36px 24px; }

/* =========================================================
   6. LAYAR KECIL: sidebar pindah ke bawah isi
   ========================================================= */
@media (max-width: 991px) {
  /* background gambar: ikut scroll di layar kecil (fixed sering bermasalah di HP) */
  html { background-attachment: scroll !important; }

  .pkp_structure_head { background: var(--htas-cream) !important; }
  .pkp_head_wrapper { padding: 12px 20px !important; }
  .pkp_site_name { height: auto; }
  .pkp_site_name img { height: 60px !important; }

  .pkp_structure_content {
    flex-direction: column;
    gap: 24px;
    margin: 20px auto !important;
    padding: 0 16px !important;
  }

  .pkp_structure_main { width: 100% !important; padding: 22px 20px !important; }
  .pkp_structure_sidebar { width: 100% !important; }
}

/* Hormati pengaturan "kurangi gerakan" */
@media (prefers-reduced-motion: reduce) {
  .pkp_structure_sidebar a,
  .pkp_structure_sidebar a::after,
  .pkp_structure_sidebar a > span { transition: none !important; }

  .pkp_structure_sidebar a:hover,
  .pkp_structure_sidebar a:hover::after,
  .pkp_structure_sidebar a:hover > span { transform: none; }
}

/* =========================================================
   7. HOME: JOURNAL INFORMATION (sederhana + naik tipis saat disentuh)
   Hanya berlaku untuk HTML dengan class "htas-info".
   ========================================================= */
.htas-info {
  padding: 24px 26px 26px;
  background: #fff;
  border: 1px solid var(--htas-line);
  border-radius: 14px;
  box-shadow: 0 2px 8px rgba(33,61,49,.05);
  font-family: var(--htas-sans);
  color: var(--htas-ink);
  transition: transform .25s ease, box-shadow .25s ease;
}

.htas-journal-card.htas-info { margin: 32px 0 30px; }

.htas-info__title {
  margin: 0 0 14px;
  color: var(--htas-green-deep);
  font: 600 22px/1.3 var(--htas-serif);
  letter-spacing: .04em;
  text-transform: uppercase;
}

/* ---------- Tabel baris tipis ---------- */
.htas-info table {
  width: 100%;
  margin: 0;
  border-collapse: collapse;
  border: 0 !important;
  background: transparent !important;
}

.htas-info td {
  padding: 9px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--htas-line) !important;
  background: transparent !important;
  font: 400 14px/1.5 var(--htas-sans);
  text-align: left;
  vertical-align: top;
}

.htas-info td:first-child { width: 38%; padding-right: 12px !important; color: #4A5A50; }
.htas-info td:last-child  { color: var(--htas-ink); }
.htas-info tr:last-child td { border-bottom: 0 !important; }

/* ---------- Dua kotak kecil ---------- */
.htas-info__card {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  column-gap: 16px;
  align-items: center;
  margin-top: 14px;
  padding: 16px 18px;
  background: #EEF2E4;
  border: 1px solid #E1E7D3;
  border-radius: 12px;
  transition: transform .25s ease, box-shadow .25s ease;
}

.htas-info__card::before {
  content: var(--ic);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #DCE3CE;
  color: var(--htas-green-deep);
  font: normal 20px/1 FontAwesome;
}

.htas-info__card--cite { --ic: "\f080"; }
.htas-info__card--imprint { --ic: "\f0f6"; }

.htas-info__ct { color: var(--htas-green-deep); font: 600 15px/1.4 var(--htas-sans); }
.htas-info__cd { margin: 2px 0 8px; color: #5F6F64; font: 400 12.5px/1.5 var(--htas-sans); }

.htas-info__card a {
  color: var(--htas-green) !important;
  font: 600 14px/1.4 var(--htas-sans);
  text-decoration: none;
}
.htas-info__card a:hover { color: var(--htas-gold) !important; }

/* ---------- Naik tipis saat disentuh / di-hover ---------- */
.htas-info:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(33,61,49,.12);
}

.htas-info__card:hover,
.htas-info__card:focus-within {
  transform: translateY(-3px);
  box-shadow: 0 8px 18px rgba(33,61,49,.14);
}

.htas-info:active { transform: translateY(-1px); }
.htas-info__card:active { transform: translateY(-1px); }

/* Hormati pengaturan "kurangi gerakan" */
@media (prefers-reduced-motion: reduce) {
  .htas-info,
  .htas-info__card { transition: none; }
  .htas-info:hover,
  .htas-info:active,
  .htas-info__card:hover,
  .htas-info__card:focus-within,
  .htas-info__card:active { transform: none; }
}

/* =========================================================
   8. HOME: INDEXING & ABSTRACTING
   Memakai kartu .htas-info (bagian 7) + 3 kotak logo berwarna.
   ========================================================= */
.htas-index__desc {
  margin: -4px 0 18px;
  color: #4A5A50;
  font: 400 13.5px/1.5 var(--htas-sans);
  text-align: left;
}

.htas-index__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.htas-index__item {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 96px;
  padding: 14px 18px;
  background: var(--htas-paper);
  border: 1px solid var(--htas-line);
  border-radius: 12px;
  box-shadow: 0 2px 6px rgba(33,61,49,.05);
  text-decoration: none !important;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease, background-color .25s ease;
}

.htas-index__item img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  transition: transform .3s cubic-bezier(.34,1.56,.64,1);
}

/* Naik tipis + logo membesar sedikit saat disentuh */
.htas-index__item:hover,
.htas-index__item:focus-visible {
  transform: translateY(-4px);
  background: #fff;
  border-color: var(--htas-gold);
  box-shadow: 0 10px 22px rgba(33,61,49,.16);
}

.htas-index__item:hover img,
.htas-index__item:focus-visible img { transform: scale(1.08); }

.htas-index__item:active { transform: translateY(-1px) scale(.98); }

.htas-index__item:focus-visible {
  outline: 2px solid var(--htas-gold);
  outline-offset: 2px;
}

/* Layar kecil: logo bertumpuk */
@media (max-width: 600px) {
  .htas-index__grid { grid-template-columns: 1fr; }
  .htas-index__item { height: 84px; }
}

@media (prefers-reduced-motion: reduce) {
  .htas-index__item,
  .htas-index__item img { transition: none; }
  .htas-index__item:hover,
  .htas-index__item:focus-visible,
  .htas-index__item:active,
  .htas-index__item:hover img,
  .htas-index__item:focus-visible img { transform: none; }
}

/* =========================================================
   9. AUTHOR GUIDELINES (v4: polos, tanpa kotak, tanpa animasi)
   Tidak ada kartu per bagian. Struktur hanya dari:
   - nomor bulat kecil di judul bagian
   - garis tipis pemisah antar bagian
   - titik emas untuk poin, lingkaran garis untuk urutan langkah
   ========================================================= */
.htas-guide { font-family: var(--htas-sans); }

.htas-guide__sec { margin: 0; padding: 22px 0; }
.htas-guide__sec:first-child { padding-top: 0; }
.htas-guide__sec:last-child { padding-bottom: 0; }
.htas-guide__sec + .htas-guide__sec { border-top: 1px solid var(--htas-line); }

/* ---------- Judul bagian + nomor bulat ---------- */
.htas-guide .htas-guide__h {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 12px !important;
  padding: 0 !important;
  border: 0 !important;
  font: 600 22px/1.3 var(--htas-serif) !important;
  color: var(--htas-green-deep) !important;
}

.htas-guide__no {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--htas-green-deep);
  color: #fff;
  font: 600 13px/1 var(--htas-sans);
}

.htas-guide .htas-guide__h3 {
  margin: 18px 0 8px !important;
  font: 600 18px/1.4 var(--htas-serif) !important;
  color: var(--htas-green) !important;
}

.htas-guide__sec p {
  margin: 0 0 12px;
  font: 400 14.5px/1.75 var(--htas-sans);
  color: var(--htas-ink);
}

.htas-guide__sec p:last-child { margin-bottom: 0; }
.htas-guide__sec strong { color: var(--htas-green-deep); }

/* ---------- Daftar poin ---------- */
.htas-guide__list,
.htas-guide__steps {
  margin: 0 0 12px;
  padding: 0;
  list-style: none;
}

.htas-guide__list li,
.htas-guide__steps li {
  position: relative;
  margin: 0;
  padding: 6px 0 6px 26px;
  font: 400 14.5px/1.65 var(--htas-sans);
  color: var(--htas-ink);
  text-align: justify;
}

.htas-guide__list li::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 15px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--htas-gold);
}

/* Urutan nyata (struktur naskah, checklist): lingkaran garis bernomor */
.htas-guide__steps { counter-reset: htas-step; }

.htas-guide__steps li { counter-increment: htas-step; padding-left: 40px; }

.htas-guide__steps li::before {
  content: counter(htas-step);
  position: absolute;
  left: 0;
  top: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  border: 1.5px solid var(--htas-green);
  color: var(--htas-green-deep);
  font: 600 12px/1 var(--htas-sans);
}

/* ---------- Layar kecil ---------- */
@media (max-width: 700px) {
  .htas-guide .htas-guide__h { font-size: 19px !important; }
}

/* =========================================================
   10. REVIEWER GUIDELINES (v5: polos, tanpa kotak, tanpa animasi)
   Struktur hanya dari: nomor bulat di judul bagian, garis tipis
   pemisah antar bagian, ikon/nomor bulat, dan tabel garis tipis.
   ========================================================= */
.htas-rev { font-family: var(--htas-sans); }

/* Reset gaya bawaan OJS di dalam blok ini */
.htas-rev p,
.htas-rev li { font: 400 14.5px/1.75 var(--htas-sans); color: var(--htas-ink); text-align: justify !important; text-justify: inter-word; hyphens: auto; }
.htas-rev p { margin: 0 0 12px; }
.htas-rev p:last-child { margin-bottom: 0; }
.htas-rev h3 { margin: 0 0 6px !important; font: 600 17.5px/1.4 var(--htas-serif) !important; color: var(--htas-green-deep) !important; }
.htas-rev ul, .htas-rev ol { margin: 0 0 12px; padding: 0; list-style: none; }

/* ---------- Judul halaman ---------- */
.htas-rev__hero {
  margin: 0 0 4px;
  padding: 0 0 18px;
  border-bottom: 3px solid var(--htas-gold);
}
.htas-rev__hero-sub   { color: var(--htas-green); font: 500 13px/1.4 var(--htas-sans); letter-spacing: .06em; }
.htas-rev__hero-title { margin: 4px 0 6px; font: 600 30px/1.25 var(--htas-serif); color: var(--htas-green-deep); }
.htas-rev__hero-note  { color: #5F6F64; font: 400 13.5px/1.5 var(--htas-sans); }

/* ---------- Bagian: judul + nomor bulat, dipisah garis tipis ---------- */
.htas-rev__sec { margin: 0; padding: 22px 0; }
.htas-rev__sec:last-child { padding-bottom: 0; }
.htas-rev__sec + .htas-rev__sec { border-top: 1px solid var(--htas-line); }

.htas-rev .htas-rev__h {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 12px !important;
  padding: 0 !important;
  border: 0 !important;
  font: 600 22px/1.3 var(--htas-serif) !important;
  color: var(--htas-green-deep) !important;
}

.htas-rev__no {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--htas-green-deep);
  color: #fff;
  font: 600 13px/1 var(--htas-sans);
}

/* ---------- Daftar centang ---------- */
.htas-rev__checks li { position: relative; padding: 6px 0 6px 32px; }
.htas-rev__checks li::before {
  content: "\f00c";
  position: absolute; left: 0; top: 8px;
  display: flex; align-items: center; justify-content: center;
  width: 22px; height: 22px;
  border-radius: 50%;
  background: var(--htas-chip);
  color: var(--htas-green);
  font: normal 11px/1 FontAwesome;
}

/* ---------- Etika (3.1 - 3.5): ikon bulat, tanpa kotak ---------- */
.htas-rev__ethics { margin: 8px 0 0; }

.htas-rev__eth {
  position: relative;
  min-height: 40px;
  padding: 2px 0 16px 54px;
}
.htas-rev__eth:last-child { padding-bottom: 0; }
.htas-rev__eth::before {
  position: absolute; left: 0; top: 0;
  display: flex; align-items: center; justify-content: center;
  width: 38px; height: 38px;
  border-radius: 50%;
  background: #DCE3CE;
  color: var(--htas-green-deep);
  font: normal 17px/1 FontAwesome;
}
.htas-rev__eth--lock::before { content: "\f023"; }
.htas-rev__eth--coi::before  { content: "\f0c1"; }
.htas-rev__eth--obj::before  { content: "\f24e"; }
.htas-rev__eth--int::before  { content: "\f132"; }
.htas-rev__eth--ai::before   { content: "\f2db"; }

/* ---------- Kriteria evaluasi (4.1 - 4.9): teks biasa ---------- */
.htas-rev__crit { margin: 8px 0 0; }
.htas-rev__c { margin: 0 0 16px; }
.htas-rev__c:last-child { margin-bottom: 0; }
.htas-rev__c h3 { color: var(--htas-green) !important; }

/* ---------- Komponen laporan: daftar bernomor lingkaran garis ---------- */
.htas-rev__report { margin: 0 0 14px; counter-reset: htas-rp; }

.htas-rev__rp {
  counter-increment: htas-rp;
  position: relative;
  padding: 4px 0 12px 44px;
  font: 400 14.5px/1.7 var(--htas-sans);
  color: var(--htas-ink);
  text-align: justify;
}
.htas-rev__rp::before {
  content: counter(htas-rp);
  position: absolute; left: 0; top: 4px;
  display: flex; align-items: center; justify-content: center;
  width: 28px; height: 28px;
  border-radius: 50%;
  border: 1.5px solid var(--htas-green);
  color: var(--htas-green-deep);
  font: 600 13px/1 var(--htas-sans);
}
.htas-rev__rp strong,
.htas-rev__rp b { display: block; margin-bottom: 2px; color: var(--htas-green-deep); font: 600 15px/1.4 var(--htas-sans); }

/* ---------- Tabel rekomendasi: hanya garis tipis ---------- */
.htas-rev__tablewrap { margin: 0 0 14px; overflow-x: auto; }

.htas-rev__table { width: 100%; margin: 0; border-collapse: collapse; background: transparent; }

.htas-rev__table th {
  padding: 10px 14px 10px 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 2px solid var(--htas-green) !important;
  color: var(--htas-green-deep) !important;
  font: 600 13.5px/1.3 var(--htas-sans) !important;
  text-align: left;
}
.htas-rev__table th:first-child { width: 28%; }

.htas-rev__table td {
  padding: 14px 14px 14px 0 !important;
  border: 0 !important;
  border-top: 1px solid var(--htas-line) !important;
  background: transparent !important;
  font: 400 14px/1.65 var(--htas-sans);
  text-align: left !important;
  vertical-align: top;
}
.htas-rev__table tbody tr:first-child td { border-top: 0 !important; }

.htas-rev__badge {
  display: inline-block;
  padding: 6px 12px;
  border-radius: 999px;
  font: 600 13px/1.3 var(--htas-sans);
}
.is-accept .htas-rev__badge { background: #DDEBDD; color: #1F4535; }
.is-minor  .htas-rev__badge { background: #E8EBC9; color: #566319; }
.is-major  .htas-rev__badge { background: #F5E6C8; color: #84560F; }
.is-reject .htas-rev__badge { background: #F3D9D4; color: #8C3A2E; }

/* ---------- Prosedur OJS: urutan nyata, jadi bernomor ---------- */
.htas-rev__timeline { position: relative; margin: 6px 0 16px; counter-reset: htas-tl; }
.htas-rev__timeline::before {
  content: "";
  position: absolute; left: 15px; top: 14px; bottom: 14px;
  width: 2px;
  background: var(--htas-line);
}
.htas-rev__timeline li {
  counter-increment: htas-tl;
  position: relative;
  padding: 6px 0 14px 50px;
  min-height: 32px;
}
.htas-rev__timeline li:last-child { padding-bottom: 0; }
.htas-rev__timeline li::before {
  content: counter(htas-tl);
  position: absolute; left: 0; top: 2px;
  display: flex; align-items: center; justify-content: center;
  width: 32px; height: 32px;
  border-radius: 50%;
  background: var(--htas-paper);
  border: 2px solid var(--htas-green);
  color: var(--htas-green-deep);
  font: 600 13px/1 var(--htas-sans);
}

/* ---------- Catatan penting: hanya garis emas di kiri ---------- */
.htas-rev__note {
  padding: 2px 0 2px 16px;
  border-left: 4px solid var(--htas-gold);
  color: #4A4130;
  font: 400 14px/1.7 var(--htas-sans);
  text-align: justify;
}

/* ---------- Layar kecil ---------- */
@media (max-width: 760px) {
  .htas-rev__hero-title { font-size: 26px; }
  .htas-rev .htas-rev__h { font-size: 19px !important; }

  /* Tabel menjadi baris bertumpuk */
  .htas-rev__table thead { display: none; }
  .htas-rev__table, .htas-rev__table tbody, .htas-rev__table tr, .htas-rev__table td { display: block; width: 100%; }
  .htas-rev__table tr { border-top: 1px solid var(--htas-line); padding: 8px 0; }
  .htas-rev__table tr:first-child { border-top: 0; }
  .htas-rev__table td { border-top: 0 !important; padding: 6px 0 !important; }
}

/* =========================================================
   11. PLAGIARISM POLICY: kartu Turnitin + ambang 20%, tautan terkait
   TAMBAHKAN di bagian paling bawah CSS yang sudah ada (jangan hapus yang lama).
   Halaman memakai .htas-rev (bagian 10) sebagai dasar.
   ========================================================= */
.htas-sim {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin: 0 0 22px;
}

.htas-sim__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 210px;
  padding: 26px 22px;
  border-radius: 16px;
  text-align: center;
  transition: transform .25s ease, box-shadow .25s ease;
}

.htas-sim__card:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 22px rgba(33,61,49,.16);
}

/* Kartu kiri: hijau muda lembut */
.htas-sim__card--logo {
  background: #EEF2E4;
  border: 1px solid #E1E7D3;
  border-left: 4px solid var(--htas-gold);
}

/* Kartu kanan: hijau tua HTAS */
.htas-sim__card--score {
  background: linear-gradient(135deg, #2F5846 0%, #1F4535 100%);
  border-bottom: 4px solid var(--htas-gold);
  color: #fff;
}

.htas-sim__label {
  font: 600 13.5px/1.7 var(--htas-serif);
  letter-spacing: .14em;
  text-transform: uppercase;
}
.htas-sim__card--logo .htas-sim__label  { color: var(--htas-green-deep); }
.htas-sim__card--score .htas-sim__label { color: #E6D3A8; }

.htas-sim__logo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 18px;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  text-decoration: none !important;
  transition: transform .3s cubic-bezier(.34,1.56,.64,1);
}
.htas-sim__logo:hover { transform: scale(1.06); }
.htas-sim__logo img {
  display: block;
  width: auto;
  height: auto;
  max-width: 200px;
  max-height: 60px;
}

.htas-sim__num {
  margin: 8px 0 6px;
  color: #fff;
  font: 700 64px/1 var(--htas-serif);
}
.htas-sim__cap {
  color: #DCE8D8;
  font: 400 14px/1.5 var(--htas-sans);
}

/* Tautan terkait berbentuk pil */
.htas-sim__links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.htas-sim__links a {
  display: inline-block;
  padding: 9px 18px;
  background: var(--htas-chip);
  border: 1px solid #DCE3CE;
  border-radius: 999px;
  color: var(--htas-green-deep) !important;
  font: 600 13px/1.3 var(--htas-sans);
  text-decoration: none !important;
  transition: transform .2s ease, background-color .2s ease, border-color .2s ease;
}
.htas-sim__links a:hover,
.htas-sim__links a:focus-visible {
  transform: translateY(-2px);
  background: #fff;
  border-color: var(--htas-gold);
  color: var(--htas-green) !important;
}

@media (max-width: 700px) {
  .htas-sim { grid-template-columns: 1fr; }
  .htas-sim__num { font-size: 54px; }
}

@media (prefers-reduced-motion: reduce) {
  .htas-sim__card, .htas-sim__logo, .htas-sim__links a { transition: none; }
  .htas-sim__card:hover, .htas-sim__logo:hover, .htas-sim__links a:hover { transform: none; }
}

/* =========================================================
   11. TIPOGRAFI FINAL
   EB Garamond : judul utama, nama publikasi, judul artikel.
   Inter       : navigasi, metadata, abstrak, isi antarmuka.
   Pengaturan utama ada di variabel --htas-serif dan --htas-sans (atas file).
   ========================================================= */

/* Sub-judul di isi halaman juga memakai EB Garamond */
.pkp_structure_main h3 { font-family: var(--htas-serif) !important; }

/* Nama publikasi (jika tampil sebagai teks, bukan gambar logo) */
.pkp_site_name .is_text,
.pkp_site_name a.is_text { font-family: var(--htas-serif) !important; font-weight: 600; }

/* Judul artikel dan judul terbitan */
.page_title,
.obj_article_details .page_title,
.obj_article_summary .title,
.obj_article_summary .title a,
.obj_issue_summary .title,
.obj_issue_summary .title a,
.obj_issue_toc .heading,
.obj_issue_toc .sections .section > h2,
.cmp_article_list .title,
.cmp_article_list .title a { font-family: var(--htas-serif) !important; }

/* Navigasi, metadata, abstrak, dan elemen antarmuka */
.pkp_navigation_primary,
.pkp_navigation_user,
.pkp_navigation_search_wrapper,
.cmp_breadcrumbs,
.pkp_structure_sidebar,
.pkp_structure_footer_wrapper,
button, input, select, textarea, label, table { font-family: var(--htas-sans); }

.obj_article_details .item,
.obj_article_details .item .label,
.obj_article_details .item.abstract,
.obj_article_details .item.abstract p,
.obj_article_summary .meta,
.obj_article_summary .authors,
.obj_article_summary .pages,
.obj_issue_summary .description { font-family: var(--htas-sans) !important; }

/* Isi sidebar rata kanan-kiri (judul kartu tetap rata kiri) */
.pkp_structure_sidebar .pkp_block .content,
.pkp_structure_sidebar .pkp_block .content p,
.pkp_structure_sidebar .pkp_block .content li {
  text-align: justify;
  text-justify: inter-word;
  hyphens: auto;
  -webkit-hyphens: auto;
}