@everymatrix/lottery-tipping-page 1.94.3 → 1.94.5

package/dist/cjs/{general-multi-select_14.cjs.entry.js → general-multi-select_15.cjs.entry.js}

@@ -235,59 +235,6 @@ const GeneralTooltip = class {
 };
 GeneralTooltip.style = GeneralTooltipStyle0;
 
-const DEFAULT_LANGUAGE$5 = 'en';
-const SUPPORTED_LANGUAGES$5 = ['ro', 'en', 'fr', 'ar', 'hr'];
-const TRANSLATIONS$5 = {
-    en: {
-        stop: 'Stop',
-        at: 'at',
-        turnover: 'Turnover: ',
-        startIn: 'Sales Start in:',
-    },
-    ro: {
-        stop: 'Oprește',
-        at: 'la'
-    },
-    fr: {
-        stop: 'Arrêtez',
-        at: 'à'
-    },
-    ar: {
-        stop: 'توقف',
-        at: 'في'
-    },
-    hr: {
-        stop: 'Stop',
-        at: 'u'
-    }
-};
-const translate$5 = (key, customLang) => {
-    const lang = customLang;
-    return TRANSLATIONS$5[lang !== undefined && SUPPORTED_LANGUAGES$5.includes(lang) ? lang : DEFAULT_LANGUAGE$5][key];
-};
-const getTranslations$5 = (data) => {
-    Object.keys(data).forEach((item) => {
-        for (let key in data[item]) {
-            TRANSLATIONS$5[item][key] = data[item][key];
-        }
-    });
-};
-const resolveTranslationUrl$3 = async (translationUrl) => {
-    if (translationUrl) {
-        try {
-            const response = await fetch(translationUrl);
-            if (!response.ok) {
-                throw new Error(`HTTP error! status: ${response.status}`);
-            }
-            const translations = await response.json();
-            getTranslations$5(translations);
-        }
-        catch (error) {
-            console.error('Failed to fetch or parse translations from URL:', error);
-        }
-    }
-};
-
 function _typeof(o) {
   "@babel/helpers - typeof";
 
@@ -413,31 +360,6 @@ function getTimezoneOffsetInMilliseconds(date) {
   return date.getTime() - utcDate.getTime();
 }
 
-/**
- * @name startOfDay
- * @category Day Helpers
- * @summary Return the start of a day for the given date.
- *
- * @description
- * Return the start of a day for the given date.
- * The result will be in the local timezone.
- *
- * @param {Date|Number} date - the original date
- * @returns {Date} the start of a day
- * @throws {TypeError} 1 argument required
- *
- * @example
- * // The start of a day for 2 September 2014 11:55:00:
- * const result = startOfDay(new Date(2014, 8, 2, 11, 55, 0))
- * //=> Tue Sep 02 2014 00:00:00
- */
-function startOfDay(dirtyDate) {
-  requiredArgs(1, arguments);
-  var date = toDate(dirtyDate);
-  date.setHours(0, 0, 0, 0);
-  return date;
-}
-
 /**
  * Days in 1 week.
  *
@@ -467,41 +389,6 @@ var millisecondsInMinute = 60000;
  */
 var millisecondsInHour = 3600000;
 
-/**
- * @name isSameDay
- * @category Day Helpers
- * @summary Are the given dates in the same day (and year and month)?
- *
- * @description
- * Are the given dates in the same day (and year and month)?
- *
- * @param {Date|Number} dateLeft - the first date to check
- * @param {Date|Number} dateRight - the second date to check
- * @returns {Boolean} the dates are in the same day (and year and month)
- * @throws {TypeError} 2 arguments required
- *
- * @example
- * // Are 4 September 06:00:00 and 4 September 18:00:00 in the same day?
- * const result = isSameDay(new Date(2014, 8, 4, 6, 0), new Date(2014, 8, 4, 18, 0))
- * //=> true
- *
- * @example
- * // Are 4 September and 4 October in the same day?
- * const result = isSameDay(new Date(2014, 8, 4), new Date(2014, 9, 4))
- * //=> false
- *
- * @example
- * // Are 4 September, 2014 and 4 September, 2015 in the same day?
- * const result = isSameDay(new Date(2014, 8, 4), new Date(2015, 8, 4))
- * //=> false
- */
-function isSameDay(dirtyDateLeft, dirtyDateRight) {
-  requiredArgs(2, arguments);
-  var dateLeftStartOfDay = startOfDay(dirtyDateLeft);
-  var dateRightStartOfDay = startOfDay(dirtyDateRight);
-  return dateLeftStartOfDay.getTime() === dateRightStartOfDay.getTime();
-}
-
 /**
  * @name isDate
  * @category Common Helpers
@@ -579,77 +466,6 @@ function isValid(dirtyDate) {
   return !isNaN(Number(date));
 }
 
-/**
- * @name differenceInMilliseconds
- * @category Millisecond Helpers
- * @summary Get the number of milliseconds between the given dates.
- *
- * @description
- * Get the number of milliseconds between the given dates.
- *
- * @param {Date|Number} dateLeft - the later date
- * @param {Date|Number} dateRight - the earlier date
- * @returns {Number} the number of milliseconds
- * @throws {TypeError} 2 arguments required
- *
- * @example
- * // How many milliseconds are between
- * // 2 July 2014 12:30:20.600 and 2 July 2014 12:30:21.700?
- * const result = differenceInMilliseconds(
- *   new Date(2014, 6, 2, 12, 30, 21, 700),
- *   new Date(2014, 6, 2, 12, 30, 20, 600)
- * )
- * //=> 1100
- */
-function differenceInMilliseconds(dateLeft, dateRight) {
-  requiredArgs(2, arguments);
-  return toDate(dateLeft).getTime() - toDate(dateRight).getTime();
-}
-
-var roundingMap = {
-  ceil: Math.ceil,
-  round: Math.round,
-  floor: Math.floor,
-  trunc: function trunc(value) {
-    return value < 0 ? Math.ceil(value) : Math.floor(value);
-  } // Math.trunc is not supported by IE
-};
-
-var defaultRoundingMethod = 'trunc';
-function getRoundingMethod(method) {
-  return method ? roundingMap[method] : roundingMap[defaultRoundingMethod];
-}
-
-/**
- * @name differenceInSeconds
- * @category Second Helpers
- * @summary Get the number of seconds between the given dates.
- *
- * @description
- * Get the number of seconds between the given dates.
- *
- * @param {Date|Number} dateLeft - the later date
- * @param {Date|Number} dateRight - the earlier date
- * @param {Object} [options] - an object with options.
- * @param {String} [options.roundingMethod='trunc'] - a rounding method (`ceil`, `floor`, `round` or `trunc`)
- * @returns {Number} the number of seconds
- * @throws {TypeError} 2 arguments required
- *
- * @example
- * // How many seconds are between
- * // 2 July 2014 12:30:07.999 and 2 July 2014 12:30:20.000?
- * const result = differenceInSeconds(
- *   new Date(2014, 6, 2, 12, 30, 20, 0),
- *   new Date(2014, 6, 2, 12, 30, 7, 999)
- * )
- * //=> 12
- */
-function differenceInSeconds(dateLeft, dateRight, options) {
-  requiredArgs(2, arguments);
-  var diff = differenceInMilliseconds(dateLeft, dateRight) / 1000;
-  return getRoundingMethod(options === null || options === void 0 ? void 0 : options.roundingMethod)(diff);
-}
-
 /**
  * @name subMilliseconds
  * @category Millisecond Helpers
@@ -2645,106 +2461,53 @@ function cleanEscapedString(input) {
 }
 
 /**
- * @name isBefore
+ * @name isAfter
  * @category Common Helpers
- * @summary Is the first date before the second one?
+ * @summary Is the first date after the second one?
  *
  * @description
- * Is the first date before the second one?
+ * Is the first date after the second one?
  *
- * @param {Date|Number} date - the date that should be before the other one to return true
+ * @param {Date|Number} date - the date that should be after the other one to return true
  * @param {Date|Number} dateToCompare - the date to compare with
- * @returns {Boolean} the first date is before the second date
+ * @returns {Boolean} the first date is after the second date
  * @throws {TypeError} 2 arguments required
  *
  * @example
- * // Is 10 July 1989 before 11 February 1987?
- * const result = isBefore(new Date(1989, 6, 10), new Date(1987, 1, 11))
- * //=> false
+ * // Is 10 July 1989 after 11 February 1987?
+ * const result = isAfter(new Date(1989, 6, 10), new Date(1987, 1, 11))
+ * //=> true
  */
-function isBefore(dirtyDate, dirtyDateToCompare) {
+function isAfter(dirtyDate, dirtyDateToCompare) {
   requiredArgs(2, arguments);
   var date = toDate(dirtyDate);
   var dateToCompare = toDate(dirtyDateToCompare);
-  return date.getTime() < dateToCompare.getTime();
-}
-
-/**
- * @name isToday
- * @category Day Helpers
- * @summary Is the given date today?
- * @pure false
- *
- * @description
- * Is the given date today?
- *
- * > ⚠️ Please note that this function is not present in the FP submodule as
- * > it uses `Date.now()` internally hence impure and can't be safely curried.
- *
- * @param {Date|Number} date - the date to check
- * @returns {Boolean} the date is today
- * @throws {TypeError} 1 argument required
- *
- * @example
- * // If today is 6 October 2014, is 6 October 14:00:00 today?
- * const result = isToday(new Date(2014, 9, 6, 14, 0))
- * //=> true
- */
-function isToday(dirtyDate) {
-  requiredArgs(1, arguments);
-  return isSameDay(dirtyDate, Date.now());
+  return date.getTime() > dateToCompare.getTime();
 }
 
 /**
- * @name isWithinInterval
- * @category Interval Helpers
- * @summary Is the given date within the interval?
+ * @name isBefore
+ * @category Common Helpers
+ * @summary Is the first date before the second one?
  *
  * @description
- * Is the given date within the interval? (Including start and end.)
+ * Is the first date before the second one?
  *
- * @param {Date|Number} date - the date to check
- * @param {Interval} interval - the interval to check
- * @returns {Boolean} the date is within the interval
+ * @param {Date|Number} date - the date that should be before the other one to return true
+ * @param {Date|Number} dateToCompare - the date to compare with
+ * @returns {Boolean} the first date is before the second date
  * @throws {TypeError} 2 arguments required
- * @throws {RangeError} The start of an interval cannot be after its end
- * @throws {RangeError} Date in interval cannot be `Invalid Date`
- *
- * @example
- * // For the date within the interval:
- * isWithinInterval(new Date(2014, 0, 3), {
- *   start: new Date(2014, 0, 1),
- *   end: new Date(2014, 0, 7)
- * })
- * //=> true
  *
  * @example
- * // For the date outside of the interval:
- * isWithinInterval(new Date(2014, 0, 10), {
- *   start: new Date(2014, 0, 1),
- *   end: new Date(2014, 0, 7)
- * })
+ * // Is 10 July 1989 before 11 February 1987?
+ * const result = isBefore(new Date(1989, 6, 10), new Date(1987, 1, 11))
  * //=> false
- *
- * @example
- * // For date equal to interval start:
- * isWithinInterval(date, { start, end: date }) // => true
- *
- * @example
- * // For date equal to interval end:
- * isWithinInterval(date, { start: date, end }) // => true
  */
-function isWithinInterval(dirtyDate, interval) {
+function isBefore(dirtyDate, dirtyDateToCompare) {
   requiredArgs(2, arguments);
-  var time = toDate(dirtyDate).getTime();
-  var startTime = toDate(interval.start).getTime();
-  var endTime = toDate(interval.end).getTime();
-
-  // Throw an exception if start date is after end date or if any date is `Invalid Date`
-  if (!(startTime <= endTime)) {
-    throw new RangeError('Invalid interval');
-  }
-  return time >= startTime && time <= endTime;
+  var date = toDate(dirtyDate);
+  var dateToCompare = toDate(dirtyDateToCompare);
+  return date.getTime() < dateToCompare.getTime();
 }
 
 /**
@@ -2973,77 +2736,233 @@ function validateTimezone(_hours, minutes) {
   return minutes >= 0 && minutes <= 59;
 }
 
-const formatDate$2 = ({ date, type = 'date', format: format$1 }) => {
-    try {
-        const parsedDate = parseISO(date);
-        if (isNaN(parsedDate.getTime())) {
-            throw new Error(`Invalid date: ${date}`);
+const helperCountDownCss = ":host{display:block}.helper-count-down-container{display:flex;align-items:center}.helper-count-down-prefix{margin-right:4px}.helper-count-down-suffix{margin-left:4px}.helper-count-down-values{display:flex;align-items:center}.helper-count-down-item{display:flex;align-items:center;justify-content:center}.helper-count-down-item-num{font-variant-numeric:tabular-nums}";
+const HelperCountDownStyle0 = helperCountDownCss;
+
+const HelperCountDown = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.countDownChange = index.createEvent(this, "countDownChange", 7);
+        this.countDownFinish = index.createEvent(this, "countDownFinish", 7);
+        this.value = undefined;
+        this.format = 'HH:mm:ss';
+        this.prefix = undefined;
+        this.suffix = undefined;
+        this.mbSource = undefined;
+        this.clientStyling = undefined;
+        this.clientStylingUrl = undefined;
+        this.endTime = undefined;
+        this.timeObj = {
+            day: { str: '00', unit: '' },
+            hour: { str: '00', unit: '' },
+            minute: { str: '00', unit: '' },
+            second: { str: '00', unit: '' }
+        };
+    }
+    handleClientStylingChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            lotteryTippingPage.setClientStyling(this.stylingContainer, this.clientStyling);
         }
-        if (format$1)
-            return format(parsedDate, format$1);
-        let formatStr = 'dd/MM/yyyy';
-        if (type === 'time') {
-            formatStr = 'dd/MM/yyyy HH:mm:ss';
+    }
+    handleClientStylingUrlChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            lotteryTippingPage.setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
         }
-        else if (type === 'week') {
-            formatStr = 'ccc dd/MM/yyyy HH:mm:ss';
+    }
+    handleMbSourceChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            lotteryTippingPage.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
         }
-        return format(parsedDate, formatStr);
     }
-    catch (error) {
-        console.error('Error formatting date:', error.message);
-        return '';
+    handleValueChange(newValue) {
+        this.setEndTime(newValue);
+        if (newValue) {
+            this.startCountDown();
+        }
+        else {
+            this.clearCountDown();
+        }
+    }
+    componentDidLoad() {
+        if (this.stylingContainer) {
+            if (this.mbSource)
+                lotteryTippingPage.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
+            if (this.clientStyling)
+                lotteryTippingPage.setClientStyling(this.stylingContainer, this.clientStyling);
+            if (this.clientStylingUrl)
+                lotteryTippingPage.setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+        this.setEndTime(this.value);
+        if (this.value)
+            this.startCountDown();
+    }
+    setEndTime(value) {
+        if (typeof value === 'string') {
+            // If it's a string, parse it and get the milliseconds
+            const time = parseISO(value).getTime();
+            this.endTime = isNaN(time) ? null : time;
+        }
+        else {
+            // If it's a number, use it directly
+            this.endTime = value;
+        }
+    }
+    disconnectedCallback() {
+        this.stylingSubscription && this.stylingSubscription.unsubscribe();
+        this.clearCountDown();
+    }
+    startCountDown() {
+        this.clearCountDown();
+        this.tick();
+        this.timer = setInterval(() => {
+            this.tick();
+        }, 1000);
+    }
+    clearCountDown() {
+        if (this.timer) {
+            clearInterval(this.timer);
+            this.timer = null;
+        }
+    }
+    tick() {
+        if (!this.endTime)
+            return;
+        let leftTime = this.endTime - Date.now();
+        if (leftTime <= 0) {
+            leftTime = 0;
+            this.clearCountDown();
+            this.countDownFinish.emit();
+        }
+        const d = Math.floor(leftTime / (1000 * 60 * 60 * 24));
+        const h = Math.floor((leftTime / (1000 * 60 * 60)) % 24);
+        const m = Math.floor((leftTime / 1000 / 60) % 60);
+        const s = Math.floor((leftTime / 1000) % 60);
+        const pad = (n) => (n < 10 ? `0${n}` : `${n}`);
+        this.timeObj = {
+            day: { str: pad(d), unit: 'd' },
+            hour: { str: pad(h), unit: 'h' },
+            minute: { str: pad(m), unit: 'm' },
+            second: { str: pad(s), unit: 's' }
+        };
+        const formatTime = this.getFormatTime();
+        this.countDownChange.emit({ leftTime, formatTime, legalTime: formatTime });
+    }
+    getFormatTime() {
+        return this.format
+            .replace('DD', this.timeObj.day.str)
+            .replace('HH', this.timeObj.hour.str)
+            .replace('mm', this.timeObj.minute.str)
+            .replace('ss', this.timeObj.second.str);
+    }
+    renderItems() {
+        const regex = /(DD|HH|mm|ss)|([\s\S]+?)(?=(DD|HH|mm|ss)|$)/g;
+        const items = [];
+        let match;
+        while ((match = regex.exec(this.format)) !== null) {
+            if (match[1]) {
+                let val = '';
+                switch (match[1]) {
+                    case 'DD':
+                        val = this.timeObj.day.str;
+                        break;
+                    case 'HH':
+                        val = this.timeObj.hour.str;
+                        break;
+                    case 'mm':
+                        val = this.timeObj.minute.str;
+                        break;
+                    case 'ss':
+                        val = this.timeObj.second.str;
+                        break;
+                }
+                items.push({ val, unit: '' });
+            }
+            else if (match[2]) {
+                if (items.length > 0) {
+                    items[items.length - 1].unit = match[2];
+                }
+            }
+        }
+        return items.map((item, index$1) => {
+            return (index.h("div", { key: index$1 + item.unit, class: "helper-count-down-item", part: "item" }, index.h("div", { class: "helper-count-down-item-num" }, item.val), index.h("div", { class: "helper-count-down-item-unit" }, item.unit)));
+        });
     }
+    render() {
+        return (index.h("div", { key: 'b360412e045020b5ac0263c6ca56458f31eedb2c', class: "helper-count-down-container", ref: (el) => (this.stylingContainer = el) }, index.h("slot", { key: 'c72bed87fba869c842407b04e0cbfe038e5b7ea8' }), this.prefix && index.h("div", { key: '8d3ba9d60577421f81bae7bc76f52a774b17e1fe', class: "helper-count-down-prefix" }, this.prefix), index.h("div", { key: '187edf3b8eb6de85efe1a748fd8ef47a68e19611', class: "helper-count-down-values", part: "values" }, this.renderItems()), this.suffix && index.h("div", { key: '3a8e5d9561ecd3f52eff423bd43c8b60a261a17c', class: "helper-count-down-suffix" }, this.suffix)));
+    }
+    static get watchers() { return {
+        "clientStyling": ["handleClientStylingChange"],
+        "clientStylingUrl": ["handleClientStylingUrlChange"],
+        "mbSource": ["handleMbSourceChange"],
+        "value": ["handleValueChange"]
+    }; }
 };
-function formatTime(time) {
-    if (!time)
-        return;
-    if (isToday(new Date(time))) {
-        return formatDate$2({ date: time, format: 'HH:mm' });
+HelperCountDown.style = HelperCountDownStyle0;
+
+const DEFAULT_LANGUAGE$5 = 'en';
+const SUPPORTED_LANGUAGES$5 = ['ro', 'en', 'fr', 'ar', 'hr'];
+const TRANSLATIONS$5 = {
+    en: {
+        stop: 'Stop',
+        at: 'at',
+        turnover: 'Turnover: ',
+        startIn: 'Sales Start in:',
+    },
+    ro: {
+        stop: 'Oprește',
+        at: 'la'
+    },
+    fr: {
+        stop: 'Arrêtez',
+        at: 'à'
+    },
+    ar: {
+        stop: 'توقف',
+        at: 'في'
+    },
+    hr: {
+        stop: 'Stop',
+        at: 'u'
     }
-    return formatDate$2({ date: time, format: 'dd/MM/yyyy HH:mm' });
-}
-function formatCountdown(stopTime, _now) {
-    if (!stopTime)
-        return;
-    const endTime = typeof stopTime === 'string' ? parseISO(stopTime) : stopTime;
-    const now = _now && new Date();
-    let totalSeconds = differenceInSeconds(endTime, now);
-    if (totalSeconds < 0)
-        return '0D 00H 00M 00S';
-    const days = Math.floor(totalSeconds / 86400);
-    totalSeconds %= 86400;
-    const hours = Math.floor(totalSeconds / 3600);
-    totalSeconds %= 3600;
-    const minutes = Math.floor(totalSeconds / 60);
-    const seconds = totalSeconds % 60;
-    return `${days}D ${hours.toString().padStart(2, '0')}H ${minutes.toString().padStart(2, '0')}M ${seconds
-        .toString()
-        .padStart(2, '0')}S`;
-}
-function getWagerTime(startTime, stopTime) {
-    const now = new Date();
-    if (startTime && isBefore(now, parseISO(startTime))) {
-        return { start: formatCountdown(startTime, now) };
-    }
-    if (startTime &&
-        stopTime &&
-        isWithinInterval(now, {
-            start: parseISO(startTime),
-            end: parseISO(stopTime)
-        })) {
-        return { end: formatTime(stopTime) };
+};
+const translate$5 = (key, customLang) => {
+    const lang = customLang;
+    return TRANSLATIONS$5[lang !== undefined && SUPPORTED_LANGUAGES$5.includes(lang) ? lang : DEFAULT_LANGUAGE$5][key];
+};
+const getTranslations$5 = (data) => {
+    Object.keys(data).forEach((item) => {
+        for (let key in data[item]) {
+            TRANSLATIONS$5[item][key] = data[item][key];
+        }
+    });
+};
+const resolveTranslationUrl$3 = async (translationUrl) => {
+    if (translationUrl) {
+        try {
+            const response = await fetch(translationUrl);
+            if (!response.ok) {
+                throw new Error(`HTTP error! status: ${response.status}`);
+            }
+            const translations = await response.json();
+            getTranslations$5(translations);
+        }
+        catch (error) {
+            console.error('Failed to fetch or parse translations from URL:', error);
+        }
     }
-    return {};
-}
+};
 
-const lotteryBannerCss = ":host {\n  display: block;\n  container-type: inline-size;\n}\n\n.lottery-banner {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: var(--lottery-banner-gap, 0.5rem);\n  padding: var(--lottery-banner-padding, 0px 20px);\n  background: var(--lottery-banner-background, var(--emw--color-primary, #fed275));\n  border-top: var(--lottery-banner-border-width, 2px) var(--lottery-banner-border-style, solid) var(--lottery-banner-border-color, var(--emw--color-primary, #fed275));\n  border-bottom: var(--lottery-banner-border-width, 2px) var(--lottery-banner-border-style, solid) var(--lottery-banner-border-color, var(--emw--color-primary, #fed275));\n  border-left: var(--lottery-banner-border-left, none);\n  border-right: var(--lottery-banner-border-right, none);\n  border-radius: var(--lottery-banner-border-radius, 0);\n  white-space: nowrap;\n  height: var(--lottery-banner-height, 50px);\n  position: relative;\n  box-sizing: border-box;\n}\n\n.lottery-banner__logo-wrapper {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 100%;\n}\n.lottery-banner__logo-wrapper img {\n  height: 100%;\n  object-fit: var(--lottery-banner-logo-object-fit, contain);\n}\n\n.lottery-banner__item--center {\n  position: absolute;\n  left: 50%;\n  top: 50%;\n  transform: translate(-50%, -50%);\n}\n\n.lottery-banner__title {\n  text-align: center;\n  font-size: var(--lottery-banner-title-font-size, 1.5rem);\n  font-weight: 800;\n  font-style: italic;\n  letter-spacing: var(--lottery-banner-title-font-letter-spacing, 0.04em);\n  color: var(--emw--color-typography, #000);\n}\n\n.lottery-banner__info {\n  display: flex;\n  align-items: center;\n  gap: var(--lottery-banner-info-gap, 0.75rem);\n}\n\n.lottery-banner__info-item {\n  font-size: var(--lottery-banner-info-font-size, 0.9rem);\n  color: var(--lottery-banner-info-color, var(--emw--color-typography, #000));\n  display: inline-flex;\n  align-items: center;\n  gap: 0.3rem;\n}\n\n.lottery-banner__info-item-label {\n  color: var(--lottery-banner-info-label-color, var(--emw--color-typography, #000));\n}\n.lottery-banner__info-item-label__strong {\n  font-weight: var(--lottery-banner-info-label-font-weight, 700);\n}\n\n.lottery-banner__info-item-value {\n  font-weight: var(--lottery-banner-info-value-font-weight, inherit);\n  color: var(--lottery-banner-info-value-color, var(--emw--color-typography, #000));\n}\n.lottery-banner__info-item-value__strong {\n  font-weight: 700;\n}\n\n@container (max-width: 700px) {\n  .lottery-banner {\n    height: auto;\n    padding: var(--lottery-banner-mobile-padding, 0.5rem 1rem);\n  }\n  .lottery-banner__title {\n    flex-basis: 100%;\n    text-align: var(--lottery-banner-mobile-title-text-align, left);\n  }\n  .lottery-banner__info {\n    flex-direction: column;\n    align-items: flex-start;\n    gap: var(--lottery-banner-mobile-info-gap, 0.1rem);\n  }\n}";
+const lotteryBannerCss = ":host {\n  display: block;\n  container-type: inline-size;\n}\n\n.lottery-banner {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: var(--lottery-banner-gap, 0.5rem);\n  padding: var(--lottery-banner-padding, 0px 20px);\n  background: var(--lottery-banner-background, var(--emw--color-primary, #fed275));\n  border-top: var(--lottery-banner-border-width, 2px) var(--lottery-banner-border-style, solid) var(--lottery-banner-border-color, var(--emw--color-primary, #fed275));\n  border-bottom: var(--lottery-banner-border-width, 2px) var(--lottery-banner-border-style, solid) var(--lottery-banner-border-color, var(--emw--color-primary, #fed275));\n  border-left: var(--lottery-banner-border-left, none);\n  border-right: var(--lottery-banner-border-right, none);\n  border-radius: var(--lottery-banner-border-radius, 0);\n  white-space: nowrap;\n  height: var(--lottery-banner-height, 50px);\n  position: relative;\n  box-sizing: border-box;\n}\n\n.lottery-banner__logo-wrapper {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 100%;\n}\n.lottery-banner__logo-wrapper img {\n  height: 100%;\n  object-fit: var(--lottery-banner-logo-object-fit, contain);\n}\n\n.lottery-banner__item--center {\n  position: absolute;\n  left: 50%;\n  top: 50%;\n  transform: translate(-50%, -50%);\n}\n\n.lottery-banner__title {\n  text-align: center;\n  font-size: var(--lottery-banner-title-font-size, 1.5rem);\n  font-weight: 800;\n  font-style: italic;\n  letter-spacing: var(--lottery-banner-title-font-letter-spacing, 0.04em);\n  color: var(--emw--color-typography, #000);\n}\n\n.lottery-banner__info {\n  display: flex;\n  align-items: center;\n  gap: var(--lottery-banner-info-gap, 0.75rem);\n}\n\n.lottery-banner__info-item {\n  font-size: var(--lottery-banner-info-font-size, 0.9rem);\n  color: var(--lottery-banner-info-color, var(--emw--color-typography, #000));\n  display: inline-flex;\n  align-items: center;\n  gap: 0.3rem;\n}\n\n.lottery-banner__info-item-label {\n  color: var(--lottery-banner-info-label-color, var(--emw--color-typography, #000));\n}\n.lottery-banner__info-item-label__strong {\n  font-weight: var(--lottery-banner-info-label-font-weight, 700);\n}\n\n.lottery-banner__info-item-value {\n  font-weight: var(--lottery-banner-info-value-font-weight, inherit);\n  color: var(--lottery-banner-info-value-color, var(--emw--color-typography, #000));\n}\n.lottery-banner__info-item-value__strong {\n  font-weight: 700;\n}\n\nhelper-count-down::part(values) {\n  gap: 8px;\n}\n\n@container (max-width: 700px) {\n  .lottery-banner {\n    height: auto;\n    padding: var(--lottery-banner-mobile-padding, 0.5rem 1rem);\n  }\n  .lottery-banner__title {\n    flex-basis: 100%;\n    text-align: var(--lottery-banner-mobile-title-text-align, left);\n  }\n  .lottery-banner__info {\n    flex-direction: column;\n    align-items: flex-start;\n    gap: var(--lottery-banner-mobile-info-gap, 0.1rem);\n  }\n}";
 const LotteryBannerStyle0 = lotteryBannerCss;
 
 const LotteryBanner = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.lotteryBannerTimerStop = index.createEvent(this, "lotteryBannerTimerStop", 7);
+        this.lotteryBannerWagerStarted = index.createEvent(this, "lotteryBannerWagerStarted", 7);
+        this.handleCountdownFinish = () => {
+            this.isWagerStarted = true;
+            this.lotteryBannerWagerStarted.emit();
+        };
         this.mbSource = undefined;
         this.clientStyling = undefined;
         this.clientStylingUrl = undefined;
@@ -3055,7 +2974,8 @@ const LotteryBanner = class {
         this.bannerTitle = undefined;
         this.turnover = undefined;
         this.layout = 'logo,title,info';
-        this.formattedTime = undefined;
+        this.isWagerStarted = false;
+        this.formattedStopTime = undefined;
     }
     handleClientStylingChange(newValue, oldValue) {
         if (newValue !== oldValue) {
@@ -3073,29 +2993,23 @@ const LotteryBanner = class {
         }
     }
     handleTimeChange() {
-        this.startTimer();
+        this.checkWagerStatus();
     }
     async componentWillLoad() {
         if (this.translationUrl) {
             resolveTranslationUrl$3(this.translationUrl);
         }
-        this.startTimer();
+        this.checkWagerStatus();
     }
-    startTimer() {
-        if (this.timer) {
-            clearInterval(this.timer);
+    checkWagerStatus() {
+        if (this.startTime && isBefore(new Date(), parseISO(this.startTime))) {
+            this.isWagerStarted = false;
         }
-        this.updateTime();
-        this.timer = setInterval(() => {
-            this.updateTime();
-        }, 1000);
-    }
-    updateTime() {
-        var _a;
-        this.formattedTime = getWagerTime(this.startTime, this.stopTime);
-        if ((_a = this.formattedTime) === null || _a === void 0 ? void 0 : _a.end) {
-            this.timer && clearInterval(this.timer);
-            this.lotteryBannerTimerStop.emit();
+        else {
+            this.isWagerStarted = true;
+        }
+        if (this.stopTime) {
+            this.formattedStopTime = format(parseISO(this.stopTime), 'dd/MM/yyyy HH:mm');
         }
     }
     componentDidLoad() {
@@ -3110,10 +3024,8 @@ const LotteryBanner = class {
     }
     disconnectedCallback() {
         this.stylingSubscription && this.stylingSubscription.unsubscribe();
-        this.timer && clearInterval(this.timer);
     }
     renderElement(item, className = '') {
-        var _a, _b, _c;
         const poolGameLogo = index.getAssetPath('../static/poolGameLogo.webp');
         switch (item) {
             case 'logo':
@@ -3121,14 +3033,14 @@ const LotteryBanner = class {
             case 'title':
                 return this.bannerTitle && index.h("div", { class: `lottery-banner__title ${className}` }, this.bannerTitle);
             case 'info':
-                return (index.h("div", { class: `lottery-banner__info ${className}` }, ((_a = this.formattedTime) === null || _a === void 0 ? void 0 : _a.start) && (index.h("div", { class: "lottery-banner__info-item" }, index.h("span", { class: "lottery-banner__info-item-label" }, index.h("span", { class: "lottery-banner__info-item-label__strong" }, translate$5('startIn', this.language)), "\u00A0"), index.h("span", { class: "lottery-banner__info-item-value lottery-banner__info-item-value__strong" }, this.formattedTime.start))), ((_b = this.formattedTime) === null || _b === void 0 ? void 0 : _b.end) && (index.h("div", { class: "lottery-banner__info-item" }, index.h("span", { class: "lottery-banner__info-item-label" }, index.h("span", { class: "lottery-banner__info-item-label__strong" }, translate$5('stop', this.language)), "\u00A0", translate$5('at', this.language)), index.h("span", { class: "lottery-banner__info-item-value" }, this.formattedTime.end))), ((_c = this.formattedTime) === null || _c === void 0 ? void 0 : _c.end) && this.turnover !== null && this.turnover !== undefined && (index.h("div", { class: "lottery-banner__info-item" }, index.h("span", { class: "lottery-banner__info-item-label" }, translate$5('turnover', this.language)), index.h("span", { class: "lottery-banner__info-item-value" }, this.turnover)))));
+                return (index.h("div", { class: `lottery-banner__info ${className}` }, !this.isWagerStarted ? (index.h("div", { class: "lottery-banner__info-item" }, index.h("span", { class: "lottery-banner__info-item-label" }, index.h("span", { class: "lottery-banner__info-item-label__strong" }, translate$5('startIn', this.language)), "\u00A0"), index.h("helper-count-down", { class: "lottery-banner__info-item-value lottery-banner__info-item-value__strong", value: this.startTime, format: "DDD HHH mmM ssS", onCountDownFinish: this.handleCountdownFinish }))) : (index.h("div", { class: "lottery-banner__info-item" }, index.h("span", { class: "lottery-banner__info-item-label" }, index.h("span", { class: "lottery-banner__info-item-label__strong" }, translate$5('stop', this.language)), "\u00A0", translate$5('at', this.language)), index.h("span", { class: "lottery-banner__info-item-value" }, this.formattedStopTime))), this.isWagerStarted && this.turnover !== null && this.turnover !== undefined && (index.h("div", { class: "lottery-banner__info-item" }, index.h("span", { class: "lottery-banner__info-item-label" }, translate$5('turnover', this.language)), index.h("span", { class: "lottery-banner__info-item-value" }, this.turnover)))));
             default:
                 return null;
         }
     }
     render() {
         const layoutItems = this.layout.split(',').map((item) => item.trim());
-        return (index.h("section", { key: 'fe2c807504069e45cf9b9f04b754710b49930caf', ref: (el) => (this.stylingContainer = el), class: "lottery-banner" }, layoutItems.map((item, index) => {
+        return (index.h("section", { key: '3f14279ebff86c47ec5d5d7c4e1054c5899e8580', ref: (el) => (this.stylingContainer = el), class: "lottery-banner" }, layoutItems.map((item, index) => {
             const isMiddle = layoutItems.length === 3 && index === 1;
             const className = isMiddle ? 'lottery-banner__item--center' : '';
             return this.renderElement(item, className);
@@ -3738,7 +3650,7 @@ var qr=Object.defineProperty,Yr=Object.defineProperties;var Kr=Object.getOwnProp
  * SPDX-License-Identifier: BSD-3-Clause
  */const ze=globalThis,mo=s=>s,ht=ze.trustedTypes,fo=ht?ht.createPolicy("lit-html",{createHTML:s=>s}):void 0,ds="$lit$",W=`lit$${Math.random().toFixed(9).slice(2)}$`,cs="?"+W,an=`<${cs}>`,oe=document,Ne=()=>oe.createComment(""),Le=s=>s===null||typeof s!="object"&&typeof s!="function",Ii=Array.isArray,ln=s=>Ii(s)||typeof(s==null?void 0:s[Symbol.iterator])=="function",Bt=`[ 	
 \f\r]`,Ee=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,_o=/-->/g,vo=/>/g,Q=RegExp(`>|${Bt}(?:([^\\s"'>=/]+)(${Bt}*=${Bt}*(?:[^ 	
-\f\r"'\`<>=]|("|')|))|$)`,"g"),go=/'/g,bo=/"/g,hs=/^(?:script|style|textarea|title)$/i,fe=Symbol.for("lit-noChange"),A=Symbol.for("lit-nothing"),yo=new WeakMap,Z=oe.createTreeWalker(oe,129);function us(s,t){if(!Ii(s)||!s.hasOwnProperty("raw"))throw Error("invalid template strings array");return fo!==void 0?fo.createHTML(t):t}const dn=(s,t)=>{const e=s.length-1,i=[];let o,r=t===2?"<svg>":t===3?"<math>":"",n=Ee;for(let a=0;a<e;a++){const l=s[a];let d,c,h=-1,u=0;for(;u<l.length&&(n.lastIndex=u,c=n.exec(l),c!==null);)u=n.lastIndex,n===Ee?c[1]==="!--"?n=_o:c[1]!==void 0?n=vo:c[2]!==void 0?(hs.test(c[2])&&(o=RegExp("</"+c[2],"g")),n=Q):c[3]!==void 0&&(n=Q):n===Q?c[0]===">"?(n=o!=null?o:Ee,h=-1):c[1]===void 0?h=-2:(h=n.lastIndex-c[2].length,d=c[1],n=c[3]===void 0?Q:c[3]==='"'?bo:go):n===bo||n===go?n=Q:n===_o||n===vo?n=Ee:(n=Q,o=void 0);const f=n===Q&&s[a+1].startsWith("/>")?" ":"";r+=n===Ee?l+an:h>=0?(i.push(d),l.slice(0,h)+ds+l.slice(h)+W+f):l+W+(h===-2?a:f);}return [us(s,r+(s[e]||"<?>")+(t===2?"</svg>":t===3?"</math>":"")),i]};class Be{constructor({strings:t,_$litType$:e},i){let o;this.parts=[];let r=0,n=0;const a=t.length-1,l=this.parts,[d,c]=dn(t,e);if(this.el=Be.createElement(d,i),Z.currentNode=this.el.content,e===2||e===3){const h=this.el.content.firstChild;h.replaceWith(...h.childNodes);}for(;(o=Z.nextNode())!==null&&l.length<a;){if(o.nodeType===1){if(o.hasAttributes())for(const h of o.getAttributeNames())if(h.endsWith(ds)){const u=c[n++],f=o.getAttribute(h).split(W),_=/([.?@])?(.*)/.exec(u);l.push({type:1,index:r,name:_[2],strings:f,ctor:_[1]==="."?hn:_[1]==="?"?un:_[1]==="@"?pn:xt}),o.removeAttribute(h);}else h.startsWith(W)&&(l.push({type:6,index:r}),o.removeAttribute(h));if(hs.test(o.tagName)){const h=o.textContent.split(W),u=h.length-1;if(u>0){o.textContent=ht?ht.emptyScript:"";for(let f=0;f<u;f++)o.append(h[f],Ne()),Z.nextNode(),l.push({type:2,index:++r});o.append(h[u],Ne());}}}else if(o.nodeType===8)if(o.data===cs)l.push({type:2,index:r});else {let h=-1;for(;(h=o.data.indexOf(W,h+1))!==-1;)l.push({type:7,index:r}),h+=W.length-1;}r++;}}static createElement(t,e){const i=oe.createElement("template");return i.innerHTML=t,i}}function _e(s,t,e=s,i){var n,a,l;if(t===fe)return t;let o=i!==void 0?(n=e._$Co)==null?void 0:n[i]:e._$Cl;const r=Le(t)?void 0:t._$litDirective$;return (o==null?void 0:o.constructor)!==r&&((a=o==null?void 0:o._$AO)==null||a.call(o,!1),r===void 0?o=void 0:(o=new r(s),o._$AT(s,e,i)),i!==void 0?((l=e._$Co)!=null?l:e._$Co=[])[i]=o:e._$Cl=o),o!==void 0&&(t=_e(s,o._$AS(s,t.values),o,i)),t}class cn{constructor(t,e){this._$AV=[],this._$AN=void 0,this._$AD=t,this._$AM=e;}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(t){var d;const{el:{content:e},parts:i}=this._$AD,o=((d=t==null?void 0:t.creationScope)!=null?d:oe).importNode(e,!0);Z.currentNode=o;let r=Z.nextNode(),n=0,a=0,l=i[0];for(;l!==void 0;){if(n===l.index){let c;l.type===2?c=new qe(r,r.nextSibling,this,t):l.type===1?c=new l.ctor(r,l.name,l.strings,this,t):l.type===6&&(c=new mn(r,this,t)),this._$AV.push(c),l=i[++a];}n!==(l==null?void 0:l.index)&&(r=Z.nextNode(),n++);}return Z.currentNode=oe,o}p(t){let e=0;for(const i of this._$AV)i!==void 0&&(i.strings!==void 0?(i._$AI(t,i,e),e+=i.strings.length-2):i._$AI(t[e])),e++;}}class qe{get _$AU(){var t,e;return (e=(t=this._$AM)==null?void 0:t._$AU)!=null?e:this._$Cv}constructor(t,e,i,o){var r;this.type=2,this._$AH=A,this._$AN=void 0,this._$AA=t,this._$AB=e,this._$AM=i,this.options=o,this._$Cv=(r=o==null?void 0:o.isConnected)!=null?r:!0;}get parentNode(){let t=this._$AA.parentNode;const e=this._$AM;return e!==void 0&&(t==null?void 0:t.nodeType)===11&&(t=e.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,e=this){t=_e(this,t,e),Le(t)?t===A||t==null||t===""?(this._$AH!==A&&this._$AR(),this._$AH=A):t!==this._$AH&&t!==fe&&this._(t):t._$litType$!==void 0?this.$(t):t.nodeType!==void 0?this.T(t):ln(t)?this.k(t):this._(t);}O(t){return this._$AA.parentNode.insertBefore(t,this._$AB)}T(t){this._$AH!==t&&(this._$AR(),this._$AH=this.O(t));}_(t){this._$AH!==A&&Le(this._$AH)?this._$AA.nextSibling.data=t:this.T(oe.createTextNode(t)),this._$AH=t;}$(t){var r;const{values:e,_$litType$:i}=t,o=typeof i=="number"?this._$AC(t):(i.el===void 0&&(i.el=Be.createElement(us(i.h,i.h[0]),this.options)),i);if(((r=this._$AH)==null?void 0:r._$AD)===o)this._$AH.p(e);else {const n=new cn(o,this),a=n.u(this.options);n.p(e),this.T(a),this._$AH=n;}}_$AC(t){let e=yo.get(t.strings);return e===void 0&&yo.set(t.strings,e=new Be(t)),e}k(t){Ii(this._$AH)||(this._$AH=[],this._$AR());const e=this._$AH;let i,o=0;for(const r of t)o===e.length?e.push(i=new qe(this.O(Ne()),this.O(Ne()),this,this.options)):i=e[o],i._$AI(r),o++;o<e.length&&(this._$AR(i&&i._$AB.nextSibling,o),e.length=o);}_$AR(t=this._$AA.nextSibling,e){var i;for((i=this._$AP)==null?void 0:i.call(this,!1,!0,e);t!==this._$AB;){const o=mo(t).nextSibling;mo(t).remove(),t=o;}}setConnected(t){var e;this._$AM===void 0&&(this._$Cv=t,(e=this._$AP)==null||e.call(this,t));}}class xt{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(t,e,i,o,r){this.type=1,this._$AH=A,this._$AN=void 0,this.element=t,this.name=e,this._$AM=o,this.options=r,i.length>2||i[0]!==""||i[1]!==""?(this._$AH=Array(i.length-1).fill(new String),this.strings=i):this._$AH=A;}_$AI(t,e=this,i,o){const r=this.strings;let n=!1;if(r===void 0)t=_e(this,t,e,0),n=!Le(t)||t!==this._$AH&&t!==fe,n&&(this._$AH=t);else {const a=t;let l,d;for(t=r[0],l=0;l<r.length-1;l++)d=_e(this,a[i+l],e,l),d===fe&&(d=this._$AH[l]),n||(n=!Le(d)||d!==this._$AH[l]),d===A?t=A:t!==A&&(t+=(d!=null?d:"")+r[l+1]),this._$AH[l]=d;}n&&!o&&this.j(t);}j(t){t===A?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t!=null?t:"");}}class hn extends xt{constructor(){super(...arguments),this.type=3;}j(t){this.element[this.name]=t===A?void 0:t;}}class un extends xt{constructor(){super(...arguments),this.type=4;}j(t){this.element.toggleAttribute(this.name,!!t&&t!==A);}}class pn extends xt{constructor(t,e,i,o,r){super(t,e,i,o,r),this.type=5;}_$AI(t,e=this){var n;if((t=(n=_e(this,t,e,0))!=null?n:A)===fe)return;const i=this._$AH,o=t===A&&i!==A||t.capture!==i.capture||t.once!==i.once||t.passive!==i.passive,r=t!==A&&(i===A||o);o&&this.element.removeEventListener(this.name,this,i),r&&this.element.addEventListener(this.name,this,t),this._$AH=t;}handleEvent(t){var e,i;typeof this._$AH=="function"?this._$AH.call((i=(e=this.options)==null?void 0:e.host)!=null?i:this.element,t):this._$AH.handleEvent(t);}}class mn{constructor(t,e,i){this.element=t,this.type=6,this._$AN=void 0,this._$AM=e,this.options=i;}get _$AU(){return this._$AM._$AU}_$AI(t){_e(this,t);}}const Ft=ze.litHtmlPolyfillSupport;var ss;Ft==null||Ft(Be,qe),((ss=ze.litHtmlVersions)!=null?ss:ze.litHtmlVersions=[]).push("3.3.2");const ps=(s,t,e)=>{var r,n;const i=(r=e==null?void 0:e.renderBefore)!=null?r:t;let o=i._$litPart$;if(o===void 0){const a=(n=e==null?void 0:e.renderBefore)!=null?n:null;i._$litPart$=o=new qe(t.insertBefore(Ne(),a),a,void 0,e!=null?e:{});}return o._$AI(s),o};/**
+\f\r"'\`<>=]|("|')|))|$)`,"g"),go=/'/g,bo=/"/g,hs=/^(?:script|style|textarea|title)$/i,fe=Symbol.for("lit-noChange"),A=Symbol.for("lit-nothing"),yo=new WeakMap,Z=oe.createTreeWalker(oe,129);function us(s,t){if(!Ii(s)||!s.hasOwnProperty("raw"))throw Error("invalid template strings array");return fo!==void 0?fo.createHTML(t):t}const dn=(s,t)=>{const e=s.length-1,i=[];let o,r=t===2?"<svg>":t===3?"<math>":"",n=Ee;for(let a=0;a<e;a++){const l=s[a];let d,c,h=-1,u=0;for(;u<l.length&&(n.lastIndex=u,c=n.exec(l),c!==null);)u=n.lastIndex,n===Ee?c[1]==="!--"?n=_o:c[1]!==void 0?n=vo:c[2]!==void 0?(hs.test(c[2])&&(o=RegExp("</"+c[2],"g")),n=Q):c[3]!==void 0&&(n=Q):n===Q?c[0]===">"?(n=o!=null?o:Ee,h=-1):c[1]===void 0?h=-2:(h=n.lastIndex-c[2].length,d=c[1],n=c[3]===void 0?Q:c[3]==='"'?bo:go):n===bo||n===go?n=Q:n===_o||n===vo?n=Ee:(n=Q,o=void 0);const f=n===Q&&s[a+1].startsWith("/>")?" ":"";r+=n===Ee?l+an:h>=0?(i.push(d),l.slice(0,h)+ds+l.slice(h)+W+f):l+W+(h===-2?a:f);}return [us(s,r+(s[e]||"<?>")+(t===2?"</svg>":t===3?"</math>":"")),i]};class Be{constructor({strings:t,_$litType$:e},i){let o;this.parts=[];let r=0,n=0;const a=t.length-1,l=this.parts,[d,c]=dn(t,e);if(this.el=Be.createElement(d,i),Z.currentNode=this.el.content,e===2||e===3){const h=this.el.content.firstChild;h.replaceWith(...h.childNodes);}for(;(o=Z.nextNode())!==null&&l.length<a;){if(o.nodeType===1){if(o.hasAttributes())for(const h of o.getAttributeNames())if(h.endsWith(ds)){const u=c[n++],f=o.getAttribute(h).split(W),_=/([.?@])?(.*)/.exec(u);l.push({type:1,index:r,name:_[2],strings:f,ctor:_[1]==="."?hn:_[1]==="?"?un:_[1]==="@"?pn:xt}),o.removeAttribute(h);}else h.startsWith(W)&&(l.push({type:6,index:r}),o.removeAttribute(h));if(hs.test(o.tagName)){const h=o.textContent.split(W),u=h.length-1;if(u>0){o.textContent=ht?ht.emptyScript:"";for(let f=0;f<u;f++)o.append(h[f],Ne()),Z.nextNode(),l.push({type:2,index:++r});o.append(h[u],Ne());}}}else if(o.nodeType===8)if(o.data===cs)l.push({type:2,index:r});else {let h=-1;for(;(h=o.data.indexOf(W,h+1))!==-1;)l.push({type:7,index:r}),h+=W.length-1;}r++;}}static createElement(t,e){const i=oe.createElement("template");return i.innerHTML=t,i}}function _e(s,t,e=s,i){var n,a,l;if(t===fe)return t;let o=i!==void 0?(n=e._$Co)==null?void 0:n[i]:e._$Cl;const r=Le(t)?void 0:t._$litDirective$;return (o==null?void 0:o.constructor)!==r&&((a=o==null?void 0:o._$AO)==null||a.call(o,!1),r===void 0?o=void 0:(o=new r(s),o._$AT(s,e,i)),i!==void 0?((l=e._$Co)!=null?l:e._$Co=[])[i]=o:e._$Cl=o),o!==void 0&&(t=_e(s,o._$AS(s,t.values),o,i)),t}class cn{constructor(t,e){this._$AV=[],this._$AN=void 0,this._$AD=t,this._$AM=e;}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(t){var d;const{el:{content:e},parts:i}=this._$AD,o=((d=t==null?void 0:t.creationScope)!=null?d:oe).importNode(e,!0);Z.currentNode=o;let r=Z.nextNode(),n=0,a=0,l=i[0];for(;l!==void 0;){if(n===l.index){let c;l.type===2?c=new qe(r,r.nextSibling,this,t):l.type===1?c=new l.ctor(r,l.name,l.strings,this,t):l.type===6&&(c=new mn(r,this,t)),this._$AV.push(c),l=i[++a];}n!==(l==null?void 0:l.index)&&(r=Z.nextNode(),n++);}return Z.currentNode=oe,o}p(t){let e=0;for(const i of this._$AV)i!==void 0&&(i.strings!==void 0?(i._$AI(t,i,e),e+=i.strings.length-2):i._$AI(t[e])),e++;}}class qe{get _$AU(){var t,e;return (e=(t=this._$AM)==null?void 0:t._$AU)!=null?e:this._$Cv}constructor(t,e,i,o){var r;this.type=2,this._$AH=A,this._$AN=void 0,this._$AA=t,this._$AB=e,this._$AM=i,this.options=o,this._$Cv=(r=o==null?void 0:o.isConnected)!=null?r:!0;}get parentNode(){let t=this._$AA.parentNode;const e=this._$AM;return e!==void 0&&(t==null?void 0:t.nodeType)===11&&(t=e.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,e=this){t=_e(this,t,e),Le(t)?t===A||t==null||t===""?(this._$AH!==A&&this._$AR(),this._$AH=A):t!==this._$AH&&t!==fe&&this._(t):t._$litType$!==void 0?this.$(t):t.nodeType!==void 0?this.T(t):ln(t)?this.k(t):this._(t);}O(t){return this._$AA.parentNode.insertBefore(t,this._$AB)}T(t){this._$AH!==t&&(this._$AR(),this._$AH=this.O(t));}_(t){this._$AH!==A&&Le(this._$AH)?this._$AA.nextSibling.data=t:this.T(oe.createTextNode(t)),this._$AH=t;}$(t){var r;const{values:e,_$litType$:i}=t,o=typeof i=="number"?this._$AC(t):(i.el===void 0&&(i.el=Be.createElement(us(i.h,i.h[0]),this.options)),i);if(((r=this._$AH)==null?void 0:r._$AD)===o)this._$AH.p(e);else {const n=new cn(o,this),a=n.u(this.options);n.p(e),this.T(a),this._$AH=n;}}_$AC(t){let e=yo.get(t.strings);return e===void 0&&yo.set(t.strings,e=new Be(t)),e}k(t){Ii(this._$AH)||(this._$AH=[],this._$AR());const e=this._$AH;let i,o=0;for(const r of t)o===e.length?e.push(i=new qe(this.O(Ne()),this.O(Ne()),this,this.options)):i=e[o],i._$AI(r),o++;o<e.length&&(this._$AR(i&&i._$AB.nextSibling,o),e.length=o);}_$AR(t=this._$AA.nextSibling,e){var i;for((i=this._$AP)==null?void 0:i.call(this,!1,!0,e);t!==this._$AB;){const o=mo(t).nextSibling;mo(t).remove(),t=o;}}setConnected(t){var e;this._$AM===void 0&&(this._$Cv=t,(e=this._$AP)==null||e.call(this,t));}}class xt{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(t,e,i,o,r){this.type=1,this._$AH=A,this._$AN=void 0,this.element=t,this.name=e,this._$AM=o,this.options=r,i.length>2||i[0]!==""||i[1]!==""?(this._$AH=Array(i.length-1).fill(new String),this.strings=i):this._$AH=A;}_$AI(t,e=this,i,o){const r=this.strings;let n=!1;if(r===void 0)t=_e(this,t,e,0),n=!Le(t)||t!==this._$AH&&t!==fe,n&&(this._$AH=t);else {const a=t;let l,d;for(t=r[0],l=0;l<r.length-1;l++)d=_e(this,a[i+l],e,l),d===fe&&(d=this._$AH[l]),n||(n=!Le(d)||d!==this._$AH[l]),d===A?t=A:t!==A&&(t+=(d!=null?d:"")+r[l+1]),this._$AH[l]=d;}n&&!o&&this.j(t);}j(t){t===A?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t!=null?t:"");}}class hn extends xt{constructor(){super(...arguments),this.type=3;}j(t){this.element[this.name]=t===A?void 0:t;}}class un extends xt{constructor(){super(...arguments),this.type=4;}j(t){this.element.toggleAttribute(this.name,!!t&&t!==A);}}class pn extends xt{constructor(t,e,i,o,r){super(t,e,i,o,r),this.type=5;}_$AI(t,e=this){var n;if((t=(n=_e(this,t,e,0))!=null?n:A)===fe)return;const i=this._$AH,o=t===A&&i!==A||t.capture!==i.capture||t.once!==i.once||t.passive!==i.passive,r=t!==A&&(i===A||o);o&&this.element.removeEventListener(this.name,this,i),r&&this.element.addEventListener(this.name,this,t),this._$AH=t;}handleEvent(t){var e,i;typeof this._$AH=="function"?this._$AH.call((i=(e=this.options)==null?void 0:e.host)!=null?i:this.element,t):this._$AH.handleEvent(t);}}class mn{constructor(t,e,i){this.element=t,this.type=6,this._$AN=void 0,this._$AM=e,this.options=i;}get _$AU(){return this._$AM._$AU}_$AI(t){_e(this,t);}}const Ft=ze.litHtmlPolyfillSupport;var ss;Ft==null||Ft(Be,qe),((ss=ze.litHtmlVersions)!=null?ss:ze.litHtmlVersions=[]).push("3.3.3");const ps=(s,t,e)=>{var r,n;const i=(r=e==null?void 0:e.renderBefore)!=null?r:t;let o=i._$litPart$;if(o===void 0){const a=(n=e==null?void 0:e.renderBefore)!=null?n:null;i._$litPart$=o=new qe(t.insertBefore(Ne(),a),a,void 0,e!=null?e:{});}return o._$AI(s),o};/**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
@@ -11431,6 +11343,7 @@ const DEFAULT_LANGUAGE = 'en';
 const SUPPORTED_LANGUAGES = ['ro', 'en', 'fr', 'ar', 'hr'];
 const TRANSLATIONS = {
     en: {
+        gameNotAvailable: 'Sorry. The Game is not available now.',
         stop: 'Stop',
         at: 'at',
         turnover: 'Turnover: ',
@@ -11749,7 +11662,7 @@ async function fetchSaleStatistics({ endpoint, gameId, drawId }) {
     }
 }
 
-const lotteryTippingTicketControllerCss = ".lottery-tipping-ticket-controller__container {\n  display: block;\n  box-sizing: border-box;\n  font-size: 14px;\n  container-type: inline-size;\n  background: var(--emw--color-background, #fff);\n}\n@container (max-width: 375px) {\n  .lottery-tipping-ticket-controller__container {\n    font-size: 12px;\n  }\n}\n\n.LotteryTippingTicketController__top {\n  padding: 1.8rem;\n  display: flex;\n  flex-direction: column;\n  gap: 2rem;\n  margin: 0 auto;\n  max-width: 800px;\n}\n.LotteryTippingTicketController__row {\n  display: flex;\n  align-items: center;\n  gap: 1rem;\n  justify-content: space-between;\n  flex-wrap: wrap;\n}\n.LotteryTippingTicketController__section {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n}\n.LotteryTippingTicketController__label {\n  font-weight: 500;\n  white-space: nowrap;\n  width: 6rem;\n  color: var(--emw--color-typography-secondary, #333);\n}\n.LotteryTippingTicketController__segmented-control {\n  height: 2.2rem;\n  display: inline-flex;\n  background-color: var(--emw--color-background-secondary, #f5f5f5);\n  border-radius: 2rem;\n  padding: 0.2rem;\n}\n.LotteryTippingTicketController__segment {\n  background-color: transparent;\n  border: none;\n  padding: 0.3rem 0.8rem;\n  cursor: pointer;\n  font-weight: 500;\n  border-radius: 2rem;\n  outline: none;\n  transition: background-color 0.25s ease, color 0.25s ease;\n  white-space: nowrap;\n  color: var(--emw--color-typography, #000);\n}\n.LotteryTippingTicketController__segment--active {\n  background-color: var(--emw--color-background, #ffffff);\n  color: var(--emw--color-typography, #000);\n  font-weight: 600;\n}\n.LotteryTippingTicketController__segment--disabled:hover {\n  cursor: not-allowed !important;\n}\n.LotteryTippingTicketController__segment:not(.LotteryTippingTicketController__segment--active):hover {\n  background-color: var(--emw--color-background-tertiary, #ccc);\n}\n\n.flex {\n  display: flex;\n}\n\n.flex-wrap {\n  flex-wrap: wrap;\n}\n\n.align-center {\n  align-items: center;\n}\n\n.gap-1 {\n  gap: 4px;\n}\n\n.LotteryTippingTicketController__main {\n  align-items: flex-start;\n  justify-content: center;\n  gap: 2rem;\n  max-width: 1200px;\n  margin: 0 auto;\n  padding: 0 20px;\n  flex-wrap: wrap;\n}\n.LotteryTippingTicketController__main--left {\n  border: 1px solid var(--emw--color-gray-50, #f5f5f5);\n  padding: 1rem;\n  border-radius: 1rem;\n  flex: 1.5;\n}\n.LotteryTippingTicketController__main--right {\n  padding: 1rem;\n  border-radius: 1rem;\n  flex: 1;\n}\n\n.order-summary {\n  max-width: 360px;\n  width: 100%;\n  background: var(--emw--color-background, #fff);\n}\n\n.order-summary__title {\n  margin-bottom: 16px;\n  text-align: center;\n  color: var(--emw--color-typography, #000);\n  text-transform: uppercase;\n}\n\n.order-summary__ticket-info {\n  display: flex;\n  align-items: center;\n  margin-bottom: 16px;\n  gap: 10px;\n  color: var(--emw--color-typography, #000);\n}\n\n.order-summary__ticket {\n  font-weight: 500;\n  width: 50px;\n  text-align: right;\n  color: var(--emw--color-typography, #000);\n}\n\n.order-summary__details {\n  display: flex;\n  align-items: center;\n  color: var(--emw--color-typography, #000);\n}\n\n.order-summary__multiplier {\n  color: var(--emw--color-typography-secondary, #333);\n  margin: 0 8px;\n}\n\n.order-summary__divider {\n  border: none;\n  border-top: 1px solid var(--emw--color-gray-100, #e6e6e6);\n  margin: 20px 0;\n}\n\n.order-summary__button-wrapper {\n  display: flex;\n  justify-content: center;\n}\n\n.order-summary__button {\n  cursor: pointer;\n  padding: 0.8rem 4rem;\n  background: var(--emw--color-primary, #fed275);\n  color: var(--emw--color-typography, #000);\n  border-radius: var(--emw--button-border-radius, 4px);\n  border: none;\n  position: relative;\n}\n\n.loading-icon {\n  position: absolute;\n  right: 40px;\n  top: 10px;\n}\n\n.order-summary__button:not(.order-summary__button--disabled):not(.order-summary__button--loading):hover {\n  transform: translateY(-1px);\n  background: var(--emw--color-primary-variant, #ffe66f);\n}\n\n.order-summary__button--loading {\n  background: var(--emw--color-primary-variant, #ffe66f);\n  cursor: not-allowed;\n}\n\n.order-summary__button--disabled {\n  background: var(--emw--color-background-secondary, #f5f5f5);\n  color: var(--emw--color-typography, #000);\n  cursor: not-allowed;\n}\n\n.skeleton-content {\n  display: flex;\n  flex-direction: column;\n  gap: 29px;\n  align-items: center;\n}\n\n.skeleton-item {\n  background: var(--emw--color-background-secondary, #f5f5f5);\n  border-radius: 4px;\n  height: 40px;\n  width: 200px;\n}\n\n.skeleton-animated {\n  animation: skeleton-shimmer 1.5s infinite linear;\n  background: linear-gradient(90deg, var(--emw--color-background-secondary, #f5f5f5) 25%, var(--emw--color-background-tertiary, #ccc) 37%, var(--emw--color-background-secondary, #f5f5f5) 63%);\n  background-size: 200% 100%;\n}\n\n@keyframes skeleton-shimmer {\n  to {\n    background-position: 100% 0;\n  }\n}\n.loading-icon.scale {\n  animation: scale 1s infinite ease-in-out;\n}\n\n@keyframes scale {\n  0%, 100% {\n    transform: scale(1);\n  }\n  50% {\n    transform: scale(1.2);\n  }\n}";
+const lotteryTippingTicketControllerCss = ".lottery-tipping-ticket-controller__container {\n  display: block;\n  box-sizing: border-box;\n  font-size: 14px;\n  container-type: inline-size;\n  background: var(--emw--color-background, #fff);\n}\n@container (max-width: 375px) {\n  .lottery-tipping-ticket-controller__container {\n    font-size: 12px;\n  }\n}\n\n.LotteryTippingTicketController__top {\n  padding: 1.8rem;\n  display: flex;\n  flex-direction: column;\n  gap: 2rem;\n  margin: 0 auto;\n  max-width: 800px;\n}\n.LotteryTippingTicketController__row {\n  display: flex;\n  align-items: center;\n  gap: 1rem;\n  justify-content: space-between;\n  flex-wrap: wrap;\n}\n.LotteryTippingTicketController__section {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n}\n.LotteryTippingTicketController__label {\n  font-weight: 500;\n  white-space: nowrap;\n  width: 6rem;\n  color: var(--emw--color-typography-secondary, #333);\n}\n.LotteryTippingTicketController__segmented-control {\n  height: 2.2rem;\n  display: inline-flex;\n  background-color: var(--emw--color-background-secondary, #f5f5f5);\n  border-radius: 2rem;\n  padding: 0.2rem;\n}\n.LotteryTippingTicketController__segment {\n  background-color: transparent;\n  border: none;\n  padding: 0.3rem 0.8rem;\n  cursor: pointer;\n  font-weight: 500;\n  border-radius: 2rem;\n  outline: none;\n  transition: background-color 0.25s ease, color 0.25s ease;\n  white-space: nowrap;\n  color: var(--emw--color-typography, #000);\n}\n.LotteryTippingTicketController__segment--active {\n  background-color: var(--emw--color-background, #ffffff);\n  color: var(--emw--color-typography, #000);\n  font-weight: 600;\n}\n.LotteryTippingTicketController__segment--disabled:hover {\n  cursor: not-allowed !important;\n}\n.LotteryTippingTicketController__segment:not(.LotteryTippingTicketController__segment--active):hover {\n  background-color: var(--emw--color-background-tertiary, #ccc);\n}\n\n.flex {\n  display: flex;\n}\n\n.flex-wrap {\n  flex-wrap: wrap;\n}\n\n.align-center {\n  align-items: center;\n}\n\n.gap-1 {\n  gap: 4px;\n}\n\n.LotteryTippingTicketController__main {\n  align-items: flex-start;\n  justify-content: center;\n  gap: 2rem;\n  max-width: 1200px;\n  margin: 0 auto;\n  padding: 0 20px;\n  flex-wrap: wrap;\n}\n.LotteryTippingTicketController__main--left {\n  border: 1px solid var(--emw--color-gray-50, #f5f5f5);\n  padding: 1rem;\n  border-radius: 1rem;\n  flex: 1.5;\n}\n.LotteryTippingTicketController__main--right {\n  padding: 1rem;\n  border-radius: 1rem;\n  flex: 1;\n}\n\n.order-summary {\n  max-width: 360px;\n  width: 100%;\n  background: var(--emw--color-background, #fff);\n}\n\n.order-summary__title {\n  margin-bottom: 16px;\n  text-align: center;\n  color: var(--emw--color-typography, #000);\n  text-transform: uppercase;\n}\n\n.order-summary__ticket-info {\n  display: flex;\n  align-items: center;\n  margin-bottom: 16px;\n  gap: 10px;\n  color: var(--emw--color-typography, #000);\n}\n\n.order-summary__ticket {\n  font-weight: 500;\n  width: 50px;\n  text-align: right;\n  color: var(--emw--color-typography, #000);\n}\n\n.order-summary__details {\n  display: flex;\n  align-items: center;\n  color: var(--emw--color-typography, #000);\n}\n\n.order-summary__multiplier {\n  color: var(--emw--color-typography-secondary, #333);\n  margin: 0 8px;\n}\n\n.order-summary__divider {\n  border: none;\n  border-top: 1px solid var(--emw--color-gray-100, #e6e6e6);\n  margin: 20px 0;\n}\n\n.order-summary__button-wrapper {\n  display: flex;\n  justify-content: center;\n}\n\n.order-summary__button {\n  cursor: pointer;\n  padding: 0.8rem 4rem;\n  background: var(--emw--color-primary, #fed275);\n  color: var(--emw--color-typography, #000);\n  border-radius: var(--emw--button-border-radius, 4px);\n  border: none;\n  position: relative;\n}\n\n.loading-icon {\n  position: absolute;\n  right: 40px;\n  top: 10px;\n}\n\n.order-summary__button:not(.order-summary__button--disabled):not(.order-summary__button--loading):hover {\n  transform: translateY(-1px);\n  background: var(--emw--color-primary-variant, #ffe66f);\n}\n\n.order-summary__button--loading {\n  background: var(--emw--color-primary-variant, #ffe66f);\n  cursor: not-allowed;\n}\n\n.order-summary__button--disabled {\n  background: var(--emw--color-background-secondary, #f5f5f5);\n  color: var(--emw--color-typography, #000);\n  cursor: not-allowed;\n}\n\n.skeleton-content {\n  display: flex;\n  flex-direction: column;\n  gap: 29px;\n  align-items: center;\n}\n\n.skeleton-item {\n  background: var(--emw--color-background-secondary, #f5f5f5);\n  border-radius: 4px;\n  height: 40px;\n  width: 200px;\n}\n\n.skeleton-animated {\n  animation: skeleton-shimmer 1.5s infinite linear;\n  background: linear-gradient(90deg, var(--emw--color-background-secondary, #f5f5f5) 25%, var(--emw--color-background-tertiary, #ccc) 37%, var(--emw--color-background-secondary, #f5f5f5) 63%);\n  background-size: 200% 100%;\n}\n\n@keyframes skeleton-shimmer {\n  to {\n    background-position: 100% 0;\n  }\n}\n.loading-icon.scale {\n  animation: scale 1s infinite ease-in-out;\n}\n\n@keyframes scale {\n  0%, 100% {\n    transform: scale(1);\n  }\n  50% {\n    transform: scale(1.2);\n  }\n}\n.noActiveDraw {\n  margin: 30% auto 0px;\n  padding: 24px;\n  border: 2px solid var(--emw--color-primary, #fed275);\n  border-radius: 4px;\n  width: 280px;\n  color: var(--emw--color-typography, #000);\n}";
 const LotteryTippingTicketControllerStyle0 = lotteryTippingTicketControllerCss;
 
 const LotteryTippingTicketController = class {
@@ -11778,12 +11691,14 @@ const LotteryTippingTicketController = class {
         this.hasSelectBullet = undefined;
         this.hasSelectAllBullet = undefined;
         this.totalLineCombination = 0;
-        this.submitLoading = undefined;
+        this.submitLoading = false;
+        this.isSalesActive = false;
         this.drawSubmitAvailable = false;
         this.rawData = {};
         this.saleStatisticsInfo = {};
         this.currentStake = undefined;
         this.dialogConfig = { visible: false };
+        this.gameUnavailable = false;
     }
     async getLotteryTippingBulletResults() {
         return await this.childRef.getData();
@@ -11950,9 +11865,6 @@ const LotteryTippingTicketController = class {
             lotteryTippingPage.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
         }
     }
-    handleTimerStop() {
-        this.drawSubmitAvailable = true;
-    }
     componentWillLoad() {
         if (this.translationUrl) {
             resolveTranslationUrl(this.translationUrl);
@@ -11971,6 +11883,33 @@ const LotteryTippingTicketController = class {
     disconnectedCallback() {
         this.stylingSubscription && this.stylingSubscription.unsubscribe();
     }
+    updateDrawSalesStatus() {
+        var _a;
+        const currentDraw = (_a = this.rawData) === null || _a === void 0 ? void 0 : _a.currentDraw;
+        if (!currentDraw) {
+            this.gameUnavailable = true;
+            this.isSalesActive = false;
+            return;
+        }
+        const now = new Date();
+        const wagerStartTime = currentDraw.wagerStartTime ? parseISO(currentDraw.wagerStartTime) : null;
+        const wagerCloseTime = currentDraw.wagerCloseTime ? parseISO(currentDraw.wagerCloseTime) : null;
+        // Rule 1: If the current time < the opening - sale time → display "Start in" countDown and disable the button.
+        if (wagerStartTime && isBefore(now, wagerStartTime)) {
+            this.isSalesActive = false;
+            this.gameUnavailable = false;
+        }
+        // Rule 2: If the opening-sale time < the current time < the closing time → display "Stop at xx time" to remind the player.
+        else if (wagerStartTime && wagerCloseTime && isAfter(now, wagerStartTime) && isBefore(now, wagerCloseTime)) {
+            this.isSalesActive = true;
+            this.gameUnavailable = false;
+        }
+        // Rule 3: If the current time > the closing time → the game is unavailable.
+        else {
+            this.gameUnavailable = true;
+            this.isSalesActive = false;
+        }
+    }
     connectedCallback() {
         const fetchData = () => {
             let url = new URL(`${this.endpoint}/games/${this.gameId}`);
@@ -11991,6 +11930,7 @@ const LotteryTippingTicketController = class {
                 });
                 this.handleBettingTypeChange(bettingType);
                 this.selectedPlayingMode = playMode;
+                this.updateDrawSalesStatus();
                 return this.updateSaleStatistics();
             })
                 .catch((err) => {
@@ -12013,6 +11953,14 @@ const LotteryTippingTicketController = class {
         });
     }
     async handleSubmit() {
+        this.updateDrawSalesStatus();
+        if (!this.isSalesActive) {
+            showNotification({
+                message: 'Sales for this period have closed.',
+                theme: 'error'
+            });
+            return;
+        }
         const rawResults = await this.getLotteryTippingBulletResults();
         const { betTypeId, betType } = getPlayTypeConfig({
             rawData: this.rawData,
@@ -12078,11 +12026,14 @@ const LotteryTippingTicketController = class {
         return (index.h("div", { class: "LotteryTippingTicketController__main--right order-summary" }, index.h("h3", { class: "order-summary__title" }, translate('orderSummaryTitle', this.language)), index.h("div", { class: "order-summary__ticket-info" }, index.h("div", { class: "order-summary__ticket" }, translate('orderSummaryTickets', this.language), ":"), index.h("div", { class: "order-summary__details" }, index.h("span", { class: "order-summary__line-count" }, this.lineCountRender), index.h("div", null, this.currentStake && index.h("span", { class: "order-summary__multiplier" }, "x"), index.h("span", { class: "order-summary__stake" }, this.currentStakeFormatted)), this.isBothBettingType && (index.h("div", null, index.h("span", { class: "order-summary__multiplier" }, "x"), index.h("span", { class: "order-summary__stake" }, this.bothBettingTypeMultiplier))))), index.h("hr", { class: "order-summary__divider" }), index.h("div", { class: "order-summary__ticket-info" }, index.h("div", { class: "order-summary__ticket" }, translate('orderSummaryTotal', this.language), ":"), index.h("span", { class: "order-summary__details" }, this.totalAmountFormatted)), index.h("div", { class: "order-summary__button-wrapper" }, index.h("lottery-button", { onClick: this.handleSubmit.bind(this), loading: this.submitLoading, disabled: !this.hasSelectAllBullet ||
                 this.submitLoading ||
                 ((_a = this.currentStake) === null || _a === void 0 ? void 0 : _a.value) === undefined ||
-                !this.drawSubmitAvailable, text: translate('orderSummarySubmit', this.language) }))));
+                !this.isSalesActive, text: translate('orderSummarySubmit', this.language) }))));
     }
     render() {
         var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
-        return (index.h("div", { key: '8f520b33fe0b935feb26e39baa840457ccc357df', class: "lottery-tipping-ticket-controller__container", ref: (el) => (this.stylingContainer = el) }, index.h("lottery-banner", { key: '10ddfb775cfe7c8f2c980414302123309a7ad7d1', "client-styling": this.clientStyling, "client-styling-Url": this.clientStylingUrl, stopTime: (_b = (_a = this.rawData) === null || _a === void 0 ? void 0 : _a.currentDraw) === null || _b === void 0 ? void 0 : _b.wagerCloseTime, startTime: (_d = (_c = this.rawData) === null || _c === void 0 ? void 0 : _c.currentDraw) === null || _d === void 0 ? void 0 : _d.wagerStartTime, "banner-title": formattedWeekName((_f = (_e = this.rawData) === null || _e === void 0 ? void 0 : _e.currentDraw) === null || _f === void 0 ? void 0 : _f.date), turnover: formattedTurnover((_h = (_g = this.saleStatisticsInfo) === null || _g === void 0 ? void 0 : _g.wagerSegment) === null || _h === void 0 ? void 0 : _h.totalSalesCrossDraw), language: this.language, "translation-url": this.translationUrl, onLotteryBannerTimerStop: this.handleTimerStop.bind(this) }), this.renderBettingControls(), index.h("div", { key: 'add963c6aaa5f852f589fc1b20b31882d62ca8db', class: "flex flex-wrap LotteryTippingTicketController__main" }, index.h("div", { key: '55c990ea441ca3b2192c3dbaa328dd31046b6d9c', class: "LotteryTippingTicketController__main--left" }, index.h("lottery-tipping-ticket-bet", { key: '7511cd997bfef3688e60afd207c109bfe20637cd', ref: (el) => (this.childRef = el), endpoint: this.endpoint, "session-id": this.sessionId, "game-id": (_j = this.rawData) === null || _j === void 0 ? void 0 : _j.type, "draw-id": this.drawId, language: this.language, "translation-url": this.translationUrl, "max-total-pages": this.lineNumberRange.maxLineNumber, "min-total-pages": this.lineNumberRange.minLineNumber, "total-pages": this.lineNumberRange.defaultBoards, mode: this.selectedPlayingMode === PlayModeEnum.SingleBet ? 'single' : 'multi', "client-styling": this.clientStyling, "client-styling-Url": this.clientStylingUrl })), this.renderOrderSummary()), this.dialogConfig.visible && (index.h("vaadin-confirm-dialog", { key: 'dfc1353806484dc8614d19737f922113a18099af', rejectButtonVisible: true, rejectText: translate('cancel', this.language), confirmText: translate('confirm', this.language), opened: (_k = this.dialogConfig) === null || _k === void 0 ? void 0 : _k.visible, onConfirm: this.dialogConfig.onConfirm, onReject: this.dialogConfig.onCancel }, (_l = this.dialogConfig) === null || _l === void 0 ? void 0 : _l.content))));
+        if (this.gameUnavailable) {
+            return (index.h("div", { class: "lottery-tipping-ticket-controller__container", ref: (el) => (this.stylingContainer = el) }, index.h("div", { class: "noActiveDraw" }, translate('gameNotAvailable', this.language))));
+        }
+        return (index.h("div", { class: "lottery-tipping-ticket-controller__container", ref: (el) => (this.stylingContainer = el) }, index.h("lottery-banner", { "client-styling": this.clientStyling, "client-styling-Url": this.clientStylingUrl, stopTime: (_b = (_a = this.rawData) === null || _a === void 0 ? void 0 : _a.currentDraw) === null || _b === void 0 ? void 0 : _b.wagerCloseTime, startTime: (_d = (_c = this.rawData) === null || _c === void 0 ? void 0 : _c.currentDraw) === null || _d === void 0 ? void 0 : _d.wagerStartTime, "banner-title": formattedWeekName((_f = (_e = this.rawData) === null || _e === void 0 ? void 0 : _e.currentDraw) === null || _f === void 0 ? void 0 : _f.date), turnover: formattedTurnover((_h = (_g = this.saleStatisticsInfo) === null || _g === void 0 ? void 0 : _g.wagerSegment) === null || _h === void 0 ? void 0 : _h.totalSalesCrossDraw), language: this.language, onLotteryBannerWagerStarted: () => this.updateDrawSalesStatus(), "translation-url": this.translationUrl }), this.renderBettingControls(), index.h("div", { class: "flex flex-wrap LotteryTippingTicketController__main" }, index.h("div", { class: "LotteryTippingTicketController__main--left" }, index.h("lottery-tipping-ticket-bet", { ref: (el) => (this.childRef = el), endpoint: this.endpoint, "session-id": this.sessionId, "game-id": (_j = this.rawData) === null || _j === void 0 ? void 0 : _j.type, "draw-id": this.drawId, language: this.language, "translation-url": this.translationUrl, "max-total-pages": this.lineNumberRange.maxLineNumber, "min-total-pages": this.lineNumberRange.minLineNumber, "total-pages": this.lineNumberRange.defaultBoards, mode: this.selectedPlayingMode === PlayModeEnum.SingleBet ? 'single' : 'multi', "client-styling": this.clientStyling, "client-styling-Url": this.clientStylingUrl })), this.renderOrderSummary()), this.dialogConfig.visible && (index.h("vaadin-confirm-dialog", { rejectButtonVisible: true, rejectText: translate('cancel', this.language), confirmText: translate('confirm', this.language), opened: (_k = this.dialogConfig) === null || _k === void 0 ? void 0 : _k.visible, onConfirm: this.dialogConfig.onConfirm, onReject: this.dialogConfig.onCancel }, (_l = this.dialogConfig) === null || _l === void 0 ? void 0 : _l.content))));
     }
     static get assetsDirs() { return ["../static"]; }
     static get watchers() { return {
@@ -17420,6 +17371,7 @@ LotteryTippingTicketHistory.style = LotteryTippingTicketHistoryStyle0;
 exports.lottery_tipping_page = lotteryTippingPage.LotteryTippingPage;
 exports.general_multi_select = GeneralMultiSelect;
 exports.general_tooltip = GeneralTooltip;
+exports.helper_count_down = HelperCountDown;
 exports.lottery_banner = LotteryBanner;
 exports.lottery_button = LotteryButton;
 exports.lottery_tipping_bullet = LotteryTippingBullet;