/*
  Miroballi clean final overrides
  Loaded after the older generated CSS files. Keep new polish here so the
  cascade stays predictable while the legacy files are still present.
*/

:root {
  --clean-red: #e50914;
  --clean-cream: #f7f1e8;
  --clean-black: #050505;
  --clean-rough-black: url("../assets/images/black-grunge-texture.png");
  --clean-title-brush: url("../assets/images/brand-textures/miroballi-red-title-brushstroke-cropped.png");
  --clean-red-brush: url("../assets/images/red-grunge-button-texture-tight.png");
}

/* Title brush and footer CTA rules migrated to css/components/titles.css and buttons.css. */

/* Small menu labels need a stronger plate on photo-heavy cards. */
html body main .menu-feature-copy span {
  position: relative !important;
  isolation: isolate !important;
  padding: 7px 14px 6px !important;
  color: #fff !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.12), rgba(0,0,0,.12)),
    var(--clean-red-brush) center / 150% 155% no-repeat,
    var(--clean-red) !important;
  text-shadow: 0 2px 0 rgba(0,0,0,.82), 0 0 8px rgba(0,0,0,.74) !important;
  box-shadow: 0 8px 18px rgba(0,0,0,.34), 0 0 0 1px rgba(229,9,20,.35) !important;
}

/* Pizza size cards can jump straight into the builder with the size selected. */
html body main .pizza-card .pizza-size-cart {
  position: absolute !important;
  z-index: 9 !important;
  top: 14px !important;
  right: 14px !important;
  left: auto !important;
  bottom: auto !important;
  width: 42px !important;
  height: 42px !important;
  min-height: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  border-radius: 50% !important;
  color: #fff !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.14), rgba(0,0,0,.12)),
    var(--clean-red-brush) center / 170% 180% no-repeat,
    var(--clean-red) !important;
  box-shadow: 0 12px 24px rgba(0,0,0,.36), inset 0 0 0 1px rgba(255,255,255,.08) !important;
  cursor: pointer !important;
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease !important;
}

html body main .pizza-card .pizza-size-cart svg {
  width: 19px !important;
  height: 19px !important;
  flex: 0 0 auto !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

html body main .pizza-card .pizza-size-cart:hover,
html body main .pizza-card .pizza-size-cart:focus-visible {
  transform: translateY(-2px) !important;
  filter: brightness(1.08) !important;
  outline: none !important;
  box-shadow: 0 16px 28px rgba(0,0,0,.42), 0 0 0 2px rgba(229,9,20,.32) !important;
}

/* Cleaner order-option popup cards: less texture, clearer icon/content hierarchy. */
html body .order-choice-modal .choice-card {
  background:
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(0,0,0,.20)),
    rgba(8,8,8,.92) !important;
  background-image: linear-gradient(180deg, rgba(255,255,255,.055), rgba(0,0,0,.20)) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  box-shadow: 0 16px 34px rgba(0,0,0,.36), inset 0 0 0 1px rgba(255,255,255,.035) !important;
}

html body .order-choice-modal .choice-card::before,
html body .order-choice-modal .choice-card::after {
  content: none !important;
  display: none !important;
}

html body .order-choice-modal .choice-card:hover,
html body .order-choice-modal .choice-card:focus-visible {
  background:
    linear-gradient(180deg, rgba(229,9,20,.16), rgba(0,0,0,.18)),
    rgba(10,10,10,.96) !important;
  border-color: rgba(229,9,20,.82) !important;
  outline: none !important;
  transform: translateY(-2px);
}

html body .order-choice-modal .choice-card > .choice-icon {
  background: #050505 !important;
  background-image: none !important;
  border-color: rgba(255,255,255,.26) !important;
  box-shadow: 0 10px 22px rgba(0,0,0,.42), inset 0 0 0 1px rgba(255,255,255,.045) !important;
}

html body .order-choice-modal .choice-card:hover > .choice-icon,
html body .order-choice-modal .choice-card:focus-visible > .choice-icon {
  color: #fff !important;
  border-color: rgba(229,9,20,.86) !important;
  box-shadow: 0 0 0 2px rgba(229,9,20,.32), 0 12px 22px rgba(0,0,0,.42) !important;
}

/* Modal side arrows: keep navigation out of the form flow. */
html body .pizza-builder-modal .builder-dialog,
html body .item-order-modal .item-order-dialog {
  height: min(720px, calc(100dvh - 40px)) !important;
  max-height: calc(100dvh - 40px) !important;
  overflow: visible !important;
  background: #050505 !important;
  background-image: var(--rough-black) !important;
  background-position: center !important;
  background-size: 620px 620px !important;
}

html body .pizza-builder-modal .builder-content,
html body .item-order-modal .item-order-content {
  position: relative !important;
}

html body .item-order-modal {
  place-items: center !important;
  padding: 20px 14px !important;
}

html body .item-order-modal .item-order-media,
html body .item-order-modal .item-order-content {
  min-width: 0 !important;
  min-height: 0 !important;
  height: 100% !important;
}

html body .item-order-modal .item-order-media {
  background: #020202 !important;
}

html body .item-order-modal .item-order-media img {
  min-height: 0 !important;
}

html body .item-order-modal .item-order-content {
  overflow-x: hidden !important;
  overflow-y: auto !important;
  padding: clamp(32px, 4vw, 48px) !important;
  background-color: #080808 !important;
  background-image: var(--rough-black) !important;
  background-position: center !important;
  background-size: 560px 560px !important;
  box-shadow: inset 1px 0 0 rgba(229,9,20,.64) !important;
}

html body .item-order-modal .item-order-content h2 {
  font-size: clamp(46px, 4.4vw, 68px) !important;
  line-height: .9 !important;
}

html body .item-order-modal .item-order-price-row {
  background: #070707 !important;
  background-image: none !important;
  border-color: rgba(229,9,20,.72) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.035), 0 12px 26px rgba(0,0,0,.32) !important;
}

html body .item-order-modal .item-order-help {
  margin: 16px 0 0 !important;
  max-width: 42rem !important;
  color: rgba(247,241,232,.7) !important;
  font: 750 13px/1.5 Inter, Arial, sans-serif !important;
  letter-spacing: .01em !important;
  text-transform: none !important;
}

html body .delivery-choice-modal .delivery-choice-dialog {
  background: #050505 !important;
  background-image: var(--rough-black) !important;
  background-position: center !important;
  background-size: 620px 620px !important;
}

html body .delivery-choice-modal .delivery-provider-card {
  display: grid !important;
  grid-template-columns: 72px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 20px !important;
  margin: 22px 0 !important;
  padding: clamp(20px, 3vw, 28px) !important;
  border: 1px solid rgba(229,9,20,.72) !important;
  background: rgba(0,0,0,.72) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.04), 0 16px 34px rgba(0,0,0,.34) !important;
}

html body .delivery-choice-modal .delivery-provider-mark {
  width: 64px !important;
  height: 64px !important;
  border-radius: 50% !important;
  display: grid !important;
  place-items: center !important;
  color: #fff !important;
  background: #e50914 !important;
  font: 400 40px/1 "Bebas Neue", Impact, sans-serif !important;
  box-shadow: 0 10px 24px rgba(0,0,0,.42) !important;
}

html body .delivery-choice-modal .delivery-provider-card strong {
  display: block !important;
  color: #fff !important;
  font: 400 clamp(30px, 4vw, 44px)/.95 "Bebas Neue", Impact, sans-serif !important;
  text-transform: uppercase !important;
}

html body .delivery-choice-modal .delivery-provider-card p {
  margin: 7px 0 0 !important;
  color: rgba(247,241,232,.72) !important;
  font: 700 13px/1.45 Inter, Arial, sans-serif !important;
}

html body .delivery-choice-modal .builder-actions-row {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 12px !important;
}

html body .pizza-builder-modal .builder-nav,
html body .item-order-modal .item-order-nav {
  position: absolute !important;
  z-index: 12 !important;
  inset: 50% auto auto 0 !important;
  width: 100% !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  pointer-events: none !important;
  transform: translateY(-50%) !important;
}

html body .pizza-builder-modal .builder-nav .button,
html body .item-order-modal .item-order-nav .button {
  position: absolute !important;
  top: 0 !important;
  width: 50px !important;
  height: 50px !important;
  min-width: 50px !important;
  min-height: 50px !important;
  max-width: 50px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  display: grid !important;
  place-items: center !important;
  pointer-events: auto !important;
  overflow: hidden !important;
  color: transparent !important;
  font-size: 0 !important;
  letter-spacing: 0 !important;
  text-indent: -999px !important;
  box-shadow: 0 18px 34px rgba(0,0,0,.46), inset 0 0 0 1px rgba(255,255,255,.08) !important;
  transform: translateY(-50%) !important;
}

html body .pizza-builder-modal .builder-nav [data-builder-prev],
html body .item-order-modal .item-order-nav [data-item-prev] {
  left: -25px !important;
}

html body .pizza-builder-modal .builder-nav [data-builder-next],
html body .item-order-modal .item-order-nav [data-item-next] {
  right: -25px !important;
}

/* The item modal scrolls inside its content pane, so its arrows must stay inside it. */
html body .item-order-modal .item-order-nav [data-item-prev] {
  left: 10px !important;
}

html body .item-order-modal .item-order-nav [data-item-next] {
  right: 10px !important;
}

/* Item ordering uses a clear bottom action row instead of floating arrows. */
html body .item-order-modal .item-order-nav {
  position: static !important;
  width: 100% !important;
  height: auto !important;
  margin: 24px 0 0 !important;
  padding: 16px 0 0 !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 12px !important;
  border-top: 1px solid rgba(255,255,255,.12) !important;
  pointer-events: auto !important;
  transform: none !important;
}

html body .item-order-modal .item-order-nav .button {
  position: static !important;
  width: 100% !important;
  height: 50px !important;
  min-width: 0 !important;
  min-height: 50px !important;
  max-width: none !important;
  padding: 0 18px !important;
  border-radius: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #fff !important;
  font: 950 14px/1 Inter, Arial, sans-serif !important;
  letter-spacing: .1em !important;
  text-indent: 0 !important;
  text-transform: uppercase !important;
  text-shadow: 0 2px 0 rgba(0,0,0,.72) !important;
  transform: none !important;
}

html body .item-order-modal .item-order-nav .button span {
  display: none !important;
}

html body .item-order-modal .item-order-nav [data-item-prev] {
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.72) !important;
  background: #050505 !important;
  background-image: none !important;
}

html body .item-order-modal .item-order-nav [data-item-next] {
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.12), rgba(0,0,0,.12)),
    var(--clean-red-brush) center / 150% 170% no-repeat,
    var(--clean-red) !important;
}

html body .item-order-modal .item-order-nav [data-item-prev]::before,
html body .item-order-modal .item-order-nav [data-item-next]::before {
  content: none !important;
  display: none !important;
}

html body .item-order-modal .item-order-nav .button:disabled {
  opacity: .34 !important;
  visibility: visible !important;
  filter: grayscale(.8) brightness(.72) !important;
}

html body .item-order-modal .item-order-nav .button:hover,
html body .item-order-modal .item-order-nav .button:focus-visible {
  transform: translateY(-2px) !important;
}

html body .pizza-builder-modal .builder-nav .button span,
html body .item-order-modal .item-order-nav .button span {
  display: none !important;
}

html body .pizza-builder-modal .builder-nav [data-builder-prev]::before,
html body .item-order-modal .item-order-nav [data-item-prev]::before {
  content: "" !important;
  display: block !important;
  width: 13px !important;
  height: 13px !important;
  border-left: 3px solid #fff !important;
  border-bottom: 3px solid #fff !important;
  transform: rotate(45deg) translate(1px, -1px) !important;
  text-indent: 0 !important;
}

html body .pizza-builder-modal .builder-nav [data-builder-next]::before,
html body .item-order-modal .item-order-nav [data-item-next]::before {
  content: "" !important;
  display: block !important;
  width: 13px !important;
  height: 13px !important;
  border-top: 3px solid #fff !important;
  border-right: 3px solid #fff !important;
  transform: rotate(45deg) translate(-1px, 1px) !important;
  text-indent: 0 !important;
}

html body .pizza-builder-modal .builder-nav .button:disabled,
html body .item-order-modal .item-order-nav .button:disabled {
  opacity: .34 !important;
  visibility: visible !important;
  pointer-events: none !important;
  filter: grayscale(.8) brightness(.72) !important;
}

html body .pizza-builder-modal .builder-nav .button:hover,
html body .pizza-builder-modal .builder-nav .button:focus-visible,
html body .item-order-modal .item-order-nav .button:hover,
html body .item-order-modal .item-order-nav .button:focus-visible {
  transform: translateY(-50%) scale(1.06) !important;
  outline: none !important;
}

/* Mobile Pass */
@media (max-width: 760px) {
  html body .item-order-modal {
    padding: 8px !important;
  }

  html body .item-order-modal .item-order-dialog {
    height: calc(100dvh - 16px) !important;
    max-height: calc(100dvh - 16px) !important;
    grid-template-rows: 160px minmax(0, 1fr) !important;
    overflow: hidden !important;
  }

  html body .item-order-modal .item-order-media {
    min-height: 0 !important;
    max-height: none !important;
  }

  html body .item-order-modal .item-order-content {
    height: auto !important;
    padding: 24px 18px 28px !important;
    box-shadow: inset 0 1px 0 rgba(229,9,20,.64) !important;
  }

  html body .item-order-modal .item-order-content h2 {
    font-size: clamp(40px, 12vw, 54px) !important;
  }

  html body .item-order-modal .item-order-price-row {
    align-items: center !important;
  }

  html body .delivery-choice-modal .delivery-provider-card {
    grid-template-columns: 52px minmax(0, 1fr) !important;
    gap: 14px !important;
    padding: 18px !important;
  }

  html body .delivery-choice-modal .delivery-provider-mark {
    width: 48px !important;
    height: 48px !important;
    font-size: 30px !important;
  }

  html body .delivery-choice-modal .builder-actions-row {
    grid-template-columns: 1fr !important;
  }

  html body .topbar {
    min-height: 74px !important;
  }

  html body .topbar.scrolled {
    height: 68px !important;
    min-height: 68px !important;
    padding-block: 8px !important;
  }

  html body .topbar.scrolled .logo {
    width: 104px !important;
    max-width: 104px !important;
  }

  html body .topbar.scrolled .logo img {
    max-height: 52px !important;
    object-fit: contain !important;
  }

  html body .order-fab {
    width: 70px !important;
    height: 82px !important;
    min-height: 82px !important;
    right: 12px !important;
    bottom: 14px !important;
    padding: 9px 8px 10px !important;
    border-radius: 999px !important;
    background:
      linear-gradient(180deg, rgba(255,255,255,.12), rgba(0,0,0,.14)),
      var(--clean-red-brush) center / 160% 160% no-repeat,
      var(--clean-red) !important;
  }

  html body .order-fab span {
    font: 900 10px/1 Inter, Arial, sans-serif !important;
    letter-spacing: .08em !important;
  }

  html body .order-fab strong {
    font: 400 25px/.84 "Bebas Neue", Impact, sans-serif !important;
  }

  html body main .favorites-head h2.flyer-title-stack,
  html body main .difference-head h2.flyer-title-stack,
  html body main .menu-section-head h2.flyer-title-stack,
  html body main .google-profile-head h2.flyer-title-stack,
  html body main .photo-section-head h2.flyer-title-stack {
    font-size: clamp(38px, 10.8vw, 50px) !important;
    letter-spacing: .02em !important;
    text-align: left !important;
  }

  html body main .favorites-head h2.flyer-title-stack {
    font-size: clamp(37px, 10.2vw, 48px) !important;
    text-align: center !important;
  }

  html body main .menu-section-head h2.flyer-title-stack {
    font-size: clamp(36px, 9.8vw, 47px) !important;
    text-align: center !important;
  }

  html body main .flyer-title-stack .flyer-title-line::before {
    width: min(calc(100% + 56px), calc(100vw - 28px)) !important;
    height: 0.58em !important;
    opacity: 0.84 !important;
  }

  html body main .favorites-head h2.flyer-title-stack .flyer-title-line::before,
  html body main .menu-section-head h2.flyer-title-stack .flyer-title-line::before {
    width: min(calc(100% + 66px), calc(100vw - 28px)) !important;
  }

  html body main .difference-head {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    align-items: start !important;
    text-align: left !important;
  }

  html body main .difference-head .eyebrow,
  html body main .difference-head h2,
  html body main .difference-head p:not(.eyebrow) {
    grid-column: auto !important;
  }

  html body main .difference-head h2.flyer-title-stack {
    width: max-content !important;
    max-width: calc(100vw - 32px) !important;
  }

  html body main .difference-head p:not(.eyebrow) {
    max-width: 26rem !important;
    margin: 0 !important;
    text-align: left !important;
    font-size: 15px !important;
    line-height: 1.42 !important;
  }

  html body main .google-profile-head h2.flyer-title-stack,
  html body main .photo-section-head h2.flyer-title-stack {
    justify-items: start !important;
    margin-inline: 0 !important;
  }

  html body main .entree-card__info {
    gap: 5px !important;
  }

  html body main .entree-card__info > .card-order-btn {
    min-height: 34px !important;
    width: auto !important;
    max-width: 112px !important;
    padding: 7px 22px 7px 10px !important;
    font-size: 10px !important;
    letter-spacing: .075em !important;
  }

  html body main .entree-card__info > .card-order-btn::after {
    right: 8px !important;
    font-size: 12px !important;
  }

  html body main .app-card .card-order-btn,
  html body main .app-card .app-order-btn {
    margin-left: 14px !important;
    padding-left: 15px !important;
    padding-right: 28px !important;
  }

  html body main .app-card .card-order-btn::after,
  html body main .app-card .app-order-btn::after {
    right: 11px !important;
  }

  html body main .pizza-card .pizza-size-cart {
    top: 12px !important;
    right: 12px !important;
    left: auto !important;
    bottom: auto !important;
    width: 38px !important;
    height: 38px !important;
    min-height: 0 !important;
    padding: 0 !important;
  }

  html body main .pizza-card .pizza-size-cart svg {
    width: 17px !important;
    height: 17px !important;
  }

  html body footer#contact .visit .button.button-red {
    width: min(270px, 100%) !important;
    min-height: 44px !important;
    height: 44px !important;
    padding: 9px 14px !important;
    font-size: 15px !important;
    letter-spacing: .08em !important;
  }

  html body .pizza-builder-modal .builder-nav .button,
  html body .item-order-modal .item-order-nav .button {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    max-width: 44px !important;
  }

  html body .pizza-builder-modal .builder-nav [data-builder-prev],
  html body .item-order-modal .item-order-nav [data-item-prev] {
    left: -10px !important;
  }

  html body .pizza-builder-modal .builder-nav [data-builder-next],
  html body .item-order-modal .item-order-nav [data-item-next] {
    right: -10px !important;
  }

  html body .item-order-modal .item-order-nav [data-item-prev] {
    left: auto !important;
  }

  html body .item-order-modal .item-order-nav [data-item-next] {
    right: auto !important;
  }

  html body .item-order-modal .item-order-nav {
    margin-top: 20px !important;
    padding-top: 14px !important;
    gap: 8px !important;
  }

  html body .item-order-modal .item-order-nav .button {
    width: 100% !important;
    height: 46px !important;
    min-height: 46px !important;
    max-width: none !important;
    padding: 0 12px !important;
    font-size: 12px !important;
  }

  html body .pizza-builder-modal .builder-nav [data-builder-prev]::before,
  html body .item-order-modal .item-order-nav [data-item-prev]::before,
  html body .pizza-builder-modal .builder-nav [data-builder-next]::before,
  html body .item-order-modal .item-order-nav [data-item-next]::before {
    font-size: 26px !important;
  }
}

/* Client-ready menu item sheet and Ajax-style cart drawer. */
html body .item-order-modal .item-order-dialog {
  grid-template-columns: minmax(260px, .92fr) minmax(0, 1.08fr) !important;
  width: min(calc(100vw - 32px), 960px) !important;
  height: min(690px, calc(100dvh - 36px)) !important;
  border: 1px solid rgba(229,9,20,.84) !important;
  box-shadow: 0 28px 80px rgba(0,0,0,.78), 0 0 0 1px rgba(255,255,255,.05) !important;
}

html body .item-order-modal .item-order-media {
  position: relative !important;
}

html body .item-order-modal .item-order-media::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  background: linear-gradient(90deg, transparent 58%, rgba(0,0,0,.48)) !important;
}

html body .item-order-modal .item-order-content {
  padding: clamp(30px, 4vw, 46px) !important;
}

html body .item-order-modal .item-order-content > .eyebrow {
  margin: 0 0 8px !important;
  color: #e50914 !important;
}

html body .item-order-modal .item-order-desc {
  margin-bottom: 16px !important;
  color: rgba(247,241,232,.72) !important;
  font-size: 14px !important;
  line-height: 1.45 !important;
}

html body .item-order-modal .item-order-price-row {
  margin: 16px 0 !important;
  padding: 14px 16px !important;
  border-inline: 0 !important;
  border-color: rgba(229,9,20,.48) !important;
}

html body .item-order-modal .item-order-price-row strong {
  font-size: clamp(36px, 4vw, 50px) !important;
}

html body .item-order-modal .item-order-steps {
  margin: 16px 0 20px !important;
  padding: 8px !important;
}

html body .item-order-modal .item-order-panel {
  min-height: 118px !important;
}

html body .item-order-modal .item-order-summary {
  margin-bottom: 10px !important;
  padding: 15px 16px !important;
  background: rgba(0,0,0,.64) !important;
  background-image: none !important;
}

html body .item-order-modal .item-cart-preview {
  margin: 10px 0 14px !important;
  padding: 13px 16px !important;
  background: #080808 !important;
  background-image: none !important;
}

html body .item-order-modal.item-final-step .item-order-nav {
  display: none !important;
}

html body .item-order-modal .item-order-panel .builder-actions-row {
  grid-template-columns: 1.2fr .8fr !important;
}

html body .topbar .nav-cart-button {
  position: relative !important;
  flex: 0 0 auto !important;
  height: 43px !important;
  padding: 0 !important;
  border: 1px solid rgba(255,255,255,.2) !important;
  border-radius: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding-inline: 13px !important;
  color: #fff !important;
  background: #080808 !important;
  box-shadow: inset 0 0 0 1px rgba(229,9,20,.24) !important;
  font: 900 11px/1 Inter, Arial, sans-serif !important;
  letter-spacing: .09em !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
}

html body .topbar .nav-cart-button svg {
  width: 20px !important;
  height: 20px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

html body .topbar .nav-cart-button b {
  min-width: 20px !important;
  height: 20px !important;
  padding: 0 4px !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  border-radius: 999px !important;
  display: grid !important;
  place-items: center !important;
  color: #fff !important;
  background: #6d0b10 !important;
  font: 900 10px/1 Inter, Arial, sans-serif !important;
}

html body .topbar .nav-cart-button b.has-items {
  background: #e50914 !important;
}

html body .topbar .nav-cart-button:hover,
html body .topbar .nav-cart-button:focus-visible {
  border-color: rgba(229,9,20,.88) !important;
  background: #111 !important;
  outline: none !important;
}

/* Cart drawer rules migrated to css/components/cart-drawer.css. */

@media (max-width: 760px) {
  html body .item-order-modal .item-order-dialog {
    grid-template-columns: 1fr !important;
    grid-template-rows: 190px minmax(0, 1fr) !important;
    width: calc(100vw - 12px) !important;
    height: calc(100dvh - 12px) !important;
    max-height: calc(100dvh - 12px) !important;
  }

  html body .item-order-modal .item-order-media::after {
    background: linear-gradient(
      to top,
      #050505 0%,
      rgba(5,5,5,.92) 12%,
      rgba(5,5,5,.54) 34%,
      rgba(5,5,5,.12) 62%,
      transparent 82%
    ) !important;
  }

  html body .item-order-modal .item-order-content {
    padding: 20px 18px 24px !important;
  }

  html body .item-order-modal .item-order-content h2 {
    font-size: clamp(38px, 11vw, 50px) !important;
  }

  html body .item-order-modal .item-order-desc {
    font-size: 13px !important;
  }

  html body .item-order-modal .item-order-steps {
    margin: 12px 0 16px !important;
  }

  html body .item-order-modal .item-order-panel {
    min-height: 105px !important;
  }

  html body .item-order-modal .item-order-panel .builder-actions-row {
    grid-template-columns: 1fr !important;
  }

  html body .topbar .nav-cart-button {
    order: 2 !important;
    width: 42px !important;
    height: 42px !important;
    margin-left: auto !important;
    padding: 0 !important;
    border-radius: 50% !important;
    gap: 0 !important;
  }

  html body .topbar .nav-cart-button span {
    display: none !important;
  }

  html body .topbar .nav-cart-button b {
    position: absolute !important;
    top: -5px !important;
    right: -5px !important;
    min-width: 19px !important;
    height: 19px !important;
    border: 2px solid #050505 !important;
    font-size: 9px !important;
  }

  html body .topbar .menu-toggle {
    order: 3 !important;
    margin-left: 4px !important;
  }

  html body .cart-drawer-panel {
    width: min(390px, 100vw) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body .cart-drawer-backdrop,
  html body .cart-drawer-panel {
    transition: none !important;
  }
}

/* Final ordering-state authority. */
html body .item-order-modal.item-final-step .item-order-content .item-order-nav {
  display: none !important;
}

html body .cart-drawer .cart-drawer-footer .button.button-dark {
  color: #fff !important;
  background: #050505 !important;
  background-image: none !important;
  border-color: rgba(255,255,255,.72) !important;
  text-shadow: 0 2px 0 rgba(0,0,0,.72) !important;
}

html body .cart-drawer .cart-drawer-footer .button.button-dark:hover,
html body .cart-drawer .cart-drawer-footer .button.button-dark:focus-visible {
  color: #fff !important;
  background: #111 !important;
  border-color: #fff !important;
}

/* Mobile pizza builder: one continuous opaque textured scroll surface. */
@media (max-width: 760px) {
  html body .pizza-builder-modal {
    padding: 6px !important;
    overflow: hidden !important;
    background: rgba(0,0,0,.88) !important;
  }

  html body .pizza-builder-modal .builder-dialog {
    display: block !important;
    width: calc(100vw - 12px) !important;
    height: calc(100dvh - 12px) !important;
    max-height: calc(100dvh - 12px) !important;
    margin: 0 auto !important;
    overflow: hidden !important;
    border: 1px solid rgba(229,9,20,.88) !important;
    background-color: #050505 !important;
    background-image: var(--rough-black) !important;
    background-position: center top !important;
    background-size: 560px 560px !important;
  }

  html body .pizza-builder-modal .builder-art {
    display: none !important;
  }

  html body .pizza-builder-modal .builder-content {
    position: relative !important;
    isolation: isolate !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 100% !important;
    padding: 54px 20px 34px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    background-color: #050505 !important;
    background-image:
      linear-gradient(rgba(5,5,5,.88), rgba(5,5,5,.94)),
      var(--rough-black) !important;
    background-position: center top !important;
    background-size: auto, 560px 560px !important;
    background-repeat: repeat !important;
    box-shadow: none !important;
  }

  html body .pizza-builder-modal .builder-content::before {
    content: "" !important;
    position: absolute !important;
    z-index: -1 !important;
    inset: 0 !important;
    min-height: 100% !important;
    background: #050505 !important;
    pointer-events: none !important;
  }

  html body .pizza-builder-modal .builder-form,
  html body .pizza-builder-modal .builder-panel,
  html body .pizza-builder-modal .builder-summary-panel {
    position: relative !important;
    z-index: 1 !important;
    background-color: transparent !important;
  }

  html body .pizza-builder-modal .builder-panel label span,
  html body .pizza-builder-modal .builder-summary-text,
  html body .pizza-builder-modal .builder-line-items,
  html body .pizza-builder-modal .builder-review-controls {
    background-color: #090909 !important;
    background-image: var(--rough-black) !important;
    background-position: center !important;
    background-size: 480px 480px !important;
  }
}

@media (max-width: 390px) {
  html body main .favorites-head h2.flyer-title-stack,
  html body main .difference-head h2.flyer-title-stack,
  html body main .menu-section-head h2.flyer-title-stack,
  html body main .google-profile-head h2.flyer-title-stack,
  html body main .photo-section-head h2.flyer-title-stack {
    font-size: clamp(34px, 9.7vw, 44px) !important;
  }

  html body main .favorites-head h2.flyer-title-stack {
    font-size: clamp(34px, 9.5vw, 43px) !important;
  }

  html body main .menu-section-head h2.flyer-title-stack {
    font-size: clamp(32px, 9.2vw, 41px) !important;
  }
}

/* Final item-modal navigation authority: bottom text buttons at every breakpoint. */
html body .item-order-modal .item-order-content .item-order-nav {
  position: static !important;
  inset: auto !important;
  width: 100% !important;
  height: auto !important;
  margin: 24px 0 0 !important;
  padding: 16px 0 0 !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 12px !important;
  border-top: 1px solid rgba(255,255,255,.12) !important;
  pointer-events: auto !important;
  transform: none !important;
}

html body .item-order-modal .item-order-content .item-order-nav .button {
  position: static !important;
  inset: auto !important;
  width: 100% !important;
  height: 50px !important;
  min-width: 0 !important;
  min-height: 50px !important;
  max-width: none !important;
  padding: 0 18px !important;
  border-radius: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: visible !important;
  color: #fff !important;
  font: 950 14px/1 Inter, Arial, sans-serif !important;
  letter-spacing: .1em !important;
  text-indent: 0 !important;
  text-transform: uppercase !important;
  text-shadow: 0 2px 0 rgba(0,0,0,.72) !important;
  transform: none !important;
}

html body .item-order-modal .item-order-content .item-order-nav [data-item-prev] {
  border: 1px solid rgba(255,255,255,.72) !important;
  background: #050505 !important;
  background-image: none !important;
}

html body .item-order-modal .item-order-content .item-order-nav [data-item-next] {
  border: 1px solid rgba(255,255,255,.18) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.12), rgba(0,0,0,.12)),
    var(--clean-red-brush) center / 150% 170% no-repeat,
    var(--clean-red) !important;
}

html body .item-order-modal .item-order-content .item-order-nav .button::before,
html body .item-order-modal .item-order-content .item-order-nav .button::after,
html body .item-order-modal .item-order-content .item-order-nav .button span {
  content: none !important;
  display: none !important;
}

html body .item-order-modal .item-order-content .item-order-nav .button:disabled {
  opacity: .34 !important;
  visibility: visible !important;
  pointer-events: none !important;
  filter: grayscale(.8) brightness(.72) !important;
}

html body .item-order-modal .item-order-content .item-order-nav .button:hover,
html body .item-order-modal .item-order-content .item-order-nav .button:focus-visible {
  transform: translateY(-2px) !important;
  outline: none !important;
}

@media (max-width: 760px) {
  html body .item-order-modal .item-order-content .item-order-nav {
    margin-top: 20px !important;
    padding-top: 14px !important;
    gap: 8px !important;
  }

  html body .item-order-modal .item-order-content .item-order-nav .button {
    height: 46px !important;
    min-height: 46px !important;
    padding: 0 12px !important;
    font-size: 12px !important;
  }
}
