/* ===== STICKY NAVBAR STYLES ===== */

/* Ensure body and html don't interfere */
html {
  scroll-behavior: smooth;
}

body {
  overflow-x: hidden;
  overflow-y: scroll;
}

/* Navbar container must not interfere */
#navbar-container {
  position: relative;
}

/* Wrapper for navbar - starts as STATIC, becomes FIXED when scrolling */
.navbar-wrapper {
  position: relative; /* Static by default */
  z-index: 1030;
  background: var(--mauno-white, #ffffff);
  transition: box-shadow 0.3s ease;
  will-change: box-shadow, padding;
}

/* When scrolled past top bar, navbar becomes fixed */
.navbar-wrapper.fixed {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
}

/* Add shadow when scrolled */
.navbar-wrapper.scrolled {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

/* Navbar styles */
.navbar-wrapper .navbar {
  margin-bottom: 0;
  transition: padding 0.3s ease;
}

/* Compact navbar when scrolled */
.navbar-wrapper.scrolled .navbar {
  padding-top: 0.5rem !important;
  padding-bottom: 0.5rem !important;
}

/* Adjust logo size when scrolled */
.navbar-wrapper .navbar-brand img {
  transition: height 0.3s ease;
}

.navbar-wrapper.scrolled .navbar-brand img {
  height: 48px !important;
}

/* Top bar should scroll normally */
.top-bar {
  position: relative;
  z-index: 1000;
}

/* Remove default body padding */
body {
  padding-top: 0;
}

/* When navbar is fixed, add spacing to prevent content jump */
.navbar-wrapper + * {
  margin-top: 0;
}

/* No default padding - JavaScript will handle it dynamically */
body.has-fixed-navbar {
  padding-top: 0;
}

/* Mobile adjustments */
@media (max-width: 991px) {
  .navbar-wrapper.scrolled .navbar-brand img {
    height: 44px !important;
  }
}