/*
 * Nusa Cendekia Research — OJS Homepage v3
 * Clean academic publisher style
 * Scope: Site index / homepage only
 */

:root {
    --nc-navy: #082f5f;
    --nc-blue: #0d5f96;
    --nc-gold: #e3a11f;
    --nc-text: #26384a;
    --nc-muted: #627487;
    --nc-line: #dce5ee;
    --nc-bg: #f6f8fb;
    --nc-white: #ffffff;
}

/* =========================================================
   HOMEPAGE SCOPE + RESET OF OJS STRUCTURAL LINES
   ========================================================= */
body:has(.page_index_site) {
    margin: 0;
    color: var(--nc-text);
    background: var(--nc-bg);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    line-height: 1.65;
}

/* Remove the default vertical structural separators seen on desktop */
body:has(.page_index_site) .pkp_structure_content,
body:has(.page_index_site) .pkp_structure_main,
body:has(.page_index_site) .pkp_structure_sidebar,
body:has(.page_index_site) .pkp_head_wrapper,
body:has(.page_index_site) .pkp_structure_footer,
body:has(.page_index_site) .pkp_structure_footer_wrapper,
body:has(.page_index_site) .page_index_site,
body:has(.page_index_site) .pkp_site_name_wrapper,
body:has(.page_index_site) .pkp_navigation_primary_row {
    border-left: 0 !important;
    border-right: 0 !important;
    box-shadow: none;
}

body:has(.page_index_site) .pkp_structure_content::before,
body:has(.page_index_site) .pkp_structure_content::after,
body:has(.page_index_site) .pkp_structure_main::before,
body:has(.page_index_site) .pkp_structure_main::after,
body:has(.page_index_site) .pkp_head_wrapper::before,
body:has(.page_index_site) .pkp_head_wrapper::after,
body:has(.page_index_site) .pkp_site_name_wrapper::before,
body:has(.page_index_site) .pkp_site_name_wrapper::after,
body:has(.page_index_site) .pkp_navigation_primary_row::before,
body:has(.page_index_site) .pkp_navigation_primary_row::after,
body:has(.page_index_site) .pkp_structure_footer_wrapper::before,
body:has(.page_index_site) .pkp_structure_footer_wrapper::after {
    content: none !important;
    display: none !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

body:has(.page_index_site) a {
    color: var(--nc-blue);
    transition: color .18s ease, background-color .18s ease, border-color .18s ease;
}

/* =========================================================
   HEADER
   ========================================================= */
body:has(.page_index_site) .pkp_structure_head {
    background: var(--nc-white);
    border: 0 !important;
    box-shadow: 0 1px 0 rgba(8, 47, 95, .08);
}

body:has(.page_index_site) .pkp_head_wrapper {
    max-width: 1180px;
    margin: 0 auto;
    padding: 14px 24px 0;
}

body:has(.page_index_site) .pkp_site_name_wrapper {
    min-height: 92px;
    display: flex;
    align-items: center;
}

/* Logo safety */
body:has(.page_index_site) .pkp_site_name,
body:has(.page_index_site) .pkp_site_name .is_img {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

body:has(.page_index_site) .pkp_site_name {
    padding: 0;
}

body:has(.page_index_site) .pkp_site_name .is_img img {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: auto !important;
    height: 72px !important;
    max-height: 72px !important;
    max-width: min(360px, 76vw) !important;
    object-fit: contain !important;
}

body:has(.page_index_site) .pkp_site_name .is_text {
    color: var(--nc-navy);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 2rem;
    font-weight: 700;
    text-decoration: none;
}

body:has(.page_index_site) .pkp_navigation_user {
    font-size: .9rem;
}

body:has(.page_index_site) .pkp_navigation_user > li > a {
    color: var(--nc-navy);
    font-weight: 600;
}

body:has(.page_index_site) .pkp_navigation_user > li > a:hover,
body:has(.page_index_site) .pkp_navigation_user > li > a:focus {
    color: var(--nc-blue);
}

/* Clean publisher divider instead of a heavy gradient navbar */
body:has(.page_index_site) .pkp_navigation_primary_row {
    background: transparent;
    border-top: 0 !important;
    border-bottom: 3px solid var(--nc-gold) !important;
    border-radius: 0;
    padding: 0;
    min-height: 3px;
}

body:has(.page_index_site) .pkp_navigation_primary > li > a {
    color: var(--nc-navy);
    font-weight: 600;
    padding-top: 12px;
    padding-bottom: 12px;
    border-bottom: 0;
}

body:has(.page_index_site) .pkp_navigation_primary > li > a:hover,
body:has(.page_index_site) .pkp_navigation_primary > li > a:focus {
    color: var(--nc-blue);
}

/* =========================================================
   PAGE LAYOUT
   ========================================================= */
body:has(.page_index_site) .pkp_structure_content {
    width: 100%;
    max-width: 1180px;
    margin: 0 auto;
    padding: 54px 24px 72px;
    background: transparent;
    background-image: none !important;
    border: 0 !important;
    outline: 0 !important;
}

body:has(.page_index_site) .pkp_structure_main {
    float: none !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}

body:has(.page_index_site) .pkp_structure_sidebar {
    display: none;
}

body:has(.page_index_site) .page_index_site {
    max-width: none;
    margin: 0;
    padding: 0;
    border: 0 !important;
}

/* =========================================================
   INTRO / ABOUT
   More editorial, less “AI landing page”
   ========================================================= */
.page_index_site .about_site {
    position: relative;
    margin: 0 0 46px;
    padding: 30px 34px;
    color: var(--nc-text);
    background: var(--nc-white);
    border: 1px solid var(--nc-line);
    border-left: 5px solid var(--nc-navy);
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(8, 47, 95, .055);
    font-size: 1rem;
    line-height: 1.8;
}

.page_index_site .about_site::before,
.page_index_site .about_site::after {
    content: none !important;
}

.page_index_site .about_site p {
    max-width: 980px;
    margin: 0 0 13px;
}

.page_index_site .about_site p:last-child {
    margin-bottom: 0;
}

.page_index_site .about_site strong {
    color: var(--nc-navy);
}

.page_index_site .about_site a {
    color: var(--nc-blue);
}

/* =========================================================
   SECTION HEADINGS
   ========================================================= */
.page_index_site .journals {
    margin-top: 0;
}

.page_index_site .journals > h2,
.page_index_site .cmp_announcements > h2 {
    position: static;
    margin: 0 0 22px;
    padding: 0 0 10px;
    color: var(--nc-navy);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 1.25;
    border-bottom: 1px solid var(--nc-line);
}

.page_index_site .journals > h2::after,
.page_index_site .cmp_announcements > h2::after {
    content: none !important;
}

/* OJS hides this heading in the default site index; expose it cleanly */
.page_index_site .journals > h2 {
    position: static !important;
    width: auto !important;
    height: auto !important;
    margin: 0 0 24px !important;
    padding: 0 0 10px !important;
    overflow: visible !important;
    clip: auto !important;
    clip-path: none !important;
    white-space: normal !important;
}

/* =========================================================
   JOURNAL GRID
   ========================================================= */
.page_index_site .journals > ul {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.page_index_site .journals > ul > li {
    display: flex;
    flex-direction: column;
    min-width: 0;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden;
    background: var(--nc-white);
    border: 1px solid var(--nc-line) !important;
    border-top: 3px solid var(--nc-gold) !important;
    border-radius: 10px;
    box-shadow: 0 5px 18px rgba(8, 47, 95, .045);
    transition: border-color .18s ease, box-shadow .18s ease;
}

.page_index_site .journals > ul > li:hover {
    border-color: #c9d6e3 !important;
    border-top-color: var(--nc-gold) !important;
    box-shadow: 0 8px 22px rgba(8, 47, 95, .075);
}

/* Cover / thumbnail */
.page_index_site .journals .thumb {
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 26px 22px 22px !important;
    background: #fafbfd;
    border-bottom: 1px solid #edf1f5;
    text-align: center;
}

/* Give journal covers enough visual presence without letting one oversized
   image break the three-column grid. */
.page_index_site .journals .thumb a {
    display: flex;
    min-height: 280px;
    align-items: center;
    justify-content: center;
}

.page_index_site .journals .thumb img {
    display: block;
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: 260px !important;
    margin: 0 auto;
    object-fit: contain;
}

.page_index_site .journals .thumb + .body,
.page_index_site .journals .body {
    float: none !important;
    width: 100% !important;
}

.page_index_site .journals .body {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 23px 23px 22px;
}

.page_index_site .journals h3 {
    margin: 0 0 12px;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.24rem;
    font-weight: 700;
    line-height: 1.35;
}

.page_index_site .journals h3 a {
    color: var(--nc-navy);
    text-decoration: none;
}

.page_index_site .journals h3 a:hover,
.page_index_site .journals h3 a:focus {
    color: var(--nc-blue);
}

.page_index_site .journals .description {
    flex: 1 1 auto;
    min-height: 0;
    margin: 0 0 20px;
    color: var(--nc-muted);
    font-size: .94rem;
    line-height: 1.7;
    overflow: hidden;
}

/* The OJS site index can render multiple paragraphs inside .description.
   Line-clamp on the parent is unreliable with block children and caused
   PEACE text to bleed behind the action buttons. On the publisher portal
   we intentionally show only the lead paragraph as the journal summary. */
.page_index_site .journals .description p {
    margin: 0;
}

.page_index_site .journals .description p:not(:first-child) {
    display: none !important;
}

.page_index_site .journals .description p:first-child {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 6;
    overflow: hidden;
}

/* =========================================================
   JOURNAL LINKS
   ========================================================= */
.page_index_site .journals .links {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin: auto 0 0;
    padding: 0;
    list-style: none;
}

.page_index_site .journals .links li {
    margin: 0;
    padding: 0;
}

.page_index_site .journals .links a {
    display: inline-flex;
    min-height: 38px;
    align-items: center;
    justify-content: center;
    padding: 8px 14px;
    border-radius: 6px;
    font-size: .86rem;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
}

.page_index_site .journals .links .view a {
    color: #fff;
    background: var(--nc-navy);
    border: 1px solid var(--nc-navy);
}

.page_index_site .journals .links .view a:hover,
.page_index_site .journals .links .view a:focus {
    color: #fff;
    background: var(--nc-blue);
    border-color: var(--nc-blue);
}

.page_index_site .journals .links .current a {
    color: var(--nc-navy);
    background: #fff;
    border: 1px solid #d8b66c;
}

.page_index_site .journals .links .current a:hover,
.page_index_site .journals .links .current a:focus {
    background: #fff9ec;
    border-color: var(--nc-gold);
}

/* =========================================================
   FOOTER
   ========================================================= */
body:has(.page_index_site) .pkp_structure_footer_wrapper {
    background: var(--nc-navy);
    border-top: 3px solid var(--nc-gold) !important;
}

body:has(.page_index_site) .pkp_structure_footer {
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 24px;
    color: rgba(255, 255, 255, .82);
    border: 0 !important;
}

body:has(.page_index_site) .pkp_footer_content {
    padding: 34px 0 26px;
    text-align: left;
}

body:has(.page_index_site) .pkp_structure_footer a {
    color: #fff;
}

body:has(.page_index_site) .pkp_structure_footer a:hover,
body:has(.page_index_site) .pkp_structure_footer a:focus {
    color: #f2c868;
}

body:has(.page_index_site) .pkp_brand_footer {
    padding: 0 0 28px;
    margin: 0;
    opacity: .78;
}

body:has(.page_index_site) .pkp_brand_footer a {
    max-width: 135px;
}

/* Make the default dark OJS/PKP brand mark readable on navy */
body:has(.page_index_site) .pkp_brand_footer img {
    filter: grayscale(1) brightness(0) invert(1);
    opacity: .82;
}

/* =========================================================
   ACCESSIBILITY
   ========================================================= */
body:has(.page_index_site) a:focus-visible,
body:has(.page_index_site) button:focus-visible {
    outline: 3px solid var(--nc-gold);
    outline-offset: 3px;
}

/* =========================================================
   TABLET
   ========================================================= */
@media (max-width: 980px) {
    .page_index_site .journals > ul {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body:has(.page_index_site) .pkp_structure_content {
        padding: 40px 20px 58px;
    }
}

/* =========================================================
   MOBILE
   ========================================================= */
@media (max-width: 720px) {
    body:has(.page_index_site) .pkp_head_wrapper {
        padding: 10px 16px 0;
    }

    body:has(.page_index_site) .pkp_site_name_wrapper {
        min-height: 76px;
    }

    body:has(.page_index_site) .pkp_site_name .is_img img {
        height: 58px !important;
        max-height: 58px !important;
        max-width: 78vw !important;
    }

    body:has(.page_index_site) .pkp_structure_content {
        padding: 28px 15px 46px;
    }

    .page_index_site .about_site {
        margin-bottom: 34px;
        padding: 24px 22px;
        border-radius: 6px;
        font-size: .96rem;
    }

    .page_index_site .journals > ul {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .page_index_site .journals .body {
        padding: 21px;
    }

    .page_index_site .journals .thumb a {
        min-height: 260px;
    }

    .page_index_site .journals .thumb img {
        max-height: 240px !important;
    }

    .page_index_site .journals .description p:first-child {
        -webkit-line-clamp: 7;
    }
}

@media (prefers-reduced-motion: reduce) {
    body:has(.page_index_site) *,
    body:has(.page_index_site) *::before,
    body:has(.page_index_site) *::after {
        transition: none !important;
        scroll-behavior: auto !important;
    }
}