Added toast notification feature in index.html for user feedback on copy actions, including styles and animations for improved user experience.

index.html

@@ -283,6 +283,50 @@ sagi test sss
         color: #6366f1;
       }
 
+      /* Toast Notification Styles */
+      .toast-container {
+        position: fixed;
+        bottom: 20px;
+        right: 20px;
+        z-index: 9999;
+      }
+
+      .toast {
+        background: rgba(0, 0, 0, 0.8);
+        color: white;
+        padding: 12px 24px;
+        border-radius: 8px;
+        margin-top: 10px;
+        display: flex;
+        align-items: center;
+        gap: 8px;
+        animation: slideIn 0.3s ease-out, fadeOut 0.3s ease-out 2.7s;
+        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+      }
+
+      .toast i {
+        color: #4ade80;
+      }
+
+      @keyframes slideIn {
+        from {
+          transform: translateX(100%);
+          opacity: 0;
+        }
+        to {
+          transform: translateX(0);
+          opacity: 1;
+        }
+      }
+
+      @keyframes fadeOut {
+        from {
+          opacity: 1;
+        }
+        to {
+          opacity: 0;
+        }
+      }
     </style>
     <!-- Google tag (gtag.js) -->
     <script
@@ -2065,11 +2109,35 @@ sagi test sss
       function setupShareButtons() {
         const TOOLBOX_LINK = 'https://bit.ly/a-tools';
 
+        // Create toast container if it doesn't exist
+        if (!document.querySelector('.toast-container')) {
+          const toastContainer = document.createElement('div');
+          toastContainer.className = 'toast-container';
+          document.body.appendChild(toastContainer);
+        }
+
+        // Function to show toast
+        function showToast(message) {
+          const toastContainer = document.querySelector('.toast-container');
+          const toast = document.createElement('div');
+          toast.className = 'toast';
+          toast.innerHTML = `
+            <i class="fas fa-check-circle"></i>
+            <span>${message}</span>
+          `;
+          toastContainer.appendChild(toast);
+
+          // Remove toast after animation
+          setTimeout(() => {
+            toast.remove();
+          }, 3000);
+        }
+
         document.querySelectorAll('.share-btn').forEach((btn) => {
           btn.addEventListener('click', async () => {
             const platform = btn.dataset.platform;       // facebook | twitter | whatsapp | copy
             const toolUrl  = btn.dataset.url;            // קישור ישיר לכלי
-            const title    = btn.dataset.title;          // שם הכלי
+            const title    = btn.dataset.title || 'כלי AI';          // שם הכלי עם ברירת מחדל
 
             /* === טקסט שיתוף אחד לכל הערוצים === */
             const shareMsg =
@@ -2080,9 +2148,10 @@ sagi test sss
             if (platform === 'copy') {
               try {
                 await navigator.clipboard.writeText(shareMsg);
-                btn.setAttribute('data-tooltip', '📋 הועתק!');
-                setTimeout(() => btn.removeAttribute('data-tooltip'), 1500);
-              } catch { alert('לא הצלחנו להעתיק – נסה ידנית'); }
+                showToast('הטקסט הועתק בהצלחה! 📋');
+              } catch { 
+                alert('לא הצלחנו להעתיק – נסה ידנית'); 
+              }
               return;
             }
             if (platform === 'youtube') {