/* Event agenda - programme with day tabs, a time rail and now/next markers,
   plus the calendar-kit menu (.cal-*) for per-session "Calendar" buttons. */
.ag { display: grid; gap: 10px; min-width: 0; }
.ag-head { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; }
.ag-title { margin: 0; flex: 1 1 100%; font-size: 1.2em; font-weight: 750; letter-spacing: -.012em; overflow-wrap: anywhere; }
.ag-zone { margin: 0; font-size: .84em; color: var(--e-ink-3); }
.ag-toggle {
    font: inherit; font-size: .8em; font-weight: 650; cursor: pointer; min-height: 40px; padding: 4px 14px; border-radius: 999px;
    color: var(--e-ink-2); background: var(--e-surface); border: 1px solid var(--e-line-strong);
}
.ag-toggle[aria-pressed="true"] { background: var(--e-accent); border-color: var(--e-accent); color: var(--e-accent-ink); }
.ag-toggle[aria-pressed="true"]::before { content: "\2713\00a0"; }

.ag-tabs { display: flex; gap: 4px; overflow-x: auto; border-bottom: 1px solid var(--e-line); scrollbar-width: thin; }
.ag-tab {
    flex: none; display: grid; gap: 1px; text-align: left; font: inherit; cursor: pointer; background: transparent; border: 0;
    border-bottom: 3px solid transparent; padding: 7px 12px 6px; min-height: 44px; color: var(--e-ink-3); margin-bottom: -1px;
}
.ag-tab-l { font-weight: 700; font-size: .9em; }
.ag-tab-d { font-size: .76em; }
.ag-tab:hover { color: var(--e-ink); }
.ag-tab[aria-selected="true"] { color: var(--e-accent-fg); border-bottom-color: var(--e-accent); }
.ag-tab:focus-visible, .ag-panel:focus-visible, .ag-toggle:focus-visible { outline: 2px solid var(--e-focus); outline-offset: 2px; }
.ag-day1 { margin: 0; font-weight: 700; font-size: .9em; color: var(--e-ink-2); }

.ag-list { list-style: none; margin: 0; padding: 0; display: grid; }
.ag-row { display: grid; grid-template-columns: 74px 1fr; gap: 12px; padding: 10px 8px; border-bottom: 1px solid var(--e-line); border-radius: 8px; }
.ag-has-cal { grid-template-columns: 74px 1fr auto; }
.ag-has-cal > .cal-wrap { display: contents; }
.ag-has-cal .cal-btn { align-self: start; }
.ag-has-cal .cal-menu { grid-column: 2 / -1; justify-self: end; }
.ag-has-cal .e-status { grid-column: 1 / -1; }
.ag-row:last-child { border-bottom: 0; }
.ag-time { display: grid; align-content: start; font-variant-numeric: tabular-nums; }
.ag-from { font-weight: 750; font-size: .95em; }
.ag-to { font-size: .8em; color: var(--e-ink-3); }
.ag-body { display: grid; gap: 4px; min-width: 0; justify-items: start; }
.ag-line { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; }
.ag-name { font-weight: 650; overflow-wrap: anywhere; }
.ag-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; font-size: .85em; color: var(--e-ink-2); overflow-wrap: anywhere; }
.ag-track { font-size: .78em; }
.ag-live { background: color-mix(in srgb, var(--e-ok) 9%, var(--e-bg)); box-shadow: inset 3px 0 0 var(--e-ok); border-bottom-color: transparent; }
.ag-next { box-shadow: inset 3px 0 0 var(--e-accent); }
.ag-past .ag-name, .ag-past .ag-from { color: var(--e-ink-3); }
.ag-state:empty { display: none; }

.cal-wrap { display: grid; gap: 6px; justify-items: start; }
.cal-btn { display: inline-flex; align-items: center; gap: 8px; }
.cal-btn svg { width: 15px; height: 15px; flex: none; }
.cal-btn.cal-small { min-height: 40px; padding: 2px 12px; font-size: .76em; border-radius: 999px; font-weight: 600; color: var(--e-accent-fg); background: transparent; border-color: var(--e-line); }
.cal-btn::after { content: ""; width: 6px; height: 6px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: translateY(-2px) rotate(45deg); }
.cal-btn[aria-expanded="true"]::after { transform: translateY(2px) rotate(-135deg); }
.cal-menu {
    list-style: none; margin: 0; padding: 5px; width: min(100%, 300px); display: grid; gap: 2px;
    background: var(--e-bg); border: 1px solid var(--e-line-strong); border-radius: var(--e-radius-sm);
    box-shadow: 0 8px 24px rgba(16, 22, 43, .12);
}
.cal-menu a, .cal-menu button {
    display: grid; gap: 1px; width: 100%; min-height: 42px; padding: 6px 10px; text-align: left; font: inherit; font-size: .88em;
    color: var(--e-ink); background: transparent; border: 0; border-radius: 8px; cursor: pointer; text-decoration: none;
}
.cal-menu small { font-size: .78em; color: var(--e-ink-3); }
.cal-menu a:hover, .cal-menu button:hover, .cal-menu a:focus, .cal-menu button:focus { background: var(--e-surface-2); outline: none; }
.cal-menu a:focus-visible, .cal-menu button:focus-visible { outline: 2px solid var(--e-focus); outline-offset: -2px; }
.ag .e-status:empty { display: none; }

@media (max-width: 360px) {
    .ag-row, .ag-has-cal { grid-template-columns: 1fr auto; gap: 4px 8px; padding: 9px 6px; }
    .ag-row > .ag-time { grid-column: 1 / -1; }
    .ag-has-cal .cal-menu { grid-column: 1 / -1; justify-self: stretch; }
    .ag-time { display: flex; gap: 6px; align-items: baseline; }
    .ag-to::before { content: "– "; }
}