.date-dialog { width: min(440px,calc(100vw - 24px)); max-height: calc(100dvh - 32px); overflow-y: auto; padding: 24px; border: 1px solid var(--line); border-radius: 24px; background: var(--paper); color: var(--ink); box-shadow: var(--shadow); }
.date-dialog::backdrop { background: rgba(23,25,20,.48); }
.date-dialog-header { display: flex; align-items: center; gap: 16px; justify-content: space-between; margin-bottom: 18px; }
.date-dialog-header h2 { margin: 0; font: 400 32px/1.1 var(--serif); letter-spacing: -.03em; }
.date-dialog-close { flex: 0 0 44px; width: 44px; height: 44px; border: 1px solid var(--line); border-radius: 50%; background: transparent; color: var(--ink); font: 300 26px var(--sans); cursor: pointer; }
.date-selection { width: 100%; border: 1px solid var(--line); border-radius: 12px; background: var(--cream); color: var(--ink); padding: 13px; margin-bottom: 10px; font: 500 15px/1.4 var(--sans); }
.date-dialog .air-datepicker { --adp-font-family: var(--sans); --adp-font-size: 14px; --adp-width: 100%; --adp-background-color: var(--paper); --adp-background-color-hover: var(--cream); --adp-border-color: transparent; --adp-border-color-inner: var(--line); --adp-color: var(--ink); --adp-color-secondary: var(--ink-soft); --adp-color-current-date: var(--rust-dark); --adp-day-name-color: var(--ink-soft); --adp-nav-arrow-color: var(--rust-dark); --adp-day-cell-height: 42px; --adp-cell-border-radius: 10px; --adp-cell-background-color-selected: var(--rust-dark); --adp-cell-background-color-selected-hover: #813618; --adp-cell-background-color-in-range: #f3e2d4; --adp-cell-background-color-in-range-hover: #ead3bf; --adp-cell-border-color-in-range: #f3e2d4; --adp-background-color-selected-other-month: var(--rust-dark); --adp-background-color-selected-other-month-focused: #813618; --adp-nav-action-size: 44px; --adp-nav-height: 42px; --adp-border-radius: 12px; width: 100%; }
.date-dialog .air-datepicker-nav--title { font-weight: 600; }
.date-dialog-status { min-height: 22px; margin: 12px 0; font: 400 13px/1.6 var(--sans); color: var(--ink-soft); }
.date-dialog-actions { display: flex; align-items: center; justify-content: space-between; gap: 16px; border-top: 1px solid var(--line); padding-top: 18px; }
.date-dialog-actions .button { min-height: 44px; padding: 12px 20px; }
.date-clear { background: transparent; border: 1px solid var(--line); color: var(--ink); }
.date-dialog button:disabled { opacity: .45; cursor: default; }
@media(max-width:400px) { .date-dialog { padding: 14px; width: calc(100vw - 16px); border-radius: 20px; } .date-dialog-header h2 { font-size: 28px; } }

/* Calendar action controls share the site's button shape and tap size. */
.date-dialog-actions .button{min-height:44px;border-radius:10px;font-size:13px;font-weight:600;line-height:1.35;display:inline-flex;align-items:center;justify-content:center}
.date-dialog-close{border-radius:10px}

.date-dialog .button-dark{background:var(--rust-dark);border-color:var(--rust-dark);color:#fff}
