/* ==========================================================================
   RE DESIGN BY ANGKY KURNIAWAN - UPDATED 2026
   ========================================================================== */

/* HIDE BRANDING LOGO OJS / PKP VIA CSS */
.pkp_structure_footer .brand, 
footer .brand,
#pkp_footer_brand,
.pkp_brand_footer,
footer img[src*="ojs_brand"],
footer a[href*="pkp.sfu.ca"] {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    height: 0 !important;
    width: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Container Utama Logo / Header */
.site_logo {
    max-width: 100%;
    width: 100%;
    text-align: center;
}

/* Ukuran Logo / Header */
.site_logo img {
    width: 100%;
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
}

/* Hide About Us di Bawah Judul */
.about_journal {
    display: none;
}

/* Teks Utama Judul Media/Pengumuman */
.media-heading a {
    color: #ff6600 !important; 
    font-weight: bolder;
}

/* ==========================================================================
   PERBAIKAN STRUKTUR SEPADAN DENGAN INSPECT ELEMENT (ORDER FLEXBOX)
   ========================================================================== */
.page_index_journal {
    display: flex !important;
    flex-direction: column !important;
}

.page_index_journal .homepage_about {
    order: 1 !important;
}

.page_index_journal .additional_content {
    order: 2 !important;
    margin-top: 30px !important;    
    margin-bottom: 30px !important; 
}

.page_index_journal .current_issue {
    order: 3 !important;
}

/* ARTICLE LAYOUT & TYPOGRAPHY */
.article-summary.media {
    display: flex;
    gap: 16px;
    padding: 16px 0;
    border-bottom: 1px solid #ddd;
    align-items: flex-start;
}

.article-summary.media::before {
    content: "";
    display: block;
    width: 115px;
    height: 200px;
    background-image: url('https://jurnal.pcr.ac.id/publik/site/images/figoalimbel/jakb-thumbnail.jpg'); 
    background-size: cover;
    background-position: center;
    border: 1px solid #ccc;
    flex-shrink: 0;
}

.media-body.article_summary {
    flex: 1;
}

.media-heading .article_name,
.article_name,
.article_name a,
.obj_article_summary .title a,
.obj_article_summary .title,
.article-summary .title a,
.article-summary .media-heading a,
a.article_name {
    font-size: 15px;
    font-weight: bold;
    color: #ff6600 !important; 
    text-decoration: none;
    line-height: 1.4;
    display: inline-block;
    margin-bottom: 6px;
}

.meta.row {
    font-size: 13px;
    color: #444;
    margin-top: 4px;
}
.meta.row .col-md-12 {
    margin-bottom: 4px;
}

.row .col-md-4,
.row .col-md-8 {
    font-size: 13px;
    color: #555;
    display: flex;
    align-items: center;
    gap: 8px;
}

.stat_counter {
    text-align: right;
    font-size: 13px;
    color: #777;
    display: flex;
    align-items: center;
    gap: 6px;
    justify-content: flex-end;
    margin-top: 6px;
}

.doi_link,
.doi_link a,
.obj_article_summary .meta .doi a,
.meta .doi a,
a[href*="doi.org"],
a, 
a:hover, 
a:focus {
    color: #ff6600;
}

a[href*="issue/archive"],
.view_all_issues,
.read_more,
a.btn-primary.view-all,
.current_issue_archive a {
    color: #ff6600 !important;
    font-weight: bold !important;
}

body, p, span, div, li, input, button, select, textarea, .pkp_structure_main {
    color: #333333;
}

a.obj_galley_link.pdf,
.gallery_item_link {
    display: inline-block;
    padding: 4px 10px;
    font-size: 13px;
    background-color: #f5f5f5;
    border-radius: 6px;
    border: 1px solid #ccc;
    text-decoration: none;
    margin-top: 6px;
    color: #ff6600 !important;
}

@media (max-width: 576px) {
    .article-summary.media {
        flex-direction: column;
        align-items: flex-start;
    }
    .article-summary.media::before {
        margin-bottom: 12px;
    }
    .stat_counter {
        justify-content: flex-start;
    }
}

/* ARCHIVES & PAGINATION */
.series {
    color: #ff6600 !important;
}

.obj_issue_summary .title,
.obj_article_summary .title,
.page_archive .title,
h1.title, h2.title, h3.title {
    color: #ff6600 !important;
    font-weight: bolder;
}

.pager li.previous a,
.pager li.next a {
    color: #ff6600 !important;
}

/* NAVIGATION BREADCRUMB */
.breadcrumb a {
    color: #ff6600 !important;
    font-weight: bolder;
}

/* CURRENT ISSUE */
.issue-details {
    display: none;
}

/* INDICATOR ACTIVE MENU */
.nav-pills > li.active,
.nav-pills > li.active > a,
.navbar-nav > li.active,
.navbar-nav > li.active > a,
.pkp_navigation_primary li.active,
.pkp_navigation_primary li.active > a,
.navbar-nav > .active,
.navbar-nav > .active > a {
    border-bottom: 3px solid #ffffff !important;
    border-color: #ffffff !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    background-color: transparent !important;
}

.nav-pills > li.active::after,
.nav-pills > li.active > a::after,
.navbar-nav > li.active::after,
.navbar-nav > li.active > a::after,
.pkp_navigation_primary li.active::after,
.navbar-nav > .active::after,
.navbar-nav > .active > a::after {
    background-color: #ffffff !important;
    border-color: #ffffff !important;
    color: #ffffff !important;
}

/* TOP MENUS WHITE */
.nav-pills li a,
.nav-pills li a[href*="register"],
.nav-pills li a[href*="login"],
.pkp_navigation_primary a,
.navbar-nav > li > a {
    color: #ffffff !important;
    font-weight: normal !important; 
}

.nav-pills > li.active > a,
.navbar-nav > li.active > a,
.pkp_navigation_primary li.active > a,
.navbar-nav > .active > a,
.pkp_navigation_primary a:focus,
.navbar-nav a:focus {
    font-weight: normal !important;
}

.pkp_navigation_user a,
.pkp_navigation_user a span,
.pkp_navigation_user .dropdown-toggle,
.pkp_navigation_user .fa-caret-down {
    color: #ffffff !important;
    font-weight: bold !important;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3) !important;
}

.pkp_navigation_user .badge {
    background-color: rgba(0, 0, 0, 0.4) !important;
    color: #ffffff !important;
    border: 1px solid #ffffff !important;
    font-weight: bold !important;
    padding: 3px 7px !important;
    border-radius: 10px !important;
}

/* SEARCH BUTTON & ICONS WHITE */
a.pkp_search.pkp_search_desktop,
a.pkp_search.pkp_search_desktop *,
.pkp_navigation_search_wrapper a,
.pkp_navigation_search_wrapper a *,
.navbar-nav > li > a.pkp_search_toggle,
.navbar-nav > li > a.pkp_search_toggle *,
#searchToggle,
#searchToggle *,
.glyphicon-search,
.fa-search,
.pkp_search_toggle,
.pkp_search_toggle span {
    color: #ffffff !important;
}

a.pkp_search.pkp_search_desktop svg,
a.pkp_search.pkp_search_desktop.is_open svg,
.pkp_search_close svg,
.pkp_search_wrapper svg,
svg.pkp_search_icon {
    stroke: #ffffff !important;
    fill: #ffffff !important;
    color: #ffffff !important;
}

/* DROPDOWN MENU SUBMISSIONS */
.dropdown-menu,
.pkp_navigation_primary .dropdown-menu,
.navbar-nav .dropdown-menu,
.dropdown-menu > li.active,
.dropdown-menu > li.active > a,
.dropdown-menu > li > a.active,
.pkp_navigation_primary .dropdown-menu li.active > a,
.dropdown-menu > li:first-child {
    border-left: none !important;
    border-left-width: 0 !important;
    box-shadow: 0 6px 12px rgba(0,0,0,.175) !important;
}

.dropdown-menu > li > a,
.dropdown-menu > li > a:focus,
.pkp_navigation_primary .dropdown-menu a,
.navbar-nav .dropdown-menu > li > a {
    color: #000000 !important;
    font-weight: normal !important;
    background-color: transparent !important;
    border-bottom: none !important;
}

.dropdown-menu > li > a:hover,
.pkp_navigation_primary .dropdown-menu a:hover,
.navbar-nav .dropdown-menu > li > a:hover {
    color: #ffffff !important;
    background-color: #ff6600 !important;
    font-weight: bold !important;
    border-left: none !important;
}

/* ANNOUNCEMENT */
.cmp_breadcrumbs li:first-child a {
    color: #ff6600 !important;
    text-decoration: none;
}
.cmp_breadcrumbs li:first-child a:hover {
    text-decoration: underline;
}
.cmp_breadcrumbs li:nth-child(2) a {
    color: #ff6600 !important;
    text-decoration: none;
}
.cmp_breadcrumbs li:nth-child(2) a:hover {
    text-decoration: underline;
}
.page-header h1 {
    color: #ff6600 !important;
}
.page-header .date,
.page-header .date .glyphicon-calendar {
    color: #ff6600 !important;
}

/* ==========================================================================
   FOOTER STYLING: KUNCI TOTAL 1 GARIS ORANYE PADA BAGIAN ATAS KOTAK ABUP2
   ========================================================================== */
/* Membersihkan total border-top bawaan wrapper agar tidak menumpuk ganda */
.pkp_structure_footer_wrapper,
footer,
div[class*="footer-wrapper"] {
    border: none !important;
    box-shadow: none !important;
}

/* Memberikan warna oranye pada bagian paling atas kotak abu-abu gelap */
.pkp_structure_footer {
    width: 100% !important;
    max-width: 100vw !important;
    background-color: #262626 !important; 
    color: #ffffff !important;
    text-align: center !important;
    padding: 25px 0 !important; 
    margin-left: calc(-50vw + 50%) !important; 
    margin-right: calc(-50vw + 50%) !important;
    box-sizing: border-box !important;
    
    /* 1 GARIS PEMBATAS ORANYE DI SINI */
    border: none !important;
    border-top: 4px solid #ff6600 !important; 
}

.pkp_structure_footer .container,
.pkp_structure_footer .container-fluid {
    width: 100% !important;
    max-width: 1200px !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
    margin: 0 auto !important;
    border: none !important; 
}

.pkp_structure_footer p, 
.pkp_structure_footer div, 
.pkp_structure_footer span,
.pkp_footer_content {
    color: #ffffff !important;
    text-align: center !important;
    line-height: 1.6 !important; 
    font-size: 14px;
    margin-top: 4px !important;
    margin-bottom: 4px !important;
}

.pkp_structure_footer a {
    color: #ff6600 !important;
    text-decoration: none !important;
    font-weight: bold !important;
}

.pkp_structure_footer a:hover {
    text-decoration: underline !important;
}

.pkp_structure_footer img {
    display: block !important;
    margin: 8px auto !important; 
    max-width: 100% !important;
    height: auto !important;
}