.o_kanban_examples_dialog {
    @include o-flex-display;
    padding: 0px;
    background: $o-color-silver;

    // sidebar
    .o_kanban_examples_dialog_nav {
        @include o-flex(0, 0, auto);
        border-right: 1px solid $gray-lighter-dark;
        background: white;

        > ul > li {
            margin: 0;
            border-bottom: 1px solid $gray-lighter-dark;

            > a {
                padding: 12px 15px;
                color: $o-main-text-color;
                border-left: 3px solid transparent;
                &:focus {
                    outline: none;
                }
            }
            &.active > a {
                color: $headings-color;
                border-left-color: $o-brand-optional;
                font-weight: bold;
            }
        }
    }

    // content
    .o_kanban_examples_dialog_content {
        @include o-flex(1, 1, 100%);

        .o_kanban_examples_description {
            padding: 16px 16px 0;
            text-align: justify;
        }
        .o_kanban_examples {
            @include o-flex-display;
            padding: 0 6px;

            .o_kanban_examples_group {
                @include o-flex(1, 1, 100%);
                margin: 10px;

                .o_kanban_examples_ghost {
                    padding: 5px;
                    margin-top: -1px;
                    border: thin solid $gray-lighter-dark;
                    background-color: white;
                    .o_ghost_content {
                        height: 12px;
                        background: $gray-lighter-dark;
                        &.o_ghost_tag {
                            display: inline-block;
                            width: 40%;
                            margin-top: 10px;
                        }
                    }
                    .o_ghost_avatar {
                        height: 20px;
                        width: 20px;
                        margin-top: 6px;
                    }
                }
            }
        }
    }
}
