:root {
  /* HEIGHTS */
  --toolbar-min-height: calc((26 / var(--base-font-size)) * 1rem);
  --toolbar-max-height: calc((52 / var(--base-font-size)) * 1rem);
}

.announcement-bar .slider-button--next,
.announcement-bar .slider-button--prev {
  padding: 0;
  cursor: none;

  &:focus {
    background-color: transparent;
    border: unset;
  }
}

.announcement-bar__message {
  width: 100%;
  min-height: var(--toolbar-min-height);
  max-height: var(--toolbar-max-height);
  padding: var(--spacing__6px) var(--spacing__8px);
  background-color: var(--announcement-bar-background-color);
}

.announcement-bar__message * {
  margin: 0;
  color: var(--announcement-bar-text-color);
  font-size: var(--font-size__12px);
}

.utility-bar {
  position: relative;
  z-index: 8;
  background-color: var(--announcement-bar-background-color);
  border: unset;
}

.announcement-bar {
  background-color: var(--announcement-bar-background-color);
}