/* =========================================================
   JDM — STEP 1–2 LOCKED FOUNDATION
   GLOBAL + MASTHEAD + NAVIGATION
   Preserve Native OJS Grid
   ========================================================= */

/* ================= GLOBAL ================= */

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

.pkp_structure_page,
.pkp_structure_content {
    width: 100%;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

.pkp_structure_page img {
    max-width: 100%;
    height: auto;
}


/* ================= MASTHEAD ================= */

.navbar-default {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.navbar-default .container-fluid {
    display: flex !important;
    flex-direction: column !important;
    margin: 0 !important;
    padding: 0 !important;
}

.navbar-default .navbar-header {
    width: 100% !important;
    float: none !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #fff !important;
}

.navbar-default .navbar-header .site-name {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0 !important;
}

.navbar-default .navbar-header .navbar-brand {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0 !important;
}

.navbar-default .navbar-header .navbar-brand img {
    display: block !important;
    width: 100% !important;
    max-width: 1200px !important;
    height: auto !important;
    margin: 0 auto !important;
    padding: 0 !important;
    object-fit: contain !important;
}


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

.navbar-default #nav-menu {
    width: 100% !important;
    float: none !important;
    background: #3f403c !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 0 0 4px 4px !important;
}

.navbar-default #nav-menu .navbar-nav {
    float: left !important;
    margin: 0 !important;
}

.navbar-default #nav-menu .navbar-nav > li > a {
    color: #fff !important;
    font-weight: 600 !important;
    padding: 18px 20px !important;
    transition:
        background-color .25s ease,
        color .25s ease !important;
}

.navbar-default #nav-menu .navbar-nav > li > a:hover,
.navbar-default #nav-menu .navbar-nav > li > a:focus {
    background: #555650 !important;
    color: #fff !important;
}


/* ================= CONTENT GAP ================= */

@media (min-width: 769px) {

    .pkp_structure_content {
        padding-top: 28px !important;
    }

}


/* ================= MOBILE ================= */

@media (max-width: 768px) {

    .pkp_structure_page,
    .pkp_structure_content {
        width: 100%;
        max-width: 100%;
    }

    .navbar-default .navbar-header .navbar-brand img {
        width: 100% !important;
        height: auto !important;
    }

    .navbar-default #nav-menu .navbar-nav {
        float: none !important;
        width: 100% !important;
    }

    .navbar-default #nav-menu .navbar-nav > li {
        float: none !important;
        width: 100% !important;
    }

    .navbar-default #nav-menu .navbar-nav > li > a {
        padding: 14px 18px !important;
    }

}
/* =========================================================
   JDM STEP 3
   GLOBAL PAGE CONTAINER
   Header → Navigation → Content → Sidebar → Footer
   Preserve Native OJS Grid
   ========================================================= */


/* ---------------------------------------------------------
   1. PAGE BACKGROUND
   --------------------------------------------------------- */

html,
body {
    background: #f4f6f8 !important;
}


/* ---------------------------------------------------------
   2. GLOBAL JDM CONTAINER
   Native OJS page wrapper
   --------------------------------------------------------- */

.pkp_structure_page {
    width: 100% !important;
    max-width: 1200px !important;

    margin-left: auto !important;
    margin-right: auto !important;

    background: #ffffff !important;
}


/* ---------------------------------------------------------
   3. KEEP CONTENT INSIDE THE SAME VISUAL CONTAINER
   --------------------------------------------------------- */

.pkp_structure_main {
    background: #ffffff !important;
}


/* ---------------------------------------------------------
   4. CONTENT AREA
   IMPORTANT:
   Do NOT create a new grid.
   Let OJS control Main + Sidebar.
   --------------------------------------------------------- */

.pkp_structure_content {
    box-sizing: border-box !important;

    margin-top: 0 !important;
}


/* ---------------------------------------------------------
   5. SIDEBAR
   Keep native OJS positioning
   --------------------------------------------------------- */

.pkp_structure_sidebar {
    box-sizing: border-box !important;

    margin-top: 0 !important;
}


/* ---------------------------------------------------------
   6. SPACE BETWEEN NAVIGATION AND CONTENT
   --------------------------------------------------------- */

.pkp_structure_main {
    padding-top: 28px !important;
}


/* ---------------------------------------------------------
   7. SIDEBAR BLOCK SPACING
   --------------------------------------------------------- */

.pkp_structure_sidebar .block {
    margin-bottom: 20px !important;
}


/* ---------------------------------------------------------
   8. FOOTER
   Keep footer inside visual container
   --------------------------------------------------------- */

.pkp_structure_footer {
    background: #ffffff !important;

    margin-top: 30px !important;
}


/* ---------------------------------------------------------
   9. REMOVE UNNECESSARY OUTER GAPS
   --------------------------------------------------------- */

.pkp_structure_page > * {
    margin-left: 0 !important;
    margin-right: 0 !important;
}


/* ---------------------------------------------------------
   10. RESPONSIVE
   --------------------------------------------------------- */

@media (max-width: 1200px) {

    .pkp_structure_page {
        width: 100% !important;
        max-width: 100% !important;
    }

}


@media (max-width: 768px) {

    .pkp_structure_main {
        padding-top: 20px !important;
    }

}
/* =========================================================
   JDM STEP 3A
   ALIGNMENT + SPACING TUNING
   ========================================================= */


/* ---------------------------------------------------------
   1. REDUCE GAP AFTER MASTHEAD
   --------------------------------------------------------- */

.navbar-default .navbar-header {
    margin-bottom: 0 !important;
}

.navbar-default #nav-menu {
    margin-top: 0 !important;
}


/* ---------------------------------------------------------
   2. REDUCE SPACE BEFORE NAVIGATION
   --------------------------------------------------------- */

.navbar-default .container-fluid {
    margin-bottom: 0 !important;
}


/* ---------------------------------------------------------
   3. CONTENT STARTS AT SAME LEVEL
   AS SIDEBAR
   --------------------------------------------------------- */

.pkp_structure_content > :first-child {
    margin-top: 0 !important;
}

.pkp_structure_sidebar > :first-child {
    margin-top: 0 !important;
}


/* ---------------------------------------------------------
   4. KEEP MAIN AREA CLOSE TO NAVIGATION
   --------------------------------------------------------- */

.pkp_structure_main {
    padding-top: 28px !important;
}


/* ---------------------------------------------------------
   5. REMOVE POSSIBLE TOP OFFSET
   FROM CONTENT WRAPPER
   --------------------------------------------------------- */

.pkp_structure_content {
    padding-top: 0 !important;
}


/* ---------------------------------------------------------
   6. REMOVE POSSIBLE TOP OFFSET
   FROM SIDEBAR
   --------------------------------------------------------- */

.pkp_structure_sidebar {
    padding-top: 0 !important;
}
/* =========================================================
   JDM STEP 3B
   ALIGN SIDEBAR WITH MAIN CONTENT
   ========================================================= */

@media (min-width: 768px) {

    /* Sidebar mengikuti titik awal Main Content */
    .pkp_structure_sidebar {
        padding-top: 56px !important;
    }

}
/* =========================================================
   JDM STEP 4
   MAIN CONTENT + SIDEBAR VISUAL CONTAINER
   Preserve Native OJS Grid
   ========================================================= */

/* ---------------------------------------------------------
   1. MAIN CONTENT AREA
   --------------------------------------------------------- */

@media (min-width: 768px) {

    .pkp_structure_main {
        padding-right: 15px !important;
    }

    .pkp_structure_sidebar {
        padding-left: 15px !important;
    }

}


/* ---------------------------------------------------------
   2. MAIN CONTENT VISUAL
   --------------------------------------------------------- */

.pkp_structure_main {
    background: #ffffff;
}


/* ---------------------------------------------------------
   3. SIDEBAR VISUAL
   --------------------------------------------------------- */

.pkp_structure_sidebar {
    background: transparent;
}


/* ---------------------------------------------------------
   4. SIDEBAR BLOCKS
   --------------------------------------------------------- */

.pkp_structure_sidebar .block {
    background: #ffffff !important;

    border: 1px solid #e1e6eb !important;

    border-radius: 6px !important;

    margin-bottom: 20px !important;

    padding: 0 !important;

    box-shadow: 0 2px 8px rgba(29, 53, 87, 0.05) !important;

    overflow: hidden !important;
}


/* ---------------------------------------------------------
   5. SIDEBAR BLOCK TITLE
   --------------------------------------------------------- */

.pkp_structure_sidebar .block .title,
.pkp_structure_sidebar .block h2,
.pkp_structure_sidebar .block h3 {

    color: #1d3557 !important;

    font-weight: 600 !important;

    font-size: 16px !important;

    padding: 14px 16px !important;

    margin: 0 !important;

    border-bottom: 1px solid #e1e6eb !important;

    background: #f8fafc !important;
}


/* ---------------------------------------------------------
   6. SIDEBAR CONTENT
   --------------------------------------------------------- */

.pkp_structure_sidebar .block > *:not(.title):not(h2):not(h3) {

    padding-left: 16px !important;
    padding-right: 16px !important;

}


/* ---------------------------------------------------------
   7. SIDEBAR LINKS
   --------------------------------------------------------- */

.pkp_structure_sidebar .block a {

    color: #2474b5 !important;

    text-decoration: none !important;

    transition: color 0.2s ease !important;
}


.pkp_structure_sidebar .block a:hover {

    color: #1d3557 !important;

}


/* ---------------------------------------------------------
   8. MAIN CONTENT TYPOGRAPHY
   --------------------------------------------------------- */

.pkp_structure_main h1,
.pkp_structure_main h2,
.pkp_structure_main h3 {

    color: #1d3557 !important;

}


/* ---------------------------------------------------------
   9. CONTENT SPACING
   --------------------------------------------------------- */

.pkp_structure_main .page {

    margin-bottom: 30px !important;

}


/* ---------------------------------------------------------
   10. MOBILE
   --------------------------------------------------------- */

@media (max-width: 767px) {

    .pkp_structure_main,
    .pkp_structure_sidebar {

        padding-left: 15px !important;
        padding-right: 15px !important;

    }

    .pkp_structure_sidebar {

        margin-top: 25px !important;

    }

}
/* =========================================================
   JDM STEP 6
   SIDEBAR BOX
   JDM STRONG GREY + NPPE-STYLE HOVER
   ========================================================= */


/* ---------------------------------------------------------
   1. SIDEBAR BOX
   --------------------------------------------------------- */

.jdm-box {
    background: #ffffff !important;

    border: 1px solid #d9dee2 !important;

    border-radius: 6px !important;

    margin: 0 0 20px 0 !important;
    padding: 0 !important;

    overflow: hidden !important;

    box-shadow: 0 2px 7px rgba(29, 53, 87, 0.04) !important;
}


/* ---------------------------------------------------------
   2. JDM GREY HEADER
   --------------------------------------------------------- */

.jdm-box-title {

    background: #5b6267 !important;

    color: #ffffff !important;

    font-size: 17px !important;

    font-weight: 600 !important;

    line-height: 1.4 !important;

    padding: 14px 16px !important;

    margin: 0 !important;

    border: none !important;

    position: relative !important;
}


/* ---------------------------------------------------------
   3. JDM NAVY ACCENT
   Small identity line
   --------------------------------------------------------- */

.jdm-box-title::after {

    content: "" !important;

    display: block !important;

    width: 32px !important;

    height: 3px !important;

    background: #1d3557 !important;

    margin-top: 8px !important;
}


/* ---------------------------------------------------------
   4. RESET LIST
   --------------------------------------------------------- */

.jdm-box-list {

    list-style: none !important;

    margin: 0 !important;

    padding: 0 !important;
}


/* ---------------------------------------------------------
   5. LIST ITEM
   --------------------------------------------------------- */

.jdm-box-list li {

    margin: 0 !important;

    padding: 0 !important;

    border-bottom: 1px solid #e0e4e7 !important;
}


/* =========================================================
   JDM STEP 6A
   SIDEBAR TEXT — JDM GREY IDENTITY
   ========================================================= */


/* ---------------------------------------------------------
   NORMAL LINK
   --------------------------------------------------------- */

.jdm-box-list li a {

    display: block !important;

    position: relative !important;

    background: #ffffff !important;

    color: #4f565b !important;

    font-size: 14px !important;

    line-height: 1.5 !important;

    font-weight: 500 !important;

    text-decoration: none !important;

    padding: 12px 16px 12px 30px !important;

    transition:
        background-color 0.20s ease,
        color 0.20s ease,
        padding-left 0.20s ease !important;
}


/* ---------------------------------------------------------
   BULLET
   --------------------------------------------------------- */

.jdm-box-list li a::before {

    content: "•" !important;

    position: absolute !important;

    left: 16px !important;

    top: 50% !important;

    transform: translateY(-50%) !important;

    color: #8a9297 !important;

    font-size: 13px !important;
}


/* ---------------------------------------------------------
   HOVER
   --------------------------------------------------------- */

.jdm-box-list li a:hover,
.jdm-box-list li a:focus {

    background: #e3e7e9 !important;

    color: #1d3557 !important;

    padding-left: 35px !important;

    text-decoration: none !important;

    box-shadow:
        inset 4px 0 0 #5b6267 !important;
}


/* ---------------------------------------------------------
   BULLET HOVER
   --------------------------------------------------------- */

.jdm-box-list li a:hover::before,
.jdm-box-list li a:focus::before {

    color: #5b6267 !important;
}
/* =========================================================
   JDM STEP 6B
   ACCREDITATION CERTIFICATE
   JDM IDENTITY CARD
   ========================================================= */


/* ---------------------------------------------------------
   1. MAIN CARD
   --------------------------------------------------------- */

.jdm-cert-box {

    background: #ffffff !important;

    border: 1px solid #d9dee2 !important;

    border-radius: 6px !important;

    margin: 0 0 20px 0 !important;

    padding: 0 !important;

    overflow: hidden !important;

    box-shadow:
        0 2px 7px rgba(29, 53, 87, 0.04) !important;

    transition:
        border-color 0.20s ease,
        box-shadow 0.20s ease !important;
}


/* ---------------------------------------------------------
   2. TITLE
   JDM GREY
   --------------------------------------------------------- */

.jdm-cert-title {

    background: #5b6267 !important;

    color: #ffffff !important;

    font-size: 16px !important;

    font-weight: 600 !important;

    line-height: 1.4 !important;

    padding: 14px 16px !important;

    margin: 0 !important;

    position: relative !important;
}


/* ---------------------------------------------------------
   3. NAVY JDM ACCENT
   --------------------------------------------------------- */

.jdm-cert-title::after {

    content: "" !important;

    display: block !important;

    width: 32px !important;

    height: 3px !important;

    background: #1d3557 !important;

    margin-top: 8px !important;
}


/* ---------------------------------------------------------
   4. CONTENT
   --------------------------------------------------------- */

.jdm-cert-content {

    background: #ffffff !important;

    padding: 13px 16px !important;

    margin: 0 !important;
}


/* ---------------------------------------------------------
   5. DOWNLOAD AREA
   --------------------------------------------------------- */

.jdm-cert-download {

    margin: 0 !important;

    padding: 0 !important;
}


/* ---------------------------------------------------------
   6. LINK
   --------------------------------------------------------- */

.jdm-cert-download a {

    display: block !important;

    position: relative !important;

    color: #4f565b !important;

    background: #ffffff !important;

    font-size: 14px !important;

    font-weight: 500 !important;

    line-height: 1.5 !important;

    text-decoration: none !important;

    padding: 10px 10px 10px 24px !important;

    margin: 0 !important;

    transition:
        background-color 0.20s ease,
        color 0.20s ease,
        padding-left 0.20s ease !important;
}


/* ---------------------------------------------------------
   7. SMALL BULLET
   --------------------------------------------------------- */

.jdm-cert-download a::before {

    content: "•" !important;

    position: absolute !important;

    left: 8px !important;

    top: 50% !important;

    transform: translateY(-50%) !important;

    color: #8a9297 !important;

    font-size: 13px !important;
}


/* ---------------------------------------------------------
   8. HOVER
   SAME LANGUAGE AS SIDEBAR
   --------------------------------------------------------- */

.jdm-cert-download a:hover,
.jdm-cert-download a:focus {

    background: #e3e7e9 !important;

    color: #1d3557 !important;

    padding-left: 29px !important;

    text-decoration: none !important;

    box-shadow:
        inset 4px 0 0 #5b6267 !important;
}


/* ---------------------------------------------------------
   9. CARD HOVER
   --------------------------------------------------------- */

.jdm-cert-box:hover {

    border-color: #c4cbd0 !important;

    box-shadow:
        0 3px 10px rgba(29, 53, 87, 0.07) !important;
}


/* ---------------------------------------------------------
   10. MOBILE
   --------------------------------------------------------- */

@media (max-width: 768px) {

    .jdm-cert-box {

        margin-bottom: 16px !important;
    }

    .jdm-cert-title {

        font-size: 15px !important;

        padding: 13px 15px !important;
    }

    .jdm-cert-content {

        padding: 11px 15px !important;
    }

    .jdm-cert-download a {

        padding:
            10px 8px 10px 22px !important;
    }
}
/* =========================================================
   JDM STEP 7
   MANUSCRIPT TEMPLATE
   JDM GREY IDENTITY
   ========================================================= */


/* ---------------------------------------------------------
   1. MAIN TEMPLATE BOX
   --------------------------------------------------------- */

.jdm-template-box {
    background: #ffffff !important;

    border: 1px solid #d5d9dc !important;

    border-radius: 6px !important;

    overflow: hidden !important;

    box-shadow: 0 2px 8px rgba(30, 40, 48, 0.05) !important;

    margin: 0 !important;

    transition:
        border-color 0.25s ease,
        box-shadow 0.25s ease,
        transform 0.25s ease !important;
}


/* ---------------------------------------------------------
   2. HOVER BOX
   --------------------------------------------------------- */

.jdm-template-box:hover {

    border-color: #5f666b !important;

    box-shadow:
        0 7px 18px rgba(40, 45, 48, 0.14) !important;

    transform: translateY(-2px) !important;
}


/* ---------------------------------------------------------
   3. TITLE — JDM GREY
   --------------------------------------------------------- */

.jdm-template-title {

    background: #5f666b !important;

    color: #ffffff !important;

    font-size: 16px !important;

    font-weight: 600 !important;

    line-height: 1.4 !important;

    padding: 14px 16px 11px 16px !important;

    margin: 0 !important;
}


/* ---------------------------------------------------------
   4. TITLE NAVY ACCENT
   --------------------------------------------------------- */

.jdm-template-title::after {

    content: "";

    display: block;

    width: 32px;

    height: 3px;

    margin-top: 7px;

    background: #163f66 !important;
}


/* ---------------------------------------------------------
   5. CONTENT
   --------------------------------------------------------- */

.jdm-template-content {

    background: #ffffff !important;

    padding: 14px 16px 15px 16px !important;

    margin: 0 !important;

    text-align: center !important;
}


/* ---------------------------------------------------------
   6. TEMPLATE LINK
   --------------------------------------------------------- */

.jdm-template-link {

    display: block !important;

    margin: 0 !important;

    padding: 0 !important;

    text-decoration: none !important;
}


/* ---------------------------------------------------------
   7. TEMPLATE IMAGE
   --------------------------------------------------------- */

.jdm-template-link img {

    display: block !important;

    width: 100% !important;

    max-width: 100% !important;

    height: auto !important;

    margin: 0 auto !important;

    border-radius: 4px !important;

    transition:
        opacity 0.25s ease,
        transform 0.25s ease !important;
}


/* ---------------------------------------------------------
   8. IMAGE HOVER
   --------------------------------------------------------- */

.jdm-template-link:hover img {

    opacity: 0.93 !important;

    transform: scale(1.015) !important;
}


/* ---------------------------------------------------------
   9. CAPTION
   --------------------------------------------------------- */

.jdm-template-caption {

    margin: 9px 0 0 0 !important;

    padding: 0 !important;

    color: #4f565b !important;

    font-size: 12px !important;

    line-height: 1.5 !important;

    text-align: center !important;
}


/* ---------------------------------------------------------
   10. CAPTION HOVER
   --------------------------------------------------------- */

.jdm-template-box:hover .jdm-template-caption {

    color: #163f66 !important;
}


/* ---------------------------------------------------------
   11. MOBILE
   --------------------------------------------------------- */

@media (max-width: 768px) {

    .jdm-template-box {
        transform: none !important;
    }

    .jdm-template-content {
        padding: 12px !important;
    }

    .jdm-template-title {
        font-size: 15px !important;
    }

}
/* =========================================================
   JDM STEP 8
   INDEXING & ABSTRACTING
   JDM GREY IDENTITY
   ========================================================= */


/* ---------------------------------------------------------
   1. MAIN BOX
   --------------------------------------------------------- */

.jdm-index-box {

    background: #ffffff !important;

    border: 1px solid #d5d9dc !important;

    border-radius: 6px !important;

    overflow: hidden !important;

    box-shadow:
        0 2px 8px rgba(30, 40, 48, 0.05) !important;

    margin: 0 !important;

    transition:
        border-color 0.25s ease,
        box-shadow 0.25s ease,
        transform 0.25s ease !important;
}


/* ---------------------------------------------------------
   2. HOVER BOX
   --------------------------------------------------------- */

.jdm-index-box:hover {

    border-color: #5f666b !important;

    box-shadow:
        0 7px 18px rgba(40, 45, 48, 0.14) !important;

    transform: translateY(-2px) !important;
}


/* ---------------------------------------------------------
   3. TITLE
   --------------------------------------------------------- */

.jdm-index-title {

    background: #5f666b !important;

    color: #ffffff !important;

    font-size: 16px !important;

    font-weight: 600 !important;

    line-height: 1.4 !important;

    padding: 14px 16px 11px 16px !important;

    margin: 0 !important;
}


/* ---------------------------------------------------------
   4. NAVY ACCENT UNDER TITLE
   --------------------------------------------------------- */

.jdm-index-title::after {

    content: "";

    display: block;

    width: 32px;

    height: 3px;

    margin-top: 7px;

    background: #163f66 !important;
}


/* ---------------------------------------------------------
   5. CONTENT AREA
   --------------------------------------------------------- */

.jdm-index-content {

    background: #ffffff !important;

    padding: 14px 16px 16px 16px !important;

    margin: 0 !important;

    text-align: center !important;
}


/* ---------------------------------------------------------
   6. LOGO LINKS
   --------------------------------------------------------- */

.jdm-index-content a {

    display: block !important;

    margin: 0 0 12px 0 !important;

    padding: 0 !important;

    text-decoration: none !important;

    border: none !important;
}


/* ---------------------------------------------------------
   7. LAST LOGO
   Remove unnecessary bottom spacing
   --------------------------------------------------------- */

.jdm-index-content a:last-child {

    margin-bottom: 0 !important;
}


/* =========================================================
   JDM STEP 8A
   INDEXING LOGO — UNIFORM VISUAL SIZE
   Override Image Size Only
   ========================================================= */


/* ---------------------------------------------------------
   1. STANDARD LOGO FRAME
   --------------------------------------------------------- */

.jdm-index-content a {
    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;

    height: 92px !important;

    margin: 0 0 10px 0 !important;

    padding: 6px 10px !important;

    background: #ffffff !important;

    border: none !important;
}


/* ---------------------------------------------------------
   2. ALL LOGOS — SAME VISUAL FRAME
   --------------------------------------------------------- */

.jdm-index-content a img {

    display: block !important;

    width: 170px !important;

    height: 78px !important;

    max-width: 170px !important;

    max-height: 78px !important;

    object-fit: contain !important;

    object-position: center center !important;

    margin: 0 auto !important;

    padding: 0 !important;

    border: none !important;

    border-radius: 0 !important;
}


/* ---------------------------------------------------------
   3. REMOVE LAST ITEM GAP
   --------------------------------------------------------- */

.jdm-index-content a:last-child {

    margin-bottom: 0 !important;
}


/* ---------------------------------------------------------
   4. HOVER
   --------------------------------------------------------- */

.jdm-index-content a:hover img {

    opacity: 0.92 !important;

    transform: scale(1.03) !important;
}


/* ---------------------------------------------------------
   5. SMOOTH TRANSITION
   --------------------------------------------------------- */

.jdm-index-content a img {

    transition:
        transform 0.25s ease,
        opacity 0.25s ease !important;
}


/* ---------------------------------------------------------
   6. MOBILE
   --------------------------------------------------------- */

@media (max-width: 768px) {

    .jdm-index-content a {

        height: 82px !important;

        padding: 5px 8px !important;
    }

    .jdm-index-content a img {

        width: 150px !important;

        height: 68px !important;

        max-width: 150px !important;

        max-height: 68px !important;
    }

}
/* =========================================================
   JDM STEP 9
   STATISTIC
   JDM GREY IDENTITY
   ========================================================= */


/* ---------------------------------------------------------
   1. MAIN STATISTIC BOX
   --------------------------------------------------------- */

.jdm-stat-box {

    background: #ffffff !important;

    border: 1px solid #d5d9dc !important;

    border-radius: 6px !important;

    overflow: hidden !important;

    box-shadow:
        0 2px 8px rgba(30, 40, 48, 0.05) !important;

    margin: 0 !important;

    transition:
        border-color 0.25s ease,
        box-shadow 0.25s ease,
        transform 0.25s ease !important;
}


/* ---------------------------------------------------------
   2. HOVER BOX
   --------------------------------------------------------- */

.jdm-stat-box:hover {

    border-color: #5f666b !important;

    box-shadow:
        0 7px 18px rgba(40, 45, 48, 0.14) !important;

    transform: translateY(-2px) !important;
}


/* ---------------------------------------------------------
   3. TITLE — JDM GREY
   --------------------------------------------------------- */

.jdm-stat-title {

    background: #5f666b !important;

    color: #ffffff !important;

    font-size: 16px !important;

    font-weight: 600 !important;

    line-height: 1.4 !important;

    padding: 14px 16px 11px 16px !important;

    margin: 0 !important;
}


/* ---------------------------------------------------------
   4. NAVY ACCENT
   --------------------------------------------------------- */

.jdm-stat-title::after {

    content: "";

    display: block;

    width: 32px;

    height: 3px;

    margin-top: 7px;

    background: #163f66 !important;
}


/* ---------------------------------------------------------
   5. CONTENT AREA
   --------------------------------------------------------- */

.jdm-stat-content {

    background: #ffffff !important;

    padding: 14px 16px 16px 16px !important;

    margin: 0 !important;

    text-align: center !important;
}


/* ---------------------------------------------------------
   6. STATISTICS LINK
   --------------------------------------------------------- */

.jdm-stat-link {

    display: block !important;

    margin: 0 0 12px 0 !important;

    padding: 0 !important;

    color: #163f66 !important;

    font-size: 13px !important;

    font-weight: 500 !important;

    text-decoration: none !important;
}


/* ---------------------------------------------------------
   7. LINK HOVER
   --------------------------------------------------------- */

.jdm-stat-link:hover {

    color: #5f666b !important;

    text-decoration: underline !important;
}


/* ---------------------------------------------------------
   8. STATISTIC IMAGES
   --------------------------------------------------------- */

.jdm-stat-content img {

    display: block !important;

    width: auto !important;

    max-width: 100% !important;

    height: auto !important;

    margin: 0 auto 10px auto !important;

    border: none !important;

    border-radius: 4px !important;

    object-fit: contain !important;

    transition:
        opacity 0.25s ease,
        transform 0.25s ease !important;
}


/* ---------------------------------------------------------
   9. STATCOUNTER IMAGE
   --------------------------------------------------------- */

.jdm-stat-content a[href*="statcounter.com"] img {

    max-width: 170px !important;

    max-height: 95px !important;
}


/* ---------------------------------------------------------
   10. FLAG COUNTER IMAGE
   --------------------------------------------------------- */

.jdm-stat-content a[href*="flagcounter.info"] img {

    max-width: 170px !important;

    max-height: 115px !important;
}


/* ---------------------------------------------------------
   11. IMAGE HOVER
   --------------------------------------------------------- */

.jdm-stat-content a:hover img {

    opacity: 0.90 !important;

    transform: scale(1.02) !important;
}


/* ---------------------------------------------------------
   12. REMOVE LAST IMAGE GAP
   --------------------------------------------------------- */

.jdm-stat-content a:last-child img {

    margin-bottom: 0 !important;
}


/* ---------------------------------------------------------
   13. MOBILE
   --------------------------------------------------------- */

@media (max-width: 768px) {

    .jdm-stat-box {

        transform: none !important;

        border-radius: 5px !important;
    }

    .jdm-stat-content {

        padding: 12px !important;
    }

    .jdm-stat-title {

        font-size: 15px !important;
    }

    .jdm-stat-content a[href*="statcounter.com"] img {

        max-width: 150px !important;
    }

    .jdm-stat-content a[href*="flagcounter.info"] img {

        max-width: 150px !important;
    }

}
/* =========================================================
   JDM STEP 10
   RECOMMENDED TOOLS
   JDM GREY IDENTITY
   ========================================================= */


/* ---------------------------------------------------------
   1. MAIN BOX
   --------------------------------------------------------- */

.jdm-tools-box {

    background: #ffffff !important;

    border: 1px solid #d5d9dc !important;

    border-radius: 6px !important;

    overflow: hidden !important;

    box-shadow:
        0 2px 8px rgba(30, 40, 48, 0.05) !important;

    margin: 0 !important;

    transition:
        border-color 0.25s ease,
        box-shadow 0.25s ease,
        transform 0.25s ease !important;
}


/* ---------------------------------------------------------
   2. HOVER BOX
   --------------------------------------------------------- */

.jdm-tools-box:hover {

    border-color: #5f666b !important;

    box-shadow:
        0 7px 18px rgba(40, 45, 48, 0.14) !important;

    transform: translateY(-2px) !important;
}


/* ---------------------------------------------------------
   3. TITLE — JDM GREY
   --------------------------------------------------------- */

.jdm-tools-title {

    background: #5f666b !important;

    color: #ffffff !important;

    font-size: 16px !important;

    font-weight: 600 !important;

    line-height: 1.4 !important;

    padding: 14px 16px 11px 16px !important;

    margin: 0 !important;
}


/* ---------------------------------------------------------
   4. NAVY ACCENT
   --------------------------------------------------------- */

.jdm-tools-title::after {

    content: "";

    display: block;

    width: 32px;

    height: 3px;

    margin-top: 7px;

    background: #163f66 !important;
}


/* ---------------------------------------------------------
   5. CONTENT
   --------------------------------------------------------- */

.jdm-tools-content {

    background: #ffffff !important;

    padding: 14px 16px 8px 16px !important;

    margin: 0 !important;

    display: flex !important;

    flex-direction: column !important;

    align-items: center !important;

    gap: 10px !important;
}


/* ---------------------------------------------------------
   6. LOGO FRAME
   Semua logo mendapatkan area yang sama
   --------------------------------------------------------- */

.jdm-tools-content a {

    display: flex !important;

    align-items: center !important;

    justify-content: center !important;

    width: 100% !important;

    height: 72px !important;

    padding: 6px 10px !important;

    margin: 0 !important;

    background: #ffffff !important;

    border: none !important;

    text-decoration: none !important;

    transition:
        background-color 0.25s ease,
        transform 0.25s ease !important;
}


/* ---------------------------------------------------------
   7. ALL TOOL LOGOS — UNIFORM SIZE
   --------------------------------------------------------- */

.jdm-tools-content img {

    display: block !important;

    width: 170px !important;

    height: 58px !important;

    max-width: 170px !important;

    max-height: 58px !important;

    object-fit: contain !important;

    object-position: center center !important;

    margin: 0 auto !important;

    padding: 0 !important;

    border: none !important;

    border-radius: 0 !important;

    transition:
        opacity 0.25s ease,
        transform 0.25s ease !important;
}


/* ---------------------------------------------------------
   8. LOGO HOVER
   --------------------------------------------------------- */

.jdm-tools-content a:hover img {

    opacity: 0.90 !important;

    transform: scale(1.035) !important;
}


/* ---------------------------------------------------------
   9. DESCRIPTION
   --------------------------------------------------------- */

.jdm-tools-desc {

    margin: 4px 16px 15px 16px !important;

    padding-top: 11px !important;

    border-top: 1px solid #e1e4e6 !important;

    color: #5f666b !important;

    font-size: 12px !important;

    line-height: 1.55 !important;

    text-align: center !important;
}


/* ---------------------------------------------------------
   10. DESCRIPTION HOVER
   --------------------------------------------------------- */

.jdm-tools-box:hover .jdm-tools-desc {

    color: #163f66 !important;
}


/* ---------------------------------------------------------
   11. MOBILE
   --------------------------------------------------------- */

@media (max-width: 768px) {

    .jdm-tools-box {

        transform: none !important;

        border-radius: 5px !important;
    }

    .jdm-tools-content {

        padding: 12px 10px 6px 10px !important;

        gap: 8px !important;
    }

    .jdm-tools-content a {

        height: 65px !important;
    }

    .jdm-tools-content img {

        width: 150px !important;

        height: 52px !important;

        max-width: 150px !important;

        max-height: 52px !important;
    }

    .jdm-tools-title {

        font-size: 15px !important;
    }

}
/* =========================================================
   JDM STEP 11
   MODERN CURRENT ISSUE
   BASED ON ACTUAL OJS DOM
   ========================================================= */


/* ---------------------------------------------------------
   1. CURRENT ISSUE SECTION
   --------------------------------------------------------- */

section.current_issue {

    margin-top: 28px !important;
    margin-bottom: 42px !important;

}


/* ---------------------------------------------------------
   2. CURRENT ISSUE TITLE
   --------------------------------------------------------- */

section.current_issue > h2 {

    margin: 0 0 24px 0 !important;

    padding: 0 0 12px 0 !important;

    color: #163f66 !important;

    font-size: 28px !important;

    font-weight: 600 !important;

    line-height: 1.25 !important;

    border-bottom: 1px solid #d8dde1 !important;

    position: relative !important;

}


/* JDM navy accent */

section.current_issue > h2::after {

    content: "";

    position: absolute;

    left: 0;

    bottom: -1px;

    width: 52px;

    height: 3px;

    background: #163f66 !important;

}


/* ---------------------------------------------------------
   3. CURRENT ISSUE CARD
   --------------------------------------------------------- */

section.current_issue .issue-toc {

    margin: 0 !important;

    padding: 24px !important;

    background: #ffffff !important;

    border: 1px solid #dfe3e6 !important;

    border-left: 4px solid #5f666b !important;

    border-radius: 7px !important;

    box-shadow:
        0 3px 12px rgba(30, 40, 48, 0.06) !important;

    overflow: hidden !important;

}


/* ---------------------------------------------------------
   4. ISSUE HEADING
   --------------------------------------------------------- */

section.current_issue .issue-toc .heading-row {

    margin: 0 0 20px 0 !important;

    padding: 0 !important;

}


/* Volume / issue title */

section.current_issue .issue-toc .heading-row h3 {

    margin: 0 !important;

    color: #3f4549 !important;

    font-size: 20px !important;

    font-weight: 600 !important;

    line-height: 1.4 !important;

}


/* ---------------------------------------------------------
   5. COVER COLUMN
   --------------------------------------------------------- */

section.current_issue .issue-toc .thumbnail {

    margin: 0 !important;

    padding: 0 24px 0 0 !important;

    border: none !important;

    background: transparent !important;

}


/* ---------------------------------------------------------
   6. COVER LINK
   --------------------------------------------------------- */

section.current_issue .issue-toc .thumbnail .cover {

    display: block !important;

    margin: 0 !important;

    padding: 0 !important;

    background: transparent !important;

}


/* ---------------------------------------------------------
   7. COVER IMAGE
   --------------------------------------------------------- */

section.current_issue .issue-toc .thumbnail .cover img.img-responsive {

    display: block !important;

    width: 230px !important;

    max-width: 100% !important;

    height: auto !important;

    margin: 0 auto !important;

    border: 1px solid #d8dde1 !important;

    border-radius: 5px !important;

    box-shadow:
        0 4px 12px rgba(30, 40, 48, 0.14) !important;

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease !important;

}


/* ---------------------------------------------------------
   8. COVER HOVER
   --------------------------------------------------------- */

section.current_issue .issue-toc .thumbnail .cover:hover img {

    transform: translateY(-4px) !important;

    box-shadow:
        0 9px 22px rgba(30, 40, 48, 0.20) !important;

}


/* ---------------------------------------------------------
   9. ISSUE DETAILS
   --------------------------------------------------------- */

section.current_issue .issue-toc .issue-details {

    padding: 0 0 0 0 !important;

    color: #3f4549 !important;

}


/* ---------------------------------------------------------
   10. DESCRIPTION
   --------------------------------------------------------- */

section.current_issue .issue-toc .issue-details .description {

    margin: 0 !important;

    color: #3f4549 !important;

    font-size: 14px !important;

    line-height: 1.72 !important;

}


/* Paragraph */

section.current_issue
.issue-toc
.issue-details
.description p {

    margin: 0 0 13px 0 !important;

}


/* ---------------------------------------------------------
   11. PUBLISHED
   --------------------------------------------------------- */

section.current_issue .issue-toc .issue-details .published {

    margin: 18px 0 0 0 !important;

    padding-top: 12px !important;

    border-top: 1px solid #e1e4e7 !important;

    color: #5f666b !important;

    font-size: 13px !important;

}


/* Published label */

section.current_issue
.issue-toc
.issue-details
.published strong {

    color: #3f4549 !important;

    font-weight: 600 !important;

}


/* ---------------------------------------------------------
   12. ARTICLE SECTION
   --------------------------------------------------------- */

section.current_issue .obj_issue_toc {

    margin-top: 30px !important;

}


/* Articles heading */

section.current_issue .obj_issue_toc > h2 {

    margin: 0 0 18px 0 !important;

    padding-bottom: 10px !important;

    color: #3f4549 !important;

    font-size: 21px !important;

    font-weight: 600 !important;

    border-bottom: 1px solid #d8dde1 !important;

}


/* ---------------------------------------------------------
   13. MOBILE
   --------------------------------------------------------- */

@media (max-width: 767px) {

    section.current_issue {

        margin-top: 20px !important;

        margin-bottom: 30px !important;

    }


    section.current_issue > h2 {

        font-size: 24px !important;

    }


    section.current_issue .issue-toc {

        padding: 18px !important;

    }


    section.current_issue .issue-toc .heading-row {

        margin-bottom: 18px !important;

    }


    section.current_issue .issue-toc .thumbnail {

        width: 100% !important;

        padding: 0 !important;

        margin-bottom: 22px !important;

    }


    section.current_issue
    .issue-toc
    .thumbnail
    .cover
    img.img-responsive {

        width: 210px !important;

        margin: 0 auto !important;

    }


    section.current_issue .issue-toc .issue-details {

        width: 100% !important;

        padding: 0 !important;

    }

}
/* =========================================================
   JDM STEP 12
   ARTICLE LIST — JDM GREY IDENTITY
   Based on Native OJS .article-summary.media
   ========================================================= */


/* ---------------------------------------------------------
   JDM COLOR SYSTEM
   --------------------------------------------------------- */

:root {

    --jdm-grey-dark: #4f565b;
    --jdm-grey: #626a70;
    --jdm-grey-mid: #7b8388;
    --jdm-grey-light: #e5e8ea;
    --jdm-grey-bg: #f5f6f7;

    --jdm-navy: #163f66;

    --jdm-text: #33383c;

}


/* ---------------------------------------------------------
   1. ARTICLES SECTION
   --------------------------------------------------------- */

.media-list {

    margin-top: 28px !important;

}


/* ---------------------------------------------------------
   2. ARTICLES HEADING
   --------------------------------------------------------- */

.media-list > h2 {

    color: var(--jdm-grey-dark) !important;

    font-size: 25px !important;

    font-weight: 600 !important;

    margin-bottom: 22px !important;

    padding-bottom: 12px !important;

    border-bottom: 1px solid var(--jdm-grey-light) !important;

    position: relative !important;

}


/* JDM GREY ACCENT */

.media-list > h2::after {

    content: "";

    position: absolute;

    left: 0;

    bottom: -1px;

    width: 46px;

    height: 3px;

    background: var(--jdm-grey-dark) !important;

}


/* ---------------------------------------------------------
   3. ARTICLE CARD
   --------------------------------------------------------- */

.media-list .article-summary.media {

    position: relative !important;

    margin: 0 0 15px 0 !important;

    padding: 19px 21px 18px 22px !important;

    background: #ffffff !important;

    border: 1px solid #dfe3e5 !important;

    border-left: 3px solid #c4c9cc !important;

    border-radius: 5px !important;

    box-shadow: 0 2px 7px rgba(40, 45, 48, 0.035) !important;

    transition:
        border-color .25s ease,
        border-left-color .25s ease,
        box-shadow .25s ease,
        transform .25s ease !important;

}


/* ---------------------------------------------------------
   4. HOVER — JDM GREY
   --------------------------------------------------------- */

.media-list .article-summary.media:hover {

    border-color: #c4c9cc !important;

    border-left-color: var(--jdm-grey-dark) !important;

    box-shadow:
        0 7px 18px rgba(50, 55, 58, 0.10) !important;

    transform: translateY(-2px) !important;

}


/* ---------------------------------------------------------
   5. ARTICLE TITLE
   IMPORTANT:
   Exact OJS selector from Inspect
   --------------------------------------------------------- */

.media-list .article-summary.media h3.media-heading {

    margin: 0 0 8px 0 !important;

    padding: 0 !important;

    font-size: 18px !important;

    line-height: 1.4 !important;

    font-weight: 600 !important;

}


/* TITLE — GREY, NOT BLUE */

.media-list .article-summary.media h3.media-heading a {

    color: var(--jdm-grey-dark) !important;

    text-decoration: none !important;

    transition:
        color .2s ease !important;

}


/* TITLE HOVER */

.media-list .article-summary.media h3.media-heading a:hover {

    color: #202528 !important;

    text-decoration: none !important;

}


/* ---------------------------------------------------------
   6. ARTICLE META / AUTHORS
   --------------------------------------------------------- */

.media-list .article-summary.media .meta {

    color: #565d62 !important;

    font-size: 13px !important;

    line-height: 1.55 !important;

    margin-bottom: 5px !important;

}


/* ---------------------------------------------------------
   7. PAGE NUMBER
   --------------------------------------------------------- */

.media-list .article-summary.media p.pages {

    display: inline-block !important;

    margin: 3px 0 11px 0 !important;

    padding: 3px 8px !important;

    background: var(--jdm-grey-bg) !important;

    color: var(--jdm-grey-dark) !important;

    border: 1px solid #dfe3e5 !important;

    border-radius: 3px !important;

    font-size: 11px !important;

    font-weight: 500 !important;

}


/* ---------------------------------------------------------
   8. PDF BUTTON
   --------------------------------------------------------- */

.media-list .article-summary.media .btn-group {

    margin-top: 3px !important;

}


/* Native PDF button */

.media-list .article-summary.media .btn-group a {

    background: var(--jdm-grey-dark) !important;

    border: 1px solid var(--jdm-grey-dark) !important;

    color: #ffffff !important;

    border-radius: 4px !important;

    padding: 7px 14px !important;

    font-size: 12px !important;

    font-weight: 600 !important;

    text-decoration: none !important;

    box-shadow: none !important;

    transition:
        background-color .2s ease,
        border-color .2s ease,
        transform .2s ease !important;

}


/* PDF HOVER */

.media-list .article-summary.media .btn-group a:hover {

    background: #30363a !important;

    border-color: #30363a !important;

    color: #ffffff !important;

    transform: translateY(-1px) !important;

}


/* ---------------------------------------------------------
   9. SUBTLE JDM MARK
   --------------------------------------------------------- */

.media-list .article-summary.media::after {

    content: "";

    position: absolute;

    right: 20px;

    top: 22px;

    width: 6px;

    height: 6px;

    background: #8b9296 !important;

    border-radius: 50%;

    opacity: .45 !important;

    transition:
        opacity .2s ease,
        transform .2s ease !important;

}


.media-list .article-summary.media:hover::after {

    opacity: 1 !important;

    transform: scale(1.35) !important;

}


/* ---------------------------------------------------------
   10. REMOVE BLUE FROM ARTICLE AREA
   Strong override for OJS native links
   --------------------------------------------------------- */

.media-list .article-summary.media a {

    text-decoration: none !important;

}


/* ---------------------------------------------------------
   11. MOBILE
   --------------------------------------------------------- */

@media (max-width: 768px) {

    .media-list .article-summary.media {

        padding: 17px 17px 16px 18px !important;

        margin-bottom: 12px !important;

    }


    .media-list .article-summary.media h3.media-heading {

        font-size: 17px !important;

    }


    .media-list .article-summary.media::after {

        display: none !important;

    }

}
/* =========================================================
   JDM STEP 13
   CURRENT ISSUE — VIEW ALL ISSUES
   JDM GREY IDENTITY
   ========================================================= */


/* ---------------------------------------------------------
   1. BUTTON POSITION
   --------------------------------------------------------- */

section.current_issue > a.btn.btn-primary.read-more {

    display: inline-flex !important;

    align-items: center !important;

    margin-top: 24px !important;

    margin-bottom: 32px !important;

    margin-left: 0 !important;

    padding: 10px 17px !important;

    min-height: 40px !important;

    box-sizing: border-box !important;

}


/* ---------------------------------------------------------
   2. JDM GREY — NORMAL STATE
   --------------------------------------------------------- */

section.current_issue > a.btn.btn-primary.read-more {

    background: #4f565b !important;

    background-image: none !important;

    border: 1px solid #4f565b !important;

    color: #ffffff !important;

    border-radius: 4px !important;

    box-shadow: none !important;

    font-size: 12px !important;

    font-weight: 600 !important;

    line-height: 1.3 !important;

    text-decoration: none !important;

    transition:
        background-color .2s ease,
        border-color .2s ease,
        box-shadow .2s ease,
        transform .2s ease !important;

}


/* ---------------------------------------------------------
   3. HOVER — DARK JDM GRAPHITE
   --------------------------------------------------------- */

section.current_issue > a.btn.btn-primary.read-more:hover {

    background: #343a3e !important;

    background-image: none !important;

    border-color: #343a3e !important;

    color: #ffffff !important;

    text-decoration: none !important;

    box-shadow:
        0 4px 10px rgba(50, 55, 58, .16) !important;

    transform: translateY(-1px) !important;

}


/* ---------------------------------------------------------
   4. FOCUS / ACTIVE
   --------------------------------------------------------- */

section.current_issue > a.btn.btn-primary.read-more:focus,
section.current_issue > a.btn.btn-primary.read-more:active {

    background: #343a3e !important;

    border-color: #343a3e !important;

    color: #ffffff !important;

    box-shadow: none !important;

    outline: none !important;

}


/* ---------------------------------------------------------
   5. REMOVE BOOTSTRAP BLUE GRADIENT / SHADOW
   --------------------------------------------------------- */

section.current_issue > a.btn-primary {

    background-image: none !important;

    text-shadow: none !important;

}


/* ---------------------------------------------------------
   6. MOBILE
   --------------------------------------------------------- */

@media (max-width: 768px) {

    section.current_issue > a.btn.btn-primary.read-more {

        margin-top: 20px !important;

        margin-bottom: 26px !important;

        padding: 9px 15px !important;

        font-size: 12px !important;

    }

}
/* =========================================================
   JDM — CURRENT ISSUE DESCRIPTION
   FULL JUSTIFY OVERRIDE
   ========================================================= */

section.current_issue .issue-toc .issue-details .description,
section.current_issue .issue-toc .issue-details .description p {

    text-align: justify !important;

    text-justify: inter-word !important;

    line-height: 1.65 !important;

}


/* Jarak antar paragraf */

section.current_issue .issue-toc .issue-details .description p {

    margin-top: 0 !important;

    margin-bottom: 14px !important;

}


/* Paragraf terakhir */

section.current_issue .issue-toc .issue-details .description p:last-child {

    margin-bottom: 0 !important;

}
/* =========================================================
   JDM STEP 14
   ARTICLE ABSTRACT
   Larger + Justified + Academic Readability
   ========================================================= */


/* ABSTRACT TEXT */

section.article-main
.summary.article-summary
.article-abstract p {

    font-size: 16px !important;

    line-height: 1.75 !important;

    text-align: justify !important;

    text-justify: inter-word !important;

    color: #33383c !important;

    font-weight: 400 !important;

    letter-spacing: 0 !important;

    margin: 0 !important;

}


/* =========================================================
   JDM - ARTICLE ABSTRACT
   COMPACT TYPOGRAPHY OVERRIDE
   ========================================================= */

/* ABSTRACT CONTAINER */
#summary.article-summary {
    width: 100% !important;
    max-width: 100% !important;
}


/* =========================================================
   ABSTRACT TITLE
   ========================================================= */

#summary.article-summary > h2 {
    font-size: 25px !important;
    line-height: 1.25 !important;
    font-weight: 500 !important;

    color: #555d62 !important;

    margin-top: 0 !important;
    margin-bottom: 14px !important;

    padding-bottom: 9px !important;

    border-bottom: 1px solid #d9dde0 !important;
}


/* JDM GREY ACCENT */
#summary.article-summary > h2::after {
    content: "" !important;

    display: block !important;

    width: 42px !important;
    height: 3px !important;

    margin-top: 7px !important;

    background: #5f676c !important;
}


/* =========================================================
   ABSTRACT TEXT
   ========================================================= */

#summary.article-summary .article-abstract p {
    font-size: 14px !important;

    line-height: 1.65 !important;

    font-weight: 400 !important;

    color: #303438 !important;

    text-align: justify !important;

    text-justify: inter-word !important;

    margin-top: 0 !important;
    margin-bottom: 0 !important;
}


/* =========================================================
   ABSTRACT BOX
   ========================================================= */

#summary.article-summary .article-abstract {
    background: #ffffff !important;

    border-left: 4px solid #5f676c !important;

    border-top: 1px solid #e1e4e7 !important;
    border-right: 1px solid #e1e4e7 !important;
    border-bottom: 1px solid #e1e4e7 !important;

    padding: 17px 20px !important;

    border-radius: 3px !important;

    box-sizing: border-box !important;
}


/* =========================================================
   FORCE JUSTIFY
   ========================================================= */

#summary.article-summary .article-abstract p,
#summary.article-summary .article-abstract p * {
    text-align: justify !important;
}


/* =========================================================
   DESKTOP
   ========================================================= */

@media (min-width: 992px) {

    #summary.article-summary > h2 {
        font-size: 25px !important;
    }

    #summary.article-summary .article-abstract p {
        font-size: 14px !important;
        line-height: 1.65 !important;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

    #summary.article-summary > h2 {
        font-size: 23px !important;
        margin-bottom: 12px !important;
    }

    #summary.article-summary .article-abstract {
        padding: 15px 17px !important;
    }

    #summary.article-summary .article-abstract p {
        font-size: 13.5px !important;
        line-height: 1.65 !important;
        text-align: justify !important;
    }

}
/* =========================================================
   JDM - REFERENCES
   MATCH ABSTRACT TYPOGRAPHY
   ========================================================= */

/* REFERENCES CONTAINER */
.article-references {
    width: 100% !important;
    max-width: 100% !important;
}


/* =========================================================
   REFERENCES TITLE
   ========================================================= */

.article-references > h2 {
    font-size: 25px !important;
    line-height: 1.25 !important;
    font-weight: 500 !important;

    color: #555d62 !important;

    margin-top: 28px !important;
    margin-bottom: 14px !important;

    padding-bottom: 9px !important;

    border-bottom: 1px solid #d9dde0 !important;
}


/* JDM GREY ACCENT */
.article-references > h2::after {
    content: "" !important;

    display: block !important;

    width: 42px !important;
    height: 3px !important;

    margin-top: 7px !important;

    background: #5f676c !important;
}


/* =========================================================
   REFERENCES CONTENT
   ========================================================= */

.article-references-content {
    width: 100% !important;
    max-width: 100% !important;

    color: #303438 !important;
}


/* EACH REFERENCE */
.article-references-content p {
    font-size: 14px !important;

    line-height: 1.65 !important;

    font-weight: 400 !important;

    color: #303438 !important;

    text-align: justify !important;

    text-justify: inter-word !important;

    margin-top: 0 !important;
    margin-bottom: 13px !important;

    padding: 0 !important;
}


/* FORCE JUSTIFICATION */
.article-references-content p,
.article-references-content p * {
    text-align: justify !important;
}


/* =========================================================
   LINKS / DOI
   ========================================================= */

.article-references-content a {
    font-size: inherit !important;

    line-height: inherit !important;

    color: #555d62 !important;

    text-decoration: none !important;

    overflow-wrap: anywhere !important;
}


/* DOI / LINK HOVER */
.article-references-content a:hover {
    color: #303438 !important;

    text-decoration: underline !important;
}


/* =========================================================
   DESKTOP
   ========================================================= */

@media (min-width: 992px) {

    .article-references-content p {
        font-size: 14px !important;
        line-height: 1.65 !important;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

    .article-references > h2 {
        font-size: 23px !important;
    }

    .article-references-content p {
        font-size: 13.5px !important;
        line-height: 1.65 !important;
        text-align: justify !important;
        margin-bottom: 11px !important;
    }

}
/* =========================================================
   JDM - REFERENCES DOI LINK
   BLUE DEFAULT / GREY ON HOVER & ACTIVE
   ========================================================= */

/* DOI / reference links - default */
.article-references-content a {
    color: #1677c8 !important;
    text-decoration: none !important;

    transition:
        color 0.2s ease,
        text-decoration 0.2s ease !important;
}


/* HOVER */
.article-references-content a:hover {
    color: #5f676c !important;
    text-decoration: underline !important;
}


/* WHEN CLICKED / ACTIVE */
.article-references-content a:active {
    color: #5f676c !important;
}


/* VISITED - tetap biru agar DOI tidak berubah permanen */
.article-references-content a:visited {
    color: #1677c8 !important;
}


/* KEYBOARD FOCUS */
.article-references-content a:focus {
    color: #5f676c !important;
    outline: none !important;
}
/* =========================================================
   JDM — FINAL FOOTER OVERRIDE
   REMOVE OJS / PKP BRANDING
   ========================================================= */


/* ---------------------------------------------------------
   1. FOOTER BACKGROUND
   --------------------------------------------------------- */

footer {
    background: #eeeeee !important;
    border-top: none !important;
    margin-top: 45px !important;
    padding: 28px 0 0 !important;
}


/* ---------------------------------------------------------
   2. MAIN FOOTER ROW
   --------------------------------------------------------- */

footer .container {
    width: 100% !important;
    max-width: 1200px !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
}


/* ---------------------------------------------------------
   3. REMOVE DEFAULT PKP COLUMN
      "Platform & workflow by OJS/PKP"
   --------------------------------------------------------- */

footer .row > .col-md-2 {
    display: none !important;
}


/* ---------------------------------------------------------
   4. MAKE JDM FOOTER FULL WIDTH
   --------------------------------------------------------- */

footer .row > .col-md-10 {
    width: 100% !important;
    max-width: 100% !important;

    flex: 0 0 100% !important;

    padding-left: 0 !important;
    padding-right: 0 !important;
}


/* ---------------------------------------------------------
   5. REMOVE EXTRA BOOTSTRAP SPACING
   --------------------------------------------------------- */

footer .row {
    margin-left: 0 !important;
    margin-right: 0 !important;
}


/* =========================================================
   JDM FOOTER CUSTOM BLOCK
   ========================================================= */

.jdm-footer {
    width: 100% !important;

    background: #4f5559 !important;

    color: #eeeeee !important;

    font-family: Arial, Helvetica, sans-serif !important;

    margin: 0 !important;

    border-top: 4px solid #626a6f !important;

    box-sizing: border-box !important;
}


/* ---------------------------------------------------------
   FOOTER INNER
   --------------------------------------------------------- */

.jdm-footer-inner {
    width: 100% !important;

    max-width: 1100px !important;

    margin: 0 auto !important;

    padding: 28px 28px 24px !important;

    display: grid !important;

    grid-template-columns: 1.35fr 1fr !important;

    gap: 55px !important;

    box-sizing: border-box !important;
}


/* ---------------------------------------------------------
   BRAND AREA
   --------------------------------------------------------- */

.jdm-footer-brand {
    display: flex !important;

    align-items: flex-start !important;

    gap: 20px !important;
}


.jdm-footer-brand img {
    width: 72px !important;

    height: auto !important;

    max-width: 72px !important;

    display: block !important;

    margin: 0 !important;
}


/* ---------------------------------------------------------
   JOURNAL TITLE
   --------------------------------------------------------- */

.jdm-footer-journal {
    font-size: 16px !important;

    line-height: 1.3 !important;

    font-weight: 700 !important;

    color: #ffffff !important;

    margin: 0 !important;
}


/* ---------------------------------------------------------
   JDM ACCENT
   --------------------------------------------------------- */

.jdm-footer-accent {
    width: 38px !important;

    height: 3px !important;

    background: #7b8489 !important;

    margin: 8px 0 10px !important;
}


/* ---------------------------------------------------------
   INSTITUTION
   --------------------------------------------------------- */

.jdm-footer-institution {
    font-size: 13px !important;

    line-height: 1.6 !important;

    color: #d9dddf !important;

    margin: 0 !important;
}


/* =========================================================
   CONTACT
   ========================================================= */

.jdm-footer-heading {
    font-size: 16px !important;

    line-height: 1.3 !important;

    font-weight: 700 !important;

    color: #ffffff !important;

    margin: 0 !important;
}


.jdm-footer-contact-text {
    font-size: 13px !important;

    line-height: 1.6 !important;

    color: #d9dddf !important;

    margin: 0 !important;
}


.jdm-footer-contact-text strong {
    color: #ffffff !important;
}


/* ---------------------------------------------------------
   CONTACT LINKS
   --------------------------------------------------------- */

.jdm-footer-contact-text a {
    color: #d9dddf !important;

    text-decoration: none !important;

    transition: all .2s ease !important;
}


.jdm-footer-contact-text a:hover {
    color: #ffffff !important;

    text-decoration: underline !important;
}


/* =========================================================
   FOOTER BOTTOM
   ========================================================= */

.jdm-footer-bottom {
    width: 100% !important;

    max-width: 1100px !important;

    margin: 0 auto !important;

    padding: 13px 28px !important;

    border-top: 1px solid rgba(255,255,255,.18) !important;

    display: flex !important;

    align-items: center !important;

    justify-content: space-between !important;

    gap: 20px !important;

    box-sizing: border-box !important;

    font-size: 11px !important;

    color: #c9ced1 !important;
}


.jdm-footer-status {
    color: #b8bec2 !important;

    font-size: 10px !important;

    letter-spacing: .35px !important;

    text-transform: uppercase !important;
}


/* =========================================================
   REMOVE DEFAULT PKP FOOTER TEXT / SPACING
   ========================================================= */

footer .pkp_brand_footer {
    display: none !important;
}


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

@media (max-width: 767px) {

    footer {
        margin-top: 30px !important;
        padding-top: 20px !important;
    }

    footer .container {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }

    .jdm-footer-inner {
        grid-template-columns: 1fr !important;

        gap: 24px !important;

        padding: 24px 20px !important;
    }

    .jdm-footer-brand {
        gap: 16px !important;
    }

    .jdm-footer-brand img {
        width: 60px !important;
        max-width: 60px !important;
    }

    .jdm-footer-bottom {
        flex-direction: column !important;

        align-items: flex-start !important;

        gap: 6px !important;

        padding: 12px 20px !important;
    }

    .jdm-footer-status {
        font-size: 9px !important;
    }
}
/* =========================================================
   JDM HOMEPAGE — FIX JOURNAL IDENTITY HEIGHT STRETCH
   ========================================================= */

/* Target JDM identity yang berada di journal index */
#index_site .journals .media-body .description > div {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    flex: 0 0 auto !important;
    align-self: flex-start !important;

    box-sizing: border-box !important;
}


/* Jika description merupakan flex container */
#index_site .journals .media-body .description {
    height: auto !important;
    min-height: 0 !important;

    align-items: flex-start !important;
    align-content: flex-start !important;
}


/* Parent media body jangan melakukan stretching */
#index_site .journals .media-body {
    height: auto !important;
    min-height: 0 !important;

    align-self: flex-start !important;
}


/* Journal item */
#index_site .journals .media {
    height: auto !important;
    min-height: 0 !important;

    align-items: flex-start !important;
}


/* =========================================================
   JDM IDENTITY BOX
   ========================================================= */

#index_site .journals .media-body .description > div {
    width: 100% !important;

    padding: 20px 22px !important;

    margin-bottom: 26px !important;

    background: #ffffff !important;

    border: 1px solid #dfe5ea !important;

    border-left: 5px solid #123b5d !important;

    border-radius: 6px !important;

    box-shadow: 0 3px 12px rgba(18,59,93,.06) !important;

    overflow: visible !important;
}


/* =========================================================
   CONTENT INSIDE JDM BOX
   ========================================================= */

#index_site .journals .media-body .description > div > * {
    height: auto !important;
    min-height: 0 !important;
}


/* Prevent blank vertical space from BR elements */
#index_site .journals .media-body .description > div > br {
    display: none !important;
}
/* =====================================================
   JDM — HEADER IMAGE PROPORTIONAL FIX
   ===================================================== */

h1.site-name,
h1.site-name a.navbar-brand,
h1.site-name a.navbar-brand-logo {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    display: block !important;
}

/* Gunakan gambar asli OJS */
h1.site-name a.navbar-brand img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: none !important;
    object-fit: contain !important;
    object-position: center center !important;

    opacity: 1 !important;
    visibility: visible !important;
}

/* Hilangkan background-image yang sebelumnya kita pakai */
h1.site-name a.navbar-brand {
    background-image: none !important;
}


/* =====================================================
   MOBILE
   ===================================================== */

@media (max-width: 767px) {

    h1.site-name,
    h1.site-name a.navbar-brand,
    h1.site-name a.navbar-brand-logo {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    h1.site-name a.navbar-brand img {
        width: 100% !important;
        height: auto !important;
        max-width: 100% !important;
        object-fit: contain !important;
        display: block !important;
    }
}
/* =========================================================
   JDM — FINAL MASTHEAD SPACING FIX
   Jangan mengubah gambar
   ========================================================= */

/* Header utama */
#headerNavigationContainer {
    margin: 0 !important;
    padding: 0 !important;
}

/* Semua wrapper langsung di dalam header */
#headerNavigationContainer > .container-fluid {
    margin: 0 !important;
    padding: 0 !important;
}

#headerNavigationContainer > .container-fluid > .container-fluid {
    margin: 0 !important;
    padding: 0 !important;
}

/* Site name / masthead */
h1.site-name {
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0 !important;
    min-height: 0 !important;
    height: auto !important;
}

/* Link pembungkus gambar */
h1.site-name a.navbar-brand,
h1.site-name a.navbar-brand-logo {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0 !important;
    min-height: 0 !important;
    height: auto !important;
}

/* Gambar JDM */
h1.site-name a.navbar-brand img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Hilangkan ruang kosong sebelum navigation */
#headerNavigationContainer .navbar {
    margin-top: 0 !important;
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

    #headerNavigationContainer,
    #headerNavigationContainer > .container-fluid,
    #headerNavigationContainer > .container-fluid > .container-fluid {
        margin: 0 !important;
        padding: 0 !important;
    }

    h1.site-name {
        margin: 0 !important;
        padding: 0 !important;
        min-height: 0 !important;
        height: auto !important;
    }

    h1.site-name a.navbar-brand,
    h1.site-name a.navbar-brand-logo {
        margin: 0 !important;
        padding: 0 !important;
        height: auto !important;
        min-height: 0 !important;
    }

    h1.site-name a.navbar-brand img {
        width: 100% !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    #headerNavigationContainer .navbar {
        margin-top: 0 !important;
    }
}
/* =========================================================
   JDM — COMPACT ARTICLE LIST
   Vertical density tuning only
   ========================================================= */

/* Article card */
.obj_article_summary {
    position: relative !important;

    margin: 0 0 16px 0 !important;
    padding: 18px 22px 16px 22px !important;

    border: 1px solid #dfe5e7 !important;
    border-left: 3px solid #5d666b !important;
    border-radius: 6px !important;

    box-shadow: none !important;

    background: #ffffff !important;
}


/* Article title */
.obj_article_summary .title {
    margin: 0 24px 7px 0 !important;

    font-size: 18px !important;
    line-height: 1.28 !important;
    font-weight: 700 !important;
}


/* Article title link */
.obj_article_summary .title a {
    text-decoration: none !important;
}


/* Authors */
.obj_article_summary .authors {
    margin: 0 0 9px 0 !important;

    font-size: 13px !important;
    line-height: 1.45 !important;
}


/* Publication / pages / galley area */
.obj_article_summary .meta {
    margin-top: 6px !important;

    font-size: 12px !important;
    line-height: 1.35 !important;
}


/* Galley buttons */
.obj_article_summary .galleys {
    margin-top: 8px !important;
    padding-top: 0 !important;
}


/* PDF button */
.obj_article_summary .galleys a,
.obj_article_summary .galleys .btn {
    display: inline-block !important;

    padding: 5px 11px !important;

    font-size: 12px !important;
    line-height: 1.2 !important;

    border-radius: 4px !important;
}


/* Page range / issue metadata */
.obj_article_summary .pages {
    display: inline-block !important;

    margin-right: 6px !important;
    padding: 4px 8px !important;

    font-size: 11px !important;
    line-height: 1.2 !important;

    border-radius: 3px !important;
}


/* Remove excessive spacing from common child elements */
.obj_article_summary p {
    margin-top: 0 !important;
    margin-bottom: 7px !important;
}


/* Keep article list compact */
.obj_issue_toc .articles {
    margin-top: 12px !important;
}

.obj_issue_toc .articles > li {
    margin-bottom: 14px !important;
}
/* =========================================================
   JDM — COMPACT ARTICLE LIST
   Target: OJS article-summary.media
   ========================================================= */

/* ARTICLE CARD */
.article-summary.media {
    margin: 0 0 12px 0 !important;
    padding: 14px 20px 13px 20px !important;

    border: 1px solid #dfe4e6 !important;
    border-left: 3px solid #5d666b !important;
    border-radius: 5px !important;

    background: #ffffff !important;

    box-shadow: none !important;
}


/* ARTICLE CONTENT */
.article-summary.media .media-body {
    padding: 0 !important;
    margin: 0 !important;
}


/* TITLE */
.article-summary.media .media-heading {
    margin: 0 22px 6px 0 !important;
    padding: 0 !important;

    font-size: 18px !important;
    line-height: 1.25 !important;
    font-weight: 700 !important;
}


/* TITLE LINK */
.article-summary.media .media-heading a {
    text-decoration: none !important;
}


/* AUTHORS / META */
.article-summary.media .meta {
    margin: 0 0 7px 0 !important;
    padding: 0 !important;

    font-size: 13px !important;
    line-height: 1.4 !important;
}


/* PAGE RANGE */
.article-summary.media .pages {
    display: inline-block !important;

    margin: 0 6px 0 0 !important;
    padding: 4px 8px !important;

    font-size: 11px !important;
    line-height: 1.2 !important;

    border-radius: 3px !important;
}


/* BUTTON AREA */
.article-summary.media .btn-group {
    margin: 0 !important;
    padding: 0 !important;
}


/* PDF BUTTON */
.article-summary.media .btn-group .btn,
.article-summary.media .btn-group a {
    padding: 5px 11px !important;

    font-size: 12px !important;
    line-height: 1.25 !important;

    border-radius: 4px !important;
}


/* REMOVE EXCESSIVE PARAGRAPH SPACING */
.article-summary.media p {
    margin-top: 0 !important;
    margin-bottom: 6px !important;
}


/* ARTICLE LIST SPACING */
.article-summary.media + .article-summary.media {
    margin-top: 12px !important;
}


/* =========================================================
   REMOVE THE SMALL GREY DOT
   ========================================================= */

.article-summary.media::before,
.article-summary.media::after {
    box-shadow: none !important;
}


/* If dot is generated by heading pseudo element */
.article-summary.media .media-heading::before,
.article-summary.media .media-heading::after {
    box-shadow: none !important;
}
/* =========================================================
   JDM ARTICLE LIST — FINAL DENSITY TUNING
   ========================================================= */

/* Compact card */
.article-summary.media {
    margin-bottom: 9px !important;
    padding: 12px 20px 11px 20px !important;
}


/* Title — keep readable, tighten vertically */
.article-summary.media .media-heading {
    margin: 0 20px 5px 0 !important;
    font-size: 18px !important;
    line-height: 1.22 !important;
}


/* Authors */
.article-summary.media .meta {
    margin: 0 0 5px 0 !important;
    font-size: 12.5px !important;
    line-height: 1.32 !important;
}


/* Page range */
.article-summary.media .pages {
    margin: 0 5px 0 0 !important;
    padding: 3px 7px !important;
    font-size: 11px !important;
    line-height: 1.15 !important;
}


/* PDF */
.article-summary.media .btn-group {
    margin: 0 !important;
}

.article-summary.media .btn-group .btn,
.article-summary.media .btn-group a {
    padding: 4px 10px !important;
    font-size: 11.5px !important;
    line-height: 1.15 !important;
}


/* Remove residual paragraph spacing */
.article-summary.media p {
    margin-top: 0 !important;
    margin-bottom: 4px !important;
}


/* =========================================================
   ARTICLE SEPARATION
   ========================================================= */

.obj_issue_toc .article-summary.media + .article-summary.media {
    margin-top: 9px !important;
}


/* =========================================================
   GREY DOT — PRECISE ATTEMPT
   ========================================================= */

.article-summary.media .media-heading::after {
    content: none !important;
    display: none !important;
}

.article-summary.media .media-heading::before {
    content: none !important;
    display: none !important;
}


/* Prevent pseudo-element decoration on article card */
.article-summary.media::before {
    content: none !important;
    display: none !important;
}


/* =========================================================
   DESKTOP ARTICLE DENSITY
   ========================================================= */

@media (min-width: 992px) {

    .article-summary.media {
        min-height: 0 !important;
    }

    .article-summary.media .media-body {
        min-height: 0 !important;
    }

}
/* =========================================================
   JDM — FINAL ARTICLE LIST TUNING
   ========================================================= */

/* 1. FINAL COMPACT CARD */
.article-summary.media {
    margin: 0 0 8px 0 !important;
    padding: 11px 20px 10px 20px !important;

    min-height: 0 !important;
    box-shadow: none !important;
}


/* 2. TITLE */
.article-summary.media .media-heading {
    margin: 0 22px 4px 0 !important;
    padding: 0 !important;

    font-size: 18px !important;
    line-height: 1.22 !important;
}


/* 3. AUTHORS */
.article-summary.media .meta {
    margin: 0 0 5px 0 !important;
    padding: 0 !important;

    font-size: 12.5px !important;
    line-height: 1.3 !important;
}


/* 4. PAGE RANGE */
.article-summary.media .pages {
    display: inline-block !important;

    margin: 0 5px 0 0 !important;
    padding: 3px 7px !important;

    font-size: 11px !important;
    line-height: 1.15 !important;
}


/* 5. PDF BUTTON */
.article-summary.media .btn-group {
    margin: 0 !important;
    padding: 0 !important;
}

.article-summary.media .btn-group .btn {
    padding: 4px 10px !important;

    font-size: 11.5px !important;
    line-height: 1.15 !important;
}


/* 6. REMOVE UNNECESSARY PARAGRAPH SPACE */
.article-summary.media p {
    margin-top: 0 !important;
    margin-bottom: 3px !important;
}


/* 7. ARTICLE GAP */
.obj_issue_toc .article-summary.media + .article-summary.media {
    margin-top: 8px !important;
}


/* =========================================================
   8. GREY DOT — REMOVE ONLY FROM ARTICLE HEADING
   ========================================================= */

.article-summary.media .media-heading::before,
.article-summary.media .media-heading::after {
    content: none !important;
    display: none !important;
}


/* =========================================================
   9. REMOVE CARD PSEUDO DECORATION
   ========================================================= */

.article-summary.media::before,
.article-summary.media::after {
    content: none !important;
}


/* =========================================================
   10. KEEP ARTICLE CONTENT TIGHT
   ========================================================= */

.article-summary.media .media-body {
    margin: 0 !important;
    padding: 0 !important;
}


/* =========================================================
   11. DESKTOP ONLY — DO NOT AFFECT SIDEBAR
   ========================================================= */

@media (min-width: 992px) {

    .obj_issue_toc .articles {
        margin-bottom: 0 !important;
    }

    .article-summary.media {
        min-height: 0 !important;
    }

}
/* =========================================================
   JDM — MICRO TUNING ARTICLE DENSITY
   ========================================================= */

.obj_issue_toc .article-summary.media {
    margin-bottom: 6px !important;
    padding: 10px 18px 9px 18px !important;
}

/* Article title */
.obj_issue_toc .article-summary.media .media-heading {
    margin-bottom: 3px !important;
    font-size: 17px !important;
    line-height: 1.18 !important;
}

/* Authors */
.obj_issue_toc .article-summary.media .meta {
    margin-bottom: 4px !important;
    font-size: 12px !important;
    line-height: 1.25 !important;
}

/* Page range */
.obj_issue_toc .article-summary.media .pages {
    padding: 3px 7px !important;
    font-size: 10.5px !important;
}

/* PDF */
.obj_issue_toc .article-summary.media .btn-group .btn {
    padding: 4px 9px !important;
    font-size: 11px !important;
}

/* Keep article content vertically tight */
.obj_issue_toc .article-summary.media p {
    margin-bottom: 2px !important;
}

/* Gap between consecutive articles */
.obj_issue_toc .article-summary.media + .article-summary.media {
    margin-top: 6px !important;
}
/* =========================================================
   JDM — FINAL ARTICLE LIST MICRO TUNING
   ========================================================= */

.obj_issue_toc .article-summary.media {
    margin-bottom: 8px !important;
    padding: 11px 18px 10px 18px !important;
}

/* Title */
.obj_issue_toc .article-summary.media .media-heading {
    margin: 0 0 4px 0 !important;
    font-size: 17px !important;
    line-height: 1.16 !important;
}

/* Authors */
.obj_issue_toc .article-summary.media .meta {
    margin: 0 0 5px 0 !important;
    font-size: 12px !important;
    line-height: 1.22 !important;
}

/* Page + PDF row */
.obj_issue_toc .article-summary.media .pages,
.obj_issue_toc .article-summary.media .btn-group {
    margin-top: 0 !important;
}

/* Page number */
.obj_issue_toc .article-summary.media .pages {
    padding: 3px 7px !important;
    line-height: 1.2 !important;
}

/* PDF button */
.obj_issue_toc .article-summary.media .btn-group .btn {
    padding: 4px 9px !important;
    line-height: 1.25 !important;
    font-size: 11px !important;
}

/* Remove unnecessary paragraph spacing */
.obj_issue_toc .article-summary.media p {
    margin-bottom: 0 !important;
}

/* Consistent compact rhythm */
.obj_issue_toc .article-summary.media + .article-summary.media {
    margin-top: 8px !important;
}
/* =========================================================
   JDM — ARTICLE LIST FINAL COMPACT TUNING
   ========================================================= */

/* Article card */
.obj_issue_toc .media-list .article-summary.media {
    margin: 0 0 8px 0 !important;
    padding: 0 !important;
}

/* Inner article area */
.obj_issue_toc .media-list .article-summary.media .media-body {
    padding: 12px 18px 10px 18px !important;
}

/* Article title */
.obj_issue_toc .media-list .article-summary.media .media-heading {
    margin: 0 0 5px 0 !important;
    font-size: 17px !important;
    line-height: 1.18 !important;
}

/* Author */
.obj_issue_toc .media-list .article-summary.media .meta {
    margin: 0 0 5px 0 !important;
    font-size: 12px !important;
    line-height: 1.25 !important;
}

/* Page range */
.obj_issue_toc .media-list .article-summary.media .pages {
    margin: 0 !important;
    padding: 3px 7px !important;
    font-size: 10.5px !important;
    line-height: 1.2 !important;
}

/* PDF button */
.obj_issue_toc .media-list .article-summary.media .btn-group {
    margin: 0 !important;
}

.obj_issue_toc .media-list .article-summary.media .btn-group .btn {
    padding: 4px 9px !important;
    font-size: 11px !important;
    line-height: 1.25 !important;
}

/* Remove unnecessary paragraph spacing */
.obj_issue_toc .media-list .article-summary.media p {
    margin-bottom: 0 !important;
}

/* Article-to-article rhythm */
.obj_issue_toc .media-list .article-summary.media + .article-summary.media {
    margin-top: 8px !important;
}
/* =========================================================
   JDM — ARCHIVES
   FINAL ALIGNMENT + COMPACT EDITORIAL
   ========================================================= */

.page_issue_archive {
    padding-top: 14px !important;
}

/* Breadcrumb */
.page_issue_archive .breadcrumb {
    margin: 0 0 18px 0 !important;
    padding: 9px 14px !important;
    font-size: 13px !important;
}

/* Archive list */
.page_issue_archive .issues.media-list {
    margin: 0 !important;
    padding: 0 !important;
}

/* =========================================================
   FORCE ALL ISSUES TO ONE LEFT ALIGNMENT
   ========================================================= */

.page_issue_archive .issue-summary.media {
    display: block !important;
    width: 100% !important;
    margin: 0 0 22px 0 !important;
    padding: 0 0 18px 0 !important;
    border-bottom: 1px solid #e3e8e9 !important;
}

/* Remove media column offset */
.page_issue_archive .issue-summary .media-left {
    display: none !important;
}

/* Main issue content */
.page_issue_archive .issue-summary .media-body {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
}

/* =========================================================
   ISSUE TITLE
   ========================================================= */

.page_issue_archive .issue-summary .media-heading {
    margin: 0 0 1px 0 !important;
    padding: 0 !important;
    font-size: 20px !important;
    line-height: 1.2 !important;
    font-weight: 600 !important;
}

/* Volume / Number */
.page_issue_archive .issue-summary .media-body > p {
    margin: 0 0 8px 0 !important;
    padding: 0 !important;
    line-height: 1.3 !important;
}

/* =========================================================
   DESCRIPTION
   ========================================================= */

.page_issue_archive .issue-summary .description {
    margin: 0 !important;
    padding: 0 !important;
}

.page_issue_archive .issue-summary .description p {
    margin: 0 0 8px 0 !important;
    padding: 0 !important;
    font-size: 15px !important;
    line-height: 1.45 !important;
    text-align: justify !important;
    text-justify: inter-word !important;
}

.page_issue_archive .issue-summary .description p:last-child {
    margin-bottom: 0 !important;
}

/* =========================================================
   LAST ISSUE
   ========================================================= */

.page_issue_archive .issue-summary.media:last-child {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
    border-bottom: 0 !important;
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 768px) {

    .page_issue_archive .issue-summary.media {
        margin-bottom: 18px !important;
        padding-bottom: 15px !important;
    }

    .page_issue_archive .issue-summary .media-heading {
        font-size: 18px !important;
        line-height: 1.25 !important;
    }

    .page_issue_archive .issue-summary .description p {
        font-size: 14px !important;
        line-height: 1.45 !important;
    }
}