/*
=========================================================
BAHTERA AL FIKR PRESS - OJS SITE STYLE SHEET
Versi benar dan aman untuk membuat HEADER / LOGO WEBSITE full width.

PENTING:
1. Hapus CSS lama terlebih dahulu.
2. Upload file ini di:
   Website Settings > Appearance > Advanced > Site Style Sheet
3. Upload gambar banner/header di:
   Website Settings > Appearance > Setup > Page Header Logo
4. Disarankan ukuran gambar: 1920 x 420 px atau 1920 x 500 px.
=========================================================
*/


/* =====================================================
   1. RESET AMAN UNTUK AREA HEADER
   ===================================================== */

.pkp_structure_head,
.pkp_head_wrapper,
.pkp_site_name_wrapper,
.pkp_site_name {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box;
}

.pkp_structure_head {
  background: #ffffff;
  border: none;
}


/* =====================================================
   2. LOGO / BANNER HEADER FULL WIDTH
   ===================================================== */

.pkp_site_name {
  display: block !important;
  text-align: center;
  line-height: 0;
}

.pkp_site_name a {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.pkp_site_name img {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  object-fit: cover;
  border: 0;
}


/* =====================================================
   3. JIKA OJS MENAMPILKAN NAMA SITUS BERUPA TEKS
   ===================================================== */

.pkp_site_name .is_text,
.pkp_site_name a.is_text {
  display: block !important;
  width: 100% !important;
  padding: 28px 16px !important;
  background: #ffffff;
  color: #0b2c5f !important;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 34px;
  font-weight: 700;
  line-height: 1.25;
  text-align: center;
  text-decoration: none;
}


/* =====================================================
   4. NAVIGASI DI BAWAH HEADER
   ===================================================== */

.pkp_navigation_primary_row {
  width: 100% !important;
  margin: 0 !important;
  background: #0b2c5f !important;
  border-top: 3px solid #c69214;
  box-shadow: 0 4px 14px rgba(11, 44, 95, 0.12);
}

.pkp_navigation_primary_wrapper {
  max-width: 1180px !important;
  margin: 0 auto !important;
  padding-left: 16px !important;
  padding-right: 16px !important;
  box-sizing: border-box;
}

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

.pkp_navigation_primary > li > a:hover,
.pkp_navigation_user > li > a:hover,
.pkp_navigation_primary > li > a:focus,
.pkp_navigation_user > li > a:focus {
  color: #f2c766 !important;
  background: transparent !important;
}


/* =====================================================
   5. KONTEN UTAMA TETAP AMAN
   Tidak mengubah halaman jurnal secara agresif.
   ===================================================== */

.pkp_structure_content {
  background: #ffffff;
}

.pkp_structure_main {
  box-sizing: border-box;
}


/* =====================================================
   6. DAFTAR JURNAL DI LAMAN UTAMA SAJA
   Styling ringan agar tidak merusak struktur OJS.
   ===================================================== */

.journals {
  max-width: 1180px;
  margin: 32px auto 48px auto;
  padding-left: 16px;
  padding-right: 16px;
  box-sizing: border-box;
}

.journals > h2,
.journals h2:first-child {
  color: #0b2c5f;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 32px;
  font-weight: 700;
  text-align: center;
  margin-bottom: 28px;
}

.journals > h2::after,
.journals h2:first-child::after {
  content: "";
  display: block;
  width: 84px;
  height: 3px;
  margin: 14px auto 0 auto;
  background: #c69214;
  border-radius: 20px;
}

.journals > ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.journals > ul > li {
  margin-bottom: 22px;
  padding: 22px;
  background: #ffffff;
  border: 1px solid rgba(11, 44, 95, 0.14);
  border-left: 5px solid #0b2c5f;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(11, 44, 95, 0.07);
}

.journals h3 {
  margin-top: 0;
  margin-bottom: 10px;
  color: #0b2c5f;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 22px;
  line-height: 1.35;
}

.journals h3 a {
  color: #0b2c5f;
  text-decoration: none;
}

.journals h3 a:hover {
  color: #b8860b;
  text-decoration: underline;
}

.journals p {
  color: #38495f;
  font-size: 15px;
  line-height: 1.7;
  margin-bottom: 14px;
}

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

.journals > ul > li > ul,
.journals .links {
  list-style: none;
  padding: 0;
  margin: 14px 0 0 0;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.journals > ul > li > ul > li {
  margin: 0;
  padding: 0;
}

.journals > ul > li > ul a,
.journals .links a {
  display: inline-block;
  padding: 8px 14px;
  background: #0b2c5f;
  color: #ffffff !important;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
}

.journals > ul > li > ul a:hover,
.journals .links a:hover {
  background: #c69214;
  color: #ffffff !important;
  text-decoration: none;
}


/* =====================================================
   7. RESPONSIVE
   ===================================================== */

@media (max-width: 768px) {
  .pkp_navigation_primary_wrapper {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  .pkp_site_name .is_text,
  .pkp_site_name a.is_text {
    font-size: 26px;
    padding: 22px 12px !important;
  }

  .journals {
    margin-top: 24px;
    padding-left: 12px;
    padding-right: 12px;
  }

  .journals > h2,
  .journals h2:first-child {
    font-size: 28px;
  }

  .journals > ul > li {
    padding: 18px;
    border-left-width: 4px;
  }

  .journals h3 {
    font-size: 20px;
  }

  .journals p {
    font-size: 14.5px;
    line-height: 1.65;
  }
}