changes

app/components/dashboard/AvatarBox.vue

@@ -1,7 +1,7 @@
 <template>
   <div
     class="fs-13 font-semibold mx-0 px-0 is-flex is-justify-content-center is-align-items-center is-flex-shrink-0 rounded-full size-10"
-    style="border: 1px solid var(--bulma-grey-lighter)"
+    style="border: 1px solid var(--bulma-grey-85)"
     :style="image && 'border: none'"
   >
     <div>
@@ -21,7 +21,7 @@ export default {
   display: flex;
   align-items: center;
   justify-content: center;
-  border: var(--bulma-grey-lighter);
+  border: var(--bulma-grey-85);
   border-radius: 50%;
 }
 </style>

app/components/dashboard/DeliveryInteractive.vue

@@ -539,6 +539,6 @@
   border-left-width: 1px;
 }
 .border-gray-300 {
-  border-color: var(--bulma-grey-lighter);
+  border-color: var(--bulma-grey-85);
 }
 </style>

app/components/dashboard/Driver.vue

@@ -12,7 +12,7 @@ const props = defineProps({
   <div
     class="is-flex is-gap-2 fs-14 p-3 rounded-lg"
     :style="{
-      border: '1px solid var(--bulma-grey-lighter)',
+      border: '1px solid var(--bulma-grey-85)',
     }"
   >
     <AvatarBox :text="name.slice(0, 2)" />