.extended-announcement-bar {
  z-index: calc(var(--zindex-header) + 1);

  .js-drawer-open-top &,
  .is-closing & {
    z-index: var(--zindex-header) !important;
  }

  body:not(.extended-announcement-bar-enabled) & {
    display: none;
  }

  body.extended-announcement-bar-sticky & {
    position: sticky;
    transform: translate3d(0, 0, 0);
    z-index: calc(var(--zindex-header) + var(--zindex-increment) + 1);
    top: 0;
  }

  .extended-announcement-bar__wrapper {
    background-color: rgb(var(--announcement-background));
    color: rgb(var(--announcement-text-color));
    font-size: var(--announcement-font-size-mobile);

    a {
      color: rgb(var(--announcement-text-color));
    }

    .rte {
      margin-bottom: 0;
    }

    p {
      white-space: normal;
    }
  }

  @media (min-width: 768px) {
    .extended-announcement-bar__wrapper {
      font-size: clamp(8px, 1vw, var(--announcement-font-size-desktop));

      p {
        white-space: nowrap;
      }
    }
    .extended-announcement-bar__container {
      max-width: var(--announcement-container-width);
    }
  }

  .extended-announcement-bar__row {
    height: auto;
    min-height: var(--input-height-sm);

    > div.overflow-hidden {
      overflow: visible !important;
    }
  }

  .extended-announcement-bar__left-message,
  .extended-announcement-bar__center-message,
  .extended-announcement-bar__right-message {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;

    p {
      display: inline;
      margin-top: 0;
      margin-bottom: 0;
    }

    br {
      display: none;
    }
  }

  .extended-announcement-bar__left-message {
    + ul {
      margin-right: var(--spacer-sm);
    }
  }

  .extended-announcement-bar__center-message {
    .rte {
      display: flex;
      align-items: center;
      justify-content: center;
    }
  }

  .extended-announcement-bar__right-message {
    + ul {
      margin-left: var(--spacer-sm);
    }
  }

  .extended-announcement-bar__right-message-image {
    display: inline-block;
    vertical-align: middle;
    margin-left: var(--spacer-xs);
    flex-shrink: 0;

    img {
      height: 1.5em;
      max-width: none;
      width: auto;
      vertical-align: middle;
      margin-block: 0 !important;
    }
  }

  .extended-announcement-bar__left-col--separator {
    align-self: stretch;
    border-right: 1px solid rgb(var(--announcement-text-color));
  }

  .extended-announcement-bar__right-col--separator {
    align-self: stretch;
    border-left: 1px solid rgb(var(--announcement-text-color));
  }

  @media (max-width: 767.98px) {
    .extended-announcement-bar__container {
      max-width: 400px;
      margin-left: auto;
      margin-right: auto;
    }
    .extended-announcement-bar__left-message,
    .extended-announcement-bar__right-message {
      display: block;
      width: 100%;
      max-width: 100%;
      text-align: center;
    }
  }
}