/**
 * @package         Modals
 * @version         14.1.0
 * 
 * @author          Peter van Westen <info@regularlabs.com>
 * @link            https://regularlabs.com
 * @copyright       Copyright © 2024 Regular Labs All Rights Reserved
 * @license         GNU General Public License version 2 or later
 */
.rl-modals-animate-fade-in {
  animation: rl-modals-animation-fade-in 300ms ease;
}

.rl-modals-animate-fade-out {
  animation: rl-modals-animation-fade-out 300ms ease;
}

.rl-modals-animate-slide-in-to-left {
  animation: rl-modals-animation-slide-in-to-left 300ms ease;
}

.rl-modals-animate-slide-out-to-left {
  animation: rl-modals-animation-slide-out-to-left 300ms ease;
}

.rl-modals-animate-slide-in-to-right {
  animation: rl-modals-animation-slide-in-to-right 300ms ease;
}

.rl-modals-animate-slide-out-to-right {
  animation: rl-modals-animation-slide-out-to-right 300ms ease;
}

.rl-modals-animate-zoom-in {
  animation: rl-modals-animation-zoom-in 300ms ease;
}

.rl-modals-animate-zoom-out {
  animation: rl-modals-animation-zoom-out 300ms ease;
}

.rl-modals-animate-show {
  opacity: 1;
}

.rl-modals-animate-hide {
  opacity: 0;
}

@keyframes rl-modals-animation-spinner {
  0% {
    transform: rotate(0deg) scale3d(1, 1, 1);
  }
  50% {
    transform: rotate(180deg) scale3d(1, 1, 1);
  }
  75% {
    transform: rotate(270deg) scale3d(0.9, 0.9, 0.9);
  }
  100% {
    transform: rotate(360deg) scale3d(1, 1, 1);
  }
}
@keyframes rl-modals-animation-fade-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes rl-modals-animation-fade-out {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@keyframes rl-modals-animation-slide-in-to-left {
  from {
    opacity: 0;
    visibility: visible;
    transform: translate3d(75%, 0, 0);
  }
  to {
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
@keyframes rl-modals-animation-slide-out-to-left {
  from {
    opacity: 1;
    visibility: visible;
    transform: translate3d(0, 0, 0);
  }
  to {
    transform: translate3d(-75%, 0, 0);
    opacity: 0;
    visibility: hidden;
  }
}
@keyframes rl-modals-animation-slide-in-to-right {
  from {
    opacity: 0;
    transform: translate3d(-75%, 0, 0);
  }
  to {
    visibility: visible;
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
@keyframes rl-modals-animation-slide-out-to-right {
  from {
    opacity: 1;
    visibility: visible;
    transform: translate3d(0, 0, 0);
  }
  to {
    transform: translate3d(75%, 0, 0);
    opacity: 0;
  }
}
@keyframes rl-modals-animation-zoom-in {
  from {
    opacity: 0;
    transform: scale3d(0.25, 0.25, 0.25);
  }
  to {
    opacity: 1;
  }
}
@keyframes rl-modals-animation-zoom-out {
  from {
    opacity: 1;
  }
  50% {
    opacity: 0;
    transform: scale3d(0.25, 0.25, 0.25);
  }
  to {
    opacity: 0;
  }
}
[data-modals-element] {
  box-sizing: border-box;
}

[data-modals-element].hidden {
  display: none !important;
}

[data-modals-element=modal] {
  z-index: 1000;
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  overflow: hidden;
  outline: none;
  /* CONTENT TYPES */
}
[data-modals-element=modal] [data-modals-element=overlay] {
  --color: 0, 0, 0;
  --opacity: 0.9;
  position: fixed;
  width: calc(100% + 2px);
  height: calc(100% + 2px);
  top: -1px;
  left: -1px;
  will-change: opacity;
  background-color: rgba(var(--color), var(--opacity));
}
[data-modals-element=modal] [data-modals-element=spinner] {
  --color: #ffffff;
  position: absolute;
  height: 32px;
  width: 32px;
  animation: rl-modals-animation-spinner 1.2s infinite linear;
  border: 3px solid transparent;
  border-color: var(--color) transparent;
  border-radius: 50%;
  margin: 0 auto;
  left: 0;
  right: 0;
  top: calc(50% - 16px);
}
[data-modals-element=modal] [data-modals-element=container] {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  display: flex;
  flex-flow: column;
}
[data-modals-element=modal] [data-modals-element=main] {
  order: 2;
  display: flex;
  flex: auto;
}
[data-modals-element=modal] [data-modals-element=pagination-bar] {
  order: 3;
  display: flex;
}
[data-modals-element=modal] [data-modals-element=close-bar] {
  order: 1;
  width: 100%;
  top: 0;
  left: 0;
  display: flex;
  flex-direction: row-reverse;
}
[data-modals-element=modal] [data-modals-element=center] {
  flex: auto;
}
[data-modals-element=modal] [data-modals-element=slides] {
  position: relative;
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: transform 0.4s ease;
  transform: translate3d(0, 0, 0);
}
[data-modals-element=modal] [data-modals-element=slide] {
  position: absolute;
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
[data-modals-element=modal] [data-modals-element=slide][data-modals-position$=left] {
  left: 0;
}
[data-modals-element=modal] [data-modals-element=slide][data-modals-position$=right] {
  right: 0;
}
[data-modals-element=modal] [data-modals-element=slide][data-modals-position^=top] {
  top: 0;
}
[data-modals-element=modal] [data-modals-element=slide][data-modals-position^=bottom] {
  bottom: 0;
}
[data-modals-element=modal] [data-modals-element=slide-container] {
  display: flex;
  align-items: center;
  max-height: 100%;
  max-width: 100%;
}
[data-modals-element=modal] [data-modals-element=slide-container-inner] {
  display: flex;
  align-items: center;
  max-height: 100%;
}
[data-modals-element=modal] [data-modals-orientation=vertical] [data-modals-element=slide-container] {
  flex-flow: column;
}
[data-modals-element=modal] [data-modals-orientation=horizontal] [data-modals-element=slide-container] {
  flex-flow: row;
}
[data-modals-element=modal] [data-modals-element=slide-before],
[data-modals-element=modal] [data-modals-element=slide-content],
[data-modals-element=modal] [data-modals-element=slide-content-inner],
[data-modals-element=modal] [data-modals-element=slide-after] {
  max-height: 100%;
  max-width: 100%;
}
[data-modals-element=modal] [data-modals-element=slide-before],
[data-modals-element=modal] [data-modals-element=slide-after] {
  overflow: auto;
}
[data-modals-element=modal] [data-modals-element=slide-content-inner] {
  overflow: visible;
}
[data-modals-element=modal] [data-modals-element=slide-before] {
  flex: none;
}
[data-modals-element=modal] [data-modals-element=slide-content] {
  position: relative;
  flex: auto;
}
[data-modals-element=modal] [data-modals-element=slide-after] {
  flex: none;
}
[data-modals-element=modal] [data-modals-element=slide-title] {
  overflow: auto;
  font-size: calc(1.3rem + 0.6vw);
  line-height: initial;
}
[data-modals-element=modal] [data-modals-element=slide-description] {
  overflow: auto;
}
[data-modals-element=modal] [data-modals-element=previous],
[data-modals-element=modal] [data-modals-element=next],
[data-modals-element=modal] [data-modals-element=close],
[data-modals-element=modal] [data-modals-element=pagination-button] {
  content: "";
  background-color: transparent;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  border: none;
}
[data-modals-element=modal] [data-modals-element=previous],
[data-modals-element=modal] [data-modals-element=next],
[data-modals-element=modal] [data-modals-element=close] {
  cursor: pointer;
  position: relative;
}
[data-modals-element=modal] [data-modals-element=previous], html[dir=rtl] [data-modals-element=modal] [data-modals-element=next] {
  content: ">";
}
[data-modals-element=modal] [data-modals-element=next], html[dir=rtl] [data-modals-element=modal] [data-modals-element=previous] {
  content: "<";
}
[data-modals-element=modal] [data-modals-element=close] {
  content: "X";
  z-index: 2;
}
[data-modals-element=modal] [data-modals-element=pagination] {
  display: flex;
  align-items: center;
  margin: 0 auto;
}
[data-modals-element=modal] [data-modals-element=pagination-button]:not(.active) {
  cursor: pointer;
}
[data-modals-element=modal] [data-modals-element=pagination-text] {
  display: flex;
  align-items: baseline;
}
[data-modals-element=modal] [data-modals-type=inline] [data-modals-element=slide-content] {
  overflow: auto;
}
[data-modals-element=modal] [data-modals-type=image] [data-modals-element=slide-content] {
  display: flex;
}
[data-modals-element=modal] [data-modals-type=image] [data-modals-element=slide-content] img {
  object-fit: contain;
}
[data-modals-element=modal] [data-modals-type=image] [data-modals-element=slide-content-inner],
[data-modals-element=modal] [data-modals-type=iframe] [data-modals-element=slide-content-inner],
[data-modals-element=modal] [data-modals-type=video] [data-modals-element=slide-content-inner] {
  overflow: hidden;
}
[data-modals-element=modal] [data-modals-type=image] [data-modals-element=slide-content-inner] > *,
[data-modals-element=modal] [data-modals-type=iframe] [data-modals-element=slide-content-inner] > *,
[data-modals-element=modal] [data-modals-type=video] [data-modals-element=slide-content-inner] > * {
  vertical-align: middle;
}
