<?php $__env->startSection('title', 'جميع المستخدمين — مراسلات'); ?>
<?php $__env->startSection('page-title', 'المستخدمون والصلاحيات'); ?>
<?php $__env->startSection('breadcrumb', 'رئيسي / المستخدمون'); ?>

<?php $__env->startSection('styles'); ?>
<style>
  :root{
    --teal:#00b09b;--teal-dk:#008f7a;--teal-lt:rgba(0,176,155,.10);
    --blue:#1a8fff;--blue-lt:rgba(26,143,255,.10);
    --red:#e74c3c;--red-lt:rgba(231,76,60,.10);
    --gold:#f5a623;--gold-lt:rgba(245,166,35,.10);
    --purple:#7c6fcd;--purple-lt:rgba(124,111,205,.10);
    --green:#28d094;--green-lt:rgba(40,208,148,.10);
    --text:#2c3e50;--text-mid:#546e7a;--muted:#90a4ae;
    --border:#e0e7ef;--white:#fff;--bg:#f0f3f8;
    --sh:0 2px 10px rgba(0,0,0,.07);--sh-md:0 4px 20px rgba(0,0,0,.09);
  }

  .breadcrumb-bar{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted);margin-bottom:18px}
  .breadcrumb-bar a{color:var(--teal);text-decoration:none;font-weight:600}
  .pg-hdr{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;flex-wrap:wrap;gap:10px}
  .pg-hdr-l h1{font-size:20px;font-weight:900;color:var(--text)}
  .pg-hdr-l .sub{font-size:11.5px;color:var(--muted);margin-top:3px}
  .btn-p{display:inline-flex;align-items:center;gap:6px;padding:10px 18px;background:var(--teal);color:#fff;border:none;border-radius:10px;font-family:'Cairo',sans-serif;font-size:13px;font-weight:700;cursor:pointer;text-decoration:none;box-shadow:0 4px 14px rgba(0,176,155,.28);transition:background .16s,transform .14s}
  .btn-p:hover{background:var(--teal-dk);transform:translateY(-1px)}
  .btn-s{display:inline-flex;align-items:center;gap:6px;padding:9px 14px;background:var(--white);color:var(--text-mid);border:1.5px solid var(--border);border-radius:10px;font-family:'Cairo',sans-serif;font-size:13px;font-weight:600;cursor:pointer;text-decoration:none;transition:background .16s}
  .btn-s:hover{background:var(--bg)}

  /* stats */
  .stats-row{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:20px}
  .mini-stat{background:var(--white);border:1px solid var(--border);border-radius:12px;padding:14px 16px;display:flex;align-items:center;gap:12px;box-shadow:var(--sh);transition:transform .2s,box-shadow .2s;animation:cIn .35s ease both}
  .mini-stat:hover{transform:translateY(-2px);box-shadow:var(--sh-md)}
  @keyframes cIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
  .ms-icon{width:42px;height:42px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}
  .ms-val{font-size:22px;font-weight:900;color:var(--text);line-height:1}
  .ms-lbl{font-size:11.5px;color:var(--muted);margin-top:2px}

  /* table card */
  .tbl-card{background:var(--white);border:1px solid var(--border);border-radius:14px;overflow:hidden;box-shadow:var(--sh);animation:cIn .4s .18s ease both}
  .tbl-toolbar{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border);flex-wrap:wrap;gap:12px}
  .tbl-title{font-size:14px;font-weight:800;color:var(--text);display:flex;align-items:center;gap:8px}
  .tbl-title i{color:var(--teal);font-size:17px}
  .tbl-count{background:var(--teal-lt);color:var(--teal);font-size:11px;font-weight:700;padding:2px 9px;border-radius:20px}
  .tbl-tools{display:flex;align-items:center;gap:8px}
  .search-w{position:relative}
  .search-w input{background:var(--bg);border:1.5px solid var(--border);border-radius:9px;padding:8px 36px 8px 12px;font-family:'Cairo',sans-serif;font-size:13px;color:var(--text);outline:none;width:210px;direction:rtl;transition:border-color .2s,box-shadow .2s}
  .search-w input:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(0,176,155,.15);background:var(--white)}
  .search-w input::placeholder{color:var(--muted)}
  .search-ico{position:absolute;right:11px;top:50%;transform:translateY(-50%);color:var(--muted);font-size:15px;pointer-events:none}

  /* table */
  .data-table{width:100%;border-collapse:collapse;font-size:13px}
  .data-table thead tr{background:var(--bg)}
  .data-table th{padding:12px 18px;text-align:right;color:var(--muted);font-size:11.5px;font-weight:700;border-bottom:1px solid var(--border);white-space:nowrap}
  .data-table th i{margin-left:4px;font-size:13px}
  .data-table td{padding:13px 18px;text-align:right;border-bottom:1px solid #f3f6fa;color:var(--text-mid);vertical-align:middle}
  .data-table tr:last-child td{border-bottom:none}
  .data-table tbody tr:hover td{background:#fafcff}

  .row-num{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:7px;background:var(--bg);border:1px solid var(--border);font-size:11.5px;font-weight:700;color:var(--muted)}

  /* user cell */
  .user-cell{display:flex;align-items:center;gap:12px}
  .u-av{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:800;color:#fff;flex-shrink:0;box-shadow:0 3px 10px rgba(0,0,0,.12)}
  .u-av.c0{background:linear-gradient(135deg,#00b09b,#008f7a)}
  .u-av.c1{background:linear-gradient(135deg,#1a8fff,#0066cc)}
  .u-av.c2{background:linear-gradient(135deg,#7c6fcd,#5a4db0)}
  .u-av.c3{background:linear-gradient(135deg,#f5a623,#d4880a)}
  .u-av.c4{background:linear-gradient(135deg,#28d094,#1a9a6e)}
  .u-name{font-size:13.5px;font-weight:700;color:var(--text)}
  .u-id{font-size:11px;color:var(--muted);margin-top:2px}

  /* email cell */
  .email-cell{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--text-mid)}
  .email-cell i{font-size:14px;color:var(--muted)}

  /* status badge */
  .status-badge{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:20px;font-size:11.5px;font-weight:700}
  .st-active{background:var(--green-lt);color:#1a7a5e}
  .st-active::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--green);flex-shrink:0}

  /* action btns */
  .act-btns{display:flex;align-items:center;gap:5px}
  .act-btn{width:30px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:14px;cursor:pointer;text-decoration:none;border:1px solid var(--border);background:var(--bg);transition:all .14s}
  .act-edit{color:var(--gold)}.act-edit:hover{background:var(--gold-lt);border-color:rgba(245,166,35,.3)}
  .act-del{color:var(--red)}.act-del:hover{background:var(--red-lt);border-color:rgba(231,76,60,.3)}

  /* empty */
  .empty-state{text-align:center;padding:60px 20px}
  .empty-icon{font-size:52px;color:#d0dce8;margin-bottom:14px}
  .empty-title{font-size:15px;font-weight:700;color:var(--text-mid);margin-bottom:6px}
  .empty-sub{font-size:13px;color:var(--muted);margin-bottom:20px}

  /* pagination */
  .pag-wrap{padding:14px 20px;border-top:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px}
  .pag-info{font-size:12px;color:var(--muted)}
  .pagination .page-link{font-family:'Cairo',sans-serif;font-size:12.5px;color:var(--text-mid);border-color:var(--border);border-radius:7px!important;margin:0 2px;padding:6px 12px;transition:all .14s}
  .pagination .page-item.active .page-link{background:var(--teal);border-color:var(--teal);color:#fff}
  .pagination .page-link:hover{background:var(--teal-lt);color:var(--teal);border-color:rgba(0,176,155,.3)}

  /* swal */
  .swal-modal{font-family:'Cairo',sans-serif!important;direction:rtl;border-radius:16px!important}
  .swal-title,.swal-text{font-family:'Cairo',sans-serif!important}
  .swal-button--confirm{background:var(--red)!important;border-radius:9px!important;font-family:'Cairo',sans-serif!important}
  .swal-button--cancel{border-radius:9px!important;font-family:'Cairo',sans-serif!important}

  @media(max-width:700px){.stats-row{grid-template-columns:1fr 1fr}.search-w input{width:150px}}
</style>
<?php $__env->stopSection(); ?>

<?php $__env->startSection('content'); ?>

<div class="breadcrumb-bar">
  <a href="<?php echo e(route('admin.dashboard')); ?>"><i class="las la-home"></i> الرئيسية</a>
  <i class="las la-angle-left" style="font-size:10px"></i>
  <span>جميع المستخدمين</span>
</div>

<div class="pg-hdr">
  <div class="pg-hdr-l">
    <h1>جميع المستخدمين</h1>
    <div class="sub">إدارة حسابات المستخدمين والصلاحيات</div>
  </div>
  <a href="<?php echo e(route('users.create')); ?>" class="btn-p">
    <i class="las la-user-plus"></i> إضافة مستخدم
  </a>
</div>

<!-- stats -->
<div class="stats-row">
  <div class="mini-stat">
    <div class="ms-icon" style="background:var(--teal-lt);color:var(--teal)"><i class="las la-users"></i></div>
    <div>
      <div class="ms-val"><?php echo e($index->total() ?? $index->count()); ?></div>
      <div class="ms-lbl">إجمالي المستخدمين</div>
    </div>
  </div>
  <div class="mini-stat" style="animation-delay:.07s">
    <div class="ms-icon" style="background:var(--green-lt);color:var(--green)"><i class="las la-user-check"></i></div>
    <div>
      <div class="ms-val"><?php echo e($activeCount ?? $index->count()); ?></div>
      <div class="ms-lbl">المستخدمون النشطون</div>
    </div>
  </div>
  <div class="mini-stat" style="animation-delay:.14s">
    <div class="ms-icon" style="background:var(--blue-lt);color:var(--blue)"><i class="las la-calendar-day"></i></div>
    <div>
      <div class="ms-val"><?php echo e($newThisMonthCount ?? '—'); ?></div>
      <div class="ms-lbl">مضافون هذا الشهر</div>
    </div>
  </div>
</div>

<!-- table card -->
<div class="tbl-card">
  <div class="tbl-toolbar">
    <div class="tbl-title">
      <i class="las la-list"></i>
      قائمة المستخدمين
      <span class="tbl-count"><?php echo e($index->total() ?? $index->count()); ?> مستخدم</span>
    </div>
    <div class="tbl-tools">
      <div class="search-w">
        <input type="text" placeholder="بحث بالاسم أو البريد..." oninput="filterTable(this.value)">
        <i class="las la-search search-ico"></i>
      </div>
      <a href="<?php echo e(route('users.create')); ?>" class="btn-s"><i class="las la-plus"></i> جديد</a>
    </div>
  </div>

  <div style="overflow-x:auto">
    <table class="data-table" id="usersTable">
      <thead>
        <tr>
          <th><i class="las la-hashtag"></i> ت</th>
          <th><i class="las la-user"></i> المستخدم</th>
          <th><i class="las la-envelope"></i> البريد الإلكتروني</th>
          <th><i class="las la-layer-group"></i>القسم</th>
                    <th><i class="las la-circle"></i> الحالة</th>

          <th><i class="las la-calendar"></i> تاريخ الإنشاء</th>
          <th><i class="las la-cog"></i> الإجراءات</th>
        </tr>
      </thead>
      <tbody>
        <?php $__empty_1 = true; $__currentLoopData = $index; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $i): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); $__empty_1 = false; ?>
        <?php $c = ['c0','c1','c2','c3','c4'][$loop->iteration % 5]; ?>
        <tr>
          <td><span class="row-num"><?php echo e($loop->iteration); ?></span></td>

          <td>
            <div class="user-cell">
              <div class="u-av <?php echo e($c); ?>"><?php echo e(mb_substr($i->name, 0, 1)); ?></div>
              <div>
                <div class="u-name"><?php echo e($i->name); ?></div>
                <div class="u-id"><i class="las la-hashtag" style="font-size:10px"></i> <?php echo e($i->id); ?></div>
              </div>
            </div>
          </td>

          <td>
            <div class="email-cell">
              <i class="las la-envelope"></i>
              <?php echo e($i->email); ?>

            </div>
          </td>

          <td>
            <span class="status-badge st-active">نشط</span>
          </td>
     <td>
  <div class="groups-cell">
    <?php $__empty_2 = true; $__currentLoopData = $i->groups; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $group): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); $__empty_2 = false; ?>
      <span class="group-tag">
        <i class="las la-layer-group" style="font-size:10px"></i>
        <?php echo e($group->name); ?>

      </span>
    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); if ($__empty_2): ?>
      <span class="no-group"> </span>
    <?php endif; ?>
  </div>
</td>

          <td>
            <span style="font-size:12px;color:var(--text-mid);display:flex;align-items:center;gap:5px">
              <i class="las la-calendar" style="color:var(--muted);font-size:13px"></i>
              <?php echo e($i->created_at ? $i->created_at->format('Y/m/d') : '—'); ?>

            </span>
          </td>

          <td>
            <div class="act-btns">
              <a href="<?php echo e(route('users.edit', $i->id)); ?>" class="act-btn act-edit" title="تعديل">
                <i class="las la-edit"></i>
              </a>
              <button onclick="DeleteRow(event, <?php echo e($i->id); ?>)" class="act-btn act-del" title="حذف">
                <i class="las la-trash"></i>
              </button>
            </div>
          </td>
        </tr>
        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); if ($__empty_1): ?>
        <tr>
          <td colspan="6">
            <div class="empty-state">
              <div class="empty-icon"><i class="las la-users"></i></div>
              <div class="empty-title">لا يوجد مستخدمون بعد</div>
              <div class="empty-sub">ابدأ بإضافة أول مستخدم للنظام</div>
              <a href="<?php echo e(route('users.create')); ?>" class="btn-p" style="display:inline-flex">
                <i class="las la-user-plus"></i> إضافة مستخدم
              </a>
            </div>
          </td>
        </tr>
        <?php endif; ?>
      </tbody>
    </table>
  </div>

  <?php if($index->hasPages()): ?>
  <div class="pag-wrap">
    <div class="pag-info">
      عرض <?php echo e($index->firstItem()); ?> — <?php echo e($index->lastItem()); ?> من <?php echo e($index->total()); ?> مستخدم
    </div>
    <?php echo e($index->links('pagination::bootstrap-4')); ?>

  </div>
  <?php endif; ?>
</div>

<?php $__env->stopSection(); ?>

<?php $__env->startSection('scripts'); ?>
<script src="https://cdn.jsdelivr.net/npm/sweetalert/dist/sweetalert.min.js"></script>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
  function DeleteRow(event, id) {
    event.preventDefault();
    swal({
      title: "هل أنت متأكد من الحذف؟",
      text: "سيتم حذف حساب المستخدم نهائياً ولا يمكن التراجع",
      icon: "warning", dangerMode: true,
      buttons: {
        cancel: { text: "إلغاء", visible: true, closeModal: true },
        confirm: { text: "نعم، حذف", visible: true, closeModal: false }
      }
    }).then(ok => {
      if (ok) {
        $.ajax({
          url: `/admin/users/${id}`,
          type: 'POST',
          data: { _method: 'DELETE', _token: '<?php echo e(csrf_token()); ?>' },
          success: () => swal("تم الحذف!", "تم حذف المستخدم بنجاح", "success").then(() => location.reload()),
          error:   () => swal("خطأ!", "حدث خطأ أثناء الحذف", "error")
        });
      }
    });
  }

  function filterTable(val) {
    const q = val.trim().toLowerCase();
    document.querySelectorAll('#usersTable tbody tr').forEach(r => {
      r.style.display = !q || r.textContent.toLowerCase().includes(q) ? '' : 'none';
    });
  }
</script>
<?php $__env->stopSection(); ?>
<?php echo $__env->make('admin.layouts.app', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?><?php /**PATH /home/gamcoiraq/sctl.gamcoiraq.com/resources/views/admin/permit_Users/index.blade.php ENDPATH**/ ?>