:root {
  color-scheme: light;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: #202820;
  background: #f5f6f1;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  --green-900: #193d2a;
  --green-700: #315d40;
  --green-100: #e5eee4;
  --border: #dfe5dc;
  --muted: #657066;
}
* { box-sizing: border-box; }
body { margin: 0; line-height: 1.5; }
a { color: var(--green-700); text-underline-offset: .18em; }
a:hover { color: var(--green-900); }
.container { width: min(1160px, calc(100% - 2.5rem)); margin-inline: auto; }
.hero { padding: 3.2rem 0 2.8rem; background: var(--green-900); color: #fff; }
.eyebrow { margin: 0 0 .65rem; color: #c4d9c4; font-size: .78rem; font-weight: 750; letter-spacing: .13em; text-transform: uppercase; }
h1 { margin: 0; font-size: clamp(2.25rem, 5vw, 3.8rem); line-height: 1.06; letter-spacing: -.04em; }
.hero p:last-child { max-width: 42rem; margin: 1rem 0 0; color: #e0e9df; font-size: 1.08rem; }
main.container { padding-top: 1.8rem; padding-bottom: 2rem; }
.filters { display: grid; grid-template-columns: minmax(220px, 2fr) minmax(150px, .9fr) minmax(160px, 1fr) minmax(140px, .8fr); gap: .9rem; padding: 1rem; border: 1px solid var(--border); border-radius: 1rem; background: #fff; box-shadow: 0 5px 18px rgb(24 45 27 / 4%); }
label { display: grid; align-content: start; gap: .4rem; color: #3d493e; font-size: .85rem; font-weight: 700; }
input, select { width: 100%; min-height: 2.75rem; padding: .6rem .75rem; border: 1px solid #cbd4c9; border-radius: .55rem; background: #fff; color: inherit; font: inherit; }
input:focus, select:focus, a:focus-visible { outline: 3px solid #8ebd91; outline-offset: 2px; }
#status { margin: 1.1rem 0 1.4rem; color: var(--muted); font-size: .92rem; }
.day-group { margin: 1.9rem 0 2.4rem; }
.day-heading { display: flex; justify-content: space-between; align-items: end; gap: 1rem; margin-bottom: .85rem; padding-bottom: .8rem; border-bottom: 1px solid #d5ddd2; }
.day-kicker { margin: 0 0 .2rem; color: var(--green-700); font-size: .76rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.day-heading h2 { margin: 0; font-size: clamp(1.35rem, 2.5vw, 1.8rem); line-height: 1.2; letter-spacing: -.025em; text-transform: capitalize; }
.dish-count { flex: 0 0 auto; padding: .3rem .65rem; border-radius: 999px; background: var(--green-100); color: var(--green-900); font-size: .78rem; font-weight: 750; }
.dish-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.dish-card { display: flex; flex-direction: column; min-width: 0; padding: 1.1rem 1.15rem .9rem; border: 1px solid var(--border); border-radius: .85rem; background: #fff; box-shadow: 0 3px 12px rgb(30 40 20 / 3%); }
.dish-heading h3 { margin: .1rem 0 0; font-size: 1.08rem; line-height: 1.35; letter-spacing: -.01em; }
.category-label { margin: 0; color: var(--green-700); font-size: .74rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.dish-description { margin: .6rem 0 0; color: #485349; }
.prices { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; margin: 1rem 0 .75rem; padding: .75rem 0; border-top: 1px solid #e7ebe5; border-bottom: 1px solid #e7ebe5; }
.price-tier { min-width: 0; }
.price-tier dt { color: var(--muted); font-size: .76rem; }
.price-tier dd { margin: .15rem 0 0; font-size: 1.03rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.price-tier dd.price-missing { color: #7a8178; font-weight: 500; }
.tags { display: flex; flex-wrap: wrap; gap: .35rem; margin: .1rem 0 .8rem; }
.tag { display: inline-flex; align-items: center; padding: .18rem .48rem; border-radius: .35rem; background: #f0f3ed; color: #4a584b; font-size: .73rem; font-weight: 650; }
.dish-footer { margin-top: auto; padding-top: .25rem; font-size: .82rem; }
.note { margin: 1.8rem 0 0; color: var(--muted); font-size: .88rem; }
footer { padding: 1.2rem 0; border-top: 1px solid var(--border); color: var(--muted); font-size: .86rem; }
@media (max-width: 850px) {
  .filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dish-grid { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .container { width: min(100% - 1.25rem, 1160px); }
  .hero { padding: 2.5rem 0 2rem; }
  .filters { grid-template-columns: 1fr; padding: .8rem; }
  .day-heading { align-items: start; flex-direction: column; gap: .55rem; }
  .dish-card { padding: 1rem; }
  .price-tier dt { font-size: .7rem; }
  .price-tier dd { font-size: .95rem; }
}


/* Kompakte Listenansicht mit optionaler Kachelansicht */
.results-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.results-toolbar #status { margin: 1.1rem 0 1rem; }
.view-toggle { display: inline-flex; flex: 0 0 auto; gap: .2rem; padding: .22rem; border: 1px solid var(--border); border-radius: .7rem; background: #fff; }
.view-toggle button { min-height: 2.25rem; padding: .35rem .7rem; border: 0; border-radius: .45rem; background: transparent; color: #4b574c; font: inherit; font-size: .86rem; font-weight: 700; cursor: pointer; }
.view-toggle button:hover { background: #f0f3ed; }
.view-toggle button.is-active { background: var(--green-900); color: #fff; }
.view-toggle button:focus-visible { outline: 3px solid #8ebd91; outline-offset: 2px; }
.dish-grid { display: flex; flex-direction: column; gap: .55rem; }
.dish-card { flex-direction: row; align-items: center; gap: 1.1rem; padding: .75rem .9rem; border-radius: .65rem; box-shadow: none; }
.dish-heading h3 { margin: 0; font-size: 1rem; line-height: 1.35; }
.dish-card > div:first-child { flex: 1 1 auto; min-width: 0; }
.category-label { margin-bottom: .12rem; font-size: .68rem; }
.dish-description { margin: .25rem 0 0; font-size: .88rem; }
.dish-card .prices { flex: 0 0 min(43%, 370px); gap: .35rem; margin: 0; padding: 0; border: 0; }
.price-tier dt { font-size: .68rem; }
.price-tier dd { margin-top: .05rem; font-size: .9rem; }
.dish-footer { margin-top: .25rem; padding-top: 0; text-align: right; font-size: .75rem; }
.tags { gap: .25rem; margin: .45rem 0 0; }
.tag { padding: .12rem .38rem; font-size: .7rem; }
.card-view.dish-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.card-view .dish-card { flex-direction: column; align-items: stretch; gap: .6rem; padding: .9rem 1rem; }
.card-view .dish-card .prices { flex-basis: auto; width: 100%; margin: .2rem 0 .15rem; padding: .6rem 0; border-top: 1px solid #e7ebe5; border-bottom: 1px solid #e7ebe5; }
.card-view .price-tier dt { font-size: .72rem; }
.card-view .price-tier dd { font-size: .98rem; }
.card-view .dish-footer { padding-top: .15rem; text-align: left; }
@media (max-width: 850px) {
  .card-view.dish-grid { grid-template-columns: 1fr; }
  .dish-card { gap: .75rem; }
  .dish-card .prices { flex-basis: 45%; }
}
@media (max-width: 600px) {
  .results-toolbar { align-items: flex-start; flex-direction: column; gap: .2rem; }
  .results-toolbar #status { margin-bottom: .6rem; }
  .dish-card { align-items: stretch; flex-direction: column; gap: .55rem; padding: .8rem; }
  .dish-card .prices { flex-basis: auto; }
  .dish-footer { text-align: left; }
}

/* Listenansicht: Gericht links, Preise rechts, Kennzeichnungen darunter */
.dish-card { display: grid; grid-template-columns: minmax(0, 1fr) minmax(290px, 43%); grid-template-areas: "heading prices" "description prices" "tags footer"; column-gap: 1.1rem; row-gap: .2rem; }
.dish-heading { grid-area: heading; min-width: 0; }
.dish-card > .dish-description { grid-area: description; }
.dish-card > .prices { grid-area: prices; align-self: center; min-width: 0; }
.dish-card > .tags { grid-area: tags; align-self: center; }
.dish-card > .dish-footer { grid-area: footer; align-self: center; }
.card-view .dish-card { display: flex; }
.card-view .dish-card > .dish-heading,
.card-view .dish-card > .dish-description,
.card-view .dish-card > .prices,
.card-view .dish-card > .tags,
.card-view .dish-card > .dish-footer { grid-area: auto; }
@media (max-width: 850px) {
  .dish-card { grid-template-columns: minmax(0, 1fr) minmax(240px, 45%); column-gap: .75rem; }
}
@media (max-width: 600px) {
  .dish-card { display: flex; }
}

/* Einheitliche Preis-Spalten in jeder Zeile */
.list-view .dish-card { grid-template-columns: minmax(0, 1fr) minmax(360px, 43%); }
.list-view .dish-card > .prices { width: 100%; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .65rem; }
.list-view .price-tier { min-width: 0; }
.list-view .price-tier dt { white-space: nowrap; }
.checkbox-label { display: flex; align-items: center; align-self: end; gap: .6rem; min-height: 2.75rem; font-size: .85rem; }
.checkbox-label input[type="checkbox"] { width: 1.1rem; min-height: 1.1rem; height: 1.1rem; margin: 0; padding: 0; accent-color: var(--green-700); }
@media (max-width: 850px) {
  .list-view .dish-card { grid-template-columns: minmax(0, 1fr) minmax(320px, 45%); }
  .filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 650px) {
  .list-view .dish-card { display: flex; }
  .list-view .dish-card > .prices { width: 100%; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .list-view .price-tier dt { white-space: normal; }
}
