From 3563153625c2a92e5a8515046e07f34069a55984 Mon Sep 17 00:00:00 2001
From: didimmova <d.dimova11@gmail.com>
Date: Thu, 8 Jan 2026 16:44:38 +0200
Subject: [PATCH] fix(excel-filtering): fix styles

---
 .../grid/_excel-filtering-theme.scss          | 25 +++++++++++--------
 1 file changed, 14 insertions(+), 11 deletions(-)

diff --git a/projects/igniteui-angular/src/lib/core/styles/components/grid/_excel-filtering-theme.scss b/projects/igniteui-angular/src/lib/core/styles/components/grid/_excel-filtering-theme.scss
index d59ee284dab..dbade09697c 100644
--- a/projects/igniteui-angular/src/lib/core/styles/components/grid/_excel-filtering-theme.scss
+++ b/projects/igniteui-angular/src/lib/core/styles/components/grid/_excel-filtering-theme.scss
@@ -8,8 +8,8 @@
 /// @see {mixin} css-vars
 /// @param {Map} $theme - The grid theme used to style the component.
 @mixin excel-filtering($theme) {
-    $variant: map.get($theme, '_meta', 'variant');
-    $theme-variant: map.get($theme, '_meta', 'theme-variant');
+    $variant: map.get($theme, '_meta', 'theme');
+    $theme-variant: map.get($theme, '_meta', 'variant');
     $bootstrap-theme: $variant == 'bootstrap';
 
     $tree-node-indent: (
@@ -128,7 +128,7 @@
             background: var-get($theme, 'filtering-row-background');
 
             %igx-group-display {
-                --shadow: none;
+                --elevation: none;
                 --item-background: #{var-get($theme, 'filtering-row-background')};
                 --item-hover-background: #{color($color: 'gray', $variant: 100)};
                 --item-selected-background: #{color($color: 'gray', $variant: 100)};
@@ -167,11 +167,14 @@
             @if $theme-variant == 'light' {
                 background: contrast-color($color: 'gray', $variant: 900);
             } @else {
-                background: color($color: 'surface', $variant: 500);
+                background: color($color: 'gray', $variant: 50);
             }
 
             %igx-group-display {
                 --item-background: transparent;
+                @if $theme-variant == 'dark' {
+                    --item-text-color: #{contrast-color($color: 'surface', $variant: 500)};
+                }
                 --border-color: transparent;
                 --item-border-color: transparent;
                 --item-focused-border-color: transparent;
@@ -180,7 +183,7 @@
                 --item-selected-hover-border-color: transparent;
                 --item-disabled-border: transparent;
                 --disabled-selected-border-color: transparent;
-                --shadow: none;
+                --elevation: none;
             }
 
             %igx-group-item {
@@ -239,10 +242,7 @@
     %grid-excel-menu__header-actions {
         display: flex;
         margin-inline-start: auto;
-
-        [igxButton] + [igxButton] {
-            margin-inline-start: rem(4px);
-        }
+        gap: rem(4px);
 
         %grid-excel-actions__action {
             padding: 0 !important;
@@ -382,7 +382,7 @@
         justify-content: space-between;
 
         @if $variant == 'indigo' {
-            padding-block: pad-block(rem(6px));
+            padding-block: pad-block(rem(4px), rem(6px), rem(8px));
             padding-inline: pad-inline(rem(12px));
             margin-inline: rem(8px);
             margin-block-end: rem(4px);
@@ -757,7 +757,6 @@
     $header-comfortable: map.get($categories, 'header-comfortable');
     $header-compact: map.get($categories, 'header-compact');
 
-
     %grid-excel-menu {
         %grid-excel-menu__header > h4 {
             @include type-style('h6')
@@ -807,6 +806,10 @@
         }
     }
 
+    %igx-group-item {
+        @include type-style('button');
+    }
+
     %grid-excel-menu__secondary--cosy {
         %grid-excel-menu__header > h4 {
             @include type-style('h6');