1//Fixed alerts
2.alert-danger {
3  background-color: $accent-04--02;
4  border-color: $accent-04--01;
5  border-radius: 0;
6  color: $primary-dark;
7  text-align: left;
8}
9.alert-warning {
10  background-color: $accent-03--03;
11  border-color: $accent-03--02;
12  border-radius: 0;
13  color: $primary-dark;
14  text-align: left;
15  .icon {
16    vertical-align: bottom;
17  }
18}
19
20.message-container {
21  background-color: $background-02;
22  padding: 1em 1.5em;
23  display: inline-block;
24  >*:last-child {
25    margin-bottom: 0;
26  }
27}
28
29.notification-banner {
30  padding: 8px 10px;
31  margin-bottom: 24px;
32  border-style: solid;
33  border-width: 1px;
34}
35
36.notification-banner__text {
37  font-size: 0.9em;
38  margin-bottom: 0;
39  line-height: 1.2;
40}
41
42.notification-banner--information {
43  background-color: $background-02;
44  border-color: $border-color-01;
45}
46
47.notification-banner--warning {
48  background-color: $accent-03--03;
49  border-color: $accent-03--02;
50  .notification-banner__text {
51    &::before {
52      content: '';
53      display: inline-block;
54      width: 18px;
55      height: 18px;
56      vertical-align: bottom;
57      margin-right: 0.5em;
58      background-image: url(../assets/images/icon-warning.svg);
59    }
60  }
61}
62