/* Seli menu layouts v17: glass list, glass showcase and floating compatibility */

/* ===== Shared glass surface; the restaurant brand color is the only accent source. ===== */
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) {
    --glass-surface:color-mix(in srgb,var(--primary) 68%,#17172A);
    --glass-surface-deep:color-mix(in srgb,var(--primary) 46%,#11121E);
    --glass-panel:rgba(255,255,255,.13);
    --glass-panel-strong:rgba(255,255,255,.2);
    --glass-line:rgba(255,255,255,.19);
    --glass-text:#FFFFFF;
    --glass-muted:rgba(255,255,255,.7);
    background:var(--glass-surface-deep);
}
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase).menu-color-dark {
    --glass-surface:color-mix(in srgb,var(--primary) 40%,#0B0C14);
    --glass-surface-deep:color-mix(in srgb,var(--primary) 25%,#080910);
    --glass-panel:rgba(255,255,255,.09);
    --glass-panel-strong:rgba(255,255,255,.15);
    --glass-line:rgba(255,255,255,.14);
}
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .app-wrapper {
    max-width:720px;
    overflow:clip;
    color:var(--glass-text);
    background:
        radial-gradient(circle at 92% 3%,rgba(255,255,255,.16),transparent 25%),
        linear-gradient(155deg,var(--glass-surface),var(--glass-surface-deep));
    box-shadow:0 0 48px color-mix(in srgb,var(--glass-surface-deep) 55%,transparent);
}
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .header,
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase).menu-header-smart.header-smart-mounted .header {
    color:var(--glass-text);
    border-color:var(--glass-line);
    background:color-mix(in srgb,var(--glass-surface) 82%,transparent);
    box-shadow:none;
    backdrop-filter:blur(22px) saturate(1.12);
    -webkit-backdrop-filter:blur(22px) saturate(1.12);
}
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .header-category-gap {
    background:var(--glass-surface);
}
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .store-name { color:var(--glass-text); }
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .store-logo {
    border-color:var(--glass-line);
    color:var(--glass-text);
    background:var(--glass-panel-strong);
    box-shadow:0 9px 24px rgba(6,7,18,.18);
}
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .store-status {
    color:#DFFBED;
    background:rgba(16,185,129,.18);
}
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) :is(.menu-catalog-btn,.search-toggle-btn,.cart-btn) {
    color:var(--glass-text);
    border-color:var(--glass-line);
    background:var(--glass-panel);
}
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) :is(.menu-catalog-btn,.search-toggle-btn,.cart-btn):hover,
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .search-toggle-btn.active {
    color:var(--glass-text);
    border-color:rgba(255,255,255,.34);
    background:var(--glass-panel-strong);
}
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .menu-search {
    color:var(--glass-text);
    border-color:var(--glass-line);
    background:var(--glass-panel);
}
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .menu-search::placeholder,
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) :is(.menu-search-icon,.menu-search-clear,.search-feedback) { color:var(--glass-muted); }
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .search-feedback strong { color:var(--glass-text); }
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .category-bar {
    border-color:var(--glass-line);
    background:color-mix(in srgb,var(--glass-surface) 86%,transparent);
    backdrop-filter:blur(20px) saturate(1.1);
    -webkit-backdrop-filter:blur(20px) saturate(1.1);
}
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .category-bar .cat-chip {
    color:var(--glass-text);
    border-color:var(--glass-line);
    background:var(--glass-panel);
}
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .category-bar .cat-chip-label { color:inherit; }
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .category-bar .cat-chip.active {
    color:var(--glass-surface-deep);
    border-color:#FFFFFF;
    background:#FFFFFF;
    box-shadow:0 8px 22px rgba(5,6,16,.18);
}
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .category-bar .cat-chip.active .cat-chip-label { color:inherit; }
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .category-bar .cat-style-underline .cat-chip,
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .category-bar .cat-style-underline .cat-chip.active {
    color:var(--glass-text);
    border:0;
    background:transparent;
    box-shadow:none;
}
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .cat-style-underline .cat-chip::after { background:#FFFFFF; }
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .cat-style-underline :is(.cat-chip-title,.cat-chip-subtitle) { color:inherit !important; }
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .right-sidebar {
    border-color:var(--glass-line);
    background:color-mix(in srgb,var(--glass-surface) 80%,transparent);
}
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .right-sidebar-head,
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .right-sidebar .cat-chip { color:var(--glass-text); background:transparent; }
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .right-sidebar .cat-chip.active { color:var(--glass-text); background:var(--glass-panel-strong); }
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .content { padding:12px 18px 58px; }
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .section { margin:0 0 42px; }
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .section-title,
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .subsection-title { color:var(--glass-text); }
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .section-title::after { background:linear-gradient(to left,var(--glass-line),transparent); }
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .section-title-subtitle { color:var(--glass-muted); }
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase).section-title-style-editorial .section-title,
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase).section-title-style-badge .section-title {
    color:var(--glass-text);
    border-color:var(--glass-line);
    background:var(--glass-panel);
    box-shadow:none;
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
}
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .menu-wheel-banner,
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .search-empty {
    color:var(--glass-text);
    border-color:var(--glass-line);
    background:var(--glass-panel);
}
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .store-footer {
    color:var(--glass-text);
    background:rgba(4,5,14,.14);
}
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) :is(.footer-name,.search-empty strong) { color:var(--glass-text); }
:is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) :is(.footer-hours,.footer-powered,.menu-wheel-copy small) { color:var(--glass-muted); }

/* ===== Glass list: a calm translucent panel and a separate image window. ===== */
body.menu-layout-glass-list .items-wrap { display:flex; flex-direction:column; gap:16px; }
body.menu-layout-glass-list .item-card {
    min-width:0;
    min-height:190px;
    overflow:hidden;
    position:relative;
    display:flex;
    flex-direction:row;
    align-items:stretch;
    padding:13px;
    border:1px solid var(--glass-line) !important;
    border-radius:var(--radius);
    color:var(--glass-text);
    background:var(--glass-panel);
    box-shadow:0 16px 34px rgba(6,7,20,.15),inset 0 1px 0 rgba(255,255,255,.08) !important;
    backdrop-filter:blur(18px) saturate(1.16);
    -webkit-backdrop-filter:blur(18px) saturate(1.16);
    transition:transform .18s ease,border-color .18s ease,background .18s ease;
}
body.menu-layout-glass-list .item-card:hover { transform:translateY(-2px); border-color:rgba(255,255,255,.32) !important; background:var(--glass-panel-strong); }
body.menu-layout-glass-list .item-card:active { transform:scale(.988); }
body.menu-layout-glass-list .item-img-wrap {
    width:clamp(112px,36%,var(--menu-item-image-size));
    min-width:112px;
    min-height:164px;
    flex:0 0 auto;
    overflow:hidden;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:calc(var(--radius) - 7px);
    color:color-mix(in srgb,var(--primary) 45%,#777987);
    background:rgba(255,255,255,.9);
}
body.menu-layout-glass-list .item-img-wrap > img { width:100%; height:100%; display:block; object-fit:cover; object-position:center; }
body.menu-layout-glass-list .item-img-wrap.has-transparent-product-image { background:transparent; }
body.menu-layout-glass-list .item-img-wrap.has-transparent-product-image > img.is-transparent-product-image {
    object-fit:contain !important;
    background:transparent !important;
    filter:drop-shadow(0 14px 14px rgba(4,5,16,.2));
}
body.menu-layout-glass-list .item-body { min-width:0; flex:1; padding:7px 18px 7px 9px; display:flex; flex-direction:column; }
body.menu-layout-glass-list .item-top { min-width:0; flex:1; }
body.menu-layout-glass-list .item-name {
    margin:0 0 7px;
    overflow-wrap:anywhere;
    color:var(--glass-text);
    font-size:clamp(13px,var(--menu-item-title-size),24px) !important;
    font-weight:900;
    line-height:1.65;
}
body.menu-layout-glass-list .item-name-en,
body.menu-layout-glass-list .item-desc {
    display:-webkit-box;
    overflow:hidden;
    color:var(--glass-muted);
    font-size:clamp(8px,var(--menu-item-subtitle-size),15px) !important;
    line-height:1.75;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
}
body.menu-layout-glass-list .item-footer { min-width:0; margin-top:12px; display:flex; align-items:flex-end; justify-content:space-between; gap:10px; }
body.menu-layout-glass-list .item-prices { min-width:0; display:flex; flex-direction:column; }
body.menu-layout-glass-list .item-price {
    max-width:100%;
    display:flex;
    flex-wrap:wrap;
    align-items:baseline;
    gap:3px 6px;
    color:var(--glass-text);
    font-size:clamp(11px,var(--menu-item-price-size),22px) !important;
    font-weight:900;
}
body.menu-layout-glass-list .item-price-old { color:rgba(255,255,255,.48); }
body.menu-layout-glass-list .item-price .price-number { direction:ltr; unicode-bidi:isolate; white-space:nowrap; }
body.menu-layout-glass-list .item-price .price-unit { font-size:.7em; font-weight:500; }
body.menu-layout-glass-list .btn-select {
    min-height:38px;
    padding:8px 12px !important;
    border:1px solid rgba(255,255,255,.28) !important;
    border-radius:12px !important;
    color:var(--glass-text) !important;
    background:rgba(255,255,255,.12) !important;
    box-shadow:none !important;
}
body.menu-layout-glass-list .disc-tag { color:var(--glass-text); background:var(--primary); }
body.menu-layout-glass-list .sold-out-overlay { color:var(--glass-text); background:rgba(14,15,27,.78); }

/* ===== Glass showcase: full-bleed image with a brand-tinted glass caption. ===== */
body.menu-layout-glass-showcase .items-wrap { display:flex; flex-direction:column; gap:20px; }
body.menu-layout-glass-showcase .item-card {
    min-height:clamp(310px,var(--menu-item-hero-image-size),500px);
    overflow:hidden;
    position:relative;
    display:block;
    border:1px solid var(--glass-line) !important;
    border-radius:var(--radius);
    color:var(--glass-text);
    background:color-mix(in srgb,var(--glass-surface-deep) 82%,#000);
    box-shadow:0 20px 42px rgba(4,5,15,.22) !important;
    transition:transform .2s ease,box-shadow .2s ease;
}
body.menu-layout-glass-showcase .item-card:hover { transform:translateY(-2px); box-shadow:0 25px 48px rgba(4,5,15,.28) !important; }
body.menu-layout-glass-showcase .item-card:active { transform:scale(.99); }
body.menu-layout-glass-showcase .item-img-wrap { position:absolute !important; inset:0; width:100%; height:100%; overflow:hidden; background:var(--glass-surface-deep); }
body.menu-layout-glass-showcase .item-img-wrap::after {
    content:'';
    position:absolute;
    inset:0;
    pointer-events:none;
    background:
        linear-gradient(to top,color-mix(in srgb,var(--glass-surface-deep) 88%,transparent) 0%,color-mix(in srgb,var(--glass-surface) 38%,transparent) 42%,transparent 72%),
        linear-gradient(120deg,color-mix(in srgb,var(--primary) 18%,transparent),transparent 58%);
}
body.menu-layout-glass-showcase .item-img-wrap > img { width:100%; height:100%; display:block; object-fit:cover; object-position:center; }
body.menu-layout-glass-showcase .item-img-wrap.has-transparent-product-image > img.is-transparent-product-image {
    padding:18px;
    object-fit:contain !important;
    background:transparent !important;
    filter:drop-shadow(0 22px 18px rgba(3,4,13,.3));
}
body.menu-layout-glass-showcase .item-body {
    position:absolute;
    z-index:2;
    inset:auto 0 0;
    min-width:0;
    padding:84px 20px 19px;
    background:linear-gradient(to top,rgba(7,8,17,.68),transparent);
}
body.menu-layout-glass-showcase .item-name {
    overflow-wrap:anywhere;
    color:var(--glass-text);
    font-size:clamp(14px,var(--menu-item-title-size),26px) !important;
    font-weight:900;
    line-height:1.6;
    text-shadow:0 2px 13px rgba(0,0,0,.34);
}
body.menu-layout-glass-showcase .item-name-en,
body.menu-layout-glass-showcase .item-desc {
    max-width:78%;
    display:-webkit-box;
    overflow:hidden;
    color:var(--glass-muted);
    font-size:clamp(8px,var(--menu-item-subtitle-size),15px) !important;
    line-height:1.7;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
}
body.menu-layout-glass-showcase .item-footer { min-width:0; margin-top:12px; display:flex; align-items:flex-end; justify-content:space-between; gap:10px; }
body.menu-layout-glass-showcase .item-prices { min-width:0; display:flex; flex-direction:column; }
body.menu-layout-glass-showcase .item-price {
    max-width:100%;
    display:flex;
    flex-wrap:wrap;
    align-items:baseline;
    gap:3px 6px;
    color:var(--glass-text);
    font-size:clamp(11px,var(--menu-item-price-size),22px) !important;
    font-weight:900;
    text-shadow:0 2px 10px rgba(0,0,0,.32);
}
body.menu-layout-glass-showcase .item-price-old { color:rgba(255,255,255,.5); }
body.menu-layout-glass-showcase .item-price .price-number { direction:ltr; unicode-bidi:isolate; white-space:nowrap; }
body.menu-layout-glass-showcase .item-price .price-unit { font-size:.68em; font-weight:500; }
body.menu-layout-glass-showcase .btn-select {
    min-height:42px;
    padding:9px 14px !important;
    border:1px solid rgba(255,255,255,.32) !important;
    border-radius:13px !important;
    color:var(--glass-text) !important;
    background:rgba(255,255,255,.15) !important;
    box-shadow:none !important;
    backdrop-filter:blur(12px);
}
body.menu-layout-glass-showcase .disc-tag { z-index:3; color:var(--glass-text); background:var(--primary); }
body.menu-layout-glass-showcase .sold-out-overlay { z-index:4; color:var(--glass-text); background:rgba(9,10,19,.75); }

/* ===== Floating theme compatibility: color mode and category style are independent settings. ===== */
body.menu-layout-floating.menu-color-light {
    --floating-surface:color-mix(in srgb,var(--bg) 94%,var(--primary));
    --floating-card:var(--card);
    --floating-card-text:var(--text);
    --floating-ui-text:var(--text);
    --floating-ui-muted:var(--muted);
    background:color-mix(in srgb,var(--text) 7%,var(--bg));
}
body.menu-layout-floating.menu-color-dark {
    --floating-surface:var(--bg);
    --floating-card:var(--card);
    --floating-card-text:var(--text);
    --floating-ui-text:var(--text);
    --floating-ui-muted:var(--muted);
    background:#090A10;
}
body.menu-layout-floating .header,
body.menu-layout-floating.menu-header-smart.header-smart-mounted .header {
    color:var(--floating-ui-text);
    border-color:var(--border);
    background:color-mix(in srgb,var(--floating-surface) 92%,transparent);
}
body.menu-layout-floating .header-category-gap { background:var(--floating-surface); }
body.menu-layout-floating .store-name { color:var(--floating-ui-text); }
body.menu-layout-floating :is(.menu-catalog-btn,.search-toggle-btn) {
    color:var(--floating-ui-text);
    border-color:var(--border);
    background:color-mix(in srgb,var(--floating-card) 76%,transparent);
}
body.menu-layout-floating .menu-search { color:var(--floating-ui-text); border-color:var(--border); background:var(--floating-card); }
body.menu-layout-floating .menu-search::placeholder,
body.menu-layout-floating :is(.menu-search-icon,.menu-search-clear,.search-feedback) { color:var(--floating-ui-muted); }
body.menu-layout-floating .search-feedback strong { color:var(--floating-ui-text); }
body.menu-layout-floating .category-bar { border-color:var(--border); background:color-mix(in srgb,var(--floating-surface) 94%,transparent); }

body.menu-layout-floating .category-bar .cats-scroll:not(.cat-style-circle) { gap:7px; padding:10px 18px 11px; }
body.menu-layout-floating .category-bar .cats-scroll:not(.cat-style-circle) .cat-chip {
    width:auto;
    min-width:66px;
    height:auto;
    min-height:60px;
    padding:7px 10px;
    border:1px solid var(--border);
    border-radius:15px;
    flex-direction:column;
    gap:5px;
    color:var(--floating-card-text);
    background:var(--floating-card);
    box-shadow:none;
}
body.menu-layout-floating .category-bar .cats-scroll:not(.cat-style-circle) .cat-chip::before { content:none; }
body.menu-layout-floating .category-bar .cats-scroll:not(.cat-style-circle) .cat-chip.active {
    color:#FFFFFF;
    border-color:var(--primary);
    background:var(--primary);
    box-shadow:0 7px 17px color-mix(in srgb,var(--primary) 24%,transparent);
}
body.menu-layout-floating .category-bar .cats-scroll:not(.cat-style-circle) .cat-chip-icon {
    width:32px;
    height:32px;
    min-height:32px;
    display:flex !important;
    overflow:hidden;
    border-radius:10px;
    color:inherit;
    background:color-mix(in srgb,var(--primary) 10%,transparent);
}
body.menu-layout-floating .category-bar .cats-scroll:not(.cat-style-circle) .cat-chip-icon img { max-width:27px; max-height:27px; filter:none; }
body.menu-layout-floating .category-bar .cats-scroll:not(.cat-style-circle) .cat-chip.active .cat-chip-icon { color:#FFFFFF; background:rgba(255,255,255,.2); }
body.menu-layout-floating .category-bar .cats-scroll:not(.cat-style-circle) .cat-chip-label {
    max-width:88px;
    min-height:0;
    color:inherit;
    font-size:9px;
    line-height:1.45;
}
body.menu-layout-floating .category-bar .cat-style-underline .cat-chip,
body.menu-layout-floating .category-bar .cat-style-underline .cat-chip.active {
    min-width:max-content;
    min-height:52px;
    padding:7px 15px 10px;
    border:0;
    border-radius:0;
    color:var(--floating-ui-text);
    background:transparent;
    box-shadow:none;
}
body.menu-layout-floating .category-bar .cat-style-underline .cat-chip::after { content:''; background:var(--primary); }
body.menu-layout-floating .category-bar .cat-style-underline .cat-chip-icon { display:none !important; }
body.menu-layout-floating .category-bar .cat-style-underline .cat-chip-label { max-width:none; display:flex; overflow:visible; color:inherit; font-size:inherit; }
body.menu-layout-floating .category-bar .cat-style-underline .cat-chip-subtitle { display:block; color:var(--floating-ui-muted); }
body.menu-layout-floating .category-bar .cat-style-rect .cat-chip { min-width:auto; min-height:44px; flex-direction:row-reverse; border-radius:10px; }
body.menu-layout-floating .category-bar .cat-style-rect.icon-left .cat-chip { flex-direction:row; }
body.menu-layout-floating .category-bar .cat-style-rect .cat-chip-icon { width:27px; height:27px; min-height:27px; border-radius:7px; }

body.menu-layout-floating .category-bar .cat-style-circle .cat-chip {
    color:var(--floating-card-text);
    border-color:color-mix(in srgb,var(--floating-card-text) 12%,var(--floating-card));
    background:var(--floating-card);
}
body.menu-layout-floating .category-bar .cat-style-circle .cat-chip.active { color:#FFFFFF; border-color:color-mix(in srgb,var(--primary) 82%,#fff); background:var(--primary); }
body.menu-layout-floating .category-bar .cat-style-circle .cat-chip-label { color:inherit; }
body.menu-layout-floating .category-bar .cat-style-circle .cat-chip-icon { color:var(--floating-card-text); }
body.menu-layout-floating .category-bar .cat-style-circle .cat-chip.active .cat-chip-icon { color:#FFFFFF; }
body.menu-layout-floating .section-title,
body.menu-layout-floating .subsection-title { color:var(--floating-ui-text); }
body.menu-layout-floating .section-title::after { background:linear-gradient(to left,var(--border),transparent); }
body.menu-layout-floating .section-title-subtitle { color:var(--floating-ui-muted); }
body.menu-layout-floating.section-title-style-editorial .section-title,
body.menu-layout-floating.section-title-style-badge .section-title { color:var(--floating-card-text); }
body.menu-layout-floating .item-card { color:var(--floating-card-text); background:var(--floating-card); box-shadow:0 17px 38px color-mix(in srgb,var(--text) 15%,transparent) !important; }
body.menu-layout-floating .item-img-wrap > img { border-color:color-mix(in srgb,var(--floating-card) 92%,transparent); background:color-mix(in srgb,var(--floating-card) 88%,var(--floating-surface)); }
body.menu-layout-floating .item-footer { border-color:var(--border); }
body.menu-layout-floating :is(.item-name-en,.item-desc,.item-price-old) { color:var(--floating-ui-muted); }
body.menu-layout-floating .btn-select { background:var(--floating-card) !important; }
body.menu-layout-floating .sold-out-overlay { color:var(--floating-card-text); background:color-mix(in srgb,var(--floating-card) 84%,transparent); }
body.menu-layout-floating :is(.search-empty,.store-footer) { color:var(--floating-ui-text); border-color:var(--border); background:color-mix(in srgb,var(--floating-card) 46%,var(--floating-surface)); }
body.menu-layout-floating :is(.search-empty strong,.footer-name) { color:var(--floating-ui-text); }
body.menu-layout-floating :is(.footer-hours,.footer-powered,.menu-wheel-copy small) { color:var(--floating-ui-muted); }
body.menu-layout-floating .right-sidebar { border-color:var(--border); background:color-mix(in srgb,var(--floating-card) 70%,var(--floating-surface)); }
body.menu-layout-floating .right-sidebar-head { color:var(--floating-ui-muted); background:color-mix(in srgb,var(--floating-card) 88%,var(--floating-surface)); }

@media (max-width:600px) {
    :is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .app-wrapper { max-width:100%; box-shadow:none; }
    :is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .content { padding-inline:12px; }
    body.menu-layout-glass-list .item-card { min-height:168px; padding:10px; }
    body.menu-layout-glass-list .item-img-wrap { width:clamp(104px,34%,var(--menu-item-image-size)); min-width:104px; min-height:148px; }
    body.menu-layout-glass-list .item-body { padding:5px 13px 5px 5px; }
    body.menu-layout-glass-list .item-name { font-size:clamp(12px,var(--menu-item-title-size),20px) !important; }
    body.menu-layout-glass-list .item-price { font-size:clamp(10px,var(--menu-item-price-size),18px) !important; }
    body.menu-layout-glass-showcase .item-card { min-height:clamp(300px,var(--menu-item-hero-image-size),440px); }
    body.menu-layout-glass-showcase .item-body { padding:76px 16px 16px; }
}

@media (max-width:380px) {
    body.menu-layout-glass-list .item-card { min-height:148px; }
    body.menu-layout-glass-list .item-img-wrap { width:96px; min-width:96px; min-height:128px; }
    body.menu-layout-glass-list .item-body { padding-inline-start:10px; }
    body.menu-layout-glass-list .item-desc { -webkit-line-clamp:1; }
    body.menu-layout-glass-list .btn-select span { display:none; }
    body.menu-layout-glass-list .btn-select { width:36px; min-width:36px; padding:0 !important; }
}

@supports not (backdrop-filter:blur(1px)) {
    :is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .item-card,
    :is(body.menu-layout-glass-list,body.menu-layout-glass-showcase) .category-bar { background:color-mix(in srgb,var(--glass-surface) 88%,#FFFFFF); }
}