/* ==========================================================================
   ISLAMIC DIGITAL RELIGION AND INTELLIGENT MEDIA (IDRIM)
   COMPLETE MAIN JOURNAL STYLE SHEET

   CATATAN:
   - CSS ini TIDAK mengatur sidebar custom.
   - Sidebar tetap menggunakan HTML/style sendiri.
   - Background baru: IDRIM Logo.png

   THEME:
   Olive / Forest Green / Sage / Gold / Ivory

   FONT:
   Heading : Merriweather
   Body    : Source Sans 3

   BACKGROUND:
   https://ejournalbarca.id/public/site/images/adminbarca/IDRIM%20Logo.png
   ========================================================================== */


/* ==========================================================================
   0. GOOGLE FONTS
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Merriweather:wght@400;700&family=Source+Sans+3:wght@400;500;600;700&display=swap');


/* ==========================================================================
   1. VARIABLES
   ========================================================================== */

:root {
    --idrim-olive-dark: #171d08;
    --idrim-olive: #28310e;

    --idrim-green-dark: #233825;
    --idrim-green: #35523a;

    --idrim-sage: #cfdabc;
    --idrim-sage-soft: #e8eddf;

    --idrim-gold: #c9a64d;
    --idrim-gold-light: #e9d17c;
    --idrim-gold-dark: #9b7c2e;

    --idrim-ivory: #f6f3e9;
    --idrim-paper: #fbfaf6;

    --idrim-text: #191b17;
    --idrim-white: #ffffff;
}


/* ==========================================================================
   2. GLOBAL RESET
   ========================================================================== */

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


/* ==========================================================================
   3. GLOBAL FONT
   ========================================================================== */

html,
body,
button,
input,
select,
textarea {
    font-family:
        "Source Sans 3",
        Arial,
        Helvetica,
        sans-serif !important;
}


/* Heading */

h1,
h2,
h3,
h4,
h5,
h6,
.page_title,
.obj_issue_toc .section > h2,
.obj_article_summary .title,
.obj_article_summary h3.title,
.obj_article_summary h4.title,
.homepage_about h2 {
    font-family:
        "Merriweather",
        Georgia,
        "Times New Roman",
        serif !important;
}


/* ==========================================================================
   4. WEBSITE BACKGROUND
   ========================================================================== */

html,
body {
    margin: 0;

    color: var(--idrim-text);

    background-color:
        #e9e7dc !important;

    background-image:
        linear-gradient(
            rgba(255, 255, 255, 0.03),
            rgba(255, 255, 255, 0.03)
        ),
        url("https://ejournalbarca.id/public/site/images/adminbarca/IDRIM%20Logo.png") !important;

    background-size:
        cover !important;

    background-position:
        center center !important;

    background-repeat:
        no-repeat !important;

    background-attachment:
        fixed !important;
}


/* ==========================================================================
   5. MAIN PAGE CONTAINER
   ========================================================================== */

.pkp_structure_page {
    position: relative;

    background-color:
        rgba(255, 255, 255, 0.975);

    border-left:
        1px solid rgba(201, 166, 77, 0.65);

    border-right:
        1px solid rgba(201, 166, 77, 0.65);

    box-shadow:
        -12px 0 28px rgba(30, 40, 20, 0.18),
         12px 0 28px rgba(30, 40, 20, 0.18);
}


/* ==========================================================================
   6. HEADER
   ========================================================================== */

.pkp_structure_head {
    position: relative;

    width: 100%;

    margin: 0 !important;
    padding: 0 !important;

    background:
        linear-gradient(
            110deg,
            #171d08 0%,
            #28310e 55%,
            #233825 100%
        ) !important;

    border-top:
        2px solid var(--idrim-gold) !important;

    border-bottom:
        none !important;

    box-shadow:
        0 4px 12px rgba(20, 28, 12, 0.22) !important;
}


/* ==========================================================================
   7. HEADER WRAPPER
   ========================================================================== */

.pkp_head_wrapper {
    width:
        100% !important;

    max-width:
        none !important;

    margin:
        0 !important;

    padding:
        0 !important;

    background:
        transparent !important;
}


/* ==========================================================================
   8. SITE HEADER IMAGE
   ========================================================================== */

.pkp_site_name_wrapper {
    width:
        100% !important;

    max-width:
        none !important;

    margin:
        0 !important;

    padding:
        0 !important;

    background:
        transparent !important;
}


.pkp_site_name {
    display:
        block !important;

    width:
        100% !important;

    max-width:
        none !important;

    margin:
        0 !important;

    padding:
        0 !important;

    background:
        transparent !important;
}


.pkp_site_name .is_img {
    display:
        block !important;

    width:
        100% !important;

    margin:
        0 !important;

    padding:
        0 !important;
}


.pkp_site_name .is_img img {
    display:
        block !important;

    width:
        100% !important;

    max-width:
        100% !important;

    height:
        auto !important;

    max-height:
        none !important;

    margin:
        0 !important;

    padding:
        0 !important;

    border:
        none !important;
}


/* ==========================================================================
   9. USER MENU
   ========================================================================== */

.pkp_navigation_user,
.pkp_navigation_user > li > a,
.pkp_navigation_user a {
    font-family:
        "Source Sans 3",
        Arial,
        sans-serif !important;

    color:
        var(--idrim-gold-light) !important;

    font-weight:
        600 !important;

    text-decoration:
        none !important;
}


.pkp_navigation_user > li > a:hover,
.pkp_navigation_user a:hover {
    color:
        #ffffff !important;
}


/* User dropdown */

.pkp_navigation_user .dropdown-menu {
    background:
        var(--idrim-olive-dark) !important;

    border:
        1px solid var(--idrim-gold) !important;

    border-radius:
        4px !important;

    box-shadow:
        0 7px 16px rgba(18, 25, 7, 0.32) !important;
}


.pkp_navigation_user .dropdown-menu a {
    color:
        var(--idrim-gold-light) !important;

    background:
        var(--idrim-olive-dark) !important;
}


.pkp_navigation_user .dropdown-menu a:hover {
    color:
        var(--idrim-olive-dark) !important;

    background:
        var(--idrim-gold) !important;
}


/* ==========================================================================
   10. NAVIGATION WRAPPER
   ========================================================================== */

.pkp_navigation_primary_wrapper {
    position:
        relative !important;

    width:
        100% !important;

    max-width:
        none !important;

    height:
        40px !important;

    min-height:
        40px !important;

    margin:
        0 !important;

    padding:
        0 !important;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #f5f6f0 100%
        ) !important;

    border-top:
        1px solid rgba(201, 166, 77, 0.25) !important;

    border-bottom:
        2px solid var(--idrim-gold) !important;

    box-shadow:
        0 3px 7px rgba(30, 40, 20, 0.08) !important;

    overflow:
        visible !important;
}


/* ==========================================================================
   11. NAVIGATION ROW
   ========================================================================== */

.pkp_navigation_primary_row {
    position:
        relative !important;

    display:
        block !important;

    width:
        100% !important;

    max-width:
        none !important;

    height:
        38px !important;

    min-height:
        38px !important;

    margin:
        0 !important;

    padding:
        0 !important;

    background:
        transparent !important;
}


/* ==========================================================================
   12. PRIMARY NAVIGATION
   ========================================================================== */

.pkp_navigation_primary {
    display:
        flex !important;

    align-items:
        center !important;

    width:
        auto !important;

    height:
        38px !important;

    margin:
        0 !important;

    padding:
        0 135px 0 18px !important;

    background:
        transparent !important;

    font-family:
        "Source Sans 3",
        Arial,
        sans-serif !important;
}


.pkp_navigation_primary > li {
    display:
        flex !important;

    align-items:
        center !important;

    height:
        38px !important;

    margin:
        0 !important;

    padding:
        0 !important;
}


/* ==========================================================================
   13. NAVIGATION LINKS
   ========================================================================== */

.pkp_navigation_primary > li > a {
    display:
        flex !important;

    align-items:
        center !important;

    justify-content:
        center !important;

    height:
        38px !important;

    margin:
        0 !important;

    padding:
        0 14px !important;

    color:
        var(--idrim-green-dark) !important;

    background:
        transparent !important;

    border:
        none !important;

    border-bottom:
        2px solid transparent !important;

    font-family:
        "Source Sans 3",
        Arial,
        sans-serif !important;

    font-size:
        12px !important;

    font-weight:
        700 !important;

    line-height:
        38px !important;

    text-decoration:
        none !important;

    white-space:
        nowrap !important;

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


.pkp_navigation_primary > li > a:hover,
.pkp_navigation_primary > li > a:focus {
    color:
        var(--idrim-olive-dark) !important;

    background:
        rgba(207, 218, 188, 0.42) !important;

    border-bottom-color:
        var(--idrim-gold) !important;
}


.pkp_navigation_primary > li.current > a,
.pkp_navigation_primary > li.active > a {
    color:
        var(--idrim-olive-dark) !important;

    border-bottom-color:
        var(--idrim-gold) !important;
}


/* ==========================================================================
   14. SEARCH
   ========================================================================== */

.pkp_navigation_search_wrapper {
    display:
        flex !important;

    position:
        absolute !important;

    top:
        0 !important;

    right:
        18px !important;

    z-index:
        50 !important;

    align-items:
        center !important;

    justify-content:
        flex-end !important;

    width:
        auto !important;

    min-width:
        95px !important;

    height:
        38px !important;

    margin:
        0 !important;

    padding:
        0 !important;

    background:
        transparent !important;

    visibility:
        visible !important;

    opacity:
        1 !important;

    transform:
        none !important;
}


.pkp_navigation_search_wrapper a {
    display:
        flex !important;

    align-items:
        center !important;

    justify-content:
        center !important;

    height:
        38px !important;

    padding:
        0 8px !important;

    color:
        var(--idrim-green-dark) !important;

    font-family:
        "Source Sans 3",
        Arial,
        sans-serif !important;

    font-size:
        12px !important;

    font-weight:
        700 !important;

    line-height:
        38px !important;

    text-decoration:
        none !important;

    white-space:
        nowrap !important;
}


.pkp_navigation_search_wrapper a:hover,
.pkp_navigation_search_wrapper a:focus {
    color:
        var(--idrim-gold-dark) !important;
}


.pkp_navigation_search_wrapper .fa,
.pkp_navigation_search_wrapper [class*="icon"] {
    color:
        var(--idrim-gold-dark) !important;

    margin-right:
        3px !important;
}


/* ==========================================================================
   15. NAVIGATION DROPDOWN
   ========================================================================== */

.pkp_navigation_primary .dropdown-menu {
    top:
        38px !important;

    margin:
        0 !important;

    padding:
        4px 0 !important;

    background:
        var(--idrim-green-dark) !important;

    border:
        1px solid var(--idrim-gold) !important;

    border-radius:
        0 0 5px 5px !important;

    box-shadow:
        0 7px 16px rgba(18, 25, 7, 0.28) !important;

    z-index:
        100 !important;
}


.pkp_navigation_primary .dropdown-menu a {
    display:
        block !important;

    height:
        auto !important;

    padding:
        9px 14px !important;

    color:
        var(--idrim-gold-light) !important;

    background:
        var(--idrim-green-dark) !important;

    font-family:
        "Source Sans 3",
        Arial,
        sans-serif !important;

    line-height:
        1.4 !important;
}


.pkp_navigation_primary .dropdown-menu a:hover,
.pkp_navigation_primary .dropdown-menu a:focus {
    color:
        var(--idrim-green-dark) !important;

    background:
        var(--idrim-gold) !important;
}


/* ==========================================================================
   16. REMOVE DEFAULT OJS HEADER GAPS
   ========================================================================== */

.pkp_structure_head .pkp_head_wrapper,
.pkp_structure_head .pkp_site_name_wrapper,
.pkp_structure_head .pkp_navigation_primary_wrapper,
.pkp_structure_head .pkp_navigation_primary_row {
    border-left:
        none !important;

    border-right:
        none !important;
}


.pkp_navigation_primary_wrapper::before,
.pkp_navigation_primary_wrapper::after {
    display:
        none !important;
}


/* ==========================================================================
   17. MAIN CONTENT
   ========================================================================== */

.pkp_structure_main {
    background-color:
        rgba(255, 255, 255, 0.98);

    font-family:
        "Source Sans 3",
        Arial,
        sans-serif !important;
}


/* Sidebar background ONLY.
   Tidak mengubah desain menu sidebar custom. */

.pkp_structure_sidebar {
    background-color:
        rgba(255, 255, 255, 0.98);
}


/* ==========================================================================
   18. HOMEPAGE LAYOUT
   ========================================================================== */

.homepage_image {
    display:
        inline-block;

    width:
        28%;

    margin-left:
        0;

    float:
        right;
}


.homepage_image img {
    display:
        block;

    width:
        300px;

    max-width:
        100%;

    height:
        auto;

    margin:
        60px 0 0 -20px;

    border:
        1px solid var(--idrim-green-dark);

    border-bottom:
        3px solid var(--idrim-gold);

    border-radius:
        5px;

    box-shadow:
        0 6px 14px rgba(30, 40, 20, 0.18),
        0 0 0 1px rgba(201, 166, 77, 0.20);
}


.homepage_about {
    display:
        inline-block;

    width:
        70%;
}


.homepage_about p {
    text-align:
        justify;

    line-height:
        1.65;
}


.homepage_about h2 {
    color:
        var(--idrim-green-dark);

    font-family:
        "Merriweather",
        Georgia,
        serif !important;

    font-weight:
        700;
}


.current_issue {
    display:
        block;

    clear:
        both;
}


/* ==========================================================================
   19. ISSUE COVER
   ========================================================================== */

.obj_issue_toc .heading .cover img,
.current_issue .cover img {
    max-height:
        380px;

    width:
        auto;

    max-width:
        100%;

    border:
        1px solid var(--idrim-green-dark);

    border-bottom:
        3px solid var(--idrim-gold);

    border-radius:
        4px;

    box-shadow:
        0 5px 12px rgba(30, 40, 20, 0.18),
        0 0 0 1px rgba(201, 166, 77, 0.20);
}


/* ==========================================================================
   20. ARTICLE LIST RESET
   ========================================================================== */

.obj_issue_toc .cmp_article_list > li,
.obj_issue_toc .articles > li,
.cmp_article_list > li {
    list-style:
        none !important;

    border:
        none !important;

    padding:
        0 !important;

    margin:
        0 0 18px 0 !important;
}


.obj_issue_toc .cmp_article_list,
.cmp_article_list {
    margin:
        0 !important;

    padding:
        0 !important;

    list-style:
        none !important;
}


/* ==========================================================================
   21. ARTICLE CARD
   ========================================================================== */

.obj_article_summary {
    position:
        relative;

    font-family:
        "Source Sans 3",
        Arial,
        sans-serif !important;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #ffffff 74%,
            #f7f8f3 100%
        );

    border:
        1px solid var(--idrim-green-dark);

    border-bottom:
        2px solid var(--idrim-gold);

    border-radius:
        9px;

    padding:
        18px 22px;

    box-shadow:
        0 3px 8px rgba(30, 40, 20, 0.11),
        0 0 0 1px rgba(201, 166, 77, 0.10);

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


/* Small elegant gold accent */

.obj_article_summary::before {
    content:
        "";

    position:
        absolute;

    top:
        0;

    left:
        22px;

    right:
        22px;

    height:
        1px;

    background:
        linear-gradient(
            90deg,
            transparent 0%,
            var(--idrim-gold) 50%,
            transparent 100%
        );
}


.obj_article_summary:hover {
    border-color:
        var(--idrim-green);

    transform:
        translateY(-2px);

    box-shadow:
        0 8px 18px rgba(30, 40, 20, 0.17),
        0 0 0 1px rgba(201, 166, 77, 0.20);
}


/* ==========================================================================
   22. ARTICLE TITLE
   ========================================================================== */

.obj_article_summary .title,
.obj_article_summary h3.title,
.obj_article_summary h4.title {
    font-family:
        "Merriweather",
        Georgia,
        "Times New Roman",
        serif !important;

    text-transform:
        none;

    letter-spacing:
        normal;

    line-height:
        1.5;

    margin:
        0 0 10px 0;

    padding:
        0;
}


.obj_issue_toc .articles .title a,
.obj_issue_toc .section .title a,
.obj_article_summary .title a,
.obj_article_summary h3.title a,
.obj_article_summary h4.title a {
    color:
        var(--idrim-green-dark) !important;

    font-family:
        "Merriweather",
        Georgia,
        serif !important;

    font-weight:
        700 !important;

    text-decoration:
        none;
}


.obj_issue_toc .articles .title a:hover,
.obj_issue_toc .section .title a:hover,
.obj_article_summary .title a:hover,
.obj_article_summary h3.title a:hover,
.obj_article_summary h4.title a:hover {
    color:
        var(--idrim-olive-dark) !important;

    text-decoration:
        underline;

    text-decoration-color:
        var(--idrim-gold);

    text-decoration-thickness:
        2px;

    text-underline-offset:
        3px;
}


/* ==========================================================================
   23. AUTHORS + META
   ========================================================================== */

.obj_article_summary .meta {
    display:
        flex;

    align-items:
        flex-start;

    justify-content:
        space-between;

    gap:
        16px;

    margin:
        0 0 12px 0;

    padding:
        0;

    font-family:
        "Source Sans 3",
        Arial,
        sans-serif !important;

    font-size:
        0.92rem;

    color:
        var(--idrim-text);
}


.obj_article_summary .meta .authors,
.obj_article_summary .authors,
.obj_article_summary .authors .consent {
    flex:
        1 1 auto;

    min-width:
        0;

    color:
        var(--idrim-text) !important;

    margin:
        0;

    padding:
        0;
}


/* Author links remain black */

.obj_article_summary .authors a,
.obj_article_summary .authors .consent a,
.obj_article_summary .meta .authors a {
    color:
        var(--idrim-text) !important;

    text-decoration:
        none;
}


.obj_article_summary .authors a:hover,
.obj_article_summary .meta .authors a:hover {
    color:
        var(--idrim-text) !important;

    text-decoration:
        underline;

    text-decoration-color:
        var(--idrim-gold);
}


.obj_article_summary .authors b,
.obj_article_summary .authors strong,
.obj_article_summary .authors .consent b,
.obj_article_summary .authors .consent strong {
    color:
        var(--idrim-text) !important;

    font-weight:
        700;
}


.obj_article_summary .meta .pages {
    flex:
        0 0 auto;

    color:
        var(--idrim-text) !important;

    white-space:
        nowrap;

    margin:
        0;

    padding:
        0;
}


.obj_article_summary .meta .published {
    color:
        var(--idrim-text) !important;
}


/* ==========================================================================
   24. ARTICLE STATISTICS
   ========================================================================== */

.obj_article_summary .article_statistic {
    display:
        flex;

    justify-content:
        space-between;

    align-items:
        center;

    gap:
        16px;

    margin-top:
        10px;

    padding-top:
        9px;

    border-top:
        1px solid rgba(201, 166, 77, 0.38);
}


.obj_article_summary .article_statistic .stats {
    order:
        1;

    flex:
        1 1 auto;

    min-width:
        0;

    font-size:
        12.5px;

    color:
        var(--idrim-text);

    line-height:
        1.8;
}


.obj_article_summary .article_statistic .galley_list {
    order:
        2;

    flex:
        0 0 auto;
}


/* DOI */

.obj_article_summary .stats .doi_link {
    color:
        var(--idrim-green-dark);

    text-decoration:
        none;

    margin-right:
        10px;
}


.obj_article_summary .stats .doi_link:hover {
    color:
        var(--idrim-green);

    text-decoration:
        underline;

    text-decoration-color:
        var(--idrim-gold);
}


/* Stats */

.obj_article_summary .stats .article_stat,
.obj_article_summary .stats .galley_stat {
    margin-right:
        10px;

    white-space:
        nowrap;

    color:
        var(--idrim-text);
}


.obj_article_summary .stats .fa {
    color:
        var(--idrim-gold-dark);

    margin-right:
        3px;
}


/* ==========================================================================
   25. PDF BUTTON
   ========================================================================== */

.obj_article_summary .galleys_links {
    margin:
        0 !important;

    padding:
        0 !important;

    list-style:
        none !important;
}


.obj_article_summary .galleys_links > li {
    display:
        inline-block;

    margin:
        0 8px 0 0 !important;

    padding:
        0 !important;

    border:
        none !important;
}


.obj_article_summary .galleys_links .obj_galley_link,
.obj_article_summary .galleys_links .obj_galley_link:link,
.obj_article_summary .galleys_links .obj_galley_link:visited {
    display:
        inline-block;

    font-family:
        "Source Sans 3",
        Arial,
        sans-serif !important;

    background:
        linear-gradient(
            180deg,
            #35523a 0%,
            #233825 100%
        );

    border:
        1px solid var(--idrim-green-dark);

    border-bottom:
        2px solid var(--idrim-gold);

    border-radius:
        6px;

    color:
        var(--idrim-gold-light) !important;

    -webkit-text-fill-color:
        var(--idrim-gold-light) !important;

    padding:
        5px 14px;

    font-size:
        0.85rem;

    font-weight:
        700;

    text-decoration:
        none !important;

    white-space:
        nowrap;

    box-shadow:
        0 2px 5px rgba(30, 40, 20, 0.17);

    transition:
        background 0.20s ease,
        color 0.20s ease,
        transform 0.20s ease,
        box-shadow 0.20s ease;
}


.obj_article_summary .galleys_links .obj_galley_link:hover,
.obj_article_summary .galleys_links .obj_galley_link:focus,
.obj_article_summary .galleys_links .obj_galley_link:active {
    background:
        var(--idrim-gold) !important;

    border-color:
        var(--idrim-gold-dark) !important;

    color:
        var(--idrim-olive-dark) !important;

    -webkit-text-fill-color:
        var(--idrim-olive-dark) !important;

    transform:
        translateY(-1px);

    box-shadow:
        0 4px 9px rgba(30, 40, 20, 0.22);
}


.obj_article_summary .galleys_links .obj_galley_link:hover *,
.obj_article_summary .galleys_links .obj_galley_link:focus *,
.obj_article_summary .galleys_links .obj_galley_link:active * {
    color:
        var(--idrim-olive-dark) !important;

    -webkit-text-fill-color:
        var(--idrim-olive-dark) !important;
}


/* ==========================================================================
   26. ARTICLE SECTION HEADING
   ========================================================================== */

.obj_issue_toc .section > h2 {
    font-family:
        "Merriweather",
        Georgia,
        serif !important;

    font-size:
        1.05rem;

    font-weight:
        700;

    color:
        var(--idrim-green-dark);

    margin:
        25px 0 15px 0;

    padding:
        8px 11px;

    border-left:
        4px solid var(--idrim-gold);

    border-bottom:
        1px solid rgba(201, 166, 77, 0.70);

    background:
        linear-gradient(
            90deg,
            rgba(207, 218, 188, 0.66) 0%,
            rgba(232, 237, 223, 0.45) 62%,
            rgba(255, 255, 255, 0) 100%
        );
}


/* ==========================================================================
   27. GENERAL CONTENT
   ========================================================================== */

.pkp_structure_main strong,
.pkp_structure_main b {
    color:
        inherit;
}


.pkp_structure_main a {
    color:
        var(--idrim-green-dark);
}


.pkp_structure_main a:hover {
    color:
        var(--idrim-gold-dark);
}


/* Authors remain black */

.pkp_structure_main .obj_article_summary .authors a,
.pkp_structure_main .obj_article_summary .meta .authors a {
    color:
        var(--idrim-text) !important;
}


/* ==========================================================================
   28. ACCESSIBILITY
   ========================================================================== */

.pkp_structure_main a:focus,
.obj_article_summary .galleys_links .obj_galley_link:focus {
    outline:
        2px solid var(--idrim-gold);

    outline-offset:
        2px;
}


/* ==========================================================================
   29. TEXT SELECTION
   ========================================================================== */

::selection {
    background-color:
        var(--idrim-green-dark);

    color:
        #ffffff;
}


::-moz-selection {
    background-color:
        var(--idrim-green-dark);

    color:
        #ffffff;
}


/* ==========================================================================
   30. FOOTER WRAPPER
   Light / clean academic footer
   ========================================================================== */

.pkp_structure_footer_wrapper {
    position:
        relative !important;

    width:
        100% !important;

    margin:
        0 !important;

    padding:
        0 !important;

    background:
        linear-gradient(
            135deg,
            #f6f5ef 0%,
            #eceee7 54%,
            #f8f7f2 100%
        ) !important;

    border-top:
        1px solid var(--idrim-gold) !important;

    border-left:
        1px solid rgba(201, 166, 77, 0.45) !important;

    border-right:
        1px solid rgba(201, 166, 77, 0.45) !important;

    border-bottom:
        14px solid var(--idrim-green-dark) !important;

    box-shadow:
        0 -3px 10px rgba(30, 40, 20, 0.10) !important;

    color:
        var(--idrim-text) !important;
}


/* Very subtle footer ornament */

.pkp_structure_footer_wrapper::before {
    content:
        "";

    position:
        absolute;

    inset:
        0 0 14px 0;

    pointer-events:
        none;

    background:
        linear-gradient(
            25deg,
            rgba(53, 82, 58, 0.018) 12%,
            transparent 12.5%,
            transparent 87%,
            rgba(53, 82, 58, 0.018) 87.5%
        );

    background-size:
        80px 138px;

    opacity:
        0.55;
}


/* ==========================================================================
   31. FOOTER INNER
   ========================================================================== */

.pkp_structure_footer {
    position:
        relative !important;

    z-index:
        2 !important;

    display:
        flex !important;

    align-items:
        center !important;

    justify-content:
        space-between !important;

    gap:
        35px !important;

    width:
        100% !important;

    max-width:
        none !important;

    min-height:
        155px !important;

    margin:
        0 !important;

    padding:
        24px 26px 26px !important;

    background:
        transparent !important;

    color:
        var(--idrim-text) !important;

    font-family:
        "Source Sans 3",
        Arial,
        sans-serif !important;
}


/* ==========================================================================
   32. FOOTER CONTENT
   ========================================================================== */

.pkp_footer_content {
    flex:
        1 1 auto !important;

    min-width:
        0 !important;

    margin:
        0 !important;

    padding:
        0 !important;

    color:
        var(--idrim-text) !important;

    font-family:
        "Source Sans 3",
        Arial,
        sans-serif !important;

    font-size:
        12.5px !important;

    line-height:
        1.55 !important;
}


.pkp_footer_content p,
.pkp_footer_content div,
.pkp_footer_content span,
.pkp_footer_content address,
.pkp_structure_footer p,
.pkp_structure_footer div,
.pkp_structure_footer span,
.pkp_structure_footer address {
    color:
        var(--idrim-text) !important;

    font-family:
        "Source Sans 3",
        Arial,
        sans-serif !important;

    line-height:
        1.55 !important;
}


/* Footer bold */

.pkp_footer_content strong,
.pkp_footer_content b,
.pkp_structure_footer strong,
.pkp_structure_footer b {
    color:
        var(--idrim-green-dark) !important;

    font-weight:
        700 !important;
}


/* ==========================================================================
   33. FOOTER LINKS
   ========================================================================== */

.pkp_footer_content a,
.pkp_structure_footer a {
    color:
        var(--idrim-green-dark) !important;

    text-decoration:
        none !important;

    border-bottom:
        1px dotted rgba(155, 124, 46, 0.55) !important;
}


.pkp_footer_content a:hover,
.pkp_structure_footer a:hover {
    color:
        var(--idrim-gold-dark) !important;

    border-bottom-color:
        var(--idrim-gold) !important;
}


/* ==========================================================================
   34. FOOTER IMAGES
   ========================================================================== */

.pkp_footer_content img,
.pkp_structure_footer img {
    max-width:
        100% !important;

    height:
        auto !important;
}


/* ==========================================================================
   35. OJS / PKP BRAND
   ========================================================================== */

.pkp_brand_footer {
    flex:
        0 0 175px !important;

    align-self:
        center !important;

    margin:
        0 !important;

    padding:
        0 !important;

    background:
        transparent !important;

    color:
        var(--idrim-green-dark) !important;

    text-align:
        center !important;

    opacity:
        1 !important;
}


.pkp_brand_footer a {
    color:
        var(--idrim-green-dark) !important;

    border:
        none !important;
}


.pkp_brand_footer img {
    display:
        block !important;

    max-width:
        120px !important;

    height:
        auto !important;

    margin:
        0 auto !important;

    opacity:
        0.82 !important;

    filter:
        grayscale(1)
        brightness(0.52)
        sepia(0.18)
        saturate(0.80) !important;
}


/* ==========================================================================
   36. TABLET
   ========================================================================== */

@media (max-width: 991px) {

    .homepage_about {
        margin-top:
            30px;
    }


    .pkp_navigation_primary {
        padding:
            0 110px 0 8px !important;
    }


    .pkp_navigation_primary > li > a {
        padding:
            0 10px !important;
    }


    .pkp_navigation_search_wrapper {
        right:
            10px !important;
    }


    .pkp_structure_footer {
        padding:
            24px 20px !important;

        gap:
            25px !important;
    }

}


/* ==========================================================================
   37. MOBILE
   ========================================================================== */

@media (max-width: 600px) {

    html,
    body {
        background-image:
            linear-gradient(
                rgba(255, 255, 255, 0.04),
                rgba(255, 255, 255, 0.04)
            ),
            url("https://ejournalbarca.id/public/site/images/adminbarca/IDRIM%20Logo.png") !important;

        background-size:
            cover !important;

        background-position:
            center top !important;

        background-repeat:
            no-repeat !important;

        background-attachment:
            scroll !important;
    }


    .pkp_structure_page {
        border-left:
            none;

        border-right:
            none;

        box-shadow:
            none;
    }


    .pkp_navigation_primary_wrapper {
        height:
            auto !important;

        min-height:
            0 !important;
    }


    .pkp_navigation_primary_row {
        height:
            auto !important;

        min-height:
            0 !important;
    }


    .pkp_navigation_primary {
        display:
            block !important;

        width:
            100% !important;

        height:
            auto !important;

        padding:
            0 !important;
    }


    .pkp_navigation_primary > li {
        display:
            block !important;

        width:
            100% !important;

        height:
            auto !important;
    }


    .pkp_navigation_primary > li > a {
        justify-content:
            flex-start !important;

        width:
            100% !important;

        height:
            40px !important;

        padding:
            0 15px !important;

        border-bottom:
            1px solid rgba(201, 166, 77, 0.18) !important;
    }


    .pkp_navigation_search_wrapper {
        position:
            relative !important;

        top:
            auto !important;

        right:
            auto !important;

        width:
            100% !important;

        height:
            40px !important;

        justify-content:
            flex-start !important;

        padding:
            0 15px !important;

        border-top:
            1px solid rgba(201, 166, 77, 0.20) !important;
    }


    .pkp_navigation_search_wrapper a {
        height:
            40px !important;

        padding:
            0 !important;
    }


    .homepage_image,
    .homepage_about {
        width:
            100%;

        float:
            none;

        display:
            block;
    }


    .homepage_image img {
        margin:
            20px auto 0 auto;
    }


    .obj_article_summary {
        padding:
            15px 16px;
    }


    .obj_article_summary::before {
        left:
            14px;

        right:
            14px;
    }


    .obj_article_summary .meta,
    .obj_article_summary .article_statistic {
        display:
            block;
    }


    .obj_article_summary .meta .pages {
        display:
            block;

        margin-top:
            4px !important;
    }


    .obj_article_summary .article_statistic .galley_list {
        margin-top:
            8px;
    }


    .pkp_structure_footer {
        display:
            block !important;

        min-height:
            0 !important;

        padding:
            22px 18px !important;
    }


    .pkp_footer_content {
        width:
            100% !important;
    }


    .pkp_brand_footer {
        width:
            100% !important;

        margin-top:
            24px !important;

        text-align:
            left !important;
    }


    .pkp_brand_footer img {
        margin:
            0 !important;
    }

}