<div class="col-12 mb-4">
  <div class="modern-card notifications-card">
    <div class="card-header">
      <h3 class="card-title">
        <i class="fas fa-bell"></i>
        <?= !empty(lang('notifications')) ? lang('notifications') : "Notifications" ?>
      </h3>
      <span class="notification-count">3</span>
    </div>
    <div class="card-body">
      <div class="notifications-list">
        <div class="notification-item notification-unread">
          <div class="notification-icon notification-icon-success">
            <i class="fas fa-check-circle"></i>
          </div>
          <div class="notification-content">
            <p class="notification-text"><?= !empty(lang('new_order_received')) ? lang('new_order_received') : "New order received" ?></p>
            <span class="notification-time">2 <?= !empty(lang('minutes_ago')) ? lang('minutes_ago') : "minutes ago" ?></span>
          </div>
        </div>

        <div class="notification-item notification-unread">
          <div class="notification-icon notification-icon-info">
            <i class="fas fa-info-circle"></i>
          </div>
          <div class="notification-content">
            <p class="notification-text"><?= !empty(lang('package_expiring_soon')) ? lang('package_expiring_soon') : "Your package is expiring soon" ?></p>
            <span class="notification-time">1 <?= !empty(lang('day_ago')) ? lang('day_ago') : "day ago" ?></span>
          </div>
        </div>

        <div class="notification-item">
          <div class="notification-icon notification-icon-warning">
            <i class="fas fa-exclamation-circle"></i>
          </div>
          <div class="notification-content">
            <p class="notification-text"><?= !empty(lang('low_stock_alert')) ? lang('low_stock_alert') : "Some items are running low on stock" ?></p>
            <span class="notification-time">3 <?= !empty(lang('days_ago')) ? lang('days_ago') : "days ago" ?></span>
          </div>
        </div>
      </div>
    </div>
    <div class="card-footer">
      <a href="<?= base_url('admin/notifications') ?>" class="btn-view-all">
        <?= !empty(lang('view_all_notifications')) ? lang('view_all_notifications') : "View All Notifications" ?>
        <i class="fas fa-arrow-right"></i>
      </a>
    </div>
  </div>
</div>
