/* JIIA OJS 3.5 - compact approved style */
:root{--green:#187D36;--white:#fff;--black:#000;--gray:#C7C7C7;--dot:#A8A8A8}

html,body{background:#fff;color:#000;font-family:Arial,Helvetica,sans-serif}

/* Header/footer */
.pkp_structure_head,.pkp_site_name_wrapper,.pkp_navigation_primary_row,
.pkp_navigation_primary_wrapper,.pkp_site_nav_menu,.pkp_structure_footer,
.pkp_structure_footer_wrapper,.pkp_footer_content{
 background:var(--green)!important;box-shadow:none!important;text-shadow:none!important
}

/* Compact header */
.pkp_site_name_wrapper{display:flex!important;align-items:center!important;min-height:0!important;padding:0!important}
.pkp_site_name{
 position:relative!important;display:flex!important;align-items:center!important;
 min-height:94px!important;height:94px!important;padding:4px 0!important;margin:0!important;
 overflow:visible!important;font-size:0!important;line-height:0!important;color:transparent!important
}
.pkp_site_name .is_img,.pkp_site_name .is_img img,.pkp_site_name img{
 max-width:92px!important;max-height:92px!important;width:auto!important;height:auto!important
}
.pkp_site_name::after{
 content:"Journal of Intelligent Instrumental Analysis (JIIA)"!important;
 position:absolute!important;left:116px!important;top:19px!important;
 color:#fff!important;background:transparent!important;
 font-family:Arial,Helvetica,sans-serif!important;font-size:29px!important;
 font-style:normal!important;font-weight:700!important;line-height:1.08!important;
 white-space:nowrap!important;text-shadow:none!important
}
.pkp_site_name::before{
 content:"An open access online journal"!important;
 position:absolute!important;left:116px!important;top:54px!important;
 color:#fff!important;background:transparent!important;
 font-family:Arial,Helvetica,sans-serif!important;font-size:19px!important;
 font-style:italic!important;font-weight:400!important;line-height:1.15!important;
 white-space:nowrap!important;text-shadow:none!important
}

/* Compact nav */
.pkp_navigation_primary_row{min-height:44px!important;padding:0!important;margin:0!important}
.pkp_navigation_primary>li>a{color:#fff!important;background:transparent!important;padding-top:12px!important;padding-bottom:12px!important}
.pkp_navigation_primary>li>a:hover,.pkp_navigation_primary>li>a:focus,.pkp_navigation_primary>li.current>a{
 background:var(--gray)!important;color:#000!important
}

/* Search */
.pkp_navigation_search_wrapper,.pkp_navigation_search_wrapper a,
.pkp_navigation_search_wrapper button,.pkp_navigation_search_wrapper .search_prompt,
.pkp_navigation_search_wrapper a:hover,.pkp_navigation_search_wrapper a:focus{
 background:var(--gray)!important;color:#000!important;border-color:var(--gray)!important;box-shadow:none!important
}

/* Account / sign in */
.pkp_navigation_user>li>a,.pkp_navigation_user>li>a:hover,.pkp_navigation_user>li>a:focus,
.pkp_navigation_user>li>a:active,.pkp_navigation_user>li>a[aria-expanded="true"]{
 background:transparent!important;color:#fff!important;box-shadow:none!important
}
.pkp_navigation_user a[href*="login"],.pkp_navigation_user a[href*="register"],
.pkp_navigation_user a[href*="login"]:hover,.pkp_navigation_user a[href*="register"]:hover,
.pkp_navigation_user a[href*="login"]:focus,.pkp_navigation_user a[href*="register"]:focus{
 background:var(--gray)!important;color:#000!important;border-color:var(--gray)!important;box-shadow:none!important
}
.pkp_navigation_user .dropdown-menu,.pkp_navigation_user .dropdown-menu li,
.pkp_navigation_user .dropdown-menu a{background:#fff!important;color:#000!important}
.pkp_navigation_user .dropdown-menu a:hover,.pkp_navigation_user .dropdown-menu a:focus,
.pkp_navigation_user .dropdown-menu .current>a{background:var(--gray)!important;color:#000!important}

/* Main/sidebar: remove indicated horizontal gap */
.pkp_structure_content{gap:0!important;column-gap:0!important}
.pkp_structure_main{margin-right:0!important;padding-right:0!important}
.pkp_structure_sidebar{margin-left:0!important;padding-left:0!important}
@media(min-width:992px){
 .pkp_structure_main+.pkp_structure_sidebar,.pkp_structure_sidebar.left,.pkp_structure_sidebar.right{margin-left:0!important}
}

/* Panels/buttons */
.pkp_block,.pkp_page_index .current_issue,.obj_issue_summary,.obj_article_summary,
.obj_issue_toc .section,.pkp_page_index .additional_content{
 background:var(--gray);color:#000;border-color:var(--gray);box-shadow:none
}
button,.button,.pkp_button,.pkp_button_primary,.pkp_button_default,a.pkp_button,a.button,
input[type="submit"],input[type="button"]{
 background:var(--gray);color:#000;border:1px solid var(--gray);box-shadow:none
}

/* Carousel arrows: BLACK */
.slick-prev,.slick-next,.slick-prev:before,.slick-next:before,
.slick-prev::before,.slick-next::before,
.cmp_carousel .slick-prev,.cmp_carousel .slick-next,
.cmp_carousel .slick-prev:before,.cmp_carousel .slick-next:before,
.pkp_page_index .slick-prev,.pkp_page_index .slick-next,
[class*="carousel"] [class*="next"],[class*="carousel"] [class*="prev"]{
 color:#000!important;border-color:#000!important;stroke:#000!important
}
.slick-prev svg,.slick-next svg,.cmp_carousel svg,[class*="carousel"] svg{
 color:#000!important;stroke:#000!important
}

/* Dots */
.slick-dots li button:before,.slick-dots li button::before,
.cmp_carousel .slick-dots li button:before,.pkp_page_index .slick-dots li button:before{
 color:var(--dot)!important;background-color:var(--dot)!important;opacity:1!important
}
.slick-dots li.slick-active button:before,.slick-dots li.slick-active button::before,
.cmp_carousel .slick-dots li.slick-active button:before,.pkp_page_index .slick-dots li.slick-active button:before{
 color:#000!important;background-color:#000!important;opacity:1!important
}

/* Footer */
.pkp_structure_footer *,.pkp_structure_footer_wrapper *,.pkp_footer_content *{color:#fff!important}

/* Responsive */
@media(max-width:1100px){
 .pkp_site_name::after{font-size:25px!important}
 .pkp_site_name::before{top:52px!important;font-size:17px!important}
}
@media(max-width:760px){
 .pkp_site_name{height:82px!important;min-height:82px!important}
 .pkp_site_name .is_img,.pkp_site_name .is_img img,.pkp_site_name img{max-width:72px!important;max-height:72px!important}
 .pkp_site_name::after{left:88px!important;top:14px!important;right:8px!important;font-size:20px!important;white-space:normal!important}
 .pkp_site_name::before{left:88px!important;top:52px!important;font-size:15px!important}
}


/* ============================================================
   JIIA v10 — corrections from live OJS screenshot
   1. Move primary menu upward
   2. Force carousel chevron black
   3. Force active carousel bullet black
   ============================================================ */

/* 1 — Move the menu upward without shifting it farther left */
.pkp_navigation_primary_row {
    position: relative !important;
    top: -14px !important;
    margin-bottom: -14px !important;
}

/* Keep the existing horizontal alignment/container */
.pkp_navigation_primary_wrapper,
.pkp_navigation_primary {
    margin-left: 0 !important;
}

/* 2 — OJS carousel arrow/chevron: override theme accent green */
.pkp_page_index .cmp_slider .slick-arrow,
.pkp_page_index .cmp_slider .slick-arrow:before,
.pkp_page_index .cmp_slider .slick-arrow::before,
.cmp_slider .slick-arrow,
.cmp_slider .slick-arrow:before,
.cmp_slider .slick-arrow::before,
.cmp_slider .slick-next,
.cmp_slider .slick-next:before,
.cmp_slider .slick-next::before,
.cmp_slider .slick-prev,
.cmp_slider .slick-prev:before,
.cmp_slider .slick-prev::before,
.slick-slider .slick-arrow,
.slick-slider .slick-arrow:before,
.slick-slider .slick-arrow::before,
.slick-slider .slick-next,
.slick-slider .slick-next:before,
.slick-slider .slick-next::before,
.slick-slider .slick-prev,
.slick-slider .slick-prev:before,
.slick-slider .slick-prev::before {
    color: #000000 !important;
    border-color: #000000 !important;
    opacity: 1 !important;
}

/* Some OJS carousel arrows are drawn with borders */
.cmp_slider .slick-next:before,
.cmp_slider .slick-next::before,
.cmp_slider .slick-prev:before,
.cmp_slider .slick-prev::before,
.slick-slider .slick-next:before,
.slick-slider .slick-next::before,
.slick-slider .slick-prev:before,
.slick-slider .slick-prev::before {
    border-color: #000000 !important;
}

/* SVG-based arrow fallback */
.cmp_slider .slick-arrow svg,
.slick-slider .slick-arrow svg,
.cmp_slider .slick-arrow svg *,
.slick-slider .slick-arrow svg * {
    stroke: #000000 !important;
    color: #000000 !important;
}

/* 3 — OJS carousel pagination bullets: active BLACK, inactive gray */
.pkp_page_index .cmp_slider .slick-dots li button,
.cmp_slider .slick-dots li button,
.slick-slider .slick-dots li button {
    background: #A8A8A8 !important;
    background-color: #A8A8A8 !important;
    border-color: #A8A8A8 !important;
    color: #A8A8A8 !important;
}

.pkp_page_index .cmp_slider .slick-dots li.slick-active button,
.cmp_slider .slick-dots li.slick-active button,
.slick-slider .slick-dots li.slick-active button {
    background: #000000 !important;
    background-color: #000000 !important;
    border-color: #000000 !important;
    color: #000000 !important;
}

/* Also override pseudo-elements if the theme uses them */
.pkp_page_index .cmp_slider .slick-dots li button:before,
.pkp_page_index .cmp_slider .slick-dots li button::before,
.cmp_slider .slick-dots li button:before,
.cmp_slider .slick-dots li button::before,
.slick-slider .slick-dots li button:before,
.slick-slider .slick-dots li button::before {
    background: #A8A8A8 !important;
    background-color: #A8A8A8 !important;
    color: #A8A8A8 !important;
    opacity: 1 !important;
}

.pkp_page_index .cmp_slider .slick-dots li.slick-active button:before,
.pkp_page_index .cmp_slider .slick-dots li.slick-active button::before,
.cmp_slider .slick-dots li.slick-active button:before,
.cmp_slider .slick-dots li.slick-active button::before,
.slick-slider .slick-dots li.slick-active button:before,
.slick-slider .slick-dots li.slick-active button::before {
    background: #000000 !important;
    background-color: #000000 !important;
    color: #000000 !important;
    opacity: 1 !important;
}


/* ============================================================
   JIIA v11 — Exact Swiper selectors identified in DevTools
   ============================================================ */

/* Swiper uses CSS variables for its navigation and pagination colors */
.swiper,
.swiper-container {
    --swiper-navigation-color: #000000 !important;
    --swiper-pagination-color: #000000 !important;
    --swiper-pagination-bullet-inactive-color: #A8A8A8 !important;
    --swiper-pagination-bullet-inactive-opacity: 1 !important;
}

/* Exact arrow classes shown in the live page inspector */
.swiper-button-next,
.swiper-button-prev {
    color: #000000 !important;
    --swiper-navigation-color: #000000 !important;
}

.swiper-button-next::after,
.swiper-button-prev::after {
    color: #000000 !important;
}

/* Exact Swiper pagination classes */
.swiper-pagination-bullet {
    background: #A8A8A8 !important;
    background-color: #A8A8A8 !important;
    opacity: 1 !important;
}

.swiper-pagination-bullet-active {
    background: #000000 !important;
    background-color: #000000 !important;
    opacity: 1 !important;
}


/* ============================================================
   JIIA v13 — Sidebar vertical alignment correction
   Based on v11 (restores the correct header/navigation).
   The previous v12 header/menu shift is intentionally NOT used.
   ============================================================ */

/* Keep header/navigation exactly as in v11 — no vertical translation */
.pkp_navigation_primary_row {
    top: auto !important;
}

/* Align the right sidebar with the top of the homepage carousel/main panel.
   This corrects the visible downward offset without moving the header. */
@media (min-width: 992px) {
    .pkp_structure_sidebar {
        position: relative !important;
        top: -39px !important;
        margin-bottom: -39px !important;
    }
}

/* Retain the confirmed Swiper black controls */
.swiper,
.swiper-container {
    --swiper-navigation-color: #000000 !important;
    --swiper-pagination-color: #000000 !important;
    --swiper-pagination-bullet-inactive-color: #A8A8A8 !important;
    --swiper-pagination-bullet-inactive-opacity: 1 !important;
}

.swiper-button-next,
.swiper-button-prev,
.swiper-button-next::after,
.swiper-button-prev::after {
    color: #000000 !important;
}

.swiper-pagination-bullet {
    background: #A8A8A8 !important;
    background-color: #A8A8A8 !important;
    opacity: 1 !important;
}

.swiper-pagination-bullet-active {
    background: #000000 !important;
    background-color: #000000 !important;
    opacity: 1 !important;
}


/* ============================================================
   JIIA v15 — very small sidebar shortening only
   Base: v13. Header, title, subtitle, menu, carousel and
   horizontal alignment remain unchanged.
   ============================================================ */

@media (min-width: 992px) {
    .pkp_structure_sidebar {
        /* Keep the approved v13 position */
        top: -39px !important;
        margin-bottom: -39px !important;

        /* Shorten the gray sidebar a little more; all other v15 styling is preserved */
        height: 400px !important;
        min-height: 0 !important;
        overflow: visible !important;
    }
}


/* ============================================================
   JIIA v18 — exact Information-block bottom-space correction
   Selector confirmed in live OJS DevTools.
   This does NOT reposition the header, menu, carousel or sidebar.
   ============================================================ */
@media (min-width: 992px) {
    .pkp_structure_sidebar.left .pkp_block.block_information {
        padding-bottom: 0.75em !important;
        margin-bottom: 0 !important;
    }
}

/* ============================================================
   JIIA v21 — horizontal sidebar correction only
   Base: approved v18.
   Move the right sidebar 25px RIGHT without changing header,
   navigation, carousel, sidebar dimensions, colors, or controls.
   ============================================================ */
@media (min-width: 992px) {
    .pkp_structure_sidebar.left {
        position: relative !important;
        left: 25px !important;
    }
}


/* JIIA v22
   Only change from v21: move the desktop sidebar 15px farther right.
   Total horizontal shift relative to v18: 40px.
*/
@media (min-width: 992px) {
    .pkp_structure_sidebar.left {
        transform: translateX(15px) !important;
    }
}


/* JIIA v23
   Only change from v22:
   keep sidebar at the same horizontal position and move it 12px upward.
*/
@media (min-width: 992px) {
    .pkp_structure_sidebar.left {
        transform: translate(15px, -12px) !important;
    }
}


/* =========================================================
   JIIA v24 — far-right sidebar layout
   Base: v23
   Purpose:
   - Keep header, logo, title, menu and carousel unchanged.
   - Place the Latest publications / Information sidebar
     farther to the right as an independent column.
   - Align its top with the header/content boundary.
   ========================================================= */

@media (min-width: 992px) {

    /* Override the earlier incremental v23 transform */
    .pkp_structure_sidebar.left {
        position: absolute !important;
        top: 0 !important;
        left: calc(100% + 30px) !important;
        right: auto !important;
        transform: none !important;
        margin: 0 !important;
        z-index: 5;
    }

    /* Establish the main content area as positioning reference */
    .pkp_structure_content.has_sidebar {
        position: relative !important;
    }
}


/* =========================================================
   JIIA v25 — right sidebar heading one-line correction
   Keep v24 layout; widen the far-right sidebar toward the left
   while preserving its far-right edge.
   ========================================================= */

@media (min-width: 992px) {
    .pkp_structure_sidebar.left {
        width: 340px !important;
        left: auto !important;
        right: -370px !important;
    }

    .pkp_structure_sidebar .pkp_block {
        width: 100% !important;
    }

    .pkp_structure_sidebar .pkp_block .title,
    .pkp_structure_sidebar .pkp_block h2 {
        white-space: nowrap !important;
    }
}


/* JIIA v26 — shift the far-right sidebar left so the full heading is visible */
@media (min-width: 992px) {
    .pkp_structure_sidebar.left {
        right: -260px !important; /* v25 was -370px: move sidebar 110px left */
    }
}


/* JIIA v27 — move Search to upper-right, below the logged-in user/registration area */
@media (min-width: 992px) {
    .pkp_navigation_search_wrapper {
        position: absolute !important;
        top: 46px !important;
        right: 58px !important;
        left: auto !important;
        margin: 0 !important;
        z-index: 20 !important;
    }

    .pkp_navigation_search_wrapper a {
        margin: 0 !important;
    }
}


/* JIIA v28 — Search directly below the user/registration area */
@media (min-width: 992px) {
    .pkp_navigation_search_wrapper {
        position: absolute !important;
        top: 30px !important;
        right: 34px !important;
        left: auto !important;
        margin: 0 !important;
        z-index: 30 !important;
    }
}


/* =========================================================
   JIIA v29 — Search positioned relative to the SITE NAV
   Confirmed HTML:
   nav.pkp_site_nav_menu
     .pkp_navigation_primary_row
       .pkp_navigation_search_wrapper
     .pkp_navigation_user_wrapper
   ========================================================= */

@media (min-width: 992px) {

    /* Make the whole site-nav the positioning reference */
    .pkp_site_nav_menu {
        position: relative !important;
    }

    /* Override earlier search positioning */
    .pkp_site_nav_menu .pkp_navigation_primary_row
    .pkp_navigation_search_wrapper {
        position: absolute !important;
        top: -112px !important;
        right: 20px !important;
        left: auto !important;
        margin: 0 !important;
        width: auto !important;
        z-index: 100 !important;
    }

    .pkp_site_nav_menu .pkp_navigation_search_wrapper a {
        margin: 0 !important;
    }
}


/* ============================================================
   JIIA v29 — gap + shift correction only
   Keep original v29 header/Search/user controls.
   1) Remove the white horizontal gap before the sidebar.
   2) Shift the sidebar left to meet the main content cleanly.
   ============================================================ */

@media (min-width: 992px) {

    .pkp_structure_content.has_sidebar {
        position: relative !important;
    }

    .pkp_structure_sidebar.left {
        right: -120px !important;
        left: auto !important;
        transform: none !important;
    }
}


/* FINAL — correct ONLY the lower header edge.
   The visible step is caused by the site-nav ending before the viewport edge.
   Extend only its green background to the right; do not resize/reposition content. */
@media (min-width: 992px) {
    .pkp_site_nav_menu {
        position: relative !important;
    }

    .pkp_site_nav_menu::after {
        content: "" !important;
        position: absolute !important;
        top: 0 !important;
        bottom: 0 !important;
        left: 100% !important;
        width: 100vw !important;
        background: #187D36 !important;
        pointer-events: none !important;
        z-index: -1 !important;
    }
}


/* ============================================================
   JIIA v29 — left lower-header line correction ONLY
   Fill the small white notch indicated at the left edge where
   the green navigation/header bottom begins.
   Everything else remains unchanged.
   ============================================================ */
@media (min-width: 992px) {
    .pkp_site_nav_menu {
        position: relative !important;
    }

    .pkp_site_nav_menu::before {
        content: "" !important;
        position: absolute !important;
        top: 0 !important;
        bottom: 0 !important;
        right: 100% !important;
        width: 100vw !important;
        background: #187D36 !important;
        pointer-events: none !important;
        z-index: -1 !important;
    }
}


/* ============================================================
   JIIA v29 — MOBILE HEADER CLEAN v2
   Mobile only. Desktop remains unchanged.
   Fix overlap by giving title/subtitle their own fixed area.
   ============================================================ */
@media (max-width: 760px) {

    .pkp_structure_head {
        overflow: hidden !important;
    }

    .pkp_site_name_wrapper {
        height: 118px !important;
        min-height: 118px !important;
        padding: 0 8px 0 74px !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }

    .pkp_site_name {
        position: relative !important;
        display: block !important;
        width: 100% !important;
        height: 118px !important;
        min-height: 118px !important;
        padding: 0 !important;
        margin: 0 !important;
        overflow: hidden !important;
    }

    .pkp_site_name .is_img,
    .pkp_site_name .is_img img,
    .pkp_site_name img {
        position: absolute !important;
        left: 0 !important;
        top: 9px !important;
        width: 88px !important;
        height: 98px !important;
        max-width: 88px !important;
        max-height: 98px !important;
        object-fit: contain !important;
    }

    .pkp_site_name::after {
        content: "Journal of Intelligent Instrumental Analysis (JIIA)" !important;
        position: absolute !important;
        left: 102px !important;
        right: 4px !important;
        top: 12px !important;
        width: auto !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        color: #fff !important;
        background: transparent !important;
        font-family: Arial, Helvetica, sans-serif !important;
        font-size: 17px !important;
        font-weight: 700 !important;
        font-style: normal !important;
        line-height: 1.12 !important;
        white-space: normal !important;
        overflow: visible !important;
    }

    .pkp_site_name::before {
        content: "An open access online journal" !important;
        position: absolute !important;
        left: 102px !important;
        right: 4px !important;
        top: 84px !important;
        width: auto !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        color: #fff !important;
        background: transparent !important;
        font-family: Arial, Helvetica, sans-serif !important;
        font-size: 12px !important;
        font-weight: 400 !important;
        font-style: italic !important;
        line-height: 1.1 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
    }
}


/* JIIA — replace lower-right OJS/PKP branding */
.pkp_brand_footer > a,
.pkp_brand_footer img {
    display: none !important;
}
.pkp_brand_footer::after {
    content: "Journal of Intelligent Instrumental Analysis (JIIA)\A Scientific reporting for analytical solutions.";
    white-space: pre-line !important;
    display: block !important;
    color: #FFFFFF !important;
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 16px !important;
    line-height: 1.5 !important;
    text-align: center !important;
}
@media (max-width:760px) {
    .pkp_brand_footer::after {
        font-size: 13px !important;
        text-align: left !important;
    }
}


/* Footer statement wording correction only */
.pkp_brand_footer::after {
    content: "Journal of Intelligent Instrumental Analysis (JIIA)\A JIIAN is a scientific reporting tool for analytical solutions." !important;
}


/* Correct acronym: JIIA */
.pkp_brand_footer::after {
    content: "Journal of Intelligent Instrumental Analysis (JIIA)\A JIIA is a scientific reporting tool for analytical solutions." !important;
}


/* ============================================================
   JIIA — MOBILE HEADER FINAL ALIGNMENT
   Logo left, full title clearly visible to its right.
   Desktop unchanged.
   ============================================================ */
@media (max-width: 760px) {

    .pkp_structure_head {
        overflow: hidden !important;
    }

    .pkp_site_name_wrapper {
        height: 124px !important;
        min-height: 124px !important;
        padding: 0 6px 0 74px !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }

    .pkp_site_name {
        position: relative !important;
        display: block !important;
        width: 100% !important;
        height: 124px !important;
        min-height: 124px !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
    }

    .pkp_site_name .is_img,
    .pkp_site_name .is_img img,
    .pkp_site_name img {
        position: absolute !important;
        left: 6px !important;
        top: 12px !important;
        width: 92px !important;
        height: 100px !important;
        max-width: 92px !important;
        max-height: 100px !important;
        object-fit: contain !important;
    }

    .pkp_site_name::after {
        content: "Journal of Intelligent Instrumental Analysis (JIIA)" !important;
        position: absolute !important;
        left: 110px !important;
        right: 6px !important;
        top: 13px !important;
        width: auto !important;
        max-width: none !important;
        height: auto !important;
        color: #fff !important;
        background: transparent !important;
        font-family: Arial, Helvetica, sans-serif !important;
        font-size: 16px !important;
        font-weight: 700 !important;
        font-style: normal !important;
        line-height: 1.15 !important;
        text-align: left !important;
        white-space: normal !important;
        overflow: visible !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .pkp_site_name::before {
        content: "An open access online journal" !important;
        position: absolute !important;
        left: 110px !important;
        right: 6px !important;
        top: 91px !important;
        width: auto !important;
        color: #fff !important;
        background: transparent !important;
        font-family: Arial, Helvetica, sans-serif !important;
        font-size: 12px !important;
        font-weight: 400 !important;
        font-style: italic !important;
        line-height: 1.15 !important;
        text-align: left !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        margin: 0 !important;
        padding: 0 !important;
    }
}


/* ============================================================
   JIIA — MOBILE HEADER COMPACT FINAL
   Reduce logo and shift logo/title left so the complete title
   and subtitle fit inside the phone viewport.
   Desktop remains unchanged.
   ============================================================ */
@media (max-width: 760px) {

    .pkp_site_name_wrapper {
        height: 112px !important;
        min-height: 112px !important;
        padding-left: 64px !important;
        padding-right: 4px !important;
    }

    .pkp_site_name {
        height: 112px !important;
        min-height: 112px !important;
    }

    .pkp_site_name .is_img,
    .pkp_site_name .is_img img,
    .pkp_site_name img {
        left: 0 !important;
        top: 11px !important;
        width: 76px !important;
        height: 90px !important;
        max-width: 76px !important;
        max-height: 90px !important;
    }

    .pkp_site_name::after {
        left: 84px !important;
        right: 3px !important;
        top: 10px !important;
        font-size: 14px !important;
        line-height: 1.12 !important;
    }

    .pkp_site_name::before {
        left: 84px !important;
        right: 3px !important;
        top: 80px !important;
        font-size: 10.5px !important;
        line-height: 1.1 !important;
        white-space: normal !important;
        overflow: visible !important;
    }
}


/* ============================================================
   JIIA — MOBILE: SHIFT COMPLETE LOGO/TITLE GROUP LEFT
   Only horizontal positioning is changed.
   ============================================================ */
@media (max-width: 760px) {

    .pkp_site_name_wrapper {
        padding-left: 52px !important;
    }

    .pkp_site_name .is_img,
    .pkp_site_name .is_img img,
    .pkp_site_name img {
        left: -10px !important;
    }

    .pkp_site_name::after {
        left: 68px !important;
        right: 2px !important;
    }

    .pkp_site_name::before {
        left: 68px !important;
        right: 2px !important;
    }
}


/* ============================================================
   JIIA — MOBILE LOGO VISIBILITY FIX
   Keep title/subtitle where they are; move ONLY the logo right.
   ============================================================ */
@media (max-width: 760px) {
    .pkp_site_name .is_img,
    .pkp_site_name .is_img img,
    .pkp_site_name img {
        left: 8px !important;
    }
}


/* MOBILE — move ONLY the JIIA logo LEFT */
@media (max-width: 760px) {
    .pkp_site_name .is_img,
    .pkp_site_name .is_img img,
    .pkp_site_name img {
        left: -2px !important;
    }
}


/* MOBILE — move logo left, but keep the complete logo visible */
@media (max-width: 760px) {
    .pkp_site_name .is_img,
    .pkp_site_name .is_img img,
    .pkp_site_name img {
        left: 0 !important;
        width: 70px !important;
        max-width: 70px !important;
        height: 90px !important;
        max-height: 90px !important;
        object-fit: contain !important;
    }
}


/* ============================================================
   ONLY CHANGE FROM THE USER-UPLOADED STYLE:
   Move "An open access online journal" slightly to the RIGHT.
   Logo, title, desktop layout, carousel, footer: unchanged.
   ============================================================ */
@media (max-width: 760px) {
    .pkp_site_name::before {
        left: 76px !important; /* uploaded style effective value was 68px */
    }
}


/* MOBILE — title in exactly three lines; everything else unchanged */
@media (max-width: 760px) {
    .pkp_site_name::after {
        content: "Journal of Intelligent\A Instrumental Analysis\A (JIIA)" !important;
        white-space: pre-line !important;
        top: 8px !important;
        line-height: 1.08 !important;
    }
}


/* MOBILE — requested fine adjustment only:
   1) title slightly RIGHT
   2) logo slightly UP */
@media (max-width: 760px) {
    .pkp_site_name::after {
        left: 74px !important; /* was 68px */
    }

    .pkp_site_name .is_img,
    .pkp_site_name .is_img img,
    .pkp_site_name img {
        top: 5px !important; /* move logo upward */
    }
}


/* MOBILE — final logo vertical alignment only:
   move logo slightly upward so its top aligns with title top */
@media (max-width: 760px) {
    .pkp_site_name .is_img,
    .pkp_site_name .is_img img,
    .pkp_site_name img {
        top: -1px !important;
    }
}


/* MOBILE — move ONLY the logo a little more upward */
@media (max-width: 760px) {
    .pkp_site_name .is_img,
    .pkp_site_name .is_img img,
    .pkp_site_name img {
        top: -6px !important;
    }
}

/* ============================================================
   JIIA — MOBILE MENU VISIBILITY FIX ONLY
   Keep the approved mobile logo/title/subtitle positions unchanged.
   The hamburger already toggles to X; allow the opened OJS menu
   to extend outside the compact header instead of being clipped.
   ============================================================ */
@media (max-width: 760px) {
    .pkp_structure_head {
        overflow: visible !important;
    }
}