

.smart-drop-down-box {
    background: var(--smart-surface);
    border-color: var(--smart-border);
    border-top-left-radius: var(--smart-border-top-left-radius);
    border-bottom-left-radius: var(--smart-border-bottom-left-radius);
    border-top-right-radius: var(--smart-border-top-right-radius);
    border-bottom-right-radius: var(--smart-border-bottom-right-radius);
    overflow: initial;
    font-family: var(--smart-font-family);
    font-size: var(--smart-font-size);
    outline: none;
    height: var(--smart-editor-height);
}


    .smart-drop-down-box .smart-buttons-container {
        width: inherit;
        height: inherit;
        display: inherit;
        flex-direction: inherit;
        cursor: inherit;
        position: inherit;
        overflow: hidden;
        min-height: inherit;
    }


    /* Action Button */

    .smart-drop-down-box .smart-action-button .smart-input {
        color: inherit;
        background: inherit;
        border: none;
        width: calc(100% - var(--smart-editor-addon-width));
        height: 100%;
        outline: none;
        text-overflow: ellipsis;
    }


        .smart-drop-down-box .smart-action-button .smart-input::placeholder {
            color: inherit;
        }

    .smart-drop-down-box:not([drop-down-open-mode="dropDownButton"]) .smart-action-button[active],
    .smart-drop-down-box .smart-drop-down-button[active] {
        border-color: var(--smart-ui-state-border-active);
        background-color: var(--smart-ui-state-active);
        color: var(--smart-ui-state-color-activer);
    }

    .smart-drop-down-box[resizing] {
        user-select: none;
        touch-action: none;
    }


    .smart-drop-down-box .smart-drop-down {
        font-family: var(--smart-font-family);
        font-size: var(--smart-font-size);
    }

    .smart-drop-down-box .smart-action-button {
        display: flex;
        padding-left: var(--smart-editor-label-padding);
        align-content: center;
        outline: 1px solid transparent;
        height: 100%;
        width: calc(100% - var(--smart-editor-addon-width));
        flex-wrap: wrap;
        overflow: hidden;
        position: relative;
        border-style: solid;
        border-color: var(--smart-border);
        border-width: var(--smart-border-width);
        align-items: center;
        border-right: none;
        border-top-left-radius: var(--smart-border-top-left-radius);
        border-bottom-left-radius: var(--smart-border-bottom-left-radius);
        user-select: none;
    }

    .smart-drop-down-box[drop-down-button-position="left"] .smart-action-button {
        padding-right: var(--smart-editor-label-padding);
    }

    .smart-drop-down-box[drop-down-button-position="right"] .smart-action-button {
        padding-left: var(--smart-editor-label-padding);
    }

    .smart-drop-down-box[drop-down-button-position="top"] .smart-action-button,
    .smart-drop-down-box[drop-down-button-position="bottom"] .smart-action-button {
        min-height: var(--smart-editor-height);
        padding-left: initial;
    }

    /*drop-down-button-position*/
    .smart-drop-down-box[drop-down-button-position="left"] > .smart-container > .smart-content,
    .smart-drop-down-box[drop-down-button-position="left"].smart-container > .smart-content {
        flex-direction: row-reverse;
    }

    .smart-drop-down-box[drop-down-button-position="left"] .smart-action-button {
        border-right: var(--smart-border-width) solid var(--smart-border);
        border-color: var(--smart-border);
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
        border-top-right-radius: var(--smart-border-top-right-radius);
        border-bottom-right-radius: var(--smart-border-bottom-right-radius);
        padding-left: initial;
        flex-direction: row-reverse;
    }

    .smart-drop-down-box[drop-down-button-position="left"]:not([drop-down-open-mode="dropDownButton"]) .smart-action-button {
        border-left: initial;
    }

    .smart-drop-down-box[drop-down-button-position="left"] .smart-drop-down-button {
        border-left: var(--smart-border-width) solid var(--smart-border);
        border-color: var(--smart-border);
        border-top-left-radius: var(--smart-border-top-left-radius);
        border-bottom-left-radius: var(--smart-border-bottom-left-radius);
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
    }

        .smart-drop-down-box[drop-down-button-position="left"] .smart-drop-down-button,
        .smart-drop-down-box[drop-down-button-position="left"] .smart-drop-down-button[selected] {
            border-right: initial;
        }

    .smart-drop-down-box[drop-down-open-mode="dropDownButton"][drop-down-button-position="left"]:not([hover]) .smart-drop-down-button:focus {
        box-shadow: var(--smart-border-width) 0 0 0 var(--smart-outline);
    }

    .smart-drop-down-box[drop-down-open-mode="dropDownButton"][drop-down-button-position="right"]:not([hover]) .smart-action-button:focus,
    .smart-drop-down-box[drop-down-open-mode="dropDownButton"]:not([drop-down-button-position]):not([hover]) .smart-action-button:focus {
        box-shadow: var(--smart-border-width) 0 0 0 var(--smart-outline);
        z-index: 1;
    }

    .smart-drop-down-box[drop-down-button-position="top"] .smart-content {
        flex-direction: column-reverse;
    }

    .smart-drop-down-box[drop-down-button-position="top"] .smart-drop-down-button,
    .smart-drop-down-box[drop-down-button-position="top"] .smart-action-button,
    .smart-drop-down-box[drop-down-button-position="bottom"] .smart-drop-down-button,
    .smart-drop-down-box[drop-down-button-position="bottom"] .smart-action-button {
        width: 100%;
        border: var(--smart-border-width) solid var(--smart-border);
        height: 50%;
        justify-content: center;
    }

    .smart-drop-down-box[drop-down-button-position="top"] .smart-drop-down-button,
    .smart-drop-down-box[drop-down-button-position="bottom"] .smart-action-button {
        border-bottom: initial;
    }

    .smart-drop-down-box[drop-down-button-position="top"],
    .smart-drop-down-box[drop-down-button-position="bottom"] {
        min-height: calc(2 * var(--smart-editor-height));
    }


        .smart-drop-down-box[drop-down-button-position="bottom"] .smart-content {
            flex-direction: column;
        }



        .smart-drop-down-box[drop-down-button-position="top"] .smart-drop-down-button,
        .smart-drop-down-box[drop-down-button-position="bottom"] .smart-action-button {
            border-top-left-radius: var(--smart-border-top-left-radius);
            border-bottom-left-radius: 0;
            border-top-right-radius: var(--smart-border-top-right-radius);
            border-bottom-right-radius: 0;
        }

        .smart-drop-down-box[drop-down-button-position="bottom"] .smart-drop-down-button,
        .smart-drop-down-box[drop-down-button-position="top"] .smart-action-button {
            border-top-left-radius: 0;
            border-bottom-left-radius: var(--smart-border-bottom-left-radius);
            border-top-right-radius: 0;
            border-bottom-right-radius: var(--smart-border-bottom-right-radius);
        }

    .smart-drop-down-box[drop-down-button-position="none"] .smart-action-button {
        border-right: var(--smart-border-width) solid var(--smart-border);
        border-top-right-radius: var(--smart-border-top-right-radius);
        border-bottom-right-radius: var(--smart-border-bottom-right-radius);
        width: 100%;
        padding-right: var(--smart-editor-label-padding);
    }

    .smart-drop-down-box[drop-down-button-position="none"] .smart-drop-down-button {
        display: none;
    }

    /*End of drop-down-button-position*/

    .smart-drop-down-box[readonly] input {
        user-select: none;
        -moz-user-select: none;
        -webkit-user-select: none;
    }

    .smart-drop-down-box .smart-drop-down.smart-visibility-hidden {
        transform: scale(0);
        transition: transform 0.2s ease-in;
        transform-origin: left top 0px;
    }

    /*Default*/
    .smart-drop-down-box[drop-down-open-mode="dropDownButton"] .smart-drop-down-button {
        border-color: var(--smart-border);
        background-color: var(--smart-surface);
        color: var(--smart-surface-color);
        border-left-style: solid;
        border-left-width: var(--smart-border-width);
    }

    .smart-drop-down-box[drop-down-open-mode="dropDownButton"] .smart-action-button {
        border-color: var(--smart-border);
        background-color: var(--smart-background);
        color: var(--smart-background-color);
    }

    /*Hover*/
    .smart-drop-down-box[hover]:not([drop-down-open-mode="dropDownButton"]) .smart-action-button {
        border-color: var(--smart-ui-state-border-hover);
        background-color: var(--smart-ui-state-hover);
        color: var(--smart-ui-state-color-hover);
    }

    .smart-drop-down-box[hover] .smart-drop-down-button {
        border-color: var(--smart-ui-state-border-hover);
        background-color: var(--smart-ui-state-hover);
        color: var(--smart-ui-state-color-hover);
    }

    /*Focus*/
    .smart-drop-down-box[focus] .smart-action-button[focus],
    .smart-drop-down-box[focus] .smart-drop-down-button[focus] {
        outline: initial;
        border-color: var(--smart-outline);
    }

    /*Active*/
    .smart-drop-down-box[active] .smart-action-button,
    .smart-drop-down-box .smart-drop-down-button,
    .smart-drop-down-box[active][focus][drop-down-open-mode="dropDownButton"] .smart-action-button,
    .smart-drop-down-box[active][focus][drop-down-open-mode="dropDownButton"] .smart-drop-down-button,
    .smart-drop-down-box[active][drop-down-open-mode="dropDownButton"] .smart-drop-down-button:focus {
        border-color: var(--smart-ui-state-border-active);
        background-color: var(--smart-ui-state-active);
        color: var(--smart-ui-state-color-active);
    }

    .smart-drop-down-box[opened]:not([drop-down-open-mode="dropDownButton"]) .smart-action-button,
    .smart-drop-down-box[opened] .smart-drop-down-button {
        border-color: var(--smart-ui-state-active);
        background-color: var(--smart-ui-state-active);
        color: var(--smart-ui-state-color-active);
    }

    /*Content*/
    .smart-drop-down-box > .smart-container > .smart-content,
    .smart-drop-down-box.smart-container > .smart-content {
        position: relative;
        display: flex;
        width: 100%;
        height: 100%;
    }

    /*Auto-Height*/
    .smart-drop-down-box.auto-height {
        height: auto;
        min-height: var(--smart-editor-height);
    }

        .smart-drop-down-box.auto-height > .smart-container,
        .smart-drop-down-box.auto-height.smart-container,
        .smart-drop-down-box.auto-height .smart-action-button,
        .smart-drop-down-box.auto-height .smart-content {
            min-height: inherit;
        }

        .smart-drop-down-box.auto-height .smart-action-button {
            padding: 3px;
        }

    /*Hint & Label*/
    .smart-drop-down-box[label].auto-height,
    .smart-drop-down-box[hint].auto-height {
        height: auto;
    }

    .smart-drop-down-box > .smart-container,
    .smart-drop-down-box.smart-container,
    .smart-drop-down-box[label][hint] > .smart-container {
        display: flex;
        position: relative;
        align-items: center;
    }

    .smart-drop-down-box[hint] > .smart-container {
        align-items: flex-start;
    }

    .smart-drop-down-box[label] > .smart-container {
        align-items: flex-end;
    }

    .smart-drop-down-box[label] .smart-label,
    .smart-drop-down-box[hint] .smart-hint {
        position: absolute;
        left: 0;
        bottom: 100%;
        font-size: 12px;
        width: 100%;
        display: block;
        padding: var(--smart-editor-label-padding);
        pointer-events: none;
        user-select: none;
        -webkit-user-select: none;
        -ms-user-select: none;
        -moz-user-select: none;
        text-align: initial;
        line-height: initial;
        vertical-align: initial;
    }

    .smart-drop-down-box[hint] .smart-hint {
        opacity: 0;
        transition: opacity 0.2s cubic-bezier(0.4, 0.0, 0.6, 1);
    }

    .smart-drop-down-box[hint][focus] .smart-hint {
        opacity: 1;
        transition: opacity 0.2s cubic-bezier(0.4, 0.0, 0.2, 1);
    }

    .smart-drop-down-box[hint] .smart-hint {
        top: 100%;
        bottom: initial;
    }

    /*End of Hint & Label*/


    /*Disabled*/
    .smart-drop-down-box[disabled] > .smart-container,
    .smart-drop-down-box[disabled] .smart-drop-down-button {
        cursor: default;
        background-color: initial;
    }

    .smart-drop-down-box[selection-display-mode="tokens"][disabled] .smart-action-button > span {
        cursor: default;
    }

    /*End of Disabled*/

    /*Drop-Down-Button*/

    .smart-drop-down-box .smart-drop-down-button {
        display: flex;
        align-items: center;
        justify-content: center;
        width: var(--smart-editor-addon-width);
        min-width: var(--smart-editor-addon-width);
        color: inherit;
        outline: 1px solid transparent;
        overflow: hidden;
        position: relative;
        background: inherit;
        border-width: var(--smart-border-width);
        border-style: solid;
        border-color: var(--smart-border);
        border-left: none;
        color: var(--smart-surface-color);
        border-top-right-radius: var(--smart-border-top-right-radius);
        border-bottom-right-radius: var(--smart-border-bottom-right-radius);
        cursor: pointer;
    }

    .smart-drop-down-box[placeholder=""][dropDownButtonPosition="none"] .smart-drop-down-button,
    .smart-drop-down-box:not([placeholder])[dropDownButtonPosition="none"] .smart-drop-down-button {
        border-left-width: var(--smart-border-width);
        border-left-style: solid;
        border-top-left-radius: 0px;
        border-bottom-left-radius: 0px;
        border-top-right-radius: var(--smart-border-top-right-radius);
        border-bottom-right-radius: var(--smart-border-bottom-right-radius);
    }

    .smart-drop-down-box[placeholder=""]:not([opened])[dropDownButtonPosition="none"] .smart-drop-down-button:not([focus]),
    .smart-drop-down-box:not([placeholder]):not([opened])[dropDownButtonPosition="none"] .smart-drop-down-button:not([focus]) {
        border-color: var(--smart-border);
    }



    .smart-drop-down-box .smart-drop-down-button .smart-drop-down-button-icon {
        pointer-events: none;
        width: 100%;
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        transform-origin: center;
        font-family: var(--smart-font-family-icon);
    }

        .smart-drop-down-box .smart-drop-down-button .smart-drop-down-button-icon::after {
            content: var(--smart-icon-arrow-down);
        }


    .smart-drop-down-box:not([animation='none']) .smart-drop-down-button .smart-drop-down-button-icon:after {
        transition: transform 0.2s;
    }

    .smart-drop-down-box[drop-down-position="overlay-center"] .smart-drop-down-button .smart-drop-down-button-icon::after {
        content: var(--smart-icon-minus);
    }

    .smart-drop-down-box[opened] .smart-drop-down-button .smart-drop-down-button-icon:after,
    .smart-drop-down-box .smart-drop-down-button[top] .smart-drop-down-button-icon:after,
    .smart-drop-down-box .smart-drop-down-button[center-top] .smart-drop-down-button-icon:after,
    .smart-drop-down-box[opened] .smart-drop-down-button[bottom] .smart-drop-down-button-icon:after,
    .smart-drop-down-box[opened] .smart-drop-down-button[center-bottom] .smart-drop-down-button-icon:after {
        transform: rotate(180deg);
    }

    .smart-drop-down-box[opened] .smart-drop-down-button[top] .smart-drop-down-button-icon:after,
    .smart-drop-down-box[opened] .smart-drop-down-button[center-top] .smart-drop-down-button-icon:after {
        transform: rotate(0deg);
    }

    /* renderMode */


    .smart-drop-down-box.outlined,
    .smart-drop-down-box.outlined[focus],
    .smart-drop-down-box.outlined[hover]:not([opened]):not([drop-down-open-mode="dropDownButton"]) .smart-action-button:not([active]),
    .smart-drop-down-box.outlined[drop-down-open-mode="dropDownButton"]:not([hover]) .smart-action-button:not([active]),
    .smart-drop-down-box.outlined:not([opened]) .smart-action-button:not([active]),
    .smart-drop-down-box.outlined:not([opened]) .smart-drop-down-button {
        background-color: transparent;
    }

    /* render-mode="underlined" */

    .smart-drop-down-box.underlined {
        background-color: transparent;
    }

        .smart-drop-down-box.underlined[right-to-left]:not([drop-down-button-position]) .smart-action-button,
        .smart-drop-down-box.underlined[right-to-left]:not([hover]) .smart-action-button[focus],
        .smart-drop-down-box.underlined[right-to-left]:not([drop-down-button-position]) .smart-drop-down-button,
        .smart-drop-down-box.underlined[right-to-left]:not([drop-down-button-position]) .smart-drop-down-button[focus],
        .smart-drop-down-box.underlined[hover]:not([opened]):not([drop-down-open-mode="dropDownButton"]) .smart-action-button:not([active]),
        .smart-drop-down-box.underlined[drop-down-open-mode="dropDownButton"][hover]:not([opened]) .smart-action-button[hover],
        .smart-drop-down-box.underlined[hover]:not([opened]) .smart-action-button,
        .smart-drop-down-box.underlined .smart-action-button,
        .smart-drop-down-box.underlined[opened] .smart-action-button,
        .smart-drop-down-box.underlined .smart-drop-down-button {
            border-top-color: transparent;
            border-left-color: transparent;
            border-right-color: transparent;
        }

        .smart-drop-down-box.underlined[hover]:not([drop-down-open-mode="dropDownButton"]):not([opened]) .smart-action-button,
        .smart-drop-down-box.underlined[right-to-left]:not([drop-down-button-position]) .smart-action-button,
        .smart-drop-down-box.underlined .smart-action-button,
        .smart-drop-down-box.underlined[right-to-left]:not([hover]) .smart-action-button[focus],
        .smart-drop-down-box.underlined[opened] .smart-action-button {
            border-bottom-left-radius: 0;
        }

        .smart-drop-down-box.underlined[right-to-left]:not([drop-down-button-position]):not([opened]):not([hover]) .smart-drop-down-button:not([hover]),
        .smart-drop-down-box.underlined[right-to-left]:not([drop-down-button-position]):not([opened]):not([hover]) .smart-drop-down-button[focus]:not([hover]),
        .smart-drop-down-box.underlined:not([opened]):not([hover]) .smart-drop-down-button:not([hover]) {
            border-bottom-left-radius: 0;
        }

        .smart-drop-down-box.underlined[right-to-left]:not([drop-down-button-position]) .smart-action-button {
            border-bottom-right-radius: 0;
        }

        .smart-drop-down-box.underlined .smart-action-button,
        .smart-drop-down-box.underlined[opened] .smart-action-button,
        .smart-drop-down-box.underlined:not([hover]):not([opened]) .smart-drop-down-button {
            background-color: transparent;
            color: var(--smart-background-color);
        }

        .smart-drop-down-box.underlined:not([opened]) .smart-action-button:not([active]):not([hover]),
        .smart-drop-down-box.underlined:not([opened]):not([hover]) .smart-drop-down-button:not([active]):not([hover]) {
            border-radius: initial;
        }

        .smart-drop-down-box.underlined[hover]:not([drop-down-open-mode="dropDownButton"]):not([opened]) .smart-action-button:not([active]) {
            background-color: transparent;
        }

        .smart-drop-down-box.underlined[drop-down-open-mode="dropDownButton"][drop-down-button-position="left"]:not([hover]) .smart-drop-down-button:focus {
            box-shadow: none;
        }

        .smart-drop-down-box.underlined[drop-down-open-mode="dropDownButton"]:not([drop-down-button-position="left"]):not([drop-down-button-position="top"]):not([drop-down-button-position="bottom"]):not([hover]) .smart-action-button:focus {
            box-shadow: none;
            z-index: initial;
        }

        .smart-drop-down-box.underlined .smart-drop-down-button[active],
        .smart-drop-down-box.underlined .smart-action-button[active] {
            background-color: var(--smart-ui-state-active);
            color: var(--smart-ui-state-color-active);
        }

    /* --- Right-To-Left --- */
    .smart-drop-down-box[right-to-left],
    .smart-drop-down-box[right-to-left] .smart-label,
    .smart-drop-down-box[right-to-left] .smart-hint {
        direction: rtl;
    }

        .smart-drop-down-box[right-to-left]:not([drop-down-button-position]) .smart-action-button,
        .smart-drop-down-box[right-to-left][drop-down-button-position="left"] .smart-action-button {
            padding: 0 var(--smart-editor-label-padding) 0 0;
            border-right: var(--smart-border-width) solid var(--smart-border);
            border-top-left-radius: initial;
            border-top-right-radius: var(--smart-border-top-right-radius);
            border-bottom-left-radius: initial;
            border-bottom-right-radius: var(--smart-border-bottom-right-radius);
        }

        .smart-drop-down-box[right-to-left]:not([drop-down-button-position]) .smart-action-button,
        .smart-drop-down-box[right-to-left]:not([drop-down-open-mode="dropDownButton"])[drop-down-button-position="left"] .smart-action-button {
            border-left: initial;
        }

        .smart-drop-down-box[right-to-left]:not([drop-down-button-position]) .smart-drop-down-button,
        .smart-drop-down-box[right-to-left][drop-down-button-position="left"] .smart-drop-down-button {
            border-left: var(--smart-border-width) solid var(--smart-border);
            border-top-right-radius: initial;
            border-bottom-right-radius: initial;
            border-top-left-radius: var(--smart-border-top-left-radius);
            border-bottom-left-radius: var(--smart-border-bottom-left-radius);
        }

        .smart-drop-down-box[right-to-left] .smart-drop-down-button:focus,
        .smart-drop-down-box[right-to-left]:not([hover]) .smart-action-button[focus],
        .smart-drop-down-box[right-to-left]:not([hover]) .smart-drop-down-button[focus] {
            border-color: var(--smart-outline);
        }

        .smart-drop-down-box[right-to-left][drop-down-button-position="left"] .smart-drop-down-button,
        .smart-drop-down-box[right-to-left]:not([drop-down-open-mode="dropDownButton"]):not([drop-down-button-position]) .smart-drop-down-button {
            border-right: initial;
        }

        .smart-drop-down-box[right-to-left][opened] .smart-drop-down-button,
        .smart-drop-down-box[right-to-left][opened] .smart-action-button {
            border-color: var(--smart-border-active);
        }

        .smart-drop-down-box[right-to-left][drop-down-button-position="left"] .smart-action-button,
        .smart-drop-down-box[right-to-left]:not([drop-down-button-position]) > .smart-container > .smart-content,
        .smart-drop-down-box[right-to-left][drop-down-button-position="left"] > .smart-container > .smart-content {
            flex-direction: row;
        }

        .smart-drop-down-box[right-to-left][drop-down-button-position="right"] > .smart-container > .smart-content {
            flex-direction: row-reverse;
        }

        .smart-drop-down-box[right-to-left][drop-down-open-mode="dropDownButton"][drop-down-button-position="right"]:not([hover]) .smart-action-button:focus,
        .smart-drop-down-box[right-to-left][drop-down-open-mode="dropDownButton"]:not([drop-down-button-position]):not([hover]) .smart-action-button:focus {
            box-shadow: calc(-1 * var(--smart-border-width)) 0 0 0 var(--smart-outline);
        }
/* ---- */


@keyframes smart-drop-down-list-smart-animate-overlay-center-opening {
    0% {
        opacity: 0.2;
        transform: scaleY(0) translateY(-50%);
    }

    50% {
        opacity: 0.4;
    }

    100% {
        opacity: 1;
        transform: scaleY(1) translateY(-50%);
    }
}

@keyframes smart-drop-down-list-smart-animate-overlay-center-closing {
    0% {
        opacity: 1;
        transform: scaleY(1) translateY(-50%);
    }

    50% {
        opacity: 0.4;
    }

    100% {
        opacity: 0.2;
        transform: scaleY(0) translateY(-50%);
    }
}

@keyframes smart-drop-down-list-smart-animate-opening {
    0% {
        opacity: 0.2;
        transform: scaleY(0);
    }

    50% {
        opacity: 0.4;
    }

    100% {
        opacity: 1;
        transform: scaleY(1);
    }
}

@keyframes smart-drop-down-list-smart-animate-closing {
    0% {
        opacity: 1;
        transform: scaleY(1);
        pointer-events: none;
    }

    50% {
        opacity: 0.4;
        pointer-events: none;
    }

    100% {
        opacity: 0.2;
        transform: scaleY(0);
        pointer-events: none;
    }
}

.smart-drop-down.smart-drop-down-container smart-list-box {
    top: 2px;
}

.smart-drop-down:not([resize-mode='none']) smart-list-box {
    position: relative;
    width: 100%;
    height: calc(100% - var(--smart-editor-drop-down-resize-bar-height));
    border: none;
}

.smart-drop-down[resize-mode='none'] smart-list-box {
    width: 100%;
    height: 100%;
    position: relative;
    border: none;
}

.smart-drop-down.smart-drop-down-container smart-list-box:focus {
    border-color: var(--smart-outline);
}

.smart-drop-down.smart-drop-down-container .smart-drop-down-resize-bar {
    position: relative;
    width: 100%;
    margin-top: 2.5px;
    height: calc(var(--smart-editor-drop-down-resize-bar-height) - 2.5px);
    touch-action: none;
}

.smart-drop-down[resize-mode="none"] .smart-drop-down-resize-bar {
    display: none;
    cursor: default;
}

.smart-drop-down[top] .smart-drop-down-resize-bar {
    margin-top: 0;
    margin-bottom: 2.5px;
}

.smart-drop-down:not([resize-mode="none"]) .smart-drop-down-resize-bar {
    border-top: 1px solid var(--smart-border);
}

.smart-drop-down:not([resize-mode="none"])[top] .smart-drop-down-resize-bar {
    border-top: initial;
    border-bottom: 1px solid var(--smart-border);
}

.smart-drop-down[resize-mode="horizontal"] .smart-drop-down-resize-bar > div,
.smart-drop-down[resize-mode="none"] .smart-drop-down-resize-bar > div {
    display: none;
}

.smart-drop-down[resize-mode="vertical"] .smart-drop-down-resize-bar > div,
.smart-drop-down[resize-mode="both"] .smart-drop-down-resize-bar > div {
    display: initial;
    position: absolute;
    width: 5px;
    height: 5px;
    left: 50%;
    /*top: 50%;*/
    top: calc(50% + 1px); /* Including the BorderTop */
    transform: translate(-50%,-50%);
    border: 1px solid var(--smart-border);
    border-radius: 50%;
    pointer-events: none;
}

.smart-drop-down[resize-mode="vertical"].smart-drop-down-container.smart-drop-down-repositioned .smart-drop-down-resize-bar > div,
.smart-drop-down[resize-mode="both"].smart-drop-down-container.smart-drop-down-repositioned .smart-drop-down-resize-bar > div {
    width: 3px;
    height: 3px;
}

.smart-drop-down[resize-mode][top] .smart-drop-down-resize-bar > div {
    top: calc(50% - 1px); /* Including the BorderBottom */
}

.smart-drop-down[resize-mode="vertical"] .smart-drop-down-resize-bar > div:after,
.smart-drop-down[resize-mode="both"] .smart-drop-down-resize-bar > div:after,
.smart-drop-down[resize-mode="vertical"] .smart-drop-down-resize-bar > div:before,
.smart-drop-down[resize-mode="both"] .smart-drop-down-resize-bar > div:before {
    position: absolute;
    top: 50%;
    transform: translate(-50%,-50%);
    content: '';
    width: 100%;
    height: 100%;
    border: 1px solid var(--smart-border);
    border-radius: 50%;
    pointer-events: none;
}

.smart-drop-down[resize-mode="vertical"] .smart-drop-down-resize-bar > div:after,
.smart-drop-down[resize-mode="both"] .smart-drop-down-resize-bar > div:after {
    left: 500%;
}

.smart-drop-down[resize-mode="vertical"] .smart-drop-down-resize-bar > div:before,
.smart-drop-down[resize-mode="both"] .smart-drop-down-resize-bar > div:before {
    left: -400%;
}

.smart-drop-down[resize-mode="horizontal"][resize-indicator] .smart-drop-down-resize-bar:before,
.smart-drop-down[resize-mode="both"][resize-indicator] .smart-drop-down-resize-bar:before {
    width: 8px;
    height: 5px;
    font-family: var(--smart-font-family-icon);
    content: var(--smart-icon-resize-horizontal);
    position: absolute;
    top: calc(100% - 8px);
    left: calc(100% - 8px);
    transform: rotate(-45deg);
    font-size: 10px;
    cursor: se-resize;
}

.smart-drop-down[resize-mode="horizontal"][top] .smart-drop-down-resize-bar:before,
.smart-drop-down[resize-mode="both"][top] .smart-drop-down-resize-bar:before {
    transform: rotate(45deg);
    top: calc(100% - 13px);
    left: calc(100% - 4px);
}

.smart-drop-down[resize-mode="horizontal"][resize-indicator] .smart-drop-down-resize-bar:after,
.smart-drop-down[resize-mode="both"][resize-indicator] .smart-drop-down-resize-bar:after {
    width: 8px;
    height: 12px;
    font-family: var(--smart-font-family-icon);
    content: var(--smart-icon-resize-full);
    position: absolute;
    top: calc(100% - 12px);
    left: calc(100% - 7px);
    transform: rotate(-45deg) scaleX(2.25);
    font-size: 10px;
    cursor: e-resize;
}

.smart-drop-down[resize-mode="vertical"] .smart-drop-down-resize-bar {
    cursor: n-resize;
}

.smart-drop-down[resize-mode="horizontal"] .smart-drop-down-resize-bar {
    cursor: e-resize;
}

.smart-drop-down[resize-mode="both"] .smart-drop-down-resize-bar {
    cursor: nwse-resize;
}

.smart-drop-down[resize-mode="both"][top] .smart-drop-down-resize-bar {
    cursor: sw-resize;
}

.smart-drop-down.smart-drop-down-container {
    box-shadow: var(--smart-elevation-8);
    border-color: var(--smart-border);
    font-size: var(--smart-font-size);
    font-family: var(--smart-font-family);
}

    .smart-drop-down.smart-drop-down-container.smart-visibility-hidden {
        transform: scale(0);
    }

.smart-path .smart-drop-down,
.smart-path .smart-drop-down[bottom],
.smart-color-picker .smart-drop-down,
.smart-color-picker .smart-drop-down[bottom],
.smart-multi-split-button .smart-drop-down,
.smart-multi-split-button .smart-drop-down[bottom],
.smart-combo-box .smart-drop-down,
.smart-drop-down-list .smart-drop-down,
.smart-combo-box .smart-drop-down[bottom],
.smart-drop-down-list .smart-drop-down[bottom],
.smart-text-box .smart-drop-down,
.smart-text-box .smart-drop-down[bottom],
.smart-drop-down-button .smart-drop-down,
.smart-drop-down-button .smart-drop-down[bottom],
.smart-date-time-picker .smart-drop-down,
.smart-date-time-picker .smart-drop-down[bottom] {
    cursor: default;
    left: 0;
    box-sizing: border-box;
    font-size: inherit;
    padding: var(--smart-editor-drop-down-padding-size);
    margin: calc(var(--smart-editor-drop-down-vertical-offset) + var(--smart-editor-drop-down-padding-size)) 0px;
    background-color: var(--smart-background);
    border-width: var(--smart-border-width);
    border-style: solid;
    border-color: var(--smart-border);
    box-shadow: var(--smart-elevation-8);
    /*border-top: initial;*/
    display: flex;
    flex-direction: column;
    padding-left: 0px;
}

.smart-date-time-picker .smart-drop-down {
    border: none;
}

    .smart-path .smart-drop-down[center-bottom],
    .smart-path .smart-drop-down[center-bottom].smart-visibility-hidden,
    .smart-color-picker .smart-drop-down[center-bottom],
    .smart-color-picker .smart-drop-down[center-bottom].smart-visibility-hidden,
    .smart-multi-split-button .smart-drop-down[center-bottom],
    .smart-multi-split-button .smart-drop-down[center-bottom].smart-visibility-hidden,
    .smart-combo-box .smart-drop-down[center-bottom],
    .smart-combo-box .smart-drop-down[center-bottom].smart-visibility-hidden,
    .smart-drop-down-list .smart-drop-down[center-bottom],
    .smart-drop-down-list .smart-drop-down[center-bottom].smart-visibility-hidden,
    .smart-text-box .smart-drop-down[center-bottom],
    .smart-text-box .smart-drop-down[center-bottom].smart-visibility-hidden,
    .smart-drop-down-button .smart-drop-down[center-bottom],
    .smart-drop-down-button .smart-drop-down[center-bottom].smart-visibility-hidden,
    .smart-date-time-picker .smart-drop-down[center-bottom],
    .smart-date-time-picker .smart-drop-down[center-bottom].smart-visibility-hidden {
        border: var(--smart-border-width) solid var(--smart-border);
        top: calc(100% - var(--smart-border-width));
    }

    .smart-path .smart-drop-down[center-top],
    .smart-path .smart-drop-down[center-top].smart-visibility-hidden,
    .smart-color-picker .smart-drop-down[center-top],
    .smart-color-picker .smart-drop-down[center-top].smart-visibility-hidden,
    .smart-multi-split-button .smart-drop-down[center-top],
    .smart-multi-split-button .smart-drop-down[center-top].smart-visibility-hidden,
    .smart-combo-box .smart-drop-down[center-top],
    .smart-combo-box .smart-drop-down[center-top].smart-visibility-hidden,
    .smart-drop-down-list .smart-drop-down[center-top],
    .smart-drop-down-list .smart-drop-down[center-top].smart-visibility-hidden,
    .smart-text-box .smart-drop-down[center-top],
    .smart-text-box .smart-drop-down[center-top].smart-visibility-hidden,
    .smart-drop-down-button .smart-drop-down[center-top],
    .smart-drop-down-button .smart-drop-down[center-top].smart-visibility-hidden,
    .smart-date-time-picker .smart-drop-down[center-top],
    .smart-date-time-picker .smart-drop-down[center-top].smart-visibility-hidden {
        border: var(--smart-border-width) solid var(--smart-border);
        top: initial;
        bottom: calc(100% - var(--smart-border-width));
    }



.smart-drop-down.smart-drop-down-container.smart-drop-down-repositioned,
.smart-drop-down-container.smart-drop-down-repositioned,
.smart-drop-down.smart-drop-down-container,
.smart-drop-down.smart-date-time-drop-down.smart-drop-down-repositioned,
.smart-path .smart-drop-down,
.smart-color-picker .smart-drop-down,
.smart-multi-split-button .smart-drop-down,
.smart-combo-box .smart-drop-down,
.smart-drop-down-list .smart-drop-down,
.smart-text-box .smart-drop-down,
.smart-drop-down-button .smart-drop-down,
.smart-date-time-picker .smart-drop-down {
    background-color: var(--smart-background);
    box-sizing: border-box;
    padding-top: 3px;
    padding-bottom: 3px;
    outline: none;
    border-width: var(--smart-border-width);
    border-style: solid;
    border-color: var(--smart-border);
    display: flex;
    flex-direction: column;
    height: var(--smart-editor-drop-down-height);
    max-height: var(--smart-editor-drop-down-max-height);
    min-height: var(--smart-editor-drop-down-min-height);
    width: var(--smart-editor-drop-down-width);
    max-width: var(--smart-editor-drop-down-max-width);
    min-width: var(--smart-editor-drop-down-min-width);
    font-size: var(--smart-font-size);
    font-family: var(--smart-font-family);
    margin: calc(var(--smart-editor-drop-down-vertical-offset) + 3px) 0px;
    padding-left: 0px;
    padding-right: 0px !important;
}

.smart-drop-down.smart-date-time-drop-down[drop-down-display-mode="calendar"] {
    height: calc(var(--smart-editor-drop-down-height) - var(--smart-calendar-title-height));
}

.smart-drop-down.smart-drop-down-color-picker.smart-drop-down-repositioned,
.smart-color-picker .smart-drop-down.smart-drop-down-color-picker {
    max-height: calc(var(--smart-editor-drop-down-max-height) + 50px);
}

.smart-color-picker .smart-drop-down,
.smart-drop-down-button .smart-drop-down {
    width: var(--smart-drop-down-button-drop-down-width);
    height: var(--smart-drop-down-button-drop-down-height);
}

.smart-drop-down.smart-drop-down-container.smart-drop-down-repositioned,
.smart-drop-down-container.smart-drop-down-repositioned,
.smart-drop-down.smart-drop-down-container,
.smart-drop-down-list .smart-drop-down {
    width: var(--smart-drop-down-list-drop-down-width);
    height: var(--smart-drop-down-list-drop-down-height);
}

.smart-combo-box .smart-drop-down {
    width: var(--smart-combo-box-drop-down-width);
    height: var(--smart-combo-box-drop-down-height);
}

    /* Microsoft Edge-specific fix */
    .smart-path .smart-drop-down.smart-visibility-hidden.not-in-view,
    .smart-color-picker .smart-drop-down.smart-visibility-hidden.not-in-view,
    .smart-multi-split-button .smart-drop-down.smart-visibility-hidden.not-in-view,
    .smart-combo-box .smart-drop-down.smart-visibility-hidden.not-in-view,
    .smart-drop-down-list .smart-drop-down.smart-visibility-hidden.not-in-view,
    .smart-text-box .smart-drop-down.smart-visibility-hidden.not-in-view,
    .smart-drop-down-button .smart-drop-down.smart-visibility-hidden.not-in-view,
    .smart-drop-down.smart-drop-down-container.smart-drop-down-repositioned.smart-visibility-hidden.not-in-view,
    .smart-drop-down-container.smart-drop-down-repositioned.smart-visibility-hidden.not-in-view,
    .smart-drop-down.smart-drop-down-container.smart-visibility-hidden.not-in-view {
        left: -9999px;
        top: -9999px;
        transition: none;
    }

.smart-drop-down[overlay-bottom],
.smart-drop-down-container.smart-drop-down-repositioned[overlay-bottom],
.smart-drop-down[overlay-center],
.smart-drop-down-container.smart-drop-down-repositioned[overlay-center],
.smart-drop-down[overlay-top],
.smart-drop-down-container.smart-drop-down-repositioned[overlay-top] {
    margin: unset;
}

.smart-drop-down.smart-drop-down-container.smart-drop-down-repositioned[top],
.smart-drop-down-container.smart-drop-down-repositioned[top],
.smart-drop-down.smart-drop-down-container.smart-drop-down-repositioned[center-top],
.smart-drop-down-container.smart-drop-down-repositioned[center-top] {
    margin: calc(-1 * (var(--smart-editor-drop-down-vertical-offset) + 3px)) 0px;
}

.smart-multi-split-button .smart-drop-down smart-scroll-bar.bottom-corner,
.smart-list-box smart-scroll-bar.bottom-corner,
.smart-scroll-viewer smart-scroll-bar.bottom-corner,
.smart-drop-down-list .smart-drop-down smart-scroll-bar.bottom-corner,
.smart-combo-box .smart-drop-down smart-scroll-bar.bottom-corner,
.smart-text-box .smart-drop-down smart-scroll-bar.bottom-corner,
.smart-drop-down-button .smart-drop-down smart-scroll-bar.bottom-corner {
    width: calc(100% - var(--smart-scroll-bar-size));
}

.smart-color-picker .smart-drop-down smart-scroll-bar[orientation="vertical"].bottom-corner,
.smart-multi-split-button .smart-drop-down smart-scroll-bar[orientation="vertical"].bottom-corner,
.smart-list-box smart-scroll-bar[orientation="vertical"].bottom-corner,
.smart-scroll-viewer smart-scroll-bar[orientation="vertical"].bottom-corner,
.smart-drop-down-list .smart-drop-down smart-scroll-bar[orientation="vertical"].bottom-corner,
.smart-combo-box .smart-drop-down smart-scroll-bar[orientation="vertical"].bottom-corner,
.smart-text-box .smart-drop-down smart-scroll-bar[orientation="vertical"].bottom-corner,
.smart-drop-down-button .smart-drop-down smart-scroll-bar[orientation="vertical"].bottom-corner {
    width: calc(var(--smart-scroll-bar-size));
    height: calc(100% - var(--smart-scroll-bar-size));
}

.smart-color-picker .smart-drop-down smart-scroll-bar::before,
.smart-multi-split-button .smart-drop-down smart-scroll-bar::before,
.smart-list-box smart-scroll-bar::before,
.smart-scroll-viewer smart-scroll-bar::before,
.smart-drop-down-list .smart-drop-down smart-scroll-bar::before,
.smart-combo-box .smart-drop-down smart-scroll-bar::before,
.smart-text-box .smart-drop-down smart-scroll-bar::before,
.smart-drop-down-button .smart-drop-down smart-scroll-bar::before {
    display: none;
    background-color: var(--smart-border);
}

.smart-color-picker .smart-drop-down .smart-list-items-container.vscroll,
.smart-multi-split-button .smart-drop-down .smart-list-items-container.vscroll,
.smart-list-box .smart-list-items-container.vscroll,
.smart-scroll-viewer .smart-list-items-container.vscroll,
.smart-combo-box .smart-drop-down .smart-list-items-container.vscroll,
.smart-drop-down-list .smart-drop-down .smart-list-items-container.vscroll,
.smart-text-box .smart-drop-down .smart-list-items-container.vscroll,
.smart-drop-down-button .smart-drop-down .smart-list-items-container.vscroll {
    width: calc(100% - var(--smart-scroll-bar-size));
}


.smart-list-box input.vscroll,
.smart-multi-split-button .smart-drop-down input:focus,
.smart-combo-box .smart-selection-field input,
.smart-drop-down-list .smart-drop-down input:focus,
.smart-text-box .smart-drop-down input:focus,
.smart-drop-down-button .smart-drop-down input:focus {
    outline: none;
}

.smart-color-picker .smart-drop-down smart-scroll-bar[orientation="vertical"],
.smart-multi-split-button .smart-drop-down smart-scroll-bar[orientation="vertical"],
.smart-combo-box .smart-drop-down smart-scroll-bar[orientation="vertical"],
.smart-drop-down-list .smart-drop-down smart-scroll-bar[orientation="vertical"],
.smart-text-box .smart-drop-down smart-scroll-bar[orientation="vertical"],
.smart-drop-down-button .smart-drop-down smart-scroll-bar[orientation="vertical"] {
    padding-top: initial;
}

.smart-color-picker .smart-drop-down smart-scroll-bar,
.smart-multi-split-button .smart-drop-down smart-scroll-bar,
.smart-combo-box .smart-drop-down smart-scroll-bar,
.smart-drop-down-list .smart-drop-down smart-scroll-bar,
.smart-text-box .smart-drop-down smart-scroll-bar,
.smart-drop-down-button .smart-drop-down smart-scroll-bar {
    height: calc(var(--smart-scroll-bar-size));
}

.smart-multi-split-button.auto-height .smart-action-button,
.smart-drop-down-list.auto-height .smart-action-button,
.smart-drop-down-button.auto-height .smart-action-button {
    white-space: initial;
    text-overflow: initial;
    line-height: 1rem;
    flex-wrap: wrap;
}

.smart-multi-split-button.auto-height[selection-display-mode="tokens"] .smart-action-button > span,
.smart-multi-split-button.auto-height[selection-display-mode="tokens"] .smart-action-button > span:first-of-type,
.smart-drop-down-list.auto-height[selection-display-mode="tokens"] .smart-action-button > span,
.smart-drop-down-list.auto-height[selection-display-mode="tokens"] .smart-action-button > span:first-of-type,
.smart-drop-down-button.auto-height[selection-display-mode="tokens"] .smart-action-button > span,
.smart-drop-down-button.auto-height[selection-display-mode="tokens"] .smart-action-button > span:first-of-type {
    display: inline-block;
    margin: 0.2em;
}

.smart-path .smart-drop-down,
.smart-path .smart-drop-down.smart-visibility-hidden,
.smart-path .smart-drop-down[bottom],
.smart-path .smart-drop-down[bottom].smart-visibility-hidden,
.smart-color-picker .smart-drop-down,
.smart-color-picker .smart-drop-down.smart-visibility-hidden,
.smart-color-picker .smart-drop-down[bottom],
.smart-color-picker .smart-drop-down[bottom].smart-visibility-hidden,
.smart-multi-split-button .smart-drop-down,
.smart-multi-split-button .smart-drop-down.smart-visibility-hidden,
.smart-multi-split-button .smart-drop-down[bottom],
.smart-multi-split-button .smart-drop-down[bottom].smart-visibility-hidden,
.smart-drop-down-list .smart-drop-down,
.smart-drop-down-list .smart-drop-down.smart-visibility-hidden,
.smart-drop-down-list .smart-drop-down[bottom],
.smart-drop-down-list .smart-drop-down[bottom].smart-visibility-hidden,
.smart-combo-box .smart-drop-down,
.smart-combo-box .smart-drop-down.smart-visibility-hidden,
.smart-combo-box .smart-drop-down[bottom],
.smart-combo-box .smart-drop-down[bottom].smart-visibility-hidden,
.smart-text-box .smart-drop-down,
.smart-text-box .smart-drop-down.smart-visibility-hidden,
.smart-text-box .smart-drop-down[bottom],
.smart-text-box .smart-drop-down[bottom].smart-visibility-hidden,
.smart-drop-down-button .smart-drop-down,
.smart-drop-down-button .smart-drop-down.smart-visibility-hidden,
.smart-drop-down-button .smart-drop-down[bottom],
.smart-drop-down-button .smart-drop-down[bottom].smart-visibility-hidden,
.smart-date-time-picker .smart-drop-down,
.smart-date-time-picker .smart-drop-down.smart-visibility-hidden,
.smart-date-time-picker .smart-drop-down[bottom],
.smart-date-time-picker .smart-drop-down[bottom].smart-visibility-hidden {
    top: calc(100% - var(--smart-border-width));
}

.smart-drop-down-container.smart-drop-down-repositioned:focus {
    border-color: var(--smart-border);
}

.smart-drop-down-container.smart-drop-down-repositioned:not([animation='none']).smart-visibility-hidden,
.smart-path:not([animation='none']) .smart-drop-down.smart-visibility-hidden,
.smart-color-picker:not([animation='none']) .smart-drop-down.smart-visibility-hidden,
.smart-multi-split-button:not([animation='none']) .smart-drop-down.smart-visibility-hidden,
.smart-drop-down-list:not([animation='none']) .smart-drop-down.smart-visibility-hidden,
.smart-combo-box:not([animation='none']) .smart-drop-down.smart-visibility-hidden,
.smart-text-box:not([animation='none']) .smart-drop-down.smart-visibility-hidden,
.smart-drop-down-button:not([animation='none']) .smart-drop-down.smart-visibility-hidden,
.smart-date-time-picker:not([animation='none']) .smart-drop-down.smart-visibility-hidden {
    transition: animation, visibility 0.2s ease-in;
}

.smart-path .smart-drop-down[overlay-bottom],
.smart-path .smart-drop-down[overlay-bottom].smart-visibility-hidden,
.smart-path .smart-drop-down[overlay-center],
.smart-path .smart-drop-down[overlay-center].smart-visibility-hidden,
.smart-path .smart-drop-down[overlay-top],
.smart-path .smart-drop-down[overlay-top].smart-visibility-hidden,
.smart-color-picker .smart-drop-down[overlay-bottom],
.smart-color-picker .smart-drop-down[overlay-bottom].smart-visibility-hidden,
.smart-color-picker .smart-drop-down[overlay-center],
.smart-color-picker .smart-drop-down[overlay-center].smart-visibility-hidden,
.smart-color-picker .smart-drop-down[overlay-top],
.smart-color-picker .smart-drop-down[overlay-top].smart-visibility-hidden,
.smart-multi-split-button .smart-drop-down[overlay-bottom],
.smart-multi-split-button.smart-drop-down[overlay-bottom].smart-visibility-hidden,
.smart-multi-split-button .smart-drop-down[overlay-center],
.smart-multi-split-button .smart-drop-down[overlay-center].smart-visibility-hidden,
.smart-multi-split-button .smart-drop-down[overlay-top],
.smart-multi-split-button .smart-drop-down[overlay-top].smart-visibility-hidden,
.smart-drop-down-list .smart-drop-down[overlay-bottom],
.smart-drop-down-list.smart-drop-down[overlay-bottom].smart-visibility-hidden,
.smart-drop-down-list .smart-drop-down[overlay-center],
.smart-drop-down-list .smart-drop-down[overlay-center].smart-visibility-hidden,
.smart-drop-down-list .smart-drop-down[overlay-top],
.smart-drop-down-list .smart-drop-down[overlay-top].smart-visibility-hidden,
.smart-combo-box .smart-drop-down[overlay-bottom],
.smart-combo-box .smart-drop-down[overlay-bottom].smart-visibility-hidden,
.smart-combo-box .smart-drop-down[overlay-center],
.smart-combo-box .smart-drop-down[overlay-center].smart-visibility-hidden,
.smart-combo-box .smart-drop-down[overlay-top],
.smart-combo-box .smart-drop-down[overlay-top].smart-visibility-hidden,
.smart-text-box .smart-drop-down[overlay-bottom],
.smart-text-box .smart-drop-down[overlay-bottom].smart-visibility-hidden,
.smart-text-box .smart-drop-down[overlay-center],
.smart-text-box .smart-drop-down[overlay-center].smart-visibility-hidden,
.smart-text-box .smart-drop-down[overlay-top],
.smart-text-box .smart-drop-down[overlay-top].smart-visibility-hidden,
.smart-drop-down-button .smart-drop-down[overlay-bottom],
.smart-drop-down-button .smart-drop-down[overlay-bottom].smart-visibility-hidden,
.smart-drop-down-button .smart-drop-down[overlay-center],
.smart-drop-down-button .smart-drop-down[overlay-center].smart-visibility-hidden,
.smart-drop-down-button .smart-drop-down[overlay-top],
.smart-drop-down-button .smart-drop-down[overlay-top].smart-visibility-hidden,
.smart-date-time-picker .smart-drop-down[overlay-bottom],
.smart-date-time-picker .smart-drop-down[overlay-bottom].smart-visibility-hidden,
.smart-date-time-picker .smart-drop-down[overlay-center],
.smart-date-time-picker .smart-drop-down[overlay-center].smart-visibility-hidden,
.smart-date-time-picker .smart-drop-down[overlay-top],
.smart-date-time-picker .smart-drop-down[overlay-top].smart-visibility-hidden {
    border-color: var(--smart-border);
    border-width: var(--smart-border-width);
    border-style: solid;
    border-color: var(--smart-border);
}

    .smart-path .smart-drop-down[overlay-bottom],
    .smart-path .smart-drop-down[overlay-bottom].smart-visibility-hidden,
    .smart-color-picker .smart-drop-down[overlay-bottom],
    .smart-color-picker .smart-drop-down[overlay-bottom].smart-visibility-hidden,
    .smart-multi-split-button .smart-drop-down[overlay-bottom],
    .smart-multi-split-button .smart-drop-down[overlay-bottom].smart-visibility-hidden,
    .smart-drop-down-list .smart-drop-down[overlay-bottom],
    .smart-drop-down-list .smart-drop-down[overlay-bottom].smart-visibility-hidden,
    .smart-combo-box .smart-drop-down[overlay-bottom],
    .smart-combo-box .smart-drop-down[overlay-bottom].smart-visibility-hidden,
    .smart-text-box .smart-drop-down[overlay-bottom],
    .smart-text-box .smart-drop-down[overlay-bottom].smart-visibility-hidden,
    .smart-drop-down-button .smart-drop-down[overlay-bottom],
    .smart-drop-down-button .smart-drop-down[overlay-bottom].smart-visibility-hidden,
    .smart-date-time-picker .smart-drop-down[overlay-bottom],
    .smart-date-time-picker .smart-drop-down[overlay-bottom].smart-visibility-hidden {
        top: 0;
    }

    .smart-path .smart-drop-down[overlay-center],
    .smart-path .smart-drop-down[overlay-center].smart-visibility-hidden,
    .smart-color-picker .smart-drop-down[overlay-center],
    .smart-color-picker .smart-drop-down[overlay-center].smart-visibility-hidden,
    .smart-multi-split-button .smart-drop-down[overlay-center],
    .smart-multi-split-button .smart-drop-down[overlay-center].smart-visibility-hidden,
    .smart-drop-down-list .smart-drop-down[overlay-center],
    .smart-drop-down-list .smart-drop-down[overlay-center].smart-visibility-hidden,
    .smart-combo-box .smart-drop-down[overlay-center],
    .smart-combo-box .smart-drop-down[overlay-center].smart-visibility-hidden,
    .smart-text-box .smart-drop-down[overlay-center],
    .smart-text-box .smart-drop-down[overlay-center].smart-visibility-hidden,
    .smart-drop-down-button .smart-drop-down[overlay-center],
    .smart-drop-down-button .smart-drop-down[overlay-center].smart-visibility-hidden,
    .smart-date-time-picker .smart-drop-down[overlay-center],
    .smart-date-time-picker .smart-drop-down[overlay-center].smart-visibility-hidden {
        top: 50%;
        transform: translateY(-50%);
    }

    .smart-path .smart-drop-down[overlay-top],
    .smart-path .smart-drop-down[overlay-top].smart-visibility-hidden,
    .smart-color-picker .smart-drop-down[overlay-top],
    .smart-color-picker .smart-drop-down[overlay-top].smart-visibility-hidden,
    .smart-multi-split-button .smart-drop-down[overlay-top],
    .smart-multi-split-button .smart-drop-down[overlay-top].smart-visibility-hidden,
    .smart-drop-down-list .smart-drop-down[overlay-top],
    .smart-drop-down-list .smart-drop-down[overlay-top].smart-visibility-hidden,
    .smart-combo-box .smart-drop-down[overlay-top],
    .smart-combo-box .smart-drop-down[overlay-top].smart-visibility-hidden,
    .smart-text-box .smart-drop-down[overlay-top],
    .smart-text-box .smart-drop-down[overlay-top].smart-visibility-hidden,
    .smart-drop-down-button .smart-drop-down[overlay-top],
    .smart-drop-down-button .smart-drop-down[overlay-top].smart-visibility-hidden,
    .smart-date-time-picker .smart-drop-down[overlay-top],
    .smart-date-time-picker .smart-drop-down[overlay-top].smart-visibility-hidden {
        top: initial;
        bottom: 0;
    }

.smart-path .smart-drop-down[center-top],
.smart-path .smart-drop-down[center-top].smart-visibility-hidden,
.smart-path .smart-drop-down[center-bottom],
.smart-path .smart-drop-down[center-bottom].smart-visibility-hidden,
.smart-color-picker .smart-drop-down[center-top],
.smart-color-picker .smart-drop-down[center-top].smart-visibility-hidden,
.smart-color-picker .smart-drop-down[center-bottom],
.smart-color-picker .smart-drop-down[center-bottom].smart-visibility-hidden,
.smart-multi-split-button .smart-drop-down[center-top],
.smart-multi-split-button .smart-drop-down[center-top].smart-visibility-hidden,
.smart-multi-split-button .smart-drop-down[center-bottom],
.smart-multi-split-button .smart-drop-down[center-bottom].smart-visibility-hidden,
.smart-drop-down-list .smart-drop-down[center-top],
.smart-drop-down-list .smart-drop-down[center-top].smart-visibility-hidden,
.smart-drop-down-list .smart-drop-down[center-bottom],
.smart-drop-down-list .smart-drop-down[center-bottom].smart-visibility-hidden,
.smart-combo-box .smart-drop-down[center-top],
.smart-combo-box .smart-drop-down[center-top].smart-visibility-hidden,
.smart-combo-box .smart-drop-down[center-bottom],
.smart-combo-box .smart-drop-down[center-bottom].smart-visibility-hidden,
.smart-text-box .smart-drop-down[center-top],
.smart-text-box .smart-drop-down[center-top].smart-visibility-hidden,
.smart-text-box .smart-drop-down[center-bottom],
.smart-text-box .smart-drop-down[center-bottom].smart-visibility-hidden,
.smart-drop-down-button .smart-drop-down[center-top],
.smart-drop-down-button .smart-drop-down[center-top].smart-visibility-hidden,
.smart-drop-down-button .smart-drop-down[center-bottom],
.smart-drop-down-button .smart-drop-down[center-bottom].smart-visibility-hidden,
.smart-date-time-picker .smart-drop-down[center-top],
.smart-date-time-picker .smart-drop-down[center-top].smart-visibility-hidden,
.smart-date-time-picker .smart-drop-down[center-bottom],
.smart-date-time-picker .smart-drop-down[center-bottom].smart-visibility-hidden {
    left: 50%;
}

.smart-path .smart-drop-down[top],
.smart-path .smart-drop-down[top].smart-visibility-hidden,
.smart-color-picker .smart-drop-down[top],
.smart-color-picker .smart-drop-down[top].smart-visibility-hidden,
.smart-multi-split-button .smart-drop-down[top],
.smart-multi-split-button .smart-drop-down[top].smart-visibility-hidden,
.smart-drop-down-list .smart-drop-down[top],
.smart-drop-down-list .smart-drop-down[top].smart-visibility-hidden,
.smart-combo-box .smart-drop-down[top],
.smart-combo-box .smart-drop-down[top].smart-visibility-hidden,
.smart-text-box .smart-drop-down[top],
.smart-text-box .smart-drop-down[top].smart-visibility-hidden,
.smart-drop-down-button .smart-drop-down[top],
.smart-drop-down-button .smart-drop-down[top].smart-visibility-hidden,
.smart-drop-down[top].smart-drop-down-container.smart-drop-down-repositioned,
.smart-drop-down[top].smart-drop-down-container.smart-drop-down-repositioned.smart-visibility-hidden,
.smart-date-time-picker .smart-drop-down[top],
.smart-date-time-picker .smart-drop-down[top].smart-visibility-hidden {
    top: initial;
    bottom: calc(100% - var(--smart-border-width));
    flex-direction: column-reverse;
}

.smart-drop-down-container[top].smart-drop-down-container.smart-drop-down-repositioned,
.smart-drop-down-container[top].smart-drop-down-container.smart-drop-down-repositioned.smart-visibility-hidden {
    bottom: initial;
}

.smart-drop-down-container.smart-drop-down-repositioned[overlay-bottom]:not([animation='none']),
.smart-drop-down-container.smart-drop-down-repositioned[overlay-center]:not([animation='none']),
.smart-drop-down-container.smart-drop-down-repositioned[overlay-top]:not([animation='none']),
.smart-path:not([animation='none']) .smart-drop-down[overlay-bottom],
.smart-path:not([animation='none']) .smart-drop-down[overlay-top],
.smart-color-picker:not([animation='none']) .smart-drop-down[overlay-bottom],
.smart-color-picker:not([animation='none']) .smart-drop-down[overlay-top],
.smart-multi-split-button:not([animation='none']) .smart-drop-down[overlay-bottom],
.smart-multi-split-button:not([animation='none']) .smart-drop-down[overlay-top],
.smart-drop-down-list:not([animation='none']) .smart-drop-down[overlay-bottom],
.smart-drop-down-list:not([animation='none']) .smart-drop-down[overlay-top],
.smart-combo-box:not([animation='none']) .smart-drop-down[overlay-bottom],
.smart-combo-box:not([animation='none']) .smart-drop-down[overlay-top],
.smart-text-box:not([animation='none']) .smart-drop-down[overlay-bottom],
.smart-text-box:not([animation='none']) .smart-drop-down[overlay-top],
.smart-drop-down-button:not([animation='none']) .smart-drop-down[overlay-bottom],
.smart-drop-down-button:not([animation='none']) .smart-drop-down[overlay-top],
.smart-date-time-picker:not([animation='none']) .smart-drop-down[overlay-bottom],
.smart-date-time-picker:not([animation='none']) .smart-drop-down[overlay-top] {
    animation: smart-drop-down-list-smart-animate-opening 0.2s ease-out;
    -webkit-transform-origin: center;
    transform-origin: center;
}

.smart-path:not([animation='none']) .smart-drop-down[overlay-center],
.smart-color-picker:not([animation='none']) .smart-drop-down[overlay-center],
.smart-multi-split-button:not([animation='none']) .smart-drop-down[overlay-center],
.smart-drop-down-list:not([animation='none']) .smart-drop-down[overlay-center],
.smart-combo-box:not([animation='none']) .smart-drop-down[overlay-center],
.smart-text-box:not([animation='none']) .smart-drop-down[overlay-center],
.smart-drop-down-button:not([animation='none']) .smart-drop-down[overlay-center] {
    animation: smart-drop-down-list-smart-animate-overlay-center-opening 0.2s ease-out;
    -webkit-transform-origin: top;
    transform-origin: top;
}

.smart-drop-down-container.smart-drop-down-repositioned[overlay-bottom]:not([animation='none']).smart-visibility-hidden,
.smart-drop-down-container.smart-drop-down-repositioned[overlay-center]:not([animation='none']).smart-visibility-hidden,
.smart-drop-down-container.smart-drop-down-repositioned[overlay-top]:not([animation='none']).smart-visibility-hidden,
.smart-path:not([animation='none']) .smart-drop-down.smart-visibility-hidden,
.smart-path:not([animation='none']) .smart-drop-down[overlay-bottom].smart-visibility-hidden,
.smart-path:not([animation='none']) .smart-drop-down[overlay-top].smart-visibility-hidden,
.smart-color-picker:not([animation='none']) .smart-drop-down.smart-visibility-hidden,
.smart-color-picker:not([animation='none']) .smart-drop-down[overlay-bottom].smart-visibility-hidden,
.smart-color-picker:not([animation='none']) .smart-drop-down[overlay-top].smart-visibility-hidden,
.smart-multi-split-button:not([animation='none']) .smart-drop-down.smart-visibility-hidden,
.smart-multi-split-button:not([animation='none']) .smart-drop-down[overlay-bottom].smart-visibility-hidden,
.smart-multi-split-button:not([animation='none']) .smart-drop-down[overlay-top].smart-visibility-hidden,
.smart-drop-down-list:not([animation='none']) .smart-drop-down.smart-visibility-hidden,
.smart-drop-down-list:not([animation='none']) .smart-drop-down[overlay-bottom].smart-visibility-hidden,
.smart-drop-down-list:not([animation='none']) .smart-drop-down[overlay-top].smart-visibility-hidden,
.smart-combo-box:not([animation='none']) .smart-drop-down.smart-visibility-hidden,
.smart-combo-box:not([animation='none']) .smart-drop-down[overlay-bottom].smart-visibility-hidden,
.smart-combo-box:not([animation='none']) .smart-drop-down[overlay-top].smart-visibility-hidden,
.smart-text-box:not([animation='none']) .smart-drop-down.smart-visibility-hidden,
.smart-text-box:not([animation='none']) .smart-drop-down[overlay-bottom].smart-visibility-hidden,
.smart-text-box:not([animation='none']) .smart-drop-down[overlay-top].smart-visibility-hidden,
.smart-drop-down-button:not([animation='none']) .smart-drop-down.smart-visibility-hidden,
.smart-drop-down-button:not([animation='none']) .smart-drop-down[overlay-bottom].smart-visibility-hidden,
.smart-drop-down-button:not([animation='none']) .smart-drop-down[overlay-top].smart-visibility-hidden,
.smart-date-time-picker:not([animation='none']) .smart-drop-down.smart-visibility-hidden,
.smart-date-time-picker:not([animation='none']) .smart-drop-down[overlay-bottom].smart-visibility-hidden,
.smart-date-time-picker:not([animation='none']) .smart-drop-down[overlay-top].smart-visibility-hidden {
    animation: smart-drop-down-list-smart-animate-closing 0.2s ease-in;
    -webkit-transform-origin: center;
    transform-origin: center;
}

.smart-path:not([animation='none']) .smart-drop-down[overlay-center].smart-visibility-hidden,
.smart-color-picker:not([animation='none']) .smart-drop-down[overlay-center].smart-visibility-hidden,
.smart-multi-split-button:not([animation='none']) .smart-drop-down[overlay-center].smart-visibility-hidden,
.smart-drop-down-list:not([animation='none']) .smart-drop-down[overlay-center].smart-visibility-hidden,
.smart-combo-box:not([animation='none']) .smart-drop-down[overlay-center].smart-visibility-hidden,
.smart-text-box:not([animation='none']) .smart-drop-down[overlay-center].smart-visibility-hidden,
.smart-drop-down-button:not([animation='none']) .smart-drop-down[overlay-center].smart-visibility-hidden,
.smart-date-time-picker:not([animation='none']) .smart-drop-down[overlay-center].smart-visibility-hidden {
    animation: smart-drop-down-list-smart-animate-overlay-center-closing 0.2s ease-in;
    -webkit-transform-origin: top;
    transform-origin: top;
}

.smart-drop-down-container.smart-drop-down-repositioned[bottom]:not([animation='none']),
.smart-drop-down-container.smart-drop-down-repositioned[center-bottom]:not([animation='none']),
.smart-path:not([animation='none']) .smart-drop-down,
.smart-path:not([animation='none']) .smart-drop-down[bottom],
.smart-path:not([animation='none']) .smart-drop-down[center-bottom],
.smart-color-picker:not([animation='none']) .smart-drop-down,
.smart-color-picker:not([animation='none']) .smart-drop-down[bottom],
.smart-color-picker:not([animation='none']) .smart-drop-down[center-bottom],
.smart-multi-split-button:not([animation='none']) .smart-drop-down,
.smart-multi-split-button:not([animation='none']) .smart-drop-down[bottom],
.smart-multi-split-button:not([animation='none']) .smart-drop-down[center-bottom],
.smart-drop-down-list:not([animation='none']) .smart-drop-down,
.smart-drop-down-list:not([animation='none']) .smart-drop-down[bottom],
.smart-drop-down-list:not([animation='none']) .smart-drop-down[center-bottom],
.smart-combo-box:not([animation='none']) .smart-drop-down,
.smart-combo-box:not([animation='none']) .smart-drop-down[bottom],
.smart-combo-box:not([animation='none']) .smart-drop-down[center-bottom],
.smart-text-box:not([animation='none']) .smart-drop-down,
.smart-text-box:not([animation='none']) .smart-drop-down[bottom],
.smart-text-box:not([animation='none']) .smart-drop-down[center-bottom],
.smart-drop-down-button:not([animation='none']) .smart-drop-down,
.smart-drop-down-button:not([animation='none']) .smart-drop-down[bottom],
.smart-drop-down-button:not([animation='none']) .smart-drop-down[center-bottom],
.smart-date-time-picker:not([animation='none']) .smart-drop-down,
.smart-date-time-picker:not([animation='none']) .smart-drop-down[bottom],
.smart-date-time-picker:not([animation='none']) .smart-drop-down[center-bottom] {
    animation: smart-drop-down-list-smart-animate-opening 0.2s ease-out;
    -webkit-transform-origin: top;
    transform-origin: top;
}

    .smart-drop-down-container.smart-drop-down-repositioned[bottom]:not([animation='none']).smart-visibility-hidden,
    .smart-drop-down-container.smart-drop-down-repositioned[center-bottom]:not([animation='none']).smart-visibility-hidden,
    .smart-path:not([animation='none']) .smart-drop-down.smart-visibility-hidden,
    .smart-path:not([animation='none']) .smart-drop-down[bottom].smart-visibility-hidden,
    .smart-path:not([animation='none']) .smart-drop-down[center-bottom].smart-visibility-hidden,
    .smart-color-picker:not([animation='none']) .smart-drop-down.smart-visibility-hidden,
    .smart-color-picker:not([animation='none']) .smart-drop-down[bottom].smart-visibility-hidden,
    .smart-color-picker:not([animation='none']) .smart-drop-down[center-bottom].smart-visibility-hidden,
    .smart-multi-split-button:not([animation='none']) .smart-drop-down.smart-visibility-hidden,
    .smart-multi-split-button:not([animation='none']) .smart-drop-down[bottom].smart-visibility-hidden,
    .smart-multi-split-button:not([animation='none']) .smart-drop-down[center-bottom].smart-visibility-hidden,
    .smart-drop-down-list:not([animation='none']) .smart-drop-down.smart-visibility-hidden,
    .smart-drop-down-list:not([animation='none']) .smart-drop-down[bottom].smart-visibility-hidden,
    .smart-drop-down-list:not([animation='none']) .smart-drop-down[center-bottom].smart-visibility-hidden,
    .smart-combo-box:not([animation='none']) .smart-drop-down.smart-visibility-hidden,
    .smart-combo-box:not([animation='none']) .smart-drop-down[bottom].smart-visibility-hidden,
    .smart-combo-box:not([animation='none']) .smart-drop-down[center-bottom].smart-visibility-hidden,
    .smart-text-box:not([animation='none']) .smart-drop-down.smart-visibility-hidden,
    .smart-text-box:not([animation='none']) .smart-drop-down[bottom].smart-visibility-hidden,
    .smart-text-box:not([animation='none']) .smart-drop-down[center-bottom].smart-visibility-hidden,
    .smart-drop-down-button:not([animation='none']) .smart-drop-down.smart-visibility-hidden,
    .smart-drop-down-button:not([animation='none']) .smart-drop-down[bottom].smart-visibility-hidden,
    .smart-drop-down-button:not([animation='none']) .smart-drop-down[center-bottom].smart-visibility-hidden,
    .smart-date-time-picker:not([animation='none']) .smart-drop-down.smart-visibility-hidden,
    .smart-date-time-picker:not([animation='none']) .smart-drop-down[bottom].smart-visibility-hidden,
    .smart-date-time-picker:not([animation='none']) .smart-drop-down[center-bottom].smart-visibility-hidden {
        animation: smart-drop-down-list-smart-animate-closing 0.2s ease-in;
        -webkit-transform-origin: top;
        transform-origin: top;
    }

    .smart-drop-down-container.smart-drop-down-repositioned[top]:not([animation='none']),
    .smart-drop-down-container.smart-drop-down-repositioned[center-top]:not([animation='none']),
    .smart-path:not([animation='none']) .smart-drop-down[top],
    .smart-path:not([animation='none']) .smart-drop-down[center-top],
    .smart-color-picker:not([animation='none']) .smart-drop-down[top],
    .smart-color-picker:not([animation='none']) .smart-drop-down[center-top],
    .smart-multi-split-button:not([animation='none']) .smart-drop-down[top],
    .smart-multi-split-button:not([animation='none']) .smart-drop-down[center-top],
    .smart-drop-down-list:not([animation='none']) .smart-drop-down[top],
    .smart-drop-down-list:not([animation='none']) .smart-drop-down[center-top],
    .smart-combo-box:not([animation='none']) .smart-drop-down[top],
    .smart-combo-box:not([animation='none']) .smart-drop-down[center-top],
    .smart-text-box:not([animation='none']) .smart-drop-down[top],
    .smart-text-box:not([animation='none']) .smart-drop-down[center-top],
    .smart-drop-down-button:not([animation='none']) .smart-drop-down[top],
    .smart-drop-down-button:not([animation='none']) .smart-drop-down[center-top],
    .smart-date-time-picker:not([animation='none']) .smart-drop-down[top],
    .smart-date-time-picker:not([animation='none']) .smart-drop-down[center-top] {
        animation: smart-drop-down-list-smart-animate-opening 0.2s ease-out;
        -webkit-transform-origin: bottom;
        transform-origin: bottom;
    }

        .smart-drop-down-container.smart-drop-down-repositioned[top]:not([animation='none']).smart-visibility-hidden,
        .smart-drop-down-container.smart-drop-down-repositioned[center-top]:not([animation='none']).smart-visibility-hidden,
        .smart-path:not([animation='none']) .smart-drop-down[top].smart-visibility-hidden,
        .smart-path:not([animation='none']) .smart-drop-down[center-top].smart-visibility-hidden,
        .smart-color-picker:not([animation='none']) .smart-drop-down[top].smart-visibility-hidden,
        .smart-color-picker:not([animation='none']) .smart-drop-down[center-top].smart-visibility-hidden,
        .smart-multi-split-button:not([animation='none']) .smart-drop-down[top].smart-visibility-hidden,
        .smart-multi-split-button:not([animation='none']) .smart-drop-down[center-top].smart-visibility-hidden,
        .smart-drop-down-list:not([animation='none']) .smart-drop-down[top].smart-visibility-hidden,
        .smart-drop-down-list:not([animation='none']) .smart-drop-down[center-top].smart-visibility-hidden,
        .smart-combo-box:not([animation='none']) .smart-drop-down[top].smart-visibility-hidden,
        .smart-combo-box:not([animation='none']) .smart-drop-down[center-top].smart-visibility-hidden,
        .smart-text-box:not([animation='none']) .smart-drop-down[top].smart-visibility-hidden,
        .smart-text-box:not([animation='none']) .smart-drop-down[center-top].smart-visibility-hidden,
        .smart-drop-down-button:not([animation='none']) .smart-drop-down[top].smart-visibility-hidden,
        .smart-drop-down-button:not([animation='none']) .smart-drop-down[center-top].smart-visibility-hidden,
        .smart-date-time-picker:not([animation='none']) .smart-drop-down[top].smart-visibility-hidden,
        .smart-date-time-picker:not([animation='none']) .smart-drop-down[center-top].smart-visibility-hidden {
            animation: smart-drop-down-list-smart-animate-closing 0.2s ease-in;
            -webkit-transform-origin: bottom;
            transform-origin: bottom;
        }

.smart-drop-down-overlay {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 9000;
}
