.notifications_container {
    position: fixed;
    bottom: 0;
    right: 0;  
    margin: 1em;
    display: grid;
    gap: 0.5em;
    z-index: 10;
  }
  .notification {
    border-radius: 100vw;  
    padding: 0.4em;
    background-color: var(--red_default);
    min-height: 1.5em;
    display: flex;
    gap: 1em;
    justify-content: space-between;
    align-items: center;
  
  }
  .loading_box {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 1.5em;
      width: 1.5em;
      
  }
      
  .loading_container {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    width: 100%;
    object-fit: contain;
  
    
  }
  .loading {
      --tickness: 3px;
      position: absolute;
      height: 95%;
      width: 95%;
      aspect-ratio: 1/1;
      
      cursor: progress;
      position: relative;
      
      border-radius: 100vw;
      border-top: var(--tickness) solid var(--white);
      border-bottom: var(--tickness) solid transparent;
      border-left: var(--tickness) solid var(--white);
      border-right: var(--tickness) solid transparent;
    
      animation: loading 1s linear infinite;
    }
    @keyframes loading {
      0% {
        transform: rotate(0deg);
       
      
      }
     
      100% {
        transform: rotate(360deg);
        
      }
    }
    .lds-ring {
      /* change color here */
      color: #ffffff
    }
    .lds-ring,
    .lds-ring div {
      box-sizing: border-box;
    }
    .lds-ring {
      display: inline-block;
      position: relative;
      width: 40px;
      height: 40px;
    }
    .lds-ring div {
      box-sizing: border-box;
      display: block;
      position: absolute;
      width: 32px;
      height: 32px;
      margin: 4px;
      border: 4px solid currentColor;
      border-radius: 50%;
      animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
      border-color: currentColor transparent transparent transparent;
    }
    .lds-ring div:nth-child(1) {
      animation-delay: -0.45s;
    }
    .lds-ring div:nth-child(2) {
      animation-delay: -0.3s;
    }
    .lds-ring div:nth-child(3) {
      animation-delay: -0.15s;
    }
    @keyframes lds-ring {
      0% {
        transform: rotate(0deg);
      }
      100% {
        transform: rotate(360deg);
      }
    }