/*
 * Copyright (c) 2022 @automata-network/wallet-sdk authors and contributors.
 * This software may be modified and distributed under the terms of UNLICENSED
 * license. Refer to the LICENSE file for details.
 */
.@{selector-prefix}account {
  display: flex;
  align-items: center;
  justify-content: center;
  padding-inline: 0.85rem;
  border: solid 1px var(--wallet-primary);
  cursor: pointer;
  color: var(--wallet-primary);
  line-height: 1.1em;
  height: .pxToPcVw(40) [];
  font-size: .pxToPcVw(16) [];
  gap: .pxToPcVw(8) [];
  border-radius: .pxToPcVw(8) [];

  .@{selector-prefix}accountAvatar {
    border-radius: 50%;
    height: .pxToPcVw(20) [];
    width: .pxToPcVw(20) [];
  }
}

@media (max-width: @media-query-max-width) {
  .@{selector-prefix}account {
    height: .pxToMobileVw(50) [];
    font-size: .pxToMobileVw(20) [];
    gap: .pxToMobileVw(10) [];
    border-radius: .pxToMobileVw(10) [];

    .@{selector-prefix}accountAvatar {
      height: .pxToMobileVw(24) [];
      width: .pxToMobileVw(24) [];
    }
  }
}