/* ========================================================================
   BIOEDU MODERN THEME
   Version : 3.0
   Part    : 1 Foundation
   Target  : OJS 3.3 Default Manuscript
   ======================================================================== */

/* ========================================================================
   ROOT VARIABLES
   ======================================================================== */

:root{

    --bio-primary:#0f4c81;
    --bio-primary-dark:#08365d;
    --bio-secondary:#2a7f62;
    --bio-accent:#f59e0b;

    --bio-text:#2f3a45;
    --bio-text-light:#6b7280;

    --bio-bg:#f5f7fa;
    --bio-surface:#ffffff;

    --bio-border:#e5e7eb;

    --bio-radius:10px;
    --bio-radius-lg:16px;

    --bio-shadow-sm:
        0 2px 6px rgba(0,0,0,.05);

    --bio-shadow:
        0 8px 24px rgba(0,0,0,.08);

    --bio-shadow-lg:
        0 18px 40px rgba(0,0,0,.12);

    --bio-transition:
        .25s ease;

}

/* ========================================================================
   RESET
   ======================================================================== */

*,
*:before,
*:after{

    box-sizing:border-box;

}

html{

    scroll-behavior:smooth;

}

body{

    margin:0;

    font-family:
        "Segoe UI",
        Roboto,
        Helvetica,
        Arial,
        sans-serif;

    color:var(--bio-text);

    background:var(--bio-bg);

    line-height:1.7;

    font-size:16px;

}

/* ========================================================================
   LINKS
   ======================================================================== */

a{

    color:var(--bio-primary);

    transition:
        color var(--bio-transition);

}

a:hover{

    color:var(--bio-primary-dark);

    text-decoration:none;

}

/* ========================================================================
   IMAGES
   ======================================================================== */

img{

    max-width:100%;

    height:auto;

    display:block;

}

/* Memperkecil Homepage Image */
.pkp_page_index .homepage_image img {
    width: auto !important;
    max-width: 350px !important;
    height: auto !important;
    display: block;
    margin: 20px auto;
}

/* ========================================================================
   BOOTSTRAP SAFE
   ======================================================================== */

/*
   Jangan pernah mengubah layout Bootstrap bawaan OJS.
*/

.row{

    margin-left:-15px;

    margin-right:-15px;

}

.col,
[class*="col-"]{

    position:relative;

}

/* ========================================================================
   PKP STRUCTURE
   ======================================================================== */

.pkp_structure_page{

    background:var(--bio-bg);

}

.pkp_structure_content{

    padding-top:30px;

    padding-bottom:50px;

    background:transparent;

}

.pkp_structure_main{

    background:transparent;

}

.pkp_structure_sidebar{

    background:transparent;

}

/* ========================================================================
   CONTAINER
   ======================================================================== */

.pkp_page_index .cmp_announcements,
.pkp_page_index .current_issue,
.pkp_page_index .additional_content,

.obj_issue_toc,

.obj_article_details,

.obj_issue_summary{

    max-width:1280px;

    margin-left:auto;

    margin-right:auto;

}

/* ========================================================================
   CARD STYLE
   ======================================================================== */

.pkp_block,

.obj_issue_summary,

.obj_article_summary{

    background:var(--bio-surface);

    border:1px solid var(--bio-border);

    border-radius:var(--bio-radius);

    box-shadow:var(--bio-shadow-sm);

}

/* ========================================================================
   ARTICLE VIEW
   ======================================================================== */

/*
    PENTING !

    Jangan menggunakan :

        display:flex;

    pada

        .obj_article_details

    Jangan menggunakan

        display:grid;

    pada

        .obj_article_details

    Jangan memberi

        width:100%

    pada

        .item

    Jangan memberi

        float:left/right

    pada metadata.

    Semua itu akan merusak layout
    Default Manuscript OJS.
*/

.obj_article_details{

    position:relative;

}

.obj_article_details::after{

    content:"";

    display:block;

    clear:both;

}

/* ========================================================================
   ARTICLE METADATA
   ======================================================================== */

.obj_article_details .entry_details{

    background:#fff;

    border:1px solid var(--bio-border);

    border-radius:var(--bio-radius);

    padding:20px;

    box-shadow:var(--bio-shadow-sm);

}

/*
    Tidak boleh memakai
    display:flex
    di metadata.
*/

.obj_article_details .entry_details{

    display:block;

}

/* ========================================================================
   ARTICLE CONTENT
   ======================================================================== */

.obj_article_details .main_entry{

    background:#fff;

    border:1px solid var(--bio-border);

    border-radius:var(--bio-radius);

    padding:35px;

    box-shadow:var(--bio-shadow-sm);

}

/* ========================================================================
   COVER IMAGE
   ======================================================================== */

.obj_article_details .cover img{

    border-radius:8px;

    box-shadow:var(--bio-shadow);

}

/* ========================================================================
   BUTTON PDF
   ======================================================================== */

.obj_article_details .galleys_links a{

    display:block;

    padding:12px 18px;

    border-radius:8px;

    background:var(--bio-primary);

    color:#fff;

    font-weight:600;

    text-align:center;

    transition:all .25s ease;

}

.obj_article_details .galleys_links a:hover{

    background:var(--bio-primary-dark);

}


   /* ========================================================================
   BIOEDU MODERN THEME
   Version : 3.0
   Part    : 2
   Header - Navigation - Homepage - Issue
   ======================================================================== */


/* ========================================================================
   HEADER
   ======================================================================== */

.pkp_structure_head{

    background:#ffffff;

    border-bottom:1px solid var(--bio-border);

    box-shadow:0 2px 10px rgba(0,0,0,.04);

}

.pkp_site_name{

    padding:22px 0;

}

.pkp_site_name a{

    color:var(--bio-primary);

    font-weight:700;

    font-size:2rem;

    letter-spacing:.4px;

    text-decoration:none;

}

.pkp_site_name a:hover{

    color:var(--bio-primary-dark);

}

/* ========================================================================
   MAIN NAVIGATION
   ======================================================================== */

.pkp_navigation_primary_wrapper{

    background:#fff;

}

.pkp_navigation_primary{

    display:flex;

    justify-content:center;

    align-items:center;

}

.pkp_navigation_primary > li{

    margin:0 4px;

}

.pkp_navigation_primary > li > a{

    padding:16px 18px;

    font-size:.95rem;

    font-weight:600;

    color:#374151;

    border-radius:8px;

    transition:all .25s ease;

}

.pkp_navigation_primary > li > a:hover{

    background:#eef5fb;

    color:var(--bio-primary);

}

.pkp_navigation_primary > .current > a{

    background:var(--bio-primary);

    color:#fff;

}

/* ========================================================================
   DROPDOWN
   ======================================================================== */

.pkp_navigation_primary ul{

    border-radius:10px;

    border:1px solid var(--bio-border);

    box-shadow:var(--bio-shadow);

    overflow:hidden;

}

.pkp_navigation_primary ul a{

    padding:12px 18px;

    font-size:.92rem;

}

/* ========================================================================
   SEARCH ICON
   ======================================================================== */

.pkp_navigation_search_wrapper a{

    color:var(--bio-primary);

}

.pkp_navigation_search_wrapper a:hover{

    color:var(--bio-primary-dark);

}

/* ========================================================================
   HOME HERO
   ======================================================================== */

.page_index_journal{

    background:transparent;

}

.page_index_journal .homepage_about{

    background:#fff;

    border-radius:14px;

    padding:35px;

    border:1px solid var(--bio-border);

    box-shadow:var(--bio-shadow-sm);

    margin-bottom:35px;

}

/* ========================================================================
   ANNOUNCEMENT
   ======================================================================== */

.cmp_announcements{

    background:#fff;

    border-radius:12px;

    padding:25px;

    border:1px solid var(--bio-border);

    margin-bottom:30px;

}

/* ========================================================================
   CURRENT ISSUE
   ======================================================================== */

.current_issue{

    background:#fff;

    border-radius:14px;

    border:1px solid var(--bio-border);

    box-shadow:var(--bio-shadow-sm);

    padding:35px;

    margin-bottom:40px;

}

.current_issue h2{

    font-size:1.8rem;

    color:var(--bio-primary);

    margin-bottom:20px;

}

/* ========================================================================
   ISSUE COVER
   ======================================================================== */

.current_issue .cover img{

    border-radius:12px;

    box-shadow:var(--bio-shadow);

    transition:.3s;

}

.current_issue .cover img:hover{

    transform:translateY(-4px);

}

/* ========================================================================
   ISSUE DESCRIPTION
   ======================================================================== */

.current_issue .description{

    color:#4b5563;

    line-height:1.8;

}

/* ========================================================================
   ARTICLE SUMMARY
   ======================================================================== */

.obj_article_summary{

    background:#fff;

    border:1px solid var(--bio-border);

    border-radius:12px;

    padding:24px;

    margin-bottom:24px;

    transition:.25s;

}

.obj_article_summary:hover{

    transform:translateY(-4px);

    box-shadow:var(--bio-shadow);

}

/* ========================================================================
   ARTICLE TITLE
   ======================================================================== */

.obj_article_summary .title a{

    font-size:1.25rem;

    line-height:1.5;

    color:var(--bio-primary);

    font-weight:700;

    text-decoration:none;

}

.obj_article_summary .title a:hover{

    color:var(--bio-primary-dark);

}

/* ========================================================================
   AUTHORS
   ======================================================================== */

.obj_article_summary .meta{

    color:#6b7280;

    font-size:.95rem;

}

/* ========================================================================
   DOI
   ======================================================================== */

.obj_article_summary .doi{

    margin-top:10px;

    font-size:.9rem;

    word-break:break-all;

}

/* ========================================================================
   ABSTRACT PREVIEW
   ======================================================================== */

.obj_article_summary .summary{

    margin-top:16px;

    color:#4b5563;

    line-height:1.8;

}

/* ========================================================================
   READ MORE
   ======================================================================== */

.obj_article_summary .read_more{

    margin-top:18px;

}

.obj_article_summary .read_more a{

    display:inline-block;

    padding:10px 18px;

    border-radius:8px;

    background:var(--bio-primary);

    color:#fff;

    font-weight:600;

    transition:.25s;

}

.obj_article_summary .read_more a:hover{

    background:var(--bio-primary-dark);

}

/* ========================================================================
   ISSUE ARCHIVE
   ======================================================================== */

.obj_issue_summary{

    transition:.25s;

}

.obj_issue_summary:hover{

    transform:translateY(-5px);

    box-shadow:var(--bio-shadow);

}

.obj_issue_summary .cover img{

    border-radius:10px;

    transition:.25s;

}

.obj_issue_summary .cover img:hover{

    transform:scale(1.02);

}

/* ========================================================================
   PAGINATION
   ======================================================================== */

.cmp_pagination{

    margin-top:40px;

    text-align:center;

}

.cmp_pagination .next,
.cmp_pagination .prev{

    display:inline-block;

    padding:10px 18px;

    border-radius:8px;

    background:#fff;

    border:1px solid var(--bio-border);

}

.cmp_pagination a:hover{

    background:var(--bio-primary);

    color:#fff;

}

/* ========================================================================
   FOOTER
   ======================================================================== */

.pkp_structure_footer_wrapper{

    background:#0f172a;

    color:#d1d5db;

    margin-top:70px;

}

.pkp_structure_footer{

    padding:50px 0;

}

.pkp_structure_footer a{

    color:#fff;

}

.pkp_structure_footer a:hover{

    color:#93c5fd;

}

/* ========================================================================
   COPYRIGHT
   ======================================================================== */

.pkp_brand_footer{

    opacity:.8;

}

/* ========================================================================
   END PART 2
   ======================================================================== */