/* VeranstaltungsDetailseite – Event detail page */
.bi-event-detail {
    /* dimensions */
    width: 100%;
    max-width: 1120px;
    /* spacing */
    margin: 0 auto;
    padding: 32px 24px;
    /* other */
    box-sizing: border-box;

    .bi-event-detail__title-card {
        /* spacing */
        padding: 32px 24px;
        /* color */
        background: var(--bi-color-base-white);
        /* shadow */
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    }

    .bi-event-detail__title {
        /* reset */
        margin: 0;
        /* typography */
        font-size: 20px;
        font-family: var(--bi-font-family-primary);
        line-height: var(--bi-line-height-tight);
        letter-spacing: var(--bi-letter-spacing-medium);
        font-weight: var(--bi-font-weight-semibold);
        color: var(--bi-color-text-secondary);
    }

    .bi-event-detail__grid > *,
    .bi-event-detail__sidebar-left > *,
    .bi-event-detail__sidebar-right > *,
    .bi-event-detail__main > * {
        border-radius: 0;
    }

    /* Mobile: single column, DOM order = title → left → right → main */
    .bi-event-detail__grid {
        /* layout */
        display: flex;
        flex-direction: column;
        /* spacing */
        gap: 22px;
    }

    .bi-event-detail__sidebar-left,
    .bi-event-detail__sidebar-right,
    .bi-event-detail__main {
        display: flex;
        flex-direction: column;
        gap: 22px;
    }

    .bi-event-detail__card {
        /* spacing */
        padding: 24px;
        /* color */
        background: var(--bi-color-base-white);
        /* shadow */
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    }

    .bi-event-detail__card-title {
        /* reset */
        margin: 0;
        /* typography */
        font-weight: var(--bi-font-weight-semibold);
        color: var(--bi-color-text-dark-grey);
    }

    .bi-event-detail__card-body {
        /* reset */
        margin: 8px 0 0;
        /* color */
        color: var(--bi-color-text-medium-grey);
    }

    .bi-event-detail__contact-card {
        /* spacing */
        padding: 24px;
        margin-top: 32px;
        /* typography */
        font-size: var(--bi-font-size-md);
        color: var(--bi-color-text-dark-grey);
    }

    .bi-event-detail__contact-card-intro {
        /* reset */
        margin: 0 0 8px;
    }

    .bi-event-detail__contact-card-email {
        /* reset */
        margin: 0;
    }

    .bi-event-detail__contact-card-link {
        /* typography */
        color: var(--bi-color-brand-primary-600);
        text-decoration: underline;
    }

    .bi-event-detail__contact-card-link:hover {
        color: var(--bi-color-brand-primary-700);
    }
}

@media (min-width: 1200px) {
    .bi-event-detail {
        /* spacing */
        padding: 59px 0;

        .bi-event-detail__grid {
            /* layout */
            display: grid;
            grid-template-columns: 256px 640px 160px;
            grid-template-rows: auto 1fr;
            /* spacing */
            gap: 32px;
        }

        .bi-event-detail__title-card {
            /* placement: top of center column */
            grid-column: 2;
            grid-row: 1;
            /* spacing */
            padding: 20px 24px;
        }

        .bi-event-detail__title {
            /* typography */
            font-size: 40px;
            font-family: var(--bi-font-family-headline);
            letter-spacing: var(--bi-letter-spacing-normal);
            font-weight: var(--bi-font-weight-semibold);
        }

        .bi-event-detail__sidebar-left {
            /* placement: left column, span both rows */
            grid-column: 1;
            grid-row: 1 / -1;
        }

        .bi-event-detail__main {
            /* placement: center column, second row */
            grid-column: 2;
            grid-row: 2;
            /* spacing */
            gap: 44px;
        }

        .bi-event-detail__sidebar-right {
            /* placement: right column, span both rows */
            grid-column: 3;
            grid-row: 1 / -1;
        }
    }
}

.bi-dropdown--enhanced .bi-dropdown__native {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
    opacity: 0;
    pointer-events: none;
}