From b4080617d9caef5376014464f9d8348da934e94a Mon Sep 17 00:00:00 2001
From: Mariela Tihova <MTihova@infragistics.com>
Date: Mon, 21 Jul 2025 15:36:41 +0300
Subject: [PATCH 1/2] CSS modifications to resolve design mismatch

---
 src/app/views/home/home.component.scss | 18 +++++++++++-------
 1 file changed, 11 insertions(+), 7 deletions(-)

diff --git a/src/app/views/home/home.component.scss b/src/app/views/home/home.component.scss
index 9b7c6f1..c517b15 100644
--- a/src/app/views/home/home.component.scss
+++ b/src/app/views/home/home.component.scss
@@ -46,7 +46,7 @@ $custom-icon-button-theme: icon-button-theme(
 
 .tab-item-container {
   width: 100%;
-  height: 100%;
+  height: 72px;
   display: inline-flex;
 }
 
@@ -56,19 +56,24 @@ $custom-icon-button-theme: icon-button-theme(
   display: flex;
   flex-grow: 1;
   flex-basis: 0;
-  flex-direction: column;
-  justify-content: space-between;
+  flex-direction: row;
+  justify-content: center;
   gap: 8px;
   padding: 12px;
   cursor: pointer;
   user-select: none;
+  color: var(--ig-gray-900);
 
   &--selected {
     border-bottom: 3px solid var(--ig-primary-500);
+    color: var(--ig-primary-500);
   }
 
   &:hover {
-    background: hsl(from var(--ig-gray-100) h s l/0.5);
+    background-color: #e6f2ff;
+    box-shadow: 0 2px 8px rgba(0, 123, 255, 0.15);
+    transition: all 0.5s ease;
+    transform: translateY(-2px); // slight lift
   }
 }
 
@@ -76,10 +81,9 @@ $custom-icon-button-theme: icon-button-theme(
   display: flex;
   flex-direction: row;
   gap: 8px;
-  color: var(--ig-gray-900);
-  font-size: 20px;
+  font-size: 16px;
   font-weight: 600;
-  line-height: 24px;
+  line-height: 20px;
   letter-spacing: 0.15px;
   --ig-size: var(--ig-size-medium);
 

From 1e42d762a525d9bde2694b642523f436e72780b4 Mon Sep 17 00:00:00 2001
From: Mariela Tihova <MTihova@infragistics.com>
Date: Mon, 21 Jul 2025 16:15:42 +0300
Subject: [PATCH 2/2] Changed inactive tabs font color

---
 src/app/views/home/home.component.scss | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/src/app/views/home/home.component.scss b/src/app/views/home/home.component.scss
index c517b15..b904b54 100644
--- a/src/app/views/home/home.component.scss
+++ b/src/app/views/home/home.component.scss
@@ -86,10 +86,6 @@ $custom-icon-button-theme: icon-button-theme(
   line-height: 20px;
   letter-spacing: 0.15px;
   --ig-size: var(--ig-size-medium);
-
-  &--disabled {
-    color: var(--ig-gray-700) !important;
-  }
 }
 
 .tab-content {