/* ==========================================================
   EDU SPORTIVO — PEKA HEADER + EDU SPORTIVO CONTENT
   OJS 3.3.0-20

   BASE:
   - PEKA CSS dipertahankan utuh, termasuk HEADER/LOGO/NAVIGATION.

   ADOPTED FROM EDU SPORTIVO v28:
   - Hero
   - Current Issue animation
   - Aims & Scope
   - Sidebar
   - Journal Policies
   - Tabs
   - Footer
   - Article title / PDF buttons
   - Content animations

   IMPORTANT:
   - Tidak mengambil CSS Header/Logo Edu.
   - Tidak mengambil CSS Navigation Edu.
   - Header tetap mengikuti PEKA.
========================================================== */

/* ==========================================================
SPORT PEDAGOGY PREMIUM CSS
Palette:
Primary   : #F36C0A
   Secondary : #D5E8DF
   Background: #F5F9F7
========================================================== */

:root{
  --primary:#F36C0A;
  --primary-dark:#034526;
  --secondary:#D5E8DF;
  --light:#F5F9F7;
}

html{scroll-behavior:smooth;}
body{animation:fadePage .8s ease;}

@keyframes fadePage{
from{opacity:0;}
to{opacity:1;}
}

/* HERO */
.hero-banner{position:relative;overflow:hidden;}
.hero-banner img{transition:8s;}
.hero-banner:hover img{transform:scale(1.08);}

/* CARD */
.sp-card{
transition:.35s;
border-radius:16px;
}
.sp-card:hover{
transform:translateY(-6px);
box-shadow:0 18px 35px rgba(11,37,58,.18);
}

/* COVER */
.sp-cover img{
transition:.4s;
border-radius:12px;
}
.sp-cover img:hover{
transform:translateY(-8px);
box-shadow:0 18px 35px rgba(11,37,58,.28);
}

/* BUTTON */
.sp-btn{
position:relative;
overflow:hidden;
display:inline-block;
animation:buttonPulse 3s infinite;
transition:.35s;
}
.sp-btn:hover{
transform:translateY(-5px);
box-shadow:0 14px 30px rgba(11,37,58,.30);
}
.sp-btn::before{
content:"";
position:absolute;
top:0;
left:-120%;
width:45%;
height:100%;
background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);
transform:skewX(-25deg);
animation:shine 3s linear infinite;
}

@keyframes buttonPulse{
0%,100%{transform:scale(1);}
50%{transform:scale(1.03);}
}

@keyframes shine{
0%{left:-120%;}
100%{left:160%;}
}

/* QUICK INFO */
.sp-info{
transition:.35s;
border-radius:12px;
}
.sp-info:hover{
background:#fff;
transform:translateY(-4px);
box-shadow:0 14px 24px rgba(11,37,58,.12);
}

/* MENU */
.sp-menu a{
transition:.35s;
display:inline-block;
}
.sp-menu a:hover{
transform:translateY(-5px);
}

/* HEADINGS */
h1,h2,h3,h4{
color:var(--primary);
}

/* LINKS */
a{
transition:.3s;
}
a:hover{
color:var(--primary-dark);
}

/* IMAGES */
img{
transition:.45s;
}
img:hover{
transform:scale(1.02);
}

/* RESPONSIVE */
@media(max-width:900px){
.hero-layout{display:block!important;}
.hero-layout>div{
width:100%!important;
margin-bottom:25px;
}
.sp-cover{text-align:center!important;}
}

@media(max-width:600px){
h1{font-size:38px!important;}
h2{font-size:26px!important;}
.sp-btn{
display:block;
text-align:center;
margin-bottom:12px;
}
}






/* ==========================================================
   PREMIUM SIDEBAR MENU v5 (Compact)
========================================================== */

.sidebar-title{
    background:linear-gradient(135deg,#F36C0A,#034526);
    color:#fff;
    font-size:18px;
    font-weight:700;
    text-align:center;
    padding:13px 16px;
    margin:0 0 14px;
    border-radius:16px;
    box-shadow:0 8px 18px rgba(11,37,58,.22);
    letter-spacing:.2px;
}

.content .gap-2{
    display:block!important;
    width:100%;
    margin:0;
    padding:0;
}

.content .gap-2 .m-menu{
    position:relative;
    display:flex!important;
    align-items:center;
    overflow:hidden;
    min-height:46px;
    padding:10px 16px!important;
    margin:0 0 9px;
    background:#fff;
    border:1px solid var(--secondary)!important;
    border-radius:10px;
    box-shadow:0 3px 10px rgba(11,37,58,.08);
    color:var(--primary)!important;
    text-decoration:none!important;
    font-size:15px;
    font-weight:600;
    line-height:1.3;
    transition:transform .25s ease,box-shadow .25s ease,color .25s ease;
    z-index:1;
}

.content .gap-2 .m-menu::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:0;
    height:100%;
    background:linear-gradient(90deg,#F36C0A,#034526);
    transition:width .35s cubic-bezier(.4,0,.2,1);
    z-index:-1;
}

.content .gap-2 .m-menu:hover::before{
    width:100%;
}

.content .gap-2 .m-menu em{
    width:22px;
    min-width:22px;
    margin-right:12px;
    text-align:center;
    font-size:16px;
    color:#F36C0A;
    transition:.25s;
}

.content .gap-2 .m-menu span{
    flex:1;
}

.content .gap-2 .m-menu::after{
    content:"›";
    margin-left:auto;
    font-size:20px;
    font-weight:700;
    color:#F36C0A;
    transition:.25s;
}

.content .gap-2 .m-menu:hover{
    color:#fff!important;
    transform:translateY(-2px);
    box-shadow:0 8px 18px rgba(11,37,58,.20);
}

.content .gap-2 .m-menu:hover em,
.content .gap-2 .m-menu:hover::after{
    color:#fff;
}

.content .gap-2 .m-menu:hover::after{
    transform:translateX(4px);
}


/* ==========================================================
   PEKA SIDEBAR — ORANGE PALETTE MATCHING HERO
   Hero palette:
   #F36C0A / #F36C0A / #F6A623 / #F6A623
========================================================== */

/* Sidebar heading */
.sidebar-title{
    background:linear-gradient(
        135deg,
        #F36C0A 0%,
        #F36C0A 58%,
        #F6A623 100%
    )!important;
    color:#FFFFFF!important;
    box-shadow:
        0 8px 18px rgba(11,37,58,.22),
        0 4px 12px rgba(243,108,10,.14)!important;
}

/* Sidebar menu cards */
.content .gap-2 .m-menu{
    background:#FFFFFF!important;
    border:1px solid #F2C6A8!important;
    color:#F36C0A!important;
    box-shadow:
        0 3px 10px rgba(11,37,58,.08)!important;
}

/* Orange hover fill */
.content .gap-2 .m-menu::before{
    background:linear-gradient(
        90deg,
        #F36C0A 0%,
        #F36C0A 58%,
        #F6A623 100%
    )!important;
}

/* Sidebar icons */
.content .gap-2 .m-menu em{
    color:#F36C0A!important;
}

/* Sidebar arrows */
.content .gap-2 .m-menu::after{
    color:#F36C0A!important;
}

/* Hover state */
.content .gap-2 .m-menu:hover{
    color:#FFFFFF!important;
    border-color:#F36C0A!important;
    box-shadow:
        0 8px 18px rgba(11,37,58,.20)!important;
}

.content .gap-2 .m-menu:hover em,
.content .gap-2 .m-menu:hover::after{
    color:#FFFFFF!important;
}

/* Sidebar links/text remain orange before hover */
.content .gap-2 .m-menu span{
    color:#F36C0A!important;
}

.content .gap-2 .m-menu:hover span{
    color:#FFFFFF!important;
}

/* Optional accent for sidebar links */
.content .gap-2 .m-menu:focus-visible{
    outline:2px solid #F6A623!important;
    outline-offset:2px;
}

/* Mobile */
@media(max-width:600px){
    .sidebar-title{
        font-size:17px!important;
        padding:12px 14px!important;
    }

    .content .gap-2 .m-menu{
        min-height:46px!important;
        padding:10px 14px!important;
    }
}


/* ==========================================================
   PEKA HEADER — JSA STYLE / ORANGE EDITION
   Structure:
   1. White logo area
   2. Register/Login at top-right
   3. Centered navigation bar
   4. Orange navigation typography
   5. White About dropdown + orange text
========================================================== */

/* ---------- HEADER / LOGO AREA ---------- */

.pkp_structure_head{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    background:#FFFFFF!important;
    border:0!important;
    box-shadow:none!important;
}

.pkp_head_wrapper{
    width:100%!important;
    max-width:1160px!important;
    min-height:205px!important;
    margin:0 auto!important;
    padding:0 20px!important;
    box-sizing:border-box!important;
    position:relative!important;
}

.pkp_site_name_wrapper{
    position:relative!important;
    width:100%!important;
    min-height:205px!important;
    margin:0!important;
    padding:0!important;
    background:#FFFFFF!important;
    border:0!important;
    box-shadow:none!important;
    overflow:visible!important;
}

.pkp_site_name{
    position:relative!important;
    z-index:5!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    min-height:205px!important;
    margin:0!important;
    padding:28px 0 22px!important;
    box-sizing:border-box!important;
}

.pkp_site_name img{
    display:block!important;
    width:auto!important;
    height:auto!important;
    max-width:min(720px,90vw)!important;
    max-height:125px!important;
    margin:0 auto!important;
    transform:none!important;
    filter:none!important;
}


/* ---------- REGISTER / LOGIN ---------- */

.pkp_navigation_user_wrapper{
    position:absolute!important;
    top:0!important;
    right:0!important;
    z-index:99999!important;
}

.pkp_navigation_user{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:20px!important;
    margin:0!important;
    padding:0!important;
    list-style:none!important;
}

.pkp_navigation_user > li > a{
    color:#F36C0A!important;
    -webkit-text-fill-color:#F36C0A!important;
    font-family:Arial,Helvetica,sans-serif!important;
    font-size:14px!important;
    font-weight:700!important;
    text-decoration:none!important;
    white-space:nowrap!important;
}

.pkp_navigation_user > li > a:hover{
    color:#034526!important;
    -webkit-text-fill-color:#034526!important;
}


/* ---------- NAVIGATION BAR ---------- */

.pkp_site_nav_menu{
    position:relative!important;
    z-index:200!important;
    width:100%!important;
    max-width:1160px!important;
    min-height:58px!important;
    margin:0 auto!important;
    padding:0!important;
    background:#FFFFFF!important;
    border-bottom:1px solid #D9D9D9!important;
    box-shadow:0 5px 14px rgba(0,0,0,.08)!important;
    overflow:visible!important;
}

.pkp_navigation_primary_wrapper{
    width:100%!important;
    max-width:none!important;
    min-height:58px!important;
    margin:0!important;
    padding:0!important;
    box-sizing:border-box!important;
    background:#FFFFFF!important;
}

.pkp_navigation_primary_row{
    position:relative!important;
    width:100%!important;
    max-width:none!important;
    min-height:58px!important;
    margin:0!important;
    padding:0 22px!important;
    box-sizing:border-box!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    flex-wrap:nowrap!important;
    gap:12px!important;
}


/* ---------- PRIMARY MENU ---------- */

.pkp_navigation_primary{
    display:flex!important;
    align-items:center!important;
    gap:2px!important;
    margin:0!important;
    padding:0!important;
    list-style:none!important;
}

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

.pkp_navigation_primary > li > a{
    display:flex!important;
    align-items:center!important;
    width:auto!important;
    min-width:0!important;
    height:58px!important;
    padding:0 10px!important;
    box-sizing:border-box!important;
    color:#F36C0A!important;
    -webkit-text-fill-color:#F36C0A!important;
    font-family:Arial,Helvetica,sans-serif!important;
    font-size:14px!important;
    font-weight:700!important;
    line-height:1.25!important;
    white-space:nowrap!important;
    text-decoration:none!important;
    visibility:visible!important;
    opacity:1!important;
}

.pkp_navigation_primary > li > a:hover,
.pkp_navigation_primary > li > a:focus{
    color:#034526!important;
    -webkit-text-fill-color:#034526!important;
    background:#F5F9F7!important;
}


/* ---------- ABOUT DROPDOWN ---------- */

.pkp_navigation_primary .dropdown-menu{
    min-width:220px!important;
    margin:0!important;
    padding:7px 0!important;
    background:#FFFFFF!important;
    border:1px solid #F2C6A8!important;
    border-radius:0 0 10px 10px!important;
    box-shadow:0 10px 24px rgba(11,37,58,.14)!important;
    z-index:99999!important;
}

.pkp_navigation_primary .dropdown-menu > li{
    margin:0!important;
    padding:0!important;
}

.pkp_navigation_primary .dropdown-menu > li > a,
.pkp_navigation_primary .dropdown-menu > li > a *,
.pkp_navigation_primary .dropdown-menu a{
    display:block!important;
    width:100%!important;
    box-sizing:border-box!important;
    padding:10px 16px!important;
    background:#FFFFFF!important;
    color:#F36C0A!important;
    -webkit-text-fill-color:#F36C0A!important;
    font-family:Arial,Helvetica,sans-serif!important;
    font-size:13px!important;
    font-weight:600!important;
    text-decoration:none!important;
    white-space:nowrap!important;
}

.pkp_navigation_primary .dropdown-menu > li > a:hover,
.pkp_navigation_primary .dropdown-menu > li > a:focus{
    background:#F5F9F7!important;
    color:#034526!important;
    -webkit-text-fill-color:#034526!important;
}


/* ---------- SEARCH ---------- */

.pkp_search{
    margin-left:auto!important;
    padding-left:8px!important;
    padding-right:4px!important;
}

.pkp_search .search_prompt,
.pkp_search a,
.pkp_search button{
    color:#F36C0A!important;
    -webkit-text-fill-color:#F36C0A!important;
    font-family:Arial,Helvetica,sans-serif!important;
    font-size:14px!important;
    font-weight:700!important;
    text-decoration:none!important;
}

.pkp_search a:hover,
.pkp_search button:hover,
.pkp_search .search_prompt:hover{
    color:#034526!important;
    -webkit-text-fill-color:#034526!important;
}


/* ---------- REMOVE OLD GREEN HEADER COLORS ---------- */

.pkp_navigation_primary *,
.pkp_navigation_user *,
.pkp_search *{
    text-decoration-color:#F36C0A!important;
}

.pkp_navigation_primary > li > a,
.pkp_navigation_user > li > a,
.pkp_search a,
.pkp_search button,
.pkp_search .search_prompt{
    text-shadow:none!important;
}


/* ---------- RESPONSIVE ---------- */

@media (max-width:900px){

    .pkp_head_wrapper{
        min-height:170px!important;
        padding:0 15px!important;
    }

    .pkp_site_name_wrapper,
    .pkp_site_name{
        min-height:170px!important;
    }

    .pkp_site_name{
        padding:25px 0 20px!important;
    }

    .pkp_site_name img{
        max-width:85vw!important;
        max-height:105px!important;
    }

    .pkp_navigation_primary_row{
        padding:0 12px!important;
        gap:6px!important;
        overflow-x:auto!important;
    }

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

@media (max-width:600px){

    .pkp_head_wrapper{
        min-height:145px!important;
    }

    .pkp_site_name_wrapper,
    .pkp_site_name{
        min-height:145px!important;
    }

    .pkp_site_name{
        padding:20px 0 15px!important;
    }

    .pkp_site_name img{
        max-width:88vw!important;
        max-height:85px!important;
    }

    .pkp_navigation_user_wrapper{
        top:0!important;
        right:8px!important;
    }

    .pkp_navigation_user{
        gap:10px!important;
    }

    .pkp_navigation_user > li > a{
        font-size:12px!important;
    }

    .pkp_navigation_primary_row{
        min-height:52px!important;
    }

    .pkp_navigation_primary > li > a{
        height:52px!important;
        padding:0 6px!important;
        font-size:12px!important;
    }
}


/* ==========================================================
   PEKA HEADER V3 — TRUE JSA LAYOUT
   1. REGISTER + LOGIN ABOVE LOGO
   2. SEARCH ON THE SAME NAVIGATION ROW
   3. NO LOGIN/REGISTER BOXES
   4. ORANGE PEKA COLOR
========================================================== */


/* ----------------------------------------------------------
   HEADER CONTAINER
---------------------------------------------------------- */

.pkp_head_wrapper{
    position:relative!important;
    max-width:1160px!important;
    margin:0 auto!important;
    background:#FFFFFF!important;
}

.pkp_site_name_wrapper{
    position:relative!important;
    z-index:1!important;
    background:#FFFFFF!important;
}

.pkp_site_name{
    position:relative!important;
    z-index:1!important;
}


/* ----------------------------------------------------------
   REGISTER + LOGIN
   Move them from navigation row to TOP OF HEADER,
   matching the JSA screenshot.
---------------------------------------------------------- */

.pkp_navigation_user_wrapper{
    position:absolute!important;
    top:0!important;
    right:0!important;
    z-index:999999!important;

    /* move from navigation row to the top header */
    transform:translateY(-330px)!important;

    width:auto!important;
    height:auto!important;
    margin:0!important;
    padding:0!important;

    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
}

.pkp_navigation_user{
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:24px!important;

    width:auto!important;
    height:auto!important;
    margin:0!important;
    padding:0!important;

    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
    list-style:none!important;
}

.pkp_navigation_user > li{
    display:block!important;
    margin:0!important;
    padding:0!important;
    background:transparent!important;
    border:0!important;
}

.pkp_navigation_user > li > a{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;

    height:auto!important;
    min-height:0!important;
    width:auto!important;

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

    background:transparent!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;

    color:#F36C0A!important;
    -webkit-text-fill-color:#F36C0A!important;

    font-family:Arial,Helvetica,sans-serif!important;
    font-size:14px!important;
    font-weight:700!important;
    line-height:1.2!important;
    text-decoration:none!important;
    white-space:nowrap!important;
}

.pkp_navigation_user > li > a:hover{
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
    color:#034526!important;
    -webkit-text-fill-color:#034526!important;
}


/* ----------------------------------------------------------
   REMOVE ANY OLD REGISTER/LOGIN BUTTON APPEARANCE
---------------------------------------------------------- */

.pkp_navigation_user .profile,
.pkp_navigation_user .profile > a,
.pkp_navigation_user li,
.pkp_navigation_user li > a{
    background-color:transparent!important;
    background-image:none!important;
}


/* ----------------------------------------------------------
   NAVIGATION ROW
---------------------------------------------------------- */

.pkp_site_nav_menu{
    position:relative!important;
    z-index:200!important;
    width:100%!important;
    max-width:1160px!important;
    height:58px!important;
    min-height:58px!important;
    margin:0 auto!important;
    padding:0!important;
    background:#FFFFFF!important;
    border-bottom:1px solid #D9D9D9!important;
    box-shadow:0 5px 14px rgba(0,0,0,.08)!important;
    overflow:visible!important;
}

.pkp_navigation_primary_wrapper{
    position:relative!important;
    width:100%!important;
    height:58px!important;
    min-height:58px!important;
    margin:0!important;
    padding:0!important;
    background:#FFFFFF!important;
    box-sizing:border-box!important;
}

.pkp_navigation_primary_row{
    position:relative!important;
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:flex-start!important;
    flex-wrap:nowrap!important;

    width:100%!important;
    height:58px!important;
    min-height:58px!important;

    margin:0!important;
    padding:0 22px!important;
    gap:0!important;

    box-sizing:border-box!important;
    background:#FFFFFF!important;
    overflow:visible!important;
}


/* ----------------------------------------------------------
   PRIMARY MENU
---------------------------------------------------------- */

.pkp_navigation_primary{
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:flex-start!important;
    flex-wrap:nowrap!important;

    width:auto!important;
    height:58px!important;
    min-height:58px!important;

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

    list-style:none!important;
}

.pkp_navigation_primary > li{
    display:flex!important;
    align-items:center!important;
    flex:0 0 auto!important;

    height:58px!important;
    margin:0!important;
    padding:0!important;
}

.pkp_navigation_primary > li > a{
    display:flex!important;
    align-items:center!important;

    height:58px!important;
    min-height:58px!important;

    margin:0!important;
    padding:0 12px!important;

    box-sizing:border-box!important;

    color:#F36C0A!important;
    -webkit-text-fill-color:#F36C0A!important;

    font-family:Arial,Helvetica,sans-serif!important;
    font-size:14px!important;
    font-weight:700!important;
    line-height:1!important;

    white-space:nowrap!important;
    text-decoration:none!important;
}

.pkp_navigation_primary > li > a:hover{
    color:#034526!important;
    -webkit-text-fill-color:#034526!important;
    background:#F5F9F7!important;
}


/* ----------------------------------------------------------
   SEARCH
   ABSOLUTE RIGHT SIDE OF THE SAME NAVIGATION ROW.
   This prevents it from ever dropping underneath.
---------------------------------------------------------- */

.pkp_navigation_primary_row .pkp_search,
.pkp_navigation_primary_wrapper .pkp_search{
    position:absolute!important;
    top:0!important;
    right:14px!important;

    display:flex!important;
    align-items:center!important;
    justify-content:center!important;

    width:auto!important;
    min-width:0!important;
    max-width:none!important;

    height:58px!important;
    min-height:58px!important;

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

    float:none!important;
    clear:none!important;

    background:transparent!important;
    border:0!important;
    box-shadow:none!important;

    z-index:9999!important;
}

.pkp_navigation_primary_row .pkp_search a,
.pkp_navigation_primary_row .pkp_search button,
.pkp_navigation_primary_row .pkp_search .search_prompt{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;

    width:auto!important;
    height:58px!important;
    min-height:58px!important;

    margin:0!important;
    padding:0 8px!important;

    background:transparent!important;
    border:0!important;
    box-shadow:none!important;

    color:#F36C0A!important;
    -webkit-text-fill-color:#F36C0A!important;

    font-family:Arial,Helvetica,sans-serif!important;
    font-size:14px!important;
    font-weight:700!important;
    line-height:1!important;
    white-space:nowrap!important;
    text-decoration:none!important;
}

.pkp_navigation_primary_row .pkp_search a:hover,
.pkp_navigation_primary_row .pkp_search button:hover,
.pkp_navigation_primary_row .pkp_search .search_prompt:hover{
    background:#F5F9F7!important;
    color:#034526!important;
    -webkit-text-fill-color:#034526!important;
}


/* ----------------------------------------------------------
   SEARCH ICON
---------------------------------------------------------- */

.pkp_navigation_primary_row .pkp_search a::before,
.pkp_navigation_primary_row .pkp_search button::before,
.pkp_navigation_primary_row .pkp_search .search_prompt::before{
    content:"\f002"!important;
    display:inline-block!important;
    margin-right:6px!important;

    font-family:"FontAwesome"!important;
    font-weight:normal!important;

    color:#F36C0A!important;
    -webkit-text-fill-color:#F36C0A!important;
}

.pkp_navigation_primary_row .pkp_search a:hover::before,
.pkp_navigation_primary_row .pkp_search button:hover::before,
.pkp_navigation_primary_row .pkp_search .search_prompt:hover::before{
    color:#034526!important;
    -webkit-text-fill-color:#034526!important;
}


/* ----------------------------------------------------------
   MENU ICONS
---------------------------------------------------------- */

.pkp_navigation_primary > li > a::before{
    display:inline-block!important;

    width:18px!important;
    min-width:18px!important;

    margin-right:7px!important;

    font-family:"FontAwesome"!important;
    font-weight:normal!important;
    font-style:normal!important;

    text-align:center!important;

    color:#F36C0A!important;
    -webkit-text-fill-color:#F36C0A!important;
}

.pkp_navigation_primary > li:nth-child(1) > a::before{
    content:"\f015"!important;
}

.pkp_navigation_primary > li:nth-child(2) > a::before{
    content:"\f02d"!important;
}

.pkp_navigation_primary > li:nth-child(3) > a::before{
    content:"\f187"!important;
}

.pkp_navigation_primary > li:nth-child(4) > a::before{
    content:"\f0a1"!important;
}

.pkp_navigation_primary > li:nth-child(5) > a::before{
    content:"\f0c0"!important;
}


/* ----------------------------------------------------------
   ABOUT DROPDOWN
---------------------------------------------------------- */

.pkp_navigation_primary .dropdown-menu{
    background:#FFFFFF!important;
    border:1px solid #F2C6A8!important;
    box-shadow:0 10px 24px rgba(11,37,58,.14)!important;
}

.pkp_navigation_primary .dropdown-menu > li > a,
.pkp_navigation_primary .dropdown-menu > li > a *,
.pkp_navigation_primary .dropdown-menu a{
    background:#FFFFFF!important;
    color:#F36C0A!important;
    -webkit-text-fill-color:#F36C0A!important;
}

.pkp_navigation_primary .dropdown-menu > li > a:hover{
    background:#F5F9F7!important;
    color:#034526!important;
    -webkit-text-fill-color:#034526!important;
}


/* ----------------------------------------------------------
   WHITE OUTER SIDES
---------------------------------------------------------- */

html,
body,
.pkp_structure_page,
.pkp_structure_head{
    background:#FFFFFF!important;
    background-image:none!important;
}

.pkp_structure_page{
    max-width:none!important;
    box-shadow:none!important;
}


/* ----------------------------------------------------------
   RESPONSIVE
---------------------------------------------------------- */

@media (max-width:900px){

    .pkp_navigation_user_wrapper{
        transform:translateY(-285px)!important;
        right:10px!important;
    }

    .pkp_navigation_user{
        gap:14px!important;
    }

    .pkp_navigation_user > li > a{
        font-size:13px!important;
    }

    .pkp_navigation_primary > li > a{
        padding:0 8px!important;
        font-size:13px!important;
    }

    .pkp_navigation_primary_row .pkp_search{
        right:8px!important;
    }
}

@media (max-width:600px){

    .pkp_navigation_user_wrapper{
        transform:translateY(-235px)!important;
        right:8px!important;
    }

    .pkp_navigation_user{
        gap:10px!important;
    }

    .pkp_navigation_user > li > a{
        font-size:12px!important;
    }

    .pkp_navigation_primary > li > a{
        height:52px!important;
        min-height:52px!important;
        padding:0 7px!important;
        font-size:12px!important;
    }

    .pkp_navigation_primary_row .pkp_search{
        height:52px!important;
        min-height:52px!important;
    }

    .pkp_navigation_primary_row .pkp_search a,
    .pkp_navigation_primary_row .pkp_search button,
    .pkp_navigation_primary_row .pkp_search .search_prompt{
        height:52px!important;
        min-height:52px!important;
        font-size:12px!important;
    }
}


/* ==========================================================
   PEKA HEADER V4 — REGISTER / LOGIN DEFINITIVE POSITION
   Place Register + Login at the TOP-RIGHT of the WHITE LOGO
   AREA, exactly like the JSA reference.

   IMPORTANT:
   Do NOT use translateY() because the previous version
   moved the element outside its visible containing area.
========================================================== */

/* Header must provide the positioning context */
.pkp_structure_head,
.pkp_head_wrapper,
.pkp_site_name_wrapper{
    position:relative!important;
    overflow:visible!important;
}

/* Register / Login wrapper */
.pkp_structure_head .pkp_navigation_user_wrapper,
.pkp_head_wrapper .pkp_navigation_user_wrapper,
.pkp_site_name_wrapper .pkp_navigation_user_wrapper{
    position:absolute!important;

    /* JSA-like top-right placement */
    top:14px!important;
    right:20px!important;

    /* cancel the previous V3 displacement */
    transform:none!important;

    z-index:999999!important;

    display:block!important;
    width:auto!important;
    height:auto!important;

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

    background:transparent!important;
    border:0!important;
    box-shadow:none!important;

    visibility:visible!important;
    opacity:1!important;
}

/* User menu itself */
.pkp_structure_head .pkp_navigation_user,
.pkp_head_wrapper .pkp_navigation_user,
.pkp_site_name_wrapper .pkp_navigation_user{
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:flex-end!important;

    width:auto!important;
    height:auto!important;

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

    gap:24px!important;

    background:transparent!important;
    border:0!important;
    box-shadow:none!important;

    list-style:none!important;

    visibility:visible!important;
    opacity:1!important;
}

/* Individual Register / Login */
.pkp_structure_head .pkp_navigation_user > li,
.pkp_head_wrapper .pkp_navigation_user > li,
.pkp_site_name_wrapper .pkp_navigation_user > li{
    display:block!important;
    width:auto!important;
    height:auto!important;

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

    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
}

.pkp_structure_head .pkp_navigation_user > li > a,
.pkp_head_wrapper .pkp_navigation_user > li > a,
.pkp_site_name_wrapper .pkp_navigation_user > li > a{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;

    width:auto!important;
    height:auto!important;
    min-height:0!important;

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

    background:transparent!important;
    background-image:none!important;

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

    box-shadow:none!important;

    color:#F36C0A!important;
    -webkit-text-fill-color:#F36C0A!important;

    font-family:Arial,Helvetica,sans-serif!important;
    font-size:14px!important;
    font-weight:700!important;
    line-height:1.2!important;

    text-decoration:none!important;
    white-space:nowrap!important;

    visibility:visible!important;
    opacity:1!important;
}

.pkp_structure_head .pkp_navigation_user > li > a:hover,
.pkp_head_wrapper .pkp_navigation_user > li > a:hover,
.pkp_site_name_wrapper .pkp_navigation_user > li > a:hover{
    background:transparent!important;
    background-image:none!important;
    border:0!important;
    box-shadow:none!important;

    color:#034526!important;
    -webkit-text-fill-color:#034526!important;
}

/* Icons for Register and Login, like JSA */
.pkp_structure_head .pkp_navigation_user > li:first-child > a::before,
.pkp_head_wrapper .pkp_navigation_user > li:first-child > a::before,
.pkp_site_name_wrapper .pkp_navigation_user > li:first-child > a::before{
    content:"\f234"!important;
    display:inline-block!important;
    margin-right:5px!important;
    font-family:"FontAwesome"!important;
    font-weight:normal!important;
    color:#F36C0A!important;
    -webkit-text-fill-color:#F36C0A!important;
}

.pkp_structure_head .pkp_navigation_user > li:last-child > a::before,
.pkp_head_wrapper .pkp_navigation_user > li:last-child > a::before,
.pkp_site_name_wrapper .pkp_navigation_user > li:last-child > a::before{
    content:"\f090"!important;
    display:inline-block!important;
    margin-right:5px!important;
    font-family:"FontAwesome"!important;
    font-weight:normal!important;
    color:#F36C0A!important;
    -webkit-text-fill-color:#F36C0A!important;
}


/* ----------------------------------------------------------
   Keep navigation Search on the SAME row
---------------------------------------------------------- */

.pkp_navigation_primary_row .pkp_search{
    position:absolute!important;
    top:0!important;
    right:14px!important;
    transform:none!important;

    display:flex!important;
    align-items:center!important;
    height:58px!important;
    min-height:58px!important;

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

    background:transparent!important;
    border:0!important;
    box-shadow:none!important;

    z-index:9999!important;
}


/* ----------------------------------------------------------
   Desktop exact spacing
---------------------------------------------------------- */

@media (min-width:901px){

    .pkp_structure_head .pkp_navigation_user_wrapper,
    .pkp_head_wrapper .pkp_navigation_user_wrapper,
    .pkp_site_name_wrapper .pkp_navigation_user_wrapper{
        top:14px!important;
        right:20px!important;
        transform:none!important;
    }

}


/* ----------------------------------------------------------
   Tablet
---------------------------------------------------------- */

@media (max-width:900px){

    .pkp_structure_head .pkp_navigation_user_wrapper,
    .pkp_head_wrapper .pkp_navigation_user_wrapper,
    .pkp_site_name_wrapper .pkp_navigation_user_wrapper{
        top:10px!important;
        right:12px!important;
        transform:none!important;
    }

    .pkp_structure_head .pkp_navigation_user,
    .pkp_head_wrapper .pkp_navigation_user,
    .pkp_site_name_wrapper .pkp_navigation_user{
        gap:14px!important;
    }

}


/* ----------------------------------------------------------
   Mobile
---------------------------------------------------------- */

@media (max-width:600px){

    .pkp_structure_head .pkp_navigation_user_wrapper,
    .pkp_head_wrapper .pkp_navigation_user_wrapper,
    .pkp_site_name_wrapper .pkp_navigation_user_wrapper{
        top:8px!important;
        right:8px!important;
        transform:none!important;
    }

    .pkp_structure_head .pkp_navigation_user,
    .pkp_head_wrapper .pkp_navigation_user,
    .pkp_site_name_wrapper .pkp_navigation_user{
        gap:10px!important;
    }

    .pkp_structure_head .pkp_navigation_user > li > a,
    .pkp_head_wrapper .pkp_navigation_user > li > a,
    .pkp_site_name_wrapper .pkp_navigation_user > li > a{
        font-size:12px!important;
    }
}


/* ==========================================================
   PEKA HEADER V5 — JSA-STYLE REGISTER / LOGIN AT VERY TOP
   ----------------------------------------------------------
   Goal:
   - Register + Login are ONLY in the white logo/header area.
   - Search stays ONLY in the navigation row.
   - Register/Login never overlap Search.
   - No transform displacement.
   - No button/box styling.
========================================================== */

/* The actual header is the positioning context */
.pkp_structure_head{
    position:relative!important;
    width:100%!important;
    background:#FFFFFF!important;
    overflow:visible!important;
}

.pkp_structure_head .pkp_head_wrapper{
    position:relative!important;
    width:100%!important;
    max-width:1160px!important;
    min-height:205px!important;
    margin:0 auto!important;
    padding:0 20px!important;
    box-sizing:border-box!important;
    background:#FFFFFF!important;
    overflow:visible!important;
}

/* ----------------------------------------------------------
   REGISTER + LOGIN
   Put them at the TOP-RIGHT of the complete header wrapper.
   This is independent of the navigation row.
---------------------------------------------------------- */

.pkp_structure_head .pkp_head_wrapper > .pkp_navigation_user_wrapper,
.pkp_structure_head .pkp_head_wrapper .pkp_navigation_user_wrapper{
    position:absolute!important;

    top:12px!important;
    right:20px!important;

    transform:none!important;
    float:none!important;
    clear:none!important;

    display:block!important;

    width:auto!important;
    max-width:none!important;
    height:auto!important;
    min-height:0!important;

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

    background:transparent!important;
    background-image:none!important;

    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;

    z-index:1000000!important;

    visibility:visible!important;
    opacity:1!important;
}

/* User list */
.pkp_structure_head .pkp_head_wrapper .pkp_navigation_user{
    position:relative!important;

    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:flex-end!important;

    width:auto!important;
    max-width:none!important;
    height:auto!important;
    min-height:0!important;

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

    gap:24px!important;

    list-style:none!important;

    background:transparent!important;
    border:0!important;
    box-shadow:none!important;

    visibility:visible!important;
    opacity:1!important;
}

/* User items */
.pkp_structure_head .pkp_head_wrapper .pkp_navigation_user > li{
    display:block!important;
    position:relative!important;

    width:auto!important;
    height:auto!important;
    min-height:0!important;

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

    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
}

/* Register / Login links */
.pkp_structure_head .pkp_head_wrapper .pkp_navigation_user > li > a{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;

    width:auto!important;
    height:auto!important;
    min-height:0!important;

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

    background:transparent!important;
    background-image:none!important;

    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;

    color:#F36C0A!important;
    -webkit-text-fill-color:#F36C0A!important;

    font-family:Arial,Helvetica,sans-serif!important;
    font-size:14px!important;
    font-weight:700!important;
    line-height:1.2!important;

    text-decoration:none!important;
    white-space:nowrap!important;
}

.pkp_structure_head .pkp_head_wrapper .pkp_navigation_user > li > a:hover{
    background:transparent!important;
    color:#034526!important;
    -webkit-text-fill-color:#034526!important;
}

/* Register icon */
.pkp_structure_head .pkp_head_wrapper .pkp_navigation_user > li:first-child > a::before{
    content:"\f234"!important;
    display:inline-block!important;
    margin-right:5px!important;

    font-family:"FontAwesome"!important;
    font-weight:normal!important;

    color:#F36C0A!important;
    -webkit-text-fill-color:#F36C0A!important;
}

/* Login icon */
.pkp_structure_head .pkp_head_wrapper .pkp_navigation_user > li:last-child > a::before{
    content:"\f090"!important;
    display:inline-block!important;
    margin-right:5px!important;

    font-family:"FontAwesome"!important;
    font-weight:normal!important;

    color:#F36C0A!important;
    -webkit-text-fill-color:#F36C0A!important;
}


/* ----------------------------------------------------------
   ABSOLUTELY REMOVE USER MENU FROM NAVIGATION FLOW
---------------------------------------------------------- */

.pkp_navigation_primary_row .pkp_navigation_user_wrapper{
    position:absolute!important;

    top:auto!important;
    right:auto!important;

    transform:none!important;

    width:0!important;
    height:0!important;
    min-height:0!important;

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

    overflow:visible!important;

    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
}


/* ----------------------------------------------------------
   SEARCH — REMAINS ON THE SAME NAVIGATION ROW
---------------------------------------------------------- */

.pkp_navigation_primary_row{
    position:relative!important;
    display:flex!important;
    align-items:center!important;
    flex-wrap:nowrap!important;
    overflow:visible!important;
}

.pkp_navigation_primary_row .pkp_search{
    position:absolute!important;

    top:0!important;
    right:14px!important;

    display:flex!important;
    align-items:center!important;
    justify-content:center!important;

    width:auto!important;
    height:58px!important;
    min-height:58px!important;

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

    float:none!important;
    clear:none!important;

    background:transparent!important;
    border:0!important;
    box-shadow:none!important;

    z-index:9999!important;
}


/* ----------------------------------------------------------
   JSA-LIKE WHITE SPACE
   Register/Login sit above the centered logo.
---------------------------------------------------------- */

.pkp_structure_head .pkp_site_name_wrapper{
    position:relative!important;
    z-index:1!important;
    background:#FFFFFF!important;
    overflow:visible!important;
}

.pkp_structure_head .pkp_site_name{
    position:relative!important;
    z-index:1!important;
    background:#FFFFFF!important;
}


/* ----------------------------------------------------------
   RESPONSIVE
---------------------------------------------------------- */

@media (min-width:901px){

    .pkp_structure_head .pkp_head_wrapper .pkp_navigation_user_wrapper{
        top:12px!important;
        right:20px!important;
        transform:none!important;
    }

}

@media (max-width:900px){

    .pkp_structure_head .pkp_head_wrapper{
        min-height:170px!important;
    }

    .pkp_structure_head .pkp_head_wrapper .pkp_navigation_user_wrapper{
        top:10px!important;
        right:12px!important;
        transform:none!important;
    }

    .pkp_structure_head .pkp_head_wrapper .pkp_navigation_user{
        gap:14px!important;
    }

    .pkp_structure_head .pkp_head_wrapper .pkp_navigation_user > li > a{
        font-size:13px!important;
    }

}

@media (max-width:600px){

    .pkp_structure_head .pkp_head_wrapper{
        min-height:145px!important;
    }

    .pkp_structure_head .pkp_head_wrapper .pkp_navigation_user_wrapper{
        top:8px!important;
        right:8px!important;
        transform:none!important;
    }

    .pkp_structure_head .pkp_head_wrapper .pkp_navigation_user{
        gap:10px!important;
    }

    .pkp_structure_head .pkp_head_wrapper .pkp_navigation_user > li > a{
        font-size:12px!important;
    }

}


/* ==========================================================
   PEKA V6 — DEFINITIVE FIX
   Root cause:
   .pkp_navigation_user_wrapper is INSIDE .pkp_site_nav_menu.
   The previous CSS positioned .pkp_site_nav_menu as relative,
   so Register/Login were positioned relative to the NAV ROW,
   not relative to the white header.

   Fix:
   1. Make .pkp_structure_head the positioning context.
   2. Make .pkp_site_nav_menu static.
   3. Position .pkp_navigation_user_wrapper absolutely
      against .pkp_structure_head.
   4. Keep .pkp_search inside the navigation row.
========================================================== */

/* 1. Header becomes the ONLY positioning context for the user menu */
.pkp_structure_head{
    position:relative!important;
    overflow:visible!important;
    z-index:100!important;
}

/* 2. IMPORTANT: remove the navigation menu as the containing block */
.pkp_structure_head .pkp_site_nav_menu{
    position:static!important;
    top:auto!important;
    left:auto!important;
    right:auto!important;
    bottom:auto!important;
    overflow:visible!important;
}

/* 3. User menu is inside .pkp_site_nav_menu in OJS,
      but is now positioned relative to .pkp_structure_head */
.pkp_structure_head .pkp_navigation_user_wrapper{
    position:absolute!important;
    top:12px!important;
    right:20px!important;
    left:auto!important;
    bottom:auto!important;

    width:auto!important;
    height:auto!important;
    min-width:0!important;
    min-height:0!important;

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

    transform:none!important;
    float:none!important;
    clear:none!important;

    display:block!important;
    visibility:visible!important;
    opacity:1!important;

    background:transparent!important;
    background-image:none!important;
    border:0!important;
    box-shadow:none!important;

    z-index:1000000!important;
}

/* 4. User links: horizontal, plain text, orange */
.pkp_structure_head .pkp_navigation_user_wrapper .pkp_navigation_user{
    position:relative!important;
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:flex-end!important;

    width:auto!important;
    height:auto!important;
    min-height:0!important;

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

    gap:22px!important;
    list-style:none!important;

    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
}

.pkp_structure_head .pkp_navigation_user_wrapper .pkp_navigation_user > li{
    display:block!important;
    position:relative!important;
    width:auto!important;
    height:auto!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    background:transparent!important;
    border:0!important;
}

.pkp_structure_head .pkp_navigation_user_wrapper .pkp_navigation_user > li > a{
    display:inline-flex!important;
    align-items:center!important;
    width:auto!important;
    height:auto!important;
    min-height:0!important;

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

    background:transparent!important;
    border:0!important;
    box-shadow:none!important;

    color:#F36C0A!important;
    -webkit-text-fill-color:#F36C0A!important;

    font-family:Arial,Helvetica,sans-serif!important;
    font-size:14px!important;
    font-weight:700!important;
    line-height:1.2!important;
    text-decoration:none!important;
    white-space:nowrap!important;
}

.pkp_structure_head .pkp_navigation_user_wrapper .pkp_navigation_user > li > a:hover{
    background:transparent!important;
    color:#034526!important;
    -webkit-text-fill-color:#034526!important;
}

/* 5. Icons */
.pkp_structure_head .pkp_navigation_user_wrapper .pkp_navigation_user > li:first-child > a::before{
    content:"\f234"!important;
    display:inline-block!important;
    margin-right:5px!important;
    font-family:"FontAwesome"!important;
    font-weight:normal!important;
    color:#F36C0A!important;
    -webkit-text-fill-color:#F36C0A!important;
}

.pkp_structure_head .pkp_navigation_user_wrapper .pkp_navigation_user > li:last-child > a::before{
    content:"\f090"!important;
    display:inline-block!important;
    margin-right:5px!important;
    font-family:"FontAwesome"!important;
    font-weight:normal!important;
    color:#F36C0A!important;
    -webkit-text-fill-color:#F36C0A!important;
}

/* 6. Search is independent and stays in the navigation row */
.pkp_structure_head .pkp_navigation_primary_row{
    position:relative!important;
    display:flex!important;
    align-items:center!important;
    flex-wrap:nowrap!important;
    overflow:visible!important;
}

.pkp_structure_head .pkp_navigation_primary_row .pkp_search{
    position:absolute!important;
    top:0!important;
    right:14px!important;

    display:flex!important;
    align-items:center!important;
    justify-content:center!important;

    width:auto!important;
    height:58px!important;
    min-height:58px!important;

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

    float:none!important;
    clear:none!important;

    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
    z-index:9999!important;
}

/* 7. Desktop/tablet */
@media (min-width:901px){
    .pkp_structure_head .pkp_navigation_user_wrapper{
        top:12px!important;
        right:20px!important;
    }
}

/* 8. Mobile */
@media (max-width:900px){
    .pkp_structure_head .pkp_navigation_user_wrapper{
        top:10px!important;
        right:12px!important;
    }

    .pkp_structure_head .pkp_navigation_user_wrapper .pkp_navigation_user{
        gap:14px!important;
    }

    .pkp_structure_head .pkp_navigation_user_wrapper .pkp_navigation_user > li > a{
        font-size:13px!important;
    }
}

@media (max-width:600px){
    .pkp_structure_head .pkp_navigation_user_wrapper{
        top:8px!important;
        right:8px!important;
    }

    .pkp_structure_head .pkp_navigation_user_wrapper .pkp_navigation_user{
        gap:10px!important;
    }

    .pkp_structure_head .pkp_navigation_user_wrapper .pkp_navigation_user > li > a{
        font-size:12px!important;
    }
}

/* ==========================================================
   V7 — FORCE SEARCH TO MATCH HOME MENU
   Search text and icon use exactly the same PEKA orange,
   font family and font weight as the primary navigation.
   ========================================================== */

.pkp_structure_head .pkp_site_nav_menu .pkp_navigation_primary_row .pkp_search,
.pkp_structure_head .pkp_site_nav_menu .pkp_navigation_primary_row .pkp_search *,
.pkp_structure_head .pkp_site_nav_menu .pkp_navigation_primary_row .pkp_search a,
.pkp_structure_head .pkp_site_nav_menu .pkp_navigation_primary_row .pkp_search a span,
.pkp_structure_head .pkp_site_nav_menu .pkp_navigation_primary_row .pkp_search button,
.pkp_structure_head .pkp_site_nav_menu .pkp_navigation_primary_row .pkp_search .search_prompt,
.pkp_structure_head .pkp_site_nav_menu .pkp_navigation_primary_row .pkp_search .search_prompt span{
    color:#F36C0A!important;
    -webkit-text-fill-color:#F36C0A!important;
    font-family:Arial,Helvetica,sans-serif!important;
    font-size:14px!important;
    font-weight:700!important;
    line-height:1.25!important;
    text-decoration:none!important;
    text-shadow:none!important;
    opacity:1!important;
    visibility:visible!important;
}

.pkp_structure_head .pkp_site_nav_menu .pkp_navigation_primary_row .pkp_search a::before,
.pkp_structure_head .pkp_site_nav_menu .pkp_navigation_primary_row .pkp_search button::before,
.pkp_structure_head .pkp_site_nav_menu .pkp_navigation_primary_row .pkp_search .search_prompt::before{
    color:#F36C0A!important;
    -webkit-text-fill-color:#F36C0A!important;
    font-family:"FontAwesome"!important;
    font-weight:normal!important;
}

.pkp_structure_head .pkp_site_nav_menu .pkp_navigation_primary_row .pkp_search a:hover,
.pkp_structure_head .pkp_site_nav_menu .pkp_navigation_primary_row .pkp_search button:hover,
.pkp_structure_head .pkp_site_nav_menu .pkp_navigation_primary_row .pkp_search .search_prompt:hover,
.pkp_structure_head .pkp_site_nav_menu .pkp_navigation_primary_row .pkp_search a:hover span{
    color:#F36C0A!important;
    -webkit-text-fill-color:#F36C0A!important;
    background:transparent!important;
}

.pkp_structure_head .pkp_site_nav_menu .pkp_navigation_primary_row .pkp_search a:hover::before,
.pkp_structure_head .pkp_site_nav_menu .pkp_navigation_primary_row .pkp_search button:hover::before,
.pkp_structure_head .pkp_site_nav_menu .pkp_navigation_primary_row .pkp_search .search_prompt:hover::before{
    color:#F36C0A!important;
    -webkit-text-fill-color:#F36C0A!important;
}

/* Match the primary menu spacing/appearance */
.pkp_structure_head .pkp_site_nav_menu .pkp_navigation_primary_row .pkp_search a,
.pkp_structure_head .pkp_site_nav_menu .pkp_navigation_primary_row .pkp_search button,
.pkp_structure_head .pkp_site_nav_menu .pkp_navigation_primary_row .pkp_search .search_prompt{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:58px!important;
    padding:0 8px!important;
    box-sizing:border-box!important;
}

/* ==========================================================
   V8 — RESTORE ORIGINAL OJS SEARCH GLASS ICON
   The OJS search link already contains <span class="fa fa-search">.
   Keep that FontAwesome span intact; do not replace it with a
   pseudo-element and do not force Arial onto the icon span.
   ========================================================== */

.pkp_structure_head .pkp_site_nav_menu .pkp_navigation_primary_row .pkp_search .fa,
.pkp_structure_head .pkp_site_nav_menu .pkp_navigation_primary_row .pkp_search .fa-search,
.pkp_navigation_primary_row .pkp_search a > .fa-search,
.pkp_navigation_primary_row .pkp_search a > span.fa-search{
    display:inline-block!important;
    font-family:"FontAwesome"!important;
    font-size:14px!important;
    font-weight:normal!important;
    line-height:1!important;
    color:#F36C0A!important;
    -webkit-text-fill-color:#F36C0A!important;
    width:auto!important;
    min-width:0!important;
    margin:0 6px 0 0!important;
    padding:0!important;
    text-indent:0!important;
}

/* Use the native OJS FontAwesome icon, not a CSS-generated square/icon. */
.pkp_structure_head .pkp_site_nav_menu .pkp_navigation_primary_row .pkp_search a::before,
.pkp_structure_head .pkp_site_nav_menu .pkp_navigation_primary_row .pkp_search button::before,
.pkp_structure_head .pkp_site_nav_menu .pkp_navigation_primary_row .pkp_search .search_prompt::before{
    content:none!important;
    display:none!important;
}

/* Search text remains identical to HOME. */
.pkp_structure_head .pkp_site_nav_menu .pkp_navigation_primary_row .pkp_search a,
.pkp_structure_head .pkp_site_nav_menu .pkp_navigation_primary_row .pkp_search button,
.pkp_structure_head .pkp_site_nav_menu .pkp_navigation_primary_row .pkp_search .search_prompt{
    color:#F36C0A!important;
    -webkit-text-fill-color:#F36C0A!important;
    font-family:Arial,Helvetica,sans-serif!important;
    font-size:14px!important;
    font-weight:700!important;
    line-height:1.25!important;
    text-decoration:none!important;
}

.pkp_structure_head .pkp_site_nav_menu .pkp_navigation_primary_row .pkp_search a:hover,
.pkp_structure_head .pkp_site_nav_menu .pkp_navigation_primary_row .pkp_search button:hover,
.pkp_structure_head .pkp_site_nav_menu .pkp_navigation_primary_row .pkp_search .search_prompt:hover{
    color:#F36C0A!important;
    -webkit-text-fill-color:#F36C0A!important;
    background:transparent!important;
}

.pkp_structure_head .pkp_site_nav_menu .pkp_navigation_primary_row .pkp_search .fa-search:hover{
    color:#F36C0A!important;
    -webkit-text-fill-color:#F36C0A!important;
}


/* ==========================================================
   PEKA V9 — RESTORE HERO BUTTON ANIMATION
   Restores animation for:
   - Submit Manuscript
   - Author Guidelines
   - Current Issue
   - View Current Issue

   Animation uses box-shadow pulse + diagonal shine.
   It does not override the button's existing colors/layout.
   ========================================================== */

.peka2026-buttons a.peka2026-btn,
.peka2026-btn,
.peka2026-btn-primary,
.peka2026-btn-outline{
    position:relative!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    overflow:hidden!important;
    isolation:isolate!important;
    animation:pekaButtonPulse 3s ease-in-out infinite!important;
    transition:
        transform .35s ease,
        box-shadow .35s ease,
        background-color .35s ease,
        color .35s ease,
        border-color .35s ease!important;
}

/* Moving light sweep */
.peka2026-buttons a.peka2026-btn::after,
.peka2026-btn::after,
.peka2026-btn-primary::after,
.peka2026-btn-outline::after{
    content:""!important;
    position:absolute!important;
    top:-20%!important;
    left:-130%!important;
    width:42%!important;
    height:140%!important;
    z-index:0!important;
    pointer-events:none!important;
    background:linear-gradient(
        100deg,
        transparent 0%,
        rgba(255,255,255,0.08) 25%,
        rgba(255,255,255,0.68) 50%,
        rgba(255,255,255,0.08) 75%,
        transparent 100%
    )!important;
    transform:skewX(-24deg)!important;
    animation:pekaButtonShine 3.2s linear infinite!important;
}

/* Keep button text/icons above the shine layer */
.peka2026-buttons a.peka2026-btn > *,
.peka2026-btn > *,
.peka2026-btn-primary > *,
.peka2026-btn-outline > *{
    position:relative!important;
    z-index:2!important;
}

/* Subtle breathing/pulse without fighting hover transform */
@keyframes pekaButtonPulse{
    0%,100%{
        box-shadow:0 6px 16px rgba(11,37,58,.12);
    }
    50%{
        box-shadow:0 10px 26px rgba(11,37,58,.28);
    }
}

@keyframes pekaButtonShine{
    0%{
        left:-130%;
    }
    100%{
        left:165%;
    }
}

/* Stronger hover interaction */
.peka2026-buttons a.peka2026-btn:hover,
.peka2026-btn:hover,
.peka2026-btn-primary:hover,
.peka2026-btn-outline:hover{
    transform:translateY(-4px)!important;
    animation-play-state:paused!important;
}

/* Stop the sweep while the pointer is over the button */
.peka2026-buttons a.peka2026-btn:hover::after,
.peka2026-btn:hover::after,
.peka2026-btn-primary:hover::after,
.peka2026-btn-outline:hover::after{
    animation-play-state:paused!important;
}

/* Accessibility: respect reduced-motion preference */
@media (prefers-reduced-motion:reduce){
    .peka2026-buttons a.peka2026-btn,
    .peka2026-btn,
    .peka2026-btn-primary,
    .peka2026-btn-outline,
    .peka2026-buttons a.peka2026-btn::after,
    .peka2026-btn::after,
    .peka2026-btn-primary::after,
    .peka2026-btn-outline::after{
        animation:none!important;
        transition:none!important;
    }
}


/* ==========================================================
   PEKA — ARTICLE TITLE ORANGE
   Current Issue / Archives
   Added without changing existing V9 rules
========================================================== */

.obj_article_summary .title,
.obj_article_summary .title a,
.obj_article_summary h3.title,
.obj_article_summary h3.title a,
.issue-toc .obj_article_summary .title,
.issue-toc .obj_article_summary .title a {
    color:#F36C0A!important;
    -webkit-text-fill-color:#F36C0A!important;
    font-family:Arial,Helvetica,sans-serif!important;
    font-weight:700!important;
    text-decoration:none!important;
    opacity:1!important;
    visibility:visible!important;
}

.obj_article_summary .title a:hover,
.obj_article_summary h3.title a:hover,
.issue-toc .obj_article_summary .title a:hover {
    color:#034526!important;
    -webkit-text-fill-color:#034526!important;
    text-decoration:none!important;
}


/* ==========================================================
   PEKA V10 — ENLARGE HEADER / LOGO
   Purpose:
   - Make the PEKA logo substantially larger
   - Keep Register/Login at the top-right
   - Keep navigation unchanged
   - Preserve responsive behavior
========================================================== */

/* Desktop: larger logo area */
@media (min-width:901px){

    .pkp_structure_head .pkp_head_wrapper{
        min-height:220px!important;
    }

    .pkp_structure_head .pkp_site_name_wrapper{
        min-height:220px!important;
    }

    .pkp_structure_head .pkp_site_name{
        min-height:220px!important;
        padding:42px 0 28px!important;
    }

    .pkp_structure_head .pkp_site_name img{
        display:block!important;
        width:760px!important;
        max-width:calc(100% - 40px)!important;
        height:auto!important;
        max-height:none!important;
        margin:0 auto!important;
        transform:none!important;
        filter:none!important;
    }
}

/* Tablet */
@media (min-width:601px) and (max-width:900px){

    .pkp_structure_head .pkp_head_wrapper{
        min-height:185px!important;
    }

    .pkp_structure_head .pkp_site_name_wrapper{
        min-height:185px!important;
    }

    .pkp_structure_head .pkp_site_name{
        min-height:185px!important;
        padding:34px 0 22px!important;
    }

    .pkp_structure_head .pkp_site_name img{
        display:block!important;
        width:620px!important;
        max-width:calc(100% - 30px)!important;
        height:auto!important;
        max-height:none!important;
        margin:0 auto!important;
        transform:none!important;
    }
}

/* Mobile */
@media (max-width:600px){

    .pkp_structure_head .pkp_head_wrapper{
        min-height:150px!important;
    }

    .pkp_structure_head .pkp_site_name_wrapper{
        min-height:150px!important;
    }

    .pkp_structure_head .pkp_site_name{
        min-height:150px!important;
        padding:28px 0 16px!important;
    }

    .pkp_structure_head .pkp_site_name img{
        display:block!important;
        width:520px!important;
        max-width:calc(100% - 24px)!important;
        height:auto!important;
        max-height:none!important;
        margin:0 auto!important;
        transform:none!important;
    }
}

/* Keep top Register/Login safely above the enlarged logo */
@media (min-width:901px){
    .pkp_structure_head .pkp_navigation_user_wrapper{
        top:12px!important;
        right:20px!important;
        z-index:1000000!important;
    }
}


/* ==========================================================
   PEKA V11 — EXTRA LARGE HEADER LOGO
   Based on V10.
   Desktop logo enlarged substantially while keeping
   Register/Login and navigation positions unchanged.
========================================================== */

@media (min-width:901px){

    /* Increase the white header area */
    .pkp_structure_head .pkp_head_wrapper{
        min-height:270px!important;
    }

    .pkp_structure_head .pkp_site_name_wrapper{
        min-height:270px!important;
    }

    .pkp_structure_head .pkp_site_name{
        min-height:270px!important;
        padding:52px 0 34px!important;
    }

    /* Extra-large PEKA logo */
    .pkp_structure_head .pkp_site_name img{
        display:block!important;
        width:950px!important;
        max-width:calc(100% - 30px)!important;
        height:auto!important;
        max-height:none!important;
        margin:0 auto!important;
        transform:none!important;
        filter:none!important;
    }

    /* Keep Register/Login in the top-right */
    .pkp_structure_head .pkp_navigation_user_wrapper{
        top:12px!important;
        right:20px!important;
        z-index:1000000!important;
    }
}

/* Tablet — proportionally larger */
@media (min-width:601px) and (max-width:900px){

    .pkp_structure_head .pkp_head_wrapper{
        min-height:210px!important;
    }

    .pkp_structure_head .pkp_site_name_wrapper{
        min-height:210px!important;
    }

    .pkp_structure_head .pkp_site_name{
        min-height:210px!important;
        padding:38px 0 24px!important;
    }

    .pkp_structure_head .pkp_site_name img{
        display:block!important;
        width:760px!important;
        max-width:calc(100% - 24px)!important;
        height:auto!important;
        max-height:none!important;
        margin:0 auto!important;
        transform:none!important;
    }
}

/* Mobile — larger but still constrained to viewport */
@media (max-width:600px){

    .pkp_structure_head .pkp_head_wrapper{
        min-height:170px!important;
    }

    .pkp_structure_head .pkp_site_name_wrapper{
        min-height:170px!important;
    }

    .pkp_structure_head .pkp_site_name{
        min-height:170px!important;
        padding:30px 0 18px!important;
    }

    .pkp_structure_head .pkp_site_name img{
        display:block!important;
        width:650px!important;
        max-width:calc(100% - 18px)!important;
        height:auto!important;
        max-height:none!important;
        margin:0 auto!important;
        transform:none!important;
    }
}


/* ==========================================================
   PEKA V12 — LARGER LOGO + LOWER HEADER
   Desktop:
   - Logo enlarged to 1050px
   - Header reduced from 270px to 230px
   - Tighter vertical padding
   - Register/Login remain at top-right
   - Navigation position remains unchanged
========================================================== */

@media (min-width:901px){

    .pkp_structure_head .pkp_head_wrapper{
        min-height:230px!important;
    }

    .pkp_structure_head .pkp_site_name_wrapper{
        min-height:230px!important;
    }

    .pkp_structure_head .pkp_site_name{
        min-height:230px!important;
        padding:30px 0 18px!important;
    }

    .pkp_structure_head .pkp_site_name img{
        display:block!important;
        width:1050px!important;
        max-width:calc(100% - 20px)!important;
        height:auto!important;
        max-height:none!important;
        margin:0 auto!important;
        transform:none!important;
        filter:none!important;
    }

    .pkp_structure_head .pkp_navigation_user_wrapper{
        top:10px!important;
        right:20px!important;
        z-index:1000000!important;
    }
}

/* Tablet */
@media (min-width:601px) and (max-width:900px){

    .pkp_structure_head .pkp_head_wrapper{
        min-height:190px!important;
    }

    .pkp_structure_head .pkp_site_name_wrapper{
        min-height:190px!important;
    }

    .pkp_structure_head .pkp_site_name{
        min-height:190px!important;
        padding:28px 0 16px!important;
    }

    .pkp_structure_head .pkp_site_name img{
        display:block!important;
        width:820px!important;
        max-width:calc(100% - 20px)!important;
        height:auto!important;
        max-height:none!important;
        margin:0 auto!important;
        transform:none!important;
    }
}

/* Mobile */
@media (max-width:600px){

    .pkp_structure_head .pkp_head_wrapper{
        min-height:155px!important;
    }

    .pkp_structure_head .pkp_site_name_wrapper{
        min-height:155px!important;
    }

    .pkp_structure_head .pkp_site_name{
        min-height:155px!important;
        padding:25px 0 14px!important;
    }

    .pkp_structure_head .pkp_site_name img{
        display:block!important;
        width:680px!important;
        max-width:calc(100% - 14px)!important;
        height:auto!important;
        max-height:none!important;
        margin:0 auto!important;
        transform:none!important;
    }
}


/* ==========================================================
   PEKA V13 — HEADER HEIGHT 190PX
   Logo size preserved from V12 (1050px desktop)
   Only the header height/vertical spacing is reduced.
========================================================== */

@media (min-width:901px){

    .pkp_structure_head .pkp_head_wrapper{
        min-height:190px!important;
    }

    .pkp_structure_head .pkp_site_name_wrapper{
        min-height:190px!important;
    }

    .pkp_structure_head .pkp_site_name{
        min-height:190px!important;
        padding:20px 0 10px!important;
    }

    /* Keep V12 logo size */
    .pkp_structure_head .pkp_site_name img{
        width:1050px!important;
        max-width:calc(100% - 20px)!important;
        max-height:none!important;
        height:auto!important;
        margin:0 auto!important;
    }

    .pkp_structure_head .pkp_navigation_user_wrapper{
        top:10px!important;
        right:20px!important;
    }
}

/* Tablet */
@media (min-width:601px) and (max-width:900px){

    .pkp_structure_head .pkp_head_wrapper{
        min-height:175px!important;
    }

    .pkp_structure_head .pkp_site_name_wrapper{
        min-height:175px!important;
    }

    .pkp_structure_head .pkp_site_name{
        min-height:175px!important;
        padding:24px 0 12px!important;
    }

    .pkp_structure_head .pkp_site_name img{
        width:820px!important;
        max-width:calc(100% - 20px)!important;
        max-height:none!important;
        height:auto!important;
        margin:0 auto!important;
    }
}

/* Mobile */
@media (max-width:600px){

    .pkp_structure_head .pkp_head_wrapper{
        min-height:145px!important;
    }

    .pkp_structure_head .pkp_site_name_wrapper{
        min-height:145px!important;
    }

    .pkp_structure_head .pkp_site_name{
        min-height:145px!important;
        padding:22px 0 10px!important;
    }

    .pkp_structure_head .pkp_site_name img{
        width:680px!important;
        max-width:calc(100% - 14px)!important;
        max-height:none!important;
        height:auto!important;
        margin:0 auto!important;
    }
}


/* ==========================================================
   PEKA V14 — HEADER HEIGHT 160PX
   Logo size preserved from V12/V13.
   Only desktop header height is reduced to 160px.
========================================================== */

@media (min-width:901px){

    .pkp_structure_head .pkp_head_wrapper{
        min-height:160px!important;
    }

    .pkp_structure_head .pkp_site_name_wrapper{
        min-height:160px!important;
    }

    .pkp_structure_head .pkp_site_name{
        min-height:160px!important;
        padding:12px 0 6px!important;
    }

    /* Preserve approved logo size */
    .pkp_structure_head .pkp_site_name img{
        width:1050px!important;
        max-width:calc(100% - 20px)!important;
        max-height:none!important;
        height:auto!important;
        margin:0 auto!important;
    }

    .pkp_structure_head .pkp_navigation_user_wrapper{
        top:8px!important;
        right:20px!important;
    }
}

/* Tablet */
@media (min-width:601px) and (max-width:900px){

    .pkp_structure_head .pkp_head_wrapper{
        min-height:160px!important;
    }

    .pkp_structure_head .pkp_site_name_wrapper{
        min-height:160px!important;
    }

    .pkp_structure_head .pkp_site_name{
        min-height:160px!important;
        padding:20px 0 10px!important;
    }

    .pkp_structure_head .pkp_site_name img{
        width:820px!important;
        max-width:calc(100% - 20px)!important;
        max-height:none!important;
        height:auto!important;
        margin:0 auto!important;
    }
}

/* Mobile */
@media (max-width:600px){

    .pkp_structure_head .pkp_head_wrapper{
        min-height:140px!important;
    }

    .pkp_structure_head .pkp_site_name_wrapper{
        min-height:140px!important;
    }

    .pkp_structure_head .pkp_site_name{
        min-height:140px!important;
        padding:20px 0 8px!important;
    }

    .pkp_structure_head .pkp_site_name img{
        width:680px!important;
        max-width:calc(100% - 14px)!important;
        max-height:none!important;
        height:auto!important;
        margin:0 auto!important;
    }
}


/* ==========================================================
   PEKA V15 — HEADER HEIGHT 120PX
   Logo size preserved from V12/V13/V14.
   Desktop header reduced to 120px.
========================================================== */

@media (min-width:901px){

    .pkp_structure_head .pkp_head_wrapper{
        min-height:120px!important;
    }

    .pkp_structure_head .pkp_site_name_wrapper{
        min-height:120px!important;
    }

    .pkp_structure_head .pkp_site_name{
        min-height:120px!important;
        padding:6px 0 3px!important;
    }

    /* Preserve approved logo size */
    .pkp_structure_head .pkp_site_name img{
        width:1050px!important;
        max-width:calc(100% - 20px)!important;
        max-height:none!important;
        height:auto!important;
        margin:0 auto!important;
    }

    /* Keep Register/Login safely at the top-right */
    .pkp_structure_head .pkp_navigation_user_wrapper{
        top:6px!important;
        right:20px!important;
    }
}

/* Tablet */
@media (min-width:601px) and (max-width:900px){

    .pkp_structure_head .pkp_head_wrapper{
        min-height:145px!important;
    }

    .pkp_structure_head .pkp_site_name_wrapper{
        min-height:145px!important;
    }

    .pkp_structure_head .pkp_site_name{
        min-height:145px!important;
        padding:16px 0 8px!important;
    }

    .pkp_structure_head .pkp_site_name img{
        width:820px!important;
        max-width:calc(100% - 20px)!important;
        max-height:none!important;
        height:auto!important;
        margin:0 auto!important;
    }
}

/* Mobile */
@media (max-width:600px){

    .pkp_structure_head .pkp_head_wrapper{
        min-height:130px!important;
    }

    .pkp_structure_head .pkp_site_name_wrapper{
        min-height:130px!important;
    }

    .pkp_structure_head .pkp_site_name{
        min-height:130px!important;
        padding:18px 0 7px!important;
    }

    .pkp_structure_head .pkp_site_name img{
        width:680px!important;
        max-width:calc(100% - 14px)!important;
        max-height:none!important;
        height:auto!important;
        margin:0 auto!important;
    }
}


/* ==========================================================
   PEKA V16 — HEADER HEIGHT 70PX
   Logo size preserved from V12-V15.
   Desktop header reduced to 70px.
========================================================== */

@media (min-width:901px){

    .pkp_structure_head .pkp_head_wrapper{
        min-height:70px!important;
    }

    .pkp_structure_head .pkp_site_name_wrapper{
        min-height:70px!important;
    }

    .pkp_structure_head .pkp_site_name{
        min-height:70px!important;
        padding:2px 0 2px!important;
    }

    /* Preserve approved logo size */
    .pkp_structure_head .pkp_site_name img{
        width:1050px!important;
        max-width:calc(100% - 20px)!important;
        max-height:none!important;
        height:auto!important;
        margin:0 auto!important;
    }

    /* Register/Login remain at top-right */
    .pkp_structure_head .pkp_navigation_user_wrapper{
        top:4px!important;
        right:20px!important;
    }
}

/* Tablet */
@media (min-width:601px) and (max-width:900px){

    .pkp_structure_head .pkp_head_wrapper{
        min-height:120px!important;
    }

    .pkp_structure_head .pkp_site_name_wrapper{
        min-height:120px!important;
    }

    .pkp_structure_head .pkp_site_name{
        min-height:120px!important;
        padding:12px 0 6px!important;
    }

    .pkp_structure_head .pkp_site_name img{
        width:820px!important;
        max-width:calc(100% - 20px)!important;
        max-height:none!important;
        height:auto!important;
        margin:0 auto!important;
    }
}

/* Mobile */
@media (max-width:600px){

    .pkp_structure_head .pkp_head_wrapper{
        min-height:115px!important;
    }

    .pkp_structure_head .pkp_site_name_wrapper{
        min-height:115px!important;
    }

    .pkp_structure_head .pkp_site_name{
        min-height:115px!important;
        padding:14px 0 6px!important;
    }

    .pkp_structure_head .pkp_site_name img{
        width:680px!important;
        max-width:calc(100% - 14px)!important;
        max-height:none!important;
        height:auto!important;
        margin:0 auto!important;
    }
}


/* ==========================================================
   EDU SPORTIVO CONTENT LAYER
   Header PEKA di atas tetap dipertahankan.
========================================================== */

:root{
  --es-primary:#F57C00;
  --es-secondary:#D95D00;
  --es-accent:#FFCC80;
  --es-light:#FFF7ED;
  --es-dark:#1F2937;
  --es-shadow:rgba(249,115,22,.20);
}

.es2026-home{
  width:100%;
  max-width:1180px;
  margin:16px auto;
  padding:0 12px;
  font-family:"Segoe UI",Arial,sans-serif;
}

.es2026-banner{
  position:relative;
  display:flex;
  align-items:center;
  width:100%;
  min-height:260px;
  overflow:hidden;
  border-radius:20px;
  padding:30px 42px;
  background:
    linear-gradient(135deg,rgba(245,124,0,.96),rgba(217,93,0,.90)),
    radial-gradient(circle at top right,rgba(255,255,255,.18),transparent 40%);

  box-shadow:0 12px 30px var(--es-shadow);
}

.es2026-banner{
  transition:.4s ease;
}

.es2026-banner:hover{
  transform:translateY(-3px);
  box-shadow:0 18px 45px rgba(0,0,0,.18);
}

.es2026-banner::before{
  content:"";
  position:absolute;
  inset:0;
  background:url("https://images.unsplash.com/photo-1526232761682-d26e03ac148e?auto=format&fit=crop&w=2200&q=80") center center/cover no-repeat;
  opacity:.28;
}

.es2026-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(249,115,22,.88),rgba(234,88,12,.72));
}

.es2026-content{
  position:relative;
  z-index:10;
  color:#fff;
  width:100%;
  max-width:900px;
}

.es2026-badge{
  display:inline-block;
  padding:8px 18px;
  border-radius:40px;
  background:rgba(255,255,255,.22);
  border:1px solid rgba(255,255,255,.40);
  margin-bottom:18px;
  font-size:11px; letter-spacing:2px; font-weight:700;
}

.es2026-title{
  font-size:56px;
  line-height:.95;
  font-weight:900;
  margin:0 0 2px;
  color:#fff;
}

.es2026-subtitle{
  font-size:24px;
  color:#FFFFFF;
  margin:2px 0 10px;
  font-weight:700;
}

.es2026-text{
  color:#fff;
  line-height:1.65;
  max-width:840px;
  margin-top:6px;
  font-size:15px;
}

.es2026-btn{
  display:inline-block;
  margin:6px 10px 0 0;
  padding:11px 22px;
  font-size:13px;
  border-radius:40px;
  background:#fff;
  color:var(--es-secondary)!important;
  text-decoration:none!important;
  font-weight:700;
  transition:all .35s ease;
  box-shadow:0 10px 24px rgba(0,0,0,.12);
}

.es2026-btn:hover{
  background:var(--es-accent);
  color:#6b2d00!important;
  transform:translateY(-4px);
  box-shadow:0 18px 36px var(--es-shadow);
}

.es2026-btn-primary{
  background:var(--es-dark);
  color:#fff!important;
}

.es2026-btn-primary:hover{
  background:#000;
  color:#fff!important;
}

.es2026-card{
  background:#fff;
  border:1px solid #FED7AA;
  border-radius:18px;
  padding:24px;
  margin:24px 0;
  box-shadow:0 10px 24px rgba(0,0,0,.06);
  transition:.3s;
}

.es2026-card:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 40px rgba(0,0,0,.10);
}

.es2026-grid{
  display:flex;
  flex-wrap:wrap;
  gap:20px;
}

.es2026-col{
  flex:1 1 280px;
}

.es2026-metric{
  background:#fff;
  border:1px solid #FED7AA;
  border-radius:16px;
  text-align:center;
  padding:20px;
}

.es2026-metric strong{
  display:block;
  color:var(--es-secondary);
  font-size:24px;
}

@media(max-width:768px){
  .es2026-banner{
    min-height:200px;
    padding:20px 24px;
  }
  .es2026-title{
    font-size:38px;
  }
  .es2026-subtitle{
    font-size:24px;
  }
}


.es2026-home .es2026-buttons{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:18px;
  align-items:center;
}

.es2026-home .es2026-buttons .es2026-btn{
  margin:0;
}

@media(max-width:768px){
 .es2026-content{max-width:100%;}
 .es2026-title{font-size:30px;}
 .es2026-subtitle{font-size:17px;}
 .es2026-text{font-size:14px;}
 .es2026-banner{padding:22px 24px; min-height:260px;}
}



.es2026-home .es2026-content{
  animation:fadeUp .8s ease;
}


@keyframes fadeUp{
  from{
    opacity:0;
    transform:translateY(30px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}


/* Reserved namespace for About Journal
   Use only classes beginning with .es-about-
   This prevents conflicts with .es2026-* hero styles.
*/


.es2026-banner::after{
 content:"";
 position:absolute;
 inset:0;
 background:linear-gradient(to right,rgba(0,0,0,.08),transparent 55%);
 pointer-events:none;
}

.es2026-title{
 text-shadow:0 3px 12px rgba(0,0,0,.22);
}

.es2026-btn{
 backdrop-filter:blur(4px);
}

.es2026-btn-primary{
 background:#16324F;
}



/* ======================================================
   PREMIUM ANIMATION - Added
====================================================== */

.es2026-banner{
    animation:bannerFade .9s ease;
}

@keyframes bannerFade{
    from{opacity:0;transform:translateY(30px);}
    to{opacity:1;transform:translateY(0);}
}

.es2026-badge{animation:badgeSlide 1s ease;}

@keyframes badgeSlide{
    from{opacity:0;transform:translateX(-40px);}
    to{opacity:1;transform:translateX(0);}
}

.es2026-title{animation:titleZoom 1s ease;}

@keyframes titleZoom{
    0%{opacity:0;transform:scale(.85);}
    100%{opacity:1;transform:scale(1);}
}

.es2026-subtitle{animation:subtitleFade 1.2s ease;}

@keyframes subtitleFade{
    from{opacity:0;transform:translateX(30px);}
    to{opacity:1;transform:translateX(0);}
}

.es2026-text{animation:textFade 1.5s ease;}

@keyframes textFade{
    from{opacity:0;transform:translateY(20px);}
    to{opacity:1;transform:translateY(0);}
}

.es2026-btn{
    position:relative;
    overflow:hidden;
}

.es2026-btn-primary{
    animation:pulseButton 2.5s infinite;
}

@keyframes pulseButton{
    0%{transform:scale(1);box-shadow:0 0 0 rgba(245,124,0,.45);}
    50%{transform:scale(1.05);box-shadow:0 0 24px rgba(245,124,0,.45);}
    100%{transform:scale(1);box-shadow:0 0 0 rgba(245,124,0,0);}
}

.es2026-btn-primary::before{
    content:"";
    position:absolute;
    top:0;
    left:-120%;
    width:60%;
    height:100%;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);
    transform:skewX(-25deg);
    animation:shine 3s infinite;
}

@keyframes shine{
    0%{left:-120%;}
    100%{left:160%;}
}

.es2026-banner::before{
    animation:zoomCover 18s ease-in-out infinite alternate;
}

@keyframes zoomCover{
    from{transform:scale(1);}
    to{transform:scale(1.03);}
}



/* ======================================================
   VIEW CURRENT ISSUE BUTTON ANIMATION
====================================================== */

.es-current-btn{
  position:relative;
  overflow:hidden;
  animation:pulseCurrent 2.5s infinite;
  transition:all .35s ease !important;
}

.es-current-btn:hover{
  transform:translateY(-4px) scale(1.04);
  box-shadow:0 18px 36px rgba(245,124,0,.40) !important;
}

.es-current-btn::before{
  content:"";
  position:absolute;
  top:0;
  left:-120%;
  width:60%;
  height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.60),transparent);
  transform:skewX(-25deg);
  animation:currentShine 3s linear infinite;
}

@keyframes pulseCurrent{
  0%{
    transform:scale(1);
    box-shadow:0 0 0 rgba(245,124,0,.35);
  }
  50%{
    transform:scale(1.05);
    box-shadow:0 0 22px rgba(245,124,0,.40);
  }
  100%{
    transform:scale(1);
    box-shadow:0 0 0 rgba(245,124,0,0);
  }
}

@keyframes currentShine{
  0%{left:-120%;}
  100%{left:160%;}
}


/* ======================================================
   AIMS & SCOPE SECTION (v7)
====================================================== */

.es-scope{
background:#fff;
border-radius:18px;
padding:30px;
margin:30px 0;
box-shadow:0 10px 28px rgba(0,0,0,.08);
animation:fadeScope .8s ease;
}
@keyframes fadeScope{
from{opacity:0;transform:translateY(30px);}
to{opacity:1;transform:translateY(0);}
}
.es-scope-title{
font-size:30px;
font-weight:800;
color:#F57C00;
margin-bottom:10px;
}
.es-scope-desc{
font-size:15px;
line-height:1.8;
color:#555;
margin-bottom:22px;
}
.es-scope-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
gap:16px;
}
.es-scope-card{
position:relative;
overflow:hidden;
background:#FFF7ED;
border-left:5px solid #F57C00;
border-radius:12px;
padding:18px;
transition:.35s ease;
}
.es-scope-card:hover{
transform:translateY(-6px);
background:#fff;
box-shadow:0 16px 32px rgba(245,124,0,.22);
}
.es-scope-card::before{
content:"";
position:absolute;
top:0;
left:-120%;
width:60%;
height:100%;
background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);
transform:skewX(-25deg);
transition:.7s;
}
.es-scope-card:hover::before{left:160%;}
.es-scope-card h4{
margin:0;
font-size:16px;
color:#333;
font-weight:700;
}
.es-scope-btn{
display:inline-block;
margin-top:26px;
padding:13px 30px;
border-radius:35px;
background:linear-gradient(135deg,#F57C00,#EA580C);
color:#fff!important;
text-decoration:none!important;
font-weight:700;
box-shadow:0 10px 24px rgba(245,124,0,.25);
animation:pulseScope 2.6s infinite;
transition:.35s;
}
.es-scope-btn:hover{transform:translateY(-4px);}
@keyframes pulseScope{
0%{transform:scale(1);}
50%{transform:scale(1.04);}
100%{transform:scale(1);}
}


/* =====================================================
   SIDEBAR MENU PREMIUM - EDU SPORTIVO 2026
=====================================================*/
.pkp_block .content ul{padding:0;margin:0;list-style:none;}
.pkp_block .content ul li{margin-bottom:12px;}
.pkp_block .content ul li a{
display:flex;align-items:center;padding:13px 16px;border-radius:12px;
background:linear-gradient(180deg,#fff,#FFF3E0);
border:1px solid rgba(245,124,0,.12);
color:#E65100!important;font-weight:700;text-decoration:none;
box-shadow:0 5px 15px rgba(245,124,0,.12);
transition:all .35s ease;position:relative;overflow:hidden;}
.pkp_block .content ul li a:hover{
background:linear-gradient(135deg,#F57C00,#EA580C);
color:#fff!important;transform:translateX(6px);
box-shadow:0 12px 26px rgba(245,124,0,.30);}
.pkp_block .content ul li a::before{
content:"➜";display:flex;align-items:center;justify-content:center;
width:34px;height:34px;margin-right:12px;border-radius:50%;
background:#fff;color:#F57C00;font-size:16px;font-weight:bold;
transition:.35s;box-shadow:0 4px 10px rgba(245,124,0,.20);}
.pkp_block .content ul li a:hover::before{transform:rotate(360deg);}
.pkp_block .content ul li a::after{
content:"";position:absolute;top:0;left:-120%;width:60%;height:100%;
background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);
transform:skewX(-25deg);transition:.8s;}
.pkp_block .content ul li a:hover::after{left:160%;}


/* =====================================================
   SIDEBAR PREMIUM v9 - EDU SPORTIVO
===================================================== */

.sidebar-es-container{margin-bottom:12px;}

.es-sidebar-btn{
display:flex;
align-items:center;
padding:13px 18px;
border-radius:14px;
text-decoration:none!important;
font-weight:700;
font-size:15px;
color:#fff!important;
background:linear-gradient(135deg,#FB8C00,#F57C00,#EF6C00);
box-shadow:0 6px 18px rgba(245,124,0,.28);
transition:all .35s ease;
overflow:hidden;
position:relative;
}

.es-sidebar-btn:hover{
transform:translateY(-3px);
background:linear-gradient(135deg,#FF9800,#F57C00,#E65100);
box-shadow:0 12px 28px rgba(245,124,0,.40);
}

.es-sidebar-btn:before{
content:"";
position:absolute;
left:-120%;
top:0;
width:60%;
height:100%;
background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);
transform:skewX(-25deg);
transition:.8s;
}

.es-sidebar-btn:hover:before{
left:160%;
}

.es-sidebar-icon{
width:22px;
height:22px;
margin-right:12px;
transition:.35s ease;
}

.es-sidebar-btn:hover .es-sidebar-icon{
transform:scale(1.15) rotate(12deg);
}


/* ======================================================
   PEOPLE BLOCK FINAL ANIMATION v10
====================================================== */

.people-title{
transition:all .35s ease;
}

.people-card{
transition:all .35s ease;
cursor:pointer;
border-radius:10px;
}

.people-card:hover{
transform:translateY(-4px);
box-shadow:0 14px 28px rgba(245,124,0,.30)!important;
}

.people-card:active{
transform:scale(.97);
}

.people-card em.fa{
transition:all .35s ease;
}

.people-card:hover em.fa{
transform:rotate(360deg) scale(1.2);
color:#FF9800!important;
}

.people-card a{
transition:all .3s ease;
display:inline-block;
text-decoration:none;
}

.people-card:hover a{
padding-left:5px;
color:#F57C00!important;
}

.people-card::after{
content:"";
display:block;
position:absolute;
}

.sidebar-es-container,
.people-card{
position:relative;
overflow:hidden;
}

.sidebar-es-container::before,
.people-card::before{
content:"";
position:absolute;
top:0;
left:-130%;
width:55%;
height:100%;
background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);
transform:skewX(-25deg);
transition:.8s;
}

.sidebar-es-container:hover::before,
.people-card:hover::before{
left:160%;
}


/* =====================================================
   JOURNAL POLICIES ANIMATION (Added)
   Add class="people-title" and class="people-card" in HTML
===================================================== */

.people-title{
    transition:all .35s ease;
}
.people-title:hover{
    transform:translateY(-3px);
    box-shadow:0 12px 28px rgba(245,124,0,.35)!important;
}

.people-card{
    position:relative;
    overflow:hidden;
    transition:all .35s ease;
    cursor:pointer;
    animation:sidebarFloat 4s ease-in-out infinite;
}

.people-card:hover{
    transform:translateY(-5px);
    box-shadow:0 16px 34px rgba(245,124,0,.35)!important;
}

.people-card:active{
    transform:scale(.97);
}

.people-card::before{
    content:"";
    position:absolute;
    top:0;
    left:-120%;
    width:60%;
    height:100%;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);
    transform:skewX(-25deg);
    transition:.8s;
}

.people-card:hover::before{
    left:160%;
}

.people-card em.fa{
    transition:all .45s ease;
}

.people-card:hover em.fa{
    transform:rotate(360deg) scale(1.18);
    color:#FF9800!important;
}

.people-card:hover a{
    padding-left:8px;
    color:#BF5B00!important;
    transition:.35s;
}

.people-card:hover>div:first-child{
    transform:scale(1.12);
    transition:.35s;
}

@keyframes sidebarFloat{
    0%{transform:translateY(0);}
    50%{transform:translateY(-2px);}
    100%{transform:translateY(0);}
}



/* ==========================================================
   EDU SPORTIVO CONTENT LAYER — SCOPE / SIDEBAR / FOOTER
========================================================== */

/* APPEND v15 AIMS SCOPE */
.es-scope-grid{display:flex!important;flex-wrap:wrap;gap:12px;align-items:stretch}.es-scope-card{flex:1 1 320px;background:#fff!important;border:2px solid rgba(245,124,0,.45)!important;border-left:2px solid rgba(245,124,0,.45)!important;border-radius:0!important;padding:16px 18px!important;min-height:62px;display:flex;align-items:center;justify-content:flex-start;box-shadow:none!important;overflow:hidden;position:relative;transition:all .35s ease}.es-scope-card h4{margin:0;font-size:17px;font-weight:600;color:#444;transition:.35s}.es-scope-card:hover{transform:translateY(-4px) scale(1.02);background:linear-gradient(135deg,#F57C00,#FB8C00)!important;border-color:#F57C00!important;box-shadow:0 12px 28px rgba(245,124,0,.28)!important}.es-scope-card:hover h4{color:#fff}.es-scope-card::after{content:'';position:absolute;top:0;left:-120%;width:50%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-25deg)}.es-scope-card:hover::after{animation:scopeShine .8s forwards}@keyframes scopeShine{from{left:-120%}to{left:160%}}

/* ==========================================================
   APPEND v16 - Compact Aims & Scope (does not replace v15)
   ========================================================== */

.es-scope-grid{
    display:grid !important;
    grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
    gap:10px !important;
    margin-top:18px;
}

.es-scope-card{
    position:relative;
    overflow:hidden;
    display:flex;
    align-items:center;
    justify-content:flex-start;

    min-height:46px !important;
    padding:10px 16px !important;

    background:#ffffff !important;
    border:2px solid #F57C00 !important;
    border-radius:4px !important;
    box-shadow:none !important;

    transition:all .30s ease;
}

.es-scope-card h4{
    margin:0;
    font-size:15px !important;
    line-height:1.35;
    font-weight:600;
    color:#444 !important;
    transition:.3s;
}

.es-scope-card:hover{
    background:linear-gradient(135deg,#F57C00,#FB8C00) !important;
    border-color:#F57C00 !important;
    transform:translateY(-3px);
    box-shadow:0 10px 20px rgba(245,124,0,.22) !important;
}

.es-scope-card:hover h4{
    color:#fff !important;
}

.es-scope-card::before{
    content:"";
    position:absolute;
    top:0;
    left:-120%;
    width:45%;
    height:100%;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);
    transform:skewX(-25deg);
    transition:.8s;
}

.es-scope-card:hover::before{
    left:160%;
}


/* ==========================================================
   APPEND v17 - Journal Policies Hover Animation
   ========================================================== */

.jp-card{
position:relative;
overflow:hidden;
transition:all .35s ease;
cursor:pointer;
}

.jp-card:hover{
transform:translateY(-5px);
box-shadow:0 16px 34px rgba(245,124,0,.30)!important;
}

.jp-card::before{
content:"";
position:absolute;
top:0;
left:-130%;
width:55%;
height:100%;
background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);
transform:skewX(-25deg);
transition:.8s;
}

.jp-card:hover::before{
left:160%;
}

.jp-card em.fa{
transition:all .45s ease;
}

.jp-card:hover em.fa{
transform:rotate(360deg) scale(1.18);
color:#FF9800!important;
}

.jp-card:hover a{
padding-left:8px;
transition:.35s;
}

.jp-card:hover>div:first-child{
transform:scale(1.12);
transition:.35s;
}




/* ==========================================================
   APPEND v18 - National Accreditation spacing (non-destructive)
   ========================================================== */

/* Beri ruang kiri-kanan pada blok National Accreditation */
.es-scope-title + div[style*="border-left: 6px solid #F57C00"]{
    margin-left:18px !important;
    margin-right:18px !important;
    padding:24px 30px !important;
    box-sizing:border-box;
}

/* Rapikan paragraf */
.es-scope-title + div[style*="border-left: 6px solid #F57C00"] p{
    margin:0 !important;
    line-height:2 !important;
}

/* Responsif */
@media (max-width:768px){
    .es-scope-title + div[style*="border-left: 6px solid #F57C00"]{
        margin-left:10px !important;
        margin-right:10px !important;
        padding:18px 18px !important;
    }
}



/* ==========================================================
   APPEND v19 - Premium HTML Tabs (Non-destructive)
   Add only - does not replace previous CSS
========================================================== */

.es-tab-menu{
display:flex;
flex-wrap:wrap;
justify-content:center;
gap:12px;
margin:20px auto;
}

.es-tab{
display:flex;
align-items:center;
justify-content:center;
gap:8px;
padding:14px 28px;
background:#ffffff;
border:2px solid #F57C00;
border-radius:10px;
font-weight:700;
font-size:15px;
color:#F57C00!important;
text-decoration:none!important;
transition:all .35s ease;
box-shadow:0 5px 15px rgba(245,124,0,.12);
position:relative;
overflow:hidden;
}

.es-tab i{
font-size:15px;
transition:.35s;
}

.es-tab:hover{
background:linear-gradient(135deg,#F57C00,#FB8C00);
color:#fff!important;
transform:translateY(-4px);
box-shadow:0 12px 28px rgba(245,124,0,.30);
}

.es-tab:hover i{
color:#fff!important;
transform:rotate(12deg) scale(1.15);
}

.es-tab::before{
content:"";
position:absolute;
top:0;
left:-120%;
width:55%;
height:100%;
background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);
transform:skewX(-25deg);
transition:.8s;
}

.es-tab:hover::before{
left:160%;
}

.es-tab.active{
background:linear-gradient(135deg,#F57C00,#FB8C00);
color:#fff!important;
}

.es-tab.active i{
color:#fff!important;
}

@media(max-width:768px){
.es-tab{
width:100%;
}
}


/* ==========================================================
   APPEND v20 - Simple Orange Footer (Non-destructive)
   Only changes colors, no animation
========================================================== */

#pageFooter-bottom{
    background:#F57C00 !important;
    color:#ffffff !important;
    padding:30px 0 !important;
}

#pageFooter-bottom .panel{
    background:transparent !important;
    border:1px solid rgba(255,255,255,.25) !important;
    border-radius:8px !important;
    box-shadow:none !important;
}

#pageFooter-bottom .panel-heading,
#pageFooter-bottom .panel-body{
    background:transparent !important;
    color:#ffffff !important;
    border:none !important;
}

#pageFooter-bottom strong{
    color:#ffffff !important;
}

#pageFooter-bottom a{
    color:#FFE082 !important;
    text-decoration:none;
}

#pageFooter-bottom a:hover{
    color:#FFF3C4 !important;
    text-decoration:underline;
}

#pageFooter-bottom img{
    max-width:100%;
}

#pageFooter-bottom + div hr{
    border:none;
    border-top:1px solid #FFD180;
}


/* ==========================================================
   APPEND v21 - Footer Only (No Boxes, Full Orange)
   Only footer styles. Other CSS remains unchanged.
========================================================== */

#pageFooter-bottom{
    background:#F57C00 !important;
    color:#fff !important;
    padding:35px 25px !important;
    margin:0 !important;
}

#pageFooter-bottom .panel,
#pageFooter-bottom .panel-success{
    background:transparent !important;
    border:none !important;
    box-shadow:none !important;
    border-radius:0 !important;
    margin:0 !important;
}

#pageFooter-bottom .panel-heading,
#pageFooter-bottom .panel-body{
    background:transparent !important;
    border:none !important;
    color:#fff !important;
    padding:0 !important;
}

#pageFooter-bottom .panel-heading{
    margin-bottom:8px;
    font-weight:700;
}

#pageFooter-bottom,
#pageFooter-bottom p,
#pageFooter-bottom div,
#pageFooter-bottom span,
#pageFooter-bottom strong{
    color:#fff !important;
}

#pageFooter-bottom a{
    color:#FFE082 !important;
    text-decoration:none !important;
}

#pageFooter-bottom a:hover{
    color:#FFF8E1 !important;
}

#pageFooter-bottom img{
    background:transparent !important;
}

/* Continue orange to visitor section */
#pageFooter-bottom + div,
#pageFooter-bottom + div + div,
#pageFooter-bottom + div + div + p,
#pageFooter-bottom ~ p{
    background:#F57C00 !important;
    color:#fff !important;
    margin:0 !important;
    padding:12px 25px !important;
}

#pageFooter-bottom ~ p a{
    color:#FFE082 !important;
}

#pageFooter-bottom + div hr,
#pageFooter-bottom + div + div hr{
    display:none !important;
}


/* ==========================================================
   APPEND v22 - SIDEBAR PREMIUM ANIMATION ONLY
========================================================== */
.people-card,.jp-card,.sidebar-es-container,.es-sidebar-btn{transition:all .35s ease!important}
.people-card:hover,.jp-card:hover,.sidebar-es-container:hover{transform:translateY(-5px)!important;box-shadow:0 16px 34px rgba(245,124,0,.28)!important}
.people-card::before,.jp-card::before,.sidebar-es-container::before{content:"";position:absolute;top:0;left:-130%;width:55%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-25deg);transition:.8s;pointer-events:none}
.people-card:hover::before,.jp-card:hover::before,.sidebar-es-container:hover::before{left:160%}
.people-card em.fa,.jp-card em.fa,.sidebar-es-container em.fa{transition:transform .4s ease,color .4s ease}
.people-card:hover em.fa,.jp-card:hover em.fa,.sidebar-es-container:hover em.fa{transform:rotate(360deg) scale(1.15);color:#FF9800!important}
.people-card a,.jp-card a,.sidebar-es-container a{transition:all .35s ease}
.people-card:hover a,.jp-card:hover a,.sidebar-es-container:hover a{padding-left:8px}
.people-title:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(245,124,0,.30)!important}
.es-sidebar-btn{position:relative;overflow:hidden}
.es-sidebar-btn::after{content:"";position:absolute;top:0;left:-120%;width:45%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);transform:skewX(-25deg);transition:.8s}
.es-sidebar-btn:hover::after{left:160%}
.es-sidebar-btn:hover{transform:translateY(-4px) scale(1.02)!important}


/* ==========================================================
   APPEND v23 - UNIVERSAL SIDEBAR ANIMATION (OJS 3.3)
   No HTML changes required
========================================================== */

/* All custom sidebar blocks */
.pkp_block .content > div,
.pkp_block .content > p,
.pkp_block .content table{
    transition:all .35s ease !important;
}

/* Any sidebar card with inline style */
.pkp_block .content div[style*="border-radius"]{
    position:relative;
    overflow:hidden;
    transition:all .35s ease !important;
}

.pkp_block .content div[style*="border-radius"]:hover{
    transform:translateY(-4px);
    box-shadow:0 16px 30px rgba(245,124,0,.25)!important;
}

/* Shine effect */
.pkp_block .content div[style*="border-radius"]::before{
    content:"";
    position:absolute;
    top:0;
    left:-130%;
    width:45%;
    height:100%;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);
    transform:skewX(-25deg);
    transition:left .8s ease;
    pointer-events:none;
    z-index:2;
}

.pkp_block .content div[style*="border-radius"]:hover::before{
    left:160%;
}

/* Animate all FA icons in sidebar */
.pkp_block .content em.fa{
    transition:transform .45s ease,color .35s ease !important;
}

.pkp_block .content div[style*="border-radius"]:hover em.fa{
    transform:rotate(360deg) scale(1.18);
    color:#FF9800!important;
}

/* Animate links */
.pkp_block .content a{
    transition:all .3s ease !important;
}

.pkp_block .content div[style*="border-radius"]:hover a{
    padding-left:6px;
}

/* Images */
.pkp_block .content img{
    transition:transform .4s ease, box-shadow .4s ease;
}

.pkp_block .content img:hover{
    transform:scale(1.03);
    box-shadow:0 12px 24px rgba(245,124,0,.22);
}

/* Buttons */
.pkp_block .content a[href]{
    position:relative;
}

.pkp_block .content a[href]:hover{
    filter:brightness(1.04);
}



/* ==========================================================
   EDU SPORTIVO ARTICLE TITLE + GALLEY BUTTONS
========================================================== */

/* ==========================================================
   APPEND v25 - Orange Article Title + PDF Buttons ONLY
   ========================================================== */

.obj_article_summary .title a,
.obj_article_summary h3 a,
.cmp_article_list .title a,
.article-summary-title a,
.title a[href*="/article/view/"]{
    color:#F57C00 !important;
}
.obj_article_summary .title a:hover,
.obj_article_summary h3 a:hover,
.cmp_article_list .title a:hover,
.article-summary-title a:hover,
.title a[href*="/article/view/"]:hover{
    color:#E65100 !important;
}

.obj_galley_link,
.cmp_galley_link,
a.obj_galley_link,
a.cmp_galley_link,
a[href*="similarity"]{
    background:#F57C00 !important;
    border-color:#F57C00 !important;
    color:#fff !important;
}
.obj_galley_link:hover,
.cmp_galley_link:hover,
a.obj_galley_link:hover,
a.cmp_galley_link:hover,
a[href*="similarity"]:hover{
    background:#E65100 !important;
    border-color:#E65100 !important;
    color:#fff !important;
}


/* ==========================================================
   FINAL SAFETY:
   Do not let Edu content rules alter PEKA header dimensions.
========================================================== */

.pkp_structure_head,
.pkp_head_wrapper,
.pkp_site_name_wrapper,
.pkp_site_name,
.pkp_site_nav_menu,
.pkp_navigation_primary_wrapper,
.pkp_navigation_primary_row {
    box-sizing:border-box;
}


/* ==========================================================
   EDU SPORTIVO — JOURNAL METRICS SIDEBAR
   ----------------------------------------------------------
   Designed for:
   .es-journal-metrics
   Used with the Journal Metrics HTML block.
   Scoped to avoid changing existing PEKA header,
   navigation, hero, sidebar menu, and footer.
   ========================================================== */

.es-journal-metrics{
    width:100%;
    box-sizing:border-box;
    margin:0 0 24px 0;
    padding:18px 16px 17px;
    background:#FFFFFF;
    border:1px solid #E7E7E7;
    border-bottom:3px solid #26748B;
    border-radius:0;
    box-shadow:0 3px 12px rgba(0,0,0,.07);
    font-family:Arial,Helvetica,sans-serif;
    color:#333333;
}

/* Header */
.es-journal-metrics .es-metrics-header{
    margin:0;
    padding:0 0 12px;
    border-bottom:1px solid #DCDCDC;
}

.es-journal-metrics .es-metrics-header h3{
    margin:0;
    padding:0;
    color:#292929!important;
    font-size:19px;
    line-height:1.25;
    font-weight:800;
}

/* Period badge */
.es-journal-metrics .es-metrics-period{
    display:inline-flex;
    align-items:center;
    gap:7px;
    margin:13px 0 20px;
    padding:5px 10px;
    box-sizing:border-box;
    background:#E7F0F3;
    border-radius:16px;
    color:#205F75;
    font-size:12px;
    line-height:1.2;
    font-weight:700;
    white-space:nowrap;
}

/* CSS calendar icon */
.es-journal-metrics .es-calendar-icon{
    position:relative;
    display:inline-block;
    width:14px;
    height:13px;
    flex:0 0 14px;
    box-sizing:border-box;
    border:1.5px solid #28748B;
    border-radius:2px;
}

.es-journal-metrics .es-calendar-icon:before{
    content:"";
    position:absolute;
    left:1px;
    right:1px;
    top:3px;
    height:1px;
    background:#28748B;
}

.es-journal-metrics .es-calendar-icon:after{
    content:"";
    position:absolute;
    left:3px;
    top:-3px;
    width:2px;
    height:3px;
    border-left:1.5px solid #28748B;
    border-right:1.5px solid #28748B;
}

/* Metrics grid */
.es-journal-metrics .es-metrics-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    column-gap:20px;
    row-gap:27px;
    margin:0 0 24px;
}

.es-journal-metrics .es-metric-item{
    min-width:0;
}

.es-journal-metrics .es-metric-number{
    position:relative;
    display:inline-block;
    margin:0;
    font-size:25px;
    line-height:1;
    font-weight:800;
    color:#173F4C;
    z-index:1;
}

.es-journal-metrics .es-metric-number:after{
    content:"";
    position:absolute;
    left:-5px;
    right:-3px;
    bottom:0;
    height:5px;
    background:#D8E7EB;
    border-radius:4px;
    z-index:-1;
}

.es-journal-metrics .es-metric-label{
    margin-top:5px;
    color:#555555;
    font-size:13px;
    line-height:1.35;
    font-weight:400;
}

/* Author Diversity heading */
.es-journal-metrics .es-diversity-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    margin:0 0 13px;
}

.es-journal-metrics .es-diversity-header h4{
    margin:0!important;
    padding:0!important;
    color:#292929!important;
    font-size:17px!important;
    line-height:1.2!important;
    font-weight:800!important;
}

.es-journal-metrics .es-diversity-header a{
    display:inline-flex;
    align-items:center;
    gap:3px;
    padding:5px 10px;
    border:1px solid #8FBFD0;
    border-radius:18px;
    background:#F7FBFC;
    color:#286D84!important;
    font-size:12px;
    line-height:1.1;
    font-weight:700;
    text-decoration:none!important;
    white-space:nowrap;
}

.es-journal-metrics .es-diversity-header a:hover{
    background:#EAF3F6;
    color:#1D5D72!important;
}

.es-journal-metrics .es-diversity-header a span{
    font-size:18px;
    line-height:10px;
}

/* Diversity bar */
.es-journal-metrics .es-diversity-bar{
    display:flex;
    width:100%;
    height:6px;
    margin:0 0 13px;
    padding:0;
    overflow:hidden;
    background:#EEEEEE;
    border-radius:5px;
}

.es-journal-metrics .es-diversity-bar span{
    display:block;
    height:100%;
    margin:0;
    padding:0;
}

/* Distribution: 16 / 14 / 11 / 9 / 7 / 43 */
.es-journal-metrics .es-country-id{width:16%;background:#28748B;}
.es-journal-metrics .es-country-us{width:14%;background:#E0A32A;}
.es-journal-metrics .es-country-uk{width:11%;background:#C74473;}
.es-journal-metrics .es-country-au{width:9%;background:#28748B;}
.es-journal-metrics .es-country-sg{width:7%;background:#9B4B6D;}
.es-journal-metrics .es-country-other{width:43%;background:#9CA3A7;}

/* Country list */
.es-journal-metrics .es-country-list{
    display:flex;
    flex-direction:column;
    gap:9px;
    margin:0 0 17px;
}

.es-journal-metrics .es-country-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    margin:0;
    padding:0;
    color:#555555;
    font-size:13px;
    line-height:1.25;
}

.es-journal-metrics .es-country-row strong{
    margin:0;
    color:#333333;
    font-size:13px;
    font-weight:700;
}

.es-journal-metrics .es-country-name{
    display:flex;
    align-items:center;
    gap:7px;
    min-width:0;
}

.es-journal-metrics .es-country-dot{
    display:inline-block;
    width:7px;
    height:7px;
    flex:0 0 7px;
    border-radius:50%;
}

.es-journal-metrics .es-dot-id{background:#28748B;}
.es-journal-metrics .es-dot-us{background:#D8D8D8;}
.es-journal-metrics .es-dot-uk{background:#E2A12C;}
.es-journal-metrics .es-dot-au{background:#D04472;}
.es-journal-metrics .es-dot-sg{background:#28748B;}
.es-journal-metrics .es-dot-other{background:#9CA3A7;}

/* View Details button */
.es-journal-metrics .es-metrics-button{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    width:100%;
    min-height:36px;
    box-sizing:border-box;
    margin:0;
    padding:8px 12px;
    background:#28748B;
    border:0;
    border-radius:3px;
    color:#FFFFFF!important;
    font-size:13px;
    line-height:1.2;
    font-weight:700;
    text-align:center;
    text-decoration:none!important;
    transition:background .2s ease,transform .2s ease;
}

.es-journal-metrics .es-metrics-button:hover{
    background:#1D5D72;
    color:#FFFFFF!important;
    transform:translateY(-1px);
}

/* Small chart icon */
.es-journal-metrics .es-chart-icon{
    position:relative;
    display:inline-block;
    width:12px;
    height:14px;
    flex:0 0 12px;
    box-sizing:border-box;
    border-left:1.5px solid #FFFFFF;
    border-bottom:1.5px solid #FFFFFF;
}

.es-journal-metrics .es-chart-icon:before{
    content:"";
    position:absolute;
    left:3px;
    bottom:0;
    width:2px;
    height:7px;
    background:#FFFFFF;
    box-shadow:4px -3px 0 #FFFFFF,8px -7px 0 #FFFFFF;
}

/* Prevent global image/link/card rules from affecting this block */
.es-journal-metrics img{
    transform:none!important;
}

.es-journal-metrics a:hover{
    transform:none;
}

/* Sidebar width compatibility */
@media (min-width:901px){
    .es-journal-metrics{
        width:100%;
    }
}

/* Tablet */
@media (max-width:900px){
    .es-journal-metrics{
        margin-top:20px;
    }
}

/* Mobile */
@media (max-width:600px){
    .es-journal-metrics{
        padding:16px 14px 15px;
    }

    .es-journal-metrics .es-metrics-grid{
        column-gap:16px;
        row-gap:24px;
    }

    .es-journal-metrics .es-metric-number{
        font-size:23px;
    }

    .es-journal-metrics .es-metric-label{
        font-size:12px;
    }

    .es-journal-metrics .es-diversity-header h4{
        font-size:16px!important;
    }

    .es-journal-metrics .es-diversity-header a{
        font-size:11px;
        padding:5px 8px;
    }
}


/* ==========================================================
   FINAL OVERRIDE — JOURNAL METRICS V2
   ----------------------------------------------------------
   Compatible with the Journal Metrics HTML supplied in chat:
   .es-metrics-toggle
   .es-country-button
   .es-country-flag
   .es-metrics-modal
   .es-metrics-modal-overlay
   .es-metrics-modal-box
   .es-modal-header
   .es-modal-close
   .es-modal-section
   .es-stat-row
   .es-modal-country
   ----------------------------------------------------------
   This block is intentionally appended at the end so it
   overrides older Journal Metrics rules in this CSS file.
========================================================== */


/* ==========================================================
   1. MAIN JOURNAL METRICS CARD
========================================================== */

.es-journal-metrics{
    position:relative!important;
    width:100%!important;
    box-sizing:border-box!important;

    margin:0 0 24px!important;
    padding:18px 16px 17px!important;

    background:#FFFFFF!important;

    border:1px solid #E4E4E4!important;
    border-bottom:3px solid #28748B!important;
    border-radius:0!important;

    box-shadow:0 3px 12px rgba(0,0,0,.07)!important;

    color:#333333!important;

    font-family:Arial,Helvetica,sans-serif!important;
}


/* ==========================================================
   2. HIDDEN CHECKBOX
========================================================== */

.es-journal-metrics .es-metrics-toggle{
    position:absolute!important;

    width:1px!important;
    height:1px!important;

    margin:-1px!important;
    padding:0!important;

    overflow:hidden!important;
    clip:rect(0 0 0 0)!important;
    clip-path:inset(50%)!important;

    white-space:nowrap!important;

    border:0!important;

    opacity:0!important;
}


/* ==========================================================
   3. HEADER
========================================================== */

.es-journal-metrics .es-metrics-header{
    margin:0 0 12px!important;
    padding:0 0 11px!important;

    border-bottom:1px solid #DDDDDD!important;
}

.es-journal-metrics .es-metrics-header h3{
    margin:0!important;
    padding:0!important;

    color:#292929!important;

    font-size:19px!important;
    line-height:1.2!important;
    font-weight:800!important;
}


/* ==========================================================
   4. PERIOD
========================================================== */

.es-journal-metrics .es-metrics-period{
    display:inline-flex!important;
    align-items:center!important;

    gap:7px!important;

    margin:0 0 20px!important;
    padding:5px 10px!important;

    box-sizing:border-box!important;

    background:#E7F0F3!important;

    border-radius:16px!important;

    color:#245F73!important;

    font-size:12px!important;
    line-height:1.2!important;
    font-weight:700!important;

    white-space:nowrap!important;
}


/* Calendar icon */

.es-journal-metrics .es-calendar-icon{
    position:relative!important;

    display:inline-block!important;

    width:14px!important;
    height:13px!important;

    min-width:14px!important;

    box-sizing:border-box!important;

    border:1.5px solid #28748B!important;
    border-radius:2px!important;
}

.es-journal-metrics .es-calendar-icon::before{
    content:""!important;

    position:absolute!important;

    left:1px!important;
    right:1px!important;
    top:3px!important;

    height:1px!important;

    background:#28748B!important;
}

.es-journal-metrics .es-calendar-icon::after{
    content:""!important;

    position:absolute!important;

    left:3px!important;
    top:-3px!important;

    width:2px!important;
    height:3px!important;

    border-left:1.5px solid #28748B!important;
    border-right:1.5px solid #28748B!important;
}


/* ==========================================================
   5. METRICS GRID
========================================================== */

.es-journal-metrics .es-metrics-grid{
    display:grid!important;

    grid-template-columns:1fr 1fr!important;

    column-gap:20px!important;
    row-gap:27px!important;

    margin:0 0 24px!important;
    padding:0!important;
}

.es-journal-metrics .es-metric-item{
    min-width:0!important;

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

.es-journal-metrics .es-metric-number{
    position:relative!important;

    display:inline-block!important;

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

    color:#173F4C!important;

    font-size:25px!important;
    line-height:1!important;
    font-weight:800!important;

    z-index:1!important;
}

.es-journal-metrics .es-metric-number::after{
    content:""!important;

    position:absolute!important;

    left:-5px!important;
    right:-3px!important;
    bottom:0!important;

    height:5px!important;

    background:#D8E7EB!important;

    border-radius:4px!important;

    z-index:-1!important;
}

.es-journal-metrics .es-metric-label{
    margin:5px 0 0!important;
    padding:0!important;

    color:#555555!important;

    font-size:13px!important;
    line-height:1.35!important;
    font-weight:400!important;
}


/* ==========================================================
   6. AUTHOR DIVERSITY HEADER
========================================================== */

.es-journal-metrics .es-diversity-header{
    display:flex!important;

    align-items:center!important;
    justify-content:space-between!important;

    gap:8px!important;

    margin:0 0 10px!important;
    padding:0!important;
}

.es-journal-metrics .es-diversity-header h4{
    margin:0!important;
    padding:0!important;

    color:#292929!important;

    font-size:17px!important;
    line-height:1.2!important;
    font-weight:800!important;
}


/* 18 countries */

.es-journal-metrics .es-country-button{
    display:inline-flex!important;

    align-items:center!important;
    justify-content:center!important;

    gap:4px!important;

    margin:0!important;
    padding:5px 10px!important;

    box-sizing:border-box!important;

    background:#F5F9FA!important;

    border:1px solid #8FBFD0!important;
    border-radius:18px!important;

    color:#286D84!important;

    font-size:12px!important;
    line-height:1.2!important;
    font-weight:700!important;

    white-space:nowrap!important;

    cursor:pointer!important;

    text-decoration:none!important;
}

.es-journal-metrics .es-country-button:hover{
    background:#E8F3F6!important;

    border-color:#72AFC2!important;

    color:#1D5D72!important;
}

.es-journal-metrics .es-country-button span{
    display:inline-block!important;

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

    font-size:18px!important;
    line-height:10px!important;
}


/* ==========================================================
   7. DIVERSITY BAR
========================================================== */

.es-journal-metrics .es-diversity-bar{
    display:flex!important;

    width:100%!important;
    height:6px!important;

    margin:0 0 12px!important;
    padding:0!important;

    overflow:hidden!important;

    background:#EEEEEE!important;

    border-radius:5px!important;
}

.es-journal-metrics .es-diversity-bar span{
    display:block!important;

    height:100%!important;

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

    flex-shrink:0!important;
}


/* ==========================================================
   8. COUNTRY LIST
========================================================== */

.es-journal-metrics .es-country-list{
    display:flex!important;

    flex-direction:column!important;

    gap:9px!important;

    width:100%!important;

    margin:0 0 17px!important;
    padding:0!important;
}

.es-journal-metrics .es-country-row{
    display:flex!important;

    align-items:center!important;
    justify-content:space-between!important;

    gap:10px!important;

    width:100%!important;

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

    color:#555555!important;

    font-size:13px!important;
    line-height:1.3!important;
}

.es-journal-metrics .es-country-name{
    display:flex!important;

    align-items:center!important;

    gap:8px!important;

    min-width:0!important;

    color:#555555!important;
}

.es-journal-metrics .es-country-row strong{
    flex:0 0 auto!important;

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

    color:#333333!important;

    font-size:13px!important;
    line-height:1.3!important;
    font-weight:700!important;
}


/* ==========================================================
   9. COUNTRY FLAGS
   ----------------------------------------------------------
   Important:
   Global Edu Sportivo CSS contains img:hover rules.
   These rules completely neutralize them here.
========================================================== */

.es-journal-metrics .es-country-flag{
    display:inline-block!important;

    width:20px!important;
    height:14px!important;

    min-width:20px!important;
    max-width:20px!important;

    min-height:14px!important;
    max-height:14px!important;

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

    box-sizing:border-box!important;

    object-fit:cover!important;
    object-position:center!important;

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

    background:transparent!important;

    transform:none!important;

    box-shadow:none!important;

    vertical-align:middle!important;
}

.es-journal-metrics .es-country-flag:hover{
    transform:none!important;

    box-shadow:none!important;

    filter:none!important;
}


/* Other dot */

.es-journal-metrics .es-country-dot.other{
    display:inline-block!important;

    width:7px!important;
    height:7px!important;

    min-width:7px!important;

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

    border-radius:50%!important;

    background:#9FA5A8!important;
}


/* ==========================================================
   10. VIEW DETAILS BUTTON
========================================================== */

.es-journal-metrics .es-metrics-button{
    display:flex!important;

    align-items:center!important;
    justify-content:center!important;

    gap:10px!important;

    width:100%!important;
    min-height:36px!important;

    box-sizing:border-box!important;

    margin:0!important;
    padding:9px 12px!important;

    background:#28748B!important;

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

    color:#FFFFFF!important;

    font-size:13px!important;
    line-height:1.2!important;
    font-weight:700!important;

    text-align:center!important;
    text-decoration:none!important;

    cursor:pointer!important;

    transition:
        background .2s ease,
        transform .2s ease!important;
}

.es-journal-metrics .es-metrics-button:hover{
    background:#1D5D72!important;

    color:#FFFFFF!important;

    transform:translateY(-1px)!important;
}


/* Chart icon */

.es-journal-metrics .es-chart-icon{
    position:relative!important;

    display:inline-block!important;

    width:13px!important;
    height:14px!important;

    min-width:13px!important;

    box-sizing:border-box!important;

    border-left:1.5px solid #FFFFFF!important;
    border-bottom:1.5px solid #FFFFFF!important;
}

.es-journal-metrics .es-chart-icon::before{
    content:""!important;

    position:absolute!important;

    left:3px!important;
    bottom:0!important;

    width:2px!important;
    height:6px!important;

    background:#FFFFFF!important;

    box-shadow:
        4px -3px 0 #FFFFFF,
        8px -7px 0 #FFFFFF!important;
}


/* ==========================================================
   11. CSS-ONLY MODAL
========================================================== */

.es-journal-metrics .es-metrics-modal{
    position:fixed!important;

    top:0!important;
    left:0!important;

    width:100vw!important;
    height:100vh!important;

    display:none!important;

    align-items:center!important;
    justify-content:center!important;

    box-sizing:border-box!important;

    padding:20px!important;

    z-index:2147483000!important;
}


/* Checkbox opens modal */

.es-journal-metrics .es-metrics-toggle:checked ~ .es-metrics-modal{
    display:flex!important;
}


/* Dark backdrop */

.es-journal-metrics .es-metrics-modal-overlay{
    position:absolute!important;

    top:0!important;
    left:0!important;

    width:100%!important;
    height:100%!important;

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

    background:rgba(0,0,0,.58)!important;

    cursor:pointer!important;
}


/* Modal dialog */

.es-journal-metrics .es-metrics-modal-box{
    position:relative!important;

    z-index:2!important;

    width:100%!important;
    max-width:650px!important;

    max-height:88vh!important;

    overflow-y:auto!important;
    overflow-x:hidden!important;

    box-sizing:border-box!important;

    margin:0!important;
    padding:22px!important;

    background:#FFFFFF!important;

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

    box-shadow:0 20px 60px rgba(0,0,0,.30)!important;

    color:#333333!important;
}


/* ==========================================================
   12. MODAL HEADER
========================================================== */

.es-journal-metrics .es-modal-header{
    display:flex!important;

    align-items:flex-start!important;
    justify-content:space-between!important;

    gap:20px!important;

    margin:0 0 5px!important;
    padding:0 0 15px!important;

    border-bottom:1px solid #DDDDDD!important;
}

.es-journal-metrics .es-modal-header h2{
    margin:0!important;
    padding:0!important;

    color:#222222!important;

    font-size:22px!important;
    line-height:1.2!important;
    font-weight:800!important;
}

.es-journal-metrics .es-modal-header p{
    margin:5px 0 0!important;
    padding:0!important;

    color:#777777!important;

    font-size:12px!important;
    line-height:1.4!important;
}


/* Close */

.es-journal-metrics .es-modal-close{
    display:flex!important;

    align-items:center!important;
    justify-content:center!important;

    width:34px!important;
    height:34px!important;

    min-width:34px!important;

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

    box-sizing:border-box!important;

    background:#F1F1F1!important;

    border:0!important;
    border-radius:50%!important;

    color:#555555!important;

    font-size:25px!important;
    line-height:1!important;

    cursor:pointer!important;

    transition:background .2s ease!important;
}

.es-journal-metrics .es-modal-close:hover{
    background:#E4E4E4!important;

    color:#333333!important;

    transform:none!important;
}


/* ==========================================================
   13. MODAL SECTIONS
========================================================== */

.es-journal-metrics .es-modal-section{
    margin:0!important;
    padding:17px 0!important;

    border-bottom:1px solid #EEEEEE!important;
}

.es-journal-metrics .es-modal-section:last-child{
    border-bottom:0!important;
}

.es-journal-metrics .es-modal-section h3{
    margin:0 0 12px!important;
    padding:0!important;

    color:#222222!important;

    font-size:16px!important;
    line-height:1.25!important;
    font-weight:800!important;
}


/* ==========================================================
   14. MODAL STAT ROWS
========================================================== */

.es-journal-metrics .es-stat-row{
    display:flex!important;

    align-items:center!important;
    justify-content:space-between!important;

    gap:20px!important;

    margin:0!important;
    padding:8px 0!important;

    border-bottom:1px solid #F0F0F0!important;

    color:#555555!important;

    font-size:13px!important;
    line-height:1.35!important;
}

.es-journal-metrics .es-stat-row:last-child{
    border-bottom:0!important;
}

.es-journal-metrics .es-stat-row strong{
    flex:0 0 auto!important;

    color:#222222!important;

    font-size:14px!important;
    font-weight:700!important;
}


/* ==========================================================
   15. OUTCOME BOX
========================================================== */

.es-journal-metrics .es-outcome-box{
    display:flex!important;

    align-items:center!important;
    justify-content:space-between!important;

    gap:20px!important;

    margin:0!important;
    padding:13px 15px!important;

    box-sizing:border-box!important;

    background:#EDF6F8!important;

    border-radius:7px!important;

    color:#28677A!important;

    font-size:14px!important;
    line-height:1.3!important;
    font-weight:700!important;
}

.es-journal-metrics .es-outcome-box strong{
    color:#174D60!important;

    font-size:23px!important;
    font-weight:800!important;
}


/* ==========================================================
   16. MODAL COUNTRY COUNT
========================================================== */

.es-journal-metrics .es-country-count{
    float:right!important;

    display:inline-block!important;

    margin:0!important;
    padding:4px 8px!important;

    background:#EDF4F6!important;

    border-radius:12px!important;

    color:#28677A!important;

    font-size:11px!important;
    line-height:1.2!important;
    font-weight:700!important;
}


/* ==========================================================
   17. MODAL COUNTRY LIST
========================================================== */

.es-journal-metrics .es-modal-country{
    display:flex!important;

    align-items:center!important;
    justify-content:space-between!important;

    gap:15px!important;

    margin:0!important;
    padding:8px 0!important;

    border-bottom:1px solid #F1F1F1!important;

    color:#555555!important;

    font-size:13px!important;
    line-height:1.3!important;
}

.es-journal-metrics .es-modal-country > div{
    display:flex!important;

    align-items:center!important;

    gap:9px!important;

    min-width:0!important;
}

.es-journal-metrics .es-modal-country strong{
    flex:0 0 auto!important;

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

    color:#333333!important;

    font-weight:700!important;
}

.es-journal-metrics .es-modal-country .es-country-flag{
    width:20px!important;
    height:14px!important;
    min-width:20px!important;
    max-width:20px!important;
}


/* ==========================================================
   18. PROTECT METRICS FROM GLOBAL OJS / EDU RULES
========================================================== */

.es-journal-metrics *,
.es-journal-metrics *::before,
.es-journal-metrics *::after{
    box-sizing:border-box;
}

.es-journal-metrics img{
    max-width:none!important;

    transform:none!important;

    filter:none!important;
}

.es-journal-metrics img:hover{
    transform:none!important;

    box-shadow:none!important;
}

.es-journal-metrics a:hover{
    padding-left:0!important;
}


/* ==========================================================
   19. MOBILE
========================================================== */

@media(max-width:600px){

    .es-journal-metrics{
        padding:16px 14px 15px!important;
    }

    .es-journal-metrics .es-metrics-grid{
        column-gap:15px!important;
        row-gap:24px!important;
    }

    .es-journal-metrics .es-metric-number{
        font-size:23px!important;
    }

    .es-journal-metrics .es-metric-label{
        font-size:12px!important;
    }

    .es-journal-metrics .es-diversity-header h4{
        font-size:16px!important;
    }

    .es-journal-metrics .es-country-button{
        padding:5px 8px!important;

        font-size:11px!important;
    }

    .es-journal-metrics .es-metrics-modal{
        padding:10px!important;
    }

    .es-journal-metrics .es-metrics-modal-box{
        max-height:92vh!important;

        padding:17px!important;

        border-radius:9px!important;
    }

    .es-journal-metrics .es-modal-header h2{
        font-size:19px!important;
    }

    .es-journal-metrics .es-modal-section{
        padding:14px 0!important;
    }

    .es-journal-metrics .es-modal-country{
        font-size:12px!important;
    }

}


/* ==========================================================
   20. ACCESSIBILITY / REDUCED MOTION
========================================================== */

@media(prefers-reduced-motion:reduce){

    .es-journal-metrics *,
    .es-journal-metrics *::before,
    .es-journal-metrics *::after{
        transition:none!important;
        animation:none!important;
        scroll-behavior:auto!important;
    }

}

/* ==========================================================
   EDU SPORTIVO — JOURNAL METRICS
   ORANGE / NATIVE DETAILS VERSION
   FINAL OVERRIDE FOR OJS 3.3.0-20
   ----------------------------------------------------------
   - Uses <details>/<summary>
   - No checkbox
   - No JavaScript
   - No modal dependency
   - Orange palette matching PEKA/National Accreditation
   - Scoped with new class names to avoid old CSS conflicts
   ========================================================== */

.es-journal-metrics-orange{
    width:100%!important;
    max-width:100%!important;
    margin:0 0 20px!important;
    padding:0!important;
    box-sizing:border-box!important;
    font-family:Arial,Helvetica,sans-serif!important;
}

.es-journal-metrics-orange *,
.es-journal-metrics-orange *::before,
.es-journal-metrics-orange *::after{
    box-sizing:border-box!important;
}

.es-journal-metrics-orange img{
    max-width:none!important;
}


/* ==========================================================
   HEADER
   ========================================================== */

.es-metrics-orange-header{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;

    width:100%!important;
    min-height:52px!important;

    margin:0 0 16px!important;
    padding:11px 16px!important;

    background:linear-gradient(
        135deg,
        #F36C0A 0%,
        #F36C0A 58%,
        #F6A623 100%
    )!important;

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

    box-shadow:
        0 7px 18px rgba(11,37,58,.22)!important;
}

.es-metrics-orange-header span{
    display:block!important;

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

    color:#FFFFFF!important;

    font-size:20px!important;
    line-height:1.2!important;
    font-weight:800!important;

    text-align:center!important;
}


/* ==========================================================
   MAIN CARD
   ========================================================== */

.es-metrics-orange-card{
    width:100%!important;

    margin:0!important;
    padding:20px!important;

    background:#FFFFFF!important;

    border:1px solid #FFD8B8!important;
    border-radius:14px!important;

    box-shadow:
        0 5px 18px rgba(11,37,58,.10)!important;
}


/* ==========================================================
   PERIOD
   ========================================================== */

.es-metrics-orange-period{
    display:inline-flex!important;
    align-items:center!important;

    margin:0 0 22px!important;
    padding:7px 14px!important;

    background:#FFF7EF!important;

    border:1px solid #FFB866!important;
    border-radius:30px!important;

    color:#F36C0A!important;

    font-size:12px!important;
    line-height:1.2!important;
    font-weight:700!important;
}


/* ==========================================================
   METRICS GRID
   ========================================================== */

.es-metrics-orange-grid{
    display:grid!important;

    grid-template-columns:1fr 1fr!important;

    column-gap:22px!important;
    row-gap:27px!important;

    width:100%!important;

    margin:0 0 25px!important;
    padding:0!important;
}

.es-metric-orange-item{
    min-width:0!important;
    margin:0!important;
    padding:0!important;
}

.es-metric-orange-number{
    position:relative!important;

    display:inline-block!important;

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

    color:#17485A!important;

    font-size:29px!important;
    line-height:1!important;
    font-weight:800!important;
}

.es-metric-orange-number::after{
    content:""!important;

    position:absolute!important;

    left:-5px!important;
    right:-3px!important;
    bottom:-1px!important;

    height:6px!important;

    background:#DDEBED!important;
    border-radius:5px!important;

    z-index:0!important;
}

.es-metric-orange-label{
    position:relative!important;

    margin:6px 0 0!important;
    padding:0!important;

    color:#555555!important;

    font-size:13px!important;
    line-height:1.35!important;
    font-weight:400!important;
}


/* ==========================================================
   AUTHOR DIVERSITY HEADER
   ========================================================== */

.es-metrics-orange-diversity-head{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;

    width:100%!important;

    gap:10px!important;

    margin:0 0 10px!important;
    padding:0!important;
}

.es-metrics-orange-diversity-head h4{
    flex:1 1 auto!important;

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

    color:#222222!important;

    font-size:17px!important;
    line-height:1.15!important;
    font-weight:800!important;
}

.es-metrics-orange-countries{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;

    flex:0 0 auto!important;

    padding:6px 10px!important;

    background:#F5F9F7!important;

    border:1px solid #F5B66A!important;
    border-radius:30px!important;

    color:#F36C0A!important;

    font-size:12px!important;
    line-height:1!important;
    font-weight:700!important;

    white-space:nowrap!important;
}

.es-metrics-orange-countries b{
    display:inline-block!important;

    margin-left:4px!important;

    color:#F36C0A!important;

    font-size:17px!important;
    line-height:10px!important;
}


/* ==========================================================
   DIVERSITY BAR
   ========================================================== */

.es-metrics-orange-bar{
    display:flex!important;

    width:100%!important;
    height:7px!important;

    margin:0 0 13px!important;
    padding:0!important;

    overflow:hidden!important;

    background:#EEEEEE!important;
    border-radius:6px!important;
}

.es-metrics-orange-bar span{
    display:block!important;

    height:100%!important;

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

.es-metrics-orange-bar span:nth-child(1){
    background:#F36C0A!important;
}

.es-metrics-orange-bar span:nth-child(2){
    background:#F36C0A!important;
}

.es-metrics-orange-bar span:nth-child(3){
    background:#F6A623!important;
}

.es-metrics-orange-bar span:nth-child(4){
    background:#FFB866!important;
}

.es-metrics-orange-bar span:nth-child(5){
    background:#F6A623!important;
}

.es-metrics-orange-bar span:nth-child(6){
    background:#A5A5A5!important;
}


/* ==========================================================
   COUNTRY LIST
   ========================================================== */

.es-metrics-orange-countries-list{
    display:flex!important;
    flex-direction:column!important;

    width:100%!important;

    gap:9px!important;

    margin:0 0 18px!important;
    padding:0!important;
}

.es-metrics-orange-country{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;

    width:100%!important;

    gap:10px!important;

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

    color:#555555!important;

    font-size:13px!important;
    line-height:1.3!important;
}

.es-metrics-orange-country > div{
    display:flex!important;
    align-items:center!important;

    min-width:0!important;

    gap:8px!important;
}

.es-metrics-orange-country strong{
    flex:0 0 auto!important;

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

    color:#333333!important;

    font-size:13px!important;
    font-weight:700!important;
}

.es-metrics-orange-country img{
    display:block!important;

    width:20px!important;
    min-width:20px!important;
    max-width:20px!important;

    height:14px!important;
    min-height:14px!important;
    max-height:14px!important;

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

    object-fit:cover!important;

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

    box-shadow:none!important;

    transform:none!important;
}

.es-orange-other-dot{
    display:inline-block!important;

    width:7px!important;
    min-width:7px!important;

    height:7px!important;

    margin:0 5px 0 2px!important;

    background:#A5A5A5!important;

    border-radius:50%!important;
}


/* ==========================================================
   CLICKABLE VIEW DETAILS
   Native HTML <details>/<summary>
   ========================================================== */

.es-metrics-orange-details{
    display:block!important;

    width:100%!important;

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


/* Remove browser marker */

.es-metrics-orange-details > summary{
    list-style:none!important;
}

.es-metrics-orange-details > summary::-webkit-details-marker{
    display:none!important;
}


/* Actual clickable button */

.es-metrics-orange-details > summary{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;

    width:100%!important;
    min-height:44px!important;

    margin:0!important;
    padding:11px 18px!important;

    background:linear-gradient(
        135deg,
        #F36C0A 0%,
        #F36C0A 58%,
        #F6A623 100%
    )!important;

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

    color:#FFFFFF!important;

    font-family:Arial,Helvetica,sans-serif!important;
    font-size:14px!important;
    line-height:1.2!important;
    font-weight:700!important;

    text-align:center!important;
    text-decoration:none!important;

    cursor:pointer!important;

    user-select:none!important;

    box-shadow:
        0 5px 12px rgba(11,37,58,.22)!important;

    transition:
        transform .2s ease,
        box-shadow .2s ease,
        filter .2s ease!important;
}

.es-metrics-orange-details > summary:hover{
    color:#FFFFFF!important;

    background:linear-gradient(
        135deg,
        #C4570D 0%,
        #E96D12 58%,
        #F28C28 100%
    )!important;

    transform:translateY(-1px)!important;

    box-shadow:
        0 8px 18px rgba(11,37,58,.28)!important;
}

.es-metrics-orange-details > summary:focus{
    outline:2px solid #F6A623!important;
    outline-offset:2px!important;
}

.es-metrics-orange-details > summary:active{
    transform:translateY(0)!important;
}

.es-orange-chart-icon{
    display:inline-flex!important;
    align-items:center!important;

    margin-left:3px!important;

    color:#FFFFFF!important;

    font-size:17px!important;
    line-height:1!important;
    font-weight:700!important;
}


/* ==========================================================
   OPEN STATE
   ========================================================== */

.es-metrics-orange-details[open] > summary{
    border-radius:8px 8px 0 0!important;
}

.es-metrics-orange-details[open] > summary .es-orange-chart-icon{
    transform:rotate(90deg)!important;
}


/* ==========================================================
   DETAIL CONTENT
   ========================================================== */

.es-metrics-orange-detail-content{
    width:100%!important;

    margin:0!important;
    padding:17px!important;

    background:#FFFDFB!important;

    border:1px solid #FFD8B8!important;
    border-top:0!important;
    border-radius:0 0 10px 10px!important;

    animation:esMetricsOrangeOpen .22s ease!important;
}

@keyframes esMetricsOrangeOpen{
    from{
        opacity:0;
        transform:translateY(-4px);
    }
    to{
        opacity:1;
        transform:translateY(0);
    }
}


/* ==========================================================
   DETAIL TITLE
   ========================================================== */

.es-orange-detail-title{
    display:flex!important;
    align-items:flex-start!important;
    justify-content:space-between!important;

    gap:10px!important;

    margin:0 0 5px!important;
    padding:0 0 12px!important;

    border-bottom:1px solid #FFE0C7!important;
}

.es-orange-detail-title strong{
    margin:0!important;
    padding:0!important;

    color:#F36C0A!important;

    font-size:16px!important;
    line-height:1.2!important;
    font-weight:800!important;
}

.es-orange-detail-title span{
    margin:0!important;
    padding:0!important;

    color:#888888!important;

    font-size:11px!important;
    line-height:1.2!important;
}


/* ==========================================================
   DETAIL SECTION
   ========================================================== */

.es-orange-detail-section{
    width:100%!important;

    margin:0!important;
    padding:14px 0!important;

    border-bottom:1px solid #EEEEEE!important;
}

.es-orange-detail-section:last-child{
    border-bottom:0!important;
}

.es-orange-detail-section h5{
    margin:0 0 9px!important;
    padding:0!important;

    color:#333333!important;

    font-size:14px!important;
    line-height:1.2!important;
    font-weight:800!important;
}

.es-orange-detail-section h5 span{
    float:right!important;

    margin:0!important;
    padding:4px 8px!important;

    background:#F5F9F7!important;

    border-radius:20px!important;

    color:#F36C0A!important;

    font-size:10px!important;
    line-height:1.2!important;
    font-weight:700!important;
}


/* ==========================================================
   STAT ROW
   ========================================================== */

.es-orange-stat-row{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;

    gap:15px!important;

    width:100%!important;

    margin:0!important;
    padding:7px 0!important;

    border-bottom:1px solid #F1F1F1!important;

    color:#555555!important;

    font-size:12px!important;
    line-height:1.3!important;
}

.es-orange-stat-row:last-child{
    border-bottom:0!important;
}

.es-orange-stat-row strong{
    flex:0 0 auto!important;

    color:#F36C0A!important;

    font-size:13px!important;
    font-weight:700!important;
}


/* ==========================================================
   OUTCOME
   ========================================================== */

.es-orange-outcome{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;

    gap:10px!important;

    width:100%!important;

    margin:0!important;
    padding:12px 14px!important;

    background:#F5F9F7!important;

    border:1px solid #FFD09E!important;
    border-radius:8px!important;

    color:#A84300!important;

    font-size:13px!important;
    line-height:1.2!important;
    font-weight:700!important;
}

.es-orange-outcome strong{
    color:#F36C0A!important;

    font-size:22px!important;
    font-weight:800!important;
}


/* ==========================================================
   DETAIL COUNTRY
   ========================================================== */

.es-orange-stat-country{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;

    gap:10px!important;

    width:100%!important;

    margin:0!important;
    padding:7px 0!important;

    border-bottom:1px solid #F1F1F1!important;

    color:#555555!important;

    font-size:12px!important;
    line-height:1.3!important;
}

.es-orange-stat-country > div{
    display:flex!important;
    align-items:center!important;

    min-width:0!important;

    gap:8px!important;
}

.es-orange-stat-country strong{
    flex:0 0 auto!important;

    color:#F36C0A!important;

    font-size:12px!important;
    font-weight:700!important;
}

.es-orange-stat-country img{
    display:block!important;

    width:20px!important;
    min-width:20px!important;
    max-width:20px!important;

    height:14px!important;
    min-height:14px!important;
    max-height:14px!important;

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

    object-fit:cover!important;

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

    box-shadow:none!important;

    transform:none!important;
}


/* ==========================================================
   IMPORTANT:
   PREVENT GLOBAL IMAGE HOVER RULE FROM DISTORTING FLAGS
   ========================================================== */

.es-journal-metrics-orange img:hover{
    transform:none!important;
    box-shadow:none!important;
}


/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width:600px){

    .es-metrics-orange-card{
        padding:16px!important;
    }

    .es-metrics-orange-header{
        min-height:48px!important;
        padding:10px 14px!important;
    }

    .es-metrics-orange-header span{
        font-size:18px!important;
    }

    .es-metrics-orange-period{
        margin-bottom:20px!important;
        font-size:11px!important;
    }

    .es-metrics-orange-grid{
        column-gap:15px!important;
        row-gap:24px!important;
    }

    .es-metric-orange-number{
        font-size:25px!important;
    }

    .es-metric-orange-label{
        font-size:12px!important;
    }

    .es-metrics-orange-diversity-head{
        align-items:flex-start!important;
    }

    .es-metrics-orange-diversity-head h4{
        font-size:16px!important;
    }

    .es-metrics-orange-countries{
        font-size:11px!important;
        padding:5px 8px!important;
    }

    .es-metrics-orange-detail-content{
        padding:14px!important;
    }

    .es-orange-detail-title strong{
        font-size:15px!important;
    }

}

/* ==========================================================
   FINAL OVERRIDE — ORIGINAL CLICKABLE JOURNAL METRICS
   Orange palette matching National Accreditation
   IMPORTANT: keeps the original checkbox modal clickable.
   ========================================================== */

.es-journal-metrics{
    border:1px solid #FFD8B8!important;
    background:#FFFFFF!important;
    box-shadow:0 5px 18px rgba(11,37,58,.10)!important;
}

/* HEADER */
.es-journal-metrics .es-metrics-header{
    background:linear-gradient(
        135deg,
        #F57C00 0%,
        #E65100 100%
    )!important;
    border:0!important;
    color:#FFFFFF!important;
    box-shadow:0 6px 16px rgba(245,124,0,.20)!important;
}

.es-journal-metrics .es-metrics-header h3{
    color:#FFFFFF!important;
}

/* PERIOD */
.es-journal-metrics .es-metrics-period{
    background:#FFF3E0!important;
    border:1px solid #FFD180!important;
    color:#E65100!important;
}

/* METRIC NUMBERS */
.es-journal-metrics .es-metric-number{
    color:#173F4C!important;
}

.es-journal-metrics .es-metric-number::after{
    background:#DDEBED!important;
}

/* AUTHOR DIVERSITY */
.es-journal-metrics .es-diversity-header h4{
    color:#292929!important;
}

.es-journal-metrics .es-country-button{
    background:#F5F9F7!important;
    border:1px solid #F5B66A!important;
    color:#F36C0A!important;
}

.es-journal-metrics .es-country-button:hover{
    background:#FFF0E2!important;
    border-color:#EFA24A!important;
    color:#034526!important;
}

/* DIVERSITY BAR */
.es-journal-metrics .es-diversity-bar{
    background:
        linear-gradient(
            to right,
            #F36C0A 0% 16%,
            #F36C0A 16% 30%,
            #E2A12C 30% 41%,
            #D04472 41% 50%,
            #28748B 50% 57%,
            #9CA3A7 57% 100%
        )!important;
}

/* COUNTRY VALUES */
.es-journal-metrics .es-country-row strong{
    color:#333333!important;
}

/* VIEW DETAILS — remains a LABEL for checkbox modal */
.es-journal-metrics .es-metrics-button{
    background:linear-gradient(
        135deg,
        #F36C0A 0%,
        #F36C0A 58%,
        #F6A623 100%
    )!important;
    color:#FFFFFF!important;
    border:0!important;
    box-shadow:0 5px 12px rgba(11,37,58,.23)!important;
}

.es-journal-metrics .es-metrics-button:hover{
    background:linear-gradient(
        135deg,
        #C4570D 0%,
        #E96D12 58%,
        #F28C28 100%
    )!important;
    color:#FFFFFF!important;
}

/* MODAL */
.es-journal-metrics .es-metrics-modal-box{
    background:#FFFFFF!important;
    border:1px solid #FFD8B8!important;
    box-shadow:0 20px 60px rgba(0,0,0,.30)!important;
}

/* Modal header */
.es-journal-metrics .es-modal-header{
    border-bottom:1px solid #F1D8C5!important;
}

.es-journal-metrics .es-modal-header h2{
    color:#222222!important;
}

.es-journal-metrics .es-modal-header p{
    color:#777777!important;
}

/* Close */
.es-journal-metrics .es-modal-close{
    background:#FFF3E0!important;
    border:1px solid #FFD180!important;
    color:#E65100!important;
}

.es-journal-metrics .es-modal-close:hover{
    background:#FFE4C7!important;
    border-color:#F5B66A!important;
    color:#034526!important;
}

/* Modal section headings */
.es-journal-metrics .es-modal-section h3{
    color:#F36C0A!important;
}

/* Modal statistics */
.es-journal-metrics .es-stat-row strong{
    color:#F36C0A!important;
}

/* Outcome */
.es-journal-metrics .es-outcome-box{
    background:#FFF3E0!important;
    border:1px solid #FFD8B8!important;
    color:#A84300!important;
}

.es-journal-metrics .es-outcome-box strong{
    color:#F36C0A!important;
}

/* Country count inside modal */
.es-journal-metrics .es-country-count{
    background:#F5F9F7!important;
    border:1px solid #F5B66A!important;
    color:#F36C0A!important;
}

/* Modal country percentages */
.es-journal-metrics .es-modal-country strong{
    color:#F36C0A!important;
}

/* Flags — prevent global OJS image rules from enlarging them */
.es-journal-metrics .es-country-flag,
.es-journal-metrics .es-modal-country .es-country-flag{
    display:inline-block!important;
    width:20px!important;
    min-width:20px!important;
    max-width:20px!important;
    height:14px!important;
    min-height:14px!important;
    max-height:14px!important;
    margin:0!important;
    padding:0!important;
    object-fit:cover!important;
    object-position:center!important;
    border:0!important;
    border-radius:1px!important;
    transform:none!important;
    box-shadow:none!important;
}

/* Keep the CSS-only modal above the page */
.es-journal-metrics .es-metrics-modal{
    z-index:2147483000!important;
}

/* Orange scrollbar */
.es-journal-metrics .es-metrics-modal-box{
    scrollbar-color:#F36C0A #F5F5F5!important;
}

.es-journal-metrics .es-metrics-modal-box::-webkit-scrollbar-thumb{
    background:#F36C0A!important;
    border-radius:8px!important;
}

.es-journal-metrics .es-metrics-modal-box::-webkit-scrollbar-track{
    background:#F5F5F5!important;
}

/* Do not let the global image hover animation affect flags */
.es-journal-metrics img:hover,
.es-journal-metrics .es-country-flag:hover{
    transform:none!important;
    box-shadow:none!important;
    filter:none!important;
}

/* ==========================================================
   JOURNAL METRICS — RECOMMENDED JOURNALS STYLE
   Animated orange header
   ========================================================== */

.es-journal-metrics .es-metrics-header{
    position:relative!important;
    overflow:hidden!important;

    display:flex!important;
    align-items:center!important;
    justify-content:center!important;

    width:100%!important;
    min-height:62px!important;
    box-sizing:border-box!important;

    margin:0 0 16px!important;
    padding:14px 20px!important;

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

    background:linear-gradient(
        135deg,
        #F57C00 0%,
        #F46A00 48%,
        #E65100 100%
    )!important;

    box-shadow:
        0 8px 18px rgba(245,124,0,.22),
        0 3px 8px rgba(230,81,0,.12)!important;

    animation:esMetricsHeaderFloat 3.5s ease-in-out infinite!important;
}

/* Title */
.es-journal-metrics .es-metrics-header h3{
    position:relative!important;
    z-index:2!important;

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

    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;

    font-family:Arial,Helvetica,sans-serif!important;
    font-size:24px!important;
    font-weight:800!important;
    line-height:1.1!important;
    letter-spacing:.1px!important;
    text-align:center!important;

    text-shadow:
        0 1px 2px rgba(0,0,0,.12)!important;
}

/* Moving shine — similar to Recommended Journals */
.es-journal-metrics .es-metrics-header::before{
    content:""!important;
    position:absolute!important;
    top:0!important;
    left:-65%!important;

    width:42%!important;
    height:100%!important;

    background:linear-gradient(
        100deg,
        transparent 0%,
        rgba(255,255,255,.08) 25%,
        rgba(255,255,255,.55) 50%,
        rgba(255,255,255,.08) 75%,
        transparent 100%
    )!important;

    transform:skewX(-22deg)!important;
    animation:esMetricsHeaderShine 3.2s ease-in-out infinite!important;

    pointer-events:none!important;
    z-index:1!important;
}

/* Small orange glow */
.es-journal-metrics .es-metrics-header::after{
    content:""!important;
    position:absolute!important;
    inset:0!important;

    border-radius:16px!important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.20),
        inset 0 -1px 0 rgba(128,45,0,.12)!important;

    pointer-events:none!important;
}

/* Gentle floating animation */
@keyframes esMetricsHeaderFloat{
    0%,100%{
        transform:translateY(0);
    }
    50%{
        transform:translateY(-2px);
    }
}

/* Shine animation */
@keyframes esMetricsHeaderShine{
    0%{
        left:-65%;
        opacity:0;
    }
    15%{
        opacity:1;
    }
    48%{
        left:125%;
        opacity:1;
    }
    55%,100%{
        left:125%;
        opacity:0;
    }
}

/* Hover */
.es-journal-metrics .es-metrics-header:hover{
    animation-play-state:paused!important;

    transform:translateY(-2px)!important;

    box-shadow:
        0 11px 24px rgba(245,124,0,.28),
        0 5px 12px rgba(230,81,0,.16)!important;
}

/* Tablet */
@media(max-width:900px){
    .es-journal-metrics .es-metrics-header{
        min-height:58px!important;
        padding:13px 18px!important;
        border-radius:15px!important;
    }

    .es-journal-metrics .es-metrics-header h3{
        font-size:22px!important;
    }
}

/* Mobile */
@media(max-width:600px){
    .es-journal-metrics .es-metrics-header{
        min-height:56px!important;
        padding:12px 16px!important;
        margin-bottom:14px!important;
        border-radius:14px!important;
    }

    .es-journal-metrics .es-metrics-header h3{
        font-size:20px!important;
    }
}

/* Respect reduced-motion preference */
@media(prefers-reduced-motion:reduce){
    .es-journal-metrics .es-metrics-header,
    .es-journal-metrics .es-metrics-header::before{
        animation:none!important;
    }
}


/* ==========================================================
   EDU SPORTIVO — JOURNAL METRICS REFINED V3
   ----------------------------------------------------------
   Tujuan:
   - Lebih compact untuk sidebar
   - Card berada di tengah
   - Lebar proporsional dengan sidebar
   - Orange mengikuti palette Edu Sportivo:
       #F36C0A / #F36C0A / #F6A623
   - Header seperti "Recommended Journals"
   - Tidak mengganggu checkbox modal / klik View Details
   ========================================================== */

/* MAIN CARD — centered + compact */
.es-journal-metrics{
    position:relative!important;
    display:block!important;
    width:calc(100% - 10px)!important;
    max-width:340px!important;
    margin:0 auto 20px!important;
    padding:14px 14px 15px!important;
    box-sizing:border-box!important;

    background:#FFFFFF!important;
    border:1px solid #F2C6A8!important;
    border-bottom:2px solid #F36C0A!important;
    border-radius:0!important;

    box-shadow:0 5px 16px rgba(11,37,58,.08)!important;

    color:#333333!important;
    font-family:Arial,Helvetica,sans-serif!important;
}

/* HEADER — same visual language as Recommended Journals */
.es-journal-metrics .es-metrics-header{
    position:relative!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;

    width:100%!important;
    min-height:56px!important;
    margin:0 0 14px!important;
    padding:10px 14px!important;
    box-sizing:border-box!important;

    overflow:hidden!important;
    border:0!important;
    border-radius:16px!important;

    background:linear-gradient(
        135deg,
        #F36C0A 0%,
        #F36C0A 58%,
        #F6A623 100%
    )!important;

    box-shadow:
        0 7px 16px rgba(11,37,58,.20),
        0 3px 8px rgba(243,108,10,.12)!important;

    animation:esMetricsRefinedFloat 4s ease-in-out infinite!important;
}

/* Header title */
.es-journal-metrics .es-metrics-header h3{
    position:relative!important;
    z-index:2!important;

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

    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;

    font-size:24px!important;
    line-height:1.1!important;
    font-weight:800!important;
    text-align:center!important;
    letter-spacing:0!important;
    text-shadow:0 1px 2px rgba(0,0,0,.12)!important;
}

/* Header shine */
.es-journal-metrics .es-metrics-header::before{
    content:""!important;
    position:absolute!important;
    top:0!important;
    left:-70%!important;
    width:42%!important;
    height:100%!important;

    background:linear-gradient(
        100deg,
        transparent,
        rgba(255,255,255,.45),
        transparent
    )!important;

    transform:skewX(-22deg)!important;
    animation:esMetricsRefinedShine 3.8s ease-in-out infinite!important;
    pointer-events:none!important;
    z-index:1!important;
}

@keyframes esMetricsRefinedFloat{
    0%,100%{transform:translateY(0);}
    50%{transform:translateY(-2px);}
}

@keyframes esMetricsRefinedShine{
    0%,20%{left:-70%;opacity:0;}
    35%{opacity:1;}
    58%{left:130%;opacity:1;}
    65%,100%{left:130%;opacity:0;}
}

/* Period badge — orange */
.es-journal-metrics .es-metrics-period{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;

    width:max-content!important;
    max-width:100%!important;

    margin:0 auto 20px!important;
    padding:6px 13px!important;

    background:#F5F9F7!important;
    border:1px solid #F5B66A!important;
    border-radius:18px!important;

    color:#F36C0A!important;
    font-size:12px!important;
    line-height:1.2!important;
    font-weight:700!important;
    white-space:nowrap!important;
}

/* Calendar icon */
.es-journal-metrics .es-calendar-icon{
    border-color:#F36C0A!important;
}

.es-journal-metrics .es-calendar-icon:before{
    background:#F36C0A!important;
}

.es-journal-metrics .es-calendar-icon:after{
    border-color:#F36C0A!important;
}

/* Metrics grid — compact and symmetrical */
.es-journal-metrics .es-metrics-grid{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    column-gap:22px!important;
    row-gap:25px!important;

    width:100%!important;
    margin:0 0 25px!important;
}

/* Metric number */
.es-journal-metrics .es-metric-number{
    font-size:30px!important;
    line-height:1!important;
    font-weight:800!important;
    color:#173F4C!important;
}

/* Underline/accent below number */
.es-journal-metrics .es-metric-number::after{
    left:-5px!important;
    right:-3px!important;
    bottom:0!important;
    height:5px!important;
    background:#DCEBED!important;
}

/* Metric labels */
.es-journal-metrics .es-metric-label{
    margin-top:6px!important;
    color:#555555!important;
    font-size:13px!important;
    line-height:1.3!important;
}

/* Author Diversity */
.es-journal-metrics .es-diversity-header{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:7px!important;
    margin:0 0 11px!important;
}

.es-journal-metrics .es-diversity-header h4{
    margin:0!important;
    padding:0!important;
    color:#292929!important;
    font-size:17px!important;
    line-height:1.15!important;
    font-weight:800!important;
}

/* 18 countries pill */
.es-journal-metrics .es-country-button{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;

    flex:0 0 auto!important;

    padding:6px 10px!important;
    border:1px solid #F5B66A!important;
    border-radius:18px!important;

    background:#F5F9F7!important;
    color:#F36C0A!important;

    font-size:12px!important;
    line-height:1.1!important;
    font-weight:700!important;
    text-decoration:none!important;
    white-space:nowrap!important;
    cursor:pointer!important;

    transition:
        background .2s ease,
        border-color .2s ease,
        transform .2s ease!important;
}

.es-journal-metrics .es-country-button:hover{
    background:#FFF0E2!important;
    border-color:#EFA24A!important;
    color:#034526!important;
    transform:translateY(-1px)!important;
}

/* Diversity bar */
.es-journal-metrics .es-diversity-bar{
    width:100%!important;
    height:7px!important;
    margin:0 0 12px!important;
    border-radius:5px!important;
    overflow:hidden!important;

    background:linear-gradient(
        to right,
        #F36C0A 0% 16%,
        #F36C0A 16% 30%,
        #E2A12C 30% 41%,
        #D04472 41% 50%,
        #28748B 50% 57%,
        #9CA3A7 57% 100%
    )!important;
}

/* Country list */
.es-journal-metrics .es-country-list{
    display:flex!important;
    flex-direction:column!important;
    gap:8px!important;
    margin:0 0 17px!important;
}

.es-journal-metrics .es-country-row{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:8px!important;

    color:#555555!important;
    font-size:13px!important;
    line-height:1.25!important;
}

.es-journal-metrics .es-country-row strong{
    color:#333333!important;
    font-size:13px!important;
    font-weight:700!important;
}

/* Country name + flags */
.es-journal-metrics .es-country-name{
    display:flex!important;
    align-items:center!important;
    gap:7px!important;
    min-width:0!important;
}

/* IMPORTANT: prevent global OJS img rules from enlarging flags */
.es-journal-metrics .es-country-flag,
.es-journal-metrics .es-modal-country .es-country-flag{
    display:inline-block!important;
    width:20px!important;
    min-width:20px!important;
    max-width:20px!important;
    height:14px!important;
    min-height:14px!important;
    max-height:14px!important;

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

    object-fit:cover!important;
    object-position:center!important;

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

    transform:none!important;
    box-shadow:none!important;
}

/* View Details — centered and orange */
.es-journal-metrics .es-metrics-button{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:9px!important;

    width:100%!important;
    min-height:38px!important;
    margin:0!important;
    padding:9px 12px!important;
    box-sizing:border-box!important;

    background:linear-gradient(
        135deg,
        #F36C0A 0%,
        #F36C0A 58%,
        #F6A623 100%
    )!important;

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

    color:#FFFFFF!important;
    font-size:13px!important;
    line-height:1.2!important;
    font-weight:700!important;
    text-align:center!important;
    text-decoration:none!important;

    cursor:pointer!important;

    box-shadow:0 5px 12px rgba(11,37,58,.20)!important;

    transition:
        transform .2s ease,
        box-shadow .2s ease,
        background .2s ease!important;
}

.es-journal-metrics .es-metrics-button:hover{
    background:linear-gradient(
        135deg,
        #C4570D 0%,
        #E96D12 58%,
        #F28C28 100%
    )!important;
    color:#FFFFFF!important;
    transform:translateY(-1px)!important;
    box-shadow:0 7px 15px rgba(11,37,58,.25)!important;
}

/* Keep modal functional and above all sidebar elements */
.es-journal-metrics .es-metrics-modal{
    z-index:2147483000!important;
}

.es-journal-metrics .es-metrics-modal-box{
    background:#FFFFFF!important;
    border:1px solid #FFD8B8!important;
    box-shadow:0 20px 60px rgba(0,0,0,.30)!important;
}

/* Modal scrollbar */
.es-journal-metrics .es-metrics-modal-box{
    scrollbar-color:#F36C0A #F5F5F5!important;
}

.es-journal-metrics .es-metrics-modal-box::-webkit-scrollbar-thumb{
    background:#F36C0A!important;
    border-radius:8px!important;
}

.es-journal-metrics .es-metrics-modal-box::-webkit-scrollbar-track{
    background:#F5F5F5!important;
}

/* Prevent global image animation */
.es-journal-metrics img:hover,
.es-journal-metrics .es-country-flag:hover{
    transform:none!important;
    box-shadow:none!important;
    filter:none!important;
}

/* Tablet */
@media(max-width:900px){
    .es-journal-metrics{
        width:calc(100% - 8px)!important;
        max-width:340px!important;
        margin-left:auto!important;
        margin-right:auto!important;
        padding:13px 13px 14px!important;
    }

    .es-journal-metrics .es-metrics-header{
        min-height:54px!important;
        border-radius:15px!important;
    }

    .es-journal-metrics .es-metrics-header h3{
        font-size:23px!important;
    }

    .es-journal-metrics .es-metric-number{
        font-size:28px!important;
    }
}

/* Mobile */
@media(max-width:600px){
    .es-journal-metrics{
        width:calc(100% - 4px)!important;
        max-width:340px!important;
        margin-left:auto!important;
        margin-right:auto!important;
        padding:12px 12px 13px!important;
    }

    .es-journal-metrics .es-metrics-header{
        min-height:52px!important;
        margin-bottom:13px!important;
        padding:9px 12px!important;
        border-radius:14px!important;
    }

    .es-journal-metrics .es-metrics-header h3{
        font-size:21px!important;
    }

    .es-journal-metrics .es-metrics-period{
        font-size:11px!important;
        margin-bottom:18px!important;
    }

    .es-journal-metrics .es-metrics-grid{
        column-gap:18px!important;
        row-gap:22px!important;
        margin-bottom:23px!important;
    }

    .es-journal-metrics .es-metric-number{
        font-size:27px!important;
    }

    .es-journal-metrics .es-metric-label{
        font-size:12px!important;
    }

    .es-journal-metrics .es-diversity-header h4{
        font-size:16px!important;
    }

    .es-journal-metrics .es-country-button{
        font-size:11px!important;
        padding:5px 8px!important;
    }

    .es-journal-metrics .es-country-row{
        font-size:12px!important;
    }

    .es-journal-metrics .es-country-row strong{
        font-size:12px!important;
    }

    .es-journal-metrics .es-metrics-button{
        min-height:37px!important;
        font-size:12px!important;
    }
}

/* Reduced motion */
@media(prefers-reduced-motion:reduce){
    .es-journal-metrics .es-metrics-header,
    .es-journal-metrics .es-metrics-header::before{
        animation:none!important;
    }
}


/* ==========================================================
   JOURNAL METRICS V5
   ONLY: 4 METRIC ITEMS
   - Smaller number and label
   - Precisely centered
   - Light orange accent
   - Journal Metrics header is NOT changed
   ========================================================== */

/* Metrics grid: 2 x 2, centered and symmetrical */
.es-journal-metrics .es-metrics-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    column-gap:26px!important;
    row-gap:22px!important;
    width:100%!important;
    margin:0 auto 22px!important;
    padding:0 8px!important;
    box-sizing:border-box!important;
}

/* Each metric block centered */
.es-journal-metrics .es-metric{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:flex-start!important;
    width:100%!important;
    min-width:0!important;
    text-align:center!important;
    box-sizing:border-box!important;
}

/* Number: smaller + light orange */
.es-journal-metrics .es-metric-number{
    position:relative!important;
    display:inline-block!important;
    width:auto!important;
    margin:0 auto!important;
    padding:0 0 5px!important;

    font-size:25px!important;
    line-height:1!important;
    font-weight:800!important;
    text-align:center!important;

    color:#F28C3C!important;
}

/* Light orange underline */
.es-journal-metrics .es-metric-number::after{
    content:""!important;
    position:absolute!important;
    left:50%!important;
    bottom:0!important;
    width:42px!important;
    height:3px!important;
    transform:translateX(-50%)!important;

    background:#F8C79F!important;
    border-radius:3px!important;
}

/* Labels: smaller, centered, controlled width */
.es-journal-metrics .es-metric-label{
    display:block!important;
    width:100%!important;
    max-width:105px!important;
    margin:6px auto 0!important;

    font-size:11px!important;
    line-height:1.22!important;
    font-weight:400!important;
    text-align:center!important;

    color:#666666!important;
}

/* Keep the Journal Metrics title exactly as existing CSS.
   No .es-metrics-header rules are added here. */

/* Mobile: preserve the same 2 x 2 centered arrangement */
@media(max-width:600px){

    .es-journal-metrics .es-metrics-grid{
        column-gap:14px!important;
        row-gap:19px!important;
        padding:0 4px!important;
    }

    .es-journal-metrics .es-metric-number{
        font-size:23px!important;
    }

    .es-journal-metrics .es-metric-label{
        max-width:95px!important;
        font-size:10.5px!important;
        line-height:1.2!important;
    }

    .es-journal-metrics .es-metric-number::after{
        width:38px!important;
        height:3px!important;
    }
}


/* ==========================================================
   EDU SPORTIVO — JOURNAL INFORMATION COMPACT V6
   ----------------------------------------------------------
   Target: existing inline Journal Information block
   - More compact vertical spacing
   - Smaller table typography/padding
   - Current Issue cover reduced from 300px to 250px
   - Smaller Current Issue button
   - Reduced gap before National Accreditation
   - Does NOT modify PEKA header/navigation
   ========================================================== */

/* Main Journal Information wrapper */
div[style*="max-width: 1080px"][style*="margin: 20px auto"]{
    max-width:1080px!important;
    margin:10px auto 14px!important;
    padding:0 14px!important;
    box-sizing:border-box!important;
}

/* Two-column layout */
div[style*="max-width: 1080px"][style*="margin: 20px auto"] > div[style*="display: flex"]{
    gap:20px!important;
    align-items:flex-start!important;
}

/* Information table */
div[style*="max-width: 1080px"][style*="margin: 20px auto"] table{
    width:100%!important;
    border-collapse:collapse!important;
    font-size:14px!important;
    line-height:1.30!important;
}

/* Compact table rows */
div[style*="max-width: 1080px"][style*="margin: 20px auto"] table td{
    padding:4px 0!important;
    line-height:1.30!important;
    vertical-align:middle!important;
}

/* First column */
div[style*="max-width: 1080px"][style*="margin: 20px auto"] table td:first-child{
    width:200px!important;
    white-space:nowrap!important;
}

/* Second column */
div[style*="max-width: 1080px"][style*="margin: 20px auto"] table td:nth-child(2){
    padding-left:10px!important;
}

/* Keep orange information links */
div[style*="max-width: 1080px"][style*="margin: 20px auto"] table td a{
    color:#F57C00!important;
}

/* ==========================================================
   CURRENT ISSUE COVER
   ========================================================== */

div[style*="max-width: 1080px"][style*="margin: 20px auto"] > div > div[style*="width: 300px"]{
    width:250px!important;
    flex:0 0 250px!important;
}

/* Cover image */
div[style*="max-width: 1080px"][style*="margin: 20px auto"] > div > div[style*="width: 300px"] img{
    width:250px!important;
    max-width:100%!important;
    height:auto!important;
    margin:0 auto!important;
    display:block!important;
    border-radius:12px!important;
    box-shadow:0 8px 22px rgba(0,0,0,.14)!important;
}

/* Spacer above button */
div[style*="max-width: 1080px"][style*="margin: 20px auto"] > div > div[style*="width: 300px"] > div[style*="height: 15px"]{
    height:8px!important;
}

/* Current Issue button */
div[style*="max-width: 1080px"][style*="margin: 20px auto"] > div > div[style*="width: 300px"] > a{
    width:200px!important;
    padding:9px 0!important;
    font-size:14px!important;
    border-radius:30px!important;
    box-shadow:0 6px 18px rgba(245,124,0,.25)!important;
}

/* ==========================================================
   NATIONAL ACCREDITATION — REDUCE GAP
   ========================================================== */

div[style*="max-width: 1080px"][style*="margin: 20px auto"] + .es-scope-title{
    margin-top:8px!important;
    margin-bottom:12px!important;
}

/* ==========================================================
   TABLET
   ========================================================== */

@media(max-width:900px){

    div[style*="max-width: 1080px"][style*="margin: 20px auto"]{
        margin:8px auto 12px!important;
        padding:0 10px!important;
    }

    div[style*="max-width: 1080px"][style*="margin: 20px auto"] > div[style*="display: flex"]{
        gap:15px!important;
    }

    div[style*="max-width: 1080px"][style*="margin: 20px auto"] > div > div[style*="width: 300px"]{
        width:220px!important;
        flex:0 0 220px!important;
    }

    div[style*="max-width: 1080px"][style*="margin: 20px auto"] > div > div[style*="width: 300px"] img{
        width:220px!important;
    }

    div[style*="max-width: 1080px"][style*="margin: 20px auto"] table{
        font-size:13.5px!important;
    }

    div[style*="max-width: 1080px"][style*="margin: 20px auto"] table td:first-child{
        width:165px!important;
    }
}

/* ==========================================================
   MOBILE
   ========================================================== */

@media(max-width:600px){

    div[style*="max-width: 1080px"][style*="margin: 20px auto"]{
        margin:7px auto 12px!important;
        padding:0 8px!important;
    }

    div[style*="max-width: 1080px"][style*="margin: 20px auto"] > div[style*="display: flex"]{
        display:block!important;
    }

    div[style*="max-width: 1080px"][style*="margin: 20px auto"] table{
        font-size:13px!important;
        line-height:1.25!important;
    }

    div[style*="max-width: 1080px"][style*="margin: 20px auto"] table td{
        padding:4px 0!important;
        line-height:1.25!important;
    }

    div[style*="max-width: 1080px"][style*="margin: 20px auto"] table td:first-child{
        width:38%!important;
        white-space:normal!important;
    }

    div[style*="max-width: 1080px"][style*="margin: 20px auto"] table td:nth-child(2){
        padding-left:8px!important;
    }

    div[style*="max-width: 1080px"][style*="margin: 20px auto"] > div > div[style*="width: 300px"]{
        width:240px!important;
        flex:0 0 240px!important;
        margin:14px auto 0!important;
    }

    div[style*="max-width: 1080px"][style*="margin: 20px auto"] > div > div[style*="width: 300px"] img{
        width:240px!important;
        max-width:100%!important;
    }

    div[style*="max-width: 1080px"][style*="margin: 20px auto"] > div > div[style*="width: 300px"] > a{
        width:190px!important;
        font-size:13.5px!important;
        padding:9px 0!important;
    }
}


/* ==========================================================
   EDU SPORTIVO — JOURNAL METRICS V7
   PRECISION CENTERING FIX
   ----------------------------------------------------------
   Final override for the 4 metric items.
   Fixes:
   - number centered exactly in each grid column
   - label centered exactly under number
   - prevents inherited/duplicate rules from shifting items
   - preserves Journal Metrics header
   ========================================================== */

.es-journal-metrics .es-metrics-grid{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    column-gap:18px!important;
    row-gap:20px!important;
    width:100%!important;
    margin:0 0 23px!important;
    padding:0!important;
    box-sizing:border-box!important;
    justify-items:stretch!important;
}

/* Each metric occupies its grid cell and centers its contents */
.es-journal-metrics .es-metric-item{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:flex-start!important;

    width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;

    box-sizing:border-box!important;
    text-align:center!important;
}

/* Number: centered as a block, not merely text-centered */
.es-journal-metrics .es-metric-item .es-metric-number{
    display:table!important;
    position:relative!important;

    width:max-content!important;
    max-width:100%!important;
    margin:0 auto!important;
    padding:0 0 5px!important;

    box-sizing:border-box!important;

    font-size:27px!important;
    line-height:1!important;
    font-weight:800!important;
    text-align:center!important;
    text-align-last:center!important;

    color:#F28C3C!important;
}

/* Center the light-orange underline */
.es-journal-metrics .es-metric-item .es-metric-number::after{
    content:""!important;
    position:absolute!important;

    left:50%!important;
    right:auto!important;
    bottom:0!important;

    width:38px!important;
    height:3px!important;

    transform:translateX(-50%)!important;

    background:#F8C79F!important;
    border-radius:3px!important;
}

/* Label: same horizontal center as number */
.es-journal-metrics .es-metric-item .es-metric-label{
    display:block!important;

    width:100%!important;
    max-width:105px!important;

    margin:6px auto 0!important;
    padding:0!important;

    box-sizing:border-box!important;

    font-size:11px!important;
    line-height:1.22!important;
    font-weight:400!important;

    text-align:center!important;
    text-align-last:center!important;

    color:#666666!important;
}

/* Keep the 2 × 2 structure on mobile */
@media(max-width:600px){

    .es-journal-metrics .es-metrics-grid{
        grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
        column-gap:14px!important;
        row-gap:20px!important;
        margin-bottom:22px!important;
        padding:0!important;
    }

    .es-journal-metrics .es-metric-item{
        align-items:center!important;
        justify-content:flex-start!important;
        text-align:center!important;
    }

    .es-journal-metrics .es-metric-item .es-metric-number{
        font-size:27px!important;
        width:max-content!important;
        margin-left:auto!important;
        margin-right:auto!important;
        text-align:center!important;
    }

    .es-journal-metrics .es-metric-item .es-metric-label{
        width:100%!important;
        max-width:105px!important;
        margin-left:auto!important;
        margin-right:auto!important;
        font-size:11px!important;
        line-height:1.22!important;
        text-align:center!important;
        text-align-last:center!important;
    }
}


/* ==========================================================
   EDU SPORTIVO — JOURNAL INFORMATION V9
   PREMIUM WHITE + ORANGE PROFILE CARD
   ----------------------------------------------------------
   Design goals:
   - Clean white base
   - Orange accent, not full yellow background
   - Compact and balanced two-column layout
   - Cover becomes visual focal point
   - Adds a refined JOURNAL INFORMATION heading
   - Does not alter PEKA header/navigation
   - Does not alter Journal Metrics
   ========================================================== */

div[style*="max-width: 1080px"][style*="margin: 20px auto"]{
    position:relative!important;
    width:calc(100% - 36px)!important;
    max-width:1044px!important;
    margin:12px auto 18px!important;
    padding:18px 18px 16px!important;
    box-sizing:border-box!important;
    background:#FFFFFF!important;
    border:1px solid #F3D7C0!important;
    border-radius:18px!important;
    box-shadow:
        0 8px 24px rgba(11,37,58,.08),
        0 2px 8px rgba(0,0,0,.03)!important;
    overflow:hidden!important;
}

/* Fine orange top accent */
div[style*="max-width: 1080px"][style*="margin: 20px auto"]::before{
    content:"JOURNAL INFORMATION";
    display:block!important;
    width:100%!important;
    margin:0 0 13px!important;
    padding:0 0 10px!important;
    border-bottom:2px solid #F8E0CC!important;
    color:#E65100!important;
    font-family:Arial,Helvetica,sans-serif!important;
    font-size:19px!important;
    font-weight:800!important;
    line-height:1.2!important;
    letter-spacing:.35px!important;
    box-sizing:border-box!important;
}

/* Small orange line under the heading */
div[style*="max-width: 1080px"][style*="margin: 20px auto"]::after{
    content:"";
    position:absolute!important;
    left:18px!important;
    top:48px!important;
    width:58px!important;
    height:3px!important;
    background:linear-gradient(90deg,#F36C0A,#F6A623)!important;
    border-radius:3px!important;
    z-index:2!important;
}

/* Two-column content */
div[style*="max-width: 1080px"][style*="margin: 20px auto"] > div[style*="display: flex"]{
    display:flex!important;
    align-items:flex-start!important;
    justify-content:space-between!important;
    gap:24px!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
    box-sizing:border-box!important;
}

/* Information table column */
div[style*="max-width: 1080px"][style*="margin: 20px auto"] > div[style*="display: flex"] > div:first-child{
    flex:1 1 auto!important;
    min-width:0!important;
}

/* Table */
div[style*="max-width: 1080px"][style*="margin: 20px auto"] table{
    width:100%!important;
    border-collapse:separate!important;
    border-spacing:0!important;
    background:#FFFFFF!important;
    border:1px solid #F1E4DA!important;
    border-radius:12px!important;
    overflow:hidden!important;
    font-size:14px!important;
    line-height:1.3!important;
}

/* Rows */
div[style*="max-width: 1080px"][style*="margin: 20px auto"] table tr{
    transition:background .2s ease!important;
}

div[style*="max-width: 1080px"][style*="margin: 20px auto"] table tr:hover{
    background:#FFF9F4!important;
}

/* Cells */
div[style*="max-width: 1080px"][style*="margin: 20px auto"] table td{
    padding:7px 10px!important;
    vertical-align:middle!important;
    border-bottom:1px solid #F3E7DE!important;
    box-sizing:border-box!important;
}

div[style*="max-width: 1080px"][style*="margin: 20px auto"] table tr:last-child td{
    border-bottom:0!important;
}

/* Labels */
div[style*="max-width: 1080px"][style*="margin: 20px auto"] table td:first-child{
    width:185px!important;
    min-width:185px!important;
    padding-left:13px!important;
    padding-right:8px!important;
    color:#222222!important;
    font-weight:700!important;
    white-space:nowrap!important;
}

/* Values */
div[style*="max-width: 1080px"][style*="margin: 20px auto"] table td:nth-child(2){
    padding-left:8px!important;
    color:#333333!important;
}

/* Orange values/links */
div[style*="max-width: 1080px"][style*="margin: 20px auto"] table td:nth-child(2) a,
div[style*="max-width: 1080px"][style*="margin: 20px auto"] table td:nth-child(2) strong{
    color:#E65100!important;
    font-weight:700!important;
}

/* Accreditation and e-ISSN visual emphasis */
div[style*="max-width: 1080px"][style*="margin: 20px auto"] table tr:nth-child(2) td:nth-child(2),
div[style*="max-width: 1080px"][style*="margin: 20px auto"] table tr:nth-child(6) td:nth-child(2){
    color:#E65100!important;
    font-weight:800!important;
}

/* Citation links remain on one clean line when possible */
div[style*="max-width: 1080px"][style*="margin: 20px auto"] table td a{
    color:#E65100!important;
    text-decoration:none!important;
    font-weight:600!important;
}

div[style*="max-width: 1080px"][style*="margin: 20px auto"] table td a:hover{
    color:#034526!important;
    text-decoration:underline!important;
}

/* ----------------------------------------------------------
   COVER PANEL
   ---------------------------------------------------------- */

div[style*="max-width: 1080px"][style*="margin: 20px auto"] > div[style*="display: flex"] > div[style*="width: 300px"]{
    width:235px!important;
    flex:0 0 235px!important;
    min-width:235px!important;
    padding:9px!important;
    box-sizing:border-box!important;
    text-align:center!important;
    background:linear-gradient(180deg,#FFFDFB 0%,#FFF7F0 100%)!important;
    border:1px solid #F3D7C0!important;
    border-radius:15px!important;
    box-shadow:0 7px 18px rgba(11,37,58,.10)!important;
}

/* Cover image */
div[style*="max-width: 1080px"][style*="margin: 20px auto"] > div[style*="display: flex"] > div[style*="width: 300px"] img{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    margin:0 auto!important;
    border-radius:10px!important;
    box-shadow:0 7px 18px rgba(0,0,0,.14)!important;
    transform:none!important;
}

/* Stop global image hover from enlarging the journal cover */
div[style*="max-width: 1080px"][style*="margin: 20px auto"] > div[style*="display: flex"] > div[style*="width: 300px"] img:hover{
    transform:translateY(-2px)!important;
}

/* Spacer */
div[style*="max-width: 1080px"][style*="margin: 20px auto"] > div[style*="display: flex"] > div[style*="width: 300px"] > div[style*="height: 15px"]{
    height:9px!important;
}

/* Current issue button */
div[style*="max-width: 1080px"][style*="margin: 20px auto"] > div[style*="display: flex"] > div[style*="width: 300px"] > a{
    display:inline-block!important;
    width:180px!important;
    max-width:100%!important;
    padding:10px 0!important;
    background:linear-gradient(135deg,#F36C0A 0%,#F36C0A 58%,#F6A623 100%)!important;
    color:#FFFFFF!important;
    border:0!important;
    border-radius:28px!important;
    font-size:14px!important;
    font-weight:700!important;
    text-decoration:none!important;
    box-shadow:0 7px 18px rgba(245,124,0,.25)!important;
    transition:transform .25s ease,box-shadow .25s ease!important;
}

div[style*="max-width: 1080px"][style*="margin: 20px auto"] > div[style*="display: flex"] > div[style*="width: 300px"] > a:hover{
    transform:translateY(-2px)!important;
    box-shadow:0 10px 22px rgba(245,124,0,.32)!important;
}

/* ----------------------------------------------------------
   NATIONAL ACCREDITATION — KEEP IT VISUALLY SEPARATE
   ---------------------------------------------------------- */

div[style*="max-width: 1080px"][style*="margin: 20px auto"] + .es-scope-title{
    margin-top:10px!important;
    margin-bottom:12px!important;
}

/* ----------------------------------------------------------
   TABLET
   ---------------------------------------------------------- */

@media(max-width:900px){

    div[style*="max-width: 1080px"][style*="margin: 20px auto"]{
        width:calc(100% - 20px)!important;
        max-width:none!important;
        margin:10px auto 15px!important;
        padding:15px!important;
        border-radius:15px!important;
    }

    div[style*="max-width: 1080px"][style*="margin: 20px auto"]::before{
        font-size:18px!important;
        margin-bottom:11px!important;
    }

    div[style*="max-width: 1080px"][style*="margin: 20px auto"]::after{
        left:15px!important;
        top:44px!important;
    }

    div[style*="max-width: 1080px"][style*="margin: 20px auto"] > div[style*="display: flex"]{
        gap:17px!important;
    }

    div[style*="max-width: 1080px"][style*="margin: 20px auto"] > div[style*="display: flex"] > div[style*="width: 300px"]{
        width:205px!important;
        flex-basis:205px!important;
        min-width:205px!important;
    }

    div[style*="max-width: 1080px"][style*="margin: 20px auto"] table{
        font-size:13.5px!important;
    }

    div[style*="max-width: 1080px"][style*="margin: 20px auto"] table td:first-child{
        width:150px!important;
        min-width:150px!important;
    }
}

/* ----------------------------------------------------------
   MOBILE
   ---------------------------------------------------------- */

@media(max-width:600px){

    div[style*="max-width: 1080px"][style*="margin: 20px auto"]{
        width:calc(100% - 16px)!important;
        max-width:none!important;
        margin:8px auto 14px!important;
        padding:13px!important;
        border-radius:13px!important;
    }

    div[style*="max-width: 1080px"][style*="margin: 20px auto"]::before{
        font-size:17px!important;
        margin-bottom:10px!important;
    }

    div[style*="max-width: 1080px"][style*="margin: 20px auto"]::after{
        left:13px!important;
        top:42px!important;
        width:48px!important;
    }

    div[style*="max-width: 1080px"][style*="margin: 20px auto"] > div[style*="display: flex"]{
        display:flex!important;
        flex-direction:column!important;
        align-items:center!important;
        gap:14px!important;
    }

    div[style*="max-width: 1080px"][style*="margin: 20px auto"] > div[style*="display: flex"] > div:first-child{
        width:100%!important;
    }

    div[style*="max-width: 1080px"][style*="margin: 20px auto"] table{
        font-size:13px!important;
    }

    div[style*="max-width: 1080px"][style*="margin: 20px auto"] table td{
        padding:6px 8px!important;
    }

    div[style*="max-width: 1080px"][style*="margin: 20px auto"] table td:first-child{
        width:42%!important;
        min-width:0!important;
        white-space:normal!important;
    }

    div[style*="max-width: 1080px"][style*="margin: 20px auto"] > div[style*="display: flex"] > div[style*="width: 300px"]{
        width:220px!important;
        min-width:220px!important;
        flex:0 0 auto!important;
    }
}


/* ==========================================================
   EDU SPORTIVO — JOURNAL INFORMATION V11
   PRECISION ALIGNMENT — SHIFT VALUE COLUMN LEFT
   ----------------------------------------------------------
   Target:
   - "Edu Sportivo: Indonesian Journal of Physical Education"
   - SINTA 2
   - Publication
   - DOI Prefix
   - First Published
   - e-ISSN
   - Editor in Chief
   - Publisher
   - Open Access
   - Citation
   The left labels remain unchanged.
   ========================================================== */

/* Desktop — move all right-column values left */
div[style*="max-width: 1080px"][style*="margin: 20px auto"] table td:nth-child(2){
    position:relative!important;
    left:-22px!important;
    padding-left:0!important;
    padding-right:8px!important;
}

/* Keep links and emphasized values aligned to the same new axis */
div[style*="max-width: 1080px"][style*="margin: 20px auto"] table td:nth-child(2) a,
div[style*="max-width: 1080px"][style*="margin: 20px auto"] table td:nth-child(2) strong{
    position:relative!important;
    left:0!important;
}

/* Tablet */
@media(max-width:900px){
    div[style*="max-width: 1080px"][style*="margin: 20px auto"] table td:nth-child(2){
        left:-16px!important;
        padding-left:0!important;
    }
}

/* Mobile — restore normal flow so the table remains comfortable */
@media(max-width:600px){
    div[style*="max-width: 1080px"][style*="margin: 20px auto"] table td:nth-child(2){
        left:0!important;
        padding-left:8px!important;
    }
}


/* ==========================================================
   EDU SPORTIVO — JOURNAL INFORMATION V12
   CITATION FORCED TO ONE LINE
   ----------------------------------------------------------
   Fix:
   - Citation stays on a single line
   - Value column moves slightly left
   - First column becomes slightly narrower
   - Does not change cover size
   - Does not affect Journal Metrics
   ========================================================== */

@media (min-width:901px){

    /* Journal Information table */
    div[style*="max-width: 1080px"][style*="margin: 20px auto"] table{
        table-layout:auto!important;
    }

    /* Label column */
    div[style*="max-width: 1080px"][style*="margin: 20px auto"] table td:first-child{
        width:175px!important;
        min-width:175px!important;
        padding-right:0!important;
        white-space:nowrap!important;
    }

    /* Value column — move content slightly left */
    div[style*="max-width: 1080px"][style*="margin: 20px auto"] table td:nth-child(2){
        padding-left:4px!important;
        white-space:nowrap!important;
        width:auto!important;
    }

    /* Citation row — force one line */
    div[style*="max-width: 1080px"][style*="margin: 20px auto"] table tr:last-child td:nth-child(2){
        white-space:nowrap!important;
        overflow:visible!important;
        font-size:13.5px!important;
        line-height:1.2!important;
        letter-spacing:-0.15px!important;
    }

    /* Citation links */
    div[style*="max-width: 1080px"][style*="margin: 20px auto"] table tr:last-child td:nth-child(2) a{
        white-space:nowrap!important;
        display:inline!important;
        font-size:13.5px!important;
    }
}

/* Tablet */
@media (min-width:601px) and (max-width:900px){

    div[style*="max-width: 1080px"][style*="margin: 20px auto"] table td:first-child{
        width:160px!important;
        min-width:160px!important;
    }

    div[style*="max-width: 1080px"][style*="margin: 20px auto"] table td:nth-child(2){
        padding-left:4px!important;
    }

    div[style*="max-width: 1080px"][style*="margin: 20px auto"] table tr:last-child td:nth-child(2),
    div[style*="max-width: 1080px"][style*="margin: 20px auto"] table tr:last-child td:nth-child(2) a{
        white-space:nowrap!important;
        font-size:12.5px!important;
        letter-spacing:-0.15px!important;
    }
}

/* Mobile: allow wrapping because one-line citation is too wide */
@media (max-width:600px){

    div[style*="max-width: 1080px"][style*="margin: 20px auto"] table tr:last-child td:nth-child(2),
    div[style*="max-width: 1080px"][style*="margin: 20px auto"] table tr:last-child td:nth-child(2) a{
        white-space:normal!important;
    }
}



/* ==========================================================
   EDU SPORTIVO — SPORT AREA STYLE FOOTER
   FINAL FOOTER OVERRIDE
   ----------------------------------------------------------
   Layout inspired by Journal Sport Area:
   1. Large white indexing card
   2. Full-width colored footer panel
   3. Three footer columns
   4. Horizontal copyright divider
   5. Compact bottom bar
   6. Responsive/mobile layout
   ----------------------------------------------------------
   NOTE:
   Header, navigation, hero, sidebar and journal metrics
   are NOT modified by this block.
========================================================== */


/* ==========================================================
   FOOTER OUTER WRAPPER
========================================================== */

.pkp_structure_footer_wrapper{
    width:100%!important;
    margin:0!important;
    padding:0!important;
    background:#FFFFFF!important;
    border:0!important;
    box-shadow:none!important;
}

.pkp_structure_footer{
    width:100%!important;
    max-width:1390px!important;
    margin:0 auto!important;
    padding:0!important;
    background:#F36C0A!important;
    border:0!important;
    box-shadow:none!important;
}


/* ==========================================================
   ABSTRACTING & INDEXING AREA
   Sport Area style: white card sitting above the
   orange footer background.
========================================================== */

.es-indexing-area{
    position:relative!important;
    z-index:20!important;

    width:100%!important;
    margin:0!important;
    padding:0 0 0!important;

    background:#F36C0A!important;
    box-sizing:border-box!important;
}


/* White floating indexing card */

.es-indexing-box{
    position:relative!important;
    z-index:30!important;

    width:calc(100% - 80px)!important;
    max-width:1280px!important;

    margin:0 auto!important;
    padding:34px 38px 38px!important;

    background:#FFFFFF!important;

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

    box-shadow:
        0 10px 30px rgba(0,0,0,.10)!important;

    box-sizing:border-box!important;
}


/* Indexing grid: 6 columns like Sport Area */

.es-indexing-grid{
    width:100%!important;

    display:grid!important;
    grid-template-columns:repeat(6,minmax(0,1fr))!important;

    gap:18px 30px!important;

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

    align-items:center!important;
    justify-content:center!important;

    box-sizing:border-box!important;
}


/* Individual indexing card */

.es-indexing-grid > a{
    min-width:0!important;
    height:54px!important;

    display:flex!important;
    align-items:center!important;
    justify-content:center!important;

    padding:7px 10px!important;

    background:#FFFFFF!important;

    border:1px solid #DDDDDD!important;
    border-radius:6px!important;

    box-shadow:none!important;

    text-decoration:none!important;

    transform:none!important;

    transition:
        border-color .25s ease,
        box-shadow .25s ease,
        transform .25s ease!important;

    box-sizing:border-box!important;
}


/* Logos */

.es-indexing-grid > a img{
    display:block!important;

    width:auto!important;
    height:auto!important;

    max-width:145px!important;
    max-height:38px!important;

    margin:0 auto!important;

    object-fit:contain!important;

    opacity:.72!important;
    filter:grayscale(100%)!important;

    transform:none!important;

    transition:
        opacity .25s ease,
        filter .25s ease,
        transform .25s ease!important;
}


/* Hover */

.es-indexing-grid > a:hover{
    background:#FFFFFF!important;

    border-color:#F36C0A!important;

    transform:translateY(-2px)!important;

    box-shadow:
        0 6px 14px rgba(11,37,58,.14)!important;

    text-decoration:none!important;
}

.es-indexing-grid > a:hover img{
    opacity:1!important;
    filter:grayscale(0%)!important;
    transform:scale(1.03)!important;
}


/* ==========================================================
   MAIN SPORT AREA STYLE FOOTER
========================================================== */

#pageFooter-bottom.es-footer{
    position:relative!important;
    z-index:10!important;

    width:100%!important;
    margin:0!important;
    padding:0!important;

    background:#F36C0A!important;
    color:#FFFFFF!important;

    font-family:Arial,Helvetica,sans-serif!important;

    box-sizing:border-box!important;
}


/* Main orange panel */

#pageFooter-bottom .es-footer-main{
    width:100%!important;
    margin:0!important;
    padding:0!important;

    background:
        linear-gradient(
            135deg,
            #F36C0A 0%,
            #C9570C 52%,
            #A9470B 100%
        )!important;

    box-sizing:border-box!important;
}


/* Three-column layout */

#pageFooter-bottom .es-footer-container{
    width:calc(100% - 80px)!important;
    max-width:1280px!important;

    margin:0 auto!important;

    padding:28px 0 25px!important;

    display:grid!important;

    grid-template-columns:
        1.55fr .72fr 1.18fr!important;

    column-gap:64px!important;
    row-gap:0!important;

    box-sizing:border-box!important;
}


/* Columns */

#pageFooter-bottom .es-footer-column{
    min-width:0!important;

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

    background:transparent!important;

    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
}


/* Headings */

#pageFooter-bottom .es-footer-column h3{
    margin:0 0 18px!important;
    padding:0!important;

    color:#FFFFFF!important;

    font-family:Arial,Helvetica,sans-serif!important;
    font-size:19px!important;
    font-weight:700!important;
    line-height:1.3!important;

    text-align:left!important;
}


/* About text */

#pageFooter-bottom .es-footer-about p{
    max-width:530px!important;

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

    color:#FFFFFF!important;

    font-size:14px!important;
    font-weight:400!important;
    line-height:1.72!important;

    text-align:left!important;
}

#pageFooter-bottom .es-footer-about strong{
    color:#FFFFFF!important;
    font-weight:700!important;
}


/* ==========================================================
   MENU
========================================================== */

#pageFooter-bottom .es-footer-menu{
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    justify-content:flex-start!important;
}

#pageFooter-bottom .es-footer-menu a{
    display:block!important;

    width:auto!important;

    margin:0 0 5px!important;
    padding:0!important;

    color:#FFFFFF!important;

    font-size:14px!important;
    font-weight:400!important;
    line-height:1.4!important;

    text-decoration:none!important;

    transform:none!important;
}

#pageFooter-bottom .es-footer-menu a:hover{
    color:#FFE1B3!important;
    text-decoration:none!important;

    transform:translateX(3px)!important;
}


/* ==========================================================
   CONTACT
========================================================== */

#pageFooter-bottom .es-contact-address{
    margin:0!important;
    padding:0!important;

    color:#FFFFFF!important;

    font-size:14px!important;
    font-weight:400!important;
    line-height:1.62!important;
}

#pageFooter-bottom .es-contact-address strong{
    color:#FFFFFF!important;
    font-weight:700!important;
}


/* ==========================================================
   SOCIAL ICONS — CIRCULAR LIKE SPORT AREA
========================================================== */

#pageFooter-bottom .es-social-links{
    display:flex!important;
    align-items:center!important;

    gap:18px!important;

    margin:17px 0 0!important;
    padding:0!important;
}

#pageFooter-bottom .es-social-links a{
    position:relative!important;

    width:42px!important;
    height:42px!important;

    display:flex!important;
    align-items:center!important;
    justify-content:center!important;

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

    border:0!important;
    border-radius:50%!important;

    background:#FFFFFF!important;
    color:#F36C0A!important;

    font-size:0!important;
    font-weight:700!important;
    line-height:1!important;

    text-decoration:none!important;

    box-shadow:0 3px 8px rgba(0,0,0,.12)!important;

    transform:none!important;

    transition:
        transform .2s ease,
        background .2s ease,
        color .2s ease!important;
}


/* FontAwesome icons */

#pageFooter-bottom .es-social-links a:nth-child(1)::before{
    content:"\f0e0"!important;
}

#pageFooter-bottom .es-social-links a:nth-child(2)::before{
    content:"\f232"!important;
}

#pageFooter-bottom .es-social-links a:nth-child(3)::before{
    content:"\f095"!important;
}

#pageFooter-bottom .es-social-links a::before{
    display:block!important;

    font-family:"FontAwesome"!important;
    font-size:18px!important;
    font-weight:normal!important;

    color:#F36C0A!important;
}

#pageFooter-bottom .es-social-links a:hover{
    background:#FFE1B3!important;
    color:#A9470B!important;

    transform:translateY(-3px)!important;

    text-decoration:none!important;
}

#pageFooter-bottom .es-social-links a:hover::before{
    color:#A9470B!important;
}


/* ==========================================================
   COPYRIGHT / LICENSE BAR
========================================================== */

#pageFooter-bottom .es-footer-bottom{
    width:100%!important;

    margin:0!important;
    padding:16px 0 17px!important;

    background:
        rgba(112,38,5,.28)!important;

    border-top:1px solid rgba(255,255,255,.58)!important;

    box-sizing:border-box!important;
}

#pageFooter-bottom .es-footer-bottom-inner{
    width:calc(100% - 80px)!important;
    max-width:1280px!important;

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

    box-sizing:border-box!important;
}

#pageFooter-bottom .es-footer-bottom p{
    margin:3px 0!important;
    padding:0!important;

    color:#FFFFFF!important;

    font-family:Arial,Helvetica,sans-serif!important;

    font-size:12px!important;
    font-weight:400!important;
    line-height:1.5!important;

    text-align:left!important;
}

#pageFooter-bottom .es-footer-bottom a{
    color:#FFE1B3!important;
    text-decoration:none!important;
}

#pageFooter-bottom .es-footer-bottom a:hover{
    color:#FFFFFF!important;
    text-decoration:underline!important;
}


/* ==========================================================
   POWERED BAR
========================================================== */

#pageFooter-bottom .es-footer-powered{
    width:100%!important;

    display:flex!important;
    align-items:center!important;
    justify-content:center!important;

    gap:28px!important;

    margin:0!important;
    padding:9px 20px!important;

    background:#8F3B0A!important;

    color:rgba(255,255,255,.80)!important;

    font-size:10.5px!important;
    line-height:1.4!important;

    text-align:center!important;

    box-sizing:border-box!important;
}

#pageFooter-bottom .es-footer-powered strong{
    color:#FFFFFF!important;
}

#pageFooter-bottom .es-footer-powered a{
    color:#FFE1B3!important;
    text-decoration:none!important;
}

#pageFooter-bottom .es-footer-powered a:hover{
    color:#FFFFFF!important;
}


/* ==========================================================
   STATCOUNTER
========================================================== */

.es-statcounter{
    width:100%!important;

    margin:0!important;
    padding:5px 10px!important;

    background:#FFFFFF!important;

    color:#A9470B!important;

    text-align:center!important;

    font-family:Arial,Helvetica,sans-serif!important;
    font-size:10px!important;

    box-sizing:border-box!important;
}

.es-statcounter img{
    width:1px!important;
    height:1px!important;

    max-width:1px!important;
    max-height:1px!important;

    opacity:0!important;
}

.es-statcounter a{
    color:#A9470B!important;
    text-decoration:none!important;
}

.es-statcounter a:hover{
    color:#F36C0A!important;
    text-decoration:underline!important;
}


/* ==========================================================
   REMOVE LEGACY BOOTSTRAP FOOTER APPEARANCE
========================================================== */

#pageFooter-bottom .panel,
#pageFooter-bottom .panel-success,
#pageFooter-bottom .panel-heading,
#pageFooter-bottom .panel-body,
#pageFooter-bottom .container,
#pageFooter-bottom .lastfooter,
#pageFooter-bottom .row{
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
}

#pageFooter-bottom .panel,
#pageFooter-bottom .panel-success{
    margin:0!important;
    padding:0!important;
}

#pageFooter-bottom .panel-heading,
#pageFooter-bottom .panel-body{
    padding:0!important;
}


/* ==========================================================
   TABLET
========================================================== */

@media (max-width:900px){

    .es-indexing-box{
        width:calc(100% - 40px)!important;
        padding:28px 24px 30px!important;
        border-radius:0 0 20px 20px!important;
    }

    .es-indexing-grid{
        grid-template-columns:repeat(3,minmax(0,1fr))!important;
        gap:13px!important;
    }

    .es-indexing-grid > a{
        height:56px!important;
    }

    .es-indexing-grid > a img{
        max-width:125px!important;
        max-height:34px!important;
    }

    #pageFooter-bottom .es-footer-container{
        width:calc(100% - 40px)!important;

        grid-template-columns:1.2fr 1fr!important;

        column-gap:40px!important;
        row-gap:25px!important;

        padding:27px 0 24px!important;
    }

    #pageFooter-bottom .es-footer-contact{
        grid-column:1 / -1!important;

        padding-top:22px!important;

        border-top:1px solid rgba(255,255,255,.25)!important;
    }

    #pageFooter-bottom .es-footer-bottom-inner{
        width:calc(100% - 40px)!important;
    }
}


/* ==========================================================
   MOBILE
========================================================== */

@media (max-width:600px){

    .es-indexing-box{
        width:calc(100% - 24px)!important;

        padding:20px 12px 22px!important;

        border-radius:0 0 16px 16px!important;
    }

    .es-indexing-grid{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
        gap:9px!important;
    }

    .es-indexing-grid > a{
        height:52px!important;
        padding:6px!important;
    }

    .es-indexing-grid > a img{
        max-width:105px!important;
        max-height:30px!important;
    }

    #pageFooter-bottom .es-footer-container{
        width:calc(100% - 30px)!important;

        display:block!important;

        padding:25px 0 18px!important;
    }

    #pageFooter-bottom .es-footer-column{
        width:100%!important;

        margin:0 0 21px!important;
        padding:0 0 21px!important;

        border-bottom:1px solid rgba(255,255,255,.24)!important;
    }

    #pageFooter-bottom .es-footer-column:last-child{
        margin-bottom:0!important;
        padding-bottom:0!important;
        border-bottom:0!important;
    }

    #pageFooter-bottom .es-footer-column h3{
        margin-bottom:12px!important;
        font-size:18px!important;
    }

    #pageFooter-bottom .es-footer-about p,
    #pageFooter-bottom .es-footer-menu a,
    #pageFooter-bottom .es-contact-address{
        font-size:13px!important;
        line-height:1.6!important;
    }

    #pageFooter-bottom .es-social-links{
        gap:14px!important;
        margin-top:14px!important;
    }

    #pageFooter-bottom .es-social-links a{
        width:39px!important;
        height:39px!important;
    }

    #pageFooter-bottom .es-social-links a::before{
        font-size:16px!important;
    }

    #pageFooter-bottom .es-footer-bottom{
        padding:13px 0 14px!important;
    }

    #pageFooter-bottom .es-footer-bottom-inner{
        width:calc(100% - 30px)!important;
    }

    #pageFooter-bottom .es-footer-bottom p{
        font-size:10.5px!important;
        line-height:1.5!important;
    }

    #pageFooter-bottom .es-footer-powered{
        display:block!important;

        padding:8px 15px!important;

        font-size:10px!important;
    }

    #pageFooter-bottom .es-footer-powered span{
        display:block!important;
        margin:3px 0!important;
    }
}


/* ==========================================================
   EDU SPORTIVO — FOOTER FINAL
   SPORT AREA VISUAL MATCH / ORANGE EDITION
   ----------------------------------------------------------
   IMPORTANT:
   This block styles the ACTUAL Edu Sportivo footer HTML:
   .es-footer-title / .es-footer-content / .es-footer-brand /
   .es-contact-item / .es-footer-bottom-inner / .es-footer-meta
   and the indexing block.
   Header, navigation and page content are untouched.
========================================================== */

/* ---------- GLOBAL FOOTER ALIGNMENT ---------- */
#pageFooter-bottom.es-footer,
#pageFooter-bottom.es-footer .es-footer-main,
#pageFooter-bottom.es-footer .es-footer-bottom{
    width:100%!important;
    box-sizing:border-box!important;
}

#pageFooter-bottom.es-footer{
    margin:0!important;
    padding:0!important;
    background:#F36C0A!important;
    color:#fff!important;
    font-family:Arial,Helvetica,sans-serif!important;
}

/* One common inner edge for indexing + footer content */
:root{
    --es-sa-inner:90%;
    --es-sa-max:1336px;
}

/* ---------- INDEXING ---------- */
.es-indexing-area{
    position:relative!important;
    z-index:20!important;
    width:100%!important;
    margin:0!important;
    padding:0 0 0!important;
    background:#F36C0A!important;
    box-sizing:border-box!important;
}

.es-indexing-box{
    width:var(--es-sa-inner)!important;
    max-width:var(--es-sa-max)!important;
    margin:0 auto!important;
    padding:36px 42px 40px!important;
    background:#fff!important;
    border:0!important;
    border-radius:0 0 24px 24px!important;
    box-shadow:0 10px 28px rgba(0,0,0,.10)!important;
    box-sizing:border-box!important;
}

.es-indexing-grid{
    display:grid!important;
    grid-template-columns:repeat(6,minmax(0,1fr))!important;
    gap:18px 30px!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
    align-items:center!important;
    box-sizing:border-box!important;
}

.es-indexing-grid > a{
    width:100%!important;
    min-width:0!important;
    height:58px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:7px 10px!important;
    margin:0!important;
    background:#fff!important;
    border:1px solid #ddd!important;
    border-radius:6px!important;
    box-shadow:none!important;
    box-sizing:border-box!important;
    text-decoration:none!important;
    transform:none!important;
    transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease!important;
}

.es-indexing-grid > a img{
    display:block!important;
    width:auto!important;
    height:auto!important;
    max-width:145px!important;
    max-height:38px!important;
    margin:0 auto!important;
    object-fit:contain!important;
    opacity:.72!important;
    filter:grayscale(100%)!important;
    transform:none!important;
    transition:opacity .2s ease,filter .2s ease,transform .2s ease!important;
}

.es-indexing-grid > a:hover{
    border-color:#F36C0A!important;
    box-shadow:0 5px 12px rgba(11,37,58,.12)!important;
    transform:translateY(-2px)!important;
}

.es-indexing-grid > a:hover img{
    opacity:1!important;
    filter:grayscale(0%)!important;
    transform:scale(1.02)!important;
}

/* ---------- MAIN ORANGE PANEL ---------- */
#pageFooter-bottom .es-footer-main{
    width:100%!important;
    margin:0!important;
    padding:0!important;
    background:linear-gradient(135deg,#F36C0A 0%,#C9570C 55%,#A9470B 100%)!important;
    box-sizing:border-box!important;
}

#pageFooter-bottom .es-footer-container{
    width:var(--es-sa-inner)!important;
    max-width:var(--es-sa-max)!important;
    margin:0 auto!important;
    padding:30px 0 27px!important;
    display:grid!important;
    grid-template-columns:1.55fr .72fr 1.18fr .80fr!important;
    column-gap:48px!important;
    row-gap:0!important;
    box-sizing:border-box!important;
}

/* Actual 4th column remains compact and visually subordinate */
#pageFooter-bottom .es-footer-column{
    min-width:0!important;
    margin:0!important;
    padding:0!important;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
    border-radius:0!important;
}

/* ---------- TITLES ---------- */
#pageFooter-bottom .es-footer-title{
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
    margin:0 0 17px!important;
    padding:0!important;
    color:#fff!important;
    font-family:Arial,Helvetica,sans-serif!important;
    font-size:19px!important;
    font-weight:700!important;
    line-height:1.3!important;
    text-align:left!important;
}

#pageFooter-bottom .es-footer-icon{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:24px!important;
    min-width:24px!important;
    height:24px!important;
    color:#F36C0A!important;
    background:#fff!important;
    border-radius:50%!important;
    font-size:12px!important;
    font-weight:700!important;
    line-height:1!important;
}

/* ---------- COLUMN 1 ---------- */
#pageFooter-bottom .es-footer-brand{
    margin:0 0 6px!important;
    color:#fff!important;
    font-size:15px!important;
    font-weight:700!important;
    line-height:1.45!important;
}

#pageFooter-bottom .es-footer-line{
    margin:0 0 7px!important;
    color:#fff!important;
    font-size:13px!important;
    line-height:1.5!important;
}

#pageFooter-bottom .es-footer-line strong{
    color:#fff!important;
    font-weight:700!important;
}

#pageFooter-bottom .es-footer-journal{
    max-width:500px!important;
    margin:0!important;
    color:#fff!important;
    font-size:13px!important;
    line-height:1.65!important;
}

/* ---------- COLUMN 2 / CONTACT ---------- */
#pageFooter-bottom .es-contact-item{
    display:flex!important;
    align-items:flex-start!important;
    gap:9px!important;
    margin:0 0 10px!important;
    color:#fff!important;
    font-size:13px!important;
    line-height:1.55!important;
}

#pageFooter-bottom .es-contact-icon{
    flex:0 0 18px!important;
    width:18px!important;
    text-align:center!important;
    color:#fff!important;
    font-size:14px!important;
    line-height:1.45!important;
}

#pageFooter-bottom .es-contact-item a{
    color:#fff!important;
    text-decoration:none!important;
}

#pageFooter-bottom .es-contact-item a:hover{
    color:#FFE1B3!important;
    text-decoration:underline!important;
}

/* ---------- COPYRIGHT / LICENSE ---------- */
#pageFooter-bottom .es-license-text{
    margin:0 0 9px!important;
    padding:0!important;
    color:#fff!important;
    font-size:12.5px!important;
    line-height:1.55!important;
}

#pageFooter-bottom .es-cc-badge{
    display:inline-block!important;
    margin:0 0 8px!important;
    padding:0!important;
    line-height:0!important;
}

#pageFooter-bottom .es-cc-badge img{
    display:block!important;
    width:124px!important;
    height:auto!important;
    max-width:124px!important;
    margin:0!important;
    transform:none!important;
}

#pageFooter-bottom .es-license-text a{
    color:#FFE1B3!important;
    text-decoration:none!important;
}

#pageFooter-bottom .es-license-text a:hover{
    color:#fff!important;
    text-decoration:underline!important;
}

/* ---------- POWERED BY ---------- */
#pageFooter-bottom .es-pkp-title{
    margin:0 0 7px!important;
    color:#fff!important;
    font-size:13px!important;
    font-weight:700!important;
    line-height:1.45!important;
}

#pageFooter-bottom .es-pkp-links{
    display:flex!important;
    flex-direction:column!important;
    gap:5px!important;
}

#pageFooter-bottom .es-pkp-links a{
    color:#fff!important;
    font-size:12.5px!important;
    line-height:1.45!important;
    text-decoration:none!important;
}

#pageFooter-bottom .es-pkp-links a:hover{
    color:#FFE1B3!important;
    text-decoration:underline!important;
}

/* ---------- BOTTOM COPYRIGHT BAR ---------- */
#pageFooter-bottom .es-footer-bottom{
    width:100%!important;
    margin:0!important;
    padding:15px 0 16px!important;
    background:rgba(112,38,5,.28)!important;
    border-top:1px solid rgba(255,255,255,.58)!important;
    box-sizing:border-box!important;
}

#pageFooter-bottom .es-footer-bottom-inner{
    width:var(--es-sa-inner)!important;
    max-width:var(--es-sa-max)!important;
    margin:0 auto!important;
    padding:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:25px!important;
    box-sizing:border-box!important;
}

#pageFooter-bottom .es-footer-copyright{
    margin:0!important;
    color:#fff!important;
    font-size:11.5px!important;
    line-height:1.5!important;
    text-align:left!important;
}

#pageFooter-bottom .es-footer-copyright strong{
    color:#fff!important;
    font-weight:700!important;
}

#pageFooter-bottom .es-footer-meta{
    margin:0!important;
    color:rgba(255,255,255,.92)!important;
    font-size:11.5px!important;
    line-height:1.5!important;
    text-align:right!important;
    white-space:nowrap!important;
}

#pageFooter-bottom .es-footer-meta span{
    margin:0 8px!important;
    opacity:.65!important;
}

/* ---------- STATCOUNTER ---------- */
.es-statcounter{
    width:100%!important;
    margin:0!important;
    padding:5px 10px!important;
    background:#F36C0A!important;
    color:#8F3B0A!important;
    text-align:center!important;
    font-family:Arial,Helvetica,sans-serif!important;
    font-size:10px!important;
    box-sizing:border-box!important;
}

.es-statcounter img{
    width:1px!important;
    height:1px!important;
    max-width:1px!important;
    max-height:1px!important;
    opacity:0!important;
}

.es-statcounter a{
    color:#8F3B0A!important;
    text-decoration:none!important;
}

.es-statcounter a:hover{
    color:#fff!important;
    text-decoration:underline!important;
}

/* ---------- KILL OLD BOOTSTRAP FOOTER STYLING ---------- */
#pageFooter-bottom .panel,
#pageFooter-bottom .panel-success,
#pageFooter-bottom .panel-heading,
#pageFooter-bottom .panel-body,
#pageFooter-bottom .container,
#pageFooter-bottom .lastfooter,
#pageFooter-bottom .row{
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
}

#pageFooter-bottom .panel,
#pageFooter-bottom .panel-success{
    margin:0!important;
    padding:0!important;
}

#pageFooter-bottom .panel-heading,
#pageFooter-bottom .panel-body{
    padding:0!important;
}

/* ---------- TABLET ---------- */
@media(max-width:1100px){
    :root{--es-sa-inner:92%;}

    #pageFooter-bottom .es-footer-container{
        grid-template-columns:1.35fr .85fr!important;
        column-gap:38px!important;
        row-gap:28px!important;
    }

    #pageFooter-bottom .es-footer-column:nth-child(3),
    #pageFooter-bottom .es-footer-column:nth-child(4){
        padding-top:4px!important;
    }
}

@media(max-width:900px){
    .es-indexing-box{
        width:92%!important;
        padding:28px 24px 30px!important;
        border-radius:0 0 20px 20px!important;
    }

    .es-indexing-grid{
        grid-template-columns:repeat(3,minmax(0,1fr))!important;
        gap:13px!important;
    }

    #pageFooter-bottom .es-footer-container{
        width:92%!important;
        grid-template-columns:1.15fr .85fr!important;
        column-gap:32px!important;
        row-gap:28px!important;
        padding:28px 0 24px!important;
    }

    #pageFooter-bottom .es-footer-bottom-inner{
        width:92%!important;
    }
}

/* ---------- MOBILE ---------- */
@media(max-width:600px){
    .es-indexing-box{
        width:94%!important;
        padding:20px 12px 22px!important;
        border-radius:0 0 16px 16px!important;
    }

    .es-indexing-grid{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
        gap:9px!important;
    }

    .es-indexing-grid > a{
        height:52px!important;
        padding:6px!important;
    }

    .es-indexing-grid > a img{
        max-width:105px!important;
        max-height:30px!important;
    }

    #pageFooter-bottom .es-footer-container{
        width:94%!important;
        display:block!important;
        padding:25px 0 18px!important;
    }

    #pageFooter-bottom .es-footer-column{
        width:100%!important;
        margin:0 0 20px!important;
        padding:0 0 19px!important;
        border-bottom:1px solid rgba(255,255,255,.24)!important;
    }

    #pageFooter-bottom .es-footer-column:last-child{
        margin-bottom:0!important;
        padding-bottom:0!important;
        border-bottom:0!important;
    }

    #pageFooter-bottom .es-footer-title{
        margin-bottom:12px!important;
        font-size:17px!important;
    }

    #pageFooter-bottom .es-footer-brand,
    #pageFooter-bottom .es-footer-line,
    #pageFooter-bottom .es-footer-journal,
    #pageFooter-bottom .es-contact-item,
    #pageFooter-bottom .es-license-text,
    #pageFooter-bottom .es-pkp-links a{
        font-size:12.5px!important;
        line-height:1.55!important;
    }

    #pageFooter-bottom .es-footer-bottom{
        padding:12px 0 13px!important;
    }

    #pageFooter-bottom .es-footer-bottom-inner{
        width:94%!important;
        display:block!important;
    }

    #pageFooter-bottom .es-footer-copyright,
    #pageFooter-bottom .es-footer-meta{
        font-size:10.5px!important;
        line-height:1.5!important;
        text-align:center!important;
        white-space:normal!important;
    }

    #pageFooter-bottom .es-footer-meta{
        margin-top:5px!important;
    }

    #pageFooter-bottom .es-footer-meta span{
        margin:0 5px!important;
    }

    .es-statcounter{
        padding:4px 8px!important;
        font-size:9px!important;
    }
}


/* ==========================================================
   EDU SPORTIVO FOOTER V15
   REMOVE OUTER ORANGE FRAME / EXTRA SIDE & TOP AREA
   ----------------------------------------------------------
   The orange footer is kept only on the actual content panel.
   The outer area around the indexing card and footer is WHITE.
   Header / navigation / page content are untouched.
========================================================== */

/* 1. Remove orange background from the outer footer wrapper */
#pageFooter-bottom.es-footer{
    width:100%!important;
    margin:0!important;
    padding:0!important;
    background:#FFFFFF!important;
    box-sizing:border-box!important;
}

/* 2. Remove the orange area ABOVE and BESIDE the indexing card */
#pageFooter-bottom.es-footer .es-indexing-area{
    width:100%!important;
    margin:0!important;
    padding:0!important;
    background:#FFFFFF!important;
    box-sizing:border-box!important;
}

/* Indexing card becomes the actual top edge */
#pageFooter-bottom.es-footer .es-indexing-box{
    width:94%!important;
    max-width:1336px!important;
    margin:0 auto!important;
    padding:34px 38px 38px!important;
    background:#FFFFFF!important;
    border:1px solid #E2E2E2!important;
    border-radius:0 0 24px 24px!important;
    box-shadow:0 8px 24px rgba(0,0,0,.08)!important;
    box-sizing:border-box!important;
}

/* 3. Main orange footer is limited to the real footer panel.
      No orange strip remains outside this panel. */
#pageFooter-bottom.es-footer .es-footer-main{
    width:94%!important;
    max-width:1336px!important;
    margin:0 auto!important;
    padding:0!important;
    background:linear-gradient(
        135deg,
        #F36C0A 0%,
        #C9570C 52%,
        #A9470B 100%
    )!important;
    box-sizing:border-box!important;
}

/* Keep the internal footer content aligned with the orange panel */
#pageFooter-bottom.es-footer .es-footer-container{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:30px 42px 27px!important;
    box-sizing:border-box!important;
}

/* 4. Copyright / license strip stays inside the orange panel */
#pageFooter-bottom.es-footer .es-footer-bottom{
    width:94%!important;
    max-width:1336px!important;
    margin:0 auto!important;
    padding:15px 0 16px!important;
    background:#034526!important;
    border-top:1px solid rgba(255,255,255,.58)!important;
    box-sizing:border-box!important;
}

/* Bottom information aligns with the orange panel */
#pageFooter-bottom.es-footer .es-footer-bottom-inner{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:0 42px!important;
    box-sizing:border-box!important;
}

/* 5. Powered-by / publisher strip remains inside the panel */
#pageFooter-bottom.es-footer .es-footer-powered{
    width:94%!important;
    max-width:1336px!important;
    margin:0 auto!important;
    box-sizing:border-box!important;
}

/* 6. Visitor counter also follows the footer panel,
      instead of creating another full-width orange strip */
.es-statcounter{
    width:94%!important;
    max-width:1336px!important;
    margin:0 auto!important;
    padding:5px 10px!important;
    background:#F36C0A!important;
    color:#8F3B0A!important;
    box-sizing:border-box!important;
    text-align:center!important;
}

/* 7. Eliminate any legacy footer backgrounds that can recreate
      the unwanted outer orange frame */
#pageFooter-bottom.es-footer::before,
#pageFooter-bottom.es-footer::after{
    content:none!important;
    display:none!important;
}

@media(max-width:900px){
    #pageFooter-bottom.es-footer .es-indexing-box{
        width:94%!important;
        max-width:none!important;
        padding:28px 24px 30px!important;
    }

    #pageFooter-bottom.es-footer .es-footer-main,
    #pageFooter-bottom.es-footer .es-footer-bottom,
    #pageFooter-bottom.es-footer .es-footer-powered,
    .es-statcounter{
        width:94%!important;
        max-width:none!important;
    }

    #pageFooter-bottom.es-footer .es-footer-container{
        width:100%!important;
        padding:28px 24px 24px!important;
    }

    #pageFooter-bottom.es-footer .es-footer-bottom-inner{
        width:100%!important;
        padding:0 24px!important;
    }
}

@media(max-width:600px){
    #pageFooter-bottom.es-footer .es-indexing-box{
        width:94%!important;
        padding:20px 12px 22px!important;
        border-radius:0 0 16px 16px!important;
    }

    #pageFooter-bottom.es-footer .es-footer-main,
    #pageFooter-bottom.es-footer .es-footer-bottom,
    #pageFooter-bottom.es-footer .es-footer-powered,
    .es-statcounter{
        width:94%!important;
    }

    #pageFooter-bottom.es-footer .es-footer-container{
        width:100%!important;
        padding:25px 18px 18px!important;
    }

    #pageFooter-bottom.es-footer .es-footer-bottom-inner{
        width:100%!important;
        padding:0 18px!important;
    }
}

/* ==========================================================
   EDU SPORTIVO V16 — SPORT AREA FOOTER MATCH
   Reference: Sport Area visual layout
   ----------------------------------------------------------
   - White page background
   - Orange main footer panel only
   - White indexing card overlaps the orange panel
   - Three equal visual sections: About / Menu / Contact
   - No orange outer frame, side strips, or top strip
   - No vertical separators
   - Copyright line at the bottom with thin white divider
   - Header/navigation/content are untouched
========================================================== */

/* ---------- OUTER FOOTER ---------- */
#pageFooter-bottom.es-footer{
    position:relative!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
    background:#FFFFFF!important;
    color:#FFFFFF!important;
    box-sizing:border-box!important;
    overflow:visible!important;
}

/* ---------- INDEXING AREA ---------- */
#pageFooter-bottom.es-footer .es-indexing-area{
    position:relative!important;
    z-index:30!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
    background:transparent!important;
    box-sizing:border-box!important;
}

#pageFooter-bottom.es-footer .es-indexing-box{
    width:92%!important;
    max-width:1255px!important;
    margin:0 auto!important;
    padding:38px 34px 40px!important;
    background:#FFFFFF!important;
    border:0!important;
    border-radius:0 0 22px 22px!important;
    box-shadow:0 10px 28px rgba(0,0,0,.10)!important;
    box-sizing:border-box!important;
}

#pageFooter-bottom.es-footer .es-indexing-grid{
    display:grid!important;
    grid-template-columns:repeat(6,minmax(0,1fr))!important;
    gap:16px 28px!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
    align-items:center!important;
    box-sizing:border-box!important;
}

#pageFooter-bottom.es-footer .es-indexing-grid > a{
    height:58px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:7px 9px!important;
    background:#FFFFFF!important;
    border:1px solid #DDDDDD!important;
    border-radius:6px!important;
    box-shadow:none!important;
    transform:none!important;
    box-sizing:border-box!important;
}

#pageFooter-bottom.es-footer .es-indexing-grid > a img{
    display:block!important;
    width:auto!important;
    height:auto!important;
    max-width:145px!important;
    max-height:38px!important;
    margin:0 auto!important;
    opacity:.72!important;
    filter:grayscale(100%)!important;
    transform:none!important;
}

#pageFooter-bottom.es-footer .es-indexing-grid > a:hover{
    border-color:#F36C0A!important;
    box-shadow:0 4px 10px rgba(11,37,58,.10)!important;
    transform:translateY(-2px)!important;
}

#pageFooter-bottom.es-footer .es-indexing-grid > a:hover img{
    opacity:1!important;
    filter:grayscale(0%)!important;
}

/* ---------- ORANGE PANEL ---------- */
#pageFooter-bottom.es-footer .es-footer-main{
    position:relative!important;
    z-index:10!important;
    width:90%!important;
    max-width:1336px!important;
    margin:-95px auto 0!important;
    padding:118px 0 0!important;
    background:linear-gradient(
        135deg,
        #F36C0A 0%,
        #C9570C 52%,
        #A9470B 100%
    )!important;
    box-sizing:border-box!important;
}

/* ---------- THREE-COLUMN SPORT AREA CONTENT ---------- */
#pageFooter-bottom.es-footer .es-footer-container{
    width:90%!important;
    max-width:1280px!important;
    margin:0 auto!important;
    padding:29px 0 27px!important;
    display:grid!important;
    grid-template-columns:1.55fr .72fr 1.18fr!important;
    column-gap:64px!important;
    row-gap:0!important;
    box-sizing:border-box!important;
}

#pageFooter-bottom.es-footer .es-footer-column{
    min-width:0!important;
    margin:0!important;
    padding:0!important;
    background:transparent!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
}

/* Remove icon circles so headings match Sport Area */
#pageFooter-bottom.es-footer .es-footer-icon{
    display:none!important;
}

#pageFooter-bottom.es-footer .es-footer-title,
#pageFooter-bottom.es-footer .es-footer-column h3{
    margin:0 0 18px!important;
    padding:0!important;
    color:#FFFFFF!important;
    font-family:Arial,Helvetica,sans-serif!important;
    font-size:19px!important;
    font-weight:700!important;
    line-height:1.3!important;
    text-align:left!important;
}

/* About */
#pageFooter-bottom.es-footer .es-footer-about p{
    max-width:530px!important;
    margin:0!important;
    padding:0!important;
    color:#FFFFFF!important;
    font-size:14px!important;
    font-weight:400!important;
    line-height:1.72!important;
    text-align:left!important;
}

#pageFooter-bottom.es-footer .es-footer-about strong{
    color:#FFFFFF!important;
    font-weight:700!important;
}

/* Menu */
#pageFooter-bottom.es-footer .es-footer-menu{
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    justify-content:flex-start!important;
}

#pageFooter-bottom.es-footer .es-footer-menu a{
    display:block!important;
    width:auto!important;
    margin:0 0 5px!important;
    padding:0!important;
    color:#FFFFFF!important;
    font-size:14px!important;
    font-weight:400!important;
    line-height:1.4!important;
    text-decoration:none!important;
    transform:none!important;
}

#pageFooter-bottom.es-footer .es-footer-menu a:hover{
    color:#FFE1B3!important;
    transform:translateX(3px)!important;
}

/* Contact */
#pageFooter-bottom.es-footer .es-contact-address{
    margin:0!important;
    padding:0!important;
    color:#FFFFFF!important;
    font-size:14px!important;
    font-weight:400!important;
    line-height:1.62!important;
}

#pageFooter-bottom.es-footer .es-contact-address strong{
    color:#FFFFFF!important;
}

/* Social buttons */
#pageFooter-bottom.es-footer .es-social-links{
    display:flex!important;
    align-items:center!important;
    gap:18px!important;
    margin:17px 0 0!important;
    padding:0!important;
}

#pageFooter-bottom.es-footer .es-social-links a{
    width:42px!important;
    height:42px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:50%!important;
    background:#FFFFFF!important;
    color:#F36C0A!important;
    font-size:0!important;
    line-height:1!important;
    box-shadow:0 3px 8px rgba(0,0,0,.12)!important;
    transform:none!important;
}

#pageFooter-bottom.es-footer .es-social-links a::before{
    display:block!important;
    font-family:"FontAwesome"!important;
    font-size:18px!important;
    font-weight:normal!important;
    color:#F36C0A!important;
}

#pageFooter-bottom.es-footer .es-social-links a:nth-child(1)::before{content:"\f0e0"!important;}
#pageFooter-bottom.es-footer .es-social-links a:nth-child(2)::before{content:"\f232"!important;}
#pageFooter-bottom.es-footer .es-social-links a:nth-child(3)::before{content:"\f095"!important;}

#pageFooter-bottom.es-footer .es-social-links a:hover{
    background:#FFF1DF!important;
    transform:translateY(-3px)!important;
}

/* ---------- COPYRIGHT / LICENSE ---------- */
#pageFooter-bottom.es-footer .es-footer-bottom{
    width:90%!important;
    max-width:1336px!important;
    margin:0 auto!important;
    padding:18px 0 19px!important;
    background:rgba(112,38,5,.28)!important;
    border-top:1px solid rgba(255,255,255,.60)!important;
    box-sizing:border-box!important;
}

#pageFooter-bottom.es-footer .es-footer-bottom-inner{
    width:90%!important;
    max-width:1280px!important;
    margin:0 auto!important;
    padding:0!important;
    display:block!important;
    box-sizing:border-box!important;
}

#pageFooter-bottom.es-footer .es-footer-copyright{
    margin:3px 0!important;
    color:#FFFFFF!important;
    font-size:12px!important;
    line-height:1.5!important;
    text-align:left!important;
}

#pageFooter-bottom.es-footer .es-footer-copyright strong{
    color:#FFFFFF!important;
}

#pageFooter-bottom.es-footer .es-footer-meta{
    display:none!important;
}

/* If the legacy powered strip exists, keep it compact like Sport Area */
#pageFooter-bottom.es-footer .es-footer-powered{
    width:90%!important;
    max-width:1336px!important;
    margin:0 auto!important;
    padding:9px 20px!important;
    background:#8F3B0A!important;
    color:rgba(255,255,255,.85)!important;
    font-size:10.5px!important;
    text-align:center!important;
    box-sizing:border-box!important;
}

/* Statcounter: small final line, not a large orange block */
#pageFooter-bottom.es-footer + .es-statcounter,
.es-statcounter{
    width:90%!important;
    max-width:1336px!important;
    margin:0 auto!important;
    padding:5px 10px!important;
    background:#F36C0A!important;
    color:#8F3B0A!important;
    font-size:10px!important;
    text-align:center!important;
    box-sizing:border-box!important;
}

/* ---------- TABLET ---------- */
@media(max-width:900px){
    #pageFooter-bottom.es-footer .es-indexing-box{
        width:92%!important;
        padding:28px 24px 30px!important;
    }

    #pageFooter-bottom.es-footer .es-indexing-grid{
        grid-template-columns:repeat(3,minmax(0,1fr))!important;
        gap:13px!important;
    }

    #pageFooter-bottom.es-footer .es-footer-main{
        width:92%!important;
        margin:-75px auto 0!important;
        padding:98px 0 0!important;
    }

    #pageFooter-bottom.es-footer .es-footer-container{
        width:92%!important;
        grid-template-columns:1.25fr .75fr!important;
        column-gap:38px!important;
        row-gap:28px!important;
        padding:28px 0 24px!important;
    }

    #pageFooter-bottom.es-footer .es-footer-bottom{
        width:92%!important;
    }
}

/* ---------- MOBILE ---------- */
@media(max-width:600px){
    #pageFooter-bottom.es-footer .es-indexing-box{
        width:94%!important;
        padding:22px 12px 24px!important;
        border-radius:0 0 16px 16px!important;
    }

    #pageFooter-bottom.es-footer .es-indexing-grid{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
        gap:9px!important;
    }

    #pageFooter-bottom.es-footer .es-indexing-grid > a{
        height:52px!important;
        padding:6px!important;
    }

    #pageFooter-bottom.es-footer .es-indexing-grid > a img{
        max-width:105px!important;
        max-height:30px!important;
    }

    #pageFooter-bottom.es-footer .es-footer-main{
        width:94%!important;
        margin:-55px auto 0!important;
        padding:75px 0 0!important;
    }

    #pageFooter-bottom.es-footer .es-footer-container{
        width:88%!important;
        display:block!important;
        padding:25px 0 18px!important;
    }

    #pageFooter-bottom.es-footer .es-footer-column{
        width:100%!important;
        margin:0 0 20px!important;
        padding:0 0 18px!important;
        border-bottom:1px solid rgba(255,255,255,.24)!important;
    }

    #pageFooter-bottom.es-footer .es-footer-column:last-child{
        margin-bottom:0!important;
        padding-bottom:0!important;
        border-bottom:0!important;
    }

    #pageFooter-bottom.es-footer .es-footer-title,
    #pageFooter-bottom.es-footer .es-footer-column h3{
        margin-bottom:12px!important;
        font-size:17px!important;
    }

    #pageFooter-bottom.es-footer .es-footer-about p,
    #pageFooter-bottom.es-footer .es-footer-menu a,
    #pageFooter-bottom.es-footer .es-contact-address{
        font-size:12.5px!important;
        line-height:1.55!important;
    }

    #pageFooter-bottom.es-footer .es-footer-bottom{
        width:94%!important;
        padding:13px 0 14px!important;
    }

    #pageFooter-bottom.es-footer .es-footer-bottom-inner{
        width:88%!important;
    }

    #pageFooter-bottom.es-footer .es-footer-copyright{
        font-size:10.5px!important;
        line-height:1.5!important;
        text-align:left!important;
    }

    #pageFooter-bottom.es-footer + .es-statcounter,
    .es-statcounter{
        width:94%!important;
        font-size:9px!important;
    }
}


/* ==========================================================
   EDU SPORTIVO V17 — REMOVE ORANGE FRAME AROUND INDEXING
   ----------------------------------------------------------
   Target:
   - Remove orange ABOVE the indexing card
   - Remove orange BESIDE the indexing card
   - Indexing remains a standalone white card
   - Orange begins ONLY below the indexing card
   - Keep the Sport Area footer proportions/layout
   - Do NOT modify header/navigation/content
========================================================== */

/* ---------- OJS FOOTER WRAPPER: WHITE ---------- */
.pkp_structure_footer_wrapper,
.pkp_structure_footer{
    width:100%!important;
    margin:0!important;
    padding:0!important;
    background:#FFFFFF!important;
    background-image:none!important;
    border:0!important;
    box-shadow:none!important;
    box-sizing:border-box!important;
}

/* ---------- INDEXING: WHITE ONLY ---------- */
.es-indexing-area,
#pageFooter-bottom.es-footer .es-indexing-area{
    position:relative!important;
    z-index:30!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
    background:#FFFFFF!important;
    background-image:none!important;
    border:0!important;
    box-shadow:none!important;
    box-sizing:border-box!important;
}

/* Remove any pseudo-element that could recreate the orange frame */
.es-indexing-area::before,
.es-indexing-area::after,
#pageFooter-bottom.es-footer .es-indexing-area::before,
#pageFooter-bottom.es-footer .es-indexing-area::after{
    content:none!important;
    display:none!important;
    background:none!important;
}

/* ---------- INDEXING CARD ---------- */
.es-indexing-box,
#pageFooter-bottom.es-footer .es-indexing-box{
    position:relative!important;
    z-index:40!important;
    width:92%!important;
    max-width:1255px!important;
    margin:0 auto!important;
    padding:38px 34px 40px!important;
    background:#FFFFFF!important;
    background-image:none!important;
    border:0!important;
    border-radius:0 0 22px 22px!important;
    box-shadow:0 10px 28px rgba(0,0,0,.10)!important;
    box-sizing:border-box!important;
}

/* ---------- IMPORTANT: ORANGE STARTS BELOW INDEXING ---------- */
#pageFooter-bottom.es-footer .es-footer-main{
    position:relative!important;
    z-index:10!important;

    width:90%!important;
    max-width:1336px!important;

    /* Remove the negative overlap that creates orange
       above and beside the indexing card */
    margin:0 auto!important;

    /* No artificial orange space above the footer content */
    padding:0!important;

    background:linear-gradient(
        135deg,
        #F36C0A 0%,
        #C9570C 52%,
        #A9470B 100%
    )!important;

    box-sizing:border-box!important;
}

/* ---------- FOOTER CONTENT ---------- */
#pageFooter-bottom.es-footer .es-footer-container{
    width:90%!important;
    max-width:1280px!important;
    margin:0 auto!important;
    padding:29px 0 27px!important;

    display:grid!important;
    grid-template-columns:1.55fr .72fr 1.18fr!important;
    column-gap:64px!important;
    row-gap:0!important;

    box-sizing:border-box!important;
}

/* ---------- COPYRIGHT ---------- */
#pageFooter-bottom.es-footer .es-footer-bottom{
    width:90%!important;
    max-width:1336px!important;
    margin:0 auto!important;
    padding:18px 0 19px!important;
    background:rgba(112,38,5,.28)!important;
    border-top:1px solid rgba(255,255,255,.60)!important;
    box-sizing:border-box!important;
}

#pageFooter-bottom.es-footer .es-footer-bottom-inner{
    width:90%!important;
    max-width:1280px!important;
    margin:0 auto!important;
    padding:0!important;
    box-sizing:border-box!important;
}

/* ---------- POWERED BAR ---------- */
#pageFooter-bottom.es-footer .es-footer-powered{
    width:90%!important;
    max-width:1336px!important;
    margin:0 auto!important;
    padding:9px 20px!important;
    background:#8F3B0A!important;
    box-sizing:border-box!important;
}

/* ---------- STATCOUNTER ---------- */
#pageFooter-bottom.es-footer + .es-statcounter,
.es-statcounter{
    width:90%!important;
    max-width:1336px!important;
    margin:0 auto!important;
    padding:5px 10px!important;
    background:#F36C0A!important;
    box-sizing:border-box!important;
}

/* ---------- TABLET ---------- */
@media(max-width:900px){

    #pageFooter-bottom.es-footer .es-indexing-box{
        width:92%!important;
        max-width:none!important;
        padding:28px 24px 30px!important;
    }

    #pageFooter-bottom.es-footer .es-indexing-grid{
        grid-template-columns:repeat(3,minmax(0,1fr))!important;
        gap:13px!important;
    }

    #pageFooter-bottom.es-footer .es-footer-main{
        width:92%!important;
        margin:0 auto!important;
        padding:0!important;
    }

    #pageFooter-bottom.es-footer .es-footer-container{
        width:92%!important;
        grid-template-columns:1.25fr .75fr!important;
        column-gap:38px!important;
        row-gap:28px!important;
        padding:28px 0 24px!important;
    }

    #pageFooter-bottom.es-footer .es-footer-bottom,
    #pageFooter-bottom.es-footer .es-footer-powered,
    #pageFooter-bottom.es-footer + .es-statcounter,
    .es-statcounter{
        width:92%!important;
    }
}

/* ---------- MOBILE ---------- */
@media(max-width:600px){

    #pageFooter-bottom.es-footer .es-indexing-box{
        width:94%!important;
        padding:22px 12px 24px!important;
        border-radius:0 0 16px 16px!important;
    }

    #pageFooter-bottom.es-footer .es-indexing-grid{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
        gap:9px!important;
    }

    #pageFooter-bottom.es-footer .es-footer-main{
        width:94%!important;
        margin:0 auto!important;
        padding:0!important;
    }

    #pageFooter-bottom.es-footer .es-footer-container{
        width:88%!important;
        display:block!important;
        padding:25px 0 18px!important;
    }

    #pageFooter-bottom.es-footer .es-footer-bottom{
        width:94%!important;
    }

    #pageFooter-bottom.es-footer .es-footer-bottom-inner{
        width:88%!important;
    }

    #pageFooter-bottom.es-footer .es-footer-powered,
    #pageFooter-bottom.es-footer + .es-statcounter,
    .es-statcounter{
        width:94%!important;
    }
}


/* ==========================================================
   EDU SPORTIVO V18 — FOOTER WIDTH / POSITION ALIGNMENT
   ----------------------------------------------------------
   Based on the current desktop rendering:
   - Indexing card and orange footer must share the SAME
     left/right edges.
   - Remove the narrower 90% footer panel.
   - Footer main, copyright and powered bars follow the
     indexing card width exactly.
   - Footer remains centered.
   - No changes to header/navigation/content.
========================================================== */

/* ---------- DESKTOP: ONE COMMON FOOTER WIDTH ---------- */

#pageFooter-bottom.es-footer .es-indexing-box{
    width:92%!important;
    max-width:1255px!important;
    margin-left:auto!important;
    margin-right:auto!important;
    box-sizing:border-box!important;
}

/* Main orange footer MUST have the same geometry */
#pageFooter-bottom.es-footer .es-footer-main{
    width:92%!important;
    max-width:1255px!important;
    margin-left:auto!important;
    margin-right:auto!important;
    margin-top:0!important;
    padding:0!important;
    box-sizing:border-box!important;
}

/* Internal footer content follows the orange panel */
#pageFooter-bottom.es-footer .es-footer-container{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:29px 58px 27px!important;
    box-sizing:border-box!important;
}

/* Copyright strip = exactly same left/right edge */
#pageFooter-bottom.es-footer .es-footer-bottom{
    width:92%!important;
    max-width:1255px!important;
    margin-left:auto!important;
    margin-right:auto!important;
    box-sizing:border-box!important;
}

#pageFooter-bottom.es-footer .es-footer-bottom-inner{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:0 58px!important;
    box-sizing:border-box!important;
}

/* Powered-by strip = exactly same width */
#pageFooter-bottom.es-footer .es-footer-powered{
    width:92%!important;
    max-width:1255px!important;
    margin-left:auto!important;
    margin-right:auto!important;
    box-sizing:border-box!important;
}

/* Visitor counter follows the same footer width */
#pageFooter-bottom.es-footer + .es-statcounter,
.es-statcounter{
    width:92%!important;
    max-width:1255px!important;
    margin-left:auto!important;
    margin-right:auto!important;
    box-sizing:border-box!important;
}


/* ---------- TABLET ---------- */
@media(max-width:900px){

    #pageFooter-bottom.es-footer .es-indexing-box{
        width:92%!important;
        max-width:none!important;
    }

    #pageFooter-bottom.es-footer .es-footer-main{
        width:92%!important;
        max-width:none!important;
        margin:0 auto!important;
        padding:0!important;
    }

    #pageFooter-bottom.es-footer .es-footer-container{
        width:100%!important;
        max-width:none!important;
        padding:28px 30px 24px!important;
    }

    #pageFooter-bottom.es-footer .es-footer-bottom,
    #pageFooter-bottom.es-footer .es-footer-powered,
    #pageFooter-bottom.es-footer + .es-statcounter,
    .es-statcounter{
        width:92%!important;
        max-width:none!important;
    }

    #pageFooter-bottom.es-footer .es-footer-bottom-inner{
        width:100%!important;
        max-width:none!important;
        padding:0 30px!important;
    }
}


/* ---------- MOBILE ---------- */
@media(max-width:600px){

    #pageFooter-bottom.es-footer .es-indexing-box{
        width:94%!important;
        max-width:none!important;
    }

    #pageFooter-bottom.es-footer .es-footer-main{
        width:94%!important;
        max-width:none!important;
        margin:0 auto!important;
        padding:0!important;
    }

    #pageFooter-bottom.es-footer .es-footer-container{
        width:100%!important;
        padding:25px 22px 18px!important;
    }

    #pageFooter-bottom.es-footer .es-footer-bottom,
    #pageFooter-bottom.es-footer .es-footer-powered,
    #pageFooter-bottom.es-footer + .es-statcounter,
    .es-statcounter{
        width:94%!important;
        max-width:none!important;
    }

    #pageFooter-bottom.es-footer .es-footer-bottom-inner{
        width:100%!important;
        padding:0 22px!important;
    }
}


/* ==========================================================
   EDU SPORTIVO V19 — EXACT CONTAINER ALIGNMENT
   ----------------------------------------------------------
   The previous V18 used 92% / 1255px, which is wider than
   the OJS content container visible above the footer.

   V19 uses ONE fixed responsive maximum width:
       desktop : 1160px
       tablet  : calc(100% - 40px)
       mobile  : calc(100% - 24px)

   The SAME container is applied to:
   - Indexing card
   - Main orange footer
   - Copyright bar
   - Powered-by bar
   - Visitor counter

   This removes the left/right mismatch visible in the screenshot.
========================================================== */

/* ==========================================================
   DESKTOP — COMMON 1160px CONTAINER
========================================================== */

.es-indexing-box,
#pageFooter-bottom.es-footer .es-footer-main,
#pageFooter-bottom.es-footer .es-footer-bottom,
#pageFooter-bottom.es-footer .es-footer-powered,
#pageFooter-bottom.es-footer + .es-statcounter,
.es-statcounter{
    width:1160px!important;
    max-width:calc(100% - 40px)!important;
    margin-left:auto!important;
    margin-right:auto!important;
    box-sizing:border-box!important;
}

/* Indexing itself remains full white page background */
.es-indexing-area{
    width:100%!important;
    margin:0!important;
    padding:0!important;
    background:#FFFFFF!important;
    box-sizing:border-box!important;
}

/* Indexing card fills the common container */
.es-indexing-box{
    padding-left:34px!important;
    padding-right:34px!important;
    margin-top:0!important;
    margin-bottom:0!important;
}

/* Main orange panel */
#pageFooter-bottom.es-footer .es-footer-main{
    margin-top:0!important;
    padding:0!important;
}

/* Footer inner content fills the orange panel */
#pageFooter-bottom.es-footer .es-footer-container{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:29px 58px 27px!important;
    box-sizing:border-box!important;
}

/* Copyright follows exactly the same 1160px edge */
#pageFooter-bottom.es-footer .es-footer-bottom{
    padding:18px 0 19px!important;
    box-sizing:border-box!important;
}

#pageFooter-bottom.es-footer .es-footer-bottom-inner{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:0 58px!important;
    box-sizing:border-box!important;
}

/* Powered by follows exactly the same edge */
#pageFooter-bottom.es-footer .es-footer-powered{
    box-sizing:border-box!important;
}

/* Visitor counter follows exactly the same edge */
#pageFooter-bottom.es-footer + .es-statcounter,
.es-statcounter{
    box-sizing:border-box!important;
}


/* ==========================================================
   REMOVE ANY PREVIOUS WIDTH / OFFSET OVERRIDES
========================================================== */

#pageFooter-bottom.es-footer .es-footer-main,
#pageFooter-bottom.es-footer .es-footer-bottom,
#pageFooter-bottom.es-footer .es-footer-powered{
    left:auto!important;
    right:auto!important;
    transform:none!important;
}

/* No negative overlap */
#pageFooter-bottom.es-footer .es-footer-main{
    margin-top:0!important;
}


/* ==========================================================
   TABLET
========================================================== */

@media(max-width:900px){

    .es-indexing-box,
    #pageFooter-bottom.es-footer .es-footer-main,
    #pageFooter-bottom.es-footer .es-footer-bottom,
    #pageFooter-bottom.es-footer .es-footer-powered,
    #pageFooter-bottom.es-footer + .es-statcounter,
    .es-statcounter{
        width:calc(100% - 40px)!important;
        max-width:none!important;
        margin-left:auto!important;
        margin-right:auto!important;
    }

    #pageFooter-bottom.es-footer .es-footer-container{
        width:100%!important;
        padding:28px 30px 24px!important;
    }

    #pageFooter-bottom.es-footer .es-footer-bottom-inner{
        width:100%!important;
        padding:0 30px!important;
    }
}


/* ==========================================================
   MOBILE
========================================================== */

@media(max-width:600px){

    .es-indexing-box,
    #pageFooter-bottom.es-footer .es-footer-main,
    #pageFooter-bottom.es-footer .es-footer-bottom,
    #pageFooter-bottom.es-footer .es-footer-powered,
    #pageFooter-bottom.es-footer + .es-statcounter,
    .es-statcounter{
        width:calc(100% - 24px)!important;
        max-width:none!important;
        margin-left:auto!important;
        margin-right:auto!important;
    }

    #pageFooter-bottom.es-footer .es-footer-container{
        width:100%!important;
        padding:25px 20px 18px!important;
    }

    #pageFooter-bottom.es-footer .es-footer-bottom-inner{
        width:100%!important;
        padding:0 20px!important;
    }
}


/* ==========================================================
   EDU SPORTIVO V20 — FOOTER ONLY / MAIN CONTENT ALIGNMENT
   ----------------------------------------------------------
   FINAL POSITION FIX:
   - Header / navigation: untouched
   - Main content / sidebar: untouched
   - Only the footer and its indexing area are repositioned
   - Footer follows the same centered 1160px page container
   - No new grid, no transform, no negative margins
   ========================================================== */

/* Keep the OJS footer wrapper as the full-page white background */
.pkp_structure_footer_wrapper{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    background:#FFFFFF!important;
    border:0!important;
    box-shadow:none!important;
    box-sizing:border-box!important;
}

/* The actual footer contents share one common page-container width */
.es-indexing-box,
#pageFooter-bottom.es-footer .es-footer-main,
#pageFooter-bottom.es-footer .es-footer-bottom,
#pageFooter-bottom.es-footer .es-footer-powered,
#pageFooter-bottom.es-footer + .es-statcounter,
.es-statcounter{
    width:100%!important;
    max-width:1160px!important;
    margin-left:auto!important;
    margin-right:auto!important;
    box-sizing:border-box!important;
}

/* Do NOT stretch the orange panel to the browser viewport */
#pageFooter-bottom.es-footer .es-footer-main{
    margin-top:0!important;
    margin-bottom:0!important;
    left:auto!important;
    right:auto!important;
    transform:none!important;
}

/* Indexing card uses the same outer edge as the orange footer */
#pageFooter-bottom.es-footer .es-indexing-area,
.es-indexing-area{
    width:100%!important;
    margin:0!important;
    padding:0!important;
    background:#FFFFFF!important;
    box-sizing:border-box!important;
}

/* Preserve the existing indexing-card appearance;
   only its position/width is controlled here. */
.es-indexing-box,
#pageFooter-bottom.es-footer .es-indexing-box{
    width:100%!important;
    max-width:1160px!important;
    margin-left:auto!important;
    margin-right:auto!important;
    box-sizing:border-box!important;
}

/* Main footer panel */
#pageFooter-bottom.es-footer .es-footer-main{
    width:100%!important;
    max-width:1160px!important;
    padding-top:0!important;
    box-sizing:border-box!important;
}

/* Footer internal content must fill the panel,
   not create a second narrower/wider container */
#pageFooter-bottom.es-footer .es-footer-container{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    box-sizing:border-box!important;
}

/* Copyright bar */
#pageFooter-bottom.es-footer .es-footer-bottom{
    width:100%!important;
    max-width:1160px!important;
    margin-left:auto!important;
    margin-right:auto!important;
    box-sizing:border-box!important;
}

/* Powered-by bar */
#pageFooter-bottom.es-footer .es-footer-powered{
    width:100%!important;
    max-width:1160px!important;
    margin-left:auto!important;
    margin-right:auto!important;
    box-sizing:border-box!important;
}

/* Visitor counter */
#pageFooter-bottom.es-footer + .es-statcounter,
.es-statcounter{
    width:100%!important;
    max-width:1160px!important;
    margin-left:auto!important;
    margin-right:auto!important;
    box-sizing:border-box!important;
}

/* ----------------------------------------------------------
   RESPONSIVE
   ---------------------------------------------------------- */

@media (max-width:1200px){
    .es-indexing-box,
    #pageFooter-bottom.es-footer .es-footer-main,
    #pageFooter-bottom.es-footer .es-footer-bottom,
    #pageFooter-bottom.es-footer .es-footer-powered,
    #pageFooter-bottom.es-footer + .es-statcounter,
    .es-statcounter{
        width:calc(100% - 40px)!important;
        max-width:none!important;
    }
}

@media (max-width:600px){
    .es-indexing-box,
    #pageFooter-bottom.es-footer .es-footer-main,
    #pageFooter-bottom.es-footer .es-footer-bottom,
    #pageFooter-bottom.es-footer .es-footer-powered,
    #pageFooter-bottom.es-footer + .es-statcounter,
    .es-statcounter{
        width:calc(100% - 24px)!important;
        max-width:none!important;
    }
}



/* ==========================================================
   EDU SPORTIVO V21 — TRUE FOOTER EDGE ALIGNMENT
   ----------------------------------------------------------
   IMPORTANT:
   V20 aligned only the inner custom footer blocks.
   V21 also resets the OJS footer parent/container layers
   so that no inherited max-width, padding, or Bootstrap
   container can shift the orange footer horizontally.

   Header / navigation / main content are NOT changed.
   ========================================================== */

/* 1. FOOTER OUTER LAYERS: no hidden container offset */
.pkp_structure_footer_wrapper,
.pkp_structure_footer,
#pageFooter-bottom.es-footer{
    width:100%!important;
    max-width:none!important;
    margin-left:0!important;
    margin-right:0!important;
    padding-left:0!important;
    padding-right:0!important;
    box-sizing:border-box!important;
}

/* 2. One and only one desktop footer container.
      1160px matches the journal's existing OJS header/content
      container used elsewhere in this stylesheet. */
#pageFooter-bottom.es-footer .es-indexing-area{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    box-sizing:border-box!important;
    background:#FFFFFF!important;
}

#pageFooter-bottom.es-footer .es-indexing-box,
#pageFooter-bottom.es-footer .es-footer-main,
#pageFooter-bottom.es-footer .es-footer-bottom,
#pageFooter-bottom.es-footer .es-footer-powered,
#pageFooter-bottom.es-footer + .es-statcounter,
.pkp_structure_footer > .es-statcounter,
.es-statcounter{
    width:calc(100% - 40px)!important;
    max-width:1160px!important;
    margin-left:auto!important;
    margin-right:auto!important;
    box-sizing:border-box!important;
}

/* 3. Kill every legacy offset/overlap on the orange panel */
#pageFooter-bottom.es-footer .es-footer-main{
    position:relative!important;
    left:auto!important;
    right:auto!important;
    top:auto!important;
    bottom:auto!important;
    transform:none!important;
    margin-top:0!important;
    margin-bottom:0!important;
    padding-top:0!important;
}

/* 4. Footer internal wrapper cannot create a second horizontal
      container. Its left/right edge is exactly the orange panel. */
#pageFooter-bottom.es-footer .es-footer-container{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding-left:58px!important;
    padding-right:58px!important;
    box-sizing:border-box!important;
}

/* 5. Copyright inner wrapper must NOT be narrower than its bar */
#pageFooter-bottom.es-footer .es-footer-bottom-inner{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding-left:58px!important;
    padding-right:58px!important;
    box-sizing:border-box!important;
}

/* 6. Powered/statcounter bars */
#pageFooter-bottom.es-footer .es-footer-powered,
#pageFooter-bottom.es-footer + .es-statcounter,
.es-statcounter{
    left:auto!important;
    right:auto!important;
    transform:none!important;
}

/* 7. Desktop: keep the same geometry all the way down */
@media (min-width:1201px){
    #pageFooter-bottom.es-footer .es-indexing-box,
    #pageFooter-bottom.es-footer .es-footer-main,
    #pageFooter-bottom.es-footer .es-footer-bottom,
    #pageFooter-bottom.es-footer .es-footer-powered,
    #pageFooter-bottom.es-footer + .es-statcounter,
    .es-statcounter{
        width:1160px!important;
        max-width:1160px!important;
    }
}

/* 8. Tablet: 20px page gutter */
@media (max-width:1200px) and (min-width:601px){
    #pageFooter-bottom.es-footer .es-indexing-box,
    #pageFooter-bottom.es-footer .es-footer-main,
    #pageFooter-bottom.es-footer .es-footer-bottom,
    #pageFooter-bottom.es-footer .es-footer-powered,
    #pageFooter-bottom.es-footer + .es-statcounter,
    .es-statcounter{
        width:calc(100% - 40px)!important;
        max-width:none!important;
    }

    #pageFooter-bottom.es-footer .es-footer-container,
    #pageFooter-bottom.es-footer .es-footer-bottom-inner{
        padding-left:30px!important;
        padding-right:30px!important;
    }
}

/* 9. Mobile: 12px page gutter */
@media (max-width:600px){
    #pageFooter-bottom.es-footer .es-indexing-box,
    #pageFooter-bottom.es-footer .es-footer-main,
    #pageFooter-bottom.es-footer .es-footer-bottom,
    #pageFooter-bottom.es-footer .es-footer-powered,
    #pageFooter-bottom.es-footer + .es-statcounter,
    .es-statcounter{
        width:calc(100% - 24px)!important;
        max-width:none!important;
    }

    #pageFooter-bottom.es-footer .es-footer-container,
    #pageFooter-bottom.es-footer .es-footer-bottom-inner{
        padding-left:20px!important;
        padding-right:20px!important;
    }
}

/* 10. Never let a Bootstrap .container inside the custom footer
       reintroduce a different width. */
#pageFooter-bottom.es-footer .container,
#pageFooter-bottom.es-footer .row{
    width:100%!important;
    max-width:none!important;
    margin-left:0!important;
    margin-right:0!important;
    padding-left:0!important;
    padding-right:0!important;
    box-sizing:border-box!important;
}


/* ==========================================================
   EDU SPORTIVO V22 — PREMIUM ORANGE COLOR SYSTEM
   ----------------------------------------------------------
   Color system:
   Primary      #F36C0A
   Primary Dark #034526
   Bright       #F36C0A
   Gold         #F6A623
   Soft         #F5F9F7
   Cream        #F5F9F7
   Charcoal     #2B2B2B

   This layer preserves the existing layout and OJS structure.
   ========================================================== */

:root{
    --es-orange:#F36C0A;
    --es-orange-dark:#034526;
    --es-orange-bright:#F36C0A;
    --es-gold:#F6A623;
    --es-orange-soft:#F5F9F7;
    --es-cream:#F5F9F7;
    --es-border:#D5E8DF;
    --es-text:#2B2B2B;
    --es-muted:#666666;
}

/* General academic typography contrast */
body{
    color:var(--es-text);
}

h1,h2,h3,h4,h5,h6{
    color:var(--es-orange);
}

a{
    color:var(--es-orange);
}

a:hover,
a:focus{
    color:var(--es-orange-dark);
}

/* Soft section backgrounds without changing structure */
.sp-info,
.sp-card{
    border-color:var(--es-border);
}

.sp-info:hover{
    background:var(--es-cream)!important;
    box-shadow:0 14px 28px rgba(243,108,10,.14)!important;
}

/* Premium buttons */
.sp-btn{
    background:linear-gradient(135deg,var(--es-orange),var(--es-orange-bright))!important;
    border-color:var(--es-orange)!important;
    color:#fff!important;
    box-shadow:0 8px 20px rgba(243,108,10,.18);
}

.sp-btn:hover{
    background:linear-gradient(135deg,var(--es-orange-dark),var(--es-orange))!important;
    box-shadow:0 14px 30px rgba(243,108,10,.28)!important;
}

/* Header/navigation: clean orange + cream interaction */
.pkp_navigation_primary > li > a:hover,
.pkp_navigation_primary > li > a:focus,
.pkp_navigation_primary_row .pkp_search a:hover,
.pkp_navigation_primary_row .pkp_search button:hover,
.pkp_navigation_primary_row .pkp_search .search_prompt:hover{
    background:var(--es-cream)!important;
    color:var(--es-orange-dark)!important;
    -webkit-text-fill-color:var(--es-orange-dark)!important;
}

/* Active-looking navigation underline, without changing menu geometry */
.pkp_navigation_primary > li > a{
    position:relative!important;
}

.pkp_navigation_primary > li > a::after{
    content:"";
    position:absolute;
    left:12px;
    right:12px;
    bottom:0;
    height:3px;
    border-radius:3px 3px 0 0;
    background:linear-gradient(90deg,var(--es-orange),var(--es-gold));
    transform:scaleX(0);
    transform-origin:center;
    transition:transform .25s ease;
}

.pkp_navigation_primary > li > a:hover::after,
.pkp_navigation_primary > li > a:focus::after{
    transform:scaleX(1);
}

/* Dropdown */
.pkp_navigation_primary .dropdown-menu{
    border-color:var(--es-border)!important;
    box-shadow:0 12px 28px rgba(243,108,10,.14)!important;
}

.pkp_navigation_primary .dropdown-menu > li > a:hover,
.pkp_navigation_primary .dropdown-menu > li > a:focus{
    background:var(--es-orange-soft)!important;
    color:var(--es-orange-dark)!important;
    -webkit-text-fill-color:var(--es-orange-dark)!important;
}

/* Sidebar: softer academic card treatment */
.sidebar-title{
    background:linear-gradient(135deg,var(--es-orange-dark),var(--es-orange),var(--es-orange-bright))!important;
    box-shadow:0 8px 20px rgba(243,108,10,.20)!important;
}

.content .gap-2 .m-menu{
    border-color:var(--es-border)!important;
    color:var(--es-orange)!important;
    box-shadow:0 3px 12px rgba(243,108,10,.07)!important;
}

.content .gap-2 .m-menu::before{
    background:linear-gradient(90deg,var(--es-orange-dark),var(--es-orange),var(--es-orange-bright))!important;
}

.content .gap-2 .m-menu:hover{
    box-shadow:0 9px 20px rgba(243,108,10,.18)!important;
}

/* Gold accent for small highlights/statistic elements */
.es-statcounter,
.journal-metrics,
.journal-metrics *,
.metrics-card{
    --metric-accent:var(--es-gold);
}

/* Footer: maintain existing alignment while improving visual depth */
#pageFooter-bottom.es-footer .es-footer-main{
    background:linear-gradient(135deg,var(--es-orange-dark),var(--es-orange),var(--es-orange-bright))!important;
}

#pageFooter-bottom.es-footer .es-footer-bottom{
    background:var(--es-orange-dark)!important;
}

#pageFooter-bottom.es-footer .es-footer-powered{
    background:var(--es-cream)!important;
    border-top:1px solid var(--es-border)!important;
}

/* Accessibility: visible keyboard focus */
a:focus-visible,
button:focus-visible,
.pkp_navigation_primary > li > a:focus-visible{
    outline:2px solid var(--es-gold)!important;
    outline-offset:3px;
}

/* Respect reduced-motion preferences */
@media (prefers-reduced-motion:reduce){
    *,
    *::before,
    *::after{
        animation-duration:.01ms!important;
        animation-iteration-count:1!important;
        scroll-behavior:auto!important;
        transition-duration:.01ms!important;
    }
}


/* ==========================================================
   EDU SPORTIVO V23 — ORANGE + NAVY PREMIUM SYSTEM
   ----------------------------------------------------------
   Brand Orange : #F36C0A
   Navy         : #034526
   Deep Navy    : #034526
   Soft Navy    : #EAF5F0
   Cream        : #FFF8F0
   Gold Accent  : #F6A623

   Design principle:
   Orange = identity, CTA, active accents
   Navy   = structure, academic authority, contrast
   ========================================================== */

:root{
    --es-orange:#F36C0A;
    --es-orange-dark:#E65300;
    --es-orange-bright:#FF7A00;
    --es-navy:#034526;
    --es-navy-dark:#034526;
    --es-navy-soft:#EAF5F0;
    --es-cream:#FFF8F0;
    --es-border:#D5E8DF;
    --es-gold:#F6A623;
    --es-text:#263238;
    --es-muted:#60717D;
}

/* ---------- GLOBAL ---------- */
body{
    color:var(--es-text);
    background:#fff!important;
}

h1,h2,h3,h4{
    color:var(--es-navy)!important;
}

h5,h6{
    color:var(--es-navy);
}

a{
    color:var(--es-orange);
}

a:hover,
a:focus{
    color:var(--es-navy)!important;
}

/* ---------- HERO / CONTENT ---------- */
.hero-banner::after{
    background:linear-gradient(
        90deg,
        rgba(11,37,58,.28),
        rgba(243,108,10,.12)
    );
}

.sp-card{
    border:1px solid var(--es-border);
}

.sp-card:hover{
    box-shadow:0 18px 35px rgba(11,37,58,.16)!important;
}

.sp-cover img:hover{
    box-shadow:0 18px 35px rgba(11,37,58,.22)!important;
}

/* ---------- BUTTONS ---------- */
.sp-btn{
    background:linear-gradient(
        135deg,
        var(--es-orange),
        var(--es-orange-bright)
    )!important;
    color:#fff!important;
    border-color:var(--es-orange)!important;
    box-shadow:0 8px 20px rgba(243,108,10,.22);
}

.sp-btn:hover{
    background:linear-gradient(
        135deg,
        var(--es-navy),
        var(--es-navy-dark)
    )!important;
    color:#fff!important;
    box-shadow:0 14px 30px rgba(11,37,58,.28)!important;
}

/* Secondary buttons/links where supported */
.sp-btn.secondary,
.sp-btn.outline,
.sp-btn.alt{
    background:var(--es-navy)!important;
    border-color:var(--es-navy)!important;
}

/* ---------- QUICK INFO ---------- */
.sp-info{
    border:1px solid var(--es-border);
}

.sp-info:hover{
    background:var(--es-navy-soft)!important;
    box-shadow:0 14px 24px rgba(11,37,58,.12)!important;
}

/* ---------- SIDEBAR ---------- */
.sidebar-title{
    background:linear-gradient(
        135deg,
        var(--es-navy-dark) 0%,
        var(--es-navy) 68%,
        var(--es-orange) 100%
    )!important;
    color:#fff!important;
    box-shadow:0 10px 22px rgba(11,37,58,.20)!important;
}

.content .gap-2 .m-menu{
    background:#fff!important;
    border:1px solid var(--es-border)!important;
    color:var(--es-navy)!important;
    box-shadow:0 3px 12px rgba(11,37,58,.07)!important;
}

.content .gap-2 .m-menu span{
    color:var(--es-navy)!important;
}

.content .gap-2 .m-menu em,
.content .gap-2 .m-menu::after{
    color:var(--es-orange)!important;
}

.content .gap-2 .m-menu::before{
    background:linear-gradient(
        90deg,
        var(--es-navy-dark),
        var(--es-navy)
    )!important;
}

.content .gap-2 .m-menu:hover{
    color:#fff!important;
    border-color:var(--es-navy)!important;
    box-shadow:0 9px 20px rgba(11,37,58,.18)!important;
}

.content .gap-2 .m-menu:hover span,
.content .gap-2 .m-menu:hover em,
.content .gap-2 .m-menu:hover::after{
    color:#fff!important;
}

.content .gap-2 .m-menu:focus-visible{
    outline:2px solid var(--es-orange)!important;
}

/* ---------- HEADER / USER MENU ---------- */
.pkp_navigation_user > li > a,
.pkp_structure_head .pkp_navigation_user_wrapper
 .pkp_navigation_user > li > a{
    color:var(--es-navy)!important;
    -webkit-text-fill-color:var(--es-navy)!important;
}

.pkp_navigation_user > li > a:hover,
.pkp_structure_head .pkp_navigation_user_wrapper
 .pkp_navigation_user > li > a:hover{
    color:var(--es-orange)!important;
    -webkit-text-fill-color:var(--es-orange)!important;
}

/* ---------- PRIMARY NAVIGATION ---------- */
.pkp_site_nav_menu{
    border-bottom:3px solid var(--es-orange)!important;
    box-shadow:0 5px 18px rgba(11,37,58,.10)!important;
}

.pkp_navigation_primary > li > a{
    color:var(--es-navy)!important;
    -webkit-text-fill-color:var(--es-navy)!important;
    position:relative!important;
}

.pkp_navigation_primary > li > a::before{
    color:var(--es-orange)!important;
    -webkit-text-fill-color:var(--es-orange)!important;
}

.pkp_navigation_primary > li > a:hover,
.pkp_navigation_primary > li > a:focus{
    color:var(--es-orange)!important;
    -webkit-text-fill-color:var(--es-orange)!important;
    background:var(--es-navy-soft)!important;
}

/* Orange active/hover indicator */
.pkp_navigation_primary > li > a::after{
    content:""!important;
    position:absolute!important;
    left:12px!important;
    right:12px!important;
    bottom:0!important;
    height:3px!important;
    background:var(--es-orange)!important;
    border-radius:3px 3px 0 0!important;
    transform:scaleX(0)!important;
    transition:transform .25s ease!important;
}

.pkp_navigation_primary > li > a:hover::after,
.pkp_navigation_primary > li > a:focus::after{
    transform:scaleX(1)!important;
}

/* ---------- SEARCH ---------- */
.pkp_search .search_prompt,
.pkp_search a,
.pkp_search button,
.pkp_navigation_primary_row .pkp_search a,
.pkp_navigation_primary_row .pkp_search button{
    color:var(--es-navy)!important;
    -webkit-text-fill-color:var(--es-navy)!important;
}

.pkp_search a:hover,
.pkp_search button:hover,
.pkp_search .search_prompt:hover,
.pkp_navigation_primary_row .pkp_search a:hover,
.pkp_navigation_primary_row .pkp_search button:hover{
    color:var(--es-orange)!important;
    -webkit-text-fill-color:var(--es-orange)!important;
    background:var(--es-navy-soft)!important;
}

.pkp_navigation_primary_row .pkp_search a::before,
.pkp_navigation_primary_row .pkp_search button::before,
.pkp_navigation_primary_row .pkp_search .search_prompt::before{
    color:var(--es-orange)!important;
    -webkit-text-fill-color:var(--es-orange)!important;
}

/* ---------- DROPDOWN ---------- */
.pkp_navigation_primary .dropdown-menu{
    border:1px solid var(--es-border)!important;
    box-shadow:0 12px 28px rgba(11,37,58,.16)!important;
}

.pkp_navigation_primary .dropdown-menu > li > a,
.pkp_navigation_primary .dropdown-menu > li > a *,
.pkp_navigation_primary .dropdown-menu a{
    color:var(--es-navy)!important;
    -webkit-text-fill-color:var(--es-navy)!important;
}

.pkp_navigation_primary .dropdown-menu > li > a:hover,
.pkp_navigation_primary .dropdown-menu > li > a:focus{
    background:var(--es-navy-soft)!important;
    color:var(--es-orange)!important;
    -webkit-text-fill-color:var(--es-orange)!important;
}

/* ---------- METRICS / ACCENT AREAS ---------- */
.journal-metrics,
.metrics-card,
.es-statcounter{
    border-color:var(--es-border)!important;
}

.journal-metrics h1,
.journal-metrics h2,
.journal-metrics h3,
.metrics-card h1,
.metrics-card h2,
.metrics-card h3{
    color:var(--es-navy)!important;
}

.journal-metrics strong,
.metrics-card strong,
.es-statcounter strong{
    color:var(--es-orange)!important;
}

/* ---------- FOOTER ---------- */
/* Navy becomes the structural footer color; orange is the accent. */
#pageFooter-bottom.es-footer .es-footer-main{
    background:linear-gradient(
        135deg,
        var(--es-navy-dark) 0%,
        var(--es-navy) 72%,
        var(--es-orange) 100%
    )!important;
}

#pageFooter-bottom.es-footer .es-footer-bottom{
    background:var(--es-navy-dark)!important;
    border-top:2px solid var(--es-orange)!important;
}

#pageFooter-bottom.es-footer .es-footer-powered{
    background:var(--es-navy-soft)!important;
    border-top:1px solid var(--es-border)!important;
    color:var(--es-navy)!important;
}

#pageFooter-bottom.es-footer a{
    color:#fff!important;
}

#pageFooter-bottom.es-footer a:hover{
    color:var(--es-orange)!important;
}

/* ---------- FOCUS / ACCESSIBILITY ---------- */
a:focus-visible,
button:focus-visible,
.pkp_navigation_primary > li > a:focus-visible{
    outline:2px solid var(--es-orange)!important;
    outline-offset:3px;
}

/* ---------- MOBILE ---------- */
@media(max-width:600px){
    .pkp_site_nav_menu{
        border-bottom-width:2px!important;
    }

    .pkp_navigation_primary > li > a::after{
        left:7px!important;
        right:7px!important;
    }
}

/* ---------- REDUCED MOTION ---------- */
@media(prefers-reduced-motion:reduce){
    *,
    *::before,
    *::after{
        animation-duration:.01ms!important;
        animation-iteration-count:1!important;
        scroll-behavior:auto!important;
        transition-duration:.01ms!important;
    }
}


/* ==========================================================
   EDU SPORTIVO V24 — DEEP GREEN + ORANGE PREMIUM
   ----------------------------------------------------------
   Deep Green   #034526  -> structural / academic color
   Sport Green  #007A52  -> secondary green / hover
   Orange       #FF6002  -> Edu Sportivo identity / CTA
   Bright Orange#FF7A00  -> highlight
   Soft Green   #EAF5F0  -> soft backgrounds
   Soft Orange  #FFF1E6  -> warm accents
   Charcoal     #263238  -> body text
   ========================================================== */

:root{
    --es-green:#034526;
    --es-green-dark:#02351D;
    --es-green-mid:#007A52;
    --es-green-soft:#EAF5F0;
    --es-orange:#FF6002;
    --es-orange-dark:#E65300;
    --es-orange-bright:#FF7A00;
    --es-orange-soft:#FFF1E6;
    --es-gold:#F6A623;
    --es-text:#263238;
    --es-muted:#60736B;
    --es-border:#D5E8DF;
}

/* ---------- GLOBAL ---------- */
body{
    color:var(--es-text);
    background:#fff!important;
}

h1,h2,h3,h4{
    color:var(--es-green)!important;
}

h5,h6{
    color:var(--es-green);
}

a{
    color:var(--es-orange);
}

a:hover,
a:focus{
    color:var(--es-green)!important;
}

/* ---------- HERO ---------- */
.hero-banner::after{
    background:linear-gradient(
        90deg,
        rgba(3,69,38,.34),
        rgba(255,96,2,.12)
    );
}

/* ---------- CARDS ---------- */
.sp-card{
    border-color:var(--es-border)!important;
}

.sp-card:hover{
    box-shadow:0 18px 35px rgba(3,69,38,.16)!important;
}

.sp-cover img:hover{
    box-shadow:0 18px 35px rgba(3,69,38,.22)!important;
}

/* ---------- BUTTONS ---------- */
.sp-btn{
    background:linear-gradient(
        135deg,
        var(--es-orange),
        var(--es-orange-bright)
    )!important;
    border-color:var(--es-orange)!important;
    color:#fff!important;
    box-shadow:0 8px 20px rgba(255,96,2,.22);
}

.sp-btn:hover{
    background:linear-gradient(
        135deg,
        var(--es-green),
        var(--es-green-mid)
    )!important;
    color:#fff!important;
    box-shadow:0 14px 30px rgba(3,69,38,.26)!important;
}

/* ---------- QUICK INFO ---------- */
.sp-info{
    border-color:var(--es-border)!important;
}

.sp-info:hover{
    background:var(--es-green-soft)!important;
    box-shadow:0 14px 24px rgba(3,69,38,.12)!important;
}

/* ---------- SIDEBAR ---------- */
.sidebar-title{
    background:linear-gradient(
        135deg,
        var(--es-green-dark) 0%,
        var(--es-green) 62%,
        var(--es-orange) 100%
    )!important;
    color:#fff!important;
    box-shadow:0 9px 20px rgba(3,69,38,.20)!important;
}

.content .gap-2 .m-menu{
    background:#fff!important;
    border-color:var(--es-border)!important;
    color:var(--es-green)!important;
    box-shadow:0 3px 10px rgba(3,69,38,.08)!important;
}

.content .gap-2 .m-menu span{
    color:var(--es-green)!important;
}

.content .gap-2 .m-menu em,
.content .gap-2 .m-menu::after{
    color:var(--es-orange)!important;
}

.content .gap-2 .m-menu::before{
    background:linear-gradient(
        90deg,
        var(--es-green),
        var(--es-green-mid),
        var(--es-orange)
    )!important;
}

.content .gap-2 .m-menu:hover{
    color:#fff!important;
    border-color:var(--es-green)!important;
    box-shadow:0 9px 20px rgba(3,69,38,.18)!important;
}

.content .gap-2 .m-menu:hover span,
.content .gap-2 .m-menu:hover em,
.content .gap-2 .m-menu:hover::after{
    color:#fff!important;
}

/* ---------- HEADER ---------- */
.pkp_structure_head,
.pkp_head_wrapper,
.pkp_site_name_wrapper,
.pkp_site_name{
    background:#fff!important;
}

/* Register / Login */
.pkp_navigation_user > li > a,
.pkp_structure_head .pkp_navigation_user_wrapper
 .pkp_navigation_user > li > a{
    color:var(--es-orange)!important;
    -webkit-text-fill-color:var(--es-orange)!important;
}

.pkp_navigation_user > li > a:hover,
.pkp_structure_head .pkp_navigation_user_wrapper
 .pkp_navigation_user > li > a:hover{
    color:var(--es-green)!important;
    -webkit-text-fill-color:var(--es-green)!important;
}

/* ---------- NAVIGATION ---------- */
.pkp_site_nav_menu{
    border-bottom:3px solid var(--es-orange)!important;
    box-shadow:0 5px 15px rgba(3,69,38,.10)!important;
}

.pkp_navigation_primary > li > a{
    color:var(--es-green)!important;
    -webkit-text-fill-color:var(--es-green)!important;
}

.pkp_navigation_primary > li > a::before{
    color:var(--es-orange)!important;
    -webkit-text-fill-color:var(--es-orange)!important;
}

.pkp_navigation_primary > li > a:hover,
.pkp_navigation_primary > li > a:focus{
    color:var(--es-orange)!important;
    -webkit-text-fill-color:var(--es-orange)!important;
    background:var(--es-green-soft)!important;
}

/* Search */
.pkp_search .search_prompt,
.pkp_search a,
.pkp_search button,
.pkp_navigation_primary_row .pkp_search a,
.pkp_navigation_primary_row .pkp_search button{
    color:var(--es-green)!important;
    -webkit-text-fill-color:var(--es-green)!important;
}

.pkp_search a:hover,
.pkp_search button:hover,
.pkp_search .search_prompt:hover,
.pkp_navigation_primary_row .pkp_search a:hover,
.pkp_navigation_primary_row .pkp_search button:hover{
    color:var(--es-orange)!important;
    -webkit-text-fill-color:var(--es-orange)!important;
    background:var(--es-green-soft)!important;
}

.pkp_navigation_primary_row .pkp_search a::before,
.pkp_navigation_primary_row .pkp_search button::before,
.pkp_navigation_primary_row .pkp_search .search_prompt::before{
    color:var(--es-orange)!important;
    -webkit-text-fill-color:var(--es-orange)!important;
}

/* ---------- DROPDOWN ---------- */
.pkp_navigation_primary .dropdown-menu{
    border-color:var(--es-border)!important;
    box-shadow:0 12px 28px rgba(3,69,38,.14)!important;
}

.pkp_navigation_primary .dropdown-menu > li > a,
.pkp_navigation_primary .dropdown-menu > li > a *,
.pkp_navigation_primary .dropdown-menu a{
    color:var(--es-green)!important;
    -webkit-text-fill-color:var(--es-green)!important;
}

.pkp_navigation_primary .dropdown-menu > li > a:hover,
.pkp_navigation_primary .dropdown-menu > li > a:focus{
    background:var(--es-green-soft)!important;
    color:var(--es-orange)!important;
    -webkit-text-fill-color:var(--es-orange)!important;
}

/* ---------- METRICS ---------- */
.journal-metrics,
.metrics-card,
.es-statcounter{
    border-color:var(--es-border)!important;
}

.journal-metrics h1,
.journal-metrics h2,
.journal-metrics h3,
.metrics-card h1,
.metrics-card h2,
.metrics-card h3{
    color:var(--es-green)!important;
}

.journal-metrics strong,
.metrics-card strong,
.es-statcounter strong{
    color:var(--es-orange)!important;
}

/* ---------- FOOTER ---------- */
#pageFooter-bottom.es-footer .es-footer-main{
    background:linear-gradient(
        135deg,
        var(--es-green-dark) 0%,
        var(--es-green) 65%,
        var(--es-orange) 100%
    )!important;
}

#pageFooter-bottom.es-footer .es-footer-bottom{
    background:var(--es-green-dark)!important;
    border-top:2px solid var(--es-orange)!important;
}

#pageFooter-bottom.es-footer .es-footer-powered{
    background:var(--es-green-soft)!important;
    border-top:1px solid var(--es-border)!important;
    color:var(--es-green)!important;
}

#pageFooter-bottom.es-footer a{
    color:#fff!important;
}

#pageFooter-bottom.es-footer a:hover{
    color:var(--es-orange)!important;
}

/* ---------- FOCUS ---------- */
a:focus-visible,
button:focus-visible,
.pkp_navigation_primary > li > a:focus-visible{
    outline:2px solid var(--es-orange)!important;
    outline-offset:3px;
}

/* ---------- RESPONSIVE ---------- */
@media(max-width:600px){
    .pkp_site_nav_menu{
        border-bottom-width:2px!important;
    }
}

/* ---------- REDUCED MOTION ---------- */
@media(prefers-reduced-motion:reduce){
    *,
    *::before,
    *::after{
        animation-duration:.01ms!important;
        animation-iteration-count:1!important;
        scroll-behavior:auto!important;
        transition-duration:.01ms!important;
    }
}


/* ==========================================================
   EDU SPORTIVO V25 — GREEN + ORANGE EDITORIAL THEME
   Inspired by the supplied green/orange reference.
   ----------------------------------------------------------
   Deep Green   #034526  structural / academic
   Medium Green #007A52  secondary / hover
   Orange       #FF6002  brand / CTA
   Bright Orange#FF7A00  highlight
   Soft Green   #EAF5F0  subtle backgrounds
   Soft Orange  #FFF1E6  subtle accents
   ========================================================== */

:root{
    --edu-green:#034526;
    --edu-green-dark:#02351D;
    --edu-green-mid:#007A52;
    --edu-green-soft:#EAF5F0;
    --edu-orange:#FF6002;
    --edu-orange-dark:#E65300;
    --edu-orange-bright:#FF7A00;
    --edu-orange-soft:#FFF1E6;
    --edu-text:#263238;
    --edu-border:#D5E8DF;
}

/* ---------- CORE ---------- */
body{
    color:var(--edu-text)!important;
    background:#fff!important;
}

h1,h2,h3,h4{
    color:var(--edu-green)!important;
}

h5,h6{
    color:var(--edu-green)!important;
}

a{
    color:var(--edu-orange);
}

a:hover,
a:focus{
    color:var(--edu-green)!important;
}

/* ---------- HERO ---------- */
.hero-banner::after{
    background:
        linear-gradient(
            90deg,
            rgba(3,69,38,.72) 0%,
            rgba(3,69,38,.42) 48%,
            rgba(255,96,2,.18) 100%
        )!important;
}

.hero-banner{
    border-bottom:4px solid var(--edu-orange)!important;
}

/* ---------- CARDS ---------- */
.sp-card{
    border:1px solid var(--edu-border)!important;
}

.sp-card:hover{
    box-shadow:0 18px 35px rgba(3,69,38,.16)!important;
}

.sp-cover img:hover{
    box-shadow:0 18px 35px rgba(3,69,38,.22)!important;
}

/* ---------- PRIMARY BUTTON ---------- */
.sp-btn{
    background:linear-gradient(
        135deg,
        var(--edu-orange),
        var(--edu-orange-bright)
    )!important;
    border-color:var(--edu-orange)!important;
    color:#fff!important;
    box-shadow:0 8px 20px rgba(255,96,2,.22)!important;
}

.sp-btn:hover{
    background:linear-gradient(
        135deg,
        var(--edu-green),
        var(--edu-green-mid)
    )!important;
    border-color:var(--edu-green)!important;
    color:#fff!important;
    box-shadow:0 12px 26px rgba(3,69,38,.24)!important;
}

/* ---------- QUICK INFO ---------- */
.sp-info{
    border-color:var(--edu-border)!important;
}

.sp-info:hover{
    background:var(--edu-green-soft)!important;
    box-shadow:0 14px 24px rgba(3,69,38,.12)!important;
}

/* ==========================================================
   SIDEBAR — GREEN STRUCTURE + ORANGE ACCENT
   ========================================================== */

.sidebar-title{
    background:linear-gradient(
        135deg,
        var(--edu-green-dark) 0%,
        var(--edu-green) 68%,
        var(--edu-orange) 100%
    )!important;
    color:#fff!important;
    border-bottom:4px solid var(--edu-orange)!important;
    box-shadow:0 8px 18px rgba(3,69,38,.20)!important;
}

.content .gap-2 .m-menu{
    background:#fff!important;
    border:1px solid var(--edu-border)!important;
    color:var(--edu-green)!important;
    box-shadow:0 3px 10px rgba(3,69,38,.08)!important;
}

.content .gap-2 .m-menu span{
    color:var(--edu-green)!important;
}

.content .gap-2 .m-menu em,
.content .gap-2 .m-menu::after{
    color:var(--edu-orange)!important;
}

.content .gap-2 .m-menu::before{
    background:linear-gradient(
        90deg,
        var(--edu-green),
        var(--edu-green-mid),
        var(--edu-orange)
    )!important;
}

.content .gap-2 .m-menu:hover{
    color:#fff!important;
    border-color:var(--edu-green)!important;
    box-shadow:0 8px 18px rgba(3,69,38,.18)!important;
}

.content .gap-2 .m-menu:hover span,
.content .gap-2 .m-menu:hover em,
.content .gap-2 .m-menu:hover::after{
    color:#fff!important;
}

/* ==========================================================
   HEADER / REGISTER / LOGIN
   ========================================================== */

.pkp_structure_head,
.pkp_head_wrapper,
.pkp_site_name_wrapper,
.pkp_site_name{
    background:#fff!important;
}

.pkp_navigation_user > li > a{
    color:var(--edu-orange)!important;
    -webkit-text-fill-color:var(--edu-orange)!important;
}

.pkp_navigation_user > li > a:hover{
    color:var(--edu-green)!important;
    -webkit-text-fill-color:var(--edu-green)!important;
}

.pkp_navigation_user > li > a::before{
    color:var(--edu-orange)!important;
    -webkit-text-fill-color:var(--edu-orange)!important;
}

/* ==========================================================
   NAVIGATION — WHITE BAR / GREEN TEXT / ORANGE ICONS
   ========================================================== */

.pkp_site_nav_menu{
    background:#fff!important;
    border-top:3px solid var(--edu-green)!important;
    border-bottom:3px solid var(--edu-orange)!important;
    box-shadow:0 6px 18px rgba(3,69,38,.12)!important;
}

.pkp_navigation_primary_wrapper,
.pkp_navigation_primary_row{
    background:#fff!important;
}

.pkp_navigation_primary > li > a{
    color:var(--edu-green)!important;
    -webkit-text-fill-color:var(--edu-green)!important;
}

.pkp_navigation_primary > li > a::before{
    color:var(--edu-orange)!important;
    -webkit-text-fill-color:var(--edu-orange)!important;
}

.pkp_navigation_primary > li > a:hover,
.pkp_navigation_primary > li > a:focus{
    color:var(--edu-orange)!important;
    -webkit-text-fill-color:var(--edu-orange)!important;
    background:var(--edu-green-soft)!important;
}

/* Orange active underline */
.pkp_navigation_primary > li > a::after{
    content:""!important;
    position:absolute!important;
    left:10px!important;
    right:10px!important;
    bottom:0!important;
    height:3px!important;
    background:var(--edu-orange)!important;
    border-radius:3px 3px 0 0!important;
    transform:scaleX(0)!important;
    transition:transform .25s ease!important;
}

.pkp_navigation_primary > li > a:hover::after,
.pkp_navigation_primary > li > a:focus::after{
    transform:scaleX(1)!important;
}

/* ==========================================================
   SEARCH
   ========================================================== */

.pkp_navigation_primary_row .pkp_search a,
.pkp_navigation_primary_row .pkp_search button,
.pkp_navigation_primary_row .pkp_search .search_prompt{
    color:var(--edu-green)!important;
    -webkit-text-fill-color:var(--edu-green)!important;
}

.pkp_navigation_primary_row .pkp_search a::before,
.pkp_navigation_primary_row .pkp_search button::before,
.pkp_navigation_primary_row .pkp_search .search_prompt::before{
    color:var(--edu-orange)!important;
    -webkit-text-fill-color:var(--edu-orange)!important;
}

.pkp_navigation_primary_row .pkp_search a:hover,
.pkp_navigation_primary_row .pkp_search button:hover,
.pkp_navigation_primary_row .pkp_search .search_prompt:hover{
    color:var(--edu-orange)!important;
    -webkit-text-fill-color:var(--edu-orange)!important;
    background:var(--edu-green-soft)!important;
}

/* ==========================================================
   DROPDOWN
   ========================================================== */

.pkp_navigation_primary .dropdown-menu{
    background:#fff!important;
    border:1px solid var(--edu-border)!important;
    box-shadow:0 12px 28px rgba(3,69,38,.15)!important;
}

.pkp_navigation_primary .dropdown-menu a,
.pkp_navigation_primary .dropdown-menu > li > a{
    color:var(--edu-green)!important;
    -webkit-text-fill-color:var(--edu-green)!important;
}

.pkp_navigation_primary .dropdown-menu > li > a:hover,
.pkp_navigation_primary .dropdown-menu > li > a:focus{
    background:var(--edu-green-soft)!important;
    color:var(--edu-orange)!important;
    -webkit-text-fill-color:var(--edu-orange)!important;
}

/* ==========================================================
   JOURNAL METRICS / STATISTICS
   ========================================================== */

.journal-metrics,
.metrics-card,
.es-statcounter{
    border-color:var(--edu-border)!important;
}

.journal-metrics h1,
.journal-metrics h2,
.journal-metrics h3,
.metrics-card h1,
.metrics-card h2,
.metrics-card h3{
    color:var(--edu-green)!important;
}

.journal-metrics strong,
.metrics-card strong,
.es-statcounter strong{
    color:var(--edu-orange)!important;
}

/* ==========================================================
   FOOTER — DEEP GREEN WITH ORANGE ACCENT
   ========================================================== */

#pageFooter-bottom.es-footer .es-footer-main{
    background:linear-gradient(
        135deg,
        var(--edu-green-dark) 0%,
        var(--edu-green) 72%,
        var(--edu-orange) 100%
    )!important;
}

#pageFooter-bottom.es-footer .es-footer-bottom{
    background:var(--edu-green-dark)!important;
    border-top:3px solid var(--edu-orange)!important;
}

#pageFooter-bottom.es-footer .es-footer-powered{
    background:var(--edu-green-soft)!important;
    border-top:1px solid var(--edu-border)!important;
    color:var(--edu-green)!important;
}

#pageFooter-bottom.es-footer a{
    color:#fff!important;
}

#pageFooter-bottom.es-footer a:hover{
    color:var(--edu-orange)!important;
}

/* ==========================================================
   FOCUS / ACCESSIBILITY
   ========================================================== */

a:focus-visible,
button:focus-visible,
.pkp_navigation_primary > li > a:focus-visible{
    outline:2px solid var(--edu-orange)!important;
    outline-offset:3px;
}

/* ==========================================================
   REDUCED MOTION
   ========================================================== */

@media(prefers-reduced-motion:reduce){
    *,
    *::before,
    *::after{
        animation-duration:.01ms!important;
        animation-iteration-count:1!important;
        scroll-behavior:auto!important;
        transition-duration:.01ms!important;
    }
}

/* ==========================================================
   EDU SPORTIVO V27 — FOOTER GREEN DOMINANT
   Green = structural/footer base
   Orange = accent only
   ========================================================== */

#pageFooter-bottom.es-footer .es-footer-main{
    background:linear-gradient(
        135deg,
        #02351D 0%,
        #034526 62%,
        #007A52 100%
    )!important;
    color:#FFFFFF!important;
    border-top:4px solid #FF6002!important;
}

#pageFooter-bottom.es-footer .es-footer-main::before,
#pageFooter-bottom.es-footer .es-footer-main::after{
    background:none!important;
    border-color:transparent!important;
}

#pageFooter-bottom.es-footer .es-footer-main h1,
#pageFooter-bottom.es-footer .es-footer-main h2,
#pageFooter-bottom.es-footer .es-footer-main h3,
#pageFooter-bottom.es-footer .es-footer-main h4,
#pageFooter-bottom.es-footer .es-footer-main h5,
#pageFooter-bottom.es-footer .es-footer-main h6{
    color:#FFFFFF!important;
}

#pageFooter-bottom.es-footer .es-footer-main p,
#pageFooter-bottom.es-footer .es-footer-main li,
#pageFooter-bottom.es-footer .es-footer-main span{
    color:rgba(255,255,255,.92)!important;
}

#pageFooter-bottom.es-footer .es-footer-main a{
    color:#FFFFFF!important;
    text-decoration:none!important;
}

#pageFooter-bottom.es-footer .es-footer-main a:hover{
    color:#FF7A00!important;
}

#pageFooter-bottom.es-footer .es-footer-main i,
#pageFooter-bottom.es-footer .es-footer-main svg{
    color:#FF6002!important;
    fill:#FF6002!important;
}

#pageFooter-bottom.es-footer .es-footer-bottom{
    background:#02351D!important;
    color:#FFFFFF!important;
    border-top:1px solid rgba(255,255,255,.16)!important;
}

#pageFooter-bottom.es-footer .es-footer-bottom a{
    color:#FFFFFF!important;
}

#pageFooter-bottom.es-footer .es-footer-bottom a:hover{
    color:#FF7A00!important;
}

#pageFooter-bottom.es-footer .es-footer-powered{
    background:#EAF5F0!important;
    color:#034526!important;
    border-top:3px solid #FF6002!important;
}

#pageFooter-bottom.es-footer .es-footer-powered a{
    color:#034526!important;
}

#pageFooter-bottom.es-footer .es-footer-powered a:hover{
    color:#FF6002!important;
}

/* Small orange brand accents only */
#pageFooter-bottom.es-footer .es-footer-main hr{
    border:0!important;
    border-top:1px solid rgba(255,255,255,.18)!important;
}

#pageFooter-bottom.es-footer .es-footer-main .accent,
#pageFooter-bottom.es-footer .es-footer-main .es-footer-accent{
    background:#FF6002!important;
}

/* ==========================================================
   EDU SPORTIVO V28 — FOOTER ORANGE DOMINANT
   70–80% Orange | 15–20% Medium Green | 5–10% Deep Green
   ========================================================== */

/* Main footer: orange is the dominant color */
#pageFooter-bottom.es-footer .es-footer-main{
    background:linear-gradient(
        135deg,
        #F36C0A 0%,
        #F36C0A 68%,
        #F6A623 80%,
        #007A52 100%
    )!important;
    color:#FFFFFF!important;
    border-top:4px solid #034526!important;
}

/* Keep the footer content readable */
#pageFooter-bottom.es-footer .es-footer-main h1,
#pageFooter-bottom.es-footer .es-footer-main h2,
#pageFooter-bottom.es-footer .es-footer-main h3,
#pageFooter-bottom.es-footer .es-footer-main h4,
#pageFooter-bottom.es-footer .es-footer-main h5,
#pageFooter-bottom.es-footer .es-footer-main h6,
#pageFooter-bottom.es-footer .es-footer-main p,
#pageFooter-bottom.es-footer .es-footer-main li,
#pageFooter-bottom.es-footer .es-footer-main span{
    color:#FFFFFF!important;
}

/* Footer links */
#pageFooter-bottom.es-footer .es-footer-main a{
    color:#FFFFFF!important;
    text-decoration:none!important;
}

#pageFooter-bottom.es-footer .es-footer-main a:hover{
    color:#F6A623!important;
}

/* Deep green only for icons/accent */
#pageFooter-bottom.es-footer .es-footer-main i,
#pageFooter-bottom.es-footer .es-footer-main svg{
    color:#034526!important;
    fill:#034526!important;
}

/* Subtle separator */
#pageFooter-bottom.es-footer .es-footer-main hr{
    border:0!important;
    border-top:1px solid rgba(255,255,255,.28)!important;
}

/* Footer bottom = deep green */
#pageFooter-bottom.es-footer .es-footer-bottom{
    background:#034526!important;
    color:#FFFFFF!important;
    border-top:1px solid rgba(255,255,255,.18)!important;
}

#pageFooter-bottom.es-footer .es-footer-bottom a{
    color:#FFFFFF!important;
}

#pageFooter-bottom.es-footer .es-footer-bottom a:hover{
    color:#F36C0A!important;
}

/* Powered-by = soft green */
#pageFooter-bottom.es-footer .es-footer-powered{
    background:#D5E8DF!important;
    color:#034526!important;
    border-top:3px solid #034526!important;
}

/* REQUIRED: Published by UIR Press / e-ISSN / Powered by OJS = ORANGE */
#pageFooter-bottom.es-footer .es-footer-powered,
#pageFooter-bottom.es-footer .es-footer-powered p,
#pageFooter-bottom.es-footer .es-footer-powered span,
#pageFooter-bottom.es-footer .es-footer-powered strong,
#pageFooter-bottom.es-footer .es-footer-powered b,
#pageFooter-bottom.es-footer .es-footer-powered a{
    color:#F36C0A!important;
    -webkit-text-fill-color:#F36C0A!important;
}

#pageFooter-bottom.es-footer .es-footer-powered a{
    text-decoration:none!important;
}

#pageFooter-bottom.es-footer .es-footer-powered a:hover{
    color:#034526!important;
    -webkit-text-fill-color:#034526!important;
}

/* Orange accent blocks remain orange; deep green is restricted */
#pageFooter-bottom.es-footer .es-footer-main .accent,
#pageFooter-bottom.es-footer .es-footer-main .es-footer-accent{
    background:#F36C0A!important;
}

/* Ensure old green footer declarations cannot override the new palette */
#pageFooter-bottom.es-footer .es-footer-main::before,
#pageFooter-bottom.es-footer .es-footer-main::after{
    border-color:transparent!important;
}

/* ==========================================================
   EDU SPORTIVO V29 — LOGO COLOR FOOTER
   Orange + Golden Orange dominant | Subtle Green accent
   Inspired by EduSportivo logo:
   #FF4B16 / #FF6A00 / #F9A51A / #5B8E3E
   ========================================================== */

/* MAIN FOOTER — orange/yellow dominant, green only as a small accent */
#pageFooter-bottom.es-footer .es-footer-main{
    background:linear-gradient(
        110deg,
        #FF4B16 0%,
        #FF5A12 30%,
        #FF6A00 58%,
        #F9A51A 86%,
        #5B8E3E 100%
    )!important;
    color:#FFFFFF!important;
    border-top:4px solid #5B8E3E!important;
}

/* White main-footer typography */
#pageFooter-bottom.es-footer .es-footer-main h1,
#pageFooter-bottom.es-footer .es-footer-main h2,
#pageFooter-bottom.es-footer .es-footer-main h3,
#pageFooter-bottom.es-footer .es-footer-main h4,
#pageFooter-bottom.es-footer .es-footer-main h5,
#pageFooter-bottom.es-footer .es-footer-main h6,
#pageFooter-bottom.es-footer .es-footer-main p,
#pageFooter-bottom.es-footer .es-footer-main li,
#pageFooter-bottom.es-footer .es-footer-main span{
    color:#FFFFFF!important;
}

/* Main footer links */
#pageFooter-bottom.es-footer .es-footer-main a{
    color:#FFFFFF!important;
    text-decoration:none!important;
}

#pageFooter-bottom.es-footer .es-footer-main a:hover{
    color:#FFD166!important;
}

/* Green used sparingly for icons/accent only */
#pageFooter-bottom.es-footer .es-footer-main i,
#pageFooter-bottom.es-footer .es-footer-main svg{
    color:#4E7D3A!important;
    fill:#4E7D3A!important;
}

/* Fine separator */
#pageFooter-bottom.es-footer .es-footer-main hr{
    border:0!important;
    border-top:1px solid rgba(255,255,255,.30)!important;
}

/* FOOTER BOTTOM — deep green */
#pageFooter-bottom.es-footer .es-footer-bottom{
    background:#285A32!important;
    color:#FFFFFF!important;
    border-top:1px solid rgba(255,255,255,.18)!important;
}

#pageFooter-bottom.es-footer .es-footer-bottom a{
    color:#FFFFFF!important;
}

#pageFooter-bottom.es-footer .es-footer-bottom a:hover{
    color:#FFB21A!important;
}

/* POWERED BY — soft green */
#pageFooter-bottom.es-footer .es-footer-powered{
    background:#E7F1E3!important;
    color:#FF6A00!important;
    border-top:3px solid #5B8E3E!important;
}

/* Required powered text remains orange */
#pageFooter-bottom.es-footer .es-footer-powered,
#pageFooter-bottom.es-footer .es-footer-powered p,
#pageFooter-bottom.es-footer .es-footer-powered span,
#pageFooter-bottom.es-footer .es-footer-powered strong,
#pageFooter-bottom.es-footer .es-footer-powered b,
#pageFooter-bottom.es-footer .es-footer-powered a{
    color:#FF6A00!important;
    -webkit-text-fill-color:#FF6A00!important;
}

#pageFooter-bottom.es-footer .es-footer-powered a{
    text-decoration:none!important;
}

#pageFooter-bottom.es-footer .es-footer-powered a:hover{
    color:#E85A00!important;
    -webkit-text-fill-color:#E85A00!important;
}

/* Keep decorative accent blocks aligned with the logo palette */
#pageFooter-bottom.es-footer .es-footer-main .accent,
#pageFooter-bottom.es-footer .es-footer-main .es-footer-accent{
    background:#F9A51A!important;
}

/* Prevent legacy pseudo-element borders from introducing unwanted colors */
#pageFooter-bottom.es-footer .es-footer-main::before,
#pageFooter-bottom.es-footer .es-footer-main::after{
    border-color:transparent!important;
}


/* ==========================================================
   EDU SPORTIVO V30 — FOOTER ORANGE + WHITE ONLY
   Orange = dominant
   White = typography, icons, separators
   No green / yellow in footer
   ========================================================== */

/* MAIN FOOTER — solid EduSportivo orange */
#pageFooter-bottom.es-footer .es-footer-main{
    background:#F36C0A!important;
    color:#FFFFFF!important;
    border-top:4px solid #FFFFFF!important;
    background-image:none!important;
}

/* All main footer typography = WHITE */
#pageFooter-bottom.es-footer .es-footer-main,
#pageFooter-bottom.es-footer .es-footer-main h1,
#pageFooter-bottom.es-footer .es-footer-main h2,
#pageFooter-bottom.es-footer .es-footer-main h3,
#pageFooter-bottom.es-footer .es-footer-main h4,
#pageFooter-bottom.es-footer .es-footer-main h5,
#pageFooter-bottom.es-footer .es-footer-main h6,
#pageFooter-bottom.es-footer .es-footer-main p,
#pageFooter-bottom.es-footer .es-footer-main li,
#pageFooter-bottom.es-footer .es-footer-main span,
#pageFooter-bottom.es-footer .es-footer-main strong,
#pageFooter-bottom.es-footer .es-footer-main b{
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
}

/* Main footer links = WHITE */
#pageFooter-bottom.es-footer .es-footer-main a{
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
    text-decoration:none!important;
}

#pageFooter-bottom.es-footer .es-footer-main a:hover{
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
    text-decoration:underline!important;
}

/* Icons = WHITE */
#pageFooter-bottom.es-footer .es-footer-main i,
#pageFooter-bottom.es-footer .es-footer-main svg,
#pageFooter-bottom.es-footer .es-footer-main svg *,
#pageFooter-bottom.es-footer .es-footer-main .fa,
#pageFooter-bottom.es-footer .es-footer-main .fas,
#pageFooter-bottom.es-footer .es-footer-main .far{
    color:#FFFFFF!important;
    fill:#FFFFFF!important;
    stroke:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
}

/* White separators */
#pageFooter-bottom.es-footer .es-footer-main hr{
    border:0!important;
    border-top:1px solid rgba(255,255,255,.45)!important;
}

/* Footer bottom — darker orange, still orange only */
#pageFooter-bottom.es-footer .es-footer-bottom{
    background:#D95400!important;
    background-image:none!important;
    color:#FFFFFF!important;
    border-top:1px solid rgba(255,255,255,.35)!important;
}

#pageFooter-bottom.es-footer .es-footer-bottom,
#pageFooter-bottom.es-footer .es-footer-bottom p,
#pageFooter-bottom.es-footer .es-footer-bottom span,
#pageFooter-bottom.es-footer .es-footer-bottom strong,
#pageFooter-bottom.es-footer .es-footer-bottom b,
#pageFooter-bottom.es-footer .es-footer-bottom a{
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
}

#pageFooter-bottom.es-footer .es-footer-bottom a:hover{
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
    text-decoration:underline!important;
}

/* Powered by — white panel with orange text */
#pageFooter-bottom.es-footer .es-footer-powered{
    background:#FFFFFF!important;
    background-image:none!important;
    color:#F36C0A!important;
    border-top:3px solid #F36C0A!important;
}

/* Keep powered-by typography clearly visible */
#pageFooter-bottom.es-footer .es-footer-powered,
#pageFooter-bottom.es-footer .es-footer-powered p,
#pageFooter-bottom.es-footer .es-footer-powered span,
#pageFooter-bottom.es-footer .es-footer-powered strong,
#pageFooter-bottom.es-footer .es-footer-powered b,
#pageFooter-bottom.es-footer .es-footer-powered a{
    color:#F36C0A!important;
    -webkit-text-fill-color:#F36C0A!important;
}

#pageFooter-bottom.es-footer .es-footer-powered a:hover{
    color:#D95400!important;
    -webkit-text-fill-color:#D95400!important;
    text-decoration:underline!important;
}

/* Decorative accents — white only */
#pageFooter-bottom.es-footer .es-footer-main .accent,
#pageFooter-bottom.es-footer .es-footer-main .es-footer-accent{
    background:#FFFFFF!important;
}

/* Remove legacy green/yellow pseudo-element effects */
#pageFooter-bottom.es-footer .es-footer-main::before,
#pageFooter-bottom.es-footer .es-footer-main::after{
    border-color:transparent!important;
    background:none!important;
}


/* ==========================================================
   EDU SPORTIVO V31 — FOOTER LIGHT ORANGE INTERACTION FIX
   Prevent green on click / focus / active / visited
   ========================================================== */

/* Contact Info / footer main area — light orange */
#pageFooter-bottom.es-footer .es-footer-main{
    background:#F98B2C!important;
    background-image:none!important;
    color:#FFFFFF!important;
}

/* All footer text remains white */
#pageFooter-bottom.es-footer .es-footer-main,
#pageFooter-bottom.es-footer .es-footer-main h1,
#pageFooter-bottom.es-footer .es-footer-main h2,
#pageFooter-bottom.es-footer .es-footer-main h3,
#pageFooter-bottom.es-footer .es-footer-main h4,
#pageFooter-bottom.es-footer .es-footer-main h5,
#pageFooter-bottom.es-footer .es-footer-main h6,
#pageFooter-bottom.es-footer .es-footer-main p,
#pageFooter-bottom.es-footer .es-footer-main li,
#pageFooter-bottom.es-footer .es-footer-main span,
#pageFooter-bottom.es-footer .es-footer-main strong,
#pageFooter-bottom.es-footer .es-footer-main b{
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
}

/* Footer links: never turn green */
#pageFooter-bottom.es-footer .es-footer-main a,
#pageFooter-bottom.es-footer .es-footer-main a:link,
#pageFooter-bottom.es-footer .es-footer-main a:visited,
#pageFooter-bottom.es-footer .es-footer-main a:hover,
#pageFooter-bottom.es-footer .es-footer-main a:focus,
#pageFooter-bottom.es-footer .es-footer-main a:focus-visible,
#pageFooter-bottom.es-footer .es-footer-main a:active{
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
    background-color:transparent!important;
    background-image:none!important;
    border-color:#FFFFFF!important;
}

/* Social/contact circular buttons — keep WHITE in every state */
#pageFooter-bottom.es-footer .es-footer-main a[class*="social"],
#pageFooter-bottom.es-footer .es-footer-main a[class*="icon"],
#pageFooter-bottom.es-footer .es-footer-main a[class*="contact"],
#pageFooter-bottom.es-footer .es-footer-main .social a,
#pageFooter-bottom.es-footer .es-footer-main .social-icon,
#pageFooter-bottom.es-footer .es-footer-main .social-icon a,
#pageFooter-bottom.es-footer .es-footer-main .footer-icon,
#pageFooter-bottom.es-footer .es-footer-main .footer-icon a{
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
    background-color:rgba(255,255,255,.14)!important;
    background-image:none!important;
    border-color:#FFFFFF!important;
}

/* Click / keyboard focus must NOT introduce green */
#pageFooter-bottom.es-footer .es-footer-main a:active,
#pageFooter-bottom.es-footer .es-footer-main a:focus,
#pageFooter-bottom.es-footer .es-footer-main a:focus-visible,
#pageFooter-bottom.es-footer .es-footer-main button:active,
#pageFooter-bottom.es-footer .es-footer-main button:focus,
#pageFooter-bottom.es-footer .es-footer-main button:focus-visible{
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
    background-color:rgba(255,255,255,.14)!important;
    background-image:none!important;
    border-color:#FFFFFF!important;
    outline-color:#FFFFFF!important;
}

/* Icons remain white after clicking */
#pageFooter-bottom.es-footer .es-footer-main i,
#pageFooter-bottom.es-footer .es-footer-main svg,
#pageFooter-bottom.es-footer .es-footer-main svg *,
#pageFooter-bottom.es-footer .es-footer-main .fa,
#pageFooter-bottom.es-footer .es-footer-main .fas,
#pageFooter-bottom.es-footer .es-footer-main .far,
#pageFooter-bottom.es-footer .es-footer-main .fab{
    color:#FFFFFF!important;
    fill:#FFFFFF!important;
    stroke:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
}

/* Remove any legacy green from footer interactive states */
#pageFooter-bottom.es-footer .es-footer-main *:active,
#pageFooter-bottom.es-footer .es-footer-main *:focus{
    --primary-dark:#FFFFFF!important;
}


/* ==========================================================
   EDU SPORTIVO V32 — FOOTER CONTACT ICON CLICK STATE
   ----------------------------------------------------------
   Contact Info remains LIGHT ORANGE.
   Email / WhatsApp / Phone circles:
   - Normal   : WHITE circle + GREEN icon
   - Hover    : GREEN circle + WHITE icon
   - Click    : GREEN circle + WHITE icon
   - Focus    : GREEN circle + WHITE icon
   This prevents the clicked icon from showing an inconsistent
   green state while keeping the footer background light orange.
========================================================== */

/* Footer contact area stays light orange */
#pageFooter-bottom.es-footer .es-footer-main{
    background:#F98B2C!important;
    background-image:none!important;
}

/* Contact/social buttons — normal state */
#pageFooter-bottom.es-footer .es-social-links a{
    width:42px!important;
    height:42px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;

    background:#FFFFFF!important;
    color:#008000!important;
    border:0!important;
    border-radius:50%!important;

    box-shadow:0 3px 8px rgba(0,0,0,.12)!important;

    transition:
        background-color .2s ease,
        color .2s ease,
        transform .2s ease,
        box-shadow .2s ease!important;
}

/* Icons — normal = green */
#pageFooter-bottom.es-footer .es-social-links a::before{
    color:#008000!important;
    -webkit-text-fill-color:#008000!important;
}

/* Hover — green circle + white icon */
#pageFooter-bottom.es-footer .es-social-links a:hover{
    background:#008000!important;
    color:#FFFFFF!important;
    transform:translateY(-3px)!important;
    box-shadow:0 5px 12px rgba(0,128,0,.28)!important;
}

#pageFooter-bottom.es-footer .es-social-links a:hover::before{
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
}

/* CLICK / ACTIVE / FOCUS — green circle + white icon */
#pageFooter-bottom.es-footer .es-social-links a:active,
#pageFooter-bottom.es-footer .es-social-links a:focus,
#pageFooter-bottom.es-footer .es-social-links a:focus-visible{
    background:#008000!important;
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;

    border:0!important;
    outline:none!important;
    box-shadow:
        0 0 0 3px rgba(0,128,0,.18),
        0 5px 12px rgba(0,128,0,.28)!important;

    transform:translateY(-1px)!important;
}

#pageFooter-bottom.es-footer .es-social-links a:active::before,
#pageFooter-bottom.es-footer .es-social-links a:focus::before,
#pageFooter-bottom.es-footer .es-social-links a:focus-visible::before{
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
}

/* Keep visited links from permanently changing all icons */
#pageFooter-bottom.es-footer .es-social-links a:visited{
    background:#FFFFFF!important;
    color:#008000!important;
}

#pageFooter-bottom.es-footer .es-social-links a:visited::before{
    color:#008000!important;
    -webkit-text-fill-color:#008000!important;
}

/* When a visited link is also focused after clicking,
   the click/focus state remains green. */
#pageFooter-bottom.es-footer .es-social-links a:visited:focus,
#pageFooter-bottom.es-footer .es-social-links a:visited:focus-visible,
#pageFooter-bottom.es-footer .es-social-links a:visited:active{
    background:#008000!important;
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
}

#pageFooter-bottom.es-footer .es-social-links a:visited:focus::before,
#pageFooter-bottom.es-footer .es-social-links a:visited:focus-visible::before,
#pageFooter-bottom.es-footer .es-social-links a:visited:active::before{
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
}

/* ==========================================================
   EDU SPORTIVO V33 — SIDEBAR HEADER MOTIF
   Orange premium header with subtle geometric motif
   Applied to sidebar section headers without changing content
   ========================================================== */

/* Main custom sidebar headers */
.sidebar-title,
.pkp_block > .title,
.pkp_block > h2.title,
.pkp_block .title{
    position:relative!important;
    overflow:hidden!important;
    isolation:isolate!important;
    display:block!important;
    box-sizing:border-box!important;

    background:
        linear-gradient(135deg,
            #F36C0A 0%,
            #F36C0A 58%,
            #FF8A3D 100%)!important;

    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;

    border:0!important;
    border-radius:15px!important;
    border-bottom:4px solid #FFFFFF!important;

    padding:14px 18px!important;
    margin:0 0 14px!important;

    text-align:center!important;
    font-family:Arial,Helvetica,sans-serif!important;
    font-size:18px!important;
    font-weight:700!important;
    line-height:1.25!important;
    letter-spacing:.2px!important;

    box-shadow:
        0 8px 18px rgba(243,108,10,.22)!important;
}

/* Geometric motif — large diagonal frame */
.sidebar-title::before,
.pkp_block > .title::before,
.pkp_block > h2.title::before,
.pkp_block .title::before{
    content:""!important;
    position:absolute!important;
    width:150px!important;
    height:70px!important;
    right:-48px!important;
    top:-30px!important;

    border:2px solid rgba(255,255,255,.20)!important;
    border-radius:18px!important;
    transform:rotate(-14deg)!important;

    background:transparent!important;
    pointer-events:none!important;
    z-index:0!important;
}

/* Secondary motif — diagonal accent */
.sidebar-title::after,
.pkp_block > .title::after,
.pkp_block > h2.title::after,
.pkp_block .title::after{
    content:""!important;
    position:absolute!important;
    width:95px!important;
    height:45px!important;
    left:-35px!important;
    bottom:-22px!important;

    border:2px solid rgba(255,255,255,.14)!important;
    border-radius:14px!important;
    transform:rotate(-14deg)!important;

    background:transparent!important;
    pointer-events:none!important;
    z-index:0!important;
}

/* Keep header text above the motif */
.sidebar-title,
.pkp_block > .title,
.pkp_block > h2.title,
.pkp_block .title{
    text-shadow:0 1px 2px rgba(0,0,0,.10)!important;
}

/* Links/text inside headers remain white */
.sidebar-title a,
.sidebar-title span,
.pkp_block > .title a,
.pkp_block > .title span,
.pkp_block > h2.title a,
.pkp_block > h2.title span,
.pkp_block .title a,
.pkp_block .title span{
    position:relative!important;
    z-index:2!important;
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
    text-decoration:none!important;
}

/* Small white decorative line */
.sidebar-title > * ,
.pkp_block > .title > *,
.pkp_block > h2.title > *,
.pkp_block .title > *{
    position:relative!important;
    z-index:2!important;
}

/* Hover: preserve orange identity, only increase depth */
.sidebar-title:hover,
.pkp_block > .title:hover,
.pkp_block > h2.title:hover,
.pkp_block .title:hover{
    background:
        linear-gradient(135deg,
            #F36C0A 0%,
            #F36C0A 55%,
            #FF8A3D 100%)!important;
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
    box-shadow:
        0 10px 22px rgba(243,108,10,.28)!important;
}

/* Mobile */
@media(max-width:600px){
    .sidebar-title,
    .pkp_block > .title,
    .pkp_block > h2.title,
    .pkp_block .title{
        font-size:17px!important;
        padding:12px 14px!important;
        border-radius:13px!important;
    }
}


/* ==========================================================
   EDU SPORTIVO V34 — SIDEBAR MOTIF DEFINITIVE FIX
   Motif dibuat lebih terlihat dan tidak bergantung pada
   pseudo-element yang bisa tertutup oleh theme/OJS.
   ========================================================== */

.sidebar-title{
    position:relative!important;
    overflow:hidden!important;
    isolation:isolate!important;

    background-color:#F36C0A!important;
    background-image:
        linear-gradient(135deg,
            transparent 0%,
            transparent 62%,
            rgba(255,255,255,.10) 62%,
            rgba(255,255,255,.10) 66%,
            transparent 66%,
            transparent 72%,
            rgba(255,255,255,.07) 72%,
            rgba(255,255,255,.07) 76%,
            transparent 76%,
            transparent 100%)!important;

    border:0!important;
    border-radius:15px!important;
    border-bottom:4px solid rgba(255,255,255,.95)!important;
    box-shadow:
        0 8px 18px rgba(243,108,10,.24),
        inset 0 1px 0 rgba(255,255,255,.18)!important;
}

/* Motif utama: diagonal rounded frame */
.sidebar-title::before{
    content:""!important;
    position:absolute!important;
    width:170px!important;
    height:78px!important;
    right:-42px!important;
    top:-34px!important;

    border:3px solid rgba(255,255,255,.24)!important;
    border-radius:22px!important;
    transform:rotate(-16deg)!important;

    background:rgba(255,255,255,.035)!important;
    pointer-events:none!important;
    z-index:1!important;
}

/* Motif kedua: diagonal frame kiri bawah */
.sidebar-title::after{
    content:""!important;
    position:absolute!important;
    width:110px!important;
    height:50px!important;
    left:-42px!important;
    bottom:-27px!important;

    border:3px solid rgba(255,255,255,.20)!important;
    border-radius:18px!important;
    transform:rotate(-16deg)!important;

    background:rgba(255,255,255,.025)!important;
    pointer-events:none!important;
    z-index:1!important;
}

/* Pastikan teks header tetap di atas motif */
.sidebar-title{
    text-shadow:0 1px 2px rgba(0,0,0,.12)!important;
}

/* OJS standard block titles — motif yang sama */
.pkp_block > .title,
.pkp_block > h2.title{
    position:relative!important;
    overflow:hidden!important;
    isolation:isolate!important;

    background-color:#F36C0A!important;
    background-image:
        linear-gradient(135deg,
            transparent 0%,
            transparent 62%,
            rgba(255,255,255,.10) 62%,
            rgba(255,255,255,.10) 66%,
            transparent 66%,
            transparent 72%,
            rgba(255,255,255,.07) 72%,
            rgba(255,255,255,.07) 76%,
            transparent 76%,
            transparent 100%)!important;

    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
    border-radius:15px!important;
    border-bottom:4px solid rgba(255,255,255,.95)!important;
    box-shadow:0 8px 18px rgba(243,108,10,.24)!important;
}

.pkp_block > .title::before,
.pkp_block > h2.title::before{
    content:""!important;
    position:absolute!important;
    width:170px!important;
    height:78px!important;
    right:-42px!important;
    top:-34px!important;
    border:3px solid rgba(255,255,255,.24)!important;
    border-radius:22px!important;
    transform:rotate(-16deg)!important;
    background:rgba(255,255,255,.035)!important;
    pointer-events:none!important;
    z-index:1!important;
}

.pkp_block > .title::after,
.pkp_block > h2.title::after{
    content:""!important;
    position:absolute!important;
    width:110px!important;
    height:50px!important;
    left:-42px!important;
    bottom:-27px!important;
    border:3px solid rgba(255,255,255,.20)!important;
    border-radius:18px!important;
    transform:rotate(-16deg)!important;
    background:rgba(255,255,255,.025)!important;
    pointer-events:none!important;
    z-index:1!important;
}

/* Keep links in sidebar orange/white behavior */
.sidebar-title a,
.pkp_block > .title a,
.pkp_block > h2.title a{
    position:relative!important;
    z-index:3!important;
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
}

@media(max-width:600px){
    .sidebar-title,
    .pkp_block > .title,
    .pkp_block > h2.title{
        border-radius:13px!important;
    }
}

/* ==========================================================
   EDU SPORTIVO V35 — SIDEBAR CUSTOM HTML HEADER FIX
   Target custom sidebar headings that use INLINE STYLE.
   No HTML change required.
   ========================================================== */

/* Custom sidebar heading created with inline gradient style */
.pkp_block div[style*="linear-gradient"][style*="text-align: center"],
.pkp_block div[style*="linear-gradient"][style*="text-align:center"],
.pkp_block div[style*="linear-gradient"][style*="padding: 14px 20px"],
.pkp_block div[style*="linear-gradient"][style*="padding:14px 20px"]{
    position:relative!important;
    overflow:hidden!important;
    isolation:isolate!important;
    box-sizing:border-box!important;

    /* Override inline background */
    background:#F36C0A!important;
    background-image:
        linear-gradient(
            135deg,
            #F36C0A 0%,
            #F36C0A 58%,
            #F57C00 100%
        )!important;

    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;

    border-radius:15px!important;
    border:0!important;
    border-bottom:4px solid rgba(255,255,255,.92)!important;

    box-shadow:
        0 8px 18px rgba(243,108,10,.24)!important;

    text-align:center!important;
}

/* Motif kanan atas */
.pkp_block div[style*="linear-gradient"][style*="text-align: center"]::before,
.pkp_block div[style*="linear-gradient"][style*="text-align:center"]::before,
.pkp_block div[style*="linear-gradient"][style*="padding: 14px 20px"]::before,
.pkp_block div[style*="linear-gradient"][style*="padding:14px 20px"]::before{
    content:""!important;
    position:absolute!important;

    width:170px!important;
    height:78px!important;

    right:-45px!important;
    top:-36px!important;

    border:3px solid rgba(255,255,255,.27)!important;
    border-radius:24px!important;

    transform:rotate(-16deg)!important;

    background:rgba(255,255,255,.035)!important;

    pointer-events:none!important;
    z-index:1!important;
}

/* Motif kiri bawah */
.pkp_block div[style*="linear-gradient"][style*="text-align: center"]::after,
.pkp_block div[style*="linear-gradient"][style*="text-align:center"]::after,
.pkp_block div[style*="linear-gradient"][style*="padding: 14px 20px"]::after,
.pkp_block div[style*="linear-gradient"][style*="padding:14px 20px"]::after{
    content:""!important;
    position:absolute!important;

    width:115px!important;
    height:52px!important;

    left:-43px!important;
    bottom:-29px!important;

    border:3px solid rgba(255,255,255,.22)!important;
    border-radius:20px!important;

    transform:rotate(-16deg)!important;

    background:rgba(255,255,255,.025)!important;

    pointer-events:none!important;
    z-index:1!important;
}

/* Text inside custom heading stays above motif */
.pkp_block div[style*="linear-gradient"][style*="text-align: center"] > *,
.pkp_block div[style*="linear-gradient"][style*="text-align:center"] > *,
.pkp_block div[style*="linear-gradient"][style*="padding: 14px 20px"] > *,
.pkp_block div[style*="linear-gradient"][style*="padding:14px 20px"] > *{
    position:relative!important;
    z-index:3!important;
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
}

/* Specifically protect the People-style inline heading */
.pkp_block div[style*="#F57C00"][style*="#E65100"]{
    background:#F36C0A!important;
    background-image:
        linear-gradient(
            135deg,
            #F36C0A 0%,
            #F36C0A 58%,
            #F57C00 100%
        )!important;
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
}

/* Hover/focus/click must remain orange — never green */
.pkp_block div[style*="linear-gradient"][style*="text-align: center"]:hover,
.pkp_block div[style*="linear-gradient"][style*="text-align: center"]:focus,
.pkp_block div[style*="linear-gradient"][style*="text-align:center"]:hover,
.pkp_block div[style*="linear-gradient"][style*="text-align:center"]:focus{
    background:#F36C0A!important;
    background-image:
        linear-gradient(
            135deg,
            #F36C0A 0%,
            #F36C0A 58%,
            #F57C00 100%
        )!important;
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
}

/* OJS block titles — same motif */
.pkp_block > .title,
.pkp_block > h2.title{
    position:relative!important;
    overflow:hidden!important;
    isolation:isolate!important;
    background:#F36C0A!important;
    background-image:
        linear-gradient(
            135deg,
            #F36C0A 0%,
            #F36C0A 58%,
            #F57C00 100%
        )!important;
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
    border-radius:15px!important;
    border:0!important;
    border-bottom:4px solid rgba(255,255,255,.92)!important;
    box-shadow:0 8px 18px rgba(243,108,10,.24)!important;
}

.pkp_block > .title::before,
.pkp_block > h2.title::before{
    content:""!important;
    position:absolute!important;
    width:170px!important;
    height:78px!important;
    right:-45px!important;
    top:-36px!important;
    border:3px solid rgba(255,255,255,.27)!important;
    border-radius:24px!important;
    transform:rotate(-16deg)!important;
    background:rgba(255,255,255,.035)!important;
    pointer-events:none!important;
    z-index:1!important;
}

.pkp_block > .title::after,
.pkp_block > h2.title::after{
    content:""!important;
    position:absolute!important;
    width:115px!important;
    height:52px!important;
    left:-43px!important;
    bottom:-29px!important;
    border:3px solid rgba(255,255,255,.22)!important;
    border-radius:20px!important;
    transform:rotate(-16deg)!important;
    background:rgba(255,255,255,.025)!important;
    pointer-events:none!important;
    z-index:1!important;
}

@media(max-width:600px){
    .pkp_block div[style*="linear-gradient"][style*="text-align: center"],
    .pkp_block div[style*="linear-gradient"][style*="text-align:center"],
    .pkp_block div[style*="linear-gradient"][style*="padding: 14px 20px"],
    .pkp_block div[style*="linear-gradient"][style*="padding:14px 20px"],
    .pkp_block > .title,
    .pkp_block > h2.title{
        border-radius:13px!important;
    }
}

/* ==========================================================
   EDU SPORTIVO V36 — JOURNAL METRICS HEADER MOTIF
   ----------------------------------------------------------
   FINAL OVERRIDE:
   The Journal Metrics header is a custom component
   (.es-metrics-header), not .sidebar-title / .pkp_block title.
   This rule gives it the same geometric motif language as
   the other sidebar headings without changing its content.
   ========================================================== */

.es-journal-metrics .es-metrics-header{
    position:relative!important;
    overflow:hidden!important;
    isolation:isolate!important;

    background-color:#F36C0A!important;

    /* Orange base + visible geometric white motif */
    background-image:
        linear-gradient(
            135deg,
            rgba(255,255,255,.10) 0%,
            transparent 22%,
            transparent 72%,
            rgba(255,255,255,.08) 100%
        ),
        repeating-linear-gradient(
            -24deg,
            transparent 0px,
            transparent 24px,
            rgba(255,255,255,.16) 25px,
            rgba(255,255,255,.16) 27px,
            transparent 28px,
            transparent 52px
        ),
        linear-gradient(
            135deg,
            #F36C0A 0%,
            #F36C0A 62%,
            #F57C00 100%
        )!important;

    color:#FFFFFF!important;
    border-radius:16px!important;
    border:0!important;
    box-shadow:
        0 7px 16px rgba(11,37,58,.20),
        0 3px 8px rgba(243,108,10,.14)!important;
}

/* Keep the title above the decorative motif */
.es-journal-metrics .es-metrics-header h3{
    position:relative!important;
    z-index:5!important;
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
}

/* Replace the old glow pseudo-element with a visible
   geometric frame motif at the right/top */
.es-journal-metrics .es-metrics-header::after{
    content:""!important;
    position:absolute!important;
    width:175px!important;
    height:76px!important;
    right:-48px!important;
    top:-38px!important;

    border:3px solid rgba(255,255,255,.30)!important;
    border-radius:28px!important;
    transform:rotate(-16deg)!important;

    background:transparent!important;
    box-shadow:none!important;

    pointer-events:none!important;
    z-index:2!important;
}

/* Additional small geometric frame on the lower-left */
.es-journal-metrics .es-metrics-header::marker{
    display:none!important;
}

/* Keep shine behind the title but above the base motif */
.es-journal-metrics .es-metrics-header::before{
    z-index:3!important;
}

/* Hover: keep the same orange palette and motif */
.es-journal-metrics .es-metrics-header:hover{
    background-color:#F36C0A!important;
    box-shadow:
        0 11px 24px rgba(245,124,0,.28),
        0 5px 12px rgba(230,81,0,.16)!important;
}

/* Mobile */
@media(max-width:600px){
    .es-journal-metrics .es-metrics-header{
        border-radius:14px!important;
        background-image:
            linear-gradient(
                135deg,
                rgba(255,255,255,.09) 0%,
                transparent 24%,
                transparent 74%,
                rgba(255,255,255,.07) 100%
            ),
            repeating-linear-gradient(
                -24deg,
                transparent 0px,
                transparent 22px,
                rgba(255,255,255,.14) 23px,
                rgba(255,255,255,.14) 25px,
                transparent 26px,
                transparent 48px
            ),
            linear-gradient(
                135deg,
                #F36C0A 0%,
                #F36C0A 62%,
                #F57C00 100%
            )!important;
    }

    .es-journal-metrics .es-metrics-header::after{
        width:130px!important;
        height:58px!important;
        right:-38px!important;
        top:-29px!important;
        border-width:2px!important;
    }
}


/* ==========================================================
   EDU SPORTIVO V37 — PREMIUM ORANGE + GREEN NAVIGATION
   - Orange dominant
   - Deep green structural accents
   - Sidebar-style shine animation
   - Geometric motif
   - White navigation text/icons
   ========================================================== */

/* Navigation container */
.pkp_structure_head .pkp_site_nav_menu{
    position:relative!important;
    width:100%!important;
    max-width:1160px!important;
    min-height:62px!important;
    height:62px!important;
    margin:0 auto!important;
    padding:0!important;

    background:
        linear-gradient(
            135deg,
            #F36C0A 0%,
            #F36C0A 58%,
            #F57C00 82%,
            #FF9A3D 100%
        )!important;

    border-top:4px solid #034526!important;
    border-bottom:4px solid #034526!important;
    border-radius:0 0 12px 12px!important;

    box-shadow:
        0 8px 20px rgba(3,69,38,.18),
        0 5px 16px rgba(243,108,10,.18)!important;

    overflow:hidden!important;
}

/* Soft geometric motif */
.pkp_structure_head .pkp_site_nav_menu::before{
    content:""!important;
    position:absolute!important;
    inset:-45px -80px auto auto!important;
    width:330px!important;
    height:145px!important;

    border:2px solid rgba(255,255,255,.20)!important;
    border-radius:55px!important;

    transform:rotate(-12deg)!important;
    pointer-events:none!important;
    z-index:0!important;
}

/* Animated shine — same visual language as sidebar/buttons */
.pkp_structure_head .pkp_site_nav_menu::after{
    content:""!important;
    position:absolute!important;
    top:0!important;
    left:-35%!important;
    width:24%!important;
    height:100%!important;

    background:linear-gradient(
        90deg,
        transparent,
        rgba(255,255,255,.24),
        transparent
    )!important;

    transform:skewX(-25deg)!important;
    animation:eduNavShine 5s linear infinite!important;

    pointer-events:none!important;
    z-index:1!important;
}

@keyframes eduNavShine{
    0%{left:-35%;}
    100%{left:125%;}
}

/* Navigation wrapper */
.pkp_structure_head .pkp_navigation_primary_wrapper{
    position:relative!important;
    z-index:3!important;
    height:54px!important;
    min-height:54px!important;
    background:transparent!important;
}

/* Navigation row */
.pkp_structure_head .pkp_navigation_primary_row{
    position:relative!important;
    z-index:4!important;
    height:54px!important;
    min-height:54px!important;
    padding:0 18px!important;
    background:transparent!important;
}

/* Primary menu */
.pkp_structure_head .pkp_navigation_primary{
    position:relative!important;
    z-index:5!important;
    height:54px!important;
    min-height:54px!important;
    background:transparent!important;
}

/* Menu items */
.pkp_structure_head .pkp_navigation_primary > li{
    position:relative!important;
    height:54px!important;
    min-height:54px!important;
}

/* Menu links */
.pkp_structure_head .pkp_navigation_primary > li > a{
    position:relative!important;
    z-index:2!important;

    height:54px!important;
    min-height:54px!important;
    padding:0 12px!important;

    background:transparent!important;
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;

    border-radius:8px!important;

    font-family:Arial,Helvetica,sans-serif!important;
    font-size:14px!important;
    font-weight:700!important;

    transition:
        transform .25s ease,
        background .25s ease,
        color .25s ease,
        box-shadow .25s ease!important;
}

/* Green underline */
.pkp_structure_head .pkp_navigation_primary > li > a::after{
    content:""!important;
    position:absolute!important;
    left:50%!important;
    bottom:5px!important;
    width:0!important;
    height:3px!important;

    background:#034526!important;
    border-radius:4px!important;

    transform:translateX(-50%)!important;
    transition:width .28s ease!important;
}

/* Icons */
.pkp_structure_head .pkp_navigation_primary > li > a::before{
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
    transition:
        transform .25s ease,
        color .25s ease!important;
}

/* Hover */
.pkp_structure_head .pkp_navigation_primary > li > a:hover,
.pkp_structure_head .pkp_navigation_primary > li > a:focus{
    background:rgba(255,255,255,.14)!important;
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;

    transform:translateY(-2px)!important;
    box-shadow:0 5px 12px rgba(3,69,38,.12)!important;
}

.pkp_structure_head .pkp_navigation_primary > li > a:hover::after,
.pkp_structure_head .pkp_navigation_primary > li > a:focus::after{
    width:70%!important;
}

.pkp_structure_head .pkp_navigation_primary > li > a:hover::before,
.pkp_structure_head .pkp_navigation_primary > li > a:focus::before{
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
    transform:scale(1.08)!important;
}

/* Current/active menu */
.pkp_structure_head .pkp_navigation_primary > li.active > a,
.pkp_structure_head .pkp_navigation_primary > li.current > a{
    background:rgba(3,69,38,.22)!important;
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
}

.pkp_structure_head .pkp_navigation_primary > li.active > a::after,
.pkp_structure_head .pkp_navigation_primary > li.current > a::after{
    width:70%!important;
}

/* Search */
.pkp_structure_head .pkp_navigation_primary_row .pkp_search{
    z-index:10!important;
    background:transparent!important;
}

.pkp_structure_head .pkp_navigation_primary_row .pkp_search a,
.pkp_structure_head .pkp_navigation_primary_row .pkp_search button,
.pkp_structure_head .pkp_navigation_primary_row .pkp_search .search_prompt{
    height:54px!important;
    min-height:54px!important;
    background:transparent!important;
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
    border-radius:8px!important;

    transition:
        background .25s ease,
        transform .25s ease,
        color .25s ease!important;
}

.pkp_structure_head .pkp_navigation_primary_row .pkp_search a::before,
.pkp_structure_head .pkp_navigation_primary_row .pkp_search button::before,
.pkp_structure_head .pkp_navigation_primary_row .pkp_search .search_prompt::before{
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
}

.pkp_structure_head .pkp_navigation_primary_row .pkp_search a:hover,
.pkp_structure_head .pkp_navigation_primary_row .pkp_search button:hover,
.pkp_structure_head .pkp_navigation_primary_row .pkp_search .search_prompt:hover{
    background:rgba(3,69,38,.25)!important;
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
    transform:translateY(-2px)!important;
}

.pkp_structure_head .pkp_navigation_primary_row .pkp_search a:hover::before,
.pkp_structure_head .pkp_navigation_primary_row .pkp_search button:hover::before,
.pkp_structure_head .pkp_navigation_primary_row .pkp_search .search_prompt:hover::before{
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
}

/* Dropdown remains white for readability */
.pkp_structure_head .pkp_navigation_primary .dropdown-menu{
    background:#FFFFFF!important;
    border:1px solid #F2C6A8!important;
    border-top:3px solid #034526!important;
    border-radius:0 0 10px 10px!important;
    box-shadow:0 12px 28px rgba(3,69,38,.18)!important;
}

.pkp_structure_head .pkp_navigation_primary .dropdown-menu > li > a,
.pkp_structure_head .pkp_navigation_primary .dropdown-menu a{
    background:#FFFFFF!important;
    color:#F36C0A!important;
    -webkit-text-fill-color:#F36C0A!important;
    transition:
        background .25s ease,
        color .25s ease,
        padding-left .25s ease!important;
}

.pkp_structure_head .pkp_navigation_primary .dropdown-menu > li > a:hover,
.pkp_structure_head .pkp_navigation_primary .dropdown-menu a:hover{
    background:#F5F9F7!important;
    color:#034526!important;
    -webkit-text-fill-color:#034526!important;
    padding-left:20px!important;
}

/* Mobile */
@media(max-width:600px){
    .pkp_structure_head .pkp_site_nav_menu{
        min-height:54px!important;
        height:54px!important;
        border-radius:0 0 10px 10px!important;
    }

    .pkp_structure_head .pkp_navigation_primary_wrapper,
    .pkp_structure_head .pkp_navigation_primary_row,
    .pkp_structure_head .pkp_navigation_primary,
    .pkp_structure_head .pkp_navigation_primary > li,
    .pkp_structure_head .pkp_navigation_primary > li > a{
        height:50px!important;
        min-height:50px!important;
    }

    .pkp_structure_head .pkp_navigation_primary > li > a{
        padding:0 8px!important;
        font-size:12px!important;
    }

    .pkp_structure_head .pkp_navigation_primary_row .pkp_search,
    .pkp_structure_head .pkp_navigation_primary_row .pkp_search a,
    .pkp_structure_head .pkp_navigation_primary_row .pkp_search button,
    .pkp_structure_head .pkp_navigation_primary_row .pkp_search .search_prompt{
        height:50px!important;
        min-height:50px!important;
    }
}


/* ==========================================================
   V38 — FIX REGISTER / LOGIN POSITION
   Keep Register + Login in the WHITE HEADER AREA.
   Do NOT let the colored navigation become their containing block.
   Search remains inside the navigation row.
   ========================================================== */

/* IMPORTANT: navigation must NOT be the containing block
   for Register / Login */
.pkp_structure_head .pkp_site_nav_menu{
    position:static!important;
    overflow:visible!important;
}

/* Keep the navigation's orange visual treatment */
.pkp_structure_head .pkp_site_nav_menu{
    width:100%!important;
    max-width:1160px!important;
    min-height:62px!important;
    height:62px!important;
    margin:0 auto!important;
    padding:0!important;

    background:
        linear-gradient(
            135deg,
            #F36C0A 0%,
            #F36C0A 58%,
            #F57C00 82%,
            #FF9A3D 100%
        )!important;

    border-top:4px solid #034526!important;
    border-bottom:4px solid #034526!important;
    border-radius:0 0 12px 12px!important;

    box-shadow:
        0 8px 20px rgba(3,69,38,.18),
        0 5px 16px rgba(243,108,10,.18)!important;
}

/* Put the decorative layer on the wrapper instead,
   because the nav itself must remain position:static. */
.pkp_structure_head .pkp_navigation_primary_wrapper{
    position:relative!important;
    overflow:hidden!important;
    height:54px!important;
    min-height:54px!important;
    background:transparent!important;
}

/* Geometric motif */
.pkp_structure_head .pkp_navigation_primary_wrapper::before{
    content:""!important;
    position:absolute!important;
    top:-45px!important;
    right:-80px!important;
    width:330px!important;
    height:145px!important;

    border:2px solid rgba(255,255,255,.20)!important;
    border-radius:55px!important;
    transform:rotate(-12deg)!important;

    pointer-events:none!important;
    z-index:0!important;
}

/* Shine */
.pkp_structure_head .pkp_navigation_primary_wrapper::after{
    content:""!important;
    position:absolute!important;
    top:0!important;
    left:-35%!important;
    width:24%!important;
    height:100%!important;

    background:linear-gradient(
        90deg,
        transparent,
        rgba(255,255,255,.24),
        transparent
    )!important;

    transform:skewX(-25deg)!important;
    animation:eduNavShine 5s linear infinite!important;

    pointer-events:none!important;
    z-index:1!important;
}

/* Navigation content stays above the motif */
.pkp_structure_head .pkp_navigation_primary_row,
.pkp_structure_head .pkp_navigation_primary,
.pkp_structure_head .pkp_search{
    position:relative!important;
    z-index:5!important;
}

/* REGISTER / LOGIN:
   nearest positioned ancestor is now .pkp_structure_head */
.pkp_structure_head .pkp_navigation_user_wrapper{
    position:absolute!important;
    top:12px!important;
    right:20px!important;
    left:auto!important;
    bottom:auto!important;

    transform:none!important;
    float:none!important;
    clear:none!important;

    width:auto!important;
    height:auto!important;
    min-width:0!important;
    min-height:0!important;

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

    display:block!important;
    visibility:visible!important;
    opacity:1!important;

    background:transparent!important;
    border:0!important;
    box-shadow:none!important;

    z-index:1000000!important;
}

/* Register/Login remain orange in the white header */
.pkp_structure_head .pkp_navigation_user_wrapper .pkp_navigation_user{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:22px!important;

    width:auto!important;
    height:auto!important;
    min-height:0!important;

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

    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
    list-style:none!important;
}

.pkp_structure_head .pkp_navigation_user_wrapper .pkp_navigation_user > li > a{
    display:inline-flex!important;
    align-items:center!important;

    width:auto!important;
    height:auto!important;
    min-height:0!important;

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

    background:transparent!important;
    border:0!important;
    box-shadow:none!important;

    color:#F36C0A!important;
    -webkit-text-fill-color:#F36C0A!important;

    font-family:Arial,Helvetica,sans-serif!important;
    font-size:14px!important;
    font-weight:700!important;
    line-height:1.2!important;
    text-decoration:none!important;
    white-space:nowrap!important;
}

.pkp_structure_head .pkp_navigation_user_wrapper .pkp_navigation_user > li > a:hover{
    background:transparent!important;
    color:#034526!important;
    -webkit-text-fill-color:#034526!important;
}

/* Search stays in navigation */
.pkp_structure_head .pkp_navigation_primary_row .pkp_search{
    position:absolute!important;
    top:0!important;
    right:14px!important;
    z-index:10!important;
}

/* Mobile */
@media(max-width:600px){
    .pkp_structure_head .pkp_navigation_user_wrapper{
        top:8px!important;
        right:8px!important;
    }

    .pkp_structure_head .pkp_navigation_user_wrapper .pkp_navigation_user{
        gap:10px!important;
    }

    .pkp_structure_head .pkp_navigation_user_wrapper .pkp_navigation_user > li > a{
        font-size:12px!important;
    }
}


/* ==========================================================
   EDU SPORTIVO V39 — FIX ISSUES DROPDOWN
   Keep Current / Archives visible after clicking Issues.
   Root cause in V37/V38:
   - navigation wrappers used overflow:hidden
   - dropdown menus need visible overflow
   - active menu styling must not clip the submenu
   ========================================================== */

/* Navigation must allow OJS dropdowns to escape the bar */
.pkp_structure_head .pkp_site_nav_menu,
.pkp_structure_head .pkp_navigation_primary_wrapper,
.pkp_structure_head .pkp_navigation_primary_row,
.pkp_structure_head .pkp_navigation_primary,
.pkp_structure_head .pkp_navigation_primary > li{
    overflow:visible!important;
}

/* Keep the orange navigation visually controlled */
.pkp_structure_head .pkp_site_nav_menu{
    z-index:2000!important;
}

/* Primary menu must sit above the page content */
.pkp_structure_head .pkp_navigation_primary_wrapper{
    z-index:2001!important;
}

.pkp_structure_head .pkp_navigation_primary_row{
    z-index:2002!important;
}

.pkp_structure_head .pkp_navigation_primary{
    z-index:2003!important;
}

/* Dropdown container */
.pkp_structure_head .pkp_navigation_primary > li{
    position:relative!important;
    z-index:2004!important;
}

/* OJS dropdown: Current / Archives */
.pkp_structure_head .pkp_navigation_primary > li > .dropdown-menu,
.pkp_structure_head .pkp_navigation_primary .dropdown-menu{
    position:absolute!important;
    top:100%!important;
    left:0!important;

    display:none;
    min-width:190px!important;

    margin:0!important;
    padding:6px 0!important;

    background:#FFFFFF!important;
    border:1px solid #F2C6A8!important;
    border-top:3px solid #034526!important;
    border-radius:0 0 12px 12px!important;

    box-shadow:
        0 12px 28px rgba(3,69,38,.18),
        0 5px 15px rgba(243,108,10,.12)!important;

    z-index:999999!important;
}

/* Bootstrap/OJS opens dropdown with .open */
.pkp_structure_head .pkp_navigation_primary > li.open > .dropdown-menu,
.pkp_structure_head .pkp_navigation_primary > li.dropdown.open > .dropdown-menu{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
}

/* Also support OJS/Bootstrap aria state */
.pkp_structure_head .pkp_navigation_primary > li > a[aria-expanded="true"] + .dropdown-menu{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
}

/* Dropdown links */
.pkp_structure_head .pkp_navigation_primary .dropdown-menu > li{
    display:block!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
}

.pkp_structure_head .pkp_navigation_primary .dropdown-menu > li > a,
.pkp_structure_head .pkp_navigation_primary .dropdown-menu a{
    display:block!important;
    width:100%!important;
    box-sizing:border-box!important;

    padding:11px 18px!important;

    background:#FFFFFF!important;
    color:#F36C0A!important;
    -webkit-text-fill-color:#F36C0A!important;

    font-family:Arial,Helvetica,sans-serif!important;
    font-size:14px!important;
    font-weight:700!important;
    line-height:1.25!important;

    text-decoration:none!important;
    white-space:nowrap!important;

    transition:
        background .22s ease,
        color .22s ease,
        padding-left .22s ease!important;
}

.pkp_structure_head .pkp_navigation_primary .dropdown-menu > li > a:hover,
.pkp_structure_head .pkp_navigation_primary .dropdown-menu > li > a:focus{
    background:#F5F9F7!important;
    color:#034526!important;
    -webkit-text-fill-color:#034526!important;
    padding-left:22px!important;
}

/* Issues / dropdown toggle stays clearly active */
.pkp_structure_head .pkp_navigation_primary > li.dropdown.open > a,
.pkp_structure_head .pkp_navigation_primary > li.open > a{
    background:rgba(255,255,255,.16)!important;
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
}

/* Keep the active underline without covering the dropdown */
.pkp_structure_head .pkp_navigation_primary > li.dropdown.open > a::after,
.pkp_structure_head .pkp_navigation_primary > li.open > a::after{
    width:70%!important;
}

/* Important: search stays above navigation but below dropdown */
.pkp_structure_head .pkp_navigation_primary_row .pkp_search{
    z-index:5000!important;
}

/* Dropdown must be above Search */
.pkp_structure_head .pkp_navigation_primary .dropdown-menu{
    z-index:1000000!important;
}

/* Prevent the decorative shine layer from covering dropdown */
.pkp_structure_head .pkp_navigation_primary_wrapper::after{
    pointer-events:none!important;
    z-index:0!important;
}

.pkp_structure_head .pkp_navigation_primary_wrapper::before{
    pointer-events:none!important;
    z-index:0!important;
}

.pkp_structure_head .pkp_navigation_primary_row,
.pkp_structure_head .pkp_navigation_primary{
    background:transparent!important;
}

/* On hover, show dropdown as an additional fallback for desktop */
@media (min-width:901px){
    .pkp_structure_head .pkp_navigation_primary > li:hover > .dropdown-menu{
        display:block!important;
        visibility:visible!important;
        opacity:1!important;
    }
}

/* Mobile: allow dropdown to remain visible below the bar */
@media (max-width:900px){
    .pkp_structure_head .pkp_site_nav_menu,
    .pkp_structure_head .pkp_navigation_primary_wrapper,
    .pkp_structure_head .pkp_navigation_primary_row,
    .pkp_structure_head .pkp_navigation_primary{
        overflow:visible!important;
    }

    .pkp_structure_head .pkp_navigation_primary > li > .dropdown-menu{
        left:0!important;
        min-width:175px!important;
        max-width:calc(100vw - 30px)!important;
    }
}


/* ==========================================================
   EDU SPORTIVO V40 — SEARCH TEXT + ICON WHITE
   ========================================================== */

.pkp_structure_head .pkp_navigation_primary_row .pkp_search,
.pkp_structure_head .pkp_navigation_primary_row .pkp_search a,
.pkp_structure_head .pkp_navigation_primary_row .pkp_search button,
.pkp_structure_head .pkp_navigation_primary_row .pkp_search .search_prompt,
.pkp_structure_head .pkp_navigation_primary_row .pkp_search span{
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
}

.pkp_structure_head .pkp_navigation_primary_row .pkp_search::before,
.pkp_structure_head .pkp_navigation_primary_row .pkp_search a::before,
.pkp_structure_head .pkp_navigation_primary_row .pkp_search button::before,
.pkp_structure_head .pkp_navigation_primary_row .pkp_search .search_prompt::before{
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
}

.pkp_structure_head .pkp_navigation_primary_row .pkp_search a:hover,
.pkp_structure_head .pkp_navigation_primary_row .pkp_search button:hover,
.pkp_structure_head .pkp_navigation_primary_row .pkp_search .search_prompt:hover{
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
    background:rgba(3,69,38,.25)!important;
}

.pkp_structure_head .pkp_navigation_primary_row .pkp_search a:hover::before,
.pkp_structure_head .pkp_navigation_primary_row .pkp_search button:hover::before,
.pkp_structure_head .pkp_navigation_primary_row .pkp_search .search_prompt:hover::before{
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
}


/* ==========================================================
   EDU SPORTIVO V41 — FORCE NATIVE SEARCH ICON WHITE
   The search icon is a native FontAwesome element
   (.fa-search), not the link ::before pseudo-element.
   ========================================================== */

.pkp_structure_head .pkp_site_nav_menu .pkp_search .fa-search,
.pkp_structure_head .pkp_site_nav_menu .pkp_search i.fa-search,
.pkp_structure_head .pkp_site_nav_menu .pkp_search .fa-search::before,
.pkp_structure_head .pkp_site_nav_menu .pkp_search i.fa-search::before,
.pkp_structure_head .pkp_navigation_primary_row .pkp_search .fa-search,
.pkp_structure_head .pkp_navigation_primary_row .pkp_search i.fa-search,
.pkp_structure_head .pkp_navigation_primary_row .pkp_search .fa-search::before,
.pkp_structure_head .pkp_navigation_primary_row .pkp_search i.fa-search::before{
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
    text-shadow:none!important;
}

/* Keep icon white in every interaction state */
.pkp_structure_head .pkp_site_nav_menu .pkp_search .fa-search:hover,
.pkp_structure_head .pkp_site_nav_menu .pkp_search .fa-search:focus,
.pkp_structure_head .pkp_site_nav_menu .pkp_search .fa-search:active,
.pkp_structure_head .pkp_site_nav_menu .pkp_search i.fa-search:hover,
.pkp_structure_head .pkp_site_nav_menu .pkp_search i.fa-search:focus,
.pkp_structure_head .pkp_site_nav_menu .pkp_search i.fa-search:active,
.pkp_structure_head .pkp_navigation_primary_row .pkp_search .fa-search:hover,
.pkp_structure_head .pkp_navigation_primary_row .pkp_search .fa-search:focus,
.pkp_structure_head .pkp_navigation_primary_row .pkp_search .fa-search:active,
.pkp_structure_head .pkp_navigation_primary_row .pkp_search i.fa-search:hover,
.pkp_structure_head .pkp_navigation_primary_row .pkp_search i.fa-search:focus,
.pkp_structure_head .pkp_navigation_primary_row .pkp_search i.fa-search:active{
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
}

/* Override the older orange Search icon rule */
.pkp_structure_head .pkp_site_nav_menu .pkp_navigation_primary_row .pkp_search .fa-search:hover{
    color:#FFFFFF!important;
    -webkit-text-fill-color:#FFFFFF!important;
}