@use "node_modules/bulma/sass/utilities/css-variables.scss" as cv;

$bulma-sticky-table-zindex: 5 !default;

/*
 * Bulma variables
 */

$table-background-color: cv.getVar("scheme-main") !default;

$table-cell-border-color: cv.getVar("border") !default;
$table-cell-border-style: solid !default;
$table-cell-border-width: 0 0 1px !default;

$table-head-background-color: transparent !default;
$table-body-background-color: transparent !default;
$table-foot-background-color: transparent !default;

$table-row-hover-background-color: cv.getVar("scheme-main-bis") !default;
$table-row-active-background-color: cv.getVar("primary") !default;

$table-striped-row-even-background-color: cv.getVar("scheme-main-bis") !default;
$table-striped-row-even-hover-background-color: cv.getVar(
  "scheme-main-ter"
) !default;

$navbar-height: 3.25rem !default;

@media screen {
  /*
   * Fix borders
   */

  .table.has-sticky-column,
  .table.has-sticky-footer,
  .table.has-sticky-header {
    border-collapse: separate;

    tbody,
    thead {
      td,
      th {
        border-top-width: 0;
      }
    }

    &.is-bordered {
      border-color: $table-cell-border-color;
      border-style: $table-cell-border-style;
      border-width: $table-cell-border-width;

      td,
      th {
        border-left-width: 0;

        &:last-child {
          border-right-width: 0;
        }
      }

      tbody tr:last-child,
      tfoot tr:last-child {
        td,
        th {
          border-bottom-width: 0;
        }
      }
    }
  }

  /*
     * Sticky Header
     */

  .table.has-sticky-header {
    thead th {
      @if $table-head-background-color ==
        'transparent' or
        $table-head-background-color ==
        rgba(0, 0, 0, 0)
      {
        background-color: $table-background-color;
      }
      position: sticky;
      top: 0;
      z-index: $bulma-sticky-table-zindex;
    }
  }

  .has-navbar-fixed-top * .table.has-sticky-header thead th,
  .has-navbar-fixed-top .table.has-sticky-header thead th {
    top: $navbar-height;
  }

  .has-navbar-fixed-top * .modal .table.has-sticky-header thead th,
  .has-navbar-fixed-top .modal .table.has-sticky-header thead th {
    top: 0;
  }

  /*
     * Sticky Footer
    */

  .table.has-sticky-footer {
    tfoot th {
      @if $table-foot-background-color ==
        'transparent' or
        $table-foot-background-color ==
        rgba(0, 0, 0, 0)
      {
        background-color: $table-background-color;
      }
      position: sticky;
      bottom: 0;
      z-index: $bulma-sticky-table-zindex;
    }
  }

  .has-navbar-fixed-bottom * .table.has-sticky-footer tfoot th,
  .has-navbar-fixed-bottom .table.has-sticky-footer tfoot th {
    bottom: $navbar-height;
  }

  .has-navbar-fixed-bottom * .modal .table.has-sticky-footer tfoot th,
  .has-navbar-fixed-bottom .modal .table.has-sticky-footer tfoot th {
    bottom: 0;
  }

  /*
     * Sticky Column
     */

  .table.has-sticky-column {
    tfoot th:first-child,
    thead th:first-child {
      @if $table-head-background-color ==
        'transparent' or
        $table-head-background-color ==
        rgba(0, 0, 0, 0)
      {
        background-color: $table-background-color;
      }
      position: sticky;
      left: 0;
      z-index: $bulma-sticky-table-zindex + 1;
    }

    tbody th:first-child {
      @if $table-body-background-color ==
        'transparent' or
        $table-body-background-color ==
        rgba(0, 0, 0, 0)
      {
        background-color: $table-background-color;
      }
      position: sticky;
      left: 0;
      z-index: $bulma-sticky-table-zindex;
    }

    tbody tr.is-selected th:first-child {
      background-color: $table-row-active-background-color;
    }

    &.is-hoverable {
      tbody tr:not(.is-selected):hover th:first-child {
        background-color: $table-row-hover-background-color;
      }
    }

    &.is-striped {
      tbody tr:not(.is-selected):nth-child(even) th:first-child {
        background-color: $table-striped-row-even-background-color;
      }
    }

    &.is-striped.is-hoverable {
      tbody tr:not(.is-selected):nth-child(even):hover th:first-child {
        background-color: $table-striped-row-even-hover-background-color;
      }
    }
  }
}