/* ============================================================
   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; } }
@media (max-width: 900px) { .map-frame { aspect-ratio: auto; min-height: 0; height: 320px; } }

/* ---------- Seahood rebrand (pack v1) ---------- */
/* Round badge logo (logo/seahood-logo.webp 180x170, @2x 361x340, attrs 90x85): no white box, 85px tall, ~64px on mobile */
.brand img,
.foot-brand img { width: auto; height: 85px; padding: 0; background: none; border-radius: 0; box-shadow: none; }
@media (max-width: 767px) { .brand img { height: 64px; } }