/*
 * Universal class for listings.
 */
div.buic-listing {
    table.listing {
        /*
         * Striping.
         */
        tbody {
            $background-normal:          $basebgcolour;
            $background-normal-stripe:   mix($background-normal, #7389a1, 92%);
            $background-selected:        mix($background-normal, #555, 85%);
            $background-selected-stripe: mix($background-normal-stripe, #555, 85%);

            // No striping.
            tr {
                background: $background-normal;

                &.row-selected {
                    background: $background-selected;
                }
            }

            // Striping on odd rows.
            &.striping_odd tr:nth-of-type(odd) {
                background: $background-normal-stripe;

                &.row-selected {
                    background: $background-selected-stripe;
                }
            }

            // Striping on even rows.
            &.striping_even tr:nth-of-type(even) {
                background: $background-normal-stripe;

                &.row-selected {
                    background: $background-selected-stripe;
                }
            }
        }

        /*
         * Display a table heading.
         */
        tr.heading {
            th {
                padding: 1em 0.2em 0.1em 0.2em;
                background: $basebgcolour !important;

                font-family: 'Source Sans Pro', 'Helvetica Neue', Helvetica, Arial, sans-serif;
                font-size: $font-size-h3;
                font-weight: normal;
            }
        }

        // No margin on first heading.
        tbody:first-child tr.heading th {
            padding-top: 0;
            border-top: none;
        }

        /*
         * Header row, containing column titles that can trigger sorting.
         */
        tr.header {
            th {
                $text-color:            #005394;
                $symbol-order-none:     "\f0dc";
                $symbol-order-asc:      "\f0dd";
                $symbol-order-desc:     "\f0de";
                $symbol-color:          #ddd;
                $symbol-color-selected: #888;
                $symbol-color-hover:    #00c;
                $symbol-spacing:        0.4em;

                color: $text-color;
                vertical-align: middle;

                a.order-none, a.order-asc, a.order-desc {
                    &:after {
                        display: inline-block;
                        margin-left: $symbol-spacing;
                        color: $symbol-color;
                        font-family: FontAwesome;
                        content: $symbol-order-none;
                    }

                    &:hover:after {
                        color: $symbol-color-hover;
                        content: $symbol-order-asc;
                    }
                }

                a.order-asc {
                    &:after {
                        color: $symbol-color-selected;
                        content: $symbol-order-asc;
                    }

                    &:hover:after {
                        content: $symbol-order-desc;
                    }
                }

                a.order-desc {
                    &:after {
                        color: $symbol-color-selected;
                        content: $symbol-order-desc;
                    }

                    &:hover:after {
                        content: $symbol-order-none;
                    }
                }

                // Menudropdown cell.
                &.menu {
                    padding: 0;
                    text-align: center;

                    button {
                        padding: 0 4px;
                    }
                }
            }
        }

        /*
         * Toolbar, displayed at the bottom of a listing when a row is selected.
         */
        tr.selectiontoolbar {
            td {
                background: #fff;
                border: none;
            }

            div.count {
                display: inline-block;
                padding: 0 0.2em;
                min-width: 1.9em;
                background: #f8f8f8;
                border: 1px solid lighten(#7b9db8, 30%);
                border-radius: 3px;
                vertical-align: middle;
                text-align: center;
                line-height: 1.5;
                color: #7b9db8;
            }

            button {
                @extend .btn;
                @extend .btn-default;
                @extend .btn-xs;

                &.danger {
                    @extend .btn-silent-danger;
                }

                &.separator {
                    margin-right: 0.6em;
                }
            }
        }

        /*
         * Data rows.
         */
        tr[id] {
            // Correct checkbox alignment.
            input[type=checkbox][name="checkRow"] {
                margin: 2px 0 0 1px;
            }
        }

        /*
         * Misc.
         */
        th, td {
            &.fill-max {
                width: 100%;
            }
        }
    }

    /*
     * Internal Usage, don't use!
     */
    table.listing {
        /*
         * Omnisearch.
         */
        tbody.omnisearch span {
            font-weight: normal;
            font-family: $fonts-family-monospace;
        }
    }
}
