/* ==========================================================================
   Flatpickr theme — Party Rentals
   Flatpickr appends its calendar popup as a sibling of <body>, outside any
   of the plugin's scoped wrappers (.prm-public / .prm-dashboard / .prm-wrap),
   so these rules are intentionally global rather than namespaced. Loaded
   wherever a date field can appear: the public booking wizard and item
   search, the front-end staff dashboard, and wp-admin. Colors are literal
   hex here (matching the --prm-signal/--prm-grape/etc. tokens in
   public.css) since this stylesheet has to work outside the pages where
   those custom properties are defined.
   ========================================================================== */

.flatpickr-calendar{
	background:#FFFFFF;
	border:1px solid #E9E3F7;
	border-radius:16px;
	box-shadow:0 8px 24px rgba(36,27,58,.12), 0 2px 6px rgba(36,27,58,.06);
	font-family:"Plus Jakarta Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
.flatpickr-calendar.arrowTop:before,.flatpickr-calendar.arrowTop:after{display:none;}
/* Flatpickr's day grid, weekday row, and inner container all use a
   hardcoded fixed pixel width (307.875px) sized to fill an unpadded
   calendar - adding padding anywhere in that chain shrinks the space
   those fixed-width children have to sit in and gets them silently
   clipped by flatpickr's own internal overflow:hidden wrappers. Margin
   is safe here (it doesn't affect an element's own available width for
   its children the way padding does), so spacing is added that way. */
.flatpickr-months{align-items:center;margin-bottom:4px;}
.flatpickr-months .flatpickr-month{
	background:linear-gradient(120deg,#3B2E68,#5B3E8F);
	color:#fff;border-radius:10px;height:42px;
}
/* .flatpickr-current-month is a flatpickr-positioned box (75% width,
   centered) holding the month dropdown + year number input side by side
   as inline-block children - if their combined text is wider than that
   box, the browser wraps the year onto its own line instead of shrinking
   it. Keeping the font close to flatpickr's own sizing (rather than the
   heavier/wider Baloo 2 display face used elsewhere) and adding
   white-space:nowrap as a safety net keeps "September 2026" and similar
   longer combinations on one line at every calendar width. */
.flatpickr-current-month{font-family:"Plus Jakarta Sans",sans-serif;font-size:14.5px;font-weight:700;padding:0;white-space:nowrap;}
.flatpickr-current-month input.cur-year{color:#fff;font-family:"Plus Jakarta Sans",sans-serif;font-weight:700;}
.flatpickr-current-month .flatpickr-monthDropdown-months{color:#fff;font-family:"Plus Jakarta Sans",sans-serif;font-weight:700;}
.flatpickr-current-month .flatpickr-monthDropdown-months option{color:#241B3A;}
.flatpickr-prev-month,.flatpickr-next-month{color:#fff;fill:#fff;}
.flatpickr-prev-month:hover,.flatpickr-next-month:hover{color:#FFC93C;}
.flatpickr-prev-month svg,.flatpickr-next-month svg{fill:currentColor;}
/* The year field's up/down spinner is invisible until hover by default
   (opacity:0), which on a touch device or at a glance just looks broken/
   missing rather than "hidden until you hover". Keeping it always
   partially visible, in a color that actually shows against the purple
   header, makes it discoverable; hover/tap brings it to full strength. */
.numInputWrapper{width:52px;}
.numInputWrapper span{opacity:.6;border-color:rgba(255,255,255,.4);}
.numInputWrapper span:hover{background:rgba(255,255,255,.18);}
.numInputWrapper:hover span{opacity:1;}
.numInputWrapper span.arrowUp:after{border-bottom-color:#fff;}
.numInputWrapper span.arrowDown:after{border-top-color:#fff;}

.flatpickr-weekdays{background:#fff;margin-top:6px;}
span.flatpickr-weekday{
	background:#fff;color:#7A7191;font-weight:800;font-size:11px;
	text-transform:uppercase;letter-spacing:.03em;
}

.flatpickr-days{border:none;}
.dayContainer{padding-top:2px;}
.flatpickr-day{
	color:#241B3A;border-radius:10px;font-weight:600;
	border:1.5px solid transparent;
}
.flatpickr-day.today{border-color:#17B6A0;color:#0E8B7A;font-weight:800;}
.flatpickr-day.today:hover{background:#DBF7F1;border-color:#17B6A0;}
.flatpickr-day:hover,.flatpickr-day:focus{background:#EEE6FF;border-color:#EEE6FF;}
.flatpickr-day.selected,.flatpickr-day.startRange,.flatpickr-day.endRange{
	background:linear-gradient(135deg,#FF4D6D,#8B5CF6) !important;
	border-color:transparent !important;color:#fff !important;
	box-shadow:0 3px 8px rgba(139,92,246,.35);
}
.flatpickr-day.selected.startRange,.flatpickr-day.startRange.startRange{border-radius:10px 4px 4px 10px;}
.flatpickr-day.endRange{border-radius:4px 10px 10px 4px;}
.flatpickr-day.inRange{
	background:#EEE6FF !important;border-color:#EEE6FF !important;color:#3B2E68 !important;
	box-shadow:-5px 0 0 #EEE6FF,5px 0 0 #EEE6FF;border-radius:0;
}
.flatpickr-day.flatpickr-disabled,.flatpickr-day.flatpickr-disabled:hover{
	color:#D8CFF2;cursor:not-allowed;background:transparent;
}
.flatpickr-day.prevMonthDay,.flatpickr-day.nextMonthDay{color:#D8CFF2;}
.flatpickr-day.week.selected{border-radius:0;}

/* The visible text field flatpickr shows in place of the native
   <input type="date"> - the plugin's own input styles (border, radius,
   padding, focus ring) already target `input` generically inside the
   wizard/dashboard/admin wrappers, so this only needs a cursor hint. */
input.flatpickr-alt-input,input.flatpickr-input{cursor:pointer;}
