/* Maiori — listing quick-view (maiori_butons)
 * Fancybox chrome/close live in js/jquery/plugins/fancybox/jquery.fancybox.css (global).
 * Circle 46px top-right (10px inset); icon ~20px (scaled from 35/80); white 0.6; desktop zoom ease (not left-slide).
 * Overlay must NOT steal clicks — pointer-events only on a.quick-view.
 * Icons stay tpl-driven: fa-cart-plus (sale) / fa-search (catalog / not_sale).
 * Cache-busted via header.tpl ?v=…
 */

.product_list .product-block .left-block {
  position: relative;
}

/* Design only (DEV): top-right circle anchor.
 * Visibility parity with PROD (≥601px hover show/hide; <601px always on),
 * but appear motion = scale zoom + ease (NOT PROD left:100%→0 slide). */
.product_list .product-block .box-buttons {
  position: absolute !important;
  top: 10px !important;
  right: 10px !important;
  bottom: auto !important;
  left: auto !important; /* kill PROD responsive.css left:100% / hover left:0 */
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  z-index: 5;
  /* Always none on the wrapper so the image link stays clickable */
  pointer-events: none !important;
  -webkit-transform-origin: center center;
  transform-origin: center center;
  /* Do NOT use transition:all — that re-enables the PROD left slide */
  -webkit-transition: visibility 0.35s ease, opacity 0.35s ease, -webkit-transform 0.35s ease !important;
  transition: visibility 0.35s ease, opacity 0.35s ease, transform 0.35s ease !important;
}

@media (min-width: 601px) {
  .product_list .product-block .box-buttons {
    visibility: hidden !important;
    opacity: 0 !important;
    -webkit-transform: scale(0.6);
    transform: scale(0.6);
  }
  .product_list .product-block:hover .box-buttons,
  .product_list .product-block:focus-within .box-buttons {
    visibility: visible !important;
    opacity: 1 !important;
    left: auto !important;
    right: 10px !important;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  .rtl .product_list .product-block:hover .box-buttons,
  .rtl .product_list .product-block:focus-within .box-buttons {
    left: 10px !important;
    right: auto !important;
  }
}

/* Mobile: always visible, no zoom hide */
@media (max-width: 600px) {
  .product_list .product-block .box-buttons {
    visibility: visible !important;
    opacity: 1 !important;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

.product_list .product-block .box-buttons a.quick-view {
  display: -webkit-box !important;
  display: -webkit-flex !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  float: none !important;
  width: 46px;
  height: 46px;
  margin: 0 !important;
  padding: 0 !important;
  border: 0;
  -webkit-border-radius: 50% !important;
  border-radius: 50% !important;
  background-color: rgba(255, 255, 255, 0.6) !important;
  color: #000 !important;
  text-align: center;
  text-decoration: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  pointer-events: auto;
  -webkit-transition: background-color 0.2s ease;
  transition: background-color 0.2s ease;
}

.product_list .product-block .box-buttons a.quick-view:hover,
.product_list .product-block .box-buttons a.quick-view:focus {
  background-color: rgba(255, 255, 255, 0.6) !important;
  color: #000 !important;
}

.product_list .product-block .box-buttons a.quick-view .fa {
  margin: 0 !important;
  color: #000 !important;
  line-height: 1;
  /* 35px × (46/80) ≈ 20px */
  font-size: 20px !important;
}


/* RTL: mirror to top-left with 10px inset */
.rtl .product_list .product-block .box-buttons {
  left: 10px !important;
  right: auto !important;
}


/* QV iframe padding around product primary block (= --maiori-qv-pad) */
#product.content_only div.primary_block {
  padding: var(--maiori-qv-pad, 20px) !important;
}

/* PDP / QV colour-texture swatches: no default filet; shadow 3 3 4 .6;
   selected outline 3px #e5bab3 flush; unavailable keep red filet */
#attributes .attribute_list #color_to_pick_list li a.color_pick {
  border: 0 !important;
  -webkit-box-shadow: 2px 2px 10px rgba(0,0,0,0.4) !important;
  box-shadow: 2px 2px 10px rgba(0,0,0,0.4) !important;
}
#attributes .attribute_list #color_to_pick_list li.selected {
  border-color: transparent !important;
}
#attributes .attribute_list #color_to_pick_list li.selected a.color_pick {
  border: 0 !important;
  -webkit-box-shadow: 0 0 0 3px #e5bab3, 2px 2px 10px rgba(0,0,0,0.4) !important;
  box-shadow: 0 0 0 3px #e5bab3, 2px 2px 10px rgba(0,0,0,0.4) !important;
}
#attributes .attribute_list #color_to_pick_list li a.color_pick.attribute-unavailable,
#attributes .attribute_list a.color_pick.attribute-unavailable {
  border: 2px solid #b44 !important;
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
}



/* Colour swatch select: zoom in/out (no opacity fade), duration 1s — image combo fade synced 500+500 */
@-webkit-keyframes maiori-swatch-zoom {
  0% { -webkit-transform: scale(1); transform: scale(1); }
  50% { -webkit-transform: scale(1.6); transform: scale(1.6); }
  100% { -webkit-transform: scale(1); transform: scale(1); }
}
@keyframes maiori-swatch-zoom {
  0% { -webkit-transform: scale(1); transform: scale(1); }
  50% { -webkit-transform: scale(1.6); transform: scale(1.6); }
  100% { -webkit-transform: scale(1); transform: scale(1); }
}
#attributes .attribute_list #color_to_pick_list li a.color_pick.maiori-swatch-zoom {
  -webkit-animation: maiori-swatch-zoom 1s ease;
  animation: maiori-swatch-zoom 1s ease;
}

/* Behind product image during combo crossfade.
   Parent keeps #ebebeb so nothing flashes white between layers.
   Same corner radius as product imagery (global img 20px / --maiori-qv-slide-radius). */
#image-block,
#image-block #view_full_size,
#product.content_only #image-block,
#product.content_only #view_full_size {
  background-color: #ebebeb !important;
  -webkit-border-radius: var(--maiori-qv-slide-radius, 20px) !important;
  -moz-border-radius: var(--maiori-qv-slide-radius, 20px) !important;
  border-radius: var(--maiori-qv-slide-radius, 20px) !important;
  overflow: hidden;
  position: relative;
}
/* Dual-layer overlays (Slider Moodshot vs Combo pic — independent) */
#bigpic-moodshot-xfade,
#bigpic-combo-xfade {
  max-width: none;
  pointer-events: none;
}
/* Host state hooks — style/tune each path without affecting the other */
#image-block.maiori-moodshot-changing,
#view_full_size.maiori-moodshot-changing {
  /* Slider Moodshot in transition */
}
#image-block.maiori-combo-pic-changing,
#view_full_size.maiori-combo-pic-changing {
  /* Combo / swatch product-photo in transition */
}
/* QV iframe root — white panel (same as Fancybox skin / add-to-cart modal) */
body.content_only,
body.content_only #page,
body.content_only .columns-container,
body.content_only #columns,
body.content_only #center_column {
  background-color: #fff !important;
}
