/**
 * Copyright (C) 2017-2019 Dremio Corporation
 *
 * 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 "../../../node_modules/leantable2/dist-css/fixed-header.css";
@import "../../../node_modules/leantable2/dist-css/theme-hooks.css";
@import "../../../node_modules/leantable/dist-css/core/grid-layout.css";

:root {
  --leantable--column--gap: 0;
  --leantable--header--background: var(--fill--primary);
  --leantable--header--padding-block: 10px;
  --leantable--header--text-align: left;
  --leantable--row--background: var(--fill--primary);
  --leantable--row--border: 1px solid var(--border--neutral);
  --leantable--row--hover--background: var(--fill--primary--hover);
}

.leantable--no-borders {
  --leantable--row--border: none;

  .leantable__header-cell
    + .leantable__header-cell:not(.leantable-row-hover-visibility)::after {
    display: none;
  }
}

.leantable__table {
  font-size: 14px;
  width: 100%;
  white-space: nowrap;
}

.leantable__body-row[aria-disabled="true"] .leantable__body-cell {
  opacity: 0.5;
  cursor: default;
}

.leantable__body-row[aria-disabled="true"]:hover .leantable__body-cell,
.leantable__body-row[aria-disabled="true"] .leantable__body-cell:focus-within {
  background-color: var(--fill--primary) !important;
}

.leantable__body-row
  .leantable__body-cell.leantable-row-hover-visibility:focus-within {
  background-color: var(--fill--primary) !important;
}

.leantable__header-cell {
  font-weight: 600;
  user-select: none;
  padding-inline: 10px;
}

.leantable__body-cell__content {
  padding-inline: 10px;
  height: 100%;
  display: flex;
  align-items: center;
}

.leantable__header-cell
  + .leantable__header-cell:not(.leantable-row-hover-visibility)::after {
  content: "";
  display: inline-block;
  width: 1px;
  height: 23px;
  background: var(--border--neutral);
  position: absolute;
  left: 0;
  top: 9px;
}

.clickable-cell {
  cursor: pointer;
  height: 100%;
  display: flex;
  flex-grow: 1;
  margin-inline: -10px;
  padding-inline: 10px;
  color: var(--text--link);
  font-weight: 500;
}

.clickable-cell:hover,
.clickable-cell:focus-visible {
  color: var(--text--link) !important;
  text-decoration: underline;
}

.leantable__body {
  background-color: var(--fill--primary);
}

.leantable__body-cell {
  height: 40px;
}

/* copied from 0.4.1 for now*/
.leantable-row-hover-visibility > * {
  opacity: 0;
}

.leantable__body-row:hover .leantable-row-hover-visibility > *,
.leantable__body-row:focus-visible .leantable-row-hover-visibility > *,
.leantable__body-row .leantable-row-hover-visibility:focus-within > * {
  opacity: 1;
}

.leantable__body-cell.leantable-sticky-column--right.leantable-row-hover-visibility {
  background: none;
}

.leantable-sticky-column {
  position: sticky;
  z-index: 200;
}
.leantable-sticky-column--left {
  left: 0;
}
.leantable-sticky-column--right {
  right: 0;
}

.leantable__header-cell[aria-sort] {
  cursor: pointer;
  user-select: none;
}

.leantable--fixed-header .leantable__header-cell {
  position: sticky;
  top: 0;
  z-index: 300;
}

.leantable--fixed-header .leantable__header-cell.leantable-sticky-column {
  z-index: 350;
}

.leantable-sticky-column--left::after {
  box-shadow: inset 10px 0 8px -8px #00000026;
  position: absolute;
  top: -1px;
  right: 0;
  bottom: 0;
  width: 30px;
  transform: translate(100%);
  content: "";
  pointer-events: none;
  opacity: 0;
  transition: opacity 72ms ease-in-out;
}

.dremio-scrolled-container--left .leantable-sticky-column--left::after {
  opacity: 1;
}

.leantable--align-right,
.leantable--align-right > .leantable__body-cell__content {
  justify-content: flex-end;
  text-align: right;
}

.leantable--p-2 .leantable__header-row .leantable__header-cell:first-child,
.leantable--p-2
  .leantable__body-row
  .leantable__body-cell:first-child
  .leantable__body-cell__content {
  padding-inline-start: var(--scale-2);
}

.leantable--p-2 .leantable__header-row .leantable__header-cell:last-child,
.leantable--p-2
  .leantable__body-row
  .leantable__body-cell:last-child
  .leantable__body-cell__content {
  padding-inline-end: var(--scale-2);
}

.leantable__body-row:hover {
  --bg: var(--leantable--row--hover--background);
}
