
/* ==========================================
   MANAGEABLE JOURNAL - FINAL CUSTOM CSS
   Header, Logo, Navigation, Sidebar
   ========================================== */


/* ==========================================
   1. HEADER UTAMA
   ========================================== */

.pkp_structure_head {
    background-color: #ffffff;
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0;
    border: none;

    /* Penting: submenu tidak terpotong */
    overflow: visible !important;

    position: relative;
    z-index: 1000;
}


/* ==========================================
   2. HEADER WRAPPER
   ========================================== */

.pkp_head_wrapper,
.pkp_site_name_wrapper {
    width: 100%;
    max-width: 100%;
    padding: 0;
    margin: 0;

    /* Memungkinkan dropdown tampil */
    overflow: visible !important;
}


/* ==========================================
   3. LOGO JURNAL FULL WIDTH
   ========================================== */

.pkp_site_name {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0 !important;
}

.pkp_site_name .is_img img {
    display: block;
    width: 100%;
    height: auto;
    max-height: none;
    margin: 0 auto;
    border: none;

    image-rendering: -webkit-optimize-contrast;

    transition: none !important;
    animation: none !important;
    opacity: 1 !important;
}


/* ==========================================
   4. NAVIGASI UTAMA
   ========================================== */

.pkp_site_nav_menu,
.pkp_navigation_primary_row,
.pkp_navigation_primary_wrapper {
    overflow: visible !important;
}

.pkp_navigation_primary {
    overflow: visible !important;
}

.pkp_navigation_primary > li {
    position: relative;
}


/* ==========================================
   5. PERBAIKAN SUBMENU / DROPDOWN
   ========================================== */

@media screen and (min-width: 992px) {

    /* Menu induk */
    .pkp_navigation_primary > li {
        position: relative;
    }

    /* Dropdown saat hover atau fokus */
    .pkp_navigation_primary > li:hover > ul,
    .pkp_navigation_primary > li:focus-within > ul,
    .pkp_navigation_primary > li:hover
    > .dropdown-menu,
    .pkp_navigation_primary > li:focus-within
    > .dropdown-menu {

        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;

        position: absolute;
        top: 100%;
        left: 0;

        z-index: 9999 !important;
    }

    /* Dropdown bawaan OJS */
    .pkp_navigation_primary .dropdown-menu {
        z-index: 9999 !important;
    }

    /* Pastikan area navigasi tidak menutupi menu */
    .pkp_site_nav_menu {
        position: relative;
        z-index: 1001;
    }
}


/* ==========================================
   6. RESPONSIVE LOGO
   ========================================== */

@media screen and (max-width: 768px) {

    .pkp_site_name .is_img img {
        width: 100%;
        height: auto;
    }

}


/* ==========================================
   7. CUSTOM SIDEBAR MENU
   ========================================== */

.custom-menu {
    list-style: none;
    padding: 0;
    margin: 0;
}

.custom-menu li {
    margin: 5px 0;
}

.custom-menu a {
    display: block;

    background-color: #1ea6c4;
    color: #ffffff;

    text-decoration: none;
    font-weight: 700;
    text-align: center;

    padding: 10px;
    border-radius: 4px;

    position: relative;
    overflow: hidden;

    text-shadow:
        1px 1px 3px rgba(0, 0, 0, 0.6);

    transition:
        background-color 0.25s ease,
        transform 0.25s ease;
}


/* ==========================================
   8. EFEK HOVER SIDEBAR
   ========================================== */

.hover-sweep-to-right:hover {
    background-color: #0056b3;
    transform: translateX(2px);

    text-shadow:
        0 0 6px rgba(255, 255, 255, 0.7);
}

.hover-sweep-to-right:active,
.hover-sweep-to-right:focus {
    background-color: #003f8a;
    outline: none;
}


/* ==========================================
   9. JUDUL CUSTOM BLOCK
   ========================================== */

#customblock-menu .title {
    background-color: #3c73bd;
    color: #ffffff;

    text-align: center;
    padding: 8px;

    font-weight: bold;

    border-radius: 4px 4px 0 0;

    text-shadow:
        1px 1px 3px rgba(0, 0, 0, 0.5);
}


/* ==========================================
   END - MANAGEABLE JOURNAL CSS
   ========================================== */
