Update <sl-divider> default color + delete override

docs/pages/components/divider.md

@@ -49,8 +49,12 @@ const App = () => <SlDivider style={{ '--width': '4px' }} />;
 
 Use the `--color` custom property to change the color of the divider.
 
+:::warning
+**Note:** In general, you shouldn't need to do this. Please consult the design team before implementing a custom color for the divider, so that the team can determine whether the existing pattern should be updated.
+:::
+
 ```html:preview
-<sl-divider style="--color: tomato;"></sl-divider>
+<sl-divider style="--color: var(--sl-color-teal-300);"></sl-divider>
 ```
 
 ```pug:slim

src/components/divider/divider.styles.ts

@@ -2,7 +2,7 @@ import { css } from 'lit';
 
 export default css`
   :host {
-    --color: var(--sl-panel-border-color);
+    --color: var(--sl-color-neutral-300);
     --width: var(--sl-panel-border-width);
     --spacing: var(--sl-spacing-medium);
   }

src/styles/exports/overrides.css

@@ -156,10 +156,6 @@ sl-menu-item[type]:focus {
   box-shadow: none;
 }
 
-sl-divider {
-  border-top: solid var(--sl-panel-border-color) var(--sl-panel-border-width);
-}
-
 sl-select[multiple] {
   appearance: initial;
   background-color: transparent;
@@ -257,14 +253,6 @@ sl-details.no-border::part(base) {
   }
 }
 
-/** ****************** */
-/** Divider */
-/** ****************** */
-
-sl-divider {
-  --color: var(--sl-color-neutral-300);
-}
-
 /** ****************** */
 /** Drawer */
 /** ****************** */