/* Esconder elementos específicos para modo escuro/claro */
.dark-only {
    display: none;
}

.dark .dark-only {
    display: block;
}

.dark .light-only {
    display: none;
}

/* Animação para o botão de voltar ao topo */
@keyframes bounce {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-5px);
    }
}

#backToTop:hover {
    animation: bounce 0.5s ease infinite;
}

/* Estilo para cards de tutoriais */
.tutorial-card {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.tutorial-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

/* Estilos para tags */
.tag-filter {
    transition: all 0.2s ease;
}

.tag-filter.active {
    font-weight: 600;
}

/* Animação para tags */
@keyframes tagPulse {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.05);
    }
    100% {
        transform: scale(1);
    }
}

.tag-filter:hover {
    animation: tagPulse 0.5s ease;
}