/**
 * Öffnungszeiten-Ausgabe (Shortcode: inform_opening_hours).
 *
 * Design-Ziel: wie im Screenshot (dunkler Hintergrund, Linien, aktueller Tag bold).
 * Erweiterungspunkt: Themes über Klassen `inform-ta-hours--dark|--light|--lowkey`.
 */

.inform-ta-hours {
  --oh-text: #ffffff;
  --oh-muted: rgba(255, 255, 255, 0.8);
  --oh-line: rgba(255, 255, 255, 0.35);
  --oh-pad-y: 18px;
  --oh-pad-x: 22px;
  --oh-radius: 10px;
  --oh-font-size: 22px;
  --oh-font-size-sm: 18px;
  --oh-gap: 18px;
  width: 100%;
  color: var(--oh-text);
  border-radius: var(--oh-radius);
}

.inform-ta-hours--light {
  --oh-text: #111111;
  --oh-muted: rgba(17, 17, 17, 0.8);
  --oh-line: rgba(17, 17, 17, 0.2);
}

.inform-ta-hours--lowkey {
  --oh-text: #ffffff;
  --oh-muted: rgba(255, 255, 255, 0.85);
  --oh-line: rgba(255, 255, 255, 0.35);
  border-radius: 0;
}

.inform-ta-hours__inner {
  padding: 10px 0;
}

.inform-ta-hours__row {
  display: grid;
  grid-template-columns: minmax(140px, 1fr) minmax(160px, 1fr);
  align-items: center;
  gap: var(--oh-gap);
  padding: var(--oh-pad-y) var(--oh-pad-x);
  border-top: 1px solid var(--oh-line);
}

.inform-ta-hours__row:first-child {
  border-top: none;
}

.inform-ta-hours__day {
  font-size: var(--oh-font-size);
  line-height: 1.1;
  letter-spacing: 0.01em;
  color: var(--oh-muted);
}

.inform-ta-hours__time {
  font-size: var(--oh-font-size);
  line-height: 1.1;
  text-align: right;
  letter-spacing: 0.01em;
  color: var(--oh-muted);
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 6px;
}

.inform-ta-hours__note {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  opacity: 0.85;
}

.inform-ta-hours__row.is-today.is-open-now .inform-ta-hours__day,
.inform-ta-hours__row.is-today.is-open-now .inform-ta-hours__time {
  color: var(--oh-text);
  font-weight: 700;
}

@media (max-width: 640px) {
  .inform-ta-hours__row {
    grid-template-columns: minmax(120px, 1fr) auto;
    gap: 10px;
    padding: 10px 12px;
  }
  .inform-ta-hours__time {
    text-align: right;
    align-items: flex-end;
  }
  .inform-ta-hours__day,
  .inform-ta-hours__time {
    font-size: var(--oh-font-size-sm);
  }
}

@media (min-width: 641px) and (max-width: 960px) {
  .inform-ta-hours__row {
    grid-template-columns: minmax(140px, 1fr) auto;
    gap: 12px;
    padding: 12px 14px;
  }
  .inform-ta-hours__day,
  .inform-ta-hours__time {
    font-size: 20px;
  }
}