@salla.sa/twilight-components 2.14.391 → 2.14.393

package/dist/cjs/salla-price-range.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-RCgJUM7B.js');
+var index = require('./index-C5VeFDQ0.js');
 var arrowLeft = require('./arrow-left-xSEmRpp6.js');
 
 var arrowRight = `<!-- Generated by IcoMoon.io -->
@@ -13,7 +13,7 @@ var arrowRight = `<!-- Generated by IcoMoon.io -->
 </svg>
 `;
 
-const sallaPriceRangeCss = ":host{display:block}.rtl .rtl-range-slider,[dir=rtl] .rtl-range-slider{transform:rotateY(180deg)}.rtl .rtl-range-numbers,[dir=rtl] .rtl-range-numbers{flex-direction:row-reverse}.rtl .form-select,.rtl select,[dir=rtl] .form-select,[dir=rtl] select{background-position:left 0.5rem center;padding-right:12px}.rtl .menu-divide li:not(:last-child):after,[dir=rtl] .menu-divide li:not(:last-child):after{left:0;right:auto}input[type=range]::-webkit-slider-thumb{pointer-events:all;width:24px;height:24px;-webkit-appearance:none}[type=checkbox]:checked{background-size:80%}";
+const sallaPriceRangeCss = () => `:host{display:block}.rtl .rtl-range-slider,[dir=rtl] .rtl-range-slider{transform:rotateY(180deg)}.rtl .rtl-range-numbers,[dir=rtl] .rtl-range-numbers{flex-direction:row-reverse}.rtl .form-select,.rtl select,[dir=rtl] .form-select,[dir=rtl] select{background-position:left 0.5rem center;padding-right:12px}.rtl .menu-divide li:not(:last-child):after,[dir=rtl] .menu-divide li:not(:last-child):after{left:0;right:auto}input[type=range]::-webkit-slider-thumb{pointer-events:all;width:24px;height:24px;-webkit-appearance:none}[type=checkbox]:checked{background-size:80%}`;
 
 const SallaPriceRange = class {
     constructor(hostRef) {
@@ -167,6 +167,6 @@ const SallaPriceRange = class {
         this.isReady = true;
     }
 };
-SallaPriceRange.style = sallaPriceRangeCss;
+SallaPriceRange.style = sallaPriceRangeCss();
 
 exports.salla_price_range = SallaPriceRange;

package/dist/cjs/salla-product-card.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-RCgJUM7B.js');
+var index = require('./index-C5VeFDQ0.js');
 var star2 = require('./star2-R146a27p.js');
 
 var Heart = `<!-- Generated by IcoMoon.io -->
@@ -13,7 +13,7 @@ var Heart = `<!-- Generated by IcoMoon.io -->
 </svg>
 `;
 
-const sallaProductCardCss = ".s-product-card-image::before{font-family:\"sallaicons\";content:\"\\ec1f\" !important}.s-product-card-content-pie-svg circle{transition:stroke-dashoffset 1s linear;-webkit-transition:stroke-dashoffset 1s linear;-moz-transition:stroke-dashoffset 1s linear;-ms-transition:stroke-dashoffset 1s linear;-o-transition:stroke-dashoffset 1s linear;stroke:#E8EDF2;stroke-width:2px;stroke-linecap:round;fill:none}.s-product-card-content-pie-svg-bar{stroke:var(--color-primary) !important;stroke-dasharray:100 100;stroke-dashoffset:100}";
+const sallaProductCardCss = () => `.s-product-card-image::before{font-family:"sallaicons";content:"\\ec1f" !important}.s-product-card-content-pie-svg circle{transition:stroke-dashoffset 1s linear;-webkit-transition:stroke-dashoffset 1s linear;-moz-transition:stroke-dashoffset 1s linear;-ms-transition:stroke-dashoffset 1s linear;-o-transition:stroke-dashoffset 1s linear;stroke:#E8EDF2;stroke-width:2px;stroke-linecap:round;fill:none}.s-product-card-content-pie-svg-bar{stroke:var(--color-primary) !important;stroke-dasharray:100 100;stroke-dashoffset:100}`;
 
 const SallaProductCard = class {
     constructor(hostRef) {
@@ -154,6 +154,6 @@ const SallaProductCard = class {
     static get assetsDirs() { return ["assets"]; }
     get host() { return index.getElement(this); }
 };
-SallaProductCard.style = sallaProductCardCss;
+SallaProductCard.style = sallaProductCardCss();
 
 exports.salla_product_card = SallaProductCard;

package/dist/cjs/salla-product-size-guide.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-RCgJUM7B.js');
+var index = require('./index-C5VeFDQ0.js');
 
 var PencilRuler = `<!-- Generated by IcoMoon.io -->
 <svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
@@ -12,7 +12,7 @@ var PencilRuler = `<!-- Generated by IcoMoon.io -->
 </svg>
 `;
 
-const sallaProductSizeGuideCss = "";
+const sallaProductSizeGuideCss = () => ``;
 
 const SallaProductSizeGuide = class {
     constructor(hostRef) {
@@ -61,6 +61,6 @@ const SallaProductSizeGuide = class {
     }
     get host() { return index.getElement(this); }
 };
-SallaProductSizeGuide.style = sallaProductSizeGuideCss;
+SallaProductSizeGuide.style = sallaProductSizeGuideCss();
 
 exports.salla_product_size_guide = SallaProductSizeGuide;

package/dist/cjs/salla-products-list.cjs.entry.js

@@ -3,12 +3,12 @@
  */
 'use strict';
 
-var index = require('./index-RCgJUM7B.js');
+var index = require('./index-C5VeFDQ0.js');
 var anime_es = require('./anime.es-BqW8JHZi.js');
 var shoppingBag = require('./shopping-bag-C1gvTVHr.js');
 var Helper = require('./Helper-CU4Xuiki.js');
 
-const sallaProductsListCss = "";
+const sallaProductsListCss = () => ``;
 
 const SallaProductsList = class {
     constructor(hostRef) {
@@ -767,6 +767,6 @@ const SallaProductsList = class {
     }
     get host() { return index.getElement(this); }
 };
-SallaProductsList.style = sallaProductsListCss;
+SallaProductsList.style = sallaProductsListCss();
 
 exports.salla_products_list = SallaProductsList;

package/dist/cjs/salla-products-slider.cjs.entry.js

@@ -3,11 +3,11 @@
  */
 'use strict';
 
-var index = require('./index-RCgJUM7B.js');
+var index = require('./index-C5VeFDQ0.js');
 var Helper = require('./Helper-CU4Xuiki.js');
 require('./anime.es-BqW8JHZi.js');
 
-const sallaProductsSliderCss = "";
+const sallaProductsSliderCss = () => ``;
 
 const SallaProductsSlider = class {
     constructor(hostRef) {
@@ -116,6 +116,6 @@ const SallaProductsSlider = class {
     }
     get host() { return index.getElement(this); }
 };
-SallaProductsSlider.style = sallaProductsSliderCss;
+SallaProductsSlider.style = sallaProductsSliderCss();
 
 exports.salla_products_slider = SallaProductsSlider;

package/dist/cjs/salla-progress-bar.cjs.entry.js

@@ -3,9 +3,9 @@
  */
 'use strict';
 
-var index = require('./index-RCgJUM7B.js');
+var index = require('./index-C5VeFDQ0.js');
 
-const sallaProgressBarCss = "";
+const sallaProgressBarCss = () => ``;
 
 const SallaProgressBar = class {
     constructor(hostRef) {
@@ -68,6 +68,6 @@ const SallaProgressBar = class {
         ] : null;
     }
 };
-SallaProgressBar.style = sallaProgressBarCss;
+SallaProgressBar.style = sallaProgressBarCss();
 
 exports.salla_progress_bar = SallaProgressBar;

package/dist/cjs/salla-quick-order.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-RCgJUM7B.js');
+var index = require('./index-C5VeFDQ0.js');
 var mail = require('./mail-CO8cFZH7.js');
 var cancel = require('./cancel-De6vslRA.js');
 
@@ -28,7 +28,7 @@ var IphoneXIcon = `<!-- Generated by IcoMoon.io -->
 </svg>
 `;
 
-const sallaQuickOrderCss = ".s-quick-order-expandable:not(.s-quick-order-shown){overflow:hidden}";
+const sallaQuickOrderCss = () => `.s-quick-order-expandable:not(.s-quick-order-shown){overflow:hidden}`;
 
 const SallaQuickOrder = class {
     constructor(hostRef) {
@@ -234,6 +234,6 @@ const SallaQuickOrder = class {
     }
     get host() { return index.getElement(this); }
 };
-SallaQuickOrder.style = sallaQuickOrderCss;
+SallaQuickOrder.style = sallaQuickOrderCss();
 
 exports.salla_quick_order = SallaQuickOrder;

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

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-RCgJUM7B.js');
+var index = require('./index-C5VeFDQ0.js');
 var star = require('./star-DGcH7Yso.js');
 var checkCircle2 = require('./check-circle2-BDvlT4_n.js');
 var Helper = require('./Helper-CU4Xuiki.js');
@@ -19,7 +19,7 @@ var ShippingFast = `<!-- Generated by IcoMoon.io -->
 </svg>
 `;
 
-const sallaRatingModalCss = "";
+const sallaRatingModalCss = () => ``;
 
 const SallaRatingModal = class {
     constructor(hostRef) {
@@ -450,6 +450,6 @@ const SallaRatingModal = class {
     }
     get host() { return index.getElement(this); }
 };
-SallaRatingModal.style = sallaRatingModalCss;
+SallaRatingModal.style = sallaRatingModalCss();
 
 exports.salla_rating_modal = SallaRatingModal;

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

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-RCgJUM7B.js');
+var index = require('./index-C5VeFDQ0.js');
 var search = require('./search-c7Aa7lM9.js');
 
 var StoreAlt = `<!-- Generated by IcoMoon.io -->
@@ -19,7 +19,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) {
@@ -180,6 +180,6 @@ const SallaScopees = class {
         }
     }
 };
-SallaScopees.style = sallaScopesCss;
+SallaScopees.style = sallaScopesCss();
 
 exports.salla_scopes = SallaScopees;

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

@@ -3,12 +3,12 @@
  */
 'use strict';
 
-var index = require('./index-RCgJUM7B.js');
+var index = require('./index-C5VeFDQ0.js');
 var search = require('./search-c7Aa7lM9.js');
 var Helper = require('./Helper-CU4Xuiki.js');
 require('./anime.es-BqW8JHZi.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) {
@@ -160,9 +160,11 @@ const SallaSearch = class {
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {
-        "search_term": ["handleSearch"]
+        "search_term": [{
+                "handleSearch": 0
+            }]
     }; }
 };
-SallaSearch.style = sallaSearchCss;
+SallaSearch.style = sallaSearchCss();
 
 exports.salla_search = SallaSearch;

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

@@ -3,9 +3,9 @@
  */
 'use strict';
 
-var index = require('./index-RCgJUM7B.js');
+var index = require('./index-C5VeFDQ0.js');
 
-const sallaSkeletonCss = ":host{display:block}";
+const sallaSkeletonCss = () => `:host{display:block}`;
 
 const SallaSkeleton = class {
     constructor(hostRef) {
@@ -31,6 +31,6 @@ const SallaSkeleton = class {
         return (index.h(index.Host, { key: '366d9fcd96b22edc9b5cdc07f8d8367fdbc5c574', class: "s-skeleton-wrapper", style: { width: this.width, height: this.height } }, index.h("div", { key: 'b4ad9adc7d8ce69aeaeaa1cf287726fa69018730', class: classes }, "\u00A0")));
     }
 };
-SallaSkeleton.style = sallaSkeletonCss;
+SallaSkeleton.style = sallaSkeletonCss();
 
 exports.salla_skeleton = SallaSkeleton;

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

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-RCgJUM7B.js');
+var index = require('./index-C5VeFDQ0.js');
 var keyboard_arrow_right = require('./keyboard_arrow_right-BayM_Il2.js');
 
 /**
@@ -232,11 +232,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);
@@ -1103,9 +1102,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;
       });
@@ -3190,7 +3188,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);
@@ -3815,7 +3814,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 => {
@@ -7503,7 +7506,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;
@@ -7516,6 +7520,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);
       }
@@ -8666,7 +8672,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;
   };
@@ -9774,7 +9780,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
  *
@@ -9782,7 +9788,7 @@ function EffectCards({
  *
  * Released under the MIT License
  *
- * Released on: January 28, 2026
+ * Released on: March 24, 2026
  */
 
 
@@ -9790,7 +9796,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) {
@@ -10416,6 +10422,6 @@ const SallaSlider = class {
     }
     get host() { return index.getElement(this); }
 };
-SallaSlider.style = sallaSliderCss;
+SallaSlider.style = sallaSliderCss();
 
 exports.salla_slider = SallaSlider;

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

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-RCgJUM7B.js');
+var index = require('./index-C5VeFDQ0.js');
 var anime_es = require('./anime.es-BqW8JHZi.js');
 var facebook = require('./facebook-DbXua6B9.js');
 var mail = require('./mail-CO8cFZH7.js');
@@ -39,7 +39,7 @@ var ShareAlt = `<!-- Generated by IcoMoon.io -->
 </svg>
 `;
 
-const sallaSocialShareCss = "";
+const sallaSocialShareCss = () => ``;
 
 const SallaSocialShare = class {
     constructor(hostRef) {
@@ -160,6 +160,6 @@ const SallaSocialShare = class {
     }
     get host() { return index.getElement(this); }
 };
-SallaSocialShare.style = sallaSocialShareCss;
+SallaSocialShare.style = sallaSocialShareCss();
 
 exports.salla_social_share = SallaSocialShare;

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

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-RCgJUM7B.js');
+var index = require('./index-C5VeFDQ0.js');
 var facebook = require('./facebook-DbXua6B9.js');
 
 var instagram = `<!-- Generated by IcoMoon.io -->
@@ -34,7 +34,7 @@ var tiktok = `<!-- Generated by IcoMoon.io -->
 </svg>
 `;
 
-const sallaSocialCss = ":host{display:block}";
+const sallaSocialCss = () => `:host{display:block}`;
 
 const SallaSocial = class {
     constructor(hostRef) {
@@ -68,6 +68,6 @@ const SallaSocial = class {
     }
     get host() { return index.getElement(this); }
 };
-SallaSocial.style = sallaSocialCss;
+SallaSocial.style = sallaSocialCss();
 
 exports.salla_social = SallaSocial;

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

@@ -3,9 +3,9 @@
  */
 'use strict';
 
-var index = require('./index-RCgJUM7B.js');
+var index = require('./index-C5VeFDQ0.js');
 
-const sallaTabContentCss = "";
+const sallaTabContentCss = () => ``;
 
 const SallaTabContent = class {
     constructor(hostRef) {
@@ -36,13 +36,13 @@ const SallaTabContent = class {
         return (index.h("div", { key: '13737e2a7a7bce59e8ddc38b3b4d5159a4aa67be', class: classes }, index.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) {
@@ -96,9 +96,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) {
@@ -150,7 +150,7 @@ const SallaTabs = class {
     }
     get host() { return index.getElement(this); }
 };
-SallaTabs.style = sallaTabsCss;
+SallaTabs.style = sallaTabsCss();
 
 exports.salla_tab_content = SallaTabContent;
 exports.salla_tab_header = SallaTabHeader;

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

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-RCgJUM7B.js');
+var index = require('./index-C5VeFDQ0.js');
 
 var DiscountType;
 (function (DiscountType) {
@@ -72,7 +72,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) {
@@ -330,6 +330,6 @@ const SallaTieredOffer = class {
         return (index.h(index.Host, null, index.h("div", { class: "s-tiered-offer-container" }, index.h("div", { class: "s-tiered-offer-header" }, index.h("div", { class: "s-tiered-offer-header-content" }, index.h("p", { class: "s-tiered-offer-program-title" }, this.loyaltyProgramText), index.h("div", { class: "s-tiered-offer-current-tier-name-wrapper" }, index.h("h2", { class: "s-tiered-offer-current-tier" }, this.currentTierText, " ", index.h("span", { class: "s-tiered-offer-tier-name" }, currentTierData.name)), index.h("span", { innerHTML: currentTierData.icon })))), this.renderProgressBar(), this.renderTabs())));
     }
 };
-SallaTieredOffer.style = sallaTieredOfferCss;
+SallaTieredOffer.style = sallaTieredOfferCss();
 
 exports.salla_tiered_offer = SallaTieredOffer;

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

@@ -3,9 +3,9 @@
  */
 'use strict';
 
-var index = require('./index-RCgJUM7B.js');
+var index = require('./index-C5VeFDQ0.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) {
@@ -37,6 +37,6 @@ const SallaTooltip = class {
     }
     get el() { return index.getElement(this); }
 };
-SallaTooltip.style = sallaTooltipCss;
+SallaTooltip.style = sallaTooltipCss();
 
 exports.salla_tooltip = SallaTooltip;