🔹 Alert در بوت‌استرپ برای نمایش پیام‌های مهم، خطاها، هشدارها یا اطلاع‌رسانی‌ها استفاده می‌شه.
این کامپوننت رنگ‌ها و استایل‌های مختلفی داره که بر اساس نوع پیام انتخاب می‌شن.

📌 1. ساخت یک Alert ساده

<div class="alert alert-primary" role="alert">
  این یک پیام نمونه با رنگ آبی (primary) است.
</div>

📌 2. انواع رنگ‌ها (Contextual Classes)

بوت‌استرپ برای Alert ها رنگ‌های مختلف داره:

<div class="alert alert-primary">Primary - پیام مهم</div>
<div class="alert alert-secondary">Secondary - پیام ساده</div>
<div class="alert alert-success">Success - عملیات موفق بود!</div>
<div class="alert alert-danger">Danger - خطا رخ داد!</div>
<div class="alert alert-warning">Warning - هشدار!</div>
<div class="alert alert-info">Info - فقط جهت اطلاع</div>
<div class="alert alert-light">Light - متن روشن</div>
<div class="alert alert-dark">Dark - متن تیره</div>

📌 3. لینک در Alert

می‌تونیم لینک داخل Alert بذاریم:

<div class="alert alert-success" role="alert">
  عملیات موفق بود! <a href="#" class="alert-link">جزئیات بیشتر</a>
</div>

📌 4. دکمه بستن (Dismissible Alert)

کاربر می‌تونه Alert رو ببنده:

<div class="alert alert-warning alert-dismissible fade show" role="alert">
  <strong>هشدار!</strong> این پیام قابل بستن است.
  <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>

📌 5. Alert با محتوای بیشتر (Heading و Paragraph)

<div class="alert alert-info" role="alert">
  <h4 class="alert-heading">توجه!</h4>
  <p>این یک پیام نمونه با عنوان و متن طولانی‌تر است.</p>
  <hr>
  <p class="mb-0">شما می‌توانید متن اضافه هم اینجا قرار دهید.</p>
</div>

✨ خلاصه:

• alert alert-color → ایجاد پیام

• alert-dismissible → امکان بستن

• می‌تونیم توش عنوان، متن، لینک و دکمه بذاریم