/**
 * @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
 */
[data-modals-element=modal][data-modals-theme=dark] {
  /* CONTENT TYPES */
}
[data-modals-element=modal][data-modals-theme=dark] {
  --main-margin: 10px;
  --button-size: 60px;
  --button-icon-size: 22px 40px;
  --close-button-size: 52px;
  --close-button-icon-size: 32px 32px;
}
@media (min-width: 768px) {
  [data-modals-element=modal][data-modals-theme=dark] {
    --main-margin: 20px;
    --close-button-size: 72px;
  }
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=overlay] {
  backdrop-filter: blur(10px);
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=main] {
  margin: var(--main-margin);
  margin-top: calc(var(--close-button-size) * -1 + var(--main-margin));
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=left] {
  margin: calc(var(--main-margin) * -1);
  margin-to-left: 0;
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=right] {
  margin: calc(var(--main-margin) * -1);
  margin-to-right: 0;
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=slide] {
  padding: 0 var(--main-margin);
  max-width: 100%;
  max-height: 100%;
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-orientation=vertical] [data-modals-element=slide-before],
[data-modals-element=modal][data-modals-theme=dark] [data-modals-orientation=vertical] [data-modals-element=slide-after] {
  width: 100%;
  max-height: 30vh;
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-orientation=vertical] [data-modals-element=slide-before] {
  margin-bottom: 0.75rem;
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-orientation=vertical] [data-modals-element=slide-after] {
  margin-top: 0.75rem;
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-orientation=horizontal] [data-modals-element=slide-before],
[data-modals-element=modal][data-modals-theme=dark] [data-modals-orientation=horizontal] [data-modals-element=slide-after] {
  max-width: 30vw;
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-orientation=horizontal] [data-modals-element=slide-before] {
  margin-to-left: 1rem;
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-orientation=horizontal] [data-modals-element=slide-after] {
  margin-to-right: 1rem;
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=slide-content] {
  background: #ffffff;
  margin: 0;
  border-radius: 4px;
  overflow: hidden;
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=slide-title],
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=slide-description] {
  margin: 0;
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-orientation=vertical] [data-modals-element=slide-title],
[data-modals-element=modal][data-modals-theme=dark] [data-modals-orientation=vertical] [data-modals-element=slide-description] {
  text-align: center;
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=previous],
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=next],
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=close],
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=pagination-button] {
  opacity: 0.7;
  padding: 0;
  margin: 0;
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=previous].active, [data-modals-element=modal][data-modals-theme=dark] [data-modals-element=previous]:hover, [data-modals-element=modal][data-modals-theme=dark] [data-modals-element=previous]:focus,
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=next].active,
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=next]:hover,
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=next]:focus,
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=close].active,
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=close]:hover,
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=close]:focus,
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=pagination-button].active,
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=pagination-button]:hover,
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=pagination-button]:focus {
  opacity: 1;
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=previous]:focus-visible:not(.active),
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=next]:focus-visible:not(.active),
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=close]:focus-visible:not(.active),
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=pagination-button]:focus-visible:not(.active) {
  outline: 2px solid #0f3d81;
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=close] {
  background-size: var(--close-button-icon-size);
  width: var(--close-button-size);
  height: var(--close-button-size);
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=previous],
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=next] {
  display: none;
  background-size: var(--button-icon-size);
  width: var(--button-size);
  height: 100%;
  min-height: 22px;
  padding: 0;
}
@media (min-width: 768px) {
  [data-modals-element=modal][data-modals-theme=dark] [data-modals-element=previous],
  [data-modals-element=modal][data-modals-theme=dark] [data-modals-element=next] {
    display: inherit;
  }
}
@media (min-width: 1024px) {
  [data-modals-element=modal][data-modals-theme=dark] [data-modals-element=previous],
  [data-modals-element=modal][data-modals-theme=dark] [data-modals-element=next] {
    --button-size: 100px;
  }
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=pagination-bar] {
  --margin: 10px;
  margin: 0 var(--margin) var(--margin) var(--margin);
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: thin;
  scrollbar-color: #999999 transparent;
}
@media (min-width: 768px) {
  [data-modals-element=modal][data-modals-theme=dark] [data-modals-element=pagination-bar] {
    --margin: 20px;
  }
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=pagination-bar]::-webkit-scrollbar {
  width: 8px;
  height: 8px;
  background: transparent;
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=pagination-bar]::-webkit-scrollbar-thumb {
  background: #999999;
  border-radius: 4px;
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=pagination-button] {
  --size: 5vw;
  box-sizing: content-box;
  background-clip: content-box;
  background-color: #ffffff;
  border-radius: 50%;
  width: var(--size);
  height: var(--size);
  margin: calc(var(--size) / 4);
  transition: all 0.1s linear;
  font-size: 0;
}
@media (min-width: 640px) {
  [data-modals-element=modal][data-modals-theme=dark] [data-modals-element=pagination-button] {
    --size: 3vw;
  }
}
@media (min-width: 768px) {
  [data-modals-element=modal][data-modals-theme=dark] [data-modals-element=pagination-button] {
    --size: 16px;
  }
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=pagination-button].active, [data-modals-element=modal][data-modals-theme=dark] [data-modals-element=pagination-button]:hover:not(.active), [data-modals-element=modal][data-modals-theme=dark] [data-modals-element=pagination-button]:focus-visible:not(.active) {
  background-color: #115dda;
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=pagination-image] {
  --size: 30px;
  --saturate: 50%;
  width: auto;
  height: var(--size);
  margin: 2px;
  transition: all 0.1s linear;
  border-radius: 2px;
  cursor: pointer;
  opacity: 0.5;
  filter: saturate(var(--saturate));
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
}
@media (min-width: 768px) {
  [data-modals-element=modal][data-modals-theme=dark] [data-modals-element=pagination-image] {
    --size: 50px;
  }
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=pagination-image].active, [data-modals-element=modal][data-modals-theme=dark] [data-modals-element=pagination-image]:hover:not(.active), [data-modals-element=modal][data-modals-theme=dark] [data-modals-element=pagination-image]:focus-visible:not(.active) {
  opacity: 1;
  --saturate: 100%;
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=pagination-text-number] {
  font-size: 1.2rem;
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=pagination-text-divider],
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=pagination-text-total] {
  opacity: 0.5;
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=pagination-text-divider] {
  padding: 0 0.3rem;
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-type=image] [data-modals-element=slide-content],
[data-modals-element=modal][data-modals-theme=dark] [data-modals-type=audio] [data-modals-element=slide-content],
[data-modals-element=modal][data-modals-theme=dark] [data-modals-type=video] [data-modals-element=slide-content] {
  background: transparent;
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-type=inline] [data-modals-element=slide-content] {
  padding: 20px;
  overflow: auto;
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-type=iframe] [data-modals-element=slide-content] iframe {
  background: #ffffff;
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=countdown] {
  width: 100%;
  height: 3px;
  position: absolute;
  top: 0;
  left: 0;
  background-color: rgb(127, 127, 127);
}
[data-modals-element=modal][data-modals-theme=dark].just-the-modal [data-modals-element=overlay],
[data-modals-element=modal][data-modals-theme=dark].just-the-modal [data-modals-element=left],
[data-modals-element=modal][data-modals-theme=dark].just-the-modal [data-modals-element=right],
[data-modals-element=modal][data-modals-theme=dark].just-the-modal [data-modals-element=pagination-bar],
[data-modals-element=modal][data-modals-theme=dark].just-the-modal [data-modals-element=close-bar] {
  display: none;
}
[data-modals-element=modal][data-modals-theme=dark].just-the-modal [data-modals-element=slide-content] {
  filter: drop-shadow(0 0 5px rgba(0, 0, 0, 0.5));
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=overlay] {
  --color: 0, 0, 0;
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=spinner] {
  --color: #ffffff;
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=slide-content] {
  box-shadow: 0 0 1px rgba(255, 255, 255, 0.25);
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=slide-title],
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=slide-description] {
  color: #ffffff;
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=previous],
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=next],
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=close] {
  filter: drop-shadow(0 0 0 #000000) drop-shadow(0 0 2px #000000);
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=close] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 32 32' stroke='white'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M2 2L30 30M30 2L2 30' /%3E%3C/svg%3E");
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=previous], html[dir=rtl] [data-modals-element=modal][data-modals-theme=dark] [data-modals-element=next] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 22 40' stroke='white'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M20 2L2 20L20 38' /%3E%3C/svg%3E");
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=next], html[dir=rtl] [data-modals-element=modal][data-modals-theme=dark] [data-modals-element=previous] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 22 40' stroke='white'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M2 2L20 20L2 38' /%3E%3C/svg%3E");
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=pagination-button] {
  background-color: #ffffff;
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=pagination-button].active {
  background-color: #115dda;
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=pagination-image] {
  box-shadow: 0 0 1px rgba(255, 255, 255, 0.25);
}
[data-modals-element=modal][data-modals-theme=dark] [data-modals-element=pagination-text] {
  color: #ffffff;
}
