smart-webcomponents
Version:
Web Components & Custom Elements for Professional Web Applications
2 lines • 619 kB
JavaScript
/*! For license information please see smart.ui.multicomboinput.js.LICENSE.txt */
(()=>{var t={2989:(t,e,n)=>{"use strict";n.d(e,{A:()=>s});var r=n(1601),o=n.n(r),a=n(6314),i=n.n(a)()(o());i.push([t.id,"/* smart-button, smart-repeat-button, smart-toggle-button */\nsmart-button,\nsmart-toggle-button,\nsmart-repeat-button,\n.smart-button-element {\n --smart-button-flat-color: var(--smart-background-color);\n text-align: center;\n display: inline-flex;\n vertical-align: middle;\n cursor: pointer;\n text-transform: var(--smart-button-text-transform);\n letter-spacing: 0.08929em;\n overflow: hidden;\n border-color: var(--smart-border);\n border-top-left-radius: var(--smart-border-top-left-radius);\n border-top-right-radius: var(--smart-border-top-right-radius);\n border-bottom-left-radius: var(--smart-border-bottom-left-radius);\n border-bottom-right-radius: var(--smart-border-bottom-right-radius);\n border-width: var(--smart-border-width);\n border-style: solid;\n visibility: hidden;\n font-weight: 500;\n}\nsmart-button.smart-element,\nsmart-toggle-button.smart-element,\nsmart-repeat-button.smart-element,\n.smart-button-element.smart-element {\n display: inline-flex;\n visibility: inherit;\n}\nsmart-button button::-moz-focus-inner,\nsmart-toggle-button button::-moz-focus-inner,\nsmart-repeat-button button::-moz-focus-inner,\n.smart-button-element button::-moz-focus-inner {\n border: 0;\n}\nsmart-button.primary,\nsmart-toggle-button.primary,\nsmart-repeat-button.primary,\n.smart-button-element.primary {\n --smart-button-opacity-hover: 0.75;\n --smart-button-opacity-focus: 0.7;\n --smart-button-opacity-active: 0.65;\n --smart-background: var(--smart-primary);\n --smart-border: var(--smart-primary);\n --smart-border-rgb: var(--smart-primary-rgb);\n --smart-background-color: var(--smart-primary-color);\n --smart-ui-state-hover: var(--smart-primary);\n --smart-ui-state-border-hover: var(--smart-primary);\n --smart-ui-state-color-hover: var(--smart-primary-color);\n --smart-ui-state-active: var(--smart-primary);\n --smart-ui-state-border-active: var(--smart-primary);\n --smart-ui-state-color-active: var(--smart-primary-color);\n --smart-ui-state-focus: var(--smart-primary);\n --smart-ui-state-border-focus: var(--smart-primary);\n --smart-ui-state-color-focus: var(--smart-primary-color);\n --smart-button-flat-color: var(--smart-primary);\n --smart-button-outlined-color: var(--smart-primary);\n --smart-button-outlined-border: var(--smart-primary);\n}\nsmart-button.secondary,\nsmart-toggle-button.secondary,\nsmart-repeat-button.secondary,\n.smart-button-element.secondary {\n --smart-button-opacity-hover: 0.75;\n --smart-button-opacity-focus: 0.7;\n --smart-button-opacity-active: 0.65;\n --smart-background: var(--smart-secondary);\n --smart-border: var(--smart-secondary);\n --smart-border-rgb: var(--smart-secondary-rgb);\n --smart-background-color: var(--smart-secondary-color);\n --smart-ui-state-hover: var(--smart-secondary);\n --smart-ui-state-border-hover: var(--smart-secondary);\n --smart-ui-state-color-hover: var(--smart-secondary-color);\n --smart-ui-state-active: var(--smart-secondary);\n --smart-ui-state-border-active: var(--smart-secondary);\n --smart-ui-state-color-active: var(--smart-secondary-color);\n --smart-ui-state-focus: var(--smart-secondary);\n --smart-ui-state-border-focus: var(--smart-secondary);\n --smart-ui-state-color-focus: var(--smart-secondary-color);\n --smart-button-flat-color: var(--smart-secondary);\n --smart-button-outlined-color: var(--smart-secondary);\n --smart-button-outlined-border: var(--smart-secondary);\n}\nsmart-button.success,\nsmart-toggle-button.success,\nsmart-repeat-button.success,\n.smart-button-element.success {\n --smart-button-opacity-hover: 0.75;\n --smart-button-opacity-focus: 0.7;\n --smart-button-opacity-active: 0.65;\n --smart-background: var(--smart-success);\n --smart-border: var(--smart-success);\n --smart-border-rgb: var(--smart-success-rgb);\n --smart-background-color: var(--smart-success-color);\n --smart-ui-state-hover: var(--smart-success);\n --smart-ui-state-border-hover: var(--smart-success);\n --smart-ui-state-color-hover: var(--smart-success-color);\n --smart-ui-state-active: var(--smart-success);\n --smart-ui-state-border-active: var(--smart-success);\n --smart-ui-state-color-active: var(--smart-success-color);\n --smart-ui-state-focus: var(--smart-success);\n --smart-ui-state-border-focus: var(--smart-success);\n --smart-ui-state-color-focus: var(--smart-success-color);\n --smart-button-flat-color: var(--smart-success);\n --smart-button-outlined-color: var(--smart-success);\n --smart-button-outlined-border: var(--smart-success);\n}\nsmart-button.error,\nsmart-toggle-button.error,\nsmart-repeat-button.error,\n.smart-button-element.error {\n --smart-button-opacity-hover: 0.75;\n --smart-button-opacity-focus: 0.7;\n --smart-button-opacity-active: 0.65;\n --smart-background: var(--smart-error);\n --smart-border: var(--smart-error);\n --smart-border-rgb: var(--smart-error-rgb);\n --smart-background-color: var(--smart-error-color);\n --smart-ui-state-hover: var(--smart-error);\n --smart-ui-state-border-hover: var(--smart-error);\n --smart-ui-state-color-hover: var(--smart-error-color);\n --smart-ui-state-active: var(--smart-error);\n --smart-ui-state-border-active: var(--smart-error);\n --smart-ui-state-color-active: var(--smart-error-color);\n --smart-ui-state-focus: var(--smart-error);\n --smart-ui-state-border-focus: var(--smart-error);\n --smart-ui-state-color-focus: var(--smart-error-color);\n --smart-button-flat-color: var(--smart-error);\n --smart-button-outlined-color: var(--smart-error);\n --smart-button-outlined-border: var(--smart-error);\n}\nsmart-button.info,\nsmart-toggle-button.info,\nsmart-repeat-button.info,\n.smart-button-element.info {\n --smart-button-opacity-hover: 0.75;\n --smart-button-opacity-focus: 0.7;\n --smart-button-opacity-active: 0.65;\n --smart-background: var(--smart-info);\n --smart-border: var(--smart-info);\n --smart-border-rgb: var(--smart-info-rgb);\n --smart-background-color: var(--smart-info-color);\n --smart-ui-state-hover: var(--smart-info);\n --smart-ui-state-border-hover: var(--smart-info);\n --smart-ui-state-color-hover: var(--smart-info-color);\n --smart-ui-state-active: var(--smart-info);\n --smart-ui-state-border-active: var(--smart-info);\n --smart-ui-state-color-active: var(--smart-info-color);\n --smart-ui-state-focus: var(--smart-info);\n --smart-ui-state-border-focus: var(--smart-info);\n --smart-ui-state-color-focus: var(--smart-info-color);\n --smart-button-flat-color: var(--smart-info);\n --smart-button-outlined-color: var(--smart-info);\n --smart-button-outlined-border: var(--smart-info);\n}\nsmart-button.warning,\nsmart-toggle-button.warning,\nsmart-repeat-button.warning,\n.smart-button-element.warning {\n --smart-button-opacity-hover: 0.75;\n --smart-button-opacity-focus: 0.7;\n --smart-button-opacity-active: 0.65;\n --smart-background: var(--smart-warning);\n --smart-border: var(--smart-warning);\n --smart-border-rgb: var(--smart-warning-rgb);\n --smart-background-color: var(--smart-warning-color);\n --smart-ui-state-hover: var(--smart-warning);\n --smart-ui-state-border-hover: var(--smart-warning);\n --smart-ui-state-color-hover: var(--smart-warning-color);\n --smart-ui-state-active: var(--smart-warning);\n --smart-ui-state-border-active: var(--smart-warning);\n --smart-ui-state-color-active: var(--smart-warning-color);\n --smart-ui-state-focus: var(--smart-warning);\n --smart-ui-state-border-focus: var(--smart-warning);\n --smart-ui-state-color-focus: var(--smart-warning-color);\n --smart-button-flat-color: var(--smart-warning);\n --smart-button-outlined-color: var(--smart-warning);\n --smart-button-outlined-border: var(--smart-warning);\n}\nsmart-button.light,\nsmart-toggle-button.light,\nsmart-repeat-button.light,\n.smart-button-element.light {\n --smart-button-opacity-hover: 0.75;\n --smart-button-opacity-focus: 0.7;\n --smart-button-opacity-active: 0.65;\n --smart-background: var(--smart-light);\n --smart-border: var(--smart-light);\n --smart-border-rgb: var(--smart-light-rgb);\n --smart-background-color: var(--smart-light-color);\n --smart-ui-state-hover: var(--smart-light);\n --smart-ui-state-border-hover: var(--smart-light);\n --smart-ui-state-color-hover: var(--smart-light-color);\n --smart-ui-state-active: var(--smart-light);\n --smart-ui-state-border-active: var(--smart-light);\n --smart-ui-state-color-active: var(--smart-light-color);\n --smart-ui-state-focus: var(--smart-light);\n --smart-ui-state-border-focus: var(--smart-light);\n --smart-ui-state-color-focus: var(--smart-light-color);\n --smart-button-flat-color: var(--smart-light);\n --smart-button-outlined-color: var(--smart-light);\n --smart-button-outlined-border: var(--smart-light);\n}\nsmart-button.dark,\nsmart-toggle-button.dark,\nsmart-repeat-button.dark,\n.smart-button-element.dark {\n --smart-button-opacity-hover: 0.75;\n --smart-button-opacity-focus: 0.7;\n --smart-button-opacity-active: 0.65;\n --smart-background: var(--smart-dark);\n --smart-border: var(--smart-dark);\n --smart-border-rgb: var(--smart-dark-rgb);\n --smart-background-color: var(--smart-dark-color);\n --smart-ui-state-hover: var(--smart-dark);\n --smart-ui-state-border-hover: var(--smart-dark);\n --smart-ui-state-color-hover: var(--smart-dark-color);\n --smart-ui-state-active: var(--smart-dark);\n --smart-ui-state-border-active: var(--smart-dark);\n --smart-ui-state-color-active: var(--smart-dark-color);\n --smart-ui-state-focus: var(--smart-dark);\n --smart-ui-state-border-focus: var(--smart-dark);\n --smart-ui-state-color-focus: var(--smart-dark-color);\n --smart-button-flat-color: var(--smart-dark);\n --smart-button-outlined-color: var(--smart-dark);\n --smart-button-outlined-border: var(--smart-dark);\n}\nsmart-button[hover],\nsmart-toggle-button[hover],\nsmart-repeat-button[hover],\n.smart-button-element[hover] {\n color: var(--smart-ui-state-color-hover);\n border-color: var(--smart-ui-state-border-hover);\n background-color: var(--smart-ui-state-hover);\n transition: background-color 100ms linear, box-shadow 280ms ease-in-out;\n opacity: var(--smart-button-opacity-hover);\n}\nsmart-button[focus],\nsmart-toggle-button[focus],\nsmart-repeat-button[focus],\n.smart-button-element[focus] {\n color: var(--smart-ui-state-color-focus);\n border-color: var(--smart-ui-state-border-focus);\n background-color: var(--smart-ui-state-focus);\n opacity: var(--smart-button-opacity-focus);\n}\nsmart-button[active],\nsmart-toggle-button[active],\nsmart-repeat-button[active],\n.smart-button-element[active] {\n color: var(--smart-ui-state-color-active);\n border-color: var(--smart-ui-state-border-active);\n background-color: var(--smart-ui-state-active);\n transition: background-color 100ms linear, box-shadow 280ms ease-in-out;\n opacity: var(--smart-button-opacity-active);\n}\nsmart-button[disabled],\nsmart-toggle-button[disabled],\nsmart-repeat-button[disabled],\n.smart-button-element[disabled] {\n color: var(--smart-disabled-color);\n border-color: var(--smart-disabled);\n background-color: var(--smart-disabled);\n cursor: default;\n --smart-background: var(--smart-disabled);\n --smart-border: var(--smart-disabled);\n --smart-background-color: var(--smart-disabled-color);\n}\nsmart-button.large button,\nsmart-toggle-button.large button,\nsmart-repeat-button.large button,\n.smart-button-element.large button {\n padding: var(--smart-button-large-padding);\n font-size: var(--smart-button-large-font-size);\n}\nsmart-button.small button,\nsmart-toggle-button.small button,\nsmart-repeat-button.small button,\n.smart-button-element.small button {\n padding: var(--smart-button-small-padding);\n font-size: var(--smart-button-small-font-size);\n}\nsmart-button.very-small button,\nsmart-toggle-button.very-small button,\nsmart-repeat-button.very-small button,\n.smart-button-element.very-small button {\n padding: var(--smart-button-very-small-padding);\n font-size: var(--smart-button-very-small-font-size);\n}\nsmart-button.rounded,\nsmart-toggle-button.rounded,\nsmart-repeat-button.rounded,\n.smart-button-element.rounded {\n --smart-border-top-left-radius: 50px;\n --smart-border-top-right-radius: 50px;\n --smart-border-bottom-left-radius: 50px;\n --smart-border-bottom-right-radius: 50px;\n border-radius: var(--smart-border-bottom-left-radius) !important;\n}\nsmart-button.squared,\nsmart-toggle-button.squared,\nsmart-repeat-button.squared,\n.smart-button-element.squared {\n --smart-border-top-left-radius: 0;\n --smart-border-top-right-radius: 0;\n --smart-border-bottom-left-radius: 0;\n --smart-border-bottom-right-radius: 0;\n}\nsmart-button.flat,\nsmart-toggle-button.flat,\nsmart-repeat-button.flat,\n.smart-button-element.flat {\n color: var(--smart-button-flat-color);\n background: transparent;\n border-color: transparent;\n}\nsmart-button.flat[hover],\nsmart-toggle-button.flat[hover],\nsmart-repeat-button.flat[hover],\n.smart-button-element.flat[hover] {\n color: var(--smart-button-flat-color);\n background: transparent;\n border-color: transparent;\n}\nsmart-button.flat[active],\nsmart-toggle-button.flat[active],\nsmart-repeat-button.flat[active],\n.smart-button-element.flat[active] {\n color: var(--smart-button-flat-color);\n background: transparent;\n border-color: transparent;\n}\nsmart-button.flat[focus],\nsmart-toggle-button.flat[focus],\nsmart-repeat-button.flat[focus],\n.smart-button-element.flat[focus] {\n border-color: var(--smart-ui-state-focus);\n}\nsmart-button.flat[checked],\nsmart-toggle-button.flat[checked],\nsmart-repeat-button.flat[checked],\n.smart-button-element.flat[checked] {\n text-decoration: underline;\n background: var(--smart-ui-state-active);\n}\nsmart-button.flat .smart-ripple,\nsmart-toggle-button.flat .smart-ripple,\nsmart-repeat-button.flat .smart-ripple,\n.smart-button-element.flat .smart-ripple {\n background-color: var(--smart-button-flat-color);\n}\nsmart-button.outlined,\nsmart-toggle-button.outlined,\nsmart-repeat-button.outlined,\n.smart-button-element.outlined {\n color: var(--smart-button-outlined-color);\n border-color: var(--smart-button-outlined-border);\n background: transparent;\n border-width: calc(2 * var(--smart-border-width));\n}\nsmart-button.outlined[hover],\nsmart-toggle-button.outlined[hover],\nsmart-repeat-button.outlined[hover],\n.smart-button-element.outlined[hover] {\n color: var(--smart-button-outlined-color);\n border-color: var(--smart-button-outlined-border);\n background: transparent;\n}\nsmart-button.outlined[active],\nsmart-toggle-button.outlined[active],\nsmart-repeat-button.outlined[active],\n.smart-button-element.outlined[active] {\n color: var(--smart-button-outlined-color);\n border-color: var(--smart-button-outlined-border);\n background: transparent;\n}\nsmart-button.outlined[focus],\nsmart-toggle-button.outlined[focus],\nsmart-repeat-button.outlined[focus],\n.smart-button-element.outlined[focus] {\n color: var(--smart-button-outlined-color);\n border-color: var(--smart-ui-state-focus);\n background: transparent;\n}\nsmart-button.outlined[checked],\nsmart-toggle-button.outlined[checked],\nsmart-repeat-button.outlined[checked],\n.smart-button-element.outlined[checked] {\n color: var(--smart-ui-state-color-active);\n border-color: var(--smart-ui-state-active);\n background: var(--smart-ui-state-active);\n}\nsmart-button.outlined .smart-ripple,\nsmart-toggle-button.outlined .smart-ripple,\nsmart-repeat-button.outlined .smart-ripple,\n.smart-button-element.outlined .smart-ripple {\n background-color: var(--smart-button-outlined-color);\n}\nsmart-button.outlined button.smart-button,\nsmart-toggle-button.outlined button.smart-button,\nsmart-repeat-button.outlined button.smart-button,\n.smart-button-element.outlined button.smart-button {\n border-radius: initial;\n}\nsmart-button.raised,\nsmart-toggle-button.raised,\nsmart-repeat-button.raised,\n.smart-button-element.raised {\n box-shadow: var(--smart-elevation-2);\n transition: background-color 100ms linear, box-shadow 280ms ease-in-out;\n}\nsmart-button.raised[hover],\nsmart-toggle-button.raised[hover],\nsmart-repeat-button.raised[hover],\n.smart-button-element.raised[hover] {\n box-shadow: var(--smart-elevation-4);\n}\nsmart-button.raised[active], smart-button.raised[checked], smart-button.raised[active],\nsmart-button.raised button[active],\nsmart-toggle-button.raised[active],\nsmart-toggle-button.raised[checked],\nsmart-toggle-button.raised[active],\nsmart-toggle-button.raised button[active],\nsmart-repeat-button.raised[active],\nsmart-repeat-button.raised[checked],\nsmart-repeat-button.raised[active],\nsmart-repeat-button.raised button[active],\n.smart-button-element.raised[active],\n.smart-button-element.raised[checked],\n.smart-button-element.raised[active],\n.smart-button-element.raised button[active] {\n box-shadow: var(--smart-elevation-8);\n}\nsmart-button.raised[focus], smart-button.raised[focus]:not([checked]),\nsmart-toggle-button.raised[focus],\nsmart-toggle-button.raised[focus]:not([checked]),\nsmart-repeat-button.raised[focus],\nsmart-repeat-button.raised[focus]:not([checked]),\n.smart-button-element.raised[focus],\n.smart-button-element.raised[focus]:not([checked]) {\n box-shadow: var(--smart-elevation-6);\n}\nsmart-button.floating,\nsmart-toggle-button.floating,\nsmart-repeat-button.floating,\n.smart-button-element.floating {\n border-radius: 50%;\n width: 48px;\n height: 48px;\n box-shadow: var(--smart-elevation-4);\n transition: background-color 100ms linear, box-shadow 280ms ease-in-out;\n}\nsmart-button.floating[hover],\nsmart-toggle-button.floating[hover],\nsmart-repeat-button.floating[hover],\n.smart-button-element.floating[hover] {\n box-shadow: var(--smart-elevation-6);\n}\nsmart-button.floating[active], smart-button.floating[checked],\nsmart-toggle-button.floating[active],\nsmart-toggle-button.floating[checked],\nsmart-repeat-button.floating[active],\nsmart-repeat-button.floating[checked],\n.smart-button-element.floating[active],\n.smart-button-element.floating[checked] {\n box-shadow: var(--smart-elevation-12);\n}\nsmart-button.floating[focus], smart-button.floating[focus]:not([checked]),\nsmart-toggle-button.floating[focus],\nsmart-toggle-button.floating[focus]:not([checked]),\nsmart-repeat-button.floating[focus],\nsmart-repeat-button.floating[focus]:not([checked]),\n.smart-button-element.floating[focus],\n.smart-button-element.floating[focus]:not([checked]) {\n box-shadow: var(--smart-elevation-6);\n}\n\nbutton.smart-button {\n position: relative;\n padding: var(--smart-button-padding);\n text-align: inherit;\n vertical-align: inherit;\n cursor: inherit;\n text-transform: inherit;\n font-weight: inherit;\n letter-spacing: inherit;\n background: inherit;\n color: inherit;\n border: none;\n -webkit-font-smoothing: antialiased;\n opacity: var(--smart-button-opacity);\n white-space: nowrap;\n border-radius: inherit;\n}\n\n.smart-button .smart-ripple {\n background: var(--smart-background-color);\n}\n\nsmart-toggle-button .smart-container,\n[smart-toggle-button] .smart-container {\n font-weight: inherit;\n font-style: inherit;\n}\nsmart-toggle-button[checked],\n[smart-toggle-button][checked] {\n color: var(--smart-ui-state-color-selected);\n border-color: var(--smart-ui-state-border-selected);\n background-color: var(--smart-ui-state-selected);\n}\n\n.smart-scroll-button .smart-button {\n padding: 0px;\n}\n\n:host(.smart-button.flat) .smart-ripple {\n background-color: var(--smart-button-flat-color);\n}\n\n:host(.smart-button.outlined) .smart-ripple {\n background-color: var(--smart-button-outlined-color);\n}\n\nbutton.smart-button[type]:not(.smart-container) {\n border-color: var(--smart-border);\n border-top-left-radius: var(--smart-border-top-left-radius);\n border-top-right-radius: var(--smart-border-top-right-radius);\n border-bottom-left-radius: var(--smart-border-bottom-left-radius);\n border-bottom-right-radius: var(--smart-border-bottom-right-radius);\n border-width: var(--smart-border-width);\n border-style: solid;\n text-align: center;\n vertical-align: middle;\n cursor: pointer;\n text-transform: var(--smart-button-text-transform);\n font-weight: 500;\n letter-spacing: 0.08929em;\n overflow: hidden;\n font-style: var(--smart-font-style);\n font-size: var(--smart-font-size);\n background: var(--smart-background);\n outline: none;\n}\n\nbutton.smart-button[type]:hover {\n color: var(--smart-ui-state-color-hover);\n border-color: var(--smart-ui-state-border-hover);\n background-color: var(--smart-ui-state-hover);\n}\n\nbutton.smart-button[type]:not([disabled]):active {\n color: var(--smart-ui-state-color-active);\n border-color: var(--smart-ui-state-border-active);\n background-color: var(--smart-ui-state-active);\n}\n\n/* smart-button, smart-repeat-button, smart-toggle-button */\nsmart-button[right-to-left],\nsmart-toggle-button[right-to-left],\nsmart-repeat-button[right-to-left] {\n direction: rtl;\n}",""]);const s=i},2434:(t,e,n)=>{"use strict";n.d(e,{A:()=>s});var r=n(1601),o=n.n(r),a=n(6314),i=n.n(a)()(o());i.push([t.id,'/* all elements */\nsmart-accordion,\nsmart-button,\nsmart-toggle-button,\nsmart-repeat-button,\nsmart-switch-button,\nsmart-slider,\nsmart-led,\nsmart-tank,\nsmart-check-box,\nsmart-calendar,\nsmart-carousel,\nsmart-card,\nsmart-radio-button,\nsmart-progress-bar,\nsmart-circular-progress-bar,\nsmart-scroll-bar,\nsmart-gauge,\nsmart-grid,\nsmart-numeric-text-box,\nsmart-list-box,\nsmart-combo-box,\nsmart-docking-layout,\nsmart-drop-down-list,\nsmart-drop-down-button,\nsmart-multi-split-button,\nsmart-power-button,\nsmart-text-box,\nsmart-multiline-text-box,\nsmart-password-text-box,\nsmart-masked-text-box,\nsmart-tabs,\nsmart-date-time-picker,\nsmart-array,\nsmart-time-picker,\nsmart-menu,\nsmart-list-menu,\nsmart-window,\nsmart-alert-window,\nsmart-prompt-window,\nsmart-multiline-prompt-window,\nsmart-progress-window,\nsmart-tabs-window,\nsmart-dialog-window,\nsmart-pager,\nsmart-progress-window,\nsmart-wait-window,\nsmart-splitter,\nsmart-tree,\nsmart-filter-panel,\nsmart-breadcrumb,\nsmart-color-panel,\nsmart-color-picker,\nsmart-sort-panel,\nsmart-group-panel,\nsmart-column-panel,\nsmart-multi-column-filter-panel,\nsmart-query-builder,\nsmart-card-view,\nsmart-tooltip,\nsmart-layout,\nsmart-path,\nsmart-kanban,\nsmart-gantt-chart,\nsmart-sheduler,\nsmart-pivot-panel {\n padding: 0px;\n margin: 0px;\n overflow: hidden;\n display: block;\n}\n\n.smart-element {\n outline: none;\n box-sizing: border-box;\n font-family: var(--smart-font-family);\n font-size: var(--smart-font-size);\n font-weight: var(--smart-font-weight);\n /* Apple iOS specific browser CSS variable used for area highlighting on click. Reference link for details:\n https://developer.apple.com/library/content/documentation/AppleApplications/Reference/SafariWebContent/AdjustingtheTextSize/AdjustingtheTextSize.html#//apple_ref/doc/uid/TP40006510-SW5 */\n -webkit-tap-highlight-color: transparent;\n background: var(--smart-background);\n color: var(--smart-background-color);\n}\n\n.smart-root {\n width: 100%;\n height: 100%;\n padding: 0;\n margin: 0;\n box-sizing: border-box;\n}\n\nsmart-button[disabled],\nsmart-calendar[disabled],\nsmart-combo-box[disabled],\nsmart-chip[disabled],\nsmart-toggle-button[disabled],\nsmart-repeat-button[disabled],\nsmart-switch-button[disabled],\nsmart-slider[disabled],\nsmart-led[disabled],\nsmart-tank[disabled],\nsmart-check-box[disabled],\nsmart-radio-button[disabled],\nsmart-progress-bar[disabled],\nsmart-circular-progress-bar[disabled],\nsmart-gauge[disabled],\nsmart-grid[disabled],\nsmart-numeric-text-box[disabled],\nsmart-list-item[disabled],\nsmart-list-box[disabled],\nsmart-drop-down-list[disabled],\nsmart-drop-down-button[disabled],\nsmart-multi-split-button[disabled],\nsmart-scroll-bar[disabled],\nsmart-power-button[disabled],\nsmart-text-box[disabled],\nsmart-multiline-text-box[disabled],\nsmart-password-text-box[disabled],\nsmart-tab[disabled],\nsmart-tabs[disabled],\nsmart-time-picker[disabled],\nsmart-menu-item[disabled],\nsmart-menu-items-group[disabled],\nsmart-menu[disabled],\nsmart-list-menu[disabled],\nsmart-window[disabled],\nsmart-dialog-window[disabled],\nsmart-progress-window[disabled],\nsmart-wait-window[disabled],\nsmart-alert-window[disabled],\nsmart-prompt-window[disabled],\nsmart-card[disabled],\nsmart-multiline-prompt-window[disabled],\nsmart-splitter[disabled],\nsmart-tree-item[disabled]>.smart-tree-item-label-container,\nsmart-tree-items-group[disabled]>.smart-tree-item-label-container,\nsmart-tree[disabled],\nsmart-docking-layout[disabled],\nsmart-filter-panel[disabled],\nsmart-breadcrumb[disabled],\nsmart-pager[disabled],\nsmart-pager .smart-pager-button[disabled],\nsmart-color-panel[disabled],\nsmart-color-picker[disabled],\nsmart-input[disabled],\nsmart-check-input[disabled],\nsmart-number-input[disabled],\nsmart-multi-input[disabled],\nsmart-multi-combo-input[disabled],\nsmart-date-input[disabled],\nsmart-time-input[disabled],\nsmart-date-range-input[disabled],\nsmart-password-input[disabled],\nsmart-text-area[disabled],\nsmart-sort-panel[disabled],\nsmart-group-panel[disabled],\nsmart-column-panel[disabled],\nsmart-multi-column-filter-panel[disabled],\nsmart-card-view[disabled],\nsmart-query-builder[disabled],\nsmart-date-time-picker[disabled],\nsmart-layout[disabled],\nsmart-path[disabled],\nsmart-kanban[disabled],\nsmart-gantt[disabled],\nsmart-gantt-chart[disabled],\nsmart-scheduler[disabled],\nsmart-button-group[disabled],\nsmart-table[disabled],\nsmart-pivot-table[disabled],\nsmart-notification-panel[disabled],\nsmart-formatting-panel[disabled],\nsmart-color-input[disabled],\nsmart-editor[disabled] {\n opacity: 0.55;\n cursor: default;\n pointer-events: none;\n user-select: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n}\n\nsmart-accordion,\nsmart-calendar,\nsmart-card-view,\nsmart-button,\nsmart-color-panel,\nsmart-docking-layout,\nsmart-date-time-picker,\nsmart-gantt-chart,\nsmart-scheduler,\nsmart-grid,\nsmart-menu,\nsmart-list-menu,\nsmart-list-box,\nsmart-scroll-viewer,\nsmart-progress-bar,\nsmart-pager,\nsmart-splitter,\nsmart-tank,\nsmart-time-picker,\nsmart-tree,\nsmart-text-box,\nsmart-multiline-text-box,\nsmart-layout,\n.smart-window,\nsmart-kanban,\nsmart-sort-panel,\nsmart-button-group,\nsmart-group-panel,\nsmart-column-panel,\nsmart-multi-column-filter-panel,\nsmart-formatting-panel {\n border-color: var(--smart-border);\n border-top-left-radius: var(--smart-border-top-left-radius);\n border-top-right-radius: var(--smart-border-top-right-radius);\n border-bottom-left-radius: var(--smart-border-bottom-left-radius);\n border-bottom-right-radius: var(--smart-border-bottom-right-radius);\n border-width: var(--smart-border-width);\n border-style: solid;\n}\n\nsmart-numeric-text-box.smart-element,\nsmart-masked-text-box.smart-element,\nsmart-multiline-text-box.smart-element,\nsmart-text-box.smart-element,\nsmart-drop-down-button.smart-element,\nsmart-drop-down-list.smart-element,\nsmart-combo-box.smart-element,\nsmart-password-text-box.smart-element,\nsmart-multi-split-button.smart-element,\nsmart-switch-button.smart-element,\nsmart-multiline-text-box.smart-element,\nsmart-date-time-picker.smart-element,\nsmart-pager.smart-element,\nsmart-menu.smart-element,\nsmart-menu.smart-element,\nsmart-numeric-text-box.smart-element,\nsmart-tabs.smart-element,\nsmart-tank.smart-element,\nsmart-slider.smart-element,\nsmart-filter-panel.smart-element,\nsmart-color-panel.smart-element,\nsmart-color-picker.smart-element,\nsmart-query-builder.smart-element,\nsmart-card-view.smart-element,\nsmart-path.smart-element,\nsmart-kanban.smart-element {\n overflow: visible;\n}\n\n.smart-disabled {\n opacity: 0.55;\n cursor: default;\n pointer-events: none;\n user-select: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n}\n\n/*\n Common code for Box Components with Content and Action buttons.\n*/\n.smart-element input::selection,\n.smart-input::selection {\n background: var(--smart-editor-selection);\n color: var(--smart-editor-selection-color);\n}\n\n/* Style for standard HTML scrollbars when dark theme is applied (limited browser support) */\n@media (hover: hover) {\n\n body[theme="dark"],\n .smart-element[theme="dark"] {\n scrollbar-color: var(--smart-scroll-bar-thumb-background) var(--smart-scroll-bar-track-background);\n }\n\n body[theme="dark"]::-webkit-scrollbar,\n body[theme="dark"] ::-webkit-scrollbar {\n background-color: var(--smart-background);\n }\n\n body[theme="dark"]::-webkit-scrollbar-track,\n body[theme="dark"] ::-webkit-scrollbar-track,\n body[theme="dark"]::-webkit-scrollbar-track-piece,\n body[theme="dark"] ::-webkit-scrollbar-track-piece {\n background-color: var(--smart-scroll-bar-track-background);\n }\n\n body[theme="dark"]::-webkit-scrollbar-thumb,\n body[theme="dark"] ::-webkit-scrollbar-thumb {\n border: 1px solid var(--smart-scroll-bar-thumb-border);\n background-color: var(--smart-scroll-bar-thumb-background);\n }\n\n body[theme="dark"]::-webkit-scrollbar-thumb:hover,\n body[theme="dark"] ::-webkit-scrollbar-thumb:hover {\n border-color: var(--smart-scroll-bar-thumb-border-hover);\n background-color: var(--smart-scroll-bar-thumb-background-hover);\n }\n\n body[theme="dark"]::-webkit-scrollbar-button,\n body[theme="dark"] ::-webkit-scrollbar-button {\n background-color: var(--smart-scroll-bar-button-background);\n }\n}',""]);const s=i},6066:(t,e,n)=>{"use strict";n.d(e,{A:()=>s});var r=n(1601),o=n.n(r),a=n(6314),i=n.n(a)()(o());i.push([t.id,'.smart-drop-down-box {\n background: var(--smart-surface);\n border-color: var(--smart-border);\n border-top-left-radius: var(--smart-border-top-left-radius);\n border-bottom-left-radius: var(--smart-border-bottom-left-radius);\n border-top-right-radius: var(--smart-border-top-right-radius);\n border-bottom-right-radius: var(--smart-border-bottom-right-radius);\n overflow: initial;\n font-family: var(--smart-font-family);\n font-size: var(--smart-font-size);\n outline: none;\n height: var(--smart-editor-height);\n}\n.smart-drop-down-box > .smart-container, .smart-drop-down-box.smart-container {\n display: flex;\n position: relative;\n align-items: center;\n}\n.smart-drop-down-box > .smart-container > .smart-content, .smart-drop-down-box.smart-container > .smart-content {\n position: relative;\n display: flex;\n width: 100%;\n height: 100%;\n}\n.smart-drop-down-box .smart-buttons-container {\n width: inherit;\n height: inherit;\n display: inherit;\n flex-direction: inherit;\n cursor: inherit;\n position: inherit;\n overflow: hidden;\n min-height: inherit;\n}\n.smart-drop-down-box .smart-action-button {\n display: flex;\n padding-left: var(--smart-editor-label-padding);\n align-content: center;\n outline: 1px solid transparent;\n height: 100%;\n width: calc(100% - var(--smart-editor-addon-width));\n flex-wrap: wrap;\n overflow: hidden;\n position: relative;\n border-style: solid;\n border-color: var(--smart-border);\n border-width: var(--smart-border-width);\n align-items: center;\n border-right: none;\n border-top-left-radius: var(--smart-border-top-left-radius);\n border-bottom-left-radius: var(--smart-border-bottom-left-radius);\n user-select: none;\n white-space: nowrap;\n}\n.smart-drop-down-box .smart-action-button .smart-input {\n color: inherit;\n background: inherit;\n border: none;\n width: calc(100% - var(--smart-editor-addon-width));\n height: 100%;\n outline: none;\n text-overflow: ellipsis;\n}\n.smart-drop-down-box .smart-action-button .smart-input::placeholder {\n color: inherit;\n}\n.smart-drop-down-box .smart-drop-down-button {\n display: flex;\n align-items: center;\n justify-content: center;\n width: var(--smart-editor-addon-width);\n min-width: var(--smart-editor-addon-width);\n color: inherit;\n outline: 1px solid transparent;\n overflow: hidden;\n position: relative;\n background-color: var(--smart-surface);\n border-width: var(--smart-border-width);\n border-style: solid;\n border-color: var(--smart-border);\n border-left: none;\n color: var(--smart-surface-color);\n border-top-right-radius: var(--smart-border-top-right-radius);\n border-bottom-right-radius: var(--smart-border-bottom-right-radius);\n cursor: pointer;\n}\n.smart-drop-down-box .smart-drop-down-button .smart-drop-down-button-icon {\n pointer-events: none;\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n transform-origin: center;\n font-family: var(--smart-font-family-icon);\n}\n.smart-drop-down-box .smart-drop-down-button .smart-drop-down-button-icon:after {\n content: var(--smart-icon-arrow-down);\n font-size: var(--smart-arrow-size);\n}\n.smart-drop-down-box .smart-drop-down-button[active] {\n border-color: var(--smart-ui-state-border-active);\n background-color: var(--smart-ui-state-active);\n color: var(--smart-ui-state-color-active);\n}\n.smart-drop-down-box .smart-drop-down-button[top] .smart-drop-down-button-icon:after, .smart-drop-down-box .smart-drop-down-button[center-top] .smart-drop-down-button-icon:after {\n transform: rotate(180deg);\n}\n.smart-drop-down-box .smart-drop-down {\n font-family: var(--smart-font-family);\n font-size: var(--smart-font-size);\n}\n.smart-drop-down-box .smart-drop-down.smart-visibility-hidden {\n transform: scale(0);\n transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n transform-origin: left top 0px;\n}\n.smart-drop-down-box[drop-down-button-position=top] .smart-action-button, .smart-drop-down-box[drop-down-button-position=bottom] .smart-action-button {\n min-height: var(--smart-editor-height);\n padding-left: initial;\n}\n.smart-drop-down-box[drop-down-button-position=top] .smart-drop-down-button,\n.smart-drop-down-box[drop-down-button-position=top] .smart-action-button, .smart-drop-down-box[drop-down-button-position=bottom] .smart-drop-down-button,\n.smart-drop-down-box[drop-down-button-position=bottom] .smart-action-button {\n width: 100%;\n border: var(--smart-border-width) solid var(--smart-border);\n height: 50%;\n justify-content: center;\n}\n.smart-drop-down-box[drop-down-button-position=top] {\n min-height: calc(2 * var(--smart-editor-height));\n}\n.smart-drop-down-box[drop-down-button-position=top] .smart-content {\n flex-direction: column-reverse;\n}\n.smart-drop-down-box[drop-down-button-position=top] .smart-drop-down-button {\n border-bottom: initial;\n border-top-left-radius: var(--smart-border-top-left-radius);\n border-bottom-left-radius: 0;\n border-top-right-radius: var(--smart-border-top-right-radius);\n border-bottom-right-radius: 0;\n}\n.smart-drop-down-box[drop-down-button-position=top] .smart-action-button {\n border-top-left-radius: 0;\n border-bottom-left-radius: var(--smart-border-bottom-left-radius);\n border-top-right-radius: 0;\n border-bottom-right-radius: var(--smart-border-bottom-right-radius);\n}\n.smart-drop-down-box[drop-down-button-position=top]:not([drop-down-open-mode=dropDownButton]) .smart-action-button {\n border-top: initial;\n}\n.smart-drop-down-box[drop-down-button-position=bottom] {\n min-height: calc(2 * var(--smart-editor-height));\n}\n.smart-drop-down-box[drop-down-button-position=bottom] .smart-content {\n flex-direction: column;\n}\n.smart-drop-down-box[drop-down-button-position=bottom] .smart-action-button {\n border-bottom: initial;\n border-top-left-radius: var(--smart-border-top-left-radius);\n border-bottom-left-radius: 0;\n border-top-right-radius: var(--smart-border-top-right-radius);\n border-bottom-right-radius: 0;\n}\n.smart-drop-down-box[drop-down-button-position=bottom] .smart-drop-down-button {\n border-top-left-radius: 0;\n border-bottom-left-radius: var(--smart-border-bottom-left-radius);\n border-top-right-radius: 0;\n border-bottom-right-radius: var(--smart-border-bottom-right-radius);\n}\n.smart-drop-down-box[drop-down-button-position=bottom]:not([drop-down-open-mode=dropDownButton]) .smart-drop-down-button {\n border-top: initial;\n}\n.smart-drop-down-box[drop-down-button-position=left] > .smart-container > .smart-content, .smart-drop-down-box[drop-down-button-position=left].smart-container > .smart-content {\n flex-direction: row-reverse;\n}\n.smart-drop-down-box[drop-down-button-position=left] .smart-action-button {\n padding-right: var(--smart-editor-label-padding);\n border-right: var(--smart-border-width) solid var(--smart-border);\n border-color: var(--smart-border);\n border-top-left-radius: 0px;\n border-bottom-left-radius: 0px;\n border-top-right-radius: var(--smart-border-top-right-radius);\n border-bottom-right-radius: var(--smart-border-bottom-right-radius);\n padding-left: initial;\n flex-direction: row-reverse;\n}\n.smart-drop-down-box[drop-down-button-position=left] .smart-drop-down-button {\n border-left: var(--smart-border-width) solid var(--smart-border);\n border-color: var(--smart-border);\n border-top-left-radius: var(--smart-border-top-left-radius);\n border-bottom-left-radius: var(--smart-border-bottom-left-radius);\n border-top-right-radius: 0px;\n border-bottom-right-radius: 0px;\n border-right: initial;\n}\n.smart-drop-down-box[drop-down-button-position=left] .smart-drop-down-button[selected] {\n border-right: initial;\n}\n.smart-drop-down-box[drop-down-button-position=left]:not([drop-down-open-mode=dropDownButton]) .smart-action-button {\n border-left: initial;\n}\n.smart-drop-down-box[drop-down-button-position=right] .smart-action-button {\n padding-left: var(--smart-editor-label-padding);\n}\n.smart-drop-down-box[drop-down-button-position=none] .smart-action-button {\n border-right: var(--smart-border-width) solid var(--smart-border);\n border-top-right-radius: var(--smart-border-top-right-radius);\n border-bottom-right-radius: var(--smart-border-bottom-right-radius);\n width: 100%;\n padding-right: var(--smart-editor-label-padding);\n}\n.smart-drop-down-box[drop-down-button-position=none] .smart-drop-down-button {\n display: none;\n}\n.smart-drop-down-box:not([drop-down-open-mode=dropDownButton]) .smart-action-button {\n border-color: var(--smart-border);\n background-color: var(--smart-surface);\n color: var(--smart-surface-color);\n}\n.smart-drop-down-box[drop-down-open-mode=dropDownButton] .smart-action-button {\n border-color: var(--smart-border);\n background-color: var(--smart-background);\n color: var(--smart-background-color);\n}\n.smart-drop-down-box[drop-down-open-mode=dropDownButton] .smart-action-button[active] {\n border-color: var(--smart-ui-state-border-active);\n background-color: var(--smart-ui-state-active);\n color: var(--smart-ui-state-color-active);\n}\n.smart-drop-down-box[drop-down-open-mode=dropDownButton] .smart-drop-down-button {\n border-color: var(--smart-border);\n background-color: var(--smart-surface);\n color: var(--smart-surface-color);\n border-left-style: solid;\n border-left-width: var(--smart-border-width);\n}\n.smart-drop-down-box[drop-down-open-mode=dropDownButton][drop-down-button-position=left]:not([hover]) .smart-drop-down-button:focus {\n border-color: var(--smart-outline);\n box-shadow: var(--smart-border-width) 0 0 0 var(--smart-outline);\n}\n.smart-drop-down-box[drop-down-open-mode=dropDownButton][drop-down-button-position=left]:not([hover]) .smart-action-button:focus {\n border-color: var(--smart-outline);\n box-shadow: calc(-1 * var(--smart-border-width)) 0 0 0 var(--smart-outline);\n}\n.smart-drop-down-box[drop-down-open-mode=dropDownButton][drop-down-button-position=right]:not([hover]) .smart-action-button:focus {\n box-shadow: var(--smart-border-width) 0 0 0 var(--smart-outline);\n border-color: var(--smart-outline);\n z-index: 1;\n}\n.smart-drop-down-box[drop-down-open-mode=dropDownButton]:not([drop-down-button-position]):not([hover]) .smart-drop-down-button:focus {\n border-color: var(--smart-outline);\n}\n.smart-drop-down-box[drop-down-open-mode=dropDownButton]:not([drop-down-button-position]):not([hover]) .smart-action-button:focus {\n box-shadow: var(--smart-border-width) 0 0 0 var(--smart-outline);\n border-color: var(--smart-outline);\n z-index: 1;\n}\n.smart-drop-down-box[resizing] {\n user-select: none;\n touch-action: none;\n}\n.smart-drop-down-box[readonly] input {\n user-select: none;\n -moz-user-select: none;\n -webkit-user-select: none;\n}\n.smart-drop-down-box[hover] .smart-drop-down-button {\n border-color: var(--smart-ui-state-border-hover);\n background-color: var(--smart-ui-state-hover);\n color: var(--smart-ui-state-color-hover);\n}\n.smart-drop-down-box[hover]:not([drop-down-open-mode=dropDownButton]) .smart-action-button {\n border-color: var(--smart-ui-state-border-hover);\n background-color: var(--smart-ui-state-hover);\n color: var(--smart-ui-state-color-hover);\n}\n.smart-drop-down-box[focus]:not([opened]) .smart-action-button[focus],\n.smart-drop-down-box[focus]:not([opened]) .smart-drop-down-button[focus],\n.smart-drop-down-box[focus]:not([opened]) .smart-action-button,\n.smart-drop-down-box[focus]:not([opened]) .smart-drop-down-button {\n outline: initial;\n border-color: var(--smart-outline);\n}\n.smart-drop-down-box[active] .smart-action-button, .smart-drop-down-box[active][focus][drop-down-open-mode=dropDownButton] .smart-action-button, .smart-drop-down-box[active][focus][drop-down-open-mode=dropDownButton] .smart-drop-down-button, .smart-drop-down-box[active][drop-down-open-mode=dropDownButton] .smart-drop-down-button:focus {\n border-color: var(--smart-ui-state-border-active);\n background-color: var(--smart-ui-state-active);\n color: var(--smart-ui-state-color-active);\n}\n.smart-drop-down-box[opened] > .smart-container > .smart-content > .smart-buttons-container .smart-drop-down-button .smart-drop-down-button-icon:after {\n transform: rotate(180deg);\n}\n.smart-drop-down-box[opened] > .smart-container > .smart-content > .smart-buttons-container .smart-drop-down-button[bottom] .smart-drop-down-button-icon:after, .smart-drop-down-box[opened] > .smart-container > .smart-content > .smart-buttons-container .smart-drop-down-button[center-bottom] .smart-drop-down-button-icon:after {\n transform: rotate(180deg);\n}\n.smart-drop-down-box[opened] > .smart-container > .smart-content > .smart-buttons-container .smart-drop-down-button[top] .smart-drop-down-button-icon:after, .smart-drop-down-box[opened] > .smart-container > .smart-content > .smart-buttons-container .smart-drop-down-button[center-top] .smart-drop-down-button-icon:after {\n transform: rotate(0deg);\n}\n.smart-drop-down-box[opened] > .smart-container > .smart-content > .smart-buttons-container:not([drop-down-open-mode=dropDownButton]):not(.outlined):not(.underlined) .smart-action-button, .smart-drop-down-box[opened] > .smart-container > .smart-content > .smart-buttons-container:not(.outlined):not(.underlined) .smart-drop-down-button {\n border-color: var(--smart-ui-state-active);\n background-color: var(--smart-ui-state-active);\n color: var(--smart-ui-state-color-active);\n}\n.smart-drop-down-box.auto-height {\n height: auto;\n min-height: var(--smart-editor-height);\n}\n.smart-drop-down-box.auto-height > .smart-container, .smart-drop-down-box.auto-height.smart-container {\n min-height: inherit;\n}\n.smart-drop-down-box.auto-height .smart-action-button,\n.smart-drop-down-box.auto-height .smart-content {\n min-height: inherit;\n}\n.smart-drop-down-box.auto-height .smart-action-button {\n padding: 3px;\n}\n.smart-drop-down-box.auto-height[label], .smart-drop-down-box.auto-height[hint] {\n height: auto;\n}\n.smart-drop-down-box[label][hint] > .smart-container {\n display: flex;\n position: relative;\n align-items: center;\n}\n.smart-drop-down-box[label] > .smart-container {\n align-items: flex-end;\n}\n.smart-drop-down-box[hint] > .smart-container {\n align-items: flex-start;\n}\n.smart-drop-down-box[hint] .smart-hint {\n opacity: 0;\n transition: opacity 0.2s cubic-bezier(0.4, 0, 0.6, 1);\n top: 100%;\n bottom: initial;\n}\n.smart-drop-down-box[hint][focus] .smart-hint {\n opacity: 1;\n transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.smart-drop-down-box[label] .smart-label, .smart-drop-down-box[hint] .smart-hint {\n position: absolute;\n left: 0;\n bottom: 100%;\n font-size: 12px;\n width: 100%;\n display: block;\n padding: var(--smart-editor-label-padding);\n pointer-events: none;\n user-select: none;\n -webkit-user-select: none;\n -ms-user-select: none;\n -moz-user-select: none;\n text-align: initial;\n line-height: initial;\n vertical-align: initial;\n}\n.smart-drop-down-box[disabled] > .smart-container {\n cursor: default;\n background-color: initial;\n}\n.smart-drop-down-box[disabled] .smart-drop-down-button {\n cursor: default;\n background-color: initial;\n}\n.smart-drop-down-box[disabled][selection-display-mode=tokens] .smart-action-button > span {\n cursor: default;\n}\n.smart-drop-down-box.underlined {\n background-color: transparent;\n border-width: 0px;\n border-bottom-width: 1px;\n background: var(--smart-background);\n border-bottom-color: var(--smart-border);\n}\n.smart-drop-down-box.underlined .smart-action-button {\n border-top-color: transparent;\n border-left-color: transparent;\n border-right-color: transparent;\n border-bottom-left-radius: 0;\n background-color: transparent;\n color: var(--smart-background-color);\n}\n.smart-drop-down-box.underlined .smart-action-button input {\n border-color: transparent !important;\n}\n.smart-drop-down-box.underlined .smart-action-button[active] {\n background-color: var(--smart-ui-state-active);\n color: var(--smart-ui-state-color-active);\n}\n.smart-drop-down-box.underlined .smart-spin-button {\n background: var(--smart-background);\n border-width: 0px;\n}\n.smart-drop-down-box.underlined .smart-spin-button[hover] {\n background: var(--smart-background);\n color: var(--smart-ui-state-active);\n}\n.smart-drop-down-box.underlined .smart-spin-button[active] {\n background: var(--smart-background);\n color: var(--smart-ui-state-active);\n}\n.smart-drop-down-box.underlined .smart-drop-down-button {\n background: var(--smart-background);\n border-width: 0px;\n border-bottom: 1px solid var(--smart-border) !important;\n border-top-color: transparent;\n border-left-color: transparent;\n border-right-color: transparent;\n}\n.smart-drop-down-box.underlined .smart-drop-down-button[hover] {\n background: var(--smart-background);\n color: var(--smart-ui-state-active);\n}\n.smart-drop-down-box.underlined .smart-drop-down-button[active] {\n background-color: var(--smart-ui-state-active);\n color: var(--smart-ui-state-color-active);\n}\n.smart-drop-down-box.underlined .smart-hint {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n display: block !important;\n box-sizing: border-box;\n padding: var(--smart-editor-label-padding);\n color: var(--smart-background-color);\n pointer-events: none;\n font-size: 75%;\n opacity: 0;\n transition: color 0.2s, opacity 0.1s, font-size 0.2s, line-height 0.2s, margin-top 0.2s, top 0.2s;\n margin-top: calc(0px - var(--smart-font-size));\n}\n.smart-drop-down-box.underlined .smart-hint:after {\n content: "";\n position: absolute;\n left: 0;\n bottom: -2px;\n display: block;\n width: 100%;\n height: 2px;\n background-color: var(--smart-primary);\n transform-origin: bottom center;\n transform: scaleX(0);\n transition: transform 0.2s;\n}\n.smart-drop-down-box.underlined:not([focus]) .smart-hint {\n margin-top: 0px;\n}\n.smart-drop-down-box.underlined[focus] input {\n border-color: transparent !important;\n}\n.smart-drop-down-box.underlined[focus] .smart-action-button {\n border-color: transparent !important;\n}\n.smart-drop-down-box.underlined[focus] .smart-drop-down-button,\n.smart-drop-down-box.underlined[focus] .smart-hint {\n color: var(--smart-primary) !important;\n opacity: 1;\n border-color: transparent !important;\n}\n.smart-drop-down-box.underlined[focus] .smart-hint:after {\n transform: scale(1);\n}\n.smart-drop-down-box.underlined[opened] .smart-action-button {\n border-top-color: transparent;\n border-left-color: transparent;\n border-right-color: transparent;\n border-bottom-left-radius: 0;\n background-color: transparent;\n color: var(--smart-background-color);\n}\n.smart-drop-down-box.underlined:not([opened]):not([hover]) .smart-drop-down-button {\n background-color: transparent;\n color: var(--smart-background-color);\n}\n.smart-drop-down-box.underlined:not([opened]):not([hover]) .smart-drop-down-button:not([hover]) {\n border-bottom-left-radius: 0;\n}\n.smart-drop-down-box.underlined:not([opened]):not([hover]) .smart-drop-down-button:not([active]):not([hover]) {\n border-radius: initial;\n}\n.smart-drop-down-box.underlined:not([opened]) .smart-action-button:not([active]):not([hover]) {\n border-radius: initial;\n}\n.smart-drop-down-box.underlined[hover]:not([drop-down-open-mode=dropDownButton]):not([opened]) .smart-action-button {\n border-bottom-left-radius: 0;\n}\n.smart-drop-down-box.underlined[hover]:not([drop-down-open-mode=dropDownButton]):not([opened]) .smart-action-button:not([active]) {\n background-color: transparent;\n}\n.smart-drop-down-box.underlined[hover]:not([opened]) .smart-a