/* Ensure Tailwind v4 emits all react-date-range utility classes. */
@source inline("rdrCalendarWrapper rdrDateDisplayWrapper rdrDateDisplay rdrDateDisplayItem rdrDateDisplayItemActive rdrMonthAndYearWrapper rdrMonthAndYearPickers rdrMonthPicker rdrYearPicker rdrNextPrevButton rdrPprevButton rdrNextButton rdrWeekDays rdrMonth rdrMonths rdrMonthsVertical rdrMonthName rdrWeekDay rdrDay rdrDayNumber rdrDayToday rdrInRange rdrStartEdge rdrEndEdge rdrSelected rdrDayStartOfMonth rdrDayStartOfWeek rdrDayEndOfMonth rdrDayEndOfWeek rdrDayInPreview rdrDayEndPreview rdrDayStartPreview rdrDefinedRangesWrapper rdrStaticRangeSelected rdrStaticRange rdrStaticRangeLabel rdrInputRanges rdrInputRange rdrInputRangeInput rdrDayHovered rdrDayPassive rdrDayDisabled rdrMonthsHorizontal rdrDays rdrInfiniteMonths rdrDateRangeWrapper rdrDateInput rdrWarning rdrDateRangePickerWrapper rdrStaticRanges");

@utility rdrCalendarWrapper {
	@apply text-text-black text-md;

	&:not(.rdrDateRangeWrapper) .rdrDayHovered .rdrDayNumber:after {
	content: '';
	@apply absolute top-[-2px] bottom-[-2px] left-0 right-0 border border-current rounded-[1.333em] bg-transparent;
	}

	/* Calendar container */
	@apply box-border bg-white inline-flex flex-col select-none;
}

@utility rdrDateDisplayWrapper {
	@apply bg-primary-50;
}

@utility rdrDateDisplay {
	@apply m-3;
	@apply flex justify-between;
}

@utility rdrDateDisplayItem {
	@apply rounded-sm bg-white shadow-xs border border-transparent;

	& input {
	@apply cursor-pointer h-[2.5em] leading-10 border-0 bg-transparent w-full text-text-gray;
	}
	@apply flex-1 basis-0 text-center text-inherit;

	& + & {
	@apply ml-[0.833em];
	}

	& input {
	@apply text-text-gray text-center;
	}

	& input:disabled {
	@apply cursor-default;
	}
}

@utility rdrDateDisplayItemActive {
	@apply border-current;

	& input {
	@apply text-text-black;
	}
}

@utility rdrMonthAndYearWrapper {
	@apply flex items-center h-[60px] pt-1.5;
	@apply box-border flex justify-between;
}

@utility rdrMonthAndYearPickers {
	@apply font-semibold;

	& select {
	@apply appearance-none border-0 bg-transparent rounded-sm outline-hidden text-text-gray text-center cursor-pointer;
	background: url("data:image/svg+xml;utf8,<svg width='9px' height='6px' viewBox='0 0 9 6' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'><g id='Artboard' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd' transform='translate(-636.000000, -171.000000)' fill-opacity='0.368716033'><g id='input' transform='translate(172.000000, 37.000000)' fill='%230E242F' fill-rule='nonzero'><g id='Group-9' transform='translate(323.000000, 127.000000)'><path d='M142.280245,7.23952813 C141.987305,6.92353472 141.512432,6.92361662 141.219585,7.23971106 C140.926739,7.5558055 140.926815,8.06821394 141.219755,8.38420735 L145.498801,13 L149.780245,8.38162071 C150.073185,8.0656273 150.073261,7.55321886 149.780415,7.23712442 C149.487568,6.92102998 149.012695,6.92094808 148.719755,7.23694149 L145.498801,10.7113732 L142.280245,7.23952813 Z' id='arrow'></path></g></g></g></svg>")
		no-repeat right 8px center;
	}

	& select:hover {
	@apply bg-black/10;
	}
	@apply flex flex-1 justify-center items-center;
}

@utility rdrMonthPicker {
	@apply my-0 mx-1.5;
}

@utility rdrYearPicker {
	@apply my-0 mx-1.5;
}

@utility rdrNextPrevButton {
	@apply block w-6 h-6 mx-3 p-0 border-0 rounded-sm bg-gray-100;

	&:hover {
	@apply bg-gray-200;
	}

	& i {
	@apply block w-0 h-0 m-auto p-0 text-center border-solid;
	transform: translate(-3px, 0);
	}
	@apply box-border cursor-pointer outline-hidden;
}

@utility rdrPprevButton {
	& i {
	border-width: 4px 6px 4px 4px;
	border-color: transparent var(--color-gray-700) transparent transparent;
	}
}

@utility rdrNextButton {
	& i {
	@apply ml-2;
	border-width: 4px 4px 4px 6px;
	border-color: transparent transparent transparent var(--color-gray-700);
	transform: translate(3px, 0);
	}
}

@utility rdrWeekDays {
	@apply px-3;

	.rdrMonth & {
	@apply p-0;
	}
	@apply flex;
}

@utility rdrMonth {
	@apply px-3 pb-6;

	& .rdrWeekDays {
	@apply p-0;
	}

	.rdrMonths.rdrMonthsVertical &:first-child .rdrMonthName {
	@apply hidden;
	}
	@apply w-[300px];
}

@utility rdrMonths {
	&.rdrMonthsVertical .rdrMonth:first-child .rdrMonthName {
	@apply hidden;
	}
	@apply flex;
}

@utility rdrMonthsVertical {
	&.rdrMonths .rdrMonth:first-child .rdrMonthName {
	@apply hidden;
	}
	@apply flex-col;
}

@utility rdrMonthName {
	.rdrMonths.rdrMonthsVertical .rdrMonth:first-child & {
	@apply hidden;
	}
	@apply text-left font-semibold text-text-gray p-0.5;
}

@utility rdrWeekDay {
	@apply font-normal leading-[2.667em] text-text-gray;
	@apply flex-[0_0_calc(100%/7)] box-border text-center;
}

@utility rdrDay {
	@apply bg-transparent select-none border-0 p-0 text-center text-text-gray;
	font: inherit;
	aspect-ratio: 1.2 / 1;

	&:focus {
	@apply outline-hidden;
	}

	&:not(.rdrDayPassive) .rdrInRange ~ .rdrDayNumber span {
	@apply text-text-white;
	}

	&:not(.rdrDayPassive) .rdrStartEdge ~ .rdrDayNumber span {
	@apply text-text-white;
	}

	&:not(.rdrDayPassive) .rdrEndEdge ~ .rdrDayNumber span {
	@apply text-text-white;
	}

	&:not(.rdrDayPassive) .rdrSelected ~ .rdrDayNumber span {
	@apply text-text-white;
	}

	/* DayCell */
	@apply box-border w-[calc(100%/7)] relative cursor-pointer;

	@supports (-ms-ime-align: auto) {
	flex-basis: 14.285% !important;
	}
}

@utility rdrDayNumber {
	@apply outline-hidden font-light absolute flex items-center justify-center;

	.rdrDayToday & span {
	@apply font-medium relative;
	}

	.rdrDayToday & span:after {
	content: '';
	@apply absolute bottom-[-4px] left-1/2 w-1 h-1 rounded-full bg-primary;
	transform: translate(-50%, 0);
	}

	.rdrDayToday:not(.rdrDayPassive) .rdrInRange ~ & span:after {
	@apply bg-white;
	}

	.rdrDayToday:not(.rdrDayPassive) .rdrStartEdge ~ & span:after {
	@apply bg-white;
	}

	.rdrDayToday:not(.rdrDayPassive) .rdrEndEdge ~ & span:after {
	@apply bg-white;
	}

	.rdrDayToday:not(.rdrDayPassive) .rdrSelected ~ & span:after {
	@apply bg-white;
	}

	.rdrDay:not(.rdrDayPassive) .rdrInRange ~ & span {
	@apply text-white;
	}

	.rdrDay:not(.rdrDayPassive) .rdrStartEdge ~ & span {
	@apply text-white;
	}

	.rdrDay:not(.rdrDayPassive) .rdrEndEdge ~ & span {
	@apply text-white;
	}

	.rdrDay:not(.rdrDayPassive) .rdrSelected ~ & span {
	@apply text-white;
	}

	.rdrCalendarWrapper:not(.rdrDateRangeWrapper) .rdrDayHovered &:after {
	content: '';
	@apply absolute top-[-2px] bottom-[-2px] left-0 right-0 border border-current rounded-[1.333em] bg-transparent;
	}

	.rdrDayPassive & span {
	@apply text-text-gray-light;
	}

	.rdrDayDisabled & span {
	@apply text-text-gray-light;
	}
	@apply block relative;

	& span {
	@apply text-text-black;
	}
}

@utility rdrDayToday {
	& .rdrDayNumber span {
	@apply font-medium relative;
	}

	& .rdrDayNumber span:after {
	content: '';
	@apply absolute bottom-[-4px] left-1/2 w-1 h-1 rounded-full bg-primary;
	transform: translate(-50%, 0);
	}

	&:not(.rdrDayPassive) .rdrInRange ~ .rdrDayNumber span:after {
	@apply bg-white;
	}

	&:not(.rdrDayPassive) .rdrStartEdge ~ .rdrDayNumber span:after {
	@apply bg-white;
	}

	&:not(.rdrDayPassive) .rdrEndEdge ~ .rdrDayNumber span:after {
	@apply bg-white;
	}

	&:not(.rdrDayPassive) .rdrSelected ~ .rdrDayNumber span:after {
	@apply bg-white;
	}
}

@utility rdrInRange {
	.rdrDayToday:not(.rdrDayPassive) & ~ .rdrDayNumber span:after {
	@apply bg-white;
	}

	.rdrDay:not(.rdrDayPassive) & ~ .rdrDayNumber span {
	@apply text-text-gray-light;
	}
	@apply bg-current absolute top-1.5 left-0 right-0 bottom-1.5;

	.rdrDayStartOfMonth & {
	@apply rounded-l left-[2px];
	}

	.rdrDayStartOfWeek & {
	@apply rounded-l left-[2px];
	}

	.rdrDayEndOfMonth & {
	@apply rounded-r right-[2px];
	}

	.rdrDayEndOfWeek & {
	@apply rounded-r right-[2px];
	}

	.rdrDayPassive & {
	@apply hidden;
	}

	.rdrDayDisabled & {
	filter: grayscale(100%) opacity(60%);
	}
	@apply pointer-events-none;
}

@utility rdrStartEdge {
	.rdrDayToday:not(.rdrDayPassive) & ~ .rdrDayNumber span:after {
	@apply bg-white;
	}

	.rdrDay:not(.rdrDayPassive) & ~ .rdrDayNumber span {
	@apply text-text-gray-light;
	}
	@apply bg-current absolute top-1.5 left-0 right-0 bottom-1.5;
	@apply rounded-l left-[2px];

	.rdrDayEndOfMonth & {
	@apply rounded-r right-[2px];
	}

	.rdrDayEndOfWeek & {
	@apply rounded-r right-[2px];
	}

	.rdrDayPassive & {
	@apply hidden;
	}

	.rdrDayDisabled & {
	filter: grayscale(100%) opacity(60%);
	}
	@apply pointer-events-none;
}

@utility rdrEndEdge {
	.rdrDayToday:not(.rdrDayPassive) & ~ .rdrDayNumber span:after {
	@apply bg-white;
	}

	.rdrDay:not(.rdrDayPassive) & ~ .rdrDayNumber span {
	@apply text-text-gray-light;
	}
	@apply bg-current absolute top-1.5 left-0 right-0 bottom-1.5;
	@apply rounded-r right-[2px];

	.rdrDayStartOfMonth & {
	@apply rounded-l left-[2px];
	}

	.rdrDayStartOfWeek & {
	@apply rounded-l left-[2px];
	}

	.rdrDayPassive & {
	@apply hidden;
	}

	.rdrDayDisabled & {
	filter: grayscale(100%) opacity(60%);
	}
	@apply pointer-events-none;
}

@utility rdrSelected {
	.rdrDayToday:not(.rdrDayPassive) & ~ .rdrDayNumber span:after {
	@apply bg-white;
	}

	.rdrDay:not(.rdrDayPassive) & ~ .rdrDayNumber span {
	@apply text-text-gray-light;
	}
	@apply bg-current absolute top-1.5 left-0 right-0 bottom-1.5;
	@apply left-[2px] right-[2px] rounded-sm;

	.rdrDayPassive & {
	@apply hidden;
	}

	.rdrDayDisabled & {
	filter: grayscale(100%) opacity(60%);
	}
	@apply pointer-events-none;
}

@utility rdrDayStartOfMonth {
	& .rdrInRange {
	@apply rounded-l left-[2px];
	}

	& .rdrEndEdge {
	@apply rounded-l left-[2px];
	}

	& .rdrDayInPreview {
	@apply rounded-l border-l-2;
	left: 0;
	}

	& .rdrDayEndPreview {
	@apply rounded-l border-l-2;
	left: 0;
	}
}

@utility rdrDayStartOfWeek {
	& .rdrInRange {
	@apply rounded-l left-[2px];
	}

	& .rdrEndEdge {
	@apply rounded-l left-[2px];
	}

	& .rdrDayInPreview {
	@apply rounded-l border-l-2;
	left: 0;
	}

	& .rdrDayEndPreview {
	@apply rounded-l border-l-2;
	left: 0;
	}
}

@utility rdrDayEndOfMonth {
	& .rdrInRange {
	@apply rounded-r right-[2px];
	}

	& .rdrStartEdge {
	@apply rounded-r right-[2px];
	}

	& .rdrDayInPreview {
	@apply rounded-r border-r-2;
	right: 0;
	}

	& .rdrDayStartPreview {
	@apply rounded-r border-r-2;
	right: 0;
	}
}

@utility rdrDayEndOfWeek {
	& .rdrInRange {
	@apply rounded-r right-[2px];
	}

	& .rdrStartEdge {
	@apply rounded-r right-[2px];
	}

	& .rdrDayInPreview {
	@apply rounded-r border-r-2;
	right: 0;
	}

	& .rdrDayStartPreview {
	@apply rounded-r border-r-2;
	right: 0;
	}
}

@utility rdrDayInPreview {
	.rdrDayStartOfMonth & {
	@apply rounded-l border-l-2;
	left: 0;
	}

	.rdrDayStartOfWeek & {
	@apply rounded-l border-l-2;
	left: 0;
	}

	.rdrDayEndOfMonth & {
	@apply rounded-r border-r-2;
	right: 0;
	}

	.rdrDayEndOfWeek & {
	@apply rounded-r border-r-2;
	right: 0;
	}
	@apply absolute top-[3px] left-0 right-0 bottom-[3px] pointer-events-none border-0 z-1;
	background: rgba(255, 255, 255, 0.09);
	border-color: currentColor;
	@apply border-t-2 border-b-2;

	.rdrDayPassive & {
	@apply hidden;
	}

	.rdrDayDisabled & {
	filter: grayscale(100%) opacity(60%);
	}
	@apply pointer-events-none;
}

@utility rdrDayEndPreview {
	.rdrDayStartOfMonth & {
	@apply rounded-l border-l-2;
	left: 0;
	}

	.rdrDayStartOfWeek & {
	@apply rounded-l border-l-2;
	left: 0;
	}
	@apply absolute top-[3px] left-0 right-0 bottom-[3px] pointer-events-none border-0 z-1;
	background: rgba(255, 255, 255, 0.09);
	border-color: currentColor;
	@apply border-t-2 border-r-2 border-b-2 rounded-r right-0;

	.rdrDayPassive & {
	@apply hidden;
	}

	.rdrDayDisabled & {
	filter: grayscale(100%) opacity(60%);
	}
	@apply pointer-events-none;
}

@utility rdrDayStartPreview {
	.rdrDayEndOfMonth & {
	@apply rounded-r border-r-2;
	right: 0;
	}

	.rdrDayEndOfWeek & {
	@apply rounded-r border-r-2;
	right: 0;
	}
	@apply absolute top-[3px] left-0 right-0 bottom-[3px] pointer-events-none border-0 z-1;
	background: rgba(255, 255, 255, 0.09);
	border-color: currentColor;
	@apply border-t-2 border-l-2 border-b-2 rounded-l left-0;

	.rdrDayPassive & {
	@apply hidden;
	}

	.rdrDayDisabled & {
	filter: grayscale(100%) opacity(60%);
	}
	@apply pointer-events-none;
}

@utility rdrDefinedRangesWrapper {
	@apply text-sm min-w-[160px] w-max border-r border-r-gray-200 bg-white;

	& .rdrStaticRangeSelected {
	@apply font-semibold text-current;
	}
}

@utility rdrStaticRangeSelected {
	.rdrDefinedRangesWrapper & {
	@apply font-bold text-current bg-green-100;
	}
}

@utility rdrStaticRange {
	@apply border-0 cursor-pointer block outline-hidden border-b border-b-gray-200 p-0 bg-white;

	&:hover .rdrStaticRangeLabel {
	@apply bg-gray-100;
	}

	&:focus .rdrStaticRangeLabel {
	@apply bg-gray-100;
	}
	@apply text-inherit;
}

@utility rdrStaticRangeLabel {
	.rdrStaticRange:hover & {
	@apply bg-gray-100;
	}

	.rdrStaticRange:focus & {
	@apply bg-gray-100;
	}
	@apply block overflow-hidden outline-hidden leading-[18px] px-5 py-2.5 text-left font-light;
}

@utility rdrInputRanges {
	@apply py-2.5;
}

@utility rdrInputRange {
	@apply flex items-center px-2.5 py-1.5;
}

@utility rdrInputRangeInput {
	@apply w-[30px] h-[30px] leading-[30px] rounded-sm text-center border border-gray-200 mr-2.5 text-text-gray;

	&:focus {
	@apply border-gray-300 outline-hidden text-text-black;
	}

	&:hover {
	@apply border-gray-300 outline-hidden text-text-black;
	}
}

@utility rdrDayHovered {
	.rdrCalendarWrapper:not(.rdrDateRangeWrapper) & .rdrDayNumber:after {
	content: '';
	@apply absolute top-[-2px] bottom-[-2px] left-0 right-0 border border-current rounded-[1.333em] bg-transparent;
	}
}

@utility rdrDayPassive {
	@apply pointer-events-none;

	& .rdrDayNumber span {
	@apply text-text-gray-light;
	}

	& .rdrInRange {
	@apply hidden;
	}

	& .rdrStartEdge {
	@apply hidden;
	}

	& .rdrEndEdge {
	@apply hidden;
	}

	& .rdrSelected {
	@apply hidden;
	}

	& .rdrDayStartPreview {
	@apply hidden;
	}

	& .rdrDayInPreview {
	@apply hidden;
	}

	& .rdrDayEndPreview {
	@apply hidden;
	}
}

@utility rdrDayDisabled {
	@apply bg-gray-50 cursor-not-allowed;

	& .rdrDayNumber span {
	@apply text-text-gray-light;
	}

	& .rdrInRange {
	filter: grayscale(100%) opacity(60%);
	}

	& .rdrStartEdge {
	filter: grayscale(100%) opacity(60%);
	}

	& .rdrEndEdge {
	filter: grayscale(100%) opacity(60%);
	}

	& .rdrSelected {
	filter: grayscale(100%) opacity(60%);
	}

	& .rdrDayStartPreview {
	filter: grayscale(100%) opacity(60%);
	}

	& .rdrDayInPreview {
	filter: grayscale(100%) opacity(60%);
	}

	& .rdrDayEndPreview {
	filter: grayscale(100%) opacity(60%);
	}
}

@utility rdrMonthsHorizontal {
	& > div > div > div {
	@apply flex flex-row;
	}
}

@utility rdrDays {
	@apply flex flex-wrap;
}

@utility rdrInfiniteMonths {
	@apply overflow-auto;
}

@utility rdrDateRangeWrapper {
	/* DateRangePicker wrapper */
	@apply select-none;
}

@utility rdrDateInput {
	/* DateInput */
	@apply relative;

	& input {
	@apply outline-hidden;
	}

	& .rdrWarning {
	@apply absolute text-[1.6em] leading-[1.6em] top-0 right-1 text-red;
	}
}

@utility rdrWarning {
	.rdrDateInput & {
	@apply absolute text-[1.6em] leading-[1.6em] top-0 right-1 text-red;
	}
}

@utility rdrDateRangePickerWrapper {
	/* DateRangePicker wrapper */
	@apply inline-flex select-none;
}

@utility rdrStaticRanges {
	/* DefinedRange */
	@apply flex flex-col;
}