@import "../variables/colors";
@import "../variables/dimensions";
@import "~bootstrap-sass/assets/stylesheets/bootstrap/mixins";

.table {

    table-layout: fixed;
    border-collapse: separate;
    margin: 0;
    border-bottom: 1px solid $table-border-color;
    margin-bottom: -1px;

    > thead,
    > tbody,
    > tfoot {
        > tr {
            > th,
            > td {
                padding: $gridCellPaddingVertical $gridCellPaddingHorizontal;
                vertical-align: top;

                &.with-input,
                &.narrow {
                    padding: $gridCellPaddingVertical/2 $gridCellPaddingHorizontal;
                    hr {
                        margin-top: $gridCellPaddingVertical/2;
                        margin-bottom: $gridCellPaddingVertical/2;
                    }
                }
                &.with-multiselect {
                    overflow: visible;
                    padding: $gridCellPaddingVertical/2 $gridCellPaddingHorizontal;

                    .multi-select ul {
                        min-width: 0;
                    }
                }

                &:first-of-type {
                    padding-left: $default-padding;
                }

                &:last-of-type {
                    padding-right: $default-padding;
                    .resize-handler {
                        display: none;
                    }
                }
            }
            &.cursor-pointer {
                [data-stop-row-click] {
                    cursor: default;
                }
            }
        }
    }

    > thead > tr > th {
        border-top: 1px solid transparent !important;
        border-bottom: 1px solid transparent !important;
        .checkbox{
            label{
                font-weight: inherit;
            }
        }
    }

    td {
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        &.text-wrap {
          white-space: normal;
        }

        .grid-form-element {
            margin-bottom: 0;

            .radio,
            .checkbox {
                margin-top: 0;
                margin-bottom: 0;
            }

            //FIXME Dangerous definitions
            .radio input[type="radio"],
            .checkbox input[type="checkbox"] {
                margin-top: 3px;
                margin-left: $grid_gutter-width/2;
            }
        }
    }

    .grid-row-inline-action-group {
        width: 100%;
        >.btn.btn-link {
            padding: 0;
            width: 100%;
            overflow: hidden;
            text-overflow: ellipsis;
            text-align: inherit;
        }
    }
}

.sortable { //TODO Rename
    cursor: pointer;

    .list-hover-arrow {
        display: none;
    }

    .rc-icon {
        float: right;
    }

    &:hover {
        .list-hover-arrow {
            display: block;
        }
    }
}

.resize-handler {
  float: right;
  width: 0;
  padding: $gridCellPaddingVertical/2 $gridCellPaddingHorizontal;
  margin: (-$gridCellPaddingVertical/2) (-$gridCellPaddingHorizontal*2);
  &:after {
    content: '-';
    color: transparent;
    display: inline-block;
    width: 1px;
    background: $table-border-color;
  }
}

td.resizable,
th.resizable {
  .resize-handler {
    cursor: ew-resize;
    &:hover:after {
      background: $primaryColor;
    }
  }
}

td.resizing,
th.resizing {
  .resize-handler:after {
    background: $primaryColor;
  }
}

.column-header-append {
  float: right;
}

.sortable .column-header-append {
  padding-left: $padding-xs-horizontal;
  padding-right: $padding-xs-horizontal;
}

.resizing-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: $zindex-modal + 1;
  &-ew {
    cursor: ew-resize;
  }
}

.order-asc, .order-desc {
    background: $gridHeaderSortBackground !important;
}

.grid-empty-list-message {
    text-align: center;
    font-size: 18px;
    padding-top: 150px;
    color: $text-muted;
    border-top: 1px solid $table-border-color;
    margin-bottom: -1px;
}

.grid-blocked-list-container {
    background: rgba(255, 255, 255, 0.5);
    position: absolute;
    width: 100%;
    height: 100%;
    min-height: 400px;
    top: 0;
    left: 0;

    .grid-blocked-list-message {
        position: absolute;
        left: 50%;
        top: 150px;
        width: 200px;
        margin-left: -100px;
        border-radius: 6px;
        border: 1px solid $mediumGrayColor;
        background: $whiteColor url($imagesPath + "/loader_blue.gif") 50% 12px no-repeat;
        padding: 50px 15px 15px 15px;
        text-align: center;
    }
}

.grid-container {
    min-height: $grid-min-height;
    position: relative;

    > .grid-empty-list-message {
        display: flex;
        flex-direction: column;
        justify-content: center;
        position: absolute;
        border-top: none;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        padding: $gridCellPaddingHorizontal*4;
        margin: 0;
    }
}

.resizable-grid-container {
    overflow-x: auto;
    .table {
        margin-bottom: 0;
    }
}

.sorter-icon {
    position: absolute;
    right: $grid_gutter-width / 2;
    top: $grid_gutter-width;
    padding-left: $grid_gutter-width / 2;;
}

.table.rc-table-vertical-align-middle th,
.table.rc-table-vertical-align-middle td,
tr.rc-table-vertical-align-middle th,
tr.rc-table-vertical-align-middle td,
th.rc-table-vertical-align-middle,
td.rc-table-vertical-align-middle {
    vertical-align: middle !important;
}