.messages__wrapper .messages {
    --color--message: var(--color--primary-50);
    --color--message-background: var(--color--message);
    background-color: var(--color--message-background);
    border-left: var(--sp0-25) solid var(--color--message);
  }
.messages__wrapper .messages * {
      color: var( --color--message);
    }
.messages__wrapper .messages .messages__icon svg {
      fill: var(--color--message);
    }
.messages__wrapper .messages .messages__close {
      position: relative;
      width: 25px;
      height: 25px;
      padding-top: 0;
      padding-bottom: 0;
      padding-left: 0;
      padding-right: 0;
      cursor: pointer;
      vertical-align: top;
      border: 0;
      background: none;
      -webkit-appearance: none;
         -moz-appearance: none;
              appearance: none;
    }
.messages__wrapper .messages .messages__close::before,
      .messages__wrapper .messages .messages__close::after {
        position: absolute;
        top: 50%;
        left: 50%;
        display: block;
        width: 33px;
        height: 0;
        content: "";
        border-top: solid 2px var(--color--message);
      }
.messages__wrapper .messages .messages__close::before {
        transform: translate(-50%, -50%) rotate(45deg);
      }
.messages__wrapper .messages .messages__close::after {
        transform: translate(-50%, -50%) rotate(-45deg);
      }
.messages__wrapper .messages .messages__close:hover::before,
        .messages__wrapper .messages .messages__close:hover::after {
          border-color: inherit;
        }
.messages__wrapper .messages .messages__close:focus {
        outline: 2px solid var(--color--message);
        outline-offset: 2px;
      }
.messages__wrapper .messages.messages--error {
      --color--message: #EB5757;
      --color--message-background: #FDEFEF;
      
    }
.messages__wrapper .messages.messages--warning {
      --color--message: #F29D00;
      --color--message-background: #FEF6E6;
    }
.messages__wrapper .messages.messages--status {
      --color--message-background: #DFEAD1; 
    }