diff --git a/resources/assets/vue/components/orders/elements/UnclaimedPackinglistComponent.vue b/resources/assets/vue/components/orders/elements/UnclaimedPackinglistComponent.vue
index fd156c6c..6c89bb61 100644
--- a/resources/assets/vue/components/orders/elements/UnclaimedPackinglistComponent.vue
+++ b/resources/assets/vue/components/orders/elements/UnclaimedPackinglistComponent.vue
@@ -8,26 +8,26 @@
                             <div class="row align-items-center">
                                 <div class="col-auto">
                                     <p class="no-margin all-caps fs-10 light">Reference</p>
-                                    <p class="no-margin text-success bold">{{data.reference ? data.reference : 'n/a'}}</p>
+                                    <p class="no-margin bold">{{data.reference ? data.reference : 'n/a'}}</p>
                                 </div>
                                 <div class="col-auto">
                                     <p class="no-margin all-caps fs-10 light">Arrival Date</p>
-                                    <p class="no-margin text-success bold">{{data.transport ? data.transport.drop_date : 'n/a'}}</p>
+                                    <p class="no-margin bold">{{data.transport ? data.transport.drop_date : 'n/a'}}</p>
                                 </div>
                             </div>
                             <div class="row align-items-center">
                                 <div class="col-auto">
                                     <p class="no-margin all-caps fs-10 light">Tracking Reference</p>
-                                    <p class="no-margin text-success bold">{{data.transport ? data.transport.tracking_number : 'n/a'}}</p>
+                                    <p class="no-margin bold">{{data.transport ? data.transport.tracking_number : 'n/a'}}</p>
                                 </div>
                                 <div class="col-auto">
                                     <p class="no-margin all-caps fs-10 light">Description</p>
-                                    <p class="no-margin text-success bold">{{data.packages ? data.packages[0].description: 'n/a'}}</p>
+                                    <p class="no-margin bold">{{data.packages ? data.packages[0].description: 'n/a'}}</p>
                                 </div>
                             </div>
                             <div class="row" v-if="$store.getters.isSuperAdmin">
                                 <div class="col-auto">
-                                    <button type="button" class="btn btn-block b-rad-none btn-danger fs-11 requestModal" data-type="deletePackingList"><i class="fa fa-times"></i></button>
+                                    <button type="button" class="btn btn-sm b-rad-none btn-outline-danger fs-11 requestModal" data-type="deletePackingList"><i class="fa fa-times"></i></button>
                                     <modal-component class="animate__animated animate__fast animate__fadeIn" styleType="fill-in" type="deletePackingList">
                                         <div class="row">
                                             <div class="col">
@@ -54,7 +54,7 @@
                                     </modal-component>
                                 </div>
                                 <div class="col">
-                                    <button type="button" class="btn btn-block b-rad-none btn-primary fs-11 requestModal" data-type="claimPackingList">Claim</button>
+                                    <button type="button" class="btn btn-sm btn-block b-rad-none btn-success fs-11 requestModal" data-type="claimPackingList">Claim</button>
                                     <modal-component class="animate__animated animate__fast animate__fadeIn" styleType="fill-in" type="claimPackingList">
                                         <claim-packinglist-form-component :data="data.id"></claim-packinglist-form-component>
                                     </modal-component>