.wp-block-event-listing {
    margin: var(--wp--preset--spacing--large) 0;
}

.event-item__location-date,
.event-item__location {
    color: var(--wp--preset--color--primary-accent);
    font-size: var(--wp--preset--font-size--small);
    font-weight: 700;
}

.event-item__location-date {
    flex-wrap: wrap;
    align-items: center;
    margin: var(--wp--preset--spacing--x-small) 0 0;
    font-size: var(--wp--preset--font-size--small);
    line-height: 1.2;
    display: flex;
}

.event-item__location {
    align-items: top;
    column-gap: var(--wp--preset--spacing--xx-small);
    line-height: 1;
    display: flex;
}

.event-item__location .icon {
    line-height: var(--wp--preset--font-size--x-small);
    display: block;
}

.event-item__location .icon svg {
    width: auto;
    height: var(--wp--preset--font-size--x-small);
}

.event-item__date + .event-item__location:before {
    content: " • ";
    display: inline-block;
    margin-left: var(--wp--preset--spacing--xx-small);
}

.event-listing__events--is-style-default {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--wp--preset--spacing--x-large);
    display: grid;
}

@media (width <= 992px) {
    .event-listing__events--is-style-default {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: var(--wp--preset--spacing--medium);
    }
}

@media (width <= 768px) {
    .event-listing__events--is-style-default {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (width <= 576px) {
    .event-listing__events--is-style-default {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }
}

.event-item-default:first-child {
    margin-top: 0;
}

.event-item-default:nth-child(n + 4) {
    padding-top: var(--wp--preset--spacing--large);
    border-top: 2px solid var(--wp--preset--color--border-light);
}

.event-item-default__month-day,
.event-item-featured__month-day {
    box-sizing: border-box;
    color: #fff;
    text-align: center;
    text-transform: uppercase;
    background-color: var(--wp--preset--color--main-accent);
    border-radius: 5px;
    width: auto;
    max-width: 5.8rem;
    margin: 0 0 var(--wp--preset--spacing--medium);
    padding: var(--wp--preset--spacing--x-small) var(--wp--preset--spacing--xx-small)
        var(--wp--preset--spacing--xx-small);
    display: flex;
    flex-wrap: nowrap;
    flex-direction: column;
}

.event-item-featured__month-day {
    position: absolute;
    z-index: 500;
    top: calc(-1 * var(--wp--preset--spacing--small));
    left: var(--wp--preset--spacing--small);
}

.event-item-default__month,
.event-item-default__year,
.event-item-featured__month,
.event-item-featured__year {
    color: var(--wp--preset--color--main);
    display: block;
    font-size: var(--wp--preset--font-size--medium);
    font-weight: 600;
    line-height: 1;
    margin-bottom: calc(var(--wp--preset--spacing--xx-small) * 0.5);
}

.event-item-default__day,
.event-item-featured__day {
    display: block;
    font-size: var(--wp--preset--font-size--3-xl);
    font-weight: 700;
    letter-spacing: -2px;
    line-height: 1;
}

.event-item-default__title {
    font-size: var(--wp--preset--font-size--medium);
    margin: 0;
    line-height: 1.2;
}

.event-item-default__title > a {
    color: var(--wp--preset--color--main);
    font-size: var(--wp--preset--font-size--x-large);
    font-weight: 400;
    text-decoration: none;
    text-transform: capitalize;
}

.event-item-default__summary {
    font-size: var(--wp--preset--font-size--base);
    line-height: 1.2;
    margin-top: var(--wp--preset--spacing--small);
}

.event-item-default__more {
    margin: var(--wp--preset--spacing--small) 0 0;
}

.event-listing__events--is-style-featured {
}

.event-item-featured {
    align-items: center;
    position: relative;
    margin-bottom: var(--wp--preset--spacing--x-large);
}

.event-item-featured {
    border-radius: 8px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1), 0 2px 2px rgba(0, 0, 0, 0.1), 0 4px 4px rgba(0, 0, 0, 0.1),
        0 8px 8px rgba(0, 0, 0, 0.1), 0 16px 16px rgba(0, 0, 0, 0.1);
}

.event-item-featured__image {
    box-sizing: border-box;
    z-index: 1;
    grid-area: 1 / 1;
    width: 100%;
    margin-left: auto;
    position: relative;
}

.event-item-featured__image img {
    border-radius: 8px 8px 0 0;
    object-fit: cover;
    object-position: 50% 20%;
    width: 100%;
    height: 100%;
    display: block;
    aspect-ratio: 2 / 1;
}

.event-item-featured__details {
    border-radius: 0 0 8px 8px;
    box-sizing: border-box;
    color: var(--wp--preset--color--base);
    z-index: 2;
    background: var(--wp--preset--color--main);
    padding: var(--wp--preset--spacing--medium) var(--wp--preset--spacing--medium);
    position: relative;
}

.event-item-featured__details > :first-child {
    margin-top: 0;
}

.event-item-featured__details > :last-child {
    margin-bottom: 0;
}

.event-item-featured__category {
    color: var(--wp--preset--color--base);
    text-transform: uppercase;
    margin: 0 0 var(--wp--preset--spacing--x-small);
    font-size: var(--wp--preset--font-size--x-small);
    font-weight: 600;
}

.event-item-featured__title {
    color: var(--wp--preset--color--base);
    font-size: var(--wp--preset--font-size--x-large);
    font-weight: 400;
    margin: 0;
    text-transform: capitalize;
}

.event-item-featured__more {
    text-align: right;
}

.event-item-default__more > a,
.event-item-featured__more > a {
    display: inline-block;
    font-size: var(--wp--preset--font-size--base);
    font-weight: 800;
    position: relative;
    padding-right: calc(var(--wp--preset--spacing--medium) * 0.7);
    text-transform: uppercase;
}

.event-item-default__more > a.button--link-chevron::after,
.event-item-featured__more > a.button--link-chevron::after {
    background-color: currentColor;
    content: "";
    height: 1em;
    mask: url("../../assets/images/icon-chevron-right.svg");
    mask-repeat: repeat;
    mask-size: auto;
    mask-size: 50%;
    mask-repeat: no-repeat;
    position: absolute;
    right: 0;
    top: 20%;
    transition: transform 0.2s ease-in-out;
    width: 1em;
}

.event-listing__event--has-image .event-item-featured__details {
    width: 100%;
}

.is-content-justification-center .event-listing__no-events {
    text-align: center;
}

@media (width >= 768px) {
    .event-item-featured__details {
        position: relative;
    }

    .event-item-featured__image {
        position: relative;
    }
}

@media (width <= 768px) {
    .event-item-featured__details {
        position: relative;
    }

    .event-item-featured__image,
    .event-listing__event--has-image .event-item-featured__details {
        grid-area: auto;
        width: auto;
        max-width: none;
    }
}
