/**
 * @package     Joomla.Site
 * @subpackage  mod_noticias_slider
 *
 * @copyright   Copyright (C) 2026 Rogelio Tello. Todos los derechos reservados.
 * @license     GNU General Public License version 2 or later
 */

/* Estilos generales */
.mod-noticias-slider {
    --primary-color: #0d6efd;
    --transition-speed: 0.3s;
}

/* Efecto hover para cards secundarias */
.hover-lift {
    transition: transform var(--transition-speed) ease, box-shadow var(--transition-speed) ease;
}

.hover-lift:hover {
    transform: translateY(-5px);
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
}

/* Transición para imágenes */
.transition-scale {
    transition: transform var(--transition-speed) ease;
}

.hover-lift:hover .transition-scale {
    transform: scale(1.05);
}

/* Artículo principal */
.articulo-principal .card-img-overlay {
    opacity: 0;
    transition: opacity var(--transition-speed) ease;
}

.articulo-principal:hover .card-img-overlay {
    opacity: 1;
}

.articulo-principal .card-img-overlay {
    opacity: 0.9;
}

/* Badges personalizados */
.badge.bg-light {
    background-color: #f8f9fa !important;
    color: #212529 !important;
    font-weight: 500;
    padding: 0.35em 0.65em;
}

/* Estilos responsivos */
@media (max-width: 768px) {
    .articulo-principal h3 {
        font-size: 1.5rem;
    }
}

@media (max-width: 576px) {
    .articulo-principal h3 {
        font-size: 1.25rem;
    }
    
    .articulos-secundarios .card-title {
        font-size: 0.9rem;
    }
}

/* Mejoras de accesibilidad */
a:focus-visible {
    outline: 2px solid var(--primary-color);
    outline-offset: 2px;
}

/* Animación de carga */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.articulos-secundarios .col-sm-* {
    animation: fadeIn 0.5s ease forwards;
}

/* Efecto de superposición en hover */
.articulo-principal .card-img-overlay {
    background: linear-gradient(0deg, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.3) 70%, rgba(0,0,0,0) 100%);
}