.TokenInput{display:flex;flex-direction:column;background-color:var(--hover-bg);border-radius:.5rem;border:1px solid transparent}.TokenInput[aria-disabled=true]{cursor:not-allowed}.TokenInput:hover{border:1px solid var(--secondary-color)}.TokenInput.inputError{border:1px solid #f62929}.TokenInput.inputError:hover{border:1px solid #c10505}.TokenInput .from-to{justify-items:left;padding:.4rem 0 0 12px;width:calc(98% - .6rem)}.TokenInput .details-token{display:flex;justify-content:space-between;align-items:center;padding:.5rem 1rem;font-size:.75rem}.TokenInput .details-token .balance{display:flex;align-items:center}.TokenInput .details-token .balance .balance-value{display:flex;padding:2px 6px;gap:.25rem;color:var(--secondary-color-transp);border-radius:.5rem;cursor:pointer}.TokenInput .details-token .balance .balance-value span:last-child{color:var(--white);font-weight:600}.TokenInput .details-token .balance .balance-value:hover{background-color:var(--secondary-bg);filter:brightness(1.1)}.TokenInput .details-token .dollar-value{color:var(--secondary-color-transp)}.TokenInput .select-amount{display:flex;justify-content:space-between;align-items:center;width:100%;padding:.5rem 1rem}.TokenInput input{color:var(--main-color);font-size:1.5rem;width:100%;height:40px;caret-color:var(--secondary-color)}.TokenInput input:disabled{cursor:not-allowed}.TokenInput input:focus{outline-width:0}.TokenInput .select-token{display:flex;align-items:center;gap:.25rem;background-color:var(--main-bg);padding:.5rem;border-radius:100px}.TokenInput .select-token.selectable{background-color:var(--secondary-color)}.TokenInput .select-token.isChangeable{cursor:pointer}.TokenInput .select-token.isChangeable:hover{opacity:.75}.TokenInput .select-token .logo{width:20px;height:20px;border-radius:50%}.SimpleTokenInput.fullWidth .select-token{display:flex;align-items:center;justify-content:space-between;background-color:var(--main-bg);padding:.75rem 1rem;cursor:pointer;width:100%;border-radius:.5rem}.SimpleTokenInput.fullWidth .select-token .token-selected{display:flex;align-items:center;gap:.5rem}.SimpleTokenInput.fullWidth .select-token .token-selected .token-symbol{font-weight:500}.SimpleTokenInput.fullWidth .select-token .token-selected .token-name{font-size:.8rem;color:var(--secondary-color-transp);font-weight:600}
