.Transactions { overflow-x: hidden; background-color: white; display: flex; flex-direction: column; justify-content: center; font-size: calc(10px + 2vmin); color: rgba(88, 55, 50, 1); background-color: #e9e9e9; } .Transactions-title { font-family: "Poppins", sans-serif; font-weight: 500; font-style: normal; font-size: 32px; color: rgba(88, 55, 50, 1); text-align: left; margin-left: 20px; margin-top: 17px; } .Transactions-detail { font-family: "Poppins", sans-serif; font-weight: 500; font-style: normal; font-size: 20px; color: rgba(88, 55, 50, 1); text-align: left; margin-left: 20px; margin-top: 17px; } .TransactionListContainer { overflow-y: auto; /* Enables vertical scrolling */ max-height: 600px; /* Adjust based on your design */ } .TotalContainer { display: flex; justify-content: space-between; width: 100%; /* Ensures it takes up full width */ margin: 0 auto; font-family: "Poppins", sans-serif; font-weight: 600; font-style: normal; font-size: 1.5em; padding: 10px; box-sizing: border-box; /* Includes padding in width */ margin-bottom: 17px; } .PayButton { font-family: "Poppins", sans-serif; font-weight: 500; font-style: normal; font-size: 24px; /* Adjusted for better readability */ padding: 12px 24px; /* Added padding for a better look */ border-radius: 50px; background-color: rgba(88, 55, 50, 1); color: white; border: none; margin: 0 auto; cursor: pointer; display: block; /* Centering the button */ margin-bottom: 23px; text-align: center; } .RoundedRectangle { border-radius: 20px; padding: 15px; /* Adjusted for better spacing */ margin: 26px; background-color: #f9f9f9; }