<div class="confluence-output" style="max-width: 1000px; margin: 0 auto; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; line-height: 1.8; color: #172B4D; direction: rtl; text-align: right;">

  <!-- DIV 1: Header -->
  <div style="background: linear-gradient(135deg, #00875A, #006644); color: #ffffff; text-align: center; padding: 25px 20px; border-radius: 8px; margin-bottom: 24px; box-shadow: 0 1px 3px rgba(9,30,66,0.13);">
    <h1 style="margin: 0; font-size: 26px; font-weight: bold; color: #ffffff;">سام یار</h1>
    <p style="margin: 8px 0 0; font-size: 14px; color: #E3FCEF; opacity: 0.9;">سامانه ارسال صورتحساب به سامانه مودیان</p>
  </div>

  <!-- DIV 2: Main Content -->
  <div style="background: #ffffff; border: 1px solid #DFE1E6; border-radius: 8px; padding: 24px; margin-bottom: 24px; box-shadow: 0 1px 3px rgba(9,30,66,0.05);">

    <h2 style="color: #006644; border-bottom: 2px solid #E3FCEF; padding-bottom: 10px; margin-top: 0; font-size: 22px;">
      نسخه‌ها و تغییرات
    </h2>

    <p style="color: #42526E; margin-top: 12px; font-size: 15px;">
      این صفحه برای ثبت تاریخچه توسعه سام‌یار تهیه شده است. در این بخش، نسخه‌های مهم سامانه و ماژول‌های اصلی آن
      به‌صورت خلاصه اما کاربردی معرفی شده‌اند تا مشخص باشد هر بخش در چه مسیری بهبود پیدا کرده و چه نقشی در
      تکمیل تجربه کاربری و پایداری سامانه داشته است.
    </p>

    <div style="background: #F4F5F7; border: 1px solid #DFE1E6; border-radius: 6px; padding: 16px; margin: 20px 0;">
      <strong style="display: block; margin-bottom: 10px; color: #172B4D;">نسخه‌های ثبت‌شده</strong>
      <ul style="margin: 0; padding-right: 20px; color: #42526E; font-size: 14px;">
        <li style="margin-bottom: 6px;"><strong>divsaamyar:1.3</strong></li>
        <li style="margin-bottom: 6px;"><strong>inbox:1.1</strong></li>
        <li style="margin-bottom: 6px;"><strong>back:1.3</strong></li>
        <li style="margin-bottom: 6px;"><strong>outbox:1.2</strong></li>
      </ul>
    </div>

    <div style="margin-bottom: 18px; padding: 16px; border-right: 5px solid #00875A; background: #E3FCEF; border-radius: 5px;">
      <strong style="color: #006644;">روایت کلی تغییرات</strong>
      <p style="margin: 6px 0 0; color: #172B4D;">
        سام‌یار از ابتدا با هدف ساده‌سازی فرآیندهای مرتبط با سامانه مودیان طراحی شد، اما در مسیر توسعه،
        تمرکز اصلی روی سه موضوع باقی ماند: سریع‌تر شدن کار با سیستم، شفاف‌تر شدن وضعیت داده‌ها، و
        مطمئن‌تر شدن تبادل اطلاعات بین بخش‌های داخلی و بیرونی سامانه.
      </p>
    </div>

    <div style="display: flex; flex-wrap: wrap; gap: 16px; margin-bottom: 20px;">
      <div style="flex: 1; min-width: 220px; background: #FAFBFC; border: 1px solid #DFE1E6; border-radius: 6px; padding: 16px;">
        <h3 style="margin: 0 0 8px; color: #0747A6; font-size: 17px;">divsaamyar:1.3</h3>
        <p style="margin: 0; color: #42526E; font-size: 14px;">
          این نسخه، نمای اصلی سام‌یار را به نقطه‌ای رساند که کاربر بتواند با حداقل سردرگمی، مسیرهای اصلی سیستم را پیدا کند.
          در این بخش تمرکز بر نظم صفحه، دسترسی سریع‌تر به عملیات کلیدی، و یکپارچه‌تر شدن تجربه کاربری بوده است.
        </p>
      </div>

      <div style="flex: 1; min-width: 220px; background: #FAFBFC; border: 1px solid #DFE1E6; border-radius: 6px; padding: 16px;">
        <h3 style="margin: 0 0 8px; color: #00875A; font-size: 17px;">inbox:1.1</h3>
        <p style="margin: 0; color: #42526E; font-size: 14px;">
          ماژول <strong>inbox</strong> برای مدیریت ورودی‌ها، دریافت داده‌ها، و مشاهده وضعیت موارد دریافتی اهمیت زیادی دارد.
          در نسخه 1.1 تلاش شده ساختار نمایش ورودی‌ها خواناتر شود، وضعیت‌ها واضح‌تر دیده شوند، و کاربر بتواند سریع‌تر
          تشخیص دهد هر آیتم در چه مرحله‌ای قرار دارد.
        </p>
      </div>

      <div style="flex: 1; min-width: 220px; background: #FAFBFC; border: 1px solid #DFE1E6; border-radius: 6px; padding: 16px;">
        <h3 style="margin: 0 0 8px; color: #403294; font-size: 17px;">back:1.3</h3>
        <p style="margin: 0; color: #42526E; font-size: 14px;">
          بخش <strong>back</strong> هسته پردازشی و منطقی سام‌یار را شکل می‌دهد. این نسخه روی پایداری بیشتر،
          اجرای مطمئن‌تر پردازش‌ها، و آماده‌سازی بهتر سرویس برای ارتباط با اجزای دیگر سامانه متمرکز بوده است.
          به زبان ساده، این بخش کمک می‌کند ستون فقرات سامانه محکم‌تر و قابل‌اعتمادتر باشد.
        </p>
      </div>

      <div style="flex: 1; min-width: 220px; background: #FAFBFC; border: 1px solid #DFE1E6; border-radius: 6px; padding: 16px;">
        <h3 style="margin: 0 0 8px; color: #BF2600; font-size: 17px;">outbox:1.2</h3>
        <p style="margin: 0; color: #42526E; font-size: 14px;">
          ماژول <strong>outbox</strong> مسئول خروجی‌ها، ارسال‌ها و کنترل جریان اطلاعاتی است که از سام‌یار
          به بیرون منتقل می‌شود. در این نسخه، تمرکز بر منظم‌تر شدن ارسال‌ها، شفاف‌تر شدن وضعیت خروجی‌ها،
          و کاهش ابهام در روند تحویل داده‌ها بوده است.
        </p>
      </div>
    </div>

    <div style="border: 1px solid #DFE1E6; border-radius: 6px; overflow: hidden;">
      <table style="width: 100%; border-collapse: collapse; font-size: 14px;">
        <thead>
          <tr style="background: #F4F5F7; color: #172B4D;">
            <th style="padding: 12px; border-bottom: 1px solid #DFE1E6; text-align: right;">نسخه</th>
            <th style="padding: 12px; border-bottom: 1px solid #DFE1E6; text-align: right;">بخش</th>
            <th style="padding: 12px; border-bottom: 1px solid #DFE1E6; text-align: right;">خلاصه تغییر</th>
          </tr>
        </thead>
        <tbody>
          <tr>
            <td style="padding: 12px; border-bottom: 1px solid #DFE1E6;">divsaamyar:1.3</td>
            <td style="padding: 12px; border-bottom: 1px solid #DFE1E6;">داشبورد اصلی</td>
            <td style="padding: 12px; border-bottom: 1px solid #DFE1E6;">بهبود ساختار رابط کاربری و ساده‌تر شدن دسترسی به مسیرهای اصلی</td>
          </tr>
          <tr style="background: #FAFBFC;">
            <td style="padding: 12px; border-bottom: 1px solid #DFE1E6;">inbox:1.1</td>
            <td style="padding: 12px; border-bottom: 1px solid #DFE1E6;">ورودی‌ها</td>
            <td style="padding: 12px; border-bottom: 1px solid #DFE1E6;">شفاف‌تر شدن نمایش آیتم‌های دریافتی و بهبود تجربه بررسی ورودی‌ها</td>
          </tr>
          <tr>
            <td style="padding: 12px; border-bottom: 1px solid #DFE1E6;">back:1.3</td>
            <td style="padding: 12px; border-bottom: 1px solid #DFE1E6;">پردازش مرکزی</td>
            <td style="padding: 12px; border-bottom: 1px solid #DFE1E6;">افزایش پایداری، تقویت منطق پردازشی و آماده‌سازی بهتر برای توسعه‌های بعدی</td>
          </tr>
          <tr style="background: #FAFBFC;">
            <td style="padding: 12px;">outbox:1.2</td>
            <td style="padding: 12px;">خروجی‌ها</td>
            <td style="padding: 12px;">منظم‌تر شدن ارسال‌ها، کنترل بهتر وضعیت خروجی و کاهش خطاهای عملیاتی</td>
          </tr>
        </tbody>
      </table>
    </div>

    <div style="background: #FFF7E6; border-right: 5px solid #FF991F; padding: 16px; border-radius: 5px; margin-top: 20px;">
      <h3 style="margin: 0 0 8px; color: #974F0C; font-size: 18px;">جمع‌بندی</h3>
      <p style="margin: 0; color: #172B4D;">
        این نسخه‌ها نشان می‌دهند سام‌یار فقط یک ابزار ارسال نیست، بلکه یک سامانه در حال بلوغ است
        که هم در لایه رابط کاربری و هم در لایه پردازش و تبادل داده، به‌صورت تدریجی کامل‌تر شده است.
      </p>
    </div>

  </div>

  <!-- DIV 3: Home Link -->
  <div style="background: #ffffff; border: 1px solid #DFE1E6; border-radius: 8px; padding: 16px 24px; box-shadow: 0 1px 3px rgba(9,30,66,0.05); text-align: center;">
    <a href="#" style="display: inline-block; padding: 10px 30px; background: #0052CC; color: #ffffff; border-radius: 4px; text-decoration: none; font-weight: bold; font-size: 14px;">
       خانه
    </a>
  </div>

</div>