/* Mr. Napoli – bestellbare Speisekarte */
.mn-menu { --mn-gold: var(--wp--preset--color--gold, #C9A24B); --mn-red: var(--wp--preset--color--red, #B3261E); --mn-ink: var(--wp--preset--color--contrast, #141414); --mn-muted: var(--wp--preset--color--muted, #6B6460); }
.mn-menu-discount { text-align: center; font-weight: 600; color: var(--mn-red); margin: 0 0 1rem; }
.mn-menu .mn-menu-section { max-width: var(--wp--style--global--content-size, 760px); margin-inline: auto; padding: var(--wp--preset--spacing--50, 2rem) 16px 0; }
.mn-order-dish { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; }
.mn-order-dish .mn-dish-text { flex: 1 1 auto; min-width: 0; }
.mn-order-dish .mn-dish-buy { flex: 0 0 auto; display: flex; flex-direction: column; align-items: flex-end; gap: .5rem; }
.mn-order-dish .mn-was { color: var(--mn-muted); font-weight: 400; font-size: .85em; margin-right: .25rem; }
.mn-order-dish .mn-dish-price ins { text-decoration: none; }
.mn-sizes { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .5rem; }
.mn-size { border: 1.5px solid var(--mn-ink); background: transparent; color: var(--mn-ink); border-radius: 999px; padding: .3rem .8rem; font: inherit; font-size: .9rem; cursor: pointer; min-height: 36px; }
.mn-size.is-active { background: var(--mn-ink); color: #fff; }
.mn-size:disabled { opacity: .4; cursor: not-allowed; }
.mn-buy { display: flex; align-items: center; gap: .5rem; }
.mn-qty { display: inline-flex; align-items: center; border: 1.5px solid var(--mn-ink); border-radius: 999px; overflow: hidden; height: 40px; }
.mn-qty button { width: 38px; height: 100%; border: 0; background: transparent; font-size: 1.25rem; line-height: 1; cursor: pointer; color: var(--mn-ink); }
.mn-qty button:hover { background: rgba(0,0,0,.06); }
.mn-qty-input { width: 2.4rem; height: 100%; border: 0; text-align: center; font: inherit; font-weight: 600; background: transparent; -moz-appearance: textfield; appearance: textfield; padding: 0; }
.mn-qty-input::-webkit-outer-spin-button, .mn-qty-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.mn-menu .mn-add { height: 40px; line-height: 1; letter-spacing: .02em; margin: 0; border: 0; border-radius: 999px; padding: 0 1.1rem; background: var(--mn-red); color: #fff; font-weight: 600; cursor: pointer; white-space: nowrap; font-size: .95rem; }
.mn-menu .mn-add:hover { filter: brightness(1.1); }
.mn-menu .mn-add.is-done { background: var(--wp--preset--color--green, #3E7C3A); }
.mn-add:disabled { cursor: default; }
.mn-soldout { color: var(--mn-muted); font-size: .9rem; margin: 0; }
.mn-menu-toast { position: fixed; left: 50%; bottom: 16px; transform: translateX(-50%); z-index: 9999; background: var(--mn-ink); color: #fff; padding: .75rem 1.1rem; border-radius: 12px; box-shadow: 0 6px 24px rgba(0,0,0,.25); max-width: calc(100vw - 32px); font-size: .95rem; }
.mn-menu-toast a { color: var(--wp--preset--color--gold-light, #E6CF95); font-weight: 600; }
.mn-menu-toast.is-error { background: var(--mn-red); }
.mn-menu-toast[hidden] { display: none; }
/* Extras */
.mn-extras { margin-top: .6rem; font-size: .92rem; }
.mn-x-group { border: 0; padding: 0; margin: 0 0 .5rem; }
.mn-x-group legend { font-weight: 600; padding: 0; margin-bottom: .3rem; }
.mn-x-opts { display: flex; flex-wrap: wrap; gap: .35rem; }
.mn-x-opt { display: inline-flex; align-items: center; gap: .35rem; border: 1px solid rgba(20,20,20,.2); border-radius: 999px; padding: .25rem .7rem; cursor: pointer; background: #fff; min-height: 34px; }
.mn-x-opt:has(input:checked) { border-color: var(--mn-ink); background: var(--wp--preset--color--gold-light, #E6CF95); }
.mn-x-opt input { margin: 0; accent-color: var(--mn-red); }
.mn-x-price, .mn-x-req { white-space: nowrap; color: var(--mn-muted); font-weight: 400; font-size: .85em; }
.mn-x-group.is-missing legend, .mn-x-group.is-missing .mn-x-req { color: var(--mn-red); }
.mn-x-more summary { cursor: pointer; color: var(--mn-red); font-weight: 600; display: inline-block; padding: .2rem 0; }
.mn-x-more[open] summary { margin-bottom: .4rem; }
.mn-allergens { color: var(--mn-muted); font-family: var(--wp--preset--font-family--body, sans-serif); font-weight: 400; font-size: .65em; margin-left: .25rem; letter-spacing: 0; text-transform: none; cursor: help; }
@media (max-width: 600px) {
	.mn-order-dish { flex-direction: column; gap: .5rem; }
	.mn-order-dish .mn-dish-buy { width: 100%; align-items: stretch; }
	.mn-menu .mn-order-dish .mn-dish-price { text-align: left; }
	.mn-order-dish .mn-dish-price small { display: inline; margin-left: .35rem; }
	.mn-buy { width: 100%; }
	.mn-menu .mn-add { flex: 1 1 auto; min-width: 0; padding: 0 .75rem; }
}

/* Weglassen: durchgestrichen, sobald abgewählt */
.mn-x-group[data-type="without"] .mn-x-opt:has(input:checked) { background: #fff; border-color: var(--mn-red); color: var(--mn-red); text-decoration: line-through; }
.mn-x-opt:has(input:disabled) { opacity: .45; cursor: not-allowed; }
.mn-x-note { display: block; margin-top: .3rem; }
.mn-x-note span { display: block; font-weight: 600; margin-bottom: .3rem; }
.mn-x-note textarea { width: 100%; box-sizing: border-box; font: inherit; padding: .45rem .6rem; border: 1px solid rgba(20,20,20,.25); border-radius: 8px; resize: vertical; min-height: 2.6rem; }
/* Ziel eines Links von den Angeboten */
.mn-order-dish { scroll-margin-top: 170px; }
.mn-order-dish.is-target { animation: mn-target 2.4s ease-out; border-radius: 10px; }
@keyframes mn-target { 0%, 40% { box-shadow: 0 0 0 3px var(--mn-red); background: rgba(230,207,149,.35); } 100% { box-shadow: 0 0 0 3px transparent; background: transparent; } }

/* Lieferung | Abholung */
.mn-mode { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; max-width: 34rem; margin: 0 auto 1.25rem; }
.mn-mode-btn { display: flex; flex-direction: column; align-items: center; gap: .1rem; padding: .7rem .5rem; border: 2px solid rgba(20,20,20,.2); border-radius: 12px; background: #fff; color: var(--mn-ink, #141414); cursor: pointer; font: inherit; line-height: 1.25; }
.mn-mode-btn strong { font-size: 1.05rem; }
.mn-mode-btn small { font-size: .78rem; color: var(--mn-muted, #666); text-align: center; }
.mn-mode-btn.is-active { border-color: var(--mn-red, #b3261e); background: var(--wp--preset--color--gold-light, #E6CF95); }
.mn-mode-btn.is-active strong::before { content: "✓ "; color: var(--mn-red, #b3261e); }

/* Desktop: breiter, Gerichte in zwei Spalten */
@media (min-width: 1000px) {
	.is-layout-constrained > .mn-menu, .mn-menu { max-width: 1280px !important; width: 100%; margin-inline: auto !important; }
	.mn-menu .mn-order-dish { flex-wrap: wrap; row-gap: .6rem; }
	.mn-menu .mn-order-dish .mn-dish-text { flex: 1 1 100%; }
	.mn-menu .mn-order-dish .mn-dish-buy { flex: 1 1 100%; flex-direction: row; justify-content: space-between; align-items: center; }
	.mn-menu .mn-menu-section { max-width: 1280px; display: grid; grid-template-columns: 1fr 1fr; column-gap: 3rem; align-items: start; padding-inline: 32px; }
	.mn-menu .mn-menu-section > :not(.mn-dish) { grid-column: 1 / -1; }
	.mn-menu .mn-menu-section > .mn-dish:last-child { border-bottom: 1px dashed rgba(20,20,20,.15); }
	.mn-mode { max-width: 40rem; }
}
.mn-x-group[hidden] { display: none !important; }
.mn-x-select { width: 100%; max-width: 28rem; min-height: 42px; padding: .4rem .6rem; border: 1px solid rgba(20,20,20,.3); border-radius: 8px; background: #fff; font: inherit; }
.mn-x-group.is-missing .mn-x-select { border-color: var(--mn-red); }
