/* ─── Groot Gyros: shop-only menu touches ───────────────────────────────────
   Loaded by the marketplace shop after chrome.css (the shared header/footer).
   The shop's theme map is already the site's dark palette
   (provision-groot.ts); this only adds what the map cannot say: the menu
   page in the site's accents (orange for the active chip and the add
   button, cream headings). */

/* Category chips: the active one orange with dark lettering, the rest cream. */
button.rounded-full.bg-foreground.text-background {
  background: #f2a12e;
  color: #1a120b;
}
button.rounded-full.text-muted-foreground {
  color: #f5ecdd;
}
button.rounded-full.text-muted-foreground:hover {
  background: #281b12;
  color: #f2a12e;
}

/* Category titles as the site's headings: heavy cream. */
h4.heading-h4 {
  color: #f5ecdd;
  font-weight: 800;
  letter-spacing: -0.02em;
}

/* Product cards: the site's card - hairline, orange "+" and hover. */
button.group.rounded-2xl.bg-card {
  border-color: #36271b;
}
button.group.rounded-2xl.bg-card:hover {
  border-color: rgba(242, 161, 46, 0.55);
  box-shadow: 0 16px 32px -24px rgba(0, 0, 0, 0.8);
}
button.group.rounded-2xl.bg-card span.size-7.rounded-full {
  background: #f2a12e;
  border-color: #f2a12e;
  color: #1a120b;
  box-shadow: none;
}