/*
 * Backpack - Skyscanner's Design System
 *
 * Copyright 2016-2021 Skyscanner Ltd
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *   http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

@import '~bpk-mixins';

$bpk-border-size-datatable: $bpk-border-size-xl * 2;

@mixin bpk-datatable-border-left() {
  @include _bpk-border-left(
    $bpk-border-size-datatable,
    $bpk-color-sky-blue,
    inset
  );
}

@mixin bpk-datatable-border-right() {
  @include _bpk-border-right(
    $bpk-border-size-datatable,
    $bpk-color-sky-blue,
    inset
  );
}

.bpk-data-table {
  width: 100%;

  &__header-column {
    display: flex;
    height: 100%;
    padding: $bpk-spacing-sm;
    flex-direction: row;
    align-items: center;
    outline-offset: -(4 * $bpk-one-pixel-rem);

    &:hover {
      cursor: pointer;
    }
  }

  &__row {
    display: flex;
    flex-direction: row;
    align-items: center;
    border: $bpk-border-size-sm solid $bpk-color-sky-gray-tint-07;
    border-bottom: none;
    outline-offset: -(4 * $bpk-one-pixel-rem);
    color: $bpk-color-sky-gray-tint-01;
    font-weight: normal;

    &:last-child {
      border-bottom: $bpk-border-size-sm solid $bpk-color-sky-gray-tint-07;
    }

    &--clickable:not(.bpk-data-table__header-row):hover {
      background-color: $bpk-color-sky-gray-tint-07;
      cursor: pointer;

      @include bpk-datatable-border-left;

      @include bpk-rtl {
        @include bpk-datatable-border-right;
      }
    }

    &--selected {
      background-color: $bpk-color-sky-gray-tint-06;

      @include bpk-datatable-border-left;

      @include bpk-rtl {
        @include bpk-datatable-border-right;
      }
    }
  }
}