/** Shopify CDN: Minification failed

Line 584:227 Unexpected "/"

**/
/* ══════════════════════════════════════════════════════════════════════════
   🌶️ PEPPER PONG JUDGE.ME REVIEW CAROUSEL - COMPLETE CSS v2.0
   MOBILE FIX: Horizontal scroll, not vertical stack
   ══════════════════════════════════════════════════════════════════════════ */

/* ──────────────────────────────────────────────────────────────────────────
   🎨 CONTAINER & WRAPPER
   ────────────────────────────────────────────────────────────────────────── */

.jdgm-carousel-wrapper {
  background: #ffffff !important;
  padding: 60px 0 !important;
  margin: 40px 0 !important;
  width: 100% !important;
  overflow: visible !important;
}

.jdgm-carousel {
  max-width: 1400px !important;
  margin: 0 auto !important;
  padding: 0 40px !important;
  position: relative !important;
}

/* ──────────────────────────────────────────────────────────────────────────
   📝 HEADER
   ────────────────────────────────────────────────────────────────────────── */

.jdgm-carousel__header {
  font-family: 'Gotham Black', 'Arial Black', sans-serif !important;
  font-style: italic !important;
  font-size: 42px !important;
  color: #2C2C2C !important;
  text-align: center !important;
  margin-bottom: 40px !important;
  font-weight: 900 !important;
  letter-spacing: -0.5px !important;
}

/* ──────────────────────────────────────────────────────────────────────────
   🎴 REVIEW CARDS - FIXED HEIGHT SYSTEM
   ────────────────────────────────────────────────────────────────────────── */

.jdgm-carousel__item,
.jdgm-carousel-item {
  background: #F5F5F5 !important;
  border-radius: 12px !important;
  padding: 24px !important;
  margin: 0 12px !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.08) !important;
  transition: transform 0.3s ease, box-shadow 0.3s ease !important;
  
  /* FIXED HEIGHT - KEY TO CONSISTENCY */
  height: 600px !important;
  min-height: 600px !important;
  max-height: 600px !important;
  
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}

.jdgm-carousel__item:hover,
.jdgm-carousel-item:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 8px 24px rgba(237, 24, 70, 0.15) !important;
}

/* ──────────────────────────────────────────────────────────────────────────
   🖼️ IMAGE SECTION - FIXED HEIGHT
   ────────────────────────────────────────────────────────────────────────── */

.jdgm-carousel__item-image-wrapper,
.jdgm-carousel-item__image-wrapper {
  width: 100% !important;
  height: 240px !important;
  min-height: 240px !important;
  max-height: 240px !important;
  margin-bottom: 20px !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  flex-shrink: 0 !important;
}

.jdgm-carousel__item-image,
.jdgm-carousel-item__image {
  width: 100% !important;
  height: 240px !important;
  min-height: 240px !important;
  max-height: 240px !important;
  object-fit: cover !important;
  border-radius: 8px !important;
}

/* ──────────────────────────────────────────────────────────────────────────
   ⭐ STARS - FIXED HEIGHT
   ────────────────────────────────────────────────────────────────────────── */

.jdgm-carousel__item-rating,
.jdgm-carousel-item__rating {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  margin-bottom: 12px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  flex-shrink: 0 !important;
}

.jdgm-carousel__item-rating .jdgm-star,
.jdgm-carousel-item__rating .jdgm-star {
  color: #FFC91A !important;
  font-size: 20px !important;
}

/* ──────────────────────────────────────────────────────────────────────────
   👤 REVIEWER NAME - FIXED HEIGHT
   ────────────────────────────────────────────────────────────────────────── */

.jdgm-carousel__item-reviewer,
.jdgm-carousel-item__reviewer {
  font-family: 'Trade Gothic', Arial, sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #2C2C2C !important;
  margin-bottom: 8px !important;
  
  /* FIXED HEIGHT - PREVENT VERTICAL TEXT */
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  line-height: 24px !important;
  
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  flex-shrink: 0 !important;
}

/* ──────────────────────────────────────────────────────────────────────────
   📌 REVIEW TITLE - FIXED HEIGHT, 2 LINE MAX
   ────────────────────────────────────────────────────────────────────────── */

.jdgm-carousel__item-title,
.jdgm-carousel-item__title {
  font-family: 'Trade Gothic', Arial, sans-serif !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #ED1846 !important;
  margin-bottom: 12px !important;
  
  /* FIXED HEIGHT FOR 2 LINES */
  height: 44px !important;
  min-height: 44px !important;
  max-height: 44px !important;
  line-height: 22px !important;
  
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  flex-shrink: 0 !important;
}

/* ──────────────────────────────────────────────────────────────────────────
   📄 REVIEW BODY - FIXED HEIGHT WITH FADE
   ────────────────────────────────────────────────────────────────────────── */

.jdgm-carousel__item-body,
.jdgm-carousel-item__body {
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  font-size: 15px !important;
  line-height: 1.6 !important;
  color: #2C2C2C !important;
  margin-bottom: 16px !important;
  
  /* FIXED HEIGHT - 7 LINES */
  height: 168px !important;
  min-height: 168px !important;
  max-height: 168px !important;
  
  display: -webkit-box !important;
  -webkit-line-clamp: 7 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  flex-shrink: 0 !important;
  position: relative !important;
}

/* Fade effect at bottom */
.jdgm-carousel__item-body::after,
.jdgm-carousel-item__body::after {
  content: '' !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 40px !important;
  background: linear-gradient(to bottom, transparent, #F5F5F5) !important;
  pointer-events: none !important;
}

/* ──────────────────────────────────────────────────────────────────────────
   🔗 READ MORE LINK
   ────────────────────────────────────────────────────────────────────────── */

.jdgm-carousel__item-read-more,
.jdgm-carousel-item__read-more {
  font-family: 'Trade Gothic', Arial, sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #ED1846 !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  margin-top: auto !important;
  transition: color 0.2s ease !important;
}

.jdgm-carousel__item-read-more:hover,
.jdgm-carousel-item__read-more:hover {
  color: #FF571A !important;
  text-decoration: underline !important;
}

/* Add "Read full review" text if missing */
.jdgm-carousel__item-read-more:empty::before,
.jdgm-carousel-item__read-more:empty::before {
  content: 'Read full review →' !important;
}

/* ──────────────────────────────────────────────────────────────────────────
   ◀️ ▶️ NAVIGATION ARROWS
   ────────────────────────────────────────────────────────────────────────── */

.jdgm-carousel__arrow,
.jdgm-carousel-wrapper__arrow {
  background: #ED1846 !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 50% !important;
  width: 48px !important;
  height: 48px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important;
  box-shadow: 0 4px 12px rgba(237, 24, 70, 0.3) !important;
  z-index: 10 !important;
}

.jdgm-carousel__arrow:hover,
.jdgm-carousel-wrapper__arrow:hover {
  background: #FF571A !important;
  transform: scale(1.1) !important;
  box-shadow: 0 6px 16px rgba(237, 24, 70, 0.4) !important;
}

.jdgm-carousel__arrow--prev,
.jdgm-carousel-wrapper__arrow--prev {
  left: -24px !important;
}

.jdgm-carousel__arrow--next,
.jdgm-carousel-wrapper__arrow--next {
  right: -24px !important;
}

/* ──────────────────────────────────────────────────────────────────────────
   🔘 "SEE ALL REVIEWS" BUTTON
   ────────────────────────────────────────────────────────────────────────── */

.jdgm-carousel__more-reviews,
.jdgm-carousel-more-reviews-button {
  background: #ED1846 !important;
  color: #ffffff !important;
  font-family: 'Trade Gothic', Arial, sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  padding: 16px 40px !important;
  border: none !important;
  border-radius: 100px !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important;
  display: inline-block !important;
  margin: 40px auto 0 !important;
  text-align: center !important;
  text-decoration: none !important;
  box-shadow: 0 4px 12px rgba(237, 24, 70, 0.3) !important;
}

.jdgm-carousel__more-reviews:hover,
.jdgm-carousel-more-reviews-button:hover {
  background: #FF571A !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 16px rgba(237, 24, 70, 0.4) !important;
}

/* ══════════════════════════════════════════════════════════════════════════
   📱 MOBILE RESPONSIVE - HORIZONTAL CAROUSEL FIX
   ══════════════════════════════════════════════════════════════════════════ */

@media (max-width: 768px) {
  
  /* ──────────────────────────────────────────────────────────────────────
     🎯 WRAPPER & MAIN CONTAINER - STAY VERTICAL
     ────────────────────────────────────────────────────────────────────── */
  
  .jdgm-carousel-wrapper {
    display: flex !important;
    flex-direction: column !important;
    padding: 32px 0 !important;
    margin: 20px 0 !important;
    overflow: visible !important;
  }
  
  .jdgm-carousel {
    display: flex !important;
    flex-direction: column !important;
    padding: 0 !important;
    overflow: visible !important;
    width: 100% !important;
    position: relative !important;
  }
  
  /* ──────────────────────────────────────────────────────────────────────
     📝 HEADER - ABOVE CARDS
     ────────────────────────────────────────────────────────────────────── */
  
  .jdgm-carousel__header {
    font-size: 28px !important;
    margin-bottom: 24px !important;
    padding: 0 16px !important;
    order: -1 !important;
  }
  
  /* ──────────────────────────────────────────────────────────────────────
     🎴 CARDS CONTAINER - HORIZONTAL SCROLL (KEY FIX!)
     ────────────────────────────────────────────────────────────────────── */
  
  .jdgm-carousel__items,
  .jdgm-carousel-items,
  .jdgm-carousel-items-wrapper,
  .jdgm-carousel > div:not(.jdgm-carousel__header):not(.jdgm-carousel__more-reviews),
  .jdgm-carousel-wrapper > div > div[class*="items"] {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-snap-type: x mandatory !important;
    -webkit-overflow-scrolling: touch !important;
    padding: 0 16px !important;
    gap: 12px !important;
    width: 100% !important;
    
    /* Hide scrollbar but keep scroll functionality */
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
  }
  
  .jdgm-carousel__items::-webkit-scrollbar,
  .jdgm-carousel-items::-webkit-scrollbar {
    display: none !important;
  }
  
  /* ──────────────────────────────────────────────────────────────────────
     🎴 INDIVIDUAL CARDS - SWIPE-ABLE, VERTICAL CONTENT
     ────────────────────────────────────────────────────────────────────── */
  
  .jdgm-carousel__item,
  .jdgm-carousel-item {
    /* HORIZONTAL SCROLL BEHAVIOR */
    flex: 0 0 auto !important;
    width: calc(100vw - 48px) !important;
    min-width: calc(100vw - 48px) !important;
    max-width: 400px !important;
    scroll-snap-align: center !important;
    margin: 0 !important;
    padding: 20px !important;
    
    /* CARD CONTENT STAYS VERTICAL */
    display: flex !important;
    flex-direction: column !important;
    
    /* SHORTER HEIGHT FOR MOBILE */
    height: 520px !important;
    min-height: 520px !important;
    max-height: 520px !important;
  }
  
  /* ──────────────────────────────────────────────────────────────────────
     📐 MOBILE CARD CONTENT SIZING
     ────────────────────────────────────────────────────────────────────── */
  
  /* Smaller image */
  .jdgm-carousel__item-image-wrapper,
  .jdgm-carousel__item-image,
  .jdgm-carousel-item__image-wrapper,
  .jdgm-carousel-item__image {
    height: 180px !important;
    min-height: 180px !important;
    max-height: 180px !important;
    margin-bottom: 16px !important;
  }
  
  /* Smaller stars */
  .jdgm-carousel__item-rating,
  .jdgm-carousel-item__rating {
    height: 20px !important;
    min-height: 20px !important;
    max-height: 20px !important;
    margin-bottom: 10px !important;
  }
  
  .jdgm-carousel__item-rating .jdgm-star,
  .jdgm-carousel-item__rating .jdgm-star {
    font-size: 16px !important;
  }
  
  /* Smaller name */
  .jdgm-carousel__item-reviewer,
  .jdgm-carousel-item__reviewer {
    font-size: 14px !important;
    height: 20px !important;
    min-height: 20px !important;
    max-height: 20px !important;
    line-height: 20px !important;
    margin-bottom: 8px !important;
  }
  
  /* Smaller title */
  .jdgm-carousel__item-title,
  .jdgm-carousel-item__title {
    font-size: 16px !important;
    height: 40px !important;
    min-height: 40px !important;
    max-height: 40px !important;
    line-height: 20px !important;
    margin-bottom: 10px !important;
  }
  
  /* Shorter review body */
  .jdgm-carousel__item-body,
  .jdgm-carousel-item__body {
    font-size: 14px !important;
    line-height: 1.5 !important;
    height: 126px !important;
    min-height: 126px !important;
    max-height: 126px !important;
    -webkit-line-clamp: 6 !important;
    margin-bottom: 12px !important;
  }
  
  /* ──────────────────────────────────────────────────────────────────────
     ◀️ ▶️ MOBILE ARROWS
     ────────────────────────────────────────────────────────────────────── */
  
  .jdgm-carousel__arrow,
  .jdgm-carousel-wrapper__arrow {
    width: 40px !important;
    height: 40px !important;
    position: absolute !important;
    top: 45% !important;
    transform: translateY(-50%) !important;
    z-index: 10 !important;
  }
  
  .jdgm-carousel__arrow--prev,
  .jdgm-carousel-wrapper__arrow--prev {
    left: 8px !important;
  }
  
  .jdgm-carousel__arrow--next,
  .jdgm-carousel-wrapper__arrow--next {
    right: 8px !important;
  }
  
  /* ──────────────────────────────────────────────────────────────────────
     🔘 MOBILE BUTTON
     ────────────────────────────────────────────────────────────────────── */
  
  .jdgm-carousel__more-reviews,
  .jdgm-carousel-more-reviews-button {
    width: 100% !important;
    max-width: 320px !important;
    padding: 14px 32px !important;
    font-size: 14px !important;
    margin: 32px auto 0 !important;
    order: 999 !important;
  }
  
  /* ──────────────────────────────────────────────────────────────────────
     🎯 SLICK CAROUSEL OVERRIDES (if Judge.me uses Slick)
     ────────────────────────────────────────────────────────────────────── */
  
  .jdgm-carousel .slick-track {
    display: flex !important;
    flex-direction: row !important;
    gap: 12px !important;
  }
  
  .jdgm-carousel .slick-slide {
    float: none !important;
    display: flex !important;
    height: auto !important;
  }
  
  .jdgm-carousel .slick-list {
    overflow: visible !important;
    margin: 0 !important;
    padding: 0 !important;
  }
}

/* ══════════════════════════════════════════════════════════════════════════
   📱 EXTRA SMALL MOBILE (< 480px)
   ══════════════════════════════════════════════════════════════════════════ */

@media (max-width: 480px) {
  
  .jdgm-carousel__header {
    font-size: 24px !important;
    margin-bottom: 20px !important;
  }
  
  .jdgm-carousel__item,
  .jdgm-carousel-item {
    width: calc(100vw - 40px) !important;
    min-width: calc(100vw - 40px) !important;
    max-width: 350px !important;
    height: 480px !important;
    min-height: 480px !important;
    max-height: 480px !important;
    padding: 16px !important;
  }
  
  .jdgm-carousel__item-image-wrapper,
  .jdgm-carousel__item-image,
  .jdgm-carousel-item__image-wrapper,
  .jdgm-carousel-item__image {
    height: 160px !important;
    min-height: 160px !important;
    max-height: 160px !important;
  }
  
  .jdgm-carousel__item-body,
  .jdgm-carousel-item__body {
    font-size: 13px !important;
    height: 105px !important;
    min-height: 105px !important;
    max-height: 105px !important;
    -webkit-line-clamp: 5 !important;
  }
}

/* ══════════════════════════════════════════════════════════════════════════
   🎯 HIDE JUDGE.ME DEFAULT STYLES
   ══════════════════════════════════════════════════════════════════════════ */

.jdgm-carousel__item * {
  font-family: inherit !important;
}

/* Hide default Judge.me verified buyer badge if needed */
.jdgm-verified-badge {
  display: none !important;
}

/* ══════════════════════════════════════════════════════════════════════════
   🔧 NUCLEAR OPTION - USE IF CARDS STILL STACK ON MOBILE
   Remove the /* and */ around this section to activate
   ══════════════════════════════════════════════════════════════════════════ */

/*
@media (max-width: 768px) {
  
  .jdgm-carousel *[class*="carousel"]:not(.jdgm-carousel__header):not(.jdgm-carousel__item):not(.jdgm-carousel-item),
  .jdgm-carousel > div:not(.jdgm-carousel__header) {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
  }
  
  .jdgm-carousel__item,
  .jdgm-carousel-item,
  .jdgm-carousel > div > div[class*="item"] {
    flex: 0 0 calc(100vw - 48px) !important;
    max-width: 400px !important;
    display: flex !important;
    flex-direction: column !important;
  }
}
*/
/* ══════════════════════════════════════════════════════════════════════════
   📱 HIDE CAROUSEL ON MOBILE
   ══════════════════════════════════════════════════════════════════════════ */

@media (max-width: 768px) {
  .jdgm-carousel-wrapper,
  .jdgm-carousel,
  .jdgm-widget.jdgm-carousel-widget {
    display: none !important;
  }
}
/* ══════════════════════════════════════════════════════════════════════════
   ✅ END OF PEPPER PONG JUDGE.ME CAROUSEL CSS
   Version: 2.0 - Mobile Horizontal Fix
   Last Updated: 2025
   ══════════════════════════════════════════════════════════════════════════ */