/* =====================================================
   file.css - Penyeragaman tampilan jurnal (OJS 3.x)
   Jurnal Edukasiana Islam & JESY (LPPM IAI Yapnas Jeneponto)
   Ubah warna cukup di blok :root di bawah ini.
   ===================================================== */

:root {
  --header-height: 300px;          /* tinggi header (desktop) */
  --header-height-mobile: 160px;   /* tinggi header (HP) */
  --hero-height: 480px;            /* tinggi gambar di bawah header */
  --hero-height-mobile: 220px;

  --menu-bg: #cf8a1f;              /* warna menu */
  --menu-bg-hover: #b87714;
  --menu-text: #ffffff;
  --menu-height: 38px;

  --btn-from: #1b5e20;             /* gradasi tombol */
  --btn-to: #139a1a;
  --btn-text: #ffffff;
  --btn-radius: 3px;
  --link-color: #0b6ea8;
}

/* ---------- WARNA PER JURNAL ----------
   Ukuran/bentuk sama, warna berbeda. Jurnal dikenali dari path URL-nya.
   Path: journal.yapnasjp.ac.id/index.php/jesy dan /index.php/edukasiana */
:root:has(a[href*="/index.php/jesy"]) {
  --menu-bg: #2e86b0;
  --menu-bg-hover: #236b8e;
  --btn-from: #0b5a8a;
  --btn-to: #2e86b0;
  --link-color: #0b5a8a;
}

/* ---------- 1. HEADER: ukuran sama ---------- */
.pkp_structure_head,
.pkp_site_name_wrapper,
.pkp_site_name {
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
}

.pkp_site_name .is_img,
.pkp_site_name a.is_img {
  display: block;
  width: 100%;
  height: var(--header-height);
  padding: 0;
  margin: 0;
  overflow: hidden;
}

.pkp_site_name .is_img img,
.pkp_site_name a.is_img img {
  display: block;
  width: 100%;
  height: var(--header-height);
  max-width: 100%;
  max-height: none;
  object-fit: cover;
  object-position: center;
}

/* ---------- 2. GAMBAR DI BAWAH HEADER: ukuran sama ---------- */
/* Cara utama: unggah "Homepage image" di
   Settings > Website > Appearance > Setup. Ukurannya diseragamkan di sini. */
.pkp_page_index .homepage_image,
.pkp_page_index .page_index_journal .homepage_image {
  float: none !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 20px 0 !important;
  padding: 0 !important;
  overflow: hidden;
  clear: both;
}

.pkp_page_index .homepage_image img,
.pkp_page_index .page_index_journal .homepage_image img {
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  height: var(--hero-height) !important;
  margin: 0 !important;
  object-fit: cover;
  object-position: center;
}

/* Gambar yang ada di dalam teks "About the Journal" (kasus JESY):
   hilangkan float/ukuran kecil, jadikan lebar penuh seperti gambar homepage. */
.pkp_page_index .page_index_journal .homepage_about img,
.pkp_page_index .page_index_journal .additional_content img,
.pkp_page_index .page_index_journal .journal-description img,
.pkp_page_index .pkp_structure_main > .page img,
.pkp_page_index .pkp_structure_main img[style*="float"],
.pkp_page_index .pkp_structure_main img[align] {
  float: none !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: var(--hero-height) !important;
  margin: 0 0 20px 0 !important;
  object-fit: cover;
  object-position: center;
}

/* Teks tidak lagi membungkus gambar */
.pkp_page_index .pkp_structure_main p {
  overflow: visible;
}

/* Cadangan: jika sebuah jurnal belum punya Homepage image, tampilkan gambar
   dari URL di bawah (hapus tanda komentar dan isi URL gambar). */
/*
.pkp_page_index .pkp_structure_main:not(:has(.homepage_image))::before {
  content: "";
  display: block;
  width: 100%;
  height: var(--hero-height);
  margin-bottom: 20px;
  background: url("/public/site/images/admin/hero.jpg") center / cover no-repeat;
}
*/

/* ---------- 4. MENU: gaya sama ---------- */
.pkp_navigation_primary_row,
.pkp_navigation_primary_wrapper {
  background: var(--menu-bg);
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
}

.pkp_navigation_primary,
.pkp_navigation_user {
  margin: 0;
}

.pkp_navigation_primary > li > a,
.pkp_navigation_search_wrapper > a {
  display: block;
  height: var(--menu-height);
  line-height: var(--menu-height);
  padding: 0 14px;
  font-size: 13px;
  font-weight: 700;
  color: var(--menu-text);
  background: transparent;
  text-decoration: none;
  border: 0;
  border-radius: 0;
  transition: background .2s ease;
}

.pkp_navigation_primary > li > a:hover,
.pkp_navigation_primary > li > a:focus,
.pkp_navigation_primary > li:hover > a,
.pkp_navigation_search_wrapper > a:hover {
  background: var(--menu-bg-hover);
  color: var(--menu-text);
}

/* Submenu (About, dll.) */
.pkp_navigation_primary ul {
  background: var(--menu-bg);
  border: 0;
  border-radius: 0;
  box-shadow: 0 3px 8px rgba(0, 0, 0, .2);
}

.pkp_navigation_primary ul a {
  padding: 8px 14px;
  font-size: 13px;
  font-weight: 600;
  color: var(--menu-text);
  background: transparent;
}

.pkp_navigation_primary ul a:hover,
.pkp_navigation_primary ul a:focus {
  background: var(--menu-bg-hover);
  color: var(--menu-text);
}

/* ---------- 3. TOMBOL: gaya sama ---------- */
/* Judul blok sidebar (SUBMISSION, JOURNAL INFORMATION, TEMPLATE) */
.pkp_block .title,
.pkp_structure_sidebar .pkp_block > .title,
.block_make_submission .title {
  display: block;
  margin: 0 0 8px;
  padding: 9px 10px;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.3;
  text-align: center;
  text-transform: uppercase;
  color: var(--btn-text);
  background: linear-gradient(to bottom, var(--btn-from), var(--btn-to));
  border: 0;
  border-radius: var(--btn-radius);
  box-shadow: 0 2px 3px rgba(0, 0, 0, .25);
}

/* Tombol Submission bawaan OJS */
.block_make_submission_link a,
.block_make_submission .content a,
.pkp_block .block_make_submission_link {
  display: block;
  margin: 0 0 8px;
  padding: 9px 10px;
  font-size: 14px;
  font-weight: 800;
  text-align: center;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--btn-text);
  background: linear-gradient(to bottom, var(--btn-from), var(--btn-to));
  border: 0;
  border-radius: var(--btn-radius);
  box-shadow: 0 2px 3px rgba(0, 0, 0, .25);
}

.block_make_submission_link a:hover,
.block_make_submission .content a:hover {
  filter: brightness(1.1);
  color: var(--btn-text);
}

/* Tombol umum (View All Issues, Search, dll.) */
.pkp_button,
.cmp_button,
.cmp_button_wire,
.obj_galley_link,
button.pkp_button,
.pkp_form .submit,
.pkp_search_submit {
  display: inline-block;
  padding: 7px 16px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.4;
  color: var(--btn-text);
  background: linear-gradient(to bottom, var(--btn-from), var(--btn-to));
  border: 0;
  border-radius: var(--btn-radius);
  box-shadow: 0 1px 3px rgba(0, 0, 0, .25);
  text-decoration: none;
  cursor: pointer;
}

.pkp_button:hover,
.cmp_button:hover,
.cmp_button_wire:hover,
.obj_galley_link:hover {
  filter: brightness(1.1);
  color: var(--btn-text);
}

/* Link daftar pada sidebar (Focus & Scopes, Editorial Team, dst.) */
.pkp_block .content a,
.pkp_structure_sidebar .pkp_block li a {
  font-size: 12.5px;
  font-weight: 500;
  color: var(--link-color);
  text-decoration: none;
}

.pkp_block .content a:hover {
  text-decoration: underline;
}

/* ---------- Tampilan HP ---------- */
@media (max-width: 768px) {
  .pkp_site_name .is_img,
  .pkp_site_name a.is_img,
  .pkp_site_name .is_img img,
  .pkp_site_name a.is_img img {
    height: var(--header-height-mobile);
  }

  .pkp_page_index .homepage_image img,
  .pkp_page_index .page_index_journal .homepage_image img,
  .pkp_page_index .page_index_journal .homepage_about img,
  .pkp_page_index .page_index_journal .additional_content img,
  .pkp_page_index .page_index_journal .journal-description img,
  .pkp_page_index .pkp_structure_main > .page img,
  .pkp_page_index .pkp_structure_main img[style*="float"],
  .pkp_page_index .pkp_structure_main img[align] {
    height: var(--hero-height-mobile) !important;
  }
}

/* ---------- DAFTAR ARTIKEL DI HOMEPAGE: gaya sama ---------- */
/* Artikel hanya tampil jika Current Issue berisi artikel berstatus Published.
   CSS ini hanya menyamakan tampilannya setelah artikel muncul. */
.current_issue .obj_issue_toc .sections h2,
.current_issue .obj_issue_toc .section h3,
.obj_issue_toc .heading {
  font-size: 16px;
  font-weight: 700;
  margin: 0 0 12px;
}

.obj_issue_toc .cmp_article_list {
  margin: 0 0 20px;
  padding: 0;
  list-style: none;
}

.obj_issue_toc .cmp_article_list > li {
  margin: 0 0 14px;
  padding: 0 0 14px;
  border-bottom: 1px solid #e5e5e5;
}

.obj_article_summary .title,
.obj_article_summary .title a {
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
  color: var(--link-color);
  text-decoration: none;
}

.obj_article_summary .title a:hover {
  text-decoration: underline;
}

.obj_article_summary .authors,
.obj_article_summary .pages {
  font-size: 12.5px;
  color: #555;
}