.full-header-top {
  background: #fff;
  border-bottom: 1px solid #eee;
}

.inner-header-top {
  display: flex;
  align-items: center;
  gap: 15px;
  padding: 10px;
}

/* LOGO */
.header-logo img {
  max-height: 80px;
}

/* DỰ ÁN */
.btn-duan {
  background: #ff3b30;
  color: #fff;
  padding: 10px 18px;
  border-radius: 30px;
  font-weight: 600;
  text-decoration: none;
}

/* SEARCH */
.header-search {
  flex: 1;
}

.header-search form {
  display: flex;
  border: 1px solid #ddd;
  border-radius: 4px;
  overflow: hidden;
}

.header-search input {
  flex: 1;
  padding: 10px;
  border: none;
  outline: none;
}

.header-search button {
  background: red;
  color: #fff;
  border: none;
  padding: 0 15px;
}

/* ZALO */
.header-zalo a {
  border-radius: 5px;
  text-decoration: none;
}
.header-zalo a {
  animation: zoom_opa 4s infinite linear;
  box-shadow: 0 0 0 0 #fcb900;
  padding: 10px 0;
  display: block;
  margin-left: 8px;
}
.header-zalo img {
  width: 250px;
  height: 100%;
  animation: calltrap_spin 4s infinite linear;
}

/* CART */
.header-cart a {
  display: flex;
  align-items: center;
  gap: 3px;
  background: #1f61af;
  color: #fff;
  padding: 10px 16px;
  border-radius: 20px;
  font-weight: 600;
  text-decoration: none;
}

/* MENU */
.full-header {
  background: #1f61af;
  z-index: 100;
}

.full-header .inner-header .mega-menu-wrap > ul {
  width: 100%;
  display: flex !important;
  align-items: center;
  justify-content: center;
  list-style: none;
  margin: 0;
  padding: 0;
}

.full-header ul li a {
  color: #fff;
  padding: 14px 18px;
  display: block;
  font-weight: 600;
}

.full-header ul li:hover {
  background: #174bb5;
}
.full-header-top.mobile,
.full-header.mobile {
  display: none;
}
@keyframes zoom_opa {
  70% {
    box-shadow: 0 0 0 15px transparent;
  }
  100% {
    box-shadow: 0 0 0 0 transparent;
  }
}
@keyframes calltrap_spin {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  30% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  33% {
    -webkit-transform: rotate(-10deg);
    -moz-transform: rotate(-10deg);
    -o-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }
  36% {
    -webkit-transform: rotate(10deg);
    -moz-transform: rotate(10deg);
    -o-transform: rotate(10deg);
    transform: rotate(10deg);
  }
  39% {
    -webkit-transform: rotate(-10deg);
    -moz-transform: rotate(-10deg);
    -o-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }
  42% {
    -webkit-transform: rotate(10deg);
    -moz-transform: rotate(10deg);
    -o-transform: rotate(10deg);
    transform: rotate(10deg);
  }
  45% {
    -webkit-transform: rotate(-10deg);
    -moz-transform: rotate(-10deg);
    -o-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }
  48% {
    -webkit-transform: rotate(10deg);
    -moz-transform: rotate(10deg);
    -o-transform: rotate(10deg);
    transform: rotate(10deg);
    opacity: 1;
  }
  51% {
    -webkit-transform: rotate(-10deg);
    -moz-transform: rotate(-10deg);
    -o-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }
  54% {
    -webkit-transform: rotate(10deg);
    -moz-transform: rotate(10deg);
    -o-transform: rotate(10deg);
    transform: rotate(10deg);
  }
  57% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@media screen and (max-width: 900px) {
  /* Hàng trên sticky ở top: 0 */
  .full-row.full-header-top.mobile {
    position: sticky;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1001; /* cao hơn một chút để luôn ở trên */
  }

  /* Hàng dưới sticky, dính ngay dưới hàng trên */
  .full-row.full-header.mobile {
    position: sticky;
    top: var(
      --header-top-height
    );
    left: 0;
    right: 0;
    z-index: 1000;
  }

  /* Optional: shadow nhẹ khi sticky để nhìn rõ */
  .full-row.full-header-top.mobile,
  .full-row.full-header.mobile {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  }

  .full-header-top,
  .full-header {
    display: none;
  }
  .full-header-top.mobile {
    display: flex;
    align-items: center;
    padding: 10px 0;
  }
  .main-menu,
  .header-cart {
    width: 10%;
  }
  .header-cart a {
    display: unset;
    padding: 15px;
    border-radius: 50%;
  }
  .mega-menu-toggle{
    border-radius: 50% !important;
  }
  .header-logo {
    width: 70%;
    text-align: center;
  }
  .full-header.mobile {
    display: block;
  }
  .inner-header {
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: center;
    padding: 10px !important;
  }
  .header-search {
    width: 100%;
  }
  .header-duan a {
    padding: 5px 10px;
  }
}