/* Landing #9 - generat din Back Office (Flash Sales > Landing pages > CSS personalizat). Nu edita manual. */
/* CSS personalizat */
/* =====================================
   ROUA.RO - SPOOKY SALES
   PRODUCT CARDS DESIGN
===================================== */

/* 1. CARDURILE PRODUSELOR */

article.product_block {
  background: #191823 !important;
  border: 1px solid #30283D !important;
  border-radius: 5px !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.22);
  overflow: hidden;
  transition: transform 0.25s ease,
              box-shadow 0.25s ease;
}

article.product_block:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(0,0,0,0.30);
}

/* 2. FUNDALUL IMAGINILOR */

article.product_block :is(
  .product_image,
  .product-image,
  .product_img,
  .product-thumb
) {
  background: #FFFFFF !important;
  border-radius: 4px;
  overflow: hidden;
}

/* 3. TITLUL PRODUSELOR */

article.product_block :is(
  .product_name,
  .product-name,
  .product_title,
  .product-title
) {
  color: #F3F0FF !important;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.4;
  text-align: left;
  text-shadow: none;
}

/* 4. PRETUL REDUS */

article.product_block .price {
  color: #FF762E !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  letter-spacing: -0.2px;
  text-shadow: none !important;
  filter: none !important;
}

/* 5. PRETUL VECHI */

article.product_block :is(
  .old_price,
  .old-price,
  .regular-price
) {
  color: #A49CAD !important;
  font-size: 12px;
  font-weight: 400;
  text-decoration: line-through;
  text-shadow: none !important;
}

/* 6. ETICHETELE DE REDUCERE */

article.product_block :is(
  .discount,
  .discount-percentage,
  .reduction
) {
  background: #A32191 !important;
  color: #FFFFFF !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-size: 12px;
  font-weight: 600;
}

/* 7. BUTOANELE ADD TO CART */

article.product_block .product_button {
  position: static !important;
  display: flex !important;
  align-items: center;
  justify-content: center;

  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;

  transform: none !important;
  bottom: auto !important;

  background: #F47721 !important;
  color: #FFFFFF !important;
  border: 1px solid #F47721 !important;
  border-radius: 4px !important;

  min-height: 34px;
  padding: 6px 12px;

  font-size: 13px;
  font-weight: 600;
  line-height: 1.2;

  box-shadow: 0 2px 0 #AE4614;
  transition: background 0.2s ease,
              box-shadow 0.2s ease;
}

/* 8. HOVER BUTON */

article.product_block .product_button:hover {
  background: #51236E !important;
  border-color: #FF9B4A !important;
  color: #FFFFFF !important;

  transform: translateY(-1px) !important;

  box-shadow: 0 4px 10px
    rgba(0,0,0,0.25);
}

/* 9. EFECT DE APASARE */

article.product_block .product_button:active {
  transform: translateY(1px) !important;
  box-shadow: 0 1px 0 #AE4614;
}

/* 10. ICONITELE BUTONULUI */

article.product_block .product_button i,
article.product_block .product_button svg {
  color: #FFFFFF !important;
  font-size: 15px;
  margin-right: 5px;
}

/* 11. ACCESIBILITATE */

article.product_block .product_button:focus-visible {
  outline: 2px solid #FFB16B;
  outline-offset: 2px;
}

/* 12. REDUCEREA ANIMATIILOR */

@media (prefers-reduced-motion: reduce) {
  article.product_block,
  article.product_block .product_button {
    transition: none !important;
  }
}
/* ZONA DE IMAGINE DIN CARD */
article.product_block :is(
  .product_image,
  .product-image,
  .product_img,
  .product-thumb
) {
  background: linear-gradient(180deg, #fbfaff 0%, #f2eef9 100%) !important;
  min-height: 250px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 18px 18px 12px 18px;
  position: relative;
  overflow: hidden;
  border-bottom: 1px solid rgba(38, 27, 60, 0.08);
}

/* glow foarte discret in spatele produsului */
article.product_block :is(
  .product_image,
  .product-image,
  .product_img,
  .product-thumb
)::before {
  content: "";
  position: absolute;
  width: 180px;
  height: 180px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(120, 78, 170, 0.10) 0%, rgba(120, 78, 170, 0.00) 70%);
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
}

/* imaginea produsului sa stea bine in centru */
article.product_block :is(
  .product_image img,
  .product-image img,
  .product_img img,
  .product-thumb img
) {
  max-width: 100%;
  max-height: 185px;
  width: auto;
  height: auto;
  object-fit: contain;
  display: block;
  margin: 0 auto;
  position: relative;
  z-index: 2;
}

/* SPOOKY SALES - FUNDAL ZONA PRODUSE */

body.flash-sales .products {
  background: #151321 !important;
  border: 1px solid #302544;
  border-radius: 6px;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.25);
}

/* Spatiile dintre carduri */

body.flash-sales .products > .row {
  background: transparent !important;
}

/* Cardurile raman inchise la culoare */

body.flash-sales article.product_block {
  background: #191823 !important;
}