/* ==========================================================
   DBA AFRICA MANAGEMENT REVIEW
   OJS HOMEPAGE-ONLY CUSTOM CSS

   Scope:
   - Homepage only: .pkp_page_index
   - Article/item pages remain close to normal OJS styling
   ========================================================== */


/* ==========================================================
   1. BRAND VARIABLES
   ========================================================== */

:root {
    --dba-blue: #0055aa;
    --dba-green: #097b3e;
    --dba-dark: #111827;
    --dba-text: #555555;
    --dba-muted: #777777;
    --dba-border: #e1e5e8;
    --dba-light: #f5f6f7;
    --dba-white: #ffffff;
}


/* ==========================================================
   2. HOMEPAGE BASE
   ========================================================== */

.pkp_page_index {
    background: #ffffff !important;
}


/* ==========================================================
   3. HEADER
   Keep OJS layout intact
   ========================================================== */

.pkp_page_index .pkp_structure_head {
    border-bottom: 1px solid #e2e5e8 !important;
}


/* Journal title / text logo */

.pkp_page_index .pkp_site_name .is_text,
.pkp_page_index .pkp_site_name .is_text a,
.pkp_page_index .pkp_site_name a {
    color: var(--dba-blue) !important;
}


/* ==========================================================
   4. MAIN NAVIGATION
   White menu text only
   ========================================================== */

.pkp_page_index #navigationPrimary > li > a,
.pkp_page_index .pkp_navigation_primary > li > a {
    color: #ffffff !important;

    font-size: 12px !important;
    font-weight: 700 !important;

    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
}


/* Hover */

.pkp_page_index #navigationPrimary > li > a:hover,
.pkp_page_index #navigationPrimary > li > a:focus,
.pkp_page_index .pkp_navigation_primary > li > a:hover,
.pkp_page_index .pkp_navigation_primary > li > a:focus {
    color: #ffffff !important;
    opacity: 0.85;
}


/* Dropdown menu remains dark on white */

.pkp_page_index #navigationPrimary ul a,
.pkp_page_index .pkp_navigation_primary ul a {
    color: #222222 !important;
}

.pkp_page_index #navigationPrimary ul a:hover,
.pkp_page_index .pkp_navigation_primary ul a:hover {
    color: var(--dba-blue) !important;
}


/* ==========================================================
   5. LOGIN / REGISTER / USER MENU
   ========================================================== */

.pkp_page_index .pkp_navigation_user a,
.pkp_page_index .pkp_navigation_user > li > a {
    color: #ffffff !important;
}

.pkp_page_index .pkp_navigation_user a:hover,
.pkp_page_index .pkp_navigation_user a:focus {
    color: #ffffff !important;
    opacity: 0.85;
}


/* Search */

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


/* ==========================================================
   6. MAIN HOMEPAGE CONTENT
   Let OJS control sidebar/main widths
   ========================================================== */

.pkp_page_index .pkp_structure_content {
    max-width: 1280px !important;
    margin: 0 auto !important;

    padding-top: 32px !important;
    padding-bottom: 50px !important;
}


/* ==========================================================
   7. HOMEPAGE ABOUT SECTION
   ========================================================== */

.pkp_page_index .homepage_about {
    margin-bottom: 40px !important;
}

.pkp_page_index .homepage_about h2 {
    color: var(--dba-blue) !important;

    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 28px !important;

    margin-bottom: 16px !important;
}

.pkp_page_index .homepage_about p {
    color: var(--dba-text) !important;

    font-size: 15px !important;
    line-height: 1.8 !important;
}


/* ==========================================================
   8. CURRENT ISSUE
   ========================================================== */

.pkp_page_index .current_issue {
    margin-top: 28px !important;
}


/* "CURRENT ISSUE" label */

.pkp_page_index .current_issue > h2 {
    color: var(--dba-green) !important;

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

    font-size: 11px !important;
    font-weight: 700 !important;

    text-transform: uppercase !important;
    letter-spacing: 1.5px !important;

    margin-bottom: 8px !important;
}


/* ==========================================================
   9. CURRENT ISSUE TITLE
   Reduced from earlier 30px
   ========================================================== */

.pkp_page_index .current_issue_title {
    color: var(--dba-blue) !important;

    font-family: Georgia, "Times New Roman", serif !important;

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

    margin-top: 6px !important;
    margin-bottom: 14px !important;
}


/* Issue title links */

.pkp_page_index .current_issue_title a {
    color: var(--dba-blue) !important;
}

.pkp_page_index .current_issue_title a:hover {
    color: var(--dba-green) !important;
}


/* ==========================================================
   10. CURRENT ISSUE DESCRIPTION
   Shortened homepage preview only
   ========================================================== */

.pkp_page_index .current_issue .description,
.pkp_page_index .obj_issue_toc .description {
    position: relative !important;

    max-height: 160px !important;
    overflow: hidden !important;
}


/* Fade at bottom */

.pkp_page_index .current_issue .description::after,
.pkp_page_index .obj_issue_toc .description::after {
    content: "";

    position: absolute;

    left: 0;
    right: 0;
    bottom: 0;

    height: 48px;

    background: linear-gradient(
        to bottom,
        rgba(255,255,255,0),
        #ffffff 90%
    );

    pointer-events: none;
}


/* Description text */

.pkp_page_index .current_issue .description,
.pkp_page_index .obj_issue_toc .description {
    color: #444444 !important;

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


/* ==========================================================
   11. ISSUE COVER
   ========================================================== */

.pkp_page_index .obj_issue_toc .cover img,
.pkp_page_index .current_issue .cover img {
    max-width: 220px !important;
    height: auto !important;

    box-shadow: 0 5px 14px rgba(0,0,0,0.08) !important;
}


/* ==========================================================
   12. ISSUE METADATA / PUBLISHED DATE
   ========================================================== */

.pkp_page_index .obj_issue_toc .published,
.pkp_page_index .current_issue .published {
    margin-top: 14px !important;

    font-size: 12px !important;
    color: #444444 !important;
}


/* ==========================================================
   13. SECTION HEADINGS
   Example: Research Articles
   ========================================================== */

.pkp_page_index .obj_issue_toc .section > h2 {
    color: #666666 !important;

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

    font-size: 13px !important;
    font-weight: 400 !important;

    text-transform: none !important;
    letter-spacing: 0 !important;

    border-bottom: 1px solid #d7dce0 !important;

    padding-bottom: 8px !important;
    margin-top: 34px !important;
    margin-bottom: 22px !important;
}


/* ==========================================================
   14. TWO-COLUMN ARTICLE GRID
   HOMEPAGE ONLY
   ========================================================== */

.pkp_page_index .obj_issue_toc .articles {
    display: grid !important;

    grid-template-columns:
        repeat(2, minmax(0, 1fr)) !important;

    gap: 18px !important;

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


/* ==========================================================
   15. ARTICLE CARDS
   ========================================================== */

.pkp_page_index
.obj_issue_toc
.articles
.obj_article_summary {
    background: #ffffff !important;

    border: 1px solid var(--dba-border) !important;
    border-radius: 8px !important;

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

    box-sizing: border-box !important;

    box-shadow:
        0 2px 8px rgba(0, 0, 0, 0.05) !important;

    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease,
        border-color 0.2s ease !important;
}


/* Hover */

.pkp_page_index
.obj_issue_toc
.articles
.obj_article_summary:hover {
    transform: translateY(-2px) !important;

    border-color: #cbd3d9 !important;

    box-shadow:
        0 6px 16px rgba(0, 0, 0, 0.08) !important;
}


/* ==========================================================
   16. ARTICLE TITLES
   ========================================================== */

.pkp_page_index
.obj_issue_toc
.articles
.obj_article_summary
.title {
    margin: 0 0 10px !important;
}


.pkp_page_index
.obj_issue_toc
.articles
.obj_article_summary
.title a {
    color: var(--dba-blue) !important;

    font-family: Georgia, "Times New Roman", serif !important;

    font-size: 17px !important;
    font-weight: 700 !important;

    line-height: 1.35 !important;
}


.pkp_page_index
.obj_issue_toc
.articles
.obj_article_summary
.title a:hover {
    color: var(--dba-green) !important;
}


/* ==========================================================
   17. AUTHORS
   ========================================================== */

.pkp_page_index
.obj_issue_toc
.articles
.obj_article_summary
.authors {
    margin-top: 7px !important;
    margin-bottom: 10px !important;

    color: #666666 !important;

    font-family: Georgia, "Times New Roman", serif !important;

    font-size: 12px !important;
    font-style: italic !important;

    line-height: 1.5 !important;
}


/* ==========================================================
   18. PAGES / METADATA
   ========================================================== */

.pkp_page_index
.obj_issue_toc
.articles
.obj_article_summary
.pages {
    color: var(--dba-muted) !important;

    font-size: 11px !important;
    font-weight: 500 !important;
}


/* ==========================================================
   19. PDF / GALLEY BUTTONS
   Homepage cards only
   ========================================================== */

.pkp_page_index
.obj_issue_toc
.articles
.obj_article_summary
.galleys_links {
    margin-top: 13px !important;
}


.pkp_page_index
.obj_issue_toc
.articles
.obj_article_summary
.galleys_links a,

.pkp_page_index
.obj_issue_toc
.articles
.obj_article_summary
.galley-link {
    display: inline-block !important;

    background: var(--dba-blue) !important;
    color: #ffffff !important;

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

    padding: 7px 11px !important;

    font-size: 9px !important;
    font-weight: 700 !important;

    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
}


.pkp_page_index
.obj_issue_toc
.articles
.obj_article_summary
.galleys_links a:hover,

.pkp_page_index
.obj_issue_toc
.articles
.obj_article_summary
.galley-link:hover {
    background: var(--dba-green) !important;
    color: #ffffff !important;
}


/* ==========================================================
   20. SIDEBAR
   HOMEPAGE ONLY
   ========================================================== */

.pkp_page_index .pkp_structure_sidebar {
    border-left: 1px solid #e3e5e8 !important;
}


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


.pkp_page_index .pkp_block .title {
    color: var(--dba-blue) !important;

    font-size: 11px !important;
    font-weight: 700 !important;

    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;

    border-bottom: 1px solid #dddddd !important;

    padding-bottom: 8px !important;
}


/* ==========================================================
   21. MAKE A SUBMISSION BLOCK
   ========================================================== */

.pkp_page_index .block_make_submission {
    background: var(--dba-light) !important;

    border-top: 4px solid var(--dba-green) !important;

    padding: 20px !important;
}


.pkp_page_index .block_make_submission a {
    display: block !important;

    background: var(--dba-blue) !important;
    color: #ffffff !important;

    padding: 11px 14px !important;

    text-align: center !important;

    font-size: 10px !important;
    font-weight: 700 !important;

    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
}


.pkp_page_index .block_make_submission a:hover {
    background: var(--dba-green) !important;
}


/* ==========================================================
   22. HOMEPAGE FOOTER
   ========================================================== */

.pkp_page_index .pkp_structure_footer_wrapper {
    background: #111111 !important;

    border-top: 6px solid var(--dba-green) !important;
}


.pkp_page_index .pkp_structure_footer {
    color: #aaaaaa !important;
}


.pkp_page_index .pkp_structure_footer a {
    color: #ffffff !important;
}


.pkp_page_index .pkp_structure_footer a:hover {
    color: #cccccc !important;
}


/* ==========================================================
   23. TABLET
   ========================================================== */

@media (max-width: 900px) {

    .pkp_page_index .obj_issue_toc .articles {
        grid-template-columns: 1fr !important;
    }

    .pkp_page_index .current_issue_title {
        font-size: 20px !important;
    }

}


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

@media (max-width: 600px) {

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


    .pkp_page_index .current_issue_title {
        font-size: 19px !important;
        line-height: 1.35 !important;
    }


    .pkp_page_index .obj_issue_toc .articles {
        gap: 14px !important;
    }


    .pkp_page_index
    .obj_issue_toc
    .articles
    .obj_article_summary {
        padding: 16px !important;
    }


    .pkp_page_index
    .obj_issue_toc
    .articles
    .obj_article_summary
    .title a {
        font-size: 16px !important;
    }


    .pkp_page_index .obj_issue_toc .cover img,
    .pkp_page_index .current_issue .cover img {
        max-width: 180px !important;
    }

}

/* ==========================================================
   HEADER JOURNAL TITLE - WHITE
   ========================================================== */

.pkp_page_index .pkp_site_name .is_text,
.pkp_page_index .pkp_site_name .is_text a,
.pkp_page_index .pkp_site_name a,
.pkp_page_index .pkp_site_name_wrapper a {
    color: #ffffff !important;
}

/* Keep title white on hover */
.pkp_page_index .pkp_site_name .is_text:hover,
.pkp_page_index .pkp_site_name .is_text a:hover,
.pkp_page_index .pkp_site_name a:hover,
.pkp_page_index .pkp_site_name_wrapper a:hover {
    color: #ffffff !important;
}

/* ==========================================================
   DBA JOURNAL TITLE
   CENTERED ABOVE MAIN MENU
   ========================================================== */

/* Use the navigation wrapper as the positioning reference */
.pkp_page_index .pkp_navigation_primary_wrapper {
    position: relative !important;

    /* More space between journal title and menu */
    padding-top: 55px !important;
}


/* Add journal title above navigation */
.pkp_page_index .pkp_navigation_primary_wrapper::before {
    content: "DBA Africa Management Review" !important;

    position: absolute !important;

    top: 10px !important;
    left: 0 !important;
    right: 0 !important;

    display: block !important;

    text-align: center !important;

    color: #ffffff !important;

    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 30px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;

    letter-spacing: 0.02em !important;

    pointer-events: none !important;
}
/* ==========================================================
   REDUCE SPACE BETWEEN LOGO AND JOURNALS PORTAL TITLE
   ========================================================== */

.pkp_page_index .pkp_site_name_wrapper {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 5px !important;
}

/* Remove unnecessary margins around logo */
.pkp_page_index .pkp_site_name {
    margin-right: 0 !important;
    padding-right: 0 !important;
}

/* Logo */
.pkp_page_index .pkp_site_name .is_img {
    margin-right: 0 !important;
    padding-right: 0 !important;
}

/* Remove excess margin from the portal title area */
.pkp_page_index .pkp_site_name_wrapper > * {
    margin-left: 0 !important;
}

/* ==========================================================
   JOURNAL TITLE + SEPARATE BLACK NAVIGATION STRIP
   HOMEPAGE ONLY
   ========================================================== */


/* Navigation wrapper
   Creates a blue title area above the black menu */
.pkp_page_index .pkp_navigation_primary_wrapper {
    position: relative !important;

    /* Space reserved for journal title */
    padding-top: 58px !important;

    background: #000000 !important;
}


/* ----------------------------------------------------------
   JOURNAL TITLE
   Positioned in its own blue area above menu
   ---------------------------------------------------------- */

.pkp_page_index .pkp_navigation_primary_wrapper::before {
    content: "DBA Africa Management Review" !important;

    position: absolute !important;

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

    height: 58px !important;

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

    /* Same blue as main header */
    background: #0055aa !important;

    color: #ffffff !important;

    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;

    letter-spacing: 0.02em !important;

    box-sizing: border-box !important;

    pointer-events: none !important;

    z-index: 1 !important;
}


/* ----------------------------------------------------------
   BLACK MENU STRIP
   ---------------------------------------------------------- */

.pkp_page_index #navigationPrimary,
.pkp_page_index .pkp_navigation_primary {
    background: #000000 !important;

    margin-top: 0 !important;
    margin-bottom: 0 !important;

    padding-top: 0 !important;
    padding-bottom: 0 !important;
}


/* Main menu links */

.pkp_page_index #navigationPrimary > li > a,
.pkp_page_index .pkp_navigation_primary > li > a {
    color: #ffffff !important;

    font-size: 12px !important;
    font-weight: 700 !important;

    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
}


/* Menu hover */

.pkp_page_index #navigationPrimary > li > a:hover,
.pkp_page_index #navigationPrimary > li > a:focus,
.pkp_page_index .pkp_navigation_primary > li > a:hover,
.pkp_page_index .pkp_navigation_primary > li > a:focus {
    color: #ffffff !important;
    background: #222222 !important;
}


/* ----------------------------------------------------------
   DROPDOWN MENUS
   Keep them white and readable
   ---------------------------------------------------------- */

.pkp_page_index #navigationPrimary ul,
.pkp_page_index .pkp_navigation_primary ul {
    background: #ffffff !important;
}


.pkp_page_index #navigationPrimary ul a,
.pkp_page_index .pkp_navigation_primary ul a {
    background: #ffffff !important;
    color: #222222 !important;
}


.pkp_page_index #navigationPrimary ul a:hover,
.pkp_page_index .pkp_navigation_primary ul a:hover {
    background: #f3f3f3 !important;
    color: #0055aa !important;
}

/* ==========================================================
   JOURNAL TITLE + BLACK MENU
   ALL OJS PAGES
   ========================================================== */


/* ----------------------------------------------------------
   NAVIGATION WRAPPER
   Reserve blue area for journal title
   ---------------------------------------------------------- */

.pkp_navigation_primary_wrapper {
    position: relative !important;

    /* Height of title area */
    padding-top: 65px !important;

    /* Menu area */
    background: #000000 !important;
}


/* ----------------------------------------------------------
   JOURNAL TITLE
   DISPLAY ON ALL PAGES
   ---------------------------------------------------------- */

.pkp_navigation_primary_wrapper::before {
    content: "DBA Africa Management Review" !important;

    position: absolute !important;

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

    height: 65px !important;

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

    background: #0055aa !important;
    color: #ffffff !important;

    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;

    letter-spacing: 0.02em !important;

    box-sizing: border-box !important;

    pointer-events: none !important;

    z-index: 1 !important;
}


/* ----------------------------------------------------------
   BLACK NAVIGATION STRIP
   ---------------------------------------------------------- */

#navigationPrimary,
.pkp_navigation_primary {
    background: #000000 !important;

    margin-top: 0 !important;
    margin-bottom: 0 !important;
}


/* Menu links */

#navigationPrimary > li > a,
.pkp_navigation_primary > li > a {
    color: #ffffff !important;

    font-size: 12px !important;
    font-weight: 700 !important;

    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
}


/* Menu hover */

#navigationPrimary > li > a:hover,
#navigationPrimary > li > a:focus,
.pkp_navigation_primary > li > a:hover,
.pkp_navigation_primary > li > a:focus {
    color: #ffffff !important;
    background: #222222 !important;
}


/* ----------------------------------------------------------
   DROPDOWN MENU
   ---------------------------------------------------------- */

#navigationPrimary ul,
.pkp_navigation_primary ul {
    background: #ffffff !important;
}


#navigationPrimary ul a,
.pkp_navigation_primary ul a {
    background: #ffffff !important;
    color: #222222 !important;
}


#navigationPrimary ul a:hover,
.pkp_navigation_primary ul a:hover {
    background: #f3f3f3 !important;
    color: #0055aa !important;
}