npm - globuswebcomponents - Versions diffs - 2.18.12 → 2.18.14 - Mend

globuswebcomponents 2.18.12 → 2.18.14

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 (107) hide show

package/dist/components/{p-G7pmbfdS.js.map → p-BSq4jXcd.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-G7pmbfdS.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/gb-wysiwyg-toolbar/gb-wysiwyg-toolbar.css?tag=gb-wysiwyg-toolbar&encapsulation=shadow","src/components/gb-wysiwyg-toolbar/gb-wysiwyg-toolbar.tsx"],"sourcesContent":[".toolbar_wrapper {\n display: inline-flex;\n align-items: center;\n gap: 0.75rem;\n}\n\n.font_selector{\n width: 20rem;\n}\n\n.editor_icons {\n display: flex;\n align-items: flex-start;\n gap: var(--spacing-2);\n}\n","import { Component, Event, EventEmitter, h, Prop, State, Watch } from '@stencil/core';\n\n@Component({\n tag: 'gb-wysiwyg-toolbar',\n styleUrl: 'gb-wysiwyg-toolbar.css',\n shadow: true,\n})\nexport class GbWysiwygToolbar {\n @Prop() fontSelector: boolean = false;\n\n // Icons to disable, as an array or comma-separated string of action keys\n // (e.g. ['photo', 'attachment'] or \"photo,attachment\").\n @Prop() disabledIcons: string \| string[] = [];\n\n // Active states (passed in from gb-rich-text)\n @Prop() isBold: boolean = false;\n @Prop() isItalic: boolean = false;\n @Prop() isUnderline: boolean = false;\n @Prop() isH1: boolean = false;\n @Prop() isH2: boolean = false;\n @Prop() isQuote: boolean = false;\n @Prop() isLink: boolean = false;\n @Prop() isBulletList: boolean = false;\n @Prop() isOrderedList: boolean = false;\n @Prop() isAttachment: boolean = false;\n @Prop() isPhoto: boolean = false;\n\n // Mirror props into state so shadow DOM re-renders on change\n @State() _isBold: boolean = false;\n @State() _isItalic: boolean = false;\n @State() _isUnderline: boolean = false;\n @State() _isH1: boolean = false;\n @State() _isH2: boolean = false;\n @State() _isQuote: boolean = false;\n @State() _isLink: boolean = false;\n @State() _isBulletList: boolean = false;\n @State() _isOrderedList: boolean = false;\n @Event() toolbarAction: EventEmitter<string>;\n \n @Watch('isBold') onBoldChange(v: boolean) {\n this._isBold = v;\n }\n @Watch('isItalic') onItalicChange(v: boolean) {\n this._isItalic = v;\n }\n @Watch('isUnderline') onUnderlineChange(v: boolean) {\n this._isUnderline = v;\n }\n @Watch('isH1') onH1Change(v: boolean) {\n this._isH1 = v;\n }\n @Watch('isH2') onH2Change(v: boolean) {\n this._isH2 = v;\n }\n @Watch('isQuote') onQuoteChange(v: boolean) {\n this._isQuote = v;\n }\n @Watch('isLink') onLinkChange(v: boolean) {\n this._isLink = v;\n }\n @Watch('isBulletList') onBulletListChange(v: boolean) {\n this._isBulletList = v;\n }\n @Watch('isOrderedList') onOrderedListChange(v: boolean) {\n this._isOrderedList = v;\n }\n\n // Sync initial prop values into state on first load\n componentWillLoad() {\n this._isBold = this.isBold;\n this._isItalic = this.isItalic;\n this._isUnderline = this.isUnderline;\n this._isH1 = this.isH1;\n this._isH2 = this.isH2;\n this._isQuote = this.isQuote;\n this._isLink = this.isLink;\n this._isBulletList = this.isBulletList;\n this._isOrderedList = this.isOrderedList;\n }\n\n // Aliases so consumers can use either the action name or the icon `type`.\n private static ICON_ALIASES: Record<string, string> = {\n listbullet: 'bulletlist',\n bullets: 'bulletlist',\n listnumbers: 'orderedlist',\n numbered: 'orderedlist',\n ordered: 'orderedlist',\n image: 'photo',\n attach: 'attachment',\n };\n\n private static normalizeKey(key: string): string {\n const normalized = key.trim().toLowerCase().replace(/[\\s_-]/g, '');\n return GbWysiwygToolbar.ICON_ALIASES[normalized] ?? normalized;\n }\n\n private get disabledIconSet(): Set<string> {\n const raw = Array.isArray(this.disabledIcons) ? this.disabledIcons : String(this.disabledIcons ?? '').split(',');\n return new Set(raw.map(GbWysiwygToolbar.normalizeKey).filter(Boolean));\n }\n\n private isDisabled(action: string): boolean {\n return this.disabledIconSet.has(GbWysiwygToolbar.normalizeKey(action));\n }\n\n private stateFor(action: string): 'default' \| 'disabled' {\n return this.isDisabled(action) ? 'disabled' : 'default';\n }\n\n private emit(action: string, ev: MouseEvent) {\n ev.preventDefault();\n if (this.isDisabled(action)) return;\n this.toolbarAction.emit(action);\n }\n\n render() {\n return (\n <div class=\"toolbar_wrapper\">\n {this.fontSelector && (\n <div class=\"font_selector\">\n <gb-input-dropdown\n show-placeholder=\"true\"\n placeholder=\"Select an option\"\n size=\"sm\"\n state=\"default\"\n show-hint-text=\"false\"\n hint-text=\"This is a hint text to help user.\"\n type=\"default\"\n text={true}\n show-leading-icon=\"true\"\n leading-icon=\"assets/search-01.svg\"\n menu-position=\"bottom\"\n icon=\"false\"\n value={['Sora']}\n ></gb-input-dropdown>\n </div>\n )}\n <div class=\"editor_icons\">\n <gb-wysiwyg-editor-icon state={this.stateFor('bold')} active={this._isBold} type=\"bold\" onMouseDown={(ev: MouseEvent) => this.emit('bold', ev)}></gb-wysiwyg-editor-icon>\n <gb-wysiwyg-editor-icon state={this.stateFor('italic')} active={this._isItalic} type=\"italic\" onMouseDown={(ev: MouseEvent) => this.emit('italic', ev)}></gb-wysiwyg-editor-icon>\n <gb-wysiwyg-editor-icon state={this.stateFor('underline')} active={this._isUnderline} type=\"underline\" onMouseDown={(ev: MouseEvent) => this.emit('underline', ev)}></gb-wysiwyg-editor-icon>\n <gb-wysiwyg-editor-icon state={this.stateFor('h1')} active={this._isH1} type=\"h1\" onMouseDown={(ev: MouseEvent) => this.emit('h1', ev)}></gb-wysiwyg-editor-icon>\n <gb-wysiwyg-editor-icon state={this.stateFor('h2')} active={this._isH2} type=\"h2\" onMouseDown={(ev: MouseEvent) => this.emit('h2', ev)}></gb-wysiwyg-editor-icon>\n <gb-wysiwyg-editor-icon state={this.stateFor('quote')} active={this._isQuote} type=\"quote\" onMouseDown={(ev: MouseEvent) => this.emit('quote', ev)}></gb-wysiwyg-editor-icon>\n <gb-wysiwyg-editor-icon state={this.stateFor('link')} active={this._isLink} type=\"link\" onMouseDown={(ev: MouseEvent) => this.emit('link', ev)}></gb-wysiwyg-editor-icon>\n <gb-wysiwyg-editor-icon\n state={this.stateFor('attachment')}\n active={this.isAttachment}\n type=\"attachment\"\n onMouseDown={(ev: MouseEvent) => this.emit('attachment', ev)}\n ></gb-wysiwyg-editor-icon>\n <gb-wysiwyg-editor-icon state={this.stateFor('photo')} active={this.isPhoto} type=\"photo\" onMouseDown={(ev: MouseEvent) => this.emit('photo', ev)}></gb-wysiwyg-editor-icon>\n <gb-wysiwyg-editor-icon state={this.stateFor('bulletList')} active={this.isBulletList} type=\"list_bullet\" onMouseDown={(ev: MouseEvent) => this.emit('bulletList', ev)}></gb-wysiwyg-editor-icon>\n <gb-wysiwyg-editor-icon state={this.stateFor('orderedList')} active={this.isOrderedList} type=\"list_numbers\" onMouseDown={(ev: MouseEvent) => this.emit('orderedList', ev)}></gb-wysiwyg-editor-icon>\n </div>\n </div>\n );\n }\n}\n"],"version":3}
1	+ {"file":"p-BSq4jXcd.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/gb-wysiwyg-toolbar/gb-wysiwyg-toolbar.css?tag=gb-wysiwyg-toolbar&encapsulation=shadow","src/components/gb-wysiwyg-toolbar/gb-wysiwyg-toolbar.tsx"],"sourcesContent":[".toolbar_wrapper {\n display: inline-flex;\n align-items: center;\n gap: 0.75rem;\n}\n\n.font_selector{\n width: 20rem;\n}\n\n.editor_icons {\n display: flex;\n align-items: flex-start;\n gap: var(--spacing-2);\n}\n","import { Component, Event, EventEmitter, h, Prop, State, Watch } from '@stencil/core';\n\n@Component({\n tag: 'gb-wysiwyg-toolbar',\n styleUrl: 'gb-wysiwyg-toolbar.css',\n shadow: true,\n})\nexport class GbWysiwygToolbar {\n @Prop() fontSelector: boolean = false;\n\n // Icons to disable, as an array or comma-separated string of action keys\n // (e.g. ['photo', 'attachment'] or \"photo,attachment\").\n @Prop() disabledIcons: string \| string[] = [];\n\n // Active states (passed in from gb-rich-text)\n @Prop() isBold: boolean = false;\n @Prop() isItalic: boolean = false;\n @Prop() isUnderline: boolean = false;\n @Prop() isH1: boolean = false;\n @Prop() isH2: boolean = false;\n @Prop() isQuote: boolean = false;\n @Prop() isLink: boolean = false;\n @Prop() isBulletList: boolean = false;\n @Prop() isOrderedList: boolean = false;\n @Prop() isAttachment: boolean = false;\n @Prop() isPhoto: boolean = false;\n\n // Mirror props into state so shadow DOM re-renders on change\n @State() _isBold: boolean = false;\n @State() _isItalic: boolean = false;\n @State() _isUnderline: boolean = false;\n @State() _isH1: boolean = false;\n @State() _isH2: boolean = false;\n @State() _isQuote: boolean = false;\n @State() _isLink: boolean = false;\n @State() _isBulletList: boolean = false;\n @State() _isOrderedList: boolean = false;\n @Event() toolbarAction: EventEmitter<string>;\n \n @Watch('isBold') onBoldChange(v: boolean) {\n this._isBold = v;\n }\n @Watch('isItalic') onItalicChange(v: boolean) {\n this._isItalic = v;\n }\n @Watch('isUnderline') onUnderlineChange(v: boolean) {\n this._isUnderline = v;\n }\n @Watch('isH1') onH1Change(v: boolean) {\n this._isH1 = v;\n }\n @Watch('isH2') onH2Change(v: boolean) {\n this._isH2 = v;\n }\n @Watch('isQuote') onQuoteChange(v: boolean) {\n this._isQuote = v;\n }\n @Watch('isLink') onLinkChange(v: boolean) {\n this._isLink = v;\n }\n @Watch('isBulletList') onBulletListChange(v: boolean) {\n this._isBulletList = v;\n }\n @Watch('isOrderedList') onOrderedListChange(v: boolean) {\n this._isOrderedList = v;\n }\n\n // Sync initial prop values into state on first load\n componentWillLoad() {\n this._isBold = this.isBold;\n this._isItalic = this.isItalic;\n this._isUnderline = this.isUnderline;\n this._isH1 = this.isH1;\n this._isH2 = this.isH2;\n this._isQuote = this.isQuote;\n this._isLink = this.isLink;\n this._isBulletList = this.isBulletList;\n this._isOrderedList = this.isOrderedList;\n }\n\n // Aliases so consumers can use either the action name or the icon `type`.\n private static ICON_ALIASES: Record<string, string> = {\n listbullet: 'bulletlist',\n bullets: 'bulletlist',\n listnumbers: 'orderedlist',\n numbered: 'orderedlist',\n ordered: 'orderedlist',\n image: 'photo',\n attach: 'attachment',\n };\n\n private static normalizeKey(key: string): string {\n const normalized = key.trim().toLowerCase().replace(/[\\s_-]/g, '');\n return GbWysiwygToolbar.ICON_ALIASES[normalized] ?? normalized;\n }\n\n private get disabledIconSet(): Set<string> {\n const raw = Array.isArray(this.disabledIcons) ? this.disabledIcons : String(this.disabledIcons ?? '').split(',');\n return new Set(raw.map(GbWysiwygToolbar.normalizeKey).filter(Boolean));\n }\n\n private isDisabled(action: string): boolean {\n return this.disabledIconSet.has(GbWysiwygToolbar.normalizeKey(action));\n }\n\n private stateFor(action: string): 'default' \| 'disabled' {\n return this.isDisabled(action) ? 'disabled' : 'default';\n }\n\n private emit(action: string, ev: MouseEvent) {\n ev.preventDefault();\n if (this.isDisabled(action)) return;\n this.toolbarAction.emit(action);\n }\n\n render() {\n return (\n <div class=\"toolbar_wrapper\">\n {this.fontSelector && (\n <div class=\"font_selector\">\n <gb-input-dropdown\n show-placeholder=\"true\"\n placeholder=\"Select an option\"\n size=\"sm\"\n state=\"default\"\n show-hint-text=\"false\"\n hint-text=\"This is a hint text to help user.\"\n type=\"default\"\n text={true}\n show-leading-icon=\"true\"\n leading-icon=\"assets/search-01.svg\"\n menu-position=\"bottom\"\n icon=\"false\"\n value={['Sora']}\n ></gb-input-dropdown>\n </div>\n )}\n <div class=\"editor_icons\">\n <gb-wysiwyg-editor-icon state={this.stateFor('bold')} active={this._isBold} type=\"bold\" onMouseDown={(ev: MouseEvent) => this.emit('bold', ev)}></gb-wysiwyg-editor-icon>\n <gb-wysiwyg-editor-icon state={this.stateFor('italic')} active={this._isItalic} type=\"italic\" onMouseDown={(ev: MouseEvent) => this.emit('italic', ev)}></gb-wysiwyg-editor-icon>\n <gb-wysiwyg-editor-icon state={this.stateFor('underline')} active={this._isUnderline} type=\"underline\" onMouseDown={(ev: MouseEvent) => this.emit('underline', ev)}></gb-wysiwyg-editor-icon>\n <gb-wysiwyg-editor-icon state={this.stateFor('h1')} active={this._isH1} type=\"h1\" onMouseDown={(ev: MouseEvent) => this.emit('h1', ev)}></gb-wysiwyg-editor-icon>\n <gb-wysiwyg-editor-icon state={this.stateFor('h2')} active={this._isH2} type=\"h2\" onMouseDown={(ev: MouseEvent) => this.emit('h2', ev)}></gb-wysiwyg-editor-icon>\n <gb-wysiwyg-editor-icon state={this.stateFor('quote')} active={this._isQuote} type=\"quote\" onMouseDown={(ev: MouseEvent) => this.emit('quote', ev)}></gb-wysiwyg-editor-icon>\n <gb-wysiwyg-editor-icon state={this.stateFor('link')} active={this._isLink} type=\"link\" onMouseDown={(ev: MouseEvent) => this.emit('link', ev)}></gb-wysiwyg-editor-icon>\n <gb-wysiwyg-editor-icon\n state={this.stateFor('attachment')}\n active={this.isAttachment}\n type=\"attachment\"\n onMouseDown={(ev: MouseEvent) => this.emit('attachment', ev)}\n ></gb-wysiwyg-editor-icon>\n <gb-wysiwyg-editor-icon state={this.stateFor('photo')} active={this.isPhoto} type=\"photo\" onMouseDown={(ev: MouseEvent) => this.emit('photo', ev)}></gb-wysiwyg-editor-icon>\n <gb-wysiwyg-editor-icon state={this.stateFor('bulletList')} active={this.isBulletList} type=\"list_bullet\" onMouseDown={(ev: MouseEvent) => this.emit('bulletList', ev)}></gb-wysiwyg-editor-icon>\n <gb-wysiwyg-editor-icon state={this.stateFor('orderedList')} active={this.isOrderedList} type=\"list_numbers\" onMouseDown={(ev: MouseEvent) => this.emit('orderedList', ev)}></gb-wysiwyg-editor-icon>\n </div>\n </div>\n );\n }\n}\n"],"version":3}

package/dist/components/{p-BvrXxkVq.js → p-BnuUfALL.js} RENAMED Viewed

@@ -1,7 +1,7 @@
 import { p as proxyCustomElement, H, c as createEvent, h } from './p-CD7FeUx5.js';
-import { d as defineCustomElement$3 } from './p-eVx9Cuj0.js';
-import { d as defineCustomElement$2 } from './p-BEwtnG4L.js';
-import { d as defineCustomElement$1 } from './p-BdAdVQiw.js';
+import { d as defineCustomElement$3 } from './p-OVoS3dKe.js';
+import { d as defineCustomElement$2 } from './p-BE9pk1IO.js';
+import { d as defineCustomElement$1 } from './p-DDldZplG.js';
 const gbHelpDropdownCss = "@import url('https://fonts.googleapis.com/css2?family=Sora&display=swap');\n/**\n * Global styles for portal-based dropdowns\n * Applied outside shadow DOM context\n */\n.portal_dropdown_wrapper {\n  width: -moz-fit-content;\n  width: fit-content;\n  border-radius: var(--rounded-sm);\n  border: 1px solid var(--color-border-subtler, #e3e8ef);\n  background: var(--color-surface, #ffffff);\n  box-shadow: var(--shadow-md);\n  position: absolute;\n  z-index: 9999; /* High z-index to appear above sticky columns */\n  overflow: hidden;\n}\n.portal_dropdown_wrapper gb-dropdown-items-with-shortcut {\n  display: block;\n  width: 100%;\n}\n/* .portal_dropdown_wrapper gb-dropdown-items-with-shortcut:hover {\n  background: var(--color-background-gray-subtler, #eef2f6);\n} */\n/**\n * gb-input-dropdown menu, portaled out of the component's shadow root.\n * Mirrors .dropdown_menu in gb-input-dropdown.css (which is shadow-scoped and\n * therefore no longer applies once this element is moved into #gb-portal-host).\n */\n.input_dropdown_portal_menu {\n  display: flex;\n  flex-direction: column;\n  align-items: stretch;\n  max-height: 300px;\n  padding: var(--spacing-none);\n  border-radius: var(--rounded-sm);\n  border: 1px solid var(--color-border-subtler, #e3e8ef);\n  background: var(--color-surface, #ffffff);\n  box-shadow: var(--shadow-sm);\n  position: absolute;\n  z-index: 9999;\n  gap: var(--spacing-none);\n  overflow-y: auto;\n  overflow-x: hidden;\n  box-sizing: border-box;\n  /* Exact width (not just a minimum) is set inline by gb-input-dropdown-test.tsx\n   * (componentDidUpdate), matching the trigger's width. Content must not grow\n   * the menu wider than the trigger. */\n}\n.input_dropdown_portal_menu::-webkit-scrollbar {\n  right: 0rem;\n  bottom: -1.53125rem;\n  width: 0.8rem;\n  margin-top: 1rem;\n}\n.input_dropdown_portal_menu::-webkit-scrollbar-track {\n  width: 0.5rem;\n  padding: var(--spacing-1);\n  border: none;\n}\n.input_dropdown_portal_menu::-webkit-scrollbar-thumb {\n  width: 0.5rem;\n  height: 11.75rem;\n  border: 0.25rem solid var(--color-background-card, #ffffff);\n  border-radius: var(--rounded-full);\n  background: var(--color-border-subtle, #cdd5df);\n}\n/* Content rendered inside the portaled input-dropdown menu (search field, empty\n * state, loader) - also shadow-scoped in gb-input-dropdown.css and therefore\n * also unreachable once portaled. Kept in sync with that file by hand. */\n.input_dropdown_portal_menu .dropdown_search_field {\n  background: var(--color-surface, #ffffff);\n  padding: var(--spacing-2) var(--spacing-2) var(--spacing-none) var(--spacing-2);\n  position: sticky;\n  top: 0;\n  z-index: 999;\n}\n.input_dropdown_portal_menu .empty_state {\n  margin: auto;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.input_dropdown_portal_menu .background {\n  position: relative;\n  width: 80%;\n}\n.input_dropdown_portal_menu .message_background {\n  position: absolute;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: var(--spacing-1);\n}\n.input_dropdown_portal_menu .illustration {\n  width: 100px;\n  height: 100px;\n}\n.input_dropdown_portal_menu .message {\n  color: var(--color-text-bold, #202939);\n}\n.input_dropdown_portal_menu .loader_div {\n  width: 100%;\n  height: 10rem;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.input_dropdown_portal_menu .loader {\n  border: 4px solid var(--color-background-gray, #cdd5df);\n  border-top: 4px solid var(--color-background-selected, #075db2);\n  border-radius: 50%;\n  width: 30px;\n  height: 30px;\n  animation: input-dropdown-portal-spin 2s linear infinite;\n}\n@keyframes input-dropdown-portal-spin {\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(360deg);\n  }\n}\n/* @import 'tailwind.css'; */\n:root {\n  /* --------------------------------------Primary Colors--------------------------------------------- */\n  /* base color palette */\n  --base-white: #fff;\n  --base-black: #000;\n\n  /* gray color palette  */\n  --gray-25: #f9fafb;\n  --gray-50: #f6f8fa;\n  --gray-100: #eef2f6;\n  --gray-200: #e3e8ef;\n  --gray-300: #cdd5df;\n  --gray-400: #808c9e;\n  --gray-500: #697586;\n  --gray-600: #4b5565;\n  --gray-700: #364152;\n  --gray-800: #202939;\n  --gray-900: #121926;\n  --gray-950: #0d121c;\n\n  /* brand dark blue color palette */\n  --brandDarkBlue-25: #f9f9fb;\n  --brandDarkBlue-50: #edeef3;\n  --brandDarkBlue-100: #d3d5e0;\n  --brandDarkBlue-200: #b5b9cc;\n  --brandDarkBlue-300: #9095b2;\n  --brandDarkBlue-400: #464f7f;\n  --brandDarkBlue-500: #212c65;\n  --brandDarkBlue-600: #1e285c;\n  --brandDarkBlue-700: #1c2554;\n  --brandDarkBlue-800: #161d43;\n  --brandDarkBlue-900: #0b0f22;\n  --brandDarkBlue-950: #070914;\n\n  /* brand red color palette */\n  --brandRed-25: #fffbfa;\n  --brandRed-50: #fef1f2;\n  --brandRed-100: #fde3e5;\n  --brandRed-200: #f9b4ba;\n  --brandRed-300: #f68e98;\n  --brandRed-400: #f36976;\n  --brandRed-500: #e21b2e;\n  --brandRed-600: #cc1a2a;\n  --brandRed-700: #b51726;\n  --brandRed-800: #8c121d;\n  --brandRed-900: #680d16;\n  --brandRed-950: #3f080d;\n\n  /* warning color palette */\n  --yellow-25: #fffcf5;\n  --yellow-50: #fffaeb;\n  --yellow-100: #fef0c7;\n  --yellow-200: #fedf89;\n  --yellow-300: #fec84b;\n  --yellow-400: #fdb022;\n  --yellow-500: #f79009;\n  --yellow-600: #dc6803;\n  --yellow-700: #b54708;\n  --yellow-800: #93370d;\n  --yellow-900: #7a2e0e;\n  --yellow-950: #4e1d09;\n\n  /* success color palette  */\n  --green-25: #f6fef9;\n  --green-50: #ecfdf3;\n  --green-100: #dcfaeb;\n  --green-200: #a9efc5;\n  --green-300: #75e0a7;\n  --green-400: #47cd89;\n  --green-500: #17b26a;\n  --green-600: #067f48;\n  --green-700: #067647;\n  --green-800: #085d3a;\n  --green-900: #074d31;\n  --green-950: #053321;\n\n  /* ------------------------------------------opacity color palette--------------------------------------  */\n  /* 0% opacity */\n  /* White */\n  --white-opacity0: rgba(255, 255, 255, 0);\n\n  /* Gray */\n  --gray25-opacity0: rgba(249, 250, 251, 0);\n  --gray900-opacity0: rgba(18, 25, 38, 0);\n  --gray950-opacity0: rgba(13, 18, 28, 0);\n\n  /* 20% opacity */\n  /* White */\n  --white-opacity20: rgba(255, 255, 255, 0.2);\n\n  /* Dark Blue */\n  --darkBlue200-opacity20: rgba(181, 185, 204, 0.2);\n  --darkBlue500-opacity20: rgba(33, 44, 101, 0.2);\n\n  /* Gray */\n  --gray25-opacity20: rgba(249, 250, 251, 0.2);\n  --gray900-opacity20: rgba(18, 25, 38, 0.2);\n  --gray950-opacity20: rgba(13, 18, 28, 0.2);\n\n  /* 30% opacity */\n  --darkBlue200-opacity30: rgba(181, 185, 204, 0.3);\n  --darkBlue500-opacity30: rgba(33, 44, 101, 0.3);\n\n  /* 40% opacity */\n  --darkBlue200-opacity40: rgba(181, 185, 204, 0.4);\n  --darkBlue500-opacity40: rgba(33, 44, 101, 0.4);\n\n  /* 50% opacity */\n  /* White */\n  --white-opacity50: rgba(255, 255, 255, 0.5);\n\n  /* Gray */\n  --gray25-opacity50: rgba(249, 250, 251, 0.5);\n  --gray900-opacity50: rgba(18, 25, 38, 0.5);\n  --gray950-opacity50: rgba(13, 18, 28, 0.5);\n\n  /* ------------------------------------------Secondary Color------------------------------------------- */\n  /* blueLight color palete */\n  --lightBlue-25: #f5fbff;\n  --lightBlue-50: #f0f9ff;\n  --lightBlue-100: #e0f2fe;\n  --lightBlue-200: #b9e6fe;\n  --lightBlue-300: #7cd4fd;\n  --lightBlue-400: #7cd4fd;\n  --lightBlue-500: #0ba5ec;\n  --lightBlue-600: #0086c9;\n  --lightBlue-700: #026aa2;\n  --lightBlue-800: #065986;\n  --lightBlue-900: #0b4a6f;\n  --lightBlue-950: #062c41;\n\n  /* blue color palette */\n  --blue-25: #ecf5fe;\n  --blue-50: #e4f0fc;\n  --blue-100: #c8e0f9;\n  --blue-200: #9ac7f4;\n  --blue-300: #6aa9e7;\n  --blue-400: #378fe6;\n  --blue-500: #075db2;\n  --blue-600: #064e94;\n  --blue-700: #053e77;\n  --blue-800: #042f59;\n  --blue-900: #022445;\n  --blue-950: #021d37;\n\n  /* Purple color palete */\n  --purple-25: #fafaff;\n  --purple-50: #f4f3ff;\n  --purple-100: #ebe9fe;\n  --purple-200: #d9d6fe;\n  --purple-300: #bdb4fe;\n  --purple-400: #9b8afb;\n  --purple-500: #7a5af8;\n  --purple-600: #6938ef;\n  --purple-700: #5925dc;\n  --purple-800: #4a1fb8;\n  --purple-900: #3e1c96;\n  --purple-950: #27115f;\n\n  /* pink color palette */\n  --pink-25: #fef6fb;\n  --pink-50: #fdf2fa;\n  --pink-100: #fce7f6;\n  --pink-200: #fcceee;\n  --pink-300: #faa7e0;\n  --pink-400: #f670c7;\n  --pink-500: #ee46bc;\n  --pink-600: #dd2590;\n  --pink-700: #c11574;\n  --pink-800: #9e165f;\n  --pink-900: #851651;\n  --pink-950: #4e0d30;\n\n  /* -------------------------------------------------Token---------------------------------------------- */\n  /* Light-theme defaults so external hosts still resolve key tokens when data-theme is not set. */\n  --color-text-bold: var(--gray-800);\n  --color-text: var(--gray-600);\n  --color-text-subtle: var(--gray-500);\n  --color-text-disabled: var(--gray-400);\n  --color-text-inverse: var(--base-white);\n\n  --color-icon-bold: var(--gray-800);\n  --color-icon: var(--gray-600);\n  --color-icon-subtle: var(--gray-500);\n  --color-icon-disabled: var(--gray-400);\n  --color-icon-inverse: var(--base-white);\n\n  --color-border-bold: var(--gray-500);\n  --color-border: var(--gray-400);\n  --color-border-subtle: var(--gray-300);\n  --color-border-subtler: var(--gray-200);\n  --color-border-disabled: var(--gray-200);\n  --color-border-input: var(--gray-300);\n  --color-border-focus: var(--gray-400);\n\n  --color-background: var(--base-white);\n  --color-background-card-bold: var(--gray-100);\n  --color-background-card: var(--base-white);\n  --color-background-input: var(--gray-400);\n  --color-background-disabled: var(--gray-50);\n  --color-background-btn-disabled: var(--gray-100);\n  --color-background-selected: var(--blue-500);\n\n  --color-link: var(--blue-500);\n  --color-link-pressed: var(--blue-600);\n  --color-link-visited: var(--lightBlue-600);\n\n  /* -----------Text Color----------- */\n\n  [data-theme='light'] {\n    --color-text-bold: var(--gray-800);\n  }\n\n  [data-theme='dark'] {\n    --color-text-bold: var(--gray-100);\n  }\n\n  [data-theme='light'] {\n    --color-text: var(--gray-600);\n  }\n\n  [data-theme='dark'] {\n    --color-text: var(--gray-300);\n  }\n\n  [data-theme='light'] {\n    --color-text-subtle: var(--gray-500);\n  }\n\n  [data-theme='dark'] {\n    --color-text-subtle: var(--gray-400);\n  }\n\n  [data-theme='light'] {\n    --color-text-disabled: var(--gray-400);\n  }\n\n  [data-theme='dark'] {\n    --color-text-disabled: var(--gray-500);\n  }\n\n  [data-theme='light'] {\n    --color-text-inverse: var(--base-white);\n  }\n\n  [data-theme='dark'] {\n    --color-text-inverse: var(--base-black);\n  }\n\n  [data-theme='light'] {\n    --color-text-brandDarkBlue: var(--brandDarkBlue-500);\n  }\n\n  [data-theme='dark'] {\n    --color-text-brandDarkBlue: var(--brandDarkBlue-100);\n  }\n\n  [data-theme='light'] {\n    --color-text-brandRed: var(--brandRed-500);\n  }\n\n  [data-theme='dark'] {\n    --color-text-brandRed: var(--brandRed-300);\n  }\n\n  [data-theme='light'] {\n    --color-text-selected: var(--blue-500);\n  }\n\n  [data-theme='dark'] {\n    --color-text-selected: var(--blue-300);\n  }\n\n  [data-theme='light'] {\n    --color-text-danger-bold: var(--brandRed-800);\n  }\n\n  [data-theme='dark'] {\n    --color-text-danger-bold: var(--brandRed-100);\n  }\n\n  [data-theme='light'] {\n    --color-text-danger: var(--brandRed-700);\n  }\n\n  [data-theme='dark'] {\n    --color-text-danger: var(--brandRed-200);\n  }\n\n  [data-theme='light'] {\n    --color-text-danger-subtle: var(--brandRed-600);\n  }\n\n  [data-theme='dark'] {\n    --color-text-danger-subtle: var(--brandRed-300);\n  }\n\n  [data-theme='light'] {\n    --color-text-danger-inverse: var(--base-white);\n  }\n\n  [data-theme='dark'] {\n    --color-text-danger-inverse: var(--brandRed-950);\n  }\n\n  [data-theme='light'] {\n    --color-text-warning-bold: var(--yellow-800);\n  }\n\n  [data-theme='dark'] {\n    --color-text-warning-bold: var(--yellow-100);\n  }\n\n  [data-theme='light'] {\n    --color-text-warning: var(--yellow-600);\n  }\n\n  [data-theme='dark'] {\n    --color-text-warning: var(--yellow-300);\n  }\n\n  [data-theme='light'] {\n    --color-text-warning-subtle: var(--yellow-500);\n  }\n\n  [data-theme='dark'] {\n    --color-text-warning-subtle: var(--yellow-400);\n  }\n\n  [data-theme='light'] {\n    --color-text-success-bold: var(--green-800);\n  }\n\n  [data-theme='dark'] {\n    --color-text-success-bold: var(--green-100);\n  }\n\n  [data-theme='light'] {\n    --color-text-success: var(--green-600);\n  }\n\n  [data-theme='dark'] {\n    --color-text-success: var(--green-300);\n  }\n\n  [data-theme='light'] {\n    --color-text-success-subtle: var(--green-600);\n  }\n\n  [data-theme='dark'] {\n    --color-text-success-subtle: var(--green-300);\n  }\n\n  [data-theme='light'] {\n    --color-text-discovery-bold: var(--lightBlue-800);\n  }\n\n  [data-theme='dark'] {\n    --color-text-discovery-bold: var(--lightBlue-100);\n  }\n\n  [data-theme='light'] {\n    --color-text-discovery: var(--lightBlue-800);\n  }\n\n  [data-theme='dark'] {\n    --color-text-discovery: var(--lightBlue-100);\n  }\n\n  [data-theme='light'] {\n    --color-text-discovery-subtle: var(--lightBlue-400);\n  }\n\n  [data-theme='dark'] {\n    --color-text-discovery-subtle: var(--lightBlue-100);\n  }\n\n  [data-theme='light'] {\n    --color-text-information-bold: var(--blue-800);\n  }\n\n  [data-theme='dark'] {\n    --color-text-information-bold: var(--blue-100);\n  }\n\n  [data-theme='light'] {\n    --color-text-information: var(--blue-600);\n  }\n\n  [data-theme='dark'] {\n    --color-text-information: var(--blue-300);\n  }\n\n  [data-theme='light'] {\n    --color-text-information-subtle: var(--blue-500);\n  }\n\n  [data-theme='dark'] {\n    --color-text-information-subtle: var(--blue-400);\n  }\n\n  [data-theme='light'] {\n    --color-text-purple-bold: var(--purple-800);\n  }\n\n  [data-theme='dark'] {\n    --color-text-purple-bold: var(--purple-100);\n  }\n\n  [data-theme='light'] {\n    --color-text-purple: var(--purple-600);\n  }\n\n  [data-theme='dark'] {\n    --color-text-purple: var(--purple-300);\n  }\n\n  [data-theme='light'] {\n    --color-text-purple-subtle: var(--purple-500);\n  }\n\n  [data-theme='dark'] {\n    --color-text-purple-subtle: var(--purple-400);\n  }\n\n  [data-theme='light'] {\n    --color-text-pink-bold: var(--pink-800);\n  }\n\n  [data-theme='dark'] {\n    --color-text-pink-bold: var(--pink-100);\n  }\n\n  [data-theme='light'] {\n    --color-text-pink: var(--pink-600);\n  }\n\n  [data-theme='dark'] {\n    --color-text-pink: var(--pink-300);\n  }\n\n  [data-theme='light'] {\n    --color-text-pink-subtle: var(--pink-500);\n  }\n\n  [data-theme='dark'] {\n    --color-text-pink-subtle: var(--pink-400);\n  }\n\n  /* --------------Link color--------------- */\n\n  [data-theme='light'] {\n    --color-link: var(--blue-500);\n  }\n\n  [data-theme='dark'] {\n    --color-link: var(--blue-300);\n  }\n\n  [data-theme='light'] {\n    --color-link-pressed: var(--blue-600);\n  }\n\n  [data-theme='dark'] {\n    --color-link-pressed: var(--blue-600);\n  }\n\n  [data-theme='light'] {\n    --color-link-visited: var(--lightBlue-600);\n  }\n\n  [data-theme='dark'] {\n    --color-link-visited: var(--lightBlue-300);\n  }\n\n  /* --------------Icon color--------------- */\n\n  [data-theme='light'] {\n    --color-icon-bold: var(--gray-800);\n  }\n\n  [data-theme='dark'] {\n    --color-icon-bold: var(--gray-100);\n  }\n\n  [data-theme='light'] {\n    --color-icon: var(--gray-600);\n  }\n\n  [data-theme='dark'] {\n    --color-icon: var(--gray-300);\n  }\n\n  [data-theme='light'] {\n    --color-icon-subtle: var(--gray-500);\n  }\n\n  [data-theme='dark'] {\n    --color-icon-subtle: var(--gray-400);\n  }\n\n  [data-theme='light'] {\n    --color-icon-disabled: var(--gray-400);\n  }\n\n  [data-theme='dark'] {\n    --color-icon-disabled: var(--gray-500);\n  }\n\n  [data-theme='light'] {\n    --color-icon-inverse: var(--base-white);\n  }\n\n  [data-theme='dark'] {\n    --color-icon-inverse: var(--gray-800);\n  }\n\n  [data-theme='light'] {\n    --color-icon-brandDarkBlue: var(--brandDarkBlue-500);\n  }\n\n  [data-theme='dark'] {\n    --color-icon-brandDarkBlue: var(--brandDarkBlue-200);\n  }\n\n  [data-theme='light'] {\n    --color-icon-brandRed: var(--brandRed-500);\n  }\n\n  [data-theme='dark'] {\n    --color-icon-brandRed: var(--brandRed-300);\n  }\n\n  [data-theme='light'] {\n    --color-icon-selected: var(--blue-500);\n  }\n\n  [data-theme='dark'] {\n    --color-icon-selected: var(--blue-300);\n  }\n\n  [data-theme='light'] {\n    --color-icon-danger-bold: var(--brandRed-800);\n  }\n\n  [data-theme='dark'] {\n    --color-icon-danger-bold: var(--brandRed-100);\n  }\n\n  [data-theme='light'] {\n    --color-icon-danger: var(--brandRed-700);\n  }\n\n  [data-theme='dark'] {\n    --color-icon-danger: var(--brandRed-200);\n  }\n\n  [data-theme='light'] {\n    --color-icon-danger-inverse: var(--base-white);\n  }\n\n  [data-theme='dark'] {\n    --color-icon-danger-inverse: var(--brandRed-950);\n  }\n\n  [data-theme='light'] {\n    --color-icon-warning-bold: var(--yellow-800);\n  }\n\n  [data-theme='dark'] {\n    --color-icon-warning-bold: var(--yellow-100);\n  }\n\n  [data-theme='light'] {\n    --color-icon-warning: var(--yellow-600);\n  }\n\n  [data-theme='dark'] {\n    --color-icon-warning: var(--yellow-300);\n  }\n\n  [data-theme='light'] {\n    --color-icon-success-bold: var(--green-800);\n  }\n\n  [data-theme='dark'] {\n    --color-icon-success-bold: var(--green-100);\n  }\n\n  [data-theme='light'] {\n    --color-icon-success: var(--green-600);\n  }\n\n  [data-theme='dark'] {\n    --color-icon-success: var(--green-300);\n  }\n\n  [data-theme='light'] {\n    --color-icon-discovery-bold: var(--lightBlue-800);\n  }\n\n  [data-theme='dark'] {\n    --color-icon-discovery-bold: var(--lightBlue-100);\n  }\n\n  [data-theme='light'] {\n    --color-icon-discovery: var(--lightBlue-600);\n  }\n\n  [data-theme='dark'] {\n    --color-icon-discovery: var(--lightBlue-300);\n  }\n\n  [data-theme='light'] {\n    --color-icon-information-bold: var(--blue-800);\n  }\n\n  [data-theme='dark'] {\n    --color-icon-information-bold: var(--blue-100);\n  }\n\n  [data-theme='light'] {\n    --color-icon-information: var(--blue-600);\n  }\n\n  [data-theme='dark'] {\n    --color-icon-information: var(--blue-300);\n  }\n\n  [data-theme='light'] {\n    --color-icon-purple-bold: var(--purple-800);\n  }\n\n  [data-theme='dark'] {\n    --color-icon-purple-bold: var(--purple-100);\n  }\n\n  [data-theme='light'] {\n    --color-icon-purple: var(--purple-600);\n  }\n\n  [data-theme='dark'] {\n    --color-icon-purple: var(--purple-300);\n  }\n\n  [data-theme='light'] {\n    --color-icon-pink-bold: var(--pink-800);\n  }\n\n  [data-theme='dark'] {\n    --color-icon-pink-bold: var(--pink-100);\n  }\n\n  [data-theme='light'] {\n    --color-icon-pink: var(--pink-600);\n  }\n\n  [data-theme='dark'] {\n    --color-icon-pink: var(--pink-300);\n  }\n\n  /* ----------------Border Color --------------- */\n\n  [data-theme='light'] {\n    --color-border-bold: var(--gray-500);\n  }\n\n  [data-theme='dark'] {\n    --color-border-bold: var(--gray-400);\n  }\n\n  [data-theme='light'] {\n    --color-border: var(--gray-400);\n  }\n\n  [data-theme='dark'] {\n    --color-border: var(--gray-500);\n  }\n\n  [data-theme='light'] {\n    --color-border-subtle: var(--gray-300);\n  }\n\n  [data-theme='dark'] {\n    --color-border-subtle: var(--gray-700);\n  }\n\n  [data-theme='light'] {\n    --color-border-subtler: var(--gray-200);\n  }\n\n  [data-theme='dark'] {\n    --color-border-subtler: var(--gray-800);\n  }\n\n  [data-theme='light'] {\n    --color-border-disabled: var(--gray-200);\n  }\n\n  [data-theme='dark'] {\n    --color-border-disabled: var(--gray-700);\n  }\n\n  [data-theme='light'] {\n    --color-border-inverse: var(--base-white);\n  }\n\n  [data-theme='dark'] {\n    --color-border-inverse: var(--gray-800);\n  }\n\n  [data-theme='light'] {\n    --color-border-input: var(--gray-300);\n  }\n\n  [data-theme='dark'] {\n    --color-border-input: var(--gray-600);\n  }\n\n  [data-theme='light'] {\n    --color-border-focus: var(--gray-400);\n  }\n\n  [data-theme='dark'] {\n    --color-border-focus: var(--blue-200);\n  }\n\n  [data-theme='light'] {\n    --color-border-selected: var(--blue-500);\n  }\n\n  [data-theme='dark'] {\n    --color-border-selected: var(--blue-300);\n  }\n\n  [data-theme='light'] {\n    --color-border-brandDarkBlue: var(--brandDarkBlue-500);\n  }\n\n  [data-theme='dark'] {\n    --color-border-brandDarkBlue: var(--brandDarkBlue-200);\n  }\n\n  [data-theme='light'] {\n    --color-border-brandRed: var(--brandRed-500);\n  }\n\n  [data-theme='dark'] {\n    --color-border-brandRed: var(--brandRed-300);\n  }\n\n  [data-theme='light'] {\n    --color-border-danger-bold: var(--brandRed-800);\n  }\n\n  [data-theme='dark'] {\n    --color-border-danger-bold: var(--brandRed-100);\n  }\n\n  [data-theme='light'] {\n    --color-border-danger: var(--brandRed-700);\n  }\n\n  [data-theme='dark'] {\n    --color-border-danger: var(--brandRed-200);\n  }\n\n  [data-theme='light'] {\n    --color-border-danger-subtle: var(--brandRed-200);\n  }\n\n  [data-theme='dark'] {\n    --color-border-danger-subtle: var(--brandRed-800);\n  }\n\n  [data-theme='light'] {\n    --color-border-danger-subtler: var(--brandRed-100);\n  }\n\n  [data-theme='dark'] {\n    --color-border-danger-subtler: var(--brandRed-900);\n  }\n\n  [data-theme='light'] {\n    --color-border-warning-bold: var(--yellow-800);\n  }\n\n  [data-theme='dark'] {\n    --color-border-warning-bold: var(--yellow-100);\n  }\n\n  [data-theme='light'] {\n    --color-border-warning: var(--yellow-600);\n  }\n\n  [data-theme='dark'] {\n    --color-border-warning: var(--yellow-300);\n  }\n\n  [data-theme='light'] {\n    --color-border-warning-subtle: var(--yellow-200);\n  }\n\n  [data-theme='dark'] {\n    --color-border-warning-subtle: var(--yellow-800);\n  }\n\n  [data-theme='light'] {\n    --color-border-warning-subtler: var(--yellow-100);\n  }\n\n  [data-theme='dark'] {\n    --color-border-warning-subtler: var(--yellow-900);\n  }\n\n  [data-theme='light'] {\n    --color-border-success-bold: var(--green-800);\n  }\n\n  [data-theme='dark'] {\n    --color-border-success-bold: var(--green-100);\n  }\n\n  [data-theme='light'] {\n    --color-border-success: var(--green-600);\n  }\n\n  [data-theme='dark'] {\n    --color-border-success: var(--green-300);\n  }\n\n  [data-theme='light'] {\n    --color-border-success-subtle: var(--green-200);\n  }\n\n  [data-theme='dark'] {\n    --color-border-success-subtle: var(--green-800);\n  }\n\n  [data-theme='light'] {\n    --color-border-success-subtler: var(--green-100);\n  }\n\n  [data-theme='dark'] {\n    --color-border-success-subtler: var(--green-900);\n  }\n\n  [data-theme='light'] {\n    --color-border-discovery-bold: var(--lightBlue-800);\n  }\n\n  [data-theme='dark'] {\n    --color-border-discovery-bold: var(--lightBlue-100);\n  }\n\n  [data-theme='light'] {\n    --color-border-discovery: var(--lightBlue-600);\n  }\n\n  [data-theme='dark'] {\n    --color-border-discovery: var(--lightBlue-300);\n  }\n\n  [data-theme='light'] {\n    --color-border-discovery-subtle: var(--lightBlue-200);\n  }\n\n  [data-theme='dark'] {\n    --color-border-discovery-subtle: var(--lightBlue-800);\n  }\n\n  [data-theme='light'] {\n    --color-border-discovery-subtler: var(--lightBlue-100);\n  }\n\n  [data-theme='dark'] {\n    --color-border-discovery-subtler: var(--lightBlue-900);\n  }\n\n  [data-theme='light'] {\n    --color-border-information-bold: var(--blue-800);\n  }\n\n  [data-theme='dark'] {\n    --color-border-information-bold: var(--blue-100);\n  }\n\n  [data-theme='light'] {\n    --color-border-information: var(--blue-600);\n  }\n\n  [data-theme='dark'] {\n    --color-border-information: var(--blue-300);\n  }\n\n  [data-theme='light'] {\n    --color-border-information-subtle: var(--blue-200);\n  }\n\n  [data-theme='dark'] {\n    --color-border-information-subtle: var(--blue-800);\n  }\n\n  [data-theme='light'] {\n    --color-border-information-subtler: var(--blue-100);\n  }\n\n  [data-theme='dark'] {\n    --color-border-information-subtler: var(--blue-900);\n  }\n\n  [data-theme='light'] {\n    --color-border-purple-bold: var(--purple-800);\n  }\n\n  [data-theme='dark'] {\n    --color-border-purple-bold: var(--purple-100);\n  }\n\n  [data-theme='light'] {\n    --color-border-purple: var(--purple-600);\n  }\n\n  [data-theme='dark'] {\n    --color-border-purple: var(--purple-300);\n  }\n\n  [data-theme='light'] {\n    --color-border-purple-subtle: var(--purple-200);\n  }\n\n  [data-theme='dark'] {\n    --color-border-purple-subtle: var(--purple-800);\n  }\n\n  [data-theme='light'] {\n    --color-border-purple-subtler: var(--purple-100);\n  }\n\n  [data-theme='dark'] {\n    --color-border-purple-subtler: var(--purple-900);\n  }\n\n  [data-theme='light'] {\n    --color-border-pink-bold: var(--pink-800);\n  }\n\n  [data-theme='dark'] {\n    --color-border-pink-bold: var(--pink-100);\n  }\n\n  [data-theme='light'] {\n    --color-border-pink: var(--pink-600);\n  }\n\n  [data-theme='dark'] {\n    --color-border-pink: var(--pink-300);\n  }\n\n  [data-theme='light'] {\n    --color-border-pink-subtle: var(--pink-200);\n  }\n\n  [data-theme='dark'] {\n    --color-border-pink-subtle: var(--pink-800);\n  }\n\n  [data-theme='light'] {\n    --color-border-pink-subtler: var(--pink-100);\n  }\n\n  [data-theme='dark'] {\n    --color-border-pink-subtler: var(--pink-900);\n  }\n\n  /* Emmanuel Kadiri starts from background color */\n\n  /* ----------------Background Color --------------- */\n\n  [data-theme='light'] {\n    --color-background-card-bolder: var(--gray-100);\n  }\n\n  [data-theme='dark'] {\n    --color-background-card-bolder: var(--gray-800);\n  }\n\n  [data-theme='light'] {\n    --color-background-card: var(--base-white);\n  }\n\n  [data-theme='dark'] {\n    --color-background-card: var(--gray-900);\n  }\n\n  [data-theme='light'] {\n    --color-background-input: var(--gray-400);\n  }\n\n  [data-theme='dark'] {\n    --color-background-input: var(--gray-950);\n  }\n\n  [data-theme='light'] {\n    --color-background-disabled: var(--gray-50);\n  }\n\n  [data-theme='dark'] {\n    --color-background-disabled: var(--gray-800);\n  }\n\n  [data-theme='light'] {\n    --color-background-btn-disabled: var(--gray-100);\n  }\n\n  [data-theme='dark'] {\n    --color-background-btn-disabled: var(--gray-700);\n  }\n\n  [data-theme='light'] {\n    --color-background-selected: var(--blue-500);\n  }\n\n  [data-theme='dark'] {\n    --color-background-selected: var(--blue-300);\n  }\n\n  [data-theme='light'] {\n    --color-background-brandDarkblue: var(--brandDarkBlue-500);\n  }\n\n  [data-theme='dark'] {\n    --color-background-brandDarkblue: var(--brandDarkBlue-200);\n  }\n\n  [data-theme='light'] {\n    --color-background-brandRed: var(--brandRed-500);\n  }\n\n  [data-theme='dark'] {\n    --color-background-brandRed: var(--brandRed-300);\n  }\n\n  [data-theme='light'] {\n    --color-background-brandRed-hover: var(--brandRed-600);\n  }\n\n  [data-theme='dark'] {\n    --color-background-brandRed-hover: var(--brandRed-200);\n  }\n\n  [data-theme='light'] {\n    --color-background-brandRed-pressed: var(--brandRed-700);\n  }\n\n  [data-theme='dark'] {\n    --color-background-brandRed-pressed: var(--brandRed-100);\n  }\n\n  [data-theme='light'] {\n    --color-background-gray-bold: var(--gray-400);\n  }\n\n  [data-theme='dark'] {\n    --color-background-gray-bold: var(--gray-500);\n  }\n\n  [data-theme='light'] {\n    --color-background-gray: var(--gray-300);\n  }\n\n  [data-theme='dark'] {\n    --color-background-gray: var(--gray-600);\n  }\n\n  [data-theme='light'] {\n    --color-background-gray-subtle: var(--gray-200);\n  }\n\n  [data-theme='dark'] {\n    --color-background-gray-subtle: var(--gray-700);\n  }\n\n  [data-theme='light'] {\n    --color-background-gray-subtler: var(--gray-100);\n  }\n\n  [data-theme='dark'] {\n    --color-background-gray-subtler: var(--gray-800);\n  }\n\n  [data-theme='light'] {\n    --color-background-gray-subtlest: var(--gray-50);\n  }\n\n  [data-theme='dark'] {\n    --color-background-gray-subtlest: var(--gray-950);\n  }\n\n  [data-theme='light'] {\n    --color-background-danger-bold: var(--brandRed-800);\n  }\n\n  [data-theme='dark'] {\n    --color-background-danger-bold: var(--brandRed-100);\n  }\n\n  [data-theme='light'] {\n    --color-background-danger: var(--brandRed-700);\n  }\n\n  [data-theme='dark'] {\n    --color-background-danger: var(--brandRed-200);\n  }\n\n  [data-theme='light'] {\n    --color-background-danger-subtle: var(--brandRed-200);\n  }\n\n  [data-theme='dark'] {\n    --color-background-danger-subtle: var(--brandRed-800);\n  }\n\n  [data-theme='light'] {\n    --color-background-danger-subtler: var(--brandRed-100);\n  }\n\n  [data-theme='dark'] {\n    --color-background-danger-subtler: var(--brandRed-900);\n  }\n\n  [data-theme='light'] {\n    --color-background-danger-subtlest: var(--brandRed-50);\n  }\n\n  [data-theme='dark'] {\n    --color-background-danger-subtlest: var(--brandRed-950);\n  }\n\n  [data-theme='light'] {\n    --color-background-warning-bold: var(--yellow-800);\n  }\n\n  [data-theme='dark'] {\n    --color-background-warning-bold: var(--yellow-100);\n  }\n\n  [data-theme='light'] {\n    --color-background-warning: var(--yellow-600);\n  }\n\n  [data-theme='dark'] {\n    --color-background-warning: var(--yellow-200);\n  }\n\n  [data-theme='light'] {\n    --color-background-warning-subtle: var(--yellow-200);\n  }\n\n  [data-theme='dark'] {\n    --color-background-warning-subtle: var(--yellow-800);\n  }\n\n  [data-theme='light'] {\n    --color-background-warning-subtler: var(--yellow-100);\n  }\n\n  [data-theme='dark'] {\n    --color-background-warning-subtler: var(--yellow-900);\n  }\n\n  [data-theme='light'] {\n    --color-background-warning-subtlest: var(--yellow-50);\n  }\n\n  [data-theme='dark'] {\n    --color-background-warning-subtlest: var(--yellow-950);\n  }\n\n  [data-theme='light'] {\n    --color-background-success-bold: var(--green-800);\n  }\n\n  [data-theme='dark'] {\n    --color-background-success-bold: var(--green-100);\n  }\n\n  [data-theme='light'] {\n    --color-background-success: var(--green-600);\n  }\n\n  [data-theme='dark'] {\n    --color-background-success: var(--green-200);\n  }\n\n  [data-theme='light'] {\n    --color-background-success-subtle: var(--green-200);\n  }\n\n  [data-theme='dark'] {\n    --color-background-success-subtle: var(--green-800);\n  }\n\n  [data-theme='light'] {\n    --color-background-success-subtler: var(--green-100);\n  }\n\n  [data-theme='dark'] {\n    --color-background-success-subtler: var(--green-900);\n  }\n\n  [data-theme='light'] {\n    --color-background-success-subtlest: var(--green-50);\n  }\n\n  [data-theme='dark'] {\n    --color-background-success-subtlest: var(--green-950);\n  }\n\n  [data-theme='light'] {\n    --color-background-discovery-bold: var(--lightBlue-800);\n  }\n\n  [data-theme='dark'] {\n    --color-background-discovery-bold: var(--lightBlue-100);\n  }\n\n  [data-theme='light'] {\n    --color-background-discovery: var(--lightBlue-600);\n  }\n\n  [data-theme='dark'] {\n    --color-background-discovery: var(--lightBlue-200);\n  }\n\n  [data-theme='light'] {\n    --color-background-discovery-subtle: var(--lightBlue-200);\n  }\n\n  [data-theme='dark'] {\n    --color-background-discovery-subtle: var(--lightBlue-800);\n  }\n\n  [data-theme='light'] {\n    --color-background-discovery-subtler: var(--lightBlue-100);\n  }\n\n  [data-theme='dark'] {\n    --color-background-discovery-subtler: var(--lightBlue-900);\n  }\n\n  [data-theme='light'] {\n    --color-background-discovery-subtlest: var(--lightBlue-50);\n  }\n\n  [data-theme='dark'] {\n    --color-background-discovery-subtlest: var(--lightBlue-950);\n  }\n\n  [data-theme='light'] {\n    --color-background-information-bold: var(--blue-800);\n  }\n\n  [data-theme='dark'] {\n    --color-background-information-bold: var(--blue-100);\n  }\n\n  [data-theme='light'] {\n    --color-background-information: var(--blue-600);\n  }\n\n  [data-theme='dark'] {\n    --color-background-information: var(--blue-200);\n  }\n\n  [data-theme='light'] {\n    --color-background-information-subtle: var(--blue-200);\n  }\n\n  [data-theme='dark'] {\n    --color-background-information-subtle: var(--blue-800);\n  }\n\n  [data-theme='light'] {\n    --color-background-information-subtler: var(--blue-100);\n  }\n\n  [data-theme='dark'] {\n    --color-background-information-subtler: var(--blue-900);\n  }\n\n  [data-theme='light'] {\n    --color-background-information-subtlest: var(--blue-50);\n  }\n\n  [data-theme='dark'] {\n    --color-background-information-subtlest: var(--blue-950);\n  }\n\n  [data-theme='light'] {\n    --color-background-purple-bold: var(--purple-800);\n  }\n\n  [data-theme='dark'] {\n    --color-background-purple-bold: var(--blue-100);\n  }\n\n  [data-theme='light'] {\n    --color-background-purple: var(--purple-600);\n  }\n\n  [data-theme='dark'] {\n    --color-background-purple: var(--blue-200);\n  }\n\n  [data-theme='light'] {\n    --color-background-purple-subtle: var(--purple-200);\n  }\n\n  [data-theme='dark'] {\n    --color-background-purple-subtle: var(--purple-800);\n  }\n\n  [data-theme='light'] {\n    --color-background-purple-subtler: var(--purple-100);\n  }\n\n  [data-theme='dark'] {\n    --color-background-purple-subtler: var(--purple-900);\n  }\n\n  [data-theme='light'] {\n    --color-background-purple-subtlest: var(--purple-50);\n  }\n\n  [data-theme='dark'] {\n    --color-background-purple-subtlest: var(--purple-950);\n  }\n\n  [data-theme='light'] {\n    --color-background-pink-bold: var(--pink-800);\n  }\n\n  [data-theme='dark'] {\n    --color-background-pink-bold: var(--pink-100);\n  }\n\n  [data-theme='light'] {\n    --color-background-pink: var(--pink-600);\n  }\n\n  [data-theme='dark'] {\n    --color-background-pink: var(--pink-200);\n  }\n\n  [data-theme='light'] {\n    --color-background-pink-subtle: var(--pink-200);\n  }\n\n  [data-theme='dark'] {\n    --color-background-pink-subtle: var(--pink-800);\n  }\n\n  [data-theme='light'] {\n    --color-background-pink-subtler: var(--pink-100);\n  }\n\n  [data-theme='dark'] {\n    --color-background-pink-subtler: var(--pink-900);\n  }\n\n  [data-theme='light'] {\n    --color-background-pink-subtlest: var(--purple-50);\n  }\n\n  [data-theme='dark'] {\n    --color-background-pink-subtlest: var(--pink-950);\n  }\n\n  /* ----------------Blanket Color --------------- */\n  [data-theme='light'] {\n    --color-blanket: var(--darkBlue500-opacity20);\n  }\n\n  [data-theme='dark'] {\n    --color-blanket: var(--darkBlue200-opacity20);\n  }\n\n  [data-theme='light'] {\n    --color-blanket-subtle: var(--darkBlue500-opacity30);\n  }\n\n  [data-theme='dark'] {\n    --color-blanket-subtle: var(--darkBlue200-opacity30);\n  }\n\n  [data-theme='light'] {\n    --color-blanket-subtler: var(--darkBlue500-opacity40);\n  }\n\n  [data-theme='dark'] {\n    --color-blanket-subtler: var(--darkBlue200-opacity40);\n  }\n\n  /* ----------------Skeleton Color --------------- */\n  [data-theme='light'] {\n    --color-skeleton: var(--gray-200);\n  }\n\n  [data-theme='dark'] {\n    --color-skeleton: var(--gray-800);\n  }\n\n  [data-theme='light'] {\n    --color-skeleton-bold: var(--gray-300);\n  }\n\n  [data-theme='dark'] {\n    --color-skeleton-bold: var(--gray-700);\n  }\n\n  /* ----------------Surface Color --------------- */\n  [data-theme='light'] {\n    --color-surface-bold: var(--gray-50);\n  }\n\n  [data-theme='dark'] {\n    --color-surface-bold: var(--gray-950);\n  }\n\n  [data-theme='light'] {\n    --color-surface: var(--base-white);\n  }\n\n  [data-theme='dark'] {\n    --color-surface: var(--gray-900);\n  }\n\n  [data-theme='light'] {\n    --color-surface-hovered: var(--gray-100);\n  }\n\n  [data-theme='dark'] {\n    --color-surface-hovered: var(--gray-800);\n  }\n\n  [data-theme='light'] {\n    --color-surface-pressed: var(--gray-200);\n  }\n\n  [data-theme='dark'] {\n    --color-surface-pressed: var(--gray-700);\n  }\n\n  /* ----------------Transparent Color --------------- */\n  [data-theme='light'] {\n    --color-surface-transparent50: var(--white-opacity50);\n  }\n\n  [data-theme='dark'] {\n    --color-surface-transparent50: var(--gray900-opacity50);\n  }\n\n  [data-theme='light'] {\n    --color-surface-transparent20: var(--white-opacity20);\n  }\n\n  [data-theme='dark'] {\n    --color-surface-transparent20: var(--gray900-opacity20);\n  }\n\n  [data-theme='light'] {\n    --color-surface-transparent-full: var(--white-opacity0);\n  }\n\n  [data-theme='dark'] {\n    --color-surface-transparent-full: var(--gray900-opacity0);\n  }\n\n  [data-theme='light'] {\n    --color-surface-bold-transparent50: var(--gray25-opacity50);\n  }\n\n  [data-theme='dark'] {\n    --color-surface-bold-transparent50: var(--gray950-opacity50);\n  }\n\n  [data-theme='light'] {\n    --color-surface-bold-transparent20: var(--gray25-opacity20);\n  }\n\n  [data-theme='dark'] {\n    --color-surface-bold-transparent20: var(--gray950-opacity20);\n  }\n\n  [data-theme='light'] {\n    --color-surface-bold-transparent-full: var(--gray25-opacity0);\n  }\n\n  [data-theme='dark'] {\n    --color-surface-bold-transparent-full: var(--gray950-opacity0);\n  }\n}\n/* -----------------Shadow and Blur----------------- */\n:root {\n  --shadow-xs: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);\n  --shadow-sm: 0px 1px 3px 0px rgba(16, 24, 40, 0.1), 0px 1px 2px 0px rgba(16, 24, 40, 0.06);\n  --shadow-md: 0px 4px 8px -2px rgba(16, 24, 40, 0.1), 0px 2px 4px -2px rgba(16, 24, 40, 0.06);\n  --shadow-lg: 0px 12px 16px -4px rgba(16, 24, 40, 0.08), 0px 4px 6px -2px rgba(16, 24, 40, 0.03);\n  --shadow-xl: 0px 20px 24px -4px rgba(16, 24, 40, 0.08), 0px 8px 8px -4px rgba(16, 24, 40, 0.03);\n  --shadow-2xl: 0px 24px 48px -12px rgba(16, 24, 40, 0.18);\n  --shadow-3xl: 0px 32px 64px -12px rgba(16, 24, 40, 0.14);\n\n  --blur-sm: blur(4px);\n  --blur-md: blur(8px);\n  --blur-lg: blur(12px);\n  --blur-xl: blur(20px);\n}\n.shadow-xs {\n  box-shadow: var(--shadow-xs);\n}\n.shadow-sm {\n  box-shadow: var(--shadow-sm);\n}\n.shadow-md {\n  box-shadow: var(--shadow-md);\n}\n.shadow-lg {\n  box-shadow: var(--shadow-lg);\n}\n.shadow-xl {\n  box-shadow: var(--shadow-xl);\n}\n.shadow-2xl {\n  box-shadow: var(--shadow-2xl);\n}\n.shadow-3xl {\n  box-shadow: var(--shadow-3xl);\n}\n.blur-sm {\n  backdrop-filter: var(--blur-sm);\n}\n.blur-md {\n  backdrop-filter: var(--blur-md);\n}\n.blur-lg {\n  backdrop-filter: var(--blur-lg);\n}\n.blur-xl {\n  backdrop-filter: var(--blur-xl);\n}\n/* -----------------Gradients----------------- */\n:root {\n  /* Gray Gradients */\n  /* --gray-gradient-600: linear-gradient(); */\n  --gradient-gray-600-to-500-90d: linear-gradient(90deg, var(--gray-600), var(--gray-500));\n  --gradient-gray-700-to-600-45d: linear-gradient(45deg, var(--gray-700), var(--gray-600));\n  --gradient-gray-800-to-600-45d: linear-gradient(45deg, var(--gray-800), var(--gray-600));\n  --gradient-gray-800-to-600-90d: linear-gradient(90deg, var(--gray-800), var(--gray-600));\n  --gradient-gray-800-to-700265-d: linear-gradient(26.5deg, var(--gray-800), var(--gray-700));\n  --gradient-gray-900-to-600-45d: linear-gradient(45deg, var(--gray-900), var(--gray-600));\n\n  /* Brand Dark Blue Gradients */\n  --gradient-darkBlue-500-to-400-90d: linear-gradient(90deg, var(--brandDarkBlue-500), var(--brandDarkBlue-400));\n  --gradient-darkBlue-700-to-500-45d: linear-gradient(45deg, var(--brandDarkBlue-700), var(--brandDarkBlue-500));\n  --gradient-darkBlue-700-to-400-45d: linear-gradient(45deg, var(--brandDarkBlue-700), var(--brandDarkBlue-400));\n  --gradient-darkBlue-800-to-500-90d: linear-gradient(90deg, var(--brandDarkBlue-800), var(--brandDarkBlue-500));\n  --gradient-darkBlue-800-to-600265-d: linear-gradient(26.5deg, var(--brandDarkBlue-800), var(--brandDarkBlue-600));\n  --gradient-darkBlue-900-to-600-45d: linear-gradient(45deg, var(--brandDarkBlue-900), var(--brandDarkBlue-600));\n\n  /* Brand Red Gradients */\n  --gradient-red-500-to-400-90d: linear-gradient(90deg, var(--brandRed-600), var(--brandRed-400));\n  --gradient-red-700-to-500-45d: linear-gradient(45deg, var(--brandRed-700), var(--brandRed-500));\n  --gradient-red-700-to-400-45d: linear-gradient(45deg, var(--brandRed-700), var(--brandRed-400));\n  --gradient-red-800-to-500-90d: linear-gradient(90deg, var(--brandRed-800), var(--brandRed-500));\n  --gradient-red-800-to-600265-d: linear-gradient(26.5deg, var(--brandRed-800), var(--brandRed-600));\n  --gradient-red-900-to-600-45d: linear-gradient(45deg, var(--brandRed-900), var(--brandRed-600));\n\n  /* Blue Gradients */\n  --gradient-blue-500-to-400-90d: linear-gradient(90deg, var(--blue-500), var(--blue-400));\n  --gradient-blue-700-to-500-45d: linear-gradient(45deg, var(--blue-700), var(--blue-500));\n  --gradient-blue-700-to-400-45d: linear-gradient(45deg, var(--blue-700), var(--blue-400));\n  --gradient-blue-800-to-500-90d: linear-gradient(90deg, var(--blue-800), var(--blue-500));\n  --gradient-blue-800-to-600265-d: linear-gradient(26.5deg, var(--blue-800), var(--blue-600));\n  --gradient-blue-900-to-600-45d: linear-gradient(45deg, var(--blue-900), var(--blue-600));\n}\n.gradient-gray-600-to-500-90d {\n  background: var(--gradient-gray-600-to-500-90d);\n}\n.gradient-gray-700-to-600-45d {\n  background: var(--gradient-gray-700-to-600-45d);\n}\n.gradient-gray-800-to-600-45d {\n  background: var(--gradient-gray-800-to-600-45d);\n}\n.gradient-gray-800-to-600-90d {\n  background: var(--gradient-gray-800-to-600-90d);\n}\n.gradient-gray-800-to-700265-d {\n  background: var(--gradient-gray-800-to-700265-d);\n}\n.gradient-gray-900-to-600-45d {\n  background: var(--gradient-gray-900-to-600-45d);\n}\n.gradient-darkBlue-500-to-400-90d {\n  background: var(--gradient-darkBlue-500-to-400-90d);\n}\n.gradient-darkBlue-700-to-500-45d {\n  background: var(--gradient-darkBlue-700-to-500-45d);\n}\n.gradient-darkBlue-700-to-400-45d {\n  background: var(--gradient-darkBlue-700-to-400-45d);\n}\n.gradient-darkBlue-800-to-500-90d {\n  background: var(--gradient-darkBlue-800-to-500-90d);\n}\n.gradient-darkBlue-800-to-600265-d {\n  background: var(--gradient-darkBlue-800-to-600265-d);\n}\n.gradient-darkBlue-900-to-600-45d {\n  background: var(--gradient-darkBlue-900-to-600-45d);\n}\n.gradient-red-500-to-400-90d {\n  background: var(--gradient-red-500-to-400-90d);\n}\n.gradient-red-700-to-500-45d {\n  background: var(--gradient-red-700-to-500-45d);\n}\n.gradient-red-700-to-400-45d {\n  background: var(--gradient-red-700-to-400-45d);\n}\n.gradient-red-800-to-500-90d {\n  background: var(--gradient-red-800-to-500-90d);\n}\n.gradient-red-800-to-600265-d {\n  background: var(--gradient-red-800-to-600265-d);\n}\n.gradient-red-900-to-600-45d {\n  background: var(--gradient-red-900-to-600-45d);\n}\n.gradient-blue-500-to-400-90d {\n  background: var(--gradient-blue-500-to-400-90d);\n}\n.gradient-blue-700-to-500-45d {\n  background: var(--gradient-blue-700-to-500-45d);\n}\n.gradient-blue-700-to-400-45d {\n  background: var(--gradient-blue-700-to-400-45d);\n}\n.gradient-blue-800-to-500-90d {\n  background: var(--gradient-blue-800-to-500-90d);\n}\n.gradient-blue-800-to-600265-d {\n  background: var(--gradient-blue-800-to-600265-d);\n}\n.gradient-blue-900-to-600-45d {\n  background: var(--gradient-blue-900-to-600-45d);\n}\n/* Spacing Styles */\n:root {\n  /* Positive spacing */\n  --spacing-none: 0rem;\n  --spacing-half: 0.125rem;\n  --spacing-1: 0.25rem;\n  --spacing-2: 0.5rem;\n  --spacing-3: 0.75rem;\n  --spacing-4: 1rem;\n  --spacing-5: 1.25rem;\n  --spacing-6: 1.5rem;\n  --spacing-7: 2rem;\n  --spacing-8: 2.5rem;\n  --spacing-12: 3rem;\n  --spacing-16: 4rem;\n  --spacing-20: 5rem;\n  --spacing-24: 6rem;\n  --spacing-32: 8rem;\n  --spacing-40: 10rem;\n  --spacing-48: 12rem;\n  --spacing-56: 14rem;\n  --spacing-64: 16rem;\n\n  /* Negative spacing */\n  --spacing-negative-half: -0.125rem;\n  --spacing-negative-1: -0.25rem;\n  --spacing-negative-2: -0.5rem;\n  --spacing-negative-3: -0.75rem;\n  --spacing-negative-4: -1rem;\n  --spacing-negative-5: -1.25rem;\n  --spacing-negative-6: -1.5rem;\n  --spacing-negative-7: -2rem;\n\n  /* Radius  */\n  --rounded-none: 0rem;\n  --rounded-xs: 0.25rem;\n  --rounded-sm: 0.5rem;\n  --rounded-md: 0.75rem;\n  --rounded-lg: 1rem;\n  --rounded-xl: 1.5rem;\n  --rounded-2xl: 2rem;\n  --rounded-full: 62.438rem;\n}\n/* Typography Styles */\n:root {\n  /* Font Sizes */\n  --font-size-d-2xl: 4.5rem;\n  --font-size-d-xl: 3.75rem;\n  --font-size-d-lg: 3rem;\n  --font-size-d-md: 2.25rem;\n  --font-size-d-sm: 1.875rem;\n  --font-size-d-xs: 1.5rem;\n  --font-size-t-xl: 1.25rem;\n  --font-size-t-lg: 1.125rem;\n  --font-size-t-md: 1rem;\n  --font-size-t-sm: 0.875rem;\n  --font-size-t-xs: 0.75rem;\n  --font-size-t-xxs: 0.625rem;\n\n  /* Font Weights */\n  --font-weight-bold: 700;\n  --font-weight-semi-bold: 600;\n  --font-weight-medium: 500;\n  --font-weight-regular: 400;\n\n  /* Line Heights */\n  --font-line-height-d-2xl: 5rem;\n  --font-line-height-d-xl: 4.25rem;\n  --font-line-height-d-lg: 3.75rem;\n  --font-line-height-d-md: 2.75rem;\n  --font-line-height-d-sm: 2.375rem;\n  --font-line-height-d-xs: 2rem;\n  --font-line-height-t-xl: 2rem;\n  --font-line-height-t-lg: 1.875rem;\n  --font-line-height-t-md: 1.688rem;\n  --font-line-height-t-sm: 1.5rem;\n  --font-line-height-t-xs: 1.25rem;\n  --font-line-height-t-xxs: 1.125rem;\n\n  /* Letter Spacings */\n  --font-letter-spacing-d-2xl: -0.09rem;\n  --font-letter-spacing-d-xl: -0.075rem;\n  --font-letter-spacing-d-lg: -0.075rem;\n  --font-letter-spacing-d-md: -0.045rem;\n  --font-letter-spacing-d-sm: 0;\n  --font-letter-spacing-d-xs: 0;\n  --font-letter-spacing-d-xxs: 0;\n\n  /* Font Families */\n  --font-family-title: 'Sora';\n  --font-family-body: 'Sora';\n}\n/* Media queries for medium screens (tablet) */\n@media (max-width: 1199px) {\n  :root {\n    /* Font Sizes */\n    --font-size-d-2xl: 3.75rem;\n    --font-size-d-xl: 3.5rem;\n    --font-size-d-lg: 2.75rem;\n    --font-size-d-md: 2.25rem;\n    --font-size-d-sm: 1.875rem;\n    --font-size-d-xs: 1.5rem;\n\n    /* Line Heights */\n    --font-line-height-d-2xl: 4.25rem;\n    --font-line-height-d-xl: 3.75rem;\n    --font-line-height-d-lg: 2.4375rem;\n    --font-line-height-d-md: 2.75rem;\n    --font-line-height-d-sm: 2.375rem;\n    --font-line-height-d-xs: 2rem;\n\n    /* Letter Spacings */\n    --font-letter-spacing-2xl: -0.075rem;\n    --font-letter-spacing-xl: -0.065rem;\n    --font-letter-spacing-lg: -0.045rem;\n    --font-letter-spacing-md: -0.045rem;\n    --font-letter-spacing-sm: 0rem;\n    --font-letter-spacing-xs: 0rem;\n  }\n}\n/* Media queries for smaller screens (mobile) */\n@media (max-width: 743px) {\n  :root {\n    /* Font Sizes */\n    --font-size-d-2xl: 3rem;\n    --font-size-d-xl: 2.5rem;\n    --font-size-d-lg: 2rem;\n    --font-size-d-md: 1.75rem;\n    --font-size-d-sm: 1.5rem;\n    --font-size-d-xs: 1.25rem;\n\n    /* Line Heights */\n    --font-line-height-d-2xl: 3.375rem;\n    --font-line-height-d-xl: 2.875rem;\n    --font-line-height-d-lg: 2.5rem;\n    --font-line-height-d-md: 2.1375rem;\n    --font-line-height-d-sm: 2rem;\n    --font-line-height-d-xs: 1.75rem;\n\n    /* Letter Spacings */\n    --font-letter-spacing-2xl: -0.06rem;\n    --font-letter-spacing-xl: -0.05rem;\n    --font-letter-spacing-lg: -0.045rem;\n    --font-letter-spacing-md: 0rem;\n    --font-letter-spacing-sm: 0rem;\n    --font-letter-spacing-xs: 0rem;\n  }\n}\n.display-2xl-bold {\n  font-family: var(--font-family-title);\n  font-size: var(--font-size-d-2xl);\n  font-weight: var(--font-weight-bold);\n  line-height: var(--font-line-height-d-2xl);\n  letter-spacing: var(--font-letter-spacing-d-2xl);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.display-2xl-bold::before,\n.display-2xl-bold::after {\n  content: '';\n  display: table;\n}\n.display-2xl-bold::before {\n  margin-bottom: -0.135em;\n}\n.display-2xl-bold::after {\n  margin-top: -0.205em;\n}\n.display-2xl-semi-bold {\n  font-family: var(--font-family-title);\n  font-size: var(--font-size-d-2xl);\n  font-weight: var(--font-weight-semi-bold);\n  line-height: var(--font-line-height-d-2xl);\n  letter-spacing: var(--font-letter-spacing-d-2xl);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.display-2xl-semi-bold::before,\n.display-2xl-semi-bold::after {\n  content: '';\n  display: table;\n}\n.display-2xl-semi-bold::before {\n  margin-bottom: -0.135em;\n}\n.display-2xl-semi-bold::after {\n  margin-top: -0.205em;\n}\n.display-xl-bold {\n  font-family: var(--font-family-title);\n  font-size: var(--font-size-d-xl);\n  font-weight: var(--font-weight-bold);\n  line-height: var(--font-line-height-d-xl);\n  letter-spacing: var(--font-letter-spacing-d-xl);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.display-xl-bold::before,\n.display-xl-bold::after {\n  content: '';\n  display: table;\n}\n.display-xl-bold::before {\n  margin-bottom: -0.145em;\n}\n.display-xl-bold::after {\n  margin-top: -0.215em;\n}\n.display-xl-semi-bold {\n  font-family: var(--font-family-title);\n  font-size: var(--font-size-d-xl);\n  font-weight: var(--font-weight-semi-bold);\n  line-height: var(--font-line-height-d-xl);\n  letter-spacing: var(--font-letter-spacing-d-xl);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.display-xl-semi-bold::before,\n.display-xl-semi-bold::after {\n  content: '';\n  display: table;\n}\n.display-xl-semi-bold::before {\n  margin-bottom: -0.145em;\n}\n.display-xl-semi-bold::after {\n  margin-top: -0.215em;\n}\n.display-lg-bold {\n  font-family: var(--font-family-title);\n  font-size: var(--font-size-d-lg);\n  font-weight: var(--font-weight-bold);\n  line-height: var(--font-line-height-d-lg);\n  letter-spacing: var(--font-letter-spacing-d-lg);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.display-lg-bold::before,\n.display-lg-bold::after {\n  content: '';\n  display: table;\n}\n.display-lg-bold::before {\n  margin-bottom: -0.015em;\n}\n.display-lg-bold::after {\n  margin-top: -0.095em;\n}\n.display-lg-semi-bold {\n  font-family: var(--font-family-title);\n  font-size: var(--font-size-d-lg);\n  font-weight: var(--font-weight-semi-bold);\n  line-height: var(--font-line-height-d-lg);\n  letter-spacing: var(--font-letter-spacing-d-lg);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.display-lg-semi-bold::before,\n.display-lg-semi-bold::after {\n  content: '';\n  display: table;\n}\n.display-lg-semi-bold::before {\n  margin-bottom: -0.015em;\n}\n.display-lg-semi-bold::after {\n  margin-top: -0.095em;\n}\n.display-md-bold {\n  font-family: var(--font-family-title);\n  font-size: var(--font-size-d-md);\n  font-weight: var(--font-weight-bold);\n  line-height: var(--font-line-height-d-md);\n  letter-spacing: var(--font-letter-spacing-d-md);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.display-md-bold::before,\n.display-md-bold::after {\n  content: '';\n  display: table;\n}\n.display-md-bold::before {\n  margin-bottom: -0.195em;\n}\n.display-md-bold::after {\n  margin-top: -0.255em;\n}\n.display-md-semi-bold {\n  font-family: var(--font-family-title);\n  font-size: var(--font-size-d-md);\n  font-weight: var(--font-weight-semi-bold);\n  line-height: var(--font-line-height-d-md);\n  letter-spacing: var(--font-letter-spacing-d-md);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.display-md-semi-bold::before,\n.display-md-semi-bold::after {\n  content: '';\n  display: table;\n}\n.display-md-semi-bold::before {\n  margin-bottom: -0.195em;\n}\n.display-md-semi-bold::after {\n  margin-top: -0.255em;\n}\n.display-sm-bold {\n  font-family: var(--font-family-title);\n  font-size: var(--font-size-d-sm);\n  font-weight: var(--font-weight-bold);\n  line-height: var(--font-line-height-d-sm);\n  letter-spacing: var(--font-letter-spacing-d-sm);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.display-sm-bold::before,\n.display-sm-bold::after {\n  content: '';\n  display: table;\n}\n.display-sm-bold::before {\n  margin-bottom: -0.195em;\n}\n.display-sm-bold::after {\n  margin-top: -0.255em;\n}\n.display-sm-semi-bold {\n  font-family: var(--font-family-title);\n  font-size: var(--font-size-d-sm);\n  font-weight: var(--font-weight-semi-bold);\n  line-height: var(--font-line-height-d-sm);\n  letter-spacing: var(--font-letter-spacing-d-sm);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.display-sm-semi-bold::before,\n.display-sm-semi-bold::after {\n  content: '';\n  display: table;\n}\n.display-sm-semi-bold::before {\n  margin-bottom: -0.195em;\n}\n.display-sm-semi-bold::after {\n  margin-top: -0.255em;\n}\n.display-xs-bold {\n  font-family: var(--font-family-title);\n  font-size: var(--font-size-d-xs);\n  font-weight: var(--font-weight-bold);\n  line-height: var(--font-line-height-d-xs);\n  letter-spacing: var(--font-letter-spacing-d-xs);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.display-xs-bold::before,\n.display-xs-bold::after {\n  content: '';\n  display: table;\n}\n.display-xs-bold::before {\n  margin-bottom: -0.199em;\n}\n.display-xs-bold::after {\n  margin-top: -0.195em; /* Continue from here */\n}\n.display-xs-semi-bold {\n  font-family: var(--font-family-title);\n  font-size: var(--font-size-d-xs);\n  font-weight: var(--font-weight-semi-bold);\n  line-height: var(--font-line-height-d-xs);\n  letter-spacing: var(--font-letter-spacing-d-xs);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.display-xs-semi-bold::before,\n.display-xs-semi-bold::after {\n  content: '';\n  display: table;\n}\n.display-xs-semi-bold::before {\n  margin-bottom: -0.259em;\n}\n.display-xs-semi-bold::after {\n  margin-top: -0.295em;\n}\n.text-xl-bold {\n  font-family: var(--font-family-body);\n  font-size: var(--font-size-t-xl);\n  font-weight: var(--font-weight-bold);\n  line-height: var(--font-line-height-t-xl);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.text-xl-bold::before,\n.text-xl-bold::after {\n  content: '';\n  display: table;\n}\n.text-xl-bold::before {\n  margin-bottom: -0.329em;\n}\n.text-xl-bold::after {\n  margin-top: -0.359em;\n}\n.text-xl-semi-bold {\n  font-family: var(--font-family-body);\n  font-size: var(--font-size-t-xl);\n  font-weight: var(--font-weight-semi-bold);\n  line-height: var(--font-line-height-t-xl);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.text-xl-semi-bold::before,\n.text-xl-semi-bold::after {\n  content: '';\n  display: table;\n}\n.text-xl-semi-bold::before {\n  margin-bottom: -0.329em;\n}\n.text-xl-semi-bold::after {\n  margin-top: -0.359em;\n}\n.text-xl-medium {\n  font-family: var(--font-family-body);\n  font-size: var(--font-size-t-xl);\n  font-weight: var(--font-weight-medium);\n  line-height: var(--font-line-height-t-xl);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.text-xl-medium::before,\n.text-xl-medium::after {\n  content: '';\n  display: table;\n}\n.text-xl-medium::before {\n  margin-bottom: -0.339em;\n}\n.text-xl-medium::after {\n  margin-top: -0.399em;\n}\n.text-xl-regular {\n  font-family: var(--font-family-body);\n  font-size: var(--font-size-t-xl);\n  font-weight: var(--font-weight-regular);\n  line-height: var(--font-line-height-t-xl);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.text-xl-regular::before,\n.text-xl-regular::after {\n  content: '';\n  display: table;\n}\n.text-xl-regular::before {\n  margin-bottom: -0.339em;\n}\n.text-xl-regular::after {\n  margin-top: -0.399em;\n}\n.text-lg-bold {\n  font-family: var(--font-family-body);\n  font-size: var(--font-size-t-lg);\n  font-weight: var(--font-weight-bold);\n  line-height: var(--font-line-height-t-lg);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.text-lg-bold::before,\n.text-lg-bold::after {\n  content: '';\n  display: table;\n}\n.text-lg-bold::before {\n  margin-bottom: -0.339em;\n}\n.text-lg-bold::after {\n  margin-top: -0.399em;\n}\n.text-lg-semi-bold {\n  font-family: var(--font-family-body);\n  font-size: var(--font-size-t-lg);\n  font-weight: var(--font-weight-semi-bold);\n  line-height: var(--font-line-height-t-lg);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.text-lg-semi-bold::before,\n.text-lg-semi-bold::after {\n  content: '';\n  display: table;\n}\n.text-lg-semi-bold::before {\n  margin-bottom: -0.339em;\n}\n.text-lg-semi-bold::after {\n  margin-top: -0.399em;\n}\n.text-lg-medium {\n  font-family: var(--font-family-body);\n  font-size: var(--font-size-t-lg);\n  font-weight: var(--font-weight-medium);\n  line-height: var(--font-line-height-t-lg);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.text-lg-medium::before,\n.text-lg-medium::after {\n  content: '';\n  display: table;\n}\n.text-lg-medium::before {\n  margin-bottom: -0.349em;\n}\n.text-lg-medium::after {\n  margin-top: -0.389em;\n}\n.text-lg-regular {\n  font-family: var(--font-family-body);\n  font-size: var(--font-size-t-lg);\n  font-weight: var(--font-weight-regular);\n  line-height: var(--font-line-height-t-lg);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.text-lg-regular::before,\n.text-lg-regular::after {\n  content: '';\n  display: table;\n}\n.text-lg-regular::before {\n  margin-bottom: -0.349em;\n}\n.text-lg-regular::after {\n  margin-top: -0.389em;\n}\n.text-md-bold {\n  font-family: var(--font-family-body);\n  font-size: var(--font-size-t-md);\n  font-weight: var(--font-weight-bold);\n  line-height: var(--font-line-height-t-md);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.text-md-bold::before,\n.text-md-bold::after {\n  content: '';\n  display: table;\n}\n.text-md-bold::before {\n  margin-bottom: -0.349em;\n}\n.text-md-bold::after {\n  margin-top: -0.389em;\n}\n.text-md-semi-bold {\n  font-family: var(--font-family-body);\n  font-size: var(--font-size-t-md);\n  font-weight: var(--font-weight-semi-bold);\n  line-height: var(--font-line-height-t-md);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.text-md-semi-bold::before,\n.text-md-semi-bold::after {\n  content: '';\n  display: table;\n}\n.text-md-semi-bold::before {\n  margin-bottom: -0.349em;\n}\n.text-md-semi-bold::after {\n  margin-top: -0.389em;\n}\n.text-md-medium {\n  font-family: var(--font-family-body);\n  font-size: var(--font-size-t-md);\n  font-weight: var(--font-weight-medium);\n  line-height: var(--font-line-height-t-md);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.text-md-medium::before,\n.text-md-medium::after {\n  content: '';\n  display: table;\n}\n.text-md-medium::before {\n  margin-bottom: -0.349em;\n}\n.text-md-medium::after {\n  margin-top: -0.389em;\n}\n.text-md-regular {\n  font-family: var(--font-family-body);\n  font-size: var(--font-size-t-md);\n  font-weight: var(--font-weight-regular);\n  line-height: var(--font-line-height-t-md);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.text-md-regular::before,\n.text-md-regular::after {\n  content: '';\n  display: table;\n}\n.text-md-regular::before {\n  margin-bottom: -0.349em;\n}\n.text-md-regular::after {\n  margin-top: -0.389em;\n}\n.text-sm-bold {\n  font-family: var(--font-family-body);\n  font-size: var(--font-size-t-sm);\n  font-weight: var(--font-weight-bold);\n  line-height: var(--font-line-height-t-sm);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.text-sm-bold::before,\n.text-sm-bold::after {\n  content: '';\n  display: table;\n}\n.text-sm-bold::before {\n  margin-bottom: -0.299em;\n}\n.text-sm-bold::after {\n  margin-top: -0.349em;\n}\n.text-sm-semi-bold {\n  font-family: var(--font-family-body);\n  font-size: var(--font-size-t-sm);\n  font-weight: var(--font-weight-semi-bold);\n  line-height: var(--font-line-height-t-sm);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.text-sm-semi-bold::before,\n.text-sm-semi-bold::after {\n  content: '';\n  display: table;\n}\n.text-sm-semi-bold::before {\n  margin-bottom: -0.299em;\n}\n.text-sm-semi-bold::after {\n  margin-top: -0.349em;\n}\n.text-sm-medium {\n  font-family: var(--font-family-body);\n  font-size: var(--font-size-t-sm);\n  font-weight: var(--font-weight-medium);\n  line-height: var(--font-line-height-t-sm);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  position: relative;\n  display: inline-block;\n}\n.text-sm-medium::before,\n.text-sm-medium::after {\n  content: '';\n  display: table;\n}\n.text-sm-medium::before {\n  margin-bottom: -0.299em;\n}\n.text-sm-medium::after {\n  margin-top: -0.299em;\n}\n.text-sm-regular {\n  font-family: var(--font-family-body);\n  font-size: var(--font-size-t-sm);\n  font-weight: var(--font-weight-regular);\n  line-height: var(--font-line-height-t-sm);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  position: relative;\n  display: inline-block;\n}\n.text-sm-regular::before,\n.text-sm-regular::after {\n  content: '';\n  display: table;\n}\n.text-sm-regular::before {\n  margin-bottom: -0.299em;\n}\n.text-sm-regular::after {\n  margin-top: -0.299em;\n}\n.text-xs-bold {\n  font-family: var(--font-family-body);\n  font-size: var(--font-size-t-xs);\n  font-weight: var(--font-weight-bold);\n  line-height: var(--font-line-height-t-xs);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.text-xs-bold::before,\n.text-xs-bold::after {\n  content: '';\n  display: table;\n}\n.text-xs-bold::before {\n  margin-bottom: -0.291em;\n}\n.text-xs-bold::after {\n  margin-top: -0.416em;\n}\n.text-xs-semi-bold {\n  font-family: var(--font-family-body);\n  font-size: var(--font-size-t-xs);\n  font-weight: var(--font-weight-semi-bold);\n  line-height: var(--font-line-height-t-xs);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.text-xs-semi-bold::before,\n.text-xs-semi-bold::after {\n  content: '';\n  display: table;\n}\n.text-xs-semi-bold::before {\n  margin-bottom: -0.321em;\n}\n.text-xs-semi-bold::after {\n  margin-top: -0.416em;\n}\n.text-xs-medium {\n  font-family: var(--font-family-body);\n  font-size: var(--font-size-t-xs);\n  font-weight: var(--font-weight-medium);\n  line-height: var(--font-line-height-t-xs);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.text-xs-medium::before,\n.text-xs-medium::after {\n  content: '';\n  display: table;\n}\n.text-xs-medium::before {\n  margin-bottom: -0.285em;\n}\n.text-xs-medium::after {\n  margin-top: -0.396em;\n}\n.text-xs-regular {\n  font-family: var(--font-family-body);\n  font-size: var(--font-size-t-xs);\n  font-weight: var(--font-weight-regular);\n  line-height: var(--font-line-height-t-xs);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.text-xs-regular::before,\n.text-xs-regular::after {\n  content: '';\n  display: table;\n}\n.text-xs-regular::before {\n  margin-bottom: -0.291em;\n}\n.text-xs-regular::after {\n  margin-top: -0.396em;\n}\n.text-xxs-bold {\n  font-family: var(--font-family-body);\n  font-size: var(--font-size-t-xxs);\n  font-weight: var(--font-weight-bold);\n  line-height: var(--font-line-height-t-xxs);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.text-xxs-bold::before,\n.text-xxs-bold::after {\n  content: '';\n  display: table;\n}\n.text-xxs-bold::before {\n  margin-bottom: -0.291em;\n}\n.text-xxs-bold::after {\n  margin-top: -0.416em;\n}\n.text-xxs-semi-bold {\n  font-family: var(--font-family-body);\n  font-size: var(--font-size-t-xxs);\n  font-weight: var(--font-weight-semi-bold);\n  line-height: var(--font-line-height-t-xxs);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.text-xxs-semi-bold::before,\n.text-xxs-semi-bold::after {\n  content: '';\n  display: table;\n}\n.text-xxs-semi-bold::before {\n  margin-bottom: -0.291em;\n}\n.text-xxs-semi-bold::after {\n  margin-top: -0.416em;\n}\n.text-xxs-medium {\n  font-family: var(--font-family-body);\n  font-size: var(--font-size-t-xxs);\n  font-weight: var(--font-weight-medium);\n  line-height: var(--font-line-height-t-xxs);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.text-xxs-medium::before,\n.text-xxs-medium::after {\n  content: '';\n  display: table;\n}\n.text-xxs-medium::before {\n  margin-bottom: -0.291em;\n}\n.text-xxs-medium::after {\n  margin-top: -0.416em;\n}\n.text-xxs-regular {\n  font-family: var(--font-family-body);\n  font-size: var(--font-size-t-xxs);\n  font-weight: var(--font-weight-regular);\n  line-height: var(--font-line-height-t-xxs);\n  margin: var(--spacing-none);\n  padding: var(--spacing-none);\n  display: inline-block;\n  position: relative;\n}\n.text-xxs-regular::before,\n.text-xxs-regular::after {\n  content: '';\n  display: table;\n}\n.text-xxs-regular::before {\n  margin-bottom: -0.291em;\n}\n.text-xxs-regular::after {\n  margin-top: -0.416em;\n}\n/* Button slot styles */\n/* .slotted_button_text.primary {\n  color: var(--color-text-inverse, #ffffff) !important;\n}\n\n.slotted_button_text.secondary_gray {\n  color: var(--color-text, #4b5565) !important;\n}\n\n.slotted_button_text.secondary_color {\n  color: var(--color-text-brandRed, #e21b2e) !important;\n}\n\n.slotted_button_text.tertiary_gray {\n  color: var(--color-text, #4b5565) !important;\n}\n\n.slotted_button_text.tertiary_color {\n  color: var(--color-text-brandRed, #e21b2e) !important;\n}\n\n.slotted_button_text.link_gray {\n  color: var(--color-text, #4b5565) !important;\n}\n\n.slotted_button_text.link_color {\n  color: var(--color-link, #075db2) !important;\n}\n\n.slotted_button_text.primary.destructive {\n  color: var(--color-text-inverse, #ffffff) !important;\n}\n\n#slotted_button_text.primary.disabled,\n#slotted_button_text.secondary_gray.disabled,\n#slotted_button_text.secondary_color.disabled,\n#slotted_button_text.tertiary_gray.disabled,\n#slotted_button_text.tertiary_color.disabled,\n#slotted_button_text.link_gray.disabled,\n#slotted_button_text.link_color.disabled {\n  color: var(--color-text-disabled, #9aa4b2) !important;\n}\n\n#slotted_button_text.secondary_gray.default.destructive,\n#slotted_button_text.secondary_color.default.destructive,\n#slotted_button_text.tertiary_gray.default.destructive,\n#slotted_button_text.tertiary_color.default.destructive,\n#slotted_button_text.link_gray.default.destructive,\n#slotted_button_text.link_color.default.destructive {\n  color: var(--color-text-danger, #b51726) !important;\n} */\n.dropdown-container {\n    display: flex;\n    width: 13.3125rem;\n    padding: var(--spacing-half) 0;\n    flex-direction: column;\n    justify-content: center;\n    gap: var(--spacing-half);\n    border-radius: var(--rounded-sm);\n    border: 1px solid var(--color-border-subtler, #E3E8EF);\n    background: var(--color-surface, #FFFFFF);\n    box-shadow: var(--shadow-sm);\n}\n.user_guide,\n.bug,\n.log_error{\n    width: 100%;\n}\ngb-dropdown-items-with-shortcut {\n    width: -moz-fit-content;\n    width: fit-content;\n    max-width: 100%;\n}\ngb-dropdown-items-with-shortcut.shortcut-container {\n    width: 205px;\n}";
@@ -55,6 +55,6 @@ function defineCustomElement() {
 defineCustomElement();
 export { GbHelpDropdown as G, defineCustomElement as d };
-//# sourceMappingURL=p-BvrXxkVq.js.map
+//# sourceMappingURL=p-BnuUfALL.js.map
-//# sourceMappingURL=p-BvrXxkVq.js.map
+//# sourceMappingURL=p-BnuUfALL.js.map

package/dist/components/{p-BvrXxkVq.js.map → p-BnuUfALL.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-~~BvrXxkVq~~.js","mappings":";;;;;AAAA,MAAM,iBAAiB,GAAG,ginEAAginE;;MCQ7inE,cAAc,iBAAAA,kBAAA,CAAA,MAAA,cAAA,SAAAC,CAAA,CAAA;;;;;;;;;AAIvB,IAAA,iBAAiB,CAAC,IAAY,EAAA;AAC5B,QAAA,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC;;IAGjC,MAAM,GAAA;AACF,QAAA,QACE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,oBAAoB,EAAA,EAC7B,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,YAAY,EAAA,EACrB,CACE,CAAA,iCAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,QACJ,OAAO,EAAC,sBAAsB,EAC9B,KAAK,EAAC,qBAAqB,EAC3B,OAAO,EAAE,MAAM,IAAI,CAAC,iBAAiB,CAAC,qBAAqB,CAAC,EAAA,CAC3B,CAC/B,EACN,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,KAAK,EAAA,EACd,CACE,CAAA,iCAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,QACJ,OAAO,EAAC,mBAAmB,EAC3B,KAAK,EAAC,cAAc,EACpB,OAAO,EAAE,MAAM,IAAI,CAAC,iBAAiB,CAAC,cAAc,CAAC,EAAA,CACpB,CAC/B,EACL,IAAI,CAAC,YAAY,KAChB,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,WAAW,EAAA,EACpB,CACE,CAAA,iCAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EACJ,IAAA,EAAA,OAAO,EAAC,qBAAqB,EAC7B,KAAK,EAAC,qBAAqB,EAC3B,OAAO,EAAE,MAAM,IAAI,CAAC,iBAAiB,CAAC,qBAAqB,CAAC,EAAA,CAC3B,CAC/B,CACP,CACG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/gb-help-dropdown/gb-help-dropdown.css?tag=gb-help-dropdown&encapsulation=shadow","src/components/gb-help-dropdown/gb-help-dropdown.tsx"],"sourcesContent":["@import '../../global/global.css';\n\n.dropdown-container {\n display: flex;\n width: 13.3125rem;\n padding: var(--spacing-half) 0;\n flex-direction: column;\n justify-content: center;\n gap: var(--spacing-half);\n border-radius: var(--rounded-sm);\n border: 1px solid var(--color-border-subtler, #E3E8EF);\n background: var(--color-surface, #FFFFFF);\n box-shadow: var(--shadow-sm);\n}\n\n.user_guide,\n.bug,\n.log_error{\n width: 100%;\n}\n\ngb-dropdown-items-with-shortcut {\n width: fit-content;\n max-width: 100%;\n}\n\ngb-dropdown-items-with-shortcut.shortcut-container {\n width: 205px;\n}","import {Component, Event, EventEmitter, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'gb-help-dropdown',\n styleUrl: 'gb-help-dropdown.css',\n shadow: true\n})\n\nexport class GbHelpDropdown {\n @Prop() showLogError: boolean;\n @Event() helpItemClicked: EventEmitter<string>;\n\n onHelpItemClicked(item: string) {\n this.helpItemClicked.emit(item)\n }\n\n render(){\n return (\n <div class=\"dropdown-container\">\n <div class=\"user_guide\">\n <gb-dropdown-items-with-shortcut\n icon\n iconSrc=\"assets/book_open.svg\"\n label=\"Download user guide\"\n onClick={() => this.onHelpItemClicked('download_user_guide')}\n ></gb-dropdown-items-with-shortcut>\n </div>\n <div class=\"bug\">\n <gb-dropdown-items-with-shortcut\n icon\n iconSrc=\"assets/bug_02.svg\"\n label=\"Report a bug\"\n onClick={() => this.onHelpItemClicked('report_a_bug')}\n ></gb-dropdown-items-with-shortcut>\n </div>\n {this.showLogError && (\n <div class=\"log_error\">\n <gb-dropdown-items-with-shortcut\n icon\n iconSrc=\"assets/alert_02.svg\"\n label=\"Log a profile error\"\n onClick={() => this.onHelpItemClicked('log_a_profile_error')}\n ></gb-dropdown-items-with-shortcut>\n </div>\n )}\n </div>\n );\n }\n}"],"version":3}
1	+ {"file":"p-BnuUfALL.js","mappings":";;;;;AAAA,MAAM,iBAAiB,GAAG,ginEAAginE;;MCQ7inE,cAAc,iBAAAA,kBAAA,CAAA,MAAA,cAAA,SAAAC,CAAA,CAAA;;;;;;;;;AAIvB,IAAA,iBAAiB,CAAC,IAAY,EAAA;AAC5B,QAAA,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC;;IAGjC,MAAM,GAAA;AACF,QAAA,QACE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,oBAAoB,EAAA,EAC7B,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,YAAY,EAAA,EACrB,CACE,CAAA,iCAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,QACJ,OAAO,EAAC,sBAAsB,EAC9B,KAAK,EAAC,qBAAqB,EAC3B,OAAO,EAAE,MAAM,IAAI,CAAC,iBAAiB,CAAC,qBAAqB,CAAC,EAAA,CAC3B,CAC/B,EACN,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,KAAK,EAAA,EACd,CACE,CAAA,iCAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,QACJ,OAAO,EAAC,mBAAmB,EAC3B,KAAK,EAAC,cAAc,EACpB,OAAO,EAAE,MAAM,IAAI,CAAC,iBAAiB,CAAC,cAAc,CAAC,EAAA,CACpB,CAC/B,EACL,IAAI,CAAC,YAAY,KAChB,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,WAAW,EAAA,EACpB,CACE,CAAA,iCAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EACJ,IAAA,EAAA,OAAO,EAAC,qBAAqB,EAC7B,KAAK,EAAC,qBAAqB,EAC3B,OAAO,EAAE,MAAM,IAAI,CAAC,iBAAiB,CAAC,qBAAqB,CAAC,EAAA,CAC3B,CAC/B,CACP,CACG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/gb-help-dropdown/gb-help-dropdown.css?tag=gb-help-dropdown&encapsulation=shadow","src/components/gb-help-dropdown/gb-help-dropdown.tsx"],"sourcesContent":["@import '../../global/global.css';\n\n.dropdown-container {\n display: flex;\n width: 13.3125rem;\n padding: var(--spacing-half) 0;\n flex-direction: column;\n justify-content: center;\n gap: var(--spacing-half);\n border-radius: var(--rounded-sm);\n border: 1px solid var(--color-border-subtler, #E3E8EF);\n background: var(--color-surface, #FFFFFF);\n box-shadow: var(--shadow-sm);\n}\n\n.user_guide,\n.bug,\n.log_error{\n width: 100%;\n}\n\ngb-dropdown-items-with-shortcut {\n width: fit-content;\n max-width: 100%;\n}\n\ngb-dropdown-items-with-shortcut.shortcut-container {\n width: 205px;\n}","import {Component, Event, EventEmitter, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'gb-help-dropdown',\n styleUrl: 'gb-help-dropdown.css',\n shadow: true\n})\n\nexport class GbHelpDropdown {\n @Prop() showLogError: boolean;\n @Event() helpItemClicked: EventEmitter<string>;\n\n onHelpItemClicked(item: string) {\n this.helpItemClicked.emit(item)\n }\n\n render(){\n return (\n <div class=\"dropdown-container\">\n <div class=\"user_guide\">\n <gb-dropdown-items-with-shortcut\n icon\n iconSrc=\"assets/book_open.svg\"\n label=\"Download user guide\"\n onClick={() => this.onHelpItemClicked('download_user_guide')}\n ></gb-dropdown-items-with-shortcut>\n </div>\n <div class=\"bug\">\n <gb-dropdown-items-with-shortcut\n icon\n iconSrc=\"assets/bug_02.svg\"\n label=\"Report a bug\"\n onClick={() => this.onHelpItemClicked('report_a_bug')}\n ></gb-dropdown-items-with-shortcut>\n </div>\n {this.showLogError && (\n <div class=\"log_error\">\n <gb-dropdown-items-with-shortcut\n icon\n iconSrc=\"assets/alert_02.svg\"\n label=\"Log a profile error\"\n onClick={() => this.onHelpItemClicked('log_a_profile_error')}\n ></gb-dropdown-items-with-shortcut>\n </div>\n )}\n </div>\n );\n }\n}"],"version":3}

package/dist/components/{p-DC-GdKb9.js → p-ByOyexVq.js} RENAMED Viewed

@@ -4,9 +4,9 @@ import { d as defineCustomElement$b } from './p-DhmmSqYS.js';
 import { d as defineCustomElement$a } from './p-CZS8W2Ds.js';
 import { d as defineCustomElement$9 } from './p-C7kesQEn.js';
 import { d as defineCustomElement$8 } from './p-mGWgn0GR.js';
-import { d as defineCustomElement$7 } from './p-eVx9Cuj0.js';
-import { d as defineCustomElement$6 } from './p-BEwtnG4L.js';
-import { d as defineCustomElement$5 } from './p-BdAdVQiw.js';
+import { d as defineCustomElement$7 } from './p-OVoS3dKe.js';
+import { d as defineCustomElement$6 } from './p-BE9pk1IO.js';
+import { d as defineCustomElement$5 } from './p-DDldZplG.js';
 import { d as defineCustomElement$4 } from './p-DmrnFmi9.js';
 import { d as defineCustomElement$3 } from './p-BWyAj_uJ.js';
 import { d as defineCustomElement$2 } from './p-B-m07dWQ.js';
@@ -194,6 +194,6 @@ function defineCustomElement() {
 defineCustomElement();
 export { GbAvatarDropdown as G, defineCustomElement as d };
-//# sourceMappingURL=p-DC-GdKb9.js.map
+//# sourceMappingURL=p-ByOyexVq.js.map
-//# sourceMappingURL=p-DC-GdKb9.js.map
+//# sourceMappingURL=p-ByOyexVq.js.map

package/dist/components/{p-DC-GdKb9.js.map → p-ByOyexVq.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-DC-GdKb9.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/gb-avatar-dropdown/gb-avatar-dropdown.css?tag=gb-avatar-dropdown&encapsulation=shadow","src/components/gb-avatar-dropdown/gb-avatar-dropdown.tsx"],"sourcesContent":["@import '../../global/global.css';\n\n.simple-dropdown {\n display: flex;\n width: 17rem;\n padding: 0px;\n flex-direction: column;\n align-items: flex-start;\n gap: 0px;\n border-radius: var(--rounded-sm);\n border: 1px solid var(--color-border-subtler, #e3e8ef);\n background: var(--color-surface, #ffffff);\n box-shadow: var(--shadow-lg);\n}\n\n.profile {\n display: flex;\n align-items: flex-start;\n gap: var(--spacing-none);\n border-radius: var(--rounded-none);\n border-bottom: 1px solid var(--color-border-subtler, #e3e8ef); \n padding: 0.5rem;\n flex: 1;\n width: 100%;\n box-sizing: border-box;\n}\n\n.complex-dropdown {\n width: 17rem;\n display: flex;\n padding: 0px;\n flex-direction: column;\n align-items: flex-start;\n gap: 0px;\n border-radius: var(--rounded-sm);\n border: 1px solid var(--color-border-subtler, #e3e8ef);\n background: var(--color-surface, #ffffff);\n box-shadow: var(--shadow-lg);\n}\n\n.menu-items {\n display: flex;\n width: 100%;\n padding: var(--spacing-none);\n flex-direction: column;\n align-items: flex-start;\n gap: var(--spacing-none);\n}\n\n.list {\n padding: var(--spacing-1) var(--spacing-none);\n align-self: stretch;\n border-radius: var(--rounded-none);\n}\n\n.list-group-one,\n.list-group-two,\n.list-group-three {\n width: 100%;\n padding: var(--spacing-1) var(--spacing-none);\n}\n\n.list-group-one,\n.list-group-two {\n border-bottom: 1px solid var(--color-border-subtler, #e3e8ef);\n}\n\n.item {\n width: 100%;\n}\n\n.label_group {\n display: flex;\n padding: 0px;\n align-items: center;\n gap: 12px;\n align-self: stretch;\n border-radius: var(--rounded-none);\n}\n\n.theme_tab {\n width: 100%;\n box-sizing: border-box;\n padding: var(--spacing-3);\n border-bottom: 1px solid var(--color-border-subtler, #e3e8ef);\n}\n\n.roles {\n width: 100%;\n display: flex;\n padding: var(--spacing-3);\n gap: var(--spacing-2);\n flex-direction: column;\n align-items: flex-start;\n border-bottom: 1px solid var(--color-border-subtler, #e3e8ef);\n color: var(--color-text, #4b5565);\n box-sizing: border-box;\n}\n\n.badges {\n width: 90%;\n display: flex;\n align-items: center;\n align-content: center;\n gap: 0.5rem var(--spacing-2);\n align-self: stretch;\n flex-wrap: wrap;\n}","import { Component, Element, Event, EventEmitter, Prop, h } from '@stencil/core';\nimport { ColorTypes, DropdownListGroup, DropdownRoles, ThemeTypes } from '../../models/reusableModels';\n@Component({\n tag: 'gb-avatar-dropdown',\n styleUrl: 'gb-avatar-dropdown.css',\n shadow: true,\n})\nexport class GbAvatarDropdown {\n @Prop() type: 'simple' \| 'complex' = 'simple';\n @Prop() text: boolean = false;\n @Prop() showProfile: boolean;\n\n @Prop() showThemeTab: boolean;\n @Prop() showRoles: boolean = false;\n @Prop() roles: DropdownRoles[] = [\n // {\n // badgeLabel: 'Initiator',\n // badgeColor: 'information',\n // badgeType: 'badge_color',\n // },\n // {\n // badgeLabel: 'Authorizer',\n // badgeColor: 'success',\n // badgeType: 'badge_color',\n // },\n // {\n // badgeLabel: 'Viewer',\n // badgeColor: 'gray',\n // badgeType: 'badge_color',\n // },\n ];\n @Prop() showLogOut: boolean;\n @Prop() listGroupOne: DropdownListGroup[] = [\n // { label: 'View Profile', icon: 'assets/user.svg', shortcut: 'Ctrl K + P' },\n // { label: 'Documentation', icon: 'assets/book-open-02.svg', shortcut: 'Ctrl + T' },\n // { label: 'Support', icon: 'assets/customer-support.svg', shortcut: 'Ctrl + C' },\n ];\n @Prop() listGroupTwo: DropdownListGroup[] = [\n // { label: 'Configuration', icon: 'assets/user.svg', shortcut: 'Ctrl + S' },\n // { label: 'Team', icon: 'assets/book-open-02.svg', shortcut: 'Ctrl K + T' },\n // { label: 'Invite members', icon: 'assets/customer-support.svg', shortcut: 'Ctrl + I' },\n ];\n @Prop() color: ColorTypes;\n @Prop() showBorder: boolean = false;\n @Prop() currentTheme: ThemeTypes;\n @Element() el: HTMLElement;\n @Event() itemClicked: EventEmitter<string>;\n @Event() themeTabClicked: EventEmitter<string>;\n\n applyColorToInitials() {\n switch (this.color) {\n case 'gray':\n return 'gray';\n case 'blue':\n return 'blue';\n case 'cyan':\n return 'cyan';\n case 'pink':\n return 'pink';\n case 'purple':\n return 'purple';\n case 'green':\n return 'green';\n case 'yellow':\n return 'yellow';\n }\n }\n\n onItemClicked(item: string) {\n this.itemClicked.emit(item);\n }\n\n emitTheme(theme) {\n this.themeTabClicked.emit(theme);\n }\n\n componentDidLoad() {\n const slottedInitials = this.el.querySelector('[slot=\"initials\"]');\n const nameInitials = this.el.querySelector('[slot=\"name\"');\n const supportingTextSlot = this.el.querySelector('[slot=\"supporting_text\"');\n\n if (slottedInitials) {\n slottedInitials.classList.add('text-md-semi-bold');\n slottedInitials.classList.add(this.applyColorToInitials() \|\| 'gray');\n }\n\n if (nameInitials) {\n nameInitials.classList.add('text-sm-semi-bold');\n }\n\n if (supportingTextSlot) {\n supportingTextSlot.classList.add('text-sm-regular');\n }\n }\n\n render() {\n if (this.type === 'simple') {\n return (\n <div class=\"simple-dropdown\">\n <div class=\"profile\">\n <gb-avatar-label-group size=\"md\" text={true} color={this.color} show-border={this.showBorder}>\n <slot name=\"name\" slot=\"name\"></slot>\n <slot name=\"initials\" slot=\"initials\"></slot>\n <slot name=\"supporting_text\" slot=\"supporting_text\"></slot>\n </gb-avatar-label-group>\n </div>\n <div class=\"menu-items\">\n <div class=\"list\">\n {this.showThemeTab && (\n <div class=\"theme_tab\">\n <gb-theme-tab current-active-tab={this.currentTheme} onThemeTabClicked={this.emitTheme.bind(this)}></gb-theme-tab>\n </div>\n )}\n {this.showProfile && (\n <gb-dropdown-items-with-shortcut\n icon\n iconSrc=\"assets/user_profile.svg\"\n label=\"View Profile\"\n shortcut\n shortcutIcon=\"K + P\"\n onClick={() => this.onItemClicked('view_profile')}\n ></gb-dropdown-items-with-shortcut>\n )}\n {this.showLogOut && (\n <gb-dropdown-items-with-shortcut\n icon\n iconSrc=\"assets/logout_button.svg\"\n label=\"Log out\"\n shortcut\n shortcutIcon=\"L\"\n onClick={() => this.onItemClicked('log_out')}\n ></gb-dropdown-items-with-shortcut>\n )}\n </div>\n </div>\n </div>\n );\n }\n\n if (this.type === 'complex') {\n return (\n <div class=\"complex-dropdown\">\n <div class=\"profile\">\n <gb-avatar-label-group size=\"md\" class=\"label_group\" text={true} color={this.color}>\n <slot name=\"name\" slot=\"name\"></slot>\n <slot name=\"initials\" slot=\"initials\"></slot>\n <slot name=\"supporting_text\" slot=\"supporting_text\"></slot>\n </gb-avatar-label-group>\n </div>\n {this.showThemeTab && (\n <div class=\"theme_tab\">\n <gb-theme-tab current-active-tab={this.currentTheme} onThemeTabClicked={this.emitTheme.bind(this)}></gb-theme-tab>\n </div>\n )}\n {this.showRoles && (\n <div class=\"roles\">\n <p class=\"text-sm-medium\">Available roles</p>\n <div class=\"badges\">\n {this.roles.map(role => (\n <gb-badge size=\"md\" color={role.badgeColor} type={role.badgeType}>\n <p>{role.badgeLabel}</p>\n </gb-badge>\n ))}\n </div>\n </div>\n )}\n {this.listGroupOne.length > 0 && (\n <div class=\"list-group-one\">\n {this.listGroupOne.map(item => (\n <div class=\"item\">\n <gb-dropdown-items-with-shortcut\n icon\n iconSrc={item.icon}\n label={item.label}\n shortcut\n shortcutIcon={item.shortcut}\n onClick={() => this.onItemClicked(item.label.replace(/\\s+/g, '_').toLowerCase())}\n ></gb-dropdown-items-with-shortcut>\n </div>\n ))}\n </div>\n )}\n {this.listGroupTwo.length > 0 && (\n <div class=\"list-group-two\">\n {this.listGroupTwo.map(item => (\n <div class=\"item\">\n <gb-dropdown-items-with-shortcut\n icon\n iconSrc={item.icon}\n label={item.label}\n shortcut\n shortcutIcon={item.shortcut}\n onClick={() => this.onItemClicked(item.label.replace(/\\s+/g, '_').toLowerCase())}\n ></gb-dropdown-items-with-shortcut>\n </div>\n ))}\n </div>\n )}\n {this.showLogOut && (\n <div class=\"list-group-three\">\n <div class=\"item\">\n <gb-dropdown-items-with-shortcut\n icon\n iconSrc=\"assets/logout_button.svg\"\n label=\"Log out\"\n shortcut\n shortcutIcon=\"Ctrl + L\"\n onClick={() => this.onItemClicked('log_out')}\n ></gb-dropdown-items-with-shortcut>\n </div>\n </div>\n )}\n </div>\n );\n }\n }\n}\n"],"version":3}
1	+ {"file":"p-ByOyexVq.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/gb-avatar-dropdown/gb-avatar-dropdown.css?tag=gb-avatar-dropdown&encapsulation=shadow","src/components/gb-avatar-dropdown/gb-avatar-dropdown.tsx"],"sourcesContent":["@import '../../global/global.css';\n\n.simple-dropdown {\n display: flex;\n width: 17rem;\n padding: 0px;\n flex-direction: column;\n align-items: flex-start;\n gap: 0px;\n border-radius: var(--rounded-sm);\n border: 1px solid var(--color-border-subtler, #e3e8ef);\n background: var(--color-surface, #ffffff);\n box-shadow: var(--shadow-lg);\n}\n\n.profile {\n display: flex;\n align-items: flex-start;\n gap: var(--spacing-none);\n border-radius: var(--rounded-none);\n border-bottom: 1px solid var(--color-border-subtler, #e3e8ef); \n padding: 0.5rem;\n flex: 1;\n width: 100%;\n box-sizing: border-box;\n}\n\n.complex-dropdown {\n width: 17rem;\n display: flex;\n padding: 0px;\n flex-direction: column;\n align-items: flex-start;\n gap: 0px;\n border-radius: var(--rounded-sm);\n border: 1px solid var(--color-border-subtler, #e3e8ef);\n background: var(--color-surface, #ffffff);\n box-shadow: var(--shadow-lg);\n}\n\n.menu-items {\n display: flex;\n width: 100%;\n padding: var(--spacing-none);\n flex-direction: column;\n align-items: flex-start;\n gap: var(--spacing-none);\n}\n\n.list {\n padding: var(--spacing-1) var(--spacing-none);\n align-self: stretch;\n border-radius: var(--rounded-none);\n}\n\n.list-group-one,\n.list-group-two,\n.list-group-three {\n width: 100%;\n padding: var(--spacing-1) var(--spacing-none);\n}\n\n.list-group-one,\n.list-group-two {\n border-bottom: 1px solid var(--color-border-subtler, #e3e8ef);\n}\n\n.item {\n width: 100%;\n}\n\n.label_group {\n display: flex;\n padding: 0px;\n align-items: center;\n gap: 12px;\n align-self: stretch;\n border-radius: var(--rounded-none);\n}\n\n.theme_tab {\n width: 100%;\n box-sizing: border-box;\n padding: var(--spacing-3);\n border-bottom: 1px solid var(--color-border-subtler, #e3e8ef);\n}\n\n.roles {\n width: 100%;\n display: flex;\n padding: var(--spacing-3);\n gap: var(--spacing-2);\n flex-direction: column;\n align-items: flex-start;\n border-bottom: 1px solid var(--color-border-subtler, #e3e8ef);\n color: var(--color-text, #4b5565);\n box-sizing: border-box;\n}\n\n.badges {\n width: 90%;\n display: flex;\n align-items: center;\n align-content: center;\n gap: 0.5rem var(--spacing-2);\n align-self: stretch;\n flex-wrap: wrap;\n}","import { Component, Element, Event, EventEmitter, Prop, h } from '@stencil/core';\nimport { ColorTypes, DropdownListGroup, DropdownRoles, ThemeTypes } from '../../models/reusableModels';\n@Component({\n tag: 'gb-avatar-dropdown',\n styleUrl: 'gb-avatar-dropdown.css',\n shadow: true,\n})\nexport class GbAvatarDropdown {\n @Prop() type: 'simple' \| 'complex' = 'simple';\n @Prop() text: boolean = false;\n @Prop() showProfile: boolean;\n\n @Prop() showThemeTab: boolean;\n @Prop() showRoles: boolean = false;\n @Prop() roles: DropdownRoles[] = [\n // {\n // badgeLabel: 'Initiator',\n // badgeColor: 'information',\n // badgeType: 'badge_color',\n // },\n // {\n // badgeLabel: 'Authorizer',\n // badgeColor: 'success',\n // badgeType: 'badge_color',\n // },\n // {\n // badgeLabel: 'Viewer',\n // badgeColor: 'gray',\n // badgeType: 'badge_color',\n // },\n ];\n @Prop() showLogOut: boolean;\n @Prop() listGroupOne: DropdownListGroup[] = [\n // { label: 'View Profile', icon: 'assets/user.svg', shortcut: 'Ctrl K + P' },\n // { label: 'Documentation', icon: 'assets/book-open-02.svg', shortcut: 'Ctrl + T' },\n // { label: 'Support', icon: 'assets/customer-support.svg', shortcut: 'Ctrl + C' },\n ];\n @Prop() listGroupTwo: DropdownListGroup[] = [\n // { label: 'Configuration', icon: 'assets/user.svg', shortcut: 'Ctrl + S' },\n // { label: 'Team', icon: 'assets/book-open-02.svg', shortcut: 'Ctrl K + T' },\n // { label: 'Invite members', icon: 'assets/customer-support.svg', shortcut: 'Ctrl + I' },\n ];\n @Prop() color: ColorTypes;\n @Prop() showBorder: boolean = false;\n @Prop() currentTheme: ThemeTypes;\n @Element() el: HTMLElement;\n @Event() itemClicked: EventEmitter<string>;\n @Event() themeTabClicked: EventEmitter<string>;\n\n applyColorToInitials() {\n switch (this.color) {\n case 'gray':\n return 'gray';\n case 'blue':\n return 'blue';\n case 'cyan':\n return 'cyan';\n case 'pink':\n return 'pink';\n case 'purple':\n return 'purple';\n case 'green':\n return 'green';\n case 'yellow':\n return 'yellow';\n }\n }\n\n onItemClicked(item: string) {\n this.itemClicked.emit(item);\n }\n\n emitTheme(theme) {\n this.themeTabClicked.emit(theme);\n }\n\n componentDidLoad() {\n const slottedInitials = this.el.querySelector('[slot=\"initials\"]');\n const nameInitials = this.el.querySelector('[slot=\"name\"');\n const supportingTextSlot = this.el.querySelector('[slot=\"supporting_text\"');\n\n if (slottedInitials) {\n slottedInitials.classList.add('text-md-semi-bold');\n slottedInitials.classList.add(this.applyColorToInitials() \|\| 'gray');\n }\n\n if (nameInitials) {\n nameInitials.classList.add('text-sm-semi-bold');\n }\n\n if (supportingTextSlot) {\n supportingTextSlot.classList.add('text-sm-regular');\n }\n }\n\n render() {\n if (this.type === 'simple') {\n return (\n <div class=\"simple-dropdown\">\n <div class=\"profile\">\n <gb-avatar-label-group size=\"md\" text={true} color={this.color} show-border={this.showBorder}>\n <slot name=\"name\" slot=\"name\"></slot>\n <slot name=\"initials\" slot=\"initials\"></slot>\n <slot name=\"supporting_text\" slot=\"supporting_text\"></slot>\n </gb-avatar-label-group>\n </div>\n <div class=\"menu-items\">\n <div class=\"list\">\n {this.showThemeTab && (\n <div class=\"theme_tab\">\n <gb-theme-tab current-active-tab={this.currentTheme} onThemeTabClicked={this.emitTheme.bind(this)}></gb-theme-tab>\n </div>\n )}\n {this.showProfile && (\n <gb-dropdown-items-with-shortcut\n icon\n iconSrc=\"assets/user_profile.svg\"\n label=\"View Profile\"\n shortcut\n shortcutIcon=\"K + P\"\n onClick={() => this.onItemClicked('view_profile')}\n ></gb-dropdown-items-with-shortcut>\n )}\n {this.showLogOut && (\n <gb-dropdown-items-with-shortcut\n icon\n iconSrc=\"assets/logout_button.svg\"\n label=\"Log out\"\n shortcut\n shortcutIcon=\"L\"\n onClick={() => this.onItemClicked('log_out')}\n ></gb-dropdown-items-with-shortcut>\n )}\n </div>\n </div>\n </div>\n );\n }\n\n if (this.type === 'complex') {\n return (\n <div class=\"complex-dropdown\">\n <div class=\"profile\">\n <gb-avatar-label-group size=\"md\" class=\"label_group\" text={true} color={this.color}>\n <slot name=\"name\" slot=\"name\"></slot>\n <slot name=\"initials\" slot=\"initials\"></slot>\n <slot name=\"supporting_text\" slot=\"supporting_text\"></slot>\n </gb-avatar-label-group>\n </div>\n {this.showThemeTab && (\n <div class=\"theme_tab\">\n <gb-theme-tab current-active-tab={this.currentTheme} onThemeTabClicked={this.emitTheme.bind(this)}></gb-theme-tab>\n </div>\n )}\n {this.showRoles && (\n <div class=\"roles\">\n <p class=\"text-sm-medium\">Available roles</p>\n <div class=\"badges\">\n {this.roles.map(role => (\n <gb-badge size=\"md\" color={role.badgeColor} type={role.badgeType}>\n <p>{role.badgeLabel}</p>\n </gb-badge>\n ))}\n </div>\n </div>\n )}\n {this.listGroupOne.length > 0 && (\n <div class=\"list-group-one\">\n {this.listGroupOne.map(item => (\n <div class=\"item\">\n <gb-dropdown-items-with-shortcut\n icon\n iconSrc={item.icon}\n label={item.label}\n shortcut\n shortcutIcon={item.shortcut}\n onClick={() => this.onItemClicked(item.label.replace(/\\s+/g, '_').toLowerCase())}\n ></gb-dropdown-items-with-shortcut>\n </div>\n ))}\n </div>\n )}\n {this.listGroupTwo.length > 0 && (\n <div class=\"list-group-two\">\n {this.listGroupTwo.map(item => (\n <div class=\"item\">\n <gb-dropdown-items-with-shortcut\n icon\n iconSrc={item.icon}\n label={item.label}\n shortcut\n shortcutIcon={item.shortcut}\n onClick={() => this.onItemClicked(item.label.replace(/\\s+/g, '_').toLowerCase())}\n ></gb-dropdown-items-with-shortcut>\n </div>\n ))}\n </div>\n )}\n {this.showLogOut && (\n <div class=\"list-group-three\">\n <div class=\"item\">\n <gb-dropdown-items-with-shortcut\n icon\n iconSrc=\"assets/logout_button.svg\"\n label=\"Log out\"\n shortcut\n shortcutIcon=\"Ctrl + L\"\n onClick={() => this.onItemClicked('log_out')}\n ></gb-dropdown-items-with-shortcut>\n </div>\n </div>\n )}\n </div>\n );\n }\n }\n}\n"],"version":3}

package/dist/components/{p-BHhON5Dd.js → p-C10cSQmz.js} RENAMED Viewed

@@ -2,13 +2,13 @@ import { p as proxyCustomElement, H, c as createEvent, h, F as Fragment } from '
 import { d as defineCustomElement$k } from './p-D6yceV_k.js';
 import { d as defineCustomElement$j } from './p-DhmmSqYS.js';
 import { d as defineCustomElement$i } from './p-5znPazO0.js';
-import { d as defineCustomElement$h } from './p-eVx9Cuj0.js';
-import { d as defineCustomElement$g } from './p-BEwtnG4L.js';
+import { d as defineCustomElement$h } from './p-OVoS3dKe.js';
+import { d as defineCustomElement$g } from './p-BE9pk1IO.js';
 import { d as defineCustomElement$f } from './p-B0f4vN6R.js';
 import { d as defineCustomElement$e } from './p-CkumhKF1.js';
-import { d as defineCustomElement$d } from './p-D1YtnYlP.js';
-import { d as defineCustomElement$c } from './p-wSX9ESyM.js';
-import { d as defineCustomElement$b } from './p-CbeOCjT9.js';
+import { d as defineCustomElement$d } from './p-Ch81iN03.js';
+import { d as defineCustomElement$c } from './p-CXWQ1FqP.js';
+import { d as defineCustomElement$b } from './p-ChBzZFWB.js';
 import { d as defineCustomElement$a } from './p-OIdysSPW.js';
 import { d as defineCustomElement$9 } from './p-sMNy0Dje.js';
 import { d as defineCustomElement$8 } from './p-DzVNtOEw.js';
@@ -250,6 +250,6 @@ function defineCustomElement() {
 defineCustomElement();
 export { GbPagination as G, defineCustomElement as d };
-//# sourceMappingURL=p-BHhON5Dd.js.map
+//# sourceMappingURL=p-C10cSQmz.js.map
-//# sourceMappingURL=p-BHhON5Dd.js.map
+//# sourceMappingURL=p-C10cSQmz.js.map