From 801152c8e60471636bd1ae83e5cdddef60920c1c Mon Sep 17 00:00:00 2001
From: Eliza Khachatryan <eli97736@esri.com>
Date: Fri, 14 Jun 2024 11:23:55 -0700
Subject: [PATCH] fix(block-section): adjust text hierarchy (#9580)

**Related Issue:** #6905

## Summary

Adjust text hierarchy.
---
 .../block-section/block-section.scss          | 46 ++++++++++++-------
 1 file changed, 29 insertions(+), 17 deletions(-)

diff --git a/packages/calcite-components/src/components/block-section/block-section.scss b/packages/calcite-components/src/components/block-section/block-section.scss
index 36ebde3e877..3166d9f0493 100644
--- a/packages/calcite-components/src/components/block-section/block-section.scss
+++ b/packages/calcite-components/src/components/block-section/block-section.scss
@@ -1,9 +1,7 @@
 :host {
-  @apply bg-foreground-1
-    text-color-2
-    text-n1
-    box-border
-    block;
+  @apply bg-foreground-1 text-n1 box-border block;
+
+  color: var(--calcite-color-text-2);
 }
 
 :host([open]) {
@@ -11,6 +9,22 @@
     border-0
     border-b
     border-solid;
+
+  .toggle {
+    color: var(--calcite-color-text-1);
+
+    &:hover {
+      color: var(--calcite-color-text-1);
+    }
+  }
+
+  .chevron-icon {
+    color: var(--calcite-color-text-3);
+
+    &:hover {
+      color: var(--calcite-color-text-1);
+    }
+  }
 }
 
 :host(:last-child) {
@@ -18,14 +32,15 @@
 }
 
 .toggle {
-  @apply font-sans
-    text-color-2
-    w-full
-    border-0
-    bg-transparent
-    font-medium;
+  @apply font-sans w-full border-0 bg-transparent;
 
   gap: var(--calcite-spacing-md);
+  color: var(--calcite-color-text-2);
+  font-weight: var(--calcite-font-weight-normal);
+
+  &:hover {
+    color: var(--calcite-color-text-1);
+  }
 }
 
 .toggle--switch,
@@ -45,7 +60,7 @@
     @apply focus-outset;
   }
   &:hover {
-    @apply text-color-1;
+    color: var(--calcite-color-text-1);
   }
 }
 
@@ -66,7 +81,8 @@
   }
 
   .icon--end,
-  .icon--start {
+  .icon--start,
+  .chevron-icon {
     @apply flex items-center;
 
     color: var(--calcite-color-text-3);
@@ -89,8 +105,4 @@
   color: theme("colors.danger");
 }
 
-.chevron-icon {
-  @apply flex items-center;
-}
-
 @include base-component();