/* ==========================================================================
   Tema Cost Journal versi 9 (ISSN kanan atas; Editorial Team, Reviewers, Archives, About, daftar isi terbitan) (hijau emerald, beranda sampul kiri setinggi teks, Main Menu ala Talenta) untuk OJS 2.4.8.3
   Upload di: https://ejournal.unuja.ac.id/index.php/cost/manager/setup/5 > 5.6 Journal style sheet
   ========================================================================== */

@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Pathway+Gothic+One&family=Noto+Serif:wght@700&display=swap");

:root {
  --c-top: #022c22;        /* strip paling atas */
  --c-head: #064e3b;       /* area judul */
  --c-nav: #065f46;        /* navbar */
  --c-nav-active: #047857; /* menu aktif */
  --c-accent: #e8a72c;     /* kuning/emas */
  --c-bg: #f1f7f4;         /* latar halaman */
  --c-crumb: #e2f0e9;      /* strip breadcrumb */
  --c-card: #ffffff;
  --c-border: #d6e6de;
  --c-text: #14251e;
  --c-muted: #55695f;
  --c-link: #047857;
  --w: 1200px;             /* lebar konten */
  --gutter: max(15px, calc(50vw - var(--w) / 2));
}

/* ---------- Dasar ---------- */
html, body { overflow-x: hidden; }
body {
  margin: 0;
  background: var(--c-bg);
  font-family: "Inter", Arial, sans-serif;
  font-size: 14px;
  line-height: 1.6;
  color: var(--c-text);
}
a, a:link, a:visited { color: var(--c-link); text-decoration: none; }
a:hover { color: var(--c-accent); text-decoration: none; }

#container { width: 100%; max-width: none; min-width: 0; margin: 0; padding: 0; background: transparent; }

/* ---------- Header (isi dari Setup 5.3 "Alternate header") ---------- */
#header {
  margin: 0; padding: 0;
  background: var(--c-head);
  border: 0;
  border-bottom: 3px solid var(--c-accent);
  text-align: left;
}
#headerTitle { width: auto; margin: 0; padding: 0; }
#headerTitle h1 {
  margin: 0; padding: 0;
  font: inherit; color: #fff;
  line-height: 1.3;
}
#headerTitle h1 a { color: inherit; }
/* Jika memakai gambar banner, tetap rapi */
#headerTitle h1 img { display: block; max-width: 100%; height: auto; margin: 0 auto; }

.jh-in { display: block; max-width: var(--w); margin: 0 auto; padding: 0 15px; box-sizing: content-box; }
.jh-top {
  display: block;
  background: var(--c-top);
  border-bottom: 1px solid rgba(255,255,255,.06);
  color: #a7dcc6;
  font-size: 12px;
  font-weight: 500;
  line-height: 30px;
}
.jh-top a { color: #a7dcc6; }
.jh-main { display: block; padding: 22px 0 20px; }
.jh-titleline { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; }
.jh-badge {
  display: inline-block;
  background: var(--c-accent);
  color: #022c22;
  font-weight: 800;
  font-size: 18px;
  letter-spacing: .5px;
  padding: 3px 10px;
  border-radius: 4px;
  line-height: 1.4;
}
.jh-title, a.jh-title:link, a.jh-title:visited {
  color: #fff;
  font-size: 27px;
  font-weight: 800;
  letter-spacing: -.3px;
}
a.jh-title:hover { color: var(--c-accent); }
.jh-meta {
  display: block;
  margin-top: 8px;
  color: #d1fae5;
  font-size: 13px;
  font-weight: 600;
}
.jh-dot { color: #6fcfa8; margin: 0 6px; }

/* ---------- Area isi ---------- */
#body {
  position: relative;          /* jangkar navbar & breadcrumb */
  max-width: var(--w);
  margin: 0 auto;
  padding: 80px 15px 40px;     /* 50 navbar + jarak */
  box-sizing: content-box;
  background: transparent;
}
#main {
  position: static;            /* penting: jangan relative */
  float: left;
  width: calc(100% - 340px);
  margin: 0; padding: 0;
  background: transparent;
  overflow: visible;
}

/* ---------- Navbar selebar layar ---------- */
#navbar {
  position: absolute;
  top: 0; left: 50%;
  width: 100vw; margin: 0 0 0 -50vw;
  padding: 0 var(--gutter);
  box-sizing: border-box;
  height: 50px;
  background: var(--c-nav);
  border: 0;
  text-align: left;
}
#navbar ul.menu { margin: 0; padding: 0; list-style: none; }
#navbar ul.menu li { float: left; display: block; margin: 0; padding: 0; }
#navbar ul.menu li a,
#navbar ul.menu li a:visited {
  display: block;
  padding: 0 16px;
  line-height: 47px;
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  text-transform: none;
  border-bottom: 3px solid transparent;
}
#navbar ul.menu li a:hover { background: rgba(255,255,255,.06); color: var(--c-accent); }
#navbar ul.menu li.current a { background: var(--c-nav-active); color: var(--c-accent); border-bottom-color: var(--c-accent); }
#navbar ul.menu li#home a::before { content: "\2302\00a0"; }

/* ---------- Breadcrumb selebar layar ---------- */
/* Breadcrumb ala Talenta: di atas judul, garis titik-titik */
#breadcrumb {
  position: static;
  margin: 0 0 22px;
  padding: 0 0 8px;
  background: none;
  border: 0;
  border-bottom: 1px dotted #55695f;
  font-size: 14px;
  color: var(--c-text);
}
#breadcrumb a { color: var(--c-head); }
#breadcrumb a.current { color: var(--c-head); font-weight: 700; }

/* ---------- Judul & kartu konten ---------- */
#main > h2 {
  margin: 0 0 20px;
  padding: 0;
  font-family: "Pathway Gothic One", "Arial Narrow", sans-serif;
  font-size: 32px;
  font-weight: 400;
  line-height: 1.2;
  color: var(--c-head);
  background: none;
  border: 0;
}
#content {
  background: var(--c-card);
  border: 1px solid var(--c-border);
  border-radius: 6px;
  box-shadow: 0 1px 3px rgba(2, 44, 34, .06);
  padding: 26px 28px;
  margin: 0 0 30px;
  font-size: 14.5px;
}
#content h3, #content h4 { color: var(--c-text); font-size: 15px; font-weight: 700; margin: 18px 0 10px; }
#content h3:first-child, #content h4:first-child { margin-top: 0; }
.separator { border: 0; border-top: 1px solid var(--c-border); margin: 20px 0; }

/* Tabel bawaan OJS (daftar isu, artikel) */
#content table.listing td, #content table.tocArticle td { padding: 6px 4px; }
#content .tocTitle { font-weight: 600; }

/* ---------- Sidebar kanan ---------- */
/* Tanda !important dipakai agar warna ungu dari tampilan lama tertimpa. */
#sidebar { width: auto; background: transparent !important; }
#rightSidebar {
  float: right;
  width: 318px;
  margin: 0; padding: 0;
  background: transparent !important;
  border: 0 !important;
  font-size: 13.5px;
}
#sidebar .block {
  background: var(--c-card) !important;
  background-image: none !important;
  border: 1px solid var(--c-border) !important;
  border-top: 3px solid var(--c-accent) !important;
  border-radius: 6px !important;
  box-shadow: 0 1px 3px rgba(2, 44, 34, .06) !important;
  padding: 0 18px 16px !important;
  margin: 0 0 20px !important;
  overflow: hidden;
  color: var(--c-text) !important;
}
#sidebar .blockTitle {
  display: block;
  margin: 0 -18px 14px !important;
  padding: 13px 18px !important;
  background: var(--c-head) !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  font-family: "Inter", Arial, sans-serif !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #ffffff !important;
  text-shadow: none !important;
}
#sidebar .blockSubtitle {
  display: block;
  margin: 18px 0 6px !important;
  padding: 0 0 6px !important;
  border: 0 !important;
  border-bottom: 2px solid var(--c-accent) !important;
  background: none !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: .8px;
  text-transform: uppercase;
  color: var(--c-head) !important;
}
#sidebar .block ul { list-style: none !important; margin: 0 !important; padding: 0 !important; }
#sidebar .block li { border: 0 !important; border-bottom: 1px dashed #dcebe3 !important; background: none !important; margin: 0 !important; padding: 0 !important; }
#sidebar .block li:last-child { border-bottom: 0 !important; }
#sidebar .block li a, #sidebar .block li a:visited {
  display: block; position: relative;
  padding: 8px 0 8px 16px !important;
  color: var(--c-link) !important;
  background: none !important;
  font-size: 13.5px;
}
#sidebar .block li a::before { content: "\203A"; position: absolute; left: 3px; color: var(--c-accent); font-weight: 700; }
#sidebar .block li a:hover { color: var(--c-head) !important; padding-left: 20px !important; }
#sidebar .block a { color: var(--c-link); }
#sidebar .block label, #sidebar .block td { color: var(--c-muted) !important; font-size: 12.5px; }
#sidebar .block table { width: 100%; border-collapse: collapse; }
#sidebar .block td { padding: 3px 0; }

/* Kotak isian dan tombol (Login, Search) */
#sidebar input[type="text"], #sidebar input[type="password"], #sidebar select,
#sidebar .textField, #sidebar .selectMenu {
  width: 100% !important; box-sizing: border-box;
  margin: 4px 0 8px !important;
  padding: 7px 9px !important;
  background: #ffffff !important;
  border: 1px solid var(--c-border) !important;
  border-radius: 5px !important;
  color: var(--c-text) !important;
  font: 13px "Inter", Arial, sans-serif !important;
}
#sidebar input[type="text"]:focus, #sidebar input[type="password"]:focus, #sidebar select:focus {
  outline: 2px solid var(--c-accent); outline-offset: 0; border-color: var(--c-accent) !important;
}
#sidebar input[type="submit"], #sidebar .button, #sidebar button,
#content input.button, #content input[type="submit"] {
  display: inline-block;
  width: auto;
  background: var(--c-nav) !important;
  background-image: none !important;
  color: #ffffff !important;
  border: 0 !important;
  border-radius: 5px !important;
  padding: 8px 18px !important;
  font: 700 13px "Inter", Arial, sans-serif !important;
  text-shadow: none !important;
  box-shadow: none !important;
  cursor: pointer;
}
#sidebar input[type="submit"]:hover, #sidebar .button:hover, #sidebar button:hover,
#content input.button:hover, #content input[type="submit"]:hover { background: var(--c-accent) !important; color: #022c22 !important; }
#sidebarUser input[type="submit"], #sidebarUser .button { width: 100% !important; }
#sidebarNavigation input[type="submit"] { width: 100% !important; }

/* ---------- Latar halaman: hapus gambar latar lama ---------- */
html { background: var(--c-bg) !important; }
body { background-color: var(--c-bg) !important; background-image: none !important; }
#container, #body, #main { background-image: none !important; }
#main { border: 0 !important; }

/* ---------- Footer lebar penuh (isi dari Setup 5.4) ---------- */
#body { padding-bottom: 250px; }
#pageFooter {
  position: absolute;
  bottom: 0; left: 50%;
  width: 100vw; margin: 0 0 0 -50vw;
  box-sizing: border-box;
  padding: 0 var(--gutter);
  background: var(--c-top) !important;
  border-top: 3px solid var(--c-accent);
  color: #a7dcc6;
  font-size: 13px;
  text-align: left;
}
#pageFooter a, #pageFooter a:visited { color: #d1fae5; }
#pageFooter a:hover { color: var(--c-accent); }
.jf-cols { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 30px; padding: 28px 0 20px; }
.jf-col h4 { margin: 0 0 10px !important; color: #ffffff !important; font-size: 13px !important; letter-spacing: 1px; text-transform: uppercase; }
.jf-col p { margin: 0 0 8px; line-height: 1.6; }
.jf-col ul { list-style: none; margin: 0; padding: 0; }
.jf-col li { margin: 0 0 6px; }
.jf-col li a::before { content: "\203A\00a0"; color: var(--c-accent); }
.jf-badge { display: inline-block; background: var(--c-accent); color: #022c22; font-weight: 800; padding: 1px 8px; border-radius: 3px; margin-right: 6px; }
.jf-bottom { border-top: 1px solid rgba(255,255,255,.1); padding: 12px 0 14px; font-size: 12px; color: #8fc7af; text-align: center; }
#body::after { content: ""; display: block; clear: both; }

/* ==========================================================================
   Beranda & Main Menu ala Talenta
   ========================================================================== */
/* Beranda: judul jurnal satu baris di atas; sampul (Setup 5.2 Homepage image) di kiri
   setinggi teks; tabel info + paragraf deskripsi di kanan. Isi dari Setup 5.2 Journal description.
   Selektor tidak bergantung pada class, supaya tetap jalan walau class terhapus editor. */
#content:has(#journalDescription) {
  display: grid;
  grid-template-columns: var(--cover-w, 345px) minmax(0, 1fr);
  column-gap: 32px;
  align-items: start;
  border-radius: 16px;
  padding: 26px 30px 30px;
  background: linear-gradient(90deg, var(--c-head), #059669 55%, var(--c-accent)) top / 100% 5px no-repeat, var(--c-card);
}
#content:has(#journalDescription) > * { grid-column: 1 / -1; }
#content:has(#journalDescription) > br { display: none; }
#journalDescription { display: contents; }
#journalDescription > p:first-child {
  grid-column: 1 / -1; grid-row: 1;
  margin: 0 0 20px !important;
  padding: 0 0 14px;
  border-bottom: 1px solid var(--c-border);
  font-family: "Noto Serif", Georgia, serif;
  font-size: clamp(15px, 1.45vw, 19px);
  font-weight: 700;
  line-height: 1.3;
  text-align: left !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--c-head) !important;
}
#journalDescription ~ #homepageImage { grid-column: 1 !important; grid-row: 2 / span 2; align-self: stretch; margin: 0; position: relative; min-height: 300px; }
#journalDescription ~ #homepageImage img {
  position: absolute; inset: 0;
  display: block; width: 100%; height: 100%;
  object-fit: cover; object-position: center top;
  border-radius: 4px;
  border: 1px solid var(--c-border);
  box-shadow: 0 14px 22px -14px rgba(2, 44, 34, .5);
}
#journalDescription > table { grid-column: 2; grid-row: 2; width: 100%; border-collapse: collapse; margin: 0 0 12px; font-size: 14px; }
#journalDescription > table th, #journalDescription > table td {
  padding: 6px 10px; text-align: left; vertical-align: top;
  border-top: 1px solid var(--c-border); border-bottom: 1px solid var(--c-border);
  line-height: 1.45;
}
#journalDescription > table tr:first-child th, #journalDescription > table tr:first-child td { border-top: 0; }
#journalDescription > table th { width: 1%; font-weight: 700; color: var(--c-head); white-space: nowrap; padding-right: 22px; }
#journalDescription > table td { color: var(--c-text); }
#journalDescription > table a { color: var(--c-link); word-break: break-all; }
#journalDescription > p:last-child {
  grid-column: 2; grid-row: 3;
  margin: 0 !important;
  text-align: justify;
  line-height: 1.6;
  font-size: 14px;
  font-weight: 500;
  color: #22332b;
}

/* Main Menu (blok khusus "mainmenu") */
#sidebar .block:has(.cmm) { padding: 0 !important; border: 1px solid var(--c-border) !important; border-top: 0 !important; border-radius: 8px !important; }
.cmm-head {
  display: block;
  padding: 13px 18px;
  background: linear-gradient(90deg, var(--c-head), #059669);
  border-left: 4px solid var(--c-accent);
  border-radius: 7px 7px 0 0;
  color: #fff;
  font-weight: 800;
  font-size: 15px;
  letter-spacing: 1.2px;
  text-transform: uppercase;
}
.cmm-box { margin: 14px; border: 1px solid var(--c-border); border-radius: 12px; overflow: hidden; background: #fff; }
.cmm details { border-bottom: 1px solid var(--c-border); }
.cmm details:last-child { border-bottom: 0; }
.cmm summary {
  list-style: none; cursor: pointer; position: relative;
  padding: 14px 40px 14px 15px;
  font-weight: 800; font-size: 14px; letter-spacing: 1px; text-transform: uppercase;
  color: var(--c-head);
}
.cmm summary::-webkit-details-marker { display: none; }
.cmm summary::after {
  content: ""; position: absolute; right: 18px; top: 50%;
  width: 8px; height: 8px; margin-top: -7px;
  border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
  transform: rotate(45deg); transition: transform .2s;
}
.cmm details[open] > summary { color: #059669; border-left: 3px solid var(--c-accent); border-bottom: 1px solid var(--c-border); }
.cmm details[open] > summary::after { transform: rotate(-135deg); margin-top: -2px; }
#sidebar .cmm ul { margin: 0 !important; padding: 0 !important; }
#sidebar .cmm li { border-bottom: 1px solid #e7efeb !important; }
#sidebar .cmm li:last-child { border-bottom: 0 !important; }
#sidebar .cmm li a, #sidebar .cmm li a:visited {
  padding: 12px 14px 12px 30px !important;
  color: #1f2d27 !important; font-size: 15px; line-height: 1.4;
}
#sidebar .cmm li a::before {
  content: ""; left: 14px; top: 50%; width: 6px; height: 6px; margin-top: -4px;
  border-right: 2px solid #059669; border-top: 2px solid #059669; transform: rotate(45deg);
}
#sidebar .cmm li a:hover { color: #059669 !important; background: #f2f8f5 !important; padding-left: 30px !important; }

/* ---------- Responsif (HP & tablet) ---------- */
@media (max-width: 900px) {
  #body { padding-top: 0; }
  #navbar {
    position: static; left: auto; width: auto; margin: 0 -15px 16px; height: auto;
    padding: 0 15px;
  }
  #navbar { overflow: hidden; }
  #navbar ul.menu li a { padding: 0 10px; line-height: 42px; }
  #body { display: flex; flex-direction: column; }
  #main { order: 1; }
  #sidebar { order: 2; }
  #main, #rightSidebar { float: none; width: auto; }
  .jh-title { font-size: 20px; }
  #body { padding-bottom: 0; }
  #pageFooter { position: static; width: auto; margin: 20px 0 0; padding: 0 16px; border-radius: 10px; }
  .jf-cols { grid-template-columns: 1fr; gap: 18px; }
  #content:has(#journalDescription) { grid-template-columns: 1fr; padding: 22px 18px; }
  #journalDescription > p:first-child { white-space: normal; font-size: 18px; }
  #journalDescription ~ #homepageImage { grid-column: 1 !important; grid-row: 2; width: 200px; min-height: 0; margin: 0 auto 18px; }
  #journalDescription ~ #homepageImage img { position: static; height: auto; }
  #journalDescription > table { grid-column: 1; grid-row: 3; }
  #journalDescription > table th { white-space: normal; }
  #journalDescription > p:last-child { grid-column: 1; grid-row: 4; }
}

/* ==========================================================================
   Versi 6: p-ISSN dan e-ISSN di kanan atas header, bersusun (pakai header-v2.html)
   ========================================================================== */
.jh-main .jh-in { position: relative; }
.jh-issn {
  position: absolute;
  top: 50%;
  right: 15px;
  transform: translateY(-50%);
  padding: 8px 14px;
  border: 1px solid rgba(232, 167, 44, .45);
  border-left: 3px solid var(--c-accent);
  border-radius: 6px;
  background: rgba(255, 255, 255, .05);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1px;
  line-height: 1.7;
  text-align: right;
}
.jh-issn > span { display: block; white-space: nowrap; }
.jh-main .jh-titleline, .jh-main .jh-meta { padding-right: 220px; }
@media (max-width: 767px) {
  .jh-issn { position: static !important; transform: none !important; display: inline-block !important; margin: 0 0 10px; text-align: left !important; font-size: 12px !important; }
  .jh-main .jh-titleline, .jh-main .jh-meta { padding-right: 0; }
}

/* ==========================================================================
   Versi 7: halaman Editorial Team & Peer Reviewers (kartu editor)
   Isi halaman dari editorial-team.html / reviewers.html (Static Pages)
   ========================================================================== */
#content .et-section { margin: 0 0 24px; }
#content h3.et-title {
  display: flex; align-items: center; gap: 14px;
  margin: 0 0 12px !important; padding: 0 0 0 12px !important;
  border: 0 !important; border-left: 4px solid var(--c-accent) !important;
  background: none !important;
  font-family: "Inter", Arial, sans-serif; font-size: 15px; font-weight: 700; line-height: 1.3;
  color: var(--c-head) !important; text-transform: none;
}
#content h3.et-title::after { content: ""; flex: 1; height: 1px; background: var(--c-border); }
#content .et-grid3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
#content .et-card {
  display: flex; align-items: flex-start; gap: 10px;
  margin: 0; padding: 11px 12px;
  background: #fff; border: 1px solid var(--c-border); border-radius: 8px;
}
#content .et-card p { margin: 0 !important; padding: 0; line-height: 1.3; text-align: left; }
#content .et-card img.et-flag {
  flex: none; display: block; width: 34px; height: 23px; margin: 2px 0 0;
  object-fit: cover; border-radius: 3px; border: 1.5px solid #fff;
  box-shadow: 0 0 0 1px rgba(2, 44, 34, .35), 0 2px 4px rgba(0, 0, 0, .15);
}
#content .et-name { font-size: 13.5px; font-weight: 700; color: var(--c-text); margin-bottom: 2px !important; }
#content .et-aff { font-size: 12px; color: var(--c-muted); }
#content .et-country { margin-top: 1px !important; font-size: 12px; font-weight: 700; color: var(--c-head); }
#content .et-ids { margin-top: 5px !important; }
#content .et-ids a {
  display: inline-block; margin: 0 3px 3px 0; padding: 0 7px;
  background: #fff; border: 1px solid var(--c-border); border-radius: 20px;
  color: var(--c-link); font-size: 10.5px; font-weight: 600; line-height: 1.7; text-decoration: none;
}
#content .et-ids a:hover { background: var(--c-nav); border-color: var(--c-nav); color: #fff; }
/* Warna kotak berbeda-beda supaya putih bendera terlihat */
#content .et-c1 { background: #ebf6f0; border-color: #b9dfcc; }  /* emerald muda */
#content .et-c2 { background: #fdf5e4; border-color: #efd59c; }  /* emas muda */
#content .et-c3 { background: #f0f7f4; border-color: #cbe3d8; }  /* hijau pucat */
#content .et-c4 { background: #f3f5f4; border-color: #d9e0dc; }  /* abu */
/* Editor in Chief: satu kartu besar hijau tua */
#content .et-card.et-chief {
  align-items: center; gap: 16px; padding: 16px 20px; border: 0; border-radius: 12px;
  background: linear-gradient(120deg, var(--c-top), var(--c-head) 55%, var(--c-nav));
  box-shadow: 0 10px 24px -10px rgba(2, 44, 34, .55);
}
#content .et-chief img.et-flag { width: 46px; height: 31px; border-width: 2px; }
#content .et-chief .et-name { color: #fff; font-size: 18px; margin-bottom: 3px !important; }
#content .et-chief .et-aff { color: #cfeadd; font-size: 13px; }
#content .et-chief .et-country { color: var(--c-accent); font-size: 13px; }
#content .et-chief .et-ids a { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.25); color: #fff; }

/* ==========================================================================
   Versi 7: halaman Archives (issue/archive)
   ========================================================================== */
#issues > div { float: none !important; width: auto !important; }
#issues h3 {
  margin: 0 0 12px !important; padding: 9px 14px !important;
  background: var(--c-crumb) !important; border: 0 !important;
  border-left: 4px solid var(--c-accent) !important; border-radius: 4px;
  font-family: "Inter", Arial, sans-serif; font-size: 17px; font-weight: 800; color: var(--c-head) !important;
}
#issues [id^="issue"] {
  display: grid; grid-template-columns: 86px minmax(0, 1fr); column-gap: 18px; align-content: start;
  min-height: 122px; margin: 0 0 12px; padding: 14px;
  background: #fff; border: 1px solid var(--c-border); border-radius: 8px;
  box-shadow: 0 1px 3px rgba(2, 44, 34, .06);
}
#issues [id^="issue"]:hover { border-color: #9fd3bb; }
#issues [id^="issue"] > * { grid-column: 2; }
/* Sampul mini otomatis kalau terbitan belum punya gambar sampul */
#issues [id^="issue"]::before {
  content: ""; grid-column: 1; grid-row: 1 / span 3; align-self: start;
  display: block; height: 122px;
  background: url("https://ejournal.unuja.ac.id/public/journals/74/homepageImage_en_US.png") center top / cover no-repeat,
              linear-gradient(160deg, var(--c-nav-active), var(--c-head) 60%, var(--c-top));
  border-radius: 4px; box-shadow: 0 8px 14px -8px rgba(2, 44, 34, .6);
  color: #fff; font-weight: 800; font-size: 13px; letter-spacing: 1.5px;
}
#issues [id^="issue"]:has(.issueCoverImage)::before { display: none; }
#issues .issueCoverImage { grid-column: 1; grid-row: 1 / span 3; margin: 0; }
#issues .issueCoverImage img { display: block; width: 86px; height: auto; border-radius: 4px; box-shadow: 0 8px 14px -8px rgba(2, 44, 34, .6); }
#issues h4 { font-family: "Inter", Arial, sans-serif !important; margin: 2px 0 6px !important; padding: 0 !important; background: none !important; border: 0 !important; font-size: 15.5px; font-weight: 700; line-height: 1.35; }
#issues h4 a, #issues h4 a:visited { color: var(--c-head) !important; }
#issues h4 a:hover { color: var(--c-link) !important; }
#issues > div:first-of-type > [id^="issue"]:first-of-type { border-top: 3px solid var(--c-accent); }
#issues > div:first-of-type > [id^="issue"]:first-of-type h4::before {
  content: "LATEST"; display: inline-block; vertical-align: 2px; margin-right: 8px; padding: 1px 8px;
  border-radius: 10px; background: var(--c-accent); color: var(--c-top);
  font-size: 10px; font-weight: 800; letter-spacing: 1px;
}
#issues .issueDescription, #issues .issueCoverDescription { color: var(--c-muted); font-size: 13.5px; line-height: 1.55; }
#issues .separator { display: none; }
#issues > br, #issues > div > br { display: none; }

@media (max-width: 560px) {
  #content .et-grid3 { grid-template-columns: 1fr; }
  #issues [id^="issue"] { grid-template-columns: 64px minmax(0, 1fr); column-gap: 12px; }
  #issues [id^="issue"]::before { height: 90px; font-size: 11px; }
  #issues .issueCoverImage img { width: 64px; }
}
@media (min-width: 561px) and (max-width: 991px) {
  #content .et-grid3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Versi 8: keterangan otomatis kalau Description terbitan kosong */
#issues .issueDescription:empty::before { content: "The articles within this issue are contributed by authors from Indonesia."; }
#issues [id^="issue"] > br { display: none; }

/* ==========================================================================
   Versi 8: halaman About the Journal (about/index) jadi kartu menu
   ========================================================================== */
#content:has(a[href*="aboutThisPublishingSystem"]) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; }
#content:has(a[href*="aboutThisPublishingSystem"]) > * { grid-column: 1 / -1; }
#content:has(a[href*="aboutThisPublishingSystem"]) > br, #content:has(a[href*="aboutThisPublishingSystem"]) > .separator { display: none; }
#content:has(a[href*="aboutThisPublishingSystem"]) > div:not(#pageFooter):not(.separator) {
  grid-column: auto !important; margin: 0 !important;
  background: #fff; border: 1px solid var(--c-border); border-top: 3px solid var(--c-accent); border-radius: 10px;
  box-shadow: 0 1px 3px rgba(2, 44, 34, .06); overflow: hidden;
}
#content:has(a[href*="aboutThisPublishingSystem"]) > div:not(#pageFooter):not(.separator) > h3 {
  display: flex; align-items: center; gap: 10px;
  margin: 0 !important; padding: 12px 16px !important;
  background: linear-gradient(90deg, var(--c-head), var(--c-nav)) !important; border: 0 !important;
  font-family: "Inter", Arial, sans-serif !important; font-size: 13px !important; font-weight: 800 !important;
  letter-spacing: 1.2px; text-transform: uppercase; color: #fff !important;
}
#content:has(a[href*="aboutThisPublishingSystem"]) > div:not(#pageFooter):not(.separator) > h3::before {
  display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px;
  content: "\2726"; border-radius: 50%; background: var(--c-accent); color: var(--c-top); font-size: 13px; letter-spacing: 0;
}
#aboutPeople > h3::before { content: "\263A" !important; }
#aboutPolicies > h3::before { content: "\00A7" !important; }
#aboutSubmissions > h3::before { content: "\270E" !important; }
#aboutOther > h3::before { content: "\2726" !important; }
#content:has(a[href*="aboutThisPublishingSystem"]) > div:not(#pageFooter):not(.separator) ul { list-style: none !important; margin: 0 !important; padding: 6px 0 !important; }
#content:has(a[href*="aboutThisPublishingSystem"]) > div:not(#pageFooter):not(.separator) li { margin: 0 !important; padding: 0 !important; border-bottom: 1px solid #edf3f0; list-style: none !important; }
#content:has(a[href*="aboutThisPublishingSystem"]) > div:not(#pageFooter):not(.separator) li:last-child { border-bottom: 0; }
#content:has(a[href*="aboutThisPublishingSystem"]) > div:not(#pageFooter):not(.separator) li a {
  display: block; position: relative; padding: 10px 16px 10px 34px; color: var(--c-text) !important; font-size: 14.5px; font-weight: 500;
}
#content:has(a[href*="aboutThisPublishingSystem"]) > div:not(#pageFooter):not(.separator) li a::before {
  content: ""; position: absolute; left: 17px; top: 50%; width: 6px; height: 6px; margin-top: -4px;
  border-right: 2px solid #059669; border-top: 2px solid #059669; transform: rotate(45deg);
}
#content:has(a[href*="aboutThisPublishingSystem"]) > div:not(#pageFooter):not(.separator) li a:hover { background: #f2f8f5; color: #059669 !important; padding-left: 38px; }
@media (max-width: 700px) { #content:has(a[href*="aboutThisPublishingSystem"]) { grid-template-columns: 1fr; } }

/* Versi 8: bendera Indonesia + asal penulis (Archives dan daftar artikel terbitan) */
#issues .issueDescription:empty::before {
  display: inline-block; padding-left: 32px; line-height: 18px;
  background: url("https://flagcdn.com/w40/id.png") left center / 24px 16px no-repeat;
}
#issues .issueDescription:empty { margin-top: 2px; }


/* ==========================================================================
   Versi 9: halaman daftar isi terbitan (issue/view, issue/current)
   ========================================================================== */
#main:has(table.tocArticle) > h3 {
  display: inline-block; margin: -8px 0 18px !important; padding: 3px 14px !important;
  background: var(--c-accent) !important; border: 0 !important; border-radius: 20px;
  font-family: "Inter", Arial, sans-serif !important; font-size: 13px !important; font-weight: 800 !important;
  letter-spacing: 1px; text-transform: uppercase; color: var(--c-top) !important;
}
#content:has(table.tocArticle) > h3 {
  display: flex; align-items: center; gap: 14px;
  margin: 0 0 16px !important; padding: 0 0 0 12px !important;
  background: none !important; border: 0 !important; border-left: 4px solid var(--c-accent) !important;
  font-family: "Inter", Arial, sans-serif !important; font-size: 17px !important; font-weight: 800 !important; color: var(--c-head) !important;
}
#content:has(table.tocArticle) > h3::after { content: ""; flex: 1; height: 1px; background: var(--c-border); }
#content h4.tocSectionTitle {
  margin: 18px 0 12px !important; padding: 9px 14px !important;
  background: var(--c-crumb) !important; border: 0 !important; border-left: 4px solid var(--c-nav) !important; border-radius: 4px;
  font-family: "Inter", Arial, sans-serif !important; font-size: 14px !important; font-weight: 800 !important;
  letter-spacing: 1px; text-transform: uppercase; color: var(--c-head) !important;
}
#content:has(table.tocArticle) .separator { display: none; }
#content table.tocArticle {
  width: 100% !important; margin: 0 0 12px !important; border-collapse: separate !important; border-spacing: 0;
  background: #fff; border: 1px solid var(--c-border); border-left: 4px solid var(--c-accent); border-radius: 8px;
  box-shadow: 0 1px 3px rgba(2, 44, 34, .06); transition: box-shadow .15s, border-color .15s;
}
#content table.tocArticle:hover { border-color: #9fd3bb; border-left-color: var(--c-accent); box-shadow: 0 6px 16px -8px rgba(2, 44, 34, .35); }
#content table.tocArticle td { padding: 0 16px !important; border: 0 !important; background: none !important; vertical-align: top; }
#content table.tocArticle tr:first-child td { padding-top: 14px !important; }
#content table.tocArticle tr:last-child td { padding-bottom: 14px !important; }
#content table.tocArticle .tocTitle { font-size: 15.5px; line-height: 1.45; }
#content table.tocArticle .tocTitle a, #content table.tocArticle .tocTitle a:visited { color: var(--c-head) !important; font-weight: 700; }
#content table.tocArticle .tocTitle a:hover { color: var(--c-link) !important; text-decoration: underline; }
#content table.tocArticle .tocAuthors {
  padding-top: 6px !important; padding-left: 22px !important; position: relative;
  color: var(--c-muted) !important; font-size: 13.5px; font-style: normal;
}
#content table.tocArticle .tocAuthors::before {
  content: ""; position: absolute; left: 0; top: 9px; width: 14px; height: 14px; opacity: .75;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23047857'%3E%3Cpath d='M12 12a5 5 0 1 0 0-10 5 5 0 0 0 0 10zm0 2c-4.4 0-9 2.2-9 5v3h18v-3c0-2.8-4.6-5-9-5z'/%3E%3C/svg%3E") center / contain no-repeat;
}
#content table.tocArticle .tocGalleys, #content table.tocArticle .tocPages, #content table.tocArticle td.tocArticleGalleysPages { width: 1%; white-space: nowrap; text-align: right !important; }
#content table.tocArticle td.tocArticleCoverImage { width: 1%; }
#content table.tocArticle td.tocArticleCoverImage img { max-width: 80px; height: auto; border-radius: 4px; }
#content table.tocArticle .tocGalleys a, #content table.tocArticle .tocGalleys a:visited {
  display: inline-block; margin: 0 0 0 4px; padding: 4px 12px 4px 28px; position: relative;
  background: var(--c-nav) !important; border-radius: 4px; color: #fff !important;
  font-size: 12px; font-weight: 700; letter-spacing: .5px; text-decoration: none !important;
}
#content table.tocArticle .tocGalleys a::before {
  content: ""; position: absolute; left: 10px; top: 50%; width: 12px; height: 14px; margin-top: -7px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M6 2h8l6 6v14H6z' opacity='.9'/%3E%3Cpath d='M14 2v6h6' fill='%23e8a72c'/%3E%3C/svg%3E") center / contain no-repeat;
}
#content table.tocArticle .tocGalleys a:hover { background: var(--c-accent) !important; color: var(--c-top) !important; }
#content table.tocArticle .tocPages { padding-top: 8px !important; color: var(--c-muted) !important; font-size: 12.5px; font-weight: 600; }
#content table.tocArticle .tocPages:not(:empty)::before { content: "Pages "; font-weight: 500; color: #8aa096; }
/* bendera Indonesia (asal penulis) di samping penulis */
#content table.tocArticle .tocAuthors::after {
  content: "Indonesia"; display: inline-block; margin-left: 8px; padding: 0 8px 0 28px;
  border: 1px solid var(--c-border); border-radius: 12px; line-height: 19px;
  background: #fff url("https://flagcdn.com/w40/id.png") 7px center / 16px 11px no-repeat;
  color: var(--c-head); font-size: 10.5px; font-weight: 700; vertical-align: 1px;
}
@media (max-width: 600px) {
  #content table.tocArticle .tocGalleys, #content table.tocArticle .tocPages { padding-left: 0 !important; padding-right: 10px !important; }
  #content table.tocArticle td { padding-left: 12px !important; padding-right: 12px !important; }

}

/* ==========================================================================
   Versi 9: halaman artikel (article/view)
   Selektor berlapis: id bawaan OJS 2 + pola umum, karena template artikel jurnal ini sudah dimodifikasi
   ========================================================================== */
#content:has(a[href="#tab-references"]), #content:has(#articleFullText) { font-size: 14.5px; }
#articleTitle h3,
#content:has(a[href="#tab-references"]) h3:first-of-type {
  margin: 0 0 14px !important; padding: 0 0 14px !important; background: none !important; border: 0 !important;
  border-bottom: 2px solid var(--c-border) !important;
  font-family: "Inter", Arial, sans-serif !important; font-size: 19px !important; font-weight: 700 !important;
  line-height: 1.4 !important; color: var(--c-head) !important;
}
/* label "Authors" dan daftar penulis */
#authorString { margin: 12px 0 4px; padding: 0; background: none; border: 0; font-style: normal; color: var(--c-text); }
#content:has(a[href="#tab-references"]) em:first-of-type,
#authorString em { font-style: normal; }
/* judul bagian (Abstract, Keywords, Full Text, References, Refbacks) */
#content:has(a[href="#tab-references"]) h4, #content:has(#articleFullText) h4,
#articleAbstract h4, #articleSubject h4, #articleFullText h4, #articleCitations h4 {
  display: block; margin: 18px 0 10px !important; padding: 0 0 0 12px !important;
  background: none !important; border: 0 !important; border-left: 4px solid var(--c-accent) !important;
  font-family: "Inter", Arial, sans-serif !important; font-size: 16px !important; font-weight: 800 !important;
  letter-spacing: .3px; color: var(--c-head) !important;
}
/* kotak abstrak (bawaan: tabel berlatar biru muda) */
#articleAbstract,
#content:has(a[href="#tab-references"]) table:has(h4),
#content:has(a[href="#tab-references"]) table:has(strong) {
  width: 100% !important; margin: 10px 0 18px !important; border-collapse: separate !important;
  background: #f4faf7 !important; border: 1px solid var(--c-border) !important; border-left: 4px solid var(--c-nav) !important;
  border-radius: 8px;
}
#content:has(a[href="#tab-references"]) table:has(h4) td,
#content:has(a[href="#tab-references"]) table:has(strong) td { background: transparent !important; padding: 14px 18px !important; }
#articleAbstract { padding: 4px 18px 14px; }
#articleAbstract div, #content:has(a[href="#tab-references"]) table:has(h4) td { text-align: justify; line-height: 1.75; color: #22332b; }
#articleAbstract > br:first-of-type { display: none; }
/* tombol PDF (Full Text) */
#articleFullText a, #content:has(a[href="#tab-references"]) a.file {
  display: inline-block; margin: 4px 6px 4px 0; padding: 8px 18px 8px 34px; position: relative;
  background: var(--c-nav) !important; border-radius: 5px; color: #fff !important;
  font-size: 13px; font-weight: 700; letter-spacing: .5px; text-decoration: none !important;
  box-shadow: 0 6px 12px -8px rgba(2, 44, 34, .7);
}
#articleFullText a::before, #content:has(a[href="#tab-references"]) a.file::before {
  content: ""; position: absolute; left: 13px; top: 50%; width: 13px; height: 15px; margin-top: -7.5px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M6 2h8l6 6v14H6z' opacity='.9'/%3E%3Cpath d='M14 2v6h6' fill='%23e8a72c'/%3E%3C/svg%3E") center / contain no-repeat;
}
#articleFullText a:hover, #content:has(a[href="#tab-references"]) a.file:hover { background: var(--c-accent) !important; color: var(--c-top) !important; }
/* tab References / Cited By / Metrics */
#content a[href="#tab-references"], #content a[href="#tab-citedby"], #content a[href="#tab-statistic"] {
  display: inline-block; margin: 0 4px 6px 0; padding: 8px 16px;
  background: var(--c-crumb); border: 1px solid var(--c-border); border-radius: 6px 6px 0 0;
  color: var(--c-head) !important; font-size: 13px; font-weight: 700; text-decoration: none !important;
}
#content a[href="#tab-references"]:hover, #content a[href="#tab-citedby"]:hover, #content a[href="#tab-statistic"]:hover,
#content li.active > a[href^="#tab-"], #content li.ui-tabs-active > a[href^="#tab-"] { background: var(--c-nav); border-color: var(--c-nav); color: #fff !important; }
#content ul:has(> li > a[href^="#tab-"]) { list-style: none !important; margin: 18px 0 0 !important; padding: 0 !important; border-bottom: 2px solid var(--c-nav); }
#content ul:has(> li > a[href^="#tab-"]) > li { display: inline-block; margin: 0 !important; padding: 0 !important; list-style: none !important; }
/* daftar referensi */
#tab-references, #articleCitations { font-size: 13.5px; line-height: 1.65; color: #33443c; }
#tab-references p, #articleCitations p { margin: 0 0 8px !important; padding: 0 0 8px 26px; text-indent: -26px; border-bottom: 1px dashed #e2ece7; }
#tab-references a, #articleCitations a { word-break: break-all; }
#authorString > em:first-child { display: inline-block; font-size: 12px; font-weight: 800; letter-spacing: 1.2px; text-transform: uppercase; color: var(--c-link); }

/* ==========================================================================
   Versi 9: halaman Journal Contact bawaan (about/contact) jadi kartu + bendera bulat
   ========================================================================== */
#content:has(#principalContact) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; }
#content:has(#principalContact) > * { grid-column: 1 / -1; }
#content:has(#principalContact) > .separator { display: none; }
#principalContact, #supportContact, #mailingAddress {
  grid-column: auto !important; margin: 0 !important; background: #fff; border: 1px solid var(--c-border);
  border-radius: 10px; overflow: hidden; box-shadow: 0 1px 3px rgba(2, 44, 34, .06);
}
#principalContact h4, #supportContact h4, #mailingAddress h4 {
  margin: 0 !important; padding: 11px 16px !important; background: linear-gradient(90deg, var(--c-top), var(--c-nav)) !important;
  border: 0 !important; border-left: 4px solid var(--c-accent) !important; color: #fff !important;
  font-family: "Inter", Arial, sans-serif !important; font-size: 12.5px !important; font-weight: 800 !important; letter-spacing: 1.3px; text-transform: uppercase;
}
#principalContact p, #supportContact p, #mailingAddress p {
  position: relative; margin: 0 !important; padding: 16px 16px 16px 74px !important; min-height: 44px; line-height: 1.6; font-size: 13.5px; color: var(--c-muted);
}
#principalContact p::before, #supportContact p::before, #mailingAddress p::before {
  content: ""; position: absolute; left: 16px; top: 16px; width: 42px; height: 42px; border-radius: 50%;
  background: url("https://flagcdn.com/w80/id.png") center / cover no-repeat; border: 2px solid #fff;
  box-shadow: 0 0 0 1px #c9d6cf, 0 3px 8px rgba(2, 44, 34, .18);
}
#principalContact strong, #supportContact strong { font-size: 16px; color: var(--c-head); }
@media (max-width: 700px) { #content:has(#principalContact) { grid-template-columns: 1fr; } }

/* ==========================================================================
   Versi 9: isi halaman dari menu sidebar (Focus and Scope, Publication Frequency, dll.)
   ========================================================================== */
#content > h3, #content > h4, #content > div > h3, #content > div > h4 {
  font-family: "Inter", Arial, sans-serif; color: var(--c-head);
}
#content > h3:not([style]), #content > h4:not([style]) {
  margin: 20px 0 10px; padding: 0 0 0 12px; border-left: 4px solid var(--c-accent); background: none; font-size: 16px; font-weight: 800;
}
#content > h3:first-child, #content > h4:first-child { margin-top: 0; }
#content > p, #content > div > p:not([style]) { line-height: 1.75; color: #22332b; }
#content > ul:not([style]):not(:has(a[href^="#tab-"])) > li, #content > ol:not([style]) > li { margin: 0 0 6px; line-height: 1.6; }
#content > ul:not([style]):not(:has(a[href^="#tab-"])) { list-style: none; padding-left: 4px; }
#content > ul:not([style]):not(:has(a[href^="#tab-"])) > li { position: relative; padding-left: 20px; }
#content > ul:not([style]):not(:has(a[href^="#tab-"])) > li::before {
  content: ""; position: absolute; left: 2px; top: .62em; width: 7px; height: 7px; border-radius: 50%; background: var(--c-accent);
}
#content > table:not([class]) { border-collapse: collapse; width: 100%; margin: 10px 0 16px; font-size: 14px; }
#content > table:not([class]) td, #content > table:not([class]) th { padding: 8px 10px; border: 1px solid var(--c-border); }
#content > table:not([class]) tr:nth-child(odd) td { background: #f6faf8; }
#content blockquote { margin: 12px 0; padding: 12px 16px; background: #f6faf8; border-left: 4px solid var(--c-nav); border-radius: 0 6px 6px 0; }

/* ==========================================================================
   Versi 9: header cadangan. Dipakai kalau OJS hanya menulis teks judul
   (misalnya di beranda) dan kode Alternate header tidak ikut tampil.
   ========================================================================== */
#header:not(:has(.jh-main)) { position: relative; padding-top: 31px !important; }
#header:not(:has(.jh-main))::before {
  content: "\1F3DB\00A0 LP3M Universitas Nurul Jadid  \2022  Open Access Academic Journal";
  position: absolute; left: 0; right: 0; top: 0; height: 31px; padding: 0 var(--gutter); box-sizing: border-box;
  background: var(--c-top); border-bottom: 1px solid rgba(255,255,255,.06);
  color: #a7dcc6; font-size: 12px; font-weight: 500; line-height: 30px; white-space: pre;
}
#header:not(:has(.jh-main)) #headerTitle { position: relative; }
#header:not(:has(.jh-main)) #headerTitle h1 {
  position: relative; margin: 0 !important; padding: 22px var(--gutter) 20px !important; box-sizing: border-box;
  font-family: "Inter", Arial, sans-serif !important; font-size: 27px !important; font-weight: 800 !important;
  letter-spacing: -.3px; line-height: 1.4 !important; color: #fff !important; text-align: left !important;
}
#header:not(:has(.jh-main)) #headerTitle h1 a { color: #fff !important; }
#header:not(:has(.jh-main)) #headerTitle h1::before {
  content: "COST"; display: inline-block; margin-right: 12px; padding: 3px 10px; vertical-align: 3px;
  background: var(--c-accent); border-radius: 4px; color: #022c22; font-size: 18px; font-weight: 800; letter-spacing: .5px; line-height: 1.4;
}
#header:not(:has(.jh-main)) #headerTitle h1::after {
  content: "Published by LP3M Universitas Nurul Jadid, Probolinggo  \2022  Double-blind peer review";
  display: block; margin-top: 8px; color: #d1fae5; font-size: 13px; font-weight: 600; letter-spacing: 0; line-height: 1.4; white-space: pre-wrap;
}
#header:not(:has(.jh-main)) #headerTitle::after {
  content: "p-ISSN: xxxx-xxxx\A e-ISSN: xxxx-xxxx";
  position: absolute; top: 50%; right: var(--gutter); transform: translateY(-50%);
  padding: 8px 14px; border: 1px solid rgba(232, 167, 44, .45); border-left: 3px solid var(--c-accent); border-radius: 6px;
  background: rgba(255, 255, 255, .05); color: #fff; font-size: 13px; font-weight: 700; letter-spacing: 1px; line-height: 1.7;
  text-align: right; white-space: pre;
}
@media (max-width: 767px) {
  #header:not(:has(.jh-main))::before { font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  #header:not(:has(.jh-main)) #headerTitle h1 { font-size: 22px !important; padding: 16px 15px !important; }
  #header:not(:has(.jh-main)) #headerTitle::after { position: static; transform: none; display: inline-block; margin: 0 15px 14px; font-size: 12px; text-align: left; }
}

/* Versi 9b: halaman artikel lebih ringkas; kotak abstrak tidak dobel */
#content:has(a[href="#tab-references"]) table:has(h4) :is(#articleAbstract, table),
#content:has(a[href="#tab-references"]) table:has(strong) :is(#articleAbstract, table) {
  margin: 0 !important; padding: 0 !important; background: none !important; border: 0 !important; box-shadow: none !important; width: auto !important;
}
#content:has(a[href="#tab-references"]) table:has(h4) td,
#content:has(a[href="#tab-references"]) table:has(strong) td { padding: 12px 16px !important; font-size: 14px; }
#content:has(a[href="#tab-references"]) table:has(h4) td td { padding: 0 !important; }
#content:has(a[href="#tab-references"]) h4, #content:has(#articleFullText) h4,
#articleAbstract h4, #articleSubject h4, #articleFullText h4, #articleCitations h4 { font-size: 14.5px !important; margin: 14px 0 8px !important; }
#articleTitle h3, #content:has(a[href="#tab-references"]) h3:first-of-type { margin-bottom: 10px !important; padding-bottom: 10px !important; }
#content #topBar:empty { display: none; }
#content:has(a[href="#tab-references"]) table:has(h4) td, #content:has(a[href="#tab-references"]) table:has(strong) td { border: 0 !important; }

/* ==========================================================================
   Versi 9: Current Issue di beranda (Setup 5.2: tampilkan daftar isi terbitan terkini)
   ========================================================================== */
#content:has(#journalDescription):has(table.tocArticle) > h3:first-of-type {
  display: block; margin: 30px 0 14px !important; padding: 0 0 12px !important;
  background: none !important; border: 0 !important; border-bottom: 2px solid var(--c-accent) !important;
  font-family: "Inter", Arial, sans-serif !important; font-size: 16px !important; font-weight: 700 !important;
  line-height: 1.45 !important; color: var(--c-link) !important; text-align: left !important;
}
#content:has(#journalDescription):has(table.tocArticle) > h3:first-of-type::before {
  content: "Current Issue"; display: block; margin-bottom: 8px;
  font-size: 15px; font-weight: 800; letter-spacing: 3px; text-transform: uppercase; color: var(--c-head);
}
#content:has(#journalDescription):has(table.tocArticle) > h3:first-of-type::after { display: none; }
#content:has(#journalDescription):has(table.tocArticle) > h3:nth-of-type(2) { display: none !important; }
#content:has(#journalDescription) h4.tocSectionTitle {
  background: none !important; border: 0 !important; border-bottom: 1px solid var(--c-border) !important; border-radius: 0;
  padding: 0 0 8px !important; margin: 18px 0 12px !important; letter-spacing: 3px; color: var(--c-head) !important;
}

/* ===== v10: halaman artikel lebih rapat + halaman PDF ===== */
#content:has(a[href="#tab-references"]) > br,
#content:has(a[href="#tab-references"]) > div > br:first-child,
#content:has(a[href="#tab-references"]) > .separator,
#content:has(a[href="#tab-references"]) > div:empty,
#content:has(#indexTab) > br { display: none !important; }
#content:has(a[href="#tab-references"]) { padding-top: 6px !important; }
#content:has(a[href="#tab-references"]) > :first-child,
#content:has(a[href="#tab-references"]) #articleTitle { margin-top: 0 !important; padding-top: 0 !important; }
#articleTitle h3, #content:has(a[href="#tab-references"]) h3:first-of-type { margin-top: 0 !important; }
#authorString { margin: 6px 0 2px !important; }
#authorString + br, #articleTitle + br { display: none !important; }
#content:has(a[href="#tab-references"]) h4 { margin: 10px 0 6px !important; }
#articleAbstract, #content:has(a[href="#tab-references"]) table:has(h4) { margin: 8px 0 !important; }
#content:has(a[href="#tab-references"]) p:empty { display: none !important; }
ul#indexTab { margin: 14px 0 0 !important; }
/* tombol unduh di halaman baca PDF */
#pdfDownloadLinkContainer { margin: 6px 0 10px !important; text-align: right; }
#pdfDownloadLinkContainer a { display: inline-block; padding: 7px 16px; border-radius: 20px; background: var(--c-link) !important; color: #fff !important; font-weight: 700; font-size: 13px; text-decoration: none; }
#pdfDownloadLinkContainer a:hover { background: var(--c-accent) !important; color: var(--c-top) !important; }
#inlinePdfResizer { border: 1px solid #d6e6dd; border-radius: 10px; overflow: hidden; }

/* ===== v11: Focus and Scope (dan halaman menu lain) berupa kartu topik ===== */
#content > p:empty, #content > p:has(> br:only-child) { display: none; }
#content > p:first-of-type:not([style]) { font-size: 15px; color: var(--c-head); font-weight: 500; }
#content > ul:not([style]):has(> li > ul) {
  counter-reset: topik; display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 14px; padding: 0 !important; margin: 14px 0 18px;
}
#content > ul:not([style]):has(> li > ul) > li {
  counter-increment: topik; margin: 0 !important; padding: 16px 18px 14px !important;
  background: linear-gradient(180deg, #f3faf6, #fff 70%); border: 1px solid var(--c-border);
  border-top: 3px solid var(--c-link); border-radius: 10px; box-shadow: 0 2px 6px rgba(2, 44, 34, .06);
}
#content > ul:not([style]):has(> li > ul) > li::before {
  content: counter(topik, decimal-leading-zero) !important; position: static !important;
  display: inline-flex; align-items: center; justify-content: center; width: 30px !important; height: 30px !important;
  margin: 0 10px 0 0; vertical-align: middle; border-radius: 50%; background: var(--c-link) !important;
  color: #fff; font-size: 12px; font-weight: 800;
}
#content > ul:not([style]):has(> li > ul) > li > :is(strong, b, p, span):first-of-type {
  display: inline; vertical-align: middle; margin: 0; font-size: 15.5px; font-weight: 800; color: var(--c-head);
}
#content > ul:not([style]) > li > ul {
  list-style: none; margin: 12px 0 0 !important; padding: 12px 0 0 !important; border-top: 1px dashed #d6e6dd;
}
#content > ul:not([style]) > li > ul > li {
  position: relative; margin: 0 0 7px !important; padding-left: 24px; font-size: 14px; line-height: 1.55; color: #33443c;
}
#content > ul:not([style]) > li > ul > li::before {
  content: "\2713"; position: absolute; left: 0; top: 1px; width: 17px; height: 17px; border-radius: 50%;
  background: #fdf3df; color: #b7791f; font-size: 11px; font-weight: 800; line-height: 17px; text-align: center;
}
#content > ul:not([style]) > li > ul > li p, #content > ul:not([style]) > li > p { margin: 0 !important; display: inline; }

/* ===== v12: semua halaman dari menu sidebar (Static Pages) berupa kartu ===== */
#content:not(:has(form, #journalDescription, table.tocArticle, a[href^="#tab-"], #issues, #principalContact)) > p:not([style]):not(:first-child) {
  margin: 0 0 12px; padding: 13px 18px; background: #f5faf7; border: 1px solid #dcebe3;
  border-left: 4px solid var(--c-link); border-radius: 0 10px 10px 0; line-height: 1.75; color: #22332b; text-align: justify;
}
#content:not(:has(form, #journalDescription, table.tocArticle, a[href^="#tab-"], #issues, #principalContact)) > p:not([style]):nth-of-type(even):not(:first-child) {
  border-left-color: var(--c-accent); background: #fffaf0; border-color: #f1e3c4;
}
#content > p:not([style]) > :is(strong, b):first-child { color: var(--c-head); }
#content > p:not([style]) a { font-weight: 600; word-break: break-word; }
/* daftar biasa (tanpa sub-daftar) menjadi kotak berpoin */
#content > ul:not([style]):not(:has(a[href^="#tab-"])):not(:has(> li > ul)),
#content > ol:not([style]) {
  margin: 0 0 14px; padding: 12px 18px 8px 18px !important; background: #fff; border: 1px solid var(--c-border); border-radius: 10px;
}
#content > ol:not([style]) { padding-left: 38px !important; }
#content > ol:not([style]) > li::marker { color: var(--c-link); font-weight: 800; }
#content > ul:not([style]):not(:has(a[href^="#tab-"])):not(:has(> li > ul)) > li { padding: 0 0 6px 20px; border-bottom: 1px dashed #e2ece7; }
#content > ul:not([style]):not(:has(a[href^="#tab-"])):not(:has(> li > ul)) > li:last-child { border-bottom: 0; }
/* judul bagian di dalam halaman */
#content > h3:not([style]), #content > h4:not([style]), #content > h2:not([style]) {
  margin: 22px 0 10px !important; padding: 9px 14px !important; background: linear-gradient(90deg, #e7f4ed, transparent);
  border-left: 4px solid var(--c-accent); border-radius: 0 8px 8px 0; color: var(--c-head); font-size: 16px; font-weight: 800;
}
#content > :is(h2, h3, h4):first-child { margin-top: 0 !important; }

/* ===== v13: tampilan HP. Bawaan OJS mengunci lebar halaman minimal 730px (!important), dibuka di sini ===== */
#container { min-width: 0 !important; width: 100% !important; }
#body { width: auto !important; }
html, body { max-width: 100%; overflow-x: hidden; }
@media (max-width: 767px) {
  #header:not(:has(.jh-main)) h1::after, #header:not(:has(.jh-main))::before { white-space: normal !important; }
  #content img, #content table, #content iframe { max-width: 100% !important; }
  #journalDescription .ci-title { word-break: break-word; }
  #content div[style*="48.5%"], #content div[style*="width:98%"] { width: 100% !important; min-width: 0 !important; margin-right: 0 !important; }
}