/* modal-month-switch-overlay.css - .month-switch-overlay: loading overlay during calendar month transitions */

/* Block: Month Switch Overlay */
.month-switch-overlay {
    }

.month-switch-overlay--active {
    }

.month-switch-overlay__progress {
    }

.month-switch-overlay__ring-wrap {
    }

.month-switch-overlay__svg {
    }

.month-switch-overlay__track {
    }

.month-switch-overlay__fill {
    fill: none;
    stroke: #ffffff;
    stroke-width: 12;
    stroke-linecap: round;
    stroke-dasharray: 302;
    stroke-dashoffset: 302;
    transition: stroke-dashoffset 0.14s linear;
    will-change: stroke-dashoffset;
    filter: drop-shadow(0 0 14px rgba(255, 255, 255, 0.66)) drop-shadow(0 0 28px rgba(255, 255, 255, 0.4));
    animation: monthSwitchRingHypnotic 1.05s ease-in-out infinite;
}

@keyframes monthSwitchRingHypnotic {

    0%,
    100% {
        transform: scale(1);
        filter: drop-shadow(0 0 12px rgba(255, 255, 255, 0.5)) drop-shadow(0 0 20px rgba(255, 255, 255, 0.28));
    }

    50% {
        transform: scale(1.045);
        filter: drop-shadow(0 0 20px rgba(255, 255, 255, 0.9)) drop-shadow(0 0 36px rgba(255, 255, 255, 0.45));
    }
}

@keyframes monthSwitchValueHypnotic {

    0%,
    100% {
        opacity: 0.88;
        transform: scale(1);
    }

    50% {
        opacity: 1;
        transform: scale(1.06);
    }
}