/*!
 * Easy Popup v1.3.0
 * https://github.com/viivue/easy-popup
 */
:root {
  --ep-bg: rgba(0, 0, 0, .4);
  --ep-padding: clamp(20px, 2vw, 40px);
  --ep-max-width: 915px;
  --ep-radius: 10px;
  --ep-close-width: 40px;
  --ep-close-color: #fff;
  --ep-close-color-hover: #ef1616;
  --ep-corner-offset: 20px;
  --ep-popup-bg: #fff;
}

/* master */
html:not(.easy-popup-open) .easy-popup-master {
  opacity: 0;
  visibility: hidden;
}

.easy-popup-master {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9999;
  background: var(--ep-bg);
  backdrop-filter: blur(2px);
  transition: opacity 0.4s ease, visibility 0.4s ease;
}

/* popup */
.easy-popup:not(.open) {
  opacity: 0;
  visibility: hidden;
  transform: scale(1.05);
  pointer-events: none;
}

.easy-popup {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  transition: opacity 0.4s ease, visibility 0.4s ease, transform 0.4s ease;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* overflow */
.easy-popup-overflow {
  position: relative;
  z-index: 2;
  width: 100%;
  max-height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
}

/* custom scrollbar */
.easy-popup-overflow *::-webkit-scrollbar {
  width: 5px;
}

.easy-popup-overflow *::-webkit-scrollbar-track {
  background: #eee;
}

.easy-popup-overflow *::-webkit-scrollbar-thumb {
  background-color: #000;
}

/* container */
.easy-popup-container {
  position: relative;
  padding: 40px 20px;
  box-sizing: border-box;
  width: 100%;
  max-width: var(--ep-max-width);
  margin: 0 auto;
}

.easy-popup-inner {
  position: relative;
}

/* content */
[data-easy-popup]:not(.easy-popup-enabled) {
  display: none;
}

.easy-popup-content {
  background: #fff;
  padding: var(--ep-padding);
  position: relative;
  border-radius: var(--ep-radius);
  overflow: hidden;
}

/* close button */
.ep-close-button {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
  background: none;
  border: none;
  cursor: pointer;
  transform: translate(0, -100%);
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1;
  width: var(--ep-close-width);
  /* close button > hover */
}
.ep-close-button svg {
  transition: all 0.3s ease;
  fill: var(--ep-close-color);
}
.ep-close-button:hover {
  color: var(--ep-close-color-hover);
}
.ep-close-button:hover svg {
  fill: var(--ep-close-color-hover);
}

/* custom close button */
.easy-popup.ep-has-custom-close-button .ep-close-button {
  aspect-ratio: unset;
  width: auto;
  color: var(--ep-close-color);
  padding: 10px;
}
.easy-popup.ep-has-custom-close-button .ep-close-button:hover {
  color: var(--ep-close-color-hover);
}

/****************************
 * Easy Popup Theme: left & right side
****************************/
[data-ep-theme=left-side],
[data-ep-theme=right-side] {
  --ep-close-color: #000;
  --ep-max-width: 860px;
  position: fixed;
}
[data-ep-theme=left-side]:not(.open),
[data-ep-theme=right-side]:not(.open) {
  opacity: 1;
  transform: translateX(100%);
}
[data-ep-theme=left-side] .easy-popup-container,
[data-ep-theme=right-side] .easy-popup-container {
  padding: 0;
  overflow: auto;
  max-height: 100vh;
}
[data-ep-theme=left-side] .easy-popup-container .easy-popup-inner,
[data-ep-theme=right-side] .easy-popup-container .easy-popup-inner {
  min-height: 100vh;
  background-color: var(--ep-popup-bg);
}
[data-ep-theme=left-side] .easy-popup-container .easy-popup-inner .easy-popup-content,
[data-ep-theme=right-side] .easy-popup-container .easy-popup-inner .easy-popup-content {
  border-radius: 0;
}
[data-ep-theme=left-side] .ep-close-button,
[data-ep-theme=right-side] .ep-close-button {
  transform: none;
  position: fixed;
}

[data-ep-theme=left-side]:not(.open) {
  transform: translateX(-100%);
}
[data-ep-theme=left-side] .easy-popup-container {
  margin: 0 auto 0 0;
}
[data-ep-theme=left-side] .ep-close-button {
  left: clamp(300px, var(--ep-max-width), 100vw);
  transform: translateX(-100%);
}

[data-ep-theme=right-side]:not(.open) {
  transform: translateX(100%);
}
[data-ep-theme=right-side] .easy-popup-container {
  margin: 0 0 0 auto;
}

/****************************
 * Easy Popup Layout: Mobile
****************************/
.easy-popup.ep-mobile-layout {
  --ep-top-empty-space: 100px;
  --ep-mobile-height: calc(100vh - var(--ep-top-empty-space));
}

.easy-popup.will-have-mobile-layout:not(.ep-mobile-layout) {
  /* close button */
}
.easy-popup.will-have-mobile-layout:not(.ep-mobile-layout) .ep-close-button.for-mobile-layout {
  display: none;
}

@media only screen and (max-width: 1023px) {
  .easy-popup.ep-mobile-layout {
    align-items: flex-end;
    /* hiding transition */
    /* close button */
  }
  .easy-popup.ep-mobile-layout:not(.open) {
    transform: scale(0.98) translate(0, 50px);
  }
  .easy-popup.ep-mobile-layout .easy-popup-overflow {
    overflow: hidden;
    display: flex;
  }
  .easy-popup.ep-mobile-layout .easy-popup-container {
    padding: 0;
    overflow: auto;
    max-width: 100%;
    height: var(--ep-mobile-height);
    background: var(--ep-popup-bg);
  }
  .easy-popup.ep-mobile-layout .ep-close-button:not(.for-mobile-layout) {
    display: none;
  }
  .easy-popup.ep-mobile-layout .ep-close-button.for-mobile-layout {
    --ep-close-color: #000;
    position: absolute;
    top: 0;
    transform: none;
  }
}
.easy-popup-master-corner {
  --ep-close-color: #000;
  --ep-max-width: 450px;
  transition: opacity 0.4s ease, transform 0.4s ease;
  position: fixed;
  bottom: unset;
  right: unset;
  top: unset;
  left: unset;
  opacity: 1;
  visibility: visible;
  height: unset;
  width: unset;
  display: block;
}
.easy-popup-master-corner:not(.open) {
  transform: translateX(0);
  pointer-events: none;
}
.easy-popup-master-corner .easy-popup-overflow {
  overflow: unset;
}
.easy-popup-master-corner .easy-popup-container {
  padding: 0;
}
.easy-popup-master-corner .easy-popup-container .easy-popup-inner {
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  border-radius: var(--ep-radius);
  overflow: hidden;
  max-height: calc(100vh - var(--ep-corner-offset) * 2);
  overflow-y: auto;
}
.easy-popup-master-corner.top-left {
  top: var(--ep-corner-offset);
  left: var(--ep-corner-offset);
}
.easy-popup-master-corner.top-right {
  top: var(--ep-corner-offset);
  right: var(--ep-corner-offset);
}
.easy-popup-master-corner.bottom-left {
  bottom: var(--ep-corner-offset);
  left: var(--ep-corner-offset);
}
.easy-popup-master-corner.bottom-right {
  bottom: var(--ep-corner-offset);
  right: var(--ep-corner-offset);
}
.easy-popup-master-corner .ep-close-button {
  transform: translate(0);
}
@media only screen and (max-width: 1023px) {
  .easy-popup-master-corner {
    --ep-corner-offset: 0px;
    --ep-padding: 15px;
    padding: var(--ep-padding);
  }
  .easy-popup-master-corner .easy-popup-container .easy-popup-inner {
    max-height: calc(100vh - var(--ep-padding) * 2);
  }
}
.easy-popup-master-corner.is-slide-rlt:not(.open) {
  transform: translateX(100%);
}
.easy-popup-master-corner.is-slide-lrt:not(.open) {
  transform: translateX(-100%);
}

/* prevent scroll */
.ep-prevent-scroll {
  overflow: hidden;
  padding-right: var(--ep-scroll-bar-w);
}