/* ============================================================================
   when-picker - the platform's date-and-time picker, shared.

   flatpickr, themed by the .cmp-when-cal class that js/when-picker.js adds to
   every calendar it opens. Used by the Content Studio's Publish box
   (enduser/create/publish_schedule.php) and by the Townsquare composer's
   event fields. A page sets --when-accent to its own brand token; without it
   the portal colour (--site_color_g) is used.
   ============================================================================ */
/* flatpickr: the calendar in the portal's colour, readable, 14px and up.
   !important because another flatpickr theme may be on the page (the form
   builder loads material_blue) and would otherwise paint its own header. The
   calendar body stays white, so its text uses fixed dark neutrals, not the
   portal font colour (which is light on dark themes). */
/* The outline is a shadow ring, not a border, and the day grid has no side
   padding: flatpickr sizes the grid to the calendar's full width, so either
   one pushed Saturday under the rounded, clipped edge. */
.flatpickr-calendar.cmp-when-cal{font-size:15px;border-radius:14px;overflow:hidden;border:0;box-shadow:0 0 0 1px rgba(22,35,58,.08),0 12px 32px rgba(22,35,58,.18)}
.flatpickr-calendar.cmp-when-cal:before,.flatpickr-calendar.cmp-when-cal:after{display:none}
.flatpickr-calendar.cmp-when-cal .flatpickr-months,.flatpickr-calendar.cmp-when-cal .flatpickr-months .flatpickr-month,.flatpickr-calendar.cmp-when-cal .flatpickr-weekdays,.flatpickr-calendar.cmp-when-cal span.flatpickr-weekday{background:var(--when-accent,var(--site_color_g,#0B7A73))!important;color:#fff!important;fill:#fff!important}
.flatpickr-calendar.cmp-when-cal .flatpickr-months .flatpickr-month{height:44px}
.flatpickr-calendar.cmp-when-cal .flatpickr-current-month{font-size:16px!important;font-weight:700;height:44px;padding:0;left:12%;width:76%;display:flex;align-items:center;justify-content:center;gap:6px}
.flatpickr-calendar.cmp-when-cal .flatpickr-current-month .flatpickr-monthDropdown-months{background:transparent!important;color:#fff!important;font-size:16px;font-weight:700;margin:0;padding:2px 4px;height:auto}
.flatpickr-calendar.cmp-when-cal .flatpickr-current-month .flatpickr-monthDropdown-months option{color:#16233a;background:#fff}
.flatpickr-calendar.cmp-when-cal .flatpickr-current-month .numInputWrapper{width:5.5ch;position:static}
.flatpickr-calendar.cmp-when-cal .flatpickr-current-month input.cur-year{color:#fff!important;font-size:16px;font-weight:700;padding:0 2px;height:auto}
.flatpickr-calendar.cmp-when-cal .flatpickr-prev-month,.flatpickr-calendar.cmp-when-cal .flatpickr-next-month{color:#fff!important;fill:#fff!important;height:44px;display:flex;align-items:center;padding:0 14px}
.flatpickr-calendar.cmp-when-cal .flatpickr-prev-month svg,.flatpickr-calendar.cmp-when-cal .flatpickr-next-month svg{fill:#fff!important}
.flatpickr-calendar.cmp-when-cal span.flatpickr-weekday{font-size:14px;font-weight:600;padding-bottom:6px}
.flatpickr-calendar.cmp-when-cal .flatpickr-days{padding:6px 0;box-sizing:content-box}
.flatpickr-calendar.cmp-when-cal .flatpickr-day{font-size:15px;font-weight:500;color:#16233a;border-radius:10px;border:2px solid transparent}
.flatpickr-calendar.cmp-when-cal .flatpickr-day:hover,.flatpickr-calendar.cmp-when-cal .flatpickr-day:focus{background:rgba(22,35,58,.07);border-color:transparent}
.flatpickr-calendar.cmp-when-cal .flatpickr-day.prevMonthDay,.flatpickr-calendar.cmp-when-cal .flatpickr-day.nextMonthDay{color:#8a94a6!important}
.flatpickr-calendar.cmp-when-cal .flatpickr-day.flatpickr-disabled,.flatpickr-calendar.cmp-when-cal .flatpickr-day.flatpickr-disabled:hover{color:#8a94a6!important;background:transparent!important;text-decoration:line-through;cursor:not-allowed}
.flatpickr-calendar.cmp-when-cal .flatpickr-day.today{border-color:var(--when-accent,var(--site_color_g,#0B7A73))!important;color:var(--when-accent,var(--site_color_g,#0B7A73))!important;font-weight:700}
.flatpickr-calendar.cmp-when-cal .flatpickr-day.selected,.flatpickr-calendar.cmp-when-cal .flatpickr-day.selected:hover,.flatpickr-calendar.cmp-when-cal .flatpickr-day.today.selected{background:var(--when-accent,var(--site_color_g,#0B7A73))!important;border-color:var(--when-accent,var(--site_color_g,#0B7A73))!important;color:#fff!important}
.flatpickr-calendar.cmp-when-cal .flatpickr-time{border-top:1px solid rgba(22,35,58,.1)!important;height:48px;max-height:48px}
.flatpickr-calendar.cmp-when-cal .flatpickr-time input,.flatpickr-calendar.cmp-when-cal .flatpickr-time .flatpickr-am-pm,.flatpickr-calendar.cmp-when-cal .flatpickr-time .flatpickr-time-separator{font-size:16px;font-weight:600;color:#16233a!important}
.flatpickr-calendar.cmp-when-cal .flatpickr-time input:hover,.flatpickr-calendar.cmp-when-cal .flatpickr-time input:focus,.flatpickr-calendar.cmp-when-cal .flatpickr-time .flatpickr-am-pm:hover,.flatpickr-calendar.cmp-when-cal .flatpickr-time .flatpickr-am-pm:focus{background:rgba(22,35,58,.06)}
