.ls-utility,
.ls-utility-mobile {
  display: none;
}

body .ls-header-row .ls-utility-account:not(.ls-utility-authenticated) > .console-link {
  display: none;
}

.ls-utility a:focus-visible,
.ls-utility button:focus-visible,
.ls-utility-mobile a:focus-visible,
.ls-utility-account > .console-link:focus-visible {
  outline: 2px solid var(--ls-blue, #2563d9);
  outline-offset: 2px;
}

@media (min-width: 1101px) {
  body .ls-header-row .ls-utility-account {
    align-items: center;
    gap: 14px;
    padding-inline-end: 16px;
  }

  .ls-utility {
    position: relative;
    display: flex;
    align-items: center;
    gap: 6px;
    padding-inline-end: 14px;
  }

  .ls-utility::after {
    content: "";
    position: absolute;
    inset-inline-end: 0;
    top: calc(50% - 9px);
    width: 1px;
    height: 18px;
    background: #cfdceb;
  }

  .ls-utility-support {
    position: relative;
  }

  .ls-utility > a,
  .ls-utility-support > button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    padding: 0 10px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: #344b69;
    font: inherit;
    text-decoration: none;
    white-space: nowrap;
  }

  .ls-utility > a:hover,
  .ls-utility-support > button:hover,
  .ls-utility-support > button[aria-expanded="true"] {
    background: #edf4ff;
    color: #1859bb;
  }

  .ls-utility-support > button { cursor: pointer; }

  .ls-utility-chevron,
  .ls-utility-account .ls-user-toggle::after {
    content: "";
    display: inline-block;
    flex: 0 0 6px;
    width: 6px;
    height: 6px;
    margin-top: -3px;
    border-right: 1px solid currentColor;
    border-bottom: 1px solid currentColor;
    transform: rotate(45deg);
  }

  .ls-utility-support > button[aria-expanded="true"] .ls-utility-chevron {
    transform: rotate(225deg);
    margin-top: 3px;
  }

  .ls-utility-panel {
    position: absolute;
    z-index: 10;
    top: calc(100% + 7px);
    right: 0;
    width: 156px;
    padding: 6px;
    border: 1px solid #e1eaf7;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 12px 30px #18355124;
  }

  .ls-utility-panel[hidden] { display: none; }

  .ls-utility-panel a {
    display: flex;
    align-items: center;
    min-height: 44px;
    padding: 8px 12px;
    border-radius: 6px;
    color: #344b69;
    text-decoration: none;
  }

  .ls-utility-panel a:hover,
  .ls-utility-panel a:focus-visible {
    background: #edf4ff;
    color: #1859bb;
  }

  body .ls-header-row .ls-utility-account .ls-login {
    min-height: 44px;
    width: 48px;
    margin-inline-end: 6px;
  }

  body .ls-header-row .ls-utility-account .no-login .ls-button-small,
  body .ls-header-row .ls-utility-account.ls-utility-authenticated > .console-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto;
    min-width: 68px;
    min-height: 44px;
    height: 44px;
    padding: 0 15px;
    border-radius: 6px;
    background: var(--ls-blue, #2563d9);
    color: #fff;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
  }

  body .ls-header-row .ls-utility-account .no-login .ls-button-small:hover,
  body .ls-header-row .ls-utility-account.ls-utility-authenticated > .console-link:hover {
    background: #174fae;
  }

  body .ls-header-row .ls-utility-account .login-in { margin-right: 0; }
  body .ls-header-row .ls-utility-account .ls-user-toggle { color: #344b69; cursor: pointer; }
  body .ls-header-row .ls-utility-nav > .ls-utility-duplicate { display: none; }
}

@media (min-width: 1101px) and (max-width: 1279px) {
  body .ls-header:has(.ls-utility-account) .ls-header-row { gap: 16px; }
  body .ls-header-row .ls-utility-account { gap: 8px; padding-inline-end: 10px; }
  .ls-utility { gap: 2px; padding-inline-end: 8px; }
  .ls-utility > a, .ls-utility-support > button { padding-inline: 7px; }
}

@media (max-width: 1100px) {
  .ls-utility-mobile {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 10px;
    padding: 4px 14px;
    background: #f7faff;
    border-bottom: 1px solid #e1eaf7;
  }

  .ls-utility-mobile a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 0 8px;
    color: #344b69;
    font-size: 13px;
    text-decoration: none;
  }

  body .ls-header-row .ls-utility-nav.is-open:has(> .ls-mobile-tree) {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
  }

  body .ls-header-row .ls-utility-nav > .ls-mobile-tree { grid-row: 2; }
  body .ls-header-row .ls-utility-nav:has(> .ls-mobile-tree) > .ls-utility-mobile { grid-row: 1; }
}

body .ls-header-row .ls-utility-account .ls-user-toggle .ls-customer-avatar {
  display: block;
  width: 29px;
  height: 29px;
  flex: 0 0 29px;
  border-radius: 50%;
  object-fit: cover;
}
body .ls-header-row .ls-utility-account .ls-user-toggle .ls-customer-avatar[hidden],
body .ls-header-row .ls-utility-account .ls-user-toggle #headImg.ls-avatar-replaced {
  display: none;
}