/* ============================================================
   CUSTOM — Per-store overrides for Template AR
   Add store-specific tweaks here. Loaded last so it wins
   over theme.css and style.css.
   e.g. keep a full-colour logo on the dark header:
   .brand img, .foot-brand img { filter: none; }
   ============================================================ */

/* Taste of India Express — the gold logo emblem is already light, keep it full colour */
.brand img, .foot-brand img, .nav-overlay__brand img { filter: none; }
/* Gold eyebrows/accents on dark bands use the lighter logo gold for contrast (8:1 on espresso) */
.band-dark .eyebrow, .band-olive .eyebrow { color: #d8b17e; }

/* ------------------------------------------------------------
   BUTTON THEME — logo gold (sampled from assets/logo/logo.png)
   Primary .btn: gold-leaf gradient fill, espresso label (7.5:1).
   Hover: deep bronze fill, white label (4.8:1).
   Secondary .btn-line: gold outline + gold label.
   ------------------------------------------------------------ */
:root {
  --logo-gold-dark:  #c39a64;
  --logo-gold:       #d5ac75;
  --logo-gold-light: #efcb96;
  --logo-bronze:     #94621a;
  --logo-espresso:   #2a1f16;
}

.btn,
.btn--fill,
.btn--cream,
.btn--dark,
.band-dark .btn:not(.btn--fill):not(.btn--dark),
.band-olive .btn:not(.btn--fill):not(.btn--dark),
.page-title .btn {
  --btn-c: var(--logo-espresso);
  --btn-bd: var(--logo-gold-dark);
  --btn-ghost: color-mix(in srgb, var(--logo-gold) 55%, transparent);
  background: linear-gradient(135deg, var(--logo-gold-dark) 0%, var(--logo-gold-light) 55%, var(--logo-gold) 100%);
}
.btn:hover,
.btn--fill:hover,
.btn--cream:hover,
.btn--dark:hover,
.band-dark .btn:not(.btn--fill):not(.btn--dark):hover,
.band-olive .btn:not(.btn--fill):not(.btn--dark):hover,
.page-title .btn:hover {
  --btn-c: #ffffff;
  --btn-bd: var(--logo-bronze);
  background: var(--logo-bronze);
}

/* secondary outline buttons */
.btn-line {
  --btn-c: var(--logo-bronze);
  --btn-bd: var(--logo-gold-dark);
  --btn-ghost: color-mix(in srgb, var(--logo-gold) 40%, transparent);
}
.btn-line--light,
.band-dark .btn-line,
.band-olive .btn-line,
.page-title .btn-line {
  --btn-c: var(--logo-gold-light);
  --btn-bd: var(--logo-gold);
  --btn-ghost: color-mix(in srgb, var(--logo-gold) 35%, transparent);
}
.btn-line:hover {
  --btn-c: var(--logo-espresso);
  background: var(--logo-gold);
}

/* ------------------------------------------------------------
   FOOTER — textured food backdrop + brand / halal top row
   ------------------------------------------------------------ */
.foot-main {
  background: var(--dark) url("assets/backgrounds/footer-bg.webp") left center / cover no-repeat;
}
.foot-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  padding-bottom: clamp(2.5rem, 5vw, 3.5rem);
}
.foot-halal {
  width: clamp(6rem, 10vw, 8.5rem);
  height: auto;
  filter: drop-shadow(0 0.5rem 1rem rgba(0, 0, 0, 0.45));
}
.foot-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
@media (max-width: 1100px) {
  .foot-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 640px) {
  .foot-halal {
    width: 5.5rem;
  }
}