/* Shared custom date picker for every date-only field. */
.reservation-date-picker { position:fixed; z-index:var(--hausl-layer-dropdown); box-sizing:border-box; width:min(22rem,calc(100vw - 2rem)); max-height:calc(100dvh - 2rem); padding:.75rem; overflow-y:auto; overscroll-behavior:contain; border:1px solid var(--hausl-border-default); border-radius:var(--hausl-radius-surface); background:var(--hausl-surface-raised); color:var(--hausl-text-primary); font-family:var(--hausl-font-ui); box-shadow:var(--hausl-shadow-overlay); }
.reservation-date-picker__header { display:grid; grid-template-columns:2.75rem minmax(0,1fr) 2.75rem 2.75rem; gap:.3rem; align-items:center; padding:0 0 .65rem; border-bottom:1px solid var(--hausl-border-default); }
.reservation-date-picker__month { width:100%; min-height:2.75rem; min-width:0; margin:0; padding:.25rem .35rem; overflow:hidden; border:1px solid transparent; border-radius:var(--hausl-radius-control); background:transparent; color:var(--hausl-text-primary); font-family:var(--hausl-font-ui); font-size:var(--hausl-text-ui); font-weight:var(--hausl-weight-semibold); line-height:var(--hausl-leading-ui); text-align:center; text-overflow:ellipsis; white-space:nowrap; cursor:pointer; transition:background-color .16s ease,border-color .16s ease,color .16s ease; }
.reservation-date-picker__month:hover,.reservation-date-picker__month.is-open { border-color:var(--hausl-accent-soft); background:var(--hausl-accent-soft); color:var(--hausl-accent-deep); }
.reservation-date-picker__month:focus-visible { outline:2px solid var(--hausl-accent); outline-offset:2px; }
.reservation-date-picker__action { display:grid; width:2.75rem; min-height:2.75rem; place-items:center; padding:0; border:1px solid transparent; border-radius:var(--hausl-radius-control); background:var(--hausl-surface-subtle); color:var(--hausl-text-secondary); font-family:var(--hausl-font-ui); font-size:var(--hausl-text-card-title); font-weight:var(--hausl-weight-medium); line-height:var(--hausl-leading-none); cursor:pointer; transition:background-color .16s ease,border-color .16s ease,color .16s ease; }
.reservation-date-picker__action:hover { border-color:var(--hausl-accent-soft); background:var(--hausl-accent-soft); color:var(--hausl-accent-deep); }
.reservation-date-picker__action:focus-visible { outline:2px solid var(--hausl-accent); outline-offset:2px; }
.reservation-date-picker__action:disabled { color:var(--hausl-text-faint); cursor:not-allowed; opacity:.55; }
.reservation-date-picker__close { background:transparent; color:var(--hausl-text-faint); font-size:var(--hausl-text-card-title); }
.reservation-date-picker__close:hover { border-color:var(--hausl-border-default); background:var(--hausl-surface-subtle); color:var(--hausl-text-primary); }
.reservation-date-picker__weekdays,.reservation-date-picker__grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:.25rem; }
.reservation-date-picker__weekdays { padding:.65rem 0 .25rem; }
.reservation-date-picker__weekday { display:grid; min-height:1.5rem; place-items:center; color:var(--hausl-text-faint); font-family:var(--hausl-font-ui); font-size:var(--hausl-text-micro); font-weight:var(--hausl-weight-semibold); line-height:var(--hausl-leading-ui); }
.reservation-date-picker__grid { padding-top:.15rem; }
.reservation-date-picker__empty-cell,.reservation-date-picker__day { min-height:2.75rem; }
.reservation-date-picker__day { display:grid; width:100%; place-items:center; padding:0; border:1px solid transparent; border-radius:var(--hausl-radius-control); background:transparent; color:var(--hausl-text-primary); font-family:var(--hausl-font-ui); font-size:var(--hausl-text-ui); font-weight:var(--hausl-weight-medium); line-height:var(--hausl-leading-ui); cursor:pointer; transition:background-color .16s ease,border-color .16s ease,color .16s ease; }
.reservation-date-picker__day:hover { border-color:var(--hausl-accent-soft); background:var(--hausl-accent-soft); color:var(--hausl-accent-deep); }
.reservation-date-picker__day:focus-visible { z-index:1; outline:2px solid var(--hausl-accent); outline-offset:1px; }
.reservation-date-picker__day.is-selected { border-color:var(--hausl-accent-deep); background:var(--hausl-accent-deep); color:var(--hausl-text-inverse); font-weight:var(--hausl-weight-bold); }
.reservation-date-picker__day.is-selected:hover { border-color:var(--hausl-accent-deep); background:var(--hausl-accent); color:var(--hausl-text-inverse); }
.reservation-date-picker__day.is-today:not(.is-selected) { box-shadow:inset 0 0 0 1px var(--hausl-accent); color:var(--hausl-accent-deep); font-weight:var(--hausl-weight-semibold); }
.reservation-date-picker__day:disabled { border-color:transparent; background:transparent; color:var(--hausl-text-faint); cursor:not-allowed; opacity:.5; }
.reservation-date-picker__month-year { display:grid; gap:.75rem; padding-top:.75rem; }
.reservation-date-picker__year-field { display:grid; grid-template-columns:auto minmax(0,1fr); gap:.6rem; align-items:center; }
.reservation-date-picker__year-label { color:var(--hausl-text-secondary); font-family:var(--hausl-font-ui); font-size:var(--hausl-text-meta); font-weight:var(--hausl-weight-semibold); line-height:var(--hausl-leading-ui); }
.reservation-date-picker__year { width:100%; min-height:2.75rem; padding:.45rem .7rem; border:1px solid var(--hausl-border-default); border-radius:var(--hausl-radius-control); background:var(--hausl-surface-subtle); color:var(--hausl-text-primary); font-family:var(--hausl-font-ui); font-size:var(--hausl-text-ui); font-weight:var(--hausl-weight-semibold); line-height:var(--hausl-leading-ui); cursor:pointer; }
.reservation-date-picker__year:focus-visible { outline:2px solid var(--hausl-accent); outline-offset:2px; }
.reservation-date-picker__month-options { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.35rem; }
.reservation-date-picker__month-option { min-height:2.75rem; padding:.3rem .25rem; border:1px solid transparent; border-radius:var(--hausl-radius-control); background:transparent; color:var(--hausl-text-primary); font-family:var(--hausl-font-ui); font-size:var(--hausl-text-meta); font-weight:var(--hausl-weight-medium); line-height:var(--hausl-leading-ui); cursor:pointer; transition:background-color .16s ease,border-color .16s ease,color .16s ease; }
.reservation-date-picker__month-option:hover { border-color:var(--hausl-accent-soft); background:var(--hausl-accent-soft); color:var(--hausl-accent-deep); }
.reservation-date-picker__month-option:focus-visible { z-index:1; outline:2px solid var(--hausl-accent); outline-offset:1px; }
.reservation-date-picker__month-option.is-selected { border-color:var(--hausl-accent-deep); background:var(--hausl-accent-deep); color:var(--hausl-text-inverse); font-weight:var(--hausl-weight-bold); }
.reservation-date-picker__month-option.is-selected:hover { border-color:var(--hausl-accent-deep); background:var(--hausl-accent); color:var(--hausl-text-inverse); }
.reservation-date-picker__month-option:disabled { border-color:transparent; background:transparent; color:var(--hausl-text-faint); cursor:not-allowed; opacity:.5; }

@media (prefers-reduced-motion: reduce) {
  .reservation-date-picker__month,
  .reservation-date-picker__action,
  .reservation-date-picker__day,
  .reservation-date-picker__month-option { transition:none; }
}
