/* Sticky Header Styles */

/* Common header styles for all headers */
.sticky-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 1000;
    transition: all 0.3s ease;
}

/* Add padding to body to prevent content from hiding under fixed header */
body.has-sticky-header {
    padding-top: 60px; /* Adjust based on your header height */
}

/* Style for when header is sticky and user has scrolled */
.sticky-header.scrolled {
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

/* Mobile-specific adjustments */
@media (max-width: 768px) {
    .sticky-header .mobile-menu {
        max-height: calc(100vh - 60px);
        overflow-y: auto;
    }
}