#booking .datetime-field .cabo-clock-trigger {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  box-sizing:border-box;
  width:100%;
  min-width:0;
  height:44px;
  margin:0;
  padding:8px 12px;
  border:1px solid var(--border2, #cbd1d4);
  border-radius:14px;
  background:var(--surface, #fff);
  color:#77818b;
  line-height:1.2;
  font-family:inherit;
  font-size:16px;
  font-weight:500;
  text-align:left;
  box-shadow:none;
  cursor:pointer;
}
#booking .datetime-field .cabo-clock-trigger.has-value { color:#233446; }
#booking .datetime-field .cabo-clock-trigger svg {
  flex:none;
  width:20px;
  height:20px;
  fill:none;
  stroke:#52616b;
  stroke-width:1.6;
  stroke-linecap:round;
  stroke-linejoin:round;
}
#booking .datetime-field .cabo-clock-trigger:focus-visible,
#booking .datetime-field .cabo-clock-trigger[aria-expanded="true"] {
  outline:none;
  border-color:#c65330;
  box-shadow:0 0 0 3px rgba(194,169,116,.16);
}
#booking .datetime-field.invalid .cabo-clock-trigger { border-color:rgba(220,85,85,.65); }
.cabo-clock-dialog,
.cabo-clock-dialog *,
.cabo-clock-backdrop { box-sizing:border-box; }
.cabo-clock-dialog[hidden],
.cabo-clock-backdrop[hidden] { display:none; }
.cabo-clock-backdrop {
  position:fixed;
  z-index:9999;
  inset:0;
  background:rgba(19,35,45,.38);
}
.cabo-clock-dialog {
  --cabo-clock-wheel-height:132px;
  position:fixed;
  z-index:10000;
  width:280px;
  max-width:calc(100vw - 24px);
  padding:10px 12px 12px;
  border:1px solid #e1e4e5;
  border-radius:16px;
  background:#fff;
  color:#233446;
  box-shadow:0 12px 40px rgba(22,38,47,.18),0 2px 8px rgba(22,38,47,.06);
  font-family:inherit;
  line-height:1.3;
  color-scheme:light;
  overflow:auto;
}
.cabo-clock-heading {
  display:flex;
  justify-content:space-between;
  align-items:center;
  min-height:36px;
  margin-bottom:4px;
}
.cabo-clock-heading strong { font-size:14px; font-weight:650; }
.cabo-clock-dialog button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  margin:0;
  padding:10px 12px;
  border:0;
  border-radius:12px;
  background:transparent;
  color:#34434c;
  font-family:inherit;
  font-size:14px;
  font-weight:500;
  line-height:1.2;
  cursor:pointer;
  box-shadow:none;
  touch-action:manipulation;
}
.cabo-clock-dialog .cabo-clock-dismiss {
  width:36px;
  min-height:36px;
  padding:0;
  color:#74808a;
  font-size:22px;
  font-weight:400;
}
.cabo-clock-labels,
.cabo-clock-wheels {
  display:grid;
  grid-template-columns:1fr 1fr .9fr;
  gap:4px;
}
.cabo-clock-labels {
  margin:0 4px 4px;
  color:#7b8389;
  font-size:11px;
  font-weight:600;
  text-align:center;
}
.cabo-clock-wheels { position:relative; }
.cabo-clock-selection {
  position:absolute;
  top:calc((var(--cabo-clock-wheel-height) - 44px) / 2);
  right:0;
  left:0;
  height:44px;
  border-radius:12px;
  background:#f2f0e9;
  pointer-events:none;
}
.cabo-clock-wheel {
  position:relative;
  height:var(--cabo-clock-wheel-height);
  min-width:0;
  padding:calc((var(--cabo-clock-wheel-height) - 44px) / 2) 0;
  overflow-x:hidden;
  overflow-y:auto;
  scrollbar-width:none;
  scroll-snap-type:y mandatory;
  overscroll-behavior-y:contain;
  overflow-anchor:none;
  touch-action:pan-y;
  outline:none;
  border-radius:14px;
  -webkit-mask-image:linear-gradient(transparent, #000 32%, #000 68%, transparent);
  mask-image:linear-gradient(transparent, #000 32%, #000 68%, transparent);
}
.cabo-clock-wheel::-webkit-scrollbar { display:none; }
.cabo-clock-wheel.is-dragging { scroll-snap-type:none; cursor:grabbing; }
.cabo-clock-wheel.is-dragging .cabo-clock-option { cursor:grabbing; }
.cabo-clock-wheel:focus-visible { box-shadow:inset 0 0 0 2px #0d3045; }
.cabo-clock-option {
  display:flex;
  align-items:center;
  justify-content:center;
  height:44px;
  min-height:44px;
  scroll-snap-align:center;
  color:#747e85;
  font-size:18px;
  font-weight:400;
  font-variant-numeric:tabular-nums;
  cursor:pointer;
  user-select:none;
  -webkit-user-select:none;
}
.cabo-clock-option[aria-selected="true"] { color:#1c3340; font-weight:650; }
.cabo-clock-footer {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  margin-top:8px;
}
.cabo-clock-dialog .cabo-clock-clear {
  margin-right:auto;
  padding:10px 8px;
  color:#74808a;
}
.cabo-clock-dialog button:disabled { opacity:.4; cursor:default; }
.cabo-clock-dialog .cabo-clock-cancel { background:#f2f4f5; }
.cabo-clock-dialog .cabo-clock-set { background:#0d3045; color:#ffffff; font-weight:650; }
.cabo-clock-dialog button:focus-visible { outline:2px solid #c65330; outline-offset:2px; }
@media (hover:hover) {
  .cabo-clock-option:hover { color:#172d39; }
  .cabo-clock-dialog .cabo-clock-cancel:hover,
  .cabo-clock-dialog .cabo-clock-dismiss:hover { background:#e8ecee; }
  .cabo-clock-dialog .cabo-clock-set:hover { background:#153e55; }
}
.cabo-clock-dialog.is-mobile {
  right:auto;
  width:300px;
  padding-bottom:max(12px, env(safe-area-inset-bottom, 0px));
}

/* Touch calendars live in the modal top layer, outside the booking cards. */
#booking .datetime-field .cabo-calendar-trigger[hidden] { display:none; }
.cabo-calendar,
.cabo-calendar * { box-sizing:border-box; }
.cabo-calendar {
  --calendar-day-height:44px;
  position:fixed;
  inset:auto;
  width:360px;
  max-width:calc(100vw - 24px);
  max-height:calc(100dvh - 24px);
  margin:0;
  padding:12px;
  border:1px solid #e1e4e5;
  border-radius:24px;
  background:#fff;
  color:#233446;
  box-shadow:0 12px 40px rgba(22,38,47,.18);
  font-family:inherit;
  font-size:15px;
  line-height:1.3;
  color-scheme:light;
  overflow:hidden;
}
.cabo-calendar[open] { display:flex; flex-direction:column; gap:4px; }
.cabo-calendar::backdrop { background:rgba(19,35,45,.38); }
.cabo-calendar-heading,
.cabo-calendar-nav,
.cabo-calendar-footer { display:flex; align-items:center; justify-content:space-between; flex:none; gap:8px; }
.cabo-calendar-heading { min-height:36px; padding-left:8px; }
.cabo-calendar-heading strong { font-size:15px; font-weight:650; }
.cabo-calendar button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:0;
  min-height:44px;
  margin:0;
  padding:8px 12px;
  border:0;
  border-radius:12px;
  background:transparent;
  color:inherit;
  box-shadow:none;
  font-family:inherit;
  font-size:15px;
  font-weight:500;
  line-height:1;
  cursor:pointer;
  touch-action:manipulation;
}
.cabo-calendar button:disabled { color:#adb3b8; cursor:default; }
.cabo-calendar button:focus-visible { outline:2px solid #c65330; outline-offset:-2px; }
.cabo-calendar .cabo-calendar-dismiss { width:36px; min-height:36px; padding:0; font-size:26px; color:#74808a; }
.cabo-calendar-nav strong { font-size:16px; font-weight:650; text-align:center; }
.cabo-calendar-nav button { width:44px; padding:0; font-size:28px; }
.cabo-calendar-scroll { min-height:0; overflow:auto; overscroll-behavior:contain; }
.cabo-calendar table { width:100%; table-layout:fixed; border-collapse:collapse; border:0; margin:0; }
.cabo-calendar th,
.cabo-calendar td { padding:0; border:0; background:transparent; text-align:center; }
.cabo-calendar th { height:24px; color:#74808a; font-size:11px; font-weight:600; }
.cabo-calendar .cabo-calendar-day { width:100%; height:var(--calendar-day-height); min-height:var(--calendar-day-height); padding:0; font-variant-numeric:tabular-nums; }
.cabo-calendar [aria-selected="true"] .cabo-calendar-day { background:#0d3045; color:#ffffff; font-weight:700; }
.cabo-calendar-footer { margin-top:4px; }
.cabo-calendar .cabo-calendar-clear { color:#74808a; }
.cabo-calendar .cabo-calendar-cancel { background:#f2f4f5; }
.cabo-calendar.is-compact .cabo-calendar-heading { position:absolute; width:1px; height:1px; min-height:0; padding:0; overflow:hidden; clip-path:inset(50%); }
.cabo-calendar.is-compact .cabo-calendar-heading button { display:none; }
.cabo-calendar.is-compact .cabo-calendar-nav button,
.cabo-calendar.is-compact .cabo-calendar-footer button { min-height:36px; }

/* Airport Cabo fields keep their existing size; native controls remain on desktop. */
#booking.acw .datetime-control > .cabo-clock-trigger {
  grid-column:1;
  grid-row:2;
  width:100%;
  max-width:100%;
  min-height:52px;
  height:auto;
  padding:11px 13px;
  border-color:var(--rf-line-strong);
  border-radius:10px;
  background:var(--rf-surface);
  color:var(--rf-muted);
  font-size:16px;
  line-height:1.4;
}
#booking.acw .datetime-control > .cabo-clock-trigger.has-value { color:var(--rf-ink); }
#booking.acw .datetime-control > .cabo-clock-trigger span { min-width:0; overflow-wrap:anywhere; }
#booking.acw .datetime-control > .cabo-clock-trigger[hidden],
#booking.acw .datetime-control.has-mobile-picker > input[hidden],
#booking.acw .datetime-control.has-mobile-picker > .datetime-display { display:none !important; }
.cabo-clock-heading strong { min-width:0; }
.cabo-clock-dismiss { flex-shrink:0; }
.cabo-calendar { padding-bottom:max(12px, env(safe-area-inset-bottom, 0px)); }
