.drpop-section__inner {
    width: min(100% - 2rem, 76rem);
    margin-inline: auto;
}

.drpop-radio__grid,
.drpop-event-list {
    display: grid;
    gap: 1rem;
}

.drpop-radio-card,
.drpop-event-card {
    border: 1px solid currentColor;
    border-radius: 1rem;
}

.drpop-radio-card {
    padding: 1.25rem;
}

.drpop-radio-card__date {
    margin-top: 0;
}

.drpop-radio-card__date span {
    display: block;
    font-size: 2rem;
    font-weight: 700;
}

.drpop-event-list__year {
    margin: 2rem 0 0;
}

.drpop-event-controls {
    margin-bottom: 1rem;
}

.drpop-event-controls > summary {
    display: inline-flex;
    gap: 0.4rem;
    align-items: center;
    min-height: 2.75rem;
    padding: 0.25rem 0;
    cursor: pointer;
    font-weight: 700;
    list-style: none;
    background: linear-gradient(currentColor, currentColor) 0 calc(100% - 0.42em) / 100% 0.1em no-repeat;
}

.drpop-event-controls > summary::-webkit-details-marker {
    display: none;
}

.drpop-event-controls__icon::before {
    content: "+";
}

.drpop-event-controls[open] .drpop-event-controls__icon::before {
    content: "−";
}

.drpop-event-controls__panel {
    margin-top: 0.5rem;
}

.drpop-event-view-switch {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.drpop-event-view-switch__item {
    display: inline-flex;
    align-items: center;
    min-height: 3rem;
    padding: 0.65rem 1rem;
    border: 2px solid currentColor;
    border-radius: 0.5rem;
    color: inherit;
    font-weight: 700;
    text-decoration: none;
}

.drpop-event-view-switch__item[aria-disabled="true"] {
    opacity: 0.55;
}

.drpop-event-filters {
    display: grid;
    gap: 1rem;
}

.drpop-event-date-filter {
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

.drpop-event-date-filter__fields {
    display: grid;
    gap: 1rem;
    min-width: 0;
}

.drpop-event-date-filter label,
.drpop-event-city-filter__search,
.drpop-event-city-filter-field__label {
    display: block;
    font-weight: 700;
}

.drpop-event-date-filter label {
    min-width: 0;
    max-width: 100%;
}

.drpop-event-date-filter label > span,
.drpop-event-city-filter__search,
.drpop-event-city-filter-field__label {
    display: block;
    margin-bottom: 0.4rem;
}

.drpop-event-date-filter input[type="date"],
.drpop-event-city-filter input[type="search"] {
    box-sizing: border-box;
    display: block;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    min-height: 3rem;
    padding: 0.65rem 0.75rem;
    border: 2px solid currentColor;
    border-radius: 0.5rem;
    background: #fff;
    color: #111014;
    font: inherit;
    font-size: 1rem;
}

.drpop-event-date-filter input[type="date"] {
    width: -webkit-fill-available;
    width: stretch;
}

.drpop-event-filter-notice {
    margin: 0.5rem 0 0;
    font-size: 0.9rem;
}

.drpop-event-filter-notice {
    font-weight: 700;
}

.drpop-event-city-filter-field {
    min-width: 0;
}

.drpop-event-city-filter {
    position: relative;
}

.drpop-event-city-filter > summary {
    display: flex;
    align-items: center;
    min-height: 3rem;
    padding: 0.65rem 0.75rem;
    border: 2px solid currentColor;
    border-radius: 0.5rem;
    cursor: pointer;
    font-weight: 700;
    list-style-position: inside;
}

.drpop-event-city-filter__panel {
    position: absolute;
    z-index: 3;
    inset: calc(100% + 0.5rem) auto auto 0;
    width: 100%;
    box-sizing: border-box;
    padding: 0.75rem;
    border: 1px solid currentColor;
    border-radius: 0.5rem;
    background: #fff;
    color: #111014;
}

.drpop-event-city-filter fieldset {
    display: grid;
    max-height: 18rem;
    margin: 0.75rem 0 0;
    padding: 0;
    overflow-y: auto;
    border: 0;
}

.drpop-event-city-filter fieldset label {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.65rem;
    align-items: center;
    min-height: 2.75rem;
    padding: 0.35rem;
    cursor: pointer;
}

.drpop-event-city-filter [data-event-city-option][hidden] {
    display: none;
}

.drpop-event-city-filter input[type="checkbox"] {
    width: 1.25rem;
    height: 1.25rem;
    margin: 0;
}

.drpop-event-filters__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem 1rem;
    align-items: center;
}

.drpop-event-results {
    min-height: 1.5rem;
    font-weight: 700;
}

.drpop-event-results.is-error {
    color: #a61b29;
}

.drpop-event-pagination {
    display: flex;
    justify-content: center;
    margin-top: 1.5rem;
}

.drpop-event-pagination [aria-disabled="true"] {
    pointer-events: none;
    opacity: 0.65;
}

.drpop-event-card {
    display: grid;
    grid-template-columns: 4.5rem minmax(0, 1fr);
    gap: 1rem;
    padding: 1rem;
}

.drpop-event-card__date {
    align-self: start;
    margin: 0;
    text-align: center;
    text-transform: uppercase;
}

.drpop-event-card__date span {
    display: block;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1;
}

.drpop-event-card h4,
.drpop-event-card__title {
    margin-top: 0;
}

.drpop-event-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1rem;
}

.drpop-event-card > .drpop-button {
    grid-column: 1 / -1;
}

.drpop-event-archive {
    margin-top: 2rem;
}

.drpop-event-archive > summary {
    min-height: 2.75rem;
    cursor: pointer;
    font-weight: 700;
}

.drpop-form {
    display: grid;
    gap: 1rem;
    max-width: 42rem;
}

.drpop-form__field label,
.drpop-form__field input,
.drpop-form__field textarea {
    display: block;
    width: 100%;
}

.drpop-form__field label {
    margin-bottom: 0.4rem;
    font-weight: 700;
}

.drpop-form__field label span,
.drpop-form__help {
    font-size: 0.9rem;
    font-weight: 400;
}

.drpop-form input,
.drpop-form textarea {
    box-sizing: border-box;
    min-height: 3rem;
    padding: 0.75rem;
    border: 2px solid currentColor;
    border-radius: 0.5rem;
    background: #fff;
    color: #111014;
    font: inherit;
}

.drpop-form textarea {
    min-height: 9rem;
    resize: vertical;
}

.drpop-honeypot {
    position: absolute !important;
    left: -10000px !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
}

.drpop-form__status {
    min-height: 1.5rem;
    font-weight: 700;
}

.drpop-form__status.is-success,
.drpop-notice--success {
    color: #176b45;
}

.drpop-form__status.is-error,
.drpop-notice--error {
    color: #a61b29;
}

@media (min-width: 40rem) {
    .drpop-radio__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .drpop-event-card {
        grid-template-columns: 5rem minmax(0, 1fr) auto;
        align-items: center;
    }

    .drpop-event-card > .drpop-button {
        grid-column: auto;
    }

    .drpop-event-filters {
        grid-template-columns: minmax(16rem, 1.25fr) minmax(0, 2fr);
        align-items: start;
    }

    .drpop-event-date-filter__fields {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .drpop-event-filters__actions {
        grid-column: 1 / -1;
    }
}
