/* ==========================================================
   PRESTASHOP CUSTOM DESIGN
   Style: Metro UI + Premium Beauty
   Safe addon: add AFTER theme.css / theme_rtl.css
   Author: Suren Nikoghosyan
   ========================================================== */

:root{
  --mpb-black:#111111;
  --mpb-dark:#1c1c1c;
  --mpb-gray:#f4f4f4;
  --mpb-line:#e7e2e8;
  --mpb-purple:#8b009b;
  --mpb-purple-dark:#5f006f;
  --mpb-pink:#f8edf8;
  --mpb-gold:#c9a24a;
  --mpb-green:#00b86b;
}

/* ---------- GENERAL BEAUTY FEEL ---------- */
body{
  background:#fff !important;
  color:var(--mpb-black) !important;
}

a:hover{
  color:var(--mpb-purple) !important;
}

/* ---------- CATEGORY / PAGE TITLE ---------- */
#js-product-list-header h1,
.page-title,
.h1,
h1{
  font-weight:900 !important;
  letter-spacing:-.03em !important;
  color:var(--mpb-black) !important;
}

.block-category,
.card,
.product-cover,
.product-information{
  border-radius:0 !important;
}

/* ---------- METRO CATEGORY TILES ---------- */
.subcategories-list,
#subcategories ul,
.category-sub-menu{
  gap:10px !important;
}

#subcategories ul li,
.subcategories-list li{
  border:1px solid var(--mpb-line) !important;
  background:#fff !important;
  border-radius:0 !important;
  overflow:hidden !important;
  transition:all .22s ease !important;
}

#subcategories ul li:hover,
.subcategories-list li:hover{
  border-color:var(--mpb-purple) !important;
  background:var(--mpb-black) !important;
  transform:translateY(-2px) !important;
}

#subcategories ul li:hover a,
.subcategories-list li:hover a{
  color:#fff !important;
}

/* ---------- PRODUCT GRID SAFE ---------- */
.products .product-miniature,
.product-miniature{
  margin-bottom:22px !important;
}

.products .product-miniature .thumbnail-container,
.product-miniature .thumbnail-container{
  position:relative !important;
  background:#fff !important;
  border:1px solid var(--mpb-line) !important;
  border-radius:0 !important;
  overflow:hidden !important;
  box-shadow:none !important;
  transition:border-color .25s ease, transform .25s ease, box-shadow .25s ease !important;
  height:100% !important;
}

.products .product-miniature .thumbnail-container:before,
.product-miniature .thumbnail-container:before{
  content:"" !important;
  position:absolute !important;
  top:0 !important;
  left:0 !important;
  width:0 !important;
  height:4px !important;
  background:linear-gradient(90deg,var(--mpb-purple),var(--mpb-gold)) !important;
  transition:width .28s ease !important;
  z-index:5 !important;
}

.products .product-miniature:hover .thumbnail-container,
.product-miniature:hover .thumbnail-container{
  border-color:var(--mpb-purple) !important;
  transform:translateY(-4px) !important;
  box-shadow:0 18px 45px rgba(17,17,17,.10) !important;
}

.products .product-miniature:hover .thumbnail-container:before,
.product-miniature:hover .thumbnail-container:before{
  width:100% !important;
}

/* ---------- BIG CLEAN IMAGE ---------- */
.products .product-thumbnail,
.product-miniature .product-thumbnail{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  height:255px !important;
  margin:0 !important;
  padding:0 !important;
     background: linear-gradient(135deg, #fff 0%, #ffffff 100%) !important;
  overflow:hidden !important;
}

.products .product-thumbnail img,
.product-miniature .product-thumbnail img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center center !important;
  padding:0 !important;
  margin:0 !important;
  transform:scale(1.01) !important;
  transition:transform .45s ease, filter .3s ease !important;
}

.products .product-miniature:hover .product-thumbnail img,
.product-miniature:hover .product-thumbnail img{
  transform:scale(1.08) !important;
  filter:contrast(1.03) saturate(1.04) !important;
}

/* ---------- PRODUCT DESCRIPTION ---------- */
.products .product-description,
.product-miniature .product-description{
  position:relative !important;
  background:#fff !important;
  padding:15px 14px 14px !important;
  min-height:150px !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:flex-start !important;
}

.products .product-title,
.product-miniature .product-title{
  min-height:42px !important;
  margin:0 0 8px !important;
  text-align:left !important;
}

.products .product-title a,
.product-miniature .product-title a{
  color:var(--mpb-black) !important;
  font-size:12px !important;
  line-height:1.32 !important;
  font-weight:800 !important;
  letter-spacing:.01em !important;
  text-transform:uppercase !important;
}

.products .product-title a:hover,
.product-miniature .product-title a:hover{
  color:var(--mpb-purple) !important;
}

.products .product-price-and-shipping,
.product-miniature .product-price-and-shipping{
  margin-top:auto !important;
  margin-bottom:10px !important;
  text-align:left !important;
}

.products .price,
.product-miniature .price,
.product-price{
  color:var(--mpb-purple) !important;
  font-size:21px !important;
  line-height:1 !important;
  font-weight:900 !important;
  letter-spacing:-.02em !important;
}

.products .regular-price,
.product-miniature .regular-price{
  color:#999 !important;
  font-size:13px !important;
  font-weight:600 !important;
}

/* ---------- PREMIUM METRO BUTTONS ---------- */
.products .product-miniature .add-to-cart,
.products .product-miniature .btn-primary,
.product-miniature .add-to-cart,
.product-miniature .btn-primary,
.product-actions .add-to-cart,
.btn-primary{
  background:var(--mpb-black) !important;
  color:#fff !important;
  border:1px solid var(--mpb-black) !important;
  border-radius:0 !important;
  min-height:44px !important;
  padding:11px 14px !important;
  font-size:12px !important;
  font-weight:900 !important;
  letter-spacing:.06em !important;
  text-transform:uppercase !important;
  box-shadow:inset 0 -3px 0 var(--mpb-purple) !important;
  transition:all .22s ease !important;
}

.products .product-miniature .add-to-cart:hover,
.products .product-miniature .btn-primary:hover,
.product-miniature .add-to-cart:hover,
.product-miniature .btn-primary:hover,
.product-actions .add-to-cart:hover,
.btn-primary:hover{
  background:var(--mpb-purple) !important;
  border-color:var(--mpb-purple) !important;
  color:#fff !important;
  box-shadow:inset 0 -3px 0 var(--mpb-gold),0 12px 24px rgba(139,0,155,.22) !important;
  transform:translateY(-2px) !important;
}

.products .product-miniature .add-to-cart,
.product-miniature .add-to-cart{
  width:100% !important;
}

/* ---------- FLAGS / BADGES ---------- */
.products .product-flags,
.product-miniature .product-flags{
  top:10px !important;
  left:10px !important;
  right:auto !important;
  z-index:10 !important;
}

.products .product-flags li.product-flag,
.product-miniature .product-flags li.product-flag,
.product-flag{
  background:var(--mpb-green) !important;
  color:#fff !important;
  border-radius:0 !important;
  padding:6px 10px !important;
  font-size:10px !important;
  font-weight:900 !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
  box-shadow:none !important;
}

.products .product-flags li.discount,
.product-miniature .product-flags li.discount{
  background:var(--mpb-purple) !important;
}

/* ---------- QUICK VIEW / HOVER INFO CLEAN ---------- */
.products .highlighted-informations,
.product-miniature .highlighted-informations{
  background:rgba(17,17,17,.86) !important;
  color:#fff !important;
  border-radius:0 !important;
}

.products .highlighted-informations a,
.product-miniature .highlighted-informations a{
  color:#fff !important;
  font-weight:800 !important;
  text-transform:uppercase !important;
  font-size:12px !important;
}

/* ---------- FILTERS / SORT ---------- */
.products-sort-order .select-title,
.facet,
#search_filters,
#js-active-search-filters{
  border:1px solid var(--mpb-line) !important;
  border-radius:0 !important;
  background:#fff !important;
}

#search_filters .facet-title,
.products-sort-order .select-title{
  color:var(--mpb-black) !important;
  font-weight:900 !important;
  text-transform:uppercase !important;
  letter-spacing:.03em !important;
}

/* ---------- PRODUCT PAGE ---------- */
.product-prices .current-price span,
.current-price-value{
  color:var(--mpb-purple) !important;
  font-weight:900 !important;
}

.product-quantity .add-to-cart{
  background:var(--mpb-black) !important;
  border-color:var(--mpb-black) !important;
  border-radius:0 !important;
  box-shadow:inset 0 -4px 0 var(--mpb-purple) !important;
}

.product-quantity .add-to-cart:hover{
  background:var(--mpb-purple) !important;
  border-color:var(--mpb-purple) !important;
  box-shadow:inset 0 -4px 0 var(--mpb-gold) !important;
}

/* ---------- MOBILE SAFE: DO NOT CHANGE BOOTSTRAP GRID ---------- */
@media (max-width: 767px){
  .products .product-miniature,
  .product-miniature{
    margin-bottom:14px !important;
  }

  .products .product-miniature .thumbnail-container,
  .product-miniature .thumbnail-container{
    border-color:#eee !important;
    transform:none !important;
  }

  .products .product-thumbnail,
  .product-miniature .product-thumbnail{
    height:165px !important;
  }

  .products .product-description,
  .product-miniature .product-description{
    padding:10px 9px !important;
    min-height:126px !important;
  }

  .products .product-title,
  .product-miniature .product-title{
    min-height:36px !important;
    margin-bottom:6px !important;
  }

  .products .product-title a,
  .product-miniature .product-title a{
    font-size:10.5px !important;
    line-height:1.25 !important;
    letter-spacing:.02em !important;
  }

  .products .price,
  .product-miniature .price{
    font-size:16px !important;
  }

  .products .product-miniature .add-to-cart,
  .products .product-miniature .btn-primary,
  .product-miniature .add-to-cart,
  .product-miniature .btn-primary{
    min-height:38px !important;
    padding:8px 6px !important;
    font-size:10px !important;
    letter-spacing:.04em !important;
  }

  .products .product-flags li.product-flag,
  .product-miniature .product-flags li.product-flag{
    font-size:9px !important;
    padding:5px 7px !important;
  }
}

@media (min-width:768px) and (max-width:1199px){
  .products .product-thumbnail,
  .product-miniature .product-thumbnail{
    height:220px !important;
  }
}

/* ---------- RTL SUPPORT ---------- */
html[dir="rtl"] .products .product-title,
html[dir="rtl"] .product-miniature .product-title,
html[dir="rtl"] .products .product-price-and-shipping,
html[dir="rtl"] .product-miniature .product-price-and-shipping{
  text-align:right !important;
}

html[dir="rtl"] .products .product-flags,
html[dir="rtl"] .product-miniature .product-flags{
  right:10px !important;
  left:auto !important;
}