From 6f5088207841ad965ba8b364c0759c2b3005750d Mon Sep 17 00:00:00 2001
From: Kristiyan Kostadinov <crisbeto@abv.bg>
Date: Thu, 12 Jun 2025 09:19:55 +0200
Subject: [PATCH] fix(material/expansion): add token for box shadow

Adds a token for the expansion panel's box shadow since it's currently hard-coded.

Fixes #31313.
---
 src/material/expansion/_m2-expansion.scss   | 2 ++
 src/material/expansion/_m3-expansion.scss   | 2 ++
 src/material/expansion/expansion-panel.scss | 4 +++-
 3 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/material/expansion/_m2-expansion.scss b/src/material/expansion/_m2-expansion.scss
index b438c0bd18aa..3330b80a1559 100644
--- a/src/material/expansion/_m2-expansion.scss
+++ b/src/material/expansion/_m2-expansion.scss
@@ -3,12 +3,14 @@
 @use '../core/theming/inspection';
 @use '../core/tokens/m2-utils';
 @use '../core/tokens/m3-utils';
+@use '../core/style/elevation';
 
 // Tokens that can't be configured through Angular Material's current theming API,
 // but may be in a future version of the theming API.
 @function get-unthemable-tokens() {
   @return (
     expansion-container-shape: 4px,
+    expansion-container-elevation-shadow: elevation.get-box-shadow(2),
     expansion-legacy-header-indicator-display: inline-block,
     expansion-header-indicator-display: none,
   );
diff --git a/src/material/expansion/_m3-expansion.scss b/src/material/expansion/_m3-expansion.scss
index 3e8f295f1e07..6821974822d2 100644
--- a/src/material/expansion/_m3-expansion.scss
+++ b/src/material/expansion/_m3-expansion.scss
@@ -4,6 +4,7 @@
 @use '../core/theming/theming';
 @use '../core/theming/inspection';
 @use '../core/tokens/m3';
+@use '../core/style/elevation';
 
 // The prefix used to generate the fully qualified name for tokens in this file.
 $prefix: (mat, expansion);
@@ -17,6 +18,7 @@ $prefix: (mat, expansion);
       expansion-container-shape: 12px,
       expansion-header-indicator-display: inline-block,
       expansion-legacy-header-indicator-display: none,
+      expansion-container-elevation-shadow: elevation.get-box-shadow(2),
     ),
     color: (
       expansion-actions-divider-color: map.get($system, outline),
diff --git a/src/material/expansion/expansion-panel.scss b/src/material/expansion/expansion-panel.scss
index 56efdf0cb7e7..1ede142a605b 100644
--- a/src/material/expansion/expansion-panel.scss
+++ b/src/material/expansion/expansion-panel.scss
@@ -26,7 +26,9 @@ $fallbacks: m3-expansion.get-tokens();
   color: token-utils.slot(expansion-container-text-color, $fallbacks);
   border-radius: token-utils.slot(expansion-container-shape, $fallbacks);
 
-  @include elevation.overridable-elevation(2);
+  &:not([class*='#{elevation.$prefix}']) {
+    box-shadow: token-utils.slot(expansion-container-elevation-shadow, $fallbacks);
+  }
 
   .mat-accordion & {
     &:not(.mat-expanded), &:not(.mat-expansion-panel-spacing) {