.category-config {
    border-bottom: 1px solid $gray-light;
    &:first-child {
        border-top: 1px solid $gray-light;
    }
    .resume {
        align-items: space-between;
        cursor: pointer;
        display: flex;
        padding: 1rem;
        position: relative;
        &.open-drawer {
            .icon {
                transform: rotate(90deg);
            }
        }
    }
    .icon {
        transform: rotate(0);
        transition: all .4s;
    }
    .resume-title {
        width: 280px;
    }
    .count {
        color: $gray-light;
        float: left;
        padding-right: 5px;
    }
    .summary-role {
        flex: 1;
        width: 280px;
        .role-summary-single {
            background: $gray-light;
            display: inline-block;
            height: 20px;
            margin-right: .1rem;
            width: 15px;
            &.active {
                background: $primary;
            }
            &.inactive {
                background: $gray;
            }
        }
    }
    .category-items {
        @include slide(400px, hidden);
        background-color: $whitish;
        width: 100%;
        .items-container {
            padding: 1rem;
        }
    }
    .category-item {
        align-items: center;
        border-bottom: 1px solid $whitish;
        display: flex;
        justify-content: space-between;
        padding: .5rem .5rem .5rem 2rem;
        &:last-child {
            border-bottom: 0;
        }
    }
    .check {
        input { // IE needs smaller size
            height: 40px;
            width: 85px;
        }
    }
}
