.card {
    position: relative;
    overflow: hidden;
    border: none; /* Eliminar el borde de la tarjeta */
}

.card-img-overlay {
    position: absolute;
    top: 100%; /* Centrar verticalmente si se ve mal, cambiar a 50%*/
    left: 100%; /* Centrar horizontalmente si se ve mal, cambiar a 50%*/
    transform: translate(-50%, -50%);
    background-color: rgba(0, 0, 0, 0.5); /* Fondo transparente opaco */
    color: white;
    width: 30px;
    height: 30px;
    padding: 1rem;
    opacity: 0; /* Ocultar inicialmente */
    transition: opacity 0.3s ease;
    text-align: center; /* Alinear texto al centro */
    box-sizing: border-box; /* Ajustar caja */
}

.card:hover .card-img-overlay {
    opacity: 1; /* Mostrar al hacer hover */
}

.info-product {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.7); /* Fondo transparente opaco */
    color: white;
    padding: 1rem;
}