/*
 * OJS 3.3.x — INGV-inspired Bootstrap3 Custom Stylesheet
 * ------------------------------------------------------
 * Target : Open Journal Systems 3.3.x + Bootstrap3 Theme
 * Style  : Inspired by the clean editorial layout of Collane Editoriali INGV
 * Change : Main navigation is CENTERED on desktop.
 *
 * Upload:
 * Settings > Website > Appearance > Advanced > Journal Style Sheet
 *
 * Notes:
 * - No external fonts, images, or journal-specific file paths.
 * - Mobile Bootstrap navigation remains collapsible.
 * - Designed as a single CSS override file.
 */

/* =========================================================
   1. GLOBAL
   ========================================================= */

html {
    background: #ffffff;
}

body {
    margin: 0;
    background: #ffffff;
    color: #333333;
    font-family: "Arial Narrow", "Roboto Condensed", Arial, Helvetica, sans-serif;
    font-size: 14px;
    line-height: 1.55;
}

a {
    color: #426b7d;
    text-decoration: none;
}

a:hover,
a:focus {
    color: #244f61;
    text-decoration: underline;
}

img {
    max-width: 100%;
    height: auto;
}

.container {
    max-width: 1180px;
}

/* =========================================================
   2. TOP / USER NAVIGATION
   Similar to the narrow LOGIN bar in INGV
   ========================================================= */

#headerNavigationContainer,
.pkp_structure_head {
    border: 0;
    box-shadow: none;
}

#headerNavigationContainer .navbar-default,
.pkp_structure_head .navbar-default {
    border: 0;
    border-radius: 0;
}

/* User/login area where Bootstrap3 exposes it */
.navbar-user,
.navbar-user.navbar,
#navigationUser,
.pkp_navigation_user {
    font-size: 12px;
    text-transform: uppercase;
}

/* =========================================================
   3. JOURNAL HEADER / LOGO
   ========================================================= */

.pkp_head_wrapper,
.header_view,
#headerNavigationContainer .container:first-child {
    background: #ffffff;
}

.pkp_site_name,
.navbar-header + .site-name,
.journal-logo {
    margin: 0;
}

.pkp_site_name img,
.navbar-brand img,
.journal-logo img {
    width: auto;
    max-width: 100%;
    max-height: 145px;
}

.navbar-brand {
    height: auto;
    padding-top: 24px;
    padding-bottom: 24px;
}

/* Keep wide journal logos comfortably visible */
@media (min-width: 768px) {
    .navbar-header {
        min-height: 150px;
    }

    .navbar-brand {
        display: flex;
        align-items: center;
        min-height: 150px;
    }
}

/* =========================================================
   4. MAIN NAVIGATION — CENTERED
   ========================================================= */

/*
 * This is the key modification.
 * Bootstrap normally floats .navbar-nav to the left.
 * We remove the float and center the whole menu.
 */
@media (min-width: 768px) {

    #headerNavigationContainer .navbar,
    .pkp_structure_head .navbar {
        border-radius: 0;
    }

    /* Main navigation strip */
    #headerNavigationContainer .navbar-default,
    .pkp_structure_head .navbar-default,
    .navbar-primary,
    .pkp_navigation_primary_row {
        background: #476979;
        border-color: #476979;
    }

    /* Center the Bootstrap collapse contents */
    #headerNavigationContainer .navbar-collapse,
    .navbar-primary .navbar-collapse,
    .pkp_navigation_primary_wrapper {
        text-align: center;
    }

    /* Center primary menu */
    #navigationPrimary,
    .pkp_navigation_primary,
    .navbar-nav {
        float: none !important;
        display: inline-block;
        width: auto;
        margin: 0 auto;
        padding: 0;
        vertical-align: top;
        text-align: center;
    }

    #navigationPrimary > li,
    .pkp_navigation_primary > li,
    .navbar-nav > li {
        float: none !important;
        display: inline-block;
        vertical-align: top;
        text-align: left;
    }

    #navigationPrimary > li > a,
    .pkp_navigation_primary > li > a,
    .navbar-nav > li > a {
        display: block;
        padding: 14px 17px;
        color: #ffffff !important;
        background: transparent;
        border: 0;
        font-size: 13px;
        font-weight: 700;
        line-height: 20px;
        text-transform: uppercase;
        letter-spacing: 0.01em;
        text-decoration: none;
    }

    #navigationPrimary > li > a:hover,
    #navigationPrimary > li > a:focus,
    #navigationPrimary > .active > a,
    #navigationPrimary > .active > a:hover,
    #navigationPrimary > .active > a:focus,
    .pkp_navigation_primary > li > a:hover,
    .pkp_navigation_primary > li > a:focus,
    .navbar-nav > li > a:hover,
    .navbar-nav > li > a:focus,
    .navbar-nav > .active > a {
        color: #ffffff !important;
        background: #355869 !important;
        text-decoration: none;
    }

    /* Dropdown must remain aligned normally */
    #navigationPrimary .dropdown-menu,
    .pkp_navigation_primary .dropdown-menu,
    .navbar-nav .dropdown-menu {
        min-width: 210px;
        padding: 5px 0;
        text-align: left;
        background: #ffffff;
        border: 1px solid #d8e0e4;
        border-radius: 0;
        box-shadow: 0 5px 12px rgba(0, 0, 0, 0.12);
    }

    #navigationPrimary .dropdown-menu > li > a,
    .pkp_navigation_primary .dropdown-menu > li > a,
    .navbar-nav .dropdown-menu > li > a {
        padding: 9px 16px;
        color: #3d5f6e !important;
        background: #ffffff;
        font-size: 13px;
        font-weight: 600;
        text-transform: none;
        white-space: normal;
    }

    #navigationPrimary .dropdown-menu > li > a:hover,
    #navigationPrimary .dropdown-menu > li > a:focus,
    .pkp_navigation_primary .dropdown-menu > li > a:hover,
    .navbar-nav .dropdown-menu > li > a:hover {
        color: #ffffff !important;
        background: #476979;
    }
}

/* Mobile: preserve Bootstrap collapse behaviour */
@media (max-width: 767px) {
    #headerNavigationContainer .navbar-default,
    .pkp_structure_head .navbar-default {
        background: #476979;
        border-color: #476979;
    }

    .navbar-toggle {
        border-color: rgba(255,255,255,.55);
    }

    .navbar-toggle .icon-bar {
        background: #ffffff !important;
    }

    #navigationPrimary,
    .pkp_navigation_primary,
    .navbar-nav {
        margin: 0;
    }

    #navigationPrimary > li > a,
    .pkp_navigation_primary > li > a,
    .navbar-nav > li > a {
        color: #ffffff !important;
        font-weight: 700;
    }

    .navbar-brand {
        min-height: 100px;
        padding: 18px 15px;
    }

    .navbar-brand img,
    .pkp_site_name img {
        max-height: 95px;
    }
}

/* =========================================================
   5. PAGE CONTENT
   ========================================================= */

main,
.pkp_structure_main,
.page,
.page_index_journal {
    color: #333333;
}

.pkp_structure_content,
#main-content,
.main-content {
    max-width: 1180px;
    margin-left: auto;
    margin-right: auto;
}

.page-header {
    margin-top: 0;
    border-bottom: 1px solid #e2e7e9;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: #365d6f;
    font-family: "Arial Narrow", "Roboto Condensed", Arial, Helvetica, sans-serif;
    font-weight: 500;
}

h1 {
    font-size: 30px;
}

h2 {
    font-size: 23px;
}

h3 {
    font-size: 19px;
}

.page_index_journal .homepage_about,
.page_index_journal .additional_content {
    margin-bottom: 28px;
}

/* =========================================================
   6. CURRENT ISSUE / ARTICLE LIST
   ========================================================= */

.current_issue {
    margin-top: 28px;
}

.current_issue > h2,
.obj_issue_toc .section > h2,
.obj_issue_toc .section > h3,
.page_issue_archive h1 {
    color: #426b7d;
    text-transform: uppercase;
    letter-spacing: 0.01em;
}

.obj_issue_toc .section {
    margin-top: 24px;
}

.obj_article_summary,
.article-summary,
.media-list .media {
    padding-top: 16px;
    padding-bottom: 16px;
    border-bottom: 1px solid #e5e9eb;
}

.obj_article_summary .title,
.obj_article_summary .title a,
.article-summary .title,
.article-summary h3 a {
    color: #426b7d;
    font-size: 17px;
    font-weight: 500;
    line-height: 1.35;
}

.obj_article_summary .authors,
.article-summary .authors {
    margin-top: 4px;
    color: #333333;
    font-size: 13px;
}

.obj_article_summary .pages,
.obj_article_summary .doi,
.article-summary .doi {
    color: #666666;
    font-size: 12px;
}

/* =========================================================
   7. BUTTONS / GALLEYS
   ========================================================= */

.btn,
.obj_galley_link,
.galley-link,
a.btn {
    border-radius: 2px;
    box-shadow: none;
    font-weight: 600;
    text-decoration: none;
}

.btn-primary,
.obj_galley_link,
.galley-link {
    color: #ffffff !important;
    background: #668f9e;
    border-color: #668f9e;
}

.btn-primary:hover,
.btn-primary:focus,
.obj_galley_link:hover,
.obj_galley_link:focus,
.galley-link:hover,
.galley-link:focus {
    color: #ffffff !important;
    background: #476979;
    border-color: #476979;
    text-decoration: none;
}

/* =========================================================
   8. SIDEBAR — INGV-LIKE BLOCK HEADERS
   ========================================================= */

.pkp_structure_sidebar,
.sidebar,
#sidebar {
    font-size: 13px;
}

.pkp_structure_sidebar .pkp_block,
.sidebar .pkp_block,
#sidebar .block,
.pkp_block {
    margin-bottom: 26px;
    border: 0;
    background: transparent;
    box-shadow: none;
}

/* OJS/PKP block titles */
.pkp_structure_sidebar .title,
.pkp_structure_sidebar .pkp_block .title,
.sidebar .block-title,
.sidebar h2,
.sidebar h3,
.pkp_block .title {
    margin: 0 0 12px;
    padding: 9px 12px;
    color: #ffffff;
    background: #476979;
    border: 0;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
    text-transform: uppercase;
    letter-spacing: 0.01em;
}

/* Sidebar content */
.pkp_structure_sidebar .content,
.sidebar .block-content,
.pkp_block .content {
    padding: 0 8px;
}

.pkp_structure_sidebar ul,
.sidebar ul,
.pkp_block ul {
    padding-left: 0;
    list-style: none;
}

.pkp_structure_sidebar li,
.sidebar li,
.pkp_block li {
    padding: 8px 0;
    border-bottom: 1px solid #e3e7e9;
}

.pkp_structure_sidebar li:last-child,
.sidebar li:last-child,
.pkp_block li:last-child {
    border-bottom: 0;
}

/* =========================================================
   9. FORMS
   ========================================================= */

.form-control,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
textarea,
select {
    border-color: #ccd6da;
    border-radius: 2px;
    box-shadow: none;
}

.form-control:focus,
input:focus,
textarea:focus,
select:focus {
    border-color: #668f9e;
    box-shadow: 0 0 0 2px rgba(102, 143, 158, 0.15);
    outline: 0;
}

/* =========================================================
   10. BREADCRUMBS / PAGINATION
   ========================================================= */

.breadcrumb {
    padding: 8px 0;
    background: transparent;
    border-radius: 0;
    color: #777777;
}

.pagination > li > a,
.pagination > li > span {
    color: #426b7d;
    border-color: #dce3e6;
}

.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover {
    background: #476979;
    border-color: #476979;
}

/* =========================================================
   11. ARTICLE DETAIL
   ========================================================= */

.obj_article_details .page_title,
.obj_article_details h1,
.page_article h1 {
    color: #31596b;
    font-size: 30px;
    font-weight: 500;
    line-height: 1.25;
}

.obj_article_details .authors,
.page_article .authors {
    color: #444444;
}

.obj_article_details .abstract,
.page_article .abstract {
    margin-top: 24px;
}

.obj_article_details .abstract h2,
.obj_article_details .keywords h2,
.obj_article_details .references h2 {
    color: #426b7d;
    font-size: 18px;
    text-transform: uppercase;
}

/* =========================================================
   12. FOOTER
   ========================================================= */

footer,
.pkp_structure_footer_wrapper,
#footer {
    margin-top: 45px;
    padding-top: 25px;
    padding-bottom: 25px;
    color: #eaf0f2;
    background: #476979;
    border: 0;
}

footer a,
.pkp_structure_footer_wrapper a,
#footer a {
    color: #ffffff;
}

footer a:hover,
.pkp_structure_footer_wrapper a:hover,
#footer a:hover {
    color: #ffffff;
    text-decoration: underline;
}

.pkp_brand_footer img {
    max-height: 45px;
    width: auto;
}

/* =========================================================
   13. RESPONSIVE POLISH
   ========================================================= */

@media (max-width: 991px) {
    body {
        font-size: 14px;
    }

    .container {
        width: auto;
    }
}

@media (max-width: 767px) {
    h1,
    .obj_article_details .page_title,
    .obj_article_details h1,
    .page_article h1 {
        font-size: 25px;
    }

    h2 {
        font-size: 21px;
    }

    .pkp_structure_sidebar,
    .sidebar,
    #sidebar {
        margin-top: 28px;
    }
}

/* =========================================================
   14. ACCESSIBILITY
   ========================================================= */

a:focus,
button:focus,
input:focus,
select:focus,
textarea:focus {
    outline: 2px solid #d29b2f;
    outline-offset: 2px;
}

.sr-only,
.pkp_screen_reader {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}