.Toastify {
  .Toastify__toast {
    --theme-color: var(--highlight-500);
  }
  .Toastify__toast--error {
    --theme-color: var(--bad-300);
  }
  .Toastify__toast--success {
    --theme-color: var(--guud-500);
  }
  .Toastify__toast {
    border-radius: 0;
    padding: 1rem;
    padding-inline-start: 0.25rem;
    box-shadow: 0 10px 15px 0 rgba(0, 0, 0, 0.33);
    overflow: visible;
  }
  .Toastify__toast:after {
    top: 20%;
    left: -2px;
    width: 2px;
    height: 60%;
    background: rgb(var(--theme-color));
  }
  .Toastify__toast:after,
  .Toastify__toast:before {
    content: "";
    display: block;
    position: absolute;
    pointer-events: none;
  }
  .Toastify__toast:before {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(
      90deg,
      rgba(var(--theme-color) / 0.06) 0,
      rgba(var(--theme-color) / 0) 40%
    );
  }
  .Toastify__toast-body {
    padding: 0;
  }
  .Toastify__toast-icon {
    display: static;
    margin: 1.5rem !important;
    width: 1.5rem !important;
    height: 1.5rem;
  }
  .Toastify__toast-icon svg {
    position: relative;
  }
  .Toastify__toast-icon:before {
    content: "";
    display: block;
    position: absolute;
    border-radius: 50%;
    top: -0.5rem;
    left: -0.5rem;
    width: 2.5rem;
    height: 2.5rem;
    background: rgba(var(--brand-white) / 0.03);
  }
  .Toastify__close-button {
    width: 1rem;
    height: 1rem;
  }
  .Toastify__close-button > svg {
    width: 1rem;
    height: 1rem;
    fill: rgb(var(--brand-white));
  }
}
