/*
 * Menu v2 skin: STITCH (body.menu-t-stitch). A bold boutique look: a dark, high-contrast masthead (tall photo with a strong overlay gradient),
 * photographic category tiles, magazine-style dish tiles with the name and price over the picture, one strong accent colour.
 * Tokens reuse the platform palette (public/front/css/mesa-tokens.css, --stitch-*) so the brand colour and dark mode follow the appearance settings.
 * Logical properties only (RTL mirrors for free).
 */
body.menu-t-stitch {
    --mn-bg: var(--stitch-canvas, #f8f9fa);
    --mn-surface: var(--stitch-surface, #ffffff);
    --mn-surface-2: var(--stitch-surface-subtle, #f3f4f6);
    --mn-text: var(--stitch-text-primary, #0a0d12);
    --mn-text-2: #3f4856;
    --mn-border: var(--stitch-border-strong, #d1d5db);
    --mn-primary: var(--stitch-emerald-dark, #047857);
    --mn-on-primary: #ffffff;
    --mn-ink: var(--stitch-obsidian, #0a0d12);
    --mn-ink-2: var(--stitch-obsidian-soft, #141820);
    --mn-on-ink: #ffffff;
    --mn-on-ink-2: #cbd5e1;
    --mn-accent: var(--stitch-emerald, #10b981);
    --mn-radius: 20px;
    --mn-radius-sm: 12px;
    --mn-shadow: var(--stitch-shadow-elevated, 0 10px 30px -5px rgba(10, 13, 18, 0.08));
    --mn-max: 1100px;
}
html[data-theme="dark"] body.menu-t-stitch {
    --mn-text-2: var(--stitch-text-secondary, #b6bfcd);
    --mn-on-primary: var(--mq-on-primary, #04130d);
    --mn-focus: #93c5fd;
}

.menu-t-stitch .mn-h1, .menu-t-stitch .mn-h2, .menu-t-stitch .mn-h3 { letter-spacing: -0.02em; font-weight: 800; }
.menu-t-stitch .mn-h2 { font-size: 1.4rem; }
.menu-t-stitch .mn-h3 { font-size: 1.35rem; margin-block-end: 14px; }

/* ------------------------------------------------------------ chrome: dark bar, accent cart */
.menu-t-stitch .mn-topbar { background: var(--mn-ink); border-block-end: 0; color: var(--mn-on-ink); }
.menu-t-stitch .mn-topbar-name, .menu-t-stitch .mn-topbar-back { color: var(--mn-on-ink); font-weight: 800; letter-spacing: -0.01em; }
.menu-t-stitch .mq-headcart { border: 0; background: var(--mn-primary); color: var(--mn-on-primary); --c-surface-2: rgba(255, 255, 255, 0.25); --c-text-2: var(--mn-on-primary); }
.menu-t-stitch .mq-headcart:hover { filter: brightness(1.1); }
.menu-t-stitch .mq-headcart-total { color: var(--mn-on-primary); }
.menu-t-stitch .mq-headcart .mq-headcart-badge { background: var(--mn-on-primary); color: var(--mn-primary); }
.menu-t-stitch .mq-headcart[data-count="0"] .mq-headcart-badge { background: rgba(255, 255, 255, 0.28); color: var(--mn-on-primary); }
.menu-t-stitch :focus-visible { outline-color: var(--mn-focus); }
.menu-t-stitch .mn-topbar :focus-visible, .menu-t-stitch .mn-hero :focus-visible, .menu-t-stitch .mn-identity :focus-visible, .menu-t-stitch .ms-card :focus-visible { outline-color: #ffffff; }

/* ------------------------------------------------------------ A hero + B identity: one dark masthead */
.menu-t-stitch .mn-hero { background: var(--mn-ink); }
.menu-t-stitch .mn-hero-media { aspect-ratio: 4 / 3; min-height: 250px; max-height: 480px; background: var(--mn-ink); }
.menu-t-stitch .mn-hero-fallback { background: radial-gradient(120% 90% at 85% 10%, color-mix(in srgb, var(--mn-accent) 55%, var(--mn-ink)) 0%, transparent 60%), linear-gradient(160deg, var(--mn-primary), var(--mn-ink) 85%); }
.menu-t-stitch .mn-hero-shade { background: linear-gradient(to top, var(--mn-ink) 2%, rgba(10, 13, 18, 0.62) 38%, rgba(10, 13, 18, 0.1) 78%); }
.menu-t-stitch .mn-hero-actions { gap: 8px; }
.menu-t-stitch .mn-hero-btn { background: #ffffff; color: #0a0d12; border: 2px solid #ffffff; font-weight: 700; box-shadow: none; }
.menu-t-stitch .mn-hero-btn:hover { background: var(--mn-accent); border-color: var(--mn-accent); color: #04130d; }
.menu-t-stitch .mn-identity { margin-block-start: 0; margin-inline: calc(var(--mn-gutter) * -1); padding: 18px var(--mn-gutter) 22px; background: var(--mn-ink); color: var(--mn-on-ink); gap: 14px 16px; }
.menu-t-stitch .mn-logo { width: 76px; height: 76px; border-radius: 22px; border: 3px solid var(--mn-accent); background: var(--mn-ink-2); box-shadow: none; }
.menu-t-stitch .mn-logo-tile { background: var(--mn-primary); color: var(--mn-on-primary); border-radius: 0; font-weight: 800; }
.menu-t-stitch .mn-h1 { font-size: 2rem; font-weight: 800; color: var(--mn-on-ink); }
.menu-t-stitch .mn-desc, .menu-t-stitch .mn-branch { color: var(--mn-on-ink-2); }
.menu-t-stitch .mn-lang { background: rgba(255, 255, 255, 0.1); border: 0; padding: 3px; gap: 2px; }
.menu-t-stitch .mn-lang-link { color: var(--mn-on-ink); border-radius: 999px; }
.menu-t-stitch .mn-lang-link.is-active { background: var(--mn-accent); color: #04130d; }
.menu-t-stitch .mn-lang-link:not(.is-active):hover { background: rgba(255, 255, 255, 0.14); }

/* ------------------------------------------------------------ C contact / D links */
.menu-t-stitch .mn-section { margin-block-start: 22px; }
.menu-t-stitch .mn-contact-link { background: var(--mn-ink); color: var(--mn-on-ink); border: 0; }
.menu-t-stitch .mn-contact-link:hover { background: var(--mn-primary); color: var(--mn-on-primary); }
.menu-t-stitch .mn-pill { border: 2px solid var(--mn-text); background: transparent; font-weight: 700; border-radius: 999px; }
.menu-t-stitch .mn-pill:hover { background: var(--mn-text); color: var(--mn-bg); border-color: var(--mn-text); }

/* ------------------------------------------------------------ E search */
.menu-t-stitch .mn-search-input { min-height: 56px; border: 2px solid var(--mn-text); border-radius: 18px; font-weight: 600; font-size: 1.02rem; background: var(--mn-surface); }
.menu-t-stitch .mn-search-input::placeholder { color: var(--mn-text-2); opacity: 1; font-weight: 500; }
.menu-t-stitch .mn-search-input:focus-visible { outline-offset: 3px; border-color: var(--mn-primary); }

/* ------------------------------------------------------------ F categories: photographic tiles in a swipe row */
.menu-t-stitch .mn-cat-cards { display: flex; flex-wrap: nowrap; gap: 10px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x proximity; scrollbar-width: none; padding-block: 2px 6px; margin-inline: calc(var(--mn-gutter) * -1); padding-inline: var(--mn-gutter); }
.menu-t-stitch .mn-cat-cards::-webkit-scrollbar { display: none; }
.menu-t-stitch .mn-cat-cards > li { flex: none; scroll-snap-align: start; }
.menu-t-stitch .mn-cat-card { position: relative; display: block; width: 136px; aspect-ratio: 4 / 5; height: auto; border: 0; border-radius: 18px; background: var(--mn-ink); box-shadow: none; color: #ffffff; isolation: isolate; }
.menu-t-stitch .mn-cat-media { position: absolute; inset: 0; aspect-ratio: auto; z-index: -2; }
.menu-t-stitch .mn-cat-card::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(to top, rgba(10, 13, 18, 0.92) 8%, rgba(10, 13, 18, 0.35) 55%, rgba(10, 13, 18, 0.05)); }
.menu-t-stitch .mn-cat-tile { font-size: 3rem; background: radial-gradient(100% 80% at 80% 0%, color-mix(in srgb, var(--mn-accent) 60%, var(--mn-ink)), transparent 70%), linear-gradient(160deg, var(--mn-primary), var(--mn-ink)); }
.menu-t-stitch .mn-cat-name { position: absolute; inset-inline: 0; inset-block-end: 24px; padding: 0 12px; font-weight: 800; font-size: 1.02rem; line-height: 1.2; color: #ffffff; text-shadow: 0 1px 8px rgba(0, 0, 0, 0.5); }
.menu-t-stitch .mn-cat-count { position: absolute; inset-inline: 0; inset-block-end: 8px; padding: 0 12px; font-size: 0.78rem; color: #e5e7eb; }
.menu-t-stitch .mn-cat-card:hover, .menu-t-stitch .mn-cat-card.is-active { box-shadow: 0 0 0 3px var(--mn-accent); }

/* ------------------------------------------------------------ G products: magazine tiles */
.menu-t-stitch .mn-h3 { display: inline-block; padding-block-end: 6px; border-block-end: 4px solid var(--mn-accent); }
.menu-t-stitch .mn-grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
.menu-t-stitch .ms-card { display: flex; flex-direction: column; min-width: 0; border-radius: 24px; overflow: hidden; background: var(--mn-ink); color: var(--mn-on-ink); box-shadow: var(--mn-shadow); }
.menu-t-stitch .ms-media { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: var(--mn-ink-2); }
.menu-t-stitch .ms-media picture, .menu-t-stitch .ms-media img { width: 100%; height: 100%; object-fit: cover; }
.menu-t-stitch .ms-ph { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; font-size: 4.5rem; font-weight: 800; color: rgba(255, 255, 255, 0.9);
    background: radial-gradient(90% 80% at 85% 5%, color-mix(in srgb, var(--mn-accent) 55%, var(--mn-ink)), transparent 70%), linear-gradient(160deg, var(--mn-primary), var(--mn-ink)); }
.menu-t-stitch .ms-shade { position: absolute; inset: 0; background: linear-gradient(to top, rgba(10, 13, 18, 0.94) 4%, rgba(10, 13, 18, 0.55) 40%, rgba(10, 13, 18, 0) 72%); pointer-events: none; }
.menu-t-stitch .ms-over { position: absolute; inset-inline: 0; inset-block-end: 0; padding: 16px; display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; }
.menu-t-stitch .ms-title { margin: 0; font-size: 1.25rem; line-height: 1.2; font-weight: 800; letter-spacing: -0.01em; color: #ffffff; overflow-wrap: anywhere; text-shadow: 0 1px 10px rgba(0, 0, 0, 0.45); }
.menu-t-stitch .ms-price { flex: none; display: inline-flex; flex-direction: column; align-items: flex-end; gap: 0; font-weight: 800; line-height: 1.15; }
.menu-t-stitch .ms-price-now { font-size: 1.2rem; color: #ffffff; background: var(--mn-accent); color: #04130d; padding: 3px 12px; border-radius: 999px; }
.menu-t-stitch .ms-price-old { font-weight: 500; font-size: 0.8rem; color: #e5e7eb; padding-inline: 6px; }
.menu-t-stitch .ms-flag { position: absolute; inset-block-start: 12px; inset-inline-start: 12px; background: #ffffff; color: #0a0d12; border: 0; font-size: 0.78rem; letter-spacing: 0.02em; }
.menu-t-stitch .ms-flag-off { background: #fecaca; color: #7f1d1d; }
.menu-t-stitch .ms-body { padding: 14px 16px 16px; display: flex; flex-direction: column; gap: 8px; flex: 1 1 auto; }
.menu-t-stitch .ms-desc { margin: 0; color: var(--mn-on-ink-2); font-size: 0.92rem; overflow-wrap: anywhere; }
.menu-t-stitch .ms-meta { margin: 0; color: var(--mn-on-ink-2); font-size: 0.8rem; }
.menu-t-stitch .ms-body .mq-item-badges { margin-block-start: -2px; }
.menu-t-stitch .ms-body .mq-add { margin-block-start: auto; width: 100%; align-items: stretch; --c-primary: var(--mn-accent); --c-on-primary: #04130d; --c-surface: var(--mn-ink-2); --c-surface-2: #263043; --c-text: #ffffff; --c-text-2: #cbd5e1; --c-border: #3a4660; }
.menu-t-stitch .ms-body .mq-add-btn { width: 100%; border-radius: 16px; font-weight: 800; background: var(--mn-accent); border-color: var(--mn-accent); color: #04130d; }
.menu-t-stitch .ms-body .mq-add-btn:disabled, .menu-t-stitch .ms-body .mq-add-btn[aria-disabled="true"] { background: #263043; border-color: #3a4660; color: #cbd5e1; }
.menu-t-stitch .ms-body .mq-stepper { width: 100%; justify-content: space-between; border-radius: 16px; border-color: var(--mn-accent); }
.menu-t-stitch .ms-body .mq-stepper-btn { color: var(--mn-accent); }
.menu-t-stitch .ms-body .mq-incart { color: #6ee7b7; }
.menu-t-stitch .ms-card.is-sold-out .ms-media img { filter: grayscale(1); opacity: 0.55; }
.menu-t-stitch .ms-card.is-sold-out .ms-ph { filter: grayscale(1); opacity: 0.7; }

/* G products as a table: a dark framed card, dark caption band with the accent rule, strong accent price pills, high-contrast accent buttons */
.menu-t-stitch .mn-table-wrap { --mn-divider: var(--mn-border); border: 2px solid var(--mn-ink); border-radius: 20px; box-shadow: var(--mn-shadow); }
.menu-t-stitch .mn-caption { background: var(--mn-ink); color: var(--mn-on-ink); padding: 18px var(--mn-pad-x) 14px; }
.menu-t-stitch .mn-caption .mn-h3 { margin: 0; color: var(--mn-on-ink); font-size: var(--mn-fs-cap); border-block-end: 4px solid var(--mn-accent); padding-block-end: 6px; }
.menu-t-stitch .mn-table thead th { background: var(--mn-ink-2); color: var(--mn-on-ink-2); border-block: 0; border-block-end: 3px solid var(--mn-accent); font-weight: 800; text-transform: uppercase; letter-spacing: 0.06em; font-size: 0.74rem; }
html[dir="rtl"] .menu-t-stitch .mn-table thead th { text-transform: none; letter-spacing: 0; font-size: 0.84rem; }
.menu-t-stitch .mn-thumb-ph { color: #ffffff; background: radial-gradient(90% 80% at 85% 5%, color-mix(in srgb, var(--mn-accent) 55%, var(--mn-ink)), transparent 70%), linear-gradient(160deg, var(--mn-primary), var(--mn-ink)); }
.menu-t-stitch .mn-item-name { font-weight: 800; letter-spacing: -0.01em; }
.menu-t-stitch .mn-table .mn-price-now { background: var(--mn-accent); color: #04130d; padding: 3px 14px; border-radius: 999px; font-weight: 800; }
.menu-t-stitch .mn-badge-offer { background: var(--mn-ink); color: #ffffff; border: 0; }
.menu-t-stitch .mn-table .mq-add { --c-primary: var(--mn-accent); --c-on-primary: #04130d; --c-surface: var(--mn-surface); --c-surface-2: var(--mn-surface-2); --c-text: var(--mn-text); --c-text-2: var(--mn-text-2); --c-border: var(--mn-border); }
.menu-t-stitch .mn-table .mq-add-btn { border-radius: 16px; font-weight: 800; background: var(--mn-accent); border-color: var(--mn-accent); color: #04130d; }
.menu-t-stitch .mn-table .mq-add-btn:disabled, .menu-t-stitch .mn-table .mq-add-btn[aria-disabled="true"] { background: var(--mn-surface-2); border-color: var(--mn-border); color: var(--mn-text-2); }
.menu-t-stitch .mn-table .mq-stepper { border-radius: 16px; border-color: var(--mn-primary); }
.menu-t-stitch .mn-table .mq-stepper-btn { color: var(--mn-primary); }
.menu-t-stitch .mn-table .mq-incart { color: var(--mn-primary); }

/* ------------------------------------------------------------ H reviews / I footer */
.menu-t-stitch .mn-rating-summary { background: var(--mn-ink); color: var(--mn-on-ink); border-radius: var(--mn-radius); padding: 14px 18px; }
.menu-t-stitch .mn-rating-count { color: var(--mn-on-ink-2); }
.menu-t-stitch .mn-review { border: 2px solid var(--mn-text); border-radius: 18px; }
.menu-t-stitch .mn-review-avatar { background: var(--mn-accent); color: #04130d; }
.menu-t-stitch .mn-footer { margin-inline: calc(var(--mn-gutter) * -1); margin-block-end: -48px; padding: 28px var(--mn-gutter) 40px; background: var(--mn-ink); color: var(--mn-on-ink-2); border-block-start: 0; }
.menu-t-stitch .mn-footer .mn-link { color: var(--mn-on-ink); display: inline-flex; align-items: center; min-height: 44px; font-weight: 600; }
.menu-t-stitch .mn-footer :focus-visible { outline-color: #ffffff; }

/* ------------------------------------------------------------ dialog */
.menu-t-stitch .mn-dialog { border-radius: 24px; }
.menu-t-stitch .mn-dialog-close { background: var(--mn-ink); color: var(--mn-on-ink); }

@media (min-width: 640px) {
    .menu-t-stitch .mn-hero { margin-inline: 0; border-radius: 32px 32px 0 0; margin-block-start: 18px; }
    .menu-t-stitch .mn-hero-media { aspect-ratio: 21 / 9; }
    .menu-t-stitch .mn-hero-actions { inset-inline: 28px; inset-block-end: 20px; }
    .menu-t-stitch .mn-identity { margin-inline: 0; padding: 22px 28px 28px; border-radius: 0 0 32px 32px; }
    .menu-t-stitch .mn-h1 { font-size: 2.5rem; }
    .menu-t-stitch .mn-cat-cards { margin-inline: 0; padding-inline: 0; flex-wrap: wrap; }
    .menu-t-stitch .mn-cat-card { width: 156px; }
    .menu-t-stitch .mn-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
    .menu-t-stitch .ms-card:first-child { grid-column: 1 / -1; flex-direction: row; }
    .menu-t-stitch .ms-card:first-child .ms-media { flex: 1 1 58%; aspect-ratio: auto; min-height: 280px; }
    .menu-t-stitch .ms-card:first-child .ms-body { flex: 1 1 42%; justify-content: center; padding: 24px; }
    .menu-t-stitch .ms-card:first-child .ms-title { font-size: 1.6rem; }
    .menu-t-stitch .mn-footer { margin-inline: 0; margin-block-end: 0; border-radius: 28px; }
}
@media (min-width: 960px) {
    .menu-t-stitch .mn-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .menu-t-stitch .ms-card:first-child { grid-column: span 2; }
}
@media (prefers-reduced-motion: no-preference) {
    .menu-t-stitch .ms-card { transition: transform 0.22s ease, box-shadow 0.22s ease; }
    .menu-t-stitch .ms-card:hover { transform: translateY(-4px); box-shadow: var(--stitch-shadow-hover, 0 20px 40px -10px rgba(10, 13, 18, 0.2)); }
    .menu-t-stitch .mn-cat-card, .menu-t-stitch .mn-hero-btn, .menu-t-stitch .mn-pill { transition: box-shadow 0.18s ease, background 0.18s ease, color 0.18s ease; }
}

/* masthead: the identity bar sits flush under the hero; the featured (first) tile centres its text instead of pinning the button to the bottom */
.menu-t-stitch .mn-hero + .mn-identity { margin-block-start: 0; }
@media (min-width: 640px) {
    .menu-t-stitch .ms-card:first-child .ms-body { gap: 14px; }
    .menu-t-stitch .ms-card:first-child .ms-body .mq-add { margin-block-start: 6px; }
    .menu-t-stitch .ms-card:first-child .ms-desc { font-size: 1.05rem; }
}