/* ============================================================
   CUSTOM — Per-store micro-overrides for Canadian Choice Pizza and Donairs
   This file is generated per restaurant. Override tokens or add
   store-specific rules here. Do NOT edit global.css, theme.css,
   or style.css directly for per-store changes.
   ============================================================ */

/* ============================================================
   FAQ BACKLINK — reciprocal internal link from every /tags/ page
   back to the home page FAQ hub (#faq). Keeps the tag network
   bidirectional for crawlers and gives visitors a way back.
   ============================================================ */
.gs-faq-backlink {
  background: var(--gs-bg-alt);
  border-top: 1px solid var(--gs-border-light);
  border-bottom: 1px solid var(--gs-border-light);
  padding: 2.5rem 1.25rem;
}

.gs-faq-backlink-inner {
  max-width: 820px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.75rem 1.25rem;
  text-align: center;
  background: var(--gs-cream);
  border: 1px solid var(--gs-border-gold);
  border-radius: 14px;
  padding: 1.5rem 1.75rem;
  box-shadow: var(--gs-shadow);
}

.gs-faq-backlink-inner i {
  color: var(--gs-accent-dark);
  font-size: 1.5rem;
  line-height: 1;
  flex-shrink: 0;
}

.gs-faq-backlink-inner p {
  margin: 0;
  color: var(--gs-text);
  font-family: var(--gs-font-body);
  font-size: 1rem;
  line-height: 1.6;
}

.gs-faq-backlink-inner .gs-inline-link {
  white-space: nowrap;
}

@media (max-width: 600px) {
  .gs-faq-backlink { padding: 2rem 1rem; }
  .gs-faq-backlink-inner {
    flex-direction: column;
    padding: 1.25rem 1.1rem;
  }
  .gs-faq-backlink-inner p { font-size: 0.95rem; }
}

/* ============================================================
   HERO LEGIBILITY — the hero photo is bright and busy, so the
   overlay alone left the headline washed out. A soft radial
   vignette sits behind the content block and text shadows lift
   the type off the image. Applies to every hero on the site.
   ============================================================ */
.gs-location-hero-content::before,
.gs-about-hero-content::before {
  content: "";
  position: absolute;
  inset: -3rem -4rem;
  background: radial-gradient(
    ellipse at center,
    rgba(20, 4, 9, 0.55) 0%,
    rgba(20, 4, 9, 0.34) 55%,
    rgba(20, 4, 9, 0) 100%
  );
  z-index: -1;
  pointer-events: none;
}

.gs-location-hero h1,
.gs-about-hero h1 {
  color: #fffdfd;
  text-shadow: 0 1px 2px rgba(16, 3, 8, 0.5), 0 12px 34px rgba(16, 3, 8, 0.45);
}

.gs-location-hero-text,
.gs-about-hero-subtitle {
  color: rgba(252, 247, 248, 0.96);
  text-shadow: 0 1px 3px rgba(16, 3, 8, 0.55);
}

.gs-about-hero-tagline {
  text-shadow: 0 1px 3px rgba(16, 3, 8, 0.6);
}

.gs-location-hero-badge {
  background: rgba(20, 4, 9, 0.42);
  border-color: rgba(238, 197, 112, 0.6);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  text-shadow: 0 1px 2px rgba(16, 3, 8, 0.6);
}

@media (max-width: 600px) {
  .gs-location-hero-content::before,
  .gs-about-hero-content::before {
    inset: -1.5rem -1.25rem;
  }
}

/* ============================================================
   FOOTER OPENING HOURS — the seven single-day rows wrapped onto
   two lines each inside the narrow two-column mobile footer,
   which made the hours block taller than the rest of the footer
   combined. Days with identical hours are now grouped into three
   rows, and each row lays out as day / time so the time never
   breaks mid-range.
   ============================================================ */
.footer__hours li {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0 0.9rem;
  padding: 0.3rem 0;
  line-height: 1.55;
}

.footer__hours-day {
  font-weight: 500;
  color: var(--gs-dark-heading, #f6eef0);
}

.footer__hours-time {
  white-space: nowrap;
}

/* Two-column footer: columns are ~150px wide, so let the time drop
   to its own line rather than hyphenating the range. */
@media (max-width: 1024px) {
  .footer__hours li {
    display: block;
    padding: 0.22rem 0;
  }

  .footer__hours-day {
    display: block;
  }

  .footer__hours-time {
    display: block;
    font-size: 0.88rem;
    opacity: 0.92;
  }
}

/* Phone widths: keep the two-column footer (stacking all four
   columns would make it taller, not shorter) and just tighten
   the vertical rhythm of the hours block. */
@media (max-width: 600px) {
  .footer__hours li {
    padding: 0.18rem 0;
    line-height: 1.45;
  }

  .footer__hours-day {
    font-size: 0.9rem;
  }

  .footer__hours-time {
    font-size: 0.85rem;
  }
}