@use 'sass:map';
@use '~@angular/material' as mat;

@mixin file-download-content-color($palette) {
  .container {
    background-color: mat.get-color-from-palette($palette, default);
    .mat-spinner,
    .file-information,
    .download-button,
    .remove-file-button:not(.mat-button-disabled) {
      color: mat.get-color-from-palette($palette, default-contrast);
    }
    .download-button:hover,
    .remove-file-button:hover:not(.mat-button-disabled) {
      background-color: mat.get-color-from-palette($palette, default-contrast, 0.12);
    }
    .mat-spinner {
      > svg > circle {
        stroke: mat.get-color-from-palette($palette, default-contrast);
      }
    }
  }
}

@mixin color($theme) {
  $config: mat.get-color-config($theme);
  $primary: map.get($config, primary);
  $accent: map.get($config, accent);
  $warn: map.get($config, warn);

  mtna-file-download {
    &.mat-primary {
      @include file-download-content-color($primary);
    }
    &.mat-accent {
      @include file-download-content-color($accent);
    }
    &.mat-warn {
      @include file-download-content-color($warn);
    }
  }
}

@mixin typography($theme) {
}

@mixin theme($theme) {
  $config: mat.get-color-config($theme);
  @if $config != null {
    @include color($theme);
  }

  $typography-config: mat.get-typography-config($theme);
  @if $typography-config != null {
    @include typography($theme);
  }
}