/* ==========================================================
   SINTEKMAR 2026 - OJS HEADER CUSTOM STYLE (FINAL)
   Target: OJS 3 Default Theme
   Upload melalui:
   Settings > Website > Appearance > Advanced > Journal Style Sheet

   Penyesuaian utama:
   1. Badge kuning pada header dihilangkan karena sudah ada pada hero homepage.
   2. Logo dibuat lebih besar, proporsional, dan tidak terlihat sebagai thumbnail.
   3. Header dipadatkan agar tidak mengambil ruang vertikal berlebihan.
   4. Navigasi tetap jelas dan konsisten dengan warna SINTEKMAR.
   ========================================================== */

/* ---------- BRAND VARIABLES ---------- */
:root {
  --sintekmar-navy: #003d82;
  --sintekmar-blue: #0056b3;
  --sintekmar-light: #00a8e8;
  --sintekmar-yellow: #fbc02d;
  --sintekmar-white: #ffffff;
  --sintekmar-soft: #eef6ff;
  --sintekmar-nav-overlay: rgba(0, 33, 72, 0.22);
}

/* ==========================================================
   MAIN HEADER CONTAINER
   ========================================================== */
.pkp_structure_head {
  background: linear-gradient(
    110deg,
    var(--sintekmar-navy) 0%,
    var(--sintekmar-blue) 56%,
    #087fc1 100%
  );
  border-bottom: 0 !important;
  box-shadow: 0 5px 18px rgba(0, 38, 84, 0.16);
}

.pkp_head_wrapper {
  padding-top: 10px !important;
  padding-bottom: 0 !important;
}

/* Batasi area header agar tetap sejajar dengan isi OJS */
.pkp_structure_head .pkp_head_wrapper {
  max-width: 1440px;
}

/* ==========================================================
   SITE NAME / LOGO AREA
   ========================================================== */
.pkp_site_name {
  margin: 0 !important;
  padding: 8px 0 12px 0 !important;
  min-height: 0 !important;
}

/* Hilangkan badge tambahan versi CSS lama.
   Informasi portal sudah tampil pada hero content homepage. */
.pkp_site_name::after {
  display: none !important;
  content: none !important;
}

/* Jika OJS masih menggunakan text title, tampilkan secara rapi. */
.pkp_site_name .is_text {
  display: inline-block;
  max-width: 900px;
  padding: 0 !important;
  color: var(--sintekmar-white) !important;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 800;
  font-size: 25px;
  line-height: 1.24;
  letter-spacing: 0.01em;
  text-transform: none;
}

/* ---------- UPLOADED LOGO IMAGE ---------- */
.pkp_site_name .is_img {
  display: inline-block;
  margin: 0;
  padding: 0;
  max-width: 100%;
  vertical-align: middle;
}

.pkp_site_name .is_img img {
  display: block;
  width: auto !important;
  height: auto !important;
  max-height: 104px !important;
  max-width: min(900px, 92vw) !important;
  object-fit: contain;
  margin: 0;
  padding: 0;
}

/* Bila file logo Anda memiliki latar putih, bagian ini menjadikannya
   terlihat sebagai panel branding yang sengaja dirancang, bukan thumbnail. */
.pkp_site_name .is_img {
  background: rgba(255, 255, 255, 0.98);
  border-radius: 8px;
  padding: 6px 10px;
  box-shadow: 0 2px 8px rgba(0, 32, 72, 0.10);
}

/* ==========================================================
   USER NAVIGATION (LOGIN/PROFILE DI KANAN ATAS)
   ========================================================== */
.pkp_navigation_user_wrapper {
  top: 6px;
}

.pkp_navigation_user > li > a,
.pkp_navigation_user > li > a:link,
.pkp_navigation_user > li > a:visited {
  color: var(--sintekmar-white) !important;
  font-weight: 500;
}

.pkp_navigation_user > li > a:hover,
.pkp_navigation_user > li > a:focus {
  color: var(--sintekmar-yellow) !important;
}

/* ==========================================================
   PRIMARY NAVIGATION BAR
   ========================================================== */
.pkp_navigation_primary_row {
  margin-top: 0 !important;
  padding-top: 0 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.18);
  background: var(--sintekmar-nav-overlay);
}

.pkp_navigation_primary_wrapper {
  padding-left: 0;
  padding-right: 0;
}

.pkp_navigation_primary {
  margin: 0;
}

.pkp_navigation_primary > li > a,
.pkp_navigation_primary > li > a:link,
.pkp_navigation_primary > li > a:visited {
  padding: 14px 17px !important;
  color: rgba(255, 255, 255, 0.96) !important;
  font-size: 15px;
  font-weight: 600;
  border-bottom: 3px solid transparent;
  transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease;
}

.pkp_navigation_primary > li > a:hover,
.pkp_navigation_primary > li > a:focus {
  color: var(--sintekmar-yellow) !important;
  border-bottom-color: var(--sintekmar-yellow);
  background: rgba(255, 255, 255, 0.04);
}

.pkp_navigation_primary > li > ul {
  border: none;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 10px 28px rgba(0, 33, 72, 0.20);
}

.pkp_navigation_primary > li > ul a:hover,
.pkp_navigation_primary > li > ul a:focus {
  background: var(--sintekmar-soft);
  color: var(--sintekmar-navy);
}

/* ==========================================================
   SEARCH AREA
   ========================================================== */
.pkp_search .search_prompt,
.pkp_search .search_prompt:link,
.pkp_search .search_prompt:visited {
  color: var(--sintekmar-white) !important;
  font-weight: 600;
}

.pkp_search .search_prompt:hover,
.pkp_search .search_prompt:focus {
  color: var(--sintekmar-yellow) !important;
}

/* ==========================================================
   PAGE CONTENT SPACING
   Mengurangi ruang kosong di antara navigasi dan hero homepage.
   ========================================================== */
.pkp_structure_content {
  padding-top: 0 !important;
}

.pkp_structure_main {
  padding-top: 18px !important;
}

.pkp_page_index .homepage_image,
.pkp_page_index .additional_content,
.pkp_page_index .cmp_announcements,
.obj_announcement_summary {
  margin-top: 0;
}

/* Bila Additional Content OJS memperoleh margin default besar,
   buat tampil lebih dekat dengan bagian atas konten. */
.pkp_page_index .additional_content {
  padding-top: 0;
}

/* ==========================================================
   STANDARD OJS BUTTONS / LINKS
   ========================================================== */
.obj_galley_link,
.cmp_button,
.pkp_page_index .current_issue .read_more {
  transition: all 0.2s ease;
}

.obj_galley_link,
.cmp_button {
  border-color: var(--sintekmar-blue);
  color: var(--sintekmar-blue);
  border-radius: 22px;
}

.obj_galley_link:hover,
.obj_galley_link:focus,
.cmp_button:hover,
.cmp_button:focus {
  background: var(--sintekmar-blue);
  border-color: var(--sintekmar-blue);
  color: var(--sintekmar-white);
}

.pkp_page_index .current_issue .obj_article_summary .title a,
.obj_article_summary .title a {
  color: var(--sintekmar-navy);
}

.pkp_page_index .current_issue .obj_article_summary .title a:hover,
.obj_article_summary .title a:hover {
  color: var(--sintekmar-blue);
}

/* ==========================================================
   TABLET RESPONSIVE
   ========================================================== */
@media (max-width: 991px) {
  .pkp_head_wrapper {
    padding-top: 8px !important;
  }

  .pkp_site_name {
    padding: 7px 0 10px 0 !important;
  }

  .pkp_site_name .is_text {
    max-width: 100%;
    font-size: 20px;
    line-height: 1.28;
  }

  .pkp_site_name .is_img {
    padding: 5px 8px;
  }

  .pkp_site_name .is_img img {
    max-height: 76px !important;
    max-width: min(680px, 90vw) !important;
  }

  .pkp_navigation_primary > li > a,
  .pkp_navigation_primary > li > a:link,
  .pkp_navigation_primary > li > a:visited {
    padding: 12px 13px !important;
    font-size: 14px;
  }
}

/* ==========================================================
   MOBILE RESPONSIVE
   ========================================================== */
@media (max-width: 600px) {
  .pkp_structure_head {
    box-shadow: 0 3px 10px rgba(0, 38, 84, 0.14);
  }

  .pkp_site_name {
    padding: 6px 0 8px 0 !important;
  }

  .pkp_site_name .is_text {
    font-size: 17px;
    line-height: 1.28;
  }

  .pkp_site_name .is_img {
    padding: 4px 6px;
    border-radius: 6px;
  }

  .pkp_site_name .is_img img {
    max-height: 56px !important;
    max-width: calc(100vw - 42px) !important;
  }

  .pkp_structure_main {
    padding-top: 12px !important;
  }
}