v6: accordions - hide default WebKit details marker (#42401)

Suppress the native disclosure marker in WebKit by adding &::-webkit-details-marker { display: none; } to the accordion button styles. This prevents the browser's default triangle from overlapping the custom .accordion-icon and ensures consistent appearance across browsers

Issue discovered using Browserstack.
See comment: https://github.com/orgs/twbs/discussions/42398#discussion-10018925

diff --git a/scss/_accordion.scss b/scss/_accordion.scss
index b95606603d015caf2adcd2458beed4eeb055ebc0..0f8fec4e39ced5c03ce8d8d6ae5391bc89d785e3 100644 (file)
--- a/scss/_accordion.scss
+++ b/scss/_accordion.scss
@@ -50,6 +50,10 @@ $accordion-tokens: defaults(
     background-color: var(--accordion-btn-bg);
     @include transition(var(--accordion-transition));
 
+    &::-webkit-details-marker {
+      display: none;
+    }
+
     .accordion-icon {
       flex-shrink: 0;
       width: var(--accordion-btn-icon-width);