.daptiv-dropdown {
    background: $dropdown-bg;
    display: inline-block;
    font: $dropdown-font;
    line-height: $dropdown-item-height;

    .item {
        background: $color-base-0;
        border: 0;
        color: $color-text-dark;
        display: block;
        height: $dropdown-item-height;
        margin: $dropdown-item-border-size;
        max-width: $dropdown-item-max-width;
        min-width: $dropdown-item-min-width;
        overflow: hidden;
        padding: 0 $dropdown-item-padding;
        text-decoration: none;
        text-overflow: ellipsis;
        white-space: nowrap;

        &:focus {
            outline: dotted 2px $dropdown-item-border-color-focus;
        }

        &:not(.selected):hover {
            background: $color-secondary-light;
            color: $color-text-dark;
        }

        &.selected {
            color: $color-primary-medium;
        }

        &.disabled {
            background: $color-base-0;
            color: $color-base-60;
            cursor: default;

            &:hover {
                background: $color-base-0;
                color: $color-base-60;
            }
        }

        &.alternate {
            background: $color-base-30;

            &.selected {
                background: $color-base-30;
            }

            &.disabled:hover {
                background: $color-base-30;
            }
        }
    }

    .label {
        background: $color-base-30;
        border: 0;
        color: $color-text-dark;
        cursor: default;
        display: block;
        height: $dropdown-item-height;
        margin: $dropdown-item-border-size;
        max-width: $dropdown-item-max-width;
        min-width: $dropdown-item-min-width;
        outline: none;
        overflow: hidden;
        padding: 0 $dropdown-item-padding;
        text-decoration: none;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}
