/* overlay */
.goverlay {
   background: var(--color-white);
}

@media (min-width: 769px) {
   .goverlay {
      background: var(--color-white);
   }
}

/* container */
.ginner-container.desc-bottom.gvideo-container {
   display: flex;
   flex-direction: column;
   height: 100svh;
}

/* image */
.gslide-media.gslide-image {
   flex: 0 1 90%;
}

.gslide-media.gslide-image > img {
   margin-top: var(--y);
   margin-bottom: var(--x);
   border-radius: var(--radius-sm);
   max-height: calc(90svh - var(--y) - var(--x)) !important;
   overflow: hidden;
}

/* video */
.gslide-media.gslide-video {
   flex: 0 1 90%;
   padding: var(--x);
}

.gslide-video .gvideo-wrapper {
   border-radius: var(--radius-sm);
   overflow: hidden;
}

/* caption */
.gslide-description {
   flex: 0 1 10%;
   padding: var(--x);
   max-width: unset !important;
}

.gslide-description h1,
.gslide-description h2,
.gslide-description h1 + span {
   display: inline-block;
   font-size: var(--font-size-title-sm);
   line-height: var(--line-height-title-sm);
}

.gslide-description h4 {
   margin-top: var(--margin-s);
}

/* toolbar */
.gtoolbar {
   display: flex;
   position: absolute;
   right: 0;
   bottom: 0;
   column-gap: var(--margin-m);
   padding: var(--x);
}

.gtoolbar button {
   background-color: transparent;
}

.gtoolbar button > svg {
   aspect-ratio: 1 / 1;
   width: var(--font-size-body-m);
}

/* pagination */
.gpagination {
   display: flex;
   align-items: center;
}

.gpagination > .separator {
   margin: 0 0.25em;
}

/* navigation */
.gnavigation {
   display: flex;
   column-gap: var(--margin-s);
   flex-direction: row-reverse;
}

/* disabled */
.gclose.disabled,
.gnext.disabled,
.gprev.disabled {
   opacity: 1;
}

.gclose.disabled > svg,
.gnext.disabled > svg,
.gprev.disabled > svg {
   fill: var(--color-gray);
}

/* animation */
.gcustomFadeIn {
   animation: gcustomFadeIn 600ms ease;
}

.gcustomFadeOut {
   animation: gcustomFadeOut 300ms ease;
}

@keyframes gcustomFadeIn {
   from {
      opacity: 0;
   }
   to {
      opacity: 1;
   }
}

@keyframes gcustomFadeOut {
   from {
      opacity: 1;
   }
   to {
      opacity: 0;
   }
}
