/* Match the storefront account controls to the account center's compact header. */
.site-header .header-actions {
  gap: 9px;
}

.site-header .command-trigger {
  width: 40px;
  height: 40px;
  border-color: rgba(255, 255, 255, .09);
  background: rgba(255, 255, 255, .025);
  color: #a5b5af;
}

.site-header .command-trigger:hover,
.site-header .command-trigger:focus-visible {
  border-color: rgba(52, 217, 123, .3);
  background: rgba(52, 217, 123, .075);
  color: #d7fbe1;
}

.site-header .header-account-balance {
  min-height: 44px;
  align-items: stretch;
  border-color: rgba(52, 217, 123, .32);
  border-radius: 13px;
  background: linear-gradient(135deg, rgba(22, 58, 39, .72), rgba(10, 23, 18, .92));
  box-shadow: 0 12px 32px rgba(0, 0, 0, .22);
}

.site-header .header-account-balance:hover {
  border-color: rgba(52, 217, 123, .46);
  background: linear-gradient(135deg, rgba(25, 66, 43, .78), rgba(10, 27, 19, .94));
}

.site-header .header-account-profile {
  min-height: 44px !important;
  gap: 9px;
  padding: 0 13px;
  color: #dff5e8;
}

.site-header .header-account-name {
  max-width: 112px;
  color: #f1f8f3;
  font-size: 13px;
}

.site-header .header-account-value {
  padding-left: 9px;
  border-left-color: rgba(255, 255, 255, .12);
  color: #d7e0dc;
  font-size: 13px;
}

.site-header .header-account-add {
  align-self: stretch;
  width: 43px !important;
  min-width: 43px !important;
  height: auto !important;
  min-height: 44px !important;
  margin: 0;
  border: 0;
  border-left: 1px solid rgba(52, 217, 123, .28);
  border-radius: 0;
  background: rgba(52, 217, 123, .15);
  box-shadow: none;
  color: #8beaaa;
  font-size: 19px;
  transition: background 160ms ease, color 160ms ease;
}

.site-header .header-account-add:hover,
.site-header .header-account-add:focus-visible {
  transform: none;
  background: rgba(52, 217, 123, .24);
  box-shadow: none;
  color: #c6fbd5;
}

@media (max-width: 860px) {
  .site-header .header-account-name {
    display: inline;
  }

  .site-header .header-account-value {
    display: none;
  }
}

@media (max-width: 430px) {
  .site-header .header-account-profile .icon {
    display: block;
  }

  .site-header .header-account-name {
    max-width: 68px;
  }
}