/* * assets/css/estilos.css
 * Aquí ponemos nuestros ajustes finos sobre Tailwind
 */

body {
    font-family: 'Segoe UI', sans-serif;
    background-color: #f3f4f6; /* Gris muy suave */
}

/* Efecto hover para las tarjetas de producto */
.card-producto {
    transition: all 0.2s ease-in-out;
}

.card-producto:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
}

/* Animación del Modal */
@keyframes aparecer {
    from { opacity: 0; transform: scale(0.95); }
    to { opacity: 1; transform: scale(1); }
}

.modal-content {
    animation: aparecer 0.2s ease-out forwards;
}

/* Estilo para el contador del carrito */
.badge-cart {
    animation: bump 0.2s;
}

@keyframes bump {
    0% { transform: scale(1); }
    50% { transform: scale(1.2); }
    100% { transform: scale(1); }
}