/* To Do Area  */

.todo-client-sel {
    position: relative;
    display: flex;
    margin-bottom: 16px;
}

.todo-client-sel-wrap label {
    width: 100%;
    color: rgba(0, 0, 0, 0.5);
    font-family: GothamHTF-Light, Sans-serif;
    margin-bottom: 5px;
}

.todo-client-sel .cl-todo-input input {
    min-width: 65px;
    height: 38px;
    padding: 10px !important;
    background-color: #fff !important;
    border: 0.5px solid #808080 !important;
    border-radius: 0;
    border-top-right-radius : 4px;
    border-bottom-right-radius: 4px;
    margin-bottom: 0;
    font-size: 14px;
    line-height: 18px;
    color: #000;
    background-image: none !important;
}

.todo-client-sel .selected-item {
    display: flex;
    justify-content: flex-start;
    background-color: #F1F1F1;
    height: 38px;
    border: 0.5px solid #808080 !important;
    border-right: none !important;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    overflow: hidden;
    text-overflow: ellipsis;
    align-items: center;
    white-space: nowrap;
    color: #000;
    padding: 12px 39px;
    cursor: pointer;
    position: relative;
    font-size: 14px;
    font-family: GothamHTF-Medium, Sans-serif;
    width: 153px;
}

.cl-todo-input {
    width: calc(100% - 153px);
}

.todo-client-sel .selected-item::before {
    content: '';
    display: block;
    width: 14px;
    height: 14px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='14' viewBox='0 0 15 14' fill='none'%3E%3Cpath d='M13.567 14L8.52445 8.95741C8.13556 9.2858 7.68419 9.5429 7.17034 9.72872C6.6565 9.91451 6.10972 10.0074 5.53 10.0074C4.12429 10.0074 2.93458 9.52022 1.9609 8.54583C0.98721 7.57146 0.500366 6.39075 0.500366 5.00372C0.500366 3.61668 0.98756 2.43597 1.96195 1.46158C2.93632 0.487194 4.11919 0 5.51056 0C6.90191 0 8.08262 0.487194 9.05267 1.46158C10.0227 2.43597 10.5078 3.61733 10.5078 5.00566C10.5078 5.56609 10.417 6.1034 10.2356 6.61761C10.0541 7.13179 9.79049 7.60494 9.44481 8.03705L14.5004 13.0667L13.567 14ZM5.51703 8.71113C6.54327 8.71113 7.41557 8.34924 8.13392 7.62547C8.85229 6.90171 9.21148 6.02779 9.21148 5.00372C9.21148 3.97963 8.85229 3.10571 8.13392 2.38194C7.41557 1.65818 6.54327 1.2963 5.51703 1.2963C4.4836 1.2963 3.60518 1.65818 2.88177 2.38194C2.15835 3.10571 1.79665 3.97963 1.79665 5.00372C1.79665 6.02779 2.15835 6.90171 2.88177 7.62547C3.60518 8.34924 4.4836 8.71113 5.51703 8.71113Z' fill='%23808080'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
    left: 16px;
}


.todo-client-sel .selected-item::after {
    content: '';
    display: block;
    width: 14px;
    height: 9px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='10' viewBox='0 0 15 10' fill='none'%3E%3Cpath d='M7.50037 9.5L0.500366 2.32175L2.27688 0.5L7.50037 5.88369L12.7239 0.52719L14.5004 2.34894L7.50037 9.5Z' fill='%23808080'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
    right: 8px;
}

.todo-client-sel .custom-sel-dropdown {
    position: absolute;
    background-color: #F1F1F1;
    top: 43px;
    left: 0px;
    right: 0;
    z-index: 99;
    width: 100%;
    border-radius: 6px;
    display: none;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
    overflow: hidden;
}

.todo-client-sel .custom-sel-dropdown .select-option {
    color: #000;
    padding: 11px 19px;
    border-bottom: 0.5px solid rgba(128, 128, 128, 0.13);
    border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent;
    cursor: pointer;
    transition: all 0.3s;
    font-size: 12px;
    line-height: 14px;
    font-family: GothamHTF-Medium, Sans-serif;
}

.todo-client-sel .custom-sel-dropdown .select-option:hover {
    background-color: rgba(0, 0, 0, 0.1);
    transition: all 0.3s;
}

.todo-client-sel .custom-sel-dropdown .select-option:last-child {
    border: 0
}

.todo-client-sel.active .custom-sel-dropdown {
    display: block;
}
.form-item-todo-category .select{
    margin-bottom: 16px;
    height: 36px;
}
.form-item-todo-category #edit-todo-category{
    background-color: #F1F1F1;
}
.form-item-todo-category .select-styled:after{
    top: 12px;
}