import React from 'react';

const WikiPage = () => {
  return (
    <div className="max-w-4xl mx-auto bg-white p-8">
      <article className="prose prose-lg max-w-none">
        <h1 className="text-3xl font-bold mb-4">מדד שמירת איש הקשר (תסמונת המספר החם)</h1>
        
        <div className="bg-gray-100 p-4 rounded-lg mb-6 text-right">
          <p className="font-bold mb-2">מידע כללי:</p>
          <p>תחום מחקר: פסיכולוגיה דיגיטלית</p>
          <p>שנת גילוי: 2007</p>
          <p>מכונה גם: סינדרום השמור לי ת'מספר</p>
        </div>

        <p className="text-right mb-6">
          <strong>מדד שמירת איש הקשר</strong> (בסלנג: "תסמונת המספר החם", "סינדרום השמור לי ת'מספר") 
          הוא תופעה פסיכו-חברתית שתועדה לראשונה בקרב משתמשי סמארטפונים הסובלים מחרדת FOMO 
          (Fear Of Missing Out on Phone numbers). התופעה מתארת את הדילמה הקיומית המתרחשת 
          כאשר אדם נאלץ להחליט האם הגיע הרגע לשדרג את הקשר עם זר לדרגת "איש קשר שמור".
        </p>

        <h2 className="text-2xl font-bold mb-4 text-right">סימפטומים נפוצים</h2>
        <div className="bg-blue-50 p-4 rounded-lg mb-6 text-right">
          <ul className="list-disc list-inside">
            <li className="mb-2"><strong>תסמונת הצ'אט הנצחי</strong> - המשך שיחה בפלטפורמה דיגיטלית ללא שמירת המספר</li>
            <li className="mb-2"><strong>חרדת המחיקה</strong> - פחד מכך שההודעות יימחקו לפני שמירת המספר</li>
            <li className="mb-2"><strong>פרנויית השם המלא</strong> - החשש משמירת מספר תחת שם שגוי</li>
            <li><strong>סינדרום ה'מי זה?'</strong> - קבלת הודעה ממספר לא מזוהה חודשיים אחרי</li>
          </ul>
        </div>

        <h2 className="text-2xl font-bold mb-4 text-right">שלבי קבלת ההחלטה</h2>
        <div className="grid grid-cols-1 md:grid-cols-2 gap-4 mb-6 text-right">
          {[
            "שלב ההיכרות - נחמד.ה, אבל אולי זה היה חד פעמי",
            "שלב ההתכתבות - וואלה, השיחה זורמת, אבל עדיין מוקדם",
            "שלב החפירה - אוקיי, יש פה פוטנציאל, אבל מה אם אני אתחרט?",
            "שלב הלחץ החברתי - רגע, כולם כבר שמרו את המספר שלו.ה חוץ ממני?!",
            "שלב ההכחשה - אני בטוח.ה שכבר שמרתי את המספר",
            "שלב הפאניקה - איפה המספר?! בטוח היה פה!",
            "שלב הכניעה - שמירת המספר תחת השם דני/דנה נחמד/ה מאתמול"
          ].map((stage, index) => (
            <div key={index} className="bg-gray-50 p-3 rounded">
              {stage}
            </div>
          ))}
        </div>

        <h2 className="text-2xl font-bold mb-4 text-right">מקרי קיצון מתועדים</h2>
        <div className="bg-yellow-50 p-4 rounded-lg mb-6 text-right">
          <ul className="list-disc list-inside">
            <li className="mb-2">שמירת מספר של שליח וואלט תחת השם "השליח הכי מתוק בתל אביב"</li>
            <li className="mb-2">סטודנטית ששמרה את המספר של הספרית שלה אחרי 4 שנים</li>
            <li>בחור שמחק בטעות את כל אנשי הקשר שלו והחליט ש"זה סימן משמיים"</li>
          </ul>
        </div>

        <h2 className="text-2xl font-bold mb-4 text-right">ראו גם</h2>
        <div className="bg-gray-50 p-4 rounded-lg text-right">
          <ul className="list-disc list-inside">
            <li className="mb-2">תסמונת ה"אני אשלח לך הודעה ברגע שאגיע הביתה"</li>
            <li className="mb-2">חרדת הסינון בוואטסאפ</li>
            <li className="mb-2">פרנויית ה"ראה" הכחול</li>
            <li>תסמונת ה"בוא נקבע" הכרונית</li>
          </ul>
        </div>
      </article>
    </div>
  );
};

export default WikiPage;