backup: before cancel reservation feature on operator dashboard

CLAUDE.md

@@ -2,6 +2,42 @@
 
 ## Working Rules
 
+### Modal Close Button Must Be on the Far Left in RTL
+
+Bootstrap compiles `.modal-header .btn-close` with physical `margin-left: auto`, which in RTL pushes the × button to the right (next to the title text) instead of to the far left end of the header.
+
+**The fix is already applied globally** in the `[dir="rtl"]` block at the bottom of `app.scss`:
+```scss
+[dir="rtl"] .modal-header .btn-close {
+    margin-left: 0;
+    margin-right: auto;
+}
+```
+
+**Rule: never add inline styles or per-modal hacks to reposition the close button — the global fix handles it. Do not remove this override.**
+
+---
+
+### Never Open Links in a New Tab
+
+**Hard rule. Links must never use `target="_blank"` unless the user explicitly requests it.**
+
+- Remove `target="_blank"` and `rel="noopener"` from all `<a>` tags unless told otherwise.
+- This applies to every view, every layout, every page — no exceptions.
+
+---
+
+### Never Use JavaScript alert() / confirm() / prompt()
+
+**Hard rule. These native browser dialogs are ugly and break the UI.**
+
+- Never use `alert(...)`, `confirm(...)`, or `prompt(...)` anywhere in JavaScript.
+- For confirmations: build a Bootstrap modal with Cancel / Confirm buttons.
+- For success/error feedback: use a toast notification or an inline alert element.
+- This applies to every view, every page, every script — no exceptions.
+
+---
+
 ### Mandatory: Branch Before Every Change
 
 **This is a hard rule. Never modify any file without first creating a git branch and committing the current state.**

app/Http/Controllers/Admin/DashboardController.php

@@ -85,7 +85,8 @@ class DashboardController extends Controller
             'success' => true,
             'data' => [
                 'daily_bookings' => array_values($dates),
-                'top_parking_lots' => $topLots->map(fn($lot) => ['name' => $lot->name, 'value' => $lot->bookings_count])->toArray(),
+                'top_parking_lots' => $topLots->map(fn($lot) => ['id' => $lot->id, 'name' => $lot->name, 'value' => $lot->bookings_count])->toArray(),
+                'daily_dates'      => array_keys($dates),
                 'occupancy_trend' => $trend,
             ]
         ]);

app/Http/Controllers/Api/BookingController.php

@@ -20,6 +20,7 @@ class BookingController extends Controller
 
         $lot = \App\Models\ParkingLot::find($validated['parking_lot_id']);
         $validated['pricing_snapshot'] = $lot?->pricingSnapshot();
+        $validated['user_id'] = $request->user()->id;
 
         $booking = \App\Models\Booking::create($validated);
 
@@ -34,9 +35,17 @@ class BookingController extends Controller
 
     public function index(Request $request)
     {
-        $bookings = Booking::with('parkingLot')
+        $query = Booking::with('parkingLot')->latest();
-            ->latest()
+
-            ->paginate(10);
+        if ($request->filled('date')) {
+            $query->whereDate('created_at', $request->date);
+        }
+
+        if ($request->filled('parking_lot_id')) {
+            $query->where('parking_lot_id', $request->parking_lot_id);
+        }
+
+        $bookings = $query->paginate($request->integer('per_page', 10));
 
         return response()->json([
             'success' => true,

app/Http/Controllers/Operator/OperatorController.php

@@ -86,7 +86,7 @@ class OperatorController extends Controller
             'phone'            => $data['phone'] ?? null,
             'source'           => 'walk_in',
             'start_time'       => now(),
-            'end_time'         => now()->addHours($data['duration_hours']),
+            'end_time'         => now()->addHours((float) $data['duration_hours']),
             'status'           => 'active',
             'pricing_snapshot' => $lot->pricingSnapshot(),
         ]);

app/Http/Controllers/ProfileController.php

@@ -6,6 +6,7 @@ use Illuminate\Http\Request;
 use Illuminate\Support\Facades\Auth;
 use Illuminate\Support\Facades\Hash;
 use App\Models\Booking;
+use App\Models\ParkingLot;
 
 class ProfileController extends Controller
 {
@@ -16,13 +17,20 @@ class ProfileController extends Controller
 
     public function update(Request $request)
     {
-        $validated = $request->validateWithBag('updateName', [
+        $request->validateWithBag('updateName', [
             'name'          => 'required|string|max:255',
+            'phone_country' => 'required|string|max:10',
+            'phone_local'   => 'required|string|max:20',
+        ], [
+            'phone_local.required' => 'رقم الهاتف مطلوب.',
         ]);
 
-        Auth::user()->update(['name' => $validated['name']]);
+        Auth::user()->update([
+            'name'  => $request->name,
+            'phone' => $request->phone_country . $request->phone_local,
+        ]);
 
-        return back()->with('success', 'تم تحديث الاسم بنجاح.');
+        return back()->with('success', 'تم تحديث البيانات بنجاح.');
     }
 
     public function updatePassword(Request $request)
@@ -44,6 +52,48 @@ class ProfileController extends Controller
         return back()->with('success', 'تم تغيير كلمة السر بنجاح.');
     }
 
+    public function reserve(Request $request)
+    {
+        $user = Auth::user();
+
+        $request->validate([
+            'parking_lot_id' => 'required|exists:parking_lots,id',
+            'vehicle_plate'  => 'required|string|max:20',
+            'start_time'     => 'required|date|after:now',
+            'end_time'       => 'required|date|after:start_time',
+        ]);
+
+        $lot = ParkingLot::findOrFail($request->parking_lot_id);
+
+        // Check capacity
+        $active = $lot->carRegistries()->active()->count()
+                + $lot->bookings()->where('status', 'active')->count();
+        if ($active >= $lot->total_capacity) {
+            return response()->json([
+                'success' => false,
+                'message' => 'الموقف ممتلئ حالياً.',
+            ], 409);
+        }
+
+        $booking = Booking::create([
+            'user_id'          => $user->id,
+            'parking_lot_id'   => $lot->id,
+            'customer_name'    => $user->name,
+            'phone'            => $user->phone ?? '',
+            'vehicle_plate'    => $request->vehicle_plate,
+            'start_time'       => $request->start_time,
+            'end_time'         => $request->end_time,
+            'status'           => 'active',
+            'pricing_snapshot' => $lot->pricingSnapshot(),
+        ]);
+
+        return response()->json([
+            'success' => true,
+            'message' => 'تم الحجز بنجاح.',
+            'data'    => ['id' => $booking->id],
+        ], 201);
+    }
+
     public function dashboard()
     {
         $bookings = Booking::with('parkingLot')

app/Http/Requests/StoreBookingRequest.php

@@ -26,7 +26,8 @@ class StoreBookingRequest extends FormRequest
         return [
             'parking_lot_id' => 'required|exists:parking_lots,id',
             'customer_name'  => 'required|string|max:255',
-            'phone' => 'required|string|max:20|regex:/^09[0-9]{8}$/',
+            'phone'          => 'required|string|max:30',
+            'vehicle_plate'  => 'nullable|string|max:20',
             'start_time'     => 'required|date|after:now',
             'end_time'       => 'required|date|after:start_time',
         ];
@@ -35,13 +36,6 @@ class StoreBookingRequest extends FormRequest
     /**
      * Get custom messages for validator errors.
      */
-    public function messages(): array
-    {
-        return [
-            'phone.regex' => 'رقم الهاتف يجب أن يكون رقم سوري صالح (09xxxxxxxx).',
-        ];
-    }
-
     /**
      * Configure the validator after the validation rules have run.
      */

app/Models/User.php

@@ -21,6 +21,7 @@ class User extends Authenticatable
     protected $fillable = [
         'name',
         'email',
+        'phone',
         'password',
         'role',
     ];

bootstrap/app.php

@@ -13,6 +13,7 @@ return Application::configure(basePath: dirname(__DIR__))
     )
     ->withMiddleware(function (Middleware $middleware): void {
         $middleware->api(prepend: [
+            \Laravel\Sanctum\Http\Middleware\EnsureFrontendRequestsAreStateful::class,
             \Illuminate\Http\Middleware\TrustProxies::class,
         ]);
 

database/migrations/2026_04_16_000001_add_phone_to_users_table.php

@@ -0,0 +1,22 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    public function up(): void
+    {
+        Schema::table('users', function (Blueprint $table) {
+            $table->string('phone', 20)->nullable()->after('email');
+        });
+    }
+
+    public function down(): void
+    {
+        Schema::table('users', function (Blueprint $table) {
+            $table->dropColumn('phone');
+        });
+    }
+};

resources/css/app.scss

@@ -796,4 +796,12 @@ body {
         border-top-right-radius: 0 !important;
         border-bottom-right-radius: 0 !important;
     }
+
+    // Bootstrap compiles .modal-header .btn-close with physical margin-left:auto,
+    // which in RTL pushes the button to the right (next to the title).
+    // Swap it so the × always appears at the far LEFT end of the header.
+    .modal-header .btn-close {
+        margin-left: 0;
+        margin-right: auto;
+    }
 }

resources/js/bootstrap.js

@@ -5,3 +5,8 @@ import axios from 'axios';
 window.axios = axios;
 
 window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
+
+const csrfToken = document.querySelector('meta[name="csrf-token"]')?.getAttribute('content');
+if (csrfToken) {
+    window.axios.defaults.headers.common['X-CSRF-TOKEN'] = csrfToken;
+}

resources/views/admin/bookings/active.blade.php

@@ -307,7 +307,7 @@
                     <td class="text-center">
                         <button class="btn btn-sm fw-600"
                                 style="background:rgba(239,68,68,.1);color:#dc2626;border:none;border-radius:.5rem;font-family:'Cairo',sans-serif;padding:.35rem .9rem;"
-                                onclick="completeBooking({{ $booking->id }}, this)">
+                                onclick="askComplete({{ $booking->id }}, '{{ addslashes($booking->vehicle_plate ?? '—') }}', '{{ addslashes($booking->parkingLot->name) }}')">
                             <i class="bi bi-stop-circle me-1"></i>إنهاء
                         </button>
                     </td>
@@ -338,8 +338,57 @@
 
 </div>
 
+{{-- ── Confirm complete modal ───────────────────────────────────────────────── --}}
+<div class="modal fade" id="confirmCompleteModal" tabindex="-1" aria-hidden="true">
+    <div class="modal-dialog modal-dialog-centered" style="max-width:380px;">
+        <div class="modal-content" style="border:none;border-radius:1rem;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.15);">
+            <div style="background:linear-gradient(135deg,#dc2626,#ef4444);padding:1.25rem 1.5rem;">
+                <div class="d-flex align-items-center gap-3">
+                    <div style="width:44px;height:44px;background:rgba(255,255,255,.15);border-radius:.75rem;display:flex;align-items:center;justify-content:center;flex-shrink:0;">
+                        <i class="bi bi-stop-circle-fill" style="font-size:1.3rem;color:#fff;"></i>
+                    </div>
+                    <div class="flex-grow-1">
+                        <div class="fw-800" style="color:#fff;font-size:1rem;">إنهاء الحجز</div>
+                        <div class="text-xs mt-1" style="color:rgba(255,255,255,.75);">تأكيد تسجيل خروج السيارة</div>
+                    </div>
+                    <button type="button" class="btn-close btn-close-white flex-shrink-0" data-bs-dismiss="modal"></button>
+                </div>
+            </div>
+            <div class="p-4">
+                <div class="p-3 rounded-3 mb-4" style="background:#f8fafc;border:1px solid #f1f5f9;">
+                    <div class="d-flex justify-content-between align-items-center mb-2">
+                        <span class="text-xs fw-600" style="color:#64748b;">رقم اللوحة</span>
+                        <span class="fw-800" id="confirmPlate" style="font-family:monospace;font-size:1rem;color:#0f172a;letter-spacing:.05em;"></span>
+                    </div>
+                    <div class="d-flex justify-content-between align-items-center">
+                        <span class="text-xs fw-600" style="color:#64748b;">الموقف</span>
+                        <span class="fw-600 text-sm" id="confirmLot" style="color:#475569;"></span>
+                    </div>
+                </div>
+                <p class="text-sm mb-0" style="color:#64748b;text-align:center;">
+                    هل تريد إنهاء هذا الحجز وتسجيل خروج السيارة؟
+                </p>
+            </div>
+            <div class="px-4 pb-4 d-flex gap-2">
+                <button type="button" class="btn btn-sm fw-600"
+                        style="background:#f1f5f9;color:#475569;border:none;border-radius:.5rem;font-family:'Cairo',sans-serif;padding:.5rem 1rem;"
+                        data-bs-dismiss="modal">إلغاء</button>
+                <button type="button" id="confirmCompleteBtn"
+                        class="btn btn-sm fw-700 flex-grow-1"
+                        style="background:#ef4444;color:#fff;border:none;border-radius:.5rem;font-family:'Cairo',sans-serif;padding:.5rem;">
+                    <i class="bi bi-stop-circle me-1"></i>تأكيد الإنهاء
+                </button>
+            </div>
+        </div>
+    </div>
+</div>
+
+{{-- ── Toast ────────────────────────────────────────────────────────────────── --}}
+<div id="toastWrap" style="position:fixed;bottom:1.5rem;inset-inline-start:50%;transform:translateX(-50%);z-index:9999;pointer-events:none;"></div>
+
 @push('scripts')
 <script>
+// ── Filters ───────────────────────────────────────────────────────────────────
 function applyFilters() {
     const url    = new URL(window.location);
     const lot    = document.getElementById('lotFilter').value;
@@ -349,48 +398,88 @@ function applyFilters() {
     url.searchParams.delete('page');
     window.location.href = url.toString();
 }
-
 document.getElementById('lotFilter').addEventListener('change', applyFilters);
 document.getElementById('searchInput').addEventListener('keydown', e => {
     if (e.key === 'Enter') applyFilters();
 });
 
-async function completeBooking(id, btn) {
+// ── Toast ─────────────────────────────────────────────────────────────────────
-    if (!confirm('إنهاء هذا الحجز؟')) return;
+function showToast(msg, type = 'success') {
-    const orig = btn.innerHTML;
+    const color = type === 'success' ? '#10b981' : '#ef4444';
+    const icon  = type === 'success' ? 'bi-check-circle-fill' : 'bi-exclamation-triangle-fill';
+    const el = document.createElement('div');
+    el.style.cssText = `background:#0f172a;color:#f8fafc;padding:.65rem 1.25rem;border-radius:.625rem;font-size:.85rem;font-weight:600;box-shadow:0 4px 20px rgba(0,0,0,.25);display:flex;align-items:center;gap:.6rem;pointer-events:auto;margin-top:.5rem;`;
+    el.innerHTML = `<i class="bi ${icon}" style="color:${color};font-size:1rem;flex-shrink:0;"></i>${msg}`;
+    document.getElementById('toastWrap').appendChild(el);
+    setTimeout(() => { el.style.transition='opacity .4s'; el.style.opacity='0'; setTimeout(()=>el.remove(),400); }, 3500);
+}
+
+// ── Confirm complete modal ────────────────────────────────────────────────────
+let pendingId = null;
+let confirmModal = null;
+
+function getConfirmModal() {
+    if (!confirmModal) confirmModal = new bootstrap.Modal(document.getElementById('confirmCompleteModal'));
+    return confirmModal;
+}
+
+function askComplete(id, plate, lot) {
+    pendingId = id;
+    document.getElementById('confirmPlate').textContent = plate;
+    document.getElementById('confirmLot').textContent   = lot;
+    getConfirmModal().show();
+}
+
+document.getElementById('confirmCompleteBtn').addEventListener('click', async () => {
+    if (!pendingId) return;
+    const btn = document.getElementById('confirmCompleteBtn');
     btn.disabled = true;
-    btn.innerHTML = '<span class="spinner-border spinner-border-sm"></span>';
+    btn.innerHTML = '<span class="spinner-border spinner-border-sm me-1"></span>جاري الإنهاء...';
+
     try {
-        const res  = await fetch(`/admin/bookings/${id}/complete`, {
+        const res  = await fetch(`/admin/bookings/${pendingId}/complete`, {
             method: 'POST',
             headers: {
                 'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').content,
-                'Content-Type': 'application/json'
+                'Content-Type': 'application/json',
             }
         });
         const data = await res.json();
+        getConfirmModal().hide();
         if (data.success) {
-            const row = document.getElementById('row-' + id);
+            const row = document.getElementById('row-' + pendingId);
+            if (row) {
                 row.style.transition = 'opacity .4s, transform .4s';
                 row.style.opacity    = '0';
                 row.style.transform  = 'translateX(20px)';
                 setTimeout(() => row.remove(), 420);
+            }
+            showToast('تم إنهاء الحجز بنجاح.');
         } else {
-            alert(data.message || 'خطأ');
+            showToast(data.message || 'حدث خطأ أثناء الإنهاء.', 'error');
-            btn.innerHTML = orig;
-            btn.disabled  = false;
         }
     } catch {
-        alert('خطأ في الاتصال');
+        getConfirmModal().hide();
-        btn.innerHTML = orig;
+        showToast('تعذّر الاتصال بالخادم. حاول مجدداً.', 'error');
+    } finally {
         btn.disabled = false;
+        btn.innerHTML = '<i class="bi bi-stop-circle me-1"></i>تأكيد الإنهاء';
+        pendingId = null;
     }
-}
+});
 
-// Countdown refresh
+// ── Auto-refresh (pauses while modal is open) ─────────────────────────────────
 let t = 30;
+let refreshPaused = false;
 const badge = document.getElementById('refresh-badge');
+
+document.querySelectorAll('.modal').forEach(m => {
+    m.addEventListener('show.bs.modal',   () => { refreshPaused = true; });
+    m.addEventListener('hidden.bs.modal', () => { refreshPaused = false; t = 30; });
+});
+
 setInterval(() => {
+    if (refreshPaused) return;
     t--;
     badge.textContent = `تحديث بعد ${t}ث`;
     if (t <= 0) location.reload();

resources/views/admin/dashboard.blade.php

@@ -74,7 +74,7 @@
                 </a>
             </div>
             <div class="col-lg-3 col-sm-6">
-                <div class="quick-card card h-100 p-4" onclick="alert('قريباً...')">
+                <div class="quick-card card h-100 p-4" style="cursor:default;">
                     <div class="quick-icon" style="background:rgba(100,116,139,.1);">
                         <i class="bi bi-gear" style="color:#64748b;"></i>
                     </div>

resources/views/admin/parking-lots/index.blade.php

@@ -485,10 +485,81 @@ $gradients = [
     </div>
 </div>
 
+{{-- Toggle Status Confirmation Modal --}}
+<div class="modal fade" id="toggleStatusModal" tabindex="-1" aria-hidden="true">
+    <div class="modal-dialog modal-dialog-centered" style="max-width:380px;">
+        <div class="modal-content border-0 shadow-lg" style="border-radius:16px;overflow:hidden;">
+            <div class="modal-header border-0 text-white" style="background:linear-gradient(135deg,#f59e0b,#d97706);">
+                <h6 class="modal-title fw-bold mb-0" style="font-family:'Cairo',sans-serif;">
+                    <i class="bi bi-toggle-on me-2"></i>تغيير حالة الموقف
+                </h6>
+                <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
+            </div>
+            <div class="modal-body text-center p-4">
+                <p class="mb-0 fw-600" style="color:#0f172a;font-family:'Cairo',sans-serif;">
+                    هل تريد تغيير حالة هذا الموقف؟
+                </p>
+            </div>
+            <div class="modal-footer border-0 pt-0 pb-4 px-4 gap-2">
+                <button type="button" class="btn btn-light flex-fill fw-600" style="font-family:'Cairo',sans-serif;border-radius:10px;"
+                        data-bs-dismiss="modal">إلغاء</button>
+                <button type="button" id="toggleStatusConfirmBtn"
+                        class="btn btn-warning flex-fill fw-bold text-white"
+                        style="font-family:'Cairo',sans-serif;border-radius:10px;">
+                    <i class="bi bi-check2 me-1"></i>تأكيد
+                </button>
+            </div>
+        </div>
+    </div>
+</div>
+
+{{-- Delete Lot Confirmation Modal --}}
+<div class="modal fade" id="deleteLotModal" tabindex="-1" aria-hidden="true">
+    <div class="modal-dialog modal-dialog-centered" style="max-width:420px;">
+        <div class="modal-content border-0 shadow-lg" style="border-radius:16px;overflow:hidden;">
+            <div class="modal-header border-0 text-white" style="background:linear-gradient(135deg,#dc2626,#991b1b);">
+                <h6 class="modal-title fw-bold mb-0" style="font-family:'Cairo',sans-serif;">
+                    <i class="bi bi-trash3 me-2"></i>حذف الموقف
+                </h6>
+                <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
+            </div>
+            <div class="modal-body text-center p-4">
+                <div class="mb-3" style="font-size:2.5rem;">⚠️</div>
+                <p class="fw-700 mb-1" style="color:#0f172a;font-family:'Cairo',sans-serif;">
+                    حذف "<span id="deleteLotName"></span>"
+                </p>
+                <p class="text-muted small mb-0">سيتم حذف جميع بيانات الموقف نهائياً ولا يمكن التراجع.</p>
+            </div>
+            <div class="modal-footer border-0 pt-0 pb-4 px-4 gap-2">
+                <button type="button" class="btn btn-light flex-fill fw-600" style="font-family:'Cairo',sans-serif;border-radius:10px;"
+                        data-bs-dismiss="modal">إلغاء</button>
+                <button type="button" id="deleteLotConfirmBtn"
+                        class="btn btn-danger flex-fill fw-bold"
+                        style="font-family:'Cairo',sans-serif;border-radius:10px;">
+                    <i class="bi bi-trash3 me-1"></i>حذف نهائياً
+                </button>
+            </div>
+        </div>
+    </div>
+</div>
+
 @push('scripts')
 <script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script>
 <script>
-window.onerror = (msg, src, line) => { alert('JS خطأ في السطر ' + line + ':\n' + msg); };
+// ── Toast helper ─────────────────────────────────────────────────────────
+function showToast(msg, type = 'success') {
+    const colors = { success:'#10b981', danger:'#ef4444', warning:'#f59e0b', info:'#3b82f6' };
+    const t = document.createElement('div');
+    t.style.cssText = `position:fixed;bottom:1.25rem;inset-inline-end:1.25rem;z-index:9999;
+        background:${colors[type]||colors.success};color:#fff;padding:.75rem 1.25rem;border-radius:10px;
+        font-family:'Cairo',sans-serif;font-size:.9rem;font-weight:600;
+        box-shadow:0 8px 24px rgba(0,0,0,.18);opacity:0;transition:opacity .25s;max-width:360px;`;
+    t.textContent = msg;
+    document.body.appendChild(t);
+    requestAnimationFrame(() => { t.style.opacity = '1'; });
+    setTimeout(() => { t.style.opacity = '0'; setTimeout(() => t.remove(), 300); }, 3500);
+}
+
 // ── Parking lots data from server ─────────────────────────────────────────
 const lotsData = @json($parkingLots->items());
 
@@ -591,7 +662,7 @@ function previewImage(input) {
 
 function editLot(id) {
     const lot = lotsData.find(l => l.id === id);
-    if (!lot) { alert('لم يتم العثور على بيانات الموقف'); return; }
+    if (!lot) { showToast('لم يتم العثور على بيانات الموقف', 'danger'); return; }
 
     editingId = id;
     document.getElementById('modalLabel').textContent  = 'تعديل: ' + lot.name;
@@ -632,12 +703,12 @@ async function saveLot() {
         if (result.success) {
             location.reload();
         } else if (result.errors) {
-            const msgs = Object.values(result.errors).flat().join('\n');
+            const msgs = Object.values(result.errors).flat().join(' — ');
-            alert(msgs);
+            showToast(msgs, 'danger');
         } else {
-            alert(result.message || 'خطأ في العملية');
+            showToast(result.message || 'خطأ في العملية', 'danger');
         }
-    } catch(err) { alert('خطأ في الاتصال: ' + err.message); }
+    } catch(err) { showToast('خطأ في الاتصال', 'danger'); }
     finally { setBtnLoading(false); }
 }
 
@@ -646,13 +717,26 @@ function setBtnLoading(on) {
     document.getElementById('submitSpinner').classList.toggle('d-none', !on);
 }
 
+let pendingToggleId = null;
+const toggleModal = new bootstrap.Modal(document.getElementById('toggleStatusModal'));
+
 function toggleStatus(id) {
-    if (!confirm('تغيير حالة الموقف؟')) return;
+    pendingToggleId = id;
-    fetch(`/admin/parking-lots/${id}/toggle`, {
+    toggleModal.show();
+}
+
+document.getElementById('toggleStatusConfirmBtn').addEventListener('click', async () => {
+    if (!pendingToggleId) return;
+    toggleModal.hide();
+    try {
+        const res  = await fetch(`/admin/parking-lots/${pendingToggleId}/toggle`, {
             method: 'POST',
             headers: { 'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').content }
-    }).then(r => r.json()).then(d => d.success ? location.reload() : alert(d.message));
+        });
-}
+        const d = await res.json();
+        d.success ? location.reload() : showToast(d.message || 'حدث خطأ', 'danger');
+    } catch { showToast('خطأ في الاتصال', 'danger'); }
+});
 
 document.getElementById('searchInput').addEventListener('keypress', e => {
     if (e.key === 'Enter') doSearch();
@@ -685,7 +769,7 @@ function openPricingModal(id, name) {
         updatePricingPreview();
         bootstrap.Modal.getOrCreateInstance(document.getElementById('pricingModal')).show();
     } catch(e) {
-        alert('خطأ في فتح نافذة التسعير:\n' + e.message);
+        showToast('خطأ في فتح نافذة التسعير', 'danger');
     }
 }
 
@@ -726,7 +810,7 @@ async function savePricing() {
     const base = parseFloat(document.getElementById('p_base').value);
 
     if (isNaN(base) || base < 0) {
-        alert('يرجى إدخال سعر أساسي صحيح');
+        showToast('يرجى إدخال سعر أساسي صحيح', 'warning');
         return;
     }
 
@@ -755,21 +839,33 @@ async function savePricing() {
             bootstrap.Modal.getInstance(document.getElementById('pricingModal'))?.hide();
             location.reload();
         } else {
-            alert(data.message || 'خطأ في الحفظ');
+            showToast(data.message || 'خطأ في الحفظ', 'danger');
         }
     } catch {
-        alert('خطأ في الاتصال');
+        showToast('خطأ في الاتصال', 'danger');
     } finally {
         document.getElementById('savePricingBtn').disabled = false;
         document.getElementById('pricingSpinner').classList.add('d-none');
     }
 }
 
-async function deleteLot(id, name) {
+let pendingDeleteId   = null;
-    if (!confirm(`حذف الموقف "${name}"؟\nسيتم حذف جميع بيانات الموقف نهائياً.`)) return;
+const deleteModal = new bootstrap.Modal(document.getElementById('deleteLotModal'));
 
+function deleteLot(id, name) {
+    pendingDeleteId = id;
+    document.getElementById('deleteLotName').textContent = name;
+    deleteModal.show();
+}
+
+document.getElementById('deleteLotConfirmBtn').addEventListener('click', async () => {
+    if (!pendingDeleteId) return;
+    const btn = document.getElementById('deleteLotConfirmBtn');
+    btn.disabled = true;
+    btn.innerHTML = '<span class="spinner-border spinner-border-sm me-1"></span>جاري الحذف...';
+    deleteModal.hide();
     try {
-        const res  = await fetch(`/admin/parking-lots/${id}`, {
+        const res  = await fetch(`/admin/parking-lots/${pendingDeleteId}`, {
             method: 'DELETE',
             headers: {
                 'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').content,
@@ -780,12 +876,16 @@ async function deleteLot(id, name) {
         if (data.success) {
             location.reload();
         } else {
-            alert(data.message || 'تعذّر الحذف');
+            showToast(data.message || 'تعذّر الحذف', 'danger');
+            btn.disabled = false;
+            btn.innerHTML = '<i class="bi bi-trash3 me-1"></i>حذف نهائياً';
         }
     } catch {
-        alert('خطأ في الاتصال');
+        showToast('خطأ في الاتصال', 'danger');
+        btn.disabled = false;
+        btn.innerHTML = '<i class="bi bi-trash3 me-1"></i>حذف نهائياً';
     }
-}
+});
 </script>
 @endpush
 

resources/views/auth/register.blade.php

@@ -45,6 +45,42 @@
         </div>
     </div>
 
+    <div class="mb-3">
+        <label class="form-label">رقم الهاتف</label>
+        @php
+        $countries = [
+            ['🇸🇾','سوريا','+963'],['🇸🇦','السعودية','+966'],['🇦🇪','الإمارات','+971'],
+            ['🇯🇴','الأردن','+962'],['🇱🇧','لبنان','+961'],['🇮🇶','العراق','+964'],
+            ['🇪🇬','مصر','+20'],['🇴🇲','عُمان','+968'],['🇶🇦','قطر','+974'],
+            ['🇰🇼','الكويت','+965'],['🇧🇭','البحرين','+973'],['🇾🇪','اليمن','+967'],
+            ['🇵🇸','فلسطين','+970'],['🇲🇦','المغرب','+212'],['🇩🇿','الجزائر','+213'],
+            ['🇹🇳','تونس','+216'],['🇱🇾','ليبيا','+218'],['🇸🇩','السودان','+249'],
+            ['🇹🇷','تركيا','+90'],['🇮🇷','إيران','+98'],['🇩🇪','ألمانيا','+49'],
+            ['🇫🇷','فرنسا','+33'],['🇬🇧','بريطانيا','+44'],['🇺🇸','أمريكا','+1'],
+            ['🇷🇺','روسيا','+7'],['🇨🇳','الصين','+86'],['🇮🇳','الهند','+91'],
+            ['🇦🇺','أستراليا','+61'],['🇮🇹','إيطاليا','+39'],['🇪🇸','إسبانيا','+34'],
+            ['🇧🇷','البرازيل','+55'],['🇵🇰','باكستان','+92'],['🇳🇬','نيجيريا','+234'],
+        ];
+        $oldCountry = old('phone_country', '+963');
+        @endphp
+        <div class="input-group @error('phone') is-invalid @enderror">
+            <input type="tel" name="phone_local" value="{{ old('phone_local') }}" required
+                   class="form-control @error('phone') is-invalid @enderror"
+                   style="border-color:#e2e8f0;"
+                   placeholder="912345678" dir="ltr">
+            <select name="phone_country" dir="ltr"
+                    style="max-width:130px;background:#f8fafc;border-color:#e2e8f0;color:#374151;font-family:'Cairo',sans-serif;font-size:.875rem;cursor:pointer;"
+                    class="form-select">
+                @foreach($countries as [$flag, $label, $code])
+                <option value="{{ $code }}" {{ $oldCountry === $code ? 'selected' : '' }}>
+                    {{ $flag }} {{ $code }}
+                </option>
+                @endforeach
+            </select>
+        </div>
+        @error('phone')<div class="invalid-feedback d-block">{{ $message }}</div>@enderror
+    </div>
+
     <div class="mb-3">
         <label class="form-label">كلمة السر</label>
         <div class="input-group">

resources/views/index.blade.php

@@ -218,6 +218,100 @@
         </div>
     </div>
 
+    {{-- ══ BOOKING FORM MODAL ══════════════════════════════════════════════════ --}}
+    <div class="modal fade" id="bookingModal" tabindex="-1" aria-hidden="true">
+        <div class="modal-dialog modal-dialog-centered" style="max-width:420px;">
+            <div class="modal-content" style="border:none;border-radius:1rem;overflow:hidden;">
+
+                {{-- Top banner: lot info --}}
+                <div style="background:linear-gradient(135deg,#0f172a,#1e3a5f);padding:1.25rem 1.5rem;">
+                    <div class="d-flex align-items-center gap-3">
+                        <div style="width:42px;height:42px;background:rgba(99,102,241,.25);border-radius:.625rem;display:flex;align-items:center;justify-content:center;flex-shrink:0;">
+                            <i class="bi bi-p-square-fill" style="color:#a5b4fc;font-size:1.2rem;"></i>
+                        </div>
+                        <div class="flex-grow-1 min-width-0">
+                            <div id="bookingLotName" class="fw-700 text-truncate" style="color:#f8fafc;font-size:.95rem;"></div>
+                            <div id="bookingLotMeta" class="text-xs mt-1" style="color:#94a3b8;"></div>
+                        </div>
+                        <button type="button" class="btn-close btn-close-white flex-shrink-0" data-bs-dismiss="modal"></button>
+                    </div>
+                </div>
+
+                {{-- Booker identity (read-only) --}}
+                <div style="background:#f8fafc;padding:.75rem 1.5rem;border-bottom:1px solid #f1f5f9;">
+                    <div class="d-flex align-items-center gap-2">
+                        <i class="bi bi-person-check-fill" style="color:#10b981;font-size:.95rem;"></i>
+                        <span class="text-xs fw-600" style="color:#475569;" id="bookingUserInfo"></span>
+                    </div>
+                </div>
+
+                <div class="p-4">
+                    {{-- Alert --}}
+                    <div id="bookingAlert" class="d-none mb-3"></div>
+
+                    <div class="row g-3">
+                        {{-- Plate number --}}
+                        <div class="col-12">
+                            <label class="form-label fw-600" style="font-size:.82rem;color:#374151;">
+                                <i class="bi bi-car-front me-1" style="color:#6366f1;"></i>
+                                رقم لوحة السيارة
+                            </label>
+                            <input type="text" id="bkPlate" class="form-control fw-700"
+                                   style="letter-spacing:.1em;text-transform:uppercase;font-size:1rem;text-align:center;"
+                                   placeholder="أ ب ج  1234" dir="ltr">
+                        </div>
+
+                        {{-- Date/time --}}
+                        <div class="col-6">
+                            <label class="form-label fw-600" style="font-size:.82rem;color:#374151;">
+                                <i class="bi bi-play-circle me-1" style="color:#10b981;"></i>
+                                من
+                            </label>
+                            <input type="datetime-local" id="bkStart" class="form-control" dir="ltr" style="font-size:.85rem;">
+                        </div>
+                        <div class="col-6">
+                            <label class="form-label fw-600" style="font-size:.82rem;color:#374151;">
+                                <i class="bi bi-stop-circle me-1" style="color:#ef4444;"></i>
+                                إلى
+                            </label>
+                            <input type="datetime-local" id="bkEnd" class="form-control" dir="ltr" style="font-size:.85rem;">
+                        </div>
+
+                        {{-- Price summary --}}
+                        <div class="col-12">
+                            <div id="bookingPriceSummary" style="background:#f0fdf4;border:1px solid #bbf7d0;border-radius:.625rem;padding:.875rem 1rem;">
+                                <div class="d-flex justify-content-between align-items-center mb-2">
+                                    <span class="text-xs" style="color:#64748b;">المدة</span>
+                                    <span class="fw-600 text-xs" id="bkDuration" style="color:#0f172a;">--</span>
+                                </div>
+                                <div class="d-flex justify-content-between align-items-center mb-2">
+                                    <span class="text-xs" style="color:#64748b;">السعر / ساعة</span>
+                                    <span class="fw-600 text-xs" id="bkHourlyRate" style="color:#0f172a;">--</span>
+                                </div>
+                                <div style="border-top:1px dashed #bbf7d0;margin:.5rem 0;"></div>
+                                <div class="d-flex justify-content-between align-items-center">
+                                    <span class="fw-700" style="color:#065f46;font-size:.85rem;">المبلغ الإجمالي</span>
+                                    <span class="fw-800" id="bkTotal" style="color:#059669;font-size:1.15rem;">--</span>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+                <div class="px-4 pb-4 d-flex gap-2">
+                    <button type="button" class="btn btn-sm fw-600"
+                            style="background:#f1f5f9;color:#475569;border:none;border-radius:.5rem;font-family:'Cairo',sans-serif;padding:.5rem 1rem;"
+                            data-bs-dismiss="modal">إلغاء</button>
+                    <button type="button" id="confirmBookingBtn"
+                            class="btn btn-sm fw-700 flex-grow-1"
+                            style="background:#10b981;color:#fff;border:none;border-radius:.5rem;font-family:'Cairo',sans-serif;padding:.5rem;">
+                        <i class="bi bi-check-lg me-1"></i>تأكيد الحجز
+                    </button>
+                </div>
+            </div>
+        </div>
+    </div>
+
     {{-- ══ MOBILE BOTTOM NAV ══════════════════════════════════════════════════ --}}
     <nav class="mobile-bottom-nav" aria-label="التنقل الرئيسي">
         <a href="#" class="mob-nav-item active" data-tab="list"
@@ -402,15 +496,138 @@
             getModal().show();
         }
 
+        // ── Auth state (from server) ──────────────────────────────────────────
+        const authUser = @auth {
+            id:    {{ auth()->id() }},
+            name:  {{ Js::from(auth()->user()->name) }},
+            phone: {{ Js::from(auth()->user()->phone ?? '') }}
+        } @else null @endauth;
+
         // ── Reserve ───────────────────────────────────────────────────────────
         document.getElementById('reserveBtn').addEventListener('click', () => {
             if (!current || current.avail <= 0) return;
-            alert(`تم حجز مكان في ${current.name}!\nالعنوان: ${current.address}\nالسعر: ${fmtPrice(current.price)} / ساعة`);
+
-            current.avail--;
+            if (!authUser) {
+                // Guest — redirect to login, come back after
+                window.location.href = '{{ route('login') }}';
+                return;
+            }
+
+            // Logged in — open booking form
             getModal().hide();
-            renderList(lots);
+            openBookingModal(current);
         });
 
+        // ── Booking modal ─────────────────────────────────────────────────────
+        let bookingModal = null;
+        function getBookingModal() {
+            if (!bookingModal) bookingModal = new bootstrap.Modal(document.getElementById('bookingModal'));
+            return bookingModal;
+        }
+
+        function toLocalInput(date) {
+            const pad = n => String(n).padStart(2, '0');
+            return `${date.getFullYear()}-${pad(date.getMonth()+1)}-${pad(date.getDate())}T${pad(date.getHours())}:${pad(date.getMinutes())}`;
+        }
+
+        function calcTotal() {
+            const start = document.getElementById('bkStart').value;
+            const end   = document.getElementById('bkEnd').value;
+            if (!start || !end || !current) return;
+            const diffMs   = new Date(end) - new Date(start);
+            if (diffMs <= 0) { resetPrice(); return; }
+            const hours    = Math.ceil(diffMs / 3600000); // round up per fee logic
+            const total    = hours * current.price;
+            document.getElementById('bkDuration').textContent  = hours + (hours === 1 ? ' ساعة' : ' ساعات');
+            document.getElementById('bkHourlyRate').textContent = fmtPrice(current.price);
+            document.getElementById('bkTotal').textContent      = fmtPrice(total);
+        }
+
+        function resetPrice() {
+            document.getElementById('bkDuration').textContent  = '--';
+            document.getElementById('bkHourlyRate').textContent = '--';
+            document.getElementById('bkTotal').textContent      = '--';
+        }
+
+        document.getElementById('bkStart').addEventListener('change', calcTotal);
+        document.getElementById('bkEnd').addEventListener('change', calcTotal);
+
+        function openBookingModal(lot) {
+            document.getElementById('bookingLotName').textContent = lot.name;
+            document.getElementById('bookingLotMeta').textContent = lot.address + ' · ' + fmtPrice(lot.price) + ' / ساعة';
+            document.getElementById('bookingUserInfo').textContent =
+                authUser.name + (authUser.phone ? '  |  ' + authUser.phone : '');
+            document.getElementById('bkPlate').value = '';
+
+            // Default: now → now+2h
+            const now   = new Date();
+            const later = new Date(now.getTime() + 2 * 3600 * 1000);
+            document.getElementById('bkStart').value = toLocalInput(now);
+            document.getElementById('bkEnd').value   = toLocalInput(later);
+            calcTotal();
+
+            document.getElementById('bookingAlert').className = 'd-none mb-3';
+            document.getElementById('bookingAlert').innerHTML = '';
+
+            getBookingModal().show();
+        }
+
+        document.getElementById('confirmBookingBtn').addEventListener('click', async () => {
+            const plate = document.getElementById('bkPlate').value.trim();
+            const start = document.getElementById('bkStart').value;
+            const end   = document.getElementById('bkEnd').value;
+            const alertEl = document.getElementById('bookingAlert');
+
+            const showErr = msg => {
+                alertEl.className = 'alert border-0 rounded-3 py-2 mb-3 text-sm';
+                alertEl.style.cssText = 'background:rgba(239,68,68,.1);color:#b91c1c;';
+                alertEl.innerHTML = `<i class="bi bi-exclamation-triangle me-1"></i>${msg}`;
+            };
+
+            if (!plate) return showErr('الرجاء إدخال رقم لوحة السيارة.');
+            if (!start) return showErr('الرجاء تحديد وقت البدء.');
+            if (!end)   return showErr('الرجاء تحديد وقت الانتهاء.');
+            if (new Date(end) <= new Date(start)) return showErr('وقت الانتهاء يجب أن يكون بعد وقت البدء.');
+
+            const btn = document.getElementById('confirmBookingBtn');
+            btn.disabled = true;
+            btn.innerHTML = '<span class="spinner-border spinner-border-sm me-1"></span>جاري الحجز...';
+
+            try {
+                const resp = await axios.post('/reserve', {
+                    parking_lot_id: current.id,
+                    vehicle_plate:  plate,
+                    start_time:     start.replace('T', ' ') + ':00',
+                    end_time:       end.replace('T', ' ')   + ':00',
+                });
+
+                if (resp.data.success) {
+                    getBookingModal().hide();
+                    current.avail = Math.max(0, current.avail - 1);
+                    renderList(lots);
+                    showToast('تم الحجز بنجاح! يمكنك متابعة حجوزاتك من حسابي.');
+                }
+            } catch (err) {
+                const errors = err.response?.data?.errors;
+                const msg = errors
+                    ? Object.values(errors).flat().join(' — ')
+                    : (err.response?.data?.message || 'حدث خطأ، الرجاء المحاولة مجدداً.');
+                showErr(msg);
+            } finally {
+                btn.disabled = false;
+                btn.innerHTML = '<i class="bi bi-check-lg me-1"></i>تأكيد الحجز';
+            }
+        });
+
+        // ── Toast ─────────────────────────────────────────────────────────────
+        function showToast(msg) {
+            const t = document.createElement('div');
+            t.style.cssText = 'position:fixed;bottom:80px;inset-inline-start:50%;transform:translateX(-50%);background:#0f172a;color:#f8fafc;padding:.6rem 1.25rem;border-radius:.625rem;font-size:.85rem;font-weight:600;z-index:9999;box-shadow:0 4px 20px rgba(0,0,0,.25);white-space:nowrap;';
+            t.innerHTML = `<i class="bi bi-check-circle-fill me-2" style="color:#10b981;"></i>${msg}`;
+            document.body.appendChild(t);
+            setTimeout(() => t.remove(), 4000);
+        }
+
         // ── Search ────────────────────────────────────────────────────────────
         function doSearch() {
             const term = document.getElementById('searchInput').value.trim().toLowerCase();

resources/views/layouts/admin.blade.php

@@ -111,7 +111,7 @@
                 <a href="{{ route('parking.index') }}"
                    class="btn btn-sm d-none d-md-inline-flex align-items-center"
                    style="background:#f1f5f9;color:#475569;border:none;border-radius:.5rem;font-family:'Cairo',sans-serif;"
-                   target="_blank">
+                   >
                     <i class="bi bi-globe2 me-1"></i>الموقع العام
                 </a>
                 {{-- Mobile: user avatar + logout --}}

resources/views/operator/dashboard.blade.php

@@ -590,11 +590,57 @@ $gradients = [
     </div>
 </div>
 
+{{-- ══════════════════════════════════════════════════════════════════════
+     ACTIVATE RESERVATION CONFIRM MODAL
+══════════════════════════════════════════════════════════════════════ --}}
+<div class="modal fade" id="activateConfirmModal" tabindex="-1" aria-hidden="true">
+    <div class="modal-dialog modal-dialog-centered" style="max-width:400px;">
+        <div class="modal-content border-0 shadow-lg" style="border-radius:16px;overflow:hidden;">
+            <div class="modal-header text-white border-0" style="background:linear-gradient(135deg,#1e3c72,#2a5298);">
+                <h6 class="modal-title fw-bold mb-0" style="font-family:'Cairo',sans-serif;">
+                    <i class="bi bi-box-arrow-in-right me-2"></i>تأكيد فتح البوابة
+                </h6>
+                <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
+            </div>
+            <div class="modal-body text-center p-4">
+                <div class="mb-3" style="font-size:2.5rem;">🚗</div>
+                <p class="mb-1 fw-600" style="color:#0f172a;font-family:'Cairo',sans-serif;">
+                    هل تريد تفعيل هذا الحجز؟
+                </p>
+                <p class="text-muted small mb-0">سيتم تسجيل وقت الدخول الآن وفتح البوابة للسيارة.</p>
+            </div>
+            <div class="modal-footer border-0 pt-0 pb-4 px-4 gap-2">
+                <button type="button" class="btn btn-light flex-fill fw-600" style="font-family:'Cairo',sans-serif;border-radius:10px;"
+                        data-bs-dismiss="modal">إلغاء</button>
+                <button type="button" id="activateConfirmBtn"
+                        class="btn btn-primary flex-fill fw-bold"
+                        style="font-family:'Cairo',sans-serif;border-radius:10px;">
+                    <i class="bi bi-check2-circle me-1"></i>تأكيد الدخول
+                </button>
+            </div>
+        </div>
+    </div>
+</div>
+
 @push('scripts')
 <script>
 const lots = {!! $parkingLots->toJson() !!};
 const csrf = document.querySelector('meta[name="csrf-token"]').content;
 
+// ── Toast helper ───────────────────────────────────────────────────────
+function showToast(msg, type = 'success') {
+    const colors = { success: '#10b981', danger: '#ef4444', warning: '#f59e0b', info: '#3b82f6' };
+    const t = document.createElement('div');
+    t.style.cssText = `position:fixed;bottom:1.25rem;inset-inline-end:1.25rem;z-index:9999;
+        background:${colors[type]||colors.success};color:#fff;padding:.75rem 1.25rem;border-radius:10px;
+        font-family:'Cairo',sans-serif;font-size:.9rem;font-weight:600;
+        box-shadow:0 8px 24px rgba(0,0,0,.18);opacity:0;transition:opacity .25s;max-width:320px;`;
+    t.textContent = msg;
+    document.body.appendChild(t);
+    requestAnimationFrame(() => { t.style.opacity = '1'; });
+    setTimeout(() => { t.style.opacity = '0'; setTimeout(() => t.remove(), 300); }, 3500);
+}
+
 function selectLot(id) { window.location = '/operator/dashboard?lot_id=' + id; }
 
 @if(!$selectedLot)
@@ -670,12 +716,12 @@ async function submitCheckIn() {
             btn.innerHTML = '<i class="bi bi-check2-circle me-1"></i>تم!';
             setTimeout(() => location.reload(), 700);
         } else {
-            alert(data.message || 'حدث خطأ');
+            showToast(data.message || 'حدث خطأ', 'danger');
             btn.disabled = false;
             btn.innerHTML = '<i class="bi bi-check-lg me-1"></i>تأكيد الدخول';
         }
     } catch {
-        alert('خطأ في الاتصال');
+        showToast('خطأ في الاتصال', 'danger');
         btn.disabled = false;
         btn.innerHTML = '<i class="bi bi-check-lg me-1"></i>تأكيد الدخول';
     }
@@ -692,8 +738,28 @@ document.getElementById('newEntryModal').addEventListener('hidden.bs.modal', ()
 });
 
 // ── Activate reservation ───────────────────────────────────────────────
-async function activateRes(id, btn) {
+let pendingActivateId  = null;
-    if (!confirm('تأكيد فتح البوابة لهذا الحجز؟')) return;
+let pendingActivateBtn = null;
+let activateModal      = null;
+
+function getActivateModal() {
+    if (!activateModal) activateModal = new bootstrap.Modal(document.getElementById('activateConfirmModal'));
+    return activateModal;
+}
+
+function activateRes(id, btn) {
+    pendingActivateId  = id;
+    pendingActivateBtn = btn;
+    getActivateModal().show();
+}
+
+document.getElementById('activateConfirmBtn').addEventListener('click', async () => {
+    const id  = pendingActivateId;
+    const btn = pendingActivateBtn;
+    if (!id || !btn) return;
+
+    getActivateModal().hide();
+
     const orig = btn.innerHTML;
     btn.disabled = true;
     btn.innerHTML = '<span class="spinner-border spinner-border-sm"></span>';
@@ -703,21 +769,19 @@ async function activateRes(id, btn) {
         });
         const data = await res.json();
         if (data.success) {
-            // Check-in button → success state
             btn.classList.replace('btn-primary', 'btn-success');
             btn.innerHTML = '<i class="bi bi-check-circle me-1"></i>تم الدخول';
-            // Enable checkout button
             const co = document.getElementById('checkout-' + id);
             if (co) { co.disabled = false; }
         } else {
-            alert(data.message || 'حدث خطأ');
+            showToast(data.message || 'حدث خطأ', 'danger');
             btn.innerHTML = orig; btn.disabled = false;
         }
     } catch {
-        alert('خطأ في الاتصال');
+        showToast('خطأ في الاتصال', 'danger');
         btn.innerHTML = orig; btn.disabled = false;
     }
-}
+});
 
 // ── Receipt modal ──────────────────────────────────────────────────────
 let receiptModal     = null;
@@ -748,7 +812,7 @@ async function openReceipt(id) {
     try {
         const res  = await fetch(`/operator/${id}/checkout-preview`);
         const data = await res.json();
-        if (!data.success) { alert(data.message); return; }
+        if (!data.success) { showToast(data.message || 'حدث خطأ', 'danger'); getModal().hide(); return; }
         const d = data.data;
 
         document.getElementById('rcpt-lot').textContent   = d.lot_name;
@@ -766,7 +830,7 @@ async function openReceipt(id) {
             </div>`).join('');
         document.getElementById('rcpt-breakdown').innerHTML =
             rows || '<p class="text-xs text-center" style="color:#94a3b8;">لا تفاصيل</p>';
-    } catch { alert('تعذّر تحميل بيانات الفاتورة'); }
+    } catch { showToast('تعذّر تحميل بيانات الفاتورة', 'danger'); getModal().hide(); }
 }
 
 function selectPayment(method) {
@@ -777,7 +841,7 @@ function selectPayment(method) {
 document.getElementById('confirmPayBtn').addEventListener('click', async () => {
     if (!currentBookingId) return;
     if (selectedPayment === 'upload' && !document.getElementById('paymentProofFile').files.length) {
-        alert('يرجى رفع إيصال الدفع'); return;
+        showToast('يرجى رفع إيصال الدفع', 'warning'); return;
     }
     const btn = document.getElementById('confirmPayBtn');
     btn.disabled = true;
@@ -800,12 +864,12 @@ document.getElementById('confirmPayBtn').addEventListener('click', async () => {
             if (card) { card.style.transition='opacity .4s'; card.style.opacity='0'; setTimeout(()=>card.remove(),400); }
             setTimeout(() => location.reload(), 600);
         } else {
-            alert(data.message || 'حدث خطأ');
+            showToast(data.message || 'حدث خطأ', 'danger');
             btn.disabled  = false;
             btn.innerHTML = '<i class="bi bi-check2-circle me-1"></i>تأكيد الدفع';
         }
     } catch {
-        alert('خطأ في الاتصال');
+        showToast('خطأ في الاتصال', 'danger');
         btn.disabled  = false;
         btn.innerHTML = '<i class="bi bi-check2-circle me-1"></i>تأكيد الدفع';
     }

resources/views/user/profile.blade.php

@@ -30,6 +30,9 @@
                     <div>
                         <h2 class="fw-800 mb-1" style="font-size:1.15rem;color:#0f172a;">{{ $user->name }}</h2>
                         <p class="mb-1 text-sm" style="color:#64748b;">{{ $user->email }}</p>
+                        @if($user->phone)
+                        <p class="mb-1 text-sm" style="color:#64748b;" dir="ltr">{{ $user->phone }}</p>
+                        @endif
                         @php
                             $roleLabel = match($user->role) {
                                 'admin'    => 'مدير النظام',
@@ -52,15 +55,20 @@
         </div>
     </div>
 
-    {{-- ── Edit name ───────────────────────────────────────────────────────── --}}
+    {{-- ── Edit profile ──────────────────────────────────────────────────── --}}
     <div class="col-md-6">
         <div class="card h-100">
             <div class="card-header">
                 <span class="fw-700" style="font-size:.9rem;">
-                    <i class="bi bi-person me-2" style="color:#6366f1;"></i>تعديل الاسم
+                    <i class="bi bi-person me-2" style="color:#6366f1;"></i>تعديل البيانات الشخصية
                 </span>
             </div>
             <div class="card-body p-4">
+                @if(session('success'))
+                <div class="alert border-0 rounded-3 py-2 mb-3 text-sm" style="background:rgba(16,185,129,.1);color:#065f46;">
+                    <i class="bi bi-check-circle me-1"></i>{{ session('success') }}
+                </div>
+                @endif
                 @if($errors->updateName->any())
                 <div class="alert alert-danger border-0 rounded-3 py-2 mb-3 text-sm">
                     {{ $errors->updateName->first() }}
@@ -76,6 +84,59 @@
                                value="{{ old('name', $user->name) }}"
                                placeholder="أدخل اسمك الكامل">
                     </div>
+                    <div class="mb-3">
+                        <label class="form-label">رقم الهاتف</label>
+                        @php
+                        // Split stored phone back into country code + local number
+                        $storedPhone = $user->phone ?? '';
+                        $knownCodes  = ['+380','+351','+234','+249','+218','+216','+213','+212',
+                                        '+974','+973','+971','+970','+968','+967','+966','+965',
+                                        '+964','+963','+962','+961','+92','+91','+90','+86',
+                                        '+81','+61','+55','+49','+39','+34','+33','+20',
+                                        '+98','+44','+7','+1'];
+                        $savedCountry = old('phone_country', '+963');
+                        $savedLocal   = old('phone_local', $storedPhone);
+                        foreach ($knownCodes as $kc) {
+                            if (str_starts_with($storedPhone, $kc)) {
+                                $savedCountry = $kc;
+                                $savedLocal   = substr($storedPhone, strlen($kc));
+                                break;
+                            }
+                        }
+                        $countries = [
+                            ['🇸🇾','سوريا','+963'],['🇸🇦','السعودية','+966'],['🇦🇪','الإمارات','+971'],
+                            ['🇯🇴','الأردن','+962'],['🇱🇧','لبنان','+961'],['🇮🇶','العراق','+964'],
+                            ['🇪🇬','مصر','+20'],['🇴🇲','عُمان','+968'],['🇶🇦','قطر','+974'],
+                            ['🇰🇼','الكويت','+965'],['🇧🇭','البحرين','+973'],['🇾🇪','اليمن','+967'],
+                            ['🇵🇸','فلسطين','+970'],['🇲🇦','المغرب','+212'],['🇩🇿','الجزائر','+213'],
+                            ['🇹🇳','تونس','+216'],['🇱🇾','ليبيا','+218'],['🇸🇩','السودان','+249'],
+                            ['🇹🇷','تركيا','+90'],['🇮🇷','إيران','+98'],['🇩🇪','ألمانيا','+49'],
+                            ['🇫🇷','فرنسا','+33'],['🇬🇧','بريطانيا','+44'],['🇺🇸','أمريكا','+1'],
+                            ['🇷🇺','روسيا','+7'],['🇨🇳','الصين','+86'],['🇮🇳','الهند','+91'],
+                            ['🇦🇺','أستراليا','+61'],['🇮🇹','إيطاليا','+39'],['🇪🇸','إسبانيا','+34'],
+                            ['🇧🇷','البرازيل','+55'],['🇵🇰','باكستان','+92'],['🇳🇬','نيجيريا','+234'],
+                        ];
+                        @endphp
+                        <div class="input-group @if($errors->updateName->has('phone_local')) is-invalid @endif">
+                            <input type="tel" name="phone_local"
+                                   value="{{ $savedLocal }}"
+                                   class="form-control @if($errors->updateName->has('phone_local')) is-invalid @endif"
+                                   style="border-color:#e2e8f0;"
+                                   placeholder="912345678" dir="ltr">
+                            <select name="phone_country" dir="ltr"
+                                    style="max-width:130px;background:#f8fafc;border-color:#e2e8f0;color:#374151;font-family:'Cairo',sans-serif;font-size:.875rem;cursor:pointer;"
+                                    class="form-select">
+                                @foreach($countries as [$flag, $label, $code])
+                                <option value="{{ $code }}" {{ $savedCountry === $code ? 'selected' : '' }}>
+                                    {{ $flag }} {{ $code }}
+                                </option>
+                                @endforeach
+                            </select>
+                        </div>
+                        @if($errors->updateName->has('phone_local'))
+                            <div class="invalid-feedback d-block">{{ $errors->updateName->first('phone_local') }}</div>
+                        @endif
+                    </div>
                     <div class="mb-3">
                         <label class="form-label">البريد الإلكتروني</label>
                         <input type="email"

routes/auth.php

@@ -20,14 +20,19 @@ Route::middleware('guest')->group(function () {
         $request->validate([
             'name'          => 'required|string|max:255',
             'email'         => 'required|email|unique:users,email',
+            'phone_country' => 'required|string|max:10',
+            'phone_local'   => 'required|string|max:20',
             'password'      => 'required|confirmed|min:8',
+        ], [
+            'phone_local.required' => 'رقم الهاتف مطلوب.',
         ]);
 
         $user = User::create([
             'name'     => $request->name,
             'email'    => $request->email,
+            'phone'    => $request->phone_country . $request->phone_local,
             'password' => Hash::make($request->password),
-            'role' => 'user', // default
+            'role'     => 'user',
         ]);
 
         Auth::login($user);

routes/web.php

@@ -14,6 +14,9 @@ Route::middleware('auth')->group(function () {
     Route::patch('/profile', [ProfileController::class, 'update'])->name('profile.update');
     Route::patch('/profile/password', [ProfileController::class, 'updatePassword'])->name('profile.password');
     Route::get('/dashboard', [ProfileController::class, 'dashboard'])->name('user.dashboard');
+
+    // Booking from the public landing page (web session auth)
+    Route::post('/reserve', [ProfileController::class, 'reserve'])->name('reserve');
 });
 
 // Admin Dashboard routes (protected - uncomment auth middleware for production)