/* ----- TOAST NOTIFICATION STYLES (bottom-right, auto-hide) ----- */
  .toast-container {
      position: fixed;
      /* bottom: 0.3rem; */
      top: 8rem !important;
      right: 0 !important;
      z-index: 99999999;
      display: flex;
      flex-direction: column-reverse;
      gap: 0.75rem;
      align-items: flex-end;
      pointer-events: none;
      /* allow clicking through container, but toasts themselves capture pointer */
  }

  .toast {
      border: none !important;
      pointer-events: auto;
      min-width: 300px;
      max-width: 360px;
      background-color: white !important;
      border-radius: 0.75rem;
      box-shadow: 0 20px 35px -12px rgba(0, 0, 0, 0.2), 0 1px 3px rgba(0, 0, 0, 0.05);
      padding: 0.9rem 1rem;
      display: flex;
      align-items: center;
      gap: 0.75rem;
      backdrop-filter: blur(8px);
      background: rgba(255, 255, 255, 0.96) !important;
      border-left: 5px solid !important;
      transition: all 0.3s cubic-bezier(0.2, 0.9, 0.4, 1.1);
      transform: translateX(0) !important;
      opacity: 1 !important;
      animation: slideInRight 0.25s ease forwards;
      cursor: pointer;
      margin-bottom: 0px !important;
	  font-size: small;
	  height: 55px;
  }

  /* hide animation (when dismissed or auto-hide) */
  .toast-hide {
      animation: slideOutRight 0.2s ease forwards !important;
  }

  @keyframes slideInRight {
      from {
          opacity: 0;
          transform: translateX(40px);
      }

      to {
          opacity: 1;
          transform: translateX(0);
      }
  }

  @keyframes slideOutRight {
      to {
          opacity: 0;
          transform: translateX(60px);
          visibility: hidden;
      }
  }

  /* icon & text */
  .toast-icon {
      flex-shrink: 0;
      width: 24px;
      height: 24px;
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: 999px;
      font-weight: 700;
      /* font-size: 1.1rem; */
  }

  .toast-content {
      flex: 1;
      /* font-size: 0.875rem; */
      line-height: 1.4;
      color: #0f172a;
      font-weight: 500;
      word-break: break-word;
  }

  .toast-close {
      background: none;
      border: none;
      /* font-size: 1.2rem; */
      cursor: pointer;
      color: #94a3b8;
      padding: 0;
      margin: 0;
      line-height: 1;
      font-weight: 500;
      transition: color 0.1s;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 22px;
      height: 22px;
      border-radius: 999px;
  }

  .toast-close:hover {
      color: #1e293b;
      background: #eef2ff;
  }

  /* variant border colors & small accent */
  .toast-success {
      border-left-color: #10b981 !important;
  }

  .toast-success .toast-icon {
      background: #d1fae5 !important;
      color: #047857 !important;
  }

  .toast-error {
      border-left-color: #ef4444 !important;
  }

  .toast-error .toast-icon {
      background: #fee2e2 !important;
      color: #b91c1c !important;
  }

  .toast-warning {
      border-left-color: #f59e0b !important;
  }

  .toast-warning .toast-icon {
      background: #fef3c7 !important;
      color: #b45309 !important;
  }

  .toast-info {
      border-left-color: #3b82f6 !important;
  }

  .toast-info .toast-icon {
      background: #dbeafe !important;
      color: #1e40af !important;
  }

  /* responsive tweaks */
  /* @media (max-width: 480px) {
      .toast-container {
          bottom: 1rem;
          right: 1rem;
          left: 1rem;
          align-items: stretch;
      }

      .toast {
          max-width: none;
          width: auto;
          min-width: 0;
      }
  } */