[data-component-id="barrio_subtheme:header_menu"] {
  /* Header action button */
  .nav-item .header-btn {
    background-image: unset;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #fff;
    color: #353460;
    min-width: 200px;
    position: relative;
    border: 2px solid #353460;
    border-radius: 8px;
    /* Remove the shadows on the font. */
    text-shadow: none;

    &.nav-link--user-login {
      background-color: #353460;
      color: #fff;

      &:hover {
        background-color: #484772;
      }

      &:before {
        /* Move the login icon to the right and make it white. */
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3E%3Cpath fill-rule='evenodd' d='M9.655 8H2.333c-.264 0-.398.068-.471.121a.73.73 0 00-.224.296 1.626 1.626 0 00-.138.59V14c0 .342.076.531.14.635.064.106.151.18.256.237a1.122 1.122 0 00.436.127l.013.001h7.322c.264 0 .398-.068.471-.121a.73.73 0 00.224-.296 1.627 1.627 0 00.138-.59V9c0-.342-.076-.531-.14-.635a.658.658 0 00-.255-.237A1.122 1.122 0 009.655 8zm.012-1H2.333C.5 7 .5 9 .5 9v5c0 2 1.833 2 1.833 2h7.334c1.833 0 1.833-2 1.833-2V9c0-2-1.833-2-1.833-2zM8.5 4a3.5 3.5 0 117 0v3h-1V4a2.5 2.5 0 00-5 0v3h-1V4z'/%3E%3C/svg%3E") !important;
        position: absolute;
        right: .5rem;
      }
    }

    /* Center the icon before the button. */
    &:before {
      height: 21px;
    }
  }
}