.rt-dropdown {
  z-index: 1070;
}

.rt-dropdown-layer-alignment {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  flex: 1 0 0;
  position: relative;
}

.rt-dropdown--bottom {
  .rt-dropdown-layer-alignment {
    margin-top: var(--layer-aligment-append-top);
    margin-bottom: var(--layer-aligment-append-bottom);
    margin-inline-start: var(--layer-aligment-append-left);
    margin-inline-end: var(--layer-aligment-append-right);
  }
}

.rt-dropdown--top {
  .rt-dropdown-layer-alignment {
    margin-top: var(--layer-aligment-prepend-top);
    margin-bottom: var(--layer-aligment-prepend-bottom);
    margin-inline-start: var(--layer-aligment-prepend-left);
    margin-inline-end: var(--layer-aligment-prepend-right);
  }
}

.rt-dropdown--leading {
  .rt-dropdown-layer-alignment {
    margin-top: var(--layer-aligment-leading-top);
    margin-bottom: var(--layer-aligment-leading-bottom);
    margin-inline-start: var(--layer-aligment-leading-left);
    margin-inline-end: var(--layer-aligment-leading-right);
  }
}
.rt-dropdown--trailing {
  .rt-dropdown-layer-alignment {
    margin-top: var(--layer-aligment-trailing-top);
    margin-bottom: var(--layer-aligment-trailing-bottom);
    margin-inline-start: var(--layer-aligment-trailing-left);
    margin-inline-end: var(--layer-aligment-trailing-right);
  }
}

.rt-dropdown--left {
  .rt-dropdown-layer-alignment {
    margin: var(--layer-aligment-leading-top)
      var(--layer-aligment-leading-right) var(--layer-aligment-leading-bottom)
      var(--layer-aligment-leading-left);
  }
}
.rt-dropdown--right {
  .rt-dropdown-layer-alignment {
    margin: var(--layer-aligment-trailing-top)
      var(--layer-aligment-trailing-right) var(--layer-aligment-trailing-bottom)
      var(--layer-aligment-trailing-left);
  }
}

.rt-dropdown-alignment-element {
  display: flex;
  min-width: var(--aligment-element-min-width);
  min-height: var(--aligment-element-min-height);
  padding: var(--aligment-element-padding-top)
    var(--aligment-element-padding-right) var(--aligment-element-padding-bottom)
    var(--aligment-element-padding-left);
  gap: var(--aligment-element-gap);
  background: transparent !important;
  position: relative;
  z-index: 2;
  overflow: hidden;
  width: 100%;
}

.rt-dropdown-bg {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 1;
  box-shadow: 0px 12px 16px -4px rgba(16, 24, 40, 0.08),
    0px 4px 6px -2px rgba(16, 24, 40, 0.03);
}

.rt-dropdown-layer-alignment,
.rt-dropdown-bg {
  border-radius: var(--grid-child-child-border-radius-top-left)
    var(--grid-child-child-border-radius-top-right)
    var(--grid-child-child-border-radius-bottom-right)
    var(--grid-child-child-border-radius-bottom-left);
}

.rt-dropdown--full {
  &.rt-dropdown--top,
  &.rt-dropdown--bottom {
    &.rt-dropdown--start .rt-dropdown-layer-alignment {
      align-items: flex-start;
      justify-content: center;
    }
    &.rt-dropdown--middle .rt-dropdown-layer-alignment {
      align-items: center;
      justify-content: center;
    }
    &.rt-dropdown--end .rt-dropdown-layer-alignment {
      align-items: flex-end;
      justify-content: center;
    }
  }
  &.rt-dropdown--leading,
  &.rt-dropdown--trailing,
  &.rt-dropdown--left,
  &.rt-dropdown--right {
    &.rt-dropdown--start .rt-dropdown-layer-alignment {
      align-items: center;
      justify-content: flex-start;
    }
    &.rt-dropdown--middle .rt-dropdown-layer-alignment {
      align-items: center;
      justify-content: center;
    }
    &.rt-dropdown--end .rt-dropdown-layer-alignment {
      align-items: center;
      justify-content: flex-end;
    }
  }
}

/* ANIMATIONS:  */
.rt-dropdown--slide-enter {
  .rt-dropdown-alignment-element,
  .rt-dropdown-bg {
    opacity: 0;
    transform: translateY(-20px);
  }
  .rt-dropdown-bg {
    height: 0%;
  }
}
.rt-dropdown--slide-enter-active {
  .rt-dropdown-alignment-element {
    transition-delay: 40ms;
  }
  .rt-dropdown-alignment-element,
  .rt-dropdown-bg {
    opacity: 1;
    transform: translateY(0px);
    transition: 250ms ease-out;
  }
  .rt-dropdown-bg {
    height: 100%;
  }
}
.rt-dropdown--slide-exit {
  .rt-dropdown-alignment-element,
  .rt-dropdown-bg {
    opacity: 1;
    transform: translateY(0px);
  }
  .rt-dropdown-bg {
    height: 100%;
  }
}
.rt-dropdown--slide-exit-active {
  .rt-dropdown-alignment-element,
  .rt-dropdown-bg {
    opacity: 0;
    transform: translateY(-20px);
    transition: 250ms ease-out;
  }
  .rt-dropdown-alignment-element {
    transition-delay: 40ms;
  }
  .rt-dropdown-bg {
    height: 0%;
  }
}

.rt-dropdown--smooth-enter {
  .rt-dropdown-alignment-element,
  .rt-dropdown-bg {
    opacity: 0;
    transform: translateY(-20px);
  }
}
.rt-dropdown--smooth-enter-active {
  .rt-dropdown-alignment-element,
  .rt-dropdown-bg {
    opacity: 1;
    transform: translateY(0px);
    transition: 250ms ease-out;
  }
}
.rt-dropdown--smooth-exit {
  .rt-dropdown-alignment-element,
  .rt-dropdown-bg {
    opacity: 1;
    transform: translateY(0px);
  }
}
.rt-dropdown--smooth-exit-active {
  .rt-dropdown-alignment-element,
  .rt-dropdown-bg {
    opacity: 0;
    transform: translateY(-20px);
    transition: 250ms ease-out;
  }
}