/* =====================================================
   JSKM SIDEBAR THEME v4
   Designed for OJS 3.4
====================================================== */


/* =====================================================
   JSKM JOURNAL NAVIGATION
====================================================== */

#customblock-quick-menu {
    width: 100%;
    margin: 0 0 24px;
    padding: 0 !important;
    border: 1px solid #E5EAF3;
    border-radius: 8px;
    overflow: hidden;
    background: #FFFFFF;
    box-sizing: border-box;
}

#customblock-quick-menu > h2,
#customblock-quick-menu > .title {
    display: none !important;
}

#customblock-quick-menu > .content {
    width: 100%;
    margin: 0;
    padding: 0 !important;
    border: 0 !important;
    background: #FFFFFF;
    box-sizing: border-box;
}

#customblock-quick-menu .jskm-sidebar-title {
    display: block;
    margin: 0;
    padding: 16px 20px;
    border-radius: 0;
    background: #2F5DAA;
    color: #FFFFFF;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.4;
}

#customblock-quick-menu details {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    border-bottom: 1px solid #EEF2F7;
    background: #FFFFFF;
}

#customblock-quick-menu details:last-child {
    border-bottom: 0;
}

#customblock-quick-menu summary {
    display: block;
    position: relative;
    width: 100%;
    margin: 0;
    padding: 14px 42px 14px 18px;
    background: #FAFBFD;
    color: #2F5DAA;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.45;
    list-style: none;
    cursor: pointer;
    user-select: none;
    box-sizing: border-box;
    transition: background-color .2s ease, color .2s ease;
}

#customblock-quick-menu summary::-webkit-details-marker {
    display: none;
}

#customblock-quick-menu summary::marker {
    content: "";
}

#customblock-quick-menu summary::after {
    content: "›";
    position: absolute;
    top: 50%;
    right: 18px;
    color: #7087A3;
    font-size: 22px;
    font-weight: 400;
    line-height: 1;
    transform: translateY(-50%);
    transition: transform .2s ease, color .2s ease;
}

#customblock-quick-menu summary:hover {
    background: #EEF5FF;
    color: #234F87;
}

#customblock-quick-menu details[open] summary {
    padding-left: 15px;
    border-left: 3px solid #2F5DAA;
    background: #F4F8FF;
    color: #234F87;
}

#customblock-quick-menu details[open] summary::after {
    color: #2F5DAA;
    transform: translateY(-50%) rotate(90deg);
}

#customblock-quick-menu .jskm-link {
    width: 100%;
    margin: 0;
    padding: 0;
}

#customblock-quick-menu .jskm-link a {
    display: block;
    position: relative;
    width: 100%;
    margin: 0;
    padding: 11px 18px 11px 38px;
    border-top: 1px solid #F1F4F8;
    background: #FFFFFF;
    color: #49566B !important;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.45;
    text-decoration: none !important;
    overflow-wrap: anywhere;
    box-sizing: border-box;
    transition:
        padding-left .2s ease,
        background-color .2s ease,
        color .2s ease;
}

#customblock-quick-menu .jskm-link a::before {
    content: "›";
    position: absolute;
    top: 10px;
    left: 20px;
    color: #A0AEC4;
    font-size: 16px;
}

#customblock-quick-menu .jskm-link a[target="_blank"]::after {
    content: "↗";
    margin-left: 6px;
    color: #A8B5C8;
    font-size: 10px;
}

#customblock-quick-menu .jskm-link a:hover,
#customblock-quick-menu .jskm-link a:focus {
    padding-left: 42px;
    background: #F8FBFF;
    color: #2F5DAA !important;
}

#customblock-quick-menu .jskm-link a:hover::before,
#customblock-quick-menu .jskm-link a:focus::before {
    color: #2F5DAA;
}

@media (max-width: 992px) {
    #customblock-quick-menu {
        width: 100%;
        max-width: 100%;
    }

    #customblock-quick-menu summary {
        padding: 14px 42px 14px 16px;
    }

    #customblock-quick-menu .jskm-link a {
        padding: 11px 16px 11px 36px;
    }
}

/* ======================================
   LANGUAGE & INFORMATION
====================================== */

.pkp_block.block_language,
.pkp_block.block_information{

    border:1px solid #E5EAF3 !important;

    border-radius:8px !important;

    overflow:hidden;

    background:#fff;

    margin-bottom:24px;

}

/* HEADER */

.pkp_block.block_language h2.title,
.pkp_block.block_information h2.title{

    margin:0 !important;

    padding:16px 20px !important;

    background:#2F5DAA !important;

    color:#FFFFFF !important;

    font-size:15px !important;

    font-weight:700 !important;

    border:none !important;

    line-height:1.4;

}

/* Sidebar mengikuti lebar parent */
.pkp_structure_sidebar{

    flex:1;

    min-width:250px;

    max-width:300px;

}

.pkp_structure_sidebar .pkp_block{

    width:100%;

    box-sizing:border-box;

}

/* CONTENT */

.pkp_block.block_language .content,
.pkp_block.block_information .content{

    padding:0 !important;

}

/* LIST */

.pkp_block.block_language ul,
.pkp_block.block_information ul{

    margin:0;

    padding:0;

    list-style:none;

}

.pkp_block.block_language li,
.pkp_block.block_information li{

    margin:0;

}

/* LINK */

.pkp_block.block_language a,
.pkp_block.block_information a{

    display:block;

    padding:14px 20px;

    color:#49566B !important;

    text-decoration:none;

    border-top:1px solid #EEF2F7;

    transition:.25s;

}

.pkp_block.block_language a:hover,
.pkp_block.block_information a:hover{

    background:#F5F9FF;

    color:#2F5DAA !important;

}
/* ======================================
   Shared Sidebar Title
====================================== */

.jskm-sidebar-title{

    padding:16px 20px;

    background:#2F5DAA;

    color:#fff;

    font-size:15px;

    font-weight:700;

    border-radius:8px 8px 0 0;

}


/* ======================================
   Shared Card
====================================== */

.jskm-card-content{

    padding:18px;

    border:1px solid #E5EAF3;

    border-top:none;

    border-radius:0 0 8px 8px;

    background:#fff;

}


/* ======================================
   Divider
====================================== */

.jskm-divider{

    margin:18px 0;

    border-top:1px solid #EDF2F7;

}


/* ======================================
   Button Link
====================================== */

.jskm-button-link{

    display:block;

    text-align:center;

    background:#2F5DAA;

    color:#fff !important;

    padding:10px;

    border-radius:6px;

    text-decoration:none;

    transition:.25s;

}

.jskm-button-link:hover{

    background:#23498F;

}


/* ==================================================
   INDEXING
================================================== */

.jskm-indexing{

    display:grid;

    grid-template-columns:1fr;

    gap:14px;

}

.jskm-indexing a{

    display:flex;

    justify-content:center;

    align-items:center;

    padding:14px;

    background:#fff;

    border:1px solid #E7EDF6;

    border-radius:8px;

    transition:.25s;

}

.jskm-indexing a:hover{

    background:#F6FAFF;

    border-color:#2F5DAA;

    transform:translateY(-2px);

    box-shadow:0 4px 12px rgba(47,93,170,.10);

}

.jskm-indexing img{

    max-width:170px;

    max-height:42px;

    width:auto;

    height:auto;

    object-fit:contain;

}

/* ======================================
   VISITORS
====================================== */

.jskm-card-content img{

    display:block;

    margin:0 auto;

    max-width:100%;

    height:auto;

}

.jskm-card-content > a{

    display:flex;

    justify-content:center;

}

/* ==========================================
   ABOUT JOURNAL
========================================== */

.journal-description h1{

    font-size:38px;

    color:#1F2937;

    margin-bottom:30px;

    font-weight:700;

}

.jskm-about{

    width:100%;

    border-collapse:collapse;

    margin-bottom:32px;

}

.jskm-cover-cell{

    width:240px;

    vertical-align:top;

    padding-right:28px;

}

.jskm-cover{

    width:100%;

    border-radius:12px;

    border:1px solid #E5EAF3;

    box-shadow:0 8px 20px rgba(0,0,0,.08);

}

.jskm-description{

    vertical-align:top;

    line-height:1.9;

    text-align:justify;

}

.jskm-section-title{

    background:#2F5DAA;

    color:#fff;

    padding:15px 20px;

    border-radius:8px 8px 0 0;

    font-size:17px;

    font-weight:700;

    margin-bottom:0;

}

.jskm-factsheet{

    width:100%;

    border-collapse:collapse;

    border:1px solid #E5EAF3;

    border-top:none;

    overflow:hidden;

}

.jskm-factsheet tr{

    border-bottom:1px solid #EEF2F7;

}

.jskm-factsheet td:first-child{

    width:30%;

    background:#F8FAFD;

    color:#2F5DAA;

    font-weight:700;

    padding:15px 18px;

}

.jskm-factsheet td:last-child{

    padding:15px 18px;

    color:#374151;

}

.jskm-factsheet a{

    color:#2F5DAA;

    text-decoration:none;

}

.jskm-factsheet a:hover{

    text-decoration:underline;

}

.pkp_navigation_search input{

    width:170px;

}

.pkp_navigation_user a{

    border:1px solid #2F5DAA;

    border-radius:6px;

    padding:8px 16px;

}

/* =========================================================
   JSKM STATIC POLICY PAGE
   ========================================================= */

.jskm-static-page {
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
    color: #263238;
    line-height: 1.75;
}

.jskm-page-header {
    margin-bottom: 28px;
    padding-bottom: 24px;
    border-bottom: 1px solid #e5eaf0;
}

.jskm-page-label {
    display: inline-block;
    margin-bottom: 10px;
    padding: 5px 11px;
    border-radius: 999px;
    background: #eaf2ff;
    color: #2457a6;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.jskm-page-header h1 {
    margin: 0 0 12px;
    color: #173f78;
    font-size: clamp(28px, 4vw, 40px);
    line-height: 1.2;
}

.jskm-page-header p {
    max-width: 760px;
    margin: 0;
    color: #5b6775;
}

.jskm-page-toc {
    margin: 0 0 32px;
    padding: 20px 24px;
    border: 1px solid #dce5ef;
    border-radius: 12px;
    background: #f7faff;
}

.jskm-page-toc strong {
    display: block;
    margin-bottom: 10px;
    color: #173f78;
}

.jskm-page-toc ol {
    margin: 0;
    padding-left: 22px;
}

.jskm-page-toc li {
    margin: 6px 0;
}

.jskm-page-toc a {
    color: #2457a6;
    text-decoration: none;
}

.jskm-page-toc a:hover {
    text-decoration: underline;
}

.jskm-policy-section {
    scroll-margin-top: 110px;
    margin-bottom: 38px;
}

.jskm-policy-section h2 {
    margin: 0 0 18px;
    padding-bottom: 10px;
    border-bottom: 2px solid #dce8f7;
    color: #173f78;
    font-size: 24px;
    line-height: 1.3;
}

.jskm-policy-section h3 {
    margin: 0 0 15px;
    color: #234f87;
    font-size: 19px;
}

.jskm-policy-section p {
    margin: 0 0 16px;
    text-align: justify;
}

.jskm-policy-list {
    margin: 0;
    padding-left: 24px;
}

.jskm-policy-list li {
    margin-bottom: 14px;
    padding-left: 5px;
}

.jskm-section-card {
    padding: 22px 24px;
    border: 1px solid #dce5ef;
    border-radius: 12px;
    background: #f9fbfd;
}

.jskm-status-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.jskm-status-list li {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
    padding: 12px 14px;
    border: 1px solid #dce8f2;
    border-radius: 9px;
    background: #ffffff;
    font-weight: 600;
}

.jskm-check {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 23px;
    height: 23px;
    border-radius: 50%;
    background: #e5f6ec;
    color: #177344;
    font-size: 14px;
    font-weight: 800;
}

@media (max-width: 700px) {

    .jskm-page-toc {
        padding: 18px;
    }

    .jskm-status-list {
        grid-template-columns: 1fr;
    }

    .jskm-policy-section p {
        text-align: left;
    }

}

/* =========================================================
   PUBLICATION POLICIES – ADDITIONAL COMPONENTS
   ========================================================= */

.jskm-document-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 11px 17px;
    border: 1px solid #2457a6;
    border-radius: 8px;
    background: #2457a6;
    color: #ffffff !important;
    font-weight: 700;
    line-height: 1.4;
    text-decoration: none !important;
    transition:
        background-color 0.2s ease,
        border-color 0.2s ease,
        transform 0.2s ease;
}

.jskm-document-button:hover,
.jskm-document-button:focus {
    border-color: #173f78;
    background: #173f78;
    color: #ffffff !important;
    transform: translateY(-1px);
}

.jskm-license-card,
.jskm-highlight-card {
    padding: 22px 24px;
    border: 1px solid #dce5ef;
    border-radius: 12px;
    background: #f9fbfd;
}

.jskm-license-card {
    display: flex;
    align-items: flex-start;
    gap: 18px;
}

.jskm-license-card img {
    display: block;
    width: 88px;
    max-width: none;
    height: 31px;
}

.jskm-license-card p {
    margin: 0;
    text-align: left;
}

.jskm-highlight-card {
    border-left: 4px solid #2457a6;
}

.jskm-highlight-card > strong {
    display: block;
    margin-bottom: 12px;
    color: #173f78;
    font-size: 18px;
}

.jskm-highlight-card p:last-child {
    margin-bottom: 0;
}

@media (max-width: 600px) {

    .jskm-license-card {
        flex-direction: column;
    }

    .jskm-document-button {
        width: 100%;
        justify-content: center;
        box-sizing: border-box;
        text-align: center;
    }

}

/* =========================================================
   JOURNAL NAVIGATION – SINGLE PAGE LINKS
   ========================================================= */

.jskm-navigation {
    width: 100%;
    box-sizing: border-box;
}

.jskm-navigation *,
.jskm-navigation *::before,
.jskm-navigation *::after {
    box-sizing: border-box;
}

.jskm-navigation-single {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    padding: 14px 16px;
    border-bottom: 1px solid #e4e9ef;
    color: #334155 !important;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.45;
    text-decoration: none !important;
    text-transform: uppercase;
    transition:
        background-color 0.2s ease,
        color 0.2s ease,
        padding-left 0.2s ease;
}

.jskm-navigation-single:hover,
.jskm-navigation-single:focus {
    padding-left: 20px;
    background: #f3f7fc;
    color: #1f5595 !important;
}

.jskm-navigation-arrow {
    flex: 0 0 auto;
    color: #7890aa;
    font-size: 22px;
    font-weight: 400;
    line-height: 1;
}

.jskm-resource-links a {
    display: flex;
    align-items: flex-start;
    gap: 9px;
}

.jskm-resource-links a span:first-child {
    flex: 0 0 auto;
}

.jskm-resource-links a span:last-child {
    min-width: 0;
    overflow-wrap: anywhere;
}

@media (max-width: 992px) {

    .jskm-navigation,
    .jskm-navigation-single,
    .jskm-accordion,
    .jskm-accordion details,
    .jskm-accordion-content {
        width: 100%;
        max-width: 100%;
    }

    .jskm-navigation-single {
        white-space: normal;
        overflow-wrap: anywhere;
    }

}

/* =====================================================
   FIX JOURNAL NAVIGATION ACCORDION
   Tidak bergantung pada ID Custom Block OJS
====================================================== */

/* Kotak utama dimulai dari judul */
.jskm-sidebar-title {
    display: block;
    width: 100%;
    margin: 0 !important;
    padding: 16px 20px !important;
    border-radius: 8px 8px 0 0;
    background: #2F5DAA !important;
    color: #FFFFFF !important;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.4;
    box-sizing: border-box;
}

/* Semua accordion setelah judul */
.jskm-sidebar-title + details,
.jskm-sidebar-title ~ details {
    display: block;
    width: 100%;
    margin: 0 !important;
    padding: 0 !important;
    border: 0;
    border-left: 1px solid #E5EAF3;
    border-right: 1px solid #E5EAF3;
    border-bottom: 1px solid #EEF2F7;
    background: #FFFFFF;
    box-sizing: border-box;
}

/* Sudut bawah pada accordion terakhir */
.jskm-sidebar-title ~ details:last-child {
    border-bottom: 1px solid #E5EAF3;
    border-radius: 0 0 8px 8px;
    overflow: hidden;
}

/* Judul accordion */
.jskm-sidebar-title ~ details > summary {
    display: block !important;
    position: relative;
    width: 100%;
    margin: 0 !important;
    padding: 14px 42px 14px 18px !important;
    border: 0;
    background: #FAFBFD;
    color: #2F5DAA;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.45;
    list-style: none;
    cursor: pointer;
    user-select: none;
    box-sizing: border-box;
    transition:
        background-color .2s ease,
        color .2s ease;
}

/* Hilangkan marker bawaan */
.jskm-sidebar-title ~ details > summary::-webkit-details-marker {
    display: none;
}

.jskm-sidebar-title ~ details > summary::marker {
    content: "";
}

/* Panah */
.jskm-sidebar-title ~ details > summary::after {
    content: "›";
    position: absolute;
    top: 50%;
    right: 18px;
    color: #7087A3;
    font-size: 22px;
    font-weight: 400;
    line-height: 1;
    transform: translateY(-50%);
    transition:
        transform .2s ease,
        color .2s ease;
}

/* Hover */
.jskm-sidebar-title ~ details > summary:hover {
    background: #EEF5FF;
    color: #234F87;
}

/* Accordion terbuka */
.jskm-sidebar-title ~ details[open] > summary {
    padding-left: 15px !important;
    border-left: 3px solid #2F5DAA;
    background: #F4F8FF;
    color: #234F87;
}

.jskm-sidebar-title ~ details[open] > summary::after {
    color: #2F5DAA;
    transform: translateY(-50%) rotate(90deg);
}

/* Container link */
.jskm-sidebar-title ~ details .jskm-link {
    display: block;
    width: 100%;
    margin: 0 !important;
    padding: 0 !important;
}

/* Link di dalam accordion */
.jskm-sidebar-title ~ details .jskm-link a {
    display: block !important;
    position: relative;
    width: 100%;
    margin: 0 !important;
    padding: 11px 18px 11px 38px !important;
    border-top: 1px solid #F1F4F8;
    background: #FFFFFF;
    color: #49566B !important;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.45;
    text-decoration: none !important;
    overflow-wrap: anywhere;
    box-sizing: border-box;
    transition:
        padding-left .2s ease,
        background-color .2s ease,
        color .2s ease;
}

/* Bullet */
.jskm-sidebar-title ~ details .jskm-link a::before {
    content: "›";
    position: absolute;
    top: 10px;
    left: 20px;
    color: #A0AEC4;
    font-size: 16px;
}

/* Ikon link eksternal */
.jskm-sidebar-title ~ details .jskm-link a[target="_blank"]::after {
    content: "↗";
    margin-left: 6px;
    color: #A8B5C8;
    font-size: 10px;
}

/* Hover link */
.jskm-sidebar-title ~ details .jskm-link a:hover,
.jskm-sidebar-title ~ details .jskm-link a:focus {
    padding-left: 42px !important;
    background: #F8FBFF;
    color: #2F5DAA !important;
}

.jskm-sidebar-title ~ details .jskm-link a:hover::before,
.jskm-sidebar-title ~ details .jskm-link a:focus::before {
    color: #2F5DAA;
}

/* Responsive */
@media (max-width: 992px) {
    .jskm-sidebar-title,
    .jskm-sidebar-title + details,
    .jskm-sidebar-title ~ details {
        width: 100%;
        max-width: 100%;
    }

    .jskm-sidebar-title ~ details > summary {
        padding: 14px 42px 14px 16px !important;
    }

    .jskm-sidebar-title ~ details .jskm-link a {
        padding: 11px 16px 11px 36px !important;
    }
}

/* =====================================================
   JSKM JOURNAL NAVIGATION — FLAT VERSION
====================================================== */

#customblock-quick-menu {
    width: 100%;
    margin: 0 0 24px;
    padding: 0 !important;
    border: 1px solid #E5EAF3;
    border-radius: 8px;
    overflow: hidden;
    background: #FFFFFF;
    box-sizing: border-box;
}

#customblock-quick-menu > h2,
#customblock-quick-menu > .title {
    display: none !important;
}

#customblock-quick-menu > .content {
    margin: 0;
    padding: 0 !important;
    border: 0 !important;
    background: #FFFFFF;
}

#customblock-quick-menu .jskm-sidebar-title {
    margin: 0;
    padding: 16px 20px;
    border-radius: 0;
    background: #2F5DAA;
    color: #FFFFFF;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.4;
}

#customblock-quick-menu .jskm-nav-section {
    margin: 0;
    padding: 0 0 8px;
    border-bottom: 1px solid #E8EDF4;
    background: #FFFFFF;
}

#customblock-quick-menu .jskm-nav-section:last-child {
    border-bottom: 0;
}

#customblock-quick-menu .jskm-nav-section h3 {
    margin: 0 !important;
    padding: 14px 18px 9px !important;
    border: 0 !important;
    background: #F7F9FC;
    color: #2F5DAA;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.45;
    letter-spacing: .04em;
    text-transform: uppercase;
}

#customblock-quick-menu .jskm-link {
    margin: 0;
    padding: 0;
}

#customblock-quick-menu .jskm-link a {
    display: block;
    position: relative;
    width: 100%;
    padding: 9px 18px 9px 36px;
    background: #FFFFFF;
    color: #49566B !important;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.45;
    text-decoration: none !important;
    overflow-wrap: anywhere;
    box-sizing: border-box;
    transition:
        padding-left .2s ease,
        background-color .2s ease,
        color .2s ease;
}

#customblock-quick-menu .jskm-link a::before {
    content: "›";
    position: absolute;
    top: 8px;
    left: 19px;
    color: #A0AEC4;
    font-size: 16px;
}

#customblock-quick-menu .jskm-link a[target="_blank"]::after {
    content: "↗";
    margin-left: 6px;
    color: #A8B5C8;
    font-size: 10px;
}

#customblock-quick-menu .jskm-link a:hover,
#customblock-quick-menu .jskm-link a:focus {
    padding-left: 40px;
    background: #F5F9FF;
    color: #2F5DAA !important;
}

#customblock-quick-menu .jskm-link a:hover::before,
#customblock-quick-menu .jskm-link a:focus::before {
    color: #2F5DAA;
}

@media (max-width: 992px) {
    #customblock-quick-menu {
        width: 100%;
        max-width: 100%;
    }

    #customblock-quick-menu .jskm-nav-section h3 {
        padding: 13px 16px 8px !important;
    }

    #customblock-quick-menu .jskm-link a {
        padding: 9px 16px 9px 34px;
    }
}

/* =====================================================
   JSKM JOURNAL NAVIGATION — FLAT FIX
   Tidak bergantung pada ID Custom Block
====================================================== */

/* Header navigasi */
.jskm-sidebar-title {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 16px 20px !important;
    border-radius: 8px 8px 0 0 !important;
    background: #2F5DAA !important;
    color: #FFFFFF !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    box-sizing: border-box !important;
}

/* Seluruh bagian menu setelah header */
.jskm-sidebar-title ~ .jskm-nav-section {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 0 8px !important;
    border-left: 1px solid #E5EAF3 !important;
    border-right: 1px solid #E5EAF3 !important;
    border-bottom: 1px solid #E8EDF4 !important;
    background: #FFFFFF !important;
    box-sizing: border-box !important;
}

/* Sudut bawah menu terakhir */
.jskm-sidebar-title ~ .jskm-nav-section:last-child {
    border-radius: 0 0 8px 8px !important;
    overflow: hidden !important;
}

/* Heading kategori */
.jskm-sidebar-title ~ .jskm-nav-section > h3 {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 13px 18px 8px !important;
    border: 0 !important;
    background: #F7F9FC !important;
    color: #2F5DAA !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1.45 !important;
    letter-spacing: .04em !important;
    text-transform: uppercase !important;
    box-sizing: border-box !important;
}

/* Pembungkus setiap link */
.jskm-sidebar-title ~ .jskm-nav-section .jskm-link {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Link menu */
.jskm-sidebar-title ~ .jskm-nav-section .jskm-link a {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 9px 16px 9px 36px !important;
    border: 0 !important;
    background: #FFFFFF !important;
    color: #49566B !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 1.45 !important;
    text-decoration: none !important;
    overflow-wrap: anywhere !important;
    box-sizing: border-box !important;
    transition:
        padding-left .2s ease,
        background-color .2s ease,
        color .2s ease !important;
}

/* Panah kecil di kiri */
.jskm-sidebar-title ~ .jskm-nav-section .jskm-link a::before {
    content: "›" !important;
    position: absolute !important;
    top: 8px !important;
    left: 19px !important;
    color: #A0AEC4 !important;
    font-size: 16px !important;
    line-height: 1.4 !important;
}

/* Penanda tautan eksternal */
.jskm-sidebar-title ~ .jskm-nav-section .jskm-link a[target="_blank"]::after {
    content: "↗" !important;
    margin-left: 6px !important;
    color: #A8B5C8 !important;
    font-size: 10px !important;
}

/* Hover */
.jskm-sidebar-title ~ .jskm-nav-section .jskm-link a:hover,
.jskm-sidebar-title ~ .jskm-nav-section .jskm-link a:focus {
    padding-left: 40px !important;
    background: #F5F9FF !important;
    color: #2F5DAA !important;
}

.jskm-sidebar-title ~ .jskm-nav-section .jskm-link a:hover::before,
.jskm-sidebar-title ~ .jskm-nav-section .jskm-link a:focus::before {
    color: #2F5DAA !important;
}

/* Responsive */
@media (max-width: 992px) {
    .jskm-sidebar-title,
    .jskm-sidebar-title ~ .jskm-nav-section {
        width: 100% !important;
        max-width: 100% !important;
    }

    .jskm-sidebar-title ~ .jskm-nav-section > h3 {
        padding: 12px 16px 8px !important;
    }

    .jskm-sidebar-title ~ .jskm-nav-section .jskm-link a {
        padding: 9px 15px 9px 34px !important;
    }
}

/* =====================================================
   FIX SIDEBAR ICON ENCODING
====================================================== */

/* Hilangkan simbol panah di depan link */
.jskm-sidebar-title ~ .jskm-nav-section .jskm-link a::before {
    content: none !important;
}

/* Sesuaikan padding setelah panah dihapus */
.jskm-sidebar-title ~ .jskm-nav-section .jskm-link a {
    padding-left: 20px !important;
}

.jskm-sidebar-title ~ .jskm-nav-section .jskm-link a:hover,
.jskm-sidebar-title ~ .jskm-nav-section .jskm-link a:focus {
    padding-left: 24px !important;
}

/* =====================================================
   UNIFIED OJS SIDEBAR BLOCKS
   Samakan Custom Block dengan Information bawaan
====================================================== */

/* Semua block sidebar memiliki ukuran yang sama */
.pkp_structure_sidebar .pkp_block {
    display: block;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 24px !important;
    box-sizing: border-box !important;
}

/* Hilangkan kotak luar bawaan khusus Custom Block */
.pkp_structure_sidebar .pkp_block.block_custom {
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
}

/* Sembunyikan judul bawaan Custom Block OJS */
.pkp_structure_sidebar .pkp_block.block_custom > h2,
.pkp_structure_sidebar .pkp_block.block_custom > .title,
.pkp_structure_sidebar .pkp_block.block_custom h2.title {
    display: none !important;
}

/* Content Custom Block menjadi satu card yang seragam */
.pkp_structure_sidebar .pkp_block.block_custom > .content {
    display: block;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid #E5EAF3 !important;
    border-radius: 8px !important;
    background: #FFFFFF !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .04) !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}

/* Header semua Custom Block */
.pkp_structure_sidebar .pkp_block.block_custom .jskm-sidebar-title {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 16px 20px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #2F5DAA !important;
    color: #FFFFFF !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    box-sizing: border-box !important;
}

/* Samakan header Information bawaan */
.pkp_structure_sidebar .pkp_block.block_information {
    width: 100% !important;
    margin: 0 0 24px !important;
    padding: 0 !important;
    border: 1px solid #E5EAF3 !important;
    border-radius: 8px !important;
    background: #FFFFFF !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .04) !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}

.pkp_structure_sidebar .pkp_block.block_information h2.title {
    margin: 0 !important;
    padding: 16px 20px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #2F5DAA !important;
    color: #FFFFFF !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
}

/* =====================================================
   JOURNAL NAVIGATION
====================================================== */

/* Hilangkan border samping tambahan pada tiap kategori */
.pkp_structure_sidebar .jskm-nav-section {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 0 8px !important;
    border: 0 !important;
    border-bottom: 1px solid #E7ECF3 !important;
    border-radius: 0 !important;
    background: #FFFFFF !important;
    box-sizing: border-box !important;
}

.pkp_structure_sidebar .jskm-nav-section:last-child {
    border-bottom: 0 !important;
}

/* Judul kategori */
.pkp_structure_sidebar .jskm-nav-section > h3 {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 13px 18px 9px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #F7F9FC !important;
    color: #2F5DAA !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.45 !important;
    letter-spacing: .035em !important;
    text-transform: uppercase !important;
    box-sizing: border-box !important;
}

/* Link navigasi */
.pkp_structure_sidebar .jskm-nav-section .jskm-link {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

.pkp_structure_sidebar .jskm-nav-section .jskm-link a {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 9px 20px !important;
    border: 0 !important;
    background: #FFFFFF !important;
    color: #49566B !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    text-decoration: none !important;
    overflow-wrap: anywhere !important;
    box-sizing: border-box !important;
    transition:
        padding-left .2s ease,
        background-color .2s ease,
        color .2s ease !important;
}

/* Hilangkan ikon/panah lama */
.pkp_structure_sidebar .jskm-nav-section .jskm-link a::before {
    content: none !important;
}

/* Ikon link eksternal tetap dipertahankan */
.pkp_structure_sidebar .jskm-nav-section .jskm-link a[target="_blank"]::after {
    content: "\2197" !important;
    margin-left: 6px !important;
    color: #A8B5C8 !important;
    font-size: 10px !important;
}

/* Hover */
.pkp_structure_sidebar .jskm-nav-section .jskm-link a:hover,
.pkp_structure_sidebar .jskm-nav-section .jskm-link a:focus {
    padding-left: 24px !important;
    background: #F5F9FF !important;
    color: #2F5DAA !important;
}

/* =====================================================
   VISITORS, INDEXING, DAN CUSTOM CARD LAIN
====================================================== */

/* Hilangkan kotak kedua di dalam Custom Block */
.pkp_structure_sidebar .pkp_block.block_custom .jskm-card-content {
    width: 100% !important;
    margin: 0 !important;
    padding: 18px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #FFFFFF !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
}

/* Gambar visitor berada tepat di tengah */
.pkp_structure_sidebar .jskm-card-content img {
    display: block !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 auto !important;
}

/* Link pembungkus visitor */
.pkp_structure_sidebar .jskm-card-content > a {
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
}

/* Indexing */
.pkp_structure_sidebar .jskm-indexing {
    width: 100% !important;
    margin: 0 !important;
    padding: 18px !important;
    box-sizing: border-box !important;
}

/* =====================================================
   RESPONSIVE
====================================================== */

@media (max-width: 992px) {
    .pkp_structure_sidebar,
    .pkp_structure_sidebar .pkp_block,
    .pkp_structure_sidebar .pkp_block.block_custom,
    .pkp_structure_sidebar .pkp_block.block_custom > .content {
        width: 100% !important;
        max-width: 100% !important;
    }
}

.jskm-visitors > a:first-child {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 100% !important;
    min-height: 100px;
}

.jskm-visitors img {
    display: block !important;
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 auto !important;
}

/* Article list */

.article-summary.media {
    display: block;
    width: 100%;
    margin: 0 0 18px !important;
    padding: 20px 22px !important;
    border: 1px solid #e5eaf3;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease,
        transform 0.2s ease;
}

.article-summary.media:hover {
    border-color: #cfd9e8;
    box-shadow: 0 6px 18px rgba(47, 93, 170, 0.08);
    transform: translateY(-1px);
}

.article-summary .media-body {
    width: 100%;
    overflow: visible;
}

.article-summary .media-heading {
    margin: 0 0 10px !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    line-height: 1.45 !important;
}

.article-summary .media-heading a {
    color: #173f78 !important;
    text-decoration: none !important;
    transition: color 0.2s ease;
}

.article-summary .media-heading a:hover,
.article-summary .media-heading a:focus {
    color: #2f5daa !important;
    text-decoration: none !important;
}

.article-summary .meta {
    margin: 0 0 4px !important;
    color: #49566b;
    font-size: 13px;
    line-height: 1.6;
}

.article-summary .authors {
    margin: 0 !important;
    color: #374151;
    font-weight: 500;
}

.article-summary .pages {
    margin: 2px 0 8px !important;
    color: #667085;
    font-size: 12px;
    line-height: 1.5;
}

/* DOI */

.article-summary .doi,
.article-summary [class*="doi"] {
    display: block;
    margin: 0 0 6px !important;
    color: #49566b;
    font-size: 13px;
    line-height: 1.5;
}

.article-summary .doi a,
.article-summary [class*="doi"] a {
    color: #2f5daa !important;
    text-decoration: none !important;
}

.article-summary .doi a:hover,
.article-summary [class*="doi"] a:hover {
    text-decoration: underline !important;
}

/* Article statistics */

.article-summary .article-stats,
.article-summary .statistics,
.article-summary .metrics,
.article-summary [class*="stat"] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 12px;
    margin: 8px 0 10px !important;
    color: #596579;
    font-size: 12px;
    line-height: 1.5;
}

.article-summary .article-stats a,
.article-summary .statistics a,
.article-summary .metrics a,
.article-summary [class*="stat"] a {
    color: #49566b !important;
    text-decoration: none !important;
}

/* PDF and galley buttons */

.article-summary .btn-group {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
}

.article-summary .btn,
.article-summary .btn-primary,
.article-summary .btn-group a {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 9px 16px !important;
    border: 1px solid #2f5daa !important;
    border-radius: 6px !important;
    background: #2f5daa !important;
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    text-decoration: none !important;
    box-shadow: none !important;
    transition:
        background-color 0.2s ease,
        border-color 0.2s ease,
        transform 0.2s ease;
}

.article-summary .btn:hover,
.article-summary .btn:focus,
.article-summary .btn-primary:hover,
.article-summary .btn-primary:focus,
.article-summary .btn-group a:hover,
.article-summary .btn-group a:focus {
    border-color: #23498f !important;
    background: #23498f !important;
    color: #ffffff !important;
    transform: translateY(-1px);
}

/* Section title */

.issue-section-title,
.page_issue .section-title,
.page_issue h2,
.page_issue h3 {
    color: #173f78;
}

.page_issue .section-title,
.page_issue h2.section-title,
.page_issue h3.section-title {
    margin: 0 0 18px;
    padding: 14px 18px;
    border-radius: 8px;
    background: #2f5daa;
    color: #ffffff !important;
    font-size: 17px;
    font-weight: 700;
}

/* View all issues */

a[href*="/issue/archive"].btn,
a[href*="/issues"].btn,
.btn-view-all,
.view-all-issues {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 10px 17px !important;
    border: 1px solid #2f5daa !important;
    border-radius: 6px !important;
    background: #2f5daa !important;
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    box-shadow: none !important;
    transition:
        background-color 0.2s ease,
        border-color 0.2s ease,
        transform 0.2s ease;
}

a[href*="/issue/archive"].btn:hover,
a[href*="/issues"].btn:hover,
.btn-view-all:hover,
.view-all-issues:hover {
    border-color: #23498f !important;
    background: #23498f !important;
    color: #ffffff !important;
    transform: translateY(-1px);
}

@media (max-width: 768px) {
    .article-summary.media {
        padding: 16px !important;
    }

    .article-summary .media-heading {
        font-size: 15px !important;
    }

    .article-summary .btn-group {
        width: 100%;
    }

    .article-summary .btn,
    .article-summary .btn-primary,
    .article-summary .btn-group a {
        min-width: 72px;
    }
}

#main-content div.article-summary.media,
.page_index_journal div.article-summary.media,
.page_issue div.article-summary.media {
    display: block !important;
    width: 100% !important;
    margin: 0 0 18px !important;
    padding: 20px 22px !important;
    border: 1px solid #e5eaf3 !important;
    border-radius: 8px !important;
    background: #ffffff !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
    overflow: hidden !important;
    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease,
        transform 0.2s ease !important;
}

#main-content div.article-summary.media:hover,
.page_index_journal div.article-summary.media:hover,
.page_issue div.article-summary.media:hover {
    border-color: #c9d5e5 !important;
    box-shadow: 0 6px 18px rgba(47, 93, 170, 0.08) !important;
    transform: translateY(-1px);
}

#main-content .article-summary .media-body,
.page_index_journal .article-summary .media-body,
.page_issue .article-summary .media-body {
    display: block !important;
    width: 100% !important;
    overflow: visible !important;
}

#main-content .article-summary h3.media-heading,
.page_index_journal .article-summary h3.media-heading,
.page_issue .article-summary h3.media-heading {
    margin: 0 0 10px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.45 !important;
    text-transform: none !important;
}

#main-content .article-summary h3.media-heading a,
.page_index_journal .article-summary h3.media-heading a,
.page_issue .article-summary h3.media-heading a {
    color: #173f78 !important;
    font-weight: 700 !important;
    text-decoration: none !important;
}

#main-content .article-summary h3.media-heading a:hover,
.page_index_journal .article-summary h3.media-heading a:hover,
.page_issue .article-summary h3.media-heading a:hover {
    color: #2f5daa !important;
}

#main-content .article-summary .meta,
.page_index_journal .article-summary .meta,
.page_issue .article-summary .meta {
    margin: 0 0 4px !important;
    color: #49566b !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
}

#main-content .article-summary .authors,
.page_index_journal .article-summary .authors,
.page_issue .article-summary .authors {
    margin: 0 !important;
    color: #374151 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
}

#main-content .article-summary .pages,
.page_index_journal .article-summary .pages,
.page_issue .article-summary .pages {
    margin: 2px 0 8px !important;
    color: #667085 !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
}

#main-content .article-summary .btn-group,
.page_index_journal .article-summary .btn-group,
.page_issue .article-summary .btn-group {
    display: flex !important;
    float: none !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin: 10px 0 0 !important;
}

#main-content .article-summary .btn-group .btn,
#main-content .article-summary .btn-group a,
.page_index_journal .article-summary .btn-group .btn,
.page_index_journal .article-summary .btn-group a,
.page_issue .article-summary .btn-group .btn,
.page_issue .article-summary .btn-group a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 56px !important;
    min-height: 38px !important;
    margin: 0 !important;
    padding: 9px 16px !important;
    border: 1px solid #2f5daa !important;
    border-radius: 6px !important;
    background: #2f5daa !important;
    background-image: none !important;
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    text-decoration: none !important;
    text-shadow: none !important;
    box-shadow: none !important;
}

#main-content .article-summary .btn-group .btn:hover,
#main-content .article-summary .btn-group a:hover,
.page_index_journal .article-summary .btn-group .btn:hover,
.page_index_journal .article-summary .btn-group a:hover,
.page_issue .article-summary .btn-group .btn:hover,
.page_issue .article-summary .btn-group a:hover {
    border-color: #23498f !important;
    background: #23498f !important;
    background-image: none !important;
    color: #ffffff !important;
}

@media (max-width: 768px) {
    #main-content div.article-summary.media,
    .page_index_journal div.article-summary.media,
    .page_issue div.article-summary.media {
        padding: 16px !important;
    }

    #main-content .article-summary h3.media-heading,
    .page_index_journal .article-summary h3.media-heading,
    .page_issue .article-summary h3.media-heading {
        font-size: 15px !important;
    }
}

#main-content .obj_article_summary {
    width: 100%;
    margin: 0 0 18px !important;
    padding: 20px 22px !important;
    border: 1px solid #e5eaf3 !important;
    border-radius: 8px !important;
    background: #ffffff !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease,
        transform 0.2s ease;
}

#main-content .obj_article_summary:hover {
    border-color: #cbd6e5 !important;
    box-shadow: 0 6px 18px rgba(47, 93, 170, 0.08) !important;
    transform: translateY(-1px);
}

#main-content .obj_article_summary > .title {
    margin: 0 0 10px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.45 !important;
}

#main-content .obj_article_summary > .title a {
    color: #173f78 !important;
    font-weight: 700 !important;
    text-decoration: none !important;
}

#main-content .obj_article_summary > .title a:hover,
#main-content .obj_article_summary > .title a:focus {
    color: #2f5daa !important;
}

#main-content .obj_article_summary .doi_container {
    display: block !important;
    margin: 0 0 6px !important;
    color: #49566b !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
}

#main-content .obj_article_summary .doi_container a {
    color: #2f5daa !important;
    text-decoration: none !important;
}

#main-content .obj_article_summary .doi_container a:hover {
    text-decoration: underline !important;
}

#main-content .obj_article_summary .meta {
    margin: 0 0 6px !important;
    color: #374151 !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
}

#main-content .obj_article_summary .article_statistics {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px 14px !important;
    margin: 8px 0 10px !important;
    padding: 10px 12px !important;
    border-radius: 6px !important;
    background: #f7f9fc !important;
    color: #596579 !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
}

#main-content .obj_article_summary .article_statistics svg {
    flex: 0 0 auto;
    width: 15px !important;
    height: 15px !important;
    color: #2f5daa !important;
    stroke: currentColor !important;
}

#main-content .obj_article_summary .article_statistics .article_stat,
#main-content .obj_article_summary .article_statistics .galley_stat {
    margin: 0 !important;
    color: #49566b !important;
    font-size: 12px !important;
}

#main-content .obj_article_summary .sm\:grid {
    margin-top: 10px !important;
}

#main-content .obj_article_summary .btn,
#main-content .obj_article_summary a.btn,
#main-content .obj_article_summary .galley-link,
#main-content .obj_article_summary [class*="btn"] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 38px !important;
    padding: 9px 16px !important;
    border: 1px solid #2f5daa !important;
    border-radius: 6px !important;
    background: #2f5daa !important;
    background-image: none !important;
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    text-decoration: none !important;
    text-shadow: none !important;
    box-shadow: none !important;
    transition:
        background-color 0.2s ease,
        border-color 0.2s ease,
        transform 0.2s ease;
}

#main-content .obj_article_summary .btn:hover,
#main-content .obj_article_summary a.btn:hover,
#main-content .obj_article_summary .galley-link:hover,
#main-content .obj_article_summary [class*="btn"]:hover {
    border-color: #23498f !important;
    background: #23498f !important;
    color: #ffffff !important;
    transform: translateY(-1px);
}

@media (max-width: 768px) {
    #main-content .obj_article_summary {
        padding: 16px !important;
    }

    #main-content .obj_article_summary > .title {
        font-size: 15px !important;
    }

    #main-content .obj_article_summary .article_statistics {
        gap: 6px 10px !important;
    }
}

#main-content .issues.media-list {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

#main-content .issue-summary.media {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 20px 22px !important;
    border: 1px solid #e5eaf3 !important;
    border-radius: 8px !important;
    background: #ffffff !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease,
        transform 0.2s ease;
}

#main-content .issue-summary.media:hover {
    border-color: #cbd6e5 !important;
    box-shadow: 0 6px 18px rgba(47, 93, 170, 0.08) !important;
    transform: translateY(-1px);
}

#main-content .issue-summary .media-body {
    display: block !important;
    width: 100% !important;
}

#main-content .issue-summary h2.media-heading {
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    font-size: 16px !important;
    line-height: 1.45 !important;
    font-weight: 700 !important;
}

#main-content .issue-summary h2.media-heading a.title {
    display: inline-block;
    margin: 0 0 6px !important;
    color: #173f78 !important;
    text-decoration: none !important;
    font-weight: 700 !important;
}

#main-content .issue-summary h2.media-heading a.title:hover,
#main-content .issue-summary h2.media-heading a.title:focus {
    color: #2f5daa !important;
    text-decoration: none !important;
}

#main-content .issue-summary .series.lead {
    margin: 0 !important;
    color: #667085 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 1.5 !important;
}

#main-content .issue-summary .description {
    margin-top: 10px !important;
    color: #49566b !important;
    font-size: 13px !important;
    line-height: 1.7 !important;
}

.page_issue_archive .cmp_pagination,
.page_issue_archive .pagination {
    margin-top: 24px !important;
    padding-top: 8px !important;
}

.page_issue_archive .cmp_pagination a,
.page_issue_archive .pagination a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 40px !important;
    padding: 10px 16px !important;
    border: 1px solid #2f5daa !important;
    border-radius: 6px !important;
    background: #ffffff !important;
    color: #2f5daa !important;
    text-decoration: none !important;
    font-weight: 700 !important;
    transition:
        background-color 0.2s ease,
        color 0.2s ease,
        border-color 0.2s ease;
}

.page_issue_archive .cmp_pagination a:hover,
.page_issue_archive .pagination a:hover {
    background: #2f5daa !important;
    color: #ffffff !important;
}

@media (max-width: 768px) {
    #main-content .issue-summary.media {
        padding: 16px !important;
    }

    #main-content .issue-summary h2.media-heading {
        font-size: 15px !important;
    }
}

/* Article detail */

.page.page_article .article-details {
    display: flex !important;
    align-items: flex-start !important;
    gap: 28px !important;
    width: 100% !important;
    margin: 0 !important;
}

.page.page_article .article-details > .row {
    display: flex !important;
    align-items: flex-start !important;
    gap: 28px !important;
    width: 100% !important;
    margin: 0 !important;
}

.page.page_article .article-sidebar {
    width: 30% !important;
    padding: 0 !important;
}

.page.page_article .article-details > .col-md-8,
.page.page_article .article-details > .row > .col-md-8 {
    width: 70% !important;
    padding: 0 !important;
}

/* Title */

.page.page_article .article-details > h1,
.page.page_article .article-details .article-title,
.page.page_article .article-main > h1 {
    margin: 0 0 24px !important;
    padding: 0 0 18px !important;
    border-bottom: 1px solid #e5eaf3 !important;
    color: #173f78 !important;
    font-size: 34px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

/* Sidebar */

.page.page_article .article-sidebar {
    border: 1px solid #e5eaf3 !important;
    border-radius: 8px !important;
    background: #ffffff !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
    overflow: hidden !important;
}

.page.page_article .article-sidebar img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    border-radius: 0 !important;
}

.page.page_article .article-sidebar .item,
.page.page_article .article-sidebar > div,
.page.page_article .article-sidebar > section {
    margin: 0 !important;
    padding: 14px 16px !important;
    border: 0 !important;
    border-top: 1px solid #e5eaf3 !important;
    background: #ffffff !important;
}

.page.page_article .article-sidebar .label,
.page.page_article .article-sidebar h2,
.page.page_article .article-sidebar h3,
.page.page_article .article-sidebar strong {
    color: #173f78 !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.45 !important;
}

.page.page_article .article-sidebar p,
.page.page_article .article-sidebar div,
.page.page_article .article-sidebar span {
    color: #374151 !important;
    font-size: 13px !important;
    line-height: 1.65 !important;
}

.page.page_article .article-sidebar a {
    color: #2f5daa !important;
    text-decoration: none !important;
    overflow-wrap: anywhere !important;
}

.page.page_article .article-sidebar a:hover,
.page.page_article .article-sidebar a:focus {
    text-decoration: underline !important;
}

/* PDF button */

.page.page_article .article-sidebar .galley-link,
.page.page_article .article-sidebar .obj_galley_link,
.page.page_article .article-sidebar a[href*="/galley/"],
.page.page_article .article-sidebar a[href*="/view/"][class*="btn"],
.page.page_article .article-sidebar .btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: calc(100% - 24px) !important;
    min-height: 40px !important;
    margin: 12px !important;
    padding: 10px 16px !important;
    border: 1px solid #2f5daa !important;
    border-radius: 6px !important;
    background: #2f5daa !important;
    background-image: none !important;
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    text-shadow: none !important;
    box-shadow: none !important;
    transition:
        background-color 0.2s ease,
        border-color 0.2s ease,
        transform 0.2s ease;
}

.page.page_article .article-sidebar .galley-link:hover,
.page.page_article .article-sidebar .obj_galley_link:hover,
.page.page_article .article-sidebar a[href*="/galley/"]:hover,
.page.page_article .article-sidebar .btn:hover {
    border-color: #23498f !important;
    background: #23498f !important;
    color: #ffffff !important;
    transform: translateY(-1px);
}

/* Main content */

.page.page_article .article-main {
    width: 100% !important;
    margin: 0 0 22px !important;
    padding: 22px 24px !important;
    border: 1px solid #e5eaf3 !important;
    border-radius: 8px !important;
    background: #ffffff !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
}

.page.page_article .article-main h2,
.page.page_article .article-main h3,
.page.page_article .article-main .label {
    margin: 0 0 14px !important;
    color: #2f5daa !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
}

.page.page_article .article-main p {
    margin: 0 0 16px !important;
    color: #374151 !important;
    font-size: 14px !important;
    line-height: 1.85 !important;
    text-align: justify !important;
}

/* Authors */

.page.page_article .article-main .authors,
.page.page_article .article-main .author {
    margin-bottom: 20px !important;
}

.page.page_article .article-main .authors strong,
.page.page_article .article-main .author strong,
.page.page_article .article-main .authors .name {
    color: #173f78 !important;
    font-weight: 700 !important;
}

.page.page_article .article-main .authors a,
.page.page_article .article-main .author a {
    color: #2f5daa !important;
    text-decoration: none !important;
}

.page.page_article .article-main .authors a:hover,
.page.page_article .article-main .author a:hover {
    text-decoration: underline !important;
}

/* More details */

.page.page_article .article-more-details {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid #e5eaf3 !important;
    border-radius: 8px !important;
    background: #ffffff !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
    overflow: hidden !important;
}

.page.page_article .article-more-details > div,
.page.page_article .article-more-details > section,
.page.page_article .article-more-details .item {
    margin: 0 !important;
    padding: 14px 16px !important;
    border: 0 !important;
    border-bottom: 1px solid #e5eaf3 !important;
}

.page.page_article .article-more-details > div:last-child,
.page.page_article .article-more-details > section:last-child,
.page.page_article .article-more-details .item:last-child {
    border-bottom: 0 !important;
}

.page.page_article .article-more-details h2,
.page.page_article .article-more-details h3,
.page.page_article .article-more-details .label {
    margin: 0 0 8px !important;
    color: #2f5daa !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.45 !important;
}

.page.page_article .article-more-details p {
    margin: 0 !important;
    color: #374151 !important;
    font-size: 13px !important;
    line-height: 1.7 !important;
}

.page.page_article .article-more-details a {
    color: #2f5daa !important;
    text-decoration: none !important;
}

.page.page_article .article-more-details a:hover,
.page.page_article .article-more-details a:focus {
    text-decoration: underline !important;
}

/* Mobile */

@media (max-width: 768px) {
    .page.page_article .article-details,
    .page.page_article .article-details > .row {
        display: block !important;
    }

    .page.page_article .article-sidebar,
    .page.page_article .article-details > .col-md-8,
    .page.page_article .article-details > .row > .col-md-8 {
        width: 100% !important;
    }

    .page.page_article .article-sidebar {
        margin-bottom: 20px !important;
    }

    .page.page_article .article-main {
        padding: 18px !important;
    }

    .page.page_article .article-details > h1,
    .page.page_article .article-main > h1 {
        font-size: 27px !important;
        line-height: 1.3 !important;
    }

    .page.page_article .article-main p {
        text-align: left !important;
    }
}

/* Article detail layout correction */

.page.page_article .article-details {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
}

.page.page_article .article-details > h1,
.page.page_article .article-details > .article-title {
    display: block !important;
    width: 100% !important;
    margin: 0 0 26px !important;
    padding: 0 0 18px !important;
    border-bottom: 1px solid #e5eaf3 !important;
    color: #173f78 !important;
    font-size: 32px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
}

.page.page_article .article-details > .row {
    display: flex !important;
    align-items: flex-start !important;
    gap: 24px !important;
    width: 100% !important;
    margin: 0 !important;
}

.page.page_article .article-details > .row > .article-sidebar {
    flex: 0 0 31% !important;
    width: 31% !important;
    max-width: 31% !important;
    margin: 0 !important;
    padding: 0 !important;
}

.page.page_article .article-details > .row > .col-md-8 {
    flex: 1 1 0 !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.page.page_article .article-main {
    width: 100% !important;
    margin: 0 0 20px !important;
    padding: 22px 24px !important;
}

.page.page_article .article-main p {
    margin: 0 0 16px !important;
    color: #374151 !important;
    font-size: 14px !important;
    line-height: 1.8 !important;
    text-align: left !important;
    word-spacing: normal !important;
    letter-spacing: normal !important;
}

/* Prevent author and abstract text from becoming too narrow */

.page.page_article .article-main,
.page.page_article .article-main *,
.page.page_article .article-more-details,
.page.page_article .article-more-details * {
    max-width: 100%;
}

.page.page_article .article-main .authors,
.page.page_article .article-main .author {
    width: 100% !important;
}

/* Sidebar metadata */

.page.page_article .article-sidebar {
    font-size: 13px !important;
}

.page.page_article .article-sidebar .item,
.page.page_article .article-sidebar > div,
.page.page_article .article-sidebar > section {
    padding: 14px 15px !important;
}

/* Responsive */

@media (max-width: 992px) {
    .page.page_article .article-details > .row {
        display: block !important;
    }

    .page.page_article .article-details > .row > .article-sidebar,
    .page.page_article .article-details > .row > .col-md-8 {
        width: 100% !important;
        max-width: 100% !important;
    }

    .page.page_article .article-details > .row > .article-sidebar {
        margin-bottom: 22px !important;
    }
}

@media (max-width: 768px) {
    .page.page_article .article-details > h1,
    .page.page_article .article-details > .article-title {
        font-size: 25px !important;
        line-height: 1.35 !important;
    }

    .page.page_article .article-main {
        padding: 18px !important;
    }
}

/* =========================
   BREADCRUMB / CMP_BREADCRUMBS
   ========================= */

.cmp_breadcrumbs {
    margin: 0 0 24px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}

.cmp_breadcrumbs .breadcrumb {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 6px !important;
    margin: 0 !important;
    padding: 14px 18px !important;
    list-style: none !important;
    border: 1px solid #e5eaf3 !important;
    border-radius: 8px !important;
    background: #f7f9fc !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
}

.cmp_breadcrumbs .breadcrumb > li {
    display: inline-flex !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #667085 !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
}

.cmp_breadcrumbs .breadcrumb > li + li::before {
    content: "/" !important;
    margin: 0 6px 0 2px !important;
    color: #98a2b3 !important;
    font-weight: 400 !important;
}

.cmp_breadcrumbs .breadcrumb > li a {
    color: #2f5daa !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    transition: color 0.2s ease;
}

.cmp_breadcrumbs .breadcrumb > li a:hover,
.cmp_breadcrumbs .breadcrumb > li a:focus {
    color: #173f78 !important;
    text-decoration: underline !important;
}

.cmp_breadcrumbs .breadcrumb > li.active {
    color: #667085 !important;
    font-weight: 500 !important;
    word-break: break-word !important;
}

@media (max-width: 768px) {
    .cmp_breadcrumbs .breadcrumb {
        padding: 12px 14px !important;
        gap: 4px !important;
    }

    .cmp_breadcrumbs .breadcrumb > li {
        font-size: 13px !important;
    }

    .cmp_breadcrumbs .breadcrumb > li + li::before {
        margin: 0 4px 0 1px !important;
    }
}

/* Current issue */

.page_index_journal .current_issue {
    width: 100%;
    margin: 0 0 32px;
}

.page_index_journal .current_issue > .page-header {
    margin: 0 0 18px !important;
    padding: 0 0 12px !important;
    border-bottom: 1px solid #e5eaf3 !important;
}

.page_index_journal .current_issue > .page-header h2 {
    margin: 0 !important;
    color: #173f78 !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
}

.page_index_journal .current_issue_title {
    margin: 0 0 18px !important;
    color: #49566b !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1.55 !important;
}

.page_index_journal .issue-toc {
    width: 100%;
    margin: 0 0 20px !important;
    padding: 0 !important;
    border: 1px solid #e5eaf3 !important;
    border-radius: 8px !important;
    background: #ffffff !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
    overflow: hidden !important;
}

.page_index_journal .issue-toc > .heading.row {
    display: flex !important;
    align-items: flex-start !important;
    gap: 24px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 22px !important;
}

.page_index_journal .issue-toc .thumbnail.col-md-4 {
    flex: 0 0 220px !important;
    width: 220px !important;
    max-width: 220px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
}

.page_index_journal .issue-toc .thumbnail img {
    display: block !important;
    width: 100% !important;
    max-width: 220px !important;
    height: auto !important;
    margin: 0 !important;
    border: 1px solid #e5eaf3 !important;
    border-radius: 8px !important;
    box-shadow: 0 6px 16px rgba(15, 23, 42, 0.08) !important;
}

.page_index_journal .issue-toc .issue-details.col-md-8 {
    flex: 1 1 auto !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #374151 !important;
}

.page_index_journal .issue-toc .issue-details h2,
.page_index_journal .issue-toc .issue-details h3 {
    margin: 0 0 12px !important;
    color: #173f78 !important;
    font-size: 19px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
}

.page_index_journal .issue-toc .issue-details p {
    margin: 0 0 14px !important;
    color: #374151 !important;
    font-size: 14px !important;
    line-height: 1.8 !important;
    text-align: left !important;
}

.page_index_journal .issue-toc .issue-details p:last-child {
    margin-bottom: 0 !important;
}

.page_index_journal .issue-toc .sections {
    width: 100% !important;
    margin: 0 !important;
    padding: 20px 22px !important;
    border-top: 1px solid #e5eaf3 !important;
    background: #fbfcfe !important;
}

.page_index_journal .issue-toc .sections > h2,
.page_index_journal .issue-toc .sections > h3 {
    margin: 0 0 16px !important;
    color: #173f78 !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
}

/* View all issues */

.page_index_journal .current_issue > .read-more,
.page_index_journal .current_issue a.btn.read-more {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 40px !important;
    margin: 0 !important;
    padding: 10px 17px !important;
    border: 1px solid #2f5daa !important;
    border-radius: 6px !important;
    background: #2f5daa !important;
    background-image: none !important;
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    text-decoration: none !important;
    text-shadow: none !important;
    box-shadow: none !important;
    transition:
        background-color 0.2s ease,
        border-color 0.2s ease,
        transform 0.2s ease !important;
}

.page_index_journal .current_issue > .read-more:hover,
.page_index_journal .current_issue > .read-more:focus,
.page_index_journal .current_issue a.btn.read-more:hover,
.page_index_journal .current_issue a.btn.read-more:focus {
    border-color: #23498f !important;
    background: #23498f !important;
    color: #ffffff !important;
    transform: translateY(-1px);
}

/* Responsive */

@media (max-width: 768px) {
    .page_index_journal .issue-toc > .heading.row {
        display: block !important;
        padding: 18px !important;
    }

    .page_index_journal .issue-toc .thumbnail.col-md-4 {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 0 20px !important;
    }

    .page_index_journal .issue-toc .thumbnail img {
        width: 100% !important;
        max-width: 280px !important;
        margin: 0 auto !important;
    }

    .page_index_journal .issue-toc .issue-details.col-md-8 {
        width: 100% !important;
    }

    .page_index_journal .issue-toc .sections {
        padding: 18px !important;
    }

    .page_index_journal .current_issue > .read-more,
    .page_index_journal .current_issue a.btn.read-more {
        width: 100% !important;
    }
}

@media (max-width: 768px) {

    .journal-description h1 {
        margin-bottom: 24px !important;
        font-size: 34px !important;
        line-height: 1.15 !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
    }

    .journal-description .jskm-about,
    .journal-description .jskm-about tbody,
    .journal-description .jskm-about tr,
    .journal-description .jskm-about td {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
    }

    .journal-description .jskm-about {
        margin-bottom: 28px !important;
        table-layout: auto !important;
    }

    .journal-description .jskm-cover-cell {
        display: block !important;
        width: 100% !important;
        margin: 0 0 24px !important;
        padding: 0 !important;
        text-align: center !important;
    }

    .journal-description .jskm-cover {
        display: block !important;
        width: auto !important;
        max-width: 220px !important;
        height: auto !important;
        margin: 0 auto !important;
        border-radius: 10px !important;
    }

    .journal-description .jskm-description {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        color: #374151 !important;
        font-size: 15px !important;
        line-height: 1.75 !important;
        text-align: left !important;
        word-spacing: normal !important;
        letter-spacing: normal !important;
        overflow-wrap: break-word !important;
    }

    .journal-description .jskm-description p {
        margin: 0 0 16px !important;
        text-align: left !important;
        word-spacing: normal !important;
    }
}

@media (max-width: 480px) {

    .journal-description h1 {
        font-size: 30px !important;
    }

    .journal-description .jskm-cover {
        max-width: 190px !important;
    }

    .journal-description .jskm-description {
        font-size: 14px !important;
        line-height: 1.7 !important;
    }
}

/* =====================================================
   SIDEBAR BLOCK SPACING
   Menyamakan jarak antar Information, Visitors, Indexing, dan block lain
====================================================== */

#sidebar.pkp_structure_sidebar > .pkp_block {
    margin: 0 !important;
}

#sidebar.pkp_structure_sidebar > .pkp_block + .pkp_block {
    margin-top: 24px !important;
}

/* Jika tema OJS menempatkan block melalui wrapper, tetap beri jarak */
#sidebar.pkp_structure_sidebar .pkp_block + .pkp_block {
    margin-top: 24px !important;
}

@media (max-width: 992px) {
    #sidebar.pkp_structure_sidebar > .pkp_block + .pkp_block {
        margin-top: 20px !important;
    }
}