/* 响应式导航栏优化 - 解决缩放时按钮显示问题 */

@media (min-width: 1024px) and (max-width: 1200px) {
  nav.main-navbar .nav-center .space-x-8 > :not([hidden]) ~ :not([hidden]) {
    margin-left: 1.25rem;
  }
}

@media (min-width: 1024px) and (max-width: 1100px) {
  nav.main-navbar .nav-center .space-x-8 > :not([hidden]) ~ :not([hidden]) {
    margin-left: 0.875rem;
  }

  nav.main-navbar #nav-right-section.space-x-2 > :not([hidden]) ~ :not([hidden]) {
    margin-left: 0.25rem;
  }
}

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  nav.main-navbar .desktop-nav-link,
  nav.main-navbar .nav-dropdown-button,
  nav.main-navbar .nav-icon-btn {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
}

@media (prefers-reduced-motion: reduce) {
  nav.main-navbar .desktop-nav-link,
  nav.main-navbar .nav-dropdown-button,
  nav.main-navbar .nav-icon-btn,
  nav.main-navbar #mobile-menu-button .fa-bars {
    transition: none !important;
  }
}

@media print {
  nav.main-navbar {
    display: none !important;
  }
}