Use grouped NavList indentation variables

Copilot-Session: 179d54c8-0b59-4769-a234-92919fb93779

Author: danielguillan

packages/react/src/NavList/NavList.module.css

@@ -360,11 +360,15 @@
 }
 
 .NavList__groupList .NavList__item--level-3 > .NavList__itemContent {
-  padding-inline-start: calc(var(--base-size-16) + var(--base-size-2));
+  padding-inline-start: calc(
+    var(--brand-NavList-item-paddingInlineStart-level-2, var(--base-size-24)) + var(--base-size-16)
+  );
 }
 
 .NavList__groupList .NavList__item--leaf.NavList__item--level-3 > .NavList__itemContent {
-  padding-inline-start: var(--base-size-16);
+  padding-inline-start: calc(
+    var(--brand-NavList-alignedLabel-paddingInlineStart, var(--base-size-24)) + var(--base-size-8) + var(--base-size-6)
+  );
 }
 
 .NavList__item--leaf.NavList__item--level-4 > .NavList__itemContent {
@@ -376,15 +380,23 @@
 }
 
 .NavList__groupList .NavList__item--level-4 > .NavList__itemContent {
-  padding-inline-start: calc(var(--base-size-32) + var(--base-size-2));
+  padding-inline-start: calc(
+    var(--brand-NavList-item-paddingInlineStart-level-2, var(--base-size-24)) + var(--base-size-32)
+  );
 }
 
 .NavList__groupList .NavList__item--leaf.NavList__item--level-4 > .NavList__itemContent {
-  padding-inline-start: var(--base-size-32);
+  padding-inline-start: calc(
+    var(--brand-NavList-alignedLabel-paddingInlineStart, var(--base-size-24)) + var(--base-size-16) + var(--base-size-8) +
+      var(--base-size-6)
+  );
 }
 
 .NavList__groupList .NavList__item--leaf.NavList__item--level-5 > .NavList__itemContent {
-  padding-inline-start: var(--base-size-48);
+  padding-inline-start: calc(
+    var(--brand-NavList-alignedLabel-paddingInlineStart, var(--base-size-24)) + var(--base-size-32) + var(--base-size-8) +
+      var(--base-size-6)
+  );
 }
 
 .NavList__item:is(.NavList__item--level-2, .NavList__item--level-3, .NavList__item--level-4)