/* Live giveaway ticker */
:root {
    --ticker-green: #00ff66;
    --ticker-green-dark: #00b84f;
}

.giveaway-ticker-section {
    background: radial-gradient(circle at top, rgba(0, 255, 102, 0.08) 0%, rgba(38, 152, 70, 0.04) 35%, transparent 70%),
        linear-gradient(135deg, rgba(38, 152, 70, 0.08) 0%, rgba(100, 49, 92, 0.06) 100%);
    border-radius: 24px;
    padding: 2.5rem 2rem;
    border: 1px solid rgba(0, 255, 102, 0.18);
    margin-bottom: 2.5rem;
}

.giveaway-ticker-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}

.giveaway-ticker-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.35rem 0.9rem;
    border-radius: 999px;
    background: rgba(0, 255, 102, 0.12);
    color: var(--ticker-green-dark);
    font-weight: 700;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.giveaway-ticker-lights {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.giveaway-ticker-lights span {
    width: 6px;
    height: 6px;
    border-radius: 999px;
    background: var(--ticker-green);
    box-shadow: 0 0 10px rgba(0, 255, 102, 0.6);
    animation: tickerGlow 2.4s ease-in-out infinite;
}

.giveaway-ticker-lights span:nth-child(2) {
    animation-delay: 0.4s;
}

.giveaway-ticker-lights span:nth-child(3) {
    animation-delay: 0.8s;
}

.giveaway-ticker-title {
    margin: 0.75rem 0 0.25rem;
    font-weight: 700;
    color: #1f2533;
    font-size: 1.05rem;
    line-height: 1.35;
    min-height: calc(1.35em * 2);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.giveaway-ticker-subtitle {
    margin: 0;
    color: #3a4457;
    max-width: 560px;
    font-weight: 600;
}

.giveaway-ticker {
    position: relative;
    overflow: hidden;
}

.giveaway-ticker-track {
    display: flex;
    gap: 1rem;
    transition: transform 0.6s ease;
    will-change: transform;
    padding-bottom: 0.25rem;
}

.giveaway-ticker-item {
    flex: 0 0 clamp(240px, 30vw, 330px);
    background: #fff;
    border-radius: 18px;
    border: 1px solid rgba(0, 255, 102, 0.18);
    padding: 1.25rem;
    box-shadow: 0 12px 24px rgba(16, 24, 40, 0.08);
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.giveaway-ticker-media {
    width: 100%;
    aspect-ratio: 16 / 9;
    border-radius: 14px;
    overflow: hidden;
    background: #f1f3f5;
    box-shadow: 0 10px 18px rgba(15, 23, 42, 0.12);
}

.giveaway-ticker-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.giveaway-ticker-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    font-size: 0.85rem;
}

.giveaway-ticker-live {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    color: var(--ticker-green-dark);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.giveaway-ticker-dot {
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: var(--ticker-green);
    box-shadow: 0 0 0 0 rgba(0, 255, 102, 0.6);
    animation: tickerPulse 1.6s ease-out infinite;
}

.giveaway-ticker-countdown {
    background: rgba(255, 193, 7, 0.18);
    color: #7a5a00;
    padding: 0.25rem 0.6rem;
    border-radius: 999px;
    font-weight: 700;
    font-size: 0.8rem;
}

.giveaway-ticker-prize {
    margin: 0;
    color: #5c6472;
    font-size: 0.9rem;
    display: flex;
    align-items: flex-start;
    gap: 0.4rem;
    line-height: 1.35;
    min-height: calc(1.35em * 2);
}

.giveaway-ticker-prize-text {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.giveaway-ticker-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    font-size: 0.85rem;
    color: #5c6472;
}

.giveaway-ticker-meta strong {
    color: #1f2533;
}

.giveaway-ticker-footer {
    margin-top: auto;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.giveaway-ticker-actions {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

@keyframes tickerPulse {
    0% {
        box-shadow: 0 0 0 0 rgba(0, 255, 102, 0.6);
    }
    70% {
        box-shadow: 0 0 0 10px rgba(0, 255, 102, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(0, 255, 102, 0);
    }
}

@keyframes tickerGlow {
    0%,
    100% {
        opacity: 0.6;
        transform: scale(0.9);
    }
    50% {
        opacity: 1;
        transform: scale(1.2);
    }
}

@media (max-width: 768px) {
    .giveaway-ticker-section {
        padding: 2rem 1.25rem;
    }

    .giveaway-ticker-header {
        flex-direction: column;
        align-items: flex-start;
    }

    .giveaway-ticker-item {
        flex: 0 0 clamp(220px, 80vw, 320px);
    }
}

/* Upcoming giveaway panel */
.giveaway-upcoming-panel {
    background: #f6f8fb;
    border-radius: 22px;
    padding: 2rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
}

.giveaway-upcoming-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}

.giveaway-upcoming-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.35rem 0.85rem;
    border-radius: 999px;
    background: rgba(13, 110, 253, 0.12);
    color: #0d6efd;
    font-weight: 700;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.giveaway-upcoming-subtitle {
    margin: 0;
    color: #475063;
    max-width: 520px;
    font-weight: 600;
}

.giveaway-upcoming-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
}

.giveaway-upcoming-card {
    background: #fff;
    border-radius: 18px;
    border: 1px solid rgba(13, 110, 253, 0.15);
    padding: 1.1rem;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    box-shadow: 0 10px 20px rgba(15, 23, 42, 0.06);
}

.giveaway-upcoming-media {
    width: 100%;
    aspect-ratio: 16 / 9;
    border-radius: 14px;
    overflow: hidden;
    background: #eef2f6;
}

.giveaway-upcoming-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.giveaway-upcoming-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    font-size: 0.8rem;
}

.giveaway-upcoming-countdown {
    background: rgba(255, 193, 7, 0.18);
    color: #7a5a00;
    padding: 0.2rem 0.6rem;
    border-radius: 999px;
    font-weight: 700;
}

.giveaway-upcoming-date {
    color: #6c7586;
    font-weight: 600;
}

.giveaway-upcoming-title {
    margin: 0;
    font-weight: 700;
    font-size: 1rem;
    color: #1f2533;
    line-height: 1.35;
    min-height: calc(1.35em * 2);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.giveaway-upcoming-prize {
    margin: 0;
    color: #5c6472;
    font-size: 0.88rem;
    display: flex;
    gap: 0.4rem;
    line-height: 1.35;
    min-height: calc(1.35em * 2);
}

.giveaway-upcoming-meta {
    font-size: 0.85rem;
    color: #5c6472;
}

@media (max-width: 768px) {
    .giveaway-upcoming-panel {
        padding: 1.5rem;
    }

    .giveaway-upcoming-header {
        flex-direction: column;
        align-items: flex-start;
    }
}

@media (prefers-reduced-motion: reduce) {
    .giveaway-ticker-track {
        transition: none;
    }

    .giveaway-ticker-dot,
    .giveaway-ticker-lights span {
        animation: none;
    }
}
