* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; background: #f4f7f5; color: #192820; font: 16px/1.45 system-ui, sans-serif; }
main { max-width: 32rem; margin: auto; padding: 1.5rem 1rem; }
small { color: #28634b; font-weight: 700; letter-spacing: .08em; }
h1, h2 { line-height: 1.15; margin: .4rem 0; }
header p, #status { color: #40564a; }
form, section { padding: 1rem; background: white; border: 1px solid #d8e2db; border-radius: 1rem; }
form, label { display: grid; gap: .45rem; }
form { gap: 1rem; }
label { font-weight: 650; min-width: 0; }
.dates { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
input, select, button { width: 100%; min-width: 0; min-height: 44px; border: 1px solid #a7b9ae; border-radius: .5rem; background: white; color: inherit; padding: .55rem; font: inherit; }
button { background: #245e46; color: white; border: 0; font-weight: 700; }
:disabled { opacity: .55; }
section { margin-top: 1rem; }
pre { white-space: pre-wrap; font: inherit; }

.form-heading { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
#language { width: auto; }

.addon { display: flex; align-items: center; }
.addon input { width: 1.15rem; min-height: 1.15rem; }

.package-suggestions { display: flex; flex-wrap: wrap; gap: .5rem; }
.package-suggestions button { width: auto; background: #e5efe9; color: #245e46; padding: .4rem .75rem; }

#bookingDetails { display: grid; gap: 1rem; border: 0; padding: 0; margin: 0; min-width: 0; }