diff --git a/@xen-orchestra/lite/src/components/host/network/HostPifSidePanel.vue b/@xen-orchestra/lite/src/components/host/network/HostPifSidePanel.vue
index 472f552326a..8f04b136e9b 100644
--- a/@xen-orchestra/lite/src/components/host/network/HostPifSidePanel.vue
+++ b/@xen-orchestra/lite/src/components/host/network/HostPifSidePanel.vue
@@ -56,7 +56,7 @@
             {{ $t('pif-status') }}
           </template>
           <template #value>
-            <HostPifStatus :pif-status="pif.currently_attached" card />
+            <VtsConnectionStatus :status="getPifStatus(pif)" />
           </template>
         </VtsCardRowKeyValue>
         <VtsCardRowKeyValue>
@@ -64,7 +64,7 @@
             {{ $t('physical-interface-status') }}
           </template>
           <template #value>
-            <HostPifStatus :pif-status="pif.currently_attached" card />
+            <VtsConnectionStatus :status="getPhysicalInterfaceStatus(pif)" />
           </template>
         </VtsCardRowKeyValue>
         <VtsCardRowKeyValue>
@@ -203,11 +203,11 @@
 </template>
 
 <script setup lang="ts">
-import HostPifStatus from '@/components/host/network/HostPifStatus.vue'
 import type { XenApiNetwork, XenApiPif } from '@/libs/xen-api/xen-api.types'
 import { useNetworkStore } from '@/stores/xen-api/network.store'
 import { usePifMetricsStore } from '@/stores/xen-api/pif-metrics.store'
 import VtsCardRowKeyValue from '@core/components/card/VtsCardRowKeyValue.vue'
+import VtsConnectionStatus from '@core/components/connection-status/VtsConnectionStatus.vue'
 import VtsIcon from '@core/components/icon/VtsIcon.vue'
 import UiButton from '@core/components/ui/button/UiButton.vue'
 import UiButtonIcon from '@core/components/ui/button-icon/UiButtonIcon.vue'
@@ -235,7 +235,7 @@ const { pif } = defineProps<{
 }>()
 
 const { getByOpaqueRef: getOpaqueRefNetwork } = useNetworkStore().subscribe()
-const { getByOpaqueRef: getOpaqueRefMetrics } = usePifMetricsStore().subscribe()
+const { getByOpaqueRef: getOpaqueRefMetrics, getPifCarrier } = usePifMetricsStore().subscribe()
 
 const allIps = computed(() => {
   return [pif.IP, ...pif.IPv6].filter(ip => ip)
@@ -254,6 +254,23 @@ const getNetworkData = (type: keyof XenApiNetwork) => {
   }
 }
 
+const getPifStatus = (pif: XenApiPif) => {
+  const carrier = getPifCarrier(pif)
+  const currentlyAttached = pif.currently_attached
+
+  if (currentlyAttached && carrier) {
+    return 'connected'
+  }
+  if (currentlyAttached && !carrier) {
+    return 'partially-connected'
+  }
+  return 'disconnected'
+}
+
+const getPhysicalInterfaceStatus = (pif: XenApiPif) => {
+  return pif.physical ? 'connected' : 'disconnected-from-physical-device'
+}
+
 const getSpeedData = (speedRef: string) => {
   const metrics = getOpaqueRefMetrics(speedRef)
   return metrics?.speed ? metrics.speed : 0
diff --git a/@xen-orchestra/lite/src/components/host/network/HostPifStatus.vue b/@xen-orchestra/lite/src/components/host/network/HostPifStatus.vue
deleted file mode 100644
index 1590f46082d..00000000000
--- a/@xen-orchestra/lite/src/components/host/network/HostPifStatus.vue
+++ /dev/null
@@ -1,44 +0,0 @@
-<template>
-  <UiInfo class="pif-status text-ellipsis" :accent="getStatusProps(status).accent">
-    <p class="text-ellipsis" :class="{ card }">{{ getStatusProps(status).text }}</p>
-  </UiInfo>
-</template>
-
-<script setup lang="ts">
-import UiInfo from '@core/components/ui/info/UiInfo.vue'
-import type { IconDefinition } from '@fortawesome/fontawesome-common-types'
-import { faCheck, faExclamation } from '@fortawesome/free-solid-svg-icons'
-import { computed } from 'vue'
-import { useI18n } from 'vue-i18n'
-
-const { pifStatus, card } = defineProps<{
-  pifStatus: any
-  card?: boolean
-}>()
-
-const { t } = useI18n()
-
-type Status = 'connected' | 'disconnected' | 'partial'
-type Accent = 'success' | 'warning' | 'danger'
-
-const states = computed<Record<Status, { text: string; icon: IconDefinition; accent: Accent }>>(() => ({
-  connected: { text: t('connected'), icon: faCheck, accent: 'success' },
-  disconnected: { text: t('disconnected'), icon: faCheck, accent: 'danger' },
-  partial: { text: t('disconnected-from-physical-device'), icon: faExclamation, accent: 'warning' },
-}))
-
-const status = computed(() => {
-  if (pifStatus) {
-    return 'connected'
-  }
-  return 'disconnected'
-})
-
-const getStatusProps = (status: Status) => states.value[status]
-</script>
-
-<style scoped lang="postcss">
-p:not(.card) {
-  font-size: 1.4rem !important;
-}
-</style>
diff --git a/@xen-orchestra/lite/src/components/host/network/HostPifTable.vue b/@xen-orchestra/lite/src/components/host/network/HostPifTable.vue
index 5a78e5d7ef2..f96a6def1cc 100644
--- a/@xen-orchestra/lite/src/components/host/network/HostPifTable.vue
+++ b/@xen-orchestra/lite/src/components/host/network/HostPifTable.vue
@@ -45,23 +45,24 @@
         @toggle-select-all="toggleSelect"
       />
       <VtsLoadingHero :disabled="isReady" type="table">
-        <div class="table">
-          <VtsTable vertical-border>
-            <thead>
-              <tr>
-                <template v-for="column of visibleColumns" :key="column.id">
-                  <th v-if="column.id === 'checkbox'" class="checkbox">
-                    <UiCheckbox :v-model="areAllSelected" accent="info" @update:model-value="toggleSelect" />
-                  </th>
-                  <th v-else-if="column.id === 'more'" class="more">
-                    <UiButtonIcon size="small" accent="info" :icon="getHeaderIcon(column.id)" />
-                    {{ column.label }}
-                  </th>
-                  <ColumnTitle v-else id="networks" :icon="getHeaderIcon(column.id)"> {{ column.label }}</ColumnTitle>
-                </template>
-              </tr>
-            </thead>
-            <tbody>
+      <div class="table">
+        <VtsTable vertical-border>
+          <thead>
+            <tr>
+              <template v-for="column of visibleColumns" :key="column.id">
+                <th v-if="column.id === 'checkbox'" class="checkbox">
+                  <UiCheckbox :v-model="areAllSelected" accent="info" @update:model-value="toggleSelect" />
+                </th>
+                <th v-else-if="column.id === 'more'" class="more">
+                  <UiButtonIcon size="small" accent="info" :icon="getHeaderIcon(column.id)" />
+                </th>
+                <ColumnTitle v-else id="networks" :icon="getHeaderIcon(column.id)">
+                  <span class="text-ellipsis">{{ column.label }}</span>
+                </ColumnTitle>
+              </template>
+            </tr>
+          </thead>
+          <tbody>
             <tr
               v-for="row of rows"
               :key="row.id"
@@ -145,7 +146,7 @@ import {
 import { computed, ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 
-const { pifs, hasError } = defineProps<{
+const { pifs } = defineProps<{
   pifs: XenApiPif[]
   isReady: boolean
   hasError: boolean
diff --git a/@xen-orchestra/lite/src/views/host/HostNetworkView.vue b/@xen-orchestra/lite/src/views/host/HostNetworkView.vue
index c3e4b6d4996..c6e7e995b96 100644
--- a/@xen-orchestra/lite/src/views/host/HostNetworkView.vue
+++ b/@xen-orchestra/lite/src/views/host/HostNetworkView.vue
@@ -4,7 +4,7 @@
       <HostPifTable :pifs="pifs" :is-ready @row-select="selectPif" :has-error />
     </UiCard>
     <HostPifSidePanel v-if="selectedPif" :pif="selectedPif" />
-    <UiPanel v-else class="panel-container">
+    <UiPanel v-else class="panel">
       <VtsNoSelectionHero type="panel" />
     </UiPanel>
   </div>
@@ -43,9 +43,9 @@ const selectPif = (id: XenApiPif['uuid']) => {
     margin: 0.8rem;
   }
 
-  .panel-container {
-    min-width: 40rem;
+  .panel {
     border-top: none;
+    border-right: none;
   }
 }
 </style>
diff --git a/@xen-orchestra/web-core/lib/components/ui/panel/UiPanel.vue b/@xen-orchestra/web-core/lib/components/ui/panel/UiPanel.vue
index bbb0c10e60d..bea2958136b 100644
--- a/@xen-orchestra/web-core/lib/components/ui/panel/UiPanel.vue
+++ b/@xen-orchestra/web-core/lib/components/ui/panel/UiPanel.vue
@@ -44,6 +44,7 @@ const slots = defineSlots<{
     flex-direction: column;
     padding: 0.8rem;
     gap: 0.8rem;
+    min-width: calc(40rem - 0.1rem);
   }
 
   &.error {