/* Popups */
.popup {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 99;

    display: flex;
    justify-content: center;
    align-items: center;

    width: 100%;
    height: 100dvh;

    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    transition: opacity 0.3s ease, visibility 0.3s ease 0.3s;

    overflow-y: auto;
}

.popup.is-active {
    opacity: 1;
    visibility: visible;
    pointer-events: all;

    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.popup.is-active .popup__overlay {
    background-color: rgba(0,0,0,.8);
}

.popup__overlay {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 1;

    transition: background-color 0.3s ease;
}

.popup__close {
    position: absolute;
    right: 15px;
    top: 15px;
    z-index: 1;

    padding: 10px;

    color: #ffffff !important;

    border-radius: 0 !important;
    box-shadow: none !important;
    background-color: transparent !important;

    cursor: pointer;
}

.logged-in .popup__close {
    top: 47px;
}

.popup__wrapper {
    display: flex;
    justify-content: center;
    align-items: center;

    margin: auto;
}

.popup__inner {
    position: relative;
    z-index: 1;

    max-width: 90vw;
    width: 100%;
    padding: 40px 0;
}

@media screen and (max-width: 1024px) {
    .popup__inner {
        max-width: 95vw;
    }
}

.popup__video {
    width: 90vw;
}

@media screen and (max-width: 1024px) {
    .popup__video {
        width: 95vw;
    }
}

.popup__video iframe {
    max-height: 80vh;

    aspect-ratio: 1.77;
}


/* Full Height Video */
.elementor-widget-full_height_video_widget {
    height: 100%;
    width: 100%;
}
@media screen and (max-width: 1024px) {
    .elementor-widget-full_height_video_widget {
        height: 100vw;
    }
}

.full-height-video {
    height: 100%;
    width: 100%;
}

.full-height-video__button {
    position: relative;

    width: 100%;
    height: 100%;
    padding: 0;

    border-radius: 0 !important;
    box-shadow: none !important;
    background-color: #000000 !important;

    overflow: hidden;

    cursor: pointer;
}

.full-height-video__icon {
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 1;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 96px;
    height: 96px;

    color: #FFFFFF;

    border: 2px solid #ffffff;
    border-radius: 50%;

    transform: translate(-50%, -50%);
}

.full-height-video__icon svg {
    width: 20px;
    height: auto;
}

.full-height-video__button iframe {
    height: 100%;

    transform: scale(1.26);

    pointer-events: none;
}


/* Video Slider */
.video-slider {

}

.video-slider__slider {
    /* width: 100%; */
    margin: -20px -15px;
    padding: 20px 15px;
}

.video-slider__slider__navigation__button {
    position: absolute;
    top: 50%;
    z-index: 2;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 50px;
    height: 50px;
    padding: 0;

    font-size: 26px !important;
    font-weight: 600;

    background-color: #4592BD !important;

    transform: translateY(-50%);

    cursor: pointer;
}

.video-slider__slider__navigation__button.swiper-button-disabled {
    opacity: 0.6;

    user-select: none;
}

.video-slider__slider__navigation__button.swiper-button-disabled:hover {
    color: #022551;

    box-shadow: none !important;
}

.video-slider__slider__navigation__button__prev {
    left: -10px;
}

.video-slider__slider__navigation__button__next {
    right: -10px;
}

.video-slider__slide {
    overflow: unset !important;
}

.video-slider__slide__video-card {
    display: flex;
    flex-direction: column;

    background: #f8f9fc;
    border-radius: 16px;
    box-shadow: 0 6px 18px rgba(0,0,0,.1);
    border: 2px solid #E7EDF8;

    overflow: hidden;
}

.swiper-no-swiping-card {
    pointer-events: none !important;
}

.swiper-no-swiping-card .video-slider__slide__video-card {
    pointer-events: all !important;
}

.swiper-no-swiping-card .video-slider__slider__navigation__button {
    pointer-events: all !important;
}

.video-slider__slide__video-card__footer {
    padding: 12px 14px 16px;

    text-align: center;
}

.video-slider__slide__video-card__title {
    font-family: 'Poppins', sans-serif;
    font-weight: 600;
    text-align: center;
    color: #4592BD;

    transition: opacity 0.15s ease;
}

.video-slider__slide__video-card__title:hover {
    text-decoration: underline;
    opacity: 0.8;
}

.video-slider__slide__video-card__media {
    position: relative;

    width: 100%;
    padding: 0;

    background-position: center;
    background-size: cover;
    border: none;
    box-shadow: none !important;
    border-radius: 0 !important;

    cursor: pointer;
}

.video-slider__slide__video-card__media:hover .video-slider__slide__video-card__play {
    transform: scale(1.15);
}

.video-slider__slide__video-card__media::after {
    content: '';
    display: block;

    padding-bottom: 177.52808988764045%;
}

@media screen and (max-width: 767px) {
    .video-slider__slide__video-card__media::after {
        padding-bottom: 120%;
    }
}

.video-slider__slide__video-card__play {
    position: absolute;
    top: calc(50% - 35px);
    left: calc(50% - 35px);

    display: flex;
    justify-content: center;
    align-items: center;

    width: 70px;
    height: 70px;

    border-radius: 50%;
    background-color: #ffffff;

    transition: transform 0.2s ease;
}

.video-slider__slide__video-card__play svg {
    color: #022051;
}

.video-slider__slide__video-card__player-container {
    position: absolute;
    left: 0;
    top: 0;

    width: 100%;
    height: 100%;
}

.video-slider__slide__video-card__player-container video {
    position: absolute;
    left: 0;
    top: 0;

    width: 100%;
    height: 100%;
}

@media screen and (max-width: 767px) {
    .video-slider__slide__video-card__player-container video {
        object-fit: cover;
    }
}
