journals ul .body .description a {display: inline;}

@import url('https://fonts.googleapis.com/css?family=Sunflower:300');
html, body, * {font-family: Sunflower, helvetica, calibri; }


/* ==========================================================================
   1. BACKGROUND MOTIF BATIK MEWAH & ELEGAN (SVG PATTERN)
   ========================================================================== */
html, body {
    background-color: #0b1f3a !important;
    /* Motif Batik Kawung Emas-Navy Transparan Halus */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60' viewBox='0 0 60 60'%3E%3Cpath d='M30 0 C15 0 0 15 0 30 C0 45 15 60 30 60 C45 60 60 45 60 30 C60 15 45 0 30 0 Z M30 10 C38.28 10 45 16.72 45 25 C45 33.28 38.28 40 30 40 C21.72 40 15 33.28 15 25 C15 16.72 21.72 10 30 10 Z' fill='none' stroke='%23f7a23b' stroke-width='1' stroke-opacity='0.15'/%3E%3Ccircle cx='30' cy='30' r='3' fill='%23f7a23b' fill-opacity='0.18'/%3E%3Cpath d='M0 0 C7.5 7.5 7.5 22.5 0 30 C7.5 37.5 7.5 52.5 0 60 M60 0 C52.5 7.5 52.5 22.5 60 30 C52.5 37.5 52.5 52.5 60 60 M0 0 C7.5 7.5 22.5 7.5 30 0 C37.5 7.5 52.5 7.5 60 0 M0 60 C7.5 52.5 22.5 52.5 30 60 C37.5 52.5 52.5 52.5 60 60' fill='none' stroke='%23f7a23b' stroke-width='0.8' stroke-opacity='0.12'/%3E%3C/svg%3E") !important;
    background-repeat: repeat !important;
    background-attachment: fixed !important;
}

/* Kotak Konten Utama Mengambang Indah */
.pkp_structure_page {
    margin: auto;
    width: 1162px;
    padding-bottom: 0 !important;
    background: #ffffff !important;
    border: none !important;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.45) !important;
}


/* ==========================================================================
   2. PERBAIKAN MENU NAVIGASI ATAS (CURRENT, LOGIN, DASHBOARD AGAR TIDAK MEPET)
   ========================================================================== */
.pkp_head_wrapper {
    padding: 10px 20px !important;
    box-sizing: border-box !important;
}

.pkp_navigation_primary_wrapper,
.pkp_navigation_user_wrapper {
    padding: 6px 12px !important;
    margin: 0 !important;
}

.pkp_navigation_primary > li,
.pkp_navigation_user > li {
    margin: 0 4px !important;
}

.pkp_navigation_primary > li > a,
.pkp_navigation_user > li > a,
.pkp_navigation_primary .dropdown-toggle,
.pkp_navigation_user .dropdown-toggle {
    padding: 8px 14px !important;
    margin: 2px 0 !important;
    line-height: 1.4 !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    border-radius: 6px !important;
    transition: all 0.2s ease-in-out !important;
}

/* Efek Hover Menu Atas Agar Lebih Interaktif */
.pkp_navigation_primary > li > a:hover,
.pkp_navigation_user > li > a:hover,
.pkp_navigation_primary .dropdown-toggle:hover,
.pkp_navigation_user .dropdown-toggle:hover {
    background: rgba(0, 0, 0, 0.08) !important;
    color: #000000 !important;
}


/* ==========================================================================
   3. HEADER BANNER FULL WIDTH & RAPIH
   ========================================================================== */
.pkp_structure_head {
    padding: 0 !important;
    margin: 0 !important;
    background: #f7a23b !important;
}

.pkp_site_name_wrapper {
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

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

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

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


/* ==========================================================================
   4. KOTAK JUDUL ORANYE SIDEBAR / MENU UTAMA
   ========================================================================== */
.pkp_structure_sidebar .title,
.pkp_structure_sidebar .pkp_block .title,
.pkp_structure_sidebar .block_custom .title,
.pkp_structure_sidebar h1,
.pkp_structure_sidebar h2,
.pkp_structure_sidebar h3,
.pkp_structure_sidebar h4,
.sidebar-block,
#customblock-MENU_UTAMA .title,
#customblock-menu_utama .title,
#customblock-Menu_Utama .title,
#customblock-Sidebar_menu .title,
#customblock-sidebar_menu .title,
.pkp_structure_sidebar .block_custom > p:first-child,
.pkp_structure_sidebar .block_custom > div:first-child,
.pkp_structure_sidebar .block_custom > center:first-child,
.pkp_structure_sidebar .block_custom > strong:first-child,
#customblock-MENU_UTAMA > p:first-child,
#customblock-MENU_UTAMA > div:first-child,
#customblock-menu_utama > p:first-child,
#customblock-menu_utama > div:first-child {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
    
    background: linear-gradient(180deg, #f7a23b 0%, #f2982d 50%, #e68815 100%) !important;
    color: #000000 !important;
    font-family: 'Sunflower', helvetica, calibri, sans-serif !important;
    font-weight: 900 !important;
    text-align: center !important;
    text-transform: uppercase !important;
    
    padding: 10px 12px !important;
    margin: 0 0 10px 0 !important;
    font-size: 14px !important;
    letter-spacing: 0.5px !important;
    
    border-radius: 6px !important;
    border: 1px solid #d97706 !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.15), inset 0 1px 1px rgba(255,255,255,0.6) !important;
}


/* ==========================================================================
   5. RESET PEMBUNGKUS CONTENT CUSTOM BLOCK
   ========================================================================== */
#customblock-MENU_UTAMA,
#customblock-menu_utama,
#customblock-Menu_Utama,
#customblock-MenuUtama,
#customblock-Sidebar_menu,
#customblock-sidebar_menu,
.pkp_structure_sidebar .block_custom {
    margin: 0 0 15px 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

#customblock-MENU_UTAMA *,
#customblock-menu_utama *,
#customblock-Menu_Utama *,
#customblock-MenuUtama *,
#customblock-Sidebar_menu *,
#customblock-sidebar_menu *,
.pkp_structure_sidebar .block_custom * {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
}


/* ==========================================================================
   6. TOMBOL BULET KAPSUL 3D BIRU-TEAL SIDEBAR
   ========================================================================== */
#customblock-MENU_UTAMA a,
#customblock-menu_utama a,
#customblock-Menu_Utama a,
#customblock-MenuUtama a,
#customblock-Sidebar_menu a,
#customblock-sidebar_menu a,
.pkp_structure_sidebar .block_custom a {
    display: block !important;
    width: calc(100% - 8px) !important;
    margin: 6px auto !important;
    padding: 9px 14px !important;
    box-sizing: border-box !important;
    
    color: #ffffff !important;
    font-weight: bold !important;
    text-align: center !important;
    text-decoration: none !important;
    font-size: 13.5px !important;
    line-height: 1.3 !important;
    
    border-radius: 25px !important; 
    background: linear-gradient(180deg, #1f82a3 0%, #136c87 50%, #0d556c 100%) !important;
    border: 1px solid #0b495d !important;
    box-shadow: 0 3px 6px rgba(0,0,0,0.2), inset 0 1px 1px rgba(255,255,255,0.5) !important;
    
    transition: all 0.25s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
}

#customblock-MENU_UTAMA a:hover,
#customblock-menu_utama a:hover,
#customblock-Menu_Utama a:hover,
#customblock-MenuUtama a:hover,
#customblock-Sidebar_menu a:hover,
#customblock-sidebar_menu a:hover,
.pkp_structure_sidebar .block_custom a:hover {
    transform: translateX(-6px) scale(1.02) !important;
    background: linear-gradient(180deg, #289cc3 0%, #187e9e 50%, #10627d 100%) !important;
    color: #ffffff !important;
    box-shadow: 4px 6px 12px rgba(0,0,0,0.35), inset 0 1px 2px rgba(255,255,255,0.8) !important;
}


/* ==========================================================================
   7. TOMBOL PDF ARTIKEL KAPSUL 3D
   ========================================================================== */
.cmp_button_wire, 
.obj_galley_link,
a.galley_link,
a.pdf,
.obj_article_summary .galleys_links a,
.obj_galley_link.pdf {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 6px 18px !important;
    margin: 4px 2px !important;
    
    color: #ffffff !important;
    font-weight: bold !important;
    font-size: 13px !important;
    text-decoration: none !important;
    
    border-radius: 5px !important;
    background: linear-gradient(180deg, #1f82a3 0%, #136c87 50%, #0d556c 100%) !important;
    border: 1px solid #0b495d !important;
    box-shadow: 0 3px 6px rgba(0,0,0,0.2), inset 0 1px 1px rgba(255,255,255,0.5) !important;
    
    transition: all 0.25s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
}

.cmp_button_wire:hover, 
.obj_galley_link:hover,
a.galley_link:hover,
a.pdf:hover,
.obj_article_summary .galleys_links a:hover,
.obj_galley_link.pdf:hover {
    transform: translateY(-2px) scale(1.04) !important;
    background: linear-gradient(180deg, #289cc3 0%, #187e9e 50%, #10627d 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 5px 12px rgba(0,0,0,0.35), inset 0 1px 2px rgba(255,255,255,0.8) !important;
}


/* ==========================================================================
   8. ELEMEN TAMBAHAN & FOOTER
   ========================================================================== */
.pkp_block.block_make_submission .content {margin: 0 !important; padding: 0 !important; text-align: center !important}
.pkp_block.block_make_submission .content a { background: #02733f; line-height: 40px; font-family : Sunflower, helvetica, calibri; color: #FFFFFF}
.pkp_block.block_make_submission .content a:hover { background: rgba(0,0,0,0.25) !important;  color: #333333}

.obj_article_summary .item.doi .label {background: url(/public/journals/8/images/icon-doi.png) left center no-repeat;width: 25px !important; height:24px !important; color: transparent; text-indent: 100%;white-space: nowrap;overflow: hidden;}
.obj_article_summary .item.stats .abstract, .obj_article_summary .item.stats .galley {position:relative;}   
.obj_article_summary .item.stats .abstract {margin-left: 20px; margin-right: 10px;}   
.obj_article_summary .item.stats .galley {margin-left: 25px;}   
.obj_article_summary .item.stats .abstract:before { content: "\f080";  font-family: FontAwesome; left:-15px; position:absolute; top:0; }
.obj_article_summary .item.stats .galley:before { content: "\f1c1";  font-family: FontAwesome; left:-15px; position:absolute; top:0; }

.pkp_structure_footer_wrapper{border-bottom: none !important;}
.pkp_block {padding: 15px 10px;}

#customblock-Tools .content>.content div{width: 80% !important; margin: auto;}
#customblock-Tools .content>.content div a img{width: 100% !important;}
#customblock-Visitor_statistics .content>.content .supercounter,#customblock-Visitor_statistics .content>.content .statcounter {text-align:center;}

.cmp_announcements .obj_announcement_summary.full_width {width: 100% !important;}
.cmp_announcements .obj_announcement_summary .summary p {line-height: 1.3em; margin-top: 0 !important; margin-bottom: 1em !important;}

.pkp_structure_footer .pkp_footer_content {padding: 0px;}
.pkp_structure_footer .pkp_footer_content p {margin: 0}
.pkp_structure_footer .pkp_brand_footer {background: #144691; height: auto !important; padding: 0; display: none;}
.pkp_structure_footer .pkp_brand_footer img {width: 48px !important; height: auto;}
#footer1{background:linear-gradient(to right, #057642 , #c5dfd2); width:70%; float:left; padding:10px}
#footer2{background:linear-gradient(to right, #f8eee4 , #e08d2f); width:30%; float:left; padding:10px}


/* ==========================================================================
   9. RATA KANAN-KIRI (JUSTIFY) UNTUK TEKS DESKRIPSI
   ========================================================================== */
.page_index_journal,
.page_index_journal .journal_description,
.homepage_about,
.cmp_text {
    text-align: justify !important;
    text-justify: inter-word;
}

.pkp_structure_main p {
    text-align: justify !important;
    text-justify: inter-word;
}