Toast

<div x-data="{ show: false }">
  <button class="btn btn-primary"
    @click="show = true; setTimeout(() => show = false, 3000)">
    Show Toast
  </button>

  <div class="toast-container top-right" x-show="show">
    <div class="toast">
      <span class="toast-icon">✓</span>
      <div class="toast-content">
        <div class="toast-title">Success</div>
        Changes saved successfully.
      </div>
      <button class="toast-dismiss" @click="show = false">✕</button>
    </div>
  </div>
</div>