/* ==========================================================================
    RESPONSIVE STYLES (MEDIA QUERIES)
   ========================================================================== */

/* ----------------------------------
   Extra Small Devices (< 600px)
   ---------------------------------- */
@media screen and (max-width: 599px) {
    /* Show mobile navigation */
    .nav-sm {
        display: block !important;
    }
    
    /* Hide desktop navigation */
    .nav-lg {
        display: none !important;
    }
}


/* ----------------------------------
   Small Devices (600px - 779px)
   ---------------------------------- */
@media screen and (min-width: 600px) {
    /* Show desktop navigation */
    .nav-sm {
        display: none !important;
    }
    
    .nav-lg {
        display: flex !important;
    }
}


/* ----------------------------------
   Medium Devices (max-width: 750px)
   ---------------------------------- */
@media screen and (max-width: 750px) {
    /* Hide account label on mobile */
    .wp-block-woocommerce-customer-account > a > .label {
        display: none;
    }
    
    /* Hide nav home on mobile */
    .nav-home {
        display: none !important;
    }
}


/* ----------------------------------
   Medium Devices (max-width: 779px)
   ---------------------------------- */
@media screen and (max-width: 779px) {
    main,
    .flex-grow {
        flex-grow: 1;
        gap: 0;
    }
    
    .mobile-hide {
        display: none;
    }
    
    .mobile-show {
        display: inline-block;
    }
}