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 UTAMA MENGGUNAKAN GAMBAR LANGIT AWAN
   ========================================================================== */
html, body {
    background-color: #87ceeb !important;
    background-image: url('URL_GAMBAR_AWAN_ANDA.jpg') !important; /* Ganti dengan URL gambar awan */
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-position: center top !important;
    background-attachment: fixed !important;
}

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


/* ==========================================================================
   2. PERBAIKAN MENU NAVIGASI ATAS
   ========================================================================== */
.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;
}

.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
   ========================================================================== */
.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. DAFTAR ARTIKEL & POSISI ELEMEN
   ========================================================================== */

/* Judul Bagian "Articles" */
.cmp_articles_list h2,
.sections_title,
.obj_article_list .heading {
    display: flex !important;
    align-items: center !important;
    color: #555555 !important;
    font-size: 17px !important;
    font-weight: normal !important;
    margin-bottom: 20px !important;
}

.cmp_articles_list h2::after,
.sections_title::after,
.obj_article_list .heading::after {
    content: "" !important;
    flex: 1 !important;
    border-bottom: 1px solid #d0d0d0 !important;
    margin-left: 15px !important;
}

/* Kartu Artikel (Solid Shadow Teal) */
.obj_article_summary {
    background-color: #ffffff !important;
    border: 2px solid #136c87 !important;
    border-radius: 8px !important;
    box-shadow: 4px 4px 0px #136c87 !important;
    padding: 18px 20px !important;
    margin-bottom: 22px !important;
    position: relative !important;
    box-sizing: border-box !important;
}

/* Judul Artikel */
.obj_article_summary .title {
    margin-bottom: 8px !important;
    width: 100% !important;
}

.obj_article_summary .title a {
    color: #136c87 !important;
    font-weight: bold !important;
    font-size: 15px !important;
    line-height: 1.4 !important;
    text-decoration: none !important;
}

.obj_article_summary .title a:hover {
    color: #f7a23b !important;
}

/* Meta Data Penulis (Kiri) & Halaman (Kanan) */
.obj_article_summary .authors {
    color: #444444 !important;
    font-size: 13.5px !important;
    float: left !important;
    text-align: left !important;
    margin-bottom: 10px !important;
}

.obj_article_summary .pages {
    float: right !important;
    color: #777777 !important;
    font-size: 13.5px !important;
    margin-bottom: 10px !important;
}

.obj_article_summary::after {
    content: "" !important;
    display: table !important;
    clear: both !important;
}

/* Kontainer Tombol PDF (Rapat Kiri di Bawah Penulis) */
.obj_article_summary .galleys,
.obj_article_summary .galleys_links,
.obj_article_summary ul.galleys_links {
    clear: both !important;
    float: left !important;
    width: 100% !important;
    text-align: left !important;
    margin: 6px 0 0 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.obj_article_summary ul.galleys_links li {
    display: inline-block !important;
    margin: 0 !important;
    padding: 0 !important;
    float: left !important;
}


/* ==========================================================================
   8. TOMBOL PDF ARTIKEL KAPSUL 3D (UKURAN DIPERKECIL & RAPI)
   ========================================================================== */
.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: 4px 12px !important; /* Diperkecil dari 6px 18px */
    margin: 0 !important;
    
    color: #ffffff !important;
    font-weight: bold !important;
    font-size: 11.5px !important; /* Diperkecil dari 13px */
    line-height: 1.2 !important;
    text-decoration: none !important;
    
    border-radius: 4px !important;
    background: linear-gradient(180deg, #1f82a3 0%, #136c87 50%, #0d556c 100%) !important;
    border: 1px solid #0b495d !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.18), inset 0 1px 1px rgba(255,255,255,0.4) !important;
    
    transition: all 0.2s ease-in-out !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(-1px) scale(1.02) !important;
    background: linear-gradient(180deg, #289cc3 0%, #187e9e 50%, #10627d 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 8px rgba(0,0,0,0.25), inset 0 1px 2px rgba(255,255,255,0.7) !important;
}


/* ==========================================================================
   9. 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}


/* ==========================================================================
   10. 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;
}