/* ==================================================
🔥 ITSSOSO EVENT DISCOVERY SOCIAL PROOF (PREMIUM UI)
================================================== */

/* ==========================================
CARD WRAPPER HOOK
========================================== */

.itssoso-card.event-card {
    position: relative;
    overflow: hidden;
}

/* ==========================================
🔥 SOCIAL PROOF BAR
========================================== */

.itssoso-event-proof {
    position: absolute;
    bottom: 8px;
    left: 8px;
    right: 8px;

    display: flex;
    gap: 8px;
    flex-wrap: wrap;

    background: rgba(0, 0, 0, 0.65);
    backdrop-filter: blur(6px);

    padding: 6px 10px;
    border-radius: 8px;

    font-size: 12px;
    color: #fff;

    z-index: 5;
}

/* Individual Proof Items */

.itssoso-event-proof span {
    display: flex;
    align-items: center;
    gap: 4px;
    font-weight: 500;
}

/* ==========================================
🔥 GOING (PRIMARY SIGNAL)
========================================== */

.proof-going {
    color: #4caf50;
    font-weight: 600;
}

/* ==========================================
⭐ INTERESTED
========================================== */

.proof-interested {
    color: #ffc107;
}

/* ==========================================
⏳ MAYBE
========================================== */

.proof-maybe {
    color: #ccc;
}

/* ==========================================
🔥 TRENDING BADGE
========================================== */

.itssoso-event-badge {
    position: absolute;
    top: 10px;
    left: 10px;

    padding: 5px 10px;
    border-radius: 20px;

    font-size: 11px;
    font-weight: 600;

    z-index: 6;
}

/* Trending State */

.itssoso-event-badge.trending {
    background: linear-gradient(135deg, #ff5722, #ff9800);
    color: #fff;
    box-shadow: 0 2px 6px rgba(0,0,0,0.25);
}

/* ==========================================
🔥 HOVER EFFECT (ENGAGEMENT BOOST)
========================================== */

.itssoso-card.event-card:hover .itssoso-event-proof {
    transform: translateY(-2px);
    transition: all 0.2s ease;
}

/* ==========================================
🔥 LOW ATTENDANCE (OPTIONAL DIM)
========================================== */

.itssoso-event-proof.low {
    opacity: 0.75;
}

/* ==========================================
🔥 HIGH ATTENDANCE GLOW (VIRAL SIGNAL)
========================================== */

.itssoso-card.event-card.popular {
    box-shadow: 0 0 0 2px rgba(255, 152, 0, 0.4);
}

/* ==========================================
MOBILE OPTIMIZATION
========================================== */

@media (max-width: 768px) {

    .itssoso-event-proof {
        font-size: 11px;
        padding: 5px 8px;
    }

    .itssoso-event-badge {
        font-size: 10px;
        padding: 4px 8px;
    }
}