/* =========================================================
   JPEPS OJS Sidebar Custom Style V2
   Fokus: sidebar rapi seperti referensi, judul orange,
   logo rata tengah, ukuran seragam, dan sembunyikan nama block mentah.

   Upload ke:
   Settings > Website > Appearance > Advanced > Journal style sheet
   ========================================================= */

/* ---------- Struktur umum sidebar ---------- */
.pkp_structure_sidebar,
.pkp_structure_sidebar * {
  box-sizing: border-box;
}

.pkp_structure_sidebar .pkp_block {
  margin: 0 0 18px 0 !important;
  padding: 0 !important;
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* ---------- Sembunyikan judul otomatis block yang tidak ingin tampil ---------- */
#customblock-contact_us > .title,
#customblock-article_template > .title,
#customblock-main_menu > .title,
#customblock-relawan_indonesia > .title,
#customblock-member > .title,
#customblock-mendelay > .title,
#customblock-mendeley > .title,
#customblock-turnitin > .title,
#customblock-logo_adi > .title,
#customblock-indexing_logo > .title,
#customblock-indexing_logos > .title,
#customblock-sidebar_indexing > .title,
#customblock-journal_indexing > .title,
#customblock-supervised_by > .title {
  display: none !important;
}

/* ---------- Judul orange untuk block yang memakai class manual ---------- */
.jpeps-sidebar-title,
.jpeps-side-title {
  display: block !important;
  width: 100% !important;
  background: #e7b04b !important;
  color: #ffffff !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  text-transform: uppercase !important;
  letter-spacing: 2px !important;
  padding: 12px 16px !important;
  margin: 0 0 14px 0 !important;
  border: none !important;
}

/* ---------- Visitor Counter: kalau judul otomatisnya dipakai, jadikan orange ---------- */
#customblock-visitor_counter > .title,
#customblock-visitor > .title {
  display: block !important;
  width: 100% !important;
  background: #e7b04b !important;
  color: #ffffff !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  text-transform: uppercase !important;
  letter-spacing: 2px !important;
  padding: 12px 16px !important;
  margin: 0 0 14px 0 !important;
  text-align: left !important;
}

/* ---------- Box umum ---------- */
.jpeps-sidebar-box,
.jpeps-side-menu,
.jpeps-visitor-counter,
.jpeps-indexing-logos {
  width: 100% !important;
  margin: 0 0 18px 0 !important;
  padding: 0 !important;
  background: transparent !important;
  text-align: center !important;
}

/* ---------- Gambar umum sidebar ---------- */
.jpeps-sidebar-img,
.jpeps-sidebar-box img,
.pkp_structure_sidebar .pkp_block img {
  display: block !important;
  height: auto !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  border: none !important;
  box-shadow: none !important;
}

/* ---------- Contact & Article Template ---------- */
#customblock-contact_us img,
#customblock-article_template img {
  width: 92% !important;
  max-width: 360px !important;
  margin: 12px auto 16px auto !important;
}

/* ---------- Submit Manuscript ---------- */
.jpeps-submit-link {
  display: block !important;
  text-align: center !important;
  color: #006b9a !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  text-decoration: none !important;
  margin: 8px 0 14px 0 !important;
}

.jpeps-submit-link:hover {
  color: #d99000 !important;
  text-decoration: underline !important;
}

/* ---------- MAIN MENU ---------- */
#customblock-main_menu ul,
.jpeps-side-menu ul,
.jpeps-main-menu {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  text-align: left !important;
}

#customblock-main_menu li,
.jpeps-side-menu li,
.jpeps-main-menu li {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  border-bottom: 1px solid #b94b4b !important;
}

#customblock-main_menu li a,
.jpeps-side-menu li a,
.jpeps-main-menu li a {
  display: block !important;
  color: #006b9a !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 1.35 !important;
  padding: 11px 16px !important;
  text-decoration: none !important;
}

#customblock-main_menu li a:hover,
.jpeps-side-menu li a:hover,
.jpeps-main-menu li a:hover {
  color: #d99000 !important;
  text-decoration: underline !important;
  background: #fff8ea !important;
}

/* ---------- Visitor Counter isi ---------- */
#customblock-visitor_counter,
#customblock-visitor,
.jpeps-visitor-counter {
  text-align: center !important;
}

#customblock-visitor_counter img,
#customblock-visitor img,
.jpeps-visitor-counter img {
  width: auto !important;
  max-width: 88% !important;
  margin: 12px auto 16px auto !important;
}

#customblock-visitor_counter a,
#customblock-visitor a,
.jpeps-visitor-counter a {
  color: #006b9a !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 18px !important;
  text-decoration: none !important;
}

/* ---------- Logo-logo indexing agar rapi ---------- */
#customblock-relawan_indonesia,
#customblock-member,
#customblock-mendelay,
#customblock-mendeley,
#customblock-turnitin,
#customblock-logo_adi,
#customblock-indexing_logo,
#customblock-indexing_logos,
#customblock-sidebar_indexing,
#customblock-journal_indexing,
#customblock-supervised_by {
  text-align: center !important;
  margin: 0 0 20px 0 !important;
  padding: 0 !important;
}

#customblock-relawan_indonesia img,
#customblock-supervised_by img {
  width: auto !important;
  max-width: 72% !important;
  margin: 12px auto 18px auto !important;
}

#customblock-member img {
  width: auto !important;
  max-width: 88% !important;
  margin: 12px auto 18px auto !important;
}

#customblock-mendelay img,
#customblock-mendeley img {
  width: auto !important;
  max-width: 72% !important;
  margin: 12px auto 18px auto !important;
}

#customblock-turnitin img {
  width: auto !important;
  max-width: 76% !important;
  margin: 12px auto 18px auto !important;
}

#customblock-logo_adi img {
  width: auto !important;
  max-width: 78% !important;
  margin: 12px auto 18px auto !important;
}

/* Jika semua logo dibuat dalam satu block */
.jpeps-indexing-logos img {
  width: auto !important;
  max-width: 82% !important;
  margin: 14px auto 22px auto !important;
}

.jpeps-indexing-logos .logo-small {
  max-width: 68% !important;
}

.jpeps-indexing-logos .logo-medium {
  max-width: 78% !important;
}

.jpeps-indexing-logos .logo-large {
  max-width: 90% !important;
}

/* ---------- Hilangkan bullet, garis, dan jarak aneh dari gambar di custom block ---------- */
.pkp_structure_sidebar .pkp_block p {
  margin: 0 0 12px 0 !important;
  padding: 0 !important;
}

.pkp_structure_sidebar .pkp_block a {
  color: #006b9a;
  text-decoration: none;
}

.pkp_structure_sidebar .pkp_block a:hover {
  color: #d99000;
  text-decoration: underline;
}

/* ---------- Mobile ---------- */
@media (max-width: 767px) {
  .jpeps-sidebar-title,
  .jpeps-side-title,
  #customblock-visitor_counter > .title,
  #customblock-visitor > .title {
    font-size: 18px !important;
    padding: 10px 14px !important;
  }

  #customblock-main_menu li a,
  .jpeps-side-menu li a,
  .jpeps-main-menu li a,
  .jpeps-submit-link {
    font-size: 18px !important;
  }
}

/* =========================================================
   JPEPS HEADER STYLE - Tampilan atas website lebih modern
   ========================================================= */

/* Header utama */
.pkp_structure_head {
  background: linear-gradient(135deg, #0b3d78 0%, #0d5c9f 55%, #0b7a4b 100%) !important;
  border-bottom: 4px solid #e7b04b !important;
}

/* Wrapper header supaya lebih rapi di tengah */
.pkp_head_wrapper {
  max-width: 1240px !important;
  margin: 0 auto !important;
  padding: 22px 24px 0 24px !important;
  position: relative !important;
}

/* Logo jurnal */
.pkp_site_name {
  padding: 0 !important;
  margin: 0 !important;
  text-align: left !important;
}

.pkp_site_name .is_img img,
.pkp_site_name img {
  max-height: 110px !important;
  width: auto !important;
  padding: 8px !important;
  background: #ffffff !important;
  border-radius: 10px !important;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.20) !important;
}

/* Nama jurnal jika tampil sebagai teks */
.pkp_site_name a,
.pkp_site_name a:visited {
  color: #ffffff !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}

/* Menu navigasi utama */
.pkp_navigation_primary_wrapper {
  margin-top: 20px !important;
  background: rgba(0, 0, 0, 0.16) !important;
  border-radius: 14px 14px 0 0 !important;
  padding: 0 16px !important;
}

.pkp_navigation_primary {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
}

.pkp_navigation_primary > li > a {
  color: #ffffff !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: 0.3px !important;
  padding: 17px 16px !important;
  text-decoration: none !important;
  border-bottom: 3px solid transparent !important;
  transition: all 0.25s ease-in-out !important;
}

.pkp_navigation_primary > li > a:hover,
.pkp_navigation_primary > li > a:focus,
.pkp_navigation_primary > li:hover > a {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.14) !important;
  border-bottom-color: #e7b04b !important;
  text-decoration: none !important;
}

/* Dropdown About */
.pkp_navigation_primary ul {
  background: #ffffff !important;
  border-radius: 0 0 10px 10px !important;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.20) !important;
  border: none !important;
  overflow: hidden !important;
}

.pkp_navigation_primary ul a {
  color: #0b3d78 !important;
  font-size: 14px !important;
  padding: 11px 16px !important;
  text-decoration: none !important;
}

.pkp_navigation_primary ul a:hover {
  color: #ffffff !important;
  background: #0d5c9f !important;
}

/* Search */
.pkp_navigation_search_wrapper a,
.pkp_navigation_search_wrapper a:visited {
  color: #ffffff !important;
  font-weight: 700 !important;
  padding: 17px 16px !important;
}

.pkp_navigation_search_wrapper a:hover {
  color: #e7b04b !important;
  text-decoration: none !important;
}

/* User menu kanan atas */
.pkp_navigation_user_wrapper {
  top: 8px !important;
  right: 24px !important;
  padding: 0 !important;
}

.pkp_navigation_user > li > a,
.pkp_navigation_user > li > a:visited {
  color: #ffffff !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}

.pkp_navigation_user > li > a:hover {
  color: #e7b04b !important;
}

/* Tambahan efek garis highlight di bawah header */
.pkp_structure_head::after {
  content: "";
  display: block;
  height: 1px;
  background: rgba(255, 255, 255, 0.18);
}

/* Layout isi agar tidak terlalu mepet header */
.pkp_structure_content {
  padding-top: 26px !important;
}

/* Mobile header */
@media (max-width: 767px) {
  .pkp_head_wrapper {
    padding: 18px 16px 0 16px !important;
  }

  .pkp_site_name {
    text-align: center !important;
  }

  .pkp_site_name .is_img img,
  .pkp_site_name img {
    max-height: 86px !important;
  }

  .pkp_navigation_primary_wrapper {
    margin-top: 16px !important;
    border-radius: 12px 12px 0 0 !important;
  }

  .pkp_navigation_primary {
    display: block !important;
  }

  .pkp_navigation_primary > li > a {
    display: block !important;
    padding: 13px 14px !important;
  }
}

/* =========================================================
   JPEPS HEADER TITLE BESIDE LOGO
   Menampilkan nama jurnal di samping logo header
   ========================================================= */

/* Logo + nama jurnal sejajar */
.pkp_site_name,
.pkp_site_name .is_img,
.pkp_site_name a {
  display: flex !important;
  align-items: center !important;
}

.pkp_site_name a {
  gap: 20px !important;
  text-decoration: none !important;
}

/* Nama jurnal di samping logo */
.pkp_site_name a::after {
  content: "Journal of Primary Education and Pedagogical Studies\A JPEPS - Universitas Nahdlatul Ulama Sumatera Utara" !important;
  white-space: pre-line !important;
  color: #ffffff !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 28px !important;
  line-height: 1.25 !important;
  font-weight: 800 !important;
  letter-spacing: 0.4px !important;
  text-shadow: 0 3px 10px rgba(0, 0, 0, 0.28) !important;
  max-width: 720px !important;
}

/* Baris kecil / subtitle */
.pkp_site_name a:hover::after {
  color: #ffffff !important;
}

/* Sesuaikan tinggi logo agar proporsional dengan nama jurnal */
.pkp_site_name .is_img img,
.pkp_site_name img {
  max-height: 105px !important;
}

/* Responsive tablet */
@media (max-width: 1024px) {
  .pkp_site_name a::after {
    font-size: 23px !important;
    max-width: 560px !important;
  }
}

/* Responsive HP: logo dan nama jurnal ditumpuk */
@media (max-width: 767px) {
  .pkp_site_name,
  .pkp_site_name .is_img,
  .pkp_site_name a {
    flex-direction: column !important;
    justify-content: center !important;
    text-align: center !important;
  }

  .pkp_site_name a {
    gap: 12px !important;
  }

  .pkp_site_name a::after {
    font-size: 20px !important;
    line-height: 1.25 !important;
    max-width: 100% !important;
  }

  .pkp_site_name .is_img img,
  .pkp_site_name img {
    max-height: 82px !important;
  }
}

/* =========================================================
   FIX RESPONSIVE HEADER 100% ZOOM
   Mencegah nama jurnal/user menu hilang atau kepotong saat browser 100%
   ========================================================= */

/* Pastikan header tidak memotong dropdown */
.pkp_structure_head,
.pkp_head_wrapper {
  overflow: visible !important;
}

/* User menu kanan atas tetap terlihat */
.pkp_navigation_user_wrapper {
  position: absolute !important;
  top: 10px !important;
  right: 24px !important;
  z-index: 99999 !important;
  max-width: 280px !important;
  white-space: nowrap !important;
}

.pkp_navigation_user,
.pkp_navigation_user > li,
.pkp_navigation_user > li > a {
  white-space: nowrap !important;
}

/* Dropdown user jangan keluar layar */
.pkp_navigation_user ul,
.pkp_navigation_user .dropdown-menu {
  right: 0 !important;
  left: auto !important;
  z-index: 999999 !important;
  min-width: 210px !important;
}

/* Beri ruang kanan untuk username agar tidak menabrak nama jurnal */
.pkp_site_name {
  max-width: calc(100% - 310px) !important;
}

/* Pada layar laptop, kecilkan tulisan nama jurnal */
@media (max-width: 1366px) {
  .pkp_site_name a::after {
    font-size: 24px !important;
    max-width: 620px !important;
  }

  .pkp_site_name .is_img img,
  .pkp_site_name img {
    max-height: 92px !important;
  }
}

@media (max-width: 1180px) {
  .pkp_site_name a::after {
    font-size: 21px !important;
    max-width: 500px !important;
  }

  .pkp_navigation_primary > li > a {
    font-size: 14px !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
}

/* Pada layar kecil, user menu pindah ke tengah agar tidak hilang */
@media (max-width: 920px) {
  .pkp_navigation_user_wrapper {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    max-width: 100% !important;
    text-align: center !important;
    margin: 0 0 12px 0 !important;
  }

  .pkp_site_name {
    max-width: 100% !important;
  }

  .pkp_site_name,
  .pkp_site_name .is_img,
  .pkp_site_name a {
    justify-content: center !important;
    text-align: center !important;
  }
}

/* =========================================================
   FIX REGISTER/LOGIN + NAVBAR SEJAJAR
   Register/Login agak ke kiri, menu dan Search satu baris
   ========================================================= */

/* Register/Login geser sedikit ke kiri dari tepi kanan */
.pkp_navigation_user_wrapper {
  right: 80px !important;
  top: 14px !important;
}

.pkp_navigation_user > li > a {
  padding-left: 10px !important;
  padding-right: 10px !important;
}

/* Bar menu utama dibuat 1 baris: menu kiri, search kanan */
.pkp_navigation_primary_row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: nowrap !important;
  width: 100% !important;
  margin-top: 20px !important;
  background: rgba(0, 0, 0, 0.16) !important;
  border-radius: 14px 14px 0 0 !important;
  padding: 0 18px !important;
}

/* Hilangkan background ganda pada wrapper menu */
.pkp_navigation_primary_wrapper {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  margin-top: 0 !important;
  background: transparent !important;
  border-radius: 0 !important;
  padding: 0 !important;
}

.pkp_navigation_primary {
  display: flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  gap: 2px !important;
  margin: 0 !important;
  padding: 0 !important;
}

.pkp_navigation_primary > li {
  flex: 0 0 auto !important;
}

.pkp_navigation_primary > li > a {
  padding: 16px 14px !important;
  white-space: nowrap !important;
}

/* Search sejajar di kanan, tidak turun ke bawah */
.pkp_navigation_search_wrapper {
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  margin-left: auto !important;
  padding: 0 !important;
  white-space: nowrap !important;
}

.pkp_navigation_search_wrapper a,
.pkp_navigation_search_wrapper a:visited {
  display: flex !important;
  align-items: center !important;
  height: auto !important;
  padding: 16px 14px !important;
  white-space: nowrap !important;
}

/* Untuk layar laptop kecil, kecilkan menu agar tetap sejajar */
@media (max-width: 1280px) {
  .pkp_navigation_user_wrapper {
    right: 55px !important;
  }

  .pkp_navigation_primary > li > a {
    font-size: 14px !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  .pkp_navigation_search_wrapper a {
    font-size: 14px !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
}

@media (max-width: 920px) {
  .pkp_navigation_user_wrapper {
    right: auto !important;
  }

  .pkp_navigation_primary_row {
    display: block !important;
    padding: 0 12px !important;
  }

  .pkp_navigation_primary {
    display: block !important;
  }

  .pkp_navigation_search_wrapper {
    justify-content: center !important;
    margin-left: 0 !important;
  }
}