diff --git a/packages/esm-ward-app/src/ward-view-header/admission-requests-bar.component.tsx b/packages/esm-ward-app/src/ward-view-header/admission-requests-bar.component.tsx
index 40d0acec0..49fe8f596 100644
--- a/packages/esm-ward-app/src/ward-view-header/admission-requests-bar.component.tsx
+++ b/packages/esm-ward-app/src/ward-view-header/admission-requests-bar.component.tsx
@@ -16,7 +16,7 @@ const AdmissionRequestsBar: React.FC<AdmissionRequestsBarProps> = ({ wardPending
   const { t } = useTranslation();
   const layout = useLayoutType();
 
-  if (isLoading || !inpatientRequests?.length) {
+  if (isLoading || !inpatientRequests) {
     return null;
   }
 
@@ -31,7 +31,9 @@ const AdmissionRequestsBar: React.FC<AdmissionRequestsBarProps> = ({ wardPending
   }
 
   return (
-    <div className={styles.admissionRequestsContainer}>
+    <div className={`${styles.admissionRequestsContainer} ${
+      inpatientRequests?.length ? styles.blackBackground : styles.lightBlueBackground
+    }`}>
       <Movement className={styles.movementIcon} size="24" />
       <span className={styles.content}>
         {t('admissionRequestsCount', '{{count}} admission request', {
diff --git a/packages/esm-ward-app/src/ward-view-header/admission-requests.scss b/packages/esm-ward-app/src/ward-view-header/admission-requests.scss
index f8fb13c37..bc386daac 100644
--- a/packages/esm-ward-app/src/ward-view-header/admission-requests.scss
+++ b/packages/esm-ward-app/src/ward-view-header/admission-requests.scss
@@ -30,8 +30,18 @@
   margin-right: layout.$spacing-03;
 }
 
+.blackBackground {
+  background-color: black;
+  color: white;
+}
+
+.lightBlueBackground {
+  background-color: white;
+  border-left:4px solid $color-blue-60-2;
+  color: black;
+}
+
 .content {
   @include type.type-style('heading-compact-01');
-  color: $ui-02;
   margin-right: layout.$spacing-03;
 }