fix(NcDateTimePicker): improve design and make it consistent with Nc 30

[st3iny]

☑️ Resolves

• Partially addresses Design improvements to date picker nextcloud/calendar#6324

🖼️ Screenshots

Date picker

(Also take note of the confirm button hover state.)

🏚️ Before	🏡 After

Month picker

🏚️ Before	🏡 After

Year picker

🏚️ Before	🏡 After

Time picker

🏚️ Before	🏡 After

🏁 Checklist

• ⛑️ Tests are included or are not applicable
• 📘 Component documentation has been extended, updated or is not applicable
• 3️⃣ Backport to next requested with a Vue 3 upgrade

[st3iny]

/backport to next

[nimishavijay]

Amazing! Looks super nice! :) only some small points:

• in the month and year pickers, the height of each item seems big. It could be the default clickable area
• The left and right arrows in the month and year pickers can also be just single arrows instead of double
• The heading for the year picker (2020-2029) should be bold to be consistent with the other headings
• Instead of "2020~2029" it can say "2020-2029"
• Nice-to-have: for the time picker there have been some complaints about the "Pick a date" button being unintuitive, people try clicking on the date at the top to go to the date picker. If it would be possible to remove the "Pick a date" button and instead have the date picker open upon clicking the date on top then that would be great :)

Other than that it looks amazing 🌟