style: Rely on box-shadow to provide the secondary underline (#2283)

Closes #2282

Hello!

# Description

See #2282 for more details. Note that this change replaces the existing
underline with a new one, and the new one is slightly differently
aligned! I'd like for someone to approve this design change.
This screenshot shows the before (above) and after (below):

![image](https://user-images.githubusercontent.com/37621491/216601388-42133013-fd44-485c-9ae8-bf52d5ad603a.png)

Furthermore, I'm unsure about the removal of
```html
    &.excluded :deep() {
      .highlight__content {
        &:after {
          content: none;
        }
      }
    }
```
and I'd like to point out that there are [various other
places](https://github.com/argilla-io/argilla/search?q=highlight__content)
that modify `highlight__content` or `highlight__content::after`, which
may need to be updated as well. If possible, someone with more
experience of the codebase can have a look at this.

**Type of change**

- [x] Bug fix (non-breaking change which fixes an issue)
- [x] Documentation update

**How Has This Been Tested**

(Please describe the tests that you ran to verify your changes. And
ideally, reference `tests`)

- [X] Merely a visual inspection.

**Checklist**

- [x] I have merged the original branch into my forked branch
- [x] follows the style guidelines of this project
- [x] I did a self-review of my code
- [x] My changes generate no new warnings

- Tom Aarsen

frontend/components/token-classifier/results/TextSpanStatic.vue

@@ -193,28 +193,14 @@ $hue: 360;
       padding-bottom: 3px;
       border-bottom: 5px solid $rcolor;
       position: relative;
-      &:after {
-        content: "";
-        border-top: 1px solid darken($rcolor, 50%);
-        position: absolute;
-        top: 26px;
-        left: 0;
-        right: 0;
-      }
+      box-shadow: 0px 1px 0px darken($rcolor, 50%);
     }
     &.annotation :deep(.highlight__tooltip:after) {
       border-color: $rcolor transparent transparent transparent;
     }
     &.prediction :deep(.highlight__tooltip:after) {
       border-color: transparent transparent $rcolor transparent;
     }
-    &.excluded :deep() {
-      .highlight__content {
-        &:after {
-          content: none;
-        }
-      }
-    }
     &.active,
     &.tag:hover {
       border: 2px solid darken($rcolor, 50%);