.menu-label, #menu-toggle, .menu-text { 
    display: none !important; 
}

/* --- 2. DESKTOP MENU BAR - THE "LEFT-GLUE" FIX --- */
.nav-menu { 
    border-collapse: collapse !important; 
    border-spacing: 0 !important; 
    margin: 0 !important; 
    width: 100% !important; /* Stretches the blue bar 100% */
    background: #112B8A !important; /* Your blue bar color */
    table-layout: auto !important;
}

.nav-menu td { 
    padding: 0 !important; 
    line-height: 0 !important; 
    vertical-align: top !important; 
    font-size: 0 !important; 
    width: 1px !important; /* Forces button cells to shrink to the image size */
    white-space: nowrap !important;
}

/* THE SECRET INGREDIENT: The last cell takes up all remaining space */
.nav-menu td:last-child {
    width: auto !important; 
    background: #112B8A !important;
}

.nav-menu img { 
    display: block !important; 
    height: 36px !important; 
    width: auto !important; 
    border: 0 !important;
}

/* HIDE THE ACTUAL PIXEL IMAGES (The bar background does the work now) */
img[src*="blu pixl.png"] { 
    display: none !important; 
}


/* --- 2. MOBILE OVERRIDES (Screens 768px or smaller) --- */
@media screen and (max-width: 768px) {
    
    /* MOBILE LOGO */
    table:first-of-type, table:first-of-type tr, table:first-of-type td {
        display: block !important; width: 100% !important;
    }
    table:first-of-type img { width: 100% !important; height: auto !important; }

    /* MENU LABEL BAR */
    .menu-label { 
        display: block !important; background: #112B8A; color: white; 
        padding: 15px; text-align: center; font-weight: bold; 
        font-size: 20px !important; cursor: pointer;
    }

    /* DROPDOWN LOGIC - REMOVE BLUE BACKGROUND */
    .nav-menu { 
        display: none !important; 
        width: 100% !important; 
        background: transparent !important; /* Kills the blue rectangle on mobile */
    }
    #menu-toggle:checked + .menu-label + .nav-menu { display: block !important; }

    .nav-menu tr, .nav-menu td { 
        display: block !important; width: 100% !important; 
        background: transparent !important; /* Ensures no blue backgrounds leak in */
    }
    
    .nav-menu img { display: none !important; }

    .menu-text {
        display: block !important; padding: 18px !important;
        background: #112B8A !important; border-bottom: 1px solid #DDD !important;
        font-weight: bold !important; text-align: center !important;
        color: #EBEBB8 !important; font-size: 18px !important;
    }

    /* CONTENT STACKING */
    table:not(.nav-menu):not(:first-of-type) {
        display: block !important; width: 100% !important;
    }
    
    table:not(.nav-menu):not(:first-of-type) tr {
        display: flex !important; flex-direction: column !important;
    }

    table:not(.nav-menu):not(:first-of-type) td { 
        display: block !important; width: 100% !important; 
        padding: 15px !important; box-sizing: border-box !important; order: 1; 
    }

    /* PICS TO BOTTOM */
    td:has(img[src*="jpg"]), td:has(img[src*="JPG"]), 
    td:has(img[src*="steth"]), td:has(img[src*="handwash"]) { 
        order: 3 !important; 
    }

    /* TEXT SIZE */
    p, li, td { font-size: 18px !important; line-height: 1.6 !important; }
}