shipment Changes

resources/views/admin/account.blade.php

@@ -48,7 +48,7 @@ body {
 
 /* top actions row */
 .top-actions {
-  display:flex; align-items:center; justify-content:space-between;
+   align-items:center; justify-content:space-between;
   gap:12px; margin:16px 0 20px 0; flex-wrap:wrap;
 }
 .top-actions .left {
@@ -67,7 +67,7 @@ body {
   cursor:pointer; transition: transform .15s ease, box-shadow .15s;
 }
 .btn.ghost { background: transparent; color:var(--primary-1); border:1.5px solid #dbe4f5; box-shadow:none; }
-.btn:hover{ transform: translateY(-3px); box-shadow: 0 8px 26px rgba(36,58,114,0.12); }
+.btn:hover{ transform: translateY(-3px); box-shadow: 0 8px 26px rgba(227, 229, 234, 0.12); }
 
 /* account panels */
 .account-panels { 
@@ -89,12 +89,12 @@ body {
   background: var(--card-bg); 
   border-radius:12px; 
   box-shadow:0 8px 20px rgba(25,40,80,0.06);
-  padding:22px; 
+  padding:20px;                                 /* 005 */
   box-sizing:border-box; 
   overflow-x:auto; 
   transition: transform .12s, box-shadow .12s;
   min-height: 520px;
-  display: flex;
+  /* display: flex; */           /* 005 */
   flex-direction: column;
   flex: 1;
   height: 100%;
@@ -205,8 +205,8 @@ tr:hover td{ background:#fbfdff; }
 .toggle-switch-btn {
     appearance:none;
     -webkit-appearance:none;
-    width:60px;
+    width:64px;
-    height:24px;
+    height:26.5px;     /* 005 */
     background:#f25b5b;
     border:2px solid #f25b5b;
     border-radius:999px;
@@ -306,6 +306,15 @@ tr:hover td{ background:#fbfdff; }
 #consolidateOrdersTable th, #consolidateOrdersTable td { padding:10px 12px; font-size:13px; border-bottom:1px solid #f1f6ff; }
 
 /* ---------- Pagination Styles ---------- */
+.pagination-container {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-top: 15px;
+    padding: 12px 0;
+    border-top: 1px solid #eef3fb;
+    /* margin-right:550px; */
+}
 .pagination-container {
     display: flex;
     justify-content: space-between;
@@ -326,14 +335,15 @@ tr:hover td{ background:#fbfdff; }
     display: flex;
     align-items: center;
     gap: 8px;
-    margin-right:-1050px;
+    position: absolute;
+    right: 16px;                /* 005 */
     
 }
 .pagination-controls1 {
     display: flex;
     align-items: center;
     gap: 8px;
-    margin-right:-550px;
+    /* margin-right:-550px; */
     
 }
 
@@ -563,7 +573,7 @@ tr:hover td{ background:#fbfdff; }
 
 /* Combined filters row styling */
 .combined-filters-row {
-    display: flex;
+    display: ruby;                        /* 005 */
     gap: 12px;
     align-items: center;
     margin-bottom: 16px;
@@ -576,8 +586,8 @@ tr:hover td{ background:#fbfdff; }
 }
 
 .right{
-    margin-left:auto;
+    /* margin-left:auto;
-    margin-top:-16px;
+    margin-top:-16px; */     /* 005 */
 }
 
 .filter-group1 {
@@ -953,6 +963,15 @@ tr:hover td{ background:#fbfdff; }
     transition: background 0.2s;
 }
 
+.combined-top-row .btn:hover {
+    color: #ffffff !important;
+    background-color: inherit !important;
+    border-color: inherit !important;
+    transform: none !important;
+    box-shadow: none !important;
+}
+
+
 .remove-order-btn:hover {
     background: #d42c3f;
 }
@@ -1314,7 +1333,7 @@ html, body {
 <div class="create-order-modal" id="createOrderModal">
     <div class="modal-box">
         <div style="display:flex; align-items:center; justify-content:space-between; margin-bottom:16px;">
-            <div style="font-size:20px; font-weight:800; color:var(--primary-1)">Create New Installment</div>
+            <div style="font-size:20px; font-weight:800;">Create New Installment</div>
             <button class="btn ghost" id="closeCreateModal" title="Close create form">✕</button>
         </div>
 
@@ -1375,7 +1394,7 @@ html, body {
                     
                     <!-- Pagination for Create Order Modal -->
                     <div class="modal-pagination-wrapper pagination-right">
-                        <div class="pagination-container">
+                        <div class="pagination-container1">
                             <div class="pagination-info" id="modalPageInfo">Showing 0 entries</div>
                             <div class="pagination-controls2">
                                 <button class="pagination-img-btn" id="modalPrevBtn" title="Previous page">

resources/views/admin/dashboard.blade.php

@@ -632,24 +632,49 @@ body, .container-fluid {
 }
 
 .create-order-modal .table-wrapper {
-  max-height: 300px;
+  width: 100%;
+  max-height: 400px;
   overflow-y: auto;
+  overflow-x: hidden !important; /* NO HORIZONTAL SCROLL */
   border: 1px solid #e9ecef;
-  border-radius: 8px;
+  border-radius: 12px;
+  background: #fff;
+  box-shadow: 0 4px 20px rgba(0,0,0,0.08);
+  padding: 12px;
+  position: relative;
 }
 
-.create-order-modal .table {
+
+.create-order-modal .table-wrapper .table {
   margin-bottom: 0;
   background: #fff;
+  min-width: 100% !important; /* FULL RESPONSIVE WIDTH */
+  font-size: 13px;
+  border-collapse: separate;
+  border-spacing: 0;
 }
 
-.create-order-modal .table th {
+.create-order-modal .table th,
-  background: #f8f9fa;
+.create-order-modal .table td {
-  font-weight: 600;
+    padding: 8px 6px !important;
-  position: sticky;
+    white-space: nowrap;
-  top: 0;
+    overflow: hidden;
-  z-index: 10;
+    text-overflow: ellipsis;
-  font-family: 'Inter', sans-serif;
+    max-width: 120px;
+    vertical-align: middle;
+}
+.create-order-modal .table th:nth-child(2), /* Description */
+.create-order-modal .table td:nth-child(2) { max-width: 160px; }
+
+.create-order-modal .table th:nth-child(9), /* TTL Amount */
+.create-order-modal .table td:nth-child(9) { max-width: 90px; font-weight: 600; }
+
+.create-order-modal .table .items-input {
+    width: 100%;
+    padding: 4px 6px;
+    font-size: 12px;
+    min-width: 60px;
+    max-width: 120px;
 }
 
 /* items table inputs */
@@ -1311,47 +1336,7 @@ body, .container-fluid {
                     </a>
                   </td>
                   <td>{{ $order->mark_no }}</td>
-                  <td>{{ $order->origin }}</td>
-                  <td>{{ $order->destination }}</td>
-                  <td>{{ $order->ctn }}</td>
-                  <td>{{ $order->qty }}</td>
-                  <td>{{ $order->ttl_qty }}</td>
-                  <td>₹{{ number_format($order->ttl_amount, 2) }}</td>
-                  <td>{{ $order->cbm }}</td>
-                  <td>{{ $order->ttl_cbm }}</td>
-                  <td>{{ $order->kg }}</td>
-                  <td>{{ $order->ttl_kg }}</td>
-                  <td>
-                    <span class="badge badge-{{ $order->status }}">
-                      @if($order->status == 'pending')
-                        <i class="bi bi-clock-fill status-icon"></i>
-                      @elseif($order->status == 'in_transit')
-                        <i class="bi bi-truck status-icon"></i>
-                      @elseif($order->status == 'dispatched')
-                        <i class="bi bi-box-seam status-icon"></i>
-                      @elseif($order->status == 'delivered')
-                        <i class="bi bi-check-circle-fill status-icon"></i>
-                      @endif
-                      {{ ucfirst(str_replace('_', ' ', $order->status)) }}
-                    </span>
-                  </td>
                   <td>{{ $order->created_at->format('d-m-Y') }}</td>
-                  <td>
-                    <a href="{{ route('admin.orders.show', $order->id) }}" class="btn btn-sm btn-outline-primary">
-                      <i class="bi bi-eye"></i> View
-                    </a>
-                  </td>
-                </tr>
-                @empty
-                <tr>
-                  <td colspan="16" class="text-muted">No orders found</td>
-                </tr>
-                @endforelse
-              </tbody>
-            </table>
-          </div>
-
-                    <td>{{ $order->mark_no }}</td>
                   <td>{{ $order->origin }}</td>
                   <td>{{ $order->destination }}</td>
                   <td>{{ $order->ctn }}</td>
@@ -1405,8 +1390,6 @@ body, .container-fluid {
                         {{ $order->status_label }}
                     </span>
                   </td>
-
-                    <td>{{ $order->created_at->format('d-m-Y') }}</td>
                   <td>
                     <a href="{{ route('admin.orders.show', $order->id) }}" class="btn btn-sm btn-outline-primary">
                       <i class="bi bi-eye"></i> View
@@ -1421,6 +1404,10 @@ body, .container-fluid {
               </tbody>
             </table>
           </div>
+          <div class="pagination-container">
+            <div class="pagination-info" id="pageInfo">
+              Showing 1 to {{ min($orders->count(), 10) }} of {{ $orders->count() }} entries
+            </div>
             <div class="pagination-controls">
               <button class="pagination-img-btn" id="prevPageBtn" title="Previous page">
                 <svg width="16" height="16" viewBox="0 0 16 16" fill="none"
@@ -1447,7 +1434,6 @@ body, .container-fluid {
               </button>
             </div>
           </div>
-
         </div>
       </div>
     </div>
@@ -1923,6 +1909,7 @@ document.addEventListener('DOMContentLoaded', function() {
                     </a>
                 </td>
                 <td>${order.mark_no || ''}</td>
+                <td>${new Date(order.created_at).toLocaleDateString('en-GB')}</td>
                 <td>${order.origin || ''}</td>
                 <td>${order.destination || ''}</td>
                 <td>${order.ctn || ''}</td>
@@ -1934,15 +1921,11 @@ document.addEventListener('DOMContentLoaded', function() {
                 <td>${order.kg || ''}</td>
                 <td>${order.ttl_kg || ''}</td>
                 <td>
-                    <span class="badge badge-${order.status}">
+                    <span class="badge bg-${getBadgeClass(order.status)}">
-                        ${order.status === 'pending' ? '<i class="bi bi-clock-fill status-icon"></i>' : ''}
+                        <i class="bi ${getIconClass(order.status)} status-icon"></i>
-                        ${order.status === 'in_transit' ? '<i class="bi bi-truck status-icon"></i>' : ''}
+                        ${order.status_label || order.status}
-                        ${order.status === 'dispatched' ? '<i class="bi bi-box-seam status-icon"></i>' : ''}
-                        ${order.status === 'delivered' ? '<i class="bi bi-check-circle-fill status-icon"></i>' : ''}
-                        ${order.status ? order.status.charAt(0).toUpperCase() + order.status.slice(1).replace('_', ' ') : ''}
                     </span>
                 </td>
-                <td>${new Date(order.created_at).toLocaleDateString('en-GB')}</td>
                 <td>
                     <a href="/admin/orders/${order.id}" class="btn btn-sm btn-outline-primary">
                         <i class="bi bi-eye"></i> View
@@ -1976,6 +1959,50 @@ document.addEventListener('DOMContentLoaded', function() {
         });
     }
 
+    function getBadgeClass(status) {
+        const badgeMap = {
+            'order_placed': 'secondary',
+            'order_confirmed': 'info',
+            'supplier_warehouse': 'warning',
+            'consolidate_warehouse': 'warning',
+            'export_custom': 'primary',
+            'international_transit': 'primary',
+            'arrived_india': 'info',
+            'import_custom': 'info',
+            'warehouse': 'dark',
+            'domestic_distribution': 'primary',
+            'out_for_delivery': 'success',
+            'delivered': 'success',
+            'pending': 'warning',
+            'in_transit': 'info',
+            'dispatched': 'primary',
+            'delivered': 'success'
+        };
+        return badgeMap[status] || 'secondary';
+    }
+
+    function getIconClass(status) {
+        const iconMap = {
+            'order_placed': 'bi-clock-fill',
+            'order_confirmed': 'bi-check-circle',
+            'supplier_warehouse': 'bi-box-seam',
+            'consolidate_warehouse': 'bi-boxes',
+            'export_custom': 'bi-upload',
+            'international_transit': 'bi-truck',
+            'arrived_india': 'bi-geo-alt',
+            'import_custom': 'bi-download',
+            'warehouse': 'bi-building',
+            'domestic_distribution': 'bi-diagram-3',
+            'out_for_delivery': 'bi-truck-flatbed',
+            'delivered': 'bi-check-circle-fill',
+            'pending': 'bi-clock-fill',
+            'in_transit': 'bi-truck',
+            'dispatched': 'bi-box-seam',
+            'delivered': 'bi-check-circle-fill'
+        };
+        return iconMap[status] || 'bi-info-circle';
+    }
+
     itemsTableBody.addEventListener('keydown', function(e) {
         if (e.key !== 'Enter' || e.target.tagName !== 'INPUT') return;
         e.preventDefault();
@@ -2029,7 +2056,6 @@ const uploadExcelBtn = document.getElementById('uploadExcelBtn');
     const excelInput = document.getElementById('excelInput');
 
     if (uploadExcelBtn && excelInput) {
-
         uploadExcelBtn.addEventListener('click', () => excelInput.click());
 
         excelInput.addEventListener('change', function () {
@@ -2066,7 +2092,6 @@ if (uploadExcelBtn && excelInput) {
                 alert('Excel upload failed');
             });
         });
-
     }
 
     function populateItemsTable(items) {