@use 'sass:map';

@use './shared' as *;
@use './design' as *;

$highlight: () !default;
$highlight: map.merge(
  (
    color: value('color-warning-base'),
    bg-color: transparent
  ),
  $highlight
);

.#{$namespace}-highlight {
  &-vars {
    @include define-preset-values('highlight', $highlight);
  }

  @include basis;
  @include inherit-color;

  &__key-word {
    padding: 0 1px;
    margin: 0 1px;
    color: value('highlight-color');
    text-indent: 0;
    background-color: value('highlight-bg-color');
  }
}