.aflv-live-viewers {
    margin-top: 15px;
    text-align: center;
    display: flex; /* Keeps elements in a row */
    justify-content: center; /* Centers content horizontally */
    align-items: center; /* Aligns elements vertically */
    gap: 5px; /* Space between the eye, number, and text */
    flex-wrap: nowrap; /* Prevents wrapping to a new line */
    overflow: hidden; /* Prevents layout-breaking overflow */
}

.aflv-eye {
    animation: blink 2s infinite; /* Keeps the blink animation */
    font-size: 18px; /* Adjust size of the eye icon */
    flex-shrink: 0; /* Ensures the eye icon doesn't shrink */
}

.aflv-viewer-count {
    font-size: 16px; /* Font size for the number */
    font-weight: bold; /* Bold font for visibility */
    background: linear-gradient(to right, #ff7e5f, #feb47b); /* Gradient text for black background */
    -webkit-background-clip: text; /* Clips gradient to text */
    color: transparent; /* Makes only gradient visible */
}

.aflv-text {
    font-size: 16px; /* Font size for the descriptive text */
    background: linear-gradient(to right, #ff7e5f, #feb47b); /* Same gradient as the number */
    -webkit-background-clip: text; /* Clips gradient to text */
    color: transparent; /* Makes only gradient visible */
}

/* Eye Blink Animation */
@keyframes blink {
    0%, 20%, 60%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.2;
    }
}

/* Mobile-Specific Adjustments */
@media screen and (max-width: 768px) {
    .aflv-live-viewers {
        gap: 3px; /* Reduce space between elements for smaller screens */
    }

    .aflv-viewer-count, .aflv-text {
        font-size: 14px; /* Slightly smaller text on mobile */
    }
}
