/* Website (Code)/public/assets/css/calendar-large.css
   v1  ·  2026-11-01 MYT

   The large calendar on the chauffeur booking and Driver & Bodyguard request pages. ui/datePicker.js draws it. */

.calendar { position: absolute; z-index: 60; width: 340px; padding: 4px 14px 16px; border: 1px solid rgba(0, 0, 0, .06); border-radius: 18px; background: var(--white); box-shadow: 0 16px 48px rgba(0, 0, 0, .16); color: var(--ink); font-family: var(--font); letter-spacing: -0.016em; opacity: 0; transform: translateY(-4px); transition: opacity .15s var(--ease-out), transform .15s var(--ease-out); }
.calendar__head { display: flex; justify-content: space-between; align-items: center; height: 60px; padding: 0 2px; }
.calendar__title { min-width: 76px; text-align: center; font-size: 17px; line-height: 1.23536; font-weight: 600; }
.calendar__nav + .calendar__nav .calendar__title { min-width: 44px; }
.calendar__step { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; color: var(--link); }
.calendar__grid { width: 100%; border-collapse: collapse; table-layout: fixed; }
.calendar__grid th { height: 32px; padding: 0; color: var(--ink-2); font-size: 12px; font-weight: 600; text-align: center; }
.calendar__grid td { height: 44px; padding: 2px 0; text-align: center; }
.calendar__day { width: 40px; height: 40px; border-radius: 50%; font-size: 17px; line-height: 1; color: var(--ink); transition: background-color .15s linear, color .15s linear; }
.calendar__day:disabled { color: var(--ink-disabled); cursor: default; }