/* =========================================================================
   Essen & Trinken – Stände im Glas-Stil. Nutzt die Design-Tokens aus app.css
   (dark & light identisch über CSS-Variablen). Laedt NACH Bootstrap + app.css.
   ========================================================================= */

.essen-head { padding-bottom: 1rem; }
.essen-head .hero__gemeinde { margin: 0 auto 1.2rem; color: var(--text); }
.essen-title { font-size: clamp(2rem, 7vw, 3.2rem); margin-bottom: .5rem; }
.essen-wrap { padding: 0 clamp(1rem, 4vw, 2rem) 4rem; }

/* Bootstrap-Grid (row/col) bleibt; nur das Aussehen der Karten anpassen */
#PRODUCS .container, #PRODUCS .album { max-width: 1080px; }
.PRODUCS .row { display: flex; flex-wrap: wrap; }

.card.box-shadow, #PRODUCS .card {
    background: var(--glass);
    border: 1px solid var(--glass-brd);
    border-radius: var(--radius);
    -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
    box-shadow: none;
    color: var(--text);
    padding: 1.1rem 1.3rem;
    transition: transform .25s var(--ease), background .25s, border-color .25s;
}
.card.box-shadow:hover, #PRODUCS .card:hover {
    transform: translateY(-4px);
    background: var(--glass-strong);
    border-color: var(--purple-300);
}
.card-title { color: var(--text); font-family: 'Space Grotesk', sans-serif; font-weight: 600; font-size: 1.15rem; }
.card-text { color: var(--text); }

/* Menü-Liste je Stand */
.menu-list__items { list-style: none; padding-left: 0; margin: .4rem 0 0; }
.menu-list__item { padding: .35rem 0; border-top: 1px solid var(--glass-brd); }
.menu-list__item:first-child { border-top: none; }
.menu-list__item h4 { font-size: .98rem; font-weight: 500; color: var(--text); margin: 0; }
.menu-list__item .fw-lighter { color: var(--text-dim); font-size: .85rem; margin: .1rem 0 0; }
.desc__content { color: var(--text-dim); }
.menu-list__item .container, .menu-list__item .row { padding: 0; margin: 0; }
.menu-list__item .col-sm { padding: 0 2px; }

/* gepunktete Trennlinie zwischen Name und Preis – in Textfarbe */
.dotted-gradient {
    background-image: radial-gradient(circle closest-side, var(--text-dim) 99%, transparent 1%);
    background-position: center; background-size: 5px 2px; background-repeat: repeat-x;
    opacity: .5;
}

/* Bestell-/Flow-Leiste unten an das Theme angleichen */
#flow_bar { background: var(--bg-soft) !important; border-top: 1px solid var(--glass-brd) !important; }