/* ═══════════════════════════════════════════════════
   LEGO Events Calendar
   ═══════════════════════════════════════════════════ */

.calendar-page { padding: 2.5rem 0; }
.calendar-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 1.5rem; gap: 1rem; flex-wrap: wrap; }
.calendar-title { font-family: var(--font-display); font-size: 1.8rem; font-weight: 700; margin-bottom: .25rem; }
.calendar-filters { display: flex; gap: .75rem; margin-bottom: 1.25rem; flex-wrap: wrap; align-items: center; }
.calendar-filters .form-select { max-width: 220px; font-size: .85rem; }
.calendar-location-bar { display: flex; align-items: center; gap: .5rem; font-size: .85rem; color: var(--color-text-2); background: var(--color-bg); padding: .65rem 1rem; border-radius: var(--radius); margin-bottom: 1.5rem; flex-wrap: wrap; }

.calendar-grid-layout { display: grid; grid-template-columns: 1fr 300px; gap: 2rem; }
.calendar-month { background: var(--color-surface); border-radius: var(--radius-lg); padding: 1.5rem; box-shadow: var(--shadow); }
.calendar-nav { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1.25rem; }
.calendar-month-title { font-family: var(--font-display); font-size: 1.3rem; font-weight: 700; }

.cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 1px; background: var(--color-border); border: 1px solid var(--color-border); border-radius: var(--radius); overflow: hidden; }
.cal-dow { background: var(--color-bg); text-align: center; font-size: .72rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--color-text-3); padding: .5rem .25rem; }
.cal-cell { background: var(--color-surface); min-height: 80px; padding: .35rem; position: relative; }
.cal-empty { background: var(--color-bg); }
.cal-today { background: #F0F3FF; }
.cal-today .cal-day-num { background: var(--color-primary); color: #fff; border-radius: 50%; width: 24px; height: 24px; display: inline-flex; align-items: center; justify-content: center; }
.cal-day-num { font-size: .78rem; font-weight: 600; color: var(--color-text); display: block; margin-bottom: .25rem; }
.cal-event-dot { display: block; font-size: 0; border-radius: 3px; padding: 2px 4px; margin-bottom: 2px; overflow: hidden; text-decoration: none; transition: opacity .15s; }
.cal-event-dot:hover { opacity: .8; }
.cal-event-label { font-size: .62rem; color: #fff; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; line-height: 1.3; }
.cal-event-more { font-size: .62rem; color: var(--color-text-3); }

.cal-legend { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.25rem; padding-top: 1rem; border-top: 1px solid var(--color-border); }
.cal-legend-item { font-size: .72rem; color: var(--color-text-2); display: flex; align-items: center; gap: .3rem; }
.cal-legend-dot { width: 10px; height: 10px; border-radius: 2px; flex-shrink: 0; }

/* Sidebar */
.calendar-sidebar { }
.calendar-sidebar-title { font-family: var(--font-display); font-size: 1.1rem; font-weight: 600; margin-bottom: 1rem; }
.calendar-upcoming-list { list-style: none; display: flex; flex-direction: column; gap: .75rem; }
.upcoming-item { display: flex; gap: .65rem; align-items: flex-start; }
.upcoming-dot { width: 8px; height: 8px; border-radius: 2px; flex-shrink: 0; margin-top: .4rem; }
.upcoming-title { font-size: .88rem; font-weight: 500; color: var(--color-text); }
.upcoming-title:hover { color: var(--color-primary); }
.upcoming-meta { font-size: .75rem; color: var(--color-text-3); margin-top: .15rem; }

/* Event detail page */
.calendar-event-page { padding: 2.5rem 0; }
.event-hero { background: var(--color-surface); border-radius: var(--radius-lg); padding: 2rem; box-shadow: var(--shadow); margin-bottom: 2rem; }
.event-hero-img { width: 100%; max-height: 300px; object-fit: cover; border-radius: var(--radius); margin-bottom: 1.25rem; }
.event-type-badge { display: inline-block; font-size: .68rem; font-weight: 600; color: #fff; padding: .2em .7em; border-radius: 3px; text-transform: uppercase; letter-spacing: .04em; margin-right: .4rem; margin-bottom: .5rem; }
.event-title { font-family: var(--font-display); font-size: 2rem; font-weight: 700; line-height: 1.25; }
.event-details { background: var(--color-surface); border-radius: var(--radius-lg); padding: 1.5rem; box-shadow: var(--shadow); margin-bottom: 2rem; }
.event-detail-row { display: flex; gap: .75rem; padding: .75rem 0; border-bottom: 1px solid var(--color-border); font-size: .92rem; }
.event-detail-row:last-child { border-bottom: none; }
.event-detail-icon { font-size: 1.1rem; flex-shrink: 0; width: 1.75rem; text-align: center; }
.event-body { margin-top: 1.5rem; }

@media (max-width: 900px) {
    .calendar-grid-layout { grid-template-columns: 1fr; }
    .cal-cell { min-height: 60px; }
    .cal-event-label { display: none; }
    .cal-event-dot { width: 8px; height: 8px; display: inline-block; margin: 1px; padding: 0; border-radius: 50%; }
}
