/*
=========================================================
 EYIB OJS JOURNAL — CLASSY-LIKE FINAL CSS
 Sayt: https://eyib.org.uz/index.php/Journal/index
 Yuklash joyi:
 Settings → Website → Appearance → Advanced → Journal Style Sheet
 Keyin cache tozalang:
 Administration → Clear Data Caches
 Administration → Clear Template Cache
=========================================================
*/

/* =========================
   1. ASOSIY SOZLAMALAR
========================= */
:root {
    --eyib-bg: #9cbef0;
    --eyib-white: #adc3fb;
    --eyib-text: #374151;
    --eyib-muted: #528708;
    --eyib-border: #35538f;

    --eyib-primary: #0b5e7a;
    --eyib-primary-dark: #073f52;
    --eyib-primary-soft: #daddde;

    --eyib-accent: #d9a441;
    --eyib-accent-soft: #fff7e6;

    --eyib-radius: 50px;
    --eyib-radius-sm: 12px;
    --eyib-max: 1180px;

    --eyib-shadow: 0 12px 35px rgba(17, 24, 39, .08);
    --eyib-shadow-sm: 0 8px 24px rgba(17, 24, 39, .055);

    --eyib-banner-height: clamp(170px, 30vw, 430px);
}

/* =========================
   2. XAVFSIZ RESET
========================= */
*,
*::before,
*::after {
    box-sizing: border-box !important;
}

html {
    scroll-behavior: smooth;
    font-size: 16px !important;
}

html,
body {
    margin: 0 !important;
    padding: 0 !important;
    background: var(--eyib-bg) !important;
    color: var(--eyib-text) !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    line-height: 1.65 !important;
    overflow-x: hidden !important;
}

body {
    font-size: 16px !important;
}

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

a {
    color: var(--eyib-primary);
    text-decoration: none !important;
    transition: all .22s ease;
}

a:hover {
    color: var(--eyib-primary-dark);
}

/* =========================
   3. OJS ESKI WIDTH QOIDALARINI TUZATISH
========================= */
.pkp_structure_page {
    display: flex !important;
    flex-direction: column !important;
    min-height: 100vh !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.pkp_site_name_wrapper,
.pkp_navigation_primary_wrapper,
.pkp_navigation_user,
.pkp_search_mobile,
.pkp_structure_content,
.pkp_structure_footer,
.pkp_head_wrapper,
.pkp_footer_content {
    width: min(var(--eyib-max), calc(100% - 40px)) !important;
    max-width: var(--eyib-max) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.pkp_site_name_wrapper::before,
.pkp_site_name_wrapper::after,
.pkp_navigation_primary_wrapper::before,
.pkp_navigation_primary_wrapper::after,
.pkp_structure_content::before,
.pkp_structure_content::after,
.pkp_structure_footer::before,
.pkp_structure_footer::after {
    content: none !important;
    display: none !important;
    clear: none !important;
}

/* =========================
   4. HEADER / LOGO / BANNER
========================= */
.pkp_structure_head {
    background: var(--eyib-white) !important;
    border-bottom: 1px solid var(--eyib-border) !important;
    box-shadow: 0 6px 22px rgba(15, 23, 42, .05) !important;
    position: relative !important;
    z-index: 30 !important;
}

.pkp_head_wrapper {
    padding-top: 18px !important;
}

.pkp_site_name_wrapper {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.pkp_site_name,
.pkp_site_name > a,
.pkp_site_name .is_img {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: var(--eyib-banner-height) !important;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--eyib-primary-dark) !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
}

/* Header image / pageHeaderLogoImage responsive bo‘lishi uchun */
.pkp_site_name img,
.pkp_site_name .is_img img,
.pkp_site_name a img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: var(--eyib-banner-height) !important;
    object-fit: contain !important;
    object-position: center center !important;
    display: block !important;
}

/* Agar logo matn bo‘lib chiqsa */
.pkp_site_name .is_text {
    font-size: clamp(1.4rem, 3vw, 2.6rem) !important;
    font-weight: 800 !important;
    color: var(--eyib-primary-dark) !important;
    text-align: center !important;
}

/* =========================
   5. YUQORI MENU
========================= */
.pkp_navigation_primary_row {
    width: min(var(--eyib-max), calc(100% - 40px)) !important;
    max-width: var(--eyib-max) !important;
    margin: 16px auto 0 auto !important;
    padding: 0 14px !important;
    background: var(--eyib-primary) !important;
    border: 0 !important;
    border-radius: 16px 16px 0 0 !important;
    box-shadow: none !important;
}

.pkp_navigation_primary_wrapper {
    width: 100% !important;
    max-width: none !important;
}

.pkp_navigation_primary {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 4px !important;
    min-height: 54px !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,
.pkp_navigation_primary > li > button,
.pkp_navigation_user > li > a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 42px !important;
    padding: 12px 15px !important;
    border-radius: 12px !important;
    color: #ffffff !important;
    background: transparent !important;
    border: 0 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    text-transform: none !important;
    text-decoration: none !important;
}

.pkp_navigation_primary > li > a:hover,
.pkp_navigation_primary > li > button:hover,
.pkp_navigation_primary > li > a:focus,
.pkp_navigation_primary > li > button:focus,
.pkp_navigation_user > li > a:hover {
    background: rgba(255, 255, 255, .15) !important;
    color: #ffffff !important;
}

/* Dropdown menu */
.pkp_navigation_primary ul {
    background: #ffffff !important;
    border: 1px solid var(--eyib-border) !important;
    border-radius: 14px !important;
    box-shadow: var(--eyib-shadow) !important;
    overflow: hidden !important;
    padding: 8px !important;
}

.pkp_navigation_primary ul a {
    display: block !important;
    color: var(--eyib-text) !important;
    padding: 11px 14px !important;
    border-radius: 10px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
}

.pkp_navigation_primary ul a:hover {
    background: var(--eyib-primary-soft) !important;
    color: var(--eyib-primary) !important;
}

.pkp_navigation_search_wrapper a,
.pkp_navigation_search_wrapper button {
    color: #ffffff !important;
}

/* =========================
   6. ASOSIY CONTENT + SIDEBAR
========================= */
.pkp_structure_content {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 330px !important;
    gap: 28px !important;
    align-items: start !important;
    padding-top: 32px !important;
    padding-bottom: 46px !important;
}

.pkp_structure_main,
.pkp_structure_sidebar {
    float: none !important;
    clear: none !important;
}

.pkp_structure_main {
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    padding: 0 !important;
}

.pkp_structure_sidebar {
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* =========================
   7. KARTALAR / PAGE BLOKLAR
========================= */
.pkp_structure_main > .page,
.pkp_page_index .homepage_about,
.pkp_page_index .current_issue,
.obj_issue_toc,
.pkp_block {
    background: var(--eyib-white) !important;
    border: 1px solid var(--eyib-border) !important;
    border-radius: var(--eyib-radius) !important;
    box-shadow: var(--eyib-shadow) !important;
}

.pkp_structure_main > .page,
.pkp_page_index .homepage_about,
.pkp_page_index .current_issue,
.obj_issue_toc {
    padding: 26px !important;
    margin-bottom: 24px !important;
}

/* Agar main ichida page kartasi bo‘lmasa, oq fonli ko‘rinish */
.pkp_structure_main:not(:has(.page)):not(:has(.current_issue)) {
    background: transparent !important;
}

/* =========================
   8. SARLAVHALAR
========================= */
.pkp_structure_main h1,
.pkp_structure_main h2,
.pkp_structure_main h3,
.pkp_block .title,
.pkp_block h2,
.pkp_block h3 {
    color: var(--eyib-primary-dark) !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
}

.pkp_structure_main h1 {
    font-size: clamp(1.55rem, 2vw, 2.15rem) !important;
    margin-top: 0 !important;
    margin-bottom: 20px !important;
}

.pkp_structure_main h2,
.pkp_block .title,
.pkp_block h2 {
    position: relative !important;
    padding-bottom: 12px !important;
    margin-top: 0 !important;
    margin-bottom: 18px !important;
    font-size: clamp(1.18rem, 1.7vw, 1.55rem) !important;
}

.pkp_structure_main h2::after,
.pkp_block .title::after,
.pkp_block h2::after {
    content: "" !important;
    display: block !important;
    width: 58px !important;
    height: 4px !important;
    border-radius: 50px !important;
    background: var(--eyib-accent) !important;
    position: absolute !important;
    left: 0 !important;
    bottom: 0 !important;
}

/* =========================
   9. ABOUT / JOURNAL DESCRIPTION
========================= */
.about_site,
.page_index_journal .about,
.pkp_page_index .journal_description,
.pkp_page_index .homepage_about,
.pkp_page_index .homepage_image + .about_site {
    background: var(--eyib-accent-soft) !important;
    border: 1px solid #f1dfad !important;
    border-left: 5px solid var(--eyib-accent) !important;
    border-radius: var(--eyib-radius) !important;
    padding: 24px !important;
    margin-bottom: 28px !important;
    color: #374151 !important;
    line-height: 1.75 !important;
}

/* =========================
   10. CURRENT ISSUE / MAQOLA RO‘YXATI
========================= */
.current_issue_title,
.obj_issue_toc .heading .title {
    color: var(--eyib-primary-dark) !important;
    font-size: 26px !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
    margin-bottom: 10px !important;
}

.obj_article_summary,
.section > .obj_article_summary,
.cmp_article_list > li,
.sections .section .articles > li {
    background: #ffffff !important;
    border: 1px solid var(--eyib-border) !important;
    border-radius: 16px !important;
    padding: 20px 22px !important;
    margin: 0 0 18px 0 !important;
    box-shadow: var(--eyib-shadow-sm) !important;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease !important;
}

.obj_article_summary:hover,
.cmp_article_list > li:hover,
.sections .section .articles > li:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 16px 36px rgba(17, 24, 39, .09) !important;
    border-color: #cbd5e1 !important;
}

.obj_article_summary .title,
.obj_article_summary .title a,
.obj_article_summary h3,
.obj_article_summary h3 a,
.obj_article_summary h4,
.obj_article_summary h4 a,
.cmp_article_list .title,
.cmp_article_list .title a {
    color: var(--eyib-primary-dark) !important;
    font-size: 18px !important;
    line-height: 1.42 !important;
    font-weight: 800 !important;
    text-decoration: none !important;
}

.obj_article_summary .title a:hover,
.obj_article_summary h3 a:hover,
.obj_article_summary h4 a:hover,
.cmp_article_list .title a:hover {
    color: var(--eyib-primary) !important;
}

.obj_article_summary .authors,
.obj_article_summary .meta,
.obj_article_summary .pages,
.obj_article_summary .galley_links,
.obj_article_summary .doi,
.cmp_article_list .authors {
    color: var(--eyib-muted) !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
}

/* PDF / HTML / XML / Submit tugmalari */
.obj_article_summary .galley_links a,
.obj_galley_link,
.cmp_button,
.cmp_manuscript_button,
.page_issue_archive .issues_archive a.read_more,
.block_make_submission_link,
.article_galleys a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 34px !important;
    padding: 7px 14px !important;
    margin: 4px 4px 4px 0 !important;
    border-radius: 999px !important;
    border: 1px solid var(--eyib-primary) !important;
    background: var(--eyib-primary) !important;
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    text-decoration: none !important;
    box-shadow: none !important;
}

.obj_article_summary .galley_links a:hover,
.obj_galley_link:hover,
.cmp_button:hover,
.cmp_manuscript_button:hover,
.block_make_submission_link:hover,
.article_galleys a:hover {
    background: var(--eyib-primary-dark) !important;
    border-color: var(--eyib-primary-dark) !important;
    color: #ffffff !important;
}

/* =========================
   11. SIDEBAR
========================= */
.pkp_block {
    padding: 22px !important;
    margin: 0 0 22px 0 !important;
    overflow: hidden !important;
}

.pkp_block .title,
.pkp_block h2,
.pkp_block h3 {
    font-size: 18px !important;
}

.pkp_block p,
.pkp_block li {
    color: #374151 !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
}

.pkp_block ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.pkp_block li {
    border-bottom: 1px solid #eef2f7 !important;
    padding: 10px 0 !important;
}

.pkp_block li:last-child {
    border-bottom: 0 !important;
}

.pkp_block a {
    color: var(--eyib-text) !important;
    font-weight: 600 !important;
    text-decoration: none !important;
}

.pkp_block a:hover {
    color: var(--eyib-primary) !important;
}

.pkp_block img {
    max-width: 100% !important;
    height: auto !important;
    border-radius: 12px !important;
}

/* Sidebar linklari tugma ko‘rinishida */
.pkp_block.block_custom a,
.pkp_block.block_browse a,
.pkp_block.block_information a {
    display: block !important;
    padding: 10px 12px !important;
    background: #f7fafc !important;
    border: 1px solid #eef2f7 !important;
    border-radius: 12px !important;
    margin-bottom: 8px !important;
}

.pkp_block.block_custom a:hover,
.pkp_block.block_browse a:hover,
.pkp_block.block_information a:hover {
    background: var(--eyib-primary-soft) !important;
    border-color: #c7e4ed !important;
}

/* =========================
   12. RASMLAR / HOMEPAGE IMAGE
========================= */
.homepage_image img,
.pkp_page_index .homepage_image img,
.current_issue .cover img,
.obj_issue_toc .cover img {
    width: 100% !important;
    height: auto !important;
    border-radius: var(--eyib-radius) !important;
    box-shadow: var(--eyib-shadow) !important;
    display: block !important;
}

/* =========================
   13. BREADCRUMBS / FORMALAR / JADVALLAR
========================= */
.cmp_breadcrumbs {
    color: var(--eyib-muted) !important;
    font-size: 13px !important;
    margin-bottom: 18px !important;
}

.cmp_breadcrumbs a {
    color: var(--eyib-primary) !important;
    text-decoration: none !important;
}

input[type="text"],
input[type="email"],
input[type="password"],
textarea,
select {
    max-width: 100% !important;
    border: 1px solid var(--eyib-border) !important;
    border-radius: 12px !important;
    padding: 10px 12px !important;
    box-shadow: none !important;
    background: #ffffff !important;
    color: var(--eyib-text) !important;
}

input:focus,
textarea:focus,
select:focus {
    border-color: var(--eyib-primary) !important;
    outline: 3px solid rgba(11, 94, 122, .13) !important;
}

table {
    width: 100% !important;
    border-collapse: collapse !important;
    background: #ffffff !important;
}

th,
td {
    padding: 10px !important;
    border-bottom: 1px solid var(--eyib-border) !important;
    vertical-align: top !important;
}

th {
    color: var(--eyib-primary-dark) !important;
    background: #f9fafb !important;
    font-weight: 800 !important;
}

/* =========================
   14. FOOTER
========================= */
.pkp_structure_footer_wrapper,
.pkp_structure_footer {
    background: var(--eyib-primary-dark) !important;
    color: #d8e7ed !important;
    border-top: 0 !important;
    margin-top: 20px !important;
}

.pkp_footer_content,
.pkp_structure_footer {
    padding-top: 34px !important;
    padding-bottom: 34px !important;
}

.pkp_structure_footer p,
.pkp_structure_footer li,
.pkp_structure_footer div {
    color: rgba(255, 255, 255, .88) !important;
}

.pkp_structure_footer a {
    color: #ffffff !important;
    text-decoration: none !important;
}

.pkp_structure_footer a:hover {
    color: var(--eyib-accent) !important;
}

.pkp_brand_footer {
    display: none !important;
}

/* =========================
   15. RESPONSIVE — TABLET
========================= */
@media (max-width: 1024px) {
    .pkp_site_name_wrapper,
    .pkp_navigation_primary_wrapper,
    .pkp_navigation_user,
    .pkp_search_mobile,
    .pkp_structure_content,
    .pkp_structure_footer,
    .pkp_head_wrapper,
    .pkp_footer_content,
    .pkp_navigation_primary_row {
        width: calc(100% - 28px) !important;
        max-width: none !important;
    }

    .pkp_structure_content {
        grid-template-columns: 1fr !important;
        gap: 24px !important;
        padding-top: 24px !important;
    }

    .pkp_structure_sidebar {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 20px !important;
    }

    .pkp_block {
        margin-bottom: 0 !important;
    }
}

/* =========================
   16. RESPONSIVE — MOBILE
========================= */
@media (max-width: 760px) {
    :root {
        --eyib-banner-height: clamp(90px, 30vw, 170px);
    }

    .pkp_head_wrapper {
        padding-top: 12px !important;
    }

    .pkp_navigation_primary_row {
        border-radius: 12px !important;
        margin-top: 12px !important;
        padding: 8px !important;
    }

    .pkp_navigation_primary {
        display: block !important;
        min-height: 0 !important;
    }

    .pkp_navigation_primary > li > a,
    .pkp_navigation_primary > li > button {
        display: flex !important;
        width: 100% !important;
        justify-content: flex-start !important;
        padding: 12px 14px !important;
    }

    .pkp_structure_content {
        padding-top: 22px !important;
        padding-bottom: 34px !important;
    }

    .pkp_structure_main > .page,
    .pkp_page_index .homepage_about,
    .pkp_page_index .current_issue,
    .obj_issue_toc {
        padding: 20px !important;
    }

    .pkp_structure_sidebar {
        display: block !important;
    }

    .pkp_block {
        margin-bottom: 18px !important;
    }

    .obj_article_summary,
    .cmp_article_list > li,
    .sections .section .articles > li {
        padding: 17px !important;
    }
}

/* =========================
   17. RESPONSIVE — KICHIK TELEFON
========================= */
@media (max-width: 420px) {
    .pkp_site_name_wrapper,
    .pkp_navigation_primary_wrapper,
    .pkp_navigation_user,
    .pkp_search_mobile,
    .pkp_structure_content,
    .pkp_structure_footer,
    .pkp_head_wrapper,
    .pkp_footer_content,
    .pkp_navigation_primary_row {
        width: calc(100% - 18px) !important;
    }

    .current_issue_title,
    .obj_issue_toc .heading .title {
        font-size: 22px !important;
    }

    .obj_article_summary .title,
    .obj_article_summary .title a,
    .obj_article_summary h3,
    .obj_article_summary h3 a {
        font-size: 16px !important;
    }

    .pkp_structure_main > .page,
    .pkp_page_index .homepage_about,
    .pkp_page_index .current_issue,
    .obj_issue_toc {
        padding: 16px !important;
    }
}

/* =========================
   18. AGAR :has() ISHLAMASA HAM SAYT BUZILMASIN
========================= */
@supports not selector(:has(*)) {
    .pkp_structure_main {
        background: transparent !important;
    }
}