/* 固定导航栏样式优化 - 保持与正常导航栏一致 */

/* 固定导航栏基础样式 */
nav.sticky {
  position: fixed !important;
  top: 0 !important;
  left: 0;
  right: 0;
  z-index: 9999;
  background: rgba(255, 255, 255, 0.98) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(0, 0, 0, 0.1) !important;
  box-shadow: 0 2px 20px rgba(0, 0, 0, 0.1);
  width: 100% !important;
  height: 120px !important;
  /* 与正常导航栏保持一致 */
  transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transform: translateY(0);
  opacity: 1;
}

/* 确保container保持Bootstrap的max-width约束 */
nav.sticky .container {
  max-width: 1170px !important;
  /* Bootstrap的lg断点最大宽度 */
  margin: 0 auto !important;
  padding-left: 15px !important;
  padding-right: 15px !important;
}

/* 确保menu容器的定位 */
nav.sticky .menu {
  float: right !important;
  /* 限制menu的最大宽度，确保与正常导航栏一致 */
  max-width: 100% !important;
}

/* 其他样式保持不变 */
nav.sticky .row {
  padding-top: 10px !important;
}

/* 固定导航栏中的logo样式 - 与正常导航栏保持一致 */
nav.sticky .logo {
  margin-top: 27px !important;
  /* 与正常导航栏保持一致 */
  transition: all 0.3s ease;
}

nav.sticky .logo img {
  width: 152px !important;
  height: 40px !important;
  transition: all 0.3s ease;
}

nav.sticky .menu ul {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

/* 固定导航栏中的菜单项样式 - 与正常导航栏保持一致 */
nav.sticky .menu ul li {
  position: relative !important;
  float: left !important;
  /* padding: 37px 15px !important; */
  /* width: 15% !important; */
}

nav.sticky .menu ul li a {
  padding: 0 !important;
  padding-bottom: 10px !important;
  color: #666 !important;
  text-decoration: none !important;
  font-weight: 300 !important;
  font-size: 16px !important;
  font-family: 'Noto Sans SC', sans-serif !important;
  display: block !important;
  transition: all 0.3s ease !important;
}

nav.sticky .menu ul li:last-child a {
  padding-right: 0px !important;
}

/* 固定导航栏hover效果 - 与正常导航栏保持一致 */
nav.sticky .menu li a:hover {
  outline: none !important;
  color: #00C0E1 !important;
  text-decoration: none !important;
}

nav.sticky .menu li.current a {
  color: #00C0E1 !important;
  border-bottom: 2px solid #00C0E1 !important;
}

nav.sticky .menu li:hover a {
  color: #00C0E1 !important;
}

/* 固定导航栏下拉菜单样式 */
nav.sticky .menu ul li ul {
  position: absolute !important;
  left: 0px !important;
  display: block !important;
  visibility: hidden !important;
  width: 100% !important;
  opacity: 0 !important;
  background: #ffffff !important;
  border-top: 1px solid #00C0E1 !important;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1) !important;
}

nav.sticky .menu ul li:hover ul {
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
  transition: all 0.2s ease !important;
}

nav.sticky .menu ul li ul li {
  width: 180px !important;
}

nav.sticky .menu ul li ul li a {
  padding: 8px 24px !important;
  border-top: 1px solid rgba(0, 0, 0, 0.08) !important;
  color: #666 !important;
  font-weight: 300 !important;
  font-size: 16px !important;
}

nav.sticky .menu ul li ul li:first-child a {
  border-top: none !important;
}

nav.sticky .menu ul li ul li a:hover {
  background-color: #fafafa !important;
  color: #00C0E1 !important;
}

/* 移动端响应式 */
@media (max-width: 991px) {
  nav.sticky {
    display: none !important;
    /* 移动端隐藏固定导航栏 */
  }
}

/* 响应式断点 */
@media (min-width: 1200px) {
  nav.sticky .container {
    max-width: 1170px !important;
  }
}

@media (min-width: 992px) and (max-width: 1199px) {
  nav.sticky .container {
    max-width: 970px !important;
  }
}

/* 确保clearfix */
nav.sticky .row:before,
nav.sticky .row:after {
  content: " " !important;
  display: table !important;
}

nav.sticky .row:after {
  clear: both !important;
}

/* 确保页面内容不被固定导航栏遮挡 */
body.sticky-nav-active {
  padding-top: 120px;
}

/* 平滑动画效果 */
nav.sticky-animating {
  transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* 菜单项依次出现动画 */
nav.sticky .menu ul li {
  opacity: 1;
  transform: translateY(0);
  transition: all 0.3s ease;
}

/* 当导航栏首次创建时，菜单项先隐藏 */
nav.sticky.sticky-nav-clone .menu ul li {
  opacity: 0;
  transform: translateY(-10px);
}

/* 当显示动画开始时，菜单项依次出现 */
nav.sticky.sticky-show .menu ul li {
  opacity: 1;
  transform: translateY(0);
}

nav.sticky.sticky-show .menu ul li:nth-child(1) {
  transition-delay: 0.1s;
}

nav.sticky.sticky-show .menu ul li:nth-child(2) {
  transition-delay: 0.15s;
}

nav.sticky.sticky-show .menu ul li:nth-child(3) {
  transition-delay: 0.2s;
}

nav.sticky.sticky-show .menu ul li:nth-child(4) {
  transition-delay: 0.25s;
}

nav.sticky.sticky-show .menu ul li:nth-child(5) {
  transition-delay: 0.3s;
}

nav.sticky.sticky-show .menu ul li:nth-child(6) {
  transition-delay: 0.35s;
}

nav.sticky.sticky-show .menu ul li:nth-child(7) {
  transition-delay: 0.4s;
}

nav.sticky.sticky-show .menu ul li:nth-child(8) {
  transition-delay: 0.45s;
}

/* 固定导航栏显示动画 */
@keyframes slideDown {
  from {
    transform: translateY(-100%);
    opacity: 0;
  }

  to {
    transform: translateY(0);
    opacity: 1;
  }
}

nav.sticky.sticky-show {
  animation: slideDown 0.3s ease-out;
}

/* 固定导航栏隐藏动画 */
@keyframes slideUp {
  from {
    transform: translateY(0);
    opacity: 1;
  }

  to {
    transform: translateY(-100%);
    opacity: 0;
  }
}

nav.sticky.sticky-hide {
  animation: slideUp 0.3s ease-in;
}