/* === Öffnungszeiten – GMB-Variante (UL/LI) === */

.regular-hours {
}

.regular-hours legend {
    padding: 0 .5rem;
    font-weight: 600;
    color: white;
}

/* Liste */

.hours-list {
    list-style: none;
    margin: 0;
    padding: 0;

    display: grid;
    gap: .35rem;
}

.day-entry {
    display: grid;
    grid-template-columns: minmax(130px, max-content) 1fr;
    gap: .6rem;
}

.day-name {
}

.hours, .special-time {
    align-items: center;
    justify-self: flex-end;
}

.hours.closed, .special-time.closed {
    color: #c33;
}

/* heutiger Tag hervorheben */

.day-entry.highlight-today {
    /*background-color: hsl(200 70% 80% / 0.2);*/
    /*color: cadetblue;*/
    color: var(--color-second);
    font-weight: 700;
}

/* mobil */

@media (max-width:480px) {

    .day-entry {
        grid-template-columns: minmax(130px, max-content) 1fr;
    }

    .hours {
        padding-left: .6rem;
    }

}

/* special hours Styles */
   .special-hours {
   }

.special-hours legend {
    padding: 0 .5rem;
    font-weight: 600;
    color: white;
}

.special-hours-list {
    list-style: none;
    padding: 0;
    margin: 0;

    display: grid;
    gap: .35rem;
}

.special-row {
    display: grid;
    grid-template-columns: minmax(130px, max-content) 1fr;
    gap: .6rem;
}

.special-date {
    font-weight: 600;
}

.closed {
    color: #c33;
}

/* mobil automatisch umbrechen */

@media (max-width:480px) {
    .special-row {
        grid-template-columns: minmax(130px, max-content) 1fr;
    }

    .special-time {
        padding-left: .6rem;
    }
}

/* box outer */

.regular-hours,
.special-hours{
    position: relative;
    border: 2px solid hsl(0 0% 30% / 1);
    padding: 1rem;
    z-index: 1;
}

/* Hintergrundfläche */

.regular-hours::before,
.special-hours::before{
    content: "";
    position: absolute;
    background: hsl(0 0% 20% / 1);
    z-index: -1;
}

@media (max-width: 575px) {
    .regular-hours::before,
    .special-hours::before {
        inset: -9px 0 0 0;
    }
}
@media (min-width: 576px) and (max-width: 767px) {
    .regular-hours::before,
    .special-hours::before {
        inset: -10px 0 0 0;
    }
}
@media (min-width: 768px) and (max-width: 991px) {
    .regular-hours::before,
    .special-hours::before {
        inset: -12px 0 0 0;
    }
}
@media (min-width: 992px) and (max-width: 1199px) {
    .regular-hours::before,
    .special-hours::before {
        inset: -13px 0 0 0;
    }
}
@media (min-width: 1200px) {
    .regular-hours::before,
    .special-hours::before {
        inset: -15px 0 0 0;
    }
}

legend h4{
    margin: 0;
}

/* special effect */
       /*
       .regular-hours::before,
       .special-hours::before{
           content: "";
           position: absolute;
           inset: 2px -18px -20px 14px;
       }
       */
fieldset{
    min-inline-size: 0;
}