.navbar {
  display: grid;
  grid-template-columns: repeat(4, 15%) 1fr;
  background-color: black;
}
.navbar a,
.navbar_label {
  color: white;
  text-decoration: none;
  display: block;
  padding: 5px;
}

.navbar a:hover {
  background-color: gold;
  color: black;
}

.navbar_dropdown {
  display: none;
  position: absolute;
  z-index: 1;
  /* background-color: darkgray; */
  background: rgb(70, 42, 33);
  background: linear-gradient(
    0deg,
    rgba(70, 42, 33, 1) 0%,
    rgba(120, 45, 7, 0.9051058045288428) 80%,
    rgba(182, 106, 75, 0.8770946000470501) 100%
  );
}

.navbar_group:hover .navbar_dropdown {
  display: block;
}

.searchbox input {
  padding: 8px;
  border-radius: 5px;
}
.searchbox button {
  background-color: gold;
  color: black;
  padding: 8px;
  border-radius: 5px;
  font-size: 0.8rem;
}
.searchbox {
  justify-self: end;
  margin: 2px;
}

.hamburger {
  color: white;
  display: none;
}

@media screen and (max-width: 600px) {
  .navbar {
    grid-template-columns: auto;
  }
  .navbar_group,
  .searchbox {
    grid-column: 1 / span 2;
    display: none;
  }
  .hamburger {
    grid-column: 2;
    grid-row: 1;
    display: block;
    justify-self: end;
    padding: 10px;
    color: white;
  }
  .navbar.dropdown .navbar_group,
  .navbar.dropdown .searchbox {
    display: block;
  }
  .navbar_dropdown {
    /* width: 50%; */
    position: relative;
    left: 80px; /* 确保它出现在右侧 */
    width: 150px; /* 你可以根据需要调整宽度 */
    top: 0;
  }
}
