/* ============================================================ */
/* ViewMyMenu                                                     */
/* ============================================================ */

/* Admin pages use Bootstrap; just sprinkle a few touches */
.app-page { background:#f8fafc; min-height:100vh; }
.app-page .navbar-brand { font-size:1.15rem; }

/* ============================================================ */
/* Public mobile menu (Swiggy-style)                            */
/* ============================================================ */
.m-body { margin:0; background:#f3f4f6; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; -webkit-font-smoothing:antialiased; }
.m-page { max-width:540px; margin:0 auto; background:#fff; min-height:100vh; padding-bottom:140px; box-shadow:0 0 32px rgba(0,0,0,.06); position:relative; }

/* Hero */
/* Hero/cover banner removed — single-restaurant layout starts at .m-info */

/* Info card */
.m-info { background:#fff; padding:16px 18px; border-bottom:8px solid #f3f4f6; }
.m-info-row { display:flex; gap:14px; align-items:center; }
.m-logo-frame { width:72px; height:72px; border-radius:14px; flex-shrink:0; box-shadow:0 2px 8px rgba(0,0,0,.08); border:1px solid #f1f5f9; background:#fff; display:flex; align-items:center; justify-content:center; overflow:hidden; padding:4px; }
.m-logo-img { width:100%; height:100%; object-fit:contain; display:block; }
.m-logo-fb { background:linear-gradient(135deg,var(--accent,#c0392b),#000); color:#fff; font-weight:800; font-size:1.7rem; padding:0; }
.m-info-body { flex:1; min-width:0; }
.m-info-name { margin:0 0 4px; font-size:1.5rem; font-weight:800; color:#0f172a; line-height:1.15; letter-spacing:-.01em; }
.m-info-desc { margin:0 0 6px; color:#475569; font-size:.86rem; line-height:1.4; }
.m-meta { margin:4px 0 0; color:#64748b; font-size:.82rem; line-height:1.4; display:flex; align-items:center; gap:5px; }
.m-meta svg { opacity:.7; flex-shrink:0; }
.m-divider { border:0; border-top:1px solid #e5e7eb; margin:14px 0 0; }

/* Action icons (contact / social) — round, brand-coloured */
.m-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:14px; }
.m-action { width:40px; height:40px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; color:#fff; text-decoration:none; box-shadow:0 2px 6px rgba(0,0,0,.12); transition:transform .15s ease, box-shadow .15s ease, filter .15s; }
.m-action:hover, .m-action:focus { transform:translateY(-2px) scale(1.06); box-shadow:0 6px 14px rgba(0,0,0,.18); color:#fff; text-decoration:none; }
.m-action:active { transform:translateY(0) scale(.98); }
.m-action svg { width:20px; height:20px; display:block; }
.m-action.is-call { background:#10b981; }
.m-action.is-wa   { background:#25D366; }
.m-action.is-map  { background:#ea4335; }
.m-action.is-mail { background:#3b82f6; }
.m-action.is-ig   { background:linear-gradient(45deg,#f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); }
.m-action.is-fb   { background:#1877f2; }
.m-action.is-yt   { background:#ff0000; }

/* Stats row (rating · reviews · dishes · views) */
.m-stats { display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-size:.82rem; color:#475569; margin-top:14px; }
.m-rating { background:#16a34a; color:#fff; padding:3px 8px; border-radius:4px; font-weight:700; font-size:.78rem; display:inline-flex; align-items:center; gap:3px; }
.m-rcount { color:#475569; font-weight:600; }
.m-rcount.m-views { display:inline-flex; align-items:center; gap:4px; }
.m-rcount.m-views svg { opacity:.75; }
.m-dot { color:#cbd5e1; }

/* Review CTA buttons */
.m-revbtns { display:flex; gap:8px; margin-top:12px; flex-wrap:wrap; }
.m-revbtn { display:inline-flex; align-items:center; gap:6px; padding:8px 14px; border-radius:8px; font-size:.82rem; font-weight:700; text-decoration:none; transition:transform .12s, box-shadow .12s; }
.m-revbtn:hover { transform:translateY(-1px); box-shadow:0 4px 10px rgba(0,0,0,.08); text-decoration:none; }
.m-revbtn-ghost { background:#f1f5f9; color:#0f172a; border:1px solid #e2e8f0; }
.m-revbtn-primary { background:var(--accent,#c0392b); color:#fff; border:1px solid var(--accent,#c0392b); }
.m-revbtn-primary:hover { color:#fff; }

/* Backwards-compat alias (older theme rules referenced .m-rating-row) */
.m-rating-row { display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-size:.82rem; color:#475569; }

/* Sticky search */
.m-search-wrap { position:sticky; top:0; z-index:30; background:#fff; padding:12px 16px; border-bottom:1px solid #f1f5f9; box-shadow:0 2px 4px rgba(0,0,0,.02); }
.m-search-form { display:flex; flex-direction:column; gap:10px; }
.m-search-bar { display:flex; align-items:center; gap:10px; background:#f3f4f6; border:1.5px solid transparent; border-radius:12px; padding:11px 14px; transition:border-color .15s, background .15s, box-shadow .15s; }
.m-search-bar:focus-within { background:#fff; border-color:var(--accent,#c0392b); box-shadow:0 0 0 3px rgba(192,57,43,.10); }
.m-search-ico { font-size:1rem; color:#9ca3af; }
.m-search-in { flex:1; border:none; background:transparent; outline:none; font-size:.95rem; color:#111; min-width:0; }
.m-search-in::placeholder { color:#9ca3af; }
.m-search-x { color:#6b7280; font-size:1rem; text-decoration:none; padding:0 4px; line-height:1; }

/* Filter chips row (horizontal scroll on mobile) */
.m-fchips { display:flex; gap:8px; overflow-x:auto; padding-bottom:2px; margin:0 -2px; scrollbar-width:none; }
.m-fchips::-webkit-scrollbar { display:none; }
.m-fchip { flex-shrink:0; display:inline-flex; align-items:center; gap:6px; padding:7px 13px; border-radius:99px; background:#f3f4f6; border:1.5px solid transparent; color:#374151; font-size:.83rem; font-weight:600; text-decoration:none; transition:all .15s; white-space:nowrap; }
.m-fchip:hover { background:#e5e7eb; }
.m-fchip span { background:rgba(0,0,0,.08); color:#4b5563; padding:1px 7px; border-radius:99px; font-size:.7rem; font-weight:700; }
.m-fchip.on { background:#1f2937; color:#fff; border-color:#1f2937; }
.m-fchip.on span { background:rgba(255,255,255,.22); color:#fff; }
.m-fchip-veg.on    { background:#16a34a; border-color:#16a34a; }
.m-fchip-non.on    { background:#c0392b; border-color:#c0392b; }
.m-fchip-best.on   { background:#f59e0b; border-color:#f59e0b; }
.m-fchip-spicy.on  { background:#dc2626; border-color:#dc2626; }
.m-fchip .m-vmark  { width:12px; height:12px; border-width:1.4px; flex-shrink:0; }
.m-fchip .m-vmark > i { width:5px; height:5px; }
.m-fchip .m-vmark.is-non > i { border-bottom-width:6px; }
.m-fchip.on .m-vmark { border-color:#fff; }
.m-fchip.on .m-vmark > i { background:#fff; }
.m-fchip.on .m-vmark.is-non > i { border-bottom-color:#fff; background:transparent; }

/* Result summary bar */
.m-result-bar { margin:10px 16px 0; padding:10px 14px; background:#fff8e1; color:#7c4a03; border-radius:12px; display:flex; align-items:center; gap:10px; flex-wrap:wrap; border:1px solid #fde68a; }
.m-result-text { font-size:.85rem; flex:1; min-width:0; }
.m-result-text strong { color:#92400e; font-weight:800; font-size:.95rem; }
.m-result-q   { color:#1f2937; font-weight:600; }
.m-result-tag { display:inline-block; background:#fef3c7; color:#92400e; padding:1px 9px; border-radius:99px; font-weight:700; font-size:.78rem; }
.m-result-clear { color:#92400e; text-decoration:none; font-weight:700; font-size:.78rem; padding:4px 10px; background:rgba(146,64,14,.10); border-radius:99px; flex-shrink:0; }
.m-result-clear:hover { background:rgba(146,64,14,.18); }

/* Categories & dishes */
.m-list { padding:8px 0 16px; }

/* ---- Swiggy-style 2-column dish cards (always 2 columns) ---- */
.m-cat-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; padding:0 12px 8px; }
.m-card { display:flex !important; flex-direction:column; padding:0 !important; border:none !important; background:#fff; border-radius:14px; overflow:hidden; box-shadow:0 1px 4px rgba(0,0,0,.06); transition:transform .15s, box-shadow .15s; }
.m-card:hover { transform:translateY(-2px); box-shadow:0 4px 12px rgba(0,0,0,.10); }
.m-card-imgwrap { position:relative; width:100%; aspect-ratio:1/1; background:#f3f4f6; overflow:hidden; }
.m-card-img { width:100%; height:100%; object-fit:cover; display:block; }
.m-card-imgwrap.has-video { cursor:pointer; }
.m-card-preview { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; background:#000; opacity:0; transition:opacity .35s ease; pointer-events:none; }
.m-card-imgwrap.show-vid .m-card-preview { opacity:1; }
.m-vplay { position:absolute; right:7px; bottom:7px; width:28px; height:28px; border-radius:50%; background:rgba(0,0,0,.6); color:#fff; display:inline-flex; align-items:center; justify-content:center; padding:0 0 0 2px; backdrop-filter:blur(4px); pointer-events:none; box-shadow:0 1px 3px rgba(0,0,0,.3); }
.m-card-imgwrap.has-video::after { content:''; position:absolute; inset:0; pointer-events:none; box-shadow: inset 0 0 0 0 rgba(220,38,38,0); transition:box-shadow .15s; }
.m-card-imgwrap.has-video:active::after { box-shadow: inset 0 0 0 3px rgba(220,38,38,.6); }

/* Fullscreen video modal (only video — nothing else) */
body.m-no-scroll { overflow:hidden; }
.m-vmodal { position:fixed; inset:0; background:#000; z-index:9999; display:none; align-items:center; justify-content:center; }
.m-vmodal.on { display:flex; }
.m-vmodal video { width:100%; height:100%; max-width:100vw; max-height:100vh; object-fit:contain; background:#000; outline:none; }
.m-vmodal-close { position:absolute; top:14px; right:14px; width:40px; height:40px; border-radius:50%; background:rgba(255,255,255,.15); color:#fff; border:0; font-size:1.2rem; line-height:1; cursor:pointer; z-index:2; display:flex; align-items:center; justify-content:center; backdrop-filter:blur(8px); }
.m-vmodal-close:hover { background:rgba(255,255,255,.28); }
.m-card-img-fb { background:linear-gradient(135deg,#fde68a 0%, #fbbf24 60%, #f59e0b 100%); display:flex; align-items:center; justify-content:center; }
.m-card-img-fb::before { content:'🍽'; font-size:2.4rem; opacity:.55; }
.m-card-badge { position:absolute; left:7px; padding:2px 8px; border-radius:4px; font-size:.65rem; font-weight:800; color:#fff; letter-spacing:.3px; box-shadow:0 1px 3px rgba(0,0,0,.2); display:inline-flex; align-items:center; gap:3px; }
.m-card-badge-best  { top:7px;  background:linear-gradient(135deg,#f59e0b,#dc2626); }
.m-card-badge-spicy { top:7px;  background:#dc2626; }
.m-card-badge-best + .m-card-badge-spicy { top:32px; }

.m-card-body { padding:10px 12px 14px; display:flex; flex-direction:column; gap:4px; flex:1; }
.m-card-vrow { display:flex; align-items:center; gap:6px; margin-bottom:2px; }
.m-card-name { margin:0; font-size:.95rem; font-weight:700; color:#111; line-height:1.25; }
.m-card-desc { margin:2px 0 6px; font-size:.78rem; color:#6b7280; line-height:1.35; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.m-card-pricewrap { margin-top:auto; }
.m-card-price { display:inline-block; background:#fde68a; color:#7c2d12; font-weight:800; font-size:.95rem; padding:3px 10px 3px 8px; border-radius:0 6px 6px 0; box-shadow:1px 1px 0 rgba(0,0,0,.06); position:relative; clip-path:polygon(8px 0, 100% 0, 100% 100%, 8px 100%, 0 50%); padding-left:14px; }

/* Always 2 columns — even on tablets/desktop, so it matches the mobile mock. */
.m-page { max-width:520px; margin:0 auto; }

.m-cat { padding:6px 0; scroll-margin-top:80px; }
.m-cat-h { display:flex; align-items:center; gap:12px; margin:12px 16px 6px; }
.m-cat-h h2 { margin:0; font-size:1.05rem; font-weight:800; color:#111; letter-spacing:-.01em; flex-shrink:0; }
.m-cat-h::after { content:''; flex:1; height:1px; background:#e5e7eb; }
.m-cat-pill { background:#f3f4f6; color:#6b7280; padding:3px 10px; border-radius:99px; font-size:.72rem; font-weight:700; }

.m-dish { display:flex; gap:14px; padding:16px; border-bottom:1px solid #f3f4f6; align-items:flex-start; }
.m-dish:last-child { border-bottom:none; }
.m-dish-info { flex:1; min-width:0; }
.m-marks { display:flex; align-items:center; gap:6px; flex-wrap:wrap; margin-bottom:6px; }

.m-vmark { width:16px; height:16px; border:1.5px solid #16a34a; display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; }
.m-vmark.is-non { border-color:#c0392b; }
.m-vmark > i { display:block; width:8px; height:8px; background:#16a34a; border-radius:50%; }
.m-vmark.is-non > i { background:transparent; width:0; height:0; border-left:5px solid transparent; border-right:5px solid transparent; border-bottom:8px solid #c0392b; border-radius:0; }

.m-tag { padding:2px 8px; border-radius:99px; font-size:.68rem; font-weight:700; line-height:1.5; }
.m-tag-best  { background:linear-gradient(135deg,#fef3c7,#fde68a); color:#92400e; border:1px solid #fcd34d; }
.m-tag-spicy { background:#fee2e2; color:#991b1b; border:1px solid #fca5a5; }

.m-dish-name  { margin:0 0 4px; font-size:1rem; font-weight:700; color:#111; line-height:1.3; }
.m-dish-price { font-size:.95rem; font-weight:700; color:#111; margin-bottom:2px; }
.m-dish-desc  { margin:6px 0 0; color:#6b7280; font-size:.82rem; line-height:1.4; }
.m-dish-img-wrap { width:110px; height:110px; flex-shrink:0; border-radius:12px; overflow:hidden; box-shadow:0 2px 8px rgba(0,0,0,.08); background:#f3f4f6; }
.m-dish-img { width:100%; height:100%; object-fit:cover; display:block; }

/* Empty state */
.m-empty { text-align:center; padding:60px 20px; color:#6b7280; }
.m-empty-ico { font-size:3rem; margin-bottom:8px; }
.m-empty h3 { margin:0 0 4px; color:#374151; font-size:1.1rem; }
.m-empty p { margin:0 0 16px; font-size:.9rem; }
.m-empty-btn { display:inline-block; background:var(--accent,#c0392b); color:#fff; padding:9px 20px; border-radius:99px; text-decoration:none; font-weight:600; font-size:.88rem; }

.m-foot { text-align:center; padding:24px 16px 10px; }
.m-foot a { color:var(--accent,#c0392b); text-decoration:none; font-weight:700; font-size:.9rem; }
.m-foot p { margin:14px 0 0; font-size:.72rem; color:#9ca3af; }

/* FAB */
.m-fab { position:fixed; bottom:22px; left:50%; transform:translateX(-50%); background:#1f2937; color:#fff; border:none; padding:12px 22px; border-radius:99px; display:inline-flex; align-items:center; gap:8px; font-weight:800; letter-spacing:.5px; cursor:pointer; z-index:50; box-shadow:0 8px 24px rgba(0,0,0,.30), 0 2px 6px rgba(0,0,0,.20); transition:transform .25s ease, opacity .2s, box-shadow .2s; font-size:.85rem; }
.m-fab:hover { background:#111827; }
.m-fab:active { transform:translateX(-50%) scale(.96); }
.m-fab.hide { transform:translateX(-50%) translateY(140px); opacity:0; pointer-events:none; }

/* Sheet */
.m-bd { position:fixed; inset:0; background:rgba(0,0,0,.5); opacity:0; pointer-events:none; transition:opacity .25s; z-index:90; }
.m-bd.on { opacity:1; pointer-events:auto; }
.m-sheet { position:fixed; left:50%; bottom:0; transform:translate(-50%, 100%); width:100%; max-width:540px; max-height:75vh; background:#fff; border-radius:22px 22px 0 0; z-index:100; transition:transform .3s cubic-bezier(.32,.72,0,1); display:flex; flex-direction:column; padding-bottom:env(safe-area-inset-bottom); box-shadow:0 -10px 40px rgba(0,0,0,.25); }
.m-sheet.on { transform:translate(-50%, 0); }
.m-sheet-handle { width:44px; height:4px; background:#d1d5db; border-radius:99px; margin:10px auto 4px; }
.m-sheet-h { display:flex; justify-content:space-between; align-items:center; padding:8px 22px 14px; border-bottom:1px solid #f3f4f6; }
.m-sheet-h h3 { margin:0; font-size:1.1rem; font-weight:800; color:#111; }
.m-sheet-x { background:#f3f4f6; border:none; width:32px; height:32px; border-radius:50%; font-size:.95rem; cursor:pointer; color:#374151; }
.m-sheet-list { list-style:none; margin:0; padding:6px 0; overflow-y:auto; flex:1; }
.m-sheet-item { display:flex; justify-content:space-between; align-items:center; padding:14px 22px; text-decoration:none; color:#111; font-size:1rem; font-weight:600; border-bottom:1px solid #f9fafb; }
.m-sheet-item:hover { background:#f9fafb; }
.m-sheet-c { color:#6b7280; font-size:.9rem; font-weight:600; display:inline-flex; align-items:center; gap:8px; }
.m-sheet-c i { color:#cbd5e1; font-size:1.2rem; line-height:1; font-style:normal; }

/* Themes */
.theme-classic  { --accent:#c0392b; }
.theme-classic  .m-page { background:#fffaf3; }
.theme-classic  .m-info { background:#fffbe9; }

.theme-modern   { --accent:#0ea5e9; }
.theme-modern   .m-page { background:#f8fafc; }

.theme-dark     { --accent:#fbbf24; }
.theme-dark     .m-page { background:#0b0f1a; color:#e5e7eb; }
.theme-dark     .m-info { background:#111827; border-bottom-color:#0b0f1a; }
.theme-dark     .m-dish-name, .theme-dark .m-dish-price, .theme-dark .m-cat-h h2,
.theme-dark     .m-sheet-h h3, .theme-dark .m-sheet-item { color:#f1f5f9; }
.theme-dark     .m-divider { border-top-color:#334155; }
.theme-dark     .m-info-desc { color:#cbd5e1; }
.theme-dark     .m-meta, .theme-dark .m-dish-desc, .theme-dark .m-rating-row, .theme-dark .m-stats { color:#94a3b8; }
.theme-dark     .m-info-name { color:#f1f5f9; }
.theme-dark     .m-revbtn-ghost { background:#1e293b; border-color:#334155; color:#e5e7eb; }
.theme-dark     .m-logo-frame { background:#1e293b; border-color:#334155; }
.theme-dark     .m-dish { border-color:#1f2937; }
.theme-dark     .m-search-wrap { background:#0b0f1a; border-color:#1f2937; }
.theme-dark     .m-search-bar { background:#1e293b; }
.theme-dark     .m-search-in { color:#f1f5f9; }
.theme-dark     .m-sheet { background:#111827; }
.theme-dark     .m-sheet-item { border-color:#1f2937; }
.theme-dark     .m-cat-h::after { background:#1f2937; }
.theme-dark     .m-cat-pill { background:#1e293b; color:#cbd5e1; }
.theme-dark     .m-veg-track { background:#374151; }

.theme-elegant  { --accent:#8b6f47; }
.theme-elegant  .m-page { background:#f7f4ef; font-family:Georgia, "Times New Roman", serif; }
.theme-elegant  .m-dish-name { font-style:italic; }

.theme-vibrant  { --accent:#ec4899; }
.theme-vibrant  .m-page { background:linear-gradient(180deg,#fef3c7 0%,#fce7f3 100%); }

/* ---- Shop (s.php) — same theme rules, applied to .sh-* surfaces ---- */
.theme-classic.sh-body, body.theme-classic { background:#fffaf3; }
.theme-classic .sh-wrap { background:#fffaf3; }
.theme-classic .sh-search, .theme-classic .sh-cats { background:#fffaf3; border-bottom-color:#f3e9d6; }
.theme-classic .sh-card { background:#fff; border-color:#f3e9d6; }

body.theme-modern { background:#f8fafc; }
.theme-modern .sh-wrap { background:#f8fafc; }
.theme-modern .sh-search, .theme-modern .sh-cats { background:#f8fafc; }
.theme-modern .sh-card { background:#fff; border-color:#e2e8f0; box-shadow:0 1px 3px rgba(2,132,199,.06); }

body.theme-dark { background:#0b0f1a; color:#e5e7eb; }
.theme-dark .sh-wrap { background:#0b0f1a; box-shadow:none; }
.theme-dark .sh-search, .theme-dark .sh-cats { background:#111827; border-bottom-color:#1f2937; }
.theme-dark .sh-search input { background:#1e293b; color:#f1f5f9; border-color:#334155; }
.theme-dark .sh-search input::placeholder { color:#94a3b8; }
.theme-dark .sh-cat { background:#1e293b; color:#cbd5e1; border-color:#334155; }
.theme-dark .sh-cat-more { background:#1e293b; color:#cbd5e1; border-color:#334155; }
.theme-dark .sh-cat-menu { background:#111827; border-color:#1f2937; box-shadow:0 8px 24px rgba(0,0,0,.4); }
.theme-dark .sh-cat-mitem { color:#cbd5e1; }
.theme-dark .sh-cat-mitem:hover { background:#1e293b; }
.theme-dark .sh-card { background:#111827; border-color:#1f2937; box-shadow:0 1px 4px rgba(0,0,0,.4); }
.theme-dark .sh-pname, .theme-dark .sh-biz-name { color:#f1f5f9; }
.theme-dark .sh-pdesc, .theme-dark .sh-biz-desc, .theme-dark .sh-biz-meta, .theme-dark .sh-biz-stats { color:#94a3b8; }
.theme-dark .sh-section h3 { color:#94a3b8; }
.theme-dark .sh-imgwrap, .theme-dark .sh-img { background:#1f2937; }
.theme-dark .sh-empty { color:#64748b; }
.theme-dark .sh-biz, .theme-dark .sh-social { background:#111827; }
.theme-dark .sh-biz-badge { background:#1e293b; color:#cbd5e1; }

body.theme-elegant { background:#f7f4ef; font-family:Georgia, "Times New Roman", serif; }
.theme-elegant .sh-wrap { background:#f7f4ef; }
.theme-elegant .sh-search, .theme-elegant .sh-cats { background:#f7f4ef; border-bottom-color:#e8e0d2; }
.theme-elegant .sh-card { background:#fffdf9; border-color:#e8e0d2; }
.theme-elegant .sh-pname, .theme-elegant .sh-biz-name { font-style:italic; }

body.theme-vibrant { background:linear-gradient(180deg,#fef3c7 0%,#fce7f3 100%); }
.theme-vibrant .sh-wrap { background:transparent; box-shadow:none; }
.theme-vibrant .sh-search, .theme-vibrant .sh-cats { background:rgba(255,255,255,.85); backdrop-filter:blur(6px); }
.theme-vibrant .sh-card { background:#fff; border-color:#fbcfe8; box-shadow:0 2px 8px rgba(236,72,153,.08); }

@media print {
  .m-fab, .m-sheet, .m-bd, .m-search-wrap, .m-icon-btn { display:none !important; }
  body { background:#fff; }
}
