/* --- Flatpickr: minimal sexy --- */ .flatpickr-calendar { border: none; border-radius: 15px; box-shadow: 0 14px 35px rgba(0, 0, 0, 0.18); font-family: inherit; overflow: hidden; } .flatpickr-months { background: #fff; padding: 8px 10px; } .flatpickr-current-month { font-weight: normal; } .flatpickr-weekdays { background: #fff; } .flatpickr-day { border-radius: 10px; border:0;} .flatpickr-day.today { background: #111; color: #fff; } .flatpickr-day.selected, .flatpickr-day.startRange, .flatpickr-day.endRange { background: var(--color-blue); color: #fff; } .flatpickr-day:hover { background: rgba(17, 17, 17, 0.08); } .flatpickr-time { border-top: none; } /* Optional: inputs with altInput look nicer */ input.flatpickr-input[readonly] { cursor: text; } /* Optional dark mode (enable by adding .dark on ) */ body.dark .flatpickr-calendar { background: var(--color-blue); box-shadow: 0 14px 35px rgba(0,0,0,.45); } body.dark .flatpickr-months, body.dark .flatpickr-weekdays { background: var(--color-blue); color: #ddd; } body.dark .flatpickr-day { color: #ddd; } body.dark .flatpickr-day:hover { background: rgba(255,255,255,.08); } body.dark .flatpickr-day.today { background: #fff; color: var(--color-blue); } body.dark .flatpickr-day.selected, body.dark .flatpickr-day.startRange, body.dark .flatpickr-day.endRange { background: var(--color-blue); color: #fff; } .flatpickr-current-month input.cur-months, .flatpickr-current-month input.cur-year { margin: 0 !important; border: 0; border-radius: 0 !important; font-size: 19px; }