.assign-order {
    position: relative;

}

.assign-order::after {
    content: 'ALLREADY ASSIGN';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgb(0 0 0 / 14%);
    z-index: 99;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: auto;
}

.avatar-upload {
    position: relative;
    max-width: 205px;
    margin: 50px auto;
}

.avatar-upload .avatar-edit {
    position: absolute;
    right: 12px;
    z-index: 1;
    top: 10px;
}

.avatar-upload .avatar-edit input {
    display: none;
}

.avatar-upload .avatar-edit input+label {
    display: inline-block;
    width: 34px;
    height: 34px;
    margin-bottom: 0;
    border-radius: 100%;
    background: #FFFFFF;
    border: 1px solid transparent;
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.12);
    cursor: pointer;
    font-weight: normal;
    transition: all 0.2s ease-in-out;
}

.avatar-upload .avatar-edit input+label:hover {
    background: #f1f1f1;
    border-color: #d6d6d6;
}

.avatar-upload .avatar-edit input+label:after {
    content: "\f040";
    font-family: 'FontAwesome';
    color: #757575;
    position: absolute;
    top: 5px;
    left: 0;
    right: 0;
    text-align: center;
    margin: auto;
}

.avatar-upload .avatar-preview {
    width: 192px;
    height: 192px;
    position: relative;
    border-radius: 100%;
    border: 6px solid #F8F8F8;
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);
}

.avatar-upload .avatar-preview>div {
    width: 100%;
    height: 100%;
    border-radius: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.avatar-group {
    display: inline-flex;
}

.avatar-group .avatar {
    position: relative;
    display: inline-block;
    width: 30px;
    height: 30px;
    font-size: 1rem;
    margin-left: -0.8rem;
    transition: transform 0.2s;
}

.avatar-group .avatar img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    border: 2px solid #ffffff;
}

.avatar-group .avatar:hover {
    -webkit-mask-image: none;
    mask-image: none;
    z-index: 1;
    transform: scale(1.1);
}


/* Switch starts here */

.mid {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 1em;
}

/* Switch starts here */
.mid .rocker {
    display: inline-block;
    position: relative;
    /*
    SIZE OF SWITCH
    ==============
    All sizes are in em - therefore
    changing the font-size here
    will change the size of the switch.
    See .rocker-small below as example.
    */
    font-size: 2em;
    font-weight: bold;
    text-align: center;
    text-transform: uppercase;
    color: #888;
    width: 7em;
    height: 4em;
    overflow: hidden;

}

.mid .rocker-small {
    font-size: 0.75em;
    /* Sizes the switch */
    margin: 1em;
}


.mid .rocker input {
    opacity: 0;
    width: 0;
    height: 0;
}

.mid .switch-left,
.switch-right {
    cursor: pointer;
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 2.5em;
    width: 3em;
    transition: 0.2s;
}

.mid .switch-left {
    height: 2.4em;
    width: 2.75em;
    left: 0.85em;
    bottom: 0.4em;
    background-color: #ddd;
    transform: rotate(15deg) skewX(15deg);
}

.mid .switch-right {
    right: 0.5em;
    bottom: 0;
    background-color: #bd5757;
    color: #fff;
}

.mid .switch-left::before,
.switch-right::before {
    content: "";
    position: absolute;
    width: 0.4em;
    height: 2.45em;
    bottom: -0.45em;
    background-color: #ccc;
    transform: skewY(-65deg);
}

.mid .switch-left::before {
    left: -0.4em;
}

.mid .switch-right::before {
    right: -0.375em;
    background-color: transparent;
    transform: skewY(65deg);
}

.mid input:checked+.switch-left {
    background-color: #045fd0;
    color: #fff;
    bottom: 0px;
    left: 0.5em;
    height: 2.5em;
    width: 3em;
    transform: rotate(0deg) skewX(0deg);
}

.mid input:checked+.switch-left::before {
    background-color: transparent;
    width: 3.0833em;
}

.mid input:checked+.switch-left+.switch-right {
    background-color: #ddd;
    color: #888;
    bottom: 0.4em;
    right: 0.8em;
    height: 2.4em;
    width: 2.75em;
    transform: rotate(-15deg) skewX(-15deg);
}

input:checked+.switch-left+.switch-right::before {
    background-color: #ccc;
}

/* Keyboard Users */
.mid input:focus+.switch-left {
    color: #333;
}

.mid input:checked:focus+.switch-left {
    color: #fff;
}

.mid input:focus+.switch-left+.switch-right {
    color: #fff;
}

.mid input:checked:focus+.switch-left+.switch-right {
    color: #333;
}


/*all chart design*/
.admin-single-earning-chart {
    min-height: 250px;
    height: 250px;
    max-height: 250px;
    max-width: 100%;
}


.salesChart {
    height: 250px;
}

.deliveryChart {
    min-height: 250px;
    height: 250px;
    max-height: 250px;
    max-width: 100%;
}

.complainChart {
    min-height: 250px;
    height: 250px;
    max-height: 250px;
    max-width: 100%;
}

[class*='sidebar-dark-'] .nav-treeview>.nav-item>.nav-link.active,
[class*='sidebar-dark-'] .nav-treeview>.nav-item>.nav-link.active:hover,
[class*='sidebar-dark-'] .nav-treeview>.nav-item>.nav-link.active:focus {
    background-color: #6c757d;
    color: #ffffff;
    border-radius: 3px;
}

.page-item:last-child .page-link {
    border-top-right-radius: 30px;
    border-bottom-right-radius: 30px;
}

.page-item:first-child .page-link {
    border-top-left-radius: 30px;
    border-bottom-left-radius: 30px;
}

.center-img {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 70%;
}

.aside-logo {
    height: 48px;
}