/* mv_alumni_events – base frontend layout for the events list & detail.
   Structural/base styles only; brand look comes from the project theme. */

/* ---------------------------------------------------------------- List */
/* Row 1: toggle + videoarchive (right) */
.alumni-events__header {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: .75rem;
    margin-bottom: 2.5rem;
}
.alumni-events__toggle,
.alumni-events__videoarchive {
    font-size: 1rem;
    background-color: #111 !important;
    border-color: #111 !important;
    color: #fff !important;
    text-transform: uppercase !important;
}
/* Search UI is rendered but hidden until the API gains a search parameter. */
.alumni-events__search { display: none; }

/* Row 2: pagination */
.alumni-events__toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem;
    margin-bottom: 2.5rem;
}
.alumni-events__toolbar .alumni-events__pagination {
    margin: 0;
}

.alumni-events__items {
    border-bottom: 1px solid #111;
}

.alumni-events__item {
    display: flex;
    gap: 6rem;
    padding: 1.5rem 0;
    border-top: 1px solid #111;
}

/* left column: date on top, thumbnail below */
.alumni-events__aside {
    flex: 0 0 8rem;
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.alumni-events__date-block {
    display: flex;
    align-items: flex-end;
    gap: .5rem;
    line-height: 1.1;
}
.alumni-events__day {
    font-size: 2.75rem;
    font-weight: 700;
    line-height: .85;
}
.alumni-events__meta-date {
    display: flex;
    flex-direction: column;
    font-size: .75rem;
    padding-top: .1rem;
}

.alumni-events__media {
    margin-top: .25rem;
}
.alumni-events__thumb {
    display: block;
    width: 100%;
    height: auto;
}

/* right column */
.alumni-events__body {
    flex: 1 1 auto;
    min-width: 0;
}
.alumni-events__cat {
    display: block;
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: .4rem;
}
.alumni-events__title {
    font-size: 1.65rem;
    font-weight: 700;
    line-height: 1.15;
    margin: 0 0 1.35rem;
    overflow-wrap: break-word;
}
.alumni-events__title a { color: inherit; text-decoration: none; }
.alumni-events__title a:hover { text-decoration: underline; }

/* column-gap must be 0 so the row separator line is continuous across
   the label and value columns; the label gets padding-right for spacing. */
.alumni-events__meta {
    display: grid;
    grid-template-columns: 7rem 1fr;
    margin: 0;
}
.alumni-events__meta dt,
.alumni-events__meta dd {
    border-top: 1px solid #e6e6e6;
    padding: .5rem 0;
    margin: 0;
}
.alumni-events__meta dt {
    font-weight: 700;
    color: #111;
    padding-right: 1rem;
}

.alumni-events__register { margin-top: 1rem; }
.alumni-events__empty { padding: 1.5rem 0; }

/* ------------------------------------------------------ Past filter */
/* Top row: filter (left, grows) + header/toggle (right). Without a filter the
   header spans the full width and keeps its own search|toggle space-between. */
.alumni-events__top {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem 2rem;
    margin-bottom: 2.5rem;
}
.alumni-events__top .alumni-events__header { margin-bottom: 0; }
.alumni-events__top:not(.alumni-events__top--withfilter) .alumni-events__header { margin-left: auto; }
.alumni-events__top--withfilter .alumni-events__filter { flex: 1 1 22rem; min-width: 0; }
.alumni-events__top--withfilter .alumni-events__header { flex: 0 0 auto; }

/* Row: "FILTER" label + dropdown buttons (Reihe / Ort / Veranstalter) */
.alumni-events__filterbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .75rem;
    margin-bottom: 1rem;
}
.alumni-events__filterbar-label {
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .03em;
}
.alumni-events__filterbar-form {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

/* Single dropdown (native <details>, panel overlays the content) */
.alumni-events__fdrop {
    position: relative;
}
.alumni-events__fdrop-toggle {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    border: 1px solid #111;
    padding: .5rem .9rem;
    font-weight: 700;
    text-transform: uppercase;
    cursor: pointer;
    list-style: none;
    user-select: none;
    white-space: nowrap;
}
.alumni-events__fdrop-toggle::-webkit-details-marker { display: none; }
.alumni-events__fdrop-toggle::after { content: "\25be"; margin-left: .1rem; }
.alumni-events__fdrop[open] .alumni-events__fdrop-toggle::after { content: "\25b4"; }
.alumni-events__fdrop[open] .alumni-events__fdrop-toggle { background: #111; color: #fff; }
.alumni-events__fbadge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.25rem;
    height: 1.25rem;
    padding: 0 .3rem;
    border: 1px solid currentColor;
    border-radius: 999px;
    font-size: .7rem;
    line-height: 1;
}
.alumni-events__fdrop-panel {
    position: absolute;
    z-index: 30;
    top: calc(100% - 1px);
    left: 0;
    min-width: 16rem;
    max-width: 22rem;
    background: #fff;
    border: 1px solid #111;
    padding: .5rem;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .12);
}
.alumni-events__fdrop-scroll {
    max-height: 16rem;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}
.alumni-events__filter-option {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .3rem .35rem;
    font-size: .9rem;
    cursor: pointer;
}
.alumni-events__filter-option:hover { background: #f2f2f2; }
.alumni-events__filter-option input { flex: 0 0 auto; }
.alumni-events__filter-submit {
    margin-top: .5rem;
    width: 100%;
    background-color: #111 !important;
    border-color: #111 !important;
}

/* Active selection as removable chips */
.alumni-events__filterchips {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
    margin-bottom: 0;
}
.alumni-events__chip {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    border: 1px solid #111;
    padding: .25rem .6rem;
    font-size: .85rem;
    text-decoration: none;
    color: #111;
}
.alumni-events__chip:hover { background: #111; color: #fff; }
.alumni-events__chip-x { font-weight: 700; line-height: 1; }
.alumni-events__filter-reset {
    font-size: .85rem;
    font-weight: 700;
    text-transform: uppercase;
    text-decoration: underline;
    color: inherit;
}

@media (max-width: 575.98px) {
    .alumni-events__filterbar-form { width: 100%; }
    .alumni-events__fdrop { flex: 1 1 100%; }
    .alumni-events__fdrop-toggle { width: 100%; justify-content: space-between; }
    .alumni-events__fdrop-panel { min-width: 0; width: 100%; max-width: none; }
}

/* ---------------------------------------------------------- Pagination */
.alumni-events__pagination { margin: 1rem 0; }
.alumni-events__pages {
    display: flex;
    flex-wrap: wrap;
    gap: .85rem;
    list-style: none;
    margin: 0;
    padding: 0;
}
.alumni-events__page a { text-decoration: none; color: inherit; }
.alumni-events__page a:hover { text-decoration: underline; }
.alumni-events__page.is-active > span { font-weight: 700; text-decoration: underline; }

/* ------------------------------------------------------------- Detail */
.alumni-event-detail {
    display: flex;
    gap: 2rem;
    align-items: flex-start;
}
.alumni-event-detail__aside {
    flex: 0 0 12rem;
}
.alumni-event-detail__main {
    flex: 1 1 auto;
    min-width: 0;
    max-width: 44rem;
}
/* Sits above the two-column layout but aligned with the content column
   (offset = aside width 12rem + column gap 2rem). */
.alumni-event-detail__back { margin: 0 0 1.25rem 14rem; }
/* Keep the "back to overview" link underlined; the theme's `p a:not(.btn)`
   rule (main.css) removes underlines with higher specificity, so match it. */
.alumni-event-detail__back a:not(.btn) { text-decoration: underline; }
.alumni-event-detail__cat { font-size: .85rem; margin-bottom: .35rem; }
.alumni-event-detail__title {
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.12;
    margin: 0 0 1rem;
    overflow-wrap: break-word;
}
.alumni-event-detail__subtitle {
    font-size: 1.15rem;
    font-weight: 400;
    line-height: 1.3;
    margin: 0 0 1.25rem;
}
.alumni-event-detail__image {
    margin: 1rem 0;
}
.alumni-event-detail__image img {
    display: block;
    width: 100%;
    height: auto;
}
.alumni-event-detail__flyer { margin: .5rem 0 1.5rem; }
.alumni-event-detail__flyer-link,
.alumni-event-detail__ics-link {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    text-decoration: underline !important;
}
.alumni-event-detail__linklist {
    list-style: none;
    margin: .5rem 0 1.5rem;
    padding: 0;
}
.alumni-event-detail__linklist a {
    text-decoration: underline;
}
.alumni-event-detail__body { margin-bottom: 1.5rem; }
.alumni-event-detail__facts {
    display: grid;
    grid-template-columns: 10rem 1fr;
    margin: 1.5rem 0;
}
.alumni-event-detail__facts dt,
.alumni-event-detail__facts dd {
    border-top: 1px solid #e6e6e6;
    padding: .55rem 0;
    margin: 0;
}
.alumni-event-detail__facts dt {
    font-weight: 700;
    color: #111;
    padding-right: 1rem;
}
.alumni-event-detail__facts dd {
    font-weight: 700;
}
.alumni-event-detail__ics { margin-top: 1rem; }

/* ---------------------------------------------------------- Responsive */
@media (max-width: 767.98px) {
    .alumni-event-detail { flex-direction: column; gap: 1rem; }
    .alumni-event-detail__aside { flex: 0 0 auto; }
    .alumni-event-detail__back { margin-left: 0; }
    .alumni-event-detail__title { font-size: 1.5rem; }
}
@media (max-width: 575.98px) {
    .alumni-events__item { flex-direction: column; gap: 1rem; }
    .alumni-events__aside { flex-direction: row; align-items: flex-start; }
    .alumni-events__media { max-width: 6rem; margin-top: 0; }
    .alumni-events__meta { grid-template-columns: 7rem 1fr; }
    .alumni-event-detail__facts { grid-template-columns: 7rem 1fr; }
}