.mainSite .openingHoursNavigation {
    display: grid;
    grid-template-columns: 2rem minmax(0, 1fr) 2rem;
    align-items: center;
    gap: .35rem;
    padding: .65rem 0;
    border-bottom: 1px solid rgba(26, 26, 26, .12);
}

.mainSite .openingHoursWeekButton {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    padding: 0;
    border: 1px solid rgba(26, 26, 26, .18);
    border-radius: .25rem;
    background: transparent;
    color: var(--color-black);
    font-size: 1.5rem;
    line-height: 1;
}

.mainSite .openingHoursWeekButton:disabled {
    opacity: .3;
    cursor: default;
}

.mainSite .openingHoursWeekButton:enabled:hover,
.mainSite .openingHoursWeekButton:focus-visible {
    border-color: var(--color-prim);
    color: var(--color-prim);
}

.mainSite .openingHoursPeriod {
    color: var(--color-black);
    font-size: .8em;
    font-weight: 700;
    line-height: 1.3;
    text-align: center;
    font-variant-numeric: tabular-nums;
}

.mainSite .openingHoursPeriod small,
.mainSite .openingHoursDate {
    display: block;
    font-size: .85em;
    font-weight: 400;
    font-variant-numeric: tabular-nums;
}

.mainSite .openingHoursRow .vandaag {
    color: var(--color-prim);
    font-weight: 700;
}

.mainSite .openingHoursTime {
    flex-wrap: wrap;
    justify-content: flex-end;
}

.mainSite .openingHoursNote {
    flex-basis: 100%;
    padding-top: .1rem;
    font-size: .85em;
    white-space: normal;
    text-align: right;
}

.mainSite .openingHoursToday {
    display: block;
    margin: .35rem auto .5rem;
    padding: .3rem .6rem;
    border: 0;
    background: transparent;
    color: var(--color-prim);
    font-size: .8em;
    font-weight: 700;
    text-decoration: underline;
}

.mainSite .openingHoursModule[aria-busy="true"] {
    opacity: .6;
    cursor: progress;
}

.mainSite .openingHoursError {
    margin: .5rem 0;
    color: #9c2525;
    font-size: .8em;
}