@helvetia-design/core 0.0.6 → 0.1.0

package/dist/cjs/{t-shirt-DWHArrUC.js → t-shirt-DqirWTL2.js}

@@ -38,13 +38,9 @@ const normalizeDeprecatedTShirtSize = (size) => {
     }
     return size;
 };
-/**
- * Returns the short t-shirt size (sm, base, md, ...) for a given verbose
- * value (small, normal, medium, ...). If no mapping exists the value is
- * returned unchanged.
- */
+// `3xs` shares its verbose value with `2xs` and is skipped, so that `xx-small` resolves to `2xs`.
 const verboseToShortEntries = Object.entries(TShirtSizesMapping).reduce((result, [short, verbose]) => {
-    if (!result[verbose]) {
+    if (short !== '3xs' && !result[verbose]) {
         result[verbose] = short;
     }
     return result;

package/dist/collection/components/actions/button/button.js

@@ -121,6 +121,10 @@ export class Button {
          * A11y attributes for the native button element.
          */
         this.a11yControls = '';
+        /**
+         * A11y attributes for the native button element. Maps to `aria-current`, e.g. `page` for the current navigation entry.
+         */
+        this.a11yCurrent = '';
         /**
          * A11y attributes for the native button element.
          */
@@ -173,10 +177,15 @@ export class Button {
             'title',
             'aria-label',
             'aria-controls',
+            'aria-current',
             'aria-hidden',
             'tabindex',
             'aria-haspopup',
         ]);
+        if (!this.a11yCurrent && this.inheritAttributes['aria-current']) {
+            this.a11yCurrent = this.inheritAttributes['aria-current'];
+        }
+        delete this.inheritAttributes['aria-current'];
         if (this.el.hasAttribute('ds-popup') && !this.a11yHaspopup) {
             this.a11yHaspopup = 'true';
         }
@@ -255,9 +264,10 @@ export class Button {
             'title': this.a11yTitle || this.inheritAttributes['title'],
             'aria-label': this.a11yLabel || this.inheritAttributes['aria-label'] || this.a11yTitle || this.inheritAttributes['title'],
             'aria-controls': this.a11yControls || this.inheritAttributes['aria-controls'],
+            'aria-current': this.a11yCurrent || undefined,
             'aria-haspopup': this.a11yHaspopup || this.inheritAttributes['aria-haspopup'],
         };
-        return (h(Host, { key: '1aa7a5df160205f1afd6ff9259126f57cfd93540', onClick: this.handleHostClick, class: {
+        return (h(Host, { key: 'bda96892dc1306808ad72ca435039288a9b76191', onClick: this.handleHostClick, class: {
                 'is-wide': this.wide,
                 [`is-${this.color || 'primary'}`]: true,
                 [`is-${size}`]: hasValue(size),
@@ -269,7 +279,7 @@ export class Button {
                 [`has-shadow`]: this.shadow,
                 [`has-no-wrap`]: this.noWrap,
                 [`has-brand-icon`]: this.hasBrandIcon,
-            } }, h(TagType, Object.assign({ key: '407cbc66f40e0b119d3eb3789e3b0594bdd3e9f0' }, attrs, this.inheritAttributes, { type: this.elementType, id: "button", part: "native", disabled: this.disabled || this.loading, onFocus: this.handleFocus, onBlur: this.handleBlur, onClick: this.handleClick, "aria-busy": ariaBooleanToString(!!this.loading), "aria-disabled": ariaBooleanToString(this.disabled || this.loading) }, ariaAttributes), this.loading ? (h("ds-spinner", Object.assign({}, this.loadingAttrs, { part: "spinner", size: "sm", deactivated: !this.loading }))) : (''), this.hasBrandIcon ? (h("ds-brand-icon", { part: "icon", svg: this.isBrandIconSvg ? this.brandIcon : '', src: this.isBrandIconSvg ? '' : this.brandIcon, size: this.brandSize, color: this.brandIconColor })) : hasValue(this.icon) ? (h("ds-icon", Object.assign({}, this.leftIconAttrs, { part: "icon", class: this.square ? '' : 'icon-left', name: this.icon, size: size, turn: this.iconTurn, inverted: this.isIconInverted }))) : (''), h("span", { key: 'c18d7f77a05c20807d783ea1b6eeca05c03f57d2', part: "label" }, h("slot", { key: '8adcfbb2c77f630fc2acd66480993200559bd617' })), !this.hasBrandIcon && hasValue(this.iconRight) ? (h("ds-icon", Object.assign({}, this.leftRightAttrs, { part: "icon-right", class: "icon-right", name: this.iconRight, size: 'sm', turn: this.iconTurn, inverted: this.isIconInverted }))) : (''))));
+            } }, h(TagType, Object.assign({ key: '2cdaa76bd97078354293eebd6b028b1272812907' }, attrs, this.inheritAttributes, { type: this.elementType, id: "button", part: "native", disabled: this.disabled || this.loading, onFocus: this.handleFocus, onBlur: this.handleBlur, onClick: this.handleClick, "aria-busy": ariaBooleanToString(!!this.loading), "aria-disabled": ariaBooleanToString(this.disabled || this.loading) }, ariaAttributes), this.loading ? (h("ds-spinner", Object.assign({}, this.loadingAttrs, { part: "spinner", size: "sm", deactivated: !this.loading }))) : (''), this.hasBrandIcon ? (h("ds-brand-icon", { part: "icon", svg: this.isBrandIconSvg ? this.brandIcon : '', src: this.isBrandIconSvg ? '' : this.brandIcon, size: this.brandSize, color: this.brandIconColor })) : hasValue(this.icon) ? (h("ds-icon", Object.assign({}, this.leftIconAttrs, { part: "icon", class: this.square ? '' : 'icon-left', name: this.icon, size: size, turn: this.iconTurn, inverted: this.isIconInverted }))) : (''), h("span", { key: '055c9a82511c44ea3035c9418d902f18e86209e0', part: "label" }, h("slot", { key: '0c811c3be953c3c52ae78d5df91458be89c174ee' })), !this.hasBrandIcon && hasValue(this.iconRight) ? (h("ds-icon", Object.assign({}, this.leftRightAttrs, { part: "icon-right", class: "icon-right", name: this.iconRight, size: 'sm', turn: this.iconTurn, inverted: this.isIconInverted }))) : (''))));
     }
     static get is() { return "ds-button"; }
     static get encapsulation() { return "shadow"; }
@@ -799,6 +809,26 @@ export class Button {
                 "attribute": "a-1-1y-controls",
                 "defaultValue": "''"
             },
+            "a11yCurrent": {
+                "type": "string",
+                "mutable": true,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "A11y attributes for the native button element. Maps to `aria-current`, e.g. `page` for the current navigation entry."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "a-1-1y-current",
+                "defaultValue": "''"
+            },
             "a11yTitle": {
                 "type": "string",
                 "mutable": false,
@@ -1090,6 +1120,10 @@ __decorate([
     Type('string'),
     __metadata("design:type", String)
 ], Button.prototype, "a11yControls", void 0);
+__decorate([
+    Type('string'),
+    __metadata("design:type", String)
+], Button.prototype, "a11yCurrent", void 0);
 __decorate([
     Type('string'),
     __metadata("design:type", String)

package/dist/collection/components/actions/button/test/button.component.play.js

@@ -29,4 +29,57 @@ test.describe('component', () => {
         await dsButton.assertToBeDisabled();
         expect(spy).toHaveReceivedEventTimes(0);
     });
+    test('should forward a11yCurrent as aria-current to the native button', async ({ page }) => {
+        await page.mount(`
+      <ds-button a-1-1y-current="page">Home</ds-button>
+    `);
+        await expect(page.locator('ds-button button')).toHaveAttribute('aria-current', 'page');
+    });
+    test('should update aria-current when a11yCurrent changes', async ({ page }) => {
+        await page.mount(`
+      <ds-button a-1-1y-current="page">Home</ds-button>
+    `);
+        const dsButton = page.locator('ds-button');
+        const nativeButton = page.locator('ds-button button');
+        await dsButton.evaluate((el) => {
+            el.a11yCurrent = '';
+        });
+        await page.waitForChanges();
+        await expect(nativeButton).not.toHaveAttribute('aria-current');
+        await dsButton.evaluate((el) => {
+            el.a11yCurrent = 'page';
+        });
+        await page.waitForChanges();
+        await expect(nativeButton).toHaveAttribute('aria-current', 'page');
+    });
+    test('should inherit aria-current from the host', async ({ page }) => {
+        await page.mount(`
+      <ds-button aria-current="page">Home</ds-button>
+    `);
+        await expect(page.locator('ds-button button')).toHaveAttribute('aria-current', 'page');
+    });
+    test('should let a11yCurrent override an inherited aria-current', async ({ page }) => {
+        await page.mount(`
+      <ds-button aria-current="page">Home</ds-button>
+    `);
+        const dsButton = page.locator('ds-button');
+        const nativeButton = page.locator('ds-button button');
+        await expect(dsButton).not.toHaveAttribute('aria-current');
+        await dsButton.evaluate((el) => {
+            el.a11yCurrent = '';
+        });
+        await page.waitForChanges();
+        await expect(nativeButton).not.toHaveAttribute('aria-current');
+        await dsButton.evaluate((el) => {
+            el.a11yCurrent = 'step';
+        });
+        await page.waitForChanges();
+        await expect(nativeButton).toHaveAttribute('aria-current', 'step');
+    });
+    test('should forward a11yCurrent to the native link', async ({ page }) => {
+        await page.mount(`
+      <ds-button href="/home" a-1-1y-current="page">Home</ds-button>
+    `);
+        await expect(page.locator('ds-button a')).toHaveAttribute('aria-current', 'page');
+    });
 });

package/dist/collection/components/forms/counter/counter.host.css

@@ -1 +1 @@
-:host{--_form-field-gap: var(--form-field-gap, var(--mod-form-field-gap, 0.25rem));--_form-container-background: var(--form-container-background, var(--mod-form-container-background, var(--ds-form-default-container-background)));--_form-container-border: var(--form-container-border, var(--mod-form-container-border, var(--ds-form-default-container-border)));--_form-container-radius: var(--form-container-radius, var(--mod-form-container-radius, var(--ds-form-container-radius)));--_form-container-hover-background: var(--form-container-hover-background, var(--mod-form-container-hover-background, var(--ds-form-hover-container-background)));--_form-container-active-background: var(--form-container-active-background, var(--mod-form-container-active-background, var(--ds-form-active-container-background)));--_form-container-focus-background: var(--form-container-focus-background, var(--mod-form-container-focus-background, var(--ds-form-focus-container-background)));--_form-container-hover-border: var(--form-container-hover-border, var(--mod-form-container-hover-border, var(--ds-form-hover-container-border)));--_form-container-active-border: var(--form-container-active-border, var(--mod-form-container-active-border, var(--ds-form-active-container-border)));--_form-container-focus-border: var(--form-container-focus-border, var(--mod-form-container-focus-border, var(--ds-form-focus-container-border)));--_form-label-color: var(--form-label-color, var(--mod-form-label-color, var(--ds-form-default-label-color)));--_form-label-family: var(--form-label-family, var(--mod-form-label-family, var(--ds-form-default-label-typo-font-family)));--_form-label-weight: var(--form-label-weight, var(--mod-form-label-weight, var(--ds-form-default-label-typo-font-weight)));--_form-label-line-height: var(--form-label-line-height, var(--mod-form-label-line-height, var(--ds-form-default-label-typo-line-height)));--_form-label-size: var(--form-label-size, var(--mod-form-label-size, var(--ds-form-default-label-typo-font-size)));--_form-description-color: var(--form-description-color, var(--mod-form-description-color, var(--ds-form-default-description-color)));--_form-description-family: var(--form-description-family, var(--mod-form-description-family, var(--ds-form-default-description-typo-font-family)));--_form-description-weight: var(--form-description-weight, var(--mod-form-description-weight, var(--ds-form-default-description-typo-font-weight)));--_form-description-line-height: var(--form-description-line-height, var(--mod-form-description-line-height, var(--ds-form-default-description-typo-line-height)));--_form-description-size: var(--form-description-size, var(--mod-form-description-size, var(--ds-form-default-description-typo-font-size)));--_counter-gap: var(--counter-gap, var(--mod-counter-gap, 0.125rem));--_counter-value-min-width: var(--counter-value-min-width, var(--mod-counter-value-min-width, 3rem));--_counter-value-font-weight: var(--counter-value-font-weight, var(--mod-counter-value-font-weight, var(--ds-alias-text-weight-bold)));--_counter-value-font-family: var(--counter-value-font-family, var(--mod-counter-value-font-family, var(--ds-alias-text-family-text)));--_counter-value-color: var(--counter-value-color, var(--mod-counter-value-color, var(--ds-form-default-label-color)));--_counter-value-animation-duration: var(--counter-value-animation-duration, var(--mod-counter-value-animation-duration, 260ms));--_counter-value-animation-easing: var(--counter-value-animation-easing, var(--mod-counter-value-animation-easing, cubic-bezier(0.22, 1, 0.36, 1)))}:host{position:relative;display:grid;gap:var(--_form-field-gap)}:host #container{box-sizing:border-box;clear:both;display:flex;width:100%;align-items:center;min-height:3rem;gap:.25rem;padding-inline:.5rem;background:var(--_form-container-background);border:var(--_form-container-border);border-radius:var(--_form-container-radius)}:host :where(fieldset){margin:0;padding:0;border:none}:host :where(legend){padding:0;float:left;width:100%}:host label{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:block;box-sizing:content-box;hyphens:auto;overflow-wrap:break-word;text-wrap:balance;min-width:0;color:var(--_form-label-color);font-family:var(--_form-label-family);font-weight:var(--_form-label-weight);font-size:var(--_form-label-size);line-height:var(--_form-label-line-height)}:host #description{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:flex;box-sizing:content-box;hyphens:auto;overflow-wrap:break-word;text-wrap:balance;min-width:0;gap:.25rem;min-height:1.125rem;color:var(--_form-description-color);font-family:var(--_form-description-family);font-weight:var(--_form-description-weight);font-size:var(--_form-description-size);line-height:var(--_form-description-line-height)}:host #description ds-icon{--icon-color: var(--_form-description-color)}:host{display:block}:host #inner{position:relative;display:grid;gap:var(--_form-field-gap)}:host #container{width:fit-content}:host #counter{display:inline-flex;align-items:center;justify-content:flex-start;gap:var(--_counter-gap)}:host [part=value]{display:inline-grid;grid-template-columns:1fr;min-width:var(--_counter-value-min-width);text-align:center;font-weight:var(--_counter-value-font-weight);font-family:var(--_counter-value-font-family);color:var(--_counter-value-color);user-select:none;overflow:hidden}.value-slide{grid-area:1/1}@media(prefers-reduced-motion: no-preference){.value-slide.value-out.is-increase{animation:ds-counter-value-out-up var(--_counter-value-animation-duration) var(--_counter-value-animation-easing) forwards}.value-slide.value-out.is-decrease{animation:ds-counter-value-out-down var(--_counter-value-animation-duration) var(--_counter-value-animation-easing) forwards}.value-slide.value-in.is-increase{animation:ds-counter-value-in-up var(--_counter-value-animation-duration) var(--_counter-value-animation-easing) forwards}.value-slide.value-in.is-decrease{animation:ds-counter-value-in-down var(--_counter-value-animation-duration) var(--_counter-value-animation-easing) forwards}}@keyframes ds-counter-value-out-up{to{transform:translateY(-100%);opacity:0}}@keyframes ds-counter-value-in-up{from{transform:translateY(100%);opacity:0}}@keyframes ds-counter-value-out-down{to{transform:translateY(100%);opacity:0}}@keyframes ds-counter-value-in-down{from{transform:translateY(-100%);opacity:0}}:host(.is-danger){--mod-form-description-color: var(--ds-form-danger-description-color);--mod-counter-value-color: var(--ds-alias-text-color-danger)}:host(.is-success){--mod-form-description-color: var(--ds-form-success-description-color)}:host(.is-warning){--mod-form-description-color: var(--ds-form-warning-description-color)}:host(.is-disabled){--mod-form-label-color: var(--ds-form-disabled-label-color);--mod-form-description-color: var(--ds-form-disabled-description-color);--mod-counter-value-color: var(--ds-form-disabled-label-color)}:host(.is-disabled),:host(.is-disabled) #label,:host(.is-disabled) #description,:host(.is-disabled) #counter,:host(.is-disabled) [part=value]{pointer-events:none;cursor:default}
+:host{--_form-field-gap: var(--form-field-gap, var(--mod-form-field-gap, 0.25rem));--_form-container-background: var(--form-container-background, var(--mod-form-container-background, var(--ds-form-default-container-background)));--_form-container-border: var(--form-container-border, var(--mod-form-container-border, var(--ds-form-default-container-border)));--_form-container-radius: var(--form-container-radius, var(--mod-form-container-radius, var(--ds-form-container-radius)));--_form-container-hover-background: var(--form-container-hover-background, var(--mod-form-container-hover-background, var(--ds-form-hover-container-background)));--_form-container-active-background: var(--form-container-active-background, var(--mod-form-container-active-background, var(--ds-form-active-container-background)));--_form-container-focus-background: var(--form-container-focus-background, var(--mod-form-container-focus-background, var(--ds-form-focus-container-background)));--_form-container-hover-border: var(--form-container-hover-border, var(--mod-form-container-hover-border, var(--ds-form-hover-container-border)));--_form-container-active-border: var(--form-container-active-border, var(--mod-form-container-active-border, var(--ds-form-active-container-border)));--_form-container-focus-border: var(--form-container-focus-border, var(--mod-form-container-focus-border, var(--ds-form-focus-container-border)));--_form-label-color: var(--form-label-color, var(--mod-form-label-color, var(--ds-form-default-label-color)));--_form-label-family: var(--form-label-family, var(--mod-form-label-family, var(--ds-form-default-label-typo-font-family)));--_form-label-weight: var(--form-label-weight, var(--mod-form-label-weight, var(--ds-form-default-label-typo-font-weight)));--_form-label-line-height: var(--form-label-line-height, var(--mod-form-label-line-height, var(--ds-form-default-label-typo-line-height)));--_form-label-size: var(--form-label-size, var(--mod-form-label-size, var(--ds-form-default-label-typo-font-size)));--_form-description-color: var(--form-description-color, var(--mod-form-description-color, var(--ds-form-default-description-color)));--_form-description-family: var(--form-description-family, var(--mod-form-description-family, var(--ds-form-default-description-typo-font-family)));--_form-description-weight: var(--form-description-weight, var(--mod-form-description-weight, var(--ds-form-default-description-typo-font-weight)));--_form-description-line-height: var(--form-description-line-height, var(--mod-form-description-line-height, var(--ds-form-default-description-typo-line-height)));--_form-description-size: var(--form-description-size, var(--mod-form-description-size, var(--ds-form-default-description-typo-font-size)));--_counter-gap: var(--counter-gap, var(--mod-counter-gap, 0.125rem));--_counter-value-min-width: var(--counter-value-min-width, var(--mod-counter-value-min-width, 3rem));--_counter-value-font-weight: var(--counter-value-font-weight, var(--mod-counter-value-font-weight, var(--ds-alias-text-weight-bold)));--_counter-value-font-family: var(--counter-value-font-family, var(--mod-counter-value-font-family, var(--ds-alias-text-family-text)));--_counter-value-color: var(--counter-value-color, var(--mod-counter-value-color, var(--ds-form-default-label-color)));--_counter-value-animation-duration: var(--counter-value-animation-duration, var(--mod-counter-value-animation-duration, 260ms));--_counter-value-animation-easing: var(--counter-value-animation-easing, var(--mod-counter-value-animation-easing, cubic-bezier(0.22, 1, 0.36, 1)))}:host{position:relative;display:grid;grid-template-columns:minmax(0, 1fr);gap:var(--_form-field-gap)}:host #container{box-sizing:border-box;clear:both;display:flex;width:100%;min-width:0;align-items:center;min-height:3rem;gap:.25rem;padding-inline:.5rem;background:var(--_form-container-background);border:var(--_form-container-border);border-radius:var(--_form-container-radius)}:host :where(fieldset){margin:0;padding:0;border:none}:host :where(legend){padding:0;float:left;width:100%}:host label{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:block;box-sizing:content-box;hyphens:auto;overflow-wrap:break-word;text-wrap:balance;min-width:0;color:var(--_form-label-color);font-family:var(--_form-label-family);font-weight:var(--_form-label-weight);font-size:var(--_form-label-size);line-height:var(--_form-label-line-height)}:host #description{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:flex;box-sizing:content-box;hyphens:auto;overflow-wrap:break-word;text-wrap:balance;min-width:0;gap:.25rem;min-height:1.125rem;color:var(--_form-description-color);font-family:var(--_form-description-family);font-weight:var(--_form-description-weight);font-size:var(--_form-description-size);line-height:var(--_form-description-line-height)}:host #description ds-icon{--icon-color: var(--_form-description-color)}:host{display:block}:host #inner{position:relative;display:grid;grid-template-columns:minmax(0, 1fr);gap:var(--_form-field-gap)}:host #container{width:fit-content}:host #counter{display:inline-flex;align-items:center;justify-content:flex-start;gap:var(--_counter-gap)}:host [part=value]{display:inline-grid;grid-template-columns:1fr;min-width:var(--_counter-value-min-width);text-align:center;font-weight:var(--_counter-value-font-weight);font-family:var(--_counter-value-font-family);color:var(--_counter-value-color);user-select:none;overflow:hidden}.value-slide{grid-area:1/1}@media(prefers-reduced-motion: no-preference){.value-slide.value-out.is-increase{animation:ds-counter-value-out-up var(--_counter-value-animation-duration) var(--_counter-value-animation-easing) forwards}.value-slide.value-out.is-decrease{animation:ds-counter-value-out-down var(--_counter-value-animation-duration) var(--_counter-value-animation-easing) forwards}.value-slide.value-in.is-increase{animation:ds-counter-value-in-up var(--_counter-value-animation-duration) var(--_counter-value-animation-easing) forwards}.value-slide.value-in.is-decrease{animation:ds-counter-value-in-down var(--_counter-value-animation-duration) var(--_counter-value-animation-easing) forwards}}@keyframes ds-counter-value-out-up{to{transform:translateY(-100%);opacity:0}}@keyframes ds-counter-value-in-up{from{transform:translateY(100%);opacity:0}}@keyframes ds-counter-value-out-down{to{transform:translateY(100%);opacity:0}}@keyframes ds-counter-value-in-down{from{transform:translateY(-100%);opacity:0}}:host(.is-danger){--mod-form-description-color: var(--ds-form-danger-description-color);--mod-counter-value-color: var(--ds-alias-text-color-danger)}:host(.is-success){--mod-form-description-color: var(--ds-form-success-description-color)}:host(.is-warning){--mod-form-description-color: var(--ds-form-warning-description-color)}:host(.is-disabled){--mod-form-label-color: var(--ds-form-disabled-label-color);--mod-form-description-color: var(--ds-form-disabled-description-color);--mod-counter-value-color: var(--ds-form-disabled-label-color)}:host(.is-disabled),:host(.is-disabled) #label,:host(.is-disabled) #description,:host(.is-disabled) #counter,:host(.is-disabled) [part=value]{pointer-events:none;cursor:default}

package/dist/collection/components/forms/counter/counter.js

@@ -19,6 +19,8 @@ const VALUE_ANIMATION_MS = 260;
  * @part value - The span rendering the current value.
  * @part decrease - The decrease (`-`) button.
  * @part increase - The increase (`+`) button.
+ *
+ * @slot invalid-text - Overrides the `invalidText` prop with custom markup, shown instead of the description when `invalid` is `true`.
  */
 export class Counter {
     constructor() {
@@ -322,11 +324,11 @@ export class Counter {
         const increaseLabel = i18nDsCounter[this.language].increase;
         const decreaseDisabled = this.disabled || this.readonly || this.value <= this.min;
         const increaseDisabled = this.disabled || this.readonly || this.value >= this.max;
-        return (h(Field, { key: '635a8c44149e5f08cc6682d2196698d8fd4b3dba', disabled: this.disabled || this.readonly, color: this.color, invalid: this.invalid, label: this.label, description: this.description, invalidText: this.invalidText, required: this.required, language: this.language }, h("div", Object.assign({ key: '7e0eb54dc1a2825c44892046b507e71008f2d0ad', id: "counter", part: "counter", onKeyDown: this.handleKeyDown }, this.inheritedAttributes), h("ds-button", { key: 'b04c95d286b09bfc778a8e92e16c0ceb5fbaefd0', ref: el => (this.decreaseButtonEl = el), part: "decrease", "data-testid": "ds-counter-decrease", color: this.invalid
+        return (h(Field, { key: '282082964e12c3d53c20035b617ebbd7e173a424', disabled: this.disabled || this.readonly, color: this.color, invalid: this.invalid, label: this.label, description: this.description, invalidText: this.invalidText, required: this.required, language: this.language }, h("div", Object.assign({ key: '4eafc01fe942902d72a9db63e73b345785b1f15a', id: "counter", part: "counter", onKeyDown: this.handleKeyDown }, this.inheritedAttributes), h("ds-button", { key: '165a93be231c9054fc6cf19f82c0a52fdcee6afc', ref: el => (this.decreaseButtonEl = el), part: "decrease", "data-testid": "ds-counter-decrease", color: this.invalid
                 ? 'danger'
                 : this.color === 'danger' || this.color === 'warning' || this.color === 'success'
                     ? this.color
-                    : 'ghost', size: "sm", square: true, icon: "minus", a11yLabel: decreaseLabel, a11yTitle: decreaseLabel, disabled: decreaseDisabled, onClick: this.handleDecrease, onDsFocus: this.handleFocusDecrease, onDsBlur: this.handleBlurDecrease }), h("span", { key: '4faef5385c53c5abadd242fd837583af3221434f', id: "value", part: "value", "data-testid": "ds-counter-value" }, this.previousValue !== null && (h("span", { key: `prev-${this.previousValue}`, "aria-hidden": "true", class: {
+                    : 'ghost', size: "sm", square: true, icon: "minus", a11yLabel: decreaseLabel, a11yTitle: decreaseLabel, disabled: decreaseDisabled, onClick: this.handleDecrease, onDsFocus: this.handleFocusDecrease, onDsBlur: this.handleBlurDecrease }), h("span", { key: 'df30901c4494a28a78a8738f8ad863b6255d4b92', id: "value", part: "value", "data-testid": "ds-counter-value" }, this.previousValue !== null && (h("span", { key: `prev-${this.previousValue}`, "aria-hidden": "true", class: {
                 'value-slide': true,
                 'value-out': true,
                 'is-increase': this.valueDirection === 'increase',
@@ -336,7 +338,7 @@ export class Counter {
                 'value-in': this.previousValue !== null,
                 'is-increase': this.valueDirection === 'increase',
                 'is-decrease': this.valueDirection === 'decrease',
-            } }, formatLocaleNumber(this.value))), h("ds-button", { key: 'ca7098858e2df051efbaea9fffeff61886098cd0', ref: el => (this.increaseButtonEl = el), part: "increase", "data-testid": "ds-counter-increase", color: this.invalid
+            } }, formatLocaleNumber(this.value))), h("ds-button", { key: 'c6273e0b8351d7b9e63a37430ac2f4456acda82f', ref: el => (this.increaseButtonEl = el), part: "increase", "data-testid": "ds-counter-increase", color: this.invalid
                 ? 'danger'
                 : this.color === 'danger' || this.color === 'warning' || this.color === 'success'
                     ? this.color

package/dist/collection/components/forms/datepicker/datepicker.host.css

@@ -1 +1 @@
-.air-datepicker-cell.-year-.-other-decade-,.air-datepicker-cell.-day-.-other-month-{color:var(--adp-color-other-month)}.air-datepicker-cell.-year-.-other-decade-:hover,.air-datepicker-cell.-day-.-other-month-:hover{color:var(--adp-color-other-month-hover)}.-disabled-.-focus-.air-datepicker-cell.-year-.-other-decade-,.-disabled-.-focus-.air-datepicker-cell.-day-.-other-month-{color:var(--adp-color-other-month)}.-selected-.air-datepicker-cell.-year-.-other-decade-,.-selected-.air-datepicker-cell.-day-.-other-month-{color:#fff;background:var(--adp-background-color-selected-other-month)}.-selected-.-focus-.air-datepicker-cell.-year-.-other-decade-,.-selected-.-focus-.air-datepicker-cell.-day-.-other-month-{background:var(--adp-background-color-selected-other-month-focused)}.-in-range-.air-datepicker-cell.-year-.-other-decade-,.-in-range-.air-datepicker-cell.-day-.-other-month-{background-color:var(--adp-background-color-in-range);color:var(--adp-color)}.-in-range-.-focus-.air-datepicker-cell.-year-.-other-decade-,.-in-range-.-focus-.air-datepicker-cell.-day-.-other-month-{background-color:var(--adp-background-color-in-range-focused)}.air-datepicker-cell.-year-.-other-decade-:empty,.air-datepicker-cell.-day-.-other-month-:empty{background:none;border:none}.air-datepicker-cell{border-radius:var(--adp-cell-border-radius);box-sizing:border-box;cursor:pointer;display:flex;position:relative;align-items:center;justify-content:center;z-index:1}.air-datepicker-cell.-focus-{background:var(--adp-cell-background-color-hover)}.air-datepicker-cell.-current-{color:var(--adp-color-current-date)}.air-datepicker-cell.-current-.-focus-{color:var(--adp-color)}.air-datepicker-cell.-current-.-in-range-{color:var(--adp-color-current-date)}.air-datepicker-cell.-disabled-{cursor:default;color:var(--adp-color-disabled)}.air-datepicker-cell.-disabled-.-focus-{color:var(--adp-color-disabled)}.air-datepicker-cell.-disabled-.-in-range-{color:var(--adp-color-disabled-in-range)}.air-datepicker-cell.-disabled-.-current-.-focus-{color:var(--adp-color-disabled)}.air-datepicker-cell.-in-range-{background:var(--adp-cell-background-color-in-range);border-radius:0}.air-datepicker-cell.-in-range-:hover,.air-datepicker-cell.-in-range-.-focus-{background:var(--adp-cell-background-color-in-range-hover)}.air-datepicker-cell.-range-from-{border:1px solid var(--adp-cell-border-color-in-range);background-color:var(--adp-cell-background-color-in-range);border-radius:var(--adp-cell-border-radius) 0 0 var(--adp-cell-border-radius)}.air-datepicker-cell.-range-to-{border:1px solid var(--adp-cell-border-color-in-range);background-color:var(--adp-cell-background-color-in-range);border-radius:0 var(--adp-cell-border-radius) var(--adp-cell-border-radius) 0}.air-datepicker-cell.-range-to-.-range-from-{border-radius:var(--adp-cell-border-radius)}.air-datepicker-cell.-selected-{color:#fff;border:none;background:var(--adp-cell-background-color-selected)}.air-datepicker-cell.-selected-.-current-{color:#fff;background:var(--adp-cell-background-color-selected)}.air-datepicker-cell.-selected-.-focus-{background:var(--adp-cell-background-color-selected-hover)}.air-datepicker-body{transition:all var(--adp-transition-duration) var(--adp-transition-ease)}.air-datepicker-body.-hidden-{display:none}.air-datepicker-body--day-names{display:grid;grid-template-columns:repeat(7, var(--adp-day-cell-width));margin:8px 0 3px}.air-datepicker-body--day-name{color:var(--adp-day-name-color);display:flex;align-items:center;justify-content:center;flex:1;text-align:center;text-transform:uppercase;font-size:.8em}.air-datepicker-body--day-name.-clickable-{cursor:pointer}.air-datepicker-body--day-name.-clickable-:hover{color:var(--adp-day-name-color-hover)}.air-datepicker-body--cells{display:grid}.air-datepicker-body--cells.-days-{grid-template-columns:repeat(7, var(--adp-day-cell-width));grid-auto-rows:var(--adp-day-cell-height)}.air-datepicker-body--cells.-months-{grid-template-columns:repeat(3, 1fr);grid-auto-rows:var(--adp-month-cell-height)}.air-datepicker-body--cells.-years-{grid-template-columns:repeat(4, 1fr);grid-auto-rows:var(--adp-year-cell-height)}.air-datepicker-nav{display:flex;justify-content:space-between;border-bottom:1px solid var(--adp-border-color-inner);min-height:var(--adp-nav-height);padding:var(--adp-padding);box-sizing:content-box}.-only-timepicker- .air-datepicker-nav{display:none}.air-datepicker-nav--title,.air-datepicker-nav--action{display:flex;cursor:pointer;align-items:center;justify-content:center}.air-datepicker-nav--action{width:var(--adp-nav-action-size);border-radius:var(--adp-border-radius);-webkit-user-select:none;-moz-user-select:none;user-select:none}.air-datepicker-nav--action:hover{background:var(--adp-background-color-hover)}.air-datepicker-nav--action:active{background:var(--adp-background-color-active)}.air-datepicker-nav--action.-disabled-{visibility:hidden}.air-datepicker-nav--action svg{width:32px;height:32px}.air-datepicker-nav--action path{fill:none;stroke:var(--adp-nav-arrow-color);stroke-width:2px}.air-datepicker-nav--title{border-radius:var(--adp-border-radius);padding:0 8px}.air-datepicker-nav--title i{font-style:normal;color:var(--adp-nav-color-secondary);margin-left:.3em}.air-datepicker-nav--title:hover{background:var(--adp-background-color-hover)}.air-datepicker-nav--title:active{background:var(--adp-background-color-active)}.air-datepicker-nav--title.-disabled-{cursor:default;background:none}.air-datepicker-buttons{display:grid;grid-auto-columns:1fr;grid-auto-flow:column}.air-datepicker-button{display:inline-flex;color:var(--adp-btn-color);border-radius:var(--adp-btn-border-radius);cursor:pointer;height:var(--adp-btn-height);border:none;background:rgba(255, 255, 255, 0)}.air-datepicker-button:hover{color:var(--adp-btn-color-hover);background:var(--adp-btn-background-color-hover)}.air-datepicker-button:focus{color:var(--adp-btn-color-hover);background:var(--adp-btn-background-color-hover);outline:none}.air-datepicker-button:active{background:var(--adp-btn-background-color-active)}.air-datepicker-button span{outline:none;display:flex;align-items:center;justify-content:center;width:100%;height:100%}.air-datepicker-time{display:grid;grid-template-columns:max-content 1fr;grid-column-gap:12px;align-items:center;position:relative;padding:0 var(--adp-time-padding-inner)}.-only-timepicker- .air-datepicker-time{border-top:none}.air-datepicker-time--current{display:flex;align-items:center;flex:1;font-size:14px;text-align:center}.air-datepicker-time--current-colon{margin:0 2px 3px;line-height:1}.air-datepicker-time--current-hours,.air-datepicker-time--current-minutes{line-height:1;font-size:19px;font-family:"Century Gothic",CenturyGothic,AppleGothic,sans-serif;position:relative;z-index:1}.air-datepicker-time--current-hours:after,.air-datepicker-time--current-minutes:after{content:"";background:var(--adp-background-color-hover);border-radius:var(--adp-border-radius);position:absolute;left:-2px;top:-3px;right:-2px;bottom:-2px;z-index:-1;opacity:0}.air-datepicker-time--current-hours.-focus-:after,.air-datepicker-time--current-minutes.-focus-:after{opacity:1}.air-datepicker-time--current-ampm{text-transform:uppercase;align-self:flex-end;color:var(--adp-time-day-period-color);margin-left:6px;font-size:11px;margin-bottom:1px}.air-datepicker-time--row{display:flex;align-items:center;font-size:11px;height:17px;background:linear-gradient(to right, var(--adp-time-track-color), var(--adp-time-track-color)) left 50%/100% var(--adp-time-track-height) no-repeat}.air-datepicker-time--row:first-child{margin-bottom:4px}.air-datepicker-time--row input[type=range]{background:none;cursor:pointer;flex:1;height:100%;width:100%;padding:0;margin:0;-webkit-appearance:none}.air-datepicker-time--row input[type=range]::-webkit-slider-thumb{-webkit-appearance:none}.air-datepicker-time--row input[type=range]::-ms-tooltip{display:none}.air-datepicker-time--row input[type=range]:hover::-webkit-slider-thumb{border-color:var(--adp-time-track-color-hover)}.air-datepicker-time--row input[type=range]:hover::-moz-range-thumb{border-color:var(--adp-time-track-color-hover)}.air-datepicker-time--row input[type=range]:hover::-ms-thumb{border-color:var(--adp-time-track-color-hover)}.air-datepicker-time--row input[type=range]:focus{outline:none}.air-datepicker-time--row input[type=range]:focus::-webkit-slider-thumb{background:var(--adp-cell-background-color-selected);border-color:var(--adp-cell-background-color-selected)}.air-datepicker-time--row input[type=range]:focus::-moz-range-thumb{background:var(--adp-cell-background-color-selected);border-color:var(--adp-cell-background-color-selected)}.air-datepicker-time--row input[type=range]:focus::-ms-thumb{background:var(--adp-cell-background-color-selected);border-color:var(--adp-cell-background-color-selected)}.air-datepicker-time--row input[type=range]::-webkit-slider-thumb{box-sizing:border-box;height:12px;width:12px;border-radius:3px;border:1px solid var(--adp-time-track-color);background:#fff;cursor:pointer;-webkit-transition:background var(--adp-transition-duration);transition:background var(--adp-transition-duration)}.air-datepicker-time--row input[type=range]::-moz-range-thumb{box-sizing:border-box;height:12px;width:12px;border-radius:3px;border:1px solid var(--adp-time-track-color);background:#fff;cursor:pointer;-moz-transition:background var(--adp-transition-duration);transition:background var(--adp-transition-duration)}.air-datepicker-time--row input[type=range]::-ms-thumb{box-sizing:border-box;height:12px;width:12px;border-radius:3px;border:1px solid var(--adp-time-track-color);background:#fff;cursor:pointer;-ms-transition:background var(--adp-transition-duration);transition:background var(--adp-transition-duration)}.air-datepicker-time--row input[type=range]::-webkit-slider-thumb{margin-top:calc(var(--adp-time-thumb-size)/2*-1)}.air-datepicker-time--row input[type=range]::-webkit-slider-runnable-track{border:none;height:var(--adp-time-track-height);cursor:pointer;color:rgba(0, 0, 0, 0);background:rgba(0, 0, 0, 0)}.air-datepicker-time--row input[type=range]::-moz-range-track{border:none;height:var(--adp-time-track-height);cursor:pointer;color:rgba(0, 0, 0, 0);background:rgba(0, 0, 0, 0)}.air-datepicker-time--row input[type=range]::-ms-track{border:none;height:var(--adp-time-track-height);cursor:pointer;color:rgba(0, 0, 0, 0);background:rgba(0, 0, 0, 0)}.air-datepicker-time--row input[type=range]::-ms-fill-lower{background:rgba(0, 0, 0, 0)}.air-datepicker-time--row input[type=range]::-ms-fill-upper{background:rgba(0, 0, 0, 0)}.air-datepicker{--adp-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";--adp-font-size: 14px;--adp-width: 246px;--adp-z-index: 100;--adp-padding: 4px;--adp-grid-areas: "nav" "body" "timepicker" "buttons";--adp-transition-duration: .3s;--adp-transition-ease: ease-out;--adp-transition-offset: 8px;--adp-background-color: #fff;--adp-background-color-hover: #f0f0f0;--adp-background-color-active: #eaeaea;--adp-background-color-in-range: rgba(92, 196, 239, .1);--adp-background-color-in-range-focused: rgba(92, 196, 239, .2);--adp-background-color-selected-other-month-focused: #8ad5f4;--adp-background-color-selected-other-month: #a2ddf6;--adp-color: #4a4a4a;--adp-color-secondary: #9c9c9c;--adp-accent-color: #4eb5e6;--adp-color-current-date: var(--adp-accent-color);--adp-color-other-month: #dedede;--adp-color-disabled: #aeaeae;--adp-color-disabled-in-range: #939393;--adp-color-other-month-hover: #c5c5c5;--adp-border-color: #dbdbdb;--adp-border-color-inner: #efefef;--adp-border-radius: 4px;--adp-border-color-inline: #d7d7d7;--adp-nav-height: 32px;--adp-nav-arrow-color: var(--adp-color-secondary);--adp-nav-action-size: 32px;--adp-nav-color-secondary: var(--adp-color-secondary);--adp-day-name-color: #ff9a19;--adp-day-name-color-hover: #8ad5f4;--adp-day-cell-width: 1fr;--adp-day-cell-height: 32px;--adp-month-cell-height: 42px;--adp-year-cell-height: 56px;--adp-pointer-size: 10px;--adp-poiner-border-radius: 2px;--adp-pointer-offset: 14px;--adp-cell-border-radius: 4px;--adp-cell-background-color-hover: var(--adp-background-color-hover);--adp-cell-background-color-selected: #5cc4ef;--adp-cell-background-color-selected-hover: #45bced;--adp-cell-background-color-in-range: rgba(92, 196, 239, 0.1);--adp-cell-background-color-in-range-hover: rgba(92, 196, 239, 0.2);--adp-cell-border-color-in-range: var(--adp-cell-background-color-selected);--adp-btn-height: 32px;--adp-btn-color: var(--adp-accent-color);--adp-btn-color-hover: var(--adp-color);--adp-btn-border-radius: var(--adp-border-radius);--adp-btn-background-color-hover: var(--adp-background-color-hover);--adp-btn-background-color-active: var(--adp-background-color-active);--adp-time-track-height: 1px;--adp-time-track-color: #dedede;--adp-time-track-color-hover: #b1b1b1;--adp-time-thumb-size: 12px;--adp-time-padding-inner: 10px;--adp-time-day-period-color: var(--adp-color-secondary);--adp-mobile-font-size: 16px;--adp-mobile-nav-height: 40px;--adp-mobile-width: 320px;--adp-mobile-day-cell-height: 38px;--adp-mobile-month-cell-height: 48px;--adp-mobile-year-cell-height: 64px}.air-datepicker-overlay{--adp-overlay-background-color: rgba(0, 0, 0, .3);--adp-overlay-transition-duration: .3s;--adp-overlay-transition-ease: ease-out;--adp-overlay-z-index: 99}.air-datepicker{background:var(--adp-background-color);border:1px solid var(--adp-border-color);box-shadow:0 4px 12px rgba(0, 0, 0, 0.15);border-radius:var(--adp-border-radius);box-sizing:content-box;display:grid;grid-template-columns:1fr;grid-template-rows:repeat(4, max-content);grid-template-areas:var(--adp-grid-areas);font-family:var(--adp-font-family),sans-serif;font-size:var(--adp-font-size);color:var(--adp-color);width:var(--adp-width);position:absolute;transition:opacity var(--adp-transition-duration) var(--adp-transition-ease),transform var(--adp-transition-duration) var(--adp-transition-ease);z-index:var(--adp-z-index)}.air-datepicker:not(.-custom-position-){opacity:0}.air-datepicker.-from-top-{transform:translateY(calc(var(--adp-transition-offset) * -1))}.air-datepicker.-from-right-{transform:translateX(var(--adp-transition-offset))}.air-datepicker.-from-bottom-{transform:translateY(var(--adp-transition-offset))}.air-datepicker.-from-left-{transform:translateX(calc(var(--adp-transition-offset) * -1))}.air-datepicker.-active-:not(.-custom-position-){transform:translate(0, 0);opacity:1}.air-datepicker.-active-.-custom-position-{transition:none}.air-datepicker.-inline-{border-color:var(--adp-border-color-inline);box-shadow:none;position:static;left:auto;right:auto;opacity:1;transform:none}.air-datepicker.-inline- .air-datepicker--pointer{display:none}.air-datepicker.-is-mobile-{--adp-font-size: var(--adp-mobile-font-size);--adp-day-cell-height: var(--adp-mobile-day-cell-height);--adp-month-cell-height: var(--adp-mobile-month-cell-height);--adp-year-cell-height: var(--adp-mobile-year-cell-height);--adp-nav-height: var(--adp-mobile-nav-height);--adp-nav-action-size: var(--adp-mobile-nav-height);position:fixed;width:var(--adp-mobile-width);border:none}.air-datepicker.-is-mobile- *{-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}.air-datepicker.-is-mobile- .air-datepicker--pointer{display:none}.air-datepicker.-is-mobile-:not(.-custom-position-){transform:translate(-50%, calc(-50% + var(--adp-transition-offset)))}.air-datepicker.-is-mobile-.-active-:not(.-custom-position-){transform:translate(-50%, -50%)}.air-datepicker.-custom-position-{transition:none}.air-datepicker-global-container{position:absolute;left:0;top:0}.air-datepicker--pointer{--pointer-half-size: calc(var(--adp-pointer-size) / 2);position:absolute;width:var(--adp-pointer-size);height:var(--adp-pointer-size);z-index:-1}.air-datepicker--pointer:after{content:"";position:absolute;background:#fff;border-top:1px solid var(--adp-border-color-inline);border-right:1px solid var(--adp-border-color-inline);border-top-right-radius:var(--adp-poiner-border-radius);width:var(--adp-pointer-size);height:var(--adp-pointer-size);box-sizing:border-box}.-top-left- .air-datepicker--pointer,.-top-center- .air-datepicker--pointer,.-top-right- .air-datepicker--pointer,[data-popper-placement^=top] .air-datepicker--pointer{top:calc(100% - var(--pointer-half-size) + 1px)}.-top-left- .air-datepicker--pointer:after,.-top-center- .air-datepicker--pointer:after,.-top-right- .air-datepicker--pointer:after,[data-popper-placement^=top] .air-datepicker--pointer:after{transform:rotate(135deg)}.-right-top- .air-datepicker--pointer,.-right-center- .air-datepicker--pointer,.-right-bottom- .air-datepicker--pointer,[data-popper-placement^=right] .air-datepicker--pointer{right:calc(100% - var(--pointer-half-size) + 1px)}.-right-top- .air-datepicker--pointer:after,.-right-center- .air-datepicker--pointer:after,.-right-bottom- .air-datepicker--pointer:after,[data-popper-placement^=right] .air-datepicker--pointer:after{transform:rotate(225deg)}.-bottom-left- .air-datepicker--pointer,.-bottom-center- .air-datepicker--pointer,.-bottom-right- .air-datepicker--pointer,[data-popper-placement^=bottom] .air-datepicker--pointer{bottom:calc(100% - var(--pointer-half-size) + 1px)}.-bottom-left- .air-datepicker--pointer:after,.-bottom-center- .air-datepicker--pointer:after,.-bottom-right- .air-datepicker--pointer:after,[data-popper-placement^=bottom] .air-datepicker--pointer:after{transform:rotate(315deg)}.-left-top- .air-datepicker--pointer,.-left-center- .air-datepicker--pointer,.-left-bottom- .air-datepicker--pointer,[data-popper-placement^=left] .air-datepicker--pointer{left:calc(100% - var(--pointer-half-size) + 1px)}.-left-top- .air-datepicker--pointer:after,.-left-center- .air-datepicker--pointer:after,.-left-bottom- .air-datepicker--pointer:after,[data-popper-placement^=left] .air-datepicker--pointer:after{transform:rotate(45deg)}.-top-left- .air-datepicker--pointer,.-bottom-left- .air-datepicker--pointer{left:var(--adp-pointer-offset)}.-top-right- .air-datepicker--pointer,.-bottom-right- .air-datepicker--pointer{right:var(--adp-pointer-offset)}.-top-center- .air-datepicker--pointer,.-bottom-center- .air-datepicker--pointer{left:calc(50% - var(--adp-pointer-size)/2)}.-left-top- .air-datepicker--pointer,.-right-top- .air-datepicker--pointer{top:var(--adp-pointer-offset)}.-left-bottom- .air-datepicker--pointer,.-right-bottom- .air-datepicker--pointer{bottom:var(--adp-pointer-offset)}.-left-center- .air-datepicker--pointer,.-right-center- .air-datepicker--pointer{top:calc(50% - var(--adp-pointer-size)/2)}.air-datepicker--navigation{grid-area:nav}.air-datepicker--content{box-sizing:content-box;padding:var(--adp-padding);grid-area:body}.-only-timepicker- .air-datepicker--content{display:none}.air-datepicker--time{grid-area:timepicker}.air-datepicker--buttons{grid-area:buttons}.air-datepicker--buttons,.air-datepicker--time{padding:var(--adp-padding);border-top:1px solid var(--adp-border-color-inner)}.air-datepicker-overlay{position:fixed;background:var(--adp-overlay-background-color);left:0;top:0;width:0;height:0;opacity:0;transition:opacity var(--adp-overlay-transition-duration) var(--adp-overlay-transition-ease),left 0s,height 0s,width 0s;transition-delay:0s,var(--adp-overlay-transition-duration),var(--adp-overlay-transition-duration),var(--adp-overlay-transition-duration);z-index:var(--adp-overlay-z-index)}.air-datepicker-overlay.-active-{opacity:1;width:100%;height:100%;transition:opacity var(--adp-overlay-transition-duration) var(--adp-overlay-transition-ease),height 0s,width 0s}:host{--_form-field-gap: var(--form-field-gap, var(--mod-form-field-gap, 0.25rem));--_form-container-background: var(--form-container-background, var(--mod-form-container-background, var(--ds-form-default-container-background)));--_form-container-border: var(--form-container-border, var(--mod-form-container-border, var(--ds-form-default-container-border)));--_form-container-radius: var(--form-container-radius, var(--mod-form-container-radius, var(--ds-form-container-radius)));--_form-container-hover-background: var(--form-container-hover-background, var(--mod-form-container-hover-background, var(--ds-form-hover-container-background)));--_form-container-active-background: var(--form-container-active-background, var(--mod-form-container-active-background, var(--ds-form-active-container-background)));--_form-container-focus-background: var(--form-container-focus-background, var(--mod-form-container-focus-background, var(--ds-form-focus-container-background)));--_form-container-hover-border: var(--form-container-hover-border, var(--mod-form-container-hover-border, var(--ds-form-hover-container-border)));--_form-container-active-border: var(--form-container-active-border, var(--mod-form-container-active-border, var(--ds-form-active-container-border)));--_form-container-focus-border: var(--form-container-focus-border, var(--mod-form-container-focus-border, var(--ds-form-focus-container-border)));--_form-label-color: var(--form-label-color, var(--mod-form-label-color, var(--ds-form-default-label-color)));--_form-label-family: var(--form-label-family, var(--mod-form-label-family, var(--ds-form-default-label-typo-font-family)));--_form-label-weight: var(--form-label-weight, var(--mod-form-label-weight, var(--ds-form-default-label-typo-font-weight)));--_form-label-line-height: var(--form-label-line-height, var(--mod-form-label-line-height, var(--ds-form-default-label-typo-line-height)));--_form-label-size: var(--form-label-size, var(--mod-form-label-size, var(--ds-form-default-label-typo-font-size)));--_form-description-color: var(--form-description-color, var(--mod-form-description-color, var(--ds-form-default-description-color)));--_form-description-family: var(--form-description-family, var(--mod-form-description-family, var(--ds-form-default-description-typo-font-family)));--_form-description-weight: var(--form-description-weight, var(--mod-form-description-weight, var(--ds-form-default-description-typo-font-weight)));--_form-description-line-height: var(--form-description-line-height, var(--mod-form-description-line-height, var(--ds-form-default-description-typo-line-height)));--_form-description-size: var(--form-description-size, var(--mod-form-description-size, var(--ds-form-default-description-typo-font-size)));--_datepicker-family: var(--datepicker-family, var(--mod-datepicker-family, var(--ds-form-default-control-typo-font-family)));--_datepicker-weight: var(--datepicker-weight, var(--mod-datepicker-weight, var(--ds-form-default-control-typo-font-weight)));--_datepicker-line-height: var(--datepicker-line-height, var(--mod-datepicker-line-height, var(--ds-form-default-control-typo-line-height)));--_datepicker-size: var(--datepicker-size, var(--mod-datepicker-size, var(--ds-form-default-control-typo-font-size)));--_datepicker-color: var(--datepicker-color, var(--mod-datepicker-color, var(--ds-form-default-control-value-color)));--_datepicker-placeholder: var(--datepicker-placeholder, var(--mod-datepicker-placeholder, var(--ds-form-default-control-placeholder-color)));--_datepicker-trigger-icon-color-hover: var(--datepicker-trigger-icon-color-hover, var(--mod-datepicker-trigger-icon-color-hover, var(--ds-datepicker-trigger-color-hover)));--_datepicker-trigger-icon-color-active: var(--datepicker-trigger-icon-color-active, var(--mod-datepicker-trigger-icon-color-active, var(--ds-datepicker-trigger-color-active)));--_datepicker-trigger-icon-color-disabled: var(--datepicker-trigger-icon-color-disabled, var(--mod-datepicker-trigger-icon-color-disabled, var(--ds-datepicker-trigger-color-disabled)));--_datepicker-focus-color: var(--datepicker-focus-color, var(--mod-datepicker-focus-color, var(--ds-alias-interaction-focus-color-base)));--_datepicker-popup-shadow: var(--datepicker-popup-shadow, var(--mod-datepicker-popup-shadow, var(--ds-datepicker-popup-shadow)));--_datepicker-calendar-text-color: var(--datepicker-calendar-text-color, var(--mod-datepicker-calendar-text-color, var(--ds-datepicker-calendar-color-text)));--_datepicker-calendar-family: var(--datepicker-calendar-family, var(--mod-datepicker-calendar-family, var(--ds-datepicker-calendar-family)));--_datepicker-calendar-size: var(--datepicker-calendar-size, var(--mod-datepicker-calendar-size, var(--ds-datepicker-calendar-size)));--_datepicker-calendar-weight: var(--datepicker-calendar-weight, var(--mod-datepicker-calendar-weight, var(--ds-datepicker-calendar-weight)));--_datepicker-calendar-radius: var(--datepicker-calendar-radius, var(--mod-datepicker-calendar-radius, var(--ds-datepicker-calendar-radius)));--_datepicker-calendar-shadow: var(--datepicker-calendar-shadow, var(--mod-datepicker-calendar-shadow, var(--ds-datepicker-calendar-shadow)));--_datepicker-calendar-color-inner-border: var(--datepicker-calendar-color-inner-border, var(--mod-datepicker-calendar-color-inner-border, var(--ds-datepicker-calendar-color-inner-border)));--_datepicker-calendar-disabled-color: var(--datepicker-calendar-disabled-color, var(--mod-datepicker-calendar-disabled-color, var(--ds-datepicker-calendar-color-disabled)));--_datepicker-calendar-day-background-hover: var(--datepicker-calendar-day-background-hover, var(--mod-datepicker-calendar-day-background-hover, var(--ds-datepicker-calendar-color-day-hover-background)));--_datepicker-calendar-day-background-active: var(--datepicker-calendar-day-background-active, var(--mod-datepicker-calendar-day-background-active, var(--ds-datepicker-calendar-color-day-active-background)));--_datepicker-calendar-day-background-selected: var(--datepicker-calendar-day-background-selected, var(--mod-datepicker-calendar-day-background-selected, var(--ds-datepicker-calendar-color-day-selected-background)));--_datepicker-calendar-day-background-selected-hover: var(--datepicker-calendar-day-background-selected-hover, var(--mod-datepicker-calendar-day-background-selected-hover, var(--ds-datepicker-calendar-color-day-selected-hover-background)));--_datepicker-calendar-color-current-date: var(--datepicker-calendar-color-current-date, var(--mod-datepicker-calendar-color-current-date, var(--ds-datepicker-calendar-color-current-date)));--_datepicker-calendar-day-weight: var(--datepicker-calendar-day-weight, var(--mod-datepicker-calendar-day-weight, var(--ds-datepicker-calendar-day-weight-base)));--_datepicker-calendar-day-weight-selected: var(--datepicker-calendar-day-weight-selected, var(--mod-datepicker-calendar-day-weight-selected, var(--ds-datepicker-calendar-day-weight-selected)));--_datepicker-calendar-day-name-family: var(--datepicker-calendar-day-name-family, var(--mod-datepicker-calendar-day-name-family, var(--ds-datepicker-calendar-day-name-family)));--_datepicker-calendar-day-name-weight: var(--datepicker-calendar-day-name-weight, var(--mod-datepicker-calendar-day-name-weight, var(--ds-datepicker-calendar-day-name-weight)));--_datepicker-calendar-nav-color: var(--datepicker-calendar-nav-color, var(--mod-datepicker-calendar-nav-color, var(--ds-datepicker-calendar-nav-color-base)));--_datepicker-calendar-nav-color-hover: var(--datepicker-calendar-nav-color-hover, var(--mod-datepicker-calendar-nav-color-hover, var(--ds-datepicker-calendar-nav-color-hover)));--_datepicker-calendar-nav-color-active: var(--datepicker-calendar-nav-color-active, var(--mod-datepicker-calendar-nav-color-active, var(--ds-datepicker-calendar-nav-color-active)));--_datepicker-calendar-nav-radius: var(--datepicker-calendar-nav-radius, var(--mod-datepicker-calendar-nav-radius, var(--ds-datepicker-calendar-nav-radius)));--_datepicker-calendar-nav-color-disabled: var(--datepicker-calendar-nav-color-disabled, var(--mod-datepicker-calendar-nav-color-disabled, var(--ds-datepicker-calendar-nav-color-disabled)))}:host{position:relative;display:grid;gap:var(--_form-field-gap)}:host :where(fieldset){margin:0;padding:0;border:none}:host :where(legend){padding:0;float:left;width:100%}:host label{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:block;box-sizing:content-box;hyphens:auto;overflow-wrap:break-word;text-wrap:balance;min-width:0;color:var(--_form-label-color);font-family:var(--_form-label-family);font-weight:var(--_form-label-weight);font-size:var(--_form-label-size);line-height:var(--_form-label-line-height)}:host #description{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:flex;box-sizing:content-box;hyphens:auto;overflow-wrap:break-word;text-wrap:balance;min-width:0;gap:.25rem;min-height:1.125rem;color:var(--_form-description-color);font-family:var(--_form-description-family);font-weight:var(--_form-description-weight);font-size:var(--_form-description-size);line-height:var(--_form-description-line-height)}:host #description ds-icon{--icon-color: var(--_form-description-color)}:host #input{border:none;outline:none;box-shadow:none;position:relative;background:inherit;flex:1;color:var(--_datepicker-color);font-family:var(--_datepicker-family);font-weight:var(--_datepicker-weight);font-size:var(--_datepicker-size);line-height:var(--_datepicker-line-height);border-radius:var(--_datepicker-container-radius)}:host #input::placeholder{color:var(--_datepicker-placeholder)}:host #input::-moz-placeholder{color:var(--_datepicker-placeholder)}:host #input::-webkit-input-placeholder{color:var(--_datepicker-placeholder)}:host #input:-moz-placeholder{color:var(--_datepicker-placeholder)}:host #input:-ms-input-placeholder{color:var(--_datepicker-placeholder)}:host #inner{position:relative;display:grid;gap:var(--_form-field-gap)}:host(:not(.is-inline)) #container{box-sizing:border-box;clear:both;display:flex;width:100%;align-items:center;min-height:3rem;gap:.25rem;padding-inline:.5rem;background:var(--_form-container-background);border:var(--_form-container-border);border-radius:var(--_form-container-radius)}@media(hover: hover)and (pointer: fine){:host(:not(.is-inline)) #container:hover,:host(:not(.is-inline)) #container.is-hovered{background:var(--_form-container-hover-background);border:var(--_form-container-hover-border)}}:host(:not(.is-inline)) #container:active,:host(:not(.is-inline)) #container.is-pressed{background:var(--_form-container-active-background);border:var(--_form-container-active-border)}:host(:not(.is-inline)) #container:focus-within:not(:active),:host(:not(.is-inline)) #container.is-focused:not(:active){background:var(--_form-container-focus-background);border:var(--_form-container-focus-border)}:host(.is-inline) #container{box-sizing:border-box;clear:both;display:flex;width:100%;align-items:center;min-height:3rem;gap:.25rem}:host #trigger{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-user-drag:none;user-drag:none;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}@media print{:host #trigger{display:none !important}}:host #trigger{border-radius:var(--ds-alias-radius-base);background:rgba(0,0,0,0);width:1.5rem;height:1.5rem;border:none;appearance:auto;position:relative;display:inline-flex;flex-wrap:nowrap;flex-shrink:0;justify-content:center;align-items:center;text-align:center;vertical-align:middle;cursor:pointer;word-break:normal;box-shadow:none;outline:none;box-sizing:border-box;text-decoration:none;user-select:none;touch-action:manipulation;transition-property:color,background-color,border-color,box-shadow,text-shadow;transition-duration:.2s;transition-timing-function:cubic-bezier(0, 0, 0.2, 1)}:host #trigger::-moz-focus-inner{border:0}:host #trigger:disabled{pointer-events:none}@media(hover: hover)and (pointer: fine){:host #trigger:hover,:host #trigger.is-hovered{--icon-color: var(--_datepicker-trigger-icon-color-hover)}}:host #trigger:active,:host #trigger.is-pressed{--icon-color: var(--_datepicker-trigger-icon-color-active)}@media(hover: hover)and (pointer: fine){:host #trigger:focus-visible:not(:active),:host #trigger.is-focused:not(:active){box-shadow:var(--ds-alias-interaction-focus-color-border) 0 0 0 2px,var(--_datepicker-focus-color) 0 0 0 5px !important}}:host #clear{--_close-color-background: var(--close-color-background, var(--mod-close-color-background, var(--ds-close-primary-color-background-base)));--_close-color-background-hover: var(--close-color-background-hover, var(--mod-close-color-background-hover, var(--ds-close-primary-color-background-hover)));--_close-color-background-active: var(--close-color-background-active, var(--mod-close-color-background-active, var(--ds-close-primary-color-background-active)));--_close-color-icon: var(--close-color-icon, var(--mod-close-color-icon, var(--ds-close-primary-color-icon-base)));--_close-color-focus: var(--close-color-focus, var(--mod-close-color-focus, var(--ds-alias-interaction-focus-color-base)));--_close-radius: var(--close-radius, var(--mod-close-radius, var(--ds-close-radius)));--_close-size-icon: var(--close-size-icon, var(--mod-close-size-icon, var(--ds-close-size-base)));--_close-p: var(--close-p, var(--mod-close-p, var(--ds-close-padding-base)));--_close-icon: var(--close-icon, var(--mod-close-icon, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath fill-rule='evenodd' d='M1.70711 0.292893C1.31658 -0.0976311 0.683417 -0.0976311 0.292893 0.292893C-0.0976311 0.683417 -0.0976311 1.31658 0.292893 1.70711L5.58579 7L0.292893 12.2929C-0.0976311 12.6834 -0.0976311 13.3166 0.292893 13.7071C0.683417 14.0976 1.31658 14.0976 1.70711 13.7071L7 8.41421L12.2929 13.7071C12.6834 14.0976 13.3166 14.0976 13.7071 13.7071C14.0976 13.3166 14.0976 12.6834 13.7071 12.2929L8.41421 7L13.7071 1.70711C14.0976 1.31658 14.0976 0.683417 13.7071 0.292893C13.3166 -0.0976311 12.6834 -0.0976311 12.2929 0.292893L7 5.58579L1.70711 0.292893Z' clip-rule='evenodd'/%3E%3C/svg%3E")));-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-user-drag:none;user-drag:none}@media print{:host #clear{display:none !important}}:host #clear{position:relative;display:inline-flex;vertical-align:top;border:none;background:rgba(0,0,0,0);border-radius:var(--_close-radius);width:var(--_close-size-icon);height:var(--_close-size-icon);appearance:none;outline:none;touch-action:manipulation;transition-property:color,background-color,border-color,box-shadow,text-shadow;transition-duration:.2s;transition-timing-function:cubic-bezier(0, 0, 0.2, 1);justify-content:center;align-items:center}:host #clear::after{content:"";display:block;min-width:calc(var(--_close-size-icon) - var(--_close-p));min-height:calc(var(--_close-size-icon) - var(--_close-p));max-width:calc(var(--_close-size-icon) - var(--_close-p));max-height:calc(var(--_close-size-icon) - var(--_close-p));mask-image:var(--_close-icon);mask-repeat:no-repeat;mask-position:center;mask-size:contain;background:var(--_close-color-icon)}:host #clear:not(:disabled){cursor:pointer}@media(hover: hover)and (pointer: fine){:host #clear:not(:disabled):focus-visible:not(:active),:host #clear:not(:disabled).is-focused:not(:active){box-shadow:var(--ds-alias-interaction-focus-color-border) 0 0 0 2px,var(--_close-color-focus) 0 0 0 5px !important}}:host #container{position:relative}:host #popup{position:absolute;display:block;top:100%;left:0;z-index:var(--ds-popup-z-index, 100);box-shadow:var(--_datepicker-popup-shadow);transition:transform .2s,opacity .2s,-webkit-transform .2s;opacity:1;transform:scaleY(1);transform-origin:center top;overflow:hidden}:host #popup[aria-hidden=true]{opacity:0;transform:scaleY(0)}@media(prefers-reduced-motion: reduce){:host #popup{transition:none !important;animation:none !important}}:host(.is-danger){--mod-form-container-border: var(--ds-form-danger-container-border);--mod-form-description-color: var(--ds-form-danger-description-color);--mod-form-container-hover-border: var(--ds-form-danger-container-border);--mod-form-container-active-border: var(--ds-form-danger-container-border)}:host(.is-success){--mod-form-container-border: var(--ds-form-success-container-border);--mod-form-description-color: var(--ds-form-success-description-color);--mod-form-container-hover-border: var(--ds-form-success-container-border);--mod-form-container-active-border: var(--ds-form-success-container-border)}:host(.is-warning){--mod-form-container-border: var(--ds-form-warning-container-border);--mod-form-description-color: var(--ds-form-warning-description-color);--mod-form-container-hover-border: var(--ds-form-warning-container-border);--mod-form-container-active-border: var(--ds-form-warning-container-border)}:host(.is-disabled),:host(.is-disabled) #label,:host(.is-disabled) #description,:host(.is-disabled) #input,:host(.is-disabled) #clear,:host(.is-disabled) #trigger{pointer-events:none;cursor:default}:host(.is-disabled) #trigger{--icon-color: var(--_datepicker-trigger-icon-color-disabled)}:host(.is-disabled){--mod-form-container-background: var(--ds-form-disabled-container-background);--mod-form-container-border: var(--ds-form-disabled-container-border);--mod-form-label-color: var(--ds-form-disabled-label-color);--mod-form-description-color: var(--ds-form-disabled-description-color);--mod-date-color: var(--ds-form-disabled-control-value-color);--mod-date-placeholder: var(--ds-form-disabled-control-placeholder-color)}.air-datepicker{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-user-drag:none;user-drag:none;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}@media print{.air-datepicker{display:none !important}}.air-datepicker{--adp-cell-background-color-in-range: unset;--adp-hover-color: unset;--adp-cell-border-width: 2px;--adp-padding: 0.5rem;--adp-width: 264px;--adp-color: var(--_datepicker-calendar-text-color);--adp-font-family: var(--_datepicker-calendar-family);--adp-font-size: var(--_datepicker-calendar-size);--adp-border-color-inner: var(--_datepicker-calendar-color-inner-border);--adp-background-color-hover: var(--_datepicker-calendar-day-background-hover);--adp-background-color-active: var(--_datepicker-calendar-day-background-active);--adp-day-name-color: var(--_datepicker-calendar-text-color);--adp-color-current-date: var(--_datepicker-calendar-text-color);--adp-cell-background-color-selected: var(--_datepicker-calendar-day-background-selected);--adp-cell-background-color-selected-hover: var(--_datepicker-calendar-day-background-selected-hover);--adp-color-other-month: var(--_datepicker-calendar-disabled-color);--adp-color-other-decade: var(--_datepicker-calendar-disabled-color);--adp-color-disabled: var(--_datepicker-calendar-disabled-color);font-family:inherit;font-size:var(--_datepicker-calendar-size);border-radius:var(--_datepicker-calendar-radius);box-shadow:var(--_datepicker-calendar-shadow);font-weight:var(--_datepicker-calendar-weight);border:none}.air-datepicker *{font-family:inherit}.air-datepicker.-inline-{border:none;box-shadow:var(--_datepicker-calendar-shadow)}.air-datepicker .air-datepicker-nav{border-width:2px}.air-datepicker .air-datepicker-nav--title:not(.-disabled-) button,.air-datepicker .air-datepicker-nav--action:not(.-disabled-) button{padding:0;overflow:visible;border:0;background:none;color:inherit;font:inherit;cursor:pointer;user-select:none;appearance:button}.air-datepicker .air-datepicker-nav--title:not(.-disabled-) button::-moz-focus-inner,.air-datepicker .air-datepicker-nav--action:not(.-disabled-) button::-moz-focus-inner{border:0}.air-datepicker .air-datepicker-nav--title:not(.-disabled-) button,.air-datepicker .air-datepicker-nav--action:not(.-disabled-) button{display:flex;gap:.5rem;align-items:center;justify-content:center;height:2rem;min-width:2rem;color:var(--_datepicker-calendar-nav-color);--icon-color: var(--_datepicker-calendar-nav-color);border-radius:var(--_datepicker-calendar-nav-radius);box-shadow:none;outline:none;touch-action:manipulation;transition-property:color,background-color,border-color,box-shadow,text-shadow;transition-duration:.2s;transition-timing-function:cubic-bezier(0, 0, 0.2, 1)}.air-datepicker .air-datepicker-nav--title:not(.-disabled-) button::-moz-focus-inner,.air-datepicker .air-datepicker-nav--action:not(.-disabled-) button::-moz-focus-inner{border:0}@media(hover: hover)and (pointer: fine){.air-datepicker .air-datepicker-nav--title:not(.-disabled-) button:hover,.air-datepicker .air-datepicker-nav--title:not(.-disabled-) button.is-hovered,.air-datepicker .air-datepicker-nav--action:not(.-disabled-) button:hover,.air-datepicker .air-datepicker-nav--action:not(.-disabled-) button.is-hovered{color:var(--_datepicker-calendar-nav-color-hover);--icon-color: var(--_datepicker-calendar-nav-color-hover)}}.air-datepicker .air-datepicker-nav--title:not(.-disabled-) button:active,.air-datepicker .air-datepicker-nav--title:not(.-disabled-) button.is-pressed,.air-datepicker .air-datepicker-nav--action:not(.-disabled-) button:active,.air-datepicker .air-datepicker-nav--action:not(.-disabled-) button.is-pressed{color:var(--_datepicker-calendar-nav-color-active);--icon-color: var(--_datepicker-calendar-nav-color-active);translate:0 .5px}@media(hover: hover)and (pointer: fine){.air-datepicker .air-datepicker-nav--title:not(.-disabled-) button:focus-visible:not(:active),.air-datepicker .air-datepicker-nav--title:not(.-disabled-) button.is-focused:not(:active),.air-datepicker .air-datepicker-nav--action:not(.-disabled-) button:focus-visible:not(:active),.air-datepicker .air-datepicker-nav--action:not(.-disabled-) button.is-focused:not(:active){box-shadow:var(--ds-alias-interaction-focus-color-border) 0 0 0 2px,var(--_datepicker-focus-color) 0 0 0 5px !important}}.air-datepicker .air-datepicker-nav--action{margin-left:.5rem}.air-datepicker .air-datepicker-nav--title{margin-right:auto}.air-datepicker .air-datepicker-nav--title button{flex:1 1 auto;justify-content:flex-start}.air-datepicker .air-datepicker-body--cells.-days-{gap:.25rem}.air-datepicker .air-datepicker-body--day-name{font-weight:var(--_datepicker-calendar-day-name-weight);font-size:1rem;text-transform:none;font-family:var(--_datepicker-calendar-day-name-family)}.air-datepicker .air-datepicker-cell.-selected-:not(.-disabled-){font-weight:var(--_datepicker-calendar-day-weight-selected)}.air-datepicker .air-datepicker-cell.-day-{font-weight:var(--_datepicker-calendar-day-weight);height:2rem;width:2rem}.air-datepicker .air-datepicker-cell.-day-.-current-:not(.-disabled-){border:2px solid var(--_datepicker-calendar-color-current-date)}.air-datepicker .air-datepicker-cell.-day-.-selected-:not(.-disabled-){font-weight:var(--_datepicker-calendar-day-weight-selected)}.air-datepicker .air-datepicker-cell[tabindex="0"]{outline:none;touch-action:manipulation;transition-property:color,background-color,border-color,box-shadow,text-shadow;transition-duration:.2s;transition-timing-function:cubic-bezier(0, 0, 0.2, 1)}.air-datepicker .air-datepicker-cell[tabindex="0"]::-moz-focus-inner{border:0}@media(hover: hover)and (pointer: fine){.air-datepicker .air-datepicker-cell[tabindex="0"]:focus-visible:not(:active),.air-datepicker .air-datepicker-cell[tabindex="0"].is-focused:not(:active){box-shadow:var(--ds-alias-interaction-focus-color-border) 0 0 0 2px,var(--_datepicker-focus-color) 0 0 0 5px !important}}.air-datepicker .air-datepicker-cell.-disabled-{pointer-events:none}.air-datepicker #previous-disabled,.air-datepicker #next-disabled{display:none}.air-datepicker .air-datepicker-nav--action.-disabled-{pointer-events:none;visibility:visible}.air-datepicker .air-datepicker-nav--action.-disabled- button{display:none;visibility:hidden;pointer-events:none}.air-datepicker .air-datepicker-nav--action.-disabled- #previous-disabled,.air-datepicker .air-datepicker-nav--action.-disabled- #next-disabled{display:flex;justify-content:center;align-items:center;width:2rem;height:2rem;color:var(--_datepicker-calendar-nav-color-disabled);--icon-color: var(--_datepicker-calendar-nav-color-disabled);pointer-events:none}.air-datepicker .air-datepicker-nav--action.-disabled- #previous-disabled ds-icon,.air-datepicker .air-datepicker-nav--action.-disabled- #next-disabled ds-icon{pointer-events:none}
+.air-datepicker-cell.-year-.-other-decade-,.air-datepicker-cell.-day-.-other-month-{color:var(--adp-color-other-month)}.air-datepicker-cell.-year-.-other-decade-:hover,.air-datepicker-cell.-day-.-other-month-:hover{color:var(--adp-color-other-month-hover)}.-disabled-.-focus-.air-datepicker-cell.-year-.-other-decade-,.-disabled-.-focus-.air-datepicker-cell.-day-.-other-month-{color:var(--adp-color-other-month)}.-selected-.air-datepicker-cell.-year-.-other-decade-,.-selected-.air-datepicker-cell.-day-.-other-month-{color:#fff;background:var(--adp-background-color-selected-other-month)}.-selected-.-focus-.air-datepicker-cell.-year-.-other-decade-,.-selected-.-focus-.air-datepicker-cell.-day-.-other-month-{background:var(--adp-background-color-selected-other-month-focused)}.-in-range-.air-datepicker-cell.-year-.-other-decade-,.-in-range-.air-datepicker-cell.-day-.-other-month-{background-color:var(--adp-background-color-in-range);color:var(--adp-color)}.-in-range-.-focus-.air-datepicker-cell.-year-.-other-decade-,.-in-range-.-focus-.air-datepicker-cell.-day-.-other-month-{background-color:var(--adp-background-color-in-range-focused)}.air-datepicker-cell.-year-.-other-decade-:empty,.air-datepicker-cell.-day-.-other-month-:empty{background:none;border:none}.air-datepicker-cell{border-radius:var(--adp-cell-border-radius);box-sizing:border-box;cursor:pointer;display:flex;position:relative;align-items:center;justify-content:center;z-index:1}.air-datepicker-cell.-focus-{background:var(--adp-cell-background-color-hover)}.air-datepicker-cell.-current-{color:var(--adp-color-current-date)}.air-datepicker-cell.-current-.-focus-{color:var(--adp-color)}.air-datepicker-cell.-current-.-in-range-{color:var(--adp-color-current-date)}.air-datepicker-cell.-disabled-{cursor:default;color:var(--adp-color-disabled)}.air-datepicker-cell.-disabled-.-focus-{color:var(--adp-color-disabled)}.air-datepicker-cell.-disabled-.-in-range-{color:var(--adp-color-disabled-in-range)}.air-datepicker-cell.-disabled-.-current-.-focus-{color:var(--adp-color-disabled)}.air-datepicker-cell.-in-range-{background:var(--adp-cell-background-color-in-range);border-radius:0}.air-datepicker-cell.-in-range-:hover,.air-datepicker-cell.-in-range-.-focus-{background:var(--adp-cell-background-color-in-range-hover)}.air-datepicker-cell.-range-from-{border:1px solid var(--adp-cell-border-color-in-range);background-color:var(--adp-cell-background-color-in-range);border-radius:var(--adp-cell-border-radius) 0 0 var(--adp-cell-border-radius)}.air-datepicker-cell.-range-to-{border:1px solid var(--adp-cell-border-color-in-range);background-color:var(--adp-cell-background-color-in-range);border-radius:0 var(--adp-cell-border-radius) var(--adp-cell-border-radius) 0}.air-datepicker-cell.-range-to-.-range-from-{border-radius:var(--adp-cell-border-radius)}.air-datepicker-cell.-selected-{color:#fff;border:none;background:var(--adp-cell-background-color-selected)}.air-datepicker-cell.-selected-.-current-{color:#fff;background:var(--adp-cell-background-color-selected)}.air-datepicker-cell.-selected-.-focus-{background:var(--adp-cell-background-color-selected-hover)}.air-datepicker-body{transition:all var(--adp-transition-duration) var(--adp-transition-ease)}.air-datepicker-body.-hidden-{display:none}.air-datepicker-body--day-names{display:grid;grid-template-columns:repeat(7, var(--adp-day-cell-width));margin:8px 0 3px}.air-datepicker-body--day-name{color:var(--adp-day-name-color);display:flex;align-items:center;justify-content:center;flex:1;text-align:center;text-transform:uppercase;font-size:.8em}.air-datepicker-body--day-name.-clickable-{cursor:pointer}.air-datepicker-body--day-name.-clickable-:hover{color:var(--adp-day-name-color-hover)}.air-datepicker-body--cells{display:grid}.air-datepicker-body--cells.-days-{grid-template-columns:repeat(7, var(--adp-day-cell-width));grid-auto-rows:var(--adp-day-cell-height)}.air-datepicker-body--cells.-months-{grid-template-columns:repeat(3, 1fr);grid-auto-rows:var(--adp-month-cell-height)}.air-datepicker-body--cells.-years-{grid-template-columns:repeat(4, 1fr);grid-auto-rows:var(--adp-year-cell-height)}.air-datepicker-nav{display:flex;justify-content:space-between;border-bottom:1px solid var(--adp-border-color-inner);min-height:var(--adp-nav-height);padding:var(--adp-padding);box-sizing:content-box}.-only-timepicker- .air-datepicker-nav{display:none}.air-datepicker-nav--title,.air-datepicker-nav--action{display:flex;cursor:pointer;align-items:center;justify-content:center}.air-datepicker-nav--action{width:var(--adp-nav-action-size);border-radius:var(--adp-border-radius);-webkit-user-select:none;-moz-user-select:none;user-select:none}.air-datepicker-nav--action:hover{background:var(--adp-background-color-hover)}.air-datepicker-nav--action:active{background:var(--adp-background-color-active)}.air-datepicker-nav--action.-disabled-{visibility:hidden}.air-datepicker-nav--action svg{width:32px;height:32px}.air-datepicker-nav--action path{fill:none;stroke:var(--adp-nav-arrow-color);stroke-width:2px}.air-datepicker-nav--title{border-radius:var(--adp-border-radius);padding:0 8px}.air-datepicker-nav--title i{font-style:normal;color:var(--adp-nav-color-secondary);margin-left:.3em}.air-datepicker-nav--title:hover{background:var(--adp-background-color-hover)}.air-datepicker-nav--title:active{background:var(--adp-background-color-active)}.air-datepicker-nav--title.-disabled-{cursor:default;background:none}.air-datepicker-buttons{display:grid;grid-auto-columns:1fr;grid-auto-flow:column}.air-datepicker-button{display:inline-flex;color:var(--adp-btn-color);border-radius:var(--adp-btn-border-radius);cursor:pointer;height:var(--adp-btn-height);border:none;background:rgba(255, 255, 255, 0)}.air-datepicker-button:hover{color:var(--adp-btn-color-hover);background:var(--adp-btn-background-color-hover)}.air-datepicker-button:focus{color:var(--adp-btn-color-hover);background:var(--adp-btn-background-color-hover);outline:none}.air-datepicker-button:active{background:var(--adp-btn-background-color-active)}.air-datepicker-button span{outline:none;display:flex;align-items:center;justify-content:center;width:100%;height:100%}.air-datepicker-time{display:grid;grid-template-columns:max-content 1fr;grid-column-gap:12px;align-items:center;position:relative;padding:0 var(--adp-time-padding-inner)}.-only-timepicker- .air-datepicker-time{border-top:none}.air-datepicker-time--current{display:flex;align-items:center;flex:1;font-size:14px;text-align:center}.air-datepicker-time--current-colon{margin:0 2px 3px;line-height:1}.air-datepicker-time--current-hours,.air-datepicker-time--current-minutes{line-height:1;font-size:19px;font-family:"Century Gothic",CenturyGothic,AppleGothic,sans-serif;position:relative;z-index:1}.air-datepicker-time--current-hours:after,.air-datepicker-time--current-minutes:after{content:"";background:var(--adp-background-color-hover);border-radius:var(--adp-border-radius);position:absolute;left:-2px;top:-3px;right:-2px;bottom:-2px;z-index:-1;opacity:0}.air-datepicker-time--current-hours.-focus-:after,.air-datepicker-time--current-minutes.-focus-:after{opacity:1}.air-datepicker-time--current-ampm{text-transform:uppercase;align-self:flex-end;color:var(--adp-time-day-period-color);margin-left:6px;font-size:11px;margin-bottom:1px}.air-datepicker-time--row{display:flex;align-items:center;font-size:11px;height:17px;background:linear-gradient(to right, var(--adp-time-track-color), var(--adp-time-track-color)) left 50%/100% var(--adp-time-track-height) no-repeat}.air-datepicker-time--row:first-child{margin-bottom:4px}.air-datepicker-time--row input[type=range]{background:none;cursor:pointer;flex:1;height:100%;width:100%;padding:0;margin:0;-webkit-appearance:none}.air-datepicker-time--row input[type=range]::-webkit-slider-thumb{-webkit-appearance:none}.air-datepicker-time--row input[type=range]::-ms-tooltip{display:none}.air-datepicker-time--row input[type=range]:hover::-webkit-slider-thumb{border-color:var(--adp-time-track-color-hover)}.air-datepicker-time--row input[type=range]:hover::-moz-range-thumb{border-color:var(--adp-time-track-color-hover)}.air-datepicker-time--row input[type=range]:hover::-ms-thumb{border-color:var(--adp-time-track-color-hover)}.air-datepicker-time--row input[type=range]:focus{outline:none}.air-datepicker-time--row input[type=range]:focus::-webkit-slider-thumb{background:var(--adp-cell-background-color-selected);border-color:var(--adp-cell-background-color-selected)}.air-datepicker-time--row input[type=range]:focus::-moz-range-thumb{background:var(--adp-cell-background-color-selected);border-color:var(--adp-cell-background-color-selected)}.air-datepicker-time--row input[type=range]:focus::-ms-thumb{background:var(--adp-cell-background-color-selected);border-color:var(--adp-cell-background-color-selected)}.air-datepicker-time--row input[type=range]::-webkit-slider-thumb{box-sizing:border-box;height:12px;width:12px;border-radius:3px;border:1px solid var(--adp-time-track-color);background:#fff;cursor:pointer;-webkit-transition:background var(--adp-transition-duration);transition:background var(--adp-transition-duration)}.air-datepicker-time--row input[type=range]::-moz-range-thumb{box-sizing:border-box;height:12px;width:12px;border-radius:3px;border:1px solid var(--adp-time-track-color);background:#fff;cursor:pointer;-moz-transition:background var(--adp-transition-duration);transition:background var(--adp-transition-duration)}.air-datepicker-time--row input[type=range]::-ms-thumb{box-sizing:border-box;height:12px;width:12px;border-radius:3px;border:1px solid var(--adp-time-track-color);background:#fff;cursor:pointer;-ms-transition:background var(--adp-transition-duration);transition:background var(--adp-transition-duration)}.air-datepicker-time--row input[type=range]::-webkit-slider-thumb{margin-top:calc(var(--adp-time-thumb-size)/2*-1)}.air-datepicker-time--row input[type=range]::-webkit-slider-runnable-track{border:none;height:var(--adp-time-track-height);cursor:pointer;color:rgba(0, 0, 0, 0);background:rgba(0, 0, 0, 0)}.air-datepicker-time--row input[type=range]::-moz-range-track{border:none;height:var(--adp-time-track-height);cursor:pointer;color:rgba(0, 0, 0, 0);background:rgba(0, 0, 0, 0)}.air-datepicker-time--row input[type=range]::-ms-track{border:none;height:var(--adp-time-track-height);cursor:pointer;color:rgba(0, 0, 0, 0);background:rgba(0, 0, 0, 0)}.air-datepicker-time--row input[type=range]::-ms-fill-lower{background:rgba(0, 0, 0, 0)}.air-datepicker-time--row input[type=range]::-ms-fill-upper{background:rgba(0, 0, 0, 0)}.air-datepicker{--adp-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";--adp-font-size: 14px;--adp-width: 246px;--adp-z-index: 100;--adp-padding: 4px;--adp-grid-areas: "nav" "body" "timepicker" "buttons";--adp-transition-duration: .3s;--adp-transition-ease: ease-out;--adp-transition-offset: 8px;--adp-background-color: #fff;--adp-background-color-hover: #f0f0f0;--adp-background-color-active: #eaeaea;--adp-background-color-in-range: rgba(92, 196, 239, .1);--adp-background-color-in-range-focused: rgba(92, 196, 239, .2);--adp-background-color-selected-other-month-focused: #8ad5f4;--adp-background-color-selected-other-month: #a2ddf6;--adp-color: #4a4a4a;--adp-color-secondary: #9c9c9c;--adp-accent-color: #4eb5e6;--adp-color-current-date: var(--adp-accent-color);--adp-color-other-month: #dedede;--adp-color-disabled: #aeaeae;--adp-color-disabled-in-range: #939393;--adp-color-other-month-hover: #c5c5c5;--adp-border-color: #dbdbdb;--adp-border-color-inner: #efefef;--adp-border-radius: 4px;--adp-border-color-inline: #d7d7d7;--adp-nav-height: 32px;--adp-nav-arrow-color: var(--adp-color-secondary);--adp-nav-action-size: 32px;--adp-nav-color-secondary: var(--adp-color-secondary);--adp-day-name-color: #ff9a19;--adp-day-name-color-hover: #8ad5f4;--adp-day-cell-width: 1fr;--adp-day-cell-height: 32px;--adp-month-cell-height: 42px;--adp-year-cell-height: 56px;--adp-pointer-size: 10px;--adp-poiner-border-radius: 2px;--adp-pointer-offset: 14px;--adp-cell-border-radius: 4px;--adp-cell-background-color-hover: var(--adp-background-color-hover);--adp-cell-background-color-selected: #5cc4ef;--adp-cell-background-color-selected-hover: #45bced;--adp-cell-background-color-in-range: rgba(92, 196, 239, 0.1);--adp-cell-background-color-in-range-hover: rgba(92, 196, 239, 0.2);--adp-cell-border-color-in-range: var(--adp-cell-background-color-selected);--adp-btn-height: 32px;--adp-btn-color: var(--adp-accent-color);--adp-btn-color-hover: var(--adp-color);--adp-btn-border-radius: var(--adp-border-radius);--adp-btn-background-color-hover: var(--adp-background-color-hover);--adp-btn-background-color-active: var(--adp-background-color-active);--adp-time-track-height: 1px;--adp-time-track-color: #dedede;--adp-time-track-color-hover: #b1b1b1;--adp-time-thumb-size: 12px;--adp-time-padding-inner: 10px;--adp-time-day-period-color: var(--adp-color-secondary);--adp-mobile-font-size: 16px;--adp-mobile-nav-height: 40px;--adp-mobile-width: 320px;--adp-mobile-day-cell-height: 38px;--adp-mobile-month-cell-height: 48px;--adp-mobile-year-cell-height: 64px}.air-datepicker-overlay{--adp-overlay-background-color: rgba(0, 0, 0, .3);--adp-overlay-transition-duration: .3s;--adp-overlay-transition-ease: ease-out;--adp-overlay-z-index: 99}.air-datepicker{background:var(--adp-background-color);border:1px solid var(--adp-border-color);box-shadow:0 4px 12px rgba(0, 0, 0, 0.15);border-radius:var(--adp-border-radius);box-sizing:content-box;display:grid;grid-template-columns:1fr;grid-template-rows:repeat(4, max-content);grid-template-areas:var(--adp-grid-areas);font-family:var(--adp-font-family),sans-serif;font-size:var(--adp-font-size);color:var(--adp-color);width:var(--adp-width);position:absolute;transition:opacity var(--adp-transition-duration) var(--adp-transition-ease),transform var(--adp-transition-duration) var(--adp-transition-ease);z-index:var(--adp-z-index)}.air-datepicker:not(.-custom-position-){opacity:0}.air-datepicker.-from-top-{transform:translateY(calc(var(--adp-transition-offset) * -1))}.air-datepicker.-from-right-{transform:translateX(var(--adp-transition-offset))}.air-datepicker.-from-bottom-{transform:translateY(var(--adp-transition-offset))}.air-datepicker.-from-left-{transform:translateX(calc(var(--adp-transition-offset) * -1))}.air-datepicker.-active-:not(.-custom-position-){transform:translate(0, 0);opacity:1}.air-datepicker.-active-.-custom-position-{transition:none}.air-datepicker.-inline-{border-color:var(--adp-border-color-inline);box-shadow:none;position:static;left:auto;right:auto;opacity:1;transform:none}.air-datepicker.-inline- .air-datepicker--pointer{display:none}.air-datepicker.-is-mobile-{--adp-font-size: var(--adp-mobile-font-size);--adp-day-cell-height: var(--adp-mobile-day-cell-height);--adp-month-cell-height: var(--adp-mobile-month-cell-height);--adp-year-cell-height: var(--adp-mobile-year-cell-height);--adp-nav-height: var(--adp-mobile-nav-height);--adp-nav-action-size: var(--adp-mobile-nav-height);position:fixed;width:var(--adp-mobile-width);border:none}.air-datepicker.-is-mobile- *{-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}.air-datepicker.-is-mobile- .air-datepicker--pointer{display:none}.air-datepicker.-is-mobile-:not(.-custom-position-){transform:translate(-50%, calc(-50% + var(--adp-transition-offset)))}.air-datepicker.-is-mobile-.-active-:not(.-custom-position-){transform:translate(-50%, -50%)}.air-datepicker.-custom-position-{transition:none}.air-datepicker-global-container{position:absolute;left:0;top:0}.air-datepicker--pointer{--pointer-half-size: calc(var(--adp-pointer-size) / 2);position:absolute;width:var(--adp-pointer-size);height:var(--adp-pointer-size);z-index:-1}.air-datepicker--pointer:after{content:"";position:absolute;background:#fff;border-top:1px solid var(--adp-border-color-inline);border-right:1px solid var(--adp-border-color-inline);border-top-right-radius:var(--adp-poiner-border-radius);width:var(--adp-pointer-size);height:var(--adp-pointer-size);box-sizing:border-box}.-top-left- .air-datepicker--pointer,.-top-center- .air-datepicker--pointer,.-top-right- .air-datepicker--pointer,[data-popper-placement^=top] .air-datepicker--pointer{top:calc(100% - var(--pointer-half-size) + 1px)}.-top-left- .air-datepicker--pointer:after,.-top-center- .air-datepicker--pointer:after,.-top-right- .air-datepicker--pointer:after,[data-popper-placement^=top] .air-datepicker--pointer:after{transform:rotate(135deg)}.-right-top- .air-datepicker--pointer,.-right-center- .air-datepicker--pointer,.-right-bottom- .air-datepicker--pointer,[data-popper-placement^=right] .air-datepicker--pointer{right:calc(100% - var(--pointer-half-size) + 1px)}.-right-top- .air-datepicker--pointer:after,.-right-center- .air-datepicker--pointer:after,.-right-bottom- .air-datepicker--pointer:after,[data-popper-placement^=right] .air-datepicker--pointer:after{transform:rotate(225deg)}.-bottom-left- .air-datepicker--pointer,.-bottom-center- .air-datepicker--pointer,.-bottom-right- .air-datepicker--pointer,[data-popper-placement^=bottom] .air-datepicker--pointer{bottom:calc(100% - var(--pointer-half-size) + 1px)}.-bottom-left- .air-datepicker--pointer:after,.-bottom-center- .air-datepicker--pointer:after,.-bottom-right- .air-datepicker--pointer:after,[data-popper-placement^=bottom] .air-datepicker--pointer:after{transform:rotate(315deg)}.-left-top- .air-datepicker--pointer,.-left-center- .air-datepicker--pointer,.-left-bottom- .air-datepicker--pointer,[data-popper-placement^=left] .air-datepicker--pointer{left:calc(100% - var(--pointer-half-size) + 1px)}.-left-top- .air-datepicker--pointer:after,.-left-center- .air-datepicker--pointer:after,.-left-bottom- .air-datepicker--pointer:after,[data-popper-placement^=left] .air-datepicker--pointer:after{transform:rotate(45deg)}.-top-left- .air-datepicker--pointer,.-bottom-left- .air-datepicker--pointer{left:var(--adp-pointer-offset)}.-top-right- .air-datepicker--pointer,.-bottom-right- .air-datepicker--pointer{right:var(--adp-pointer-offset)}.-top-center- .air-datepicker--pointer,.-bottom-center- .air-datepicker--pointer{left:calc(50% - var(--adp-pointer-size)/2)}.-left-top- .air-datepicker--pointer,.-right-top- .air-datepicker--pointer{top:var(--adp-pointer-offset)}.-left-bottom- .air-datepicker--pointer,.-right-bottom- .air-datepicker--pointer{bottom:var(--adp-pointer-offset)}.-left-center- .air-datepicker--pointer,.-right-center- .air-datepicker--pointer{top:calc(50% - var(--adp-pointer-size)/2)}.air-datepicker--navigation{grid-area:nav}.air-datepicker--content{box-sizing:content-box;padding:var(--adp-padding);grid-area:body}.-only-timepicker- .air-datepicker--content{display:none}.air-datepicker--time{grid-area:timepicker}.air-datepicker--buttons{grid-area:buttons}.air-datepicker--buttons,.air-datepicker--time{padding:var(--adp-padding);border-top:1px solid var(--adp-border-color-inner)}.air-datepicker-overlay{position:fixed;background:var(--adp-overlay-background-color);left:0;top:0;width:0;height:0;opacity:0;transition:opacity var(--adp-overlay-transition-duration) var(--adp-overlay-transition-ease),left 0s,height 0s,width 0s;transition-delay:0s,var(--adp-overlay-transition-duration),var(--adp-overlay-transition-duration),var(--adp-overlay-transition-duration);z-index:var(--adp-overlay-z-index)}.air-datepicker-overlay.-active-{opacity:1;width:100%;height:100%;transition:opacity var(--adp-overlay-transition-duration) var(--adp-overlay-transition-ease),height 0s,width 0s}:host{--_form-field-gap: var(--form-field-gap, var(--mod-form-field-gap, 0.25rem));--_form-container-background: var(--form-container-background, var(--mod-form-container-background, var(--ds-form-default-container-background)));--_form-container-border: var(--form-container-border, var(--mod-form-container-border, var(--ds-form-default-container-border)));--_form-container-radius: var(--form-container-radius, var(--mod-form-container-radius, var(--ds-form-container-radius)));--_form-container-hover-background: var(--form-container-hover-background, var(--mod-form-container-hover-background, var(--ds-form-hover-container-background)));--_form-container-active-background: var(--form-container-active-background, var(--mod-form-container-active-background, var(--ds-form-active-container-background)));--_form-container-focus-background: var(--form-container-focus-background, var(--mod-form-container-focus-background, var(--ds-form-focus-container-background)));--_form-container-hover-border: var(--form-container-hover-border, var(--mod-form-container-hover-border, var(--ds-form-hover-container-border)));--_form-container-active-border: var(--form-container-active-border, var(--mod-form-container-active-border, var(--ds-form-active-container-border)));--_form-container-focus-border: var(--form-container-focus-border, var(--mod-form-container-focus-border, var(--ds-form-focus-container-border)));--_form-label-color: var(--form-label-color, var(--mod-form-label-color, var(--ds-form-default-label-color)));--_form-label-family: var(--form-label-family, var(--mod-form-label-family, var(--ds-form-default-label-typo-font-family)));--_form-label-weight: var(--form-label-weight, var(--mod-form-label-weight, var(--ds-form-default-label-typo-font-weight)));--_form-label-line-height: var(--form-label-line-height, var(--mod-form-label-line-height, var(--ds-form-default-label-typo-line-height)));--_form-label-size: var(--form-label-size, var(--mod-form-label-size, var(--ds-form-default-label-typo-font-size)));--_form-description-color: var(--form-description-color, var(--mod-form-description-color, var(--ds-form-default-description-color)));--_form-description-family: var(--form-description-family, var(--mod-form-description-family, var(--ds-form-default-description-typo-font-family)));--_form-description-weight: var(--form-description-weight, var(--mod-form-description-weight, var(--ds-form-default-description-typo-font-weight)));--_form-description-line-height: var(--form-description-line-height, var(--mod-form-description-line-height, var(--ds-form-default-description-typo-line-height)));--_form-description-size: var(--form-description-size, var(--mod-form-description-size, var(--ds-form-default-description-typo-font-size)));--_datepicker-family: var(--datepicker-family, var(--mod-datepicker-family, var(--ds-form-default-control-typo-font-family)));--_datepicker-weight: var(--datepicker-weight, var(--mod-datepicker-weight, var(--ds-form-default-control-typo-font-weight)));--_datepicker-line-height: var(--datepicker-line-height, var(--mod-datepicker-line-height, var(--ds-form-default-control-typo-line-height)));--_datepicker-size: var(--datepicker-size, var(--mod-datepicker-size, var(--ds-form-default-control-typo-font-size)));--_datepicker-color: var(--datepicker-color, var(--mod-datepicker-color, var(--ds-form-default-control-value-color)));--_datepicker-placeholder: var(--datepicker-placeholder, var(--mod-datepicker-placeholder, var(--ds-form-default-control-placeholder-color)));--_datepicker-trigger-icon-color-hover: var(--datepicker-trigger-icon-color-hover, var(--mod-datepicker-trigger-icon-color-hover, var(--ds-datepicker-trigger-color-hover)));--_datepicker-trigger-icon-color-active: var(--datepicker-trigger-icon-color-active, var(--mod-datepicker-trigger-icon-color-active, var(--ds-datepicker-trigger-color-active)));--_datepicker-trigger-icon-color-disabled: var(--datepicker-trigger-icon-color-disabled, var(--mod-datepicker-trigger-icon-color-disabled, var(--ds-datepicker-trigger-color-disabled)));--_datepicker-focus-color: var(--datepicker-focus-color, var(--mod-datepicker-focus-color, var(--ds-alias-interaction-focus-color-base)));--_datepicker-popup-shadow: var(--datepicker-popup-shadow, var(--mod-datepicker-popup-shadow, var(--ds-datepicker-popup-shadow)));--_datepicker-calendar-text-color: var(--datepicker-calendar-text-color, var(--mod-datepicker-calendar-text-color, var(--ds-datepicker-calendar-color-text)));--_datepicker-calendar-family: var(--datepicker-calendar-family, var(--mod-datepicker-calendar-family, var(--ds-datepicker-calendar-family)));--_datepicker-calendar-size: var(--datepicker-calendar-size, var(--mod-datepicker-calendar-size, var(--ds-datepicker-calendar-size)));--_datepicker-calendar-weight: var(--datepicker-calendar-weight, var(--mod-datepicker-calendar-weight, var(--ds-datepicker-calendar-weight)));--_datepicker-calendar-radius: var(--datepicker-calendar-radius, var(--mod-datepicker-calendar-radius, var(--ds-datepicker-calendar-radius)));--_datepicker-calendar-shadow: var(--datepicker-calendar-shadow, var(--mod-datepicker-calendar-shadow, var(--ds-datepicker-calendar-shadow)));--_datepicker-calendar-color-inner-border: var(--datepicker-calendar-color-inner-border, var(--mod-datepicker-calendar-color-inner-border, var(--ds-datepicker-calendar-color-inner-border)));--_datepicker-calendar-disabled-color: var(--datepicker-calendar-disabled-color, var(--mod-datepicker-calendar-disabled-color, var(--ds-datepicker-calendar-color-disabled)));--_datepicker-calendar-day-background-hover: var(--datepicker-calendar-day-background-hover, var(--mod-datepicker-calendar-day-background-hover, var(--ds-datepicker-calendar-color-day-hover-background)));--_datepicker-calendar-day-background-active: var(--datepicker-calendar-day-background-active, var(--mod-datepicker-calendar-day-background-active, var(--ds-datepicker-calendar-color-day-active-background)));--_datepicker-calendar-day-background-selected: var(--datepicker-calendar-day-background-selected, var(--mod-datepicker-calendar-day-background-selected, var(--ds-datepicker-calendar-color-day-selected-background)));--_datepicker-calendar-day-background-selected-hover: var(--datepicker-calendar-day-background-selected-hover, var(--mod-datepicker-calendar-day-background-selected-hover, var(--ds-datepicker-calendar-color-day-selected-hover-background)));--_datepicker-calendar-color-current-date: var(--datepicker-calendar-color-current-date, var(--mod-datepicker-calendar-color-current-date, var(--ds-datepicker-calendar-color-current-date)));--_datepicker-calendar-day-weight: var(--datepicker-calendar-day-weight, var(--mod-datepicker-calendar-day-weight, var(--ds-datepicker-calendar-day-weight-base)));--_datepicker-calendar-day-weight-selected: var(--datepicker-calendar-day-weight-selected, var(--mod-datepicker-calendar-day-weight-selected, var(--ds-datepicker-calendar-day-weight-selected)));--_datepicker-calendar-day-name-family: var(--datepicker-calendar-day-name-family, var(--mod-datepicker-calendar-day-name-family, var(--ds-datepicker-calendar-day-name-family)));--_datepicker-calendar-day-name-weight: var(--datepicker-calendar-day-name-weight, var(--mod-datepicker-calendar-day-name-weight, var(--ds-datepicker-calendar-day-name-weight)));--_datepicker-calendar-nav-color: var(--datepicker-calendar-nav-color, var(--mod-datepicker-calendar-nav-color, var(--ds-datepicker-calendar-nav-color-base)));--_datepicker-calendar-nav-color-hover: var(--datepicker-calendar-nav-color-hover, var(--mod-datepicker-calendar-nav-color-hover, var(--ds-datepicker-calendar-nav-color-hover)));--_datepicker-calendar-nav-color-active: var(--datepicker-calendar-nav-color-active, var(--mod-datepicker-calendar-nav-color-active, var(--ds-datepicker-calendar-nav-color-active)));--_datepicker-calendar-nav-radius: var(--datepicker-calendar-nav-radius, var(--mod-datepicker-calendar-nav-radius, var(--ds-datepicker-calendar-nav-radius)));--_datepicker-calendar-nav-color-disabled: var(--datepicker-calendar-nav-color-disabled, var(--mod-datepicker-calendar-nav-color-disabled, var(--ds-datepicker-calendar-nav-color-disabled)))}:host{position:relative;display:grid;grid-template-columns:minmax(0, 1fr);gap:var(--_form-field-gap)}:host :where(fieldset){margin:0;padding:0;border:none}:host :where(legend){padding:0;float:left;width:100%}:host label{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:block;box-sizing:content-box;hyphens:auto;overflow-wrap:break-word;text-wrap:balance;min-width:0;color:var(--_form-label-color);font-family:var(--_form-label-family);font-weight:var(--_form-label-weight);font-size:var(--_form-label-size);line-height:var(--_form-label-line-height)}:host #description{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:flex;box-sizing:content-box;hyphens:auto;overflow-wrap:break-word;text-wrap:balance;min-width:0;gap:.25rem;min-height:1.125rem;color:var(--_form-description-color);font-family:var(--_form-description-family);font-weight:var(--_form-description-weight);font-size:var(--_form-description-size);line-height:var(--_form-description-line-height)}:host #description ds-icon{--icon-color: var(--_form-description-color)}:host #input{border:none;outline:none;box-shadow:none;position:relative;background:inherit;flex:1;min-width:0;color:var(--_datepicker-color);font-family:var(--_datepicker-family);font-weight:var(--_datepicker-weight);font-size:var(--_datepicker-size);line-height:var(--_datepicker-line-height);border-radius:var(--_datepicker-container-radius)}:host #input::placeholder{color:var(--_datepicker-placeholder)}:host #input::-moz-placeholder{color:var(--_datepicker-placeholder)}:host #input::-webkit-input-placeholder{color:var(--_datepicker-placeholder)}:host #input:-moz-placeholder{color:var(--_datepicker-placeholder)}:host #input:-ms-input-placeholder{color:var(--_datepicker-placeholder)}:host #inner{position:relative;display:grid;grid-template-columns:minmax(0, 1fr);gap:var(--_form-field-gap)}:host(:not(.is-inline)) #container{box-sizing:border-box;clear:both;display:flex;width:100%;min-width:0;align-items:center;min-height:3rem;gap:.25rem;padding-inline:.5rem;background:var(--_form-container-background);border:var(--_form-container-border);border-radius:var(--_form-container-radius)}@media(hover: hover)and (pointer: fine){:host(:not(.is-inline)) #container:hover,:host(:not(.is-inline)) #container.is-hovered{background:var(--_form-container-hover-background);border:var(--_form-container-hover-border)}}:host(:not(.is-inline)) #container:active,:host(:not(.is-inline)) #container.is-pressed{background:var(--_form-container-active-background);border:var(--_form-container-active-border)}:host(:not(.is-inline)) #container:focus-within:not(:active),:host(:not(.is-inline)) #container.is-focused:not(:active){background:var(--_form-container-focus-background);border:var(--_form-container-focus-border)}:host(.is-inline) #container{box-sizing:border-box;clear:both;display:flex;width:100%;min-width:0;align-items:center;min-height:3rem;gap:.25rem}:host #trigger{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-user-drag:none;user-drag:none;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}@media print{:host #trigger{display:none !important}}:host #trigger{border-radius:var(--ds-alias-radius-base);background:rgba(0,0,0,0);width:1.5rem;height:1.5rem;border:none;appearance:auto;position:relative;display:inline-flex;flex-wrap:nowrap;flex-shrink:0;justify-content:center;align-items:center;text-align:center;vertical-align:middle;cursor:pointer;word-break:normal;box-shadow:none;outline:none;box-sizing:border-box;text-decoration:none;user-select:none;touch-action:manipulation;transition-property:color,background-color,border-color,box-shadow,text-shadow;transition-duration:.2s;transition-timing-function:cubic-bezier(0, 0, 0.2, 1)}:host #trigger::-moz-focus-inner{border:0}:host #trigger:disabled{pointer-events:none}@media(hover: hover)and (pointer: fine){:host #trigger:hover,:host #trigger.is-hovered{--icon-color: var(--_datepicker-trigger-icon-color-hover)}}:host #trigger:active,:host #trigger.is-pressed{--icon-color: var(--_datepicker-trigger-icon-color-active)}@media(hover: hover)and (pointer: fine){:host #trigger:focus-visible:not(:active),:host #trigger.is-focused:not(:active){box-shadow:var(--ds-alias-interaction-focus-color-border) 0 0 0 2px,var(--_datepicker-focus-color) 0 0 0 5px !important}}:host #clear{--_close-color-background: var(--close-color-background, var(--mod-close-color-background, var(--ds-close-primary-color-background-base)));--_close-color-background-hover: var(--close-color-background-hover, var(--mod-close-color-background-hover, var(--ds-close-primary-color-background-hover)));--_close-color-background-active: var(--close-color-background-active, var(--mod-close-color-background-active, var(--ds-close-primary-color-background-active)));--_close-color-icon: var(--close-color-icon, var(--mod-close-color-icon, var(--ds-close-primary-color-icon-base)));--_close-color-focus: var(--close-color-focus, var(--mod-close-color-focus, var(--ds-alias-interaction-focus-color-base)));--_close-radius: var(--close-radius, var(--mod-close-radius, var(--ds-close-radius)));--_close-size-icon: var(--close-size-icon, var(--mod-close-size-icon, var(--ds-close-size-base)));--_close-p: var(--close-p, var(--mod-close-p, var(--ds-close-padding-base)));--_close-icon: var(--close-icon, var(--mod-close-icon, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath fill-rule='evenodd' d='M1.70711 0.292893C1.31658 -0.0976311 0.683417 -0.0976311 0.292893 0.292893C-0.0976311 0.683417 -0.0976311 1.31658 0.292893 1.70711L5.58579 7L0.292893 12.2929C-0.0976311 12.6834 -0.0976311 13.3166 0.292893 13.7071C0.683417 14.0976 1.31658 14.0976 1.70711 13.7071L7 8.41421L12.2929 13.7071C12.6834 14.0976 13.3166 14.0976 13.7071 13.7071C14.0976 13.3166 14.0976 12.6834 13.7071 12.2929L8.41421 7L13.7071 1.70711C14.0976 1.31658 14.0976 0.683417 13.7071 0.292893C13.3166 -0.0976311 12.6834 -0.0976311 12.2929 0.292893L7 5.58579L1.70711 0.292893Z' clip-rule='evenodd'/%3E%3C/svg%3E")));-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-user-drag:none;user-drag:none}@media print{:host #clear{display:none !important}}:host #clear{position:relative;display:inline-flex;vertical-align:top;border:none;background:rgba(0,0,0,0);border-radius:var(--_close-radius);width:var(--_close-size-icon);height:var(--_close-size-icon);appearance:none;outline:none;touch-action:manipulation;transition-property:color,background-color,border-color,box-shadow,text-shadow;transition-duration:.2s;transition-timing-function:cubic-bezier(0, 0, 0.2, 1);justify-content:center;align-items:center}:host #clear::after{content:"";display:block;min-width:calc(var(--_close-size-icon) - var(--_close-p));min-height:calc(var(--_close-size-icon) - var(--_close-p));max-width:calc(var(--_close-size-icon) - var(--_close-p));max-height:calc(var(--_close-size-icon) - var(--_close-p));mask-image:var(--_close-icon);mask-repeat:no-repeat;mask-position:center;mask-size:contain;background:var(--_close-color-icon)}:host #clear:not(:disabled){cursor:pointer}@media(hover: hover)and (pointer: fine){:host #clear:not(:disabled):focus-visible:not(:active),:host #clear:not(:disabled).is-focused:not(:active){box-shadow:var(--ds-alias-interaction-focus-color-border) 0 0 0 2px,var(--_close-color-focus) 0 0 0 5px !important}}:host #container{position:relative}:host #popup{position:absolute;display:block;top:100%;left:0;z-index:var(--ds-popup-z-index, 100);box-shadow:var(--_datepicker-popup-shadow);transition:transform .2s,opacity .2s,-webkit-transform .2s;opacity:1;transform:scaleY(1);transform-origin:center top;overflow:hidden}:host #popup[aria-hidden=true]{opacity:0;transform:scaleY(0)}@media(prefers-reduced-motion: reduce){:host #popup{transition:none !important;animation:none !important}}:host(.is-danger){--mod-form-container-border: var(--ds-form-danger-container-border);--mod-form-description-color: var(--ds-form-danger-description-color);--mod-form-container-hover-border: var(--ds-form-danger-container-border);--mod-form-container-active-border: var(--ds-form-danger-container-border)}:host(.is-success){--mod-form-container-border: var(--ds-form-success-container-border);--mod-form-description-color: var(--ds-form-success-description-color);--mod-form-container-hover-border: var(--ds-form-success-container-border);--mod-form-container-active-border: var(--ds-form-success-container-border)}:host(.is-warning){--mod-form-container-border: var(--ds-form-warning-container-border);--mod-form-description-color: var(--ds-form-warning-description-color);--mod-form-container-hover-border: var(--ds-form-warning-container-border);--mod-form-container-active-border: var(--ds-form-warning-container-border)}:host(.is-disabled),:host(.is-disabled) #label,:host(.is-disabled) #description,:host(.is-disabled) #input,:host(.is-disabled) #clear,:host(.is-disabled) #trigger{pointer-events:none;cursor:default}:host(.is-disabled) #trigger{--icon-color: var(--_datepicker-trigger-icon-color-disabled)}:host(.is-disabled){--mod-form-container-background: var(--ds-form-disabled-container-background);--mod-form-container-border: var(--ds-form-disabled-container-border);--mod-form-label-color: var(--ds-form-disabled-label-color);--mod-form-description-color: var(--ds-form-disabled-description-color);--mod-date-color: var(--ds-form-disabled-control-value-color);--mod-date-placeholder: var(--ds-form-disabled-control-placeholder-color)}.air-datepicker{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-user-drag:none;user-drag:none;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}@media print{.air-datepicker{display:none !important}}.air-datepicker{--adp-cell-background-color-in-range: unset;--adp-hover-color: unset;--adp-cell-border-width: 2px;--adp-padding: 0.5rem;--adp-width: 264px;--adp-color: var(--_datepicker-calendar-text-color);--adp-font-family: var(--_datepicker-calendar-family);--adp-font-size: var(--_datepicker-calendar-size);--adp-border-color-inner: var(--_datepicker-calendar-color-inner-border);--adp-background-color-hover: var(--_datepicker-calendar-day-background-hover);--adp-background-color-active: var(--_datepicker-calendar-day-background-active);--adp-day-name-color: var(--_datepicker-calendar-text-color);--adp-color-current-date: var(--_datepicker-calendar-text-color);--adp-cell-background-color-selected: var(--_datepicker-calendar-day-background-selected);--adp-cell-background-color-selected-hover: var(--_datepicker-calendar-day-background-selected-hover);--adp-color-other-month: var(--_datepicker-calendar-disabled-color);--adp-color-other-decade: var(--_datepicker-calendar-disabled-color);--adp-color-disabled: var(--_datepicker-calendar-disabled-color);font-family:inherit;font-size:var(--_datepicker-calendar-size);border-radius:var(--_datepicker-calendar-radius);box-shadow:var(--_datepicker-calendar-shadow);font-weight:var(--_datepicker-calendar-weight);border:none}.air-datepicker *{font-family:inherit}.air-datepicker.-inline-{border:none;box-shadow:var(--_datepicker-calendar-shadow)}.air-datepicker .air-datepicker-nav{border-width:2px}.air-datepicker .air-datepicker-nav--title:not(.-disabled-) button,.air-datepicker .air-datepicker-nav--action:not(.-disabled-) button{padding:0;overflow:visible;border:0;background:none;color:inherit;font:inherit;cursor:pointer;user-select:none;appearance:button}.air-datepicker .air-datepicker-nav--title:not(.-disabled-) button::-moz-focus-inner,.air-datepicker .air-datepicker-nav--action:not(.-disabled-) button::-moz-focus-inner{border:0}.air-datepicker .air-datepicker-nav--title:not(.-disabled-) button,.air-datepicker .air-datepicker-nav--action:not(.-disabled-) button{display:flex;gap:.5rem;align-items:center;justify-content:center;height:2rem;min-width:2rem;color:var(--_datepicker-calendar-nav-color);--icon-color: var(--_datepicker-calendar-nav-color);border-radius:var(--_datepicker-calendar-nav-radius);box-shadow:none;outline:none;touch-action:manipulation;transition-property:color,background-color,border-color,box-shadow,text-shadow;transition-duration:.2s;transition-timing-function:cubic-bezier(0, 0, 0.2, 1)}.air-datepicker .air-datepicker-nav--title:not(.-disabled-) button::-moz-focus-inner,.air-datepicker .air-datepicker-nav--action:not(.-disabled-) button::-moz-focus-inner{border:0}@media(hover: hover)and (pointer: fine){.air-datepicker .air-datepicker-nav--title:not(.-disabled-) button:hover,.air-datepicker .air-datepicker-nav--title:not(.-disabled-) button.is-hovered,.air-datepicker .air-datepicker-nav--action:not(.-disabled-) button:hover,.air-datepicker .air-datepicker-nav--action:not(.-disabled-) button.is-hovered{color:var(--_datepicker-calendar-nav-color-hover);--icon-color: var(--_datepicker-calendar-nav-color-hover)}}.air-datepicker .air-datepicker-nav--title:not(.-disabled-) button:active,.air-datepicker .air-datepicker-nav--title:not(.-disabled-) button.is-pressed,.air-datepicker .air-datepicker-nav--action:not(.-disabled-) button:active,.air-datepicker .air-datepicker-nav--action:not(.-disabled-) button.is-pressed{color:var(--_datepicker-calendar-nav-color-active);--icon-color: var(--_datepicker-calendar-nav-color-active);translate:0 .5px}@media(hover: hover)and (pointer: fine){.air-datepicker .air-datepicker-nav--title:not(.-disabled-) button:focus-visible:not(:active),.air-datepicker .air-datepicker-nav--title:not(.-disabled-) button.is-focused:not(:active),.air-datepicker .air-datepicker-nav--action:not(.-disabled-) button:focus-visible:not(:active),.air-datepicker .air-datepicker-nav--action:not(.-disabled-) button.is-focused:not(:active){box-shadow:var(--ds-alias-interaction-focus-color-border) 0 0 0 2px,var(--_datepicker-focus-color) 0 0 0 5px !important}}.air-datepicker .air-datepicker-nav--action{margin-left:.5rem}.air-datepicker .air-datepicker-nav--title{margin-right:auto}.air-datepicker .air-datepicker-nav--title button{flex:1 1 auto;justify-content:flex-start}.air-datepicker .air-datepicker-body--cells.-days-{gap:.25rem}.air-datepicker .air-datepicker-body--day-name{font-weight:var(--_datepicker-calendar-day-name-weight);font-size:1rem;text-transform:none;font-family:var(--_datepicker-calendar-day-name-family)}.air-datepicker .air-datepicker-cell.-selected-:not(.-disabled-){font-weight:var(--_datepicker-calendar-day-weight-selected)}.air-datepicker .air-datepicker-cell.-day-{font-weight:var(--_datepicker-calendar-day-weight);height:2rem;width:2rem}.air-datepicker .air-datepicker-cell.-day-.-current-:not(.-disabled-){border:2px solid var(--_datepicker-calendar-color-current-date)}.air-datepicker .air-datepicker-cell.-day-.-selected-:not(.-disabled-){font-weight:var(--_datepicker-calendar-day-weight-selected)}.air-datepicker .air-datepicker-cell[tabindex="0"]{outline:none;touch-action:manipulation;transition-property:color,background-color,border-color,box-shadow,text-shadow;transition-duration:.2s;transition-timing-function:cubic-bezier(0, 0, 0.2, 1)}.air-datepicker .air-datepicker-cell[tabindex="0"]::-moz-focus-inner{border:0}@media(hover: hover)and (pointer: fine){.air-datepicker .air-datepicker-cell[tabindex="0"]:focus-visible:not(:active),.air-datepicker .air-datepicker-cell[tabindex="0"].is-focused:not(:active){box-shadow:var(--ds-alias-interaction-focus-color-border) 0 0 0 2px,var(--_datepicker-focus-color) 0 0 0 5px !important}}.air-datepicker .air-datepicker-cell.-disabled-{pointer-events:none}.air-datepicker #previous-disabled,.air-datepicker #next-disabled{display:none}.air-datepicker .air-datepicker-nav--action.-disabled-{pointer-events:none;visibility:visible}.air-datepicker .air-datepicker-nav--action.-disabled- button{display:none;visibility:hidden;pointer-events:none}.air-datepicker .air-datepicker-nav--action.-disabled- #previous-disabled,.air-datepicker .air-datepicker-nav--action.-disabled- #next-disabled{display:flex;justify-content:center;align-items:center;width:2rem;height:2rem;color:var(--_datepicker-calendar-nav-color-disabled);--icon-color: var(--_datepicker-calendar-nav-color-disabled);pointer-events:none}.air-datepicker .air-datepicker-nav--action.-disabled- #previous-disabled ds-icon,.air-datepicker .air-datepicker-nav--action.-disabled- #next-disabled ds-icon{pointer-events:none}

package/dist/collection/components/forms/file-upload/file-upload.host.css

@@ -1 +1 @@
-:host{--_file-upload-label-family: var(--file-upload-label-family, var(--mod-file-upload-label-family, var(--ds-alias-text-family-text)));--_file-upload-label-weight: var(--file-upload-label-weight, var(--mod-file-upload-label-weight, var(--ds-alias-text-weight-bold)));--_file-upload-label-size: var(--file-upload-label-size, var(--mod-file-upload-label-size, var(--ds-alias-text-size-base)));--_file-upload-label-line-height: var(--file-upload-label-line-height, var(--mod-file-upload-label-line-height, var(--ds-alias-text-line-height-text)));--_file-upload-drop-zone-border-color: var(--file-upload-drop-zone-border-color, var(--mod-file-upload-drop-zone-border-color, var(--ds-alias-border-color-grey)));--_file-upload-drop-zone-background: var(--file-upload-drop-zone-background, var(--mod-file-upload-drop-zone-background, var(--ds-alias-surface-transparent)));--_file-upload-drop-zone-hover-background: var(--file-upload-drop-zone-hover-background, var(--mod-file-upload-drop-zone-hover-background, var(--ds-alias-surface-grey-lighter)));--_file-upload-drop-zone-hover-border-color: var(--file-upload-drop-zone-hover-border-color, var(--mod-file-upload-drop-zone-hover-border-color, var(--ds-alias-border-color-primary)));--_file-upload-drop-zone-hover-text-color: var(--file-upload-drop-zone-hover-text-color, var(--mod-file-upload-drop-zone-hover-text-color, var(--ds-alias-text-color-primary-hover)));--_file-upload-drop-zone-active-background: var(--file-upload-drop-zone-active-background, var(--mod-file-upload-drop-zone-active-background, var(--ds-alias-surface-grey-light)));--_file-upload-drop-zone-active-border-color: var(--file-upload-drop-zone-active-border-color, var(--mod-file-upload-drop-zone-active-border-color, var(--ds-alias-border-color-primary)));--_file-upload-drop-zone-active-text-color: var(--file-upload-drop-zone-active-text-color, var(--mod-file-upload-drop-zone-active-text-color, var(--ds-alias-text-color-primary-active)));--_file-upload-drop-zone-focus-border-color: var(--file-upload-drop-zone-focus-border-color, var(--mod-file-upload-drop-zone-focus-border-color, var(--ds-alias-interaction-focus-color-border)));--_file-upload-drop-zone-disabled-background: var(--file-upload-drop-zone-disabled-background, var(--mod-file-upload-drop-zone-disabled-background, var(--ds-alias-surface-grey-light)));--_file-upload-drop-zone-disabled-border-color: var(--file-upload-drop-zone-disabled-border-color, var(--mod-file-upload-drop-zone-disabled-border-color, var(--ds-button-color-disabled-base-text)));--_file-upload-drop-zone-disabled-text-color: var(--file-upload-drop-zone-disabled-text-color, var(--mod-file-upload-drop-zone-disabled-text-color, var(--ds-button-color-disabled-base-text)));--_file-upload-file-list-background: var(--file-upload-file-list-background, var(--mod-file-upload-file-list-background, var(--ds-alias-surface-grey-light)));--_file-upload-file-name-color: var(--file-upload-file-name-color, var(--mod-file-upload-file-name-color, var(--ds-alias-text-color-primary)));--_file-upload-file-size-color: var(--file-upload-file-size-color, var(--mod-file-upload-file-size-color, var(--ds-alias-text-color-primary-light)));--_file-upload-disabled-icon-color: var(--file-upload-disabled-icon-color, var(--mod-file-upload-disabled-icon-color, var(--ds-button-color-disabled-base-text)));--_file-upload-disabled-text-color: var(--file-upload-disabled-text-color, var(--mod-file-upload-disabled-text-color, var(--ds-button-color-disabled-base-text)));--_file-upload-family: var(--file-upload-family, var(--mod-file-upload-family, var(--ds-form-default-control-typo-font-family)));--_file-upload-weight: var(--file-upload-weight, var(--mod-file-upload-weight, var(--ds-form-default-control-typo-font-weight)));--_file-upload-line-height: var(--file-upload-line-height, var(--mod-file-upload-line-height, var(--ds-form-default-control-typo-line-height)));--_file-upload-size: var(--file-upload-size, var(--mod-file-upload-size, var(--ds-form-default-control-typo-font-size)));--_file-upload-color: var(--file-upload-color, var(--mod-file-upload-color, var(--ds-form-default-control-value-color)));--_file-upload-placeholder: var(--file-upload-placeholder, var(--mod-file-upload-placeholder, var(--ds-form-default-control-placeholder-color)));--_form-label-color: var(--form-label-color, var(--mod-form-label-color, var(--ds-form-default-label-color)));--_form-label-family: var(--form-label-family, var(--mod-form-label-family, var(--ds-form-default-label-typo-font-family)));--_form-label-weight: var(--form-label-weight, var(--mod-form-label-weight, var(--ds-form-default-label-typo-font-weight)));--_form-label-line-height: var(--form-label-line-height, var(--mod-form-label-line-height, var(--ds-form-default-label-typo-line-height)));--_form-label-size: var(--form-label-size, var(--mod-form-label-size, var(--ds-form-default-label-typo-font-size)));--_form-description-color: var(--form-description-color, var(--mod-form-description-color, var(--ds-form-default-description-color)));--_form-description-family: var(--form-description-family, var(--mod-form-description-family, var(--ds-form-default-description-typo-font-family)));--_form-description-weight: var(--form-description-weight, var(--mod-form-description-weight, var(--ds-form-default-description-typo-font-weight)));--_form-description-line-height: var(--form-description-line-height, var(--mod-form-description-line-height, var(--ds-form-default-description-typo-line-height)));--_form-description-size: var(--form-description-size, var(--mod-form-description-size, var(--ds-form-default-description-typo-font-size)))}:host{position:relative;display:block;width:100%}:host #input{border:none;outline:none;box-shadow:none;position:relative;background:inherit;flex:1;color:var(--_file-upload-color);font-family:var(--_file-upload-family);font-weight:var(--_file-upload-weight);font-size:var(--_file-upload-size);line-height:var(--_file-upload-line-height);border-radius:var(--_file-upload-container-radius)}:host #input::placeholder{color:var(--_file-upload-placeholder)}:host #input::-moz-placeholder{color:var(--_file-upload-placeholder)}:host #input::-webkit-input-placeholder{color:var(--_file-upload-placeholder)}:host #input:-moz-placeholder{color:var(--_file-upload-placeholder)}:host #input:-ms-input-placeholder{color:var(--_file-upload-placeholder)}:host :where(fieldset){margin:0;padding:0;border:none}:host :where(legend){padding:0;float:left;width:100%}:host label{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:block;box-sizing:content-box;hyphens:auto;overflow-wrap:break-word;text-wrap:balance;min-width:0;color:var(--_form-label-color);font-family:var(--_form-label-family);font-weight:var(--_form-label-weight);font-size:var(--_form-label-size);line-height:var(--_form-label-line-height)}:host #description{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:flex;box-sizing:content-box;hyphens:auto;overflow-wrap:break-word;text-wrap:balance;min-width:0;gap:.25rem;min-height:1.125rem;color:var(--_form-description-color);font-family:var(--_form-description-family);font-weight:var(--_form-description-weight);font-size:var(--_form-description-size);line-height:var(--_form-description-line-height)}:host #description ds-icon{--icon-color: var(--_form-description-color)}:host input[type=file],:host #drop-zone-status{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;margin:0;padding:0;border:0;outline:0;clip:rect(0 0 0 0);opacity:0;overflow:hidden;-webkit-appearance:none;-moz-appearance:none}:host #drop-zone{display:flex;justify-content:center;align-items:center;gap:1rem;width:100%;padding:1rem;border:2px dashed var(--_file-upload-drop-zone-border-color);border-radius:var(--ds-alias-radius-base);background-color:var(--_file-upload-drop-zone-background)}@media(hover: hover)and (pointer: fine){:host #drop-zone:hover:not(.is-disabled){background-color:var(--_file-upload-drop-zone-hover-background);color:var(--_file-upload-drop-zone-hover-text-color);--icon-color: var(--_file-upload-drop-zone-hover-text-color);cursor:pointer}}:host #drop-zone:active:not(.is-disabled){border-color:var(--_file-upload-drop-zone-active-border-color);background-color:var(--_file-upload-drop-zone-active-background);color:var(--_file-upload-drop-zone-active-text-color);--icon-color: var(--_file-upload-drop-zone-active-text-color)}:host #drop-zone:focus-within:not(.is-disabled):not(:active){border-color:var(--_file-upload-drop-zone-focus-border-color)}:host #drop-zone.is-disabled{background-color:var(--_file-upload-drop-zone-disabled-background);border-color:var(--_file-upload-drop-zone-disabled-border-color);color:var(--_file-upload-drop-zone-disabled-text-color);--icon-color: var(--_file-upload-drop-zone-disabled-text-color);cursor:default;--_spinner-circle-background-color: var(--ds-global-color-grey-3)}:host #drop-zone-placeholder{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1rem;font-family:var(--ds-alias-text-family-text);font-weight:var(--ds-alias-text-weight-bold);font-size:var(--ds-alias-text-size-base);text-align:center}:host #file-list{margin-block:1rem;display:grid;gap:.5rem}:host #file-list li{padding:.5rem 1rem;border-radius:var(--ds-alias-radius-base);background-color:var(--_file-upload-file-list-background);display:flex;justify-content:flex-start;align-items:center}:host #file-list li .ds-stack{width:100%}:host #file-list li .file-name{color:var(--_file-upload-file-name-color);font-weight:var(--ds-alias-text-weight-bold);font-size:var(--ds-alias-text-size-base)}:host #file-list li .file-size{color:var(--_file-upload-file-size-color);font-size:var(--ds-alias-text-size-xs)}:host #file-list.is-disabled li{--icon-color: var(--_file-upload-disabled-icon-color)}:host #file-list.is-disabled li .file-name{color:var(--_file-upload-disabled-text-color)}:host #file-list.is-disabled li .file-size{color:var(--_file-upload-disabled-text-color)}:host(.is-danger){--mod-file-upload-description-color: var(--ds-form-danger-description-color);--mod-file-upload-drop-zone-border-color: var(--ds-alias-text-color-danger);--mod-file-upload-drop-zone-hover-border-color: var(--ds-alias-text-color-danger);--mod-file-upload-drop-zone-active-border-color: var(--ds-alias-text-color-danger)}:host(.is-success){--mod-file-upload-description-color: var(--ds-form-success-description-color);--mod-file-upload-drop-zone-border-color: var(--ds-alias-text-color-success);--mod-file-upload-drop-zone-hover-border-color: var(--ds-alias-text-color-success);--mod-file-upload-drop-zone-active-border-color: var(--ds-alias-text-color-success)}:host(.is-warning){--mod-file-upload-description-color: var(--ds-form-warning-description-color);--mod-file-upload-drop-zone-border-color: var(--ds-alias-text-color-warning);--mod-file-upload-drop-zone-hover-border-color: var(--ds-alias-text-color-warning);--mod-file-upload-drop-zone-active-border-color: var(--ds-alias-text-color-warning)}
+:host{--_file-upload-label-family: var(--file-upload-label-family, var(--mod-file-upload-label-family, var(--ds-alias-text-family-text)));--_file-upload-label-weight: var(--file-upload-label-weight, var(--mod-file-upload-label-weight, var(--ds-alias-text-weight-bold)));--_file-upload-label-size: var(--file-upload-label-size, var(--mod-file-upload-label-size, var(--ds-alias-text-size-base)));--_file-upload-label-line-height: var(--file-upload-label-line-height, var(--mod-file-upload-label-line-height, var(--ds-alias-text-line-height-text)));--_file-upload-drop-zone-border-color: var(--file-upload-drop-zone-border-color, var(--mod-file-upload-drop-zone-border-color, var(--ds-alias-border-color-grey)));--_file-upload-drop-zone-background: var(--file-upload-drop-zone-background, var(--mod-file-upload-drop-zone-background, var(--ds-alias-surface-transparent)));--_file-upload-drop-zone-hover-background: var(--file-upload-drop-zone-hover-background, var(--mod-file-upload-drop-zone-hover-background, var(--ds-alias-surface-grey-lighter)));--_file-upload-drop-zone-hover-border-color: var(--file-upload-drop-zone-hover-border-color, var(--mod-file-upload-drop-zone-hover-border-color, var(--ds-alias-border-color-primary)));--_file-upload-drop-zone-hover-text-color: var(--file-upload-drop-zone-hover-text-color, var(--mod-file-upload-drop-zone-hover-text-color, var(--ds-alias-text-color-primary-hover)));--_file-upload-drop-zone-active-background: var(--file-upload-drop-zone-active-background, var(--mod-file-upload-drop-zone-active-background, var(--ds-alias-surface-grey-light)));--_file-upload-drop-zone-active-border-color: var(--file-upload-drop-zone-active-border-color, var(--mod-file-upload-drop-zone-active-border-color, var(--ds-alias-border-color-primary)));--_file-upload-drop-zone-active-text-color: var(--file-upload-drop-zone-active-text-color, var(--mod-file-upload-drop-zone-active-text-color, var(--ds-alias-text-color-primary-active)));--_file-upload-drop-zone-focus-border-color: var(--file-upload-drop-zone-focus-border-color, var(--mod-file-upload-drop-zone-focus-border-color, var(--ds-alias-interaction-focus-color-border)));--_file-upload-drop-zone-disabled-background: var(--file-upload-drop-zone-disabled-background, var(--mod-file-upload-drop-zone-disabled-background, var(--ds-alias-surface-grey-light)));--_file-upload-drop-zone-disabled-border-color: var(--file-upload-drop-zone-disabled-border-color, var(--mod-file-upload-drop-zone-disabled-border-color, var(--ds-button-color-disabled-base-text)));--_file-upload-drop-zone-disabled-text-color: var(--file-upload-drop-zone-disabled-text-color, var(--mod-file-upload-drop-zone-disabled-text-color, var(--ds-button-color-disabled-base-text)));--_file-upload-file-list-background: var(--file-upload-file-list-background, var(--mod-file-upload-file-list-background, var(--ds-alias-surface-grey-light)));--_file-upload-file-name-color: var(--file-upload-file-name-color, var(--mod-file-upload-file-name-color, var(--ds-alias-text-color-primary)));--_file-upload-file-size-color: var(--file-upload-file-size-color, var(--mod-file-upload-file-size-color, var(--ds-alias-text-color-primary-light)));--_file-upload-disabled-icon-color: var(--file-upload-disabled-icon-color, var(--mod-file-upload-disabled-icon-color, var(--ds-button-color-disabled-base-text)));--_file-upload-disabled-text-color: var(--file-upload-disabled-text-color, var(--mod-file-upload-disabled-text-color, var(--ds-button-color-disabled-base-text)));--_file-upload-family: var(--file-upload-family, var(--mod-file-upload-family, var(--ds-form-default-control-typo-font-family)));--_file-upload-weight: var(--file-upload-weight, var(--mod-file-upload-weight, var(--ds-form-default-control-typo-font-weight)));--_file-upload-line-height: var(--file-upload-line-height, var(--mod-file-upload-line-height, var(--ds-form-default-control-typo-line-height)));--_file-upload-size: var(--file-upload-size, var(--mod-file-upload-size, var(--ds-form-default-control-typo-font-size)));--_file-upload-color: var(--file-upload-color, var(--mod-file-upload-color, var(--ds-form-default-control-value-color)));--_file-upload-placeholder: var(--file-upload-placeholder, var(--mod-file-upload-placeholder, var(--ds-form-default-control-placeholder-color)));--_form-label-color: var(--form-label-color, var(--mod-form-label-color, var(--ds-form-default-label-color)));--_form-label-family: var(--form-label-family, var(--mod-form-label-family, var(--ds-form-default-label-typo-font-family)));--_form-label-weight: var(--form-label-weight, var(--mod-form-label-weight, var(--ds-form-default-label-typo-font-weight)));--_form-label-line-height: var(--form-label-line-height, var(--mod-form-label-line-height, var(--ds-form-default-label-typo-line-height)));--_form-label-size: var(--form-label-size, var(--mod-form-label-size, var(--ds-form-default-label-typo-font-size)));--_form-description-color: var(--form-description-color, var(--mod-form-description-color, var(--ds-form-default-description-color)));--_form-description-family: var(--form-description-family, var(--mod-form-description-family, var(--ds-form-default-description-typo-font-family)));--_form-description-weight: var(--form-description-weight, var(--mod-form-description-weight, var(--ds-form-default-description-typo-font-weight)));--_form-description-line-height: var(--form-description-line-height, var(--mod-form-description-line-height, var(--ds-form-default-description-typo-line-height)));--_form-description-size: var(--form-description-size, var(--mod-form-description-size, var(--ds-form-default-description-typo-font-size)))}:host{position:relative;display:block;width:100%}:host #input{border:none;outline:none;box-shadow:none;position:relative;background:inherit;flex:1;min-width:0;color:var(--_file-upload-color);font-family:var(--_file-upload-family);font-weight:var(--_file-upload-weight);font-size:var(--_file-upload-size);line-height:var(--_file-upload-line-height);border-radius:var(--_file-upload-container-radius)}:host #input::placeholder{color:var(--_file-upload-placeholder)}:host #input::-moz-placeholder{color:var(--_file-upload-placeholder)}:host #input::-webkit-input-placeholder{color:var(--_file-upload-placeholder)}:host #input:-moz-placeholder{color:var(--_file-upload-placeholder)}:host #input:-ms-input-placeholder{color:var(--_file-upload-placeholder)}:host :where(fieldset){margin:0;padding:0;border:none}:host :where(legend){padding:0;float:left;width:100%}:host label{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:block;box-sizing:content-box;hyphens:auto;overflow-wrap:break-word;text-wrap:balance;min-width:0;color:var(--_form-label-color);font-family:var(--_form-label-family);font-weight:var(--_form-label-weight);font-size:var(--_form-label-size);line-height:var(--_form-label-line-height)}:host #description{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:flex;box-sizing:content-box;hyphens:auto;overflow-wrap:break-word;text-wrap:balance;min-width:0;gap:.25rem;min-height:1.125rem;color:var(--_form-description-color);font-family:var(--_form-description-family);font-weight:var(--_form-description-weight);font-size:var(--_form-description-size);line-height:var(--_form-description-line-height)}:host #description ds-icon{--icon-color: var(--_form-description-color)}:host input[type=file],:host #drop-zone-status{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;margin:0;padding:0;border:0;outline:0;clip:rect(0 0 0 0);opacity:0;overflow:hidden;-webkit-appearance:none;-moz-appearance:none}:host #drop-zone{display:flex;justify-content:center;align-items:center;gap:1rem;width:100%;padding:1rem;border:2px dashed var(--_file-upload-drop-zone-border-color);border-radius:var(--ds-alias-radius-base);background-color:var(--_file-upload-drop-zone-background)}@media(hover: hover)and (pointer: fine){:host #drop-zone:hover:not(.is-disabled){background-color:var(--_file-upload-drop-zone-hover-background);color:var(--_file-upload-drop-zone-hover-text-color);--icon-color: var(--_file-upload-drop-zone-hover-text-color);cursor:pointer}}:host #drop-zone:active:not(.is-disabled){border-color:var(--_file-upload-drop-zone-active-border-color);background-color:var(--_file-upload-drop-zone-active-background);color:var(--_file-upload-drop-zone-active-text-color);--icon-color: var(--_file-upload-drop-zone-active-text-color)}:host #drop-zone:focus-within:not(.is-disabled):not(:active){border-color:var(--_file-upload-drop-zone-focus-border-color)}:host #drop-zone.is-disabled{background-color:var(--_file-upload-drop-zone-disabled-background);border-color:var(--_file-upload-drop-zone-disabled-border-color);color:var(--_file-upload-drop-zone-disabled-text-color);--icon-color: var(--_file-upload-drop-zone-disabled-text-color);cursor:default;--_spinner-circle-background-color: var(--ds-global-color-grey-3)}:host #drop-zone-placeholder{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1rem;font-family:var(--ds-alias-text-family-text);font-weight:var(--ds-alias-text-weight-bold);font-size:var(--ds-alias-text-size-base);text-align:center}:host #file-list{margin-block:1rem;display:grid;gap:.5rem}:host #file-list li{padding:.5rem 1rem;border-radius:var(--ds-alias-radius-base);background-color:var(--_file-upload-file-list-background);display:flex;justify-content:flex-start;align-items:center}:host #file-list li .ds-stack{width:100%}:host #file-list li .file-name{color:var(--_file-upload-file-name-color);font-weight:var(--ds-alias-text-weight-bold);font-size:var(--ds-alias-text-size-base)}:host #file-list li .file-size{color:var(--_file-upload-file-size-color);font-size:var(--ds-alias-text-size-xs)}:host #file-list.is-disabled li{--icon-color: var(--_file-upload-disabled-icon-color)}:host #file-list.is-disabled li .file-name{color:var(--_file-upload-disabled-text-color)}:host #file-list.is-disabled li .file-size{color:var(--_file-upload-disabled-text-color)}:host(.is-danger){--mod-file-upload-description-color: var(--ds-form-danger-description-color);--mod-file-upload-drop-zone-border-color: var(--ds-alias-text-color-danger);--mod-file-upload-drop-zone-hover-border-color: var(--ds-alias-text-color-danger);--mod-file-upload-drop-zone-active-border-color: var(--ds-alias-text-color-danger)}:host(.is-success){--mod-file-upload-description-color: var(--ds-form-success-description-color);--mod-file-upload-drop-zone-border-color: var(--ds-alias-text-color-success);--mod-file-upload-drop-zone-hover-border-color: var(--ds-alias-text-color-success);--mod-file-upload-drop-zone-active-border-color: var(--ds-alias-text-color-success)}:host(.is-warning){--mod-file-upload-description-color: var(--ds-form-warning-description-color);--mod-file-upload-drop-zone-border-color: var(--ds-alias-text-color-warning);--mod-file-upload-drop-zone-hover-border-color: var(--ds-alias-text-color-warning);--mod-file-upload-drop-zone-active-border-color: var(--ds-alias-text-color-warning)}

package/dist/collection/components/forms/input/input.host.css

@@ -1 +1 @@
-:host{--_form-field-gap: var(--form-field-gap, var(--mod-form-field-gap, 0.25rem));--_form-container-background: var(--form-container-background, var(--mod-form-container-background, var(--ds-form-default-container-background)));--_form-container-border: var(--form-container-border, var(--mod-form-container-border, var(--ds-form-default-container-border)));--_form-container-radius: var(--form-container-radius, var(--mod-form-container-radius, var(--ds-form-container-radius)));--_form-container-hover-background: var(--form-container-hover-background, var(--mod-form-container-hover-background, var(--ds-form-hover-container-background)));--_form-container-active-background: var(--form-container-active-background, var(--mod-form-container-active-background, var(--ds-form-active-container-background)));--_form-container-focus-background: var(--form-container-focus-background, var(--mod-form-container-focus-background, var(--ds-form-focus-container-background)));--_form-container-hover-border: var(--form-container-hover-border, var(--mod-form-container-hover-border, var(--ds-form-hover-container-border)));--_form-container-active-border: var(--form-container-active-border, var(--mod-form-container-active-border, var(--ds-form-active-container-border)));--_form-container-focus-border: var(--form-container-focus-border, var(--mod-form-container-focus-border, var(--ds-form-focus-container-border)));--_form-label-color: var(--form-label-color, var(--mod-form-label-color, var(--ds-form-default-label-color)));--_form-label-family: var(--form-label-family, var(--mod-form-label-family, var(--ds-form-default-label-typo-font-family)));--_form-label-weight: var(--form-label-weight, var(--mod-form-label-weight, var(--ds-form-default-label-typo-font-weight)));--_form-label-line-height: var(--form-label-line-height, var(--mod-form-label-line-height, var(--ds-form-default-label-typo-line-height)));--_form-label-size: var(--form-label-size, var(--mod-form-label-size, var(--ds-form-default-label-typo-font-size)));--_form-description-color: var(--form-description-color, var(--mod-form-description-color, var(--ds-form-default-description-color)));--_form-description-family: var(--form-description-family, var(--mod-form-description-family, var(--ds-form-default-description-typo-font-family)));--_form-description-weight: var(--form-description-weight, var(--mod-form-description-weight, var(--ds-form-default-description-typo-font-weight)));--_form-description-line-height: var(--form-description-line-height, var(--mod-form-description-line-height, var(--ds-form-default-description-typo-line-height)));--_form-description-size: var(--form-description-size, var(--mod-form-description-size, var(--ds-form-default-description-typo-font-size)));--_input-family: var(--input-family, var(--mod-input-family, var(--ds-form-default-control-typo-font-family)));--_input-weight: var(--input-weight, var(--mod-input-weight, var(--ds-form-default-control-typo-font-weight)));--_input-line-height: var(--input-line-height, var(--mod-input-line-height, var(--ds-form-default-control-typo-line-height)));--_input-size: var(--input-size, var(--mod-input-size, var(--ds-form-default-control-typo-font-size)));--_input-color: var(--input-color, var(--mod-input-color, var(--ds-form-default-control-value-color)));--_input-placeholder: var(--input-placeholder, var(--mod-input-placeholder, var(--ds-form-default-control-placeholder-color)))}:host{position:relative;display:grid;gap:var(--_form-field-gap)}:host #container{box-sizing:border-box;clear:both;display:flex;width:100%;align-items:center;min-height:3rem;gap:.25rem;padding-inline:.5rem;background:var(--_form-container-background);border:var(--_form-container-border);border-radius:var(--_form-container-radius)}@media(hover: hover)and (pointer: fine){:host #container:hover,:host #container.is-hovered{background:var(--_form-container-hover-background);border:var(--_form-container-hover-border)}}:host #container:active,:host #container.is-pressed{background:var(--_form-container-active-background);border:var(--_form-container-active-border)}:host #container:focus-within:not(:active),:host #container.is-focused:not(:active){background:var(--_form-container-focus-background);border:var(--_form-container-focus-border)}:host :where(fieldset){margin:0;padding:0;border:none}:host :where(legend){padding:0;float:left;width:100%}:host label{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:block;box-sizing:content-box;hyphens:auto;overflow-wrap:break-word;text-wrap:balance;min-width:0;color:var(--_form-label-color);font-family:var(--_form-label-family);font-weight:var(--_form-label-weight);font-size:var(--_form-label-size);line-height:var(--_form-label-line-height)}:host #description{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:flex;box-sizing:content-box;hyphens:auto;overflow-wrap:break-word;text-wrap:balance;min-width:0;gap:.25rem;min-height:1.125rem;color:var(--_form-description-color);font-family:var(--_form-description-family);font-weight:var(--_form-description-weight);font-size:var(--_form-description-size);line-height:var(--_form-description-line-height)}:host #description ds-icon{--icon-color: var(--_form-description-color)}:host #input{border:none;outline:none;box-shadow:none;position:relative;background:inherit;flex:1;color:var(--_input-color);font-family:var(--_input-family);font-weight:var(--_input-weight);font-size:var(--_input-size);line-height:var(--_input-line-height);border-radius:var(--_input-container-radius)}:host #input::placeholder{color:var(--_input-placeholder)}:host #input::-moz-placeholder{color:var(--_input-placeholder)}:host #input::-webkit-input-placeholder{color:var(--_input-placeholder)}:host #input:-moz-placeholder{color:var(--_input-placeholder)}:host #input:-ms-input-placeholder{color:var(--_input-placeholder)}:host #inner{position:relative;display:grid;gap:var(--_form-field-gap)}:host(.is-danger){--mod-form-container-border: var(--ds-form-danger-container-border);--mod-form-description-color: var(--ds-form-danger-description-color);--mod-form-container-hover-border: var(--ds-form-danger-container-border);--mod-form-container-active-border: var(--ds-form-danger-container-border)}:host(.is-success){--mod-form-container-border: var(--ds-form-success-container-border);--mod-form-description-color: var(--ds-form-success-description-color);--mod-form-container-hover-border: var(--ds-form-success-container-border);--mod-form-container-active-border: var(--ds-form-success-container-border)}:host(.is-warning){--mod-form-container-border: var(--ds-form-warning-container-border);--mod-form-description-color: var(--ds-form-warning-description-color);--mod-form-container-hover-border: var(--ds-form-warning-container-border);--mod-form-container-active-border: var(--ds-form-warning-container-border)}:host(.is-disabled),:host(.is-disabled) #label,:host(.is-disabled) #description,:host(.is-disabled) #input{pointer-events:none;cursor:default}:host(.is-disabled){--mod-form-container-background: var(--ds-form-disabled-container-background);--mod-form-container-border: var(--ds-form-disabled-container-border);--mod-form-label-color: var(--ds-form-disabled-label-color);--mod-form-description-color: var(--ds-form-disabled-description-color);--mod-input-color: var(--ds-form-disabled-control-value-color);--mod-input-placeholder: var(--ds-form-disabled-control-placeholder-color)}
+:host{--_form-field-gap: var(--form-field-gap, var(--mod-form-field-gap, 0.25rem));--_form-container-background: var(--form-container-background, var(--mod-form-container-background, var(--ds-form-default-container-background)));--_form-container-border: var(--form-container-border, var(--mod-form-container-border, var(--ds-form-default-container-border)));--_form-container-radius: var(--form-container-radius, var(--mod-form-container-radius, var(--ds-form-container-radius)));--_form-container-hover-background: var(--form-container-hover-background, var(--mod-form-container-hover-background, var(--ds-form-hover-container-background)));--_form-container-active-background: var(--form-container-active-background, var(--mod-form-container-active-background, var(--ds-form-active-container-background)));--_form-container-focus-background: var(--form-container-focus-background, var(--mod-form-container-focus-background, var(--ds-form-focus-container-background)));--_form-container-hover-border: var(--form-container-hover-border, var(--mod-form-container-hover-border, var(--ds-form-hover-container-border)));--_form-container-active-border: var(--form-container-active-border, var(--mod-form-container-active-border, var(--ds-form-active-container-border)));--_form-container-focus-border: var(--form-container-focus-border, var(--mod-form-container-focus-border, var(--ds-form-focus-container-border)));--_form-label-color: var(--form-label-color, var(--mod-form-label-color, var(--ds-form-default-label-color)));--_form-label-family: var(--form-label-family, var(--mod-form-label-family, var(--ds-form-default-label-typo-font-family)));--_form-label-weight: var(--form-label-weight, var(--mod-form-label-weight, var(--ds-form-default-label-typo-font-weight)));--_form-label-line-height: var(--form-label-line-height, var(--mod-form-label-line-height, var(--ds-form-default-label-typo-line-height)));--_form-label-size: var(--form-label-size, var(--mod-form-label-size, var(--ds-form-default-label-typo-font-size)));--_form-description-color: var(--form-description-color, var(--mod-form-description-color, var(--ds-form-default-description-color)));--_form-description-family: var(--form-description-family, var(--mod-form-description-family, var(--ds-form-default-description-typo-font-family)));--_form-description-weight: var(--form-description-weight, var(--mod-form-description-weight, var(--ds-form-default-description-typo-font-weight)));--_form-description-line-height: var(--form-description-line-height, var(--mod-form-description-line-height, var(--ds-form-default-description-typo-line-height)));--_form-description-size: var(--form-description-size, var(--mod-form-description-size, var(--ds-form-default-description-typo-font-size)));--_input-family: var(--input-family, var(--mod-input-family, var(--ds-form-default-control-typo-font-family)));--_input-weight: var(--input-weight, var(--mod-input-weight, var(--ds-form-default-control-typo-font-weight)));--_input-line-height: var(--input-line-height, var(--mod-input-line-height, var(--ds-form-default-control-typo-line-height)));--_input-size: var(--input-size, var(--mod-input-size, var(--ds-form-default-control-typo-font-size)));--_input-color: var(--input-color, var(--mod-input-color, var(--ds-form-default-control-value-color)));--_input-placeholder: var(--input-placeholder, var(--mod-input-placeholder, var(--ds-form-default-control-placeholder-color)))}:host{position:relative;display:grid;grid-template-columns:minmax(0, 1fr);gap:var(--_form-field-gap)}:host #container{box-sizing:border-box;clear:both;display:flex;width:100%;min-width:0;align-items:center;min-height:3rem;gap:.25rem;padding-inline:.5rem;background:var(--_form-container-background);border:var(--_form-container-border);border-radius:var(--_form-container-radius)}@media(hover: hover)and (pointer: fine){:host #container:hover,:host #container.is-hovered{background:var(--_form-container-hover-background);border:var(--_form-container-hover-border)}}:host #container:active,:host #container.is-pressed{background:var(--_form-container-active-background);border:var(--_form-container-active-border)}:host #container:focus-within:not(:active),:host #container.is-focused:not(:active){background:var(--_form-container-focus-background);border:var(--_form-container-focus-border)}:host :where(fieldset){margin:0;padding:0;border:none}:host :where(legend){padding:0;float:left;width:100%}:host label{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:block;box-sizing:content-box;hyphens:auto;overflow-wrap:break-word;text-wrap:balance;min-width:0;color:var(--_form-label-color);font-family:var(--_form-label-family);font-weight:var(--_form-label-weight);font-size:var(--_form-label-size);line-height:var(--_form-label-line-height)}:host #description{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:flex;box-sizing:content-box;hyphens:auto;overflow-wrap:break-word;text-wrap:balance;min-width:0;gap:.25rem;min-height:1.125rem;color:var(--_form-description-color);font-family:var(--_form-description-family);font-weight:var(--_form-description-weight);font-size:var(--_form-description-size);line-height:var(--_form-description-line-height)}:host #description ds-icon{--icon-color: var(--_form-description-color)}:host #input{border:none;outline:none;box-shadow:none;position:relative;background:inherit;flex:1;min-width:0;color:var(--_input-color);font-family:var(--_input-family);font-weight:var(--_input-weight);font-size:var(--_input-size);line-height:var(--_input-line-height);border-radius:var(--_input-container-radius)}:host #input::placeholder{color:var(--_input-placeholder)}:host #input::-moz-placeholder{color:var(--_input-placeholder)}:host #input::-webkit-input-placeholder{color:var(--_input-placeholder)}:host #input:-moz-placeholder{color:var(--_input-placeholder)}:host #input:-ms-input-placeholder{color:var(--_input-placeholder)}:host #inner{position:relative;display:grid;grid-template-columns:minmax(0, 1fr);gap:var(--_form-field-gap)}:host(.is-danger){--mod-form-container-border: var(--ds-form-danger-container-border);--mod-form-description-color: var(--ds-form-danger-description-color);--mod-form-container-hover-border: var(--ds-form-danger-container-border);--mod-form-container-active-border: var(--ds-form-danger-container-border)}:host(.is-success){--mod-form-container-border: var(--ds-form-success-container-border);--mod-form-description-color: var(--ds-form-success-description-color);--mod-form-container-hover-border: var(--ds-form-success-container-border);--mod-form-container-active-border: var(--ds-form-success-container-border)}:host(.is-warning){--mod-form-container-border: var(--ds-form-warning-container-border);--mod-form-description-color: var(--ds-form-warning-description-color);--mod-form-container-hover-border: var(--ds-form-warning-container-border);--mod-form-container-active-border: var(--ds-form-warning-container-border)}:host(.is-disabled),:host(.is-disabled) #label,:host(.is-disabled) #description,:host(.is-disabled) #input{pointer-events:none;cursor:default}:host(.is-disabled){--mod-form-container-background: var(--ds-form-disabled-container-background);--mod-form-container-border: var(--ds-form-disabled-container-border);--mod-form-label-color: var(--ds-form-disabled-label-color);--mod-form-description-color: var(--ds-form-disabled-description-color);--mod-input-color: var(--ds-form-disabled-control-value-color);--mod-input-placeholder: var(--ds-form-disabled-control-placeholder-color)}

package/dist/collection/components/forms/input/input.js

@@ -14,6 +14,8 @@ import { INPUT_AUTOCOMPLETES, INPUT_AUTOCORRECTS, INPUT_COLORS, INPUT_INPUT_MODE
  * Input renders a text input field with validation, masking, autocomplete, and optional help/error messaging.
  *
  * @slot invalid-text - Overrides the `invalidText` prop with custom markup, shown instead of the description when `invalid` is `true`.
+ * @slot start - Content placed before the native input inside the field, for example an icon or a button.
+ * @slot end - Content placed after the native input inside the field, for example an icon or a button.
  * @part input - The native HTML input element.
  * @part prefix - The prefix wrapper (if used).
  * @part suffix - The suffix wrapper (if used).
@@ -282,7 +284,7 @@ export class Input {
             inputProps = { pattern: this.pattern };
         }
         const isInvalid = this.invalid || this.hasInvalidTextSlotContent;
-        return (h(Field, { key: '82b24049b649558af66e14b60210618aba2a0744', disabled: this.disabled, color: this.color, invalid: isInvalid, loading: this.loading, label: this.label, description: this.description, invalidText: this.invalidText, required: this.required, language: this.language }, h("input", Object.assign({ key: 'c4735b5a8d76b75d875bd19c759979e9a1327490', id: "input", part: "input", name: this.name, ref: inputEl => (this.control.nativeEl = inputEl), "aria-describedby": "description", "aria-invalid": isInvalid ? 'true' : 'false', disabled: this.disabled, accept: this.accept, inputMode: this.inputmode, autoCapitalize: this.autocapitalize, autocomplete: this.autocomplete, autocorrect: this.autocorrect, autofocus: this.autofocus, min: this.min, max: this.max, minLength: this.minLength, maxLength: this.maxLength, multiple: this.multiple, placeholder: this.placeholder || '', readonly: this.readonly, required: this.required, spellcheck: this.spellcheck, type: this.type, value: value, onClick: ev => this.handleClick(ev), onFocus: ev => this.handleFocus(ev), onBlur: ev => this.handleBlur(ev), onInput: ev => this.handleInput(ev), onKeyDown: ev => this.handleKeydown(ev), onKeyPress: ev => this.dsKeyPress.emit(ev) }, inputProps, this.inheritedAttributes))));
+        return (h(Field, { key: '6ad3e1924cbae4e2afdf127d2b89a6b99fdf8918', disabled: this.disabled, color: this.color, invalid: isInvalid, loading: this.loading, label: this.label, description: this.description, invalidText: this.invalidText, required: this.required, language: this.language }, h("input", Object.assign({ key: '68b4e4ccec07f6be6399b539a2708e71c35876a2', id: "input", part: "input", name: this.name, ref: inputEl => (this.control.nativeEl = inputEl), "aria-describedby": "description", "aria-invalid": isInvalid ? 'true' : 'false', disabled: this.disabled, accept: this.accept, inputMode: this.inputmode, autoCapitalize: this.autocapitalize, autocomplete: this.autocomplete, autocorrect: this.autocorrect, autofocus: this.autofocus, min: this.min, max: this.max, minLength: this.minLength, maxLength: this.maxLength, multiple: this.multiple, placeholder: this.placeholder || '', readonly: this.readonly, required: this.required, spellcheck: this.spellcheck, type: this.type, value: value, onClick: ev => this.handleClick(ev), onFocus: ev => this.handleFocus(ev), onBlur: ev => this.handleBlur(ev), onInput: ev => this.handleInput(ev), onKeyDown: ev => this.handleKeydown(ev), onKeyPress: ev => this.dsKeyPress.emit(ev) }, inputProps, this.inheritedAttributes))));
     }
     static get is() { return "ds-input"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/forms/number-input/number-input.host.css

@@ -1 +1 @@
-:host{--_form-field-gap: var(--form-field-gap, var(--mod-form-field-gap, 0.25rem));--_form-container-background: var(--form-container-background, var(--mod-form-container-background, var(--ds-form-default-container-background)));--_form-container-border: var(--form-container-border, var(--mod-form-container-border, var(--ds-form-default-container-border)));--_form-container-radius: var(--form-container-radius, var(--mod-form-container-radius, var(--ds-form-container-radius)));--_form-container-hover-background: var(--form-container-hover-background, var(--mod-form-container-hover-background, var(--ds-form-hover-container-background)));--_form-container-active-background: var(--form-container-active-background, var(--mod-form-container-active-background, var(--ds-form-active-container-background)));--_form-container-focus-background: var(--form-container-focus-background, var(--mod-form-container-focus-background, var(--ds-form-focus-container-background)));--_form-container-hover-border: var(--form-container-hover-border, var(--mod-form-container-hover-border, var(--ds-form-hover-container-border)));--_form-container-active-border: var(--form-container-active-border, var(--mod-form-container-active-border, var(--ds-form-active-container-border)));--_form-container-focus-border: var(--form-container-focus-border, var(--mod-form-container-focus-border, var(--ds-form-focus-container-border)));--_form-label-color: var(--form-label-color, var(--mod-form-label-color, var(--ds-form-default-label-color)));--_form-label-family: var(--form-label-family, var(--mod-form-label-family, var(--ds-form-default-label-typo-font-family)));--_form-label-weight: var(--form-label-weight, var(--mod-form-label-weight, var(--ds-form-default-label-typo-font-weight)));--_form-label-line-height: var(--form-label-line-height, var(--mod-form-label-line-height, var(--ds-form-default-label-typo-line-height)));--_form-label-size: var(--form-label-size, var(--mod-form-label-size, var(--ds-form-default-label-typo-font-size)));--_form-description-color: var(--form-description-color, var(--mod-form-description-color, var(--ds-form-default-description-color)));--_form-description-family: var(--form-description-family, var(--mod-form-description-family, var(--ds-form-default-description-typo-font-family)));--_form-description-weight: var(--form-description-weight, var(--mod-form-description-weight, var(--ds-form-default-description-typo-font-weight)));--_form-description-line-height: var(--form-description-line-height, var(--mod-form-description-line-height, var(--ds-form-default-description-typo-line-height)));--_form-description-size: var(--form-description-size, var(--mod-form-description-size, var(--ds-form-default-description-typo-font-size)));--_input-family: var(--input-family, var(--mod-input-family, var(--ds-form-default-control-typo-font-family)));--_input-weight: var(--input-weight, var(--mod-input-weight, var(--ds-form-default-control-typo-font-weight)));--_input-line-height: var(--input-line-height, var(--mod-input-line-height, var(--ds-form-default-control-typo-line-height)));--_input-size: var(--input-size, var(--mod-input-size, var(--ds-form-default-control-typo-font-size)));--_input-color: var(--input-color, var(--mod-input-color, var(--ds-form-default-control-value-color)));--_input-placeholder: var(--input-placeholder, var(--mod-input-placeholder, var(--ds-form-default-control-placeholder-color)))}:host{position:relative;display:grid;gap:var(--_form-field-gap)}:host #container{box-sizing:border-box;clear:both;display:flex;width:100%;align-items:center;min-height:3rem;gap:.25rem;padding-inline:.5rem;background:var(--_form-container-background);border:var(--_form-container-border);border-radius:var(--_form-container-radius)}@media(hover: hover)and (pointer: fine){:host #container:hover,:host #container.is-hovered{background:var(--_form-container-hover-background);border:var(--_form-container-hover-border)}}:host #container:active,:host #container.is-pressed{background:var(--_form-container-active-background);border:var(--_form-container-active-border)}:host #container:focus-within:not(:active),:host #container.is-focused:not(:active){background:var(--_form-container-focus-background);border:var(--_form-container-focus-border)}:host :where(fieldset){margin:0;padding:0;border:none}:host :where(legend){padding:0;float:left;width:100%}:host label{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:block;box-sizing:content-box;hyphens:auto;overflow-wrap:break-word;text-wrap:balance;min-width:0;color:var(--_form-label-color);font-family:var(--_form-label-family);font-weight:var(--_form-label-weight);font-size:var(--_form-label-size);line-height:var(--_form-label-line-height)}:host #description{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:flex;box-sizing:content-box;hyphens:auto;overflow-wrap:break-word;text-wrap:balance;min-width:0;gap:.25rem;min-height:1.125rem;color:var(--_form-description-color);font-family:var(--_form-description-family);font-weight:var(--_form-description-weight);font-size:var(--_form-description-size);line-height:var(--_form-description-line-height)}:host #description ds-icon{--icon-color: var(--_form-description-color)}:host #input{border:none;outline:none;box-shadow:none;position:relative;background:inherit;flex:1;color:var(--_input-color);font-family:var(--_input-family);font-weight:var(--_input-weight);font-size:var(--_input-size);line-height:var(--_input-line-height);border-radius:var(--_input-container-radius)}:host #input::placeholder{color:var(--_input-placeholder)}:host #input::-moz-placeholder{color:var(--_input-placeholder)}:host #input::-webkit-input-placeholder{color:var(--_input-placeholder)}:host #input:-moz-placeholder{color:var(--_input-placeholder)}:host #input:-ms-input-placeholder{color:var(--_input-placeholder)}:host #inner{position:relative;display:grid;gap:var(--_form-field-gap)}:host(.is-danger){--mod-form-container-border: var(--ds-form-danger-container-border);--mod-form-description-color: var(--ds-form-danger-description-color);--mod-form-container-hover-border: var(--ds-form-danger-container-border);--mod-form-container-active-border: var(--ds-form-danger-container-border)}:host(.is-success){--mod-form-container-border: var(--ds-form-success-container-border);--mod-form-description-color: var(--ds-form-success-description-color);--mod-form-container-hover-border: var(--ds-form-success-container-border);--mod-form-container-active-border: var(--ds-form-success-container-border)}:host(.is-warning){--mod-form-container-border: var(--ds-form-warning-container-border);--mod-form-description-color: var(--ds-form-warning-description-color);--mod-form-container-hover-border: var(--ds-form-warning-container-border);--mod-form-container-active-border: var(--ds-form-warning-container-border)}:host(.is-disabled),:host(.is-disabled) #label,:host(.is-disabled) #description,:host(.is-disabled) #input{pointer-events:none;cursor:default}:host(.is-disabled){--mod-form-container-background: var(--ds-form-disabled-container-background);--mod-form-container-border: var(--ds-form-disabled-container-border);--mod-form-label-color: var(--ds-form-disabled-label-color);--mod-form-description-color: var(--ds-form-disabled-description-color);--mod-input-color: var(--ds-form-disabled-control-value-color);--mod-input-placeholder: var(--ds-form-disabled-control-placeholder-color)}
+:host{--_form-field-gap: var(--form-field-gap, var(--mod-form-field-gap, 0.25rem));--_form-container-background: var(--form-container-background, var(--mod-form-container-background, var(--ds-form-default-container-background)));--_form-container-border: var(--form-container-border, var(--mod-form-container-border, var(--ds-form-default-container-border)));--_form-container-radius: var(--form-container-radius, var(--mod-form-container-radius, var(--ds-form-container-radius)));--_form-container-hover-background: var(--form-container-hover-background, var(--mod-form-container-hover-background, var(--ds-form-hover-container-background)));--_form-container-active-background: var(--form-container-active-background, var(--mod-form-container-active-background, var(--ds-form-active-container-background)));--_form-container-focus-background: var(--form-container-focus-background, var(--mod-form-container-focus-background, var(--ds-form-focus-container-background)));--_form-container-hover-border: var(--form-container-hover-border, var(--mod-form-container-hover-border, var(--ds-form-hover-container-border)));--_form-container-active-border: var(--form-container-active-border, var(--mod-form-container-active-border, var(--ds-form-active-container-border)));--_form-container-focus-border: var(--form-container-focus-border, var(--mod-form-container-focus-border, var(--ds-form-focus-container-border)));--_form-label-color: var(--form-label-color, var(--mod-form-label-color, var(--ds-form-default-label-color)));--_form-label-family: var(--form-label-family, var(--mod-form-label-family, var(--ds-form-default-label-typo-font-family)));--_form-label-weight: var(--form-label-weight, var(--mod-form-label-weight, var(--ds-form-default-label-typo-font-weight)));--_form-label-line-height: var(--form-label-line-height, var(--mod-form-label-line-height, var(--ds-form-default-label-typo-line-height)));--_form-label-size: var(--form-label-size, var(--mod-form-label-size, var(--ds-form-default-label-typo-font-size)));--_form-description-color: var(--form-description-color, var(--mod-form-description-color, var(--ds-form-default-description-color)));--_form-description-family: var(--form-description-family, var(--mod-form-description-family, var(--ds-form-default-description-typo-font-family)));--_form-description-weight: var(--form-description-weight, var(--mod-form-description-weight, var(--ds-form-default-description-typo-font-weight)));--_form-description-line-height: var(--form-description-line-height, var(--mod-form-description-line-height, var(--ds-form-default-description-typo-line-height)));--_form-description-size: var(--form-description-size, var(--mod-form-description-size, var(--ds-form-default-description-typo-font-size)));--_input-family: var(--input-family, var(--mod-input-family, var(--ds-form-default-control-typo-font-family)));--_input-weight: var(--input-weight, var(--mod-input-weight, var(--ds-form-default-control-typo-font-weight)));--_input-line-height: var(--input-line-height, var(--mod-input-line-height, var(--ds-form-default-control-typo-line-height)));--_input-size: var(--input-size, var(--mod-input-size, var(--ds-form-default-control-typo-font-size)));--_input-color: var(--input-color, var(--mod-input-color, var(--ds-form-default-control-value-color)));--_input-placeholder: var(--input-placeholder, var(--mod-input-placeholder, var(--ds-form-default-control-placeholder-color)))}:host{position:relative;display:grid;grid-template-columns:minmax(0, 1fr);gap:var(--_form-field-gap)}:host #container{box-sizing:border-box;clear:both;display:flex;width:100%;min-width:0;align-items:center;min-height:3rem;gap:.25rem;padding-inline:.5rem;background:var(--_form-container-background);border:var(--_form-container-border);border-radius:var(--_form-container-radius)}@media(hover: hover)and (pointer: fine){:host #container:hover,:host #container.is-hovered{background:var(--_form-container-hover-background);border:var(--_form-container-hover-border)}}:host #container:active,:host #container.is-pressed{background:var(--_form-container-active-background);border:var(--_form-container-active-border)}:host #container:focus-within:not(:active),:host #container.is-focused:not(:active){background:var(--_form-container-focus-background);border:var(--_form-container-focus-border)}:host :where(fieldset){margin:0;padding:0;border:none}:host :where(legend){padding:0;float:left;width:100%}:host label{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:block;box-sizing:content-box;hyphens:auto;overflow-wrap:break-word;text-wrap:balance;min-width:0;color:var(--_form-label-color);font-family:var(--_form-label-family);font-weight:var(--_form-label-weight);font-size:var(--_form-label-size);line-height:var(--_form-label-line-height)}:host #description{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:flex;box-sizing:content-box;hyphens:auto;overflow-wrap:break-word;text-wrap:balance;min-width:0;gap:.25rem;min-height:1.125rem;color:var(--_form-description-color);font-family:var(--_form-description-family);font-weight:var(--_form-description-weight);font-size:var(--_form-description-size);line-height:var(--_form-description-line-height)}:host #description ds-icon{--icon-color: var(--_form-description-color)}:host #input{border:none;outline:none;box-shadow:none;position:relative;background:inherit;flex:1;min-width:0;color:var(--_input-color);font-family:var(--_input-family);font-weight:var(--_input-weight);font-size:var(--_input-size);line-height:var(--_input-line-height);border-radius:var(--_input-container-radius)}:host #input::placeholder{color:var(--_input-placeholder)}:host #input::-moz-placeholder{color:var(--_input-placeholder)}:host #input::-webkit-input-placeholder{color:var(--_input-placeholder)}:host #input:-moz-placeholder{color:var(--_input-placeholder)}:host #input:-ms-input-placeholder{color:var(--_input-placeholder)}:host #inner{position:relative;display:grid;grid-template-columns:minmax(0, 1fr);gap:var(--_form-field-gap)}:host(.is-danger){--mod-form-container-border: var(--ds-form-danger-container-border);--mod-form-description-color: var(--ds-form-danger-description-color);--mod-form-container-hover-border: var(--ds-form-danger-container-border);--mod-form-container-active-border: var(--ds-form-danger-container-border)}:host(.is-success){--mod-form-container-border: var(--ds-form-success-container-border);--mod-form-description-color: var(--ds-form-success-description-color);--mod-form-container-hover-border: var(--ds-form-success-container-border);--mod-form-container-active-border: var(--ds-form-success-container-border)}:host(.is-warning){--mod-form-container-border: var(--ds-form-warning-container-border);--mod-form-description-color: var(--ds-form-warning-description-color);--mod-form-container-hover-border: var(--ds-form-warning-container-border);--mod-form-container-active-border: var(--ds-form-warning-container-border)}:host(.is-disabled),:host(.is-disabled) #label,:host(.is-disabled) #description,:host(.is-disabled) #input{pointer-events:none;cursor:default}:host(.is-disabled){--mod-form-container-background: var(--ds-form-disabled-container-background);--mod-form-container-border: var(--ds-form-disabled-container-border);--mod-form-label-color: var(--ds-form-disabled-label-color);--mod-form-description-color: var(--ds-form-disabled-description-color);--mod-input-color: var(--ds-form-disabled-control-value-color);--mod-input-placeholder: var(--ds-form-disabled-control-placeholder-color)}