Animated Dropdown - Copy this React, Tailwind Component to your project

"Create an input field for entering a phone number with a right-aligned arrow icon. When the user hovers over the arrow icon: 1. The icon should rotate 180 degrees. 2. A dropdown (or sliding drawer) should appear next to the input field with the text 'Login with Password' inside it. 3. The arrow icon should initially point to the right, and after hover, it should point to the left. 4. Ensure smooth animations for the icon rotation and the sliding drawer. 5. Make the layout responsive, so it works well on both mobile and desktop screens. 6. Use modern CSS techniques like `transform` for rotation and `transition` for the animations."