/* Externe Ansicht (extern.php) – ergänzt menu.css */

.sk-restaurant .sk-wrap { max-width: 46rem; }
.sk-restaurant .sk-block + .sk-block,
.sk-restaurant .sk-menu + .sk-menu { margin-top: 3rem; }

.sk-preview-notice {
  position: sticky; top: 0; z-index: 5;
  padding: .55rem 1rem; text-align: center;
  font: 600 .875rem/1.4 system-ui, sans-serif;
  background: #FBF3DC; color: #5A4300; border-bottom: 1px solid #E8D9A8;
}

/* Bildschirmbetrieb (&tv=1): groß, ohne Bedienelemente, auf breiten Schirmen zweispaltig */
.sk-tv { cursor: none; }
.sk-tv main { max-width: none; padding: 3vh 4vw 6vh; }
.sk-tv .sk-wrap { max-width: none; font-size: clamp(1.1rem, 1.45vw, 2rem); }
.sk-tv .sk-venue { margin-bottom: 3vh; }
.sk-tv .sk-venue-name { font-size: clamp(2.5rem, 4.5vw, 5.5rem); }
@media (min-width: 1100px) {
  .sk-tv .sk-restaurant-content { column-count: 2; column-gap: 5vw; }
  .sk-tv .sk-header { column-span: all; }
  .sk-tv .sk-section, .sk-tv .sk-day, .sk-tv .sk-note { break-inside: avoid; }
}
@media (min-width: 2200px) {
  .sk-tv .sk-restaurant-content { column-count: 3; }
}

/* im Bildschirmbetrieb alle Größen relativ zur großen Grundschrift */
.sk-tv .sk-wrap .sk-title { font-size: 2.1em; }
.sk-tv .sk-wrap .sk-subtitle { font-size: .95em; }
.sk-tv .sk-wrap .sk-section-name,
.sk-tv .sk-wrap .sk-day-name { font-size: 1.3em; }
.sk-tv .sk-wrap .sk-day-section { font-size: .8em; }
.sk-tv .sk-wrap .sk-name { font-size: 1.05em; }
.sk-tv .sk-wrap .sk-description { font-size: .9em; }
.sk-tv .sk-wrap .sk-allergens,
.sk-tv .sk-wrap .sk-price-note { font-size: .7em; }
.sk-tv .sk-wrap .sk-label { font-size: .62em; }
.sk-tv .sk-wrap .sk-legend { font-size: .7em; }
.sk-tv .sk-wrap .sk-item td { padding: .55em 0; }

/* Handy: Karten → Kategorien → Gerichte, mit Zurück-Leiste ------------------- */
.sk-top { position: sticky; top: 0; z-index: 5; }
.sk-top .sk-preview-notice { position: static; }
/* gleiche Breite und Seitenabstände wie main, Inhalt bündig mit der Karte (.sk-wrap) */
.sk-back-bar {
  max-width: 50rem; margin: 0 auto; padding: .35rem clamp(1.25rem, 5vw, 3.5rem);
  padding-top: max(.35rem, env(safe-area-inset-top));
  background: var(--sk-background, #fff);
  border-bottom: 1px solid color-mix(in srgb, var(--sk-text, #1D2320) 18%, var(--sk-background, #fff));
  font: 1rem/1.3 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
.sk-back-inner { display: flex; align-items: center; gap: 1rem; max-width: 46rem; margin: 0 auto; }
.sk-back {
  margin-left: -.75rem;
  display: inline-flex; align-items: center; gap: .5rem; min-height: 2.75rem; padding: 0 .75rem;
  color: var(--sk-accent, #2F4A3A); font-weight: 600; text-decoration: none; border-radius: 2rem;
}
.sk-back::before {
  content: ""; width: .55rem; height: .55rem;
  border-left: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg);
}
.sk-back:hover, .sk-back:active { background: color-mix(in srgb, var(--sk-accent, #2F4A3A) 10%, transparent); }
.sk-back:focus-visible { outline: 2px solid var(--sk-accent, #2F4A3A); outline-offset: 2px; }
.sk-back-venue {
  margin-left: auto; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
  font-size: .8125rem; color: color-mix(in srgb, var(--sk-text, #1D2320) 68%, var(--sk-background, #fff));
}
.sk-restaurant.sk-with-back main { padding-top: 1.75rem; }

.sk-restaurant .sk-wrap .sk-header { margin-bottom: 1.25rem; }
.sk-restaurant .sk-wrap .sk-eyebrow {
  margin-bottom: .25rem; font-family: var(--sk-sans); font-size: .8125rem;
  letter-spacing: .06em; text-transform: uppercase; color: var(--sk-muted);
}
.sk-restaurant .sk-wrap .sk-title .sk-day-date { font-weight: 400; color: var(--sk-muted); }

.sk-wrap .sk-list { list-style: none; border-top: 1px solid var(--sk-line); }
.sk-wrap .sk-list a {
  display: grid; grid-template-columns: 1fr auto; align-items: center; column-gap: 1rem;
  min-height: 3.75rem; padding: .9rem .25rem;
  border-bottom: 1px solid var(--sk-line);
  color: var(--sk-text); text-decoration: none;
  -webkit-tap-highlight-color: transparent;
}
.sk-wrap .sk-list a::after {
  content: ""; grid-column: 2; grid-row: 1 / span 9; width: .5rem; height: .5rem; margin-right: .35rem;
  border-right: 2px solid var(--sk-accent); border-top: 2px solid var(--sk-accent); transform: rotate(45deg);
}
.sk-wrap .sk-list a:hover .sk-list-name, .sk-wrap .sk-list a:active .sk-list-name { color: var(--sk-accent); }
.sk-wrap .sk-list a:active { background: var(--sk-surface); }
.sk-wrap .sk-list a:focus-visible { outline: 2px solid var(--sk-accent); outline-offset: -2px; }
.sk-wrap .sk-list-name { grid-column: 1; font-family: var(--sk-heading-font, var(--sk-font)); font-size: 1.25rem; font-weight: 600; line-height: 1.3; }
.sk-wrap .sk-list-detail { grid-column: 1; margin-top: .15rem; font-family: var(--sk-sans); font-size: .8125rem; color: var(--sk-muted); }
.sk-wrap .sk-list .sk-today a { padding-left: 1rem; box-shadow: inset 3px 0 var(--sk-accent); }