/* Nav导航栏 */
#nav #navBox {
  width: 100%;
  height: 60px;
  position: relative;
  display: flex;
  align-items: center;
}

#nav .site-page:not(.child):after {
  display: none;
}

.nav-fixed #nav {
  backdrop-filter: blur(5px) saturate(150%);
}

.menus_item_child li:not(#sidebar-menus li) {
  float: left;
  border-radius: 6px !important;
  -webkit-border-radius: 6px !important;
  -moz-border-radius: 6px !important;
  -ms-border-radius: 6px !important;
  -o-border-radius: 6px !important;
}

.menus_item_child:not(#sidebar-menus ul) {
  /*
    left:calc(-150%)!important;这是估算值，为了保持元素居中的，如果不合适可以自己调
    改为：*/
  left: 50%;
  translate: -50%;
}

#nav #blog-info {
  overflow: visible;
  flex: none;
  z-index: 100;
}

#nav #blog-info a {
  position: relative;
  font-size: 1.2em;
}

#nav #blog-info a::before {
  opacity: 0;
  background-color: var(--theme-color-green) !important;
  border-radius: 8px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;

  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;

  position: absolute;
  transform: translate(-50%, -50%);
  top: 50%;
  left: 50%;
  width: 105%;
  height: 120%;
  content: "\f015";
  box-shadow: 0 0px 5px 0 var(--theme-color-blue);
  font-family: "Font Awesome 6 Free";
  text-align: center;
  color: white;
  line-height: 41px;
  font-size: 18px;
  font-weight: 900;
}

#nav #blog-info a:hover::before {
  opacity: 1;
  scale: 1.03;
}

#nav.hide-menu .menus_items {
  display: inline-block;
  transition: 0.3s;
}
.site-page.child,
#nav .menus_items .menus_item,
#nav .site-page.social-icon.travellings,
#nav .site-page.social-icon.randoms,
#nav .site-page.social-icon.search {
  padding: 0 10px;
  margin: 0 2px;
  border-radius: 10px;
  transition: 0.3s;
}

#nav .menus_items .menus_item:hover,
#nav .site-page.social-icon.travellings:hover,
#nav .site-page.social-icon.randoms:hover,
#nav .site-page.social-icon.search:hover {
  background: var(--theme-color-green);
  box-shadow: 0 0 5px var(--theme-color-blue);
  color: rgb(73, 177, 245) !important;
}

#nav .menus_items .menus_item:hover a {
  color: #fff;
}

#page-header.nav-fixed #nav .menus_items .menus_item:hover a,
#nav .site-page.social-icon.travellings:hover,
#nav .site-page.social-icon.randoms:hover,
#page-header.nav-fixed #nav .site-page.social-icon.search:hover {
  color: #fff;
}

nav #search-button {
    display: inline;
    padding: 0px 0px 0px 0px !important;
}
#menuTitleBox {
  position: absolute;
  z-index: -1;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  overflow: hidden;
}

#menuTitleBox #name-container {
  height: 100%;
  line-height: 60px;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  transition: 0.3s;
}

#menuTitleBox #name-container::before {
  opacity: 0;
  background-color: var(--theme-color-green) !important;
  border-radius: 8px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;

  transition: 0.3s;
  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -ms-transition: 0.3s;
  -o-transition: 0.3s;

  position: absolute;
  transform: translate(-50%, -50%);
  top: 50%;
  left: 50%;
  width: 100%;
  height: 60%;
  content: "回到顶部";
  box-shadow: 0 0 5px var(--theme-color-blue);
  text-align: center;
  color: white;
  line-height: 36px;
  font-size: 18px;
  font-weight: 900;
}

#menuTitleBox #name-container:hover::before {
  opacity: 1;
  scale: 1.03;
  cursor: pointer;
}

#nav.hide-menu #toggle-menu {
  display: none !important;
}

#nav #nav-right {
  z-index: 100;
  position: absolute;
  right: 0;
}
#nav-right{
  flex:1 1 auto;
  justify-content: flex-end;
  margin-left: auto;
  display: flex;
  flex-wrap:nowrap;
}

#nav a.site-page {
  padding-bottom: 6px;
  display: inline-block;
}

#nav a.site-page span {
  padding-left: 4px;
}

#nav a.site-page::before {
  display: none;
}

#nav #menus {
  position: absolute;
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
}

#nav #menus .menus_items {
  transition: 0.3s;
}

#nav .menus_items .menus_item .menus_item_child {
  padding: 5px;
  border-radius: 15px;
}

#nav .menus_items .menus_item .menus_item_child li {
  transition: 0.3s;
  border-radius: 10px !important;
  margin: 0 2px;
}
#nav .menus_items .menus_item .menus_item_child li:hover {
  background: var(--theme-color2);
}

#nav .menus_items .menus_item .menus_item_child li:hover a {
  color: #fff !important;
}

@media screen and (max-width: 768px) {
  /* 菜单修复 */
  #nav.hide-menu #toggle-menu {
    display: inline-block !important;
  }

  #nav #menus,
  #nav #menuTitleBox {
    display: none;
  }

  #nav #blog-info a {
    font-size: 1em;
  }
}

/* Nav导航栏 */
.nav-fixed #nav{
    transform: translateY(58px)!important;
    -webkit-transform: translateY(58px)!important;
    -moz-transform: translateY(58px)!important;
    -ms-transform: translateY(58px)!important;
    -o-transform: translateY(58px)!important;
}
#nav {
  /* 仅给背景、模糊、阴影加渐变，不干扰transform菜单位移 */
  transition: 
    background 0.3s ease, 
    backdrop-filter 0.3s ease, 
    -webkit-backdrop-filter 0.3s ease,
    box-shadow 0.3s ease;
  -webkit-transition: 
    background 0.3s ease, 
    backdrop-filter 0.3s ease, 
    -webkit-backdrop-filter 0.3s ease,
    box-shadow 0.3s ease;
}
/* 仅页面处于最顶部时生效，其余状态完全不干涉原有导航样式 */
#page-header.is-top #nav {
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  /* 清除白色边框/分割线/外阴影 */
  border: none !important;
  border-bottom: none !important;
  box-shadow: none !important;
  outline: none !important;
}

/* 顶部状态下菜单容器同步透明 */
#page-header.is-top #nav #menus {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* 清除导航内部子元素残留浅色分割线/边框 */
.site-page.child,
#page-header.is-top #nav .menus_item,
#page-header.is-top #nav .site-page {
  border-bottom: none !important;
  border-top: none !important;
}
#page-header.not-home-page.is-top #nav {
  background: var(--nav-color) !important;
}

[data-theme="light"] #page-header.not-home-page.is-top nav a {
  color: #4c4948;
}
[data-theme-light="light"] #page-header.not-home-page.is-top #nav a.site-page span:hover{
  color: #fff;
}