html, body { overscroll-behavior: none; touch-action: manipulation; }
body { font-family: 'Outfit', sans-serif; background-color: #fcfcfc; }
body.is-scroll-locked { position: fixed; left: 0; right: 0; width: 100%; overflow: hidden; }
[x-cloak] { display: none !important; }
button, a, input, label, select, textarea { touch-action: manipulation; }

@keyframes cartBump {
  0% { transform: scale(1); }
  35% { transform: scale(1.4); }
  65% { transform: scale(0.85); }
  100% { transform: scale(1); }
}
.cart-bump { animation: cartBump 0.42s cubic-bezier(0.36, 0.07, 0.19, 0.97) both; }

@keyframes btnPress {
  0% { transform: scale(1); box-shadow: 0 2px 6px rgba(0,0,0,0.18); }
  35% { transform: scale(0.92); box-shadow: 0 1px 2px rgba(0,0,0,0.10); }
  100% { transform: scale(1); box-shadow: 0 2px 6px rgba(0,0,0,0.18); }
}
.btn-bounce { animation: btnPress 0.22s ease both; }

@media (max-width: 767px) {
  body { padding-bottom: 90px; }
}

/* Botón flotante del carrito: un solo botón, sin submenú — abre el
   carrito directo al tocarlo. Pastilla con ícono + cantidad en desktop,
   se reduce a un círculo compacto en mobile mientras se scrollea. */
.order-fab { position: fixed; right: 20px; bottom: 20px; z-index: 1000; font-family: 'Outfit', sans-serif; }
body.is-scroll-locked .order-fab { display: none; }
.order-fab__main {
  position: relative; height: 56px; min-width: 56px; padding: 0 18px 0 16px; border: 0; border-radius: 999px;
  background: #111827; color: #fff; display: flex; align-items: center; justify-content: center; gap: 10px;
  box-shadow: 0 6px 20px rgba(17,24,39,0.25); cursor: pointer;
  transition: transform 200ms ease, background-color 150ms ease, padding 250ms ease;
}
.order-fab__main:hover { background: #1f2937; }
.order-fab__main:active { transform: scale(0.94); }
.order-fab__main:focus-visible { outline: 2px solid #111827; outline-offset: 3px; }
.order-fab__main-icon { width: 24px; height: 24px; flex: 0 0 auto; }
.order-fab__label { font-size: 13.5px; font-weight: 700; white-space: nowrap; }
.order-fab__total { font-size: 13.5px; font-weight: 800; white-space: nowrap; opacity: 0.85; }
.order-fab__count-badge { position: absolute; top: -6px; right: -6px; min-width: 20px; height: 20px; padding: 0 4px; border-radius: 999px; background: #e24b4a; color: #fff; display: flex; align-items: center; justify-content: center; font-size: 10.5px; font-weight: 800; line-height: 1; border: 2px solid #fcfcfc; }
.order-fab__count-badge[hidden] { display: none; }

@media (max-width: 767px) {
  .order-fab__main { transition: transform 500ms ease, background-color 150ms ease, padding 300ms ease, gap 300ms ease; }
  .order-fab.is-scrolling .order-fab__main { padding: 0; width: 52px; min-width: 52px; height: 52px; gap: 0; }
  .order-fab.is-scrolling .order-fab__label,
  .order-fab.is-scrolling .order-fab__total { display: none; }
}