@use '../utilities';

.megaMenu[data-n-3583] {
  .navbarCustom {
    &,
    a {
      color: var(--a-blanco);
    }

    .navbar-brand {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      font-family: VFSans;
      font-size: 13px;
      font-weight: 900;
      font-stretch: normal;
      font-style: normal;
      line-height: 1.38;
      letter-spacing: 0.93px;
      color: #fff;
      @media (max-width: 575.98px) {
        img {
          width: 205px;
          height: 50px;
        }
      }
    }
    .nav-link {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      @extend %VFSans-font;
      text-align: center;
      font-weight: 600;
      font-size: 1rem;
      font-size: clamp(1rem, 0.5333333333333332rem + 0.5833333333333335vw, 1.35rem);
      letter-spacing: 0.93px;
      min-height: 50px;
      cursor: pointer;
    }
    .nav-item:hover {
      .submenuDropdown {
        //display: block;
        min-height: 120px;
        height: auto;
        transform: translateY(0%);
        .contentDropdown {
          transform: translate(0);
        }
      }
    }

    .bg-Blue,
    .bg-Orange,
    .bg-Pink {
      font-size: 14px;
      a {
        color: var(--a-blanco) !important;
      }
    }

    .bg-Blue {
      background-color: var(--a-azul-unops);
    }
    .bg-Orange {
      background-color: #e35205;
    }
    .bg-Pink {
      background-color: var(--b-cereza);
    }
    .bg-Gray {
      background-color: rgba(216, 216, 216, 0.2);
    }
  }
  /*.submenuhidden {*/
  /*animation-name: hiddenMenu;*/
  /*animation-duration: 1s;*/
  /*animation-timing-function: ease;*/
  /*animation-iteration-count: 1;*/
  /*animation-fill-mode: forwards;*/
  /*}*/
  .submenuDropdown {
    overflow: hidden;
    background-color: var(--b-medianoche);
    position: absolute;
    top: 100%;
    min-height: 0px;
    height: 0;
    left: 0%;
    width: 100%;
    transition: transform 200ms ease-in, visibility 200ms, -webkit-transform 200ms ease-in;
    z-index: -1;
    transform: translateY(-150%);
    //transition: height 0.5s cubic-bezier(0.86, 0, 0.07, 1);
    //opacity: 0;
    //animation-name: showMenu;
    //animation-duration: 1s;
    //animation-timing-function: ease;
    //animation-iteration-count: 1;
    .contentDropdown {
      transition: transform 0.6s cubic-bezier(0.86, 0, 0.07, 1), opacity 0.5s cubic-bezier(0.86, 0, 0.07, 1);
      transform: translateY(-120%);
      z-index: -1;
    }
  }
}

/*@keyframes showMenu {*/
/*0% {*/
/*z-index: -1;*/
/*transform: translateY(-90px);*/
/*}*/
/*100% {*/
/*z-index: -1;*/
/*transform: translateY(0px);*/
/*}*/
/*}*/

.search-icon svg {
  width: 20px;
  height: 20px;
  fill: #fff;
}
input,
input::placeholder {
  color: #fff;
  background-color: transparent;
  border: none;
  text-align: center;
}
input {
  font-size: 1rem;
  font-size: clamp(1rem, 0.5333333333333332rem + 0.5833333333333335vw, 1.35rem);
  padding-left: 1rem;
  border: 0px;
  background-color: transparent;
}
#resultsSearch {
  position: absolute;
  min-height: 30vh;
  left: 0%;
  top: 120%;
  width: 100%;
  height: 100%;
  overflow-y: auto;
  &.active {
    display: block;
  }
  &.inactive {
    display: none;
  }
}
#resultsSearch .results-group--item {
  background-color: #2b4659;
}
#resultsSearch .results-group--item a:hover {
  font-size: 16px;
  line-height: 1.38;
  color: #caf1ff;
}