/* --------------------------------------------------
   Veranstaltungen – Übersicht
-------------------------------------------------- */

.veranstaltungen {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 30px;

    margin-bottom: 25px !important;
}

.veranstaltungen__item {
    min-width: 0;
}


/* Kategorie */
.veranstaltungen__item__category {
    margin-bottom: 8px !important;

    color: #849A92;
    font-weight: 500;
}


/* Titel */
.veranstaltungen__item__title a {
    display: block;

    margin-top: 12px;
    margin-bottom: 10px !important;

    color: var(--color-text);

    font-size: 18px;
    font-weight: 600;
    line-height: 1.35;

    text-decoration: none;
    cursor: pointer;
}

.veranstaltungen__item__title a:hover {
    color: var(--color-hover);
}

.veranstaltungen__item__title a::after {
    content: "";

    display: inline-block;
    position: relative;

    width: 15px;
    height: 13px;
    margin-left: 7px;

    background-color: currentColor;

    -webkit-mask: url("../img/arrow__up.svg") center / contain no-repeat;
    mask: url("../img/arrow__up.svg") center / contain no-repeat;

    transition: transform 0.2s ease;
}

.veranstaltungen__item__title a:hover::after {
    transform: scale(1.15);
}


/* Ort und Zeit */
.veranstaltungen__item__zeit,
.veranstaltungen__item__ort,
.veranstaltung__zeit,
.veranstaltung__ort {
    display: flex;
    align-items: center;
    gap: 8px;

    margin: 7px 0;

    font-weight: 500;
}

.veranstaltungen__item__zeit::before,
.veranstaltungen__item__ort::before,
.veranstaltung__zeit::before,
.veranstaltung__ort::before {
    content: "";

    display: block;
    flex: 0 0 20px;

    width: 20px;
    height: 20px;

    background-size: contain;
}

.veranstaltungen__item__zeit::before,
.veranstaltung__zeit::before {
    background: url("../img/icon__calendar.svg") no-repeat center;
}

.veranstaltungen__item__ort::before,
.veranstaltung__ort::before {
    background: url("../img/icon__place.svg") no-repeat center;
}


@media (max-width: 767px) {
    .veranstaltungen {
        grid-template-columns: 1fr;
    }
}


/* --------------------------------------------------
   Veranstaltungsseite
-------------------------------------------------- */

.veranstaltung.type-veranstaltung {
    max-width: 980px;
    margin: 40px auto;
}

.veranstaltung.type-veranstaltung .entry-title {
    margin-bottom: 20px;
}


/* --------------------------------------------------
   Veranstaltungstabelle
-------------------------------------------------- */

#veranstaltungen__tabelle .veranstaltungen {
    display: block;
}


/* Einzelne Veranstaltung */
#veranstaltungen__tabelle .veranstaltungen__item {
    display: grid;

    grid-template-columns:
        minmax(0, 2fr)
        minmax(220px, 1fr)
        minmax(120px, .6fr);

    column-gap: 30px;
    align-items: center;

    padding: 15px 0;

    border-bottom: 1px solid var(--color-grey-30);
}


/* DGEM-Kennzeichnung */
#veranstaltungen__tabelle .dgem-event.veranstaltungen__item::before {
    content: "DGEM-Veranstaltung";

    display: flex;
    align-items: center;

    grid-column: 1;
    grid-row: 1;

    min-height: 20px;
    margin-bottom: 10px;
    padding-left: 24px;

    color: var(--color-dgem-green);

    font-size: 12px;
    font-weight: 600;
    line-height: 1.2;

    background-image: url("../img/dgem__veranstaltungen.svg");
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 20px 20px;
}


/* Kategorie */
#veranstaltungen__tabelle .veranstaltungen__item__category {
    grid-column: 1;
    grid-row: 2;
}


/* Titel */
#veranstaltungen__tabelle .veranstaltungen__item__title {
    grid-column: 1;
    grid-row: 3;
}

#veranstaltungen__tabelle .veranstaltungen__item__title a {
    margin-top: 0;
    margin-bottom: 0 !important;
}


/* Datum */
#veranstaltungen__tabelle .veranstaltungen__item__zeit {
    grid-column: 2;
    grid-row: 1 / 4;
}


/* Ort */
#veranstaltungen__tabelle .veranstaltungen__item__ort {
    grid-column: 3;
    grid-row: 1 / 4;
}


/* --------------------------------------------------
   Veranstaltungsfilter
-------------------------------------------------- */

.veranstaltungen-filter {
    display: flex;
    align-items: center;
    gap: 8px;

    padding-bottom: 25px;

    border-bottom: 1px solid var(--color-grey-30);
}

.veranstaltungen-filter input[type="checkbox"] {
    margin-left: 0 !important;
}

.veranstaltungen-filter .dgem-event-filter {
    width: 18px;
    height: 18px;
    margin: 0;

    accent-color: var(--color-neon);
    cursor: pointer;
}

.veranstaltungen-filter label {
    display: inline-flex;
    align-items: center;
    gap: 5px;

    margin: 0;

    color: var(--color-text);
    font-weight: 500;

    cursor: pointer;
}

.veranstaltungen-filter label span.color__dgem-green {
    color: var(--color-dgem-green);
}

.dgem-filter-icon {
    display: inline-block;
    flex-shrink: 0;

    width: 24px;
    height: 24px;

    background-image: url("../img/dgem__veranstaltungen.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}


/* --------------------------------------------------
   Mobile Darstellung
-------------------------------------------------- */
@media (max-width: 1000px) {
}

@media (max-width: 767px) {

    /* Veranstaltungsliste */
    #veranstaltungen__tabelle .veranstaltungen__item {
        display: block;
        padding: 20px 0;
    }

    /* Kategorie */
    #veranstaltungen__tabelle .veranstaltungen__item__category {
        margin-bottom: 8px !important;
    }

    /* Titel */
    #veranstaltungen__tabelle .veranstaltungen__item__title {
        margin-bottom: 12px;
    }

    /* Datum und Ort */
    #veranstaltungen__tabelle .veranstaltungen__item__zeit,
    #veranstaltungen__tabelle .veranstaltungen__item__ort {
        margin: 7px 0;
    }
}