/* stylelint-disable scss/no-global-function-names */
@use '@angular/material' as mat;
@use 'sass:color';

$foreground: map-get($custom-theme, foreground);
$background: map-get($custom-theme, background);
$background-color: mat.m2-get-color-from-palette($background, background);
$background-card-color: mat.m2-get-color-from-palette($background, card);
$text-color: mat.m2-get-color-from-palette($foreground, text);
$secondary-text: mat.m2-get-color-from-palette($foreground, secondary-text);

// Custom variables - ACA specific styling:
$data-table-thumbnail-width: 35px;
$data-table-cell-min-width: 150px;
$data-table-cell-min-width-no-grow: 120px;
$data-table-cell-min-width-file-size: 110px;

// Upload drag
$adf-upload-dragging-color: unset;
$adf-upload-dragging-border: 1px solid #00bcd4;
$adf-upload-dragging-background: #e0f7fa;
$adf-upload-dragging-level1-color: unset;
$adf-upload-dragging-level1-border: none;
$grey-background: rgba(33, 33, 33, 0.12);
$grey-text-background: rgba(33, 33, 33, 0.05);
$grey-hover-background: rgba(33, 33, 33, 0.24);
$blue-save-button-background: #1f74db;
$blue-checkbox-background: rgb(10, 96, 206);
$blue-active-table-row: rgb(10, 96, 206, 0.24);
$black-heading: #4e4c4c;
$light-grey-content: #4b5563;
$theme-dropdown-background: darken($background-color, 5%);
$theme-dropdown-background-hover: darken($background-color, 10%);
$grey-divider: rgba(0, 0, 0, 0.22);
$datetimepicker-font-color: rgba(black, 0.87);
$datetimepicker-selected-date-background: #2254b2;
$white-background: #fff;
$datetimepicker-cell-focus-border-color: #1f74db;
$sidenav-background-color: $background-color;
$selected-text-color: #212121;
$selected-text-background: rgba($selected-text-color, 0.12);
$selected-background-color: rgba(31, 116, 219, 0.24);
$action-button-text-color: lighten($text-color, 35%);
$page-layout-header-background-color: $background-card-color;
$search-chip-icon-color: #757575;
$disabled-chip-background-color: #f5f5f5;
$contrast-gray: mat.m2-get-color-from-palette($foreground, 'secondary-tex');
$search-highlight-background-color: #ffd180;
$info-snackbar-background: #1f74db;
$warning-snackbar-background: #8c7012;
$text-light-color: rgba(33, 35, 40, 0.7);
$card-background-grey-color: rgb(248, 248, 248);
$light-grey-1: #d5d5d5;
$light-grey-2: #d9d9d9;
$light-grey-3: #dedede;
$user-profile-background: #595959;
$app-blue-folder: #2a7de1;

// CSS Variables
$defaults: (
  --theme-background-color: $background-color,
  --theme-search-background-color: darken($background-color, 1),
  --theme-text-color: mat.m2-get-color-from-palette($foreground, text, 0.54),
  --theme-sidenav-text-color: mat.m2-get-color-from-palette($foreground, text),
  --theme-sidenav-hovered-text-color: mat.m2-get-color-from-palette($foreground, text),
  --theme-tab-active-text-color: mat.m2-get-color-from-palette($foreground, text),
  --theme-text-bold-color: mat.m2-get-color-from-palette($foreground, text, 0.87),
  --theme-title-color: mat.m2-get-color-from-palette($foreground, text, 0.87),
  --theme-border-color: mat.m2-get-color-from-palette($foreground, text, 0.07),
  --theme-card-background-color: mat.m2-get-color-from-palette($background, card),
  --theme-foreground-text-color: mat.m2-get-color-from-palette($foreground, text, 0.72),
  --theme-foreground-text-bold-color: mat.m2-get-color-from-palette($foreground, text, 0.87),
  --theme-secondary-text-color: mat.m2-get-color-from-palette($foreground, secondary-text),
  --theme-divider-color: mat.m2-get-color-from-palette($foreground, divider, 0.07),
  --theme-dialog-background-color: mat.m2-get-color-from-palette($background, dialog),
  --theme-header-text-color: mat.m2-get-color-from-palette($foreground, text, 0.87),
  --new-button-font-size: 0.9rem,
  --theme-grey-text-background-color: $grey-text-background,
  --theme-grey-background-color: $grey-background,
  --theme-grey-hover-background-color: $grey-hover-background,
  --theme-blue-button-color: $blue-save-button-background,
  --theme-info-snackbar-background: $info-snackbar-background,
  --theme-warning-snackbar-background: $warning-snackbar-background,
  --theme-blue-checkbox-color: $blue-checkbox-background,
  --theme-blue-active-table-row-color: $blue-active-table-row,
  --theme-content-color: $light-grey-content,
  --theme-dropdown-color: $theme-dropdown-background,
  --theme-dropdown-background-hover: $theme-dropdown-background-hover,
  --theme-grey-divider-color: $grey-divider,
  --theme-pagination-background-color: mat.m2-get-color-from-palette($background, background),
  --theme-about-panel-border-color: $grey-background,
  --theme-about-panel-background-color: mat.m2-get-color-from-palette($background, card),
  --theme-about-panel-title-color: mat.m2-get-color-from-palette($foreground, text),
  --theme-datetimepicker-font-color: $datetimepicker-font-color,
  --theme-datetimepicker-selected-date-background: $datetimepicker-selected-date-background,
  --theme-white-background: $white-background,
  --theme-datetimepicker-cell-focus-border: $datetimepicker-cell-focus-border-color,
  --theme-sidenav-background-color: $sidenav-background-color,
  --theme-selected-text-color: $selected-text-color,
  --theme-selected-background-color: $selected-background-color,
  --theme-selected-text-background: $selected-text-background,
  --theme-hover-background-color: $grey-text-background,
  --theme-action-button-text-color: $action-button-text-color,
  --theme-page-layout-header-background-color: $page-layout-header-background-color,
  --theme-search-chip-icon-color: $search-chip-icon-color,
  --theme-disabled-chip-background-color: $disabled-chip-background-color,
  --theme-secondary-text: $secondary-text,
  --theme-search-highlight-background-color: $search-highlight-background-color,
  --theme-text-light-color: $text-light-color,
  --theme-card-background-grey-color: $card-background-grey-color,
  --theme-light-grey-1-color: $light-grey-1,
  --theme-light-grey-2-color: $light-grey-2,
  --theme-light-grey-3-color: $light-grey-3,
  --theme-user-profile-background-color: $user-profile-background,
  --theme-app-blue-folder: $app-blue-folder
);

// propagates SCSS variables into the CSS variables scope
:root {
  @each $name, $value in $defaults {
    #{$name}: #{$value};
  }
}
