/**
 * Override CSS - Eventos - Villa del Totoral
 * 
 * Ajusta los tamaños de fuente para la vista de eventos en villatotoral.
 * El template usa html { font-size: 62.5% } (1rem = 10px)
 * 
 * Ubicación: /templates/villatotoral/assets/css/views/eventos.css
 */

/* ========================================
   EVENTO AMPLIADO
   ======================================== */

#evento_ampliado .descripcion-evento {
    font-size: 1.6rem; /* 16px - igual que desarrollo-noticia */
    line-height: 1.8;
    color: #333;
    max-width: 800px;
}
#evento_ampliado .fecha-evento-ampliado{
    font-size: 1.5rem;
}
.compartir-redes span{
    font-size: 1.2rem;
}
#evento_ampliado .descripcion-evento p {
    margin-bottom: 2rem;
}

/* ========================================
   CALENDARIO
   ======================================== */

/* Días con eventos - círculo verde oscuro */
.dia_con_evento {
    background: var(--color-success) !important;
    color: var(--color-blanco) !important;
    font-weight: 600;
    border-radius: 50%;
    width: 3.5rem;
    height: 3.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* Días feriados - círculo verde claro */
.dia_feriado {
    background: var(--color-secondary) !important;
    color: var(--color-blanco) !important;
    font-weight: 600;
    border-radius: 50%;
    width: 3.5rem;
    height: 3.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* Día con evento Y feriado - gradiente diagonal */
.dia_con_evento_y_feriado {
    background: linear-gradient(135deg, var(--color-success) 50%, var(--color-secondary) 50%) !important;
    color: var(--color-blanco) !important;
    font-weight: 600;
    border-radius: 50%;
    width: 3.5rem;
    height: 3.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}


/* ========================================
   LISTA DE EVENTOS - FERIADOS
   ======================================== */

/* Fecha de feriado en la lista lateral */
.fecha_feriado {
    border-radius: 1.5rem;
    background-color: var(--color-secondary) !important;
    color: var(--color-blanco) !important;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 5.5rem;
    height: 5.5rem;
    flex-shrink: 0;
}

.fecha_feriado .dia_evento {
    font-weight: 500;
    font-size: 1.8rem;
    line-height: 1.8rem;
}

.fecha_feriado .mes_evento {
    font-size: 1.3rem;
    text-transform: uppercase;
}

/* ========================================
   PAGINACIÓN
   ======================================== */

#eventos .pagination {
    margin-top: 3rem;
}

#eventos .pagination .page-item .page-link {
    font-size: 1.4rem !important; /* 14px */
    padding: 0.8rem 1.2rem !important;
    color: var(--color-primary) !important;
    background-color: #fff !important;
    border: 2px solid #e0e0e0 !important;
    border-radius: 0.5rem !important;
    margin: 0 0.3rem;
    font-weight: 600;
    transition: all 0.3s ease;
}

#eventos .pagination .page-item .page-link:hover {
    background-color: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
    color: #fff !important;
}

#eventos .pagination .page-item.active .page-link {
    background-color: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
    color: #fff !important;
    font-weight: 700;
}

#eventos .pagination .page-item .page-link i {
    font-size: 1.2rem;
}

/* ========================================
   RESPONSIVE
   ======================================== */

@media (max-width: 768px) {
    /* Override compartir redes para Villa del Totoral */
    .compartir-redes span {
        font-size: 1.2rem !important; /* 12px - antes 0.8rem (8px) en general */
    }
    
    #eventos .pagination .page-item .page-link {
        font-size: 1.2rem !important;
        padding: 0.6rem 1rem !important;
    }
}