/* ---------- Header: Full-width responsive banner ---------- */

/* 1. Menghilangkan jarak/padding pinggir pada wadah header OJS */
.pkp_structure_head .pkp_head_wrapper,
.pkp_site_name_wrapper,
.pkp_site_name {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin: 0 !important;
}

/* 2. Membuat gambar banner memenuhi lebar layar secara proporsional */
.pkp_site_name img,
.pkp_site_name .is_img img,
.pkp_site_name_wrapper img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important; /* Menghapus batas tinggi 200px agar rasio gambar tidak penyok */
    display: block !important;
}

/* 3. Styling dasar struktur header */
.pkp_structure_head {
    background: #ffffff;
    border-bottom: 3px solid #0b6e4f;
    padding-top: 0 !important; /* Opsional: menghapus celah putih di atas banner */
}

/* ---------- Menggeser Homepage Image & Menambah Garis Pembatas ---------- */
.homepage_image {
    margin-top: 67px !important; /* Jarak dari elemen atas ke garis pembatas */
    padding-top: 0px !important; /* Jarak dari garis pembatas ke gambar */
    border-top: 3px solid #0b6e4f !important; /* Ketebalan, gaya, dan warna garis */
    display: block !important;
    clear: both !important;
}

.homepage_image img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    display: block !important;
}

/* ---------- Perbaikan Ikon 3 Garis Hijau (#0b6e4f) Senada Garis Pembatas ---------- */

/* 1. Pastikan tombol pembungkus transparan */
.pkp_site_nav_toggle,
.pkp_site_nav_toggle:hover,
.pkp_site_nav_toggle:focus {
    background: transparent !important;
    border: none !important;
    color: #0b6e4f !important;
}

/* 2. Hapus background kotak pada span pembungkus teks */
.pkp_site_nav_toggle > span {
    background: transparent !important;
}

/* 3. Gambar ulang 3 garis horizontal berwarna hijau #0b6e4f */
.pkp_site_nav_toggle > span::before {
    background: #0b6e4f !important;
    box-shadow: 0 6px 0 #0b6e4f, 0 12px 0 #0b6e4f !important;
}

/* 4. Ubah menjadi tanda silang (X) berwarna hijau #0b6e4f saat menu dibuka */
.pkp_site_nav_toggle.pkp_site_nav_toggle--transform > span::before,
.pkp_site_nav_toggle.pkp_site_nav_toggle--transform > span::after {
    background: #0b6e4f !important;
    box-shadow: none !important;
}