/* 
 * KRSCMS Navbar Layout Fix
 * Fixes Blog menu dropping to next line by reducing spacing between menu items
 */

@media (min-width: 992px) {
    /* Reduce padding for all navbar menu items to fit 9 items in one row */
    #header .header-nav.header-nav-links nav > ul > li > a,
    #header .header-nav.header-nav-links nav > ul > li:hover > a,
    #header .header-nav.header-nav-line nav > ul > li > a,
    #header .header-nav.header-nav-line nav > ul > li:hover > a {
        padding: 0 0.6rem !important; /* Reduced from 0.9rem to 0.6rem */
        margin: 1px 0 0;
        min-height: 60px;
        height: 100%;
        position: relative;
        background: transparent !important;
    }
    
    /* Reduce margin between menu items */
    #header .header-nav-main nav > ul > li {
        margin-left: 1px !important; /* Reduced from 2px to 1px */
    }
    
    /* Special handling for first item (Home) - no left margin */
    #header .header-nav-main nav > ul > li:first-child {
        margin-left: 0 !important;
    }
    
    /* Ensure navbar container can accommodate all items */
    #header .header-nav-links {
        flex-wrap: nowrap !important;
        justify-content: flex-end !important;
    }
    
    /* Make sure the nav container doesn't wrap */
    #header .header-nav-main nav {
        display: flex !important;
        flex-wrap: nowrap !important;
    }
    
    /* Ensure nav-pills don't wrap */
    #header .header-nav-main nav > ul.nav-pills {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: stretch;
    }
    
    /* Make each menu item flexible but not too wide */
    #header .header-nav-main nav > ul > li {
        flex: 0 0 auto !important;
        min-width: auto !important;
        max-width: none !important;
    }
}

/* Mobile responsive - keep original behavior */
@media (max-width: 991px) {
    #header .header-nav.header-nav-links nav > ul > li > a,
    #header .header-nav.header-nav-links nav > ul > li:hover > a,
    #header .header-nav.header-nav-line nav > ul > li > a,
    #header .header-nav.header-nav-line nav > ul > li:hover > a {
        padding: 0 .9rem !important; /* Restore original padding on mobile */
    }
    
    #header .header-nav-main nav > ul > li {
        margin-left: 2px !important; /* Restore original margin on mobile */
    }
}