/*calendar.css*/
/* Controles (Wrapper y Theme Switch)  */
.controls-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 20px;
}
.theme-switch-wrapper {
    display: flex;
    align-items: center;
    gap: 10px;
}
.theme-label {
    font-family: var(--font-condensed);
    font-size: 0.9rem;
    color: var(--color-text-secondary);
}
.theme-switch { position: relative; display: inline-block; width: 50px; height: 28px; }
.theme-switch input { opacity: 0; width: 0; height: 0; }
.slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: var(--color-border); transition: var(--transition); border-radius: 34px; }
.slider:before { position: absolute; content: ""; height: 20px; width: 20px; left: 4px; bottom: 4px; background-color: white; transition: var(--transition); border-radius: 50%; }
input:checked + .slider { background-color: var(--color-primary); }
input:checked + .slider:before { transform: translateX(22px); }


.view-controls {
    display: none; /* <-- Oculto por defecto (Mobile-First) */
    gap: 10px;
}
.view-controls button {
    font-family: var(--font-condensed);
    font-size: 14px;
    padding: 8px 16px;
    border: 1px solid var(--color-border);
    background-color: var(--color-surface);
    color: var(--color-text-secondary);
    border-radius: var(--border-radius);
    cursor: pointer;
    transition: var(--transition);
}
.view-controls button.active {
    background-color: var(--color-primary);
    color: var(--color-black-pantone);
    border-color: var(--color-primary);
    font-weight: 500;
}
.view-controls button:not(.active):hover {
    background-color: var(--color-border);
    color: var(--color-text-primary);
}

/* Estructura del Año  */
.year-header {
    font-family: var(--font-heading);
    font-weight: 500;
    font-size: 2rem;
    color: var(--color-primary);
    border-bottom: 2px solid var(--color-primary);
    padding-bottom: 10px;
    margin: 40px 0 20px 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    user-select: none;
}
.toggle-icon { font-family: monospace; font-size: 1.5rem; transition: transform 0.3s ease; }
.toggle-icon::before { content: '+'; }
.year-header.is-open .toggle-icon::before { content: '−'; }
.year-header.is-open .toggle-icon { transform: rotate(180deg); }

/* --- FIX DE ALTURA: Aumentado de 2000px a 10000px para que quepan todos los eventos de 2026 --- */
.event-list { overflow: hidden; transition: max-height 0.5s ease-out, opacity 0.3s ease; max-height: 10000px; opacity: 1; }
.event-list.collapsed { max-height: 0; opacity: 0; margin: 0; }

/* Estilos del Evento Individual  */
.event-item {
    background-color: transparent;
    margin-bottom: 20px;
    border-radius: var(--border-radius);
    border: 1px solid var(--color-border);
    box-shadow: none;
    display: flex;
    flex-direction: column;
    transition: var(--transition);
}
.event-item:hover {
    border-color: var(--color-gray-7c);
}

/* Técnica de Fondo Desenfocado  */
.event-image {
    position: relative;
    display: block;
    aspect-ratio: 16 / 9;
    overflow: hidden; 
    background-color: var(--color-border);
    background-size: cover;
    background-position: center;
    border-top-left-radius: var(--border-radius);
    border-top-right-radius: var(--border-radius);
}
.event-image::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: inherit; 
    filter: blur(20px) brightness(0.8);
    transform: scale(1.15);
    z-index: 1;
}
.event-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    position: relative;
    z-index: 2;
}

/* Detalles del Evento  */
.event-details {
    padding: 20px;
    background-color: var(--color-surface);
    overflow: hidden;
    border-bottom-left-radius: var(--border-radius);
    border-bottom-right-radius: var(--border-radius);
}
.event-date {
    font-family: var(--font-condensed);
    font-size: 0.9rem;
    font-weight: 400;
    color: var(--color-text-secondary);
    margin-bottom: 8px;
    display: block;
}
.event-title {
    font-family: var(--font-heading);
    font-weight: 500;
    font-size: 1.5rem;
    margin: 0 0 10px 0;
    color: var(--color-text-primary);
}
.event-description {
    font-family: var(--font-body);
    font-weight: 300;
    font-size: 1rem;
    line-height: 1.6;
    margin-bottom: 15px;
    color: var(--color-text-secondary);
}
.event-link {
    font-family: var(--font-heading);
    font-weight: 500;
    color: var(--color-primary);
    text-decoration: none;
    transition: var(--transition);
}
.event-link:hover {
    text-decoration: underline;
}

/* Estilos Dinámicos (Fecha)  */
.event-item.past-event { filter: grayscale(100%); opacity: 0.7; }
.event-item.current-event {
    border-color: var(--color-primary);
    animation: pulse-glow 2.5s infinite ease-in-out;
}
.event-item.current-event .event-title {
    color: var(--color-primary);
}

/* VISTA: Lista/Almanaque (Desktop)  */
@media (min-width: 768px) {
    .view-controls { display: flex; }

    .view-stacked .event-item {
        flex-direction: row;
        align-items: stretch;
    }
    .view-stacked .event-image {
        flex: 0 0 250px;
        border-top-right-radius: 0; 
        border-bottom-left-radius: var(--border-radius); 
    }
    .view-stacked .event-image img { height: 100%; aspect-ratio: auto; }
    .view-stacked .event-details {
        flex: 1;
        padding: 30px;
        border-bottom-left-radius: 0;
        border-top-right-radius: var(--border-radius);
        border-bottom-right-radius: var(--border-radius);
    }
}

/* VISTA: Tarjetas/Cuadrícula  */
.view-cards .event-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 20px;
}
.view-cards .event-item { flex-direction: column; }

.view-cards .event-image {
    border-top-right-radius: var(--border-radius);
    border-bottom-left-radius: 0;
}
.view-cards .event-image img { height: 100%; aspect-ratio: auto; }
.view-cards .event-details {
    padding: 20px;
    border-bottom-left-radius: var(--border-radius);
    border-top-right-radius: 0;
    border-bottom-right-radius: var(--border-radius);
}

/* --- FIX FINAL Y LIMPIO: Espacio Seguro Inferior --- */

/* 1. Aplicamos espacio al contenedor padre */
.event-calendar-container {
    padding-bottom: 150px !important; 
    box-sizing: border-box;
}

/* 2. Aseguramos que el contenido interno fluya */
.event-calendar {
    display: block;
    overflow: visible !important; /* Importante para las sombras */
}