/* ============================================================
   1. GLOBAL / DESKTOP SETTINGS
   ============================================================ */
#auxnav.mobilenone {
    display: flex !important;
    visibility: visible !important;
    height: auto !important;
  /*  z-index: 1001 !important; */
    position: relative !important;
    background: #D1D6D8 !important; 
    overflow: visible !important;
}

/* ============================================================
   2. MOBILE 50/50 SPLIT (ONLY for screens under 992px)
   ============================================================ */
@media (max-width: 991px) {
    
    /* FIX: Target the Nav and the Internal Container to remove all side gaps */
    nav#auxnav,
    #auxnav.navbar,
    #auxnav .container {
        padding: 0 !important;
        margin: 0 !important;
        max-width: 100% !important;
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
    }

    /* Force the wrapper to full height and remove padding */
    #auxnav .collapse.navbar-collapse {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        width: 100% !important;
        height: 55px !important; /* This defines the total height of the bar */
        padding: 0 !important;
        margin: 0 !important;
    }

    /* LEFT HALF: Select Campus & MyFIC */
    #auxnav .navbar-nav {
        flex: 1 !important; 
        width: 50% !important;
        height: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: space-around !important; /* Spaces links evenly in the grey half */
        background: #D1D6D8 !important;
    }

    /* Fixed your padding here - 45px was too wide for mobile screens */
    #auxnav .navbar-nav .nav-item {
        padding: 0 20px !important; 
        margin: 0 !important;
        border-right: 1px solid #aaa !important;
    }

    #auxnav .navbar-nav .nav-item:last-child {
        border-right: none !important;
    }

    #auxnav .navbar-nav .nav-link {
        font-size: 9px !important;
        color: #008080 !important;
        background: transparent !important;
        text-transform: uppercase;
        white-space: nowrap !important;
        padding: 0 !important;
    }

    /* RIGHT HALF: The Teal Apply Now Block */
    #auxnav .navbar-collapse > p.nav-item {
        flex: 1 !important; 
        width: 50% !important;
        height: 100% !important; /* Stretches to full bar height */
        margin: 0 !important;
        padding: 0 !important;
        background-color: #008080 !important; 
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
    }

    /* Style the button link to fill the teal block completely */
    #auxnav .btn-primary {
        width: 100% !important;
        height: 100% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        background: transparent !important;
        border: none !important;
        color: #ffffff !important;
        font-size: 11px !important;
        font-weight: bold !important;
        text-transform: uppercase !important;
        border-radius: 0 !important; /* Sharp corners touch the edges */
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Popup dropdown for Campus Selector */
    #auxnav .dropdown-menu {
        position: absolute !important;
        top: 100% !important;
        left: 0 !important;
        z-index: 9999 !important;
    }
}