/* Particle container and particles */
.particle-container {
    position: relative;
    display: inline-block;
    overflow: visible;
}

.particle-text {
    position: relative;
    z-index: 10;
    font-style: italic;
    font-weight: 700;
    cursor: default;
}

.particles {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    overflow: visible;
    z-index: 5;
}

.particle {
    position: absolute;
    border-radius: 50%;
    opacity: 0;
    transform: translateX(0) translateY(0) scale(1);
    animation-timing-function: linear;
    animation-fill-mode: forwards;
}

@keyframes shootRightFadeInOut {
    0% {
        opacity: 0;
        transform: translateX(0) translateY(0) scale(1);
    }

    10% {
        opacity: 0.8;
    }

    60% {
        opacity: 0.8;
    }

    100% {
        opacity: 0;
        transform: translateX(var(--max-distance, 100px)) translateY(var(--y-move, 0)) scale(0);
    }
}
/* Red color for "Sách" text */
.particle-container b {
    color: #dc2626; /* Tailwind red-600 */
    position: relative;
    z-index: 10;
    padding: 0 0.25rem;
    /* Extended background with fade out opacity left to right */
    background: linear-gradient(to right, rgba(255, 38, 38, 0.5) 0%, rgba(255, 38, 38, 0.5) 80%, rgba(255, 38, 38, 0.05) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    /* fallback for non-webkit browsers */
    color: #dc2626;
    position: relative;
}
    /* Overlay to show background behind clipped text */
    .particle-container b::before {
        content: '';
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        background: linear-gradient(to right, rgba(220, 220, 220, 0.5) 0%, rgba(220, 220, 220, 0.5) 60%, rgba(220, 220, 220, 0.05) 100%);
        z-index: -1;
        border-top-left-radius: 0.5rem;
        border-bottom-left-radius: 0.5rem;
        /* Scale background width to 1.25 times text width */
        transform-origin: left center;
        transform: scaleX(1.25);
    }
