
// Dropdown menu custom styling
.dropdown-menu {
    padding-left: $dropdown-padding-x;
    padding-right: $dropdown-padding-x;
    box-shadow: $dropdown-box-shadow;
}

// Dropdown item custom border radius
.dropdown-item {
    border-radius: $dropdown-item-border-radius;
}

// Dropdown item ion-icon size
.dropdown-item ion-icon {
    font-size: 1.4rem;
    vertical-align: text-bottom;
    line-height: 1;
}

.dropdown-menu .dropdown-header {
    text-transform: uppercase;
    font-weight: bold;

    // Dropdown header ion-icon size
    a {
        color: $dropdown-header-color;
    }
    ion-icon {
        font-size: 1.2rem;
        vertical-align: text-bottom;
    }
}

// Dropdown caret styling override
.dropdown .dropdown-toggle::after {
    content: "";
    margin-left: 8px;
    width: 7px;
    height: 7px;
    display: inline-block;
    transform: rotate(45deg);
    vertical-align: baseline;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    border-top: 0;
    border-left: 0;
    margin-bottom: 3px;
}

// Dropdown documents alignment
.checked-out-items .dropdown-toggle::after {
    float: right;
    margin-top: 8px;
}

// Dropdown menu placement on smaller screens
@media (min-width: 440px) and (max-width: 539px) {
    .checked-out-items .dropdown .dropdown-menu {
        margin-left: 8rem;
    }
}

@media (min-width: 540px) and (max-width: 654px) {
    .checked-out-items .dropdown .dropdown-menu {
        margin-left: 15rem;
    }
}

@media (min-width: 655px) and (max-width: 767px) {
    .checked-out-items .dropdown .dropdown-menu {
        margin-left: 20rem;
    }
}