Book a Table

Below the price list, there's now a form for booking a table. Its labels are styled, but its fields are invisible, just as Preflight left them, and its buttons don't react to anything yet:

• The two fields have a border, rounded corners and padding, and they're as wide as the form.
• Their placeholders, the examples in the empty fields, are a light gray from the palette, not the half-transparent text color that Preflight gives them.
• When you click into a field, it gets an outline in the café's amber, or in another color you like.
• The buttons with the free times show the hand, and their background changes when the mouse pointer is over them. 17:00 and 19:00 are fully booked, so their buttons have the disabled attribute: they're faded, to at most 60% opacity, show the crossed-out circle and don't change when the pointer is over them.
• The Book a table button shows the hand too, and its background gets darker, smoothly, when the pointer is over it.

The checks can't move the mouse pointer or click into a field. For these states, they look into the CSS that Tailwind makes from your classes, for a rule that changes the element in that state.