@use 'sass:map';
@use '../index' as *;

$notification: (
  radius: 0,
  padding: var(--s-l),
  padding-mobile: var(--s-m),
  padding-end: var(--s-xl),
  padding-end-mobile: var(--s-m),
  padding-start: var(--s-l),
  padding-start-mobile: var(--s-s),
  border-width: 1px,
  font: var(--f-m),
  color: var(--c-d),
  title-font: var(--f-l),
  title-font-weight: map.get($font-weight, 'regular'),
  title-spacing: 0,
  close-color: var(--c-d),
  close-offset-top-mobile: calc(var(--s-m) - var(--s-xl)),
  close-offset-end-mobile: calc(var(--s-m) - var(--s-xl)),
  close-offset-top: calc(var(--s-m) - var(--s-xl)),
  close-offset-end: calc(var(--s-m) - var(--s-xl)),
  info: (
    background: var(--c-n-20),
    color: var(--c-in),
    border-color: var(--c-n),
  ),
  success: (
    background: var(--c-n-20),
    color: var(--c-su),
    border-color: var(--c-n),
  ),
  warning: (
    background: var(--c-n-20),
    color: var(--c-wa),
    border-color: var(--c-n),
    icon-background-color: var(--c-d),
    icon-background-height: var(--s-m),
    icon-background-width: var(--s-xs),
    icon-background-top-mobile: calc(var(--s-m) + var(--s-s)),
    icon-background-top: calc(var(--s-l) + var(--s-s)),
    icon-background-left-mobile: calc(
        var(--s-s) + (map.get($icon, 'l') / 2) - var(--s-2xs)
      ),
    icon-background-left: calc(
        var(--s-l) + (map.get($icon, 'l') / 2) - var(--s-2xs)
      ),
  ),
  error: (
    background: var(--c-n-20),
    color: var(--c-er),
    border-color: var(--c-n),
  ),
);
$notification-print: (
  padding: map.get($spacing-print, '3xl') map.get($spacing-print, 'xl')
    map.get($spacing-print, '3xl') map.get($spacing-print, '3xl'),
  font: var(--f-m),
  title-font: map.get($font-print, 'l'),
  title-spacing: map.get($spacing-print, 's'),
);
