/*
 * Butter / Toast menu embed — PPMM theme skin
 *
 * Restyles the third-party "butter" menu markup (embedded via the Embed Code
 * block) to match the PPMM theme's native Food Menu block. The embed ships its
 * own inline <style> in the page body, so every rule here is scoped under
 * .butter-menus to outrank those single-class selectors.
 *
 * Relies on the PPMM theme's design tokens (CSS custom properties), so it is a
 * no-op unless a PPMM theme is active.
 */

.butter-menus {
  line-height: var(--_typography---line-height--1-5);
  color: var(--_theme---body-copy);
  font-family: var(--_typography---fonts--body-font);
}

/* Menu title — e.g. "The Revival" */
.butter-menus .butter-menu-name {
  margin: var(--space--0) var(--space--0) var(--_spacing---space--6);
  font-family: var(--_typography---fonts--heading-font);
  font-size: var(--_typography---font-size--h3);
  font-weight: var(--_typography---fonts--font-bold);
  line-height: var(--_typography---line-height--1-1);
  color: var(--_theme---headlines);
}

/* Section groups — Starters, Mains, … */
.butter-menus .butter-menu {
  margin-bottom: var(--_spacing---space--8);
}

.butter-menus .butter-menu-group {
  margin-bottom: var(--_spacing---space--6);
}

.butter-menus .butter-menu-group-name {
  margin: var(--space--0) var(--space--0) var(--_spacing---space--2);
  padding-bottom: var(--_spacing---space--2);
  border-bottom: 1px solid var(--_theme---misc--dividers);
  font-family: var(--_typography---fonts--heading-font);
  font-size: var(--_typography---font-size--h5);
  font-weight: var(--_typography---fonts--font-bold);
  line-height: var(--_typography---line-height--1-1);
  letter-spacing: var(--_typography---letter-spacing--0-03em);
  text-transform: uppercase;
  color: var(--_theme---headlines);
}

/* Items list */
.butter-menus .butter-menu-items {
  display: flex;
  flex-flow: column;
}

.butter-menus .butter-menu-item {
  display: flex;
  flex-flow: column;
  grid-row-gap: var(--space--0-5rem);
  margin: var(--space--0);
  padding: var(--_spacing---space--3) var(--space--0);
}

.butter-menus .butter-menu-item-body {
  flex: 1;
}

/* Name + dashed leader + price row — yields "name ···· price" */
.butter-menus .butter-menu-item-title {
  display: flex;
  align-items: baseline;
  grid-column-gap: var(--space--0-5rem);
}

.butter-menus .butter-menu-item-title p {
  flex: 1;
  display: flex;
  align-items: baseline;
  grid-column-gap: var(--space--0-5rem);
  margin: var(--space--0);
}

.butter-menus .butter-menu-item-name {
  margin: var(--space--0);
  padding: var(--space--0);
  font-family: var(--_typography---fonts--body-font);
  font-size: var(--_typography---font-size--text-main);
  font-weight: var(--_typography---fonts--font-bold);
  line-height: var(--_typography---line-height--1-1);
  color: var(--_theme---headlines);
}

/* Dashed price leader — mirrors the native .menu-item-line */
.butter-menus .butter-menu-price-leaders {
  flex-grow: 1;
  margin: 0 var(--space--0-5rem);
  border-bottom: 1px dashed var(--_theme---misc--accent-background);
}

.butter-menus .butter-menu-item-price,
.butter-menus .butter-menu-item-price-inline {
  flex-shrink: 0;
  margin: var(--space--0);
  white-space: nowrap;
  font-size: var(--_typography---font-size--text-main);
  font-weight: var(--_typography---fonts--font-medium);
  color: var(--_theme---body-copy);
}

/* Description */
.butter-menus .butter-menu-item-desc {
  margin-top: var(--space--0-25rem);
  font-size: var(--_typography---font-size--text-small);
  color: var(--_theme---body-copy);
}

.butter-menus .butter-menu-item-desc p {
  margin: var(--space--0);
}

/* Nested sub-groups */
.butter-menus .butter-menu-group-level-2,
.butter-menus .butter-menu-group-level-3 {
  margin: var(--_spacing---space--4) var(--space--0);
  padding: var(--_spacing---space--3);
  border: 1px solid var(--_theme---misc--dividers);
  border-radius: var(--radius--main);
}