/*
Theme Name: Rattlers Child
Template: skt-gym
Version: 1.0
*/

/* ===============================
   FIX SKT HEADER CLEANLY
=============================== */

/* Header layout */
.header .container {
    display: flex;
    max-width: 100% !important;
    width: 100%;
    padding:4px 10px 4px 10px;
    align-items: center;
    justify-content: space-between;
}

/* Remove float junk */
.header .logo,
.header .sitenav,
.header .toggle {
    float: none !important;
}

 .header .sitenav ul li a {
     background:#000000!important;
        color: #ffffff !important;
    }
    
/* Hover = dark gray */
   .header .sitenav ul.sub-menu li a:hover {
    background: #2a2a2a !important;
    color: #ffffff !important;
}

/* Logo */
.header .logo img {
    width: auto;
}

.header #menu-main li {
    background:#000000!important;
    display: flex !important;
    align-items: center !important;
}

.header #menu-main .smallfry-menu > a {
    display: block;
    width: 120px;   /* adjust */
    height: 30px;   /* adjust */
    background-image: url('/wp-content/uploads/2023/03/smallfry-btn.png')!important;
    background-size: contain!important;
    background-repeat: no-repeat!important;
    background-position: center!important;
    text-indent: -9999px; /* hide text */
}

.header #menu-main ul.sub-menu {
    background:#000000!important;
    margin-top: 0 !important;
}


/* Align toggle right */
.header .toggle {
    margin-left: auto;
}

/* Hide "Menu" text but keep icon */
.header .toggleMenu {
    font-size: 0;
}

/* Keep icon visible */
.header .toggleMenu:after {
    font-size: 26px;
}

/* Desktop nav */
@media (min-width: 1025px) {

    .header .sitenav {
        display: block !important;
        position: static !important;
    }

    .header #menu-main {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 40px;
    }

    .header #menu-main > li {
        position: relative;      /* 🔥 anchor for dropdown */
        float: none !important;
        display: flex !important;
        align-items: center;
    }

    .header #menu-main > li > a {
        padding: 20px 0;
        color: #ffffff !important;
        font-weight: 600;
        text-decoration: none;
    }

    /* FIX DROPDOWN */
    .header #menu-main ul.sub-menu {
        position: absolute;
        top: 100%;
        left: 0;
        margin-top: 0 !important;
        padding: 0;
        background: #000000 !important;
        min-width: 220px;
        z-index: 999;
    }

    .header #menu-main ul.sub-menu li {
        display: block !important;
    }

}




@media (max-width: 991px) {

    .header {
        position: relative;
        z-index: 9999;
    }

    .header .sitenav {
        display: none;
        position: fixed;      /* 🔥 THIS IS THE KEY */
        top: 90px;            /* header height */
        left: 0;
        width: 100%;
        height: calc(100vh - 80px);
        background: #111;
        overflow-y: auto;
        z-index: 9998;
    }
    
    .header #menu-main .smallfry-menu > a {
    display: block;
    width: 120px;   /* adjust */
    height: 30px;   /* adjust */
    background-image: url('/wp-content/uploads/2023/03/smallfry-btn.png')!important;
    background-size: contain!important;
    background-repeat: no-repeat!important;
    background-position: center!important;
    text-indent: -9999px; /* hide text */
}

    .header.mobile-open .sitenav {
        display: block;
    }

    .header #menu-main {
        display: block;
    }

    .header #menu-main li {
        display: block;
    }

}



