@import "filter.less";
@import "spinbox.less";
@import "libs/lightbox.less";
@import "inline-edit.less";
@import "libs/magnific-popup.less";

.font-normal() {

    font: 11px Verdana;
}

@grid-border-color: #9da0aa;
@cell-border-color: #d9dae0;

@alternate-row-bg-color: @tableBackgroundAccent;
@highlighted-row-bg-color: #f0eafd;

.btn-toolbar {
    margin: 0;
}

input.quick-filter-text {
  &::-webkit-input-placeholder {
    color: #999;
  }
  &:-moz-placeholder {
    color: #999;
  }
}

input.typeahead-button {
    background-image: url(../../images/spinners.png);
    background-position: right center;
    background-repeat: no-repeat;

    &:focus {
        background-image: none;
    }
}

table.pgui-grid {

    .grid_error_row {
        padding: 4px;
        .alert {
            margin: 0;
        }
    }

    max-width: inherit;
    margin-bottom: @baseLineHeight;


    color: @textColor;
    border-collapse: collapse;
    border: 1px solid @grid-border-color;

    &.legacy {
        min-width: 800px;
    }

    &.wide {
        width: 100%;
    }

    &.stripped {
        > tbody > tr.pg-row:nth-child(2n+1) {
            > td {
                background-color: @alternate-row-bg-color;
            }
        }
    }

    &.row-hover-highlight {
        > tbody > tr.pg-row:hover {
            td {
                background-color: @highlighted-row-bg-color;
            }
        }
    }

    > tbody > tr.pg-row > td {
        .font-normal();

        &.row-selection, &.details, &.data-operation, &.line-number {
            width: 20px;
        }

        .highlight {
            background-color: #ffff00;
        }
    }

    >tbody {
        >tr {
            >td {
                border: 1px solid @cell-border-color;

                &:first-child {
                    border-left-color: @grid-border-color;
                }
                &:last-child {
                    border-right-color: @grid-border-color;
                }
            }
            &:first-child {
                >td {
                    border-top-color: @grid-border-color;
                }
            }
            &:last-child {
                >td {
                    border-bottom-color: @grid-border-color;
                }
            }
        }
    }

    >thead >tr >td.header-panel {
        //background: #f2f3f4 url('img/grid-header-panel.png') repeat-x left top;
        //#gradient > .vertical(lighten(@heroUnitBackground, 10%), @heroUnitBackground);
        background-color: @tableBackground;
        padding: 3px 3px 1px;
        border: 1px solid #9da0aa;
        text-align: left;

        a.global-action {
            color: #1b3f91;
            text-decoration: none;

            &:hover, &:active {
                text-decoration: underline;
            }
        }
    }

    >thead >tr.filter-row {
        >th {
            padding: 1px;
            background-color: #ebecef;

            input, select {
                margin: 0 0;
                width: 100%;
                height: auto;
                box-sizing: border-box;
                -moz-box-sizing: border-box;
                -webkit-box-sizing: border-box;

            }
        }
    }

    >tbody {
        >tr {
            >td {
                background-color: @tableBackground;
                color: @textColor;
                text-align: center;

                &.details {
                    width: 20px;

                    >div>a.expand-details {
                        &.collapsed {
                            >.toggle-detail-icon {
                                .pg-icon-mixin;
                                .pg-icon-detail-collapsed;
                            }
                        }
                        &.expanded {
                            >.toggle-detail-icon {
                                .pg-icon-mixin;
                                .pg-icon-detail-expanded;
                            }
                        }
                    }

                    >.detail-quick-access {
                        white-space: nowrap;
                        > a {

                        }
                        > .dropdown-menu {
                            text-align: left;
                        }
                    }
                }
            }
        }

        >tr.detail {
            > td {
                padding-left: 28px;

                >ul.nav {
                    margin-bottom: 0px;
                    >li > a {
                        padding-top: 2px;
                        padding-bottom: 2px;
                    }
                }

                > div.tab-content {
                    border-left: 1px solid #ddd;
                    border-right: 1px solid #ddd;
                    border-bottom: 1px solid #ddd;

                    padding-top: 4px;
                    padding-left: 4px;
                    padding-right: 4px;
                    padding-bottom: 4px;
                }

                >.detail-loading {
                    width: 100%;
                    height: 100px;
                    background: #fff url('../../images/loading.gif') no-repeat center center;
                }
            }
        }
    }

    >tbody > tr {
        > td {
            padding: 4px;
        }
    }
    >thead >tr {
        &.header {
            th {
                color: @headingsColor;

                a.expand-all-details {
                    &.collapsed {
                        >.toggle-detail-icon {
                            .pg-icon-mixin;
                            .pg-icon-all-detail-collapsed;
                        }
                    }
                    &.expanded {
                        >.toggle-detail-icon {
                            .pg-icon-mixin;
                            .pg-icon-all-detail-expanded;
                        }
                    }
                }

                .commented {
                    border-bottom: 1px dotted #000;
                }

                #gradient > .vertical(lighten(@heroUnitBackground, 10%), @heroUnitBackground);
                border: 1px solid @grid-border-color;
                outline: 1px solid @grid-border-color~"\0/";
                padding: 5px;
            }
        }
    }

    >thead >tr.header >th {
        &.primary-key{
            > .additional-info-icon {
                .pg-icon-mixin;
                .pg-icon-primary-key;
            }
        }
        &.foreign-key{
            > .additional-info-icon {
                .pg-icon-mixin;
                .pg-icon-foreign-key;
            }
        }
        &.primary-key.foreign-key{
            > .additional-info-icon {
                .pg-icon-mixin;
                .pg-icon-primary-foreign-key;
            }
        }
        &.sortable {
            cursor: pointer;
        }

        &.ascending {
          .sort-icon {
            .pg-icon-mixin;
            .pg-icon-sort-asc;
          }
        }
        &.descending {
          .sort-icon {
            .pg-icon-mixin;
            .pg-icon-sort-desc;
          }
        }

    }

    >tbody >tr >td.empty-grid {
        height: 25px;
    }

    >tbody >tr >td.line-number {
        font-family: "Courier New";
    }

    >tfoot {
        >tr.data-summary {
            td {
                background-color: #f9f9fc;
                text-align: center;
            }
            border: 1px solid @grid-border-color;
        }
    }

    > thead > tr.messages {
        > td {
            .alert {
                margin-bottom: 4px;

                &:last-child {
                    margin-bottom: 0;
                }
            }
        }
    }

    > thead > tr.addition-block {
        > td {

            input {
                padding: 1px;
                margin: 0;
            }

            background-color: darker(@tableBackground, 30%);


            border-top: 1px solid @grid-border-color;
            border-bottom: 1px solid @grid-border-color;
            border-right: 0;
            border-left: 0;

            box-shadow: 0 3px 6px -6px #666 inset;
            &:first-child {
                box-shadow: 3px 3px 6px -6px #666 inset;
                border-left: 1px solid @grid-border-color;
            }
            &:last-child {
                border-right: 1px solid @grid-border-color;
            }


            padding: 8px;
        }
    }

    > tfoot > tr > td.filter-builder-row {
        text-align: left;
        padding: 4px;
    }

    > thead > tr.search-line {
        > td {

            .btn-group .input:first-child {
                border-bottom-left-radius: 4px;
                border-top-left-radius: 4px;
                margin-left: 0;
            }

            .btn-group .input {
                float: left;
                position: relative;
                border-radius: 0;
            }

            .btn {
                padding-bottom: 1px;
                padding-top: 1px;
            }


            padding: 2px 5px 2px 2px;
            &.column-filter {
                > table {
                    width: 100%;
                    > tbody > tr {
                        > td {
                            .filter-control {
                                width: 100%;
                            }
                            .btn-search {
                                border-radius: 0;
                                border-right: 0;
                                padding-left: 4px;
                                padding-right: 4px;
                            }
                            .btn-reset {
                                border-radius: 0;
                                border-right: 0;
                                padding-left: 4px;
                                padding-right: 4px;
                            }
                            a.btn {
                                border-bottom-left-radius: 0;
                                border-top-left-radius: 0;
                            }
                            width: 100%;
                            margin: 0;
                            input {
                                width: 40px;
                                min-width: 100%;
                                padding: 1px;
                                border-right: 0;
                            }
                        }
                    }
                }
            }
        }
    }

    >thead {
        >tr {
            >th {
                border: 1px solid @grid-border-color;
            }
        }

        >tr.filter-row {
            >th:first-child {
                border-left: 1px solid @grid-border-color;
            }
            >th:last-child {
                border-right: 1px solid @grid-border-color;
            }
            >th {
                border: 0;
            }
        }
    }

    // TABLE BACKGROUNDS
    // -----------------
    // Exact selectors below required to override .table-striped (we don't use it)

    tbody tr  {
        &.success {
                background-color: @successBackground;
            }
        &.error  {
                background-color: @errorBackground;
        }
        &.warning  {
                background-color: @warningBackground;
        }
        &.info  {
                background-color: @infoBackground;
        }
    }

    // Hover states
    tbody tr {
        &.success:hover  {
                background-color: darken(@successBackground, 5%);
        }
        &.error:hover  {
                background-color: darken(@errorBackground, 5%);
        }
        &.warning:hover  {
                background-color: darken(@warningBackground, 5%);
        }
        &.info:hover  {
                background-color: darken(@infoBackground, 5%);
        }
    }
}

.box_hidden {
    visibility: collapse;
    display: none;
}

.modal.pagination-size table {
    td {
        padding: 0 5px;
    }

    th:last-child, td:last-child {
        text-align: center;
    }

}
