@use 'sass:map';
@use '../colors' as colors;

@mixin provide-adf-variables() {
  // map SCSS variables to expose as CSS variables
  $defaults: (
    // primary palette colors
    --theme-primary-color: map.get(colors.$aca-primary-blue, 500),
    --theme-primary-color-default-contrast: white,
    --theme-header-text-color: white,
    --adf-theme-primary-50: map.get(colors.$aca-primary-blue, 50),
    --adf-theme-primary-100: map.get(colors.$aca-primary-blue, 100),
    --adf-theme-primary-300: map.get(colors.$aca-primary-blue, 300),
    --adf-theme-primary-900: map.get(colors.$aca-primary-blue, 900),
    // warn palette colors
    --theme-warn-color: map.get(colors.$aca-warn, 500),
    --theme-warn-color-a700: map.get(colors.$aca-warn, A700),
    --theme-warn-color-default-contrast: white,
    // accent palette colors
    --theme-accent-color: map.get(colors.$aca-accent-green, A200),
    --theme-accent-color-a200: map.get(colors.$aca-accent-green, A200),
    --theme-accent-color-default-contrast: white,
    --theme-accent-300: map.get(colors.$aca-accent-green, 300),
    --theme-accent-500: map.get(colors.$aca-accent-green, 500),
    --theme-accent-900: map.get(colors.$aca-accent-green, 900),
    // foreground colors (MD2 light theme resolved values)
    --adf-theme-foreground-base-color: black,
    --adf-theme-foreground-base-color-065: rgba(0, 0, 0, 0.65),
    --adf-theme-foreground-base-color-045: rgba(0, 0, 0, 0.45),
    --adf-theme-foreground-disabled-text-color: rgba(0, 0, 0, 0.38),
    --adf-theme-foreground-divider-color: rgba(0, 0, 0, 0.12),
    --adf-theme-foreground-icon-color: rgba(0, 0, 0, 0.54),
    --adf-theme-foreground-icon-color-054: rgba(0, 0, 0, 0.54),
    --adf-theme-foreground-secondary-text-color: rgba(0, 0, 0, 0.54),
    --adf-theme-foreground-text-color: rgba(0, 0, 0, 0.87),
    --adf-theme-foreground-text-color-087: rgba(0, 0, 0, 0.87),
    --adf-theme-foreground-text-color-075: rgba(0, 0, 0, 0.75),
    --adf-theme-foreground-text-color-064: rgba(0, 0, 0, 0.64),
    --adf-theme-foreground-text-color-060: rgba(0, 0, 0, 0.6),
    --adf-theme-foreground-text-color-054: rgba(0, 0, 0, 0.54),
    --adf-theme-foreground-text-color-040: rgba(0, 0, 0, 0.4),
    --adf-theme-foreground-text-color-027: rgba(0, 0, 0, 0.27),
    --adf-theme-foreground-text-color-025: rgba(0, 0, 0, 0.25),
    --adf-theme-foreground-text-color-014: rgba(0, 0, 0, 0.14),
    --adf-theme-foreground-text-color-007: rgba(0, 0, 0, 0.07),
    // background colors (MD2 light theme resolved values)
    --adf-theme-background-card-color: white,
    --adf-theme-background-card-color-087: rgba(255, 255, 255, 0.87),
    --theme-background-color: #fafafa,
    --adf-theme-background-dialog-color: white,
    --adf-theme-background-hover-color: rgba(0, 0, 0, 0.04),
    --adf-theme-background-selected-button-color: #e0e0e0,
    --adf-theme-background-status-bar-color: #e0e0e0,
    --adf-theme-background-unselected-chip-color: #e0e0e0,
    // typography
    --theme-font-family: 'Open Sans',
    --theme-font-weight: normal,
    --theme-body-1-font-size: var(--mat-sys-body-large-size),
    --theme-body-2-font-size: var(--mat-sys-title-small-size),
    --theme-body-1-line-height: var(--mat-sys-body-large-line-height),
    --theme-display-1-font-size: var(--mat-sys-headline-large-size),
    --theme-display-3-font-size: var(--mat-sys-display-medium-size),
    --theme-display-4-font-size: var(--mat-sys-display-large-size),
    --theme-caption-font-size: var(--mat-sys-body-small-size),
    --theme-title-font-size: var(--mat-sys-headline-small-size),
    --theme-subheading-1-font-size: var(--mat-sys-body-medium-size),
    --theme-subheading-2-font-size: var(--mat-sys-title-medium-size),
    --theme-button-font-size: var(--mat-sys-label-large-size),
    --theme-headline-font-size: var(--mat-sys-headline-medium-size),
    --theme-headline-line-height: var(--mat-sys-headline-medium-line-height),
    --theme-adf-icon-1-font-size: 24px,
    --theme-adf-picture-1-font-size: 16px,
    --theme-adf-task-footer-font-size: 12px,
    --theme-adf-task-title-font-size: 14px,
    // grey palette colors
    --adf-theme-mat-grey-color-a200: #eee,
    --adf-theme-mat-grey-color-a400: #616161,
    --adf-theme-mat-grey-color-50: #fafafa,
    --adf-theme-mat-grey-color-400: #bdbdbd,
    // spacing
    --adf-theme-spacing: 8px,
    // components
    --adf-metadata-property-panel-border-color: rgba(0, 0, 0, 0.12),
    --adf-metadata-action-button-clear-color: rgba(33, 35, 40, 0.698),
    --adf-metadata-property-panel-text-color: rgba(33, 35, 40, 0.7),
    --adf-metadata-property-panel-label-color: rgba(33, 33, 33, 0.24),
    --adf-error-color: #ba1b1b,
    --adf-secondary-modal-text-color: #212121,
    --adf-disabled-button-background: rgba(0, 0, 0, 0.12),
    --adf-chip-border-color: #757575,
    --adf-sidenav-active-text-color: rgba(0, 48, 100, 1),
    --adf-accessibility-tooltip-background-color: #2f3033,
    --adf-pdf-viewer-annotation-tooltip-color: rgb(255, 235, 107),
    --theme-form-field-height-default: 56px
  );

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