/* NB2c — Gericht-Detailseite: Reiter (reiner CSS-Kniff, radio-button, wie
   Codes/menu_site_generator.py build_nutrition_tabs, MSG:3646 "Pure CSS — kein JS
   nötig") + Nährwert-Tabelle + Allergen-Grid + Zusatzstoff-Chips.
   Eigene Datei statt cy-menu.css (das ist der NB1-gerettete, byte-identische Live-
   Asset für Kopf/Fuß/Mobilmenü — hier nicht mit anfassen) — analog zu
   cy-sidebar-filter.css aus NB2b. */

.cy-dish-tabs { background: #fff; border: 1px solid #E2E8F0; border-radius: 10px; margin-bottom: 24px; overflow: hidden; }
.cy-dish-tabs input[type="radio"] { display: none; }
.cy-dish-tabs .cy-tab-labels { display: flex; flex-wrap: wrap; border-bottom: 1px solid #E2E8F0; background: #F7FAFC; }
.cy-dish-tabs .cy-tab-labels label { padding: 12px 18px; font-size: .88rem; font-weight: 600; color: #4A5568; cursor: pointer; border-bottom: 3px solid transparent; }
.cy-dish-tabs .cy-tab-panel { display: none; padding: 20px 24px; }

#cy-tab-nutrition:checked ~ .cy-tab-labels label[for="cy-tab-nutrition"],
#cy-tab-vitamins:checked ~ .cy-tab-labels label[for="cy-tab-vitamins"],
#cy-tab-minerals:checked ~ .cy-tab-labels label[for="cy-tab-minerals"],
#cy-tab-allergens:checked ~ .cy-tab-labels label[for="cy-tab-allergens"] {
  color: #c8102e; border-bottom-color: #c8102e; background: #fff;
}
#cy-tab-nutrition:checked ~ .cy-tab-panels .cy-tab-panel[data-panel="nutrition"],
#cy-tab-vitamins:checked ~ .cy-tab-panels .cy-tab-panel[data-panel="vitamins"],
#cy-tab-minerals:checked ~ .cy-tab-panels .cy-tab-panel[data-panel="minerals"],
#cy-tab-allergens:checked ~ .cy-tab-panels .cy-tab-panel[data-panel="allergens"] {
  display: block;
}

.cy-nutrition-table { width: 100%; border-collapse: collapse; font-size: .88rem; }
.cy-nutrition-table th, .cy-nutrition-table td { text-align: left; padding: 7px 10px; border-bottom: 1px solid #EDF2F7; }
.cy-nutrition-table th { color: #718096; font-weight: 600; font-size: .78rem; text-transform: uppercase; }
.cy-nutrition-table td.cy-nutrition-value { text-align: right; font-variant-numeric: tabular-nums; }
.cy-nutrition-pending { color: #718096; font-size: .88rem; font-style: italic; padding: 8px 0; }

.cy-allergen-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(155px, 1fr)); gap: 8px; }
.cy-allergen-item { display: flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: 6px; font-size: .85rem; color: #2D3748; }
.cy-allergen-item.present { background: #FFF5F5; border: 1px solid #FEB2B2; }
.cy-allergen-item.absent { background: #F7FAFC; border: 1px solid #E2E8F0; }
/* AL1-Port (06.09.) — enthalten, aber alle Quell-Zutaten abwählbar (Topping/
   Garnitur). Bewusst eine dritte Farbe (Amber), nicht rot/grau — "enthalten"
   und "enthalten, aber optional" sollen auf einen Blick unterscheidbar sein. */
.cy-allergen-item.optional { background: #FFFBEB; border: 1px solid #F6C453; }
.cy-allergen-optional-note { font-size: .78rem; color: #7B5B00; margin: 8px 0 0; }

.cy-additives-block { margin-top: 16px; }
.cy-additives-none { color: #2F855A; font-size: .85rem; }
.cy-additives-unknown { color: #718096; font-size: .85rem; font-style: italic; }
.cy-additive-chip { display: inline-block; background: #FFF5F5; border: 1px solid #FEB2B2; color: #C53030; font-size: .8rem; padding: 3px 10px; border-radius: 999px; margin: 2px 6px 2px 0; }

.cy-vegan-badge { background: #38A169; color: #fff; padding: 2px 8px; border-radius: 4px; font-size: .75rem; font-weight: 600; margin-left: 10px; vertical-align: middle; }
.cy-gold-seal { background: #B7791F; color: #fff; padding: 2px 8px; border-radius: 4px; font-size: .75rem; font-weight: 600; margin-left: 6px; vertical-align: middle; }

/* ZUT2 (ADR-032 §8 Schritt 4) — Zutatenzeile unter der Beschreibung, Detail- UND
   Listenkarte (lib/menu/dishView.ts::buildIngredientLine). Kleinschreibung NUR
   hier (CSS), nie in den Daten — s. dishView.ts-Kopfkommentar. */
.cy-ingredient-line { font-size: .8rem; color: #718096; text-transform: lowercase; line-height: 1.5; }
