Connected.Components/Styles/components/_picker.scss

.picker {
    &.rounded {
        border-radius: var(--default-borderradius);
    }

    & .picker-actions {
        flex: 0 0 auto;
        display: flex;
        padding: 8px;
        align-items: center;
        justify-content: flex-end;

        & > :not(:first-child) {
            margin-left: 8px;
            margin-inline-start: 8px;
            margin-inline-end: unset;
        }
    }
}

.picker-inline {
    display: flex;
    flex: 1 1 auto;
    position: relative;
    max-width: 100%;

    &.picker-input-button {
        & .input, .input .input-root {
            cursor: pointer
        }

        &.disabled {
            & .input, .input .input-root {
                cursor: default;
            }
        }
    }

    &.picker-input-text {
        cursor: text;

        &:hover {
            cursor: text;
        }

        &.disabled {
            cursor: default;

            &:hover {
                cursor: default;
            }
        }
    }
}

.picker-static {
    display: flex;
    overflow: hidden;
    min-width: 310px;
    flex-direction: column;
}

.picker-container {
    display: flex;
    flex-direction: column;
    border-radius: inherit;

    &.picker-container-landscape {
        flex-direction: row;
    }

    & .toolbar {
        border-top-left-radius: inherit;
        border-top-right-radius: inherit;
    }
}

.picker-popover-paper {
    outline: 0;
    z-index: calc(var(--zindex-popover) + 1);
    position: absolute;
    min-width: 16px;
    min-height: 16px;
    overflow-x: hidden;
    overflow-y: auto;
}

.picker-view {
    display: none;
    margin-top: 20px;

    &.picker-open {
        display: block;
        animation: animation-fadein 251ms;
    }
}

.picker-content {
    display: flex;
    //max-width: 325px;
    max-width: 100%;
    min-width: 310px;
    min-height: 305px;
    overflow: hidden;
    flex-direction: column;
    justify-content: center;

    &.picker-content-landscape {
        padding: 0 8px;
    }
}

.picker-toolbar {
    height: 100px;
    display: flex;
    align-items: center;
    flex-direction: row;
    justify-content: center;

    &.picker-toolbar-landscape {
        height: auto;
        padding: 8px;
        max-width: 150px;
        justify-content: flex-start;
    }


    &.button-root {
        padding: 0;
        min-width: 16px;
        text-transform: none;
    }
}

.picker-inline-paper {
    .paper {
        position: relative !important;
    }
}

.picker-hidden {
    visibility: hidden;
}

.picker-pos-top {
    top: 0px;
    position: fixed;
    visibility: visible;

    &.picker-pos-left {
        left: 10px;
    }

    &.picker-pos-right {
        right: 10px;
    }
}

.picker-pos-above {
    bottom: 0px;
    visibility: visible;

    &.picker-pos-left {
        left: 50%;
        transform: translateX(-50%);
    }

    &.picker-pos-right {
        right: 0px;
    }
}

.picker-pos-bottom {
    bottom: 10px;
    position: fixed;
    visibility: visible;

    &.picker-pos-left {
        left: 10px;
    }

    &.picker-pos-right {
        right: 10px;
    }
}

.picker-pos-below {
    visibility: visible;

    &.picker-pos-left {
        left: 50%;
        transform: translateX(-50%);
    }

    &.picker-pos-right {
        right: 0px;
    }
}