.custom-dropdown-items {
  position: relative;
}
.new-message-header-indicator {
  position: absolute;
  width: 15px;
  height: 15px;
  background: #ef4444;
  border-radius: 50%;
  color: white;
  top: 11px;
  right: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 12px;
}

.main-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 1020;
  transition: transform 0.3s ease; /* smooth slide */
  /* transform: translateY(0); */
}

.main-header.hidden {
  transform: translateY(-100%); /* slides up to hide */
}

.mask-header3 {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 120%;
  height: auto; /* maintain aspect ratio */
  z-index: 1; /* behind other content if needed */
}
@media only screen and (max-width: 1500px) {
  .mask-header3 {
    width: 150%;
  }
}
@media only screen and (max-width: 1000px) {
  .mask-header3 {
    width: 250%;
  }
}
@media only screen and (max-width: 768px) {
  .mask-header3 {
    width: 350%;
  }
}
@media only screen and (max-width: 400px) {
  .mask-header3 {
    width: 450%;
  }
}