diff --git a/app/Http/Controllers/CustomerController.php b/app/Http/Controllers/CustomerController.php
index d53a1e0..182ccff 100644
--- a/app/Http/Controllers/CustomerController.php
+++ b/app/Http/Controllers/CustomerController.php
@@ -18,7 +18,7 @@ class CustomerController extends Controller
    public function dataOrder(){
         $search = request('search');
         $jenis_menu = request('jenis_menu');
-        $perPage = request()->get('per_page', 6);
+        $perPage = request()->get('per_page', 12);
         if($jenis_menu === "paket"){
             return self::dataPaketMenuOrder($search, $perPage);
         }
@@ -102,65 +102,77 @@ class CustomerController extends Controller
 
 
 
-   private static function dataPaketMenuOrder($search = null, $perPage){
-        $query = DB::connection('dbOrderGizi')->table('public.master_paket_menu as mpn')->where('mpn.statusenabled', true);
-        
-        if(!empty($search)){
-              $query->where('mpn.nama_paket', 'ILIKE', '%' . $search . '%');
-        }
+    private static function dataPaketMenuOrder($search = null, $perPage){
+            $query = DB::connection('dbOrderGizi')->table('public.master_paket_menu as mpn')->where('mpn.statusenabled', true);
 
-        $paginated = $query->select(
-            'mpn.master_paket_menu_id',
-            'mpn.nama_paket',
-            'mpn.foto',
-            'mpn.harga_public',
-            'mpn.harga_karyawan',
-            'mpn.harga_keluarga_pasien',
-            'mpn.deskripsi',
-            'mpn.status'
-        )->paginate($perPage);
-        
-        $paketMenuIds = collect($paginated->items())->pluck('master_paket_menu_id')->toArray();
-        
-        $klasifikasi =  DB::connection('dbOrderGizi')
-                ->table('public.klasifikasi_menu_diet as kmd')
-                ->join('public.kategori_diet as kd', 'kd.kategori_diet_id', '=', 'kmd.kategori_diet_id')
-                ->whereIn('kmd.master_paket_menu_id', $paketMenuIds)
-                ->select('kmd.master_paket_menu_id', 'kd.kategori_diet_id', 'kd.nama_kategori_diet')
-                ->get()
-                ->groupBy('master_paket_menu_id');
+            if(!empty($search)){
+                $query->where('mpn.nama_paket', 'ILIKE', '%' . $search . '%');
+            }
 
-         $result = collect($paginated->items())->map(function ($paketMenu) use ($klasifikasi) {
-                return [
-                    'master_paket_menu_id' => $paketMenu->master_paket_menu_id,
-                    'nama' => $paketMenu->nama_paket,
-                    'foto' => $paketMenu->foto,
-                    'jenis_menu' => "paket",
-                    'harga_public' => $paketMenu->harga_public,
-                    'harga_karyawan' => $paketMenu->harga_karyawan,
-                    'harga_keluarga_pasien' => $paketMenu->harga_keluarga_pasien,
-                    'status' => $paketMenu->status,
-                    'deskripsi' => $paketMenu->deskripsi,
-                    'klasifikasiMenu' => isset($klasifikasi[$paketMenu->master_paket_menu_id]) ? $klasifikasi[$paketMenu->master_paket_menu_id]->map(function ($item) {
-                        return [
-                            'kategori_diet_id' => $item->kategori_diet_id,
-                            'nama_kategori_diet' => $item->nama_kategori_diet,
-                        ];
-                    })->values() : [],
-                ];
-            });
-        
+            $paginated = $query->select(
+                'mpn.master_paket_menu_id',
+                'mpn.nama_paket',
+                'mpn.foto',
+                'mpn.harga_public',
+                'mpn.harga_karyawan',
+                'mpn.harga_keluarga_pasien',
+                'mpn.deskripsi',
+                'mpn.status'
+            )->paginate($perPage);
 
-        return response()->json([
-                'status' => true,
-                'message' => 'Berhasil mendapatkan data',
-                'data' => [
-                    'data' => $result,
-                    'current_page' => $paginated->currentPage(),
-                    'last_page' => $paginated->lastPage(),
-                    'per_page' => $paginated->perPage(),
-                    'total' => $paginated->total(),
-                ]
-            ]);
-   }
+            $paketMenuIds = collect($paginated->items())->pluck('master_paket_menu_id')->toArray();
+
+            $klasifikasi =  DB::connection('dbOrderGizi')
+                    ->table('public.klasifikasi_menu_diet as kmd')
+                    ->join('public.kategori_diet as kd', 'kd.kategori_diet_id', '=', 'kmd.kategori_diet_id')
+                    ->whereIn('kmd.master_paket_menu_id', $paketMenuIds)
+                    ->select('kmd.master_paket_menu_id', 'kd.kategori_diet_id', 'kd.nama_kategori_diet')
+                    ->get()
+                    ->groupBy('master_paket_menu_id');
+
+            $result = collect($paginated->items())->map(function ($paketMenu) use ($klasifikasi) {
+                    return [
+                        'master_paket_menu_id' => $paketMenu->master_paket_menu_id,
+                        'nama' => $paketMenu->nama_paket,
+                        'foto' => $paketMenu->foto,
+                        'jenis_menu' => "paket",
+                        'harga_public' => $paketMenu->harga_public,
+                        'harga_karyawan' => $paketMenu->harga_karyawan,
+                        'harga_keluarga_pasien' => $paketMenu->harga_keluarga_pasien,
+                        'status' => $paketMenu->status,
+                        'deskripsi' => $paketMenu->deskripsi,
+                        'klasifikasiMenu' => isset($klasifikasi[$paketMenu->master_paket_menu_id]) ? $klasifikasi[$paketMenu->master_paket_menu_id]->map(function ($item) {
+                            return [
+                                'kategori_diet_id' => $item->kategori_diet_id,
+                                'nama_kategori_diet' => $item->nama_kategori_diet,
+                            ];
+                        })->values() : [],
+                    ];
+                });
+
+
+            return response()->json([
+                    'status' => true,
+                    'message' => 'Berhasil mendapatkan data',
+                    'data' => [
+                        'data' => $result,
+                        'current_page' => $paginated->currentPage(),
+                        'last_page' => $paginated->lastPage(),
+                        'per_page' => $paginated->perPage(),
+                        'total' => $paginated->total(),
+                    ]
+                ]);
+    }
+
+    public function checkout(){
+        $payload = [
+            'title' => 'Checkout '
+        ];
+        return view('guest.checkout_payment', $payload);
+    }
+
+    public function submitCheckout(){
+       $dataCart = json_decode(request('cart_data'), true);
+       dd(request()->all());
+    }
 }
diff --git a/app/Models/Order.php b/app/Models/Order.php
index 103c9ea..3a1b875 100644
--- a/app/Models/Order.php
+++ b/app/Models/Order.php
@@ -6,5 +6,22 @@ use Illuminate\Database\Eloquent\Model;
 
 class Order extends Model
 {
-    //
+    protected $connection = 'dbOrderGizi';
+    protected $table = 'public.order';
+    public $timestamps = false;
+    protected $primaryKey = "order_id";
+    protected $fillable =[
+        'entry_at',
+        'modified_at',
+        'no_order',
+        'statusenabled',
+        'kode_order',
+        'nama_menu',
+        'foto',
+        'jenis_menu',
+        'harga_public',
+        'harga_karyawan',
+        'deskripsi',
+        'status'
+    ];
 }
diff --git a/public/gambar/1.jpg b/public/gambar/1.jpg
new file mode 100644
index 0000000..d187418
Binary files /dev/null and b/public/gambar/1.jpg differ
diff --git a/public/gambar/2.jpg b/public/gambar/2.jpg
new file mode 100644
index 0000000..6813cdf
Binary files /dev/null and b/public/gambar/2.jpg differ
diff --git a/public/gambar/3.jpeg b/public/gambar/3.jpeg
new file mode 100644
index 0000000..4e57e98
Binary files /dev/null and b/public/gambar/3.jpeg differ
diff --git a/public/js/checkout/index.js b/public/js/checkout/index.js
new file mode 100644
index 0000000..5d967b0
--- /dev/null
+++ b/public/js/checkout/index.js
@@ -0,0 +1,42 @@
+
+
+document.addEventListener('DOMContentLoaded', () => {
+    $("#cartButton").addClass('d-none');
+  const cart = JSON.parse(sessionStorage.getItem('cart') || '[]');
+  if (cart.length === 0) {
+     window.location.href="/"
+     return
+  }
+
+     function toggleCustomerFields() {
+            const selected = $('input[name="jenis_customer"]:checked').val();
+
+            if (selected === 'Karyawan RSAB Harapan Kita') {
+                $('.karyawan').show();
+                $('.pasien').hide();
+            } else if (selected === 'Keluarga Pasien / Penunggu Pasien') {
+                $('.pasien').show();
+                $('.karyawan').hide();
+            } else {
+                $('.karyawan, .pasien').hide();
+            }
+        }
+
+        // Jalankan saat load awal (jika radio sudah terpilih)
+        toggleCustomerFields();
+
+        // Jalankan saat user memilih salah satu radio
+        $('input[name="jenis_customer"]').on('change', function() {
+            toggleCustomerFields();
+        });
+
+    $("#checkoutFormFinal").on('submit', function(e){
+        if(cart.length === 0){
+            e.preventDefault();
+            alert("Keranjang kosong. Silakan pilih menu terlebih dahulu!");
+            return;
+        }
+        document.getElementById('cart_data').value = JSON.stringify(cart)
+    });
+});
+
diff --git a/public/js/order_guest/checkout.js b/public/js/order_guest/checkout.js
new file mode 100644
index 0000000..d31d05b
--- /dev/null
+++ b/public/js/order_guest/checkout.js
@@ -0,0 +1,193 @@
+let orderIndex = 0;
+    function addOrderRow(data = {}) {
+        orderIndex++;
+
+        const html = `
+            <div class="row g-2 align-items-center mb-2" data-row="${orderIndex}">
+                <div class="col-md-5 col-sm-12">
+                    <input type="date" name="orders[${orderIndex}][tanggal]" value="${data.tanggal || ''}" class="form-control" required>
+                </div>
+                <div class="col-md-3 col-sm-12">
+                    <select class="form-select" aria-label="Default select example" name="orders[${orderIndex}][type]" required>
+                        <option value="" selected disabled>Kategori Pemesanan</option>
+                        <option value="Same Day">Same Day</option>
+                        <option value="Menu Normal">Perempuan</option>
+                    </select>
+                </div>
+                <div class="col-md-2 col-sm-10">
+                    <input type="number" name="orders[${orderIndex}][jumlah]" value="${data.jumlah || ''}" class="form-control" placeholder="Masukkan Jumlah" required min="1">
+                </div>
+                <div class="col-md-2 col-sm-2 d-flex">
+                    <button type="button" class="btn btn-danger btn-sm" onclick="removeOrderRow(${orderIndex})"><i class="fa-solid fa-trash"></i></button>
+                </div>
+            </div>
+        `;
+        $('#order_input_wrapper').append(html);
+    }
+
+    function removeOrderRow(index) {
+        $(`#order_input_wrapper [data-row="${index}"]`).remove();
+    }
+    function renderCartList() {
+        $("#cartSidebar").offcanvas('show')
+        $('#floatingCartButton').addClass('d-none');
+        const cart = JSON.parse(sessionStorage.getItem('cart') || '[]');
+        let total = 0;
+
+        const html = cart.map(item => {
+            const hargaNum = parseInt(item.harga.replace(/[^\d]/g, ''));
+            let pesananHTML = '';
+
+            item.pesanan.forEach((p, i) => {
+                pesananHTML += `
+                        <div class="row align-items-center mb-2" data-item-id="${item.id}" data-index="${i}">
+                            <div class="col-5">
+                                <input type="date" class="form-control form-control-sm tanggal-input" value="${p.tgl}" oninput="onTanggalChange(${item.id}, ${i})">
+                            </div>
+                            <div class="col-3">
+                                <select class="form-select kategori-pemesanan-input" onchange="onKategoriChange(${item.id}, ${i})">
+                                    <option value="" disabled ${!p.kategoriPemesanan ? 'selected' : ''}>Kategori Pemesanan</option>
+                                    <option value="Same Day" ${p.kategoriPemesanan === 'Same Day' ? 'selected' : ''}>Same Day</option>
+                                    <option value="Menu Normal" ${p.kategoriPemesanan === 'Menu Normal' ? 'selected' : ''}>Menu Normal</option>
+                                </select>
+                            </div>
+                            <div class="col-2">
+                                <input type="number" class="form-control form-control-sm jumlah-input" value="${p.jumlah}" min="1" oninput="onJumlahChange(${item.id}, ${i})">
+                            </div>
+                            <div class="col-2">
+                                <button class="btn btn-sm btn-danger" onclick="removeOrderDate(${item.id}, ${i})"><i class="fa-solid fa-trash"></i></button>
+                            </div>
+                        </div>
+                    `;
+            });
+
+            const itemTotal = item.pesanan.reduce((sum, p) => sum + (p.jumlah * hargaNum), 0);
+            total += itemTotal;
+
+            return `
+            <div class="card mb-2 p-2">
+                <div class="d-flex align-items-center">
+                <img src="${item.foto}" class="me-3 rounded" style="width: 60px; height: 60px; object-fit: cover;">
+                <div>
+                    <div><strong>${item.nama_menu}</strong></div>
+                    <div class="text-muted small">${item.harga}</div>
+                </div>
+                </div>
+
+                <div class="mt-2">
+                    ${pesananHTML}
+                <button class="btn btn-sm btn-outline-primary mt-2" onclick="addOrderDate(${item.id})">+ Tambah Tanggal</button>
+                </div>
+
+                <div class="mt-3 d-flex justify-content-between align-items-center">
+                <div><strong>Total:</strong> <span class="total-per-item" data-item-id="${item.id}">Rp ${itemTotal.toLocaleString('id-ID')}</span></div>
+                <button class="btn btn-sm btn-outline-danger" onclick="removeCartItem(${item.id})">
+                    <i class="fa-solid fa-trash"></i> Hapus Pesanan
+                </button>
+                </div>
+            </div>
+            `;
+        }).join('');
+
+        $('#cartListContainer').html(html);
+        $('#cartTotal').text('Rp ' + total.toLocaleString('id-ID'));
+    }
+
+
+    function addOrderDate(itemId) {
+        const cart = JSON.parse(sessionStorage.getItem('cart') || '[]');
+        const item = cart.find(i => i.id === itemId);
+        if (item) {
+            item.pesanan.push({ tgl: '', jumlah: 1 });
+            sessionStorage.setItem('cart', JSON.stringify(cart));
+            renderCartList();
+
+        }
+    }
+
+    function removeOrderDate(itemId, index) {
+        const cart = JSON.parse(sessionStorage.getItem('cart') || '[]');
+        const item = cart.find(i => i.id === itemId);
+        if (item && item.pesanan.length > index) {
+            item.pesanan.splice(index, 1);
+            sessionStorage.setItem('cart', JSON.stringify(cart));
+            renderCartList();
+        }
+    }
+
+    function removeCartItem(itemId){
+         let cart = JSON.parse(sessionStorage.getItem('cart') || '[]');
+         cart = cart.filter(i => i.id !== itemId);
+         sessionStorage.setItem('cart', JSON.stringify(cart));
+         updateCartCount(cart.length);
+         renderCartList()
+    }
+
+    function onJumlahChange(itemId, index) {
+        const cart = JSON.parse(sessionStorage.getItem('cart') || '[]');
+        const jumlahInput = document.querySelector(`div[data-item-id='${itemId}'][data-index='${index}'] .jumlah-input`).value;
+        if (!isNaN(jumlahInput)) {
+            cart.forEach(item => {
+                if (item.id === itemId) {
+                    item.pesanan[index].jumlah = parseInt(jumlahInput);
+                }
+            });
+            sessionStorage.setItem('cart', JSON.stringify(cart));
+            renderCartList();
+        }
+    }
+
+    function onTanggalChange(itemId, index) {
+        const cart = JSON.parse(sessionStorage.getItem('cart') || '[]');
+        const tanggalInput = document.querySelector(`div[data-item-id='${itemId}'][data-index='${index}'] .tanggal-input`).value;
+        cart.forEach(item => {
+            if (item.id === itemId) {
+                item.pesanan[index].tgl = tanggalInput;
+            }
+        });
+        sessionStorage.setItem('cart', JSON.stringify(cart));
+        validateCheckoutButton();
+    }
+
+    function onKategoriChange(itemId, index) {
+        const cart = JSON.parse(sessionStorage.getItem('cart') || '[]');
+        const item = cart.find(i => i.id === itemId);
+        if (!item) return;
+
+        const kategori = $(`[data-item-id='${itemId}'][data-index='${index}'] .kategori-pemesanan-input`).val();
+        item.pesanan[index].kategoriPemesanan = kategori;
+        sessionStorage.setItem('cart', JSON.stringify(cart));
+    }
+
+
+    function renderCartTotalOnly() {
+        const cart = JSON.parse(sessionStorage.getItem('cart') || '[]');
+        let total = 0;
+        cart.forEach(item => {
+            const hargaNum = parseInt(item.harga.replace(/[^\d]/g, ''));
+            const itemTotal = item.pesanan.reduce((sum, p) => sum + (p.jumlah * hargaNum), 0);
+            total += itemTotal;
+        });
+        $('#cartTotal').text('Rp ' + total.toLocaleString('id-ID'));
+    }
+
+    function updateFloatingCartButton() {
+        const cart = JSON.parse(sessionStorage.getItem('cart') || '[]');
+        const totalItem = cart.reduce((sum, item) => {
+            return sum + item.pesanan.reduce((s, p) => s + p.jumlah, 0);
+        }, 0);
+
+        const totalHarga = cart.reduce((sum, item) => {
+            const harga = parseInt(item.harga.replace(/[^\d]/g, ''));
+            return sum + item.pesanan.reduce((s, p) => s + (p.jumlah * harga), 0);
+        }, 0);
+
+        if (cart.length > 0) {
+            $('#floatingCartButton').removeClass('d-none');
+            $('#floatingCartCount').text(totalItem);
+            $('#floatingCartTotal').text('Rp ' + totalHarga.toLocaleString('id-ID'));
+            $('#floatingCartDesc').text(`Total pesanan dari ${cart[0].nama_menu}`);
+        } else {
+            $('#floatingCartButton').addClass('d-none');
+        }
+    }
diff --git a/public/js/order_guest/functions.js b/public/js/order_guest/functions.js
index e705c8f..878c3db 100644
--- a/public/js/order_guest/functions.js
+++ b/public/js/order_guest/functions.js
@@ -4,7 +4,7 @@ $(document).ready(function(){
      filterState ={
         jenis_menu: jenisMenuAwal,
         search:'',
-        per_page: 6,
+        per_page: 12,
     }
 
     fetchMenu(filterState)
diff --git a/public/js/order_guest/index.js b/public/js/order_guest/index.js
index 359f5d2..13ef420 100644
--- a/public/js/order_guest/index.js
+++ b/public/js/order_guest/index.js
@@ -1,200 +1,215 @@
-$(document).ready(function () {
-  // Auto render setiap buka offcanvas
-  const cartSidebar = document.getElementById('cartSidebar');
-  cartSidebar.addEventListener('shown.bs.offcanvas', renderCartList);
-  cartSidebar.addEventListener('hidden.bs.offcanvas', function () {
-        const cart = JSON.parse(sessionStorage.getItem('cart') || '[]');
-        if (cart.length > 0) {
-            $('#floatingCartButton').removeClass('d-none');
-        }
-  });
-});
+    $(document).ready(function () {
+    // Auto render setiap buka offcanvas
+
+    cartSidebar.addEventListener('shown.bs.offcanvas', renderCartList);
+        cartSidebar.addEventListener('hidden.bs.offcanvas', function () {
+                const cart = JSON.parse(sessionStorage.getItem('cart') || '[]');
+                if (cart.length > 0) {
+                    $('#floatingCartButton').removeClass('d-none');
+                }
+        });
+    });
 
 
 
-function fetchMenu(filter = {}) {
-    const containerGuest = $("#order_guest_id");
-    let params = new URLSearchParams({
-        page: filter.page || 1,
-        per_page: filter.per_page || 6,
-        search: filter.search || '',
-        jenis_menu: filter.jenis_menu || ''
-    }).toString();
-    
-    containerGuest.html('<p class="text-muted">Memuat data....</p>');
+    function fetchMenu(filter = {}) {
+        const containerGuest = $("#order_guest_id");
+        let params = new URLSearchParams({
+            page: filter.page || 1,
+            per_page: filter.per_page || 12,
+            search: filter.search || '',
+            jenis_menu: filter.jenis_menu || ''
+        }).toString();
 
-    fetch(`/datamenu?${params}`)
-        .then(res => res.json())
-        .then(res => {
-            if (!res.status){
-                return containerGuest.html('<p class="text-danger">Gagal Memuat Data...</p>');
-            }
-            const session = JSON.parse(sessionStorage.getItem('customerData') || '{}')
-            let cart = JSON.parse(sessionStorage.getItem('cart') || '[]');
-            if(cart.length > 0){
-                updateCartCount(cart.length)
-            }
-            if(session.nama_customer){
-                $("#welcomeMessage").html(`Selamat Datang, <strong>${session.nama_customer}</strong> !`)
-            }
-            const menus = res.data.data || [];
-           
-            if (menus.length === 0){
-                return containerGuest.html('<p class="text-muted">Pencarian tidak ditemukan.</p>');
-            }
-            let html = '<div class="container"><div class="row row-cols-1 row-cols-md-2 g-4">';
-                menus.forEach(menu => {
-                     let hargaResult = 0;
-                    if(session.jenis_customer === "Karyawan RSAB Harapan Kita"){
-                        hargaResult = menu.harga_karyawan
-                    }else if(session.jenis_customer === "Keluarga Pasien / Penunggu Pasien"){
-                        hargaResult = menu.harga_keluarga_pasien
-                    }else{
-                        hargaResult = menu.harga_public
-                    }
-                    html += `
-                    <div class="col-md-6">
-                        <div class="card h-100 shadow-sm">
-                            <div class="row g-0 h-100">
-                                <!-- Bagian kiri (gambar) -->
-                                <div class="col-md-5 d-flex align-items-center p-2">
-                                    <img src="gambar/${menu.foto || 'default.jpg'}" class="img-fluid rounded" alt="${menu.nama_menu}">
+        containerGuest.html('<p class="text-muted">Memuat data....</p>');
+
+        fetch(`/datamenu?${params}`)
+            .then(res => res.json())
+            .then(res => {
+                if (!res.status){
+                    return containerGuest.html('<p class="text-danger">Gagal Memuat Data...</p>');
+                }
+                const session = JSON.parse(sessionStorage.getItem('customerData') || '{}')
+                let cart = JSON.parse(sessionStorage.getItem('cart') || '[]');
+                if(cart.length > 0){
+                    updateCartCount(cart.length)
+                }
+                if(session.nama_customer){
+                    $("#welcomeMessage").html(`Selamat Datang, <strong>${session.nama_customer}</strong> !`)
+                }
+                const menus = res.data.data || [];
+
+                if (menus.length === 0){
+                    return containerGuest.html('<p class="text-muted">Pencarian tidak ditemukan.</p>');
+                }
+                let html = '<div class="container"><div class="row row-cols-1 row-cols-md-2 g-4">';
+                    menus.forEach(menu => {
+                        html += `
+                        <div class="col-md-3 mb-4">
+                            <div class="card h-100 shadow-sm p-2 rounded-4">
+                                <!-- Gambar Makanan -->
+                                <img src="gambar/${menu.foto || '3.jpeg'}"
+                                    class="rounded shadow-sm object-fit-cover" height="150px"
+                                    alt="${menu.nama_menu}">
+
+                                <!-- Nama & Harga -->
+                                <h5 class="fw-bold mb-1 mt-2">${menu.nama}</h5>
+                                <div class="row text-muted small">
+                                    <div class="col-12 fw-semibold">Harga</div>
+                                    <div class="col-6">Karyawan:</div>
+                                    <div class="col-6 text-end">Rp ${parseInt(menu.harga_karyawan).toLocaleString('id-ID')}</div>
+                                    <div class="col-6">Keluarga Pasien:</div>
+                                    <div class="col-6 text-end">Rp ${parseInt(menu.harga_keluarga_pasien).toLocaleString('id-ID')}</div>
                                 </div>
 
-                                <!-- Bagian kanan (konten) -->
-                                <div class="col-md-7 d-flex flex-column p-3">
-                                    <div class="flex-grow-1">
-                                        <h5 class="card-title mb-1">${menu.nama}</h5>
-                                        <p class="mb-1">Rp ${parseInt(hargaResult).toLocaleString('id-ID')}</p>
-                                        <p class="text-muted small">${menu.deskripsi || ''}</p>
-                                        <div class="mb-2">
-                                            ${(menu.klasifikasiMenu || []).map(tag => `<span class="badge bg-secondary me-1 mb-1">${tag.nama_kategori_diet}</span>`).join('')}
-                                        </div>
+
+                                <!-- Kategori Diet (Badge) -->
+                                    <div class="mb-3">
+                                    ${(menu.klasifikasiMenu || [])
+                                        .slice(0, 2)
+                                        .map(tag => {
+                                        const name = tag.nama_kategori_diet || '';
+                                        const truncated = name.length > 12 ? name.substring(0, 12) + '...' : name;
+                                        return `<span class="badge bg-secondary me-1 mb-1" title="${name}">${truncated}</span>`;
+                                        }).join('')}
+                                    ${(menu.klasifikasiMenu || []).length > 2
+                                        ? `<span class="badge bg-secondary">+${(menu.klasifikasiMenu.length - 2)} lainnya</span>`
+                                        : ''}
                                     </div>
+
+                                <!-- Tombol Order -->
+                                <div class="d-flex p-2 mt-auto">
+                                    <button class="btn btn-outline-success w-50 me-2"
+                                        onclick="orderMenu(this)"
+                                        data-id="${menu.master_menu_id || menu.master_paket_menu_id}"
+                                        data-nama_menu="${menu.nama}"
+                                        data-harga_karyawan="${menu.harga_karyawan}"
+                                        data-harga_keluarga_pasien="${menu.harga_keluarga_pasien}"
+                                        data-jenis_menu="${menu.jenis_menu}"
+                                        data-deskripsi="${menu.deskripsi}"
+                                        data-klasifikasi_menu="${(menu.klasifikasiMenu || []).map(tag => tag.nama_kategori_diet).join(', ')}"
+                                        data-foto="${menu.foto}">
+                                       <i class="fa-solid fa-circle-info"></i> Detail
+                                    </button>
+                                    <button class="btn btn-success w-50"
+                                    onclick="saveItem(this)"
+                                    data-id="${menu.master_menu_id ?? menu.master_paket_menu_id}"
+                                    data-nama_menu="${menu.nama}"
+                                    data-harga_karyawan="${menu.harga_karyawan}"
+                                    data-harga_keluarga_pasien="${menu.harga_keluarga_pasien}"
+                                    data-jenis_menu="${menu.jenis_menu}"
+                                    data-deskripsi="${menu.deskripsi}"
+                                    data-klasifikasi_menu="${(menu.klasifikasiMenu || []).map(tag => tag.nama_kategori_diet).join(', ')}"
+                                    data-foto="${menu.foto}">
+                                    <i class="fas fa-shopping-cart me-1"></i> Order
+                                    </button>
                                 </div>
-                                <!-- Tombol selalu di bawah -->
-                                <div class="col-md-12 mt-auto p-2">
-                                        <button class="btn btn-success w-100" onclick="orderMenu(this)"
-                                            data-id="${menu.master_menu_id ?? menu.master_paket_menu_id}"
-                                            data-nama_menu="${menu.nama}"
-                                            data-harga="${hargaResult}"
-                                            data-jenis_menu="${menu.jenis_menu}"
-                                            data-klasifikasi_menu="${(menu.klasifikasiMenu || []).map(tag => tag.nama_kategori_diet).join(', ')}"
-                                            data-foto="${menu.foto}">Order</button>
-                                    </div>
                             </div>
                         </div>
-                    </div>
-                    `;
-                });
-            
-            html += '</div></div>'; 
-            html += `<div class="col-md-12 d-flex justify-content-between align-items-center mt-3">
-                        <div>
-                            <label for="perPageSelect" class="me-2">Tampilkan:</label>
-                            <select id="perPageSelect" class="form-select form-select-sm d-inline-block w-auto" onchange="changePerPage(this)">
-                                <option value="6" ${filter.per_page == 6 ? 'selected' : ''}>6</option>
-                                <option value="10" ${filter.per_page == 10 ? 'selected' : ''}>10</option>
-                                <option value="20" ${filter.per_page == 20 ? 'selected' : ''}>20</option>
-                            </select>
+
+                        `;
+                    });
+
+                html += '</div></div>';
+
+                html += `<div class="col-md-12 d-flex justify-content-between align-items-center mt-3">`;
+
+                if(res.data.total > 12){
+                    html +=`<div>
+                                <label for="perPageSelect" class="me-2">Tampilkan:</label>
+                                <select id="perPageSelect" class="form-select form-select-sm d-inline-block w-auto" onchange="changePerPage(this)">
+                                    <option value="12" ${filter.per_page == 12 ? 'selected' : ''}>12</option>
+                                    <option value="24" ${filter.per_page == 24 ? 'selected' : ''}>24</option>
+                                    <option value="50" ${filter.per_page == 50 ? 'selected' : ''}>50</option>
+                                </select>
                         </div>`
-            // Pagination buttons
-             if (res.data.last_page > 1) {
-                html += `
-                        <div class="d-flex gap-2">`;
-                for (let i = 1; i <= res.data.last_page; i++) {
-                    html += `
-                        <button class="btn btn-outline-success btn-sm ${res.data.current_page === i ? 'active' : ''}"
-                            onclick='fetchMenu(${JSON.stringify({...filter, page: i})})'>${i}</button>`;
                 }
-                html += `</div>`;
+                // Pagination buttons
+                if (res.data.last_page > 1) {
+                    html += `
+                            <div class="d-flex gap-2">`;
+                    for (let i = 1; i <= res.data.last_page; i++) {
+                        html += `
+                            <button class="btn btn-outline-success btn-sm ${res.data.current_page === i ? 'active' : ''}"
+                                onclick='fetchMenu(${JSON.stringify({...filter, page: i})})'>${i}</button>`;
+                    }
+                    html += `</div>`;
+                }
+                containerGuest.html(html);
+            })
+            .catch(err => {
+                containerGuest.html('<p class="text-danger">Terjadi kesalahan saat memuat data.</p>');
+                console.error(err);
+            });
+    }
+
+    const modalCheckout = $("#checkoutModal")
+    function orderMenu(e){
+        const klasifikasiStr = $(e).data('klasifikasi_menu') || '';
+        const tags = klasifikasiStr.split(',').map(tag => tag.trim()).filter(tag => tag !== '')
+
+        const klasifikasiMenu =tags.map(tag => `
+            <span class="badge bg-secondary me-1 mb-1">${tag}</span>
+            `).join('');
+
+        modalCheckout.modal("show")
+        $('#cathering_order_photo').attr('src', `/gambar/${$(e).data('foto')}`)
+        $('#cathering_order_name').text($(e).data('nama_menu'))
+        $('#cathering_order_menu_id').text($(e).data('id'))
+        $('#cathering_order_jenis_menu').text($(e).data('jenis_menu'))
+        $('#cathering_order_deskripsi').text($(e).data('deskripsi'))
+        $('#cathering_order_price_keluarga_pasien').text("Rp " + parseInt($(e).data('harga_keluarga_pasien')).toLocaleString('id-ID'))
+        $('#cathering_order_price_karyawan').text("Rp " + parseInt($(e).data('harga_karyawan')).toLocaleString('id-ID'))
+        $("#tag_klasifikasi_menu").html(klasifikasiMenu)
+    }
+
+    function updateCartCount(count) {
+        const $cartCount = $('#cartCount');
+        if (count > 0) {
+            $cartCount.text(count).show();
+            let cart = JSON.parse(sessionStorage.getItem('cart') || '[]');
+            console.log(cart);
+
+            let menuNames = cart.map(item => item.nama_menu).join(', ');
+            const maxLength = 50;
+
+            if (menuNames.length > maxLength) {
+                menuNames = menuNames.substring(0, maxLength).trim() + '...';
             }
-            containerGuest.html(html);
-        })
-        .catch(err => {
-            containerGuest.html('<p class="text-danger">Terjadi kesalahan saat memuat data.</p>');
-            console.error(err);
-        });
-}
+            $('#floatingCartButton').removeClass('d-none');
+            $('#floatingCartCount').text(cart.length);
+            $('#floatingCartDesc').text(menuNames);
 
-
-const modalCheckout = $("#checkoutModal")
-function orderMenu(e){
-    const klasifikasiStr = $(e).data('klasifikasi_menu') || '';
-    const tags = klasifikasiStr.split(',').map(tag => tag.trim()).filter(tag => tag !== '')
-    
-    const klasifikasiMenu =tags.map(tag => `
-        <span class="badge bg-secondary me-1 mb-1">${tag}</span>
-        `).join('');
-    
-    modalCheckout.modal("show")
-    $('#cathering_order_photo').attr('src', `/gambar/${$(e).data('foto')}`)
-    $('#cathering_order_name').text($(e).data('nama_menu'))
-    $('#cathering_order_price').text("Rp " + parseInt($(e).data('harga')).toLocaleString('id-ID'))
-    $("#tag_klasifikasi_menu").html(klasifikasiMenu)
-    $('#order_input_wrapper').empty();
-    addOrderRow();
-}
-
-
-let orderIndex = 0;
-function addOrderRow(data = {}) {
-  orderIndex++;
-
-  const html = `
-    <div class="row g-2 align-items-center mb-2" data-row="${orderIndex}">
-      <div class="col-md-5 col-sm-12">
-        <input type="date" name="orders[${orderIndex}][tanggal]" value="${data.tanggal || ''}" class="form-control" required>
-      </div>
-      <div class="col-md-5 col-sm-10">
-        <input type="number" name="orders[${orderIndex}][jumlah]" value="${data.jumlah || ''}" class="form-control" placeholder="Masukkan Jumlah" required min="1">
-      </div>
-      <div class="col-md-2 col-sm-2 d-flex">
-        <button type="button" class="btn btn-danger btn-sm" onclick="removeOrderRow(${orderIndex})"><i class="fa-solid fa-trash"></i></button>
-      </div>
-    </div>
-  `;
-  $('#order_input_wrapper').append(html);
-}
-
-function removeOrderRow(index) {
-  $(`#order_input_wrapper [data-row="${index}"]`).remove();
-}
-
-
-function updateCartCount(count) {
-  const $cartCount = $('#cartCount');
-  if (count > 0) {
-    $cartCount.text(count).show();
-    let cart = JSON.parse(sessionStorage.getItem('cart') || '[]');
-    let totalHarga = cart.reduce((total, item) => {
-        const harga = parseInt(item.harga.replace(/[^\d]/g, '')) || 0;
-        const subtotal = item.pesanan.reduce((sum, p) => sum + (p.jumlah * harga), 0);
-        return total + subtotal;
-    }, 0);
-      $('#floatingCartButton').removeClass('d-none');   
-      $('#floatingCartCount').text(count);
-      $('#floatingCartTotal').text('Rp ' + totalHarga.toLocaleString('id-ID'));
-      $('#floatingCartDesc').text(cart[0].nama_menu);
-      
-  } else {
-    $cartCount.hide();
-    $('#floatingCartButton').addClass('d-none');
-  }
-}
+        } else {
+            $cartCount.hide();
+            $('#floatingCartButton').addClass('d-none');
+        }
+    }
 
     $("#checkoutForm").on('submit', function(e){
-            e.preventDefault();
-            const orders = [];
+             e.preventDefault();
+
             let cart = JSON.parse(sessionStorage.getItem('cart') || '[]');
-            $("#order_input_wrapper .row").each(function(){
-                const tgl = $(this).find('input[type="date"]').val();
-                const jumlah = $(this).find('input[type="number"]').val();
-                if(tgl && jumlah > 0){
-                    orders.push({ tgl, jumlah})
-                }
-            })
-            let existingItem = cart.find(item => item.nama_menu === $("#cathering_order_name").text());
+            const now = new Date();
+            const todayFormatted = now.getFullYear() + '-' + (now.getMonth() + 1).toString().padStart(2, '0') + '-' + now.getDate().toString().padStart(2, '0')
+
+            const orders = [{
+                tgl: todayFormatted,
+                jumlah: 1,
+                kategoriPemesanan: ''
+            }];
+        // Dikomen dulu
+        // $("#order_input_wrapper .row").each(function(){
+        //     const tgl = $(this).find('input[type="date"]').val();
+        //     const jumlah = $(this).find('input[type="number"]').val();
+        //     const kategoriPemesanan = $(this).find('select').val();
+        //     if(tgl && kategoriPemesanan && jumlah > 0){
+        //             orders.push({ tgl, kategoriPemesanan, jumlah})
+        //     }
+        // })
+            let idMenu = $("#cathering_order_menu_id").text().trim();
+            let namaMenu = $("#cathering_order_name").text().trim();
+            let existingItem = cart.find(item => item.id_menu === idMenu && item.nama_menu === namaMenu);
                 if(existingItem){
                     orders.forEach(newOrder => {
                         const existingOrder =existingItem.pesanan.find(p => p.tgl === newOrder.tgl)
@@ -207,161 +222,73 @@ function updateCartCount(count) {
                 }else{
                     const orderItem ={
                         id:Date.now(),
+                        id_menu : $("#cathering_order_menu_id").text(),
                         nama_menu : $("#cathering_order_name").text(),
-                        harga : $("#cathering_order_price").text(),
+                        harga_karyawan : $("#cathering_order_price_karyawan").text(),
+                        harga_kp : $("#cathering_order_price_keluarga_pasien").text(),
                         foto: $('#cathering_order_photo').attr('src'),
+                        jenis_menu: $('#cathering_order_jenis_menu').text(),
                         pesanan : orders
                     }
                     cart.push(orderItem)
                 }
-            
+
             sessionStorage.setItem('cart', JSON.stringify(cart))
             updateCartCount(cart.length)
             modalCheckout.modal('hide')
-        })
+    })
 
-    function renderCartList() {
-        $("#cartSidebar").offcanvas('show')
-        $('#floatingCartButton').addClass('d-none');
-        const cart = JSON.parse(sessionStorage.getItem('cart') || '[]');
-        let total = 0;
+    function saveItem(e){
+        let cart = JSON.parse(sessionStorage.getItem('cart') || '[]');
 
-        const html = cart.map(item => {
-            const hargaNum = parseInt(item.harga.replace(/[^\d]/g, ''));
-            let pesananHTML = '';
+        const now = new Date();
+        const todayFormatted = now.getFullYear() + '-' + (now.getMonth() + 1).toString().padStart(2, '0') + '-' + now.getDate().toString().padStart(2, '0')
 
-            item.pesanan.forEach((p, i) => {
-            pesananHTML += `
-                <div class="row align-items-center mb-2" data-item-id="${item.id}" data-index="${i}">
-                <div class="col-5">
-                    <input type="date" class="form-control form-control-sm tanggal-input" value="${p.tgl}" oninput="onTanggalChange(${item.id}, ${i})">
-                </div>
-                <div class="col-4">
-                    <input type="number" class="form-control form-control-sm jumlah-input" value="${p.jumlah}" min="1" oninput="onJumlahChange(${item.id}, ${i})">
-                </div>
-                <div class="col-3 text-end">
-                    <button class="btn btn-sm btn-danger" onclick="removeOrderDate(${item.id}, ${i})"><i class="fa-solid fa-trash"></i></button>
-                </div>
-                </div>
-            `;
-            });
+        const orders = [{
+            tgl: todayFormatted,
+            jumlah: 1,
+            kategoriPemesanan: ''
+        }];
 
-            const itemTotal = item.pesanan.reduce((sum, p) => sum + (p.jumlah * hargaNum), 0);
-            total += itemTotal;
-
-            return `
-            <div class="card mb-2 p-2">
-                <div class="d-flex align-items-center">
-                <img src="${item.foto}" class="me-3 rounded" style="width: 60px; height: 60px; object-fit: cover;">
-                <div>
-                    <div><strong>${item.nama_menu}</strong></div>
-                    <div class="text-muted small">${item.harga}</div>
-                </div>
-                </div>
-
-                <div class="mt-2">
-                    ${pesananHTML}
-                <button class="btn btn-sm btn-outline-primary mt-2" onclick="addOrderDate(${item.id})">+ Tambah Tanggal</button>
-                </div>
-
-                <div class="mt-3 d-flex justify-content-between align-items-center">
-                <div><strong>Total:</strong> <span class="total-per-item" data-item-id="${item.id}">Rp ${itemTotal.toLocaleString('id-ID')}</span></div>
-                <button class="btn btn-sm btn-outline-danger" onclick="removeCartItem(${item.id})">
-                    <i class="fa-solid fa-trash"></i> Hapus Pesanan
-                </button>
-                </div>
-            </div>
-            `;
-        }).join('');
-
-        $('#cartListContainer').html(html);
-        $('#cartTotal').text('Rp ' + total.toLocaleString('id-ID'));
-    }
-
-
-    function addOrderDate(itemId) {
-        const cart = JSON.parse(sessionStorage.getItem('cart') || '[]');
-        const item = cart.find(i => i.id === itemId);
-        if (item) {
-            item.pesanan.push({ tgl: '', jumlah: 1 });
-            sessionStorage.setItem('cart', JSON.stringify(cart));
-            renderCartList();
-            
-        }
-    }
-
-    function removeOrderDate(itemId, index) {
-        const cart = JSON.parse(sessionStorage.getItem('cart') || '[]');
-        const item = cart.find(i => i.id === itemId);
-        if (item && item.pesanan.length > index) {
-            item.pesanan.splice(index, 1);
-            sessionStorage.setItem('cart', JSON.stringify(cart));
-            renderCartList();
-        }
-    }
-
-    function removeCartItem(itemId){        
-         let cart = JSON.parse(sessionStorage.getItem('cart') || '[]');
-         cart = cart.filter(i => i.id !== itemId);
-         sessionStorage.setItem('cart', JSON.stringify(cart));
-         updateCartCount(cart.length);
-         renderCartList()
-    }
-
-    function onJumlahChange(itemId, index) {
-        const cart = JSON.parse(sessionStorage.getItem('cart') || '[]');
-        const jumlahInput = document.querySelector(`div[data-item-id='${itemId}'][data-index='${index}'] .jumlah-input`).value;
-        if (!isNaN(jumlahInput)) {
-            cart.forEach(item => {
-                if (item.id === itemId) {
-                    item.pesanan[index].jumlah = parseInt(jumlahInput);
+        let idMenu = $(e).data('id');
+        let namaMenu = $(e).data('nama_menu');
+        let existingItem = cart.find(item => item.id_menu === idMenu && item.nama_menu === namaMenu);
+            if(existingItem){
+                orders.forEach(newOrder => {
+                    const existingOrder =existingItem.pesanan.find(p => p.tgl === newOrder.tgl)
+                        if(existingOrder){
+                            existingOrder.jumlah += newOrder.jumlah;
+                        }else{
+                            existingItem.pesanan.push(newOrder)
+                        }
+                })
+            }else{
+                const orderItem ={
+                    id:Date.now(),
+                    id_menu : idMenu,
+                    nama_menu : namaMenu,
+                    harga_karyawan : $(e).data('harga_karyawan'),
+                    harga_kp : $(e).data('harga_keluarga_pasien'),
+                    foto: $(e).data('foto'),
+                    jenis_menu: $(e).data('jenis_menu'),
+                    pesanan : orders
                 }
-            });
-            sessionStorage.setItem('cart', JSON.stringify(cart));
-            renderCartList();
-        }
-    }
-
-    function onTanggalChange(itemId, index) {
-        const cart = JSON.parse(sessionStorage.getItem('cart') || '[]');
-        const tanggalInput = document.querySelector(`div[data-item-id='${itemId}'][data-index='${index}'] .tanggal-input`).value;
-        cart.forEach(item => {
-            if (item.id === itemId) {
-                item.pesanan[index].tgl = tanggalInput;
+                cart.push(orderItem)
             }
-        });
-        sessionStorage.setItem('cart', JSON.stringify(cart));
-        validateCheckoutButton();
+            sessionStorage.setItem('cart', JSON.stringify(cart))
+            updateCartCount(cart.length)
     }
 
-    function renderCartTotalOnly() {
-        const cart = JSON.parse(sessionStorage.getItem('cart') || '[]');
-        let total = 0;
-        cart.forEach(item => {
-            const hargaNum = parseInt(item.harga.replace(/[^\d]/g, ''));
-            const itemTotal = item.pesanan.reduce((sum, p) => sum + (p.jumlah * hargaNum), 0);
-            total += itemTotal;
-        });
-        $('#cartTotal').text('Rp ' + total.toLocaleString('id-ID'));
+    function checkout(){
+         const cart = JSON.parse(sessionStorage.getItem('cart') || '[]');
+         if(cart.length > 0){
+            window.location.href = '/checkout'
+         }else{
+            alert("Pilih Menu terlebih dahulu yang ingin dipesan !");
+            return
+         }
     }
 
-    function updateFloatingCartButton() {
-        const cart = JSON.parse(sessionStorage.getItem('cart') || '[]');
-        const totalItem = cart.reduce((sum, item) => {
-            return sum + item.pesanan.reduce((s, p) => s + p.jumlah, 0);
-        }, 0);
 
-        const totalHarga = cart.reduce((sum, item) => {
-            const harga = parseInt(item.harga.replace(/[^\d]/g, ''));
-            return sum + item.pesanan.reduce((s, p) => s + (p.jumlah * harga), 0);
-        }, 0);
 
-        if (cart.length > 0) {
-            $('#floatingCartButton').removeClass('d-none');
-            $('#floatingCartCount').text(totalItem);
-            $('#floatingCartTotal').text('Rp ' + totalHarga.toLocaleString('id-ID'));
-            $('#floatingCartDesc').text(`Total pesanan dari ${cart[0].nama_menu}`);
-        } else {
-            $('#floatingCartButton').addClass('d-none');
-        }
-    }
+
diff --git a/public/js/order_guest/register.js b/public/js/order_guest/register.js
index bf77ebd..5126a8a 100644
--- a/public/js/order_guest/register.js
+++ b/public/js/order_guest/register.js
@@ -1,19 +1,19 @@
 $(document).ready(function(){
-     const modal = new bootstrap.Modal(document.getElementById('registerModal'), {
-      backdrop: 'static', // Tidak bisa klik luar
-      keyboard: false      // Tidak bisa ESC
-    });
-    if(!sessionStorage.getItem('customerData')){
-        modal.show();
-    }
+    //  const modal = new bootstrap.Modal(document.getElementById('registerModal'), {
+    //   backdrop: 'static', // Tidak bisa klik luar
+    //   keyboard: false      // Tidak bisa ESC
+    // });
+    // if(!sessionStorage.getItem('customerData')){
+    //     modal.show();
+    // }
 
     $("#formRegister").on('submit', function(e){
         e.preventDefault()
         if(this.checkValidity()){
             const formData =Object.fromEntries(new FormData(this).entries())
             sessionStorage.setItem('customerData', JSON.stringify(formData))
-            
-            modal.hide() 
+
+            modal.hide()
             if(formData.nama_customer){
                 $("#welcomeMessage").html(`Selamat Datang, <strong>${formData.nama_customer}</strong> !`)
             }
@@ -21,4 +21,4 @@ $(document).ready(function(){
             this.reportValidity()
         }
     })
-})
\ No newline at end of file
+})
diff --git a/resources/views/guest/checkout_order.blade.php b/resources/views/guest/checkout_order.blade.php
index 044b097..26a856a 100644
--- a/resources/views/guest/checkout_order.blade.php
+++ b/resources/views/guest/checkout_order.blade.php
@@ -1,7 +1,7 @@
-<div class="modal fade" 
-id="checkoutModal" 
-tabindex="-1" 
-aria-labelledby="exampleModalLabel" 
+<div class="modal fade"
+id="checkoutModal"
+tabindex="-1"
+aria-labelledby="exampleModalLabel"
 aria-hidden="true"
 >
   <div class="modal-dialog modal-lg modal-dialog-centered">
@@ -19,25 +19,26 @@ aria-hidden="true"
                     </div>
                     <div class="col-md-8">
                          <h5 id="cathering_order_name" class="mb-2"></h5>
-                        <p class="mb-0">
-                            <strong>Harga:</strong> <span id="cathering_order_price"></span>
-                        </p>
+                         <div class="row text-muted small mb-2">
+                                    <div class="col-6 fw-semibold">Harga Karyawan:</div>
+                                    <div class="col-6 text-end fw-semibold"><span id="cathering_order_price_karyawan"></span> </div>
+                                    <div class="col-6 fw-semibold">Harga Keluarga Pasien:</div>
+                                    <div class="col-6 text-end fw-semibold"><span id="cathering_order_price_keluarga_pasien"></span> </div>
+                                </div>
+                         <span id="cathering_order_deskripsi" class="text-muted mb-2"></span>
+
+                         <h5 class="d-none" id="cathering_order_menu_id"></h5>
+                         <h5 class="d-none" id="cathering_order_jenis_menu"></h5>
                         <div id="tag_klasifikasi_menu" class="mt-2"></div>
                     </div>
-                    <div class="col-md-12">
-                        <label class="form-label mt-3">Tanggal & Jumlah Pengambilan</label>
-                        <div id="order_input_wrapper">
-                        </div>
-                        <button type="button" class="btn btn-sm btn-primary mt-2" onclick="addOrderRow()">+ Tambah Tanggal</button>
-                    </div>
                 </div>
             </div>
         </div>
         <div class="modal-footer">
              <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
-            <button type="submit" class="btn btn-success">Lanjutkan</button>
+            <button type="submit" class="btn btn-success"><i class="fas fa-shopping-cart me-1"></i> Order</button>
         </div>
       </form>
     </div>
   </div>
-</div>
\ No newline at end of file
+</div>
diff --git a/resources/views/guest/checkout_payment.blade.php b/resources/views/guest/checkout_payment.blade.php
new file mode 100644
index 0000000..dc2896e
--- /dev/null
+++ b/resources/views/guest/checkout_payment.blade.php
@@ -0,0 +1,131 @@
+@extends('guest.layout.main')
+@section('body_main_guests')
+
+    <section class="section py-5 bg-light">
+        <div class="container">
+               <div class="d-flex justify-content-between align-items-center mb-4">
+                    <h4 class="mb-0">Checkout Order</h4>
+                    <a href="/" class="btn btn-outline-success">
+                        <i class="fa fa-arrow-left me-1"></i> Kembali ke Menu
+                    </a>
+                </div>
+
+                 <div class="alert alert-info d-flex align-items-center" role="alert">
+                    <i class="fa fa-info-circle me-2"></i>
+                    <div>
+                        Sebelum melakukan checkout, silakan isi biodata Anda dengan lengkap terlebih dahulu.
+                    </div>
+                </div>
+
+            {{-- Form Identitas --}}
+            <form id="checkoutFormFinal" method="POST" action="/submit-checkout">
+            @csrf
+            <div class="row g-3 mb-4">
+                <input type="hidden" name="cart_data" id="cart_data">
+                <div class="col-md-6">
+                    <label for="exampleInputEmail1" class="form-label">Apakah Anda Seorang ?</label>
+                    <div class="form-check">
+                        <input class="form-check-input" type="radio" name="jenis_customer" id="radio_karyawan" value="Karyawan RSAB Harapan Kita" required>
+                        <label class="form-check-label" for="radio_karyawan" >
+                            Karyawan RSAB Harapan Kita
+                        </label>
+                    </div>
+                    <div class="form-check">
+                        <input class="form-check-input" type="radio" name="jenis_customer" id="radio_kp" value="Keluarga Pasien / Penunggu Pasien" required>
+                        <label class="form-check-label" for="radio_kp">
+                            Keluarga Pasien / Penunggu Pasien
+                        </label>
+                    </div>
+                    <div class="form-check">
+                        <input class="form-check-input" type="radio" name="jenis_customer" id="radio_public" value="Masyarakat Umum" required>
+                        <label class="form-check-label" for="radio_public">
+                            Masyarakat Umum
+                        </label>
+                    </div>
+                </div>
+                <div class="col-md-6">
+                    <label class="form-label">Nama Pemesan</label>
+                    <input type="text" class="form-control" name="nama_pemesan" id="nama_pemesan" required>
+                </div>
+                <div class="col-md-6">
+                    <label class="form-label">Jenis Kelamin</label>
+                    <select class="form-select" name="jenis_kelamin" id="jenis_kelamin" required>
+                        <option value="">Pilih...</option>
+                        <option value="Laki-laki">Laki-laki</option>
+                        <option value="Perempuan">Perempuan</option>
+                    </select>
+                </div>
+                <div class="col-md-6">
+                    <label class="form-label">Tanggal Lahir</label>
+                    <input type="date" class="form-control" name="tanggal_lahir" id="tanggal_lahir">
+                </div>
+                <div class="col-md-6">
+                    <label class="form-label">Tinggi Badan</label>
+                    <input type="number" class="form-control" name="tinggi_badan" id="tinggi_badan">
+                </div>
+                <div class="col-md-6">
+                    <label class="form-label">Berat Badan</label>
+                    <input type="number" class="form-control" name="berat_badan" id="berat_badan">
+                </div>
+                <div class="col-md-12">
+                    <label class="form-label">No. Whatsapp</label>
+                    <input type="number" class="form-control" name="no_whatsapp" id="no_whatsapp" required>
+                </div>
+
+                {{-- Pasien --}}
+                <div class="col-md-6 pasien">
+                    <label class="form-label">Nama Pasien</label>
+                    <input type="text" class="form-control pasien-field" name="nama_pasien" id="nama_pasien">
+                </div>
+                <div class="col-md-6 pasien">
+                    <label class="form-label">Ruang Perawatan</label>
+                    <select class="form-select pasien-field" name="ruang_perawatan" id="ruang_perawatan">
+                        <option value="">Pilih...</option>
+                        <option value="Ruang Kenanga">Ruang Kenanga</option>
+                        <option value="Ruang Menur">Ruang Menur</option>
+                        <option value="Ruang Melati">Ruang Melati</option>
+                        <option value="Ruang Mawar">Ruang Mawar</option>
+                        <option value="Ruang Cempaka">Ruang Cempaka</option>
+                        <option value="Ruang Widuri">Ruang Widuri</option>
+                        <option value="Ruang Teratai">Ruang Teratai</option>
+                        <option value="Klinik Anggrek">Klinik Melati</option>
+                        <option value="Ruang VK">Ruang VK</option>
+                    </select>
+                </div>
+
+                <div class="col-md-6 pasien">
+                    <label class="form-label">Nomor Kamar Perawatan</label>
+                    <input type="text" class="form-control pasien-field" name="no_kamar" id="no_kamar">
+                </div>
+
+                <div class="col-md-6 pasien">
+                    <label class="form-label">Kelas Perawatan ? </label>
+                    <select class="form-select pasien-field" name="kelas_perawatan" id="kelas_perawatan">
+                        <option value="">Pilih...</option>
+                        <option value="VIP A">VIP A</option>
+                        <option value="VIP B">VIP B</option>
+                        <option value="Kelas I">Kelas I</option>
+                        <option value="Mesa Tesa">Mesa Tesa</option>
+                    </select>
+                </div>
+                {{-- End Pasien --}}
+
+                {{-- Karyawan --}}
+                <div class="col-md-6 karyawan">
+                    <label class="form-label">Bagian /Instalasi?</label>
+                    <input type="text" class="form-control karyawan-field" name="bagian_instalasi" id="bagian_instalasi">
+                </div>
+                <div class="col-md-6 karyawan">
+                    <label class="form-label">Ekstensien yang bisa di Hubungi?</label>
+                    <input type="text" class="form-control karyawan-field" name="no_ekstensien" id="no_ekstensien">
+                </div>
+                {{-- End Karyawan --}}
+            </div>
+
+            <button type="submit" class="btn btn-success w-100">Simpan Order</button>
+            </form>
+        </div>
+    </section>
+<script src="{{ ver('/js/checkout/index.js') }}"></script>
+
+@endsection
diff --git a/resources/views/guest/index.blade.php b/resources/views/guest/index.blade.php
index 45793c6..b09af39 100644
--- a/resources/views/guest/index.blade.php
+++ b/resources/views/guest/index.blade.php
@@ -13,6 +13,7 @@
                     <li class="nav-item "><a class="nav-link text-black" href="#" data-filter="minuman">Minuman</a></li>
                     <li class="nav-item"><a class="nav-link text-black" href="#" data-filter="snack">Snack</a></li>
                     <li class="nav-item"><a class="nav-link text-black" href="#" data-filter="paket">Paket</a></li>
+                    <li class="nav-item"><a class="nav-link text-black" href="#" data-filter="">Jadwal Konsultasi Gizi</a></li>
                 </ul>
             </div>
             <div class="col-md-6">
@@ -22,26 +23,22 @@
             </div>
         </div>
         <div id="order_guest_id"></div>
-      <div id="floatingCartButton"
-            class="cart-floating bg-success text-white rounded d-none shadow-lg"
-            onclick="renderCartList()"
-            style="cursor: pointer; position: fixed; bottom: 15px; left: 50%; transform: translateX(-50%); z-index: 1050; width: 90%; max-width: 500px;">
-            <div class="d-flex justify-content-between align-items-center px-3 py-2">
-                <div>
-                    <strong><span id="floatingCartCount">0</span> item</strong><br>
-                    <small id="floatingCartDesc">Isi keranjang anda</small>
-                </div>
-                <div class="d-flex align-items-center">
-                    <strong class="me-3 text-white" id="floatingCartTotal">Rp 0</strong>
-                    <div class="btn btn-light btn-sm">
-                        <i class="fa-solid fa-cart-shopping text-success"></i>
+        <div id="floatingCartButton"
+                class="cart-floating bg-success text-white rounded d-none shadow-lg"
+                onclick="checkout()"
+                style="cursor: pointer; position: fixed; bottom: 15px; left: 50%; transform: translateX(-50%); z-index: 1050; width: 90%; max-width: 500px;">
+                <div class="d-flex justify-content-between align-items-center px-3 py-2">
+                    <div>
+                        <strong><span id="floatingCartCount">0</span> item</strong><br>
+                        <small id="floatingCartDesc">Isi keranjang anda</small>
+                    </div>
+                    <div class="d-flex align-items-center">
+                        <div class="btn btn-light btn-sm">
+                            <i class="fa-solid fa-cart-shopping text-success"></i>
+                        </div>
                     </div>
                 </div>
             </div>
-        </div>
-
-
-
     </div>
 </section>
 
diff --git a/resources/views/guest/keranjang.blade.php b/resources/views/guest/keranjang.blade.php
index 992749c..da5d8b9 100644
--- a/resources/views/guest/keranjang.blade.php
+++ b/resources/views/guest/keranjang.blade.php
@@ -17,6 +17,6 @@
       <strong>Total Bayar:</strong>
       <strong id="cartTotal">Rp 0</strong>
     </div>
-    <button class="btn btn-success w-100" onclick="checkoutCart()">Checkout</button>
+    <a class="btn btn-success w-100" href="/checkout">Checkout</a>
   </div>
 </div>
diff --git a/resources/views/guest/layout/partials/header.blade.php b/resources/views/guest/layout/partials/header.blade.php
index b6bf4fb..2067e81 100644
--- a/resources/views/guest/layout/partials/header.blade.php
+++ b/resources/views/guest/layout/partials/header.blade.php
@@ -12,7 +12,7 @@
 
         <nav id="navmenu" class="navmenu">
           {{-- <i class="mobile-nav-toggle d-xl-none bi bi-list"></i> --}}
-          <button type="button" class="btn btn-sm btn-success position-relative" id="cartButton" data-bs-toggle="offcanvas" onclick="renderCartList()">
+          <button type="button" class="btn btn-sm btn-success position-relative" id="cartButton" onclick="checkout()">
             <i class="fa-solid fa-cart-shopping"></i>
             <span class="position-absolute top-0 start-100 translate-middle badge rounded-pill bg-danger" id="cartCount" style="display: none;">
               0
diff --git a/resources/views/guest/register.blade.php b/resources/views/guest/register.blade.php
index c8a93ff..da59e2d 100644
--- a/resources/views/guest/register.blade.php
+++ b/resources/views/guest/register.blade.php
@@ -1,7 +1,7 @@
-<div class="modal fade" 
-id="registerModal" 
-tabindex="-1" 
-aria-labelledby="exampleModalLabel" 
+<div class="modal fade"
+id="registerModal"
+tabindex="-1"
+aria-labelledby="exampleModalLabel"
 aria-hidden="true"
 >
   <div class="modal-dialog modal-lg modal-dialog-centered">
@@ -36,7 +36,7 @@ aria-hidden="true"
                     </label>
                 </div>
             </div>
-            
+
             <div class="mb-3">
                 <label for="exampleInputPassword1" class="form-label">Nama Anda ?</label>
                 <input type="text" class="form-control" name="nama_customer" id="nama_customer" required>
@@ -45,10 +45,14 @@ aria-hidden="true"
                 <label for="exampleInputPassword1" class="form-label">Jenis Kelamin ?</label>
                 <select class="form-select" aria-label="Default select example" name="jenis_kelamin_customer" id="jenis_kelamin_customer" required>
                     <option value="" selected disabled>Pilih Jenis Kelamin</option>
-                    <option value="Laki Laki">Laki Laki</option>
+                    <option value="Laki-laki">Laki Laki</option>
                     <option value="Perempuan">Perempuan</option>
                 </select>
             </div>
+             <div class="mb-3">
+                    <label class="form-label">Tanggal Lahir</label>
+                    <input type="date" class="form-control" name="tanggal_lahir" id="tanggal_lahir">
+                </div>
             <div class="mb-3">
                 <label for="exampleInputPassword1" class="form-label">Tinggi Badan ?</label>
                 <input type="number" class="form-control" name="tinggi_badan_customer" id="tinggi_badan_customer">
@@ -64,4 +68,4 @@ aria-hidden="true"
       </form>
     </div>
   </div>
-</div>
\ No newline at end of file
+</div>
diff --git a/routes/web.php b/routes/web.php
index 3ea3d87..7466df1 100644
--- a/routes/web.php
+++ b/routes/web.php
@@ -19,4 +19,6 @@ Route::get('datatable/menu', [MenuController::class, 'datatable']);
 Route::resource('/dashboard/klasifikasi-menu', KlasifikasiMenuController::class);
 
 Route::get('/', [CustomerController::class, 'index']);
+Route::get('/checkout', [CustomerController::class, 'checkout']);
 Route::get('/datamenu', [CustomerController::class, 'dataOrder']);
+Route::post('/submit-checkout', [CustomerController::class, 'submitCheckout']);