/*
==============================================================================
 AJIAS PROFESSIONAL ACADEMIC THEME
 AL-USLUB: Journal of Islamic and Arabic Studies
 OJS 3.3.x

 Designed around the actual AJIAS masthead:
 - Ivory background
 - Deep forest green
 - Muted academic gold
 - Restrained navy accents
 - Clean scholarly typography

 IMPORTANT:
 This version keeps the masthead image visually dominant and avoids
 excessive gradients, oversized padding, glossy effects, or forced cropping.
==============================================================================
*/


/* ==========================================================================
   01. DESIGN TOKENS
   ========================================================================== */

:root {
    --ajias-green-950: #132b1d;
    --ajias-green-900: #193423;
    --ajias-green-800: #31462f;
    --ajias-green-700: #526c52;

    --ajias-gold-700: #8f713d;
    --ajias-gold-600: #a58e5b;
    --ajias-gold-500: #cda864;
    --ajias-gold-300: #dbcbb0;
    --ajias-gold-100: #f8f3e8;

    --ajias-navy: #283552;

    --ajias-ivory: #f7f5f0;
    --ajias-ivory-2: #fbfaf7;
    --ajias-white: #ffffff;

    --ajias-ink-950: #202921;
    --ajias-ink-800: #344038;
    --ajias-ink-650: #5b665f;
    --ajias-ink-500: #7a847e;

    --ajias-line: #dfe5df;
    --ajias-line-soft: #ebefeb;
    --ajias-surface: #f4f6f4;

    --ajias-serif: Georgia, "Times New Roman", Times, serif;
    --ajias-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
                  "Helvetica Neue", Arial, sans-serif;

    --ajias-container: 1180px;

    --ajias-shadow-xs: 0 2px 8px rgba(19, 43, 29, 0.05);
    --ajias-shadow-sm: 0 8px 22px rgba(19, 43, 29, 0.08);
    --ajias-shadow-md: 0 14px 34px rgba(19, 43, 29, 0.13);
}


/* ==========================================================================
   02. PAGE FOUNDATION
   ========================================================================== */

html {
    background: #edf1ed;
}

body.pkp_page_index.pkp_op_index {
    background: #edf1ed;
    color: var(--ajias-ink-800);
    font-family: var(--ajias-sans);
}

.pkp_structure_page {
    background: var(--ajias-white);
}


/* ==========================================================================
   03. PROFESSIONAL MASTHEAD
   ========================================================================== */

.pkp_structure_head {
    position: relative;
    z-index: 100;

    margin: 0;
    padding: 0;

    background: var(--ajias-ivory);

    border: 0;
    border-top: 3px solid var(--ajias-green-950);

    box-shadow: 0 4px 18px rgba(19, 43, 29, 0.08);
}

.pkp_structure_head .pkp_head_wrapper {
    width: 100%;
    max-width: none;

    margin: 0;
    padding: 0;

    background: transparent;
}


/* ==========================================================================
   04. HEADER IMAGE
   ========================================================================== */

.pkp_structure_head .pkp_site_name_wrapper {
    position: relative;

    width: 100%;

    margin: 0;
    padding: 10px 20px 9px;

    box-sizing: border-box;

    background: var(--ajias-ivory);
}

.pkp_structure_head .pkp_site_name {
    width: 100%;
    max-width: var(--ajias-container);

    margin: 0 auto;
    padding: 0;

    text-align: center;
}

.pkp_structure_head .pkp_site_name a,
.pkp_structure_head .pkp_site_name a.is_img {
    display: block;

    width: 100%;
    max-width: 100%;

    margin: 0 auto;
    padding: 0;

    line-height: 0;

    text-decoration: none;
}

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

    width: 100% !important;
    max-width: var(--ajias-container) !important;

    height: auto !important;
    max-height: none !important;

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

    object-fit: contain !important;

    background: transparent !important;

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

    box-shadow: none !important;
}


/*
   A quiet transition from the masthead to the navigation.
   The banner already contains gold decoration, so this remains subtle.
*/

.pkp_structure_head .pkp_site_name_wrapper::after {
    content: "";

    display: block;

    width: min(94%, 1080px);
    height: 1px;

    margin: 9px auto -9px;

    background: linear-gradient(
        90deg,
        transparent,
        rgba(205, 168, 100, 0.65) 18%,
        rgba(205, 168, 100, 0.82) 50%,
        rgba(205, 168, 100, 0.65) 82%,
        transparent
    );
}


/* ==========================================================================
   05. NAVIGATION BAR
   ========================================================================== */

.pkp_structure_head .pkp_site_nav_menu {
    position: relative;

    width: 100%;

    margin: 0;
    padding: 0;

    background: var(--ajias-green-950);

    border: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.04);
    border-bottom: 3px solid var(--ajias-gold-500);

    box-shadow: 0 5px 16px rgba(19, 43, 29, 0.11);

    font-family: var(--ajias-sans);
}

.pkp_structure_head .pkp_navigation_primary_row {
    margin: 0;
    padding: 0;

    background: transparent;
}

.pkp_structure_head .pkp_navigation_primary_wrapper {
    width: 100%;
    max-width: var(--ajias-container);

    min-height: 54px;

    margin: 0 auto;
    padding: 0 190px 0 20px;

    display: flex;
    align-items: center;

    box-sizing: border-box;
}


/* ==========================================================================
   06. PRIMARY MENU
   ========================================================================== */

.pkp_structure_head .pkp_navigation_primary {
    display: flex;
    align-items: stretch;
    flex-wrap: wrap;

    margin: 0;
    padding: 0;
}

.pkp_structure_head .pkp_navigation_primary > li {
    position: relative;

    margin: 0;
    padding: 0;
}

.pkp_structure_head .pkp_navigation_primary > li > a {
    position: relative;

    display: flex;
    align-items: center;

    min-height: 54px;

    padding: 0 17px;

    color: #ffffff;

    font-family: var(--ajias-sans);
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.14px;

    text-decoration: none;

    border: 0;

    transition:
        color 0.18s ease,
        background-color 0.18s ease;
}

.pkp_structure_head .pkp_navigation_primary > li > a::after {
    content: "";

    position: absolute;
    left: 17px;
    right: 17px;
    bottom: 0;

    height: 2px;

    background: var(--ajias-gold-500);

    transform: scaleX(0);
    transform-origin: center;

    transition: transform 0.18s ease;
}

.pkp_structure_head .pkp_navigation_primary > li > a:hover,
.pkp_structure_head .pkp_navigation_primary > li > a:focus {
    color: var(--ajias-gold-300);

    background: rgba(255, 255, 255, 0.035);
}

.pkp_structure_head .pkp_navigation_primary > li > a:hover::after,
.pkp_structure_head .pkp_navigation_primary > li > a:focus::after {
    transform: scaleX(1);
}


/* ==========================================================================
   07. DROPDOWN
   ========================================================================== */

.pkp_structure_head .pkp_navigation_primary ul {
    min-width: 230px;

    margin: 0;
    padding: 6px 0;

    overflow: hidden;

    background: var(--ajias-white);

    border: 1px solid var(--ajias-line);
    border-top: 3px solid var(--ajias-gold-500);

    border-radius: 0 0 7px 7px;

    box-shadow: var(--ajias-shadow-md);
}

.pkp_structure_head .pkp_navigation_primary ul li {
    margin: 0;
    padding: 0;
}

.pkp_structure_head .pkp_navigation_primary ul li a {
    display: block;

    padding: 10px 16px;

    color: var(--ajias-green-950);
    background: var(--ajias-white);

    font-family: var(--ajias-sans);
    font-size: 12.5px;
    font-weight: 500;
    line-height: 1.45;

    border: 0;
    border-bottom: 1px solid var(--ajias-line-soft);

    transition:
        padding-left 0.16s ease,
        color 0.16s ease,
        background-color 0.16s ease;
}

.pkp_structure_head .pkp_navigation_primary ul li:last-child a {
    border-bottom: 0;
}

.pkp_structure_head .pkp_navigation_primary ul li a:hover,
.pkp_structure_head .pkp_navigation_primary ul li a:focus {
    padding-left: 20px;

    color: var(--ajias-green-950);
    background: var(--ajias-gold-100);
}


/* ==========================================================================
   08. SEARCH
   ========================================================================== */

.pkp_structure_head .pkp_navigation_search_wrapper {
    margin-left: auto;

    display: flex;
    align-items: center;
}

.pkp_structure_head .pkp_search {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 32px;

    padding: 0 12px;

    color: #ffffff;
    background: transparent;

    border: 1px solid rgba(219, 203, 176, 0.42);
    border-radius: 999px;

    font-family: var(--ajias-sans);
    font-size: 11.7px;
    font-weight: 600;

    text-decoration: none;
}

.pkp_structure_head .pkp_search .fa {
    margin-right: 7px;

    color: var(--ajias-gold-500);

    font-size: 11.5px;
}

.pkp_structure_head .pkp_search:hover,
.pkp_structure_head .pkp_search:focus {
    color: #ffffff;

    background: rgba(205, 168, 100, 0.12);

    border-color: rgba(219, 203, 176, 0.72);
}


/* ==========================================================================
   09. REGISTER + LOGIN — DESKTOP
   ========================================================================== */

.pkp_structure_head .pkp_navigation_user_wrapper {
    position: absolute;

    top: 0;
    right: max(20px, calc((100% - var(--ajias-container)) / 2 + 20px));

    height: 54px;

    margin: 0;
    padding: 0;

    display: flex;
    align-items: center;

    background: transparent;

    border: 0;

    z-index: 5;
}

.pkp_structure_head .pkp_navigation_user {
    width: auto;
    max-width: none;

    height: 54px;

    margin: 0;
    padding: 0;

    display: flex;
    align-items: center;
    gap: 7px;
}

.pkp_structure_head .pkp_navigation_user > li {
    margin: 0;
    padding: 0;
}

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

    min-height: 31px;

    padding: 0 11px;

    color: #ffffff;
    background: transparent;

    border: 1px solid rgba(219, 203, 176, 0.50);
    border-radius: 4px;

    font-family: var(--ajias-sans);
    font-size: 11px;
    font-weight: 700;

    text-decoration: none;
}


/* Register */
.pkp_structure_head .pkp_navigation_user > li:first-child > a:hover,
.pkp_structure_head .pkp_navigation_user > li:first-child > a:focus {
    color: var(--ajias-green-950);
    background: var(--ajias-gold-300);

    border-color: var(--ajias-gold-300);
}


/* Login */
.pkp_structure_head .pkp_navigation_user > li:nth-child(2) > a {
    color: var(--ajias-green-950);
    background: var(--ajias-gold-500);

    border-color: var(--ajias-gold-500);
}

.pkp_structure_head .pkp_navigation_user > li:nth-child(2) > a:hover,
.pkp_structure_head .pkp_navigation_user > li:nth-child(2) > a:focus {
    background: var(--ajias-gold-300);

    border-color: var(--ajias-gold-300);
}


/* ==========================================================================
   10. MOBILE MENU TOGGLE
   ========================================================================== */

.pkp_structure_head .pkp_site_nav_toggle {
    position: absolute;

    top: 12px;
    right: 14px;

    z-index: 8;

    min-height: 37px;

    padding: 0 12px;

    color: #ffffff;
    background: rgba(19, 43, 29, 0.96);

    border: 1px solid var(--ajias-gold-500);
    border-radius: 5px;

    box-shadow: 0 4px 12px rgba(19, 43, 29, 0.12);
}

.pkp_structure_head .pkp_site_nav_toggle span {
    color: #ffffff;

    font-family: var(--ajias-sans);
    font-size: 11px;
    font-weight: 700;
}


/* ==========================================================================
   11. MAIN CONTENT FRAME
   ========================================================================== */

.pkp_structure_content {
    width: 100%;
    max-width: var(--ajias-container);

    margin-left: auto;
    margin-right: auto;

    padding-top: 34px;
    padding-bottom: 48px;
}

.pkp_structure_content.has_sidebar {
    gap: 32px;
}

.pkp_structure_main {
    min-width: 0;
}


/* ==========================================================================
   12. JOURNAL COVER + PROFILE
   ========================================================================== */

.page_index_journal .additional_content > div:first-child {
    gap: 28px !important;
    align-items: flex-start !important;

    color: var(--ajias-ink-800) !important;

    font-family: var(--ajias-sans) !important;
}

.page_index_journal .additional_content > div:first-child > div:first-child {
    flex: 0 0 245px !important;

    max-width: 245px !important;
}

.page_index_journal .additional_content > div:first-child > div:first-child img {
    display: block !important;

    width: 100% !important;
    max-width: 245px !important;

    height: auto !important;

    margin: 0 !important;

    object-fit: cover !important;

    border: 1px solid #d5ddd6 !important;
    border-radius: 6px !important;

    box-shadow: 0 12px 27px rgba(19, 43, 29, 0.12) !important;
}

.page_index_journal .additional_content > div:first-child > div:nth-child(2) {
    flex: 1 1 420px !important;

    min-width: 0 !important;
}

.page_index_journal .additional_content > div:first-child > div:nth-child(2) > h2 {
    position: relative;

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

    color: var(--ajias-green-950) !important;

    border: 0 !important;

    font-family: var(--ajias-serif) !important;
    font-size: 27px !important;
    font-weight: 700 !important;
    line-height: 1.26 !important;
    letter-spacing: -0.18px !important;
}

.page_index_journal .additional_content > div:first-child > div:nth-child(2) > h2::after {
    content: "";

    position: absolute;
    left: 0;
    bottom: 0;

    width: 58px;
    height: 3px;

    background: var(--ajias-gold-500);
}


/* ==========================================================================
   13. JOURNAL INFORMATION TABLE
   ========================================================================== */

.page_index_journal .additional_content > div:first-child table {
    width: 100% !important;

    overflow: hidden;

    background: var(--ajias-white) !important;

    border: 1px solid var(--ajias-line) !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    border-radius: 7px !important;

    box-shadow: var(--ajias-shadow-xs) !important;

    font-family: var(--ajias-sans) !important;
    font-size: 12.5px !important;
}

.page_index_journal .additional_content > div:first-child table tr {
    color: var(--ajias-ink-800) !important;
    background: var(--ajias-white) !important;
}

.page_index_journal .additional_content > div:first-child table tr:nth-child(odd) {
    background: #f7f9f7 !important;
}

.page_index_journal .additional_content > div:first-child table tr:first-child {
    color: #ffffff !important;
    background: var(--ajias-green-950) !important;
}

.page_index_journal .additional_content > div:first-child table td {
    padding: 9px 11px !important;

    color: inherit !important;

    border: 0 !important;
    border-bottom: 1px solid #e7ece8 !important;

    line-height: 1.52 !important;

    vertical-align: top !important;
}

.page_index_journal .additional_content > div:first-child table tr:last-child td {
    border-bottom: 0 !important;
}

.page_index_journal .additional_content > div:first-child table td:first-child {
    width: 31% !important;

    color: var(--ajias-green-950) !important;

    font-weight: 700 !important;
}

.page_index_journal .additional_content > div:first-child table tr:first-child td:first-child {
    color: #ffffff !important;
}

.page_index_journal .additional_content > div:first-child table a {
    color: var(--ajias-green-700) !important;

    font-weight: 700;

    text-decoration: none !important;
}

.page_index_journal .additional_content > div:first-child table a:hover {
    color: var(--ajias-gold-700) !important;

    text-decoration: underline !important;
}


/* ==========================================================================
   14. ABOUT THE JOURNAL
   ========================================================================== */

.page_index_journal .additional_content > div:nth-child(2) {
    position: relative;

    margin-top: 30px !important;
    padding: 29px 31px !important;

    overflow: hidden;

    color: var(--ajias-ink-800) !important;
    background: var(--ajias-white) !important;

    border: 1px solid var(--ajias-line) !important;
    border-top: 4px solid var(--ajias-green-950) !important;
    border-radius: 7px !important;

    box-shadow: var(--ajias-shadow-sm) !important;

    font-family: var(--ajias-sans) !important;
}

.page_index_journal .additional_content > div:nth-child(2)::before {
    content: "";

    position: absolute;
    top: -4px;
    left: 0;

    width: 82px;
    height: 4px;

    background: var(--ajias-gold-500);
}

.page_index_journal .additional_content > div:nth-child(2) > h2 {
    margin: 0 0 17px !important;
    padding: 0 0 11px !important;

    color: var(--ajias-green-950) !important;

    border: 0 !important;
    border-bottom: 1px solid var(--ajias-line) !important;

    font-family: var(--ajias-serif) !important;
    font-size: 23px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
}

.page_index_journal .additional_content > div:nth-child(2) p {
    margin-top: 0 !important;
    margin-bottom: 14px !important;

    color: #39463f !important;

    font-family: var(--ajias-sans) !important;
    font-size: 13.6px !important;
    line-height: 1.82 !important;

    text-align: justify !important;
}

.page_index_journal .additional_content > div:nth-child(2) p:last-child {
    margin-bottom: 0 !important;
}


/* ==========================================================================
   15. SIDEBAR FOUNDATION
   ========================================================================== */

.pkp_structure_sidebar {
    font-family: var(--ajias-sans);
}

.pkp_structure_sidebar .pkp_block {
    margin-bottom: 21px;
}


/* Submission */
.pkp_structure_sidebar .block_make_submission .content {
    padding: 0;
}

.pkp_structure_sidebar .block_make_submission_link {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 100%;
    min-height: 46px;

    padding: 0 18px;

    box-sizing: border-box;

    color: #ffffff;
    background: var(--ajias-green-950);

    border: 1px solid var(--ajias-green-950);
    border-bottom: 3px solid var(--ajias-gold-500);
    border-radius: 6px;

    box-shadow: var(--ajias-shadow-xs);

    font-family: var(--ajias-sans);
    font-size: 12.7px;
    font-weight: 700;

    text-align: center;
    text-decoration: none;
}

.pkp_structure_sidebar .block_make_submission_link:hover,
.pkp_structure_sidebar .block_make_submission_link:focus {
    color: var(--ajias-green-950);
    background: var(--ajias-gold-500);

    border-color: var(--ajias-gold-500);
}


/* ==========================================================================
   16. ADDITIONAL MENU
   ========================================================================== */

#customblock-menu .content > div {
    overflow: hidden !important;

    background: var(--ajias-white) !important;

    border: 1px solid var(--ajias-line) !important;
    border-radius: 7px !important;

    box-shadow: var(--ajias-shadow-sm) !important;
}


/* Heading */
#customblock-menu .content > div > div:first-child {
    padding: 12px 14px !important;

    background: var(--ajias-green-950) !important;

    border: 0 !important;
    border-bottom: 3px solid var(--ajias-gold-500) !important;

    text-align: left !important;
}

#customblock-menu .content > div > div:first-child strong,
#customblock-menu .content > div > div:first-child span {
    color: #ffffff !important;

    font-family: var(--ajias-sans) !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: 0.45px !important;

    text-transform: uppercase;
}

#customblock-menu .content > div > div:first-child .fa {
    color: var(--ajias-gold-500) !important;
}


/* Rows */
#customblock-menu .content > div > div:not(:first-child) {
    padding: 0 !important;

    background: var(--ajias-white) !important;

    border: 0 !important;
    border-bottom: 1px solid var(--ajias-line-soft) !important;
}

#customblock-menu .content > div > div:last-child {
    border-bottom: 0 !important;
}

#customblock-menu .content > div > div:not(:first-child) > a {
    display: flex !important;
    align-items: center;

    min-height: 40px;

    padding: 0 13px !important;

    color: var(--ajias-ink-800) !important;
    background: transparent !important;

    text-decoration: none !important;
}

#customblock-menu .content > div > div:not(:first-child) > a::after {
    content: "›";

    margin-left: auto;

    color: #9ca79f;

    font-size: 16px;
}

#customblock-menu .content > div > div:not(:first-child) > a:hover,
#customblock-menu .content > div > div:not(:first-child) > a:focus {
    color: var(--ajias-green-950) !important;
    background: var(--ajias-gold-100) !important;
}

#customblock-menu .content > div > div:not(:first-child) span {
    color: inherit !important;

    font-family: var(--ajias-sans) !important;
    font-size: 12.2px !important;
    font-weight: 600 !important;
}

#customblock-menu .content > div > div:not(:first-child) .fa {
    width: 18px;

    margin-right: 6px;

    color: var(--ajias-gold-600) !important;

    text-align: center;
}


/* ==========================================================================
   17. COMMON SIDEBAR CARDS
   ========================================================================== */

#customblock-citation-analysis .content > div,
#customblock-indexing .content > div,
#customblock-tools .content > div,
#customblock-visitor .content > div {
    width: 100% !important;

    color: var(--ajias-ink-800) !important;

    font-family: var(--ajias-sans) !important;
}


/* Headers */
#customblock-citation-analysis .content > div > div:first-child,
#customblock-indexing .content > div > div:first-child,
#customblock-tools .content > div > div:first-child,
#customblock-visitor .content > div > div:first-child {
    padding: 12px 14px !important;

    color: #ffffff !important;
    background: var(--ajias-green-950) !important;

    border: 0 !important;
    border-bottom: 3px solid var(--ajias-gold-500) !important;
    border-radius: 7px 7px 0 0 !important;

    font-family: var(--ajias-sans) !important;
    font-size: 11.9px !important;
    font-weight: 700 !important;
    letter-spacing: 0.42px !important;

    text-align: left !important;
}

#customblock-citation-analysis .content > div > div:first-child .fa,
#customblock-indexing .content > div > div:first-child .fa,
#customblock-tools .content > div > div:first-child .fa,
#customblock-visitor .content > div > div:first-child .fa {
    color: var(--ajias-gold-500) !important;
}


/* Body */
#customblock-citation-analysis .content > div > div:nth-child(2),
#customblock-indexing .content > div > div:nth-child(2),
#customblock-tools .content > div > div:nth-child(2),
#customblock-visitor .content > div > div:nth-child(2) {
    padding: 17px !important;

    background: var(--ajias-white) !important;

    border: 1px solid var(--ajias-line) !important;
    border-top: 0 !important;
    border-radius: 0 0 7px 7px !important;

    box-shadow: var(--ajias-shadow-sm) !important;
}

#customblock-indexing p,
#customblock-tools p,
#customblock-visitor p {
    color: var(--ajias-ink-650) !important;

    font-family: var(--ajias-sans) !important;
    font-size: 11.8px !important;
    line-height: 1.55 !important;
}

#customblock-citation-analysis img,
#customblock-indexing img,
#customblock-tools img,
#customblock-visitor img {
    max-width: 100% !important;

    height: auto !important;
}


/* ==========================================================================
   18. TEMPLATE CARD
   ========================================================================== */

#customblock-template .content > div {
    overflow: hidden !important;

    background: var(--ajias-white) !important;

    border: 1px solid var(--ajias-line) !important;
    border-radius: 7px !important;

    box-shadow: var(--ajias-shadow-sm) !important;

    font-family: var(--ajias-sans) !important;
}

#customblock-template .content > div > div:first-child {
    padding: 12px 14px !important;

    color: #ffffff !important;
    background: var(--ajias-green-950) !important;

    border: 0 !important;
    border-bottom: 3px solid var(--ajias-gold-500) !important;

    text-align: left !important;
}

#customblock-template .content > div > div:first-child strong {
    color: #ffffff !important;

    font-family: var(--ajias-sans) !important;
    font-size: 11.9px !important;
    font-weight: 700 !important;
    letter-spacing: 0.42px !important;
}

#customblock-template .content > div > div:first-child .fa {
    color: var(--ajias-gold-500) !important;
}

#customblock-template .content > div > div:nth-child(2) {
    padding: 14px !important;

    background: var(--ajias-white) !important;
}

#customblock-template .content > div > div:nth-child(2) > a {
    display: block !important;

    margin-bottom: 10px !important;
    padding: 10px !important;

    background: #fafbf9 !important;

    border: 1px solid var(--ajias-line) !important;
    border-radius: 6px !important;

    box-shadow: none !important;
}

#customblock-template .content > div > div:nth-child(2) > a:hover {
    background: var(--ajias-gold-100) !important;

    border-color: var(--ajias-gold-300) !important;
}

#customblock-template img {
    max-width: 165px !important;

    height: auto !important;
}


/* ==========================================================================
   19. EDITORIAL TEAM
   ========================================================================== */

#customblock-meet-our-editorial-team .content > div {
    overflow: hidden !important;

    background: var(--ajias-white) !important;

    border: 1px solid var(--ajias-line) !important;
    border-radius: 7px !important;

    box-shadow: var(--ajias-shadow-sm) !important;

    font-family: var(--ajias-sans) !important;
}

#customblock-meet-our-editorial-team .content > div > div:first-child {
    padding: 12px 14px !important;

    background: var(--ajias-green-950) !important;

    border: 0 !important;
    border-bottom: 3px solid var(--ajias-gold-500) !important;

    text-align: left !important;
}

#customblock-meet-our-editorial-team .content > div > div:first-child strong {
    color: #ffffff !important;

    font-family: var(--ajias-sans) !important;
    font-size: 11.9px !important;
    font-weight: 700 !important;
    letter-spacing: 0.42px !important;
}

#customblock-meet-our-editorial-team .content > div > div:not(:first-child) {
    padding: 18px 14px !important;

    background: var(--ajias-white) !important;

    border: 0 !important;
    border-bottom: 1px solid var(--ajias-line) !important;
}

#customblock-meet-our-editorial-team .content > div > div:last-child {
    border-bottom: 0 !important;
}

#customblock-meet-our-editorial-team img {
    width: 102px !important;
    height: 128px !important;

    object-fit: cover !important;

    border: 2px solid var(--ajias-gold-500) !important;
    border-radius: 5px !important;

    box-shadow: 0 6px 15px rgba(19, 43, 29, 0.11) !important;
}

#customblock-meet-our-editorial-team h4 {
    margin: 11px 0 4px !important;

    color: var(--ajias-green-950) !important;

    font-family: var(--ajias-serif) !important;
    font-size: 14.2px !important;
    font-weight: 700 !important;
}

#customblock-meet-our-editorial-team p {
    margin: 0 !important;

    color: var(--ajias-ink-650) !important;

    font-family: var(--ajias-sans) !important;
    font-size: 11.5px !important;
    font-weight: 600 !important;
}

#customblock-meet-our-editorial-team a {
    display: inline-block !important;

    margin-top: 10px !important;
    padding: 6px 11px !important;

    color: var(--ajias-green-950) !important;
    background: var(--ajias-gold-100) !important;

    border: 1px solid var(--ajias-gold-300) !important;
    border-radius: 4px !important;

    box-shadow: none !important;

    font-family: var(--ajias-sans) !important;
    font-size: 10.5px !important;
    font-weight: 700 !important;

    text-decoration: none !important;
}

#customblock-meet-our-editorial-team a:hover,
#customblock-meet-our-editorial-team a:focus {
    color: #ffffff !important;
    background: var(--ajias-green-950) !important;

    border-color: var(--ajias-green-950) !important;
}


/* ==========================================================================
   20. FOOTER
   ========================================================================== */

.pkp_structure_footer_wrapper {
    margin-top: 0;
    padding: 0;

    background: var(--ajias-green-950);

    border: 0;
    border-top: 3px solid var(--ajias-gold-500);

    font-family: var(--ajias-sans);
}

.pkp_structure_footer {
    width: 100%;
    max-width: none;

    margin: 0;
    padding: 0;

    background: transparent;
}

.pkp_footer_content {
    margin: 0;
    padding: 30px 24px !important;

    background: var(--ajias-green-950);

    color: #d8e0da;

    text-align: center;
}

.pkp_footer_content p {
    margin: 0 !important;

    color: #ffffff !important;

    font-family: var(--ajias-serif) !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    line-height: 1.5 !important;
}

.pkp_footer_content p::after {
    content: " · Bahtera Al Fikr Press";

    color: var(--ajias-gold-300);

    font-family: var(--ajias-sans);
    font-size: 11px;
    font-weight: 600;
}

.pkp_brand_footer {
    margin: 0;
    padding: 11px 24px;

    background: #0c2115;

    border-top: 1px solid rgba(255, 255, 255, 0.07);

    text-align: center;
}

.pkp_brand_footer img {
    display: block;

    width: auto;
    max-width: 100%;
    max-height: 34px;

    margin: 0 auto;

    opacity: 0.74;

    transition: opacity 0.18s ease;
}

.pkp_brand_footer a:hover img,
.pkp_brand_footer a:focus img {
    opacity: 1;
}


/* ==========================================================================
   21. ACCESSIBILITY
   ========================================================================== */

.pkp_structure_head a:focus-visible,
.pkp_structure_head button:focus-visible,
.pkp_structure_sidebar a:focus-visible,
.pkp_structure_footer_wrapper a:focus-visible {
    outline: 2px solid var(--ajias-gold-500);
    outline-offset: 3px;
}


/* ==========================================================================
   22. TABLET
   ========================================================================== */

@media (max-width: 1020px) {

    .pkp_structure_head .pkp_navigation_primary_wrapper {
        padding-right: 170px;
    }

    .pkp_structure_head .pkp_navigation_primary > li > a {
        padding-left: 13px;
        padding-right: 13px;

        font-size: 12.5px;
    }

    .pkp_structure_head .pkp_navigation_primary > li > a::after {
        left: 13px;
        right: 13px;
    }
}


@media (max-width: 900px) {

    .pkp_structure_head .pkp_navigation_primary_wrapper {
        padding-left: 18px;
        padding-right: 18px;
    }

    /*
       Register/Login return to a compact second row on tablet,
       avoiding overlap with the menu.
    */
    .pkp_structure_head .pkp_navigation_user_wrapper {
        position: static;

        width: 100%;
        height: auto;

        padding: 0 18px;

        box-sizing: border-box;

        display: flex;
        justify-content: flex-end;

        background: #0f2518;

        border-top: 1px solid rgba(255, 255, 255, 0.06);
    }

    .pkp_structure_head .pkp_navigation_user {
        height: 40px;
    }

    .pkp_structure_content {
        padding-left: 20px;
        padding-right: 20px;
    }

    .page_index_journal .additional_content > div:first-child {
        gap: 22px !important;
    }

    .page_index_journal .additional_content > div:first-child > div:first-child {
        flex-basis: 220px !important;
        max-width: 220px !important;
    }

    .page_index_journal .additional_content > div:first-child > div:first-child img {
        max-width: 220px !important;
    }
}


/* ==========================================================================
   23. MOBILE
   ========================================================================== */

@media (max-width: 700px) {

    .pkp_structure_head {
        border-top-width: 2px;
    }

    .pkp_structure_head .pkp_site_name_wrapper {
        padding: 7px 8px 7px;
    }

    .pkp_structure_head .pkp_site_name_wrapper::after {
        display: none;
    }

    .pkp_structure_head .pkp_navigation_primary_wrapper {
        display: block;

        min-height: 0;

        padding: 0;
    }

    .pkp_structure_head .pkp_navigation_primary {
        display: block;

        width: 100%;
    }

    .pkp_structure_head .pkp_navigation_primary > li > a {
        min-height: 44px;

        padding: 0 17px;

        font-size: 12.5px;

        border-bottom: 1px solid rgba(255, 255, 255, 0.075);
    }

    .pkp_structure_head .pkp_navigation_primary > li > a::after {
        display: none;
    }

    .pkp_structure_head .pkp_navigation_search_wrapper {
        margin: 10px 17px 13px;
    }

    .pkp_structure_head .pkp_search {
        width: 100%;

        box-sizing: border-box;
    }

    .pkp_structure_head .pkp_navigation_user_wrapper {
        padding-left: 14px;
        padding-right: 14px;
    }

    .pkp_structure_head .pkp_navigation_user {
        width: 100%;

        justify-content: flex-end;
    }

    .pkp_structure_content {
        padding: 22px 14px 34px;
    }

    .page_index_journal .additional_content > div:first-child {
        display: block !important;
    }

    .page_index_journal .additional_content > div:first-child > div:first-child {
        width: 100% !important;
        max-width: 100% !important;

        margin-bottom: 24px !important;
    }

    .page_index_journal .additional_content > div:first-child > div:first-child img {
        width: auto !important;
        max-width: 235px !important;

        margin: 0 auto !important;
    }

    .page_index_journal .additional_content > div:first-child > div:nth-child(2) > h2 {
        font-size: 22.5px !important;

        text-align: center;
    }

    .page_index_journal .additional_content > div:first-child > div:nth-child(2) > h2::after {
        left: 50%;

        transform: translateX(-50%);
    }

    .page_index_journal .additional_content > div:first-child table {
        font-size: 11.8px !important;
    }

    .page_index_journal .additional_content > div:first-child table td {
        padding: 8px 9px !important;
    }

    .page_index_journal .additional_content > div:nth-child(2) {
        padding: 23px 19px !important;
    }

    .page_index_journal .additional_content > div:nth-child(2) > h2 {
        font-size: 20.5px !important;
    }

    .page_index_journal .additional_content > div:nth-child(2) p {
        font-size: 12.9px !important;
        line-height: 1.76 !important;

        text-align: left !important;
    }

    .pkp_footer_content {
        padding: 27px 18px !important;
    }

    .pkp_footer_content p {
        font-size: 15px !important;
    }

    .pkp_footer_content p::after {
        display: block;

        margin-top: 4px;
    }
}


/* ==========================================================================
   24. SMALL MOBILE
   ========================================================================== */

@media (max-width: 430px) {

    .pkp_structure_head .pkp_navigation_user > li > a {
        padding-left: 9px;
        padding-right: 9px;

        font-size: 10.5px;
    }

    .page_index_journal .additional_content > div:first-child table td:first-child {
        width: 38% !important;
    }

    .page_index_journal .additional_content > div:first-child table td {
        font-size: 11.2px !important;
    }

    .page_index_journal .additional_content > div:nth-child(2) {
        padding: 20px 16px !important;
    }
}


/* ==========================================================================
   25. REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    .pkp_structure_head *,
    .pkp_structure_sidebar *,
    .pkp_structure_footer_wrapper * {
        transition: none !important;
        animation: none !important;
    }
}


/* ==========================================================================
   26. PRINT
   ========================================================================== */

@media print {

    .pkp_structure_head .pkp_site_nav_menu,
    .pkp_structure_sidebar,
    .pkp_structure_footer_wrapper {
        display: none !important;
    }

    .pkp_structure_head {
        box-shadow: none;
    }

    .pkp_structure_content,
    .pkp_structure_main {
        width: 100% !important;
        max-width: none !important;

        padding: 0 !important;
    }
}


/* ==========================================================================
   AJIAS STABLE NAVIGATION OVERRIDE — V2
   Purpose:
   - Fix messy area below masthead
   - Remove absolute positioning from Register/Login
   - Keep menu + Search on one clean row
   - Put Register/Login in a separate slim utility bar
   - Ensure content starts cleanly below navigation
   ========================================================================== */


/* --------------------------------------------------------------------------
   A. Reset all risky positioning from earlier versions
   -------------------------------------------------------------------------- */

.pkp_structure_head .pkp_site_nav_menu {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    overflow: visible !important;

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

    background: #132b1d !important;

    border-top: 0 !important;
    border-bottom: 3px solid #cda864 !important;

    box-shadow: none !important;
}


/* --------------------------------------------------------------------------
   B. Main navigation row
   -------------------------------------------------------------------------- */

.pkp_structure_head .pkp_navigation_primary_row {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;

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

    background: #132b1d !important;

    border: 0 !important;
}

.pkp_structure_head .pkp_navigation_primary_wrapper {
    position: relative !important;

    width: 100% !important;
    max-width: 1180px !important;
    min-height: 54px !important;

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

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

    box-sizing: border-box !important;

    float: none !important;
    clear: both !important;
}


/* --------------------------------------------------------------------------
   C. Primary menu — clean horizontal row
   -------------------------------------------------------------------------- */

.pkp_structure_head .pkp_navigation_primary {
    position: relative !important;

    display: flex !important;
    align-items: stretch !important;
    flex-wrap: wrap !important;

    width: auto !important;

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

    float: none !important;
}

.pkp_structure_head .pkp_navigation_primary > li {
    position: relative !important;

    display: block !important;

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

    float: none !important;
}

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

    min-height: 54px !important;

    padding: 0 17px !important;

    color: #ffffff !important;
    background: transparent !important;

    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
                 "Helvetica Neue", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1 !important;

    border: 0 !important;

    text-decoration: none !important;
}

.pkp_structure_head .pkp_navigation_primary > li > a:hover,
.pkp_structure_head .pkp_navigation_primary > li > a:focus {
    color: #dbcbb0 !important;
    background: rgba(255, 255, 255, 0.04) !important;
}


/* --------------------------------------------------------------------------
   D. About dropdown — prevent clipping and strange positioning
   -------------------------------------------------------------------------- */

.pkp_structure_head .pkp_navigation_primary ul {
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;

    z-index: 9999 !important;

    min-width: 230px !important;

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

    background: #ffffff !important;

    border: 1px solid #dfe5df !important;
    border-top: 3px solid #cda864 !important;
    border-radius: 0 0 7px 7px !important;

    box-shadow: 0 14px 34px rgba(19, 43, 29, 0.13) !important;

    overflow: visible !important;
}

.pkp_structure_head .pkp_navigation_primary ul li {
    display: block !important;

    width: 100% !important;

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

    float: none !important;
}

.pkp_structure_head .pkp_navigation_primary ul li a {
    display: block !important;

    width: 100% !important;

    padding: 10px 16px !important;

    box-sizing: border-box !important;

    color: #132b1d !important;
    background: #ffffff !important;

    font-size: 12.5px !important;
    line-height: 1.45 !important;

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

.pkp_structure_head .pkp_navigation_primary ul li a:hover,
.pkp_structure_head .pkp_navigation_primary ul li a:focus {
    color: #132b1d !important;
    background: #f8f3e8 !important;
}


/* --------------------------------------------------------------------------
   E. Search — stays on the far right of the primary row
   -------------------------------------------------------------------------- */

.pkp_structure_head .pkp_navigation_search_wrapper {
    position: static !important;

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

    width: auto !important;

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

    float: none !important;
}

.pkp_structure_head .pkp_search {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-height: 32px !important;

    padding: 0 12px !important;

    color: #ffffff !important;
    background: transparent !important;

    border: 1px solid rgba(219, 203, 176, 0.48) !important;
    border-radius: 999px !important;

    font-size: 11.8px !important;
    font-weight: 600 !important;

    text-decoration: none !important;
}

.pkp_structure_head .pkp_search:hover,
.pkp_structure_head .pkp_search:focus {
    color: #ffffff !important;
    background: rgba(205, 168, 100, 0.12) !important;
}

.pkp_structure_head .pkp_search .fa {
    margin-right: 7px !important;
    color: #cda864 !important;
}


/* --------------------------------------------------------------------------
   F. Register/Login — dedicated utility row
   -------------------------------------------------------------------------- */

.pkp_structure_head .pkp_navigation_user_wrapper {
    position: static !important;

    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;

    display: block !important;

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

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

    background: #f7f5f0 !important;

    border: 0 !important;
    border-top: 1px solid rgba(19, 43, 29, 0.08) !important;
    border-bottom: 1px solid #dfe5df !important;

    box-shadow: none !important;

    clear: both !important;
}

.pkp_structure_head .pkp_navigation_user {
    position: relative !important;

    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 4px !important;

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

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

    box-sizing: border-box !important;

    float: none !important;
}

.pkp_structure_head .pkp_navigation_user > li {
    display: block !important;

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

    float: none !important;
}

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

    min-height: 34px !important;

    padding: 0 10px !important;

    color: #31462f !important;
    background: transparent !important;

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

    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
                 "Helvetica Neue", Arial, sans-serif !important;
    font-size: 11.5px !important;
    font-weight: 600 !important;

    text-decoration: none !important;
}

.pkp_structure_head .pkp_navigation_user > li > a:hover,
.pkp_structure_head .pkp_navigation_user > li > a:focus {
    color: #132b1d !important;
    background: #f0eadc !important;
}


/* separator between Register and Login */
.pkp_structure_head .pkp_navigation_user > li + li::before {
    content: "" !important;

    display: inline-block !important;

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

    margin: 0 2px 0 0 !important;

    vertical-align: middle !important;

    background: #d9dfda !important;
}


/* --------------------------------------------------------------------------
   G. Clean transition from header into page content
   -------------------------------------------------------------------------- */

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

    clear: both !important;

    margin-top: 0 !important;
    padding-top: 34px !important;
}

.pkp_structure_main,
.pkp_structure_sidebar {
    position: relative !important;
    z-index: 1 !important;
}


/* --------------------------------------------------------------------------
   H. Prevent old theme rules from pulling menu/account bars upward
   -------------------------------------------------------------------------- */

.pkp_structure_head .pkp_site_nav_menu,
.pkp_structure_head .pkp_navigation_primary_row,
.pkp_structure_head .pkp_navigation_primary_wrapper,
.pkp_structure_head .pkp_navigation_user_wrapper,
.pkp_structure_head .pkp_navigation_user {
    transform: none !important;
}


/* --------------------------------------------------------------------------
   I. Tablet
   -------------------------------------------------------------------------- */

@media (max-width: 900px) {

    .pkp_structure_head .pkp_navigation_primary_wrapper {
        padding-left: 18px !important;
        padding-right: 18px !important;
    }

    .pkp_structure_head .pkp_navigation_primary > li > a {
        padding-left: 13px !important;
        padding-right: 13px !important;

        font-size: 12.4px !important;
    }

    .pkp_structure_head .pkp_navigation_search_wrapper {
        margin-left: auto !important;
    }

    .pkp_structure_head .pkp_navigation_user {
        padding-left: 18px !important;
        padding-right: 18px !important;
    }

}


/* --------------------------------------------------------------------------
   J. Mobile — preserve OJS menu behaviour
   -------------------------------------------------------------------------- */

@media (max-width: 700px) {

    .pkp_structure_head .pkp_navigation_primary_wrapper {
        display: block !important;

        min-height: 0 !important;

        padding: 0 !important;
    }

    .pkp_structure_head .pkp_navigation_primary {
        display: block !important;

        width: 100% !important;
    }

    .pkp_structure_head .pkp_navigation_primary > li {
        width: 100% !important;
    }

    .pkp_structure_head .pkp_navigation_primary > li > a {
        width: 100% !important;
        min-height: 44px !important;

        padding: 0 17px !important;

        box-sizing: border-box !important;

        border-bottom: 1px solid rgba(255, 255, 255, 0.075) !important;
    }

    .pkp_structure_head .pkp_navigation_primary ul {
        position: static !important;

        width: 100% !important;
        min-width: 0 !important;

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

        box-shadow: none !important;
    }

    .pkp_structure_head .pkp_navigation_search_wrapper {
        width: auto !important;

        margin: 10px 17px 13px !important;
    }

    .pkp_structure_head .pkp_search {
        width: 100% !important;

        box-sizing: border-box !important;
    }

    .pkp_structure_head .pkp_navigation_user {
        min-height: 35px !important;

        padding-left: 13px !important;
        padding-right: 13px !important;
    }

    .pkp_structure_content {
        padding-top: 24px !important;
    }

}


/* --------------------------------------------------------------------------
   K. Very small screens
   -------------------------------------------------------------------------- */

@media (max-width: 430px) {

    .pkp_structure_head .pkp_navigation_user {
        justify-content: center !important;
    }

    .pkp_structure_head .pkp_navigation_user > li > a {
        padding-left: 9px !important;
        padding-right: 9px !important;

        font-size: 10.8px !important;
    }

}