/* Stack */
.tss-card-container {
    padding: 2px;
}

.tss-card {
    height: calc(100% - 4px);
    width: calc(100% - 4px);
    display: flex;
    padding: 16px;
    position: relative;
    opacity: 0;
    -webkit-transform: translate3d(0, 48px, 0);
    transform: translate3d(0, 48px, 0);
    -webkit-transition: opacity 300ms cubic-bezier(0.1, 0.9, 0.2, 1) 0.05s,-webkit-transform 300ms cubic-bezier(0.1, 0.9, 0.2, 1);
    transition: opacity 300ms cubic-bezier(0.1, 0.9, 0.2, 1) 0.05s,-webkit-transform 300ms cubic-bezier(0.1, 0.9, 0.2, 1);
    transition: transform 300ms cubic-bezier(0.1, 0.9, 0.2, 1),opacity 300ms cubic-bezier(0.1, 0.9, 0.2, 1) 0.05s;
    transition: transform 300ms cubic-bezier(0.1, 0.9, 0.2, 1),opacity 300ms cubic-bezier(0.1, 0.9, 0.2, 1) 0.05s,-webkit-transform 300ms cubic-bezier(0.1, 0.9, 0.2, 1);
    background: var(--tss-default-background-color);
    border-radius: 2px;
    background-clip: padding-box;
    -webkit-box-shadow: var(--tss-card-shadow);
    box-shadow: var(--tss-card-shadow);
}

    /*we keep the ismounted for compatibility here*/
    .tss-card.ismounted {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    .tss-card.tss-ismounted {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    .tss-card.tss-noanimation {

        transition: unset !important;
    }

.tss-card-container.tss-small > .tss-card {
    padding: 2px 8px 2px 8px;
    margin-bottom: 2px;
}

.tss-card.tss-card-hover {
}

.tss-card.tss-card-hover:hover {
    background-color: var(--tss-default-background-hover-color);
}

.tss-card.tss-card-hover:active {
    background-color: var(--tss-default-background-hover-color);
}
