/* TRANSITIONS */
.TransitionOnTransform {
    transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.5s ease-out;
}

.TransitionOnOutOfScreen {
    transition: all 0.6s ease;
}

.TransitionOnAll {
    transition: all 0.6s ease;
}

/* EFFECTS */

.Blur {
    filter: var(--BackgroundFilter);    
}

.Invisible {
    display: none;
    visibility: hidden;
    transform: scale(0.9);
    z-index: var(--HideDepth);
}

.Collapsed {
    visibility: collapse;
    display: none;
}

.Test {
    visibility: collapse;
}

.ScaleOut {
    transform:scale(0.9);
}

.ScaleTranslateHorizontalOut {
    transform:translate(-50%, 0%) scale(0.9);
}

.Hided {
    transform: translate(-50%, -40%) scale(0.8);
    opacity: 0;
    z-index: var(--HideDepth);
}

.OutOfScreen {
    transform: translate(-50%, 100vh) scale(0.8);
    opacity: 0;
}

.MoveFromTop {
    transform: translate(-50%, 100vh) scale(0.9);
}

.Disabled {
    opacity:0.3;
}

.OnlyForSupport {
    display: none;
    visibility: hidden;
}




/* FILTERS */

.ThemeColorFilter {
    filter: var(--ThemeFilterColor);
}


.FulfilledFilter {
    filter: brightness(0) saturate(100%) invert(69%) sepia(26%) saturate(1836%) hue-rotate(47deg) brightness(99%) contrast(88%);
}

.FulfilledPartialFilter {
    filter: brightness(0) saturate(100%) invert(71%) sepia(50%) saturate(1900%) hue-rotate(5deg) brightness(93%) contrast(87%);
}

.FulfilledNoneFilter {
    filter: brightness(0) saturate(100%) invert(11%) sepia(71%) saturate(4601%) hue-rotate(354deg) brightness(103%) contrast(100%);
}


.AcceptFilter {
    filter: brightness(0) saturate(100%) invert(69%) sepia(26%) saturate(1836%) hue-rotate(47deg) brightness(99%) contrast(88%);
}

.DiscardFilter {
    filter: brightness(0) saturate(100%) invert(11%) sepia(71%) saturate(4601%) hue-rotate(354deg) brightness(103%) contrast(100%);
}

.DesaturedFilter {
    filter: saturate(0%);
}