@everymatrix/casino-challenges-overlay-drawer 0.4.0 → 0.4.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (26) hide show
  1. package/dist/casino-challenges-overlay-drawer/casino-challenge-details-events_21.entry.js +1 -1
  2. package/dist/casino-challenges-overlay-drawer/casino-challenges-overlay-drawer-22f199a0.js +1 -0
  3. package/dist/casino-challenges-overlay-drawer/casino-challenges-overlay-drawer.esm.js +1 -1
  4. package/dist/casino-challenges-overlay-drawer/index.esm.js +1 -1
  5. package/dist/cjs/casino-challenge-details-events_21.cjs.entry.js +32 -14
  6. package/dist/cjs/{casino-challenges-overlay-drawer-fc0f80db.js → casino-challenges-overlay-drawer-47aaa28f.js} +12 -3
  7. package/dist/cjs/casino-challenges-overlay-drawer.cjs.js +1 -1
  8. package/dist/cjs/index.cjs.js +1 -1
  9. package/dist/cjs/loader.cjs.js +1 -1
  10. package/dist/collection/components/casino-challenges-overlay-drawer/casino-challenges-overlay-drawer.js +27 -4
  11. package/dist/collection/components/components/casino-challenges-overlay-tabs/casino-challenges-overlay-tabs.css +5 -2
  12. package/dist/collection/components/components/casino-challenges-overlay-tabs/casino-challenges-overlay-tabs.js +41 -9
  13. package/dist/collection/components/components/swipe-up/swipe-up.css +22 -0
  14. package/dist/collection/components/components/swipe-up/swipe-up.js +9 -2
  15. package/dist/collection/utils/types.js +7 -0
  16. package/dist/esm/casino-challenge-details-events_21.entry.js +33 -15
  17. package/dist/esm/{casino-challenges-overlay-drawer-7f1fbfff.js → casino-challenges-overlay-drawer-22f199a0.js} +13 -4
  18. package/dist/esm/casino-challenges-overlay-drawer.js +1 -1
  19. package/dist/esm/index.js +1 -1
  20. package/dist/esm/loader.js +1 -1
  21. package/dist/types/components/casino-challenges-overlay-drawer/casino-challenges-overlay-drawer.d.ts +2 -1
  22. package/dist/types/components/components/casino-challenges-overlay-tabs/casino-challenges-overlay-tabs.d.ts +3 -1
  23. package/dist/types/components.d.ts +6 -2
  24. package/dist/types/utils/types.d.ts +6 -0
  25. package/package.json +1 -1
  26. package/dist/casino-challenges-overlay-drawer/casino-challenges-overlay-drawer-7f1fbfff.js +0 -1
package/dist/collection/components/casino-challenges-overlay-drawer/casino-challenges-overlay-drawer.js CHANGED
@@ -2,7 +2,7 @@ import { h } from "@stencil/core";
2
2
  import { setClientStyling, setClientStylingURL, setStreamStyling } from "../../../../../../../../libs/common/src/styling/index";
3
3
  import { hasUpdateDataChanged, isMobile as isMobileView } from "../../utils/utils";
4
4
  import { resolveTranslationUrl, translate, TRANSLATIONS } from "../../utils/locale.utils";
5
- import { EChallengeProgressStatus, EChallengesTabs, EChallengeStatus, EPostMessageRequestType, EPostMessageResponseType } from "../../utils/types";
5
+ import { EChallengeProgressStatus, EChallengesTabs, EChallengeStatus, EFeatureFlags, EPostMessageRequestType, EPostMessageResponseType } from "../../utils/types";
6
6
  import crossSvg from "../../assets/cross.svg";
7
7
  import errorIcon from "../../assets/error.svg";
8
8
  import checkIcon from "../../assets/check.svg";
@@ -112,7 +112,7 @@ export class CasinoChallengesOverlayDrawer {
112
112
  return (h("div", { class: `notification ${((_a = this.notification) === null || _a === void 0 ? void 0 : _a.errored) ? 'errored' : ''}` }, h("div", { class: "row" }, h("img", { src: ((_b = this.notification) === null || _b === void 0 ? void 0 : _b.errored) ? errorIcon : checkIcon, class: "notification__icon", alt: "" }), h("p", { class: "notification__message" }, (_c = this.notification) === null || _c === void 0 ? void 0 : _c.message))));
113
113
  };
114
114
  this.renderHeader = (isMobile) => {
115
- return (h("div", null, h("h1", { class: "challenges__drawer__title" }, h("span", null, translate('title', this.language)), h("button", { class: "challenges__drawer__close", onClick: this.onCloseClick }, h("img", { src: crossSvg, alt: "" }))), h("casino-challenges-overlay-tabs", { onTabClick: this.handleTabClick, activeTabIndex: this.activeTabIndex, activeTabHasNotification: false, pendingTabHasNotification: false, language: this.language, "is-mobile": isMobile })));
115
+ return (h("div", null, h("h1", { class: "challenges__drawer__title" }, h("span", null, translate('title', this.language)), h("button", { class: "challenges__drawer__close", onClick: this.onCloseClick }, h("img", { src: crossSvg, alt: "" }))), this.enabledWidgetTabs.length > 0 && (h("casino-challenges-overlay-tabs", { onTabClick: this.handleTabClick, activeTabIndex: this.activeTabIndex, activeTabHasNotification: false, pendingTabHasNotification: false, language: this.language, "is-mobile": isMobile, enabledWidgetTabs: this.enabledWidgetTabs }))));
116
116
  };
117
117
  this.isEmptyState = () => {
118
118
  if (!this.loading && this.activeTabIndex !== EChallengesTabs.Code) {
@@ -154,7 +154,7 @@ export class CasinoChallengesOverlayDrawer {
154
154
  return (h("swipe-up", { onSwippedUp: (e) => {
155
155
  this.swipped = e.detail.swipped;
156
156
  this.progress = e.detail.progress;
157
- }, isMobile: isMobile, isOneSlider: isUnique }, h("div", { class: "content-header", slot: "header" }, this.renderHeader(isMobile), h("div", { class: { 'content-spacer': this.swipped || !isMobile, 'one-slide': isUnique && this.swipped } }, h("casino-challenges-overlay-slider", { mbSource: this.mbSource, clientStyling: this.clientStyling, clientStylingUrl: this.clientStylingUrl, translationUrl: this.translationUrl, language: this.language, challenges: challenges, isMobile: isMobile, onActiveChallengeChange: this.onActiveChallengeChange, initialProgressId: this.activeProgressId, activeTabIndex: this.activeTabIndex }))), h("div", { class: "content-details", slot: "details" }, this.renderChallengeDetails(isMobile, isUnique))));
157
+ }, isMobile: isMobile, isOneSlider: isUnique }, h("div", { class: "content-header", slot: "header" }, this.renderHeader(isMobile), h("div", { class: { 'content-spacer': this.swipped || !isMobile, 'one-slide': isUnique && this.swipped } }, h("casino-challenges-overlay-slider", { mbSource: this.mbSource, clientStyling: this.clientStyling, clientStylingUrl: this.clientStylingUrl, translationUrl: this.translationUrl, language: this.language, challenges: challenges, isMobile: isMobile, onActiveChallengeChange: this.onActiveChallengeChange, initialProgressId: this.activeProgressId, activeTabIndex: this.activeTabIndex }))), h("div", { class: "content-details", slot: "details", style: { overflow: this.swipped ? 'auto' : 'hidden' } }, this.renderChallengeDetails(isMobile, isUnique))));
158
158
  };
159
159
  this.onCloseClick = () => {
160
160
  var _a, _b;
@@ -174,6 +174,7 @@ export class CasinoChallengesOverlayDrawer {
174
174
  this.handleClose = () => { };
175
175
  this.challenges = [];
176
176
  this.initialProgressId = '';
177
+ this.enabledWidgetTabs = undefined;
177
178
  this.activeChallenge = null;
178
179
  this.activeProgressId = '';
179
180
  this.activeTabIndex = EChallengesTabs.Active;
@@ -216,7 +217,8 @@ export class CasinoChallengesOverlayDrawer {
216
217
  handleIsOpenChange(newValue) {
217
218
  var _a;
218
219
  if (newValue) {
219
- if (this.initialProgressId && this.challenges.length) {
220
+ if ((this.initialProgressId && this.challenges.length) ||
221
+ !this.enabledWidgetTabs.includes(EFeatureFlags.PromoTab)) {
220
222
  this.activeTabIndex = EChallengesTabs.Active;
221
223
  this.activeProgressId = this.initialProgressId;
222
224
  const currentChallenge = ((_a = this.activeChallenges) === null || _a === void 0 ? void 0 : _a.find((x) => x.Id === this.activeProgressId)) || this.activeChallenges[0];
@@ -718,6 +720,27 @@ export class CasinoChallengesOverlayDrawer {
718
720
  "attribute": "initial-progress-id",
719
721
  "reflect": true,
720
722
  "defaultValue": "''"
723
+ },
724
+ "enabledWidgetTabs": {
725
+ "type": "unknown",
726
+ "mutable": false,
727
+ "complexType": {
728
+ "original": "EFeatureFlags[]",
729
+ "resolved": "EFeatureFlags[]",
730
+ "references": {
731
+ "EFeatureFlags": {
732
+ "location": "import",
733
+ "path": "../../utils/types",
734
+ "id": "../../../../packages/stencil/casino-challenges-overlay-drawer/src/utils/types.ts::EFeatureFlags"
735
+ }
736
+ }
737
+ },
738
+ "required": false,
739
+ "optional": false,
740
+ "docs": {
741
+ "tags": [],
742
+ "text": ""
743
+ }
721
744
  }
722
745
  };
723
746
  }
package/dist/collection/components/components/casino-challenges-overlay-tabs/casino-challenges-overlay-tabs.css CHANGED
@@ -64,7 +64,7 @@
64
64
  .challenges__tabs-wrapper .challenges__tab {
65
65
  box-sizing: border-box;
66
66
  height: 34px;
67
- width: 25%;
67
+ flex: 1;
68
68
  min-width: 75px;
69
69
  position: relative;
70
70
  display: flex;
@@ -95,6 +95,9 @@
95
95
  backdrop-filter: blur(11.4705886841px);
96
96
  border: 1px solid transparent;
97
97
  }
98
+ .challenges__tabs-wrapper .challenges__tabs.challenges__tabs--promo.large {
99
+ width: 100%;
100
+ }
98
101
 
99
102
  @container challenges-drawer (width <= 500px) {
100
103
  .challenges__tabs-wrapper {
@@ -111,6 +114,6 @@
111
114
  }
112
115
  @container challenges-drawer (height <= 760px) {
113
116
  .challenges__tabs-wrapper .challenges__tabs {
114
- margin: 0 0 10px;
117
+ margin: 5px 0 10px;
115
118
  }
116
119
  }
package/dist/collection/components/components/casino-challenges-overlay-tabs/casino-challenges-overlay-tabs.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import { h, Host } from "@stencil/core";
2
2
  import { translate } from "../../../utils/locale.utils";
3
- import { EChallengesTabs } from "../../../utils/types";
3
+ import { EChallengesTabs, EFeatureFlags } from "../../../utils/types";
4
4
  import notificationIcon from "../../../assets/notification.svg";
5
5
  import crownIcon from "../../../assets/crown.svg";
6
6
  export class CasinoChallengeOverlayTabs {
@@ -13,24 +13,35 @@ export class CasinoChallengeOverlayTabs {
13
13
  this.activeTabIndex = EChallengesTabs.Active;
14
14
  this.activeTabHasNotification = false;
15
15
  this.pendingTabHasNotification = false;
16
+ this.enabledWidgetTabs = undefined;
16
17
  }
17
18
  get tabs() {
18
19
  return [
19
- { label: translate('promo', this.language) },
20
- { label: translate('active', this.language) },
21
- { label: translate('pendingTab', this.language) },
22
- { label: translate('finishedTab', this.language) },
23
- { label: translate('codeTab', this.language) }
20
+ { label: translate('promo', this.language), shown: this.enabledWidgetTabs.includes(EFeatureFlags.PromoTab) },
21
+ { label: translate('active', this.language), shown: true },
22
+ {
23
+ label: translate('pendingTab', this.language),
24
+ shown: this.enabledWidgetTabs.includes(EFeatureFlags.PendingTab)
25
+ },
26
+ {
27
+ label: translate('finishedTab', this.language),
28
+ shown: this.enabledWidgetTabs.includes(EFeatureFlags.FinishedTab)
29
+ },
30
+ { label: translate('codeTab', this.language), shown: this.enabledWidgetTabs.includes(EFeatureFlags.CodeTab) }
24
31
  ];
25
32
  }
26
33
  render() {
27
34
  var _a;
28
- return (h(Host, { key: 'ee3ef4b4bc68c97e9d2cf09fdb18bd07c89fa393' }, h("div", { key: '7c5ad9fa44f4fb9593be61b4c47fe28d793913c4', class: { 'challenges__tabs-wrapper': true, Mobile: this.isMobile } }, h("div", { key: '2188b25224bd3f9bb2a69b1946490d7eeac49bf4', class: "challenges__tabs challenges__tabs--promo" }, h("div", { key: '6545accdd8c223d1f28c4344497b5aa236653b84', class: {
35
+ return (h(Host, { key: 'd7406b70fa77065267703e6fe15a5a7476b13a47' }, h("div", { key: '0e92159292c795a7ecd972d8fa58af96ef4471fe', class: { 'challenges__tabs-wrapper': true, Mobile: this.isMobile } }, this.enabledWidgetTabs.includes(EFeatureFlags.PromoTab) && (h("div", { key: '238e070c09337d8f347d0e5b0d0e8c66f477e92d', class: {
36
+ challenges__tabs: true,
37
+ 'challenges__tabs--promo': true,
38
+ large: this.enabledWidgetTabs.length === 1
39
+ } }, h("div", { key: '50cfb51db808d2fc5036be2fd06b70f8a0364aee', class: {
29
40
  challenges__tab: true,
30
41
  'challenges__tab--promo': true,
31
42
  active: this.activeTabIndex === EChallengesTabs.Promo
32
- }, onClick: this.handleTabClick(EChallengesTabs.Promo) }, h("span", { key: 'e145f5bf9fc6c87df0c86bedc70b97c77f1f6021' }, (_a = this.tabs[0]) === null || _a === void 0 ? void 0 : _a.label), h("img", { key: 'd7d2e925a73673ec536f9aeea11211bb8db7988c', src: crownIcon }))), h("div", { key: 'd24f27763e7b288a939252f3b0d2214372e5b922', class: "challenges__tabs" }, this.tabs.map((tab, index) => {
33
- if (index === EChallengesTabs.Promo)
43
+ }, onClick: this.handleTabClick(EChallengesTabs.Promo) }, h("span", { key: 'a69d7dc4a1a798332bd9881cedb216ef82d279ab' }, (_a = this.tabs[0]) === null || _a === void 0 ? void 0 : _a.label), h("img", { key: '877a1c0c86ed9a632a1af6831f08dc4d2a172856', src: crownIcon })))), h("div", { key: '96e99a2e385f48878f4f7b25625b241be7f2560a', class: "challenges__tabs" }, this.tabs.map((tab, index) => {
44
+ if (index === EChallengesTabs.Promo || !tab.shown)
34
45
  return;
35
46
  return (h("div", { class: {
36
47
  challenges__tab: true,
@@ -147,6 +158,27 @@ export class CasinoChallengeOverlayTabs {
147
158
  "attribute": "pending-tab-has-notification",
148
159
  "reflect": true,
149
160
  "defaultValue": "false"
161
+ },
162
+ "enabledWidgetTabs": {
163
+ "type": "unknown",
164
+ "mutable": false,
165
+ "complexType": {
166
+ "original": "EFeatureFlags[]",
167
+ "resolved": "EFeatureFlags[]",
168
+ "references": {
169
+ "EFeatureFlags": {
170
+ "location": "import",
171
+ "path": "../../../utils/types",
172
+ "id": "../../../../packages/stencil/casino-challenges-overlay-drawer/src/utils/types.ts::EFeatureFlags"
173
+ }
174
+ }
175
+ },
176
+ "required": false,
177
+ "optional": false,
178
+ "docs": {
179
+ "tags": [],
180
+ "text": ""
181
+ }
150
182
  }
151
183
  };
152
184
  }
package/dist/collection/components/components/swipe-up/swipe-up.css CHANGED
@@ -2,6 +2,23 @@
2
2
  display: block;
3
3
  height: 100%;
4
4
  overflow: hidden;
5
+ scrollbar-width: none;
6
+ -ms-overflow-style: none;
7
+ }
8
+ :host::-webkit-scrollbar {
9
+ display: none !important;
10
+ width: 0 !important;
11
+ height: 0 !important;
12
+ }
13
+
14
+ * {
15
+ scrollbar-width: none;
16
+ -ms-overflow-style: none;
17
+ }
18
+ *::-webkit-scrollbar {
19
+ display: none !important;
20
+ width: 0 !important;
21
+ height: 0 !important;
5
22
  }
6
23
 
7
24
  .hero {
@@ -36,6 +53,11 @@
36
53
  border-radius: 20px 20px 0 0;
37
54
  border-top: 1px solid var(--emw--color-gray-300, rgba(255, 255, 255, 0.07));
38
55
  background: var(--emw--color-black-200, rgba(9, 9, 9, 0.8));
56
+ scrollbar-width: none;
57
+ -ms-overflow-style: none;
58
+ }
59
+ .content::-webkit-scrollbar {
60
+ display: none;
39
61
  }
40
62
 
41
63
  .swipe-down-handle {
package/dist/collection/components/components/swipe-up/swipe-up.js CHANGED
@@ -57,13 +57,20 @@ export class SwipeUp {
57
57
  const heroOpacity = 1 - this.progress;
58
58
  const contentTranslate = this.progress * -this.maxSwipe;
59
59
  if (this.isMobile) {
60
- return (h("div", { style: { display: 'flex', height: '100%', 'flex-direction': 'column', overflow: 'auto' } }, h("header", { class: "hero", style: {
60
+ return (h("div", { style: {
61
+ display: 'flex',
62
+ height: '100%',
63
+ 'flex-direction': 'column',
64
+ overflow: 'auto',
65
+ 'overscroll-behavior-y': 'none'
66
+ } }, h("header", { class: "hero", style: {
61
67
  transform: `translateY(${heroTranslate}px)`,
62
68
  opacity: `${heroOpacity}`
63
69
  } }, h("slot", { name: "header" })), h("main", { class: "content", style: {
64
70
  transform: `translateY(${contentTranslate}px)`,
65
71
  'margin-bottom': `-${this.maxSwipe}px`,
66
- height: '100%',
72
+ flex: '1',
73
+ 'min-height': '0',
67
74
  overflow: this.isOpened ? 'auto' : 'hidden'
68
75
  } }, this.isOpened ? (h("button", { class: "swipe-btn", onPointerDown: this.onPointerDown, style: { position: 'sticky', zIndex: '123', left: 'calc(50% - 40px)' } }, h("img", { src: swipe, width: 23, height: 6, style: { rotate: '180deg' } }))) : (h("button", { class: "swipe-btn", onPointerDown: this.onPointerDown }, h("img", { src: swipe, width: 23, height: 6 }))), h("slot", { name: "details" }))));
69
76
  }
package/dist/collection/utils/types.js CHANGED
@@ -158,3 +158,10 @@ export var EPostMessageResponseType;
158
158
  EPostMessageResponseType["UpdateChallengeProgress"] = "UpdateChallengeProgress";
159
159
  EPostMessageResponseType["NewChallengeProgressGranted"] = "NewChallengeProgressGranted";
160
160
  })(EPostMessageResponseType || (EPostMessageResponseType = {}));
161
+ export var EFeatureFlags;
162
+ (function (EFeatureFlags) {
163
+ EFeatureFlags["PromoTab"] = "promo";
164
+ EFeatureFlags["PendingTab"] = "pending";
165
+ EFeatureFlags["FinishedTab"] = "finished";
166
+ EFeatureFlags["CodeTab"] = "code";
167
+ })(EFeatureFlags || (EFeatureFlags = {}));
package/dist/esm/casino-challenge-details-events_21.entry.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import { r as registerInstance, h, H as Host, c as createEvent, g as getElement } from './index-25fd45d2.js';
2
- import { E as EHistoryItemLevelStatus$1, t as translate$2, H as HistoryItemLevelStatusDictionary, a as EPostMessageRequestType$1, s as setClientStyling, b as setClientStylingURL, c as setStreamStyling, r as resolveTranslationUrl$1, d as EChallengesTabs$1 } from './casino-challenges-overlay-drawer-7f1fbfff.js';
3
- export { C as casino_challenges_overlay_drawer } from './casino-challenges-overlay-drawer-7f1fbfff.js';
2
+ import { E as EHistoryItemLevelStatus$1, t as translate$2, H as HistoryItemLevelStatusDictionary, a as EPostMessageRequestType$1, s as setClientStyling, b as setClientStylingURL, c as setStreamStyling, r as resolveTranslationUrl$1, d as EChallengesTabs$1, e as EFeatureFlags } from './casino-challenges-overlay-drawer-22f199a0.js';
3
+ export { C as casino_challenges_overlay_drawer } from './casino-challenges-overlay-drawer-22f199a0.js';
4
4
 
5
5
  function _typeof(o) {
6
6
  "@babel/helpers - typeof";
@@ -3513,7 +3513,7 @@ const alertSvg = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMTki
3513
3513
 
3514
3514
  const crossSvg = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTIuNSAxNy41TDE3LjUgMi41IiBzdHJva2U9IndoaXRlIiBzdHJva2Utd2lkdGg9IjEuMDA0NTkiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+CjxwYXRoIGQ9Ik0yLjUgMi41TDE3LjUgMTcuNSIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIxLjAwNDU5IiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8L3N2Zz4K';
3515
3515
 
3516
- const casinoChallengesOverlayDrawerDetailsCss = ".Mobile.challenge-details.tabView, .Mobile.challenge-details.swipped.hasAction.tabView {\n -ms-overflow-style: none;\n scrollbar-width: none;\n}\n.Mobile.challenge-details.tabView::-webkit-scrollbar, .Mobile.challenge-details.swipped.hasAction.tabView::-webkit-scrollbar {\n display: none;\n}\n.Mobile.challenge-details {\n overflow-x: hidden;\n border-radius: 0;\n padding: 0;\n}\n.Mobile.challenge-details .content,\n.Mobile.challenge-details .sub-page-wrapper {\n padding: 0 12px;\n}\n.Mobile.challenge-details.tabView {\n border-radius: 20px 20px 0 0;\n border: 1px solid var(--emw--color-gray-300, rgba(255, 255, 255, 0.07));\n}\n.Mobile.challenge-details .breadcrumbs {\n margin: 16px 0 8px 0;\n height: 26px;\n}\n.Mobile.challenge-details .breadcrumbs .challenge-name,\n.Mobile.challenge-details .breadcrumbs .tab-name,\n.Mobile.challenge-details .breadcrumbs .total-number {\n font-size: var(--emw--font-size-small, 14px);\n}\n.Mobile.challenge-details .breadcrumbs .action {\n right: 16px;\n width: 26px;\n height: 26px;\n}\n.Mobile.challenge-details .breadcrumbs .action img {\n width: 14px;\n}\n.Mobile.challenge-details .progress-block h3 {\n font-size: var(--emw--font-size-small, 14px);\n}\n.Mobile.challenge-details .action-description,\n.Mobile.challenge-details .terms-title,\n.Mobile.challenge-details .terms-description {\n font-size: var(--emw--font-size-x-small, 12px);\n line-height: var(--emw--font-size-x-small, 12px);\n font-weight: var(--emw--font-weight-semibold, 600);\n}\n.Mobile.challenge-details.swipped .head .row .challenge-title {\n margin: 12px 0 24px 0;\n}\n.Mobile.challenge-details.swipped .head .action-description {\n display: none;\n}\n.Mobile.challenge-details .footer .action-description {\n margin: 0;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n max-height: 28px;\n min-height: 14px;\n -webkit-line-clamp: 2;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.Mobile.challenge-details .footer {\n border-top: 2px solid var(--emw--gradient-blue, #003e5c);\n background: var(--emw--backdrop-background, rgba(9, 9, 9, 0.8));\n backdrop-filter: blur(16px);\n padding: 12px 16px;\n border-radius: 0;\n}\n.Mobile.challenge-details .banner {\n position: relative;\n justify-self: center;\n}\n.Mobile.challenge-details .banner.grayed {\n opacity: 0.5;\n}\n.Mobile.challenge-details .banner__badge {\n height: 27px;\n box-sizing: border-box;\n align-content: center;\n color: var(--emw--badge-font-color, #f4eff4);\n font-size: var(--emw--font-size-xs-small, 13px);\n font-weight: var(--emw--font-weight-normal, 400);\n position: absolute;\n top: 10px;\n left: 12px;\n padding: 3px 4px;\n border: 1px solid var(--emw--dot-button-active-bg, rgba(255, 255, 255, 0.2));\n background: var(--emw--color-container-background, rgba(9, 9, 9, 0.5019607843));\n backdrop-filter: blur(4.5px);\n border-radius: 15px;\n}\n.Mobile.challenge-details .banner__badge .status {\n height: 100%;\n display: inline-flex;\n align-items: center;\n border-radius: 15px;\n border: 1px solid var(--emw--color-container-border, rgba(255, 255, 255, 0.0705882353));\n background: var(--emw--color-container-background, rgba(9, 9, 9, 0.5019607843));\n padding: 0 8px 0 6px;\n}\n.Mobile.challenge-details .banner__badge .status::before {\n content: \"\";\n width: 5px;\n height: 5px;\n border-radius: 50%;\n background: var(--emw--status-badge-gray-bg, rgba(255, 255, 255, 0.5019607843));\n margin-right: 5px;\n flex-shrink: 0;\n}\n.Mobile.challenge-details .banner__badge .timer {\n font-weight: var(--emw--font-weight-bold, 700);\n padding-right: 4px;\n}\n.Mobile.challenge-details .banner__badge.unavailable .status::before, .Mobile.challenge-details .banner__badge.expired .status::before {\n background: var(--emw--status-badge-gray-bg, rgba(255, 255, 255, 0.5019607843));\n}\n.Mobile.challenge-details .banner__badge.completed .status::before {\n background: var(--emw--background-green-color, #00b541);\n}\n.Mobile.challenge-details .banner__badge.forfeited .status::before {\n background: var(--emw--status-badge-red-bg, #d63d1e);\n}\n.Mobile.challenge-details .banner__badge.paused .status::before {\n background: var(--emw--status-badge-yellow-bg, #ffb801);\n}\n.Mobile.challenge-details .banner__badge:has(.timer) {\n padding-left: 6px;\n}\n.Mobile.challenge-details .banner__image-wrapper {\n position: relative;\n width: 343px;\n height: 180px;\n border-radius: 16px;\n overflow: hidden;\n}\n.Mobile.challenge-details .banner__image-wrapper img {\n width: 100%;\n height: 100%;\n object-fit: fill;\n}\n.Mobile.challenge-details .banner * {\n pointer-events: none;\n}\n.Mobile.challenge-details .challenge-title {\n margin: 12px 0 8px 0;\n font-size: var(--emw--font-size-large, 18px);\n line-height: 22px;\n}\n.Mobile.challenge-details .challenge-rules {\n margin-bottom: 0;\n}\n.Mobile.challenge-details .challenge-rules .challenge-rule {\n font-size: var(--emw--font-size-x-small, 12px);\n}\n.Mobile.challenge-details .mobile-banner {\n display: flex;\n width: 343px;\n height: 180px;\n flex-direction: column;\n align-items: flex-start;\n gap: 10px;\n flex-shrink: 0;\n border-radius: 20px;\n border: 1px solid var(--emw--color-gray-300, rgba(255, 255, 255, 0.07));\n margin-bottom: 16px;\n}\n.Mobile.challenge-details .challenge-terms {\n margin-top: 0;\n}\n.Mobile.challenge-details .label {\n font-size: var(--emw--font-size-x-small, 12px);\n line-height: 12px;\n margin: 0;\n}\n.Mobile.challenge-details .description {\n font-size: var(--emw--font-size-xs-small, 13px);\n line-height: 12px;\n}\n.Mobile.challenge-details .date-description,\n.Mobile.challenge-details .total-level-description {\n line-height: 20px;\n}\n.Mobile.challenge-details .challenge-levels,\n.Mobile.challenge-details .challenge-games,\n.Mobile.challenge-details .challenge-rules {\n padding: 14px;\n}\n.Mobile.challenge-details .chevron-button {\n width: 26px;\n height: 26px;\n}\n.Mobile.challenge-details .chevron-button img {\n width: 14px;\n height: 14px;\n}\n.Mobile.challenge-details .challenge-level {\n padding: 10px;\n}\n.Mobile.challenge-details .challenge-block-header .total-levels h3,\n.Mobile.challenge-details .challenge-block-header .total-levels span,\n.Mobile.challenge-details .challenge-block-header .total-games h3,\n.Mobile.challenge-details .challenge-block-header .total-games span {\n font-size: var(--emw--font-size-small, 14px);\n}\n.Mobile.challenge-details .challenge-block-header p {\n font-size: var(--emw--font-size-x-small, 12px);\n}\n.Mobile.challenge-details .challenge-level {\n box-sizing: border-box;\n}\n.Mobile.challenge-details .challenge-level .level__title {\n font-size: var(--emw--font-size-x-small, 12px);\n line-height: 14px;\n}\n.Mobile.challenge-details .challenge-level .level__status {\n font-size: var(--emw--font-size-x-small, 12px);\n line-height: 14px;\n}\n.Mobile.challenge-details .challenge-level .level__bonus {\n margin-bottom: 3px;\n}\n.Mobile.challenge-details .challenge-level .label {\n font-size: var(--emw--font-size-x-small, 12px);\n margin-bottom: 8px;\n}\n.Mobile.challenge-details .challenge-level .description {\n font-size: var(--emw--font-size-2x-small, 11px);\n line-height: 12px;\n max-width: 110px;\n}\n.Mobile.challenge-details .challenge-game {\n min-width: 85px;\n height: 60px;\n}\n.Mobile.challenge-details .action-button {\n font-size: var(--emw--font-size-small, 14px);\n height: 34px;\n}\n.Mobile.challenge-details .notification {\n padding: 14px 12px;\n}\n.Mobile.challenge-details .notification__message, .Mobile.challenge-details .notification__title {\n font-size: 14px;\n}\n.Mobile.challenge-details .notification__icon {\n margin-top: 2px;\n width: 14px;\n height: 14px;\n}\n\n.challenge-details {\n font-family: var(--emw--font-family-primary, \"Teachers\"), sans-serif;\n position: relative;\n z-index: 2;\n display: flex;\n flex-direction: column;\n overflow: auto;\n scrollbar-width: none;\n -ms-overflow-style: none;\n box-sizing: border-box;\n border-radius: 0 0 30px 30px;\n padding: 0;\n height: 100%;\n}\n.challenge-details .sub-page-wrapper {\n flex: 1;\n min-height: 0;\n overflow-y: auto;\n padding: 0 24px;\n display: flex;\n flex-direction: column;\n}\n.challenge-details .sub-page-wrapper .sub-page {\n flex: 1;\n min-height: 0;\n overflow-y: auto;\n padding-bottom: 24px;\n}\n.challenge-details .content {\n flex: 1;\n min-height: 0;\n overflow-y: auto;\n padding: 0 24px 24px;\n}\n.challenge-details .breadcrumbs {\n display: flex;\n align-items: center;\n margin: 4px 0 16px 0;\n height: 36px;\n justify-content: space-between;\n flex-shrink: 0;\n}\n.challenge-details .breadcrumbs div {\n display: flex;\n align-items: center;\n}\n.challenge-details .breadcrumbs .challenge-name {\n color: var(--emw--color-gray-250, rgba(255, 255, 255, 0.15));\n font-size: var(--emw--font-size-medium, 16px);\n font-style: normal;\n font-weight: var(--emw--font-weight-semibold, 600);\n line-height: normal;\n margin: 0 3px 0 10px;\n max-width: 150px;\n}\n.challenge-details .breadcrumbs .action {\n outline: none;\n background: transparent;\n border-radius: 20px;\n border: 1.5px solid var(--emw--color-container-border, rgba(255, 255, 255, 0.0705882353));\n background: var(--emw--color-container-background, rgba(9, 9, 9, 0.5019607843));\n backdrop-filter: blur(6.882352829px);\n cursor: pointer;\n width: 36px;\n height: 36px;\n min-width: 36px;\n min-height: 36px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.challenge-details .breadcrumbs .action img {\n width: 20px;\n height: 20px;\n}\n.challenge-details .breadcrumbs .tab-name,\n.challenge-details .breadcrumbs .divider {\n color: var(--emw--color-gray-450, #edeff2);\n font-size: var(--emw--font-size-medium, 16px);\n font-style: normal;\n font-weight: var(--emw--font-weight-semibold, 600);\n line-height: normal;\n margin-left: 3px;\n}\n.challenge-details .breadcrumbs .total-number {\n color: var(--emw--color-gray-500, rgba(255, 255, 255, 0.5));\n font-size: var(--emw--font-size-medium, 16px);\n font-style: normal;\n font-weight: var(--emw--font-weight-normal, 400);\n line-height: normal;\n margin-left: 3px;\n}\n.challenge-details .challenge-title {\n color: #fff;\n font-size: var(--emw--font-size-large-plus, 26px);\n font-style: normal;\n font-weight: var(--emw--font-weight-semibold, 600);\n line-height: normal;\n margin: 16px 0 8px 0;\n}\n.challenge-details .challenge-block {\n border-radius: 20px;\n border: 1px solid var(--emw--color-gray-300, rgba(255, 255, 255, 0.07));\n background: var(--emw--block-background, rgba(9, 9, 9, 0.5));\n backdrop-filter: blur(11.47px);\n display: flex;\n padding: 20px 12px;\n justify-content: center;\n align-items: center;\n gap: 16px;\n margin: 16px 0;\n align-self: stretch;\n}\n.challenge-details .progress-block h3 {\n color: var(--emw--color-white, #fff);\n font-size: var(--emw--font-size-medium, 16px);\n font-style: normal;\n font-weight: var(--emw--font-weight-bold, 700);\n line-height: normal;\n margin: 0 0 10px 0;\n}\n.challenge-details .chevron-button {\n box-sizing: border-box;\n display: flex;\n width: 36px;\n height: 36px;\n padding: 4px 5px;\n justify-content: center;\n align-items: center;\n gap: 6.923px;\n aspect-ratio: 1/1;\n border-radius: 27.692px;\n border: 2px solid var(--emw--color-gray-300, rgba(255, 255, 255, 0.07));\n background: var(--emw--block-background, rgba(9, 9, 9, 0.5));\n backdrop-filter: blur(9.52px);\n margin-left: 4px;\n padding: 4px 5px;\n cursor: pointer;\n}\n.challenge-details .challenge-block-header {\n display: flex;\n padding-left: 4px;\n align-items: center;\n gap: 4px;\n align-self: stretch;\n justify-content: space-between;\n}\n.challenge-details .challenge-block-header .total-levels,\n.challenge-details .challenge-block-header .total-games {\n display: flex;\n align-items: center;\n}\n.challenge-details .challenge-block-header .total-levels span,\n.challenge-details .challenge-block-header .total-games span {\n color: var(--emw--dot-button-active-bg, rgba(255, 255, 255, 0.2));\n display: inline-block;\n font-size: var(--emw--font-size-medium, 16px);\n font-style: normal;\n font-weight: var(--emw--font-weight-normal, 400);\n line-height: normal;\n margin-left: 4px;\n}\n.challenge-details .challenge-block-header h3 {\n color: var(--emw--color-white, #fff);\n font-size: var(--emw--font-size-medium, 16px);\n font-style: normal;\n font-weight: var(--emw--font-weight-bold, 700);\n line-height: normal;\n margin: 0;\n}\n.challenge-details .challenge-block-header p {\n color: var(--emw--color-empty-state, rgba(255, 255, 255, 0.7));\n font-size: var(--emw--font-size-small, 14px);\n font-style: normal;\n font-weight: var(--emw--font-weight-normal, 400);\n line-height: normal;\n margin: 0;\n}\n.challenge-details .column {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: space-between;\n}\n.challenge-details .row {\n display: flex;\n align-items: center;\n justify-content: center;\n outline: none;\n background: transparent;\n border: none;\n}\n.challenge-details .button {\n cursor: pointer;\n}\n.challenge-details .general-info-col {\n width: 33%;\n}\n.challenge-details .general-info-icon {\n margin-left: 4px;\n}\n.challenge-details .label {\n text-transform: capitalize;\n color: var(--emw--color-gray-400, #c9cacb);\n font-size: var(--emw--font-size-small, 14px);\n font-style: normal;\n font-weight: var(--emw--font-weight-normal, 400);\n line-height: normal;\n margin: 0 0 3px 0;\n line-height: 17px;\n}\n.challenge-details .description {\n display: flex;\n align-items: center;\n color: var(--emw--color-white, #fff);\n font-size: var(--emw--font-size-small, 14px);\n font-style: normal;\n font-weight: var(--emw--font-weight-semibold, 600);\n line-height: normal;\n margin: 0;\n line-height: 17px;\n}\n.challenge-details .description span {\n display: inline-block;\n}\n.challenge-details .challenge-terms {\n margin: 16px 12px 0 12px;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n}\n.challenge-details .terms-title {\n display: flex;\n align-items: center;\n color: var(--emw--background-green-color, #00b541);\n line-height: 17px;\n font-size: var(--emw--font-size-small, 14px);\n font-style: normal;\n font-weight: var(--emw--font-weight-bold, 700);\n border-bottom: 1px solid var(--emw--background-green-color, #00b541);\n cursor: pointer;\n text-underline-offset: 3px;\n margin: 0;\n}\n.challenge-details .terms-title img {\n margin-left: 4px;\n}\n.challenge-details .terms-description {\n color: var(--emw--color-empty-state, rgba(255, 255, 255, 0.7));\n text-align: center;\n font-size: var(--emw--font-size-small, 14px);\n font-style: normal;\n font-weight: var(--emw--font-weight-normal, 400);\n line-height: normal;\n margin: 6px 0;\n line-height: 14px;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n max-height: 28px;\n min-height: 14px;\n -webkit-line-clamp: 2;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.challenge-details .challenge-general-info {\n padding: 20px 12px;\n box-sizing: border-box;\n}\n.challenge-details .challenge-levels,\n.challenge-details .challenge-games,\n.challenge-details .challenge-rules {\n display: flex;\n padding: 16px;\n flex-direction: column;\n align-items: flex-start;\n gap: 12px;\n align-self: stretch;\n}\n.challenge-details .levels-row {\n overflow-x: auto;\n scrollbar-width: none;\n -ms-overflow-style: none;\n width: 100%;\n display: flex;\n align-items: flex-start;\n gap: 10px;\n justify-content: flex-start;\n}\n.challenge-details .challenge-games {\n margin: 0;\n}\n.challenge-details .challenge-level {\n display: flex;\n padding: 12px;\n flex-direction: column;\n justify-content: center;\n align-items: flex-start;\n border-radius: 14px;\n background: var(--emw--level-color-background, rgba(114, 118, 114, 0.2));\n min-width: 153px;\n}\n.challenge-details .challenge-level .label {\n margin-bottom: 8px;\n}\n.challenge-details .challenge-level .description {\n font-size: var(--emw--font-size-x-small, 12px);\n font-weight: var(--emw--font-weight-normal, 400);\n line-height: 14px;\n max-width: 130px;\n}\n.challenge-details .challenge-level img {\n margin-right: 6px;\n}\n.challenge-details .challenge-games .games-row {\n overflow-x: auto;\n overflow-y: hidden;\n scrollbar-width: none;\n -ms-overflow-style: none;\n width: 100%;\n display: flex;\n gap: 10px;\n align-items: flex-start;\n justify-content: flex-start;\n}\n.challenge-details .challenge-game {\n display: flex;\n min-width: 120px;\n height: 84px;\n justify-content: flex-end;\n align-items: flex-start;\n gap: 7.978px;\n border-radius: 10.53px;\n cursor: pointer;\n}\n.challenge-details .challenge-game img {\n width: 100%;\n height: auto;\n}\n.challenge-details .challenge-rules {\n padding: 14px;\n}\n.challenge-details .challenge-rule,\n.challenge-details .challenge-event {\n color: var(--emw--color-empty-state, rgba(255, 255, 255, 0.7));\n font-size: var(--emw--font-size-small, 14px);\n font-style: normal;\n font-weight: var(--emw--font-weight-normal, 400);\n line-height: normal;\n}\n.challenge-details .ellipsed {\n display: inline-block;\n max-width: 100%;\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n}\n.challenge-details .footer {\n box-sizing: border-box;\n display: flex;\n width: 100%;\n padding: 20px 24px 24px 24px;\n justify-content: space-between;\n align-items: center;\n gap: 8px;\n border-top: 1px solid var(--emw--gradient-blue, #003e5c);\n background: var(--emw--backdrop-background, rgba(9, 9, 9, 0.8));\n backdrop-filter: blur(16.05px);\n border-radius: 0 0 30px 30px;\n flex-shrink: 0;\n}\n.challenge-details .action-description {\n font-size: var(--emw--font-size-small, 14px);\n line-height: var(--emw--font-size-small, 14px);\n font-style: normal;\n font-weight: var(--emw--font-weight-semibold, 600);\n color: var(--emw--color-white, #fff);\n}\n.challenge-details .promo-action-description {\n background: var(--emw--action-description-background, linear-gradient(310deg, #d6ffdc 12.98%, #74b580 92.6%, #509142 131.58%));\n background-clip: text;\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n}\n.challenge-details .action-button {\n border-radius: 99px;\n border: 1px solid var(--emw--color-gray-300, rgba(255, 255, 255, 0.07));\n background: var(--emw--color-green, #00fa5a);\n display: flex;\n height: 40px;\n padding: 14px 20px;\n justify-content: center;\n align-items: center;\n gap: 4px;\n flex-shrink: 0;\n color: var(--emw--color-black-100, #090909);\n font-size: var(--emw--font-size-medium, 16px);\n font-style: normal;\n font-weight: var(--emw--font-weight-bold, 700);\n line-height: normal;\n}\n.challenge-details .action-button:hover {\n border-color: var(--emw--color-gray-300, #083b17);\n cursor: pointer;\n}\n.challenge-details .action-button.filled {\n color: var(--emw--color-green, #00fa5a);\n border: 1px solid var(--emw--color-gray-300, rgba(255, 255, 255, 0.07));\n background: var(--emw--button-background-primary-color, linear-gradient(35deg, rgba(255, 255, 255, 0) 33.61%, rgba(255, 255, 255, 0.15) 89.19%)), var(--emw--color-gray-300, rgba(255, 255, 255, 0.07));\n background-blend-mode: overlay;\n}\n.challenge-details .action-button.filled:hover {\n border-color: transparent;\n box-shadow: 0 0 4px 0 rgba(188, 252, 177, 0.2), 0 0 20px 0 rgba(0, 183, 79, 0.5);\n}\n.challenge-details .action-button.grayed {\n color: var(--emw--color-gray-50, #e2e2e2);\n background: var(--emw--color-black, #000000);\n border-color: var(--emw--button-disabled-border-color, rgba(255, 255, 255, 0.5));\n box-shadow: 0 0 20px 0 rgba(188, 252, 177, 0.2);\n}\n.challenge-details .action-button.grayed:hover {\n color: var(--emw--color-white, #fff);\n}\n.challenge-details .action-button:disabled, .challenge-details .action-button:disabled:hover {\n color: var(--emw--color-gray-50, #e2e2e2);\n cursor: not-allowed;\n border: 2px solid var(--emw--button-disabled-border-color, rgba(255, 255, 255, 0.5));\n opacity: 0.7;\n}\n.challenge-details .expand-button {\n outline: none;\n border: none;\n width: 39px;\n height: 16px;\n background: transparent;\n margin: 0 auto;\n cursor: pointer;\n}\n.challenge-details .levels-row .level {\n display: flex;\n padding: 12px;\n flex-direction: column;\n align-items: flex-start;\n align-self: stretch;\n border-radius: 14px;\n background: var(--emw--level-color-background, rgba(114, 118, 114, 0.2));\n border: none;\n}\n.challenge-details .levels-row .level.active, .challenge-details .levels-row .level.completed {\n border: 1px solid var(--emw--color-gray-300, rgba(255, 255, 255, 0.07));\n background: var(--emw--level-completed-gradient, linear-gradient(90deg, rgba(30, 101, 79, 0.2) 0%, rgba(28, 141, 86, 0.2) 100%));\n}\n.challenge-details .levels-row .level.active .level__title span, .challenge-details .levels-row .level.completed .level__title span {\n color: var(--emw--color-white, #fff);\n}\n.challenge-details .levels-row .level.suspended {\n border: 1px solid var(--emw--color-gray-300, rgba(255, 255, 255, 0.07));\n background: var(--emw--color-level-suspended rgba(9, 9, 9, 0.4));\n}\n.challenge-details .levels-row .level.suspended .level__status .suspended {\n color: var(--emw--color-level-status-suspended, rgba(255, 255, 255, 0.5));\n font-weight: 400;\n}\n.challenge-details .levels-row .level.suspended .level__title span {\n color: var(--emw--color-white, #fff);\n}\n.challenge-details .levels-row .level.forfeited {\n background: var(--emw--color-level-color-background, rgba(114, 118, 114, 0.2));\n border: none;\n color: var(--emw--color-level-status-suspended, rgba(255, 255, 255, 0.5));\n}\n.challenge-details .levels-row .level.forfeited .level__title span {\n color: var(--emw--color-level-status-suspended, rgba(255, 255, 255, 0.5));\n}\n.challenge-details .levels-row .level.forfeited .level__target,\n.challenge-details .levels-row .level.forfeited .level__value {\n color: var(--emw--color-level-status-suspended, rgba(255, 255, 255, 0.5));\n}\n.challenge-details .levels-row .level__status {\n display: flex;\n align-items: center;\n gap: 4px;\n font-size: var(--emw--font-size-x-small, 12px);\n font-weight: var(--emw--font-weight-semibold, 600);\n}\n.challenge-details .levels-row .level__title {\n width: 100%;\n display: flex;\n align-items: center;\n justify-content: space-between;\n color: var(--emw--color-white, #fff);\n font-size: var(--emw--font-size-small, 14px);\n font-weight: var(--emw--font-weight-semibold, 600);\n line-height: 17px;\n margin-bottom: 8px;\n}\n.challenge-details .levels-row .level__title span {\n color: var(--emw--color-white-150, rgba(255, 255, 255, 0.7));\n}\n.challenge-details .levels-row .level__title .completed {\n background: var(--emw--action-description-background, linear-gradient(310deg, #d6ffdc 12.98%, #74b580 92.6%, #509142 131.58%));\n background-clip: text;\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n}\n.challenge-details .levels-row .level__title .completed, .challenge-details .levels-row .level__title .in-progress {\n color: var(--emw--border-success-color, #00b74f);\n font-size: var(--emw--font-size-x-small, 12px);\n font-weight: var(--emw--font-weight-medium, 500);\n text-align: right;\n line-height: 17px;\n}\n.challenge-details .levels-row .level__progress {\n width: 100%;\n margin-bottom: 10px;\n}\n.challenge-details .levels-row .level__icon {\n display: flex;\n opacity: 1;\n}\n.challenge-details .levels-row .level__icon img {\n display: block;\n width: 12px;\n height: 12px;\n margin: 4px 6px 0 0;\n}\n.challenge-details .levels-row .level__icon img.grayed {\n opacity: 0.5;\n}\n.challenge-details .levels-row .level__bonus, .challenge-details .levels-row .level__target {\n display: flex;\n align-items: flex-start;\n color: var(--emw--color-white, #fff);\n font-size: var(--emw--font-size-x-small, 12px);\n font-weight: var(--emw--font-weight-medium, 500);\n line-height: 22px;\n}\n.challenge-details .levels-row .level__bonus {\n margin-bottom: 6px;\n}\n.challenge-details .levels-row .level__value {\n color: var(--emw--color-white, #fff);\n font-size: var(--emw--font-size-x-small, 12px);\n font-weight: var(--emw--font-weight-medium, 500);\n line-height: 22px;\n width: 100%;\n}\n.challenge-details .notification {\n display: flex;\n align-items: flex-start;\n border-radius: var(--emw--border-radius-small, 12px);\n background: rgba(188, 252, 177, 0.1);\n display: flex;\n padding: 20px 16px;\n align-items: flex-start;\n gap: 10px;\n margin: 16px 0;\n}\n.challenge-details .notification__icon {\n width: 18px;\n height: 18px;\n}\n.challenge-details .notification__message, .challenge-details .notification__title {\n color: var(--emw--color-white-150, rgba(255, 255, 255, 0.7));\n font-size: var(--emw--font-size-medium, 16px);\n font-weight: var(--emw--font-weight-normal, 400);\n}\n.challenge-details .notification__title {\n background: var(--emw--color-notification-background-secondary, linear-gradient(180deg, #24b24e 0%, #18ce51 100%));\n background-clip: text;\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n}\n.challenge-details .notification__column {\n display: flex;\n flex-direction: column;\n}\n\n@container challenges-drawer (width <=500px) {\n .challenge-details .content,\n .challenge-details .sub-page-wrapper {\n padding: 0 20px;\n }\n}\n@container challenges-drawer (width <=475px) {\n .challenge-details .challenge-title {\n margin: 0 0 4px;\n }\n .challenge-details .challenge-block {\n margin: 12px 0;\n }\n .challenge-details .challenge-levels,\n .challenge-details .challenge-games,\n .challenge-details .challenge-rules {\n padding: 12px;\n }\n}\n@container challenges-drawer (width <=400px) {\n .challenge-details .content,\n .challenge-details .sub-page-wrapper {\n padding: 0 15px;\n }\n}\n@container challenges-drawer (width <= 480px) {\n .footer .action-description {\n font-size: var(--emw--font-size-xs-small, 13px);\n }\n .challenge-details .footer {\n padding: 20px 15px 24px;\n }\n}\n@container challenges-drawer (width <= 440px) {\n .challenge-details .footer {\n padding: 15px;\n }\n}\n@container challenges-game-page (height <= 850px) {}";
3516
+ const casinoChallengesOverlayDrawerDetailsCss = ".Mobile.challenge-details.tabView, .Mobile.challenge-details.swipped.hasAction.tabView {\n -ms-overflow-style: none !important;\n scrollbar-width: none !important;\n}\n.Mobile.challenge-details.tabView::-webkit-scrollbar, .Mobile.challenge-details.swipped.hasAction.tabView::-webkit-scrollbar {\n display: none !important;\n width: 0 !important;\n height: 0 !important;\n}\n.Mobile.challenge-details.tabView *, .Mobile.challenge-details.swipped.hasAction.tabView * {\n scrollbar-width: none !important;\n -ms-overflow-style: none !important;\n}\n.Mobile.challenge-details.tabView *::-webkit-scrollbar, .Mobile.challenge-details.swipped.hasAction.tabView *::-webkit-scrollbar {\n display: none !important;\n width: 0 !important;\n height: 0 !important;\n}\n.Mobile.challenge-details {\n overflow-x: hidden;\n border-radius: 0;\n padding: 0;\n scrollbar-width: none !important;\n -ms-overflow-style: none !important;\n}\n.Mobile.challenge-details::-webkit-scrollbar {\n display: none !important;\n width: 0 !important;\n height: 0 !important;\n}\n.Mobile.challenge-details .content,\n.Mobile.challenge-details .sub-page-wrapper {\n padding: 0 12px;\n}\n.Mobile.challenge-details.tabView {\n border-radius: 20px 20px 0 0;\n border: 1px solid var(--emw--color-gray-300, rgba(255, 255, 255, 0.07));\n}\n.Mobile.challenge-details .breadcrumbs {\n margin: 16px 0 8px 0;\n height: 26px;\n}\n.Mobile.challenge-details .breadcrumbs .challenge-name,\n.Mobile.challenge-details .breadcrumbs .tab-name,\n.Mobile.challenge-details .breadcrumbs .total-number {\n font-size: var(--emw--font-size-small, 14px);\n}\n.Mobile.challenge-details .breadcrumbs .action {\n right: 16px;\n width: 26px;\n height: 26px;\n}\n.Mobile.challenge-details .breadcrumbs .action img {\n width: 14px;\n}\n.Mobile.challenge-details .progress-block h3 {\n font-size: var(--emw--font-size-small, 14px);\n}\n.Mobile.challenge-details .action-description,\n.Mobile.challenge-details .terms-title,\n.Mobile.challenge-details .terms-description {\n font-size: var(--emw--font-size-x-small, 12px);\n line-height: var(--emw--font-size-x-small, 12px);\n font-weight: var(--emw--font-weight-semibold, 600);\n}\n.Mobile.challenge-details.swipped .head .row .challenge-title {\n margin: 12px 0 24px 0;\n}\n.Mobile.challenge-details.swipped .head .action-description {\n display: none;\n}\n.Mobile.challenge-details .footer .action-description {\n margin: 0;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n max-height: 28px;\n min-height: 14px;\n -webkit-line-clamp: 2;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.Mobile.challenge-details .footer {\n border-top: 2px solid var(--emw--gradient-blue, #003e5c);\n background: var(--emw--backdrop-background, rgba(9, 9, 9, 0.8));\n backdrop-filter: blur(16px);\n padding: 12px 16px;\n border-radius: 0;\n}\n.Mobile.challenge-details .banner {\n position: relative;\n justify-self: center;\n}\n.Mobile.challenge-details .banner.grayed {\n opacity: 0.5;\n}\n.Mobile.challenge-details .banner__badge {\n height: 27px;\n box-sizing: border-box;\n align-content: center;\n color: var(--emw--badge-font-color, #f4eff4);\n font-size: var(--emw--font-size-xs-small, 13px);\n font-weight: var(--emw--font-weight-normal, 400);\n position: absolute;\n top: 10px;\n left: 12px;\n padding: 3px 4px;\n border: 1px solid var(--emw--dot-button-active-bg, rgba(255, 255, 255, 0.2));\n background: var(--emw--color-container-background, rgba(9, 9, 9, 0.5019607843));\n backdrop-filter: blur(4.5px);\n border-radius: 15px;\n}\n.Mobile.challenge-details .banner__badge .status {\n height: 100%;\n display: inline-flex;\n align-items: center;\n border-radius: 15px;\n border: 1px solid var(--emw--color-container-border, rgba(255, 255, 255, 0.0705882353));\n background: var(--emw--color-container-background, rgba(9, 9, 9, 0.5019607843));\n padding: 0 8px 0 6px;\n}\n.Mobile.challenge-details .banner__badge .status::before {\n content: \"\";\n width: 5px;\n height: 5px;\n border-radius: 50%;\n background: var(--emw--status-badge-gray-bg, rgba(255, 255, 255, 0.5019607843));\n margin-right: 5px;\n flex-shrink: 0;\n}\n.Mobile.challenge-details .banner__badge .timer {\n font-weight: var(--emw--font-weight-bold, 700);\n padding-right: 4px;\n}\n.Mobile.challenge-details .banner__badge.unavailable .status::before, .Mobile.challenge-details .banner__badge.expired .status::before {\n background: var(--emw--status-badge-gray-bg, rgba(255, 255, 255, 0.5019607843));\n}\n.Mobile.challenge-details .banner__badge.completed .status::before {\n background: var(--emw--background-green-color, #00b541);\n}\n.Mobile.challenge-details .banner__badge.forfeited .status::before {\n background: var(--emw--status-badge-red-bg, #d63d1e);\n}\n.Mobile.challenge-details .banner__badge.paused .status::before {\n background: var(--emw--status-badge-yellow-bg, #ffb801);\n}\n.Mobile.challenge-details .banner__badge:has(.timer) {\n padding-left: 6px;\n}\n.Mobile.challenge-details .banner__image-wrapper {\n position: relative;\n width: 343px;\n height: 180px;\n border-radius: 16px;\n overflow: hidden;\n}\n.Mobile.challenge-details .banner__image-wrapper img {\n width: 100%;\n height: 100%;\n object-fit: fill;\n}\n.Mobile.challenge-details .banner * {\n pointer-events: none;\n}\n.Mobile.challenge-details .challenge-title {\n margin: 12px 0 8px 0;\n font-size: var(--emw--font-size-large, 18px);\n line-height: 22px;\n}\n.Mobile.challenge-details .challenge-rules {\n margin-bottom: 0;\n}\n.Mobile.challenge-details .challenge-rules .challenge-rule {\n font-size: var(--emw--font-size-x-small, 12px);\n}\n.Mobile.challenge-details .mobile-banner {\n display: flex;\n width: 343px;\n height: 180px;\n flex-direction: column;\n align-items: flex-start;\n gap: 10px;\n flex-shrink: 0;\n border-radius: 20px;\n border: 1px solid var(--emw--color-gray-300, rgba(255, 255, 255, 0.07));\n margin-bottom: 16px;\n}\n.Mobile.challenge-details .challenge-terms {\n margin-top: 0;\n}\n.Mobile.challenge-details .label {\n font-size: var(--emw--font-size-x-small, 12px);\n line-height: 12px;\n margin: 0;\n}\n.Mobile.challenge-details .description {\n font-size: var(--emw--font-size-xs-small, 13px);\n line-height: 12px;\n}\n.Mobile.challenge-details .date-description,\n.Mobile.challenge-details .total-level-description {\n line-height: 20px;\n}\n.Mobile.challenge-details .challenge-levels,\n.Mobile.challenge-details .challenge-games,\n.Mobile.challenge-details .challenge-rules {\n padding: 14px;\n}\n.Mobile.challenge-details .chevron-button {\n width: 26px;\n height: 26px;\n}\n.Mobile.challenge-details .chevron-button img {\n width: 14px;\n height: 14px;\n}\n.Mobile.challenge-details .challenge-level {\n padding: 10px;\n}\n.Mobile.challenge-details .challenge-block-header .total-levels h3,\n.Mobile.challenge-details .challenge-block-header .total-levels span,\n.Mobile.challenge-details .challenge-block-header .total-games h3,\n.Mobile.challenge-details .challenge-block-header .total-games span {\n font-size: var(--emw--font-size-small, 14px);\n}\n.Mobile.challenge-details .challenge-block-header p {\n font-size: var(--emw--font-size-x-small, 12px);\n}\n.Mobile.challenge-details .challenge-level {\n box-sizing: border-box;\n}\n.Mobile.challenge-details .challenge-level .level__title {\n font-size: var(--emw--font-size-x-small, 12px);\n line-height: 14px;\n}\n.Mobile.challenge-details .challenge-level .level__status {\n font-size: var(--emw--font-size-x-small, 12px);\n line-height: 14px;\n}\n.Mobile.challenge-details .challenge-level .level__bonus {\n margin-bottom: 3px;\n}\n.Mobile.challenge-details .challenge-level .label {\n font-size: var(--emw--font-size-x-small, 12px);\n margin-bottom: 8px;\n}\n.Mobile.challenge-details .challenge-level .description {\n font-size: var(--emw--font-size-2x-small, 11px);\n line-height: 12px;\n max-width: 110px;\n}\n.Mobile.challenge-details .challenge-game {\n min-width: 85px;\n height: 60px;\n}\n.Mobile.challenge-details .action-button {\n font-size: var(--emw--font-size-small, 14px);\n height: 34px;\n}\n.Mobile.challenge-details .notification {\n padding: 14px 12px;\n}\n.Mobile.challenge-details .notification__message, .Mobile.challenge-details .notification__title {\n font-size: 14px;\n}\n.Mobile.challenge-details .notification__icon {\n margin-top: 2px;\n width: 14px;\n height: 14px;\n}\n\n.challenge-details {\n font-family: var(--emw--font-family-primary, \"Teachers\"), sans-serif;\n position: relative;\n z-index: 2;\n display: flex;\n flex-direction: column;\n overflow: auto;\n scrollbar-width: none !important;\n -ms-overflow-style: none !important;\n box-sizing: border-box;\n border-radius: 0 0 30px 30px;\n padding: 0;\n height: 100%;\n}\n.challenge-details::-webkit-scrollbar {\n display: none !important;\n width: 0 !important;\n height: 0 !important;\n}\n.challenge-details .sub-page-wrapper {\n flex: 1;\n min-height: 0;\n overflow-y: auto;\n scrollbar-width: none !important;\n -ms-overflow-style: none !important;\n padding: 0 24px;\n display: flex;\n flex-direction: column;\n}\n.challenge-details .sub-page-wrapper::-webkit-scrollbar {\n display: none !important;\n width: 0 !important;\n height: 0 !important;\n}\n.challenge-details .sub-page-wrapper .sub-page {\n flex: 1;\n min-height: 0;\n overflow-y: auto;\n scrollbar-width: none !important;\n -ms-overflow-style: none !important;\n padding-bottom: 24px;\n overflow-x: hidden;\n}\n.challenge-details .sub-page-wrapper .sub-page::-webkit-scrollbar {\n display: none !important;\n width: 0 !important;\n height: 0 !important;\n}\n.challenge-details .content {\n flex: 1;\n min-height: 0;\n overflow-y: auto;\n scrollbar-width: none !important;\n -ms-overflow-style: none !important;\n padding: 0 24px 24px;\n}\n.challenge-details .content::-webkit-scrollbar {\n display: none !important;\n width: 0 !important;\n height: 0 !important;\n}\n.challenge-details .breadcrumbs {\n display: flex;\n align-items: center;\n margin: 4px 0 16px 0;\n height: 36px;\n justify-content: space-between;\n flex-shrink: 0;\n}\n.challenge-details .breadcrumbs div {\n display: flex;\n align-items: center;\n}\n.challenge-details .breadcrumbs .challenge-name {\n color: var(--emw--color-gray-250, rgba(255, 255, 255, 0.15));\n font-size: var(--emw--font-size-medium, 16px);\n font-style: normal;\n font-weight: var(--emw--font-weight-semibold, 600);\n line-height: normal;\n margin: 0 3px 0 10px;\n max-width: 150px;\n}\n.challenge-details .breadcrumbs .action {\n outline: none;\n background: transparent;\n border-radius: 20px;\n border: 1.5px solid var(--emw--color-container-border, rgba(255, 255, 255, 0.0705882353));\n background: var(--emw--color-container-background, rgba(9, 9, 9, 0.5019607843));\n backdrop-filter: blur(6.882352829px);\n cursor: pointer;\n width: 36px;\n height: 36px;\n min-width: 36px;\n min-height: 36px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.challenge-details .breadcrumbs .action img {\n width: 20px;\n height: 20px;\n}\n.challenge-details .breadcrumbs .tab-name,\n.challenge-details .breadcrumbs .divider {\n color: var(--emw--color-gray-450, #edeff2);\n font-size: var(--emw--font-size-medium, 16px);\n font-style: normal;\n font-weight: var(--emw--font-weight-semibold, 600);\n line-height: normal;\n margin-left: 3px;\n}\n.challenge-details .breadcrumbs .total-number {\n color: var(--emw--color-gray-500, rgba(255, 255, 255, 0.5));\n font-size: var(--emw--font-size-medium, 16px);\n font-style: normal;\n font-weight: var(--emw--font-weight-normal, 400);\n line-height: normal;\n margin-left: 3px;\n}\n.challenge-details .challenge-title {\n color: #fff;\n font-size: var(--emw--font-size-large-plus, 26px);\n font-style: normal;\n font-weight: var(--emw--font-weight-semibold, 600);\n line-height: normal;\n margin: 16px 0 8px 0;\n}\n.challenge-details .challenge-block {\n border-radius: 20px;\n border: 1px solid var(--emw--color-gray-300, rgba(255, 255, 255, 0.07));\n background: var(--emw--block-background, rgba(9, 9, 9, 0.5));\n backdrop-filter: blur(11.47px);\n display: flex;\n padding: 20px 12px;\n justify-content: center;\n align-items: center;\n gap: 16px;\n margin: 16px 0;\n align-self: stretch;\n}\n.challenge-details .progress-block h3 {\n color: var(--emw--color-white, #fff);\n font-size: var(--emw--font-size-medium, 16px);\n font-style: normal;\n font-weight: var(--emw--font-weight-bold, 700);\n line-height: normal;\n margin: 0 0 10px 0;\n}\n.challenge-details .chevron-button {\n box-sizing: border-box;\n display: flex;\n width: 36px;\n height: 36px;\n padding: 4px 5px;\n justify-content: center;\n align-items: center;\n gap: 6.923px;\n aspect-ratio: 1/1;\n border-radius: 27.692px;\n border: 2px solid var(--emw--color-gray-300, rgba(255, 255, 255, 0.07));\n background: var(--emw--block-background, rgba(9, 9, 9, 0.5));\n backdrop-filter: blur(9.52px);\n margin-left: 4px;\n padding: 4px 5px;\n cursor: pointer;\n}\n.challenge-details .challenge-block-header {\n display: flex;\n padding-left: 4px;\n align-items: center;\n gap: 4px;\n align-self: stretch;\n justify-content: space-between;\n}\n.challenge-details .challenge-block-header .total-levels,\n.challenge-details .challenge-block-header .total-games {\n display: flex;\n align-items: center;\n}\n.challenge-details .challenge-block-header .total-levels span,\n.challenge-details .challenge-block-header .total-games span {\n color: var(--emw--dot-button-active-bg, rgba(255, 255, 255, 0.2));\n display: inline-block;\n font-size: var(--emw--font-size-medium, 16px);\n font-style: normal;\n font-weight: var(--emw--font-weight-normal, 400);\n line-height: normal;\n margin-left: 4px;\n}\n.challenge-details .challenge-block-header h3 {\n color: var(--emw--color-white, #fff);\n font-size: var(--emw--font-size-medium, 16px);\n font-style: normal;\n font-weight: var(--emw--font-weight-bold, 700);\n line-height: normal;\n margin: 0;\n}\n.challenge-details .challenge-block-header p {\n color: var(--emw--color-empty-state, rgba(255, 255, 255, 0.7));\n font-size: var(--emw--font-size-small, 14px);\n font-style: normal;\n font-weight: var(--emw--font-weight-normal, 400);\n line-height: normal;\n margin: 0;\n}\n.challenge-details .column {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: space-between;\n}\n.challenge-details .row {\n display: flex;\n align-items: center;\n justify-content: center;\n outline: none;\n background: transparent;\n border: none;\n}\n.challenge-details .button {\n cursor: pointer;\n}\n.challenge-details .general-info-col {\n width: 33%;\n}\n.challenge-details .general-info-icon {\n margin-left: 4px;\n}\n.challenge-details .label {\n text-transform: capitalize;\n color: var(--emw--color-gray-400, #c9cacb);\n font-size: var(--emw--font-size-small, 14px);\n font-style: normal;\n font-weight: var(--emw--font-weight-normal, 400);\n line-height: normal;\n margin: 0 0 3px 0;\n line-height: 17px;\n}\n.challenge-details .description {\n display: flex;\n align-items: center;\n color: var(--emw--color-white, #fff);\n font-size: var(--emw--font-size-small, 14px);\n font-style: normal;\n font-weight: var(--emw--font-weight-semibold, 600);\n line-height: normal;\n margin: 0;\n line-height: 17px;\n}\n.challenge-details .description span {\n display: inline-block;\n}\n.challenge-details .challenge-terms {\n margin: 16px 12px 0 12px;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n}\n.challenge-details .terms-title {\n display: flex;\n align-items: center;\n color: var(--emw--background-green-color, #00b541);\n line-height: 17px;\n font-size: var(--emw--font-size-small, 14px);\n font-style: normal;\n font-weight: var(--emw--font-weight-bold, 700);\n border-bottom: 1px solid var(--emw--background-green-color, #00b541);\n cursor: pointer;\n text-underline-offset: 3px;\n margin: 0;\n}\n.challenge-details .terms-title img {\n margin-left: 4px;\n}\n.challenge-details .terms-description {\n color: var(--emw--color-empty-state, rgba(255, 255, 255, 0.7));\n text-align: center;\n font-size: var(--emw--font-size-small, 14px);\n font-style: normal;\n font-weight: var(--emw--font-weight-normal, 400);\n line-height: normal;\n margin: 6px 0;\n line-height: 14px;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n max-height: 28px;\n min-height: 14px;\n -webkit-line-clamp: 2;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.challenge-details .challenge-general-info {\n padding: 20px 12px;\n box-sizing: border-box;\n}\n.challenge-details .challenge-levels,\n.challenge-details .challenge-games,\n.challenge-details .challenge-rules {\n display: flex;\n padding: 16px;\n flex-direction: column;\n align-items: flex-start;\n gap: 12px;\n align-self: stretch;\n}\n.challenge-details .levels-row {\n overflow-x: auto;\n scrollbar-width: none;\n -ms-overflow-style: none;\n width: 100%;\n display: flex;\n align-items: flex-start;\n gap: 10px;\n justify-content: flex-start;\n}\n.challenge-details .challenge-games {\n margin: 0;\n}\n.challenge-details .challenge-level {\n display: flex;\n padding: 12px;\n flex-direction: column;\n justify-content: center;\n align-items: flex-start;\n border-radius: 14px;\n background: var(--emw--level-color-background, rgba(114, 118, 114, 0.2));\n min-width: 153px;\n}\n.challenge-details .challenge-level .label {\n margin-bottom: 8px;\n}\n.challenge-details .challenge-level .description {\n font-size: var(--emw--font-size-x-small, 12px);\n font-weight: var(--emw--font-weight-normal, 400);\n line-height: 14px;\n max-width: 130px;\n}\n.challenge-details .challenge-level img {\n margin-right: 6px;\n}\n.challenge-details .challenge-games .games-row {\n overflow-x: auto;\n overflow-y: hidden;\n scrollbar-width: none;\n -ms-overflow-style: none;\n width: 100%;\n display: flex;\n gap: 10px;\n align-items: flex-start;\n justify-content: flex-start;\n}\n.challenge-details .challenge-game {\n display: flex;\n min-width: 120px;\n height: 84px;\n justify-content: flex-end;\n align-items: flex-start;\n gap: 7.978px;\n border-radius: 10.53px;\n cursor: pointer;\n}\n.challenge-details .challenge-game img {\n width: 100%;\n height: auto;\n}\n.challenge-details .challenge-rules {\n padding: 14px;\n}\n.challenge-details .challenge-rule,\n.challenge-details .challenge-event {\n color: var(--emw--color-empty-state, rgba(255, 255, 255, 0.7));\n font-size: var(--emw--font-size-small, 14px);\n font-style: normal;\n font-weight: var(--emw--font-weight-normal, 400);\n line-height: normal;\n}\n.challenge-details .ellipsed {\n display: inline-block;\n max-width: 100%;\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n}\n.challenge-details .footer {\n box-sizing: border-box;\n display: flex;\n width: 100%;\n padding: 20px 24px 24px 24px;\n justify-content: space-between;\n align-items: center;\n gap: 8px;\n border-top: 1px solid var(--emw--gradient-blue, #003e5c);\n background: var(--emw--backdrop-background, rgba(9, 9, 9, 0.8));\n backdrop-filter: blur(16.05px);\n border-radius: 0 0 30px 30px;\n flex-shrink: 0;\n}\n.challenge-details .action-description {\n font-size: var(--emw--font-size-small, 14px);\n line-height: var(--emw--font-size-small, 14px);\n font-style: normal;\n font-weight: var(--emw--font-weight-semibold, 600);\n color: var(--emw--color-white, #fff);\n}\n.challenge-details .promo-action-description {\n background: var(--emw--action-description-background, linear-gradient(310deg, #d6ffdc 12.98%, #74b580 92.6%, #509142 131.58%));\n background-clip: text;\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n}\n.challenge-details .action-button {\n border-radius: 99px;\n border: 1px solid var(--emw--color-gray-300, rgba(255, 255, 255, 0.07));\n background: var(--emw--color-green, #00fa5a);\n display: flex;\n height: 40px;\n padding: 14px 20px;\n justify-content: center;\n align-items: center;\n gap: 4px;\n flex-shrink: 0;\n color: var(--emw--color-black-100, #090909);\n font-size: var(--emw--font-size-medium, 16px);\n font-style: normal;\n font-weight: var(--emw--font-weight-bold, 700);\n line-height: normal;\n}\n.challenge-details .action-button:hover {\n border-color: var(--emw--color-gray-300, #083b17);\n cursor: pointer;\n}\n.challenge-details .action-button.filled {\n color: var(--emw--color-green, #00fa5a);\n border: 1px solid var(--emw--color-gray-300, rgba(255, 255, 255, 0.07));\n background: var(--emw--button-background-primary-color, linear-gradient(35deg, rgba(255, 255, 255, 0) 33.61%, rgba(255, 255, 255, 0.15) 89.19%)), var(--emw--color-gray-300, rgba(255, 255, 255, 0.07));\n background-blend-mode: overlay;\n}\n.challenge-details .action-button.filled:hover {\n border-color: transparent;\n box-shadow: 0 0 4px 0 rgba(188, 252, 177, 0.2), 0 0 20px 0 rgba(0, 183, 79, 0.5);\n}\n.challenge-details .action-button.grayed {\n color: var(--emw--color-gray-50, #e2e2e2);\n background: var(--emw--color-black, #000000);\n border-color: var(--emw--button-disabled-border-color, rgba(255, 255, 255, 0.5));\n box-shadow: 0 0 20px 0 rgba(188, 252, 177, 0.2);\n}\n.challenge-details .action-button.grayed:hover {\n color: var(--emw--color-white, #fff);\n}\n.challenge-details .action-button:disabled, .challenge-details .action-button:disabled:hover {\n color: var(--emw--color-gray-50, #e2e2e2);\n cursor: not-allowed;\n border: 2px solid var(--emw--button-disabled-border-color, rgba(255, 255, 255, 0.5));\n opacity: 0.7;\n}\n.challenge-details .expand-button {\n outline: none;\n border: none;\n width: 39px;\n height: 16px;\n background: transparent;\n margin: 0 auto;\n cursor: pointer;\n}\n.challenge-details .levels-row .level {\n display: flex;\n padding: 12px;\n flex-direction: column;\n align-items: flex-start;\n align-self: stretch;\n border-radius: 14px;\n background: var(--emw--level-color-background, rgba(114, 118, 114, 0.2));\n border: none;\n}\n.challenge-details .levels-row .level.active, .challenge-details .levels-row .level.completed {\n border: 1px solid var(--emw--color-gray-300, rgba(255, 255, 255, 0.07));\n background: var(--emw--level-completed-gradient, linear-gradient(90deg, rgba(30, 101, 79, 0.2) 0%, rgba(28, 141, 86, 0.2) 100%));\n}\n.challenge-details .levels-row .level.active .level__title span, .challenge-details .levels-row .level.completed .level__title span {\n color: var(--emw--color-white, #fff);\n}\n.challenge-details .levels-row .level.suspended {\n border: 1px solid var(--emw--color-gray-300, rgba(255, 255, 255, 0.07));\n background: var(--emw--color-level-suspended rgba(9, 9, 9, 0.4));\n}\n.challenge-details .levels-row .level.suspended .level__status .suspended {\n color: var(--emw--color-level-status-suspended, rgba(255, 255, 255, 0.5));\n font-weight: 400;\n}\n.challenge-details .levels-row .level.suspended .level__title span {\n color: var(--emw--color-white, #fff);\n}\n.challenge-details .levels-row .level.forfeited {\n background: var(--emw--color-level-color-background, rgba(114, 118, 114, 0.2));\n border: none;\n color: var(--emw--color-level-status-suspended, rgba(255, 255, 255, 0.5));\n}\n.challenge-details .levels-row .level.forfeited .level__title span {\n color: var(--emw--color-level-status-suspended, rgba(255, 255, 255, 0.5));\n}\n.challenge-details .levels-row .level.forfeited .level__target,\n.challenge-details .levels-row .level.forfeited .level__value {\n color: var(--emw--color-level-status-suspended, rgba(255, 255, 255, 0.5));\n}\n.challenge-details .levels-row .level__status {\n display: flex;\n align-items: center;\n gap: 4px;\n font-size: var(--emw--font-size-x-small, 12px);\n font-weight: var(--emw--font-weight-semibold, 600);\n}\n.challenge-details .levels-row .level__title {\n width: 100%;\n display: flex;\n align-items: center;\n justify-content: space-between;\n color: var(--emw--color-white, #fff);\n font-size: var(--emw--font-size-small, 14px);\n font-weight: var(--emw--font-weight-semibold, 600);\n line-height: 17px;\n margin-bottom: 8px;\n}\n.challenge-details .levels-row .level__title span {\n color: var(--emw--color-white-150, rgba(255, 255, 255, 0.7));\n}\n.challenge-details .levels-row .level__title .completed {\n background: var(--emw--action-description-background, linear-gradient(310deg, #d6ffdc 12.98%, #74b580 92.6%, #509142 131.58%));\n background-clip: text;\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n}\n.challenge-details .levels-row .level__title .completed, .challenge-details .levels-row .level__title .in-progress {\n color: var(--emw--border-success-color, #00b74f);\n font-size: var(--emw--font-size-x-small, 12px);\n font-weight: var(--emw--font-weight-medium, 500);\n text-align: right;\n line-height: 17px;\n}\n.challenge-details .levels-row .level__progress {\n width: 100%;\n margin-bottom: 10px;\n}\n.challenge-details .levels-row .level__icon {\n display: flex;\n opacity: 1;\n}\n.challenge-details .levels-row .level__icon img {\n display: block;\n width: 12px;\n height: 12px;\n margin: 4px 6px 0 0;\n}\n.challenge-details .levels-row .level__icon img.grayed {\n opacity: 0.5;\n}\n.challenge-details .levels-row .level__bonus, .challenge-details .levels-row .level__target {\n display: flex;\n align-items: flex-start;\n color: var(--emw--color-white, #fff);\n font-size: var(--emw--font-size-x-small, 12px);\n font-weight: var(--emw--font-weight-medium, 500);\n line-height: 22px;\n}\n.challenge-details .levels-row .level__bonus {\n margin-bottom: 6px;\n}\n.challenge-details .levels-row .level__value {\n color: var(--emw--color-white, #fff);\n font-size: var(--emw--font-size-x-small, 12px);\n font-weight: var(--emw--font-weight-medium, 500);\n line-height: 22px;\n width: 100%;\n}\n.challenge-details .notification {\n display: flex;\n align-items: flex-start;\n border-radius: var(--emw--border-radius-small, 12px);\n background: rgba(188, 252, 177, 0.1);\n display: flex;\n padding: 20px 16px;\n align-items: flex-start;\n gap: 10px;\n margin: 16px 0;\n}\n.challenge-details .notification__icon {\n width: 18px;\n height: 18px;\n}\n.challenge-details .notification__message, .challenge-details .notification__title {\n color: var(--emw--color-white-150, rgba(255, 255, 255, 0.7));\n font-size: var(--emw--font-size-medium, 16px);\n font-weight: var(--emw--font-weight-normal, 400);\n}\n.challenge-details .notification__title {\n background: var(--emw--color-notification-background-secondary, linear-gradient(180deg, #24b24e 0%, #18ce51 100%));\n background-clip: text;\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n}\n.challenge-details .notification__column {\n display: flex;\n flex-direction: column;\n}\n\n@container challenges-drawer (width <=500px) {\n .challenge-details .content,\n .challenge-details .sub-page-wrapper {\n padding: 0 20px;\n }\n}\n@container challenges-drawer (width <=475px) {\n .challenge-details .challenge-title {\n margin: 0 0 4px;\n }\n .challenge-details .challenge-block {\n margin: 12px 0;\n }\n .challenge-details .challenge-levels,\n .challenge-details .challenge-games,\n .challenge-details .challenge-rules {\n padding: 12px;\n }\n}\n@container challenges-drawer (width <=400px) {\n .challenge-details .content,\n .challenge-details .sub-page-wrapper {\n padding: 0 15px;\n }\n}\n@container challenges-drawer (width <= 480px) {\n .footer .action-description {\n font-size: var(--emw--font-size-xs-small, 13px);\n }\n .challenge-details .footer {\n padding: 20px 15px 24px;\n }\n}\n@container challenges-drawer (width <= 440px) {\n .challenge-details .footer {\n padding: 15px;\n }\n}\n@container challenges-game-page (height <= 850px) {}";
3517
3517
  const CasinoChallengesOverlayDrawerDetailsStyle0 = casinoChallengesOverlayDrawerDetailsCss;
3518
3518
 
3519
3519
  const CasinoChallengesOverlayDrawerDetails = class {
@@ -4306,7 +4306,7 @@ const notificationSvg = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdod
4306
4306
 
4307
4307
  const crownSvg = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTMiIHZpZXdCb3g9IjAgMCAxNCAxMyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTExLjU4MzMgNi43MDU0N0wxMS40NjEgNy44NDE5M0wxMi40NTUzIDcuOTQ4ODdMMTIuNTc3NSA2LjgxMjRMMTEuNTgzMyA2LjcwNTQ3Wk03LjU1ODYgMTJINi4xMDgwN1YxM0g3LjU1ODZWMTJaTTIuMjA1NjcgNy44NDE5M0wyLjA4MzQzIDYuNzA1NDdMMS4wODkxNyA2LjgxMjRMMS4yMTE0IDcuOTQ4ODdMMi4yMDU2NyA3Ljg0MTkzWk01LjExMDA1IDYuMDMyODdMNi4zMDMwNyAzLjg5MzgxTDUuNDI5NjkgMy40MDY3Mkw0LjIzNjY5IDUuNTQ1NzNMNS4xMTAwNSA2LjAzMjg3Wk03LjM2MzYgMy44OTM4MUw4LjU1NjYgNi4wMzI4N0w5LjQzIDUuNTQ1NzNMOC4yMzcgMy40MDY3Mkw3LjM2MzYgMy44OTM4MVpNOC41NTY2IDYuMDMyODdDOC42NjQ0NiA2LjIyNjIgOC43NjM3MyA2LjQwNTQ3IDguODU5OTMgNi41NDI1M0M4Ljk1OSA2LjY4MzUzIDkuMDk0MDcgNi44MzkyNyA5LjMwMSA2LjkzMDRMOS43MDQgNi4wMTUyQzkuNzQxMjcgNi4wMzE1MyA5LjczNDkzIDYuMDQ4NCA5LjY3ODMzIDUuOTY3ODdDOS42MTg5MyA1Ljg4MzI3IDkuNTQ4NDcgNS43NTgyIDkuNDMgNS41NDU3M0w4LjU1NjYgNi4wMzI4N1pNMTAuMTI3NSA1LjY0MjUzQzkuOTU1IDUuODE0MzMgOS44NTI2NiA1LjkxNTQgOS43NzIxMyA1Ljk4MDUzQzkuNjk1NCA2LjA0MjYgOS42OTM3MyA2LjAyNDggOS43MzM3MyA2LjAxOTI3TDkuODcwNjYgNy4wMDk4N0MxMC4wOTQ1IDYuOTc4OTMgMTAuMjY3MSA2Ljg2NjMzIDEwLjQwMTEgNi43NTc5M0MxMC41MzEzIDYuNjUyNiAxMC42NzYxIDYuNTA3NDcgMTAuODMzMiA2LjM1MUwxMC4xMjc1IDUuNjQyNTNaTTkuMzAxIDYuOTMwNEM5LjQ3OTg3IDcuMDA5MTMgOS42NzcxMyA3LjAzNjYgOS44NzA2NiA3LjAwOTg3TDkuNzMzNzMgNi4wMTkyN0M5LjcyMzUzIDYuMDIwNjcgOS43MTMyNyA2LjAxOTI3IDkuNzA0IDYuMDE1Mkw5LjMwMSA2LjkzMDRaTTIuODMzNDcgNi4zNTFDMi45OTA1MiA2LjUwNzQ3IDMuMTM1MzMgNi42NTI2IDMuMjY1NTYgNi43NTc5M0MzLjM5OTU1IDYuODY2MzMgMy41NzIxNiA2Ljk3ODkzIDMuNzk1OTggNy4wMDk4N0wzLjkzMjk1IDYuMDE5MjdDMy45NzI5NiA2LjAyNDggMy45NzEyNyA2LjA0MjYgMy44OTQ1MyA1Ljk4MDUzQzMuODE0MDMgNS45MTU0IDMuNzExNjkgNS44MTQzMyAzLjUzOTE5IDUuNjQyNTNMMi44MzM0NyA2LjM1MVpNNC4yMzY2OSA1LjU0NTczQzQuMTE4MjEgNS43NTgyIDQuMDQ3NzIgNS44ODMyNyAzLjk4ODMzIDUuOTY3ODdDMy45MzE3NyA2LjA0ODQgMy45MjU0MyA2LjAzMTUzIDMuOTYyNjMgNi4wMTUyTDQuMzY1NjQgNi45MzA0QzQuNTcyNTggNi44MzkyNyA0LjcwNzcgNi42ODM1MyA0LjgwNjczIDYuNTQyNTNDNC45MDI5NCA2LjQwNTUzIDUuMDAyMiA2LjIyNjIgNS4xMTAwNSA2LjAzMjg3TDQuMjM2NjkgNS41NDU3M1pNMy43OTU5OCA3LjAwOTg3QzMuOTg5NTMgNy4wMzY2IDQuMTg2NzcgNy4wMDkxMyA0LjM2NTY0IDYuOTMwNEwzLjk2MjYzIDYuMDE1MkMzLjk1MzQxIDYuMDE5MjcgMy45NDMxMSA2LjAyMDY3IDMuOTMyOTUgNi4wMTkyN0wzLjc5NTk4IDcuMDA5ODdaTTYuMTA4MDcgMTJDNS4xNDk0NyAxMiA0LjQ3ODEzIDExLjk5OTEgMy45NjU3MSAxMS45MzM1QzMuNDY3MjcgMTEuODY5NyAzLjE4NTY3IDExLjc1MTYgMi45NzQ4NSAxMS41NjI5TDIuMzA3OTEgMTIuMzA4QzIuNzI3ODIgMTIuNjgzOSAzLjIzNDI1IDEyLjg0OCAzLjgzODc5IDEyLjkyNTRDNC40MjkzNyAxMy4wMDA5IDUuMTc1OTkgMTMgNi4xMDgwNyAxM1YxMlpNMS4yMTE0IDcuOTQ4ODdDMS4zMTAxNyA4Ljg2NzEzIDEuMzg4NTUgOS43NjY2IDEuNTIyMTUgMTAuNDk2QzEuNTg5NTMgMTAuODYzOSAxLjY3NDUyIDExLjIxMDYgMS43OTIyMiAxMS41MTE1QzEuOTA4OTMgMTEuODA5OSAyLjA2OTkzIDEyLjA5NSAyLjMwNzkxIDEyLjMwOEwyLjk3NDg1IDExLjU2MjlDMi44OTc0NyAxMS40OTM2IDIuODA5MzcgMTEuMzY2NyAyLjcyMzUgMTEuMTQ3MkMyLjYzODYzIDEwLjkzMDMgMi41Njc1OSAxMC42NTMzIDIuNTA1NzkgMTAuMzE1OUMyLjM4MDk5IDkuNjM0NTMgMi4zMDgzMSA4Ljc5NjIgMi4yMDU2NyA3Ljg0MTkzTDEuMjExNCA3Ljk0ODg3Wk0xMS40NjEgNy44NDE5M0MxMS4zNTgzIDguNzk2MiAxMS4yODU3IDkuNjM0NTMgMTEuMTYwOSAxMC4zMTU5QzExLjA5OTEgMTAuNjUzMyAxMS4wMjggMTAuOTMwMyAxMC45NDMxIDExLjE0NzJDMTAuODU3MyAxMS4zNjY3IDEwLjc2OTIgMTEuNDkzNiAxMC42OTE4IDExLjU2MjlMMTEuMzU4NyAxMi4zMDhDMTEuNTk2NyAxMi4wOTUgMTEuNzU3NyAxMS44MDk5IDExLjg3NDUgMTEuNTExNUMxMS45OTIxIDExLjIxMDYgMTIuMDc3MSAxMC44NjM5IDEyLjE0NDUgMTAuNDk2QzEyLjI3ODEgOS43NjY2IDEyLjM1NjUgOC44NjcxMyAxMi40NTUzIDcuOTQ4ODdMMTEuNDYxIDcuODQxOTNaTTcuNTU4NiAxM0M4LjQ5MDY3IDEzIDkuMjM3MjcgMTMuMDAwOSA5LjgyNzg3IDEyLjkyNTRDMTAuNDMyNCAxMi44NDggMTAuOTM4OSAxMi42ODM5IDExLjM1ODcgMTIuMzA4TDEwLjY5MTggMTEuNTYyOUMxMC40ODEgMTEuNzUxNiAxMC4xOTk0IDExLjg2OTcgOS43MDA5MyAxMS45MzM1QzkuMTg4NTMgMTEuOTk5MSA4LjUxNzIgMTIgNy41NTg2IDEyVjEzWk02IDEuODMzMzNDNiAxLjM3MzA5IDYuMzczMDcgMSA2LjgzMzMzIDFWMEM1LjgyMDggMCA1IDAuODIwODEzIDUgMS44MzMzM0g2Wk02LjgzMzMzIDFDNy4yOTM2IDEgNy42NjY2NyAxLjM3MzA5IDcuNjY2NjcgMS44MzMzM0g4LjY2NjY3QzguNjY2NjcgMC44MjA4MTMgNy44NDU4NyAwIDYuODMzMzMgMFYxWk0xMi42NjY3IDQuNUMxMi42NjY3IDQuNzc2MTQgMTIuNDQyOCA1IDEyLjE2NjcgNVY2QzEyLjk5NTEgNiAxMy42NjY3IDUuMzI4NCAxMy42NjY3IDQuNUgxMi42NjY3Wk0xMS42NjY3IDQuNUMxMS42NjY3IDQuMjIzODYgMTEuODkwNSA0IDEyLjE2NjcgNFYzQzExLjMzODMgMyAxMC42NjY3IDMuNjcxNTcgMTAuNjY2NyA0LjVIMTEuNjY2N1pNMTIuMTY2NyA0QzEyLjQ0MjggNCAxMi42NjY3IDQuMjIzODYgMTIuNjY2NyA0LjVIMTMuNjY2N0MxMy42NjY3IDMuNjcxNTcgMTIuOTk1MSAzIDEyLjE2NjcgM1Y0Wk0xLjUgNUMxLjIyMzg2IDUgMSA0Ljc3NjE0IDEgNC41SDBDMCA1LjMyODQgMC42NzE1NzMgNiAxLjUgNlY1Wk0xIDQuNUMxIDQuMjIzODYgMS4yMjM4NiA0IDEuNSA0VjNDMC42NzE1NzMgMyAwIDMuNjcxNTcgMCA0LjVIMVpNMS41IDRDMS43NzYxNCA0IDIgNC4yMjM4NiAyIDQuNUgzQzMgMy42NzE1NyAyLjMyODQzIDMgMS41IDNWNFpNMTIuMTY2NyA1QzEyLjE2NDcgNSAxMi4xNjI3IDQuOTk5OTkgMTIuMTYwNyA0Ljk5OTk3TDEyLjE0OTEgNS45OTk4N0MxMi4xNTQ5IDUuOTk5OTMgMTIuMTYwOCA2IDEyLjE2NjcgNlY1Wk0xMi41Nzc1IDYuODEyNEMxMi42MDk3IDYuNTEyNDcgMTIuNjM4IDYuMjUwNTMgMTIuNjUzNSA2LjAzMkMxMi42Njg3IDUuODE3OTMgMTIuNjc0NCA1LjYxMjYgMTIuNjUwNCA1LjQzMzUzTDExLjY1OTMgNS41NjYzM0MxMS42NjkxIDUuNjM5NTMgMTEuNjcwMiA1Ljc2MDUzIDExLjY1NiA1Ljk2MTMzQzExLjY0MjEgNi4xNTc2NyAxMS42MTYyIDYuMzk5MDcgMTEuNTgzMyA2LjcwNTQ3TDEyLjU3NzUgNi44MTI0Wk0xMi4xNjA3IDQuOTk5OTdDMTIuMDEyMSA0Ljk5ODI1IDExLjg3OTMgNC45MzIxOCAxMS43ODggNC44MjY1NUwxMS4wMzEzIDUuNDgwMjdDMTEuMzAyIDUuNzkzNjcgMTEuNzAyMSA1Ljk5NDczIDEyLjE0OTEgNS45OTk4N0wxMi4xNjA3IDQuOTk5OTdaTTExLjc4OCA0LjgyNjU1QzExLjcxMjEgNC43Mzg2NiAxMS42NjY3IDQuNjI1MjYgMTEuNjY2NyA0LjVIMTAuNjY2N0MxMC42NjY3IDQuODc0MjkgMTAuODA0NCA1LjIxNzY3IDExLjAzMTMgNS40ODAyN0wxMS43ODggNC44MjY1NVpNMTAuODMzMiA2LjM1MUMxMS4yODQ5IDUuOTAxMTMgMTEuNTE3NSA1LjY3NDQgMTEuNjcyMyA1LjU3ODg3TDExLjE0NyA0LjcyNzk0QzEwLjg2NzEgNC45MDA3MyAxMC41MzEzIDUuMjQwMiAxMC4xMjc1IDUuNjQyNTNMMTAuODMzMiA2LjM1MVpNMiA0LjVDMiA0LjYyNTI2IDEuOTU0NTkgNC43Mzg2NiAxLjg3ODY2IDQuODI2NTVMMi42MzUzOCA1LjQ4MDI3QzIuODYyMjcgNS4yMTc2NyAzIDQuODc0MjkgMyA0LjVIMlpNMy41MzkxOSA1LjY0MjUzQzMuMTM1MzEgNS4yNDAyIDIuNzk5NTcgNC45MDA3MyAyLjUxOTY0IDQuNzI3OTRMMS45OTQ0IDUuNTc4ODdDMi4xNDkxOCA1LjY3NDQgMi4zODE4MiA1LjkwMTEzIDIuODMzNDcgNi4zNTFMMy41MzkxOSA1LjY0MjUzWk0xLjg3ODY2IDQuODI2NTVDMS43ODc0IDQuOTMyMTggMS42NTQ2MSA0Ljk5ODI1IDEuNTA2MDMgNC45OTk5N0wxLjUxNzU5IDUuOTk5ODdDMS45NjQ1MSA1Ljk5NDczIDIuMzY0NjcgNS43OTM2NyAyLjYzNTM4IDUuNDgwMjdMMS44Nzg2NiA0LjgyNjU1Wk0xLjUwNjAzIDQuOTk5OTdDMS41MDQwMSA0Ljk5OTk5IDEuNTAyMDEgNSAxLjUgNVY2QzEuNTA1ODcgNiAxLjUxMTc0IDUuOTk5OTMgMS41MTc1OSA1Ljk5OTg3TDEuNTA2MDMgNC45OTk5N1pNMi4wODM0MyA2LjcwNTQ3QzIuMDUwNDcgNi4zOTkwNyAyLjAyNDU4IDYuMTU3NjcgMi4wMTA2NyA1Ljk2MTMzQzEuOTk2NDUgNS43NjA1MyAxLjk5NzU3IDUuNjM5NTMgMi4wMDczOCA1LjU2NjMzTDEuMDE2MjMgNS40MzM1M0MwLjk5MjI0NiA1LjYxMjYgMC45OTgwMDYgNS44MTc5MyAxLjAxMzE3IDYuMDMyQzEuMDI4NjUgNi4yNTA1MyAxLjA1NjkgNi41MTI0NyAxLjA4OTE3IDYuODEyNEwyLjA4MzQzIDYuNzA1NDdaTTcuNjY2NjcgMS44MzMzM0M3LjY2NjY3IDIuMTU2NjkgNy40ODI2IDIuNDM3OTMgNy4yMTEyIDIuNTc2MzhMNy42NjU2NyAzLjQ2NzE1QzguMjU4NzMgMy4xNjQ1NyA4LjY2NjY3IDIuNTQ3MDIgOC42NjY2NyAxLjgzMzMzSDcuNjY2NjdaTTcuMjExMiAyLjU3NjM4QzcuMDk4MzMgMi42MzM5NyA2Ljk3MDQgMi42NjY2NyA2LjgzMzMzIDIuNjY2NjdWMy42NjY2N0M3LjEzMiAzLjY2NjY3IDcuNDE1MzMgMy41OTQ4NyA3LjY2NTY3IDMuNDY3MTVMNy4yMTEyIDIuNTc2MzhaTTguMjM3IDMuNDA2NzJDOC4wOTk0NyAzLjE2MDEzIDcuOTc1ODcgMi45MzgzMSA3Ljg2MjQ3IDIuNzU2OEw3LjAxNDQgMy4yODY3M0M3LjExMTczIDMuNDQyNDggNy4yMjE4NyAzLjYzOTY1IDcuMzYzNiAzLjg5MzgxTDguMjM3IDMuNDA2NzJaTTYuODMzMzMgMi42NjY2N0M2LjY5NjI3IDIuNjY2NjcgNi41NjgzMyAyLjYzMzk3IDYuNDU1NDcgMi41NzYzOEw2LjAwMSAzLjQ2NzE1QzYuMjUxMzMgMy41OTQ4NyA2LjUzNDY3IDMuNjY2NjcgNi44MzMzMyAzLjY2NjY3VjIuNjY2NjdaTTYuNDU1NDcgMi41NzYzOEM2LjE4NDA3IDIuNDM3OTMgNiAyLjE1NjY5IDYgMS44MzMzM0g1QzUgMi41NDcwMiA1LjQwNzkxIDMuMTY0NTcgNi4wMDEgMy40NjcxNUw2LjQ1NTQ3IDIuNTc2MzhaTTYuMzAzMDcgMy44OTM4MUM2LjQ0NDggMy42Mzk2NSA2LjU1NDkzIDMuNDQyNDggNi42NTIyNyAzLjI4NjczTDUuODA0MiAyLjc1NjhDNS42OTA4IDIuOTM4MzEgNS41NjcyIDMuMTYwMTMgNS40Mjk2OSAzLjQwNjcyTDYuMzAzMDcgMy44OTM4MVoiIGZpbGw9InVybCgjcGFpbnQwX2xpbmVhcl8xOTE2XzE2ODEyKSIvPgo8ZGVmcz4KPGxpbmVhckdyYWRpZW50IGlkPSJwYWludDBfbGluZWFyXzE5MTZfMTY4MTIiIHgxPSIyNS45NzUzIiB5MT0iLTAuNjAzMzc1IiB4Mj0iMjUuOTc1MyIgeTI9IjEyLjM5NjYiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIj4KPHN0b3Agb2Zmc2V0PSIwLjIwNSIgc3RvcC1jb2xvcj0iI0ZGQjgwMSIvPgo8c3RvcCBvZmZzZXQ9IjAuMzYiIHN0b3AtY29sb3I9IiNGRUY3NDYiLz4KPHN0b3Agb2Zmc2V0PSIwLjQxNSIgc3RvcC1jb2xvcj0iI0ZCRkZFMCIvPgo8c3RvcCBvZmZzZXQ9IjAuNTI1IiBzdG9wLWNvbG9yPSIjRkZGQTYwIi8+CjxzdG9wIG9mZnNldD0iMC45MiIgc3RvcC1jb2xvcj0iI0ZGOTQwMCIvPgo8L2xpbmVhckdyYWRpZW50Pgo8L2RlZnM+Cjwvc3ZnPgo=';
4308
4308
 
4309
- const casinoChallengesOverlayTabsCss = ".challenges__tabs-wrapper.Mobile {\n width: auto;\n margin: 0 16px;\n}\n.challenges__tabs-wrapper.Mobile .challenges__tabs {\n height: 34px;\n padding: 2px 5px;\n margin: 12px 0;\n font-size: var(--emw--font-size-small, 14px);\n}\n.challenges__tabs-wrapper.Mobile .challenges__tabs.challenges__tabs--promo {\n min-width: 84px;\n border: 1px solid transparent;\n}\n.challenges__tabs-wrapper.Mobile .challenges__tab {\n height: 28px;\n min-width: auto;\n border: 1px solid transparent;\n}\n.challenges__tabs-wrapper.Mobile .challenges-tab--promo {\n min-width: auto;\n}\n.challenges__tabs-wrapper.Mobile .challenges-tab--promo.active {\n background: var(--emw--active-tab-background, rgba(9, 9, 9, 0.4));\n backdrop-filter: blur(11.4705886841px);\n}\n.challenges__tabs-wrapper.Mobile .challenges-tab--promo span {\n margin-right: 4px;\n}\n\n.challenges__tabs-wrapper {\n position: relative;\n z-index: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n margin: 0 24px;\n}\n.challenges__tabs-wrapper .challenges__tabs {\n width: 100%;\n box-sizing: border-box;\n height: 42px;\n display: flex;\n align-items: center;\n padding: 4px;\n margin: 16px 0;\n overflow-x: auto;\n scrollbar-width: none;\n -ms-overflow-style: none;\n border-radius: var(--emw--border-radius-large, 99px);\n border: 1px solid var(--emw--color-gray-100, rgba(255, 255, 255, 0.1));\n background: var(--emw--tabs-background, linear-gradient(180deg, rgba(255, 255, 255, 0.02) 0%, rgba(255, 255, 255, 0.1) 100%));\n color: var(--emw--color-white, #fff);\n font-size: var(--emw--font-size-medium, 16px);\n font-weight: var(--emw--font-weight-medium, 500);\n}\n.challenges__tabs-wrapper .challenges__tabs.challenges__tabs--promo {\n min-width: 89px;\n margin-right: 10px;\n padding: 0;\n overflow-x: hidden;\n width: initial;\n}\n.challenges__tabs-wrapper .challenges__tab {\n box-sizing: border-box;\n height: 34px;\n width: 25%;\n min-width: 75px;\n position: relative;\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 4px;\n padding: 4px 8px;\n cursor: pointer;\n text-align: center;\n border-radius: var(--emw--border-radius-large, 99px);\n border: 1px solid transparent;\n}\n.challenges__tabs-wrapper .challenges__tab.active {\n background: var(--emw--active-tab-background, rgba(9, 9, 9, 0.4));\n backdrop-filter: blur(6.882352829px);\n border: 1px solid var(--emw--color-gray-300, rgba(255, 255, 255, 0.07));\n}\n.challenges__tabs-wrapper .challenges__tab.challenges__tab--promo {\n box-sizing: content-box;\n min-width: 65px;\n padding: 8px 12px;\n background: var(--emw--color-gray-200, rgba(255, 255, 255, 0.2));\n box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.05), 0 4px 4px 0 rgba(0, 0, 0, 0.05), 0 10px 10px 0 rgba(0, 0, 0, 0.1);\n backdrop-filter: blur(10px);\n}\n.challenges__tabs-wrapper .challenges__tab.challenges__tab--promo.active {\n background: var(--emw--active-tab-background, rgba(9, 9, 9, 0.4));\n backdrop-filter: blur(11.4705886841px);\n border: 1px solid transparent;\n}\n\n@container challenges-drawer (width <= 500px) {\n .challenges__tabs-wrapper {\n margin: 0 20px;\n }\n .challenges__tabs-wrapper .challenges__tabs {\n font-size: var(--emw--font-size-small, 14px);\n }\n}\n@container challenges-drawer (width <= 400px) {\n .challenges__tabs-wrapper {\n margin: 0 15px;\n }\n}\n@container challenges-drawer (height <= 760px) {\n .challenges__tabs-wrapper .challenges__tabs {\n margin: 0 0 10px;\n }\n}";
4309
+ const casinoChallengesOverlayTabsCss = ".challenges__tabs-wrapper.Mobile {\n width: auto;\n margin: 0 16px;\n}\n.challenges__tabs-wrapper.Mobile .challenges__tabs {\n height: 34px;\n padding: 2px 5px;\n margin: 12px 0;\n font-size: var(--emw--font-size-small, 14px);\n}\n.challenges__tabs-wrapper.Mobile .challenges__tabs.challenges__tabs--promo {\n min-width: 84px;\n border: 1px solid transparent;\n}\n.challenges__tabs-wrapper.Mobile .challenges__tab {\n height: 28px;\n min-width: auto;\n border: 1px solid transparent;\n}\n.challenges__tabs-wrapper.Mobile .challenges-tab--promo {\n min-width: auto;\n}\n.challenges__tabs-wrapper.Mobile .challenges-tab--promo.active {\n background: var(--emw--active-tab-background, rgba(9, 9, 9, 0.4));\n backdrop-filter: blur(11.4705886841px);\n}\n.challenges__tabs-wrapper.Mobile .challenges-tab--promo span {\n margin-right: 4px;\n}\n\n.challenges__tabs-wrapper {\n position: relative;\n z-index: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n margin: 0 24px;\n}\n.challenges__tabs-wrapper .challenges__tabs {\n width: 100%;\n box-sizing: border-box;\n height: 42px;\n display: flex;\n align-items: center;\n padding: 4px;\n margin: 16px 0;\n overflow-x: auto;\n scrollbar-width: none;\n -ms-overflow-style: none;\n border-radius: var(--emw--border-radius-large, 99px);\n border: 1px solid var(--emw--color-gray-100, rgba(255, 255, 255, 0.1));\n background: var(--emw--tabs-background, linear-gradient(180deg, rgba(255, 255, 255, 0.02) 0%, rgba(255, 255, 255, 0.1) 100%));\n color: var(--emw--color-white, #fff);\n font-size: var(--emw--font-size-medium, 16px);\n font-weight: var(--emw--font-weight-medium, 500);\n}\n.challenges__tabs-wrapper .challenges__tabs.challenges__tabs--promo {\n min-width: 89px;\n margin-right: 10px;\n padding: 0;\n overflow-x: hidden;\n width: initial;\n}\n.challenges__tabs-wrapper .challenges__tab {\n box-sizing: border-box;\n height: 34px;\n flex: 1;\n min-width: 75px;\n position: relative;\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 4px;\n padding: 4px 8px;\n cursor: pointer;\n text-align: center;\n border-radius: var(--emw--border-radius-large, 99px);\n border: 1px solid transparent;\n}\n.challenges__tabs-wrapper .challenges__tab.active {\n background: var(--emw--active-tab-background, rgba(9, 9, 9, 0.4));\n backdrop-filter: blur(6.882352829px);\n border: 1px solid var(--emw--color-gray-300, rgba(255, 255, 255, 0.07));\n}\n.challenges__tabs-wrapper .challenges__tab.challenges__tab--promo {\n box-sizing: content-box;\n min-width: 65px;\n padding: 8px 12px;\n background: var(--emw--color-gray-200, rgba(255, 255, 255, 0.2));\n box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.05), 0 4px 4px 0 rgba(0, 0, 0, 0.05), 0 10px 10px 0 rgba(0, 0, 0, 0.1);\n backdrop-filter: blur(10px);\n}\n.challenges__tabs-wrapper .challenges__tab.challenges__tab--promo.active {\n background: var(--emw--active-tab-background, rgba(9, 9, 9, 0.4));\n backdrop-filter: blur(11.4705886841px);\n border: 1px solid transparent;\n}\n.challenges__tabs-wrapper .challenges__tabs.challenges__tabs--promo.large {\n width: 100%;\n}\n\n@container challenges-drawer (width <= 500px) {\n .challenges__tabs-wrapper {\n margin: 0 20px;\n }\n .challenges__tabs-wrapper .challenges__tabs {\n font-size: var(--emw--font-size-small, 14px);\n }\n}\n@container challenges-drawer (width <= 400px) {\n .challenges__tabs-wrapper {\n margin: 0 15px;\n }\n}\n@container challenges-drawer (height <= 760px) {\n .challenges__tabs-wrapper .challenges__tabs {\n margin: 5px 0 10px;\n }\n}";
4310
4310
  const CasinoChallengesOverlayTabsStyle0 = casinoChallengesOverlayTabsCss;
4311
4311
 
4312
4312
  const CasinoChallengeOverlayTabs = class {
@@ -4321,24 +4321,35 @@ const CasinoChallengeOverlayTabs = class {
4321
4321
  this.activeTabIndex = EChallengesTabs$1.Active;
4322
4322
  this.activeTabHasNotification = false;
4323
4323
  this.pendingTabHasNotification = false;
4324
+ this.enabledWidgetTabs = undefined;
4324
4325
  }
4325
4326
  get tabs() {
4326
4327
  return [
4327
- { label: translate$2('promo', this.language) },
4328
- { label: translate$2('active', this.language) },
4329
- { label: translate$2('pendingTab', this.language) },
4330
- { label: translate$2('finishedTab', this.language) },
4331
- { label: translate$2('codeTab', this.language) }
4328
+ { label: translate$2('promo', this.language), shown: this.enabledWidgetTabs.includes(EFeatureFlags.PromoTab) },
4329
+ { label: translate$2('active', this.language), shown: true },
4330
+ {
4331
+ label: translate$2('pendingTab', this.language),
4332
+ shown: this.enabledWidgetTabs.includes(EFeatureFlags.PendingTab)
4333
+ },
4334
+ {
4335
+ label: translate$2('finishedTab', this.language),
4336
+ shown: this.enabledWidgetTabs.includes(EFeatureFlags.FinishedTab)
4337
+ },
4338
+ { label: translate$2('codeTab', this.language), shown: this.enabledWidgetTabs.includes(EFeatureFlags.CodeTab) }
4332
4339
  ];
4333
4340
  }
4334
4341
  render() {
4335
4342
  var _a;
4336
- return (h(Host, { key: 'ee3ef4b4bc68c97e9d2cf09fdb18bd07c89fa393' }, h("div", { key: '7c5ad9fa44f4fb9593be61b4c47fe28d793913c4', class: { 'challenges__tabs-wrapper': true, Mobile: this.isMobile } }, h("div", { key: '2188b25224bd3f9bb2a69b1946490d7eeac49bf4', class: "challenges__tabs challenges__tabs--promo" }, h("div", { key: '6545accdd8c223d1f28c4344497b5aa236653b84', class: {
4343
+ return (h(Host, { key: 'd7406b70fa77065267703e6fe15a5a7476b13a47' }, h("div", { key: '0e92159292c795a7ecd972d8fa58af96ef4471fe', class: { 'challenges__tabs-wrapper': true, Mobile: this.isMobile } }, this.enabledWidgetTabs.includes(EFeatureFlags.PromoTab) && (h("div", { key: '238e070c09337d8f347d0e5b0d0e8c66f477e92d', class: {
4344
+ challenges__tabs: true,
4345
+ 'challenges__tabs--promo': true,
4346
+ large: this.enabledWidgetTabs.length === 1
4347
+ } }, h("div", { key: '50cfb51db808d2fc5036be2fd06b70f8a0364aee', class: {
4337
4348
  challenges__tab: true,
4338
4349
  'challenges__tab--promo': true,
4339
4350
  active: this.activeTabIndex === EChallengesTabs$1.Promo
4340
- }, onClick: this.handleTabClick(EChallengesTabs$1.Promo) }, h("span", { key: 'e145f5bf9fc6c87df0c86bedc70b97c77f1f6021' }, (_a = this.tabs[0]) === null || _a === void 0 ? void 0 : _a.label), h("img", { key: 'd7d2e925a73673ec536f9aeea11211bb8db7988c', src: crownSvg }))), h("div", { key: 'd24f27763e7b288a939252f3b0d2214372e5b922', class: "challenges__tabs" }, this.tabs.map((tab, index) => {
4341
- if (index === EChallengesTabs$1.Promo)
4351
+ }, onClick: this.handleTabClick(EChallengesTabs$1.Promo) }, h("span", { key: 'a69d7dc4a1a798332bd9881cedb216ef82d279ab' }, (_a = this.tabs[0]) === null || _a === void 0 ? void 0 : _a.label), h("img", { key: '877a1c0c86ed9a632a1af6831f08dc4d2a172856', src: crownSvg })))), h("div", { key: '96e99a2e385f48878f4f7b25625b241be7f2560a', class: "challenges__tabs" }, this.tabs.map((tab, index) => {
4352
+ if (index === EChallengesTabs$1.Promo || !tab.shown)
4342
4353
  return;
4343
4354
  return (h("div", { class: {
4344
4355
  challenges__tab: true,
@@ -4352,7 +4363,7 @@ CasinoChallengeOverlayTabs.style = CasinoChallengesOverlayTabsStyle0;
4352
4363
 
4353
4364
  const swipeSvg = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjMiIGhlaWdodD0iNiIgdmlld0JveD0iMCAwIDIzIDYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMC40NzU5NTEgNS4xMzc3NUMxLjExMDU1IDUuMzk4MSAyLjEzOTQ1IDUuMzk4MSAyLjc3NDA1IDUuMTM3NzVMMTEuMzc1IDEuNjA5MTVMMTkuOTc2IDUuMTM3NzVDMjAuNjEwNiA1LjM5ODEgMjEuNjM5NCA1LjM5ODEgMjIuMjc0IDUuMTM3NzVDMjIuOTA4NyA0Ljg3NzQgMjIuOTA4NyA0LjQ1NTI5IDIyLjI3NCA0LjE5NDk0TDEyLjUyNCAwLjE5NDkzN0MxMS44ODk0IC0wLjA2NTQxMyAxMC44NjA2IC0wLjA2NTQxMyAxMC4yMjYgMC4xOTQ5MzdMMC40NzU5NTEgNC4xOTQ5NEMtMC4xNTg2NTEgNC40NTUyOSAtMC4xNTg2NTEgNC44Nzc0IDAuNDc1OTUxIDUuMTM3NzVaIiBmaWxsPSJ3aGl0ZSIgZmlsbC1vcGFjaXR5PSIwLjIiLz4KPC9zdmc+Cg==';
4354
4365
 
4355
- const swipeUpCss = ":host{display:block;height:100%;overflow:hidden}.hero{display:flex;flex-direction:column;align-items:center;justify-content:center;transition:transform 120ms linear, opacity 120ms linear;will-change:transform, opacity;margin-bottom:16px}.swipe-btn{display:flex;justify-content:center;align-items:center;border:none;padding:14px 28px;cursor:grab;touch-action:none;user-select:none;width:39px;height:16px;margin:0 auto}.content{overflow:hidden;transform-origin:top center;transition:transform 120ms linear, height 120ms linear, border-radius 120ms linear;will-change:transform, height, border-radius;border-radius:20px 20px 0 0;border-top:1px solid var(--emw--color-gray-300, rgba(255, 255, 255, 0.07));background:var(--emw--color-black-200, rgba(9, 9, 9, 0.8))}.swipe-down-handle{display:flex;justify-content:center;align-items:center;padding:10px 0;cursor:grab;touch-action:none;user-select:none}.swipe-btn{border:none;border-radius:999px;padding:14px 28px;font-size:var(--emw--font-size-large, 18px);background:transparent;color:black;cursor:grab;touch-action:none;user-select:none}";
4366
+ const swipeUpCss = ":host{display:block;height:100%;overflow:hidden;scrollbar-width:none;-ms-overflow-style:none}:host::-webkit-scrollbar{display:none !important;width:0 !important;height:0 !important}*{scrollbar-width:none;-ms-overflow-style:none}*::-webkit-scrollbar{display:none !important;width:0 !important;height:0 !important}.hero{display:flex;flex-direction:column;align-items:center;justify-content:center;transition:transform 120ms linear, opacity 120ms linear;will-change:transform, opacity;margin-bottom:16px}.swipe-btn{display:flex;justify-content:center;align-items:center;border:none;padding:14px 28px;cursor:grab;touch-action:none;user-select:none;width:39px;height:16px;margin:0 auto}.content{overflow:hidden;transform-origin:top center;transition:transform 120ms linear, height 120ms linear, border-radius 120ms linear;will-change:transform, height, border-radius;border-radius:20px 20px 0 0;border-top:1px solid var(--emw--color-gray-300, rgba(255, 255, 255, 0.07));background:var(--emw--color-black-200, rgba(9, 9, 9, 0.8));scrollbar-width:none;-ms-overflow-style:none}.content::-webkit-scrollbar{display:none}.swipe-down-handle{display:flex;justify-content:center;align-items:center;padding:10px 0;cursor:grab;touch-action:none;user-select:none}.swipe-btn{border:none;border-radius:999px;padding:14px 28px;font-size:var(--emw--font-size-large, 18px);background:transparent;color:black;cursor:grab;touch-action:none;user-select:none}";
4356
4367
  const SwipeUpStyle0 = swipeUpCss;
4357
4368
 
4358
4369
  const SwipeUp = class {
@@ -4414,13 +4425,20 @@ const SwipeUp = class {
4414
4425
  const heroOpacity = 1 - this.progress;
4415
4426
  const contentTranslate = this.progress * -this.maxSwipe;
4416
4427
  if (this.isMobile) {
4417
- return (h("div", { style: { display: 'flex', height: '100%', 'flex-direction': 'column', overflow: 'auto' } }, h("header", { class: "hero", style: {
4428
+ return (h("div", { style: {
4429
+ display: 'flex',
4430
+ height: '100%',
4431
+ 'flex-direction': 'column',
4432
+ overflow: 'auto',
4433
+ 'overscroll-behavior-y': 'none'
4434
+ } }, h("header", { class: "hero", style: {
4418
4435
  transform: `translateY(${heroTranslate}px)`,
4419
4436
  opacity: `${heroOpacity}`
4420
4437
  } }, h("slot", { name: "header" })), h("main", { class: "content", style: {
4421
4438
  transform: `translateY(${contentTranslate}px)`,
4422
4439
  'margin-bottom': `-${this.maxSwipe}px`,
4423
- height: '100%',
4440
+ flex: '1',
4441
+ 'min-height': '0',
4424
4442
  overflow: this.isOpened ? 'auto' : 'hidden'
4425
4443
  } }, this.isOpened ? (h("button", { class: "swipe-btn", onPointerDown: this.onPointerDown, style: { position: 'sticky', zIndex: '123', left: 'calc(50% - 40px)' } }, h("img", { src: swipeSvg, width: 23, height: 6, style: { rotate: '180deg' } }))) : (h("button", { class: "swipe-btn", onPointerDown: this.onPointerDown }, h("img", { src: swipeSvg, width: 23, height: 6 }))), h("slot", { name: "details" }))));
4426
4444
  }
package/dist/esm/{casino-challenges-overlay-drawer-7f1fbfff.js → casino-challenges-overlay-drawer-22f199a0.js} RENAMED
@@ -441,6 +441,13 @@ var EPostMessageResponseType;
441
441
  EPostMessageResponseType["UpdateChallengeProgress"] = "UpdateChallengeProgress";
442
442
  EPostMessageResponseType["NewChallengeProgressGranted"] = "NewChallengeProgressGranted";
443
443
  })(EPostMessageResponseType || (EPostMessageResponseType = {}));
444
+ var EFeatureFlags;
445
+ (function (EFeatureFlags) {
446
+ EFeatureFlags["PromoTab"] = "promo";
447
+ EFeatureFlags["PendingTab"] = "pending";
448
+ EFeatureFlags["FinishedTab"] = "finished";
449
+ EFeatureFlags["CodeTab"] = "code";
450
+ })(EFeatureFlags || (EFeatureFlags = {}));
444
451
 
445
452
  const crossSvg = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTIuNSAxNy41TDE3LjUgMi41IiBzdHJva2U9IndoaXRlIiBzdHJva2Utd2lkdGg9IjEuMDA0NTkiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+CjxwYXRoIGQ9Ik0yLjUgMi41TDE3LjUgMTcuNSIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIxLjAwNDU5IiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8L3N2Zz4K';
446
453
 
@@ -555,7 +562,7 @@ const CasinoChallengesOverlayDrawer = class {
555
562
  return (h("div", { class: `notification ${((_a = this.notification) === null || _a === void 0 ? void 0 : _a.errored) ? 'errored' : ''}` }, h("div", { class: "row" }, h("img", { src: ((_b = this.notification) === null || _b === void 0 ? void 0 : _b.errored) ? errorSvg : checkSvg, class: "notification__icon", alt: "" }), h("p", { class: "notification__message" }, (_c = this.notification) === null || _c === void 0 ? void 0 : _c.message))));
556
563
  };
557
564
  this.renderHeader = (isMobile) => {
558
- return (h("div", null, h("h1", { class: "challenges__drawer__title" }, h("span", null, translate('title', this.language)), h("button", { class: "challenges__drawer__close", onClick: this.onCloseClick }, h("img", { src: crossSvg, alt: "" }))), h("casino-challenges-overlay-tabs", { onTabClick: this.handleTabClick, activeTabIndex: this.activeTabIndex, activeTabHasNotification: false, pendingTabHasNotification: false, language: this.language, "is-mobile": isMobile })));
565
+ return (h("div", null, h("h1", { class: "challenges__drawer__title" }, h("span", null, translate('title', this.language)), h("button", { class: "challenges__drawer__close", onClick: this.onCloseClick }, h("img", { src: crossSvg, alt: "" }))), this.enabledWidgetTabs.length > 0 && (h("casino-challenges-overlay-tabs", { onTabClick: this.handleTabClick, activeTabIndex: this.activeTabIndex, activeTabHasNotification: false, pendingTabHasNotification: false, language: this.language, "is-mobile": isMobile, enabledWidgetTabs: this.enabledWidgetTabs }))));
559
566
  };
560
567
  this.isEmptyState = () => {
561
568
  if (!this.loading && this.activeTabIndex !== EChallengesTabs.Code) {
@@ -597,7 +604,7 @@ const CasinoChallengesOverlayDrawer = class {
597
604
  return (h("swipe-up", { onSwippedUp: (e) => {
598
605
  this.swipped = e.detail.swipped;
599
606
  this.progress = e.detail.progress;
600
- }, isMobile: isMobile, isOneSlider: isUnique }, h("div", { class: "content-header", slot: "header" }, this.renderHeader(isMobile), h("div", { class: { 'content-spacer': this.swipped || !isMobile, 'one-slide': isUnique && this.swipped } }, h("casino-challenges-overlay-slider", { mbSource: this.mbSource, clientStyling: this.clientStyling, clientStylingUrl: this.clientStylingUrl, translationUrl: this.translationUrl, language: this.language, challenges: challenges, isMobile: isMobile, onActiveChallengeChange: this.onActiveChallengeChange, initialProgressId: this.activeProgressId, activeTabIndex: this.activeTabIndex }))), h("div", { class: "content-details", slot: "details" }, this.renderChallengeDetails(isMobile, isUnique))));
607
+ }, isMobile: isMobile, isOneSlider: isUnique }, h("div", { class: "content-header", slot: "header" }, this.renderHeader(isMobile), h("div", { class: { 'content-spacer': this.swipped || !isMobile, 'one-slide': isUnique && this.swipped } }, h("casino-challenges-overlay-slider", { mbSource: this.mbSource, clientStyling: this.clientStyling, clientStylingUrl: this.clientStylingUrl, translationUrl: this.translationUrl, language: this.language, challenges: challenges, isMobile: isMobile, onActiveChallengeChange: this.onActiveChallengeChange, initialProgressId: this.activeProgressId, activeTabIndex: this.activeTabIndex }))), h("div", { class: "content-details", slot: "details", style: { overflow: this.swipped ? 'auto' : 'hidden' } }, this.renderChallengeDetails(isMobile, isUnique))));
601
608
  };
602
609
  this.onCloseClick = () => {
603
610
  var _a, _b;
@@ -617,6 +624,7 @@ const CasinoChallengesOverlayDrawer = class {
617
624
  this.handleClose = () => { };
618
625
  this.challenges = [];
619
626
  this.initialProgressId = '';
627
+ this.enabledWidgetTabs = undefined;
620
628
  this.activeChallenge = null;
621
629
  this.activeProgressId = '';
622
630
  this.activeTabIndex = EChallengesTabs.Active;
@@ -659,7 +667,8 @@ const CasinoChallengesOverlayDrawer = class {
659
667
  handleIsOpenChange(newValue) {
660
668
  var _a;
661
669
  if (newValue) {
662
- if (this.initialProgressId && this.challenges.length) {
670
+ if ((this.initialProgressId && this.challenges.length) ||
671
+ !this.enabledWidgetTabs.includes(EFeatureFlags.PromoTab)) {
663
672
  this.activeTabIndex = EChallengesTabs.Active;
664
673
  this.activeProgressId = this.initialProgressId;
665
674
  const currentChallenge = ((_a = this.activeChallenges) === null || _a === void 0 ? void 0 : _a.find((x) => x.Id === this.activeProgressId)) || this.activeChallenges[0];
@@ -997,4 +1006,4 @@ const CasinoChallengesOverlayDrawer = class {
997
1006
  };
998
1007
  CasinoChallengesOverlayDrawer.style = CasinoChallengesOverlayDrawerStyle0;
999
1008
 
1000
- export { CasinoChallengesOverlayDrawer as C, EHistoryItemLevelStatus as E, HistoryItemLevelStatusDictionary as H, EPostMessageRequestType as a, setClientStylingURL as b, setStreamStyling as c, EChallengesTabs as d, resolveTranslationUrl as r, setClientStyling as s, translate as t };
1009
+ export { CasinoChallengesOverlayDrawer as C, EHistoryItemLevelStatus as E, HistoryItemLevelStatusDictionary as H, EPostMessageRequestType as a, setClientStylingURL as b, setStreamStyling as c, EChallengesTabs as d, EFeatureFlags as e, resolveTranslationUrl as r, setClientStyling as s, translate as t };