/** Shopify CDN: Minification failed

Line 213:4 Unexpected "{"
Line 213:5 Expected identifier but found "%"
Line 215:4 Unexpected "{"
Line 215:5 Expected identifier but found "%"
Line 217:4 Unexpected "{"
Line 217:5 Expected identifier but found "%"
Line 235:4 Unexpected "{"
Line 235:5 Expected identifier but found "%"
Line 237:4 Unexpected "{"
Line 237:5 Expected identifier but found "%"

**/
/** Shopify CDN: Minification failed

Line 199:4 Unexpected "{"
Line 199:5 Expected identifier but found "%"
Line 201:4 Unexpected "{"
Line 201:5 Expected identifier but found "%"
Line 203:4 Unexpected "{"
Line 203:5 Expected identifier but found "%"
Line 221:4 Unexpected "{"
Line 221:5 Expected identifier but found "%"
Line 223:4 Unexpected "{"
Line 223:5 Expected identifier but found "%"

**/
/** Shopify CDN: Minification failed

Line 185:4 Unexpected "{"
Line 185:5 Expected identifier but found "%"
Line 187:4 Unexpected "{"
Line 187:5 Expected identifier but found "%"
Line 189:4 Unexpected "{"
Line 189:5 Expected identifier but found "%"
Line 207:4 Unexpected "{"
Line 207:5 Expected identifier but found "%"
Line 209:4 Unexpected "{"
Line 209:5 Expected identifier but found "%"

**/
/** Shopify CDN: Minification failed

Line 171:4 Unexpected "{"
Line 171:5 Expected identifier but found "%"
Line 173:4 Unexpected "{"
Line 173:5 Expected identifier but found "%"
Line 175:4 Unexpected "{"
Line 175:5 Expected identifier but found "%"
Line 193:4 Unexpected "{"
Line 193:5 Expected identifier but found "%"
Line 195:4 Unexpected "{"
Line 195:5 Expected identifier but found "%"

**/
.custom-product-reel {
  background-color: #0F0F1C;
  padding: 40px 20px;
  text-align: center;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.section-title {
  color: #fff;
  font-size: 2.5rem;
  font-weight: bold;
  margin-bottom: 40px;
  text-transform: uppercase;
  text-align: center;
}

.product-grid {
  display: flex;
  justify-content: center;
  gap: 20px;
  flex-wrap: wrap;
}

.product-card {
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  width: 300px;
  padding: 20px;
  text-align: center;
  text-decoration: none;
  color: inherit;
  transition: transform 0.3s ease;
  display: flex;
  flex-direction: column;
  height: 520px;
}

.product-card:hover {
  transform: scale(1.05);
}

.product-image-wrapper {
  height: 260px; /* 50% of 520px to ensure the image takes the top half */
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 0; /* Remove margin to align with the bottom half */
}

.product-image {
  max-width: 100%;
  max-height: 100%;
  height: auto;
}

.product-info {
  color: #fff;
  display: flex;
  flex-direction: column;
  height: 260px; /* Bottom half of the card */
  justify-content: center; /* Center content vertically in the bottom half */
}

.product-title {
  font-size: 1.5rem;
  font-weight: bold;
  margin: 0;
  padding: 10px 15px; /* Reduced padding for tighter spacing */
  text-align: center;
  line-height: 1.2;
  box-sizing: border-box;
  padding-top: 0px;
  font-family: "Apercu Mono" !important;
}

.product-details {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px; /* Adjusted gap for tighter spacing */
}

.product-price {
  font-size: 1.2rem;
  margin: 0;
  font-family: "Apercu Mono" !important;
}

.product-reviews {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin: 0;
  display: none;
  font-family: "Apercu Mono" !important;
}

.review-icon {
  height: auto;
  object-fit: contain;
}

.review-text {
  color: #fff;
  font-size: 0.9rem;
}

.add-to-cart-form {
  margin: 0;
}

.add-to-cart-btn-cpr {
  background-color: #6a00ff;
  color: #fff;
  border: none;
  padding: 10px 20px;
  border-radius: 25px;
  font-size: 1rem;
  cursor: pointer;
  transition: background-color 0.3s ease;
  width: 140px;
  white-space: nowrap;
  font-weight: bold;
}

.add-to-cart-btn-cpr:hover {
  background-color: #4b00b3;
}

.shop-all-btn {
  display: inline-block;
  margin-top: 40px;
  margin-left: auto;
  margin-right: auto;
  background-color: #6a00ff;
  color: #fff;
  padding: 15px 30px;
  border-radius: 25px;
  text-decoration: none;
  font-size: 1.2rem;
  text-transform: uppercase;
  transition: background-color 0.3s ease;
  font-weight: bold;
}

.shop-all-btn:hover {
  background-color: #4b00b3;
}

/* Mobile adjustments */
@media (max-width: 768px) {
  .custom-product-reel {
    {% if section.settings.background_image_mobile %}
      background-image: url('{{ section.settings.background_image_mobile | img_url: 'master' }}');
    {% else %}
      background-image: url('{{ section.settings.background_image_desktop | img_url: 'master' }}');
    {% endif %}
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
  }

  .product-title {
    font-size: 1.1rem; /* Reduced font size to prevent overflow */
    padding: 8px 5px; /* Slightly reduced padding */
    max-height: 60px; /* Constrain height to prevent overflow */
    overflow: hidden; /* Hide overflow if title is too long */
    line-height: 1.2;
  }

  .product-card {
    width: 100%;
    max-width: 300px;
    height: 480px;
    {% if section.settings.show_card_background %}
      background-image: url('{{ section.settings.background_image_mobile | img_url: 'master' }}');
    {% endif %}
  }

  .product-image-wrapper {
    height: 240px; /* 50% of 480px for mobile */
  }

  .product-info {
    height: 240px; /* Bottom half for mobile */
  }

  .add-to-cart-btn-cpr {
    width: 120px;
  }
}