/* v6.9.353 — use the proven product-carousel arrow treatment for FMO web + mobile carousels. */

/* Match the main product carousel button shell exactly. */
.clean-shot-showcase .fmo-deck-arrow,
.mobile-stage .mobile-arrow{
  width:58px!important;
  height:58px!important;
  min-width:58px!important;
  min-height:58px!important;
  padding:0!important;
  border-radius:50%!important;
  border:1px solid rgba(243,179,36,.50)!important;
  background:rgba(5,5,4,.80)!important;
  color:var(--acid,#f3b324)!important;
  display:grid!important;
  place-items:center!important;
  line-height:0!important;
  font-size:0!important;
  box-shadow:0 10px 30px rgba(0,0,0,.48),0 0 0 1px rgba(243,179,36,.22)!important;
  backdrop-filter:blur(14px)!important;
  -webkit-backdrop-filter:blur(14px)!important;
  overflow:hidden!important;
}

.clean-shot-showcase .fmo-deck-arrow:hover,
.clean-shot-showcase .fmo-deck-arrow:focus-visible,
.mobile-stage .mobile-arrow:hover,
.mobile-stage .mobile-arrow:focus-visible{
  background:var(--acid,#f3b324)!important;
  color:#071000!important;
  border-color:var(--acid,#f3b324)!important;
  box-shadow:0 0 28px rgba(243,179,36,.28)!important;
}

/* Remove the older CSS-drawn chevrons so there is only one icon. */
.clean-shot-showcase .fmo-deck-arrow::before,
.mobile-stage .mobile-arrow::before{
  content:none!important;
  display:none!important;
}

/* Same geometric SVG arrow used by the product carousel: true optical centre. */
.clean-shot-showcase .fmo-deck-arrow .arrow-icon,
.mobile-stage .mobile-arrow .arrow-icon{
  display:block!important;
  width:22px!important;
  height:22px!important;
  margin:0!important;
  padding:0!important;
  overflow:visible!important;
  transform:none!important;
  pointer-events:none!important;
}
.clean-shot-showcase .fmo-deck-arrow .arrow-icon path,
.mobile-stage .mobile-arrow .arrow-icon path{
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:3!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
  vector-effect:non-scaling-stroke!important;
}

/* Keep the existing carousel positions from the previous polish pass. */
.clean-shot-showcase .fmo-deck-nav,
.mobile-stage .mobile-nav-arrows{
  align-items:center!important;
}

/* Slightly smaller shell on narrow screens while retaining perfect centring. */
@media(max-width:820px){
  .clean-shot-showcase .fmo-deck-arrow,
  .mobile-stage .mobile-arrow{
    width:52px!important;
    height:52px!important;
    min-width:52px!important;
    min-height:52px!important;
  }
  .clean-shot-showcase .fmo-deck-arrow .arrow-icon,
  .mobile-stage .mobile-arrow .arrow-icon{
    width:20px!important;
    height:20px!important;
  }
}
