/* ANIKA Frozen Food — header fixes (2026-10-27)
   1) Desktop header stays on ONE line at every desktop width:
      logo + nav + actions never wrap; the store name truncates
      instead of pushing the nav onto a second line.
   2) The Categories dropdown (Shop) holds ALL categories and
      scrolls internally when the list is long.
   The announcement bar is governed only by the admin setting
   (the old mobile display:none!important rule was removed from
   the theme bundle CSS). */

.header-container {
  flex-wrap: nowrap !important;
}

.header-logo-wrap {
  min-width: 0;
  flex-shrink: 1;
}

.header-logo-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.header-nav {
  flex-wrap: nowrap !important;
  white-space: nowrap;
  flex-shrink: 0;
}

.header-nav-link {
  white-space: nowrap;
}

.header-actions {
  flex-shrink: 0;
  flex-wrap: nowrap;
}

.header-dropdown-menu {
  max-height: 70vh;
  overflow-y: auto;
}

/* Slightly tighter header on small-desktop / large-tablet widths
   (still above the 860px hamburger breakpoint) so nothing collides. */
@media (max-width: 1100px) and (min-width: 861px) {
  .header-container { padding: 0 16px; }
  .header-nav { gap: 12px; }
  .header-logo-text { font-size: 18px; }
  .header-logo-img { width: 40px; height: 40px; }
}

/* 3) BLANK CATEGORY SECTIONS fix (2026-10-27): every product card is
   rendered with .reveal-fade-in, which starts at opacity:0 and only
   becomes visible when the theme's IntersectionObserver adds
   .is-visible. That observer never fires for the cards (they are
   rendered after the products API responds), so the Home and Shop
   category sections (Deals, BBQ, Premium, Fries, Cheese) showed their
   headings over empty black space while the cards sat invisible in
   the page. This timed animation guarantees every .reveal-fade-in
   element reaches its visible end-state on its own. Elements the
   observer does reveal keep their normal animation; the end state
   is identical, so there is no visual conflict. */
@keyframes anika-force-reveal {
  to { opacity: 1; transform: translateY(0); }
}
.reveal-fade-in {
  animation: anika-force-reveal .5s ease-out .8s both;
}

/* Round 2c (client request 2026-10-29): announcement bar desktop only */
@media (max-width: 768px) {
  .header-announcement-bar { display: none !important; }
}

/* Round 3b (client request 2026-10-29): deal posters are portrait 9:16 —
   show them fully on cards and the product page, never cropped. */
.card-image-wrap:has(img[src*="deal-special"]) { aspect-ratio: 9 / 16; }
img.card-image[src*="deal-special"] { object-fit: contain; }
img.product-main-img[src*="deal-special"] { object-fit: contain; }

/* Round 10 (client request 2026-10-30): bigger, clearer professional
   footer social icons (Facebook, Instagram, TikTok, YouTube). */
.footer-socials { gap: 18px; align-items: center; }
.footer-social-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 48px; height: 48px; border-radius: 50%;
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(255, 255, 255, .28);
  transition: background .2s ease, transform .2s ease;
}
.footer-social-icon:hover { background: rgba(255, 255, 255, .2); transform: translateY(-2px); }
.footer-social-icon svg { width: 26px !important; height: 26px !important; }