@use "sass:map";
@use "sass:math";
@use "./base";
@use "./close-x";
@use "./button";

$alert-type-list: (info, success, warning, error) !default;
$alert-size-list: base.$base-size-list !default;
$alert-font-size: base.$font-size !default;
// 默认 md
$alert-font-size-md: map.get($alert-font-size, md) !default;
$alert-bg-color: (
  info: base.color-info(1),
  success: base.color-success(1),
  warning: base.color-warning(1),
  error: base.color-danger(1)
) !default;
$alert-border-color: (
  info: base.color-info(2),
  success: base.color-success(2),
  warning: base.color-warning(2),
  error: base.color-danger(2)
) !default;
$alert-icon-color: (
  info: base.color-info(),
  success: base.color-success(),
  warning: base.color-warning(),
  error: base.color-danger()
) !default;
$alert-border-width: base.$border-width-base !default;
$alert-border-radius: base.$border-radius-medium !default;
$alert-headline-font-weight: base.$font-weight-semibold !default;
$alert-content-fontsize: base.$font-size-md !default;
$alert-padding-horizontal: base.padding(4) !default;
$alert-padding-vertical: base.padding(4) - $alert-border-width * 2 !default;
$alert-padding-vertical-without-headline: base.padding(2) - $alert-border-width * 2 !default;
$alert-headline-icon-size: (
  #{base.$font-size-sm}: 16px,
  #{base.$font-size-md}: 20px,
  #{base.$font-size-lg}: 24px,
) !default;
@function alert-headline-icon-size($font-size: $alert-font-size-md) {
  @return map.get($alert-headline-icon-size, #{$font-size});
}
$alert-content-icon-size: (
  #{base.$font-size-sm}: 14px,
  #{base.$font-size-md}: 16px
) !default;
@function alert-content-icon-size($font-size: $alert-font-size-md) {
  @return map.get($alert-content-icon-size, #{$font-size});
}
$alert-icon-margin: base.padding(2) !default;
@function alert-with-icon-message-padding-left($icon-size: alert-headline-icon-size()) {
  @return $icon-size + $alert-icon-margin;
}
$alert-type-list: (info, success, warning, error) !default;
$alert-icon-color: (
  info: base.color-info(),
  success: base.color-success(),
  warning: base.color-warning(),
  error: base.color-danger()
) !default;
$alert-close-x-margin: base.padding(4) !default;
$alert-close-x-icon-size: map.get(button.$btn-font-size, md);
@mixin alert-without-headline-close-x-position(
  $line-height: base.line-height($alert-font-size-md),
  $right: $alert-padding-horizontal,
  $top: $alert-padding-vertical,
) {
  $without-headline-single-line-height: $top * 2 + $line-height;
  $close-x-top-without-headline: math.div($without-headline-single-line-height - $alert-close-x-icon-size, 2);
  @include close-x.closeXPosition($right, $close-x-top-without-headline);
};
$alert-extra-margin-vertical: base.padding(4) !default;
$alert-close-x-color-normal: base.$color-icon-normal !default;
$alert-close-x-color-hover: $alert-close-x-color-normal !default;
$alert-close-x-color-active: base.$color-icon-normal-active !default;