refactor: update icon usage to use mdi imports for consistency

src/components/layouts/sk-admin-layout/SkAdminAppBarBreadcrumbCol.vue

@@ -12,12 +12,12 @@ v-if="features.showFavorites && !showFavoritesBar" class="mr-2" color="primary"
       </template>
       <template #item="{ item }">
         <div class="d-flex align-center ga-1">
-          <v-icon v-if="item.icon" class="mr-1" size="14">{{ item.icon }}</v-icon>
+          <v-icon v-if="item.icon" class="mr-1" size="14" :icon="item.icon" />
           <span class="text-caption text-no-wrap">{{ item.title }}</span>
         </div>
       </template>
       <template #divider>
-        <v-icon color="primary-variant" size="12">mdi-chevron-right</v-icon>
+        <v-icon color="primary-variant" size="12" :icon="mdiChevronRight" />
       </template>
     </v-breadcrumbs>
     <div class="page-actions">
@@ -27,6 +27,7 @@ v-if="features.showFavorites && !showFavoritesBar" class="mr-2" color="primary"
 </template>
 
 <script setup>
+import { mdiChevronRight } from '@mdi/js'
 defineProps({
   features: { type: Object, default: () => ({}) },
   showBreadcrumbBar: { type: Boolean, default: true },