/* index.css - Specific styles for the main index layout, header, etc. */

/* Example minimal Apple-like styling: big whitespace, crisp corners */
#mainNavbar {
  transition: all 0.3s ease-in-out;
  padding-top: 1rem;
  padding-bottom: 1rem;
}

#mainNavbar.navbar-scrolled {
  padding-top: 0.3rem;
  padding-bottom: 0.3rem;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1) !important;
}

#mainNavbar .navbar-brand {
  font-weight: 600;
  font-size: 1.5rem;
  transition: font-size 0.3s ease-in-out;
}

#mainNavbar.navbar-scrolled .navbar-brand {
  font-size: 1rem;
}

.navbar-nav .nav-link {
  font-size: 1rem;
  margin-left: 1rem;
  transition: font-size 0.3s ease-in-out, padding 0.3s ease-in-out;
}

#mainNavbar.navbar-scrolled .navbar-nav .nav-link {
  font-size: 0.85rem;
  padding-top: 0.3rem;
  padding-bottom: 0.3rem;
}

#mainNavbar.navbar-scrolled .settings-toggle {
  font-size: 0.85rem;
}

@media (max-width: 768px) {
  .navbar-nav .nav-link {
    margin-left: 0;
  }
}