/* ============================================================
   PUSTABIBLIA JOURNAL — OJS 3.3.0.11 THEME OVERRIDE — v1.1
   ----------------------------------------------------------
   Theme   : Default (DefaultManuscript)
   Palette : Biru (#1e5fb8/#0b3d7a) + Oranye (#ff8c1a) — UIN Salatiga
   ----------------------------------------------------------
   PERBAIKAN v1.1:
   1. MENU + SEARCH + LOGIN + REGISTER → SATU BARIS (CSS Grid)
   2. QUICK MENU tidak terpotong (max-height 540px dihapus)
   3. BANNER full-width edge-to-edge (rekomendasi 2560×360 px)
   ----------------------------------------------------------
   INSTALL: Dashboard → Settings → Website → Appearance →
   Theme (Default) → Advanced → Custom CSS → paste → Save → Ctrl+F5
   ============================================================ */

/* ---------- 0. VARIABEL WARNA ---------- */
:root {
  --pb-primary:        #1e5fb8;
  --pb-primary-dark:   #0b3d7a;
  --pb-primary-light: #3b82f4;
  --pb-accent:        #ff8c1a;
  --pb-accent-dark:   #e2680a;
  --pb-accent-soft:   #fff4e6;
  --pb-bg:            #fefdf8;
  --pb-bg-alt:        #f8f6f0;
  --pb-fg:            #1f2937;
  --pb-fg-muted:      #6b7280;
  --pb-border:        #e5e7eb;
  --pb-shadow:        0 1px 3px rgba(11, 61, 122, 0.08);
  --pb-shadow-md:     0 4px 12px rgba(11, 61, 122, 0.12);
  --pb-radius:        6px;
  --pb-radius-lg:     10px;
  --primary:          var(--pb-primary);
  --primary-lift:     var(--pb-primary-light);
  --bg:               var(--pb-bg);
  --text:             var(--pb-fg);
  --text-light:       var(--pb-fg-muted);
}

/* ---------- 1. BASE ---------- */
body.pkp_structure_page,
.pkp_structure_page {
  background: var(--pb-bg) !important;
  color: var(--pb-fg) !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
               "Helvetica Neue", Arial, sans-serif !important;
  font-size: 14px;
  line-height: 1.55;
}
a, a:link, a:visited { color: var(--pb-primary); text-decoration: none;
  transition: color .15s ease, background-color .15s ease; }
a:hover, a:focus { color: var(--pb-accent-dark); text-decoration: underline; }
h1, h2, h3, h4, h5, h6 { color: var(--pb-primary-dark); font-weight: 700; }

/* ============================================================
   2. HEADER — BANNER FULL-WIDTH + STRIP UIN  (FIX v1.1)
   ============================================================ */
.pkp_structure_head {
  position: relative !important;
  padding: 0 !important;
  margin: 0 !important;
  background: var(--pb-primary) !important;
  box-shadow: var(--pb-shadow-md);
}

/* Baris 1 — banner */
.pkp_site_name_wrapper {
  grid-area: banner;
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: var(--pb-primary-dark) !important;
  border-bottom: 2px solid var(--pb-accent) !important;
}

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

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

/* ► GAMBAR BANNER — full kiri s/d kanan, tanpa spasi kosong.
   ► REKOMENDASI: 2560 × 360 px (rasio 7:1), JPG, < 500 KB.
   ► Ubah "height" untuk banner lebih tinggi/pendek.        */
.pkp_site_name a.is_img img {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 180px !important;              /* ← tinggi banner */
  max-height: none !important;
  object-fit: cover !important;          /* isi penuh; ganti "contain"
                                           jika tak mau terpotong */
  object-position: center center !important;
}

/* Judul teks (jika belum upload logo) */
.pkp_site_name a.is_text {
  display: block !important;
  width: 100%;
  text-align: center;
  color: #ffffff !important;
  font-size: 26px !important;
  font-weight: 800 !important;
  letter-spacing: 1px;
  padding: 24px 16px 10px !important;
  text-decoration: none !important;
}

/* Strip aksen UIN Salatiga */
.pkp_site_name_wrapper::after {
  content: "Universitas Islam Negeri (UIN) Salatiga";
  display: block;
  width: 100%;
  text-align: center;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--pb-accent);
  padding: 4px 0 6px;
  background: var(--pb-primary-dark);
  border-top: 1px solid rgba(255, 140, 26, 0.3);
}

/* ============================================================
   3. NAVIGASI SATU BARIS (FIX v1.1) — hanya desktop ≥ 993px
   ------------------------------------------------------------
   [ MENU ........................ SEARCH ][ LOGIN | REGISTER ]
   ============================================================ */
@media (min-width: 993px) {

  .pkp_structure_head {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "banner banner"
      "nav    user";
    align-items: center;
    column-gap: 0;
    row-gap: 0;
  }

  /* Larutkan wrapper perantara agar anak-anaknya masuk grid */
  .pkp_head_wrapper {
    display: contents !important;
    max-width: none !important;
    width: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    background: none !important;
  }
  .pkp_structure_head > .pkp_container,
  .pkp_head_wrapper > .pkp_container { display: contents !important; }

  /* KIRI: bar menu (menu + search) */
  .pkp_site_nav_menu {
    grid-area: nav;
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center;
    height: 48px;
    min-width: 0;
    max-width: none !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 0 0 16px !important;
    background: var(--pb-primary) !important;
    border-top: 2px solid var(--pb-accent) !important;
    border-bottom: none !important;
  }

  .pkp_navigation_primary {
    order: 1;
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center;
    min-width: 0;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
  }

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

  .pkp_navigation_primary > li > a {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    height: 46px;
    padding: 0 13px !important;
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    letter-spacing: 0.2px;
    white-space: nowrap !important;   /* ← anti turun baris */
    background: transparent !important;
    border: none !important;
    text-decoration: none !important;
    transition: background-color .15s ease, color .15s ease;
  }

  .pkp_navigation_primary > li > a:hover,
  .pkp_navigation_primary > li > a:focus,
  .pkp_navigation_primary > li > a[aria-current="true"],
  .pkp_navigation_primary > li.active > a {
    background: var(--pb-accent) !important;
    color: #ffffff !important;
    text-decoration: none !important;
  }

  /* SEARCH — didorong ke kanan, nempel sebelum Login */
  .pkp_navigation_search_wrapper {
    order: 2;
    display: flex !important;
    align-items: center;
    margin: 0 8px 0 auto !important;
    padding: 0 !important;
    position: static !important;
  }

  /* KANAN: LOGIN / REGISTER — sejajar satu baris dengan menu */
  .pkp_navigation_user_wrapper {
    grid-area: user;
    position: static !important;
    display: flex !important;
    align-items: center;
    height: 48px;
    margin: 0 !important;
    padding: 0 16px !important;
    background: var(--pb-primary) !important;
    border-top: 2px solid var(--pb-accent) !important;
    transform: none !important;
  }
}

/* Tombol SEARCH */
.pkp_search, .pkp_search_desktop, .pkp_search_mobile {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  padding: 7px 14px !important;
  background: #ffffff !important;
  color: var(--pb-primary) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  border-radius: var(--pb-radius) !important;
  border: 1px solid #ffffff !important;
  text-decoration: none !important;
  white-space: nowrap;
  transition: background-color .15s ease, color .15s ease;
}
.pkp_search:hover, .pkp_search_desktop:hover, .pkp_search_mobile:hover {
  background: var(--pb-accent) !important;
  color: #ffffff !important;
  text-decoration: none !important;
}

/* Tombol LOGIN / REGISTER */
.pkp_navigation_user {
  display: flex !important;
  flex-wrap: nowrap;
  align-items: center;
  gap: 6px;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
.pkp_navigation_user > li { margin: 0 !important; padding: 0 !important; }
.pkp_navigation_user > li > a {
  display: inline-flex !important;
  align-items: center;
  gap: 5px;
  padding: 7px 14px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  border-radius: var(--pb-radius) !important;
  border: 1px solid transparent !important;
  text-decoration: none !important;
  white-space: nowrap;
  transition: all .15s ease;
}
.pkp_navigation_user > li:first-child > a,
.pkp_navigation_user > li > a[href*="login"],
.pkp_navigation_user > li > a[href*="signin"] {
  background: var(--pb-accent) !important;
  color: #ffffff !important;
  border-color: var(--pb-accent) !important;
}
.pkp_navigation_user > li:first-child > a:hover,
.pkp_navigation_user > li > a[href*="login"]:hover {
  background: var(--pb-accent-dark) !important;
  border-color: var(--pb-accent-dark) !important;
}
.pkp_navigation_user > li:last-child > a,
.pkp_navigation_user > li > a[href*="register"] {
  background: #ffffff !important;
  color: var(--pb-primary) !important;
  border-color: #ffffff !important;
}
.pkp_navigation_user > li:last-child > a:hover,
.pkp_navigation_user > li > a[href*="register"]:hover {
  background: var(--pb-bg-alt) !important;
  color: var(--pb-primary-dark) !important;
}
.pkp_navigation_user_wrapper::before,
.pkp_navigation_user_wrapper::after { display: none !important; }

/* Dropdown saat user sudah login (Dashboard, Logout, dsb.) */
.pkp_navigation_user > li.has_submenu { position: relative; }
.pkp_navigation_user > li > ul {
  position: absolute !important;
  top: 100% !important;
  right: 0 !important;
  left: auto !important;
  min-width: 200px;
  background: #ffffff !important;
  border: 1px solid var(--pb-border);
  border-radius: var(--pb-radius);
  box-shadow: var(--pb-shadow-md);
  padding: 6px !important;
  margin: 0 !important;
  list-style: none !important;
  z-index: 999;
}
.pkp_navigation_user > li > ul > li > a {
  display: block !important;
  padding: 8px 12px !important;
  border-radius: 4px;
  color: var(--pb-primary-dark) !important;
  background: transparent !important;
  border: none !important;
}
.pkp_navigation_user > li > ul > li > a:hover {
  background: var(--pb-accent-soft) !important;
}

/* Tombol toggle mobile */
.pkp_site_nav_toggle {
  background: var(--pb-accent) !important;
  color: #ffffff !important;
  border: none !important;
  padding: 8px 12px !important;
  border-radius: var(--pb-radius) !important;
}

/* ============================================================
   4. LAYOUT KONTEN — grid 3 kolom (tetap seperti sebelumnya)
   Urutan sidebar: Quick Menu, Akreditasi, Informasi Jurnal,
                   Tautan Cepat, Peringkat & Indeksasi
   ============================================================ */
.pkp_structure_content.has_sidebar {
  display: grid !important;
  grid-template-columns: 6fr 3fr 3fr !important;
  grid-template-rows: auto auto !important;
  grid-template-areas:
    "main   quick  accred"
    "info   links  rank";
  gap: 20px !important;
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding: 24px 16px !important;
  align-items: start;
}
.pkp_structure_main {
  grid-area: main !important;
  max-width: 100% !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}
.pkp_structure_sidebar.left {
  display: contents !important;
  width: auto !important;
  max-width: none !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: none !important;
}
.pkp_structure_sidebar .pkp_block:nth-child(1) { grid-area: quick;  }
.pkp_structure_sidebar .pkp_block:nth-child(2) { grid-area: accred; }
.pkp_structure_sidebar .pkp_block:nth-child(3) { grid-area: info;   }
.pkp_structure_sidebar .pkp_block:nth-child(4) { grid-area: links;  }
.pkp_structure_sidebar .pkp_block:nth-child(5) { grid-area: rank;   }
.pkp_structure_sidebar .pkp_block:nth-child(n+6) {
  grid-column: 1 / -1;
  grid-row: auto;
}

/* ============================================================
   5. SIDEBAR BLOCK — kartu dengan header berwarna
   ============================================================ */
.pkp_block {
  background: #ffffff !important;
  border: 1px solid var(--pb-border) !important;
  border-radius: var(--pb-radius-lg) !important;
  box-shadow: var(--pb-shadow) !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden;
}
.pkp_block .title {
  background: var(--pb-primary) !important;
  color: #ffffff !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 10px 14px !important;
  margin: 0 !important;
  border: none !important;
  border-bottom: 2px solid var(--pb-accent) !important;
}
.pkp_structure_sidebar .pkp_block:nth-child(2) .title,
.pkp_structure_sidebar .pkp_block:nth-child(4) .title {
  background: linear-gradient(90deg, var(--pb-accent), var(--pb-accent-dark)) !important;
}
.pkp_block .content {
  padding: 14px !important;
  font-size: 13px !important;
  line-height: 1.55 !important;
  color: var(--pb-fg) !important;
  overflow-wrap: break-word;
}

/* ► FIX v1.1: QUICK MENU tampil SEMUA — tidak terpotong lagi.
   (Dibatasi max-height: 540px + scroll pada versi lama.)
   Jika suatu saat ingin dibatasi lagi, aktifkan baris komentar. */
.pkp_structure_sidebar .pkp_block:nth-child(1) .content {
  max-height: none !important;
  overflow: visible !important;
  padding: 8px !important;
  /* max-height: 540px; overflow-y: auto; */  /* ← mode scroll lama */
}

/* Gambar (logo akreditasi/indeks) tidak melebihi lebar kolom */
.pkp_block .content img {
  max-width: 100% !important;
  height: auto !important;
}

.pkp_block .content ul, .pkp_block .content ul.nav {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.pkp_block .content ul > li {
  padding: 6px 0 !important;
  border-bottom: 1px dashed var(--pb-border);
  margin: 0 !important;
}
.pkp_block .content ul > li:last-child { border-bottom: none !important; }
.pkp_block .content a {
  display: inline-flex;
  align-items: flex-start;
  gap: 6px;
  color: var(--pb-fg) !important;
  font-size: 13px !important;
  padding: 4px 6px !important;
  border-radius: var(--pb-radius) !important;
}
.pkp_block .content a:hover {
  background: var(--pb-accent-soft) !important;
  color: var(--pb-primary) !important;
  text-decoration: none !important;
}

/* ============================================================
   6. DAFTAR ARTIKEL
   ============================================================ */
.cmp_article_list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.cmp_article_list > li {
  background: #ffffff !important;
  border: 1px solid var(--pb-border) !important;
  border-left: 4px solid var(--pb-accent) !important;
  border-radius: var(--pb-radius) !important;
  padding: 14px 16px !important;
  margin: 0 !important;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.cmp_article_list > li:hover {
  border-left-color: var(--pb-primary) !important;
  box-shadow: var(--pb-shadow-md) !important;
}
.obj_article_summary .title, .obj_article_summary h3 {
  color: var(--pb-accent-dark) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  margin: 0 0 6px 0 !important;
}
.obj_article_summary .title a, .obj_article_summary h3 a { color: inherit !important; }
.obj_article_summary .title a:hover, .obj_article_summary h3 a:hover {
  color: var(--pb-primary) !important;
  text-decoration: underline !important;
}
.obj_article_summary .meta, .obj_article_summary .authors, .obj_article_summary .pages {
  color: var(--pb-fg-muted) !important;
  font-size: 12px !important;
  margin-bottom: 4px !important;
}
.obj_article_summary .galleys_links a, .obj_article_summary .pdf {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: var(--pb-primary) !important;
  color: #ffffff !important;
  padding: 4px 10px !important;
  border-radius: var(--pb-radius) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  margin-top: 6px !important;
}
.obj_article_summary .galleys_links a:hover {
  background: var(--pb-accent) !important;
  color: #ffffff !important;
}

.page-content h2, .page_content h2, .pkp_structure_main h2 {
  color: var(--pb-primary-dark) !important;
  border-bottom: 3px solid var(--pb-accent) !important;
  padding-bottom: 6px;
  margin-bottom: 12px;
}
.page_title, h1.page_title {
  background: var(--pb-primary) !important;
  color: #ffffff !important;
  padding: 10px 16px !important;
  border-radius: var(--pb-radius) !important;
  font-size: 16px !important;
}

/* ============================================================
   7. FOOTER — ringkas satu baris
   ============================================================ */
.pkp_structure_footer_wrapper {
  background: var(--pb-primary-dark) !important;
  color: #ffffff !important;
  padding: 0 !important;
  margin-top: 0 !important;
  border-top: 3px solid var(--pb-accent) !important;
}
.pkp_structure_footer {
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding: 8px 16px !important;
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 16px;
}
.pkp_footer_content {
  margin: 0 !important;
  padding: 0 !important;
  font-size: 12px !important;
  color: rgba(255, 255, 255, 0.85) !important;
  flex: 0 1 auto;
  max-width: 60%;
}
.pkp_footer_content p { margin: 0 !important; }
.pkp_brand_footer {
  margin: 0 !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  font-size: 11px !important;
  color: rgba(255, 255, 255, 0.75) !important;
}
.pkp_brand_footer a { display: inline-flex; align-items: center; text-decoration: none !important; }
.pkp_brand_footer img {
  max-height: 22px !important;
  width: auto !important;
  opacity: 0.95;
  filter: brightness(0) invert(1);
}
.pkp_footer_content .flag_counter,
.pkp_footer_content img[alt*="visitor" i],
.pkp_footer_content img[alt*="flag" i] {
  display: inline-block !important;
  max-height: 18px !important;
  vertical-align: middle !important;
  margin: 0 2px !important;
}
.pkp_structure_footer::after {
  content: "© Pustabiblia — UIN Salatiga";
  display: block;
  width: 100%;
  text-align: center;
  font-size: 11px;
  font-weight: 600;
  color: var(--pb-accent);
  padding-top: 4px;
  margin-top: 4px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  order: 3;
  flex: 0 0 100%;
}

/* ============================================================
   8. PAGINATION & TOMBOL
   ============================================================ */
.cmp_breadcrumbs, .cmp_pagination { font-size: 12px !important; }
.cmp_pagination a, .cmp_pagination .current {
  padding: 4px 10px !important;
  border-radius: var(--pb-radius) !important;
  border: 1px solid var(--pb-border) !important;
  background: #ffffff !important;
  color: var(--pb-primary) !important;
  font-weight: 600 !important;
}
.cmp_pagination .current, .cmp_pagination a:hover {
  background: var(--pb-accent) !important;
  color: #ffffff !important;
  border-color: var(--pb-accent) !important;
  text-decoration: none !important;
}
.cmp_button, a.pkp_button, button.pkp_button, .pkp_button_link {
  background: var(--pb-accent) !important;
  color: #ffffff !important;
  border: 1px solid var(--pb-accent) !important;
  border-radius: var(--pb-radius) !important;
  padding: 8px 16px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: all .15s ease;
}
.cmp_button:hover, a.pkp_button:hover, button.pkp_button:hover, .pkp_button_link:hover {
  background: var(--pb-accent-dark) !important;
  border-color: var(--pb-accent-dark) !important;
  color: #ffffff !important;
  text-decoration: none !important;
}

/* ---------- 9. AKSEN TITIK ORANYE (judul tanpa logo) ---------- */
.pkp_site_name.is_text::before,
.pkp_site_name a.is_text::before {
  content: "";
  display: inline-block;
  width: 10px;
  height: 10px;
  margin-right: 8px;
  background: var(--pb-accent);
  border-radius: 50%;
  vertical-align: middle;
  box-shadow: 0 0 0 2px rgba(255, 140, 26, 0.25);
}

/* ============================================================
   10. RESPONSIVE (≤ 992px) — header kembali normal,
       pakai tombol hamburger bawaan tema
   ============================================================ */
@media (max-width: 992px) {
  .pkp_structure_head,
  .pkp_head_wrapper,
  .pkp_site_nav_menu {
    display: block !important;
    max-width: none !important;
  }
  .pkp_site_nav_menu {
    background: var(--pb-primary) !important;
    border-top: 2px solid var(--pb-accent) !important;
    padding: 8px 12px !important;
  }
  .pkp_navigation_search_wrapper {
    position: static !important;
    display: flex !important;
    margin: 0 0 8px 0 !important;
    padding: 0 !important;
  }
  .pkp_navigation_user_wrapper {
    position: static !important;
    display: block !important;
    background: var(--pb-primary) !important;
    padding: 0 12px 10px !important;
    margin: 0 !important;
  }
  .pkp_navigation_user { flex-wrap: wrap; gap: 6px; }
  .pkp_navigation_user > li > a {
    padding: 6px 10px !important;
    font-size: 12px !important;
  }

  .pkp_structure_content.has_sidebar {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "main" "quick" "accred" "info" "links" "rank" !important;
    gap: 16px !important;
    padding: 16px 12px !important;
  }
  .pkp_structure_footer {
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
  }
  .pkp_footer_content { max-width: 100%; }
  .pkp_site_name a.is_img img { height: 110px !important; }
}

/* ---------- 11. Layar 993–1200px: rapikan agar tetap 1 baris ---------- */
@media (min-width: 993px) and (max-width: 1200px) {
  .pkp_navigation_primary > li > a {
    padding: 0 9px !important;
    font-size: 12px !important;
  }
  .pkp_search { padding: 6px 10px !important; font-size: 12px !important; }
  .pkp_navigation_user > li > a {
    padding: 6px 10px !important;
    font-size: 12px !important;
  }
}

/* ============================================================
   END OF FILE — Pustabiblia v1.1
   ============================================================ */