/* Header Fixes for Trapper Outdoors */

/* Fix body padding to prevent content cutoff */
body {
    padding-top: 120px !important; /* Adjust based on header height */
}

body.with-notification {
    padding-top: 180px !important; /* Adjust when notification is shown */
}

/* Ensure content doesn't get hidden behind fixed header */
main, .container, .hero-section, .content-wrapper {
    position: relative;
    z-index: 1;
}

/* Mobile optimizations */
@media (max-width: 768px) {
    body {
        padding-top: 100px !important;
    }
    
    body.with-notification {
        padding-top: 140px !important;
    }
    
    .top-header {
        padding: 0.5rem 0;
    }
    
    .nav-menu {
        padding: 0;
    }
    
    .search-container {
        order: 3;
        margin: 0.5rem 0;
        max-width: none;
    }
    
    .top-header-container {
        flex-wrap: wrap;
        gap: 0.5rem;
    }
    
    .logo-container {
        order: 1;
    }
    
    .user-actions {
        order: 2;
    }
    
    .mobile-menu-toggle {
        order: 4;
    }
    
    /* Improve mobile menu */
    .nav-menu.active {
        width: 100%;
        max-width: none;
    }
    
    .nav-menu a {
        padding: 1rem;
        border-bottom: 1px solid rgba(0,0,0,0.1);
        font-size: 1rem;
    }
}

/* Specific page fixes */
.cart-page, .dashboard-page, .wishlist-page {
    padding-top: 140px !important;
}

.cart-page.with-notification, 
.dashboard-page.with-notification, 
.wishlist-page.with-notification {
    padding-top: 200px !important;
}

/* Ensure proper z-index stacking */
.site-header {
    z-index: 1000 !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
}

.site-header.with-notification {
    top: 60px !important;
}

.notification-banner {
    z-index: 1001 !important;
}

.mega-menu {
    z-index: 999 !important;
}

/* Fix for pages with existing padding */
.hero-section {
    margin-top: 0 !important;
}

.category-section {
    margin-top: 0 !important;
}

.featured-section {
    margin-top: 0 !important;
}

/* Ensure content sections are properly positioned */
.hero-section, .category-section, .featured-section, .cta-section, .newsletter-section {
    position: relative;
    z-index: 1;
}

/* Additional mobile adjustments */
@media (max-width: 768px) {
    .site-header.with-notification {
        top: 50px !important;
    }
}

@media (max-width: 480px) {
    .site-header.with-notification {
        top: 80px !important;
    }
}