/* 1R Reactor — frontend-product-slider.css
 * Canonical structure: foundations → layout/components → context UI → states → responsive.
 */

/* === Foundations & Base === */
.reactor-product-slider *,
.reactor-product-slider *::before,
.reactor-product-slider *::after{box-sizing: border-box;}
.reactor-product-slider__arrow::before{content: "" ;position: absolute ;top: 50% ;left: 50% ;display: block ;width: 14px ;height: 14px ;box-sizing: border-box ;border-right: 3px solid #9aa7ad ;border-bottom: 3px solid #9aa7ad ;transform-origin: 50% 50% ;transition: border-color 0.25s ease ;}
.reactor-product-slider__arrow--prev::before{transform: translate(-50%, -50%) rotate(135deg) ;}
.reactor-product-slider__arrow--next::before{transform: translate(-50%, -50%) rotate(-45deg) ;}
.reactor-product-slider__arrow--prev::before{left: 55% ;}
.reactor-product-slider__arrow--next::before{left: 45% ;}
[class*="__bullets"] [class*="__bullet"]{border-radius:999px;}
html body .reactor-product-slider__bullets{display:flex ;
    align-items:center ;
    justify-content:center ;
    gap:8px ;}
html body .reactor-product-slider__bullets[hidden]{display:none ;}
html body .reactor-product-slider__bullet{display:block ;
    width:8px ;
    height:8px ;
    min-width:8px ;
    min-height:8px ;
    padding:0 ;
    border:0 ;
    border-radius:999px ;
    background:rgba(154,167,173,.55) ;
    box-shadow:none ;
    opacity:1 ;
    transform:none ;
    transition:width .2s ease,background-color .2s ease,opacity .2s ease ;}
html body .reactor-product-slider__bullet.is-active{width:24px ;
    }
html body .reactor-product-slider__bullet{background:#9aa7ad ;
    opacity:.48 ;}
html body .reactor-product-slider__bullet.is-active{background:#9aa7ad ;
    opacity:1 ;}

/* === Commerce & Content Components === */
.reactor-product-slider{--reactor-product-slider-columns:var(--reactor-product-slider-columns-desktop,4);--reactor-product-slider-gap-effective:var(--reactor-product-slider-gap,18px);position:relative;width:100%;max-width:100%;box-sizing:border-box;}
.reactor-product-slider__viewport{width: calc(100% - 100px);max-width: calc(100% - 100px);margin-left: 50px;margin-right: 50px;overflow: hidden;position: relative;z-index: 1;--reactor-product-slider-item-width:calc((100% + var(--reactor-product-slider-gap)) / var(--reactor-product-slider-columns) - var(--reactor-product-slider-gap));}
.reactor-product-slider ul.products.reactor-product-slider__track{display: flex ;flex-flow: row nowrap ;align-items: stretch ;gap: var(--reactor-product-slider-gap) ;width: 100% ;max-width: 100% ;margin: 0 ;padding: 0 ;list-style: none ;transform: translate3d(0, 0, 0);will-change: transform;}
.reactor-product-slider ul.products.reactor-product-slider__track > li.product{float: none ;clear: none ;flex:0 0 var(--reactor-product-slider-item-width) ;width:var(--reactor-product-slider-item-width) ;min-width:var(--reactor-product-slider-item-width) ;max-width:var(--reactor-product-slider-item-width) ;margin: 0 ;height: auto ;position: relative ;z-index: 1 ;}
:is(.reactor-product-slider,.r1-gallery-slider-shell) .reactor-product-slider__arrow{position:absolute;top:50%;z-index:9999;isolation:isolate;pointer-events:auto;width:44px;height:44px;margin:0;padding:0;border:0;border-radius:50%;display:flex;align-items:center;justify-content:center;transform:translateY(-50%) scale(1);background:#fff;color:#222;box-shadow:0 6px 22px rgba(0,0,0,.15);font-size:0;line-height:1;cursor:pointer;touch-action:manipulation;transition:opacity .18s ease,transform .18s ease,box-shadow .18s ease,background-color .18s ease;}
/* Keep the neutral surface on hover/focus/press, even with a theme-wide button:hover accent. */
:is(.reactor-product-slider,.r1-gallery-slider-shell) .reactor-product-slider__arrow:is(:hover,:focus-visible,:active){background:#fff;color:#222;}
:is(.reactor-product-slider,.r1-gallery-slider-shell) .reactor-product-slider__arrow:hover:not(:disabled){transform:translateY(-50%) scale(1.04);}
:is(.reactor-product-slider,.r1-gallery-slider-shell) .reactor-product-slider__arrow:active:not(:disabled){transform:translateY(calc(-50% + 1px)) scale(1.02);box-shadow:0 2px 7px rgba(0,0,0,.17);transition-duration:.075s;}
:is(.reactor-product-slider,.r1-gallery-slider-shell) .reactor-product-slider__arrow:disabled{opacity:.35;cursor:default;}
:is(.reactor-product-slider,.r1-gallery-slider-shell) .reactor-product-slider__arrow:disabled:hover{transform:translateY(-50%) scale(1);}
@media (prefers-reduced-motion:reduce){:is(.reactor-product-slider,.r1-gallery-slider-shell) .reactor-product-slider__arrow{transition:none;}}
.reactor-product-slider__arrow--prev{left: 20px;}
.reactor-product-slider__arrow--next{right: 20px;}
.reactor-product-slider__arrow[hidden]{display: none ;}
.reactor-product-slider__bullets{display: flex;justify-content: center;align-items: center;gap: 8px;margin-top: 18px;}
.reactor-product-slider__bullet{width: 9px;height: 9px;min-width: 9px;margin: 0;padding: 0;border: 0;border-radius: 50%;background: currentColor;opacity: 0.28;cursor: pointer;}
.reactor-product-slider__bullet.is-active{opacity: 1;transform: scale(1.2);}
.reactor-product-slider__bullets[hidden]{display: none ;}
.reactor-product-slider{--reactor-product-slider-gap:var(--r1-column-gap,24px);}
.reactor-product-slider__track{gap:var(--reactor-product-slider-gap,var(--r1-column-gap,24px));}
.reactor-product-slider__bullet,
.reactor-product-slider__bullets button{background:#9aa7ad ;}
:is(.reactor-product-slider,.r1-gallery-slider-shell) .reactor-product-slider__bullet{background-color:rgba(154,167,173,.55) ;
    border-color:#9aa7ad ;
    color:#9aa7ad ;}
:is(.reactor-product-slider,.r1-gallery-slider-shell) .reactor-product-slider__bullet.is-active{background-color:#9aa7ad ;
    border-color:#9aa7ad ;
    color:#9aa7ad ;}
.reactor-product-slider .r1-product-card-actions > .button{min-width:0;white-space:normal;text-align:center;overflow-wrap:anywhere;word-break:normal;}

/* === Responsive & Conditional === */
@media (max-width:989px){.reactor-product-slider{--reactor-product-slider-columns:var(--reactor-product-slider-columns-tablet,3);}}
@media (max-width:767px){.reactor-product-slider{--reactor-product-slider-columns:var(--reactor-product-slider-columns-mobile,2);}}
@media (max-width: 767px){body.r1-reactor-styles-default .reactor-product-slider{--reactor-product-slider-gap: 10px;}.reactor-product-slider__viewport{width: calc(100% - 60px);max-width: calc(100% - 60px);margin-left: 30px;margin-right: 30px;}.reactor-product-slider__arrow{width: 38px;height: 38px;}.reactor-product-slider__arrow--prev{left: 10px;}.reactor-product-slider__arrow--next{right: 10px;}}
@media (max-width: 767px){body.r1-reactor-styles-default .reactor-product-slider{--reactor-product-slider-gap: 10px ;}}

/* First paint: slider geometry must exist before deferred JS initializes.
   Scope to slider markup and outrank theme WooCommerce catalog grids.
   JS subsequently sets measured pixel widths with inline declarations. */
body .reactor-product-slider ul.products.reactor-product-slider__track{display:flex!important;flex-flow:row nowrap!important;align-items:stretch!important;gap:var(--reactor-product-slider-gap)!important;width:100%!important;max-width:100%!important;margin:0!important;padding:0!important;}
body .reactor-product-slider ul.products.reactor-product-slider__track>li.product{float:none!important;clear:none!important;flex:0 0 var(--reactor-product-slider-item-width)!important;width:var(--reactor-product-slider-item-width)!important;min-width:var(--reactor-product-slider-item-width)!important;max-width:var(--reactor-product-slider-item-width)!important;margin:0!important;}

/* Shared carousel navigation: product slider and media gallery use identical arrows and pagination. */
.r1-gallery-slider-shell .reactor-product-slider__arrow{top:50%;font-size:0;line-height:1;}
.r1-gallery-slider-shell .reactor-product-slider__bullets{display:flex;justify-content:center;align-items:center;gap:8px;}
.r1-gallery-slider-shell .reactor-product-slider__bullet{display:block;width:8px;height:8px;min-width:8px;min-height:8px;padding:0;border:0;border-radius:999px;background:#9aa7ad;opacity:.48;transform:none;box-shadow:none;transition:width .2s ease,opacity .2s ease;}
.r1-gallery-slider-shell .reactor-product-slider__bullet.is-active{width:24px;opacity:1;transform:none;}

/* Runtime initial geometry */
@media (max-width:767px){.reactor-product-slider--preinit .reactor-product-slider__viewport{min-height:180px}body.r1-reactor-styles-default .reactor-product-slider{--reactor-product-slider-gap:10px}}
