/* ==========================================================================
   1. STRUKTUR UTAMA & LATAR BELAKANG
   ========================================================================== */
.journals ul .body .description a {
    display: inline;
}

body {
    background: url("https://i.ibb.co.com/bNtVY6y/spiration-light.png") ##a54f39 fixed !important;
}

.pkp_structure_content {
    background: url("#") #f5f9fb fixed !important;
}

.pkp_structure_page {
    margin-top: 0px !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

/* ==========================================================================
   2. HEADER & NAVIGASI ELEGAN KASTA
   ========================================================================== */
#headerNavigationContainer {
    background: #a54f39 url(#) repeat !important;
    max-height: 100% !important;
}

.pkp_navigation_primary_row {
    background: linear-gradient(135deg, #1a1d46, #2e3b6e) !important;
    text-align: left;
    padding-left: 15px;
}

#navigationPrimary {
    top: 0;
}

#navigationPrimary a {
    color: #FDFDFD;
}

#navigationPrimary ul {
    background: rgba(20, 25, 55, 0.95) !important;
    border-radius: 0 0 4px 4px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

#navigationUser a {
    color: #FDFDFD;
}

.pkp_navigation_user_wrapper {
    top: 0;
    right: 0;
    padding-right: 30px;
    box-sizing: border-box !important; /* Memastikan padding tidak menambah lebar elemen keluar layar */
}

/* ==========================================================================
   3. RESPONSIVE LOGO BANNER HEADER
   ========================================================================== */
.pkp_site_name {
    padding: 15px 0 !important;
    display: flex;
    justify-content: center;
    align-items: center;
}

.pkp_site_name > a {
    padding: 0;
    display: flex;
    justify-content: center;
    width: 100%;
}

.pkp_site_name .is_img {
    display: flex;
    justify-content: center;
    width: 100%;
}

.pkp_site_name .is_img img {
    max-height: none !important;
    height: auto !important;
    width: auto !important;
    max-width: 100% !important;
    object-fit: contain;
}

.pkp_site_name_wrapper {
    padding: 0 !important;
    width: 100%;
}

@media (max-width: 768px) {
    .pkp_site_name .is_img img {
        max-width: 80% !important;
    }
}

@media (max-width: 480px) {
    .pkp_site_name .is_img img {
        max-width: 70% !important;
    }
}

/* ==========================================================================
   4. KONTEN UTAMA & HOMEPAGE VARIASI
   ========================================================================== */
.additional_content {
    background-color: none;
    text-align: justify;
    margin-top: 0px;
}

img {
    float: auto !important;
}

#journalDescription {
    float: left;
    width: 70%;
}

#homepageImage {
    float: right !important;
    width: 30%;
    margin-bottom: 2px;
}

#homepageImage img {
    float: right !important;
    height: auto;
    max-width: 100%;
    margin-top: 2px;
}

#setupForm #homepageImage,
#setupForm #journalDescription {
    width: 100%;
}

#setupForm #homepageImage img {
    float: right !important;
    margin-left: 0;
    margin-top: 0;
}

/* Daftar Artikel Kasta */
.obj_issue_toc .articles > li {
    margin-bottom: 20px;
    border-bottom: 1px solid #a5b8e0;
    background: linear-gradient(145deg, #f5f9ff, #e1e9fa) !important;
    padding: 1rem;
    border-radius: 0rem 0rem 2rem 0rem;
    box-shadow: 0 6px 12px rgba(0, 30, 60, 0.08);
    transition: all 0.2s ease;
}

.obj_issue_toc .articles > li:hover {
    background: linear-gradient(145deg, #eef3ff, #d6e2f5) !important;
    box-shadow: 0 8px 16px rgba(0, 40, 80, 0.12);
}

/* ==========================================================================
   5. SIDEBAR & ELEMENT INTERAKTIF
   ========================================================================== */
.pkp_block {
    background: linear-gradient(145deg, #ffffff, #f2f6fd);
    border: none;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
    border-radius: 8px;
    padding: 1rem;
    margin-bottom: 1.5rem;
}

.pkp_block .title {
    color: #1a1d46;
    border-bottom: 2px solid #a5b8e0;
    padding-bottom: 0.5rem;
    margin-bottom: 1rem;
}

.pkp_button, input[type="submit"], button {
    background: linear-gradient(135deg, #2e3b6e, #1f2a4a);
    border: none;
    color: #fff;
    padding: 0.5rem 1.2rem;
    border-radius: 30px;
    transition: background 0.2s;
}

.pkp_button:hover, input[type="submit"]:hover, button:hover {
    background: linear-gradient(135deg, #3f51b5, #2a3a6e);
    cursor: pointer;
}

/* ==========================================================================
   6. FIX TOTAL STRUKTUR BINGKAI FOOTER (TEGAK LURUS & AKSEN GARIS BIRU)
   ========================================================================== */
/* Menghapus paksa batasan padding bawaan tema OJS agar meluncur lurus ke pinggir */
.pkp_structure_footer {
    background: none !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    clear: both !important;
    box-sizing: border-box !important;
}

/* Kontainer dalam footer mengikuti alur struktur lurus di atasnya */
.pkp_structure_footer .pkp_footer_content {
    background: none !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* Membuat bungkus kustom HTML Anda terintegrasi penuh & memiliki garis atas */
.pkp_structure_footer .pkp_footer_content > div:first-child {
    width: 100% !important;
    box-sizing: border-box !important;
    border-top: 4px solid #1a1d46 !important; /* Aksen garis biru terang tebal khas Kasta */
    border-radius: 0 0 20px 20px !important; /* Menutup melengkung rapi di dasar halaman */
}

/* Menyembunyikan branding bawaan PKP agar area bawah bersih sempurna */
.pkp_structure_footer .pkp_brand_footer {
    display: none !important;
}
html, body {
    max-width: 100% !important;
    overflow-x: hidden !important;
}