.sinalize {
    animation: sinalize;
    animation-duration: 800ms;
}

@keyframes sinalize {
    0%, 100% {
        opacity: 1;
    }

    25%, 75% {
        opacity: 0;
    }

    50% {
        opacity: 1;
    }
}

.modal-content, .card, .category-button, .form-control, .dropdown-menu {
    border-radius: var(--store-border-radius) !important;
}

.store-border-radius {
    border-radius: var(--store-border-radius) !important;
}

.sua-div {
    animation: piscar 1s steps(1) forwards;
}


.cursor-hand {
    cursor: pointer;
}

.font-tiny {
    font-size: 0.8rem;
}

.font-small {
    font-size: 1rem;
}

.font-large {
    font-size: 1.5rem;
}


.no-scrollbar {
    overflow-x: scroll; /* Ativa o scroll horizontal */
    -ms-overflow-style: none; /* Remove a barra no IE e Edge */
    scrollbar-width: none; /* Remove a barra no Firefox */
}

    .no-scrollbar::-webkit-scrollbar {
        display: none; /* Remove a barra no Chrome, Safari e outros */
    }

.category-button {
    cursor: pointer;
    background-size: 100%; /* Tamanho original da imagem */
}

    .category-button:hover {
        background-size: 110%; /* Expande a imagem */
    }

.progress-wrapper {
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--store-header-bg-color);
}

.progress-circle {
    --size: 120px;
    width: var(--size);
    height: var(--size);
    border-radius: 50%;
    background: radial-gradient(closest-side, var(--store-header-bg-color) 80%, transparent 81% 95%), conic-gradient(var(--store-header-bg-color) var(--blazor-load-percentage), var(--store-bg-color) 1%);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    font-size: 1.2rem;
    color: var(--store-color);
    position: relative;
    background-size: 100% 100%;
    backface-visibility: hidden;
    transform: translateZ(0);
    will-change: transform;
}

.progress-label::before {
    content: var(--blazor-load-percentage-text, "0%");
    color: var(--store-name-color);
}