/* --- Ideas Board --- */

.ideas-hero {
    background-image:
        radial-gradient(circle at 20% 50%, rgba(139, 92, 246, 0.08) 0%, transparent 50%),
        radial-gradient(circle at 80% 20%, rgba(16, 185, 129, 0.06) 0%, transparent 40%);
}

.ideas-stat-pill {
    transition: transform 0.2s ease, border-color 0.2s ease;
}

.ideas-stat-pill:hover {
    transform: translateY(-2px);
    border-color: rgba(255, 255, 255, 0.2);
}

/* Card entrance */
.idea-card {
    animation: idea-card-in 0.45s ease both;
}

.idea-card:nth-child(1) { animation-delay: 0.04s; }
.idea-card:nth-child(2) { animation-delay: 0.08s; }
.idea-card:nth-child(3) { animation-delay: 0.12s; }
.idea-card:nth-child(4) { animation-delay: 0.16s; }
.idea-card:nth-child(5) { animation-delay: 0.20s; }

@keyframes idea-card-in {
    from {
        opacity: 0;
        transform: translateY(12px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Top-3 rank styling */
.ideas-rank-gold {
    background: linear-gradient(135deg, #fffbeb 0%, #ffffff 40%);
    ring-color: rgba(251, 191, 36, 0.3);
}

.ideas-rank-gold .ideas-rank-badge {
    background: linear-gradient(135deg, #fbbf24, #f59e0b);
    color: #fff;
    box-shadow: 0 2px 8px rgba(245, 158, 11, 0.35);
}

.ideas-rank-silver {
    background: linear-gradient(135deg, #f8fafc 0%, #ffffff 40%);
}

.ideas-rank-silver .ideas-rank-badge {
    background: linear-gradient(135deg, #94a3b8, #64748b);
    color: #fff;
    box-shadow: 0 2px 8px rgba(100, 116, 139, 0.3);
}

.ideas-rank-bronze {
    background: linear-gradient(135deg, #fff7ed 0%, #ffffff 40%);
}

.ideas-rank-bronze .ideas-rank-badge {
    background: linear-gradient(135deg, #fb923c, #ea580c);
    color: #fff;
    box-shadow: 0 2px 8px rgba(234, 88, 12, 0.3);
}

.ideas-rank-default .ideas-rank-badge {
    background: #f3f4f6;
    color: #6b7280;
}

/* Vote button pulse on HTMX swap */
.idea-vote-btn.is-voted .fa-caret-up,
.idea-vote-btn.htmx-request .fa-caret-up {
    animation: vote-pop 0.35s ease;
}

@keyframes vote-pop {
    0%   { transform: scale(1); }
    40%  { transform: scale(1.35); }
    100% { transform: scale(1); }
}

.idea-vote-btn.htmx-request {
    opacity: 0.7;
    pointer-events: none;
}

/* Success toast */
.ideas-toast {
    animation: toast-in 0.4s cubic-bezier(0.16, 1, 0.3, 1) both;
}

.ideas-toast.is-hiding {
    animation: toast-out 0.3s ease forwards;
}

@keyframes toast-in {
    from {
        opacity: 0;
        transform: translateY(-8px) scale(0.97);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes toast-out {
    to {
        opacity: 0;
        transform: translateY(-8px);
    }
}

/* Modal slide-up on mobile */
.ideas-modal-panel {
    animation: modal-in 0.35s cubic-bezier(0.16, 1, 0.3, 1) both;
}

@keyframes modal-in {
    from {
        opacity: 0;
        transform: translateY(24px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* FAB pulse */
.ideas-fab {
    animation: fab-pulse 3s ease-in-out infinite;
}

@keyframes fab-pulse {
    0%, 100% { box-shadow: 0 8px 24px rgba(124, 58, 237, 0.4); }
    50%       { box-shadow: 0 8px 32px rgba(124, 58, 237, 0.6); }
}

/* Line clamp fallback */
.line-clamp-3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

@media (prefers-reduced-motion: reduce) {
    .idea-card,
    .ideas-toast,
    .ideas-modal-panel,
    .ideas-fab {
        animation: none !important;
    }
}