/* Estilos dinámicos para las tarjetas de servicios */
/* Este archivo contiene estilos que se generan dinámicamente con PHP */

/* Estilos base para las tarjetas de servicios dinámicas */
.section-servicios__item {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

/* Estilos específicos para cada categoría de servicio */
.service-item-pruebas-adn {
    background:
        linear-gradient(
            0deg,
            rgba(0, 80, 255, 1) 0%,
            rgba(168, 218, 255, 0) 100%
        ),
        url('/assets/img/img-services/adn-services.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.service-item-pruebas-embarazo {
    background:
        linear-gradient(
            0deg,
            rgba(0, 80, 255, 1) 0%,
            rgba(168, 218, 255, 0) 100%
        ),
        url('/assets/img/img-services/prueba-embarazo.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.service-item-examenes-ocupacionales {
    background:
        linear-gradient(
            0deg,
            rgba(0, 80, 255, 1) 0%,
            rgba(168, 218, 255, 0) 100%
        ),
        url('/assets/img/img-services/medicina-laboral.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.service-item-examenes-medicos {
    background:
        linear-gradient(
            0deg,
            rgba(0, 80, 255, 1) 0%,
            rgba(168, 218, 255, 0) 100%
        ),
        url('/assets/img/img-services/ets.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

/* Estilos por defecto para servicios sin categoría específica */
.service-item-default {
    background:
        linear-gradient(
            0deg,
            rgba(0, 80, 255, 1) 0%,
            rgba(168, 218, 255, 0) 100%
        ),
        url('/assets/img/img-services/adn-services.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

/* Estilos para imágenes personalizadas */
.service-item-custom {
    background:
        linear-gradient(
            0deg,
            rgba(0, 80, 255, 1) 0%,
            rgba(168, 218, 255, 0) 100%
        );
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

/* Responsive para dispositivos móviles */
@media (max-width: 743px) {
    .section-servicios__item {
        background-size: cover;
        background-position: center;
    }
}

@media (min-width: 744px) {
    .section-servicios__item {
        background-size: cover;
        background-position: center;
    }
}

@media (min-width: 1100px) {
    .section-servicios__item {
        background-size: cover;
        background-position: center;
    }
}