/* ============================================
   PRODUCT MINIATURE STYLES
   ============================================ */

/* CSS Custom Properties for easy theming */
:root {
  --pm-border-color: #c9c9c9;
  --pm-text-color: #000;
  --pm-quick-view-bg: #6e774d;
  --pm-quick-view-bg-hover: #929e69;
  --pm-add-to-cart-bg: #6e432b;
  --pm-add-to-cart-bg-hover: #b88e70;
  --pm-wishlist-color: #cda382;
  --pm-wishlist-color-hover: #b88e70;
  --pm-border-radius: 5px;
  --pm-button-size: 2.5rem;
  --pm-button-size-mobile: 3rem;
  --pm-font-size-title: 21px;
  --pm-line-height-title: 1.2;
  --pm-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  --pm-transition-fast: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  --pm-transform-offset: 50px;
  --pm-transform-offset-mobile: 2rem;
  --pm-spacing-title: 18px;
  --pm-focus-color: var(--pm-wishlist-color);
}

/* ============================================
   PRODUCT IMAGE STYLING
   ============================================ */
.product-miniature .thumbnail-container .product-thumbnail {
  border: 1px solid var(--pm-border-color) !important;
  border-radius: var(--pm-border-radius) !important;
  margin: 0 !important;
  display: block !important;
  object-fit: cover !important;
  width: 100%;
  aspect-ratio: 1/1;
  overflow: hidden;
}

.product-miniature .thumbnail-container .product-thumbnail * {
  width: 100%;
  height: 100%;
}

/* ============================================
   PRODUCT TITLE STYLING
   ============================================ */

.product-miniature .product-title a {
  font-size: var(--pm-font-size-title) !important;
  font-weight: 700 !important;
  line-height: var(--pm-line-height-title) !important;
  color: var(--pm-text-color) !important;
  text-decoration: none !important;
  text-align: left !important;
}

/* ============================================
   WISHLIST BUTTON STYLING
   ============================================ */

.wishlist-button-add {
  border: 1px solid rgba(201, 201, 201, 1) !important;
  box-shadow: none !important;
  background: white !important;
  background-image: url("data:image/svg+xml,%0A%3Csvg width='26' height='26' viewBox='0 0 26 26' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M23.8332 9.41417C23.8332 10.7033 23.6273 11.895 23.2698 13H2.72984C2.37234 11.895 2.1665 10.7033 2.1665 9.41417C2.1665 6.06667 4.864 3.35834 8.18984 3.35834C10.1507 3.35834 11.9057 4.31167 12.9998 5.77417C14.094 4.31167 15.849 3.35834 17.8098 3.35834C21.1357 3.35834 23.8332 6.06667 23.8332 9.41417Z' fill='%23C9C9C9'/%3E%3Cpath d='M23.27 13C21.5583 18.4167 16.2825 21.6558 13.6716 22.5442C13.3033 22.6742 12.6966 22.6742 12.3283 22.5442C9.71748 21.6558 4.44165 18.4167 2.72998 13H23.27Z' fill='%23C9C9C9'/%3E%3C/svg%3E%0A") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 20px 20px !important;
  transition: var(--pm-transition) !important;
  width: 40px !important;
  height: 40px !important;
}

.wishlist-button-add i {
  display: none !important;
}

/* Wishlist button hover and focus states */
.wishlist-button-add:hover,
.wishlist-button-add:focus {
  background: var(--pm-wishlist-color) !important;
  background-image: url("data:image/svg+xml,%0A%3Csvg width='26' height='26' viewBox='0 0 26 26' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M23.8332 9.41417C23.8332 10.7033 23.6273 11.895 23.2698 13H2.72984C2.37234 11.895 2.1665 10.7033 2.1665 9.41417C2.1665 6.06667 4.864 3.35834 8.18984 3.35834C10.1507 3.35834 11.9057 4.31167 12.9998 5.77417C14.094 4.31167 15.849 3.35834 17.8098 3.35834C21.1357 3.35834 23.8332 6.06667 23.8332 9.41417Z' fill='white'/%3E%3Cpath d='M23.27 13C21.5583 18.4167 16.2825 21.6558 13.6716 22.5442C13.3033 22.6742 12.6966 22.6742 12.3283 22.5442C9.71748 21.6558 4.44165 18.4167 2.72998 13H23.27Z' fill='white'/%3E%3C/svg%3E%0A") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 20px 20px !important;
  border-color: var(--pm-wishlist-color) !important;
  opacity: 1 !important;
  transform: scale(1.05) !important;
}

.wishlist-button-add:hover i,
.wishlist-button-add:focus i {
  display: none !important;
}

.wishlist-button-add:focus {
  outline: 2px solid var(--pm-focus-color) !important;
  outline-offset: 2px !important;
}

/* ============================================
   LAYOUT AND GENERAL STYLING
   ============================================ */

article.product-miniature {
  width: 100%;
}

.product-miniature .thumbnail-container {
  width: 100%;
  background: transparent !important;
}

/* Hide category rating stars */
.categoryStarsStr {
  display: none !important;
}

/* Text alignment for product information */
.product-miniature .product-title {
  text-align: left !important;
  margin-top: var(--pm-spacing-title) !important;
}

.product-miniature .product-price-and-shipping {
  text-align: left !important;
}

/* ============================================
   QUICK BUY BUTTON STYLING
   ============================================ */

button.btn.btn-primary.btn-sm.quick-buy {
  text-indent: -9999px !important; /* hides text for screen readers compatibility */
  overflow: hidden !important;
  white-space: nowrap !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: var(--pm-button-size) !important;
  width: var(--pm-button-size) !important;
  min-width: var(--pm-button-size) !important;
  padding: 0.1875rem !important;
  border-radius: 50% !important;
  cursor: pointer !important;
  border: none !important;
  background: var(--pm-add-to-cart-bg) !important;
  transition: var(--pm-transition) !important;
  font-size: 0px !important;
}

button.btn.btn-primary.btn-sm.quick-buy i.material-icons {
  text-indent: 0 !important; /* reset text-indent for icon */
  margin: 0 !important;
  font-size: 1.25rem !important;
  line-height: 1 !important;
}

/* Quick buy button hover and focus states */
button.btn.btn-primary.btn-sm.quick-buy:hover {
  background-color: var(--pm-add-to-cart-bg-hover) !important;
  transform: scale(1.05) !important;
}

button.btn.btn-primary.btn-sm.quick-buy:focus {
  outline: 2px solid var(--pm-focus-color) !important;
  outline-offset: 2px !important;
}

/* ============================================
   QUICK VIEW BUTTON STYLING
   ============================================ */

.product-miniature .highlighted-informations .quick-view {
  font-size: 0 !important; /* hides text for screen readers compatibility */
  overflow: hidden !important;
  white-space: nowrap !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: var(--pm-button-size) !important;
  width: var(--pm-button-size) !important;
  min-width: var(--pm-button-size) !important;
  padding: 0.1875rem !important;
  border-radius: 50% !important;
  cursor: pointer !important;
  border: none !important;
  background: var(--pm-quick-view-bg) !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26px' height='26px' viewBox='0 0 24 24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M6.30147 15.5771C4.77832 14.2684 3.6904 12.7726 3.18002 12C3.6904 11.2274 4.77832 9.73158 6.30147 8.42294C7.87402 7.07185 9.81574 6 12 6C14.1843 6 16.1261 7.07185 17.6986 8.42294C19.2218 9.73158 20.3097 11.2274 20.8201 12C20.3097 12.7726 19.2218 14.2684 17.6986 15.5771C16.1261 16.9282 14.1843 18 12 18C9.81574 18 7.87402 16.9282 6.30147 15.5771ZM12 4C9.14754 4 6.75717 5.39462 4.99812 6.90595C3.23268 8.42276 2.00757 10.1376 1.46387 10.9698C1.05306 11.5985 1.05306 12.4015 1.46387 13.0302C2.00757 13.8624 3.23268 15.5772 4.99812 17.0941C6.75717 18.6054 9.14754 20 12 20C14.8525 20 17.2429 18.6054 19.002 17.0941C20.7674 15.5772 21.9925 13.8624 22.5362 13.0302C22.947 12.4015 22.947 11.5985 22.5362 10.9698C21.9925 10.1376 20.7674 8.42276 19.002 6.90595C17.2429 5.39462 14.8525 4 12 4ZM10 12C10 10.8954 10.8955 10 12 10C13.1046 10 14 10.8954 14 12C14 13.1046 13.1046 14 12 14C10.8955 14 10 13.1046 10 12ZM12 8C9.7909 8 8.00004 9.79086 8.00004 12C8.00004 14.2091 9.7909 16 12 16C14.2092 16 16 14.2091 16 12C16 9.79086 14.2092 8 12 8Z' fill='%23ffffff'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 20px 20px !important;
  transition: var(--pm-transition) !important;
  color: white !important;
}

/* Quick view button hover and focus states */
.product-miniature .highlighted-informations .quick-view:hover {
  background: var(--pm-quick-view-bg-hover) !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26px' height='26px' viewBox='0 0 24 24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M6.30147 15.5771C4.77832 14.2684 3.6904 12.7726 3.18002 12C3.6904 11.2274 4.77832 9.73158 6.30147 8.42294C7.87402 7.07185 9.81574 6 12 6C14.1843 6 16.1261 7.07185 17.6986 8.42294C19.2218 9.73158 20.3097 11.2274 20.8201 12C20.3097 12.7726 19.2218 14.2684 17.6986 15.5771C16.1261 16.9282 14.1843 18 12 18C9.81574 18 7.87402 16.9282 6.30147 15.5771ZM12 4C9.14754 4 6.75717 5.39462 4.99812 6.90595C3.23268 8.42276 2.00757 10.1376 1.46387 10.9698C1.05306 11.5985 1.05306 12.4015 1.46387 13.0302C2.00757 13.8624 3.23268 15.5772 4.99812 17.0941C6.75717 18.6054 9.14754 20 12 20C14.8525 20 17.2429 18.6054 19.002 17.0941C20.7674 15.5772 21.9925 13.8624 22.5362 13.0302C22.947 12.4015 22.947 11.5985 22.5362 10.9698C21.9925 10.1376 20.7674 8.42276 19.002 6.90595C17.2429 5.39462 14.8525 4 12 4ZM10 12C10 10.8954 10.8955 10 12 10C13.1046 10 14 10.8954 14 12C14 13.1046 13.1046 14 12 14C10.8955 14 10 13.1046 10 12ZM12 8C9.7909 8 8.00004 9.79086 8.00004 12C8.00004 14.2091 9.7909 16 12 16C14.2092 16 16 14.2091 16 12C16 9.79086 14.2092 8 12 8Z' fill='%23ffffff'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 20px 20px !important;
  transform: scale(1.05) !important;
}

.product-miniature .highlighted-informations .quick-view:focus {
  outline: 2px solid var(--pm-focus-color) !important;
  outline-offset: 2px !important;
}

.product-miniature
  .highlighted-informations
  .quick-view
  i.material-icons.search {
  display: none;
}

/* ============================================
   BUTTON POSITIONING AND LAYOUT
   ============================================ */

/* Quick view container positioning */
.product-miniature .highlighted-informations {
  position: absolute !important;
  display: flex !important;
  background: transparent !important;
  width: fit-content !important;
  height: fit-content !important;
  padding: 0 !important;
  transform: translateX(calc(-1 * (var(--pm-button-size) + 5px))) !important;
  z-index: 2 !important;
}

/* Add-to-cart form button positioning */
.thumbnail-top form.add-to-cart-form {
  width: fit-content !important;
  height: fit-content !important;
  display: flex !important;
  position: absolute !important;
  z-index: 1 !important;
  transform: translateX(calc(-2 * (var(--pm-button-size) + 5px))) !important;
}

/* Common positioning for all overlay buttons - moved to bottom right */
form.add-to-cart-form,
.product-miniature .highlighted-informations,
.wishlist-button-add {
  bottom: -17px !important;
  right: 10px !important;
  top: auto !important;
  left: auto !important;
  margin: 0 !important;
}

/* Wishlist button offset positioning */
.wishlist-button-add {
  transform: none !important;
  position: absolute;
}

/* ============================================
   ADDITIONAL LAYOUT ADJUSTMENTS
   ============================================ */

/* Hide variant color/size selection links */
.product-miniature .variant-links {
  display: none !important;
}

/* Allow button overlays to be visible outside thumbnail bounds */
.product-miniature .thumbnail-top {
  overflow: visible !important;
}

/* Clean background for product description area */
.product-miniature .product-description {
  background: transparent !important;
}

/* Products Tags */

.product-flags li.product-flag {
  margin-left: 5px !important;
  font-size: 12px !important;
  border-radius: 5px !important;
  line-height: normal !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-transform: capitalize !important;
}

.has-discount .discount {
  margin-left: 5px !important;
  font-size: 12px !important;
  border-radius: 5px !important;
  line-height: normal !important;
  text-transform: capitalize !important;
}

.product-flags li.product-flag.new,
.new {
  background: #8faa4b;
}

.product-flags li.product-flag.discount,
.discount {
  background: #c86a3c !important;
}

.product-flags li.product-flag.out_of_stock,
.out_of_stock {
  background: #7c7568;
}

.product-flags li.product-flag.pack,
.pack {
  background: #a37845;
}

.hide-price .wrap-prices {
  display: none !important;
}

.hide-price div#categoryStarsMain {
  right: inherit;
  bottom: 0.2rem;
}

.btn-primary.disabled:hover,
.btn-primary:disabled:hover {
  background-color: #8e8e8e;
}

/* Hide the <i> icon by zeroing its font-size */
button.btn.btn-primary.btn-sm.quick-buy > i.material-icons {
  font-size: 0px !important;
  width: 0 !important;
  height: 0 !important;
  line-height: 0 !important;
  overflow: hidden !important;
}

/* Put the SVG as the button background (white fill), centered, no-repeat */
button.btn.btn-primary.btn-sm.quick-buy {
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%20122.88%20104.43%22%3E%3Cpath%20fill%3D%22%23fff%22%20fill-rule%3D%22evenodd%22%20d%3D%22M97%2C0A25.9%2C25.9%2C0%2C1%2C1%2C78.67%2C7.59%2C25.79%2C25.79%2C0%2C0%2C1%2C97%2C0ZM3.66%2C10.89a3.71%2C3.71%2C0%2C0%2C1%2C0-7.42H9.11A17.3%2C17.3%2C0%2C0%2C1%2C18%2C5.81c4.92%2C3.12%2C5.79%2C7.57%2C7%2C12.59H66.7a31%2C31%2C0%2C0%2C0-.9%2C7.33H27.14L35.5%2C57.19H94.77l0-.18c.72.05%2C1.44.08%2C2.17.08a31.59%2C31.59%2C0%2C0%2C0%2C5.46-.48l-1.29%2C5.18a3.62%2C3.62%2C0%2C0%2C1-3.57%2C2.82H37.47c1.32%2C4.88%2C2.63%2C7.51%2C4.42%2C8.74%2C2.16%2C1.4%2C5.92%2C1.5%2C12.21%2C1.4H96.64a3.67%2C3.67%2C0%2C1%2C1%2C0%2C7.33H54.19c-7.79.09-12.58-.09-16.44-2.63s-6-7.14-8.07-15.31h0L17.09%2C16.52c0-.09%2C0-.09-.09-.19A6.51%2C6.51%2C0%2C0%2C0%2C14.18%2C12.11%2C9.51%2C9.51%2C0%2C0%2C0%2C9%2C10.89H3.66ZM60.87%2C33.47a2.6%2C2.6%2C0%2C0%2C1%2C5.11%2C0V47.63a2.6%2C2.6%2C0%2C0%2C1-5.11%2C0V33.47Zm-15.3%2C0a2.6%2C2.6%2C0%2C0%2C1%2C5.11%2C0V47.63a2.6%2C2.6%2C0%2C0%2C1-5.11%2C0V33.47ZM85.66%2C86.4a9%2C9%2C0%2C1%2C1-9%2C9%2C9%2C9%2C0%2C0%2C1%2C9-9Zm-39.55%2C0a9%2C9%2C0%2C1%2C1-9%2C9%2C9%2C9%2C0%2C0%2C1%2C9-9Zm64.08-62.91V28.3a2.09%2C2.09%2C0%2C0%2C1-2.07%2C2.07h-6.66V37a2.08%2C2.08%2C0%2C0%2C1-2.07%2C2.07H94.58A2.07%2C2.07%2C0%2C0%2C1%2C92.51%2C37V30.37H85.85a2.08%2C2.08%2C0%2C0%2C1-2.07-2.07V23.49a2.07%2C2.07%2C0%2C0%2C1%2C2.07-2.07h6.66V14.76a2.07%2C2.07%2C0%2C0%2C1%2C2.07-2.07h4.81a2.08%2C2.08%2C0%2C0%2C1%2C2.07%2C2.07v6.66h6.66a2.08%2C2.08%2C0%2C0%2C1%2C2.07%2C2.07Z%22/%3E%3C/svg%3E") !important;

  background-repeat: no-repeat !important;
  background-position: 10px center !important;
  background-size: 16px 16px !important;
  padding-left: 34px !important;
}

/* Optional: remove any left padding/margin the <i> might still reserve */
button.btn.btn-primary.btn-sm.quick-buy > i.material-icons {
  margin: 0 !important;
  padding: 0 !important;
}
