/* ==========================================================================
   THARWAH — Journal of Islamic Civilization and Thought
   Custom stylesheet untuk OJS 3.3.x (Default Theme)
   Palet  : hijau rumput (grass) → hijau lumut (moss), aksen emas
   Unggah : Settings › Website › Appearance › Advanced › Journal style sheet
   Catatan: Atur juga "Theme colour" (Appearance › Theme) ke #4F6B2A
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@600;700&family=Lora:ital,wght@0,500;0,600;0,700;1,500&family=Source+Sans+3:ital,wght@0,400;0,600;0,700;1,400&display=swap');

/* --------------------------------------------------------------------------
   1. Token warna & tipografi
   -------------------------------------------------------------------------- */
:root {
  --th-grass-hi:  #A8D25A;   /* hijau rumput muda   */
  --th-grass:     #7DB83A;   /* hijau rumput        */
  --th-grass-mid: #5E9A2E;
  --th-moss:      #4F6B2A;   /* hijau lumut         */
  --th-moss-dk:   #34491F;
  --th-deep:      #1F3318;
  --th-gold:      #C9A54A;
  --th-gold-hi:   #EBD58E;

  --th-cream:     #F4F8EC;
  --th-cream-2:   #EAF1DD;
  --th-paper:     #FFFFFF;
  --th-line:      #DCE5CE;
  --th-ink:       #1E2A17;
  --th-ink-2:     #4A5842;
  --th-ink-3:     #6B7864;

  --th-grad:   linear-gradient(135deg, var(--th-grass) 0%, var(--th-grass-mid) 38%, var(--th-moss) 72%, var(--th-moss-dk) 100%);
  --th-grad-x: linear-gradient(90deg,  var(--th-grass-mid) 0%, var(--th-moss) 55%, var(--th-moss-dk) 100%);
  --th-grad-gold: linear-gradient(90deg, var(--th-gold) 0%, var(--th-gold-hi) 50%, var(--th-gold) 100%);

  --th-font:  "Source Sans 3", "Noto Sans", -apple-system, "Segoe UI", Roboto, sans-serif;
  --th-serif: "Lora", Georgia, "Times New Roman", serif;
  --th-brand: "Cinzel", "Lora", Georgia, serif;

  --th-radius:    12px;
  --th-radius-sm: 8px;
  --th-shadow:    0 1px 2px rgba(31,51,24,.06), 0 8px 24px rgba(31,51,24,.08);
  --th-shadow-hi: 0 2px 4px rgba(31,51,24,.08), 0 14px 32px rgba(31,51,24,.14);
  --th-container: 1160px;
  --th-gutter:    20px;
  --th-userbar:   36px;
}

/* --------------------------------------------------------------------------
   2. Dasar halaman
   -------------------------------------------------------------------------- */
html { scroll-behavior: smooth; }

body {
  font-family: var(--th-font);
  font-size: 15px;
  line-height: 1.6;
  color: var(--th-ink);
  background-color: var(--th-cream);
  background-image:
    repeating-linear-gradient(45deg,  rgba(94,154,46,.045) 0 1px, transparent 1px 34px),
    repeating-linear-gradient(-45deg, rgba(94,154,46,.045) 0 1px, transparent 1px 34px);
}

a { color: var(--th-moss); text-decoration-color: rgba(79,107,42,.35); text-underline-offset: 3px; }
a:hover, a:focus { color: var(--th-grass-mid); }
::selection { background: var(--th-grass-hi); color: var(--th-deep); }

img { max-width: 100%; height: auto; }

/* Lebar kontainer menjadi fluid (menggantikan lebar tetap bawaan) */
.pkp_site_name_wrapper,
.pkp_navigation_primary_wrapper,
.pkp_structure_content,
.pkp_structure_footer {
  width: 100%;
  max-width: calc(var(--th-container) + var(--th-gutter) * 2);
  padding-left: var(--th-gutter);
  padding-right: var(--th-gutter);
}

/* --------------------------------------------------------------------------
   3. Header
   -------------------------------------------------------------------------- */
.pkp_structure_head {
  background: transparent;
  border-bottom: 0;
  position: relative;
  z-index: 50;
}

/* Lebar header disamakan dengan kolom konten pada semua breakpoint */
.pkp_head_wrapper,
.has_site_logo .pkp_head_wrapper {
  width: 100%;
  max-width: none;
  padding-left: 0;
  padding-right: 0;
}
@media (min-width: 768px) {
  .pkp_head_wrapper,
  .has_site_logo .pkp_head_wrapper {
    width: calc(100% - var(--th-gutter) * 2);
    max-width: var(--th-container);
  }
}
.pkp_site_name_wrapper { width: 100%; max-width: none; padding-left: 0; padding-right: 0; }
.pkp_site_name_wrapper::after { display: none; }

.pkp_site_name { color: var(--th-moss-dk); font-family: var(--th-brand); }
.pkp_site_name .is_img { display: block; margin: 0; }
.pkp_site_name .is_img img {
  display: block;
  width: 100%;
  max-width: 100%;
  max-height: none;
  height: auto;
}
.pkp_site_name .is_img:focus { outline: 3px solid var(--th-gold); outline-offset: -3px; }
.pkp_site_name .is_text {
  font-family: var(--th-brand);
  font-weight: 700;
  color: var(--th-moss-dk);
  letter-spacing: .04em;
}

/* ---- Desktop (≥ 992px) ---- */
@media (min-width: 992px) {

  .pkp_head_wrapper,
  .has_site_logo .pkp_head_wrapper { position: static; padding-top: var(--th-userbar); }

  .pkp_site_name_wrapper { box-shadow: 0 10px 30px rgba(31,51,24,.12); }
  .pkp_site_name { font-size: 0; line-height: 0; }
  .pkp_site_name .is_img img { max-height: none; }
  .pkp_site_name .is_text { display: block; padding: 40px var(--th-gutter); font-size: 2.6rem; line-height: 1.2; }

  /* Bar pengguna (Login/Register) di paling atas — gaya top-bar Fitrah */
  .pkp_navigation_user_wrapper {
    position: absolute;
    top: 0; left: 0; right: 0;
    transform: none;
    height: var(--th-userbar);
    padding: 0 max(var(--th-gutter), calc((100% - var(--th-container)) / 2));
    display: flex;
    align-items: center;
    justify-content: flex-end;
    background: var(--th-deep);
    border-bottom: 2px solid var(--th-gold);
  }
  .pkp_navigation_user_wrapper::before {
    content: "THARWAH · Journal of Islamic Civilization and Thought";
    margin-right: auto;
    font-family: var(--th-serif);
    font-style: italic;
    font-size: .86rem;
    color: rgba(235,213,142,.9);
    letter-spacing: .01em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .pkp_navigation_user { width: auto; padding: 0; }
  .pkp_navigation_user > li > a {
    color: rgba(255,255,255,.88);
    font-size: .85rem;
    font-weight: 600;
    letter-spacing: .03em;
    padding: 0 12px;
    line-height: var(--th-userbar);
  }
  .pkp_navigation_user > li > a:hover { color: var(--th-gold-hi); }
  .pkp_navigation_user > li > a:focus { background: var(--th-gold-hi); color: var(--th-deep); }
  .pkp_navigation_user > li:last-child > a { margin-right: 0; }
  .pkp_navigation_user > li + li > a { border-left: 1px solid rgba(255,255,255,.18); }
  .pkp_navigation_user > li > a .task_count { background: var(--th-gold); color: var(--th-deep); top: 0; }

  /* Bar navigasi utama */
  .pkp_navigation_primary_row {
    position: relative;
    background: var(--th-grad-x);
    box-shadow: 0 4px 14px rgba(31,51,24,.22);
  }
  .pkp_navigation_primary_row::before {
    content: "";
    position: absolute;
    left: 0; right: 0; top: 0;
    height: 3px;
    background: var(--th-grad-gold);
  }
  .pkp_navigation_primary_row::after {
    content: "";
    position: absolute;
    inset: 3px 0 0 0;
    pointer-events: none;
    background-image:
      repeating-linear-gradient(45deg,  rgba(255,255,255,.05) 0 10px, transparent 10px 28px),
      repeating-linear-gradient(-45deg, rgba(0,0,0,.05)       0 10px, transparent 10px 28px);
  }
  .pkp_navigation_primary_wrapper {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    min-height: 52px;
  }
  .pkp_navigation_primary_wrapper::before,
  .pkp_navigation_primary_wrapper::after { display: none; }

  .pkp_navigation_primary { display: flex; flex-wrap: wrap; max-width: none; margin: 0; }
  .pkp_navigation_primary > li > a {
    position: relative;
    display: flex;
    align-items: center;
    height: 100%;
    min-height: 52px;
    margin: 0;
    padding: 3px 16px 0;
    border-bottom: 0;
    color: #fff;
    font-weight: 600;
    font-size: .95rem;
    letter-spacing: .02em;
    transition: background .2s ease;
  }
  .pkp_navigation_primary > li:first-child a,
  .pkp_navigation_primary > li:last-child a { margin-left: 0; margin-right: 0; }
  .pkp_navigation_primary > li > a::before {
    content: "";
    position: absolute;
    left: 16px; right: 16px; bottom: 9px;
    height: 2px;
    background: var(--th-gold-hi);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .25s ease;
  }
  .pkp_navigation_primary > li > a:hover,
  .pkp_navigation_primary > li:hover > a { color: #fff; background: rgba(255,255,255,.10); }
  .pkp_navigation_primary > li > a:hover::before,
  .pkp_navigation_primary > li:hover > a::before { transform: scaleX(1); }
  .pkp_navigation_primary > li > a:focus { background: var(--th-gold-hi); color: var(--th-deep); }
  .pkp_navigation_primary [aria-haspopup]:after { margin-left: .45em; opacity: .85; }

  /* Dropdown */
  .pkp_nav_list ul {
    width: 17em;
    padding: 6px;
    border-radius: 0 0 var(--th-radius-sm) var(--th-radius-sm);
    border-top: 3px solid var(--th-grass);
    background: var(--th-paper);
    box-shadow: var(--th-shadow-hi);
  }
  .pkp_navigation_primary > li:hover ul,
  .pkp_navigation_primary > li:focus-within ul { left: 0; }
  .pkp_navigation_user > li:focus-within ul { right: 0; left: auto; }
  .pkp_nav_list ul a,
  .pkp_navigation_primary ul a {
    padding: 9px 12px;
    border-left: 3px solid transparent;
    border-radius: 6px;
    color: var(--th-ink);
    font-size: .92rem;
    font-weight: 600;
    line-height: 1.35;
  }
  .pkp_nav_list ul a:hover,
  .pkp_nav_list ul a:focus,
  .pkp_navigation_primary .dropdown-menu a:hover,
  .pkp_navigation_primary .dropdown-menu a:focus {
    background: var(--th-cream);
    border-color: var(--th-grass);
    color: var(--th-moss-dk);
  }
  .pkp_nav_list ul li:first-child a,
  .pkp_nav_list ul li:last-child a { border-radius: 6px; }

  /* Tombol cari di bar navigasi */
  .pkp_navigation_search_wrapper { display: flex; align-items: center; float: none; margin-left: 12px; }
  .pkp_navigation_search_wrapper a {
    margin: 0;
    padding: 7px 16px;
    border: 1px solid rgba(255,255,255,.45);
    border-radius: 999px;
    color: #fff;
    font-weight: 600;
    font-size: .9rem;
    white-space: nowrap;
    transition: background .2s, color .2s, border-color .2s;
  }
  .pkp_navigation_search_wrapper a:hover {
    background: var(--th-gold-hi);
    border-color: var(--th-gold-hi);
    color: var(--th-deep);
  }
  .pkp_navigation_search_wrapper a .fa { margin-right: 4px; }
}

/* ---- Mobile & tablet (< 992px) ---- */
@media (max-width: 991px) {

  .pkp_site_name_wrapper {
    height: auto;
    padding-top: 52px;
    position: relative;
    background: var(--th-paper);
  }
  /* strip judul + tombol menu di atas banner */
  .pkp_site_name_wrapper::before {
    content: "THARWAH";
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--th-grad-x);
    border-bottom: 2px solid var(--th-gold);
    color: #fff;
    font-family: var(--th-brand);
    font-weight: 700;
    font-size: 1.15rem;
    letter-spacing: .14em;
  }
  .pkp_site_nav_toggle {
    top: 0;
    left: auto;
    right: 4px;
    width: 52px;
    height: 52px;
    box-shadow: none;
    border-radius: 8px;
  }
  .pkp_site_nav_toggle:focus { outline: 2px solid var(--th-gold-hi); outline-offset: -6px; }

  .pkp_site_name {
    position: static;
    padding: 0;
    white-space: normal;
    overflow: visible;
    font-size: 0;
    line-height: 0;
  }
  .pkp_site_name .is_img { margin: 0; }
  .pkp_site_name .is_text { display: block; padding: 18px var(--th-gutter); font-size: 1.4rem; line-height: 1.3; }

  /* Panel menu */
  .pkp_site_nav_menu {
    top: 52px;
    padding: 10px var(--th-gutter) 18px;
    background: linear-gradient(170deg, var(--th-moss) 0%, var(--th-moss-dk) 60%, var(--th-deep) 100%);
    border-bottom: 3px solid var(--th-gold);
    box-shadow: 0 18px 30px rgba(0,0,0,.25);
    max-height: calc(100vh - 52px);
    overflow-y: auto;
  }
  .pkp_site_nav_menu a {
    display: block;
    padding: 10px 6px;
    color: #fff;
    font-weight: 600;
    border-bottom: 1px solid rgba(255,255,255,.08);
  }
  .pkp_site_nav_menu a:hover,
  .pkp_site_nav_menu a:focus { color: var(--th-gold-hi); text-decoration: none; }
  .pkp_site_nav_menu ul ul { padding-left: 14px; border-left: 2px solid rgba(235,213,142,.35); margin-left: 6px; }
  .pkp_site_nav_menu ul ul a { font-weight: 400; font-size: .95rem; color: rgba(255,255,255,.85); }
  .pkp_navigation_user.pkp_navigation_user,
  .pkp_navigation_search_wrapper { border-top-color: rgba(235,213,142,.35); }
  .pkp_navigation_primary_wrapper,
  .pkp_navigation_user { padding-left: 0; padding-right: 0; }
}

/* --------------------------------------------------------------------------
   4. Struktur konten: main + sidebar (flex, responsif)
   -------------------------------------------------------------------------- */
.pkp_structure_content { padding-top: 28px; padding-bottom: 12px; }
.pkp_structure_content::before,
.pkp_structure_content::after,
.pkp_structure_main::before,
.pkp_structure_main::after { display: none !important; }

.pkp_structure_main {
  background: var(--th-paper);
  border: 1px solid var(--th-line);
  border-radius: var(--th-radius);
  box-shadow: var(--th-shadow);
  padding: 22px 18px 32px;
}

@media (min-width: 768px) {
  .pkp_structure_main { padding: 30px 34px 44px; }
}

@media (min-width: 992px) {
  .pkp_structure_content.has_sidebar {
    display: flex;
    align-items: flex-start;
    gap: 28px;
  }
  .pkp_structure_content.has_sidebar .pkp_structure_main {
    float: none;
    flex: 1 1 auto;
    min-width: 0;
    width: auto;
  }
  .pkp_structure_content.has_sidebar .pkp_structure_sidebar {
    float: none;
    flex: 0 0 300px;
    width: 300px;
    position: sticky;
    top: 16px;
  }
  .pkp_structure_main:first-child:last-child { margin-top: 0; width: auto; }
}

@media (max-width: 991px) {
  .pkp_structure_sidebar { margin-top: 24px; }
}

/* --------------------------------------------------------------------------
   5. Tipografi konten
   -------------------------------------------------------------------------- */
.pkp_structure_main h1,
.pkp_structure_main h2,
.pkp_structure_main h3 {
  font-family: var(--th-serif);
  color: var(--th-moss-dk);
  font-weight: 700;
  letter-spacing: -.005em;
}
.pkp_structure_main h1 { font-size: 1.85rem; line-height: 1.3; margin: 0 0 1.4rem; }
.pkp_structure_main h2 { font-size: 1.4rem;  line-height: 1.35; margin: 2.2rem 0 1rem; }
.pkp_structure_main h3 { font-size: 1.15rem; line-height: 1.4;  margin: 1.8rem 0 .8rem; }
.pkp_structure_main h4 { color: var(--th-moss-dk); }
.pkp_structure_main p  { line-height: 1.75; margin: 1rem 0; }

/* Judul halaman dengan ornamen garis + belah ketupat */
.pkp_structure_main .page > h1,
.pkp_structure_main > .page > h1,
.page_index_journal > section > h2,
.pkp_structure_main .current_issue > h2 {
  position: relative;
  padding-bottom: 14px;
}
.pkp_structure_main .page > h1::after,
.page_index_journal > section > h2::after,
.pkp_structure_main .current_issue > h2::after {
  content: "";
  position: absolute;
  left: 0; bottom: 0;
  width: 96px; height: 3px;
  background: linear-gradient(90deg, var(--th-grass) 0 60%, var(--th-gold) 60% 100%);
  border-radius: 2px;
}
.page_index_journal > section:first-of-type > h2,
.page_index_journal > section > h2:first-child { margin-top: 0; }

/* Tabel di konten statis (Tim Editorial, info jurnal, dsb.) */
.pkp_structure_main table {
  width: 100%;
  border-collapse: collapse;
  margin: 1rem 0;
  font-size: .95rem;
}
.pkp_structure_main table th {
  background: var(--th-grad-x);
  color: #fff;
  text-align: left;
  padding: 10px 12px;
  font-weight: 600;
}
.pkp_structure_main table td {
  padding: 9px 12px;
  border-bottom: 1px solid var(--th-line);
  vertical-align: top;
}
.pkp_structure_main table tr:nth-child(even) td { background: #FAFCF6; }

.pkp_structure_main blockquote {
  margin: 1.2rem 0;
  padding: 12px 18px;
  border-left: 4px solid var(--th-grass);
  background: var(--th-cream);
  border-radius: 0 var(--th-radius-sm) var(--th-radius-sm) 0;
  color: var(--th-ink-2);
}
.pkp_structure_main hr { border: 0; height: 1px; background: var(--th-line); margin: 2rem 0; }

/* --------------------------------------------------------------------------
   6. Beranda: gambar, tentang jurnal, terbitan terkini
   -------------------------------------------------------------------------- */
.homepage_image img { border-radius: var(--th-radius-sm); }

.homepage_about { margin-bottom: 8px; }
.page_index_journal > section:first-of-type,
.page_index_journal > .homepage_image + section { padding-top: 0; }
.homepage_about p { color: var(--th-ink-2); }

/* Blok info jurnal opsional (lihat tharwah-snippets.html) */
.th-journal-info {
  display: grid;
  grid-template-columns: 170px 1fr;
  gap: 24px;
  align-items: start;
  margin: 8px 0 18px;
  padding: 18px;
  background: linear-gradient(180deg, var(--th-cream) 0%, #fff 100%);
  border: 1px solid var(--th-line);
  border-radius: var(--th-radius);
}
.th-journal-info .th-cover img {
  display: block;
  width: 100%;
  border-radius: 6px;
  box-shadow: 0 10px 22px rgba(31,51,24,.25);
}
.th-journal-info table { margin: 0; font-size: .92rem; }
.th-journal-info td { padding: 7px 10px; }
.th-journal-info td:first-child { width: 38%; font-weight: 600; color: var(--th-moss-dk); white-space: nowrap; }
.th-journal-info tr:nth-child(even) td { background: transparent; }
@media (max-width: 600px) {
  .th-journal-info { grid-template-columns: 1fr; padding: 12px; gap: 14px; }
  .th-journal-info .th-cover { max-width: 180px; margin: 0 auto; }
  .th-journal-info td:first-child { white-space: normal; }
}

.current_issue .current_issue_title {
  display: inline-block;
  margin: 0 0 18px;
  padding: 6px 14px;
  background: var(--th-cream-2);
  border-left: 4px solid var(--th-grass);
  border-radius: 0 6px 6px 0;
  font-weight: 700;
  color: var(--th-moss-dk);
}
.pkp_structure_main .current_issue .read_more,
.pkp_structure_main .cmp_announcements .read_more {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 18px;
  padding: 10px 20px;
  background: var(--th-grad);
  color: #fff;
  font-weight: 600;
  text-decoration: none;
  border-radius: 999px;
  box-shadow: 0 6px 16px rgba(79,107,42,.28);
  transition: transform .2s, box-shadow .2s;
}
.pkp_structure_main .current_issue .read_more:hover,
.pkp_structure_main .cmp_announcements .read_more:hover { color: #fff; transform: translateY(-1px); box-shadow: 0 10px 22px rgba(79,107,42,.35); }
.pkp_structure_main .current_issue .read_more::after,
.pkp_structure_main .cmp_announcements .read_more::after {
  content: "\f105";
  position: static;
  width: auto; height: auto;
  transform: none;
  font-family: FontAwesome;
  line-height: 1;
  color: inherit;
}

/* --------------------------------------------------------------------------
   7. Daftar isi terbitan & ringkasan artikel
   -------------------------------------------------------------------------- */
.obj_issue_toc .heading {
  padding: 16px;
  background: var(--th-cream);
  border: 1px solid var(--th-line);
  border-radius: var(--th-radius);
}
.obj_issue_toc .heading::after { content: ""; display: table; clear: both; }
.obj_issue_toc .heading .cover { width: 140px; max-width: 30%; margin: 0 20px 0 0; }
.obj_issue_toc .heading .published,
.obj_issue_toc .heading .pub_id { margin: 6px 0; }
.obj_issue_toc .heading .description > *:first-child { margin-top: 0; }

/* Netralkan garis & margin negatif bawaan pada judul seksi */
.obj_issue_toc .section,
.obj_issue_toc .galleys { position: static; margin: 0; padding: 0; }
.obj_issue_toc .section::before,
.obj_issue_toc .galleys::before { display: none; }
.obj_issue_toc .section > h2,
.obj_issue_toc .section > h3,
.obj_issue_toc .galleys > h2,
.obj_issue_toc .galleys > h3 { left: 0; padding: 0; background: none; line-height: 1.4; }
.obj_issue_toc .sections:not(:first-child) { margin-top: 10px; }
.obj_issue_toc .cover img {
  border-radius: 6px;
  box-shadow: 0 8px 20px rgba(31,51,24,.22);
}
.obj_issue_toc .pub_id .type,
.obj_issue_toc .published .label { font-weight: 700; color: var(--th-moss-dk); }

.obj_issue_toc .sections .section > h2,
.obj_issue_toc .sections .section > h3,
.obj_issue_toc .galleys > h2,
.obj_issue_toc .galleys > h3 {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 26px 0 14px;
  font-family: var(--th-brand);
  font-size: 1rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--th-moss);
}
.obj_issue_toc .sections .section > h2::after,
.obj_issue_toc .sections .section > h3::after {
  content: "";
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, var(--th-gold), transparent);
}
.obj_issue_toc .sections .section:first-child > h2,
.obj_issue_toc .sections .section:first-child > h3 { margin-top: 20px; }

.cmp_article_list > li { margin-bottom: 14px; }

.obj_article_summary {
  position: relative;
  padding: 16px 18px 16px 22px;
  background: var(--th-paper);
  border: 1px solid var(--th-line);
  border-radius: var(--th-radius-sm);
  transition: box-shadow .2s, border-color .2s, transform .2s;
}
.obj_article_summary::before {
  content: "";
  display: block;
  position: absolute;
  left: -1px; top: -1px; bottom: -1px;
  width: 5px;
  border-radius: var(--th-radius-sm) 0 0 var(--th-radius-sm);
  background: linear-gradient(180deg, var(--th-grass) 0%, var(--th-moss) 100%);
}
.obj_article_summary:hover {
  border-color: #C7D6B1;
  box-shadow: var(--th-shadow);
  transform: translateY(-1px);
}
.obj_article_summary > .title,
.pkp_structure_main .obj_article_summary > .title {
  margin: 0 0 6px;
  font-family: var(--th-serif);
  font-size: 1.08rem;
  line-height: 1.45;
  font-weight: 700;
}
.obj_article_summary > .title a { color: var(--th-moss-dk); text-decoration: none; }
.obj_article_summary > .title a:hover { color: var(--th-grass-mid); }
.obj_article_summary .subtitle { color: var(--th-ink-3); font-weight: 500; }

.obj_article_summary .meta {
  display: flex;
  flex-wrap: wrap;
  gap: 2px 18px;
  padding-top: 2px;
  line-height: 1.55;
  font-size: .9rem;
  color: var(--th-ink-2);
}
.obj_article_summary .meta .authors { flex: 1 1 100%; padding-right: 0; }
.obj_article_summary .meta .authors::before,
.obj_article_summary .meta .pages::before,
.obj_article_summary .meta .published::before {
  font-family: FontAwesome;
  margin-right: 6px;
  color: var(--th-grass-mid);
}
.obj_article_summary .meta .authors::before   { content: "\f0c0"; }
.obj_article_summary .meta .pages::before     { content: "\f016"; }
.obj_article_summary .meta .published::before { content: "\f073"; }
.obj_article_summary .meta .pages,
.obj_article_summary .meta .published { position: static; }

.obj_article_summary .galleys_links { margin-top: 10px; }
.obj_article_summary .galleys_links li { margin-right: 6px; }

/* Tombol galley (PDF, HTML, dll.) */
.obj_galley_link {
  display: inline-flex;
  align-items: center;
  padding: 4px 14px;
  border: 1px solid var(--th-moss);
  border-radius: 999px;
  color: var(--th-moss);
  background: #fff;
  font-size: .85rem;
  font-weight: 700;
  line-height: 1.6;
  box-shadow: none;
  transition: background .2s, color .2s, border-color .2s;
}
.obj_galley_link:hover,
.obj_galley_link:focus {
  background: var(--th-moss);
  border-color: var(--th-moss);
  color: #fff;
}
.obj_galley_link.pdf {
  background: var(--th-grad);
  border-color: transparent;
  color: #fff;
}
.obj_galley_link.pdf:hover,
.obj_galley_link.pdf:focus { background: var(--th-moss-dk); color: var(--th-gold-hi); }

/* --------------------------------------------------------------------------
   8. Arsip terbitan (grid kartu)
   -------------------------------------------------------------------------- */
.page_issue_archive .issues_archive {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
  gap: 20px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.page_issue_archive .issues_archive > li {
  margin: 0;
  padding: 0;
  border: 0;
}
.page_issue_archive .issues_archive > li::after { display: none; }
.obj_issue_summary {
  height: 100%;
  padding: 14px;
  background: #fff;
  border: 1px solid var(--th-line);
  border-radius: var(--th-radius);
  transition: box-shadow .2s, transform .2s;
}
.page_issue_archive .obj_issue_summary .cover {
  float: none;
  width: auto;
  padding: 0;
  margin: 0 0 12px;
}
.page_issue_archive .obj_issue_summary .cover img {
  width: 100%;
  border-radius: 6px;
  box-shadow: 0 6px 16px rgba(31,51,24,.18);
}
.obj_issue_summary:hover { box-shadow: var(--th-shadow-hi); transform: translateY(-2px); }
.obj_issue_summary h2 { margin: 0; font-size: 1rem; line-height: 1.4; }
.obj_issue_summary .title { color: var(--th-moss-dk); text-decoration: none; }
.obj_issue_summary .series { font-family: var(--th-font); font-size: .85rem; color: var(--th-ink-3); font-weight: 400; }
.obj_issue_summary .description { font-size: .88rem; color: var(--th-ink-2); }

/* --------------------------------------------------------------------------
   9. Halaman artikel
   -------------------------------------------------------------------------- */
.obj_article_details .page_title { font-family: var(--th-serif); color: var(--th-moss-dk); }
.obj_article_details .subtitle { color: var(--th-ink-3); }

@media (min-width: 768px) {
  .obj_article_details .row {
    display: flex;
    align-items: stretch;
    margin-left: 0;
    margin-right: 0;
    border: 1px solid var(--th-line);
    border-radius: var(--th-radius);
    overflow: hidden;
  }
  .obj_article_details .main_entry {
    float: none;
    flex: 1 1 auto;
    min-width: 0;
    width: auto;
    border-right: 1px solid var(--th-line);
  }
  .obj_article_details .entry_details {
    float: none;
    flex: 0 0 250px;
    width: 250px;
    margin: 0;
    border-left: 0;
    background: var(--th-cream);
  }
}
@media (min-width: 992px) {
  .obj_article_details .item { padding: 22px 24px; }
}
@media (min-width: 480px) and (max-width: 767px) {
  .obj_article_details .entry_details { margin-left: 0; margin-right: 0; }
}

.obj_article_details .main_entry .item .label,
.obj_article_details .entry_details .item .label {
  font-family: var(--th-serif);
  color: var(--th-moss-dk);
}
.obj_article_details .entry_details .item .label {
  font-family: var(--th-font);
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--th-moss);
}
.obj_article_details .main_entry .item.doi,
.obj_article_details .main_entry .item.keywords {
  padding-top: 12px;
  padding-bottom: 12px;
}
.obj_article_details .item.abstract { line-height: 1.8; text-align: justify; }
.obj_article_details .entry_details .cover_image img { border-radius: 6px; box-shadow: 0 8px 18px rgba(31,51,24,.2); }
.obj_article_details .entry_details .galleys_links li { display: block; margin: 0 0 8px; }
.obj_article_details .galleys_links .obj_galley_link { width: 100%; justify-content: center; padding: 8px 14px; font-size: .95rem; }
.obj_article_details .authors .name { color: var(--th-moss-dk); }
.obj_article_details .authors .affiliation { color: var(--th-ink-3); }

/* --------------------------------------------------------------------------
   10. Sidebar — blok bergaya Fitrah
   -------------------------------------------------------------------------- */
.pkp_structure_sidebar .pkp_block {
  margin-bottom: 20px;
  padding: 0 0 16px;
  background: var(--th-paper);
  border: 1px solid var(--th-line);
  border-radius: var(--th-radius);
  box-shadow: var(--th-shadow);
  overflow: hidden;
}
.pkp_structure_sidebar .pkp_block .title,
.pkp_structure_sidebar .pkp_block .th-block-title {
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 14px;
  padding: 12px 18px;
  background: var(--th-grad);
  border-bottom: 2px solid var(--th-gold);
  color: #fff;
  font-family: var(--th-brand);
  font-size: .9rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  line-height: 1.35;
}
.pkp_structure_sidebar .pkp_block .title::before,
.pkp_structure_sidebar .pkp_block .th-block-title::before {
  content: "";
  flex: 0 0 auto;
  width: 8px; height: 8px;
  transform: rotate(45deg);
  background: var(--th-gold-hi);
}
/* judul custom block bawaan 3.3 tetap tersembunyi (screen-reader) */
.pkp_structure_sidebar .pkp_block .title.pkp_screen_reader { padding: 0; margin: 0; border: 0; }
.pkp_structure_sidebar .pkp_block .title.pkp_screen_reader::before { display: none; }

.pkp_structure_sidebar .pkp_block .content { padding: 0 16px; font-size: .93rem; }
.pkp_structure_sidebar .block_custom .content { padding-top: 16px; }
.pkp_structure_sidebar .block_custom .content > .th-block-title:first-child { margin: -16px -16px 14px; }
.pkp_structure_sidebar .pkp_block .content img { display: inline-block; border-radius: 4px; }
.pkp_structure_sidebar .pkp_block .content p { text-align: center; }
.pkp_structure_sidebar .pkp_block .content p.th-left { text-align: left; }

/* Daftar tautan di blok (menu jurnal, informasi, dll.) */
.pkp_structure_sidebar .pkp_block .content ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.pkp_structure_sidebar .pkp_block .content ul li { padding: 0; margin: 0 0 6px; line-height: 1.35; }
.pkp_structure_sidebar .pkp_block .content ul li:last-child { margin-bottom: 0; }
.pkp_structure_sidebar .pkp_block .content ul li > a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  background: var(--th-cream);
  border-left: 3px solid var(--th-grass);
  border-radius: 6px;
  color: var(--th-ink);
  font-size: .92rem;
  font-weight: 600;
  text-decoration: none;
  transition: background .2s, color .2s, transform .2s, border-color .2s;
}
.pkp_structure_sidebar .pkp_block .content ul li > a::after {
  content: "\f105";
  font-family: FontAwesome;
  margin-left: auto;
  color: var(--th-grass-mid);
  transition: color .2s, transform .2s;
}
.pkp_structure_sidebar .pkp_block .content ul li > a .fa {
  width: 18px;
  text-align: center;
  color: var(--th-moss);
}
.pkp_structure_sidebar .pkp_block .content ul li > a:hover,
.pkp_structure_sidebar .pkp_block .content ul li > a:focus {
  background: var(--th-grad);
  border-left-color: var(--th-gold);
  color: #fff;
  transform: translateX(3px);
}
.pkp_structure_sidebar .pkp_block .content ul li > a:hover::after,
.pkp_structure_sidebar .pkp_block .content ul li > a:hover .fa { color: var(--th-gold-hi); }

/* Blok bawaan */
.block_make_submission { padding: 16px !important; }
.block_make_submission .content { padding: 0 !important; }
.block_make_submission a,
.th-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 12px 16px;
  background: var(--th-grad);
  border: 0;
  border-bottom: 3px solid var(--th-gold);
  border-radius: var(--th-radius-sm);
  color: #fff !important;
  font-weight: 700;
  font-size: .98rem;
  letter-spacing: .03em;
  text-decoration: none;
  box-shadow: 0 8px 18px rgba(79,107,42,.28);
  transition: transform .2s, box-shadow .2s;
}
.block_make_submission a:hover,
.th-btn:hover { transform: translateY(-2px); box-shadow: 0 12px 24px rgba(79,107,42,.35); color: var(--th-gold-hi) !important; }

.block_browse .has_submenu { color: var(--th-moss-dk); }
.block_browse .current a { border-left-color: var(--th-gold); color: var(--th-moss-dk); }
.block_language_toggle .content ul li > a::after { content: ""; }

/* Grid logo indeks di sidebar */
.th-logo-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.th-logo-grid a {
  display: flex; align-items: center; justify-content: center;
  padding: 8px; min-height: 52px;
  background: #fff;
  border: 1px solid var(--th-line);
  border-radius: 6px;
  transition: border-color .2s, box-shadow .2s;
}
.th-logo-grid a:hover { border-color: var(--th-grass); box-shadow: 0 4px 12px rgba(31,51,24,.12); }
.th-logo-grid img { max-height: 38px; width: auto; }

/* --------------------------------------------------------------------------
   11. Komponen umum: tombol, form, breadcrumb, notifikasi, pengumuman
   -------------------------------------------------------------------------- */
.cmp_button,
.pkp_button,
.cmp_form .buttons button,
.page_search .submit button,
.cmp_form button.submit,
.page_login .buttons button,
.page_register .buttons button {
  background: var(--th-grad);
  border: 0;
  border-radius: var(--th-radius-sm);
  color: #fff;
  font-weight: 700;
  padding: 0 18px;
  line-height: 2.6rem;
  box-shadow: 0 4px 12px rgba(79,107,42,.25);
  text-shadow: none;
}
.cmp_button:hover, .cmp_button:focus,
.pkp_button:hover, .pkp_button:focus,
.cmp_form .buttons button:hover,
.page_search .submit button:hover {
  background: var(--th-moss-dk);
  color: var(--th-gold-hi);
  box-shadow: 0 6px 16px rgba(31,51,24,.3);
}
.cmp_button_wire { border-color: var(--th-moss); color: var(--th-moss); }
.cmp_button_wire:hover, .cmp_button_wire:focus { background: var(--th-moss); color: #fff; }

.cmp_form input[type="text"],
.cmp_form input[type="email"],
.cmp_form input[type="password"],
.cmp_form input[type="url"],
.cmp_form input[type="tel"],
.cmp_form select,
.cmp_form textarea,
.page_search input[type="text"] {
  border: 1px solid #C9D5B8;
  border-radius: var(--th-radius-sm);
  padding: 0 12px;
  transition: border-color .2s, box-shadow .2s;
}
.cmp_form textarea { padding: 10px 12px; }
.cmp_form input:focus,
.cmp_form select:focus,
.cmp_form textarea:focus,
.page_search input[type="text"]:focus {
  outline: 0;
  border-color: var(--th-grass-mid);
  box-shadow: 0 0 0 3px rgba(125,184,58,.25);
}
.cmp_form fieldset legend { color: var(--th-moss-dk); font-family: var(--th-serif); }

.cmp_breadcrumbs { margin-bottom: 14px; }
.cmp_breadcrumbs ol { font-size: .85rem; color: var(--th-ink-3); }
.cmp_breadcrumbs a { color: var(--th-moss); text-decoration: none; }
.cmp_breadcrumbs .current { color: var(--th-ink-2); font-weight: 600; }
.cmp_breadcrumbs .separator { color: var(--th-gold); }

.cmp_notification {
  border-left: 5px solid var(--th-grass);
  background: var(--th-cream);
  border-radius: 0 var(--th-radius-sm) var(--th-radius-sm) 0;
  color: var(--th-ink);
}
.cmp_notification.warning { border-left-color: var(--th-gold); }

.cmp_pagination a { color: var(--th-moss); font-weight: 600; }

.obj_announcement_summary {
  padding: 16px 18px;
  margin-bottom: 12px;
  background: var(--th-cream);
  border: 1px solid var(--th-line);
  border-radius: var(--th-radius-sm);
}
.obj_announcement_summary h2,
.obj_announcement_summary h3,
.obj_announcement_summary h4 { margin-top: 0; }
.obj_announcement_summary .date,
.obj_announcement_full .date { color: var(--th-moss); font-weight: 600; font-size: .88rem; }
.obj_announcement_summary .date::before,
.obj_announcement_full .date::before { content: "\f073"; font-family: FontAwesome; margin-right: 6px; }
.cmp_announcements.highlight_first > .obj_announcement_summary {
  background: var(--th-grad);
  color: #fff;
  border: 0;
}
.cmp_announcements.highlight_first > .obj_announcement_summary a,
.cmp_announcements.highlight_first > .obj_announcement_summary .date { color: #fff; }
.cmp_announcements.highlight_first > .obj_announcement_summary .read_more { background: rgba(255,255,255,.18); box-shadow: none; }
.cmp_announcements .more { border-top: 0; }

/* Tim editorial (people) */
.page_editorial_team .pkp_structure_main h2,
.page_about h2 { border-bottom: 1px solid var(--th-line); padding-bottom: 8px; }

/* --------------------------------------------------------------------------
   12. Footer
   -------------------------------------------------------------------------- */
.pkp_structure_footer_wrapper {
  position: relative;
  margin-top: 36px;
  background: linear-gradient(160deg, var(--th-moss) 0%, var(--th-moss-dk) 55%, var(--th-deep) 100%);
  color: rgba(255,255,255,.86);
  font-size: .93rem;
}
.pkp_structure_footer_wrapper::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 4px;
  background: var(--th-grad-gold);
}
.pkp_structure_footer_wrapper::after {
  content: "";
  position: absolute;
  inset: 4px 0 0 0;
  pointer-events: none;
  background-image:
    repeating-linear-gradient(45deg,  rgba(255,255,255,.035) 0 12px, transparent 12px 34px),
    repeating-linear-gradient(-45deg, rgba(0,0,0,.05)        0 12px, transparent 12px 34px);
}
.pkp_structure_footer { position: relative; z-index: 1; text-align: left; }
.pkp_footer_content { padding: 40px 0 20px; line-height: 1.7; }
.pkp_footer_content a { color: var(--th-gold-hi); }
.pkp_footer_content a:hover { color: #fff; }
.pkp_footer_content strong,
.pkp_footer_content b,
.pkp_footer_content h3,
.pkp_footer_content h4 { color: #fff; }
.pkp_footer_content h3,
.pkp_footer_content h4 { font-family: var(--th-brand); letter-spacing: .08em; margin: 0 0 10px; }
.pkp_footer_content table td { border: 0; padding: 4px 8px 4px 0; }

.pkp_brand_footer {
  padding: 14px 0 20px;
  border-top: 1px solid rgba(255,255,255,.12);
}
.pkp_brand_footer a { float: right; max-width: 120px; }
.pkp_brand_footer img { filter: brightness(0) invert(1); opacity: .75; }

/* Footer kolom (opsional, lihat snippet) */
.th-footer {
  display: grid;
  grid-template-columns: 1.3fr 1fr 1fr;
  gap: 28px;
}
.th-footer .th-footer-brand { display: flex; gap: 14px; align-items: flex-start; }
.th-footer .th-footer-brand img { width: 64px; flex: 0 0 64px; }
.th-footer ul { list-style: none; margin: 0; padding: 0; }
.th-footer ul li { padding: 3px 0; }
.th-footer ul li a { text-decoration: none; }
.th-footer ul li a::before { content: "\f105"; font-family: FontAwesome; margin-right: 8px; color: var(--th-gold); }
@media (max-width: 767px) {
  .th-footer { grid-template-columns: 1fr; gap: 20px; }
  .pkp_brand_footer a { float: none; display: block; margin: 0 auto; }
}

/* --------------------------------------------------------------------------
   13. Aksesibilitas & utilitas
   -------------------------------------------------------------------------- */
.cmp_skip_to_content a {
  background: var(--th-gold-hi);
  color: var(--th-deep);
  font-weight: 700;
}
:focus-visible { outline: 3px solid rgba(201,165,74,.75); outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; scroll-behavior: auto !important; }
}

@media print {
  .pkp_structure_head, .pkp_structure_sidebar, .pkp_structure_footer_wrapper { display: none; }
  body { background: #fff; }
  .pkp_structure_main { border: 0; box-shadow: none; }
}