@salla.sa/twilight-components 2.14.391 → 2.14.393

package/dist/esm/salla-rating-modal.entry.js

@@ -1,7 +1,7 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { r as registerInstance, h, H as Host, a as getElement } from './index-BBHnyTVS.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-DYB20YqN.js';
 import { W as WishListIcon } from './star-ZT7ehBBk.js';
 import { C as CheckCircle2 } from './check-circle2-BV4kqbdL.js';
 import { H as Helper } from './Helper-DFMXF2_h.js';
@@ -17,7 +17,7 @@ var ShippingFast = `<!-- Generated by IcoMoon.io -->
 </svg>
 `;
 
-const sallaRatingModalCss = "";
+const sallaRatingModalCss = () => ``;
 
 const SallaRatingModal = class {
     constructor(hostRef) {
@@ -448,6 +448,6 @@ const SallaRatingModal = class {
     }
     get host() { return getElement(this); }
 };
-SallaRatingModal.style = sallaRatingModalCss;
+SallaRatingModal.style = sallaRatingModalCss();
 
 export { SallaRatingModal as salla_rating_modal };

package/dist/esm/salla-scopes.entry.js

@@ -1,7 +1,7 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { r as registerInstance, h, H as Host } from './index-BBHnyTVS.js';
+import { r as registerInstance, h, H as Host } from './index-DYB20YqN.js';
 import { S as Search } from './search-BscTeWDc.js';
 
 var StoreAlt = `<!-- Generated by IcoMoon.io -->
@@ -17,7 +17,7 @@ var ModeType;
     ModeType["AVAILABILITY"] = "availability";
 })(ModeType || (ModeType = {}));
 
-const sallaScopesCss = ".s-scopes-availability-content{display:flex;justify-content:center;align-items:center}.s-scopes-placeholder{flex:0 0 85%}";
+const sallaScopesCss = () => `.s-scopes-availability-content{display:flex;justify-content:center;align-items:center}.s-scopes-placeholder{flex:0 0 85%}`;
 
 const SallaScopees = class {
     constructor(hostRef) {
@@ -178,6 +178,6 @@ const SallaScopees = class {
         }
     }
 };
-SallaScopees.style = sallaScopesCss;
+SallaScopees.style = sallaScopesCss();
 
 export { SallaScopees as salla_scopes };

package/dist/esm/salla-search.entry.js

@@ -1,12 +1,12 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { r as registerInstance, h, a as getElement } from './index-BBHnyTVS.js';
+import { r as registerInstance, h, g as getElement } from './index-DYB20YqN.js';
 import { S as Search } from './search-BscTeWDc.js';
 import { H as Helper } from './Helper-DFMXF2_h.js';
 import './anime.es-CgtvEd63.js';
 
-const sallaSearchCss = ".s-search-placeholder-wrapper{position:relative;display:inline-block}.s-search-input-wrapper{position:relative}.s-search-placeholder-trigger{cursor:pointer;appearance:none;text-align:start}";
+const sallaSearchCss = () => `.s-search-placeholder-wrapper{position:relative;display:inline-block}.s-search-input-wrapper{position:relative}.s-search-placeholder-trigger{cursor:pointer;appearance:none;text-align:start}`;
 
 const SallaSearch = class {
     constructor(hostRef) {
@@ -158,9 +158,11 @@ const SallaSearch = class {
     }
     get host() { return getElement(this); }
     static get watchers() { return {
-        "search_term": ["handleSearch"]
+        "search_term": [{
+                "handleSearch": 0
+            }]
     }; }
 };
-SallaSearch.style = sallaSearchCss;
+SallaSearch.style = sallaSearchCss();
 
 export { SallaSearch as salla_search };

package/dist/esm/salla-skeleton.entry.js

@@ -1,9 +1,9 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { r as registerInstance, h, H as Host } from './index-BBHnyTVS.js';
+import { r as registerInstance, h, H as Host } from './index-DYB20YqN.js';
 
-const sallaSkeletonCss = ":host{display:block}";
+const sallaSkeletonCss = () => `:host{display:block}`;
 
 const SallaSkeleton = class {
     constructor(hostRef) {
@@ -29,6 +29,6 @@ const SallaSkeleton = class {
         return (h(Host, { key: '366d9fcd96b22edc9b5cdc07f8d8367fdbc5c574', class: "s-skeleton-wrapper", style: { width: this.width, height: this.height } }, h("div", { key: 'b4ad9adc7d8ce69aeaeaa1cf287726fa69018730', class: classes }, "\u00A0")));
     }
 };
-SallaSkeleton.style = sallaSkeletonCss;
+SallaSkeleton.style = sallaSkeletonCss();
 
 export { SallaSkeleton as salla_skeleton };

package/dist/esm/salla-slider.entry.js

@@ -1,7 +1,7 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-BBHnyTVS.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-DYB20YqN.js';
 import { a as ArrowRightIcon, A as ArrowLeftIcon } from './keyboard_arrow_right-Vqpj4CWE.js';
 
 /**
@@ -230,11 +230,10 @@ function isNode(node) {
 }
 function extend(...args) {
   const to = Object(args[0]);
-  const noExtend = ['__proto__', 'constructor', 'prototype'];
   for (let i = 1; i < args.length; i += 1) {
     const nextSource = args[i];
     if (nextSource !== undefined && nextSource !== null && !isNode(nextSource)) {
-      const keysArray = Object.keys(Object(nextSource)).filter(key => noExtend.indexOf(key) < 0);
+      const keysArray = Object.keys(Object(nextSource)).filter(key => key !== '__proto__' && key !== 'constructor' && key !== 'prototype');
       for (let nextIndex = 0, len = keysArray.length; nextIndex < len; nextIndex += 1) {
         const nextKey = keysArray[nextIndex];
         const desc = Object.getOwnPropertyDescriptor(nextSource, nextKey);
@@ -1101,9 +1100,8 @@ function updateSlides() {
       allSlidesSize += slideSizeValue + (spaceBetween || 0);
     });
     allSlidesSize -= spaceBetween;
-    const offsetSize = (offsetBefore || 0) + (offsetAfter || 0);
-    if (allSlidesSize + offsetSize < swiperSize) {
-      const allSlidesOffset = (swiperSize - allSlidesSize - offsetSize) / 2;
+    if (allSlidesSize < swiperSize) {
+      const allSlidesOffset = (swiperSize - allSlidesSize) / 2;
       snapGrid.forEach((snap, snapIndex) => {
         snapGrid[snapIndex] = snap - allSlidesOffset;
       });
@@ -3188,7 +3186,8 @@ function onResize() {
   swiper.updateSlidesClasses();
   const isVirtualLoop = isVirtual && params.loop;
   if ((params.slidesPerView === 'auto' || params.slidesPerView > 1) && swiper.isEnd && !swiper.isBeginning && !swiper.params.centeredSlides && !isVirtualLoop) {
-    swiper.slideTo(swiper.slides.length - 1, 0, false, true);
+    const slides = isVirtual ? swiper.virtual.slides : swiper.slides;
+    swiper.slideTo(slides.length - 1, 0, false, true);
   } else {
     if (swiper.params.loop && !isVirtual) {
       swiper.slideToLoop(swiper.realIndex, 0, false, true);
@@ -3813,7 +3812,11 @@ class Swiper {
     swiper.eventsAnyListeners = [];
     swiper.modules = [...swiper.__modules__];
     if (params.modules && Array.isArray(params.modules)) {
-      swiper.modules.push(...params.modules);
+      params.modules.forEach(mod => {
+        if (typeof mod === 'function' && swiper.modules.indexOf(mod) < 0) {
+          swiper.modules.push(mod);
+        }
+      });
     }
     const allModulesParams = {};
     swiper.modules.forEach(mod => {
@@ -7501,7 +7504,8 @@ function A11y({
     const slideEl = e.target.closest(`.${swiper.params.slideClass}, swiper-slide`);
     if (!slideEl || !swiper.slides.includes(slideEl)) return;
     focusTargetSlideEl = slideEl;
-    const isActive = swiper.slides.indexOf(slideEl) === swiper.activeIndex;
+    const isVirtual = swiper.virtual && swiper.params.virtual.enabled;
+    const isActive = (isVirtual ? parseInt(slideEl.getAttribute('data-swiper-slide-index'), 10) : swiper.slides.indexOf(slideEl)) === swiper.activeIndex;
     const isVisible = swiper.params.watchSlidesProgress && swiper.visibleSlides && swiper.visibleSlides.includes(slideEl);
     if (isActive || isVisible) return;
     if (e.sourceCapabilities && e.sourceCapabilities.firesTouchEvents) return;
@@ -7514,6 +7518,8 @@ function A11y({
       if (preventFocusHandler) return;
       if (swiper.params.loop) {
         swiper.slideToLoop(swiper.getSlideIndexWhenGrid(parseInt(slideEl.getAttribute('data-swiper-slide-index'))), 0);
+      } else if (isVirtual) {
+        swiper.slideTo(swiper.getSlideIndexWhenGrid(parseInt(slideEl.getAttribute('data-swiper-slide-index'), 10)), 0);
       } else {
         swiper.slideTo(swiper.getSlideIndexWhenGrid(swiper.slides.indexOf(slideEl)), 0);
       }
@@ -8664,7 +8670,7 @@ function Grid({
       slidesNumberEvenToRows = Math.ceil(slidesLength / rows) * rows;
     }
     if (slidesPerView !== 'auto' && fill === 'row') {
-      slidesNumberEvenToRows = Math.max(slidesNumberEvenToRows, slidesPerView * rows);
+      slidesNumberEvenToRows = Math.max(slidesNumberEvenToRows, Math.floor(slidesPerView) * rows);
     }
     slidesPerRow = slidesNumberEvenToRows / rows;
   };
@@ -9772,7 +9778,7 @@ function EffectCards({
 }
 
 /**
- * Swiper 12.1.0
+ * Swiper 12.1.3
  * Most modern mobile touch slider and framework with hardware accelerated transitions
  * https://swiperjs.com
  *
@@ -9780,7 +9786,7 @@ function EffectCards({
  *
  * Released under the MIT License
  *
- * Released on: January 28, 2026
+ * Released on: March 24, 2026
  */
 
 
@@ -9788,7 +9794,7 @@ function EffectCards({
 const modules = [Virtual, Keyboard, Mousewheel, Navigation, Pagination, Scrollbar, Parallax, Zoom, Controller, A11y, History, HashNavigation, Autoplay, Thumb, freeMode, Grid, Manipulation, EffectFade, EffectCube, EffectFlip, EffectCoverflow, EffectCreative, EffectCards];
 Swiper.use(modules);
 
-const sallaSliderCss = "/**\n * Swiper 12.1.0\n * Most modern mobile touch slider and framework with hardware accelerated transitions\n * https://swiperjs.com\n *\n * Copyright 2014-2026 Vladimir Kharlampidi\n *\n * Released under the MIT License\n *\n * Released on: January 28, 2026\n */\n\n:root {\n  --swiper-theme-color: #007aff;\n  /*\n  --swiper-preloader-color: var(--swiper-theme-color);\n  --swiper-wrapper-transition-timing-function: initial;\n  */\n}\n:host {\n  position: relative;\n  display: block;\n  margin-left: auto;\n  margin-right: auto;\n  z-index: 1;\n}\n.swiper {\n  margin-left: auto;\n  margin-right: auto;\n  position: relative;\n  overflow: hidden;\n  list-style: none;\n  padding: 0;\n  /* Fix of Webkit flickering */\n  z-index: 1;\n  display: block;\n}\n.swiper-vertical > .swiper-wrapper {\n  flex-direction: column;\n}\n.swiper-wrapper {\n  position: relative;\n  width: 100%;\n  height: 100%;\n  z-index: 1;\n  display: flex;\n  transition-property: transform;\n  transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);\n  box-sizing: content-box;\n}\n.swiper-android .swiper-slide,\n.swiper-ios .swiper-slide,\n.swiper-wrapper {\n  transform: translate3d(0px, 0, 0);\n}\n.swiper-horizontal {\n  touch-action: pan-y;\n}\n.swiper-vertical {\n  touch-action: pan-x;\n}\n.swiper-slide {\n  flex-shrink: 0;\n  width: 100%;\n  height: 100%;\n  position: relative;\n  transition-property: transform;\n  display: block;\n}\n.swiper-slide-invisible-blank {\n  visibility: hidden;\n}\n/* Auto Height */\n.swiper-autoheight,\n.swiper-autoheight .swiper-slide {\n  height: auto;\n}\n.swiper-autoheight .swiper-wrapper {\n  align-items: flex-start;\n  transition-property: transform, height;\n}\n.swiper-backface-hidden .swiper-slide {\n  transform: translateZ(0);\n  backface-visibility: hidden;\n}\n/* 3D Effects */\n.swiper-3d.swiper-css-mode .swiper-wrapper {\n  perspective: 1200px;\n}\n.swiper-3d .swiper-wrapper {\n  transform-style: preserve-3d;\n}\n.swiper-3d {\n  perspective: 1200px;\n  .swiper-slide,\n  .swiper-cube-shadow {\n    transform-style: preserve-3d;\n  }\n}\n\n/* CSS Mode */\n.swiper-css-mode {\n  > .swiper-wrapper {\n    overflow: auto;\n    scrollbar-width: none; /* For Firefox */\n    -ms-overflow-style: none; /* For Internet Explorer and Edge */\n    &::-webkit-scrollbar {\n      display: none;\n    }\n  }\n  > .swiper-wrapper > .swiper-slide {\n    scroll-snap-align: start start;\n  }\n  &.swiper-horizontal {\n    > .swiper-wrapper {\n      scroll-snap-type: x mandatory;\n    }\n    > .swiper-wrapper > .swiper-slide:first-child {\n      margin-inline-start: var(--swiper-slides-offset-before);\n      scroll-margin-inline-start: var(--swiper-slides-offset-before);\n    }\n    > .swiper-wrapper > .swiper-slide:last-child {\n      margin-inline-end: var(--swiper-slides-offset-after);\n    }\n  }\n  &.swiper-vertical {\n    > .swiper-wrapper {\n      scroll-snap-type: y mandatory;\n    }\n    > .swiper-wrapper > .swiper-slide:first-child {\n      margin-block-start: var(--swiper-slides-offset-before);\n      scroll-margin-block-start: var(--swiper-slides-offset-before);\n    }\n    > .swiper-wrapper > .swiper-slide:last-child {\n      margin-block-end: var(--swiper-slides-offset-after);\n    }\n  }\n  &.swiper-free-mode {\n    > .swiper-wrapper {\n      scroll-snap-type: none;\n    }\n    > .swiper-wrapper > .swiper-slide {\n      scroll-snap-align: none;\n    }\n  }\n  &.swiper-centered {\n    > .swiper-wrapper::before {\n      content: '';\n      flex-shrink: 0;\n      order: 9999;\n    }\n    > .swiper-wrapper > .swiper-slide {\n      scroll-snap-align: center center;\n      scroll-snap-stop: always;\n    }\n  }\n  &.swiper-centered.swiper-horizontal {\n    > .swiper-wrapper > .swiper-slide:first-child {\n      margin-inline-start: var(--swiper-centered-offset-before);\n    }\n    > .swiper-wrapper::before {\n      height: 100%;\n      min-height: 1px;\n      width: var(--swiper-centered-offset-after);\n    }\n  }\n  &.swiper-centered.swiper-vertical {\n    > .swiper-wrapper > .swiper-slide:first-child {\n      margin-block-start: var(--swiper-centered-offset-before);\n    }\n    > .swiper-wrapper::before {\n      width: 100%;\n      min-width: 1px;\n      height: var(--swiper-centered-offset-after);\n    }\n  }\n}\n\n/* Slide styles start */\n/* 3D Shadows */\n.swiper-3d {\n  .swiper-slide-shadow,\n  .swiper-slide-shadow-left,\n  .swiper-slide-shadow-right,\n  .swiper-slide-shadow-top,\n  .swiper-slide-shadow-bottom,\n  .swiper-slide-shadow,\n  .swiper-slide-shadow-left,\n  .swiper-slide-shadow-right,\n  .swiper-slide-shadow-top,\n  .swiper-slide-shadow-bottom {\n    position: absolute;\n    left: 0;\n    top: 0;\n    width: 100%;\n    height: 100%;\n    pointer-events: none;\n    z-index: 10;\n  }\n  .swiper-slide-shadow {\n    background: rgba(0, 0, 0, 0.15);\n  }\n  .swiper-slide-shadow-left {\n    background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));\n  }\n  .swiper-slide-shadow-right {\n    background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));\n  }\n  .swiper-slide-shadow-top {\n    background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));\n  }\n  .swiper-slide-shadow-bottom {\n    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));\n  }\n}\n.swiper-lazy-preloader {\n  width: 42px;\n  height: 42px;\n  position: absolute;\n  left: 50%;\n  top: 50%;\n  margin-left: -21px;\n  margin-top: -21px;\n  z-index: 10;\n  transform-origin: 50%;\n  box-sizing: border-box;\n  border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));\n  border-radius: 50%;\n  border-top-color: transparent;\n}\n.swiper:not(.swiper-watch-progress),\n.swiper-watch-progress .swiper-slide-visible {\n  .swiper-lazy-preloader {\n    animation: swiper-preloader-spin 1s infinite linear;\n  }\n}\n.swiper-lazy-preloader-white {\n  --swiper-preloader-color: #fff;\n}\n.swiper-lazy-preloader-black {\n  --swiper-preloader-color: #000;\n}\n@keyframes swiper-preloader-spin {\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(360deg);\n  }\n}\n/* Slide styles end */\n\n.swiper-virtual .swiper-slide {\n  -webkit-backface-visibility: hidden;\n  transform: translateZ(0);\n}\n.swiper-virtual.swiper-css-mode {\n  .swiper-wrapper::after {\n    content: '';\n    position: absolute;\n    left: 0;\n    top: 0;\n    pointer-events: none;\n  }\n}\n.swiper-virtual.swiper-css-mode.swiper-horizontal {\n  .swiper-wrapper::after {\n    height: 1px;\n    width: var(--swiper-virtual-size);\n  }\n}\n\n.swiper-virtual.swiper-css-mode.swiper-vertical {\n  .swiper-wrapper::after {\n    width: 1px;\n    height: var(--swiper-virtual-size);\n  }\n}\n\n\n\n:root {\n  --swiper-navigation-size: 44px;\n  /*\n  --swiper-navigation-top-offset: 50%;\n  --swiper-navigation-sides-offset: 4px;\n  --swiper-navigation-color: var(--swiper-theme-color);\n  */\n}\n.swiper-button-prev,\n.swiper-button-next {\n  position: absolute;\n\n  width: var(--swiper-navigation-size);\n  height: var(--swiper-navigation-size);\n\n  z-index: 10;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--swiper-navigation-color, var(--swiper-theme-color));\n  &.swiper-button-disabled {\n    opacity: 0.35;\n    cursor: auto;\n    pointer-events: none;\n  }\n  &.swiper-button-hidden {\n    opacity: 0;\n    cursor: auto;\n    pointer-events: none;\n  }\n  .swiper-navigation-disabled & {\n    display: none !important;\n  }\n  svg {\n    width: 100%;\n    height: 100%;\n    object-fit: contain;\n    transform-origin: center;\n    fill: currentColor;\n    pointer-events: none;\n  }\n}\n\n.swiper-button-lock {\n  display: none;\n}\n\n.swiper-button-prev,\n.swiper-button-next {\n  top: var(--swiper-navigation-top-offset, 50%);\n  margin-top: calc(0px - (var(--swiper-navigation-size) / 2));\n}\n.swiper-button-prev {\n  left: var(--swiper-navigation-sides-offset, 4px);\n  right: auto;\n  .swiper-navigation-icon {\n    transform: rotate(180deg);\n  }\n}\n.swiper-button-next {\n  right: var(--swiper-navigation-sides-offset, 4px);\n  left: auto;\n}\n.swiper-horizontal {\n  .swiper-button-prev,\n  .swiper-button-next,\n  ~ .swiper-button-prev,\n  ~ .swiper-button-next {\n    top: var(--swiper-navigation-top-offset, 50%);\n    margin-top: calc(0px - (var(--swiper-navigation-size) / 2));\n    margin-left: 0;\n  }\n  .swiper-button-prev,\n  & ~ .swiper-button-prev,\n  &.swiper-rtl .swiper-button-next,\n  &.swiper-rtl ~ .swiper-button-next {\n    left: var(--swiper-navigation-sides-offset, 4px);\n    right: auto;\n  }\n  .swiper-button-next,\n  & ~ .swiper-button-next,\n  &.swiper-rtl .swiper-button-prev,\n  &.swiper-rtl ~ .swiper-button-prev {\n    right: var(--swiper-navigation-sides-offset, 4px);\n    left: auto;\n  }\n  .swiper-button-prev,\n  & ~ .swiper-button-prev,\n  &.swiper-rtl .swiper-button-next,\n  &.swiper-rtl ~ .swiper-button-next {\n    .swiper-navigation-icon {\n      transform: rotate(180deg);\n    }\n  }\n  &.swiper-rtl .swiper-button-prev,\n  &.swiper-rtl ~ .swiper-button-prev {\n    .swiper-navigation-icon {\n      transform: rotate(0deg);\n    }\n  }\n}\n.swiper-vertical {\n  .swiper-button-prev,\n  .swiper-button-next,\n  ~ .swiper-button-prev,\n  ~ .swiper-button-next {\n    left: var(--swiper-navigation-top-offset, 50%);\n    right: auto;\n    margin-left: calc(0px - (var(--swiper-navigation-size) / 2));\n    margin-top: 0;\n  }\n  .swiper-button-prev,\n  ~ .swiper-button-prev {\n    top: var(--swiper-navigation-sides-offset, 4px);\n    bottom: auto;\n    .swiper-navigation-icon {\n      transform: rotate(-90deg);\n    }\n  }\n  .swiper-button-next,\n  ~ .swiper-button-next {\n    bottom: var(--swiper-navigation-sides-offset, 4px);\n    top: auto;\n    .swiper-navigation-icon {\n      transform: rotate(90deg);\n    }\n  }\n}\n\n:root {\n  /*\n  --swiper-pagination-color: var(--swiper-theme-color);\n  --swiper-pagination-left: auto;\n  --swiper-pagination-right: 8px;\n  --swiper-pagination-bottom: 8px;\n  --swiper-pagination-top: auto;\n  --swiper-pagination-fraction-color: inherit;\n  --swiper-pagination-progressbar-bg-color: rgba(0,0,0,0.25);\n  --swiper-pagination-progressbar-size: 4px;\n  --swiper-pagination-bullet-size: 8px;\n  --swiper-pagination-bullet-width: 8px;\n  --swiper-pagination-bullet-height: 8px;\n  --swiper-pagination-bullet-border-radius: 50%;\n  --swiper-pagination-bullet-inactive-color: #000;\n  --swiper-pagination-bullet-inactive-opacity: 0.2;\n  --swiper-pagination-bullet-opacity: 1;\n  --swiper-pagination-bullet-horizontal-gap: 4px;\n  --swiper-pagination-bullet-vertical-gap: 6px;\n  */\n}\n.swiper-pagination {\n  position: absolute;\n  text-align: center;\n  transition: 300ms opacity;\n  transform: translate3d(0, 0, 0);\n  z-index: 10;\n  &.swiper-pagination-hidden {\n    opacity: 0;\n  }\n  .swiper-pagination-disabled > &,\n  &.swiper-pagination-disabled {\n    display: none !important;\n  }\n}\n/* Common Styles */\n.swiper-pagination-fraction,\n.swiper-pagination-custom,\n.swiper-horizontal > .swiper-pagination-bullets,\n.swiper-pagination-bullets.swiper-pagination-horizontal {\n  bottom: var(--swiper-pagination-bottom, 8px);\n  top: var(--swiper-pagination-top, auto);\n  left: 0;\n  width: 100%;\n}\n/* Bullets */\n.swiper-pagination-bullets-dynamic {\n  overflow: hidden;\n  font-size: 0;\n  .swiper-pagination-bullet {\n    transform: scale(0.33);\n    position: relative;\n  }\n  .swiper-pagination-bullet-active {\n    transform: scale(1);\n  }\n  .swiper-pagination-bullet-active-main {\n    transform: scale(1);\n  }\n  .swiper-pagination-bullet-active-prev {\n    transform: scale(0.66);\n  }\n  .swiper-pagination-bullet-active-prev-prev {\n    transform: scale(0.33);\n  }\n  .swiper-pagination-bullet-active-next {\n    transform: scale(0.66);\n  }\n  .swiper-pagination-bullet-active-next-next {\n    transform: scale(0.33);\n  }\n}\n.swiper-pagination-bullet {\n  width: var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 8px));\n  height: var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 8px));\n  display: inline-block;\n  border-radius: var(--swiper-pagination-bullet-border-radius, 50%);\n  background: var(--swiper-pagination-bullet-inactive-color, #000);\n  opacity: var(--swiper-pagination-bullet-inactive-opacity, 0.2);\n  button& {\n    border: none;\n    margin: 0;\n    padding: 0;\n    box-shadow: none;\n    appearance: none;\n  }\n  .swiper-pagination-clickable & {\n    cursor: pointer;\n  }\n\n  &:only-child {\n    display: none !important;\n  }\n}\n.swiper-pagination-bullet-active {\n  opacity: var(--swiper-pagination-bullet-opacity, 1);\n  background: var(--swiper-pagination-color, var(--swiper-theme-color));\n}\n\n.swiper-vertical > .swiper-pagination-bullets,\n.swiper-pagination-vertical.swiper-pagination-bullets {\n  right: var(--swiper-pagination-right, 8px);\n  left: var(--swiper-pagination-left, auto);\n  top: 50%;\n  transform: translate3d(0px, -50%, 0);\n  .swiper-pagination-bullet {\n    margin: var(--swiper-pagination-bullet-vertical-gap, 6px) 0;\n    display: block;\n  }\n  &.swiper-pagination-bullets-dynamic {\n    top: 50%;\n    transform: translateY(-50%);\n    width: 8px;\n    .swiper-pagination-bullet {\n      display: inline-block;\n      transition:\n        200ms transform,\n        200ms top;\n    }\n  }\n}\n.swiper-horizontal > .swiper-pagination-bullets,\n.swiper-pagination-horizontal.swiper-pagination-bullets {\n  .swiper-pagination-bullet {\n    margin: 0 var(--swiper-pagination-bullet-horizontal-gap, 4px);\n  }\n  &.swiper-pagination-bullets-dynamic {\n    left: 50%;\n    transform: translateX(-50%);\n    white-space: nowrap;\n    .swiper-pagination-bullet {\n      transition:\n        200ms transform,\n        200ms left;\n    }\n  }\n}\n.swiper-horizontal.swiper-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet {\n  transition:\n    200ms transform,\n    200ms right;\n}\n/* Fraction */\n.swiper-pagination-fraction {\n  color: var(--swiper-pagination-fraction-color, inherit);\n}\n/* Progress */\n.swiper-pagination-progressbar {\n  background: var(--swiper-pagination-progressbar-bg-color, rgba(0, 0, 0, 0.25));\n  position: absolute;\n  .swiper-pagination-progressbar-fill {\n    background: var(--swiper-pagination-color, var(--swiper-theme-color));\n    position: absolute;\n    left: 0;\n    top: 0;\n    width: 100%;\n    height: 100%;\n    transform: scale(0);\n    transform-origin: left top;\n  }\n  .swiper-rtl & .swiper-pagination-progressbar-fill {\n    transform-origin: right top;\n  }\n  .swiper-horizontal > &,\n  &.swiper-pagination-horizontal,\n  .swiper-vertical > &.swiper-pagination-progressbar-opposite,\n  &.swiper-pagination-vertical.swiper-pagination-progressbar-opposite {\n    width: 100%;\n    height: var(--swiper-pagination-progressbar-size, 4px);\n    left: 0;\n    top: 0;\n  }\n  .swiper-vertical > &,\n  &.swiper-pagination-vertical,\n  .swiper-horizontal > &.swiper-pagination-progressbar-opposite,\n  &.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite {\n    width: var(--swiper-pagination-progressbar-size, 4px);\n    height: 100%;\n    left: 0;\n    top: 0;\n  }\n}\n.swiper-pagination-lock {\n  display: none;\n}\n\n:root {\n  /*\n  --swiper-scrollbar-border-radius: 10px;\n  --swiper-scrollbar-top: auto;\n  --swiper-scrollbar-bottom: 4px;\n  --swiper-scrollbar-left: auto;\n  --swiper-scrollbar-right: 4px;\n  --swiper-scrollbar-sides-offset: 1%;\n  --swiper-scrollbar-bg-color: rgba(0, 0, 0, 0.1);\n  --swiper-scrollbar-drag-bg-color: rgba(0, 0, 0, 0.5);\n  --swiper-scrollbar-size: 4px;\n  */\n}\n.swiper-scrollbar {\n  border-radius: var(--swiper-scrollbar-border-radius, 10px);\n  position: relative;\n  touch-action: none;\n  background: var(--swiper-scrollbar-bg-color, rgba(0, 0, 0, 0.1));\n  .swiper-scrollbar-disabled > &,\n  &.swiper-scrollbar-disabled {\n    display: none !important;\n  }\n  .swiper-horizontal > &,\n  &.swiper-scrollbar-horizontal {\n    position: absolute;\n    left: var(--swiper-scrollbar-sides-offset, 1%);\n    bottom: var(--swiper-scrollbar-bottom, 4px);\n    top: var(--swiper-scrollbar-top, auto);\n    z-index: 50;\n    height: var(--swiper-scrollbar-size, 4px);\n    width: calc(100% - 2 * var(--swiper-scrollbar-sides-offset, 1%));\n  }\n  .swiper-vertical > &,\n  &.swiper-scrollbar-vertical {\n    position: absolute;\n    left: var(--swiper-scrollbar-left, auto);\n    right: var(--swiper-scrollbar-right, 4px);\n    top: var(--swiper-scrollbar-sides-offset, 1%);\n    z-index: 50;\n    width: var(--swiper-scrollbar-size, 4px);\n    height: calc(100% - 2 * var(--swiper-scrollbar-sides-offset, 1%));\n  }\n}\n.swiper-scrollbar-drag {\n  height: 100%;\n  width: 100%;\n  position: relative;\n  background: var(--swiper-scrollbar-drag-bg-color, rgba(0, 0, 0, 0.5));\n  border-radius: var(--swiper-scrollbar-border-radius, 10px);\n  left: 0;\n  top: 0;\n}\n.swiper-scrollbar-cursor-drag {\n  cursor: move;\n}\n.swiper-scrollbar-lock {\n  display: none;\n}\n\n\n/* Zoom container styles start */\n.swiper-zoom-container {\n  width: 100%;\n  height: 100%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  text-align: center;\n\n  > img,\n  > svg,\n  > canvas {\n    max-width: 100%;\n    max-height: 100%;\n    object-fit: contain;\n  }\n}\n/* Zoom container styles end */\n\n.swiper-slide-zoomed {\n  cursor: move;\n  touch-action: none;\n}\n\n\n/* a11y */\n.swiper .swiper-notification {\n  position: absolute;\n  left: 0;\n  top: 0;\n  pointer-events: none;\n  opacity: 0;\n  z-index: -1000;\n}\n\n\n\n\n.swiper-thumbs {\n  .swiper-slide-thumb-active {\n    /* Styles for active thumb slide */\n  }\n}\n\n.swiper-free-mode > .swiper-wrapper {\n  transition-timing-function: ease-out;\n  margin: 0 auto;\n}\n\n.swiper-grid > .swiper-wrapper {\n  flex-wrap: wrap;\n}\n.swiper-grid-column > .swiper-wrapper {\n  flex-wrap: wrap;\n  flex-direction: column;\n}\n\n\n.swiper-fade {\n  &.swiper-free-mode {\n    .swiper-slide {\n      transition-timing-function: ease-out;\n    }\n  }\n  .swiper-slide {\n    pointer-events: none;\n    transition-property: opacity;\n    .swiper-slide {\n      pointer-events: none;\n    }\n  }\n  .swiper-slide-active {\n    pointer-events: auto;\n    & .swiper-slide-active {\n      pointer-events: auto;\n    }\n  }\n}\n\n.swiper.swiper-cube {\n  overflow: visible;\n}\n.swiper-cube {\n  .swiper-slide {\n    pointer-events: none;\n    backface-visibility: hidden;\n    z-index: 1;\n    visibility: hidden;\n    transform-origin: 0 0;\n    width: 100%;\n    height: 100%;\n    .swiper-slide {\n      pointer-events: none;\n    }\n  }\n  &.swiper-rtl .swiper-slide {\n    transform-origin: 100% 0;\n  }\n  .swiper-slide-active {\n    &,\n    & .swiper-slide-active {\n      pointer-events: auto;\n    }\n  }\n  .swiper-slide-active,\n  .swiper-slide-next,\n  .swiper-slide-prev {\n    pointer-events: auto;\n    visibility: visible;\n  }\n\n  .swiper-cube-shadow {\n    position: absolute;\n    left: 0;\n    bottom: 0px;\n    width: 100%;\n    height: 100%;\n    opacity: 0.6;\n    z-index: 0;\n\n    &:before {\n      content: '';\n      background: #000;\n      position: absolute;\n      left: 0;\n      top: 0;\n      bottom: 0;\n      right: 0;\n      filter: blur(50px);\n    }\n  }\n}\n.swiper-cube {\n  .swiper-slide-next + .swiper-slide {\n    pointer-events: auto;\n    visibility: visible;\n  }\n}\n/* Cube slide shadows start */\n.swiper-cube {\n  .swiper-slide-shadow-cube.swiper-slide-shadow-top,\n  .swiper-slide-shadow-cube.swiper-slide-shadow-bottom,\n  .swiper-slide-shadow-cube.swiper-slide-shadow-left,\n  .swiper-slide-shadow-cube.swiper-slide-shadow-right {\n    z-index: 0;\n    backface-visibility: hidden;\n  }\n}\n/* Cube slide shadows end */\n\n.swiper.swiper-flip {\n  overflow: visible;\n}\n.swiper-flip {\n  .swiper-slide {\n    pointer-events: none;\n    backface-visibility: hidden;\n    z-index: 1;\n    .swiper-slide {\n      pointer-events: none;\n    }\n  }\n  .swiper-slide-active {\n    &,\n    & .swiper-slide-active {\n      pointer-events: auto;\n    }\n  }\n}\n/* Flip slide shadows start */\n.swiper-flip {\n  .swiper-slide-shadow-flip.swiper-slide-shadow-top,\n  .swiper-slide-shadow-flip.swiper-slide-shadow-bottom,\n  .swiper-slide-shadow-flip.swiper-slide-shadow-left,\n  .swiper-slide-shadow-flip.swiper-slide-shadow-right {\n    z-index: 0;\n    backface-visibility: hidden;\n  }\n}\n/* Flip slide shadows end */\n\n.swiper-coverflow {\n}\n\n.swiper-creative {\n  .swiper-slide {\n    backface-visibility: hidden;\n    overflow: hidden;\n    transition-property: transform, opacity, height;\n  }\n}\n\n.swiper.swiper-cards {\n  overflow: visible;\n}\n.swiper-cards {\n  .swiper-slide {\n    transform-origin: center bottom;\n    backface-visibility: hidden;\n    overflow: hidden;\n  }\n}\n\n.swiper {\n  overflow: clip;\n}\n\n.s-slider-vertical .s-slider-container {\n  min-width: 0;\n}";
+const sallaSliderCss = () => `  :root {   --swiper-theme-color: #007aff;    } :host {   position: relative;   display: block;   margin-left: auto;   margin-right: auto;   z-index: 1; } .swiper {   margin-left: auto;   margin-right: auto;   position: relative;   overflow: hidden;   list-style: none;   padding: 0;      z-index: 1;   display: block; } .swiper-vertical > .swiper-wrapper {   flex-direction: column; } .swiper-wrapper {   position: relative;   width: 100%;   height: 100%;   z-index: 1;   display: flex;   transition-property: transform;   transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);   box-sizing: content-box; } .swiper-android .swiper-slide, .swiper-ios .swiper-slide, .swiper-wrapper {   transform: translate3d(0px, 0, 0); } .swiper-horizontal {   touch-action: pan-y; } .swiper-vertical {   touch-action: pan-x; } .swiper-slide {   flex-shrink: 0;   width: 100%;   height: 100%;   position: relative;   transition-property: transform;   display: block; } .swiper-slide-invisible-blank {   visibility: hidden; }  .swiper-autoheight, .swiper-autoheight .swiper-slide {   height: auto; } .swiper-autoheight .swiper-wrapper {   align-items: flex-start;   transition-property: transform, height; } .swiper-backface-hidden .swiper-slide {   transform: translateZ(0);   backface-visibility: hidden; }  .swiper-3d.swiper-css-mode .swiper-wrapper {   perspective: 1200px; } .swiper-3d .swiper-wrapper {   transform-style: preserve-3d; } .swiper-3d {   perspective: 1200px;   .swiper-slide,   .swiper-cube-shadow {     transform-style: preserve-3d;   } }   .swiper-css-mode {   > .swiper-wrapper {     overflow: auto;     scrollbar-width: none;      -ms-overflow-style: none;      &::-webkit-scrollbar {       display: none;     }   }   > .swiper-wrapper > .swiper-slide {     scroll-snap-align: start start;   }   &.swiper-horizontal {     > .swiper-wrapper {       scroll-snap-type: x mandatory;     }     > .swiper-wrapper > .swiper-slide:first-child {       margin-inline-start: var(--swiper-slides-offset-before);       scroll-margin-inline-start: var(--swiper-slides-offset-before);     }     > .swiper-wrapper > .swiper-slide:last-child {       margin-inline-end: var(--swiper-slides-offset-after);     }   }   &.swiper-vertical {     > .swiper-wrapper {       scroll-snap-type: y mandatory;     }     > .swiper-wrapper > .swiper-slide:first-child {       margin-block-start: var(--swiper-slides-offset-before);       scroll-margin-block-start: var(--swiper-slides-offset-before);     }     > .swiper-wrapper > .swiper-slide:last-child {       margin-block-end: var(--swiper-slides-offset-after);     }   }   &.swiper-free-mode {     > .swiper-wrapper {       scroll-snap-type: none;     }     > .swiper-wrapper > .swiper-slide {       scroll-snap-align: none;     }   }   &.swiper-centered {     > .swiper-wrapper::before {       content: '';       flex-shrink: 0;       order: 9999;     }     > .swiper-wrapper > .swiper-slide {       scroll-snap-align: center center;       scroll-snap-stop: always;     }   }   &.swiper-centered.swiper-horizontal {     > .swiper-wrapper > .swiper-slide:first-child {       margin-inline-start: var(--swiper-centered-offset-before);     }     > .swiper-wrapper::before {       height: 100%;       min-height: 1px;       width: var(--swiper-centered-offset-after);     }   }   &.swiper-centered.swiper-vertical {     > .swiper-wrapper > .swiper-slide:first-child {       margin-block-start: var(--swiper-centered-offset-before);     }     > .swiper-wrapper::before {       width: 100%;       min-width: 1px;       height: var(--swiper-centered-offset-after);     }   } }    .swiper-3d {   .swiper-slide-shadow,   .swiper-slide-shadow-left,   .swiper-slide-shadow-right,   .swiper-slide-shadow-top,   .swiper-slide-shadow-bottom,   .swiper-slide-shadow,   .swiper-slide-shadow-left,   .swiper-slide-shadow-right,   .swiper-slide-shadow-top,   .swiper-slide-shadow-bottom {     position: absolute;     left: 0;     top: 0;     width: 100%;     height: 100%;     pointer-events: none;     z-index: 10;   }   .swiper-slide-shadow {     background: rgba(0, 0, 0, 0.15);   }   .swiper-slide-shadow-left {     background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));   }   .swiper-slide-shadow-right {     background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));   }   .swiper-slide-shadow-top {     background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));   }   .swiper-slide-shadow-bottom {     background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));   } } .swiper-lazy-preloader {   width: 42px;   height: 42px;   position: absolute;   left: 50%;   top: 50%;   margin-left: -21px;   margin-top: -21px;   z-index: 10;   transform-origin: 50%;   box-sizing: border-box;   border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));   border-radius: 50%;   border-top-color: transparent; } .swiper:not(.swiper-watch-progress), .swiper-watch-progress .swiper-slide-visible {   .swiper-lazy-preloader {     animation: swiper-preloader-spin 1s infinite linear;   } } .swiper-lazy-preloader-white {   --swiper-preloader-color: #fff; } .swiper-lazy-preloader-black {   --swiper-preloader-color: #000; } @keyframes swiper-preloader-spin {   0% {     transform: rotate(0deg);   }   100% {     transform: rotate(360deg);   } }   .swiper-virtual .swiper-slide {   -webkit-backface-visibility: hidden;   transform: translateZ(0); } .swiper-virtual.swiper-css-mode {   .swiper-wrapper::after {     content: '';     position: absolute;     left: 0;     top: 0;     pointer-events: none;   } } .swiper-virtual.swiper-css-mode.swiper-horizontal {   .swiper-wrapper::after {     height: 1px;     width: var(--swiper-virtual-size);   } }  .swiper-virtual.swiper-css-mode.swiper-vertical {   .swiper-wrapper::after {     width: 1px;     height: var(--swiper-virtual-size);   } }    :root {   --swiper-navigation-size: 44px;    } .swiper-button-prev, .swiper-button-next {   position: absolute;    width: var(--swiper-navigation-size);   height: var(--swiper-navigation-size);    z-index: 10;   cursor: pointer;   display: flex;   align-items: center;   justify-content: center;   color: var(--swiper-navigation-color, var(--swiper-theme-color));   &.swiper-button-disabled {     opacity: 0.35;     cursor: auto;     pointer-events: none;   }   &.swiper-button-hidden {     opacity: 0;     cursor: auto;     pointer-events: none;   }   .swiper-navigation-disabled & {     display: none !important;   }    ::slotted(svg),   svg {     width: 100%;     height: 100%;     object-fit: contain;     transform-origin: center;     fill: currentColor;     pointer-events: none;   } }  .swiper-button-lock {   display: none; }  .swiper-button-prev, .swiper-button-next {   top: var(--swiper-navigation-top-offset, 50%);   margin-top: calc(0px - (var(--swiper-navigation-size) / 2)); } .swiper-button-prev {   left: var(--swiper-navigation-sides-offset, 4px);   right: auto;   ::slotted(.swiper-navigation-icon),   .swiper-navigation-icon {     transform: rotate(180deg);   } } .swiper-button-next {   right: var(--swiper-navigation-sides-offset, 4px);   left: auto; } .swiper-horizontal {   .swiper-button-prev,   .swiper-button-next,   ~ .swiper-button-prev,   ~ .swiper-button-next {     top: var(--swiper-navigation-top-offset, 50%);     margin-top: calc(0px - (var(--swiper-navigation-size) / 2));     margin-left: 0;   }   .swiper-button-prev,   & ~ .swiper-button-prev,   &.swiper-rtl .swiper-button-next,   &.swiper-rtl ~ .swiper-button-next {     left: var(--swiper-navigation-sides-offset, 4px);     right: auto;   }   .swiper-button-next,   & ~ .swiper-button-next,   &.swiper-rtl .swiper-button-prev,   &.swiper-rtl ~ .swiper-button-prev {     right: var(--swiper-navigation-sides-offset, 4px);     left: auto;   }   .swiper-button-prev,   & ~ .swiper-button-prev,   &.swiper-rtl .swiper-button-next,   &.swiper-rtl ~ .swiper-button-next {     ::slotted(.swiper-navigation-icon),     .swiper-navigation-icon {       transform: rotate(180deg);     }   }   &.swiper-rtl .swiper-button-prev,   &.swiper-rtl ~ .swiper-button-prev {     ::slotted(.swiper-navigation-icon),     .swiper-navigation-icon {       transform: rotate(0deg);     }   } } .swiper-vertical {   .swiper-button-prev,   .swiper-button-next,   ~ .swiper-button-prev,   ~ .swiper-button-next {     left: var(--swiper-navigation-top-offset, 50%);     right: auto;     margin-left: calc(0px - (var(--swiper-navigation-size) / 2));     margin-top: 0;   }   .swiper-button-prev,   ~ .swiper-button-prev {     top: var(--swiper-navigation-sides-offset, 4px);     bottom: auto;     ::slotted(.swiper-navigation-icon),     .swiper-navigation-icon {       transform: rotate(-90deg);     }   }   .swiper-button-next,   ~ .swiper-button-next {     bottom: var(--swiper-navigation-sides-offset, 4px);     top: auto;     ::slotted(.swiper-navigation-icon),     .swiper-navigation-icon {       transform: rotate(90deg);     }   } }  :root {    } .swiper-pagination {   position: absolute;   text-align: center;   transition: 300ms opacity;   transform: translate3d(0, 0, 0);   z-index: 10;   &.swiper-pagination-hidden {     opacity: 0;   }   .swiper-pagination-disabled > &,   &.swiper-pagination-disabled {     display: none !important;   } }  .swiper-pagination-fraction, .swiper-pagination-custom, .swiper-horizontal > .swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal {   bottom: var(--swiper-pagination-bottom, 8px);   top: var(--swiper-pagination-top, auto);   left: 0;   width: 100%; }  .swiper-pagination-bullets-dynamic {   overflow: hidden;   font-size: 0;   .swiper-pagination-bullet {     transform: scale(0.33);     position: relative;   }   .swiper-pagination-bullet-active {     transform: scale(1);   }   .swiper-pagination-bullet-active-main {     transform: scale(1);   }   .swiper-pagination-bullet-active-prev {     transform: scale(0.66);   }   .swiper-pagination-bullet-active-prev-prev {     transform: scale(0.33);   }   .swiper-pagination-bullet-active-next {     transform: scale(0.66);   }   .swiper-pagination-bullet-active-next-next {     transform: scale(0.33);   } } .swiper-pagination-bullet {   width: var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 8px));   height: var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 8px));   display: inline-block;   border-radius: var(--swiper-pagination-bullet-border-radius, 50%);   background: var(--swiper-pagination-bullet-inactive-color, #000);   opacity: var(--swiper-pagination-bullet-inactive-opacity, 0.2);   button& {     border: none;     margin: 0;     padding: 0;     box-shadow: none;     appearance: none;   }   .swiper-pagination-clickable & {     cursor: pointer;   }    &:only-child {     display: none !important;   } } .swiper-pagination-bullet-active {   opacity: var(--swiper-pagination-bullet-opacity, 1);   background: var(--swiper-pagination-color, var(--swiper-theme-color)); }  .swiper-vertical > .swiper-pagination-bullets, .swiper-pagination-vertical.swiper-pagination-bullets {   right: var(--swiper-pagination-right, 8px);   left: var(--swiper-pagination-left, auto);   top: 50%;   transform: translate3d(0px, -50%, 0);   .swiper-pagination-bullet {     margin: var(--swiper-pagination-bullet-vertical-gap, 6px) 0;     display: block;   }   &.swiper-pagination-bullets-dynamic {     top: 50%;     transform: translateY(-50%);     width: 8px;     .swiper-pagination-bullet {       display: inline-block;       transition:         200ms transform,         200ms top;     }   } } .swiper-horizontal > .swiper-pagination-bullets, .swiper-pagination-horizontal.swiper-pagination-bullets {   .swiper-pagination-bullet {     margin: 0 var(--swiper-pagination-bullet-horizontal-gap, 4px);   }   &.swiper-pagination-bullets-dynamic {     left: 50%;     transform: translateX(-50%);     white-space: nowrap;     .swiper-pagination-bullet {       transition:         200ms transform,         200ms left;     }   } } .swiper-horizontal.swiper-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet {   transition:     200ms transform,     200ms right; }  .swiper-pagination-fraction {   color: var(--swiper-pagination-fraction-color, inherit); }  .swiper-pagination-progressbar {   background: var(--swiper-pagination-progressbar-bg-color, rgba(0, 0, 0, 0.25));   position: absolute;   .swiper-pagination-progressbar-fill {     background: var(--swiper-pagination-color, var(--swiper-theme-color));     position: absolute;     left: 0;     top: 0;     width: 100%;     height: 100%;     transform: scale(0);     transform-origin: left top;   }   .swiper-rtl & .swiper-pagination-progressbar-fill {     transform-origin: right top;   }   .swiper-horizontal > &,   &.swiper-pagination-horizontal,   .swiper-vertical > &.swiper-pagination-progressbar-opposite,   &.swiper-pagination-vertical.swiper-pagination-progressbar-opposite {     width: 100%;     height: var(--swiper-pagination-progressbar-size, 4px);     left: 0;     top: 0;   }   .swiper-vertical > &,   &.swiper-pagination-vertical,   .swiper-horizontal > &.swiper-pagination-progressbar-opposite,   &.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite {     width: var(--swiper-pagination-progressbar-size, 4px);     height: 100%;     left: 0;     top: 0;   } } .swiper-pagination-lock {   display: none; }  :root {    } .swiper-scrollbar {   border-radius: var(--swiper-scrollbar-border-radius, 10px);   position: relative;   touch-action: none;   background: var(--swiper-scrollbar-bg-color, rgba(0, 0, 0, 0.1));   .swiper-scrollbar-disabled > &,   &.swiper-scrollbar-disabled {     display: none !important;   }   .swiper-horizontal > &,   &.swiper-scrollbar-horizontal {     position: absolute;     left: var(--swiper-scrollbar-sides-offset, 1%);     bottom: var(--swiper-scrollbar-bottom, 4px);     top: var(--swiper-scrollbar-top, auto);     z-index: 50;     height: var(--swiper-scrollbar-size, 4px);     width: calc(100% - 2 * var(--swiper-scrollbar-sides-offset, 1%));   }   .swiper-vertical > &,   &.swiper-scrollbar-vertical {     position: absolute;     left: var(--swiper-scrollbar-left, auto);     right: var(--swiper-scrollbar-right, 4px);     top: var(--swiper-scrollbar-sides-offset, 1%);     z-index: 50;     width: var(--swiper-scrollbar-size, 4px);     height: calc(100% - 2 * var(--swiper-scrollbar-sides-offset, 1%));   } } .swiper-scrollbar-drag {   height: 100%;   width: 100%;   position: relative;   background: var(--swiper-scrollbar-drag-bg-color, rgba(0, 0, 0, 0.5));   border-radius: var(--swiper-scrollbar-border-radius, 10px);   left: 0;   top: 0; } .swiper-scrollbar-cursor-drag {   cursor: move; } .swiper-scrollbar-lock {   display: none; }    .swiper-zoom-container {   width: 100%;   height: 100%;   display: flex;   justify-content: center;   align-items: center;   text-align: center;    > img,   > svg,   > canvas {     max-width: 100%;     max-height: 100%;     object-fit: contain;   } }   .swiper-slide-zoomed {   cursor: move;   touch-action: none; }    .swiper .swiper-notification {   position: absolute;   left: 0;   top: 0;   pointer-events: none;   opacity: 0;   z-index: -1000; }     .swiper-thumbs {   .swiper-slide-thumb-active {        } }  .swiper-free-mode > .swiper-wrapper {   transition-timing-function: ease-out;   margin: 0 auto; }  .swiper-grid > .swiper-wrapper {   flex-wrap: wrap; } .swiper-grid-column > .swiper-wrapper {   flex-wrap: wrap;   flex-direction: column; }   .swiper-fade {   &.swiper-free-mode {     .swiper-slide {       transition-timing-function: ease-out;     }   }   .swiper-slide {     pointer-events: none;     transition-property: opacity;     .swiper-slide {       pointer-events: none;     }   }   .swiper-slide-active {     pointer-events: auto;     & .swiper-slide-active {       pointer-events: auto;     }   } }  .swiper.swiper-cube {   overflow: visible; } .swiper-cube {   .swiper-slide {     pointer-events: none;     backface-visibility: hidden;     z-index: 1;     visibility: hidden;     transform-origin: 0 0;     width: 100%;     height: 100%;     .swiper-slide {       pointer-events: none;     }   }   &.swiper-rtl .swiper-slide {     transform-origin: 100% 0;   }   .swiper-slide-active {     &,     & .swiper-slide-active {       pointer-events: auto;     }   }   .swiper-slide-active,   .swiper-slide-next,   .swiper-slide-prev {     pointer-events: auto;     visibility: visible;   }    .swiper-cube-shadow {     position: absolute;     left: 0;     bottom: 0px;     width: 100%;     height: 100%;     opacity: 0.6;     z-index: 0;      &:before {       content: '';       background: #000;       position: absolute;       left: 0;       top: 0;       bottom: 0;       right: 0;       filter: blur(50px);     }   } } .swiper-cube {   .swiper-slide-next + .swiper-slide {     pointer-events: auto;     visibility: visible;   } }  .swiper-cube {   .swiper-slide-shadow-cube.swiper-slide-shadow-top,   .swiper-slide-shadow-cube.swiper-slide-shadow-bottom,   .swiper-slide-shadow-cube.swiper-slide-shadow-left,   .swiper-slide-shadow-cube.swiper-slide-shadow-right {     z-index: 0;     backface-visibility: hidden;   } }   .swiper.swiper-flip {   overflow: visible; } .swiper-flip {   .swiper-slide {     pointer-events: none;     backface-visibility: hidden;     z-index: 1;     .swiper-slide {       pointer-events: none;     }   }   .swiper-slide-active {     &,     & .swiper-slide-active {       pointer-events: auto;     }   } }  .swiper-flip {   .swiper-slide-shadow-flip.swiper-slide-shadow-top,   .swiper-slide-shadow-flip.swiper-slide-shadow-bottom,   .swiper-slide-shadow-flip.swiper-slide-shadow-left,   .swiper-slide-shadow-flip.swiper-slide-shadow-right {     z-index: 0;     backface-visibility: hidden;   } }   .swiper-coverflow { }  .swiper-creative {   .swiper-slide {     backface-visibility: hidden;     overflow: hidden;     transition-property: transform, opacity, height;   } }  .swiper.swiper-cards {   overflow: visible; } .swiper-cards {   .swiper-slide {     transform-origin: center bottom;     backface-visibility: hidden;     overflow: hidden;   } }  .swiper {   overflow: clip; }  .s-slider-vertical .s-slider-container {   min-width: 0; }`;
 
 const SallaSlider = class {
     constructor(hostRef) {
@@ -10414,6 +10420,6 @@ const SallaSlider = class {
     }
     get host() { return getElement(this); }
 };
-SallaSlider.style = sallaSliderCss;
+SallaSlider.style = sallaSliderCss();
 
 export { SallaSlider as salla_slider };

package/dist/esm/salla-social-share.entry.js

@@ -1,7 +1,7 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { r as registerInstance, h, a as getElement } from './index-BBHnyTVS.js';
+import { r as registerInstance, h, g as getElement } from './index-DYB20YqN.js';
 import { a as anime } from './anime.es-CgtvEd63.js';
 import { f as facebook, t as twitter } from './facebook-CO-PeZ27.js';
 import { M as MailIcon } from './mail-DmgxDvXL.js';
@@ -37,7 +37,7 @@ var ShareAlt = `<!-- Generated by IcoMoon.io -->
 </svg>
 `;
 
-const sallaSocialShareCss = "";
+const sallaSocialShareCss = () => ``;
 
 const SallaSocialShare = class {
     constructor(hostRef) {
@@ -158,6 +158,6 @@ const SallaSocialShare = class {
     }
     get host() { return getElement(this); }
 };
-SallaSocialShare.style = sallaSocialShareCss;
+SallaSocialShare.style = sallaSocialShareCss();
 
 export { SallaSocialShare as salla_social_share };

package/dist/esm/salla-social.entry.js

@@ -1,7 +1,7 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { r as registerInstance, h, H as Host, a as getElement } from './index-BBHnyTVS.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-DYB20YqN.js';
 import { f as facebook, t as twitter } from './facebook-CO-PeZ27.js';
 
 var instagram = `<!-- Generated by IcoMoon.io -->
@@ -32,7 +32,7 @@ var tiktok = `<!-- Generated by IcoMoon.io -->
 </svg>
 `;
 
-const sallaSocialCss = ":host{display:block}";
+const sallaSocialCss = () => `:host{display:block}`;
 
 const SallaSocial = class {
     constructor(hostRef) {
@@ -66,6 +66,6 @@ const SallaSocial = class {
     }
     get host() { return getElement(this); }
 };
-SallaSocial.style = sallaSocialCss;
+SallaSocial.style = sallaSocialCss();
 
 export { SallaSocial as salla_social };

package/dist/esm/salla-tab-content_3.entry.js

@@ -1,9 +1,9 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { r as registerInstance, h, c as createEvent, a as getElement } from './index-BBHnyTVS.js';
+import { r as registerInstance, h, c as createEvent, g as getElement } from './index-DYB20YqN.js';
 
-const sallaTabContentCss = "";
+const sallaTabContentCss = () => ``;
 
 const SallaTabContent = class {
     constructor(hostRef) {
@@ -34,13 +34,13 @@ const SallaTabContent = class {
         return (h("div", { key: '13737e2a7a7bce59e8ddc38b3b4d5159a4aa67be', class: classes }, h("slot", { key: '56dbae26f78adaf732311a06ec7f9f70e3d4eb2d' })));
     }
 };
-SallaTabContent.style = sallaTabContentCss;
+SallaTabContent.style = sallaTabContentCss();
 
 function generateRandomId() {
     return Math.random().toString(36).slice(2, 10);
 }
 
-const sallaTabHeaderCss = "";
+const sallaTabHeaderCss = () => ``;
 
 const SallaTabHeader = class {
     constructor(hostRef) {
@@ -94,9 +94,9 @@ const SallaTabHeader = class {
         ];
     }
 };
-SallaTabHeader.style = sallaTabHeaderCss;
+SallaTabHeader.style = sallaTabHeaderCss();
 
-const sallaTabsCss = ".s-tabs-header{-ms-overflow-style:none;scrollbar-width:none;}.s-tabs-header::-webkit-scrollbar{display:none}";
+const sallaTabsCss = () => `.s-tabs-header{-ms-overflow-style:none;scrollbar-width:none;}.s-tabs-header::-webkit-scrollbar{display:none}`;
 
 const SallaTabs = class {
     constructor(hostRef) {
@@ -148,6 +148,6 @@ const SallaTabs = class {
     }
     get host() { return getElement(this); }
 };
-SallaTabs.style = sallaTabsCss;
+SallaTabs.style = sallaTabsCss();
 
 export { SallaTabContent as salla_tab_content, SallaTabHeader as salla_tab_header, SallaTabs as salla_tabs };

package/dist/esm/salla-tiered-offer.entry.js

@@ -1,7 +1,7 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { r as registerInstance, h, H as Host } from './index-BBHnyTVS.js';
+import { r as registerInstance, h, H as Host } from './index-DYB20YqN.js';
 
 var DiscountType;
 (function (DiscountType) {
@@ -70,7 +70,7 @@ class TierUtils {
     }
 }
 
-const sallaTieredOfferCss = ".s-tiered-offer-milestone-icon svg{color:currentColor}.s-tiered-offer-milestone-icon svg path{stroke:currentColor;fill:none}.s-tiered-offer-milestone-icon.s-tiered-offer-milestone-active svg path,.s-tiered-offer-milestone-icon.s-tiered-offer-milestone-completed svg path{fill:currentColor;stroke:none}.s-tiered-offer-milestone-icon.s-tiered-offer-milestone-active svg[fill=none] path,.s-tiered-offer-milestone-icon.s-tiered-offer-milestone-completed svg[fill=none] path{fill:none;stroke:currentColor}[dir=rtl] .s-tiered-offer-progress-wrapper .s-tiered-offer-progress-bg{transform:scaleX(-1)}[dir=rtl] .s-tiered-offer-progress-wrapper .s-tiered-offer-progress-fill{transform:scaleX(-1);left:auto}[dir=rtl] .flip-x{transform:scaleX(-1)}";
+const sallaTieredOfferCss = () => `.s-tiered-offer-milestone-icon svg{color:currentColor}.s-tiered-offer-milestone-icon svg path{stroke:currentColor;fill:none}.s-tiered-offer-milestone-icon.s-tiered-offer-milestone-active svg path,.s-tiered-offer-milestone-icon.s-tiered-offer-milestone-completed svg path{fill:currentColor;stroke:none}.s-tiered-offer-milestone-icon.s-tiered-offer-milestone-active svg[fill=none] path,.s-tiered-offer-milestone-icon.s-tiered-offer-milestone-completed svg[fill=none] path{fill:none;stroke:currentColor}[dir=rtl] .s-tiered-offer-progress-wrapper .s-tiered-offer-progress-bg{transform:scaleX(-1)}[dir=rtl] .s-tiered-offer-progress-wrapper .s-tiered-offer-progress-fill{transform:scaleX(-1);left:auto}[dir=rtl] .flip-x{transform:scaleX(-1)}`;
 
 const SallaTieredOffer = class {
     constructor(hostRef) {
@@ -328,6 +328,6 @@ const SallaTieredOffer = class {
         return (h(Host, null, h("div", { class: "s-tiered-offer-container" }, h("div", { class: "s-tiered-offer-header" }, h("div", { class: "s-tiered-offer-header-content" }, h("p", { class: "s-tiered-offer-program-title" }, this.loyaltyProgramText), h("div", { class: "s-tiered-offer-current-tier-name-wrapper" }, h("h2", { class: "s-tiered-offer-current-tier" }, this.currentTierText, " ", h("span", { class: "s-tiered-offer-tier-name" }, currentTierData.name)), h("span", { innerHTML: currentTierData.icon })))), this.renderProgressBar(), this.renderTabs())));
     }
 };
-SallaTieredOffer.style = sallaTieredOfferCss;
+SallaTieredOffer.style = sallaTieredOfferCss();
 
 export { SallaTieredOffer as salla_tiered_offer };

package/dist/esm/salla-tooltip.entry.js

@@ -1,9 +1,9 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { r as registerInstance, h, a as getElement } from './index-BBHnyTVS.js';
+import { r as registerInstance, h, g as getElement } from './index-DYB20YqN.js';
 
-const sallaTooltipCss = ".s-tooltip-container{position:relative;display:inline-block}.s-tooltip-item{position:absolute;transform:translateX(-39%);background-color:#baf3e6;color:#004d5a;bottom:100%;left:50%;text-align:center;border-radius:5px;z-index:1;white-space:nowrap;opacity:0;transition:opacity 0.3s;pointer-events:none;margin:0 0 16px 8px;padding:12px;max-width:150px;width:190px;white-space:normal;opacity:1}.s-tooltip-item::after{content:\"\";position:absolute;bottom:-10px;left:50%;margin-left:-5px;border-width:5px;border-style:solid;border-color:#baf3e6 transparent transparent transparent}.s-tooltip-item:dir(ltr){transform:translateX(-72%)}.s-tooltip-item--dark{background-color:#555555;color:white;padding:5px 15px;border-radius:8px;font-size:12px;font-weight:normal;max-width:330px;width:max-content}.s-tooltip-item--dark::after{border-color:#555555 transparent transparent transparent}";
+const sallaTooltipCss = () => `.s-tooltip-container{position:relative;display:inline-block}.s-tooltip-item{position:absolute;transform:translateX(-39%);background-color:#baf3e6;color:#004d5a;bottom:100%;left:50%;text-align:center;border-radius:5px;z-index:1;white-space:nowrap;opacity:0;transition:opacity 0.3s;pointer-events:none;margin:0 0 16px 8px;padding:12px;max-width:150px;width:190px;white-space:normal;opacity:1}.s-tooltip-item::after{content:"";position:absolute;bottom:-10px;left:50%;margin-left:-5px;border-width:5px;border-style:solid;border-color:#baf3e6 transparent transparent transparent}.s-tooltip-item:dir(ltr){transform:translateX(-72%)}.s-tooltip-item--dark{background-color:#555555;color:white;padding:5px 15px;border-radius:8px;font-size:12px;font-weight:normal;max-width:330px;width:max-content}.s-tooltip-item--dark::after{border-color:#555555 transparent transparent transparent}`;
 
 const SallaTooltip = class {
     constructor(hostRef) {
@@ -35,6 +35,6 @@ const SallaTooltip = class {
     }
     get el() { return getElement(this); }
 };
-SallaTooltip.style = sallaTooltipCss;
+SallaTooltip.style = sallaTooltipCss();
 
 export { SallaTooltip as salla_tooltip };

package/dist/esm/salla-trust-badges.entry.js

@@ -1,9 +1,9 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { r as registerInstance, h, H as Host } from './index-BBHnyTVS.js';
+import { r as registerInstance, h, H as Host } from './index-DYB20YqN.js';
 
-const sallaTrustBadgesCss = "";
+const sallaTrustBadgesCss = () => ``;
 
 const SallaTrustBadges = class {
     constructor(hostRef) {
@@ -66,6 +66,6 @@ const SallaTrustBadges = class {
         return (h(Host, { class: `s-trust-badges-wrapper ${this.dark ? 'dark' : ''}` }, h("img", { class: "s-trust-badges-image", width: "55", height: "55", src: badgeData.imageUrl, alt: badgeData.label }), h("div", { class: "s-trust-badges-content" }, h("p", { class: "s-trust-badges-label" }, badgeData.label), h("b", { class: "s-trust-badges-number" }, badgeData.number))));
     }
 };
-SallaTrustBadges.style = sallaTrustBadgesCss;
+SallaTrustBadges.style = sallaTrustBadgesCss();
 
 export { SallaTrustBadges as salla_trust_badges };

package/dist/esm/salla-user-menu.entry.js

@@ -1,7 +1,7 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { r as registerInstance, h, H as Host, a as getElement } from './index-BBHnyTVS.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-DYB20YqN.js';
 import { A as ArrowDown } from './keyboard_arrow_down-DCZbpt2a.js';
 import { B as BellRing } from './bell-ring-D3mWkc-3.js';
 import { P as PendingOrdersIcon } from './cart-DY4LZmNP.js';
@@ -45,7 +45,7 @@ var SettingstIcon = `<!-- Generated by IcoMoon.io -->
 </svg>
 `;
 
-const sallaUserMenuCss = "";
+const sallaUserMenuCss = () => ``;
 
 const SallaUserMenu = class {
     constructor(hostRef) {
@@ -278,6 +278,6 @@ const SallaUserMenu = class {
     }
     get host() { return getElement(this); }
 };
-SallaUserMenu.style = sallaUserMenuCss;
+SallaUserMenu.style = sallaUserMenuCss();
 
 export { SallaUserMenu as salla_user_menu };

package/dist/esm/salla-user-profile.entry.js

@@ -1,10 +1,10 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { r as registerInstance, h } from './index-BBHnyTVS.js';
+import { r as registerInstance, h } from './index-DYB20YqN.js';
 import { G as Genders } from './interfaces-OF8QcbMM.js';
 
-const sallaUserProfileCss = ":host{display:block}";
+const sallaUserProfileCss = () => `:host{display:block}`;
 
 const SallaUserProfile = class {
     // Constructor
@@ -138,6 +138,6 @@ const SallaUserProfile = class {
         return (h("form", { onSubmit: event => this.submitForm(event) }, h("div", { class: "s-user-profile-wrapper" }, h("div", { class: "s-user-profile-field" }, h("label", { htmlFor: "first-name", class: "s-user-profile-field-label" }, this.first_name_trans), h("input", { disabled: !this.isEditable, type: "text", name: "first_name", value: this.userData.first_name, id: "first-name", required: true, autocomplete: "first_name", class: "form-input", onChange: event => this.handleFieldChange('first_name', event) })), h("div", { class: "s-user-profile-field" }, h("label", { htmlFor: "last-name", class: "s-user-profile-field-label" }, this.last_name_trans), h("input", { disabled: !this.isEditable, type: "text", name: "last_name", value: this.userData.last_name, id: "last-name", required: true, autocomplete: "last_name", class: "form-input", onChange: event => this.handleFieldChange('last_name', event) })), h("div", { class: "s-user-profile-field" }, h("label", { htmlFor: "birthday", class: "s-user-profile-field-label" }, this.birthday_trans), h("salla-datetime-picker", { disabled: !this.isEditable, dateFormat: "Y-m-d", value: this.userData.birthday, placeholder: this.birthday_placeholder_trans, required: true, maxDate: this.getBirthDateRestriction(), name: "birthday", onPicked: event => this.handleFieldChange('birthday', event) })), h("div", { class: "s-user-profile-field" }, h("label", { htmlFor: "gender", class: "s-user-profile-field-label" }, this.gender_trans), h("select", { disabled: !this.isEditable, class: "form-input", name: "gender", required: true, onChange: event => this.handleFieldChange('gender', event) }, h("option", { value: "" }, this.gender_placeholder_trans), h("option", { value: Genders.Male, selected: this.userData.gender === Genders.Male }, this.male_trans), h("option", { value: Genders.Female, selected: this.userData.gender === Genders.Female }, this.female_trans))), h("div", { class: "s-user-profile-field" }, h("label", { htmlFor: "email", class: "s-user-profile-field-label" }, this.email_trans), h("input", { disabled: !this.isEditable, type: "email", name: "email", value: this.userData.email, id: "email", class: "form-input", required: true, onInput: event => this.handleEmailInput('email', event) }), h("p", { id: "email-error", class: "s-user-profile-field-error" })), h("div", { class: "s-user-profile-field" }, h("label", { htmlFor: "international-mobile", class: "s-user-profile-field-label" }, this.mobile_trans), h("salla-tel-input", { disabled: !this.isEditable, name: "international-mobile", "country-code": this.userData.phone.country, phone: `${this.userData.phone.number}`, onPhoneEntered: data => this.phoneNumberFieldEventHandler(data) }))), h("salla-button", { type: "submit", loading: this.disableAction, disabled: this.disableAction || !this.isEditable, "loader-position": "end", class: "s-user-profile-submit" }, this.save_btn_trans)));
     }
 };
-SallaUserProfile.style = sallaUserProfileCss;
+SallaUserProfile.style = sallaUserProfileCss();
 
 export { SallaUserProfile as salla_user_profile };

package/dist/esm/salla-user-settings.entry.js

@@ -1,7 +1,7 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { r as registerInstance, h, H as Host } from './index-BBHnyTVS.js';
+import { r as registerInstance, h, H as Host } from './index-DYB20YqN.js';
 
 var Bullhorn = `<!-- Generated by IcoMoon.io -->
 <svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
@@ -24,7 +24,7 @@ var UserCancel = `<!-- Generated by IcoMoon.io -->
 </svg>
 `;
 
-const sallaUserSettingsCss = "";
+const sallaUserSettingsCss = () => ``;
 
 const SallaUserSettings = class {
     constructor(hostRef) {
@@ -81,6 +81,6 @@ const SallaUserSettings = class {
         return (h(Host, { key: '35629ae7a818db4d058b5de6a4ad7a2410fd769a', class: "s-user-settings-wrapper" }, this.canHideName && h("div", { key: '088ff650127df0e6e4fda37dc9769ebe7a050cfa', class: "s-user-settings-section" }, h("salla-list-tile", { key: 'dc71e681761440cb875d3de11b3d1a13def55a5c' }, h("div", { key: '44b1c2e02b981712467b5d494e1d8e8c30cefc5d', slot: "icon", class: "s-user-settings-section-icon" }, h("span", { key: 'cb4f89d7f81526be268ac7ac7cf407f458eee32a', innerHTML: UserCancel })), h("div", { key: '2be07d40cd1b2082e08f391d43f6fb292e707c51', slot: "title", class: "s-user-settings-section-title" }, this.capitalizeText(this.hideMyName)), h("div", { key: 'ab4702331a6b59f974794e1c6f95505541273db7', slot: "subtitle", class: "s-user-settings-section-subtitle" }, this.capitalizeText(this.hideMyNameDesc)), h("div", { key: '92615b95a6f669e4925a17b6a11ef9146d182d62', slot: 'action', class: "s-user-settings-section-action" }, h("label", { key: 'd99cd97d0baf75c75fc8e2ba6fd403109295658f', class: "s-toggle" }, h("input", { key: '52997c851e7ffff021d267d9cc839d19a1b940b9', class: "s-toggle-input", checked: this.isHiddenName, onChange: (e) => this.toggleSetting('is_hidden_name', e), type: "checkbox" }), h("div", { key: 'f2418d8595800b8e2af231aab82714137bad4e5c', class: "s-toggle-switcher" }))))), h("div", { key: 'ca9641927d0c2e09345078a16e06445f1961d05d', class: "s-user-settings-section" }, h("salla-list-tile", { key: '55075a73c15fda0fb94291e41d528b066d2a808d' }, h("div", { key: '20e5894110f485f2ed75fdc6f0d54b647d1d4a48', slot: "icon", class: "s-user-settings-section-icon" }, h("span", { key: 'c616fe981cd2a7ceb8090c44fe353b5504f5b0e1', innerHTML: Bullhorn })), h("div", { key: 'c1dc47211d07cc1ea25e2ce284f460c2eb6d4f7b', slot: "title", class: "s-user-settings-section-title" }, this.capitalizeText(this.promotionalMsgs)), h("div", { key: '185e058888078b556a359acb6cc1ae080f01ad81', slot: "subtitle", class: "s-user-settings-section-subtitle" }, this.capitalizeText(this.promotionalMsgsDesc)), h("div", { key: 'f54597f7f3c9126c57d34a5aba3ccd84752efbea', slot: 'action', class: "s-user-settings-section-action" }, h("label", { key: '3386b76fc2d590b3a3734716429a8317a80fcc0b', class: "s-toggle" }, h("input", { key: 'd2d9ce3f8e3110715d84e9b407b878e341567fc6', class: "s-toggle-input", checked: this.isNotifiable, onChange: (e) => this.toggleSetting('is_notifiable', e), type: "checkbox" }), h("div", { key: '267b474fb32cbabdf53ff8fd2fe69df87875819d', class: "s-toggle-switcher" }))))), h("div", { key: '80d86e89c87bceddddd461faeede4dfc8f4b3301', class: "s-user-settings-section s-user-settings-section-deactivate-user" }, h("salla-list-tile", { key: 'b95c175905cde9d4fae8487d1a85329db890873f' }, h("div", { key: '1e32b08bceb6bf299ea1e59545d7c539cb2ddce1', slot: "icon", class: "s-user-settings-section-icon" }, h("span", { key: 'f1322819a6f07dff92f9956c0149b173f283407e', innerHTML: UserOff })), h("div", { key: '5d2ddaf6c03c8809f7e86b33fa421e73d048957e', slot: "title", class: "s-user-settings-section-title" }, this.capitalizeText(this.deactivateAccount)), h("div", { key: '0578e54cc49334ad081641b2ccd5b98d81e547ed', slot: "subtitle", class: "s-user-settings-section-subtitle" }, this.capitalizeText(this.deactivateDesc)), h("div", { key: '30d6697be785def178352999d437f67798a03ed5', slot: 'action', class: "s-user-settings-section-action" }, h("salla-button", { key: 'b0ecec87180902892081999d0c96da33cda58d26', fill: "outline", color: "danger", shape: "btn", size: "medium", width: "normal", onClick: () => this.openDeactivateModal() }, this.capitalizeText(this.deactivateAccount))))), h("salla-modal", { key: 'b2015afb2f495f080d6757a57408ccd3e823b1ed', width: "sm", subTitle: this.capitalizeText(this.sorryForLeavingText), ref: modal => this.confirmationModal = modal }, h("span", { key: 'e9391b722fe6c23853664cd5558c289e7fff427a', slot: 'icon', class: "s-user-settings-confirmation-icon", innerHTML: UserOff }), h("div", { key: 'fffaa51055598f66f479e90676649eac4a06148c', class: "s-user-settings-confirmation" }, h("div", { key: '2d7044a63ada034d44de97a875903967de4fa7f0', class: "s-user-settings-confirmation-warning" }, this.capitalizeText(this.warningText)), h("div", { key: 'f79c44b10a20b187c4f5a849b7e40c3c71eb0194', class: "s-user-settings-confirmation-actions" }, h("salla-button", { key: 'b41c685894464f38f8a590482532a46851702ee7', width: "wide", onClick: () => this.confirmationModal.close() }, this.capitalizeText(this.keepAccount)), h("salla-button", { key: '3520e6c0bd7475a6ad3b004ec0a20c3993ebb45f', fill: 'outline', loading: this.buttonLoading, width: "wide", onClick: () => this.deleteAccount() }, this.capitalizeText(this.deactivateAccount)))))));
     }
 };
-SallaUserSettings.style = sallaUserSettingsCss;
+SallaUserSettings.style = sallaUserSettingsCss();
 
 export { SallaUserSettings as salla_user_settings };

package/dist/esm/salla-verify.entry.js

@@ -1,7 +1,7 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-BBHnyTVS.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-DYB20YqN.js';
 import { M as MailIcon } from './mail-DmgxDvXL.js';
 
 var AndroidPhoneIcon = `<!-- Generated by IcoMoon.io -->
@@ -11,7 +11,7 @@ var AndroidPhoneIcon = `<!-- Generated by IcoMoon.io -->
 </svg>
 `;
 
-const sallaVerifyCss = "salla-verify{display:block}.s-verify-input{}.s-verify-input::-webkit-outer-spin-button,.s-verify-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.s-verify-input[type=number]{-moz-appearance:textfield}";
+const sallaVerifyCss = () => `salla-verify{display:block}.s-verify-input{}.s-verify-input::-webkit-outer-spin-button,.s-verify-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.s-verify-input[type=number]{-moz-appearance:textfield}`;
 
 const SallaVerify = class {
     constructor(hostRef) {
@@ -252,6 +252,6 @@ const SallaVerify = class {
     }
     get host() { return getElement(this); }
 };
-SallaVerify.style = sallaVerifyCss;
+SallaVerify.style = sallaVerifyCss();
 
 export { SallaVerify as salla_verify };

package/dist/esm/salla-wallet.entry.js

@@ -1,9 +1,9 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { r as registerInstance, h, H as Host } from './index-BBHnyTVS.js';
+import { r as registerInstance, h, H as Host } from './index-DYB20YqN.js';
 
-const sallaWalletCss = ".s-wallet-table{min-width:100%}.s-wallet-table-balance-container{display:flex !important;align-items:center !important;justify-content:flex-start !important;gap:1rem}.s-wallet-table-balance-icon{border-radius:50%;width:52px;height:52px;font-size:25px;padding:16px 13px;background:var(--color-primary-reverse);color:var(--color-primary)}.s-wallet-table-empty-state{display:flex;flex-direction:column;align-items:center}.s-wallet-table-empty-state i{font-size:80px;margin:4rem 0 2rem;color:var(--infinte-color)}.s-wallet-table-transaction-status{padding:6px 19px !important;border-radius:20px;width:max-content;display:flex;align-items:center}.s-wallet-table-transaction-status-default{background:#fff6eb;color:#a46f29}.s-wallet-table-transaction-status-cashback{background:#effbf6;color:#00af6c}.s-wallet-table-transaction-status-refund{background:#ecf3fe;color:#5196f3}.s-wallet-table-transaction-status-purchase{background:#feecec;color:#f55157}.s-wallet-table-transaction-status-icons-success{color:#00af6c}";
+const sallaWalletCss = () => `.s-wallet-table{min-width:100%}.s-wallet-table-balance-container{display:flex !important;align-items:center !important;justify-content:flex-start !important;gap:1rem}.s-wallet-table-balance-icon{border-radius:50%;width:52px;height:52px;font-size:25px;padding:16px 13px;background:var(--color-primary-reverse);color:var(--color-primary)}.s-wallet-table-empty-state{display:flex;flex-direction:column;align-items:center}.s-wallet-table-empty-state i{font-size:80px;margin:4rem 0 2rem;color:var(--infinte-color)}.s-wallet-table-transaction-status{padding:6px 19px !important;border-radius:20px;width:max-content;display:flex;align-items:center}.s-wallet-table-transaction-status-default{background:#fff6eb;color:#a46f29}.s-wallet-table-transaction-status-cashback{background:#effbf6;color:#00af6c}.s-wallet-table-transaction-status-refund{background:#ecf3fe;color:#5196f3}.s-wallet-table-transaction-status-purchase{background:#feecec;color:#f55157}.s-wallet-table-transaction-status-icons-success{color:#00af6c}`;
 
 const SallaWalletTable = class {
     constructor(hostRef) {
@@ -77,6 +77,6 @@ const SallaWalletTable = class {
         }
     }
 };
-SallaWalletTable.style = sallaWalletCss;
+SallaWalletTable.style = sallaWalletCss();
 
 export { SallaWalletTable as salla_wallet };