.fusion-fullwidth.fusion-builder-row-1:has(.language-switcher) {
  z-index: 1000 !important;
}

.language-switcher-mobile{
  display: block;
  @media(min-width: 769px) {
    display: none;
  }
}

.language-switcher {
  position: relative;
  margin-left: 1rem;

  .main {
    position: relative;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    img {
      position: relative;
      width: 30px;
      height: 30px;
      z-index: 1;
      pointer-events: none;
    }

    svg{
      transform: rotate(-90deg);
      transition: transform .3s ease-in-out;
    }

    input {
      position: absolute;
      top: 0;
      left: 0;
      opacity: 0;
      z-index: 0;
      width: 100%;
      height: 100%;
      cursor: pointer;
    }
  }

  .langs {
    position: absolute;
    width: 62px;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    display: none;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 4px;
    background-color: #fff;
    padding: 0 16px 8px;
    z-index: 1000;
    border: 1px solid #000;

    a {
      display: block;
      cursor: pointer;

      &:hover {
        img {
          transform: scale(1.1);
        }
      }
    }

    img {
      width: 30px;
      height: 30px;
      transition: transform .3s ease-in-out;
    }
  }

  &:has(input:checked) {
    .main svg{
      transform: rotate(-90deg) rotateY(-180deg);
    }
    .langs {
      display: flex;
    }
  }
}
