/* home.css - scoped progressive enhancement for / */

body[data-app="pj-home"] [data-testid="hero-container"] .swiper {
  overflow: hidden;
  touch-action: pan-y;
}

body[data-app="pj-home"] [data-testid="hero-container"] .swiper-wrapper {
  transition: transform .28s ease;
  will-change: transform;
}

body[data-app="pj-home"] [data-testid="hero-container"].is-dragging,
body[data-app="pj-home"] [data-testid="hero-container"].is-dragging * {
  cursor: grabbing;
  user-select: none;
}

body[data-app="pj-home"] [data-testid="hero-container"].is-dragging .swiper-wrapper {
  transition: none;
}

body[data-app="pj-home"] [data-testid="hero-container"] .swiper-pagination-bullet {
  cursor: pointer;
}

body[data-app="pj-home"] [data-testid="hero-container"] .custom-prev.is-disabled,
body[data-app="pj-home"] [data-testid="hero-container"] .custom-next.is-disabled {
  pointer-events: none;
}

@media (min-width: 768px) {
  body[data-app="pj-home"] [data-component="home-heros"] > .relative {
    overflow: hidden;
  }

  body[data-app="pj-home"] [data-component="home-heros"] > .relative > .relative.flex.bg-papaGreen-base {
    bottom: 18px;
    height: 185px;
    left: 18px;
    max-height: 185px;
    position: absolute;
    width: 396px;
    z-index: 2;
  }
}

@media (max-width: 767px) {
  body[data-app="pj-home"] [data-testid="hero-container"] > div,
  body[data-app="pj-home"] [data-testid="hero-container"] .swiper {
    height: 433px !important;
  }

  body[data-app="pj-home"] [data-testid="hero-container"] .swiper-wrapper,
  body[data-app="pj-home"] [data-testid="hero-container"] .swiper-slide {
    height: 413px !important;
  }

  body[data-app="pj-home"] [data-testid="hero-container"] [data-testid="pagination"] {
    bottom: 0 !important;
    transform: translateY(-10px);
  }

  body[data-app="pj-home"] [data-component="home-heros"] {
    width: 310px !important;
    min-width: 310px !important;
    max-width: 310px !important;
    height: 413px !important;
    min-height: 413px !important;
    max-height: 413px !important;
  }

  body[data-app="pj-home"] [data-component="home-heros"] > .relative {
    display: grid !important;
    grid-template-rows: 251px 162px;
    align-items: stretch !important;
    height: 413px !important;
    min-height: 413px !important;
    max-height: 413px !important;
    overflow: hidden;
    border-radius: 1rem;
  }

  body[data-app="pj-home"] [data-component="home-heros"] > .relative > img {
    position: relative !important;
    grid-row: 1;
    display: block !important;
    top: 0 !important;
    right: 0 !important;
    bottom: auto !important;
    left: 0 !important;
    width: 100% !important;
    height: 251px !important;
    min-height: 251px !important;
    max-height: 251px !important;
    object-fit: cover !important;
    object-position: top center !important;
    background: #fff;
    border-radius: 1rem 1rem 0 0 !important;
  }

  body[data-app="pj-home"] [data-component="home-heros"] > .relative > .relative.flex {
    grid-row: 2;
    align-self: stretch !important;
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    height: 162px !important;
    min-height: 162px !important;
    max-height: 162px !important;
  }

  body[data-app="pj-home"] [data-component="home-heros"] > .relative > .relative.flex > .p-3.flex.flex-col.justify-between.w-full.md\\:hidden {
    height: 162px !important;
    min-height: 162px !important;
    max-height: 162px !important;
    box-sizing: border-box;
  }

  body[data-app="pj-home"] [data-component="home-heros"] .font-pappy {
    font-size: 2rem;
    line-height: 1.75rem;
    flex: 0 0 auto;
    white-space: nowrap;
  }

  body[data-app="pj-home"] [data-component="home-heros"] .flex.flex-col.w-full.items-end.leading-5 > .flex.gap-1.items-end > span:first-child:not(.font-pappy) {
    display: none;
  }
}

body[data-app="pj-home"] [data-pj-swipe-carousel="start-order"].swiper {
  cursor: grab;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-behavior: smooth;
  scroll-snap-type: x proximity;
  scrollbar-width: none;
  touch-action: pan-x pan-y;
  -webkit-overflow-scrolling: touch;
}

body[data-app="pj-home"] [data-pj-swipe-carousel="start-order"].swiper::-webkit-scrollbar {
  display: none;
}

body[data-app="pj-home"] [data-pj-swipe-carousel="start-order"].swiper.is-dragging {
  cursor: grabbing;
  scroll-behavior: auto;
  scroll-snap-type: none;
  user-select: none;
}

body[data-app="pj-home"] [data-pj-swipe-carousel="start-order"] .swiper-wrapper {
  transform: none !important;
  width: max-content;
}

body[data-app="pj-home"] [data-pj-swipe-carousel="start-order"] .swiper-slide {
  scroll-snap-align: start;
}

body[data-app="pj-home"] [data-pj-swipe-carousel="start-order"] img {
  pointer-events: none;
  user-select: none;
  -webkit-user-drag: none;
}

body[data-app="pj-home"] [data-pj-swipe-carousel="start-order"] a {
  -webkit-user-drag: none;
}