/* =========================================
   1. IMPORT GOOGLE FONTS
========================================= */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;0,700;1,400;1,600&family=Montserrat:wght@400;500;600&display=swap');

/* =========================================
   2. GLOBAL THEME & FIX 5 (REMOVE LIGHT LINES)
========================================= */
body, .pkp_structure_page {
    background-color: #fdfaf6 !important;
    color: #222222;
}

/* FIX 5: Remove light borders/lines globally from OJS containers */
.pkp_structure_page, 
.pkp_structure_main, 
.pkp_structure_content,
.pkp_structure_head,
.pkp_structure_footer_wrapper {
    border: none !important;
    box-shadow: none !important;
}

/* =========================================
   3. HEADER & TITLE STYLING
========================================= */
.pkp_structure_head {
    background-color: #0a2d1e !important;
    padding-top: 2rem !important;
    padding-bottom: 2rem !important;
    /* FIX 5: Removed border-bottom from here */
}

.pkp_site_name_wrapper h1, 
.pkp_site_name_wrapper .is_text {
    font-family: 'Playfair Display', serif !important;
    font-size: 3.2rem !important; 
    color: #ffffff !important;
    font-weight: 600;
    line-height: 1.1;
    margin-top: 10px;
}

/* =========================================
   4. FIX 1: NAVIGATION & DROPDOWN ISSUES
========================================= */
/* Ensure all main nav and user nav text is visible against the dark header */
.pkp_navigation_primary > li > a,
.pkp_navigation_user > li > a {
    color: #ffffff !important;
    font-family: 'Montserrat', sans-serif;
    font-size: 15px;
    background-color: transparent !important; /* Restores default look */
}

/* Fix dropdown sub-menus (forces them to match the dark theme and makes text visible) */
.pkp_navigation_primary ul {
    background-color: #0a2d1e !important; /* Matches header */
    border: 1px solid #114a31 !important; /* Very subtle border so it doesn't float into nothing */
}

/* Dropdown menu items */
.pkp_navigation_primary ul li a {
    color: #ffffff !important;
    font-size: 14px;
}

/* Dropdown menu hover state */
.pkp_navigation_primary ul li a:hover,
.pkp_navigation_primary ul li a:focus {
    background-color: #114a31 !important; /* Slightly lighter green on hover */
    color: #ffffff !important;
}

/* =========================================
   5. FIX 4: FOOTER THEME COLOR
========================================= */
.pkp_structure_footer_wrapper,
.pkp_structure_footer {
    background-color: #0a2d1e !important; /* Dark Forest Green */
    color: #ffffff !important;
    padding-top: 2rem !important;
    padding-bottom: 2rem !important;
}

/* Make links in the footer visible */
.pkp_structure_footer a {
    color: #e5dac9 !important; /* Cream color for links */
    text-decoration: underline;
}

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

/* =========================================
   6. HOMEPAGE CONTENT LAYOUT
========================================= */
.pkp_page_index .pkp_structure_main {
    width: 100% !important;
    float: none !important;
}
.pkp_page_index .pkp_structure_sidebar { display: none !important; }

.custom-homepage-wrapper {
    margin-top: 50px;
    width: 100%;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

/* =========================================
   7. FIX 2: ALIGN TEXT & IMAGE ON HOMEPAGE
========================================= */
.custom-about-section {
    display: flex !important;
    flex-wrap: nowrap;
    gap: 60px;
    align-items: center !important; /* FIX 2: Changed from flex-start to center to align them perfectly */
    margin-bottom: 70px;
}

.custom-about-text {
    flex: 1.2;
    text-align: justify;
    color: #333333;
    line-height: 1.7;
    font-family: 'Montserrat', sans-serif;
}

.custom-about-text h2 {
    color: #0a2d1e;
    font-family: 'Playfair Display', serif;
    font-size: 38px;
    font-weight: 700;
    margin-bottom: 25px;
    border-bottom: none !important; 
}

.custom-about-text p {
    font-size: 16px;
    margin-bottom: 20px;
}

.custom-about-image {
    flex: 1;
}

.custom-about-image img {
    width: 100%;
    height: auto;
    border-radius: 12px;
}

/* =========================================
   8. FIX 3 & 5: FEATURES SECTION & LOGOS
========================================= */
.custom-features-section {
    display: flex !important;
    flex-direction: row;
    justify-content: space-between;
    gap: 20px;
    background-color: transparent !important;
    padding: 30px 0;
    border: none !important; /* FIX 5: Removed top/bottom lines */
}

.feature-box {
    flex: 1;
    display: flex;
    flex-direction: row;
    align-items: center;
    text-align: left;
    gap: 20px;
}

/* FIX 3: Make all logos strictly the same size */
.feature-icon-img {
    width: 85px !important;
    min-width: 85px !important; /* Prevents text from pushing it smaller */
    height: 85px !important;    /* Locks the height */
    max-height: 85px !important;
    object-fit: contain !important; /* Fits image inside the 85x85 box perfectly */
    flex-shrink: 0 !important;  /* Stops flexbox from resizing the logo */
    display: block;
}

.feature-text h3 {
    color: #0a2d1e;
    font-size: 18px;
    margin-bottom: 5px;
    font-family: 'Playfair Display', serif;
}

.feature-text p {
    font-size: 14px;
    line-height: 1.4;
    color: #444;
}

/* =========================================
   9. EXTRA BUTTON FIXES
========================================= */
/* Hide the Archives button */
a.is_button[href*="archive"], 
.homepage_about a[href*="archive"],
.cmp_button_link[href*="archive"] {
    display: none !important;
}

/* Submit Article Button Styling */
.homepage_about a.is_button {
    font-size: 1.2rem !important; 
    padding: 15px 35px !important;
    background-color: #0a2d1e !important; 
    border-color: #0a2d1e !important;
    color: #ffffff !important;
}

.homepage_about a.is_button:hover {
    background-color: #114a31 !important;
}

/* =========================================
   10. MOBILE RESPONSIVENESS
========================================= */
@media screen and (max-width: 900px) {
    .custom-about-section {
        flex-direction: column !important;
    }
    .custom-features-section {
        flex-direction: column !important;
        align-items: flex-start;
        gap: 30px;
    }
    .pkp_navigation_primary {
        flex-direction: column;
        align-items: center;
        gap: 0;
    }
    .pkp_navigation_primary > li > a {
        padding: 15px !important;
    }
}


/* =========================================
   AGGRESSIVE BORDER REMOVAL (FIXES GHOST LINES)
========================================= */

/* 1. Remove ALL borders from Main Page Containers */
.pkp_structure_page,
.pkp_structure_body,
.pkp_structure_content,
.pkp_structure_main,
.pkp_structure_sidebar,
.pkp_site_name_wrapper,
.pkp_navigation_primary_wrapper,
.pkp_navigation_user,
.custom-homepage-wrapper,
.feature-box {
    border: none !important;
    border-top: none !important;
    border-bottom: none !important;
    box-shadow: none !important !important;
}

/* 2. Remove Grid Lines / Table Lines */
table, th, td {
    border: none !important;
    background-color: transparent !important;
}

/* 3. Remove Horizontal Rule (<HR>) Lines often found in page content */
hr {
    display: none !important;
    visibility: hidden !important;
    height: 0px !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* 4. Specific Fix for Vertical Line next to Nav or Search */
.pkp-nav__actions,
.pkp_search .search_input,
.pkp_search {
    border: none !important;
}


/* =========================================
   REPLACEMENT FOR SECTION 2: GLOBAL THEME & ENHANCED FIX 5 (REMOVE ALL LIGHT LINES)
========================================= */
/* Replace your entire "2. GLOBAL THEME & FIX 5" section with this stronger version */
body, .pkp_structure_page {
    background-color: #fdfaf6 !important;
    color: #222222;
}

/* FIX 5 ENHANCED: Remove ALL light borders/lines globally - Targets OJS tables, panels, grids, etc. */
*,
.pkp_structure_page *,
.pkp_structure_main *,
.pkp_structure_content *,
.pkp_structure_head *,
.pkp_structure_footer_wrapper * {
    border: none !important;
    border-top: none !important;
    border-bottom: none !important;
    border-left: none !important;
    border-right: none !important;
    box-shadow: none !important;
    outline: none !important;
}

/* Specific OJS table/grid fixes (these cause the grid-like pale lines you see) */
.pkp_table,
.pkp_table table,
.pkp_table th,
.pkp_table td,
.pkp_table tr,
.pkp_table tbody,
.pkp_table thead {
    border: none !important;
    border-collapse: collapse !important;
}

.pkp_table th,
.pkp_table td {
    border: none !important;
    padding: 12px 15px !important; /* Keeps clean spacing without lines */
}

/* Panels, sections, announcements, and issue blocks (common OJS line sources) */
.panel,
.pkp_panel,
.pkp_panel .panel,
.pkp_content_panel,
.pkp_section,
div[role="tabpanel"],
.announcement,
.obj_issues_summary,
.obj_issue_summary,
.pkp_helpers_clear,
.pkp_helpers_border,
.cmp_* {
    border: none !important;
    box-shadow: none !important;
}

/* Extra: Any remaining dividers or subtle lines */
hr,
.divider {
    display: none !important;
}

/* Content wrappers (prevents nested borders) */
.pkp_structure_content > div,
.pkp_structure_content > section,
.pkp_structure_content > article {
    border: none !important;
}

/* =========================================
   FIX 5 (PART 2): REMOVE OJS VERTICAL LAYOUT LINES (PSEUDO-ELEMENTS)
========================================= */
/* Targets the invisible 1px full-height blocks OJS uses for vertical dividers */
.pkp_structure_page::before,
.pkp_structure_page::after,
.pkp_structure_content::before,
.pkp_structure_content::after,
.pkp_structure_main::before,
.pkp_structure_main::after,
.pkp_structure_sidebar::before,
.pkp_structure_sidebar::after {
    display: none !important;
    content: none !important;
    background: transparent !important;
    width: 0 !important;
    height: 0 !important;
}

/* Also catches any vertical borders applied via background gradients */
.pkp_structure_content,
.pkp_structure_main {
    background-image: none !important;
}