/* assets/css/style.css */



/* Estilos de calendario */



.eventos-calendario-container {

    display: flex;

    gap: 20px;

    flex-wrap: wrap;

}



.eventos-calendario-calendar,

.eventos-calendario-lista {

    flex: 1;

    min-width: 320px;

}



.eventos-calendario-lista h3 {

    margin-top: 0;

}



.eventos-calendario-evento {

    margin-bottom: 20px;

    border-bottom: 1px solid #e1e1e1;

    padding-bottom: 10px;

    overflow: hidden;

}



.eventos-calendario-evento-thumbnail {

    max-width: 125px;

    float: left;

    margin-right: 10px;

}



.eventos-calendario-evento-title {

    margin: 0 0 5px 0;

}



.eventos-calendario-evento-date {

    font-weight: bold;

    margin: 0 0 10px 0;

}



.eventos-calendario-clear {

    clear: both;

}



/* Nuevos estilos adaptados a Unicon para la vista individual */



.evento-imagen img {

    max-height: 500px;

    object-fit: cover;

    width: 100%;

    border-radius: 5px;

    box-shadow: 0 5px 15px rgba(0,0,0,0.15);

}



.evento-fechas {

    padding: 30px;

    border: 1px solid #eee;

    border-radius: 5px;

    box-shadow: 0 3px 15px rgba(0,0,0,0.10);

    max-width: 600px;

    margin: 40px auto;

    background: #fafafa;

}



.evento-contenido {

    padding: 20px 0;

    font-size: 16px;

    line-height: 1.7em;

    color: #333;

}






/* Contenedor principal FullCalendar */

.eventos-calendario-calendar .fc {

    background-color: #fff; /* Fondo blanco para todo el calendario */

    border: 1px solid #ccc; /* Borde general */

    border-radius: 6px;

    font-family: Arial, sans-serif;

}



/* Cabecera con mes y año */

.eventos-calendario-calendar .fc-toolbar-title {

    color: #ff6600; /* Color rojo oscuro */

    font-weight: bold;

    font-size: 1.5em;

}



/* Botones de navegación (flechas, hoy, vistas) */

.eventos-calendario-calendar .fc-button {

    background-color: #ff6600;

    color: white;

    border: none;

    border-radius: 4px;

    padding: 6px 12px;

    cursor: pointer;

    transition: background-color 0.3s ease;

}



.eventos-calendario-calendar .fc-button:hover,

.eventos-calendario-calendar .fc-button:focus {

    background-color: #ff6600;

    outline: none;

}



/* Días de la semana (lun, mar, mié, etc.) */

.eventos-calendario-calendar .fc-col-header-cell-cushion {

    color: #ff6600;

    font-weight: 600;

    font-size: 0.9em;

    text-transform: uppercase;

}



/* Números de cada día */

.eventos-calendario-calendar .fc-daygrid-day-number {

    color: #333;

    font-weight: 600;

}



/* Fondo de cada día (celdas) */

.eventos-calendario-calendar .fc-daygrid-day {

    border: 1px solid #ddd; /* borde suave entre días */

    background-color: #fafafa;

    transition: background-color 0.3s ease;

}



/* Hover sobre un día */

.eventos-calendario-calendar .fc-daygrid-day:hover {

    background-color: #f0e0e0;

    cursor: pointer;

}



/* Día actual (hoy) */

.eventos-calendario-calendar .fc-day-today {

    background-color: #ff6600; /* fondo rojo oscuro */

    color: white !important; /* texto blanco */

    border-color: #ff6600 !important;

    font-weight: bold;

}



/* Eventos */

.eventos-calendario-calendar .fc-event {

    background-color: #ff6600 !important;

    border: none !important;

    color: white !important;

    border-radius: 4px;

    padding: 3px 6px;

    font-size: 0.85em;

    cursor: pointer;

}



/* Al pasar sobre el evento */

.eventos-calendario-calendar .fc-event:hover {

    background-color: #ff6600 !important;

    text-decoration: none;

}



/* Zona de días no pertenecientes al mes actual (por ejemplo, finales o inicios de mes) */

.eventos-calendario-calendar .fc-day-other {

    background-color: #f9f9f9;

    color: #bbb;

}



/* Líneas de división (bordes) */

.eventos-calendario-calendar .fc-scrollgrid-section > table {

    border-collapse: separate;

    border-spacing: 1px;

    border-color: #ddd;

}



/* Texto dentro de eventos y días */

.eventos-calendario-calendar .fc-daygrid-event-title {

    font-weight: 600;

}



/* Botón "Hoy" destacado */

.eventos-calendario-calendar .fc-button.fc-button-primary {

    background-color: #ff6600;

    color: #fff;

}



/* Botón activo (vistas) */

.eventos-calendario-calendar .fc-button.fc-button-active {

    background-color: #ff6600;

    color: #fff;

}