@include treelist-ui(
    $ui: 'nav',

    // Extra padding left/right
    $padding: 0 10px,

    // Black-ish background color
    $background-color: #32404e,
    $toolstrip-background-color: #32404e,

    $tool-selected-color: #f0f0f0,
    $tool-selected-background-color: #5fa2dd,

    $tool-float-indicator-width: 4px,
    $tool-float-indicator-color: #5fa2dd,

    // Darker background for expanded subtrees
    $item-expanded-background-color: #2c3845,

    // Taller line height
    $item-line-height : 36px,

    // Off-white text
    $item-icon-color: #ADB3B8,
    $item-expander-color: #ADB3B8,
    $item-text-color: #ADB3B8,

    // Brighter when hovered
    $row-over-background-color: #4f606f,
    $item-icon-over-color: #fff,
    $item-expander-over-color: #fff,
    $item-text-over-color: #fff,

    $row-indicator-width: 6px,
    $row-indicator-selected-color: #5fa2dd,
    $row-indicator-selected-over-color: lighten(#5fa2dd, 10%),
    $row-indicator-over-color: lighten(#5fa2dd, 10%),

    // Various sizes for the pieces:
    $item-icon-font-size: 18px,
    $item-icon-width: 24px,
    $item-expander-font-size: 16px,
    $item-expander-width: 24px,

    $row-selected-background-color: #3f505f
);

.treelist-with-nav .#{$prefix}panel-body {
    background-color: #32404e;
}

