.inline-flex {
    position: relative;
}

.inline-flex[data-tooltip]:hover::after {
    content: attr(data-tooltip);
    position: absolute;
    top: 25px;
    left: -55px;
    transform: translateX(-50%);
    background-color: #333;
    color: #fff;
    padding: 5px;
    border-radius: 4px;
    font-size: 12px;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
    width: 250px;
    z-index: 30;
    text-transform: initial;

}

.inline-flex[data-tooltip]:hover::after {
    opacity: 1;
    visibility: visible;
}


.group\/seller:hover .group-hover\/seller\:ring-primary {
    --tw-ring-color: #000;
}


@keyframes fall {
    from {
        height:30%;
        top:-1000px;
        transform: translateY(-10vh);
        opacity: 0;
    }
    to {
        height:100%;
        top:0;
        transform: translateY(0);
        opacity: 1;
    }
}

.falling-block {
    position:relative;
    animation: fall 1s ease-out forwards;
    animation-delay: 0.2s;
}

/*@keyframes fallAndSettle {*/
/*    0% {*/
/*        opacity: 0;*/
/*        transform: translateY(0);*/
/*    }*/
/*    20% {*/
/*        opacity: 1;*/
/*    }*/
/*    100% {*/
/*        opacity: 1;*/
/*        !*transform: translateY(calc(100vh + var(--i) * (280px + 24px)));*!*/
/*    }*/
/*}*/


/*.card-block {*/
/*    !*margin-top: -100vh;*!*/
/*    !*animation: .5s cubic-bezier(0.4, 0, 0.2, 1) 0s 1 normal forwards running fallAndSettle;*!*/

/*}*/

#root {
    max-height: 100vh; /* Ограничиваем высоту */
    overflow-y: auto; /* Включаем прокрутку */
}