/* ============================================================
   CUSTOM — Per-store overrides for Template TF
   Add store-specific tweaks here. Loaded last so it wins
   over theme.css and style.css.
   ============================================================ */

/* Rakesh 2026-10-29: overflow:hidden makes min-height 0, so 26 categories shrank instead of scrolling - keep full height, sidebar scrolls */
.menu-buttons .menu-button { flex-shrink: 0; }
/* ---------- Maps (squad map pattern, 2026-11-05) ----------
   No overflow at 360-414 (grid children may shrink, fixed mobile height instead of a ratio);
   no scroll trap: a transparent .map-shield covers the iframe on touch screens until the first tap
   (components.js), and returns once the map scrolls out of view. .map-block = map + Get directions. */
.contact-sec .wrap > *, .map-block { min-width: 0; }
.map-block { display: flex; flex-direction: column; gap: .75rem; }
.map-block .map-directions { align-self: flex-start; }
.map-frame { position: relative; width: 100%; max-width: 100%; overflow: hidden; }
.map-shield { position: absolute; inset: 0; z-index: 2; display: flex; align-items: flex-end; justify-content: center; padding: 0; border: 0; background: transparent; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.map-shield span { margin-bottom: .75rem; padding: .45rem .9rem; border-radius: 999px; background: rgba(0,0,0,.78); color: #fff; font-size: .875rem; font-weight: 600; line-height: 1.2; }
.map-shield:focus-visible { outline: 3px solid currentColor; outline-offset: -3px; }
.map-frame.is-live .map-shield { display: none; }
@media (hover: hover) and (pointer: fine) { .map-shield { display: none; } }

/* ---------- Logo (Brandy pack v1: official round badge, 1:1, red field works on the light header) ---------- */
.brand img { width: 72px; height: 72px; padding: 0; background: transparent; border-radius: 50%; box-shadow: none; object-fit: contain; }
.foot-brand img { width: 120px; height: 120px; padding: 0; background: transparent; border-radius: 50%; object-fit: contain; }
@media (max-width: 600px) { .brand img { width: 60px; height: 60px; } }