/* Event timeline — grouped-by-day list, shared by the events page, chapter detail
   and the My-events page. Re-themed from the retired style.css .gai-* block. */
.timeline-wrap { max-width: 760px; margin: 0 auto; }
.timeline-empty { text-align: center; color: var(--text-muted); padding: 44px 0; }

.gai-timeline { position: relative; }
.gai-day { display: grid; grid-template-columns: 150px 1fr; gap: 24px; padding: 20px 0; border-top: 1px solid var(--border); }
.gai-day:first-child { border-top: none; padding-top: 4px; }
.gai-day-header { position: sticky; top: 90px; align-self: start; display: flex; align-items: flex-start; gap: 10px; padding-top: 8px; }
.gai-day-num { font: 700 2.2rem 'Space Grotesk', sans-serif; line-height: 1; letter-spacing: -0.02em; color: var(--ink); }
.gai-day-meta { line-height: 1.2; }
.gai-day-weekday { font-weight: 600; color: var(--ink); }
.gai-day-month { color: var(--text-muted); font-size: 0.85rem; }
.gai-day-events { display: flex; flex-direction: column; gap: 14px; }

.gai-event { display: grid; grid-template-columns: 1fr auto; gap: 16px; padding: 18px 20px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-card); color: var(--ink); box-shadow: var(--shadow-card); transition: border-color 200ms ease-out, transform 200ms ease-out; }
.gai-event:hover { border-color: var(--orange); transform: translateY(-1px); color: var(--ink); }
.gai-event-body { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.gai-event-time { font: 500 0.85rem 'Space Grotesk', sans-serif; font-feature-settings: "tnum"; color: var(--orange-deep); letter-spacing: 0.02em; }
.gai-event-tz { margin-left: 8px; font-size: 0.75rem; color: var(--text-muted); }
.gai-event-title { font-size: 1.1rem; font-weight: 650; margin: 0; color: var(--ink); line-height: 1.3; letter-spacing: -0.01em; overflow-wrap: anywhere; }
.gai-event-meta { display: flex; flex-wrap: wrap; gap: 4px 16px; color: var(--text-muted); font-size: 0.9rem; margin-top: 2px; }
.gai-event-meta span { display: inline-flex; align-items: center; gap: 6px; }
.gai-event-tags { margin-top: 6px; display: flex; flex-wrap: wrap; gap: 6px; }

.gai-tag { display: inline-block; font: 600 0.72rem 'Space Grotesk', sans-serif; padding: 3px 10px; border-radius: 999px; }
.gai-tag-online { background: var(--blue-tint); color: var(--blue-deep); }
.gai-tag-inperson { background: var(--live-tint); color: var(--live); }
.gai-tag-hybrid { background: var(--orange-tint); color: var(--orange-deep); }
/* partner / external events: outlined pill + a blue left accent so they read as "not a GAIC-hosted event" */
.gai-tag-external { background: transparent; color: var(--text-muted); border: 1px solid var(--border); }
.gai-event.is-external { border-left: 3px solid var(--blue); }
.gai-event.is-external:hover { border-left-color: var(--blue); }

@media (max-width: 640px) {
  .gai-day { grid-template-columns: 1fr; gap: 10px; }
  .gai-day-header { position: static; padding-top: 0; }
}

/* event thumbnail on the right of a timeline card (chapter detail) */
.gai-event-thumb { align-self: center; justify-self: end; width: 104px; height: 104px; border-radius: var(--r-media); overflow: hidden; border: 1px solid var(--border); flex: none; background: var(--cream); }
.gai-event-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 640px) { .gai-event { grid-template-columns: 1fr; } .gai-event-thumb { justify-self: stretch; width: 100%; height: 160px; order: -1; } }