diff --git a/assets/script/hura-lib.css b/assets/script/hura-lib.css
index a401014..bfe09c5 100644
--- a/assets/script/hura-lib.css
+++ b/assets/script/hura-lib.css
@@ -45,6 +45,7 @@
     --color-purple-500: oklch(62.7% 0.265 303.9);
     --color-purple-600: oklch(55.8% 0.288 302.321);
     --color-fuchsia-500: oklch(66.7% 0.295 322.15);
+    --color-gray-50: oklch(98.5% 0.002 247.839);
     --color-gray-100: oklch(96.7% 0.003 264.542);
     --color-gray-200: oklch(92.8% 0.006 264.531);
     --color-gray-400: oklch(70.7% 0.022 261.325);
@@ -3478,23 +3479,6 @@
       }
     }
   }
-  .stat {
-    @layer daisyui.l1.l2.l3 {
-      display: inline-grid;
-      width: 100%;
-      column-gap: calc(0.25rem * 4);
-      padding-inline: calc(0.25rem * 6);
-      padding-block: calc(0.25rem * 4);
-      grid-template-columns: repeat(1, 1fr);
-      &:not(:last-child) {
-        border-inline-end: var(--border) dashed currentColor;
-        @supports (color: color-mix(in lab, red, red)) {
-          border-inline-end: var(--border) dashed color-mix(in oklab, currentColor 10%, #0000);
-        }
-        border-block-end: none;
-      }
-    }
-  }
   .card-body {
     @layer daisyui.l1.l2.l3 {
       display: flex;
@@ -3902,6 +3886,9 @@
   .w-3 {
     width: calc(var(--spacing) * 3);
   }
+  .w-4 {
+    width: calc(var(--spacing) * 4);
+  }
   .w-6 {
     width: calc(var(--spacing) * 6);
   }
@@ -5801,6 +5788,9 @@
   .text-error {
     color: var(--color-error);
   }
+  .text-gray-50 {
+    color: var(--color-gray-50);
+  }
   .text-gray-500 {
     color: var(--color-gray-500);
   }
@@ -6782,32 +6772,9 @@
   }
 }
 @layer components {
-  .btn-ouline, .btn-dash {
-    border-width: 1px;
-    border-color: gray;
-  }
-  .btn-active {
-    --btn-bg: var(--color-hura);
-    --btn-fg: #ffffff;
-    --btn-border: var(--color-hura);
-    color: var(--color-white);
-  }
-  .btn-active:hover {
-    --btn-bg: #002bb5;
-    --btn-border: #002bb5;
-  }
   .bg-menu {
     background-color: var(--color-header);
   }
-  .btn-view {
-    background: #f5f7ff;
-    color: var(--color-hura);
-    border: 1px solid var(--color-hura);
-  }
-  .btn-view:hover {
-    background: var(--color-hura);
-    color: #fff;
-  }
   .menu {
     --menu-active-bg: #e9f2ff;
   }
@@ -6933,6 +6900,27 @@
   transition-duration: var(--tw-duration, var(--default-transition-duration));
   flex-grow: 1;
 }
+@layer utilities {
+  .btn-active {
+    --btn-bg: var(--color-hura);
+    --btn-fg: #ffffff;
+    --btn-border: var(--color-hura);
+    color: var(--color-white);
+  }
+  .btn-active:hover {
+    --btn-bg: #002bb5;
+    --btn-border: #002bb5;
+  }
+  .btn-view {
+    background: #f5f7ff;
+    color: var(--color-hura);
+    border: 1px solid var(--color-hura);
+  }
+  .btn-view:hover {
+    background: var(--color-hura);
+    color: #fff;
+  }
+}
 @layer base {
   :where(:root),:root:has(input.theme-controller[value=light]:checked),[data-theme=light] {
     color-scheme: light;
diff --git a/assets/script/hura.global.css b/assets/script/hura.global.css
index a6ac84f..451691b 100644
--- a/assets/script/hura.global.css
+++ b/assets/script/hura.global.css
@@ -41,35 +41,9 @@
 }
 
 @layer components {
-  .btn-ouline,
-  .btn-dash {
-    border-width: 1px;
-    border-color: gray;
-  }
-  .btn-active {
-    --btn-bg: var(--color-hura);
-    --btn-fg: #ffffff;
-    --btn-border: var(--color-hura);
-    color: var(--color-white);
-  }
-  .btn-active:hover {
-    --btn-bg: #002bb5;
-    --btn-border: #002bb5;
-  }
   .bg-menu {
     background-color: var(--color-header);
   }
-  .btn-view {
-    background: #f5f7ff;
-    color: var(--color-hura);
-    border: 1px solid var(--color-hura);
-  }
-
-  .btn-view:hover {
-    background: var(--color-hura);
-    color: #fff;
-  }
-
   /*  menu */
   .menu {
     & {
@@ -242,3 +216,25 @@
   transition-duration: var(--tw-duration, var(--default-transition-duration));
   flex-grow: 1;
 }
+
+@layer utilities {
+  .btn-active {
+    --btn-bg: var(--color-hura);
+    --btn-fg: #ffffff;
+    --btn-border: var(--color-hura);
+    color: var(--color-white);
+  }
+  .btn-active:hover {
+    --btn-bg: #002bb5;
+    --btn-border: #002bb5;
+  }
+  .btn-view {
+    background: #f5f7ff;
+    color: var(--color-hura);
+    border: 1px solid var(--color-hura);
+  }
+  .btn-view:hover {
+    background: var(--color-hura);
+    color: #fff;
+  }
+}
diff --git a/tailwind.config.js b/tailwind.config.js
index 7ab06da..1b1d8cc 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -4,6 +4,7 @@ module.exports = {
         "./src/**/*.html",
         "./src/**/*.js",
         "./assets/script/*.js",
+        "./assets/script/*.css",
     ],
     theme: {
         extend: {
diff --git a/template/order/bargain.html b/template/order/bargain.html
index e10be38..215f640 100644
--- a/template/order/bargain.html
+++ b/template/order/bargain.html
@@ -49,38 +49,38 @@
                     </td>
 
                     <td>
-                        <div id="status_1">
+                        <div id="status_1" class="flex items-center gap-2">
                             <span class="badge badge-success badge-sm badge-soft">Thành công </span>
                             <span class="badge badge-warning badge-sm badge-soft"> Chưa xử lý </span>
                             <span class="badge badge-error badge-sm badge-soft">Hủy bỏ </span>
 
-                            <a href="javascript:edit_order_status(1)" title="Chỉnh sửa" class=""><i
-                                    class="iconify lucide--pencil mt-1 text-primary"></i></a>
+                            <a href="javascript:edit_order_status(1)" title="Chỉnh sửa" class=""><i data-lucide="pencil"
+                                    class="size-4 text-primary"></i></a>
                         </div>
 
                         <p class="mt-2"> Lúc 28-02-2015, 12:40 pm </p>
                     </td>
 
                     <td align="center">
-                        <a href="" class="btn btn-soft btn-error btn-xs btn-square" title="Xóa"> <span
-                                class="iconify lucide--trash-2 tw-rla"></span></a>
+                        <a href="" class="btn btn-soft btn-error btn-xs btn-square" title="Xóa"> <i
+                                data-lucide="trash-2" class="size-4 text-red-200"></i></a>
                     </td>
                 </tr>
             </tbody>
         </table>
     </div>
 
-    <div class="join mt-5 justify-center flex items-cente r">
-        <a href="" class="btn btn-square btn-sm btn-outline border-base-300 join-item" aria-label="Pagination controls">
-            <span class="iconify lucide--arrow-left"></span>
+    <div class="join mt-5 justify-end flex items-center gap-1">
+        <a href="" class="btn btn-ghost btn-circle btn-sm" aria-label="Pagination controls">
+            <i data-lucide="chevron-left" class="size-4"></i>
         </a>
-        <a href="" class="btn btn-square btn-sm btn-outline border-base-300 join-item">1</a>
-        <a href="" class="btn btn-square btn-sm btn-outline border-base-300 join-item btn-active">2</a>
-        <a href="" class="btn btn-square btn-sm btn-outline border-base-300 join-item">3</a>
-        <a href="" class="btn btn-square btn-sm btn-outline border-base-300 join-item">4</a>
-        <a href="" class="btn btn-square btn-sm btn-outline border-base-300 join-item">5</a>
-        <a href="" class="btn btn-square btn-sm btn-outline border-base-300 join-item" aria-label="Pagination controls">
-            <span class="iconify lucide--arrow-right"></span>
+        <a href="" class="btn btn-circle btn-sm btn-ghost">1</a>
+        <a href="" class="btn btn-circle btn-sm btn-ghost btn-active">2</a>
+        <a href="" class="btn btn-circle btn-sm btn-ghost">3</a>
+        <a href="" class="btn btn-circle btn-sm btn-ghost">4</a>
+        <a href="" class="btn btn-circle btn-sm btn-ghost">5</a>
+        <a href="" class="btn btn-ghost btn-circle btn-sm" aria-label="Pagination controls">
+            <i data-lucide="chevron-right" class="size-4"></i>
         </a>
     </div>
 </div>
@@ -96,5 +96,4 @@
             </select> 
         `);
     }
-
 </script>
\ No newline at end of file
diff --git a/template/order/detail.html b/template/order/detail.html
index 39bd351..3f8291a 100644
--- a/template/order/detail.html
+++ b/template/order/detail.html
@@ -7,17 +7,17 @@
 
 <div class="order-detail-page w-[80%] mt-3 m-auto">
 
-    <div class="shadow  rounded-sm bg-white p-3">
+    <div class="shadow  rounded-sm bg-white p-3 border border-base-300">
 
         <div class="flex items-center justify-between">
-            <b class="text-[18px] font-[700] mb-[3px] leading-[23px]">Đơn hàng #000-368</b>
+            <b class="text-[18px] font-bold mb-[3px] leading-[23px]">Đơn hàng #000-368</b>
             <div class="text-right">
-                <a href="" title="In đơn hàng" class="btn ">
-                    <i class="iconify lucide--printer"></i>
+                <a href="" title="In đơn hàng" class="btn btn-view btn-outline btn-sm ">
+                    <i data-lucide="printer" class="size-4"></i>
                     <span>In đơn hàng</span>
                 </a>
-                <a href="" title="" class="btn">
-                    <i class="iconify lucide--mail"></i>
+                <a href="" title="" class="btn btn-view btn-outline btn-sm">
+                    <i data-lucide="mail" class="size-4"></i>
                     <span>Gửi email</span>
                 </a>
             </div>
@@ -26,29 +26,29 @@
     </div>
 
     <div class="grid grid-cols-3 mt-5 gap-3">
-        <div class="col-span-2 shadow  rounded-sm bg-white p-3">
+        <div class="col-span-2 shadow  rounded-sm bg-white p-3 border border-base-300">
             <div class="mb-3">
                 <b class="">1. Khách hàng</b>
 
                 <div class="order-page-table mt-2 border border-base-200 rounded-sm">
-                    <table class="table">
+                    <table class="table table-md">
                         <tr>
-                            <td width="200"> Tên </td>
+                            <td> <b>Tên</b> </td>
                             <td> Nguyen Duc Quan </td>
                         </tr>
 
                         <tr>
-                            <td> Số điện thoại </td>
+                            <td> <b>Số điện thoại</b> </td>
                             <td> 0822256369 </td>
                         </tr>
 
                         <tr>
-                            <td> Email </td>
+                            <td> <b>Email</b> </td>
                             <td> quannd@hurasoft.com </td>
                         </tr>
 
                         <tr>
-                            <td> Địa chỉ nhận hàng </td>
+                            <td> <b>Địa chỉ nhận hàng</b> </td>
                             <td>
                                 <span> Kiến Hưng, Quận Hà Đông, Hà Nội </span>
                                 <a onclick="js_update_shipping_address.showModal()" href="javascript:void(0)"
@@ -58,7 +58,7 @@
                         </tr>
 
                         <tr>
-                            <td> Địa chỉ thanh toán </td>
+                            <td> <b>Địa chỉ thanh toán</b> </td>
                             <td>
                                 <span> Kiến Hưng, Quận Hà Đông, Hà Nội </span>
                                 <a href="javascript:void(0)" onclick="js_update_payment.showModal()" data-fancybox
@@ -71,13 +71,13 @@
             </div>
 
 
-            <div class="mb-3">
+            <div class="mt-5">
                 <b class="">2. Sản phẩm</b>
 
                 <div
                     class="overflow-x-auto lg:whitespace-nowrap ms:whitespace-nowrap md:whitespace-nowrap 2xl:whitespace-normal mt-2 border border-base-200 rounded-sm">
                     <table class="table text-center">
-                        <thead class="bg-base-200">
+                        <thead class="bg-base-200 font-bold text-black">
                             <tr>
                                 <td> STT </td>
                                 <td> Mã kho </td>
@@ -108,20 +108,20 @@
             </div>
 
 
-            <div class="mb-3">
+            <div class="mt-5">
                 <b class="">3. Số tiền</b>
 
                 <div class="order-page-table mt-3 border border-base-200 rounded-sm">
-                    <table class="table">
+                    <table class="table table-md">
                         <tr>
-                            <td width="330"> Tổng giá trị </td>
+                            <td width="330"> <b>Tổng giá trị</b> </td>
                             <td class="font-bold">
                                 69.600.000 VND
                             </td>
                         </tr>
 
                         <tr>
-                            <td> Phí vận chuyển & giao hàng </td>
+                            <td> <b>Phí vận chuyển & giao hàng</b> </td>
                             <td>
                                 <span> 0 VND </span>
                                 <a href="javascript:void()" onclick="js_update_order_shipping.showModal()"
@@ -131,7 +131,7 @@
                         </tr>
 
                         <tr>
-                            <td> Phí thu hộ </td>
+                            <td> <b>Phí thu hộ</b> </td>
                             <td>
                                 <span> 0 VND </span>
                                 <a href="javascript:void()" onclick="js_update_order_shipping.showModal()"
@@ -141,7 +141,7 @@
                         </tr>
 
                         <tr>
-                            <td> Tổng thu </td>
+                            <td> <b>Tổng thu</b> </td>
                             <td> 69.600.000 VND </td>
                         </tr>
                     </table>
@@ -149,12 +149,12 @@
             </div>
 
 
-            <div class="mb-3">
+            <div class="mt-5">
                 <b class="">4. Lịch sử cập nhật</b>
 
                 <div class="order-page-table text-center mt-3 border border-base-200 rounded-sm">
-                    <table class="table">
-                        <thead class="bg-base-200">
+                    <table class="table table-md">
+                        <thead class="bg-base-200 font-bold text-black">
                             <tr>
                                 <td> STT </td>
                                 <td> Phân loại </td>
@@ -183,8 +183,8 @@
         </div>
 
         <div class="">
-            <div class="rounded-sm bg-white p-3 shadow">
-                <p class="mb-[7px] font-[700]">Nhân sự xử lý đơn hàng</p>
+            <div class="rounded-sm bg-white p-3 shadow border border-base-300">
+                <p class="mb-[7px] font-bold">Nhân sự xử lý đơn hàng</p>
                 <p class="flex items-center gap-3">
                     <span class="inline-block">Uyên Hura</span>
                     <a href="javascript:$('#js-assign-holder').toggle()" title="Chỉnh sửa"><i
@@ -204,7 +204,7 @@
                 </div>
             </div>
 
-            <div class="rounded-sm bg-white p-3 shadow mb-4 mt-3">
+            <div class="rounded-sm bg-white p-3 shadow mb-4 mt-3 border border-base-300">
                 <p class="mb-[7px] font-[700]"> Trạng thái thanh toán </p>
 
                 <div class="flex items-center mt-3 gap-3">
@@ -233,7 +233,7 @@
                 <p class="mt-3">Khách chọn: Thanh toán bằng VNPAY</p>
             </div>
 
-            <div class="mt-3 rounded-sm bg-white p-3 shadow mb-4">
+            <div class="mt-3 rounded-sm bg-white p-3 shadow mb-4 border border-base-300">
                 <p class="font-bold"> Trạng thái vận chuyển </p>
 
                 <p class="flex items-center mt-3 gap-3">
@@ -262,7 +262,7 @@
                 <p class="mt-3">Khách chọn: Giao hàng tiêu chuẩn</p>
             </div>
 
-            <div class="mt-3 rounded-sm bg-white p-3 shadow mb-4">
+            <div class="mt-3 rounded-sm bg-white p-3 shadow mb-4 border border-base-300">
                 <p class="font-bold">
                     Trạng thái đơn hàng
                     <a href="javascript:$('#js-order-status-holder').toggle()" title="Chỉnh sửa"><i
@@ -292,7 +292,7 @@
                 </div>
             </div>
 
-            <div class="mt-3 rounded-sm bg-white p-3 shadow mb-4">
+            <div class="mt-3 rounded-sm bg-white p-3 shadow mb-4 border border-base-300">
                 <p class="font-bold"> Ghi chú </p>
 
                 <textarea placeholder=" Ghi chú" id="js-comment" class="textarea"></textarea>
diff --git a/template/order/home.html b/template/order/home.html
index a24c6d2..d8c89b2 100644
--- a/template/order/home.html
+++ b/template/order/home.html
@@ -1,7 +1,7 @@
 <div class="bg-white shadow p-3 rounded-sm">
     <p class="text-2xl font-bold">Danh sách đơn hàng </p>
 
-    <div class="order-page-title flex flex-wrap mt-3 gap-1">
+    <div class="order-page-title flex flex-wrap mt-5 gap-1">
         <a href="/admin/?opt=order" class="btn btn-active">Tất cả</a>
         <a href="/admin/?opt=order&list=mine" class="btn">Tôi được giao</a>
         <a href="/admin/?opt=order&list=new" class="btn">Đơn mới</a>
@@ -36,7 +36,7 @@
                         @input="updateData('dob', $event.target.value)" :data-error="hasError('dob')" name="dob" />
                 </label>
 
-                <input type="submit" value="Tìm kiếm" class="btn btn-primary" onclick="runFilter()">
+                <input type="submit" value="Tìm kiếm" class="btn btn-active" onclick="runFilter()">
             </div>
         </div>
     </form>
@@ -63,9 +63,9 @@
         </div>
     </div>
 
-    <div class="overflow-x-auto sm:whitespace-nowrap border border-base-200 rounded-[4px] mt-5">
-        <table class="table">
-            <thead class="bg-base-200">
+    <div class="overflow-x-auto sm:whitespace-nowrap border border-base-200 rounded-sm mt-5">
+        <table class="table table-md">
+            <thead class="bg-base-200 font-bold">
                 <tr>
                     <td> STT </td>
                     <td> Mã số </td>
@@ -109,7 +109,6 @@
                     <td> Xem </td>
                 </tr>
             </thead>
-
             <tbody>
                 <tr>
                     <td> 1 </td>
@@ -137,9 +136,9 @@
                     <td>
                         <div class="flex justify-center gap-2">
                             <a href="/admin/order/detail?id=369" class="btn btn-soft btn-xs btn-square"
-                                title="Chi tiết"> <span class="iconify lucide--eye tw-rla"></span></a>
-                            <a href="" class="btn btn-soft btn-error btn-xs btn-square" title="Xóa"> <span
-                                    class="iconify lucide--trash-2 tw-rla"></span></a>
+                                title="Chi tiết"> <i data-lucide="eye" class="size-4 text-gray-500"></i></a>
+                            <a href="" class="btn btn-soft btn-error btn-xs btn-square" title="Xóa"> <i
+                                    data-lucide="trash-2" class="size-4 text-red-200"></i></a>
                         </div>
                     </td>
                 </tr>
@@ -170,9 +169,9 @@
                     <td>
                         <div class="flex justify-center gap-2">
                             <a href="/admin/order/detail?id=369" class="btn btn-soft btn-xs btn-square"
-                                title="Chi tiết"> <span class="iconify lucide--eye tw-rla"></span></a>
-                            <a href="" class="btn btn-soft btn-error btn-xs btn-square" title="Xóa"> <span
-                                    class="iconify lucide--trash-2 tw-rla"></span></a>
+                                title="Chi tiết"> <i data-lucide="eye" class="size-4 text-gray-500"></i></a>
+                            <a href="" class="btn btn-soft btn-error btn-xs btn-square" title="Xóa"> <i
+                                    data-lucide="trash-2" class="size-4 text-red-200"></i></a>
                         </div>
                     </td>
                 </tr>
@@ -180,17 +179,17 @@
         </table>
     </div>
 
-    <div class="join mt-5 justify-center flex items-cente r">
-        <a href="" class="btn btn-square btn-sm btn-outline border-base-300 join-item" aria-label="Pagination controls">
-            <span class="iconify lucide--arrow-left"></span>
+    <div class="join mt-5 justify-end flex items-center gap-1">
+        <a href="" class="btn btn-ghost btn-circle btn-sm" aria-label="Pagination controls">
+            <i data-lucide="chevron-left" class="size-4"></i>
         </a>
-        <a href="" class="btn btn-square btn-sm btn-outline border-base-300 join-item">1</a>
-        <a href="" class="btn btn-square btn-sm btn-outline border-base-300 join-item btn-active">2</a>
-        <a href="" class="btn btn-square btn-sm btn-outline border-base-300 join-item">3</a>
-        <a href="" class="btn btn-square btn-sm btn-outline border-base-300 join-item">4</a>
-        <a href="" class="btn btn-square btn-sm btn-outline border-base-300 join-item">5</a>
-        <a href="" class="btn btn-square btn-sm btn-outline border-base-300 join-item" aria-label="Pagination controls">
-            <span class="iconify lucide--arrow-right"></span>
+        <a href="" class="btn btn-circle btn-sm btn-ghost">1</a>
+        <a href="" class="btn btn-circle btn-sm btn-ghost btn-active">2</a>
+        <a href="" class="btn btn-circle btn-sm btn-ghost">3</a>
+        <a href="" class="btn btn-circle btn-sm btn-ghost">4</a>
+        <a href="" class="btn btn-circle btn-sm btn-ghost">5</a>
+        <a href="" class="btn btn-ghost btn-circle btn-sm" aria-label="Pagination controls">
+            <i data-lucide="chevron-right" class="size-4"></i>
         </a>
     </div>
 </div>
\ No newline at end of file
diff --git a/template/order/paygate.html b/template/order/paygate.html
index f329566..df8bbe2 100644
--- a/template/order/paygate.html
+++ b/template/order/paygate.html
@@ -22,7 +22,6 @@
             <p class="whitespace-nowrap"> Từ ngày </p>
 
             <label for="dob" class="input data-error:input-error w-full">
-                <span class="iconify lucide--calendar-1 size-4.5"></span>
                 <input id="dob" type="date" placeholder="+84 78965 12335" :value="getData('dob')"
                     @input="updateData('dob', $event.target.value)" :data-error="hasError('dob')" name="dob" />
             </label>
@@ -30,7 +29,6 @@
         <div class="items-center flex gap-3">
             <p class="whitespace-nowrap"> Đến ngày </p>
             <label for="dob" class="input data-error:input-error w-full">
-                <span class="iconify lucide--calendar-1 size-4.5"></span>
                 <input id="dob" type="date" placeholder="+84 78965 12335" :value="getData('dob')"
                     @input="updateData('dob', $event.target.value)" :data-error="hasError('dob')" name="dob" />
             </label>
@@ -46,7 +44,7 @@
         </div>
 
         <a href="" class="btn btn-outline btn-view">
-            <i class="iconify lucide--file-x"></i>
+            <i data-lucide="file-x" class="size-4"></i>
             <span>Tải file excel</span>
         </a>
     </div>
@@ -89,29 +87,27 @@
 
                     <td>
                         <span class="badge badge-success badge-sm badge-soft">Thành công </span>
-                        <!-- <span class="text-[#0041E8] border-[#0041E8] bg-[#F7F5FF] rounded-[50px] border inline-block leading-[20px] text-[12px] font-[500] p-[0_8px] m-[0_7px_0px_0]"> Chưa xử lý </span>
-                        <span class="text-[#E00000] border-[#E00000] bg-[#F9F2F2] rounded-[50px] border inline-block leading-[20px] text-[12px] font-[500] p-[0_8px] m-[0_7px_0px_0]"> Hủy bỏ </span> -->
                     </td>
                     <td align="center">
-                        <a href="" class="btn btn-soft btn-error btn-xs btn-square" title="Xóa"> <span
-                                class="iconify lucide--trash-2 tw-rla"></span></a>
+                        <a href="" class="btn btn-soft btn-error btn-xs btn-square" title="Xóa"> <i
+                                data-lucide="trash-2" class="size-4 text-red-200"></i></a>
                     </td>
                 </tr>
             </tbody>
         </table>
     </div>
 
-    <div class="join mt-5 justify-center flex items-cente r">
-        <a href="" class="btn btn-square btn-sm btn-outline border-base-300 join-item" aria-label="Pagination controls">
-            <span class="iconify lucide--arrow-left"></span>
+    <div class="join mt-5 justify-end flex items-center gap-1">
+        <a href="" class="btn btn-ghost btn-circle btn-sm" aria-label="Pagination controls">
+            <i data-lucide="chevron-left" class="size-4"></i>
         </a>
-        <a href="" class="btn btn-square btn-sm btn-outline border-base-300 join-item">1</a>
-        <a href="" class="btn btn-square btn-sm btn-outline border-base-300 join-item btn-active">2</a>
-        <a href="" class="btn btn-square btn-sm btn-outline border-base-300 join-item">3</a>
-        <a href="" class="btn btn-square btn-sm btn-outline border-base-300 join-item">4</a>
-        <a href="" class="btn btn-square btn-sm btn-outline border-base-300 join-item">5</a>
-        <a href="" class="btn btn-square btn-sm btn-outline border-base-300 join-item" aria-label="Pagination controls">
-            <span class="iconify lucide--arrow-right"></span>
+        <a href="" class="btn btn-circle btn-sm btn-ghost">1</a>
+        <a href="" class="btn btn-circle btn-sm btn-ghost btn-active">2</a>
+        <a href="" class="btn btn-circle btn-sm btn-ghost">3</a>
+        <a href="" class="btn btn-circle btn-sm btn-ghost">4</a>
+        <a href="" class="btn btn-circle btn-sm btn-ghost">5</a>
+        <a href="" class="btn btn-ghost btn-circle btn-sm" aria-label="Pagination controls">
+            <i data-lucide="chevron-right" class="size-4"></i>
         </a>
     </div>
 </div>
diff --git a/template/order/wait_order.html b/template/order/wait_order.html
index b4d0a62..5ee2fa6 100644
--- a/template/order/wait_order.html
+++ b/template/order/wait_order.html
@@ -24,7 +24,7 @@
         <p> Danh sách các Sản phẩm khách hàng chờ đặt hàng </p>
 
         <a href="" class="btn btn-outline btn-view">
-            <i class="iconify lucide--file-x"></i>
+            <i data-lucide="file-x" class="size-4"></i>
             <span>Tải file excel</span>
         </a>
     </div>
@@ -63,38 +63,38 @@
                     <td> Nhận hàng giờ hành chính </td>
 
                     <td>
-                        <div id="status_1">
+                        <div id="status_1" class="flex items-center gap-3">
                             <span class="badge badge-success badge-sm badge-soft">Thành công </span>
-                            <span class="badge badge-warning badge-sm badge-soft"> Chưa xử lý </span>
-                            <span class="badge badge-error badge-sm badge-soft">Hủy bỏ </span>
+                            <!-- <span class="badge badge-warning badge-sm badge-soft"> Chưa xử lý </span>
+                            <span class="badge badge-error badge-sm badge-soft">Hủy bỏ </span> -->
 
-                            <a href="javascript:edit_order_status(1)" title="Chỉnh sửa" class=""><i
-                                    class="iconify lucide--pencil mt-1 text-primary"></i></a>
+                            <a href="javascript:edit_order_status(1)" title="Chỉnh sửa" class=""><i data-lucide="pencil"
+                                    class="size-4 text-primary"></i></a>
                         </div>
 
                         <p class="mt-2"> Lúc 28-02-2015, 12:40 pm </p>
                     </td>
 
                     <td align="center">
-                        <a href="" class="btn btn-soft btn-error btn-xs btn-square" title="Xóa"> <span
-                                class="iconify lucide--trash-2 tw-rla"></span></a>
+                        <a href="" class="btn btn-soft btn-error btn-xs btn-square" title="Xóa"> <i
+                                data-lucide="trash-2" class="size-4 text-red-200"></i></a>
                     </td>
                 </tr>
             </tbody>
         </table>
     </div>
 
-    <div class="join mt-5 justify-center flex items-cente r">
-        <a href="" class="btn btn-square btn-sm btn-outline border-base-300 join-item" aria-label="Pagination controls">
-            <span class="iconify lucide--arrow-left"></span>
+    <div class="join mt-5 justify-end flex items-center gap-1">
+        <a href="" class="btn btn-ghost btn-circle btn-sm" aria-label="Pagination controls">
+            <i data-lucide="chevron-left" class="size-4"></i>
         </a>
-        <a href="" class="btn btn-square btn-sm btn-outline border-base-300 join-item">1</a>
-        <a href="" class="btn btn-square btn-sm btn-outline border-base-300 join-item btn-active">2</a>
-        <a href="" class="btn btn-square btn-sm btn-outline border-base-300 join-item">3</a>
-        <a href="" class="btn btn-square btn-sm btn-outline border-base-300 join-item">4</a>
-        <a href="" class="btn btn-square btn-sm btn-outline border-base-300 join-item">5</a>
-        <a href="" class="btn btn-square btn-sm btn-outline border-base-300 join-item" aria-label="Pagination controls">
-            <span class="iconify lucide--arrow-right"></span>
+        <a href="" class="btn btn-circle btn-sm btn-ghost">1</a>
+        <a href="" class="btn btn-circle btn-sm btn-ghost btn-active">2</a>
+        <a href="" class="btn btn-circle btn-sm btn-ghost">3</a>
+        <a href="" class="btn btn-circle btn-sm btn-ghost">4</a>
+        <a href="" class="btn btn-circle btn-sm btn-ghost">5</a>
+        <a href="" class="btn btn-ghost btn-circle btn-sm" aria-label="Pagination controls">
+            <i data-lucide="chevron-right" class="size-4"></i>
         </a>
     </div>
 </div>