
.dropdown-group {
  position: relative;

    .form-inline & {
        margin-top: -$spacing-xs;
    }

    ~ .no-label.submit {
            margin-top: 0;
        .no-label.submit {
            margin-top: 1.5rem; // 24px
            width: auto;
        }
    }

    &.form-group {
        margin: 0 $spacing-xs 0 0;
        border-bottom: none;
        .form-control {
            max-width: none;
            width: 12.5rem !important; // 200px;
        }
    }
    .with-dropdown {
        position: absolute;
        top: 0;
        left: 0;
        padding: 0 $input-padding-x;
        width: 100%;
        z-index: 2;
        float: left;
        height: $input-height;
        input {
            @include border-end-radius(0); // border-right-radius(0);
            margin-top: 1.6875rem; // 27px
        }
        label {
            margin-left: -$input-padding-x;
            width: auto;
            min-width: 0;
            white-space: nowrap;
        }
    }

    .picker {
        height: $input-height;
        overflow: hidden;
        width: 14.375rem; // 230px;

        .form-condensed.pieform & {
            max-width: 100%;
        }
    }

    .dropdown-connect {
        height: $input-height;
        position: relative;
        margin-top: 1.6875rem; // 27px
        float: left;
        z-index: 1;
        background: rgba($white, 0.8);
        border-radius: $input-border-radius;
        &:before {
            @include fonttype(solid);
            content: fa-content($fa-var-caret-down);
            margin-top: 0.5625rem; // 9px
            position: absolute;
            right: 0%;
            top: 0;
            height: 1.0625rem; // 17px;
            padding-left: $spacing-base;
            padding-right: .75rem;
            line-height: 1;
            z-index: 2;
        }
        select {
           @include appearance(none);
            background: transparent;
            height: $input-height;
            left: 0;
            margin: 0;
            outline: none;
            padding-right: $spacing-xxxl;
            cursor: pointer;
            position: absolute;
            top: 0;
            width: 15rem; // 240px;
            z-index: 5;
            &:focus {
              outline: medium solid $input-focus-border-color;
            }
        }
        label {
            @include visually-hidden;
        }
    }
    ~ .btn {
        margin-top: 1rem;
    }

}

// User search dropdown-group
.admin-user-search {
    .usersearchform {
        @include media-breakpoint-between(sm, lg) {
            width: 65%;
        }
    }
    .dropdown-group {
        .picker {
            @include media-breakpoint-up(md) {
                width: 18.75rem; // 300px;
            }
        }
        .dropdown-group .with-dropdown {
            @include media-breakpoint-up(md) {
                width: 16.875rem !important; // 270px;
            }
        }
    }
    .collapsible-group {
        max-width: 100%;
    }
}
