/* Keep arrival dates and nights separate from the following guest-count step. */
.new-arrival-card{
  width:min(600px,100%);
  min-width:0;
  grid-template-columns:minmax(0,1fr)!important;
  gap:22px;
  align-items:stretch;
}
.new-arrival-card .new-date-field,
.new-arrival-card .new-night-field{min-width:0;width:100%;gap:10px}
.new-arrival-card .new-date-field input{
  display:block;
  width:100%;min-width:0;max-width:100%;
  box-sizing:border-box;
}
.new-arrival-card .trail-button{grid-column:1;width:100%;min-width:0}
.night-stepper{
  display:grid;grid-template-columns:74px minmax(0,1fr) 74px;
  width:100%;min-width:0;min-height:78px;
  overflow:hidden;border:3px solid #fff;border-radius:20px;
  background:#fff9e9;box-shadow:0 6px 14px rgba(31,54,28,.16);
}
.night-stepper-button{
  min-width:0;min-height:74px;border:0;color:#fff;
  background:linear-gradient(180deg,#477c35,#194b27);
  font:900 42px/1 Arial,sans-serif;touch-action:manipulation;
}
.night-stepper-button:disabled{opacity:.43}
.night-stepper-button:not(:disabled):active{background:linear-gradient(180deg,#ff7900,#d84e00)}
.night-count{
  display:grid;place-items:center;min-width:0;padding:8px;
  color:#083b25;font:900 clamp(22px,3.5vw,30px)/1.15 Arial,sans-serif;
  letter-spacing:0;text-align:center;
}
#trailSteps[data-journey="new_reservation"] .trail-dot{min-width:0;flex:1 1 0}
#trailSteps[data-journey="new_reservation"] .trail-dot small{white-space:normal;line-height:1.15}
#trailSteps[data-journey="new_reservation"] .trail-line{flex:0 1 18px;min-width:4px}
@media(max-width:450px){
  .new-arrival-card{padding:18px;gap:18px}
  .night-stepper{grid-template-columns:58px minmax(0,1fr) 58px}
}