.stylr-widget {
    --stylr-accent: #17664e; --stylr-text: inherit;
    --stylr-gap: 16px; --stylr-columns: 4;
    width: 100%; min-width: 0;
    font-family: inherit; text-align: right; padding-block: 12px;
}
.stylr-widget[hidden], .stylr-widget [hidden], .elementor-widget-stylish-related[hidden], .elementor-widget-stylish-together[hidden] { display: none !important; }
.stylr-widget .stylr-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 0 0 18px; }
.stylr-widget .stylr-eyebrow { display: block; color: var(--stylr-accent); font-family: sans-serif; font-size: 9px; font-weight: 700; letter-spacing: 2px; margin-bottom: 7px; }
.stylr-widget .stylr-title { color: var(--stylr-text); font: inherit; font-size: 22px; font-weight: 750; line-height: 1.7; margin: 0; padding: 0; }
.stylr-widget .stylr-navigation { display: flex; flex-shrink: 0; gap: 7px; }
.stylr-widget .stylr-nav { display: grid; place-items: center; width: 36px; height: 36px; padding: 0; border: 1px solid #dce4de; border-radius: 50%; background: #fff; color: var(--stylr-text); cursor: pointer; font: 20px/1 sans-serif; box-shadow: none; }
.stylr-widget .stylr-nav:disabled { opacity: .3; cursor: default; }
.stylr-widget ul.products.stylr-products { gap: var(--stylr-gap); margin: 0; padding: 0 0 8px; min-width: 0; }
.stylr-grid ul.products.stylr-products { display: grid; grid-template-columns: repeat(var(--stylr-columns), minmax(0, 1fr)); }
.stylr-grid .stylr-navigation { display: none; }
.stylr-rail ul.products.stylr-products { display: flex !important; flex-wrap: nowrap !important; overflow-x: auto; overscroll-behavior-inline: contain; scroll-snap-type: none; scrollbar-width: thin; scrollbar-color: #c5d8ca transparent; }
.stylr-widget :is(a, button):focus-visible { outline: 2px solid var(--stylr-accent); outline-offset: -3px; }
.stylr-editor-note { border: 1px dashed #a5b9a9; background: #f6faf6; padding: 16px; font-size: 13px; line-height: 1.9; }
@media (max-width: 1024px) { .stylr-widget { --stylr-columns: 3; } }
@media (max-width: 767px) {
    .stylr-widget { --stylr-columns: 2; --stylr-gap: 10px; }
    .stylr-widget .stylr-title { font-size: 18px; }
    .stylr-widget .stylr-header { gap: 8px; margin-bottom: 14px; }
    .stylr-widget .stylr-eyebrow { font-size: 8px; }
    .stylr-widget .stylr-nav { width: 30px; height: 30px; }
}
@media (prefers-reduced-motion: reduce) { .stylr-widget * { transition: none !important; scroll-behavior: auto !important; } }

/* Only layout is owned here. Images, price, title, buttons and card decoration belong to the theme. */
.stylr-widget ul.products.stylr-products::before,
.stylr-widget ul.products.stylr-products::after { display:none; }
.stylr-widget ul.products.stylr-products > li.product {
    float:none !important; clear:none !important; margin:0 !important; min-width:0;
    width:auto !important; box-sizing:border-box;
}
.stylr-widget.stylr-rail ul.products.stylr-products > li.product {
    flex:0 0 calc((100% - (var(--stylr-columns) - 1) * var(--stylr-gap)) / var(--stylr-columns));
    scroll-snap-align:none;
}

/* Native touch scrolling owns both axes and momentum. JS dragging is mouse-only. */
.stylr-widget.stylr-rail ul.products.stylr-products {
    overflow-x: auto !important;
    scroll-snap-type: none !important;
    scroll-behavior: auto !important;
    touch-action: auto !important;
    cursor: grab;
    -webkit-overflow-scrolling: touch;
}
.stylr-widget.stylr-rail ul.products.stylr-products > li.product,
.stylr-widget.stylr-rail ul.products.stylr-products > li.product * { touch-action: auto !important; }
.stylr-widget.stylr-rail ul.products.stylr-products img { -webkit-user-drag: none; }
.stylr-widget.stylr-rail ul.products.stylr-products.stylr-dragging,
.stylr-widget.stylr-rail ul.products.stylr-products.stylr-wheeling {
    scroll-snap-type: none !important;
    scroll-behavior: auto !important;
}
.stylr-widget.stylr-rail ul.products.stylr-products.stylr-dragging,
.stylr-widget.stylr-rail ul.products.stylr-products.stylr-dragging * { cursor: grabbing !important; user-select: none !important; }

@media (hover: none) { .stylr-widget.stylr-rail ul.products.stylr-products { cursor: auto; } }
