$item_height: 36px


.root
    display: inline-block

    & > .item .nested_list
        .item__empty, .item_title_wrapper
            height: 0
            transition: height $transition


.item__empty, .item_title_wrapper
    overflow: hidden

.item, .item__empty, .item_title
    +font(22px, $item_height)

.item_title_wrapper
    +flex('', center)

    & > i
        font-size: 30px
        transition: transform $transition

.item_title
    padding-right: $gutter


.nested_list .nested_list
    padding-left: $gutter_sm
    

.item.item__expanded
    & > .item_title_wrapper > i
        transform: rotate(90deg)

    & > .nested_list
        & > .item > .item_title_wrapper, & > .item__empty
            height: $item_height
            transition: height $transition