/*
 * Copyright (C) 2021 The Gravitee team (http://gravitee.io)
 *
 * 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.
 */
@use 'sass:map';
@use '@angular/material' as mat;

@use '../../scss/gio-mat-palettes.scss' as palettes;
@use '../../scss/gio-mat-theme-variable' as theme;

$background: map.get(theme.$mat-theme, background);
$typography: map.get(theme.$mat-theme, typography);

@mixin theme() {
  table.gio-table-light {
    border: 1px solid map.get(palettes.$mat-dove-palette, darker20);
    border-radius: 4px;
    border-collapse: inherit;
    border-spacing: 0;

    th,
    td {
      padding: 8px;
      border-bottom: 1px solid map.get(palettes.$mat-dove-palette, darker10);
    }

    thead {
      @include mat.m2-typography-level($typography, 'subtitle-2');

      background-color: mat.m2-get-color-from-palette(palettes.$mat-dove-palette, default);
      text-align: left;
      text-transform: uppercase;

      & > tr:first-child > th:first-child {
        border-top-left-radius: 4px;
      }

      & > tr:first-child > th:last-child {
        border-top-right-radius: 4px;
      }
    }

    tbody {
      @include mat.m2-typography-level($typography, 'body-2');

      background-color: mat.m2-get-color-from-palette(palettes.$mat-basic-palette, white);

      & > tr:last-child > td:first-child {
        border-bottom: 0;
        border-bottom-left-radius: 4px;
      }

      & > tr:last-child > td:last-child {
        border-bottom: 0;
        border-bottom-right-radius: 4px;
      }
    }

    &.disabled {
      border-color: map.get(palettes.$mat-dove-palette, darker10);

      thead {
        background-color: mat.m2-get-color-from-palette(palettes.$mat-dove-palette, default, 0.6);
        color: mat.m2-get-color-from-palette(palettes.$mat-dove-palette, 'darker20');
      }

      tbody {
        color: mat.m2-get-color-from-palette(palettes.$mat-dove-palette, 'darker20');
      }
    }
  }
}