/*
=========================================================
KARANG — STAGE 2B
CLEANUP / CORRECTION
OJS 3.5 DEFAULT THEME
=========================================================
Use this file INSTEAD of the previous Stage-2 CSS.
=========================================================
*/

/* =====================================================
   GLOBAL
===================================================== */
html,
body {
    background: #dedede !important;
    color: #222 !important;
    font-family: Arial, Helvetica, sans-serif !important;
}

/* Keep the OJS page centered and stable */
.pkp_structure_page {
    max-width: 1200px !important;
    margin: 0 auto !important;
    background: #dedede !important;
}

/* =====================================================
   HEADER — FIX THE CYAN AREA + SMALL LOGO
===================================================== */

.pkp_structure_head {
    background: #ffffff !important;
    color: #111 !important;
    border: 0 !important;
    min-height: 0 !important;
}

.pkp_head_wrapper {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    background: #ffffff !important;
}

.pkp_site_name_wrapper {
    background: #ffffff !important;
    padding: 12px 0 !important;
    margin: 0 !important;
    min-height: 0 !important;
    height: auto !important;
}

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

/* Critical: remove OJS's small max-height constraint */
.pkp_site_name > a,
.pkp_site_name > a:link,
.pkp_site_name > a:visited {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0 !important;
}

.pkp_site_name > a > img,
.pkp_site_name img {
    display: block !important;
    width: 100% !important;
    max-width: 1200px !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    object-fit: contain !important;
    margin: 0 auto !important;
    padding: 0 !important;
}

/* Remove possible theme color behind the logo */
.pkp_site_name_wrapper,
.pkp_head_wrapper,
.pkp_structure_head {
    box-shadow: none !important;
}

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

.pkp_navigation_primary_wrapper {
    background: #ffffff !important;
    border-top: 1px solid #dddddd !important;
    border-bottom: 4px solid #111111 !important;
    box-shadow: none !important;
}

.pkp_navigation_primary_row {
    background: #ffffff !important;
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 0 !important;
}

.pkp_navigation_primary {
    margin: 0 !important;
    padding: 0 !important;
}

.pkp_navigation_primary > li > a {
    color: #111111 !important;
    background: transparent !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    padding: 15px 17px !important;
}

.pkp_navigation_primary > li > a:hover,
.pkp_navigation_primary > li > a:focus {
    color: #075e5a !important;
    background: #f4f4f4 !important;
}

.pkp_navigation_primary > li > ul {
    background: #ffffff !important;
    border: 1px solid #cccccc !important;
    box-shadow: 0 4px 12px rgba(0,0,0,.12) !important;
}

.pkp_navigation_primary > li > ul a {
    background: #ffffff !important;
    color: #222222 !important;
}

.pkp_navigation_primary > li > ul a:hover {
    background: #075e5a !important;
    color: #ffffff !important;
}

/* Search */
.pkp_search {
    background: #ffffff !important;
}

.pkp_search button {
    color: #111111 !important;
}

/* =====================================================
   CONTENT AREA
===================================================== */

.pkp_structure_content {
    background: #dedede !important;
    padding: 0 !important;
}

.pkp_structure_main {
    background: #ffffff !important;
    padding: 28px 30px 40px !important;
    box-sizing: border-box !important;
}

/* =====================================================
   HOMEPAGE
===================================================== */

/* Keep the large poster hidden — header is the identity */
.pkp_page_index .homepage_image {
    display: none !important;
}

.pkp_page_index .about {
    background: #ffffff !important;
    margin: 0 0 30px !important;
}

.pkp_page_index .about h2,
.pkp_page_index .about h3 {
    color: #173f5f !important;
    font-family: Arial, Helvetica, sans-serif !important;
}

.pkp_page_index .about p {
    color: #333333 !important;
    font-size: 15px !important;
    line-height: 1.75 !important;
}

/* Announcements */
.pkp_page_index .announcements {
    background: #ffffff !important;
    margin: 25px 0 30px !important;
    padding-top: 18px !important;
    border-top: 3px solid #0b5f78 !important;
}

/* Current Issue */
.pkp_page_index .current_issue {
    background: #ffffff !important;
    margin-top: 25px !important;
    padding-top: 18px !important;
    border-top: 3px solid #0b5f78 !important;
}

.pkp_page_index .current_issue h2 {
    color: #173f5f !important;
    font-size: 25px !important;
}

/* Current issue cover */
.pkp_page_index .current_issue .obj_issue_summary {
    background: #ffffff !important;
    display: flex !important;
    align-items: flex-start !important;
    gap: 24px !important;
    padding: 20px 0 !important;
    border: 0 !important;
}

.pkp_page_index .current_issue .obj_issue_summary .cover {
    flex: 0 0 220px !important;
    width: 220px !important;
    max-width: 220px !important;
}

.pkp_page_index .current_issue .obj_issue_summary .cover img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
}

.pkp_page_index .current_issue .obj_issue_summary .description {
    flex: 1 1 auto !important;
    font-size: 14px !important;
    line-height: 1.65 !important;
}

/* =====================================================
   SIDEBAR — REMOVE THE HUGE EMPTY SPACE
===================================================== */

.pkp_structure_sidebar {
    background: transparent !important;
    padding: 28px 0 30px 18px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    vertical-align: top !important;
}

/* Important: blocks should follow one another */
.pkp_structure_sidebar .pkp_block {
    display: block !important;
    width: 100% !important;
    background: #ffffff !important;
    border: 1px solid #c8c8c8 !important;
    margin: 0 0 14px !important;
    padding: 0 !important;
    vertical-align: top !important;
}

/* Blue TAJOR-style headings */
.pkp_structure_sidebar .pkp_block .title {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
    background: #0879a9 !important;
    color: #ffffff !important;
    border: 0 !important;
    border-radius: 0 !important;
    margin: 0 !important;
    padding: 8px 10px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    text-transform: uppercase !important;
}

.pkp_structure_sidebar .pkp_block .content {
    display: block !important;
    background: #ffffff !important;
    padding: 8px !important;
    margin: 0 !important;
}

.pkp_structure_sidebar .pkp_block .content ul {
    margin: 0 !important;
    padding: 0 !important;
}

.pkp_structure_sidebar .pkp_block .content li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border-bottom: 1px solid #aaaaaa !important;
}

.pkp_structure_sidebar .pkp_block .content li:last-child {
    border-bottom: 0 !important;
}

.pkp_structure_sidebar .pkp_block .content li a {
    display: block !important;
    padding: 8px 4px !important;
    background: #ffffff !important;
    color: #006ca6 !important;
    font-size: 13px !important;
    line-height: 1.3 !important;
    text-decoration: none !important;
}

.pkp_structure_sidebar .pkp_block .content li a:hover {
    background: #f3f3f3 !important;
    color: #075e5a !important;
}

/* Sidebar images */
.pkp_structure_sidebar .pkp_block .content img {
    display: block !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 auto !important;
}

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

.pkp_structure_footer_wrapper {
    background: #0d3d5b !important;
    border-top: 4px solid #075e5a !important;
    margin: 0 !important;
}

.pkp_structure_footer {
    background: transparent !important;
    color: #ffffff !important;
    padding: 28px 30px !important;
}

.pkp_structure_footer a {
    color: #ffffff !important;
}

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

@media (max-width: 900px) {
    .pkp_structure_page,
    .pkp_head_wrapper,
    .pkp_navigation_primary_row {
        max-width: 100% !important;
    }

    .pkp_structure_sidebar {
        padding-left: 0 !important;
    }
}

@media (max-width: 700px) {
    .pkp_site_name_wrapper {
        padding: 8px !important;
    }

    .pkp_navigation_primary > li > a {
        font-size: 11px !important;
        padding: 10px 7px !important;
    }

    .pkp_structure_main {
        padding: 20px 15px 30px !important;
    }

    .pkp_page_index .current_issue .obj_issue_summary {
        display: block !important;
    }

    .pkp_page_index .current_issue .obj_issue_summary .cover {
        width: 100% !important;
        max-width: 260px !important;
        margin: 0 auto 20px !important;
    }
}


/* =========================================================
   STAGE 3 — TAJOR-STYLE HOMEPAGE LAYOUT
   Combined into the single Journal Style Sheet
========================================================= */

/*
=========================================================
KARANG — STAGE 3
HOMEPAGE LAYOUT — TAJOR STYLE
=========================================================
Tambahkan CSS ini SETELAH Stage 2B.
Tidak mengubah gambar header.
Fokus: susunan konten utama + sidebar.
=========================================================
*/

/* ---------- PAGE WIDTH ---------- */
.pkp_structure_page {
    max-width: 1200px !important;
    margin: 0 auto !important;
}

/* ---------- CONTENT BACKGROUND ---------- */
.pkp_structure_content {
    background: #dedede !important;
}

/* ---------- TWO-COLUMN LAYOUT ---------- */
.pkp_structure_main {
    width: 76% !important;
    max-width: none !important;
    box-sizing: border-box !important;
    background: #ffffff !important;
    padding: 30px 28px 45px !important;
    margin: 0 !important;
}

.pkp_structure_sidebar {
    width: 24% !important;
    box-sizing: border-box !important;
    background: #dedede !important;
    padding: 30px 14px 30px 18px !important;
    margin: 0 !important;
}

/* ---------- ABOUT THE JOURNAL ---------- */
.pkp_page_index .about {
    margin: 0 0 28px !important;
    padding: 0 !important;
    background: #ffffff !important;
}

.pkp_page_index .about h2 {
    margin: 0 0 22px !important;
    padding: 0 !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 25px !important;
    font-weight: 700 !important;
    color: #222222 !important;
}

.pkp_page_index .about p {
    margin: 0 0 18px !important;
    font-size: 15px !important;
    line-height: 1.72 !important;
    color: #333333 !important;
}

/* ---------- SIDEBAR BOXES ---------- */
.pkp_structure_sidebar .pkp_block {
    width: 100% !important;
    margin: 0 0 12px !important;
    padding: 0 !important;
    background: #ffffff !important;
    border: 1px solid #c9c9c9 !important;
    box-shadow: none !important;
}

.pkp_structure_sidebar .pkp_block .title {
    display: block !important;
    margin: 0 !important;
    padding: 8px 9px !important;
    background: #147fa8 !important;
    color: #ffffff !important;
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    text-transform: uppercase !important;
}

.pkp_structure_sidebar .pkp_block .content {
    margin: 0 !important;
    padding: 7px !important;
    background: #ffffff !important;
}

/* ---------- SIDEBAR LINKS ---------- */
.pkp_structure_sidebar .pkp_block .content li {
    border-bottom: 1px solid #bdbdbd !important;
}

.pkp_structure_sidebar .pkp_block .content li:last-child {
    border-bottom: 0 !important;
}

.pkp_structure_sidebar .pkp_block .content li a {
    display: block !important;
    padding: 7px 4px !important;
    color: #006ea6 !important;
    font-size: 12px !important;
    line-height: 1.3 !important;
    text-decoration: none !important;
}

.pkp_structure_sidebar .pkp_block .content li a:hover {
    background: #f2f2f2 !important;
}

/* ---------- SIDEBAR IMAGES ---------- */
.pkp_structure_sidebar .pkp_block img {
    max-width: 100% !important;
    width: auto !important;
    height: auto !important;
    display: block !important;
    margin: 0 auto !important;
}

/* ---------- CURRENT ISSUE ---------- */
.pkp_page_index .current_issue {
    margin: 30px 0 0 !important;
    padding: 22px 0 0 !important;
    border-top: 3px solid #147fa8 !important;
}

.pkp_page_index .current_issue h2 {
    margin: 0 0 15px !important;
    font-family: Georgia, "Times New Roman", serif !important;
    color: #222222 !important;
}

/* ---------- FOOTER ---------- */
.pkp_structure_footer_wrapper {
    background: #0d3d5b !important;
    border-top: 4px solid #147fa8 !important;
}

.pkp_structure_footer {
    padding: 28px 30px !important;
    background: transparent !important;
    color: #ffffff !important;
}

/* ---------- MOBILE ---------- */
@media (max-width: 900px) {
    .pkp_structure_main,
    .pkp_structure_sidebar {
        width: 100% !important;
    }

    .pkp_structure_sidebar {
        padding: 20px !important;
    }
}

/* =========================================================
   KARANG — STAGE 4
   TYPOGRAPHY + SPACING REFINEMENT
   Tujuan: membuat isi homepage lebih ringan dan mendekati TAJOR
========================================================= */

/* ---------- BODY / CONTENT TYPOGRAPHY ---------- */
.pkp_page_index,
.pkp_page_index .about,
.pkp_page_index .about p,
.pkp_page_index .about li,
.pkp_page_index .current_issue,
.pkp_page_index .current_issue p,
.pkp_page_index .current_issue li {
    font-family: Arial, Helvetica, sans-serif !important;
    font-weight: 400 !important;
    color: #333333 !important;
}

/* Heading tetap tegas */
.pkp_page_index .about h2,
.pkp_page_index .current_issue h2,
.pkp_page_index .current_issue .title {
    font-family: Georgia, "Times New Roman", serif !important;
    font-weight: 700 !important;
    color: #222222 !important;
}

/* ---------- ABOUT TEXT ---------- */
.pkp_page_index .about strong,
.pkp_page_index .about b {
    font-weight: 700 !important;
}

.pkp_page_index .about p {
    font-size: 15px !important;
    line-height: 1.65 !important;
    margin-bottom: 16px !important;
}

.pkp_page_index .about ul,
.pkp_page_index .about ol {
    margin-top: 8px !important;
    margin-bottom: 18px !important;
}

.pkp_page_index .about li {
    margin-bottom: 8px !important;
    line-height: 1.55 !important;
}

/* ---------- SIDEBAR: COMPACT LIKE TAJOR ---------- */
.pkp_structure_sidebar .pkp_block {
    margin-bottom: 10px !important;
}

.pkp_structure_sidebar .pkp_block .title {
    min-height: 0 !important;
    padding: 8px 10px !important;
}

.pkp_structure_sidebar .pkp_block .content {
    padding: 6px 8px !important;
}

/* ---------- REMOVE UNNECESSARY INTERNAL SPACING ---------- */
.pkp_structure_main .pkp_block,
.pkp_structure_main .pkp_block:last-child {
    margin-bottom: 20px !important;
}

.pkp_page_index .current_issue {
    margin-top: 25px !important;
    padding-top: 20px !important;
}

/* ---------- FOOTER TEXT NORMAL WEIGHT ---------- */
.pkp_structure_footer,
.pkp_structure_footer * {
    font-family: Arial, Helvetica, sans-serif !important;
    font-weight: 400 !important;
}

.pkp_structure_footer strong,
.pkp_structure_footer b {
    font-weight: 700 !important;
}

/* ---------- FOOTER COMPACT ---------- */
.pkp_structure_footer {
    padding-top: 24px !important;
    padding-bottom: 24px !important;
}

/* ---------- KEEP HEADER EXACTLY AS CURRENT ---------- */
/* Tidak mengubah ukuran/isi gambar header KARANG. */

/* ---------- MOBILE ---------- */
@media (max-width: 700px) {
    .pkp_structure_main {
        padding: 22px 18px 35px !important;
    }

    .pkp_structure_sidebar {
        padding: 18px !important;
    }

    .pkp_page_index .about p {
        font-size: 14px !important;
        line-height: 1.6 !important;
    }
}