/* Speiseplan – Ausgabe auf der Seite. Nutzt die Hausfarben aus design.css,
   bringt aber eigene Rückfallwerte mit, damit es auch ohne Theme-CSS gut aussieht. */
.gsw-sp{margin:1.5rem 0}

.gsw-sp__karte{
  display:flex;align-items:center;gap:1rem;
  padding:1rem 1.25rem;
  background:var(--blue-s,#e6f5fc);
  border-radius:16px;
  box-shadow:var(--shadow-sm,0 3px 12px rgba(34,50,76,.08));
  color:var(--ink,#22324c);text-decoration:none;
  transition:transform .14s,box-shadow .14s;
}
.gsw-sp__karte:hover,.gsw-sp__karte:focus-visible{
  transform:translateY(-2px);
  box-shadow:var(--shadow,0 6px 22px rgba(34,50,76,.10));
  color:var(--ink,#22324c);
}
.gsw-sp__ic{flex:none;color:var(--blue-d,#1580ad);display:flex}
.gsw-sp__txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:.15rem}
.gsw-sp__txt strong{font-family:'Fredoka',sans-serif;font-weight:600;font-size:1.12rem;line-height:1.25}
.gsw-sp__txt small{color:var(--ink-2,#5b6a82);font-size:.86rem}
.gsw-sp__btn{
  flex:none;
  font-family:'Fredoka',sans-serif;font-weight:600;font-size:.95rem;
  background:var(--blue-t,#1377a0);color:#fff;
  padding:.6em 1.2em;border-radius:14px;
}
.gsw-sp__karte:hover .gsw-sp__btn,
.gsw-sp__karte:focus-visible .gsw-sp__btn{background:#106a91}

.gsw-sp__leer{
  padding:1rem 1.25rem;border-radius:16px;
  background:var(--yellow-s,#fff6dd);color:var(--ink,#22324c);margin:0;
}

.gsw-sp__archiv{margin-top:1.25rem}
.gsw-sp__archiv summary{
  cursor:pointer;font-family:'Fredoka',sans-serif;font-weight:600;
  color:var(--blue-d,#1580ad);
}
.gsw-sp__archiv ul{list-style:none;margin:.75rem 0 0;padding:0}
.gsw-sp__archiv li{
  display:flex;flex-wrap:wrap;align-items:baseline;gap:.5rem;
  padding:.5rem 0;border-bottom:1px solid var(--line,#ececec);
}
.gsw-sp__archiv li span{color:var(--ink-2,#5b6a82);font-size:.86rem}

@media (max-width:600px){
  .gsw-sp__karte{flex-wrap:wrap;gap:.75rem;padding:1rem}
  .gsw-sp__txt{flex-basis:calc(100% - 44px)}
  .gsw-sp__btn{width:100%;text-align:center}
}

/* Ein Plan aus einer vergangenen Woche wird sichtbar als solcher benannt. */
.gsw-sp__hinweis{
  margin:0 0 .9rem;padding:.85rem 1rem;border-radius:12px;
  background:#fdf3d8;border:1px solid #e6cf92;color:#5c4415;
  font-size:.96rem;line-height:1.5
}
.gsw-sp__karte--alt{border-color:#e6cf92}
.gsw-sp__etikett{
  display:inline-block;margin-left:.6em;padding:.15em .55em;border-radius:7px;
  background:#f3e2b4;color:#5c4415;font-size:.72rem;font-weight:700;
  letter-spacing:.04em;text-transform:uppercase;vertical-align:.12em
}

/* ===== Wochenübersicht als Karten (25.09.) ===== */
.gsw-sp__woche{margin:0 0 2rem}
.gsw-sp__wochenkopf{font-size:1.25rem;margin:0 0 .8rem}
/* Die Themevorgabe für Listen im Inhaltsbereich rückt jede ol um 34px ein.
   Das stand hier links vor den Karten und fehlte rechts — deshalb die
   genauere Regel mit Elementnamen, nicht !important. */
.gsw-sp ol.gsw-sp__tage{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:repeat(5,1fr);gap:14px;align-items:stretch
}
/* Jeder Tag hat seine Farbe, wie die Kacheln auf der Startseite. Zwei Werte je
   Karte — „--f" die kräftige Farbe für Kopf und Rahmen, „--fs" der helle Grund.
   Gerechnet gegen die Vorgabe 4,5:1: weiße Schrift auf den kräftigen Tönen
   erreicht 4,52 bis 5,04, die graue Beschriftung auf den hellen Gründen 5,11
   bis 5,50, der Fließtext über 11. */
.gsw-sp__tag{
  --f:var(--blue-t,#1377a0); --fs:var(--blue-s,#e6f5fc);
  background:var(--fs);border:1px solid var(--f);border-radius:14px;
  display:flex;flex-direction:column;overflow:hidden
}
.gsw-sp__tag--mo{--f:var(--blue-t,#1377a0);   --fs:var(--blue-s,#e6f5fc)}
.gsw-sp__tag--di{--f:var(--green-t,#347d47);  --fs:var(--green-s,#e9f6ec)}
.gsw-sp__tag--mi{--f:var(--yellow-t,#946a00); --fs:var(--yellow-s,#fff6dd)}
.gsw-sp__tag--do{--f:var(--coral-t,#bd503a);  --fs:var(--coral-s,#fdeae5)}
.gsw-sp__tag--fr{--f:var(--lime-t,#5f811e);   --fs:var(--lime-s,#eef6df)}

.gsw-sp__tagname{
  font-size:1rem;margin:0;padding:.6em 15px;
  background:var(--f);color:#fff;
  display:flex;align-items:center;gap:.5em;flex-wrap:wrap
}
.gsw-sp__inhalt{padding:14px 15px 18px;display:flex;flex-direction:column;gap:1.25em}
.gsw-sp__heute{
  font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;
  background:#fff;color:var(--f);border-radius:6px;padding:.16em .5em
}
/* Der heutige Tag bekommt einen Ring. Zuerst ein Wert, den jeder Browser kennt,
   darunter die farbige Fassung für die, die color-mix beherrschen. */
.gsw-sp__tag--heute{box-shadow:0 0 0 3px rgba(34,50,76,.16)}
@supports (color:color-mix(in srgb, red 50%, transparent)){
  .gsw-sp__tag--heute{box-shadow:0 0 0 3px color-mix(in srgb, var(--f) 30%, transparent)}
}
.gsw-sp__zeile{margin:0;font-size:.93rem;line-height:1.45;color:var(--ink,#22324c)}
/* Die Beschriftung trennt die drei Angaben voneinander. Dunkel und fett statt
   grau, damit die Abgrenzung auch beim Überfliegen trägt — auf den hellen
   Kartengründen sind das über 11:1. */
.gsw-sp__bez{
  display:block;font-size:.72rem;font-weight:800;text-transform:uppercase;
  letter-spacing:.06em;color:var(--ink,#22324c);margin-bottom:.3em
}
.gsw-sp__quelle{margin:.9rem 0 0;font-size:.86rem;color:#5b6570;line-height:1.5}

@media(max-width:900px){
  .gsw-sp ol.gsw-sp__tage{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:600px){
  .gsw-sp ol.gsw-sp__tage{grid-template-columns:1fr}
}
