@use 'sass:map';
@use '../../../mx-core/src/base/colors' as colors;

@mixin mx-banner-theme($theme) {
  $is-dark: map.get($theme, is-dark);
  $themeColors: colors.$mx-light;

  @if $is-dark {
    $themeColors: colors.$mx-dark;
  }

  .mx-banner-warning {
    .mx-banner__wrapper {
      background-color: map.get($themeColors, warningContainer);
    }

    .mx-banner__content {
      color: map.get($themeColors, onWarningContainer);

      .mat-icon {
        color: map.get($themeColors, warningVivid);
      }
    }
  }

  .mx-banner-error {
    .mx-banner__wrapper {
      background-color: map.get($themeColors, errorContainer);
    }

    .mx-banner__content {
      color: map.get($themeColors, onerrorContainer);

      .mat-icon {
        color: map.get($themeColors, errorVivid);
      }
    }
  }
}