/* stylelint-disable */ /* 
Copyright 2020 Adobe. All rights reserved.
This file is licensed to you under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License. You may obtain a copy
of the License at http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software distributed under
the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
OF ANY KIND, either express or implied. See the License for the specific language
governing permissions and limitations under the License.

THIS FILE IS MACHINE GENERATED. DO NOT EDIT */
#button {
    /* .spectrum-Picker */
    position: relative;
    display: inline-flex;
    box-sizing: border-box;
    overflow: visible;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-appearance: button;
    vertical-align: top;
    transition: background var(--spectrum-global-animation-duration-100, 0.13s)
            ease-out,
        border-color var(--spectrum-global-animation-duration-100, 0.13s)
            ease-out,
        color var(--spectrum-global-animation-duration-100, 0.13s) ease-out,
        box-shadow var(--spectrum-global-animation-duration-100, 0.13s) ease-out;
    text-decoration: none;
    font-family: var(
        --spectrum-alias-body-text-font-family,
        var(--spectrum-global-font-family-base)
    );
    line-height: 1.3;
    user-select: none;
    -webkit-user-select: none;
    touch-action: none;
    cursor: pointer;
}
#button:focus {
    /* .spectrum-Picker:focus */
    outline: none;
}
#button::-moz-focus-inner {
    /* .spectrum-Picker::-moz-focus-inner */
    border: 0;
    border-style: none;
    padding: 0;
    margin-top: -2px;
    margin-bottom: -2px;
}
#button:disabled {
    /* .spectrum-Picker:disabled */
    cursor: default;
}
#button {
    /* .spectrum-Picker */
    --spectrum-picker-border-size: var(
        --spectrum-alias-border-size-thin,
        var(--spectrum-global-dimension-static-size-10)
    );
    --spectrum-picker-text-size: var(
        --spectrum-alias-item-text-size-m,
        var(--spectrum-global-dimension-font-size-100)
    );
    --spectrum-picker-height: var(
        --spectrum-alias-item-height-m,
        var(--spectrum-global-dimension-size-400)
    );
    --spectrum-picker-icon-gap: var(
        --spectrum-alias-item-workflow-icon-gap-m,
        var(--spectrum-global-dimension-size-100)
    );
    --spectrum-picker-placeholder-text-font-style: var(
        --spectrum-global-font-style-italic,
        italic
    );
    --spectrum-picker-placeholder-text-font-weight: var(
        --spectrum-global-font-weight-regular,
        400
    );
    --spectrum-picker-border-radius: var(
        --spectrum-alias-border-radius-regular,
        var(--spectrum-global-dimension-size-50)
    );
    --spectrum-picker-ui-icon-gap: var(
        --spectrum-alias-item-ui-icon-gap-m,
        var(--spectrum-global-dimension-size-100)
    );
    --spectrum-picker-error-icon-margin-left: var(
        --spectrum-global-dimension-size-150
    );
    --spectrum-picker-textonly-padding-left: var(
        --spectrum-alias-item-padding-m,
        var(--spectrum-global-dimension-size-150)
    );
    --spectrum-picker-textonly-padding-right: var(
        --spectrum-alias-item-padding-m,
        var(--spectrum-global-dimension-size-150)
    );
    --spectrum-picker-min-width: var(--spectrum-global-dimension-size-400);
    --spectrum-picker-disabled-border-size: 0;
    --spectrum-picker-popover-max-width: var(
        --spectrum-global-dimension-size-3000
    );
    --spectrum-picker-width: var(--spectrum-global-dimension-size-2400);
    --spectrum-picker-border-size-increase-focus: 1px;
}
:host([dir='ltr']) #button {
    /* [dir=ltr] .spectrum-Picker */
    padding-left: var(--spectrum-picker-textonly-padding-left);
    padding-right: var(--spectrum-picker-textonly-padding-right);
}
:host([dir='rtl']) #button {
    /* [dir=rtl] .spectrum-Picker */
    padding-right: var(--spectrum-picker-textonly-padding-left);
    padding-left: var(--spectrum-picker-textonly-padding-right);
}
#button {
    /* .spectrum-Picker */
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 100%;
    width: var(--spectrum-picker-width);
    min-width: var(--spectrum-picker-min-width);
    height: var(--spectrum-picker-height);
    margin: 0;
    padding-top: 0;
    padding-bottom: 0;
    border-width: var(--spectrum-picker-border-size);
    border-style: solid;
    border-radius: var(--spectrum-picker-border-radius);
    transition: background-color
            var(--spectrum-global-animation-duration-100, 0.13s),
        box-shadow var(--spectrum-global-animation-duration-100, 0.13s),
        border-color var(--spectrum-global-animation-duration-100, 0.13s);
}
:host([disabled]) #button,
#button:disabled {
    /* .spectrum-Picker.is-disabled,
   * .spectrum-Picker:disabled */
    border-width: var(--spectrum-picker-disabled-border-size);
    cursor: default;
}
:host([dir='ltr']) #button .spectrum-Picker-icon {
    /* [dir=ltr] .spectrum-Picker .spectrum-Picker-icon */
    margin-right: var(--spectrum-picker-icon-gap);
}
:host([dir='rtl']) #button .spectrum-Picker-icon {
    /* [dir=rtl] .spectrum-Picker .spectrum-Picker-icon */
    margin-left: var(--spectrum-picker-icon-gap);
}
.spectrum-Picker-icon {
    /* .spectrum-Picker .spectrum-Picker-icon */
    flex-shrink: 0;
}
:host([dir='ltr']) #button #label + .spectrum-Picker-icon {
    /* [dir=ltr] .spectrum-Picker .spectrum-Picker-label+.spectrum-Picker-icon */
    margin-left: var(--spectrum-picker-icon-gap);
}
:host([dir='rtl']) #button #label + .spectrum-Picker-icon {
    /* [dir=rtl] .spectrum-Picker .spectrum-Picker-label+.spectrum-Picker-icon */
    margin-right: var(--spectrum-picker-icon-gap);
}
:host([quiet]) #button {
    /* .spectrum-Picker--quiet */
    --spectrum-picker-border-size: 0;
    --spectrum-picker-border-radius: 0;
    --spectrum-picker-textonly-padding-left: 0;
    --spectrum-picker-textonly-padding-right: 0;
    width: auto;
    min-width: 0;
}
:host([quiet][disabled]) #button:focus-visible,
:host([quiet]) #button:disabled:focus-visible {
    /* .spectrum-Picker--quiet.is-disabled.focus-ring,
   * .spectrum-Picker--quiet:disabled.focus-ring */
    box-shadow: none;
}
:host([dir='ltr']) #label {
    /* [dir=ltr] .spectrum-Picker-label */
    text-align: left;
}
:host([dir='rtl']) #label {
    /* [dir=rtl] .spectrum-Picker-label */
    text-align: right;
}
#label {
    /* .spectrum-Picker-label */
    flex: 1 1 auto;
    white-space: nowrap;
    overflow: hidden;
    height: calc(
        var(--spectrum-picker-height) - var(--spectrum-picker-border-size) * 2
    );
    line-height: calc(
        var(--spectrum-picker-height) - var(--spectrum-picker-border-size) * 2
    );
    font-size: var(--spectrum-picker-text-size);
    text-overflow: ellipsis;
}
#label.placeholder {
    /* .spectrum-Picker-label.is-placeholder */
    font-weight: var(--spectrum-picker-placeholder-text-font-weight);
    font-style: var(--spectrum-picker-placeholder-text-font-style);
    transition: color var(--spectrum-global-animation-duration-100, 0.13s)
        ease-in-out;
}
.dropdown {
    /* .spectrum-Picker-menuIcon */
    display: inline-block;
    position: relative;
    vertical-align: top;
    transition: color var(--spectrum-global-animation-duration-100, 0.13s)
        ease-out;
    flex-shrink: 0;
}
:host([dir='ltr']) .validationIcon {
    /* [dir=ltr] .spectrum-Picker-validationIcon */
    margin-left: var(--spectrum-picker-error-icon-margin-left);
}
:host([dir='rtl']) .validationIcon {
    /* [dir=rtl] .spectrum-Picker-validationIcon */
    margin-right: var(--spectrum-picker-error-icon-margin-left);
}
:host([dir='ltr']) #label ~ .dropdown {
    /* [dir=ltr] .spectrum-Picker-label~.spectrum-Picker-menuIcon */
    margin-left: var(--spectrum-picker-ui-icon-gap);
}
:host([dir='rtl']) #label ~ .dropdown {
    /* [dir=rtl] .spectrum-Picker-label~.spectrum-Picker-menuIcon */
    margin-right: var(--spectrum-picker-ui-icon-gap);
}
#popover {
    /* .spectrum-Picker-popover */
    max-width: var(--spectrum-picker-popover-max-width);
}
:host([dir='ltr']) .spectrum-Picker-popover--quiet {
    /* [dir=ltr] .spectrum-Picker-popover--quiet */
    margin-left: calc(
        -1 * (var(--spectrum-global-dimension-size-150) +
                    var(
                        --spectrum-popover-border-size,
                        var(--spectrum-alias-border-size-thin)
                    ))
    );
}
:host([dir='rtl']) .spectrum-Picker-popover--quiet {
    /* [dir=rtl] .spectrum-Picker-popover--quiet */
    margin-right: calc(
        -1 * (var(--spectrum-global-dimension-size-150) +
                    var(
                        --spectrum-popover-border-size,
                        var(--spectrum-alias-border-size-thin)
                    ))
    );
}
#button {
    /* .spectrum-Picker */
    color: var(
        --spectrum-alias-text-color,
        var(--spectrum-global-color-gray-800)
    );
    background-color: var(--spectrum-global-color-gray-75);
    border-color: var(
        --spectrum-alias-border-color,
        var(--spectrum-global-color-gray-400)
    );
}
#button:hover {
    /* .spectrum-Picker:hover */
    color: var(
        --spectrum-alias-text-color-hover,
        var(--spectrum-global-color-gray-900)
    );
    background-color: var(--spectrum-global-color-gray-50);
    border-color: var(
        --spectrum-alias-border-color-hover,
        var(--spectrum-global-color-gray-500)
    );
}
#button:hover .dropdown {
    /* .spectrum-Picker:hover .spectrum-Picker-menuIcon */
    color: var(
        --spectrum-alias-icon-color-hover,
        var(--spectrum-global-color-gray-900)
    );
}
:host([open]) #button,
#button:active {
    /* .spectrum-Picker.is-open,
   * .spectrum-Picker:active */
    background-color: var(--spectrum-global-color-gray-200);
    border-color: var(
        --spectrum-alias-border-color-down,
        var(--spectrum-global-color-gray-500)
    );
}
:host([open]) #button.placeholder #label,
#button:active.placeholder #label {
    /* .spectrum-Picker.is-open.is-placeholder .spectrum-Picker-label,
   * .spectrum-Picker:active.is-placeholder .spectrum-Picker-label */
    color: var(
        --spectrum-alias-placeholder-text-color-down,
        var(--spectrum-global-color-gray-900)
    );
}
#button:focus-visible,
:host([focused]) #button {
    /* .spectrum-Picker.focus-ring,
   * .spectrum-Picker.is-focused */
    background-color: var(--spectrum-global-color-gray-50);
    border-color: var(
        --spectrum-alias-border-color-focus,
        var(--spectrum-global-color-blue-400)
    );
    box-shadow: 0 0 0 var(--spectrum-picker-border-size-increase-focus)
        var(
            --spectrum-alias-border-color-focus,
            var(--spectrum-global-color-blue-400)
        );
    color: var(
        --spectrum-alias-text-color-hover,
        var(--spectrum-global-color-gray-900)
    );
}
#button:focus-visible.placeholder,
:host([focused]) #button.placeholder {
    /* .spectrum-Picker.focus-ring.is-placeholder,
   * .spectrum-Picker.is-focused.is-placeholder */
    color: var(
        --spectrum-alias-placeholder-text-color-hover,
        var(--spectrum-global-color-gray-900)
    );
}
:host([invalid]) #button {
    /* .spectrum-Picker.is-invalid */
    border-color: var(--spectrum-global-color-red-500);
}
:host([invalid]) #button .validationIcon {
    /* .spectrum-Picker.is-invalid .spectrum-Picker-validationIcon */
    color: var(
        --spectrum-semantic-negative-color-icon,
        var(--spectrum-global-color-red-600)
    );
}
:host([invalid][open]) #button,
:host([invalid]) #button:active,
:host([invalid]) #button:hover {
    /* .spectrum-Picker.is-invalid.is-open,
   * .spectrum-Picker.is-invalid:active,
   * .spectrum-Picker.is-invalid:hover */
    border-color: var(--spectrum-global-color-red-600);
}
:host([invalid]) #button:focus-visible,
:host([invalid][focused]) #button {
    /* .spectrum-Picker.is-invalid.focus-ring,
   * .spectrum-Picker.is-invalid.is-focused */
    border-color: var(
        --spectrum-alias-border-color-focus,
        var(--spectrum-global-color-blue-400)
    );
    box-shadow: 0 0 0 var(--spectrum-picker-border-size-increase-focus)
        var(
            --spectrum-alias-border-color-focus,
            var(--spectrum-global-color-blue-400)
        );
}
:host([disabled]) #button,
#button:disabled {
    /* .spectrum-Picker.is-disabled,
   * .spectrum-Picker:disabled */
    background-color: var(--spectrum-global-color-gray-200);
    color: var(
        --spectrum-alias-text-color-disabled,
        var(--spectrum-global-color-gray-500)
    );
}
:host([disabled]) #button .spectrum-Picker-icon,
:host([disabled]) #button .dropdown,
:host([disabled]) #button .validationIcon,
#button:disabled .spectrum-Picker-icon,
#button:disabled .dropdown,
#button:disabled .validationIcon {
    /* .spectrum-Picker.is-disabled .spectrum-Picker-icon,
   * .spectrum-Picker.is-disabled .spectrum-Picker-menuIcon,
   * .spectrum-Picker.is-disabled .spectrum-Picker-validationIcon,
   * .spectrum-Picker:disabled .spectrum-Picker-icon,
   * .spectrum-Picker:disabled .spectrum-Picker-menuIcon,
   * .spectrum-Picker:disabled .spectrum-Picker-validationIcon */
    color: var(
        --spectrum-alias-icon-color-disabled,
        var(--spectrum-global-color-gray-400)
    );
}
:host([disabled]) #button #label.placeholder,
#button:disabled #label.placeholder {
    /* .spectrum-Picker.is-disabled .spectrum-Picker-label.is-placeholder,
   * .spectrum-Picker:disabled .spectrum-Picker-label.is-placeholder */
    color: var(
        --spectrum-alias-text-color-disabled,
        var(--spectrum-global-color-gray-500)
    );
}
.dropdown {
    /* .spectrum-Picker-menuIcon */
    color: var(
        --spectrum-alias-icon-color,
        var(--spectrum-global-color-gray-700)
    );
}
#label.placeholder {
    /* .spectrum-Picker-label.is-placeholder */
    color: var(
        --spectrum-alias-placeholder-text-color,
        var(--spectrum-global-color-gray-800)
    );
}
#label.placeholder:hover {
    /* .spectrum-Picker-label.is-placeholder:hover */
    color: var(
        --spectrum-alias-placeholder-text-color-hover,
        var(--spectrum-global-color-gray-900)
    );
}
#label.placeholder:active {
    /* .spectrum-Picker-label.is-placeholder:active */
    color: var(
        --spectrum-alias-placeholder-text-color,
        var(--spectrum-global-color-gray-800)
    );
}
:host([quiet]) #button {
    /* .spectrum-Picker--quiet */
    color: var(
        --spectrum-alias-text-color,
        var(--spectrum-global-color-gray-800)
    );
    border-color: var(--spectrum-alias-border-color-transparent, transparent);
}
:host([quiet]) #button,
:host([quiet]) #button:hover {
    /* .spectrum-Picker--quiet,
   * .spectrum-Picker--quiet:hover */
    background-color: var(
        --spectrum-alias-background-color-transparent,
        transparent
    );
}
:host([quiet]) #button:hover {
    /* .spectrum-Picker--quiet:hover */
    color: var(
        --spectrum-alias-text-color-hover,
        var(--spectrum-global-color-gray-900)
    );
}
:host([quiet]) #button:focus-visible,
:host([quiet][focused]) #button {
    /* .spectrum-Picker--quiet.focus-ring,
   * .spectrum-Picker--quiet.is-focused */
    background-color: var(
        --spectrum-alias-background-color-transparent,
        transparent
    );
    box-shadow: 0 2px 0 0
        var(
            --spectrum-alias-border-color-focus,
            var(--spectrum-global-color-blue-400)
        );
}
:host([quiet]) #button:focus-visible.placeholder,
:host([quiet][focused]) #button.placeholder {
    /* .spectrum-Picker--quiet.focus-ring.is-placeholder,
   * .spectrum-Picker--quiet.is-focused.is-placeholder */
    color: var(
        --spectrum-alias-placeholder-text-color-hover,
        var(--spectrum-global-color-gray-900)
    );
}
:host([quiet]) #button:focus-visible .dropdown,
:host([quiet][focused]) #button .dropdown {
    /* .spectrum-Picker--quiet.focus-ring .spectrum-Picker-menuIcon,
   * .spectrum-Picker--quiet.is-focused .spectrum-Picker-menuIcon */
    color: var(
        --spectrum-alias-icon-color-focus,
        var(--spectrum-global-color-gray-900)
    );
}
:host([quiet][open]) #button,
:host([quiet]) #button:active {
    /* .spectrum-Picker--quiet.is-open,
   * .spectrum-Picker--quiet:active */
    background-color: var(
        --spectrum-alias-background-color-transparent,
        transparent
    );
    border-color: var(--spectrum-alias-border-color-transparent, transparent);
}
:host([quiet][open]) #button:focus-visible,
:host([quiet][open][focused]) #button,
:host([quiet]) #button:active:focus-visible,
:host([quiet][focused]) #button:active {
    /* .spectrum-Picker--quiet.is-open.focus-ring,
   * .spectrum-Picker--quiet.is-open.is-focused,
   * .spectrum-Picker--quiet:active.focus-ring,
   * .spectrum-Picker--quiet:active.is-focused */
    background-color: var(
        --spectrum-alias-background-color-transparent,
        transparent
    );
    box-shadow: 0 2px 0 0
        var(
            --spectrum-alias-border-color-focus,
            var(--spectrum-global-color-blue-400)
        );
}
:host([quiet][invalid]) #button:focus-visible,
:host([quiet][invalid][focused]) #button {
    /* .spectrum-Picker--quiet.is-invalid.focus-ring,
   * .spectrum-Picker--quiet.is-invalid.is-focused */
    box-shadow: 0 2px 0 0
        var(
            --spectrum-alias-border-color-focus,
            var(--spectrum-global-color-blue-400)
        );
}
:host([quiet][disabled]) #button,
:host([quiet]) #button:disabled {
    /* .spectrum-Picker--quiet.is-disabled,
   * .spectrum-Picker--quiet:disabled */
    background-color: var(
        --spectrum-alias-background-color-transparent,
        transparent
    );
    color: var(
        --spectrum-alias-text-color-disabled,
        var(--spectrum-global-color-gray-500)
    );
}