/* Casa Pizza LTS78 — compact phone menu controls.
   Desktop keeps its existing category arrows and sizing. */
.menu-category-prep-banner {
  margin: 0 0 12px;
  color: var(--red, #da3528);
  font-size: .88rem;
  font-weight: 900;
  line-height: 1.35;
}
.menu-category-prep-banner[hidden] { display: none !important; }

@media (max-width: 720px) {
  /* Phone category navigation is touch-scroll only. */
  body[data-page="menu"] .menu-category-rail {
    display: block !important;
    width: 100%;
  }
  body[data-page="menu"] .menu-category-arrow {
    display: none !important;
  }
  body[data-page="menu"] .menu-category-tabs {
    gap: 5px !important;
    padding: 2px 1px 4px !important;
    scroll-behavior: smooth;
    touch-action: pan-x;
  }
  body[data-page="menu"] .menu-category-tabs .category-tab {
    min-height: 34px !important;
    padding: 5px 10px !important;
    font-size: .78rem !important;
    line-height: 1.1 !important;
  }

  /* Compact the combo slideshow pagination shown in the first screenshot. */
  body[data-page="menu"] .menu-slideshow__pagination {
    min-height: 20px !important;
    padding: 4px 7px !important;
    gap: 4px !important;
    bottom: 12px !important;
  }
  body[data-page="menu"] .menu-slideshow__dot {
    width: 6px !important;
    height: 6px !important;
  }
  body[data-page="menu"] .menu-slideshow__dot[aria-current="true"] {
    width: 17px !important;
  }
  /* Keep the legacy slideshow-dot variant compact too, if a persisted slideshow uses it. */
  body[data-page="menu"] .menu-slideshow__dots {
    gap: 4px !important;
    padding: 4px 7px !important;
  }
  body[data-page="menu"] .menu-slideshow__dots button {
    width: 6px !important;
    min-width: 6px !important;
    max-width: 6px !important;
    height: 6px !important;
    min-height: 6px !important;
    max-height: 6px !important;
  }
  body[data-page="menu"] .menu-slideshow__dots button.active {
    width: 17px !important;
    min-width: 17px !important;
    max-width: 17px !important;
  }

  .menu-category-prep-banner {
    margin-bottom: 9px;
    font-size: .78rem;
  }
}
