/* Self-hosted Inter variable font (100–900) — no external font requests. */
@font-face {
	font-family: 'Inter';
	font-style: normal;
	font-display: swap;
	font-weight: 100 900;
	src: url('/assets/Inter-VariableFont_opsz_wght-BtFs5cFQ.woff2') format('woff2-variations');
}

/*
 * Fallback values for Webflow's hosted Designer theme variables
 * (see https://developers.webflow.com/apps/designer/docs/design-guidelines).
 *
 * Inside the real Webflow Designer, Webflow injects the real, theme-correct
 * values for these variables as normal (unlayered) CSS on this same document.
 * A declaration in a CSS Cascade Layer always loses to an unlayered
 * declaration for the same element/property, regardless of specificity or
 * source order — so wrapping our copies in a layer means Webflow's real
 * values win automatically inside the Designer, while these still apply
 * everywhere else (local dev, Storybook) where nothing else defines them.
 *
 * These are only declared on :root — never redeclared on descendant
 * elements — so normal CSS custom-property inheritance carries them (or
 * Webflow's real values) down to the whole document. Redeclaring them lower
 * in the tree would create an unopposed (and therefore always-winning)
 * layered declaration that inheritance could never override.
 */
@layer webflow-token-fallbacks {
	:root {
		/* Webflow colors */
		--background1: #1e1e1e;
		--background2: #2e2e2e;
		--background3: #383838;
		--background4: #373737;
		--background5: #444444;
		--backgroundInactive: #2e2e2e;
		--backgroundInverse: #ebebeb;
		--backgroundInput: rgba(0, 0, 0, 0.15);

		--actionPrimaryBackground: #006acc;
		--actionPrimaryBackgroundHover: #187cd9;
		--actionPrimaryText: #ffffff;
		--actionPrimaryTextHover: #ffffff;
		--actionSecondaryBackground:
			linear-gradient(180deg, rgba(255, 255, 255, 0.12) 0%, rgba(255, 255, 255, 0.1) 100%),
			rgba(255, 255, 255, 0.08);
		--actionSecondaryBackgroundHover: linear-gradient(
			180deg,
			rgba(255, 255, 255, 0.18) 0%,
			rgba(255, 255, 255, 0.16) 100%
		);
		--actionSecondaryText: #e0e0e0;
		--actionSecondaryTextHover: #e0e0e0;
		--actionSecondaryBorder: rgba(255, 255, 255, 0.1);
		--actionSecondaryBorderHover: rgba(255, 255, 255, 0.15);

		--text1: #ebebeb;
		--text2: #b9b9b9;
		--text3: #a3a3a3;
		--textInactive: #6d6d6d;
		--textInverse: #171717;

		--border1: rgba(255, 255, 255, 0.1);
		--border2: rgba(255, 255, 255, 0.14);
		--border3: rgba(255, 255, 255, 0.19);

		--blueText: #8ac2ff;
		--blueIcon: #8ac2ff;
		--blueBorder: #007df0;

		--greenBackground: #007a41;
		--greenBackgroundHover: #0d8a4f;
		--greenText: #63d489;
		--greenIcon: #63d489;
		--greenBorder: #259d4d;

		--yellowBackground: #946b00;
		--yellowBackgroundHover: #af7f00;
		--yellowText: #f3c831;
		--yellowIcon: #f3c831;
		--yellowBorder: #d7a220;

		--redBackground: #cf313b;
		--redBackgroundHover: #cb3535;
		--redText: #ff8a8a;
		--redIcon: #ff8a8a;
		--redBorder: #e42f3a;

		--orangeBackground: #bf4704;
		--orangeBackgroundHover: #c95616;
		--orangeText: #eba267;
		--orangeIcon: #eba267;
		--orangeBorder: #df640c;

		--purpleBackground: #734ce0;
		--purpleBackgroundHover: #815beb;
		--purpleText: #b89eff;
		--purpleIcon: #b89eff;
		--purpleBorder: #875ffd;

		/* Box shadows for buttons and inputs */
		--boxShadows-action-colored:
			0px 0.5px 1px 0px rgba(0, 0, 0, 0.8), 0px 0.5px 0.5px 0px rgba(255, 255, 255, 0.2) inset;
		--boxShadows-action-secondary:
			0px 0.5px 1px rgba(0, 0, 0, 0.8), inset 0px 0.5px 0.5px rgba(255, 255, 255, 0.12);
		--boxShadows-input-inner:
			0px 1px 1px -1px rgba(0, 0, 0, 0.13) inset, 0px 3px 3px -3px rgba(0, 0, 0, 0.17) inset,
			0px 4px 4px -4px rgba(0, 0, 0, 0.17) inset, 0px 8px 8px -8px rgba(0, 0, 0, 0.17) inset,
			0px 12px 12px -12px rgba(0, 0, 0, 0.13) inset, 0px 16px 16px -16px rgba(0, 0, 0, 0.13) inset;

		--boxShadows-menu:
			0px 12px 24px 8px rgba(0, 0, 0, 0.08), 0px 8px 16px 4px rgba(0, 0, 0, 0.08),
			0px 4px 8px 2px rgba(0, 0, 0, 0.08), 0px 2px 6px 0px rgba(0, 0, 0, 0.08),
			0px -0.5px 0.5px 0px rgba(0, 0, 0, 0.12) inset,
			0px 0.5px 0.5px 0px rgba(255, 255, 255, 0.12) inset;

		/* TYPOGRAPHY */
		--font-stack: 'Inter', sans-serif;

		--input-inner-shadow:
			0px 1px 1px -1px rgba(0, 0, 0, 0.13) inset, 0px 3px 3px -3px rgba(0, 0, 0, 0.17) inset,
			0px 4px 4px -4px rgba(0, 0, 0, 0.17) inset, 0px 8px 8px -8px rgba(0, 0, 0, 0.17) inset,
			0px 12px 12px -12px rgba(0, 0, 0, 0.13) inset, 0px 16px 16px -16px rgba(0, 0, 0, 0.13) inset;

		--menu-shadow:
			0px 12px 24px 8px rgba(0, 0, 0, 0.08), 0px 8px 16px 4px rgba(0, 0, 0, 0.08),
			0px 4px 8px 2px rgba(0, 0, 0, 0.08), 0px 2px 6px 0px rgba(0, 0, 0, 0.08),
			0px -0.5px 0.5px 0px rgba(0, 0, 0, 0.12) inset,
			0px 0.5px 0.5px 0px rgba(255, 255, 255, 0.12) inset;

		--font-size-small: 11.5px;
		--font-size-small-letter-spacing: -0.115px;
		--font-size-large: 12.5px;
		--font-weight-normal: 400;
		--font-weight-medium: 600;
		--border-radius: 4px;
	}
}

/*
 * Genuinely custom, non-Webflow tokens (scrollbar, spacing scale, Finsweet
 * Components sizing) plus layout resets that consume the tokens above.
 * These are never provided by Webflow, so they stay outside the fallback
 * layer and apply unconditionally everywhere, including inside the Designer.
 * Declared on :root so they inherit into #app without re-pinning theme there.
 */
:root {
	--sb-size: 6px;
	--sb-track-color: transparent;
	--sb-thumb-color: color-mix(in srgb, var(--text1) 30%, transparent);
	--black: #000000;

	/* Hover effect: derived from --text1 (Webflow-provided inside the
	   Designer) instead of a literal white overlay, so it stays correct
	   regardless of theme. */
	--hoverColor: color-mix(in srgb, var(--text1) 14%, transparent);

	/* NONWEBFLOW VARIABLES */
	--padding-tiny: 2px;
	--padding-small: 4px;
	--padding-regular: 8px;
	--padding-large: 12px;

	/* spacing */
	--spacing-12: 12px;
	--spacing-16: 16px;
	--spacing-8: 8px;
	--spacing-4: 4px;
	--spacing-32: 32px;
	--spacing-24: 24px;

	/* Finsweet Components: super app specific sizes */
	--components-navbar-height: 43px;
	--left-sidebar-width: 274px;
}

html,
body,
#app {
	height: 100%;
	background: var(--background1);
	font-family: var(--font-stack);
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

body {
	margin: 0;
	color: var(--text1);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;

	font-size: var(--font-size-large);
	font-family:
		Inter,
		-apple-system,
		BlinkMacSystemFont,
		'Segoe UI',
		Roboto,
		Oxygen-Sans,
		Ubuntu,
		Cantarell,
		'Helvetica Neue',
		Helvetica,
		Arial,
		'Apple Color Emoji',
		'Segoe UI Emoji',
		'Segoe UI Symbol',
		sans-serif;
}

button,
span,
h1,
h2,
h3,
h4,
h5,
p,
div,
input,
textarea,
select,
option,
label,
a {
	font-family:
		Inter,
		-apple-system,
		BlinkMacSystemFont,
		'Segoe UI',
		Roboto,
		Oxygen-Sans,
		Ubuntu,
		Cantarell,
		'Helvetica Neue',
		Helvetica,
		Arial,
		'Apple Color Emoji',
		'Segoe UI Emoji',
		'Segoe UI Symbol',
		sans-serif;
}

a {
	color: inherit;
}

h1 {
	font-size: var(--font-size-large);
	font-weight: 400;
	margin-bottom: 1rem;
	margin-block-start: 4px;
	margin-block-end: 4px;
}

h2 {
	font-size: var(--font-size-small);
	color: var(--text1);
	font-weight: 600;
	margin-block-start: 4px;
	margin-block-end: 4px;
}

h3 {
	font-size: var(--font-size-small);
	font-weight: 400;
	margin-bottom: 1rem;
	margin-block-start: 4px;
	margin-block-end: 4px;
}

form {
	display: block;
	margin-top: 0em;
	margin-block-end: 0em;
}

label {
	display: block;
	font-size: var(--font-size-small);
	font-weight: 400;
}

/* Global Disabled state */
.disabled,
.login-required {
	cursor: not-allowed !important;
	opacity: 0.8 !important;
}

/* Used for disabled sections */
.not-allowed {
	cursor: not-allowed !important;
}

input {
	/* Remove default appearance for some browsers */
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;

	/* Remove default border and padding for all browsers */
	border: var(--border3) 1px solid;
	border-radius: var(--border-radius, 4px);
	padding: var(--padding-small);
	margin: 0;

	/* Set font styles to inherit from parent */
	font-family: inherit;
	font-size: inherit;
	color: var(--text1);

	/* Remove the default background */
	background: var(--backgroundInput);

	/* Remove the highlight when focused (outline: none is generally discouraged due to accessibility concerns,
    so use it carefully and provide alternative focus styles) */
	outline: none;
}

/* Placeholder */

input::placeholder {
	/* Chrome, Firefox, Opera, Safari */
	color: var(--text3) !important;
}

input::-webkit-input-placeholder {
	/* Chrome/Safari/Opera */
	color: var(--text3) !important;
}

input::-moz-placeholder {
	/* Firefox */
	color: var(--text3) !important;
	opacity: 1;
	/* Firefox sometimes reduces opacity */
}

input:-ms-input-placeholder {
	/* IE/Edge */
	color: var(--text3) !important;
}

textarea {
	/* Remove default appearance for some browsers */
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;

	/* Remove default border and padding for all browsers */
	padding: var(--padding-regular);
	margin: 0;

	/* Set font styles to inherit from parent */
	font-family: inherit;
	font-size: inherit;
	color: var(--text1);

	/* Remove the default background */
	background: var(--backgroundInput);

	/* border */
	border: 1px solid;
	border-color: var(--border3);
	border-radius: var(--border-radius);

	/* Remove the highlight when focused (outline: none is generally discouraged due to accessibility concerns,
    so use it carefully and provide alternative focus styles) */
	outline: none;

	resize: none;
}

input[type='checkbox'] {
	/* The default appearance must be removed for custom styles */
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;

	/* Customize the checkbox */
	width: 12px;
	height: 12px;
	background: var(--background5);
	border-radius: var(--border-radius);
	vertical-align: middle;
	position: relative;
}

/* Checkmark style */
input[type='checkbox']:checked::before {
	content: '';
	display: block;
	width: 9px;
	height: 5px;
	border-style: solid;
	border-color: var(--text1);
	border-width: 0 0 2px 2px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -60%) rotate(-45deg);
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

/* Firefox */
/* input[type="number"] {
    -moz-appearance: textfield;
  } */

.button {
	/* Reset */
	all: unset;
	box-sizing: border-box;

	/* Layout */
	display: inline-flex;
	align-items: center;
	justify-content: center;
	position: relative;
	gap: 2px;

	/* Styling */
	padding: 4px;
	border-radius: var(--border-radius, 4px);
	font-family: var(--font-stack, Inter, sans-serif);
	font-weight: var(--font-weight-normal, 400);
	line-height: 16px;
	letter-spacing: -0.115px;
	text-align: center;
	cursor: pointer;
	user-select: none;
	transition: all 0.2s ease;

	/* Primary button styling */
	background: var(--actionPrimaryBackground);
	color: var(--actionPrimaryText);

	/* Shadow */
	box-shadow:
		0px 29px 23px -16px rgba(255, 255, 255, 0.04) inset,
		0px 0.5px 0.5px 0px rgba(255, 255, 255, 0.2) inset,
		0px 0.5px 1px 0px #000;
}

.button:hover:not(:disabled) {
	background: var(--actionPrimaryBackgroundHover);
}

.button:disabled {
	cursor: not-allowed;
	opacity: 0.4;
	pointer-events: none;
}

.flex {
	display: flex;
}

.flex-vertical {
	display: flex;
	flex-direction: column;
}

.tiny-label {
	color: var(--text2);
	font-size: var(--font-size-small);
	padding-top: 4px;
	padding-bottom: 4px;
	text-align: center;
}

/*
  The following styles are for the notification component
  */
.notification-wrapper {
	display: flex;
	padding: 8px;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
	align-self: stretch;
}
/* Global SVG styles */
svg:not(.loader-svg) {
	display: block;
	width: 14px;
	height: 14px;
}

/*
 * Scrollbars. Webflow injects unlayered chrome rules into the Designer
 * iframe (`::-webkit-scrollbar-track { background: #363636; border: 1px
 * #2b2b2b }`). Those beat a bare `::-webkit-scrollbar-*` selector, so we
 * raise specificity on html/body/* instead of re-theming #app. Transparent
 * track + 30% --text1 thumb matches Designer light and stays readable in
 * dark.
 */
html::-webkit-scrollbar,
body::-webkit-scrollbar,
*::-webkit-scrollbar {
	width: var(--sb-size);
	height: var(--sb-size);
}

html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track,
*::-webkit-scrollbar-track {
	background: transparent;
	border: none;
}

html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb,
*::-webkit-scrollbar-thumb {
	background-color: var(--sb-thumb-color);
	background-clip: padding-box;
	border: 2px solid transparent;
	border-radius: 8px;
}

html::-webkit-scrollbar-thumb:hover,
body::-webkit-scrollbar-thumb:hover,
*::-webkit-scrollbar-thumb:hover {
	background-color: color-mix(in srgb, var(--text1) 45%, transparent);
}

html::-webkit-scrollbar-corner,
body::-webkit-scrollbar-corner,
*::-webkit-scrollbar-corner {
	background: transparent;
	border: none;
}

/* Firefox scrollbar styling */
@supports selector(::-moz-scrollbar-thumb) {
	* {
		scrollbar-color: var(--sb-thumb-color) var(--sb-track-color);
		scrollbar-width: thin;
	}
}

/* Fallback for Firefox without newer scrollbar support */
@supports not selector(::-webkit-scrollbar) {
	html {
		scrollbar-color: var(--sb-thumb-color) var(--sb-track-color);
		scrollbar-width: thin;
	}
}
/*
 * Layered fallbacks for when Webflow has not injected Designer tokens yet
 * (local/dev). Light values match live Designer Appearance injects.
 * Unlayered Webflow :root injects always win inside the Designer iframe.
 */
@layer webflow-token-fallbacks {
  :root {
    --background1: light-dark(#ffffff, #1e1e1e);
    --background2: light-dark(#f5f5f5, #2e2e2e);
    --background3: light-dark(#e8e8e8, #383838);
    --background4: light-dark(#e0e0e0, #373737);
    --background5: light-dark(#dbdbdb, #444444);
    --backgroundInactive: light-dark(#f5f5f5, #2e2e2e);
    --backgroundInverse: light-dark(#000000, #ebebeb);
    --backgroundInput: light-dark(#ffffff, rgba(0, 0, 0, 0.15));

    --actionPrimaryBackground: light-dark(#146ef5, #006acc);
    --actionPrimaryBackgroundHover: light-dark(#2c80fd, #187cd9);
    --actionSecondaryBackground: light-dark(#efefef, #383838);
    --actionSecondaryBackgroundHover: light-dark(#e8e8e8, #444444);
    --actionSecondaryText: light-dark(#000000, #e0e0e0);
    --actionSecondaryTextHover: light-dark(#000000, #e0e0e0);
    --actionSecondaryBorder: light-dark(rgba(0, 0, 0, 0.1), rgba(255, 255, 255, 0.1));
    --actionSecondaryBorderHover: light-dark(rgba(0, 0, 0, 0.16), rgba(255, 255, 255, 0.15));

    --text1: light-dark(#000000, #ebebeb);
    --text2: light-dark(rgba(0, 0, 0, 0.6), #b9b9b9);
    --text3: light-dark(rgba(0, 0, 0, 0.6), #a3a3a3);
    --textInactive: light-dark(rgba(0, 0, 0, 0.5), #6d6d6d);
    --textInverse: light-dark(#ffffff, #171717);

    --border1: light-dark(#e0e0e0, rgba(255, 255, 255, 0.1));
    --border2: light-dark(#dbdbdb, rgba(255, 255, 255, 0.14));
    --border3: light-dark(#dbdbdb, rgba(255, 255, 255, 0.19));

    --blueText: light-dark(#146ef5, #8ac2ff);
    --blueIcon: light-dark(#146ef5, #8ac2ff);
    --blueBorder: light-dark(#146ef5, #007df0);

    --greenBackground: light-dark(#007a41, #007a41);
    --greenBackgroundHover: light-dark(#0d8a4f, #0d8a4f);
    --greenText: light-dark(#007a41, #63d489);
    --greenIcon: light-dark(#007a41, #63d489);
    --greenBorder: light-dark(#259d4d, #259d4d);

    --yellowBackground: light-dark(#bf4707, #946b00);
    --yellowBackgroundHover: light-dark(#c95616, #af7f00);
    --yellowText: light-dark(#bf4707, #f3c831);
    --yellowIcon: light-dark(#bf4707, #f3c831);
    --yellowBorder: light-dark(#df640c, #d7a220);

    --redBackground: light-dark(#cf313b, #cf313b);
    --redBackgroundHover: light-dark(#cb3535, #cb3535);
    --redText: light-dark(#cf313b, #ff8a8a);
    --redIcon: light-dark(#cf313b, #ff8a8a);
    --redBorder: light-dark(#e42f3a, #e42f3a);

    --orangeBackground: light-dark(#bf4707, #bf4704);
    --orangeBackgroundHover: light-dark(#c95616, #c95616);
    --orangeText: light-dark(#bf4707, #eba267);
    --orangeIcon: light-dark(#bf4707, #eba267);
    --orangeBorder: light-dark(#df640c, #df640c);

    --purpleBackground: light-dark(#734ce0, #734ce0);
    --purpleBackgroundHover: light-dark(#815beb, #815beb);
    --purpleText: light-dark(#734ce0, #b89eff);
    --purpleIcon: light-dark(#734ce0, #b89eff);
    --purpleBorder: light-dark(#875ffd, #875ffd);
  }
}
#app .labels.link-hover:hover:not(.disabled),
#app .labels.link-hover.is-busy {
  background-color: var(--hoverColor);
}

/*
 * Designer light injects lemon yellow (#FFD301 / #8B6D00) for warning
 * chrome. That reads as muddy on white. Reuse orange in light; keep the
 * current gold yellows in dark. Body carries color-scheme so light-dark()
 * follows Appearance.
 */
body {
  --yellowBackground: light-dark(var(--orangeBackground), #946b00);
  --yellowBackgroundHover: light-dark(var(--orangeBackgroundHover), #af7f00);
  --yellowText: light-dark(var(--orangeText), #f3c831);
  --yellowIcon: light-dark(var(--orangeIcon), #f3c831);
  --yellowBorder: light-dark(var(--orangeBorder), #d7a220);
}

#app .copy-button:not(.copy-button--disabled) {
  background: light-dark(var(--background2), var(--background5));
  box-shadow: none;
  border: 1px solid var(--border1);
  color: var(--text1);
}
.flatpickr-calendar {
  background: transparent;
  opacity: 0;
  display: none;
  text-align: center;
  visibility: hidden;
  padding: 0;
  -webkit-animation: none;
          animation: none;
  direction: ltr;
  border: 0;
  font-size: 14px;
  line-height: 24px;
  border-radius: 5px;
  position: absolute;
  width: 307.875px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -ms-touch-action: manipulation;
      touch-action: manipulation;
  background: #fff;
  -webkit-box-shadow: 1px 0 0 #e6e6e6, -1px 0 0 #e6e6e6, 0 1px 0 #e6e6e6, 0 -1px 0 #e6e6e6, 0 3px 13px rgba(0,0,0,0.08);
          box-shadow: 1px 0 0 #e6e6e6, -1px 0 0 #e6e6e6, 0 1px 0 #e6e6e6, 0 -1px 0 #e6e6e6, 0 3px 13px rgba(0,0,0,0.08);
}
.flatpickr-calendar.open,
.flatpickr-calendar.inline {
  opacity: 1;
  max-height: 640px;
  visibility: visible;
}
.flatpickr-calendar.open {
  display: inline-block;
  z-index: 99999;
}
.flatpickr-calendar.animate.open {
  -webkit-animation: fpFadeInDown 300ms cubic-bezier(0.23, 1, 0.32, 1);
          animation: fpFadeInDown 300ms cubic-bezier(0.23, 1, 0.32, 1);
}
.flatpickr-calendar.inline {
  display: block;
  position: relative;
  top: 2px;
}
.flatpickr-calendar.static {
  position: absolute;
  top: calc(100% + 2px);
}
.flatpickr-calendar.static.open {
  z-index: 999;
  display: block;
}
.flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+1) .flatpickr-day.inRange:nth-child(7n+7) {
  -webkit-box-shadow: none !important;
          box-shadow: none !important;
}
.flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+2) .flatpickr-day.inRange:nth-child(7n+1) {
  -webkit-box-shadow: -2px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;
          box-shadow: -2px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;
}
.flatpickr-calendar .hasWeeks .dayContainer,
.flatpickr-calendar .hasTime .dayContainer {
  border-bottom: 0;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.flatpickr-calendar .hasWeeks .dayContainer {
  border-left: 0;
}
.flatpickr-calendar.hasTime .flatpickr-time {
  height: 40px;
  border-top: 1px solid #e6e6e6;
}
.flatpickr-calendar.noCalendar.hasTime .flatpickr-time {
  height: auto;
}
.flatpickr-calendar:before,
.flatpickr-calendar:after {
  position: absolute;
  display: block;
  pointer-events: none;
  border: solid transparent;
  content: '';
  height: 0;
  width: 0;
  left: 22px;
}
.flatpickr-calendar.rightMost:before,
.flatpickr-calendar.arrowRight:before,
.flatpickr-calendar.rightMost:after,
.flatpickr-calendar.arrowRight:after {
  left: auto;
  right: 22px;
}
.flatpickr-calendar.arrowCenter:before,
.flatpickr-calendar.arrowCenter:after {
  left: 50%;
  right: 50%;
}
.flatpickr-calendar:before {
  border-width: 5px;
  margin: 0 -5px;
}
.flatpickr-calendar:after {
  border-width: 4px;
  margin: 0 -4px;
}
.flatpickr-calendar.arrowTop:before,
.flatpickr-calendar.arrowTop:after {
  bottom: 100%;
}
.flatpickr-calendar.arrowTop:before {
  border-bottom-color: #e6e6e6;
}
.flatpickr-calendar.arrowTop:after {
  border-bottom-color: #fff;
}
.flatpickr-calendar.arrowBottom:before,
.flatpickr-calendar.arrowBottom:after {
  top: 100%;
}
.flatpickr-calendar.arrowBottom:before {
  border-top-color: #e6e6e6;
}
.flatpickr-calendar.arrowBottom:after {
  border-top-color: #fff;
}
.flatpickr-calendar:focus {
  outline: 0;
}
.flatpickr-wrapper {
  position: relative;
  display: inline-block;
}
.flatpickr-months {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}
.flatpickr-months .flatpickr-month {
  background: transparent;
  color: rgba(0,0,0,0.9);
  fill: rgba(0,0,0,0.9);
  height: 34px;
  line-height: 1;
  text-align: center;
  position: relative;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  overflow: hidden;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.flatpickr-months .flatpickr-prev-month,
.flatpickr-months .flatpickr-next-month {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  text-decoration: none;
  cursor: pointer;
  position: absolute;
  top: 0;
  height: 34px;
  padding: 10px;
  z-index: 3;
  color: rgba(0,0,0,0.9);
  fill: rgba(0,0,0,0.9);
}
.flatpickr-months .flatpickr-prev-month.flatpickr-disabled,
.flatpickr-months .flatpickr-next-month.flatpickr-disabled {
  display: none;
}
.flatpickr-months .flatpickr-prev-month i,
.flatpickr-months .flatpickr-next-month i {
  position: relative;
}
.flatpickr-months .flatpickr-prev-month.flatpickr-prev-month,
.flatpickr-months .flatpickr-next-month.flatpickr-prev-month {
/*
      /*rtl:begin:ignore*/
/*
      */
  left: 0;
/*
      /*rtl:end:ignore*/
/*
      */
}
/*
      /*rtl:begin:ignore*/
/*
      /*rtl:end:ignore*/
.flatpickr-months .flatpickr-prev-month.flatpickr-next-month,
.flatpickr-months .flatpickr-next-month.flatpickr-next-month {
/*
      /*rtl:begin:ignore*/
/*
      */
  right: 0;
/*
      /*rtl:end:ignore*/
/*
      */
}
/*
      /*rtl:begin:ignore*/
/*
      /*rtl:end:ignore*/
.flatpickr-months .flatpickr-prev-month:hover,
.flatpickr-months .flatpickr-next-month:hover {
  color: #959ea9;
}
.flatpickr-months .flatpickr-prev-month:hover svg,
.flatpickr-months .flatpickr-next-month:hover svg {
  fill: #f64747;
}
.flatpickr-months .flatpickr-prev-month svg,
.flatpickr-months .flatpickr-next-month svg {
  width: 14px;
  height: 14px;
}
.flatpickr-months .flatpickr-prev-month svg path,
.flatpickr-months .flatpickr-next-month svg path {
  -webkit-transition: fill 0.1s;
  transition: fill 0.1s;
  fill: inherit;
}
.numInputWrapper {
  position: relative;
  height: auto;
}
.numInputWrapper input,
.numInputWrapper span {
  display: inline-block;
}
.numInputWrapper input {
  width: 100%;
}
.numInputWrapper input::-ms-clear {
  display: none;
}
.numInputWrapper input::-webkit-outer-spin-button,
.numInputWrapper input::-webkit-inner-spin-button {
  margin: 0;
  -webkit-appearance: none;
}
.numInputWrapper span {
  position: absolute;
  right: 0;
  width: 14px;
  padding: 0 4px 0 2px;
  height: 50%;
  line-height: 50%;
  opacity: 0;
  cursor: pointer;
  border: 1px solid rgba(57,57,57,0.15);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.numInputWrapper span:hover {
  background: rgba(0,0,0,0.1);
}
.numInputWrapper span:active {
  background: rgba(0,0,0,0.2);
}
.numInputWrapper span:after {
  display: block;
  content: "";
  position: absolute;
}
.numInputWrapper span.arrowUp {
  top: 0;
  border-bottom: 0;
}
.numInputWrapper span.arrowUp:after {
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-bottom: 4px solid rgba(57,57,57,0.6);
  top: 26%;
}
.numInputWrapper span.arrowDown {
  top: 50%;
}
.numInputWrapper span.arrowDown:after {
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 4px solid rgba(57,57,57,0.6);
  top: 40%;
}
.numInputWrapper span svg {
  width: inherit;
  height: auto;
}
.numInputWrapper span svg path {
  fill: rgba(0,0,0,0.5);
}
.numInputWrapper:hover {
  background: rgba(0,0,0,0.05);
}
.numInputWrapper:hover span {
  opacity: 1;
}
.flatpickr-current-month {
  font-size: 135%;
  line-height: inherit;
  font-weight: 300;
  color: inherit;
  position: absolute;
  width: 75%;
  left: 12.5%;
  padding: 7.48px 0 0 0;
  line-height: 1;
  height: 34px;
  display: inline-block;
  text-align: center;
  -webkit-transform: translate3d(0px, 0px, 0px);
          transform: translate3d(0px, 0px, 0px);
}
.flatpickr-current-month span.cur-month {
  font-family: inherit;
  font-weight: 700;
  color: inherit;
  display: inline-block;
  margin-left: 0.5ch;
  padding: 0;
}
.flatpickr-current-month span.cur-month:hover {
  background: rgba(0,0,0,0.05);
}
.flatpickr-current-month .numInputWrapper {
  width: 6ch;
  width: 7ch\0;
  display: inline-block;
}
.flatpickr-current-month .numInputWrapper span.arrowUp:after {
  border-bottom-color: rgba(0,0,0,0.9);
}
.flatpickr-current-month .numInputWrapper span.arrowDown:after {
  border-top-color: rgba(0,0,0,0.9);
}
.flatpickr-current-month input.cur-year {
  background: transparent;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  color: inherit;
  cursor: text;
  padding: 0 0 0 0.5ch;
  margin: 0;
  display: inline-block;
  font-size: inherit;
  font-family: inherit;
  font-weight: 300;
  line-height: inherit;
  height: auto;
  border: 0;
  border-radius: 0;
  vertical-align: initial;
  -webkit-appearance: textfield;
  -moz-appearance: textfield;
  appearance: textfield;
}
.flatpickr-current-month input.cur-year:focus {
  outline: 0;
}
.flatpickr-current-month input.cur-year[disabled],
.flatpickr-current-month input.cur-year[disabled]:hover {
  font-size: 100%;
  color: rgba(0,0,0,0.5);
  background: transparent;
  pointer-events: none;
}
.flatpickr-current-month .flatpickr-monthDropdown-months {
  appearance: menulist;
  background: transparent;
  border: none;
  border-radius: 0;
  box-sizing: border-box;
  color: inherit;
  cursor: pointer;
  font-size: inherit;
  font-family: inherit;
  font-weight: 300;
  height: auto;
  line-height: inherit;
  margin: -1px 0 0 0;
  outline: none;
  padding: 0 0 0 0.5ch;
  position: relative;
  vertical-align: initial;
  -webkit-box-sizing: border-box;
  -webkit-appearance: menulist;
  -moz-appearance: menulist;
  width: auto;
}
.flatpickr-current-month .flatpickr-monthDropdown-months:focus,
.flatpickr-current-month .flatpickr-monthDropdown-months:active {
  outline: none;
}
.flatpickr-current-month .flatpickr-monthDropdown-months:hover {
  background: rgba(0,0,0,0.05);
}
.flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month {
  background-color: transparent;
  outline: none;
  padding: 0;
}
.flatpickr-weekdays {
  background: transparent;
  text-align: center;
  overflow: hidden;
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  height: 28px;
}
.flatpickr-weekdays .flatpickr-weekdaycontainer {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
span.flatpickr-weekday {
  cursor: default;
  font-size: 90%;
  background: transparent;
  color: rgba(0,0,0,0.54);
  line-height: 1;
  margin: 0;
  text-align: center;
  display: block;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
  font-weight: bolder;
}
.dayContainer,
.flatpickr-weeks {
  padding: 1px 0 0 0;
}
.flatpickr-days {
  position: relative;
  overflow: hidden;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
      -ms-flex-align: start;
          align-items: flex-start;
  width: 307.875px;
}
.flatpickr-days:focus {
  outline: 0;
}
.dayContainer {
  padding: 0;
  outline: 0;
  text-align: left;
  width: 307.875px;
  min-width: 307.875px;
  max-width: 307.875px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: inline-block;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
          flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-around;
          justify-content: space-around;
  -webkit-transform: translate3d(0px, 0px, 0px);
          transform: translate3d(0px, 0px, 0px);
  opacity: 1;
}
.dayContainer + .dayContainer {
  -webkit-box-shadow: -1px 0 0 #e6e6e6;
          box-shadow: -1px 0 0 #e6e6e6;
}
.flatpickr-day {
  background: none;
  border: 1px solid transparent;
  border-radius: 150px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  color: #393939;
  cursor: pointer;
  font-weight: 400;
  width: 14.2857143%;
  -webkit-flex-basis: 14.2857143%;
      -ms-flex-preferred-size: 14.2857143%;
          flex-basis: 14.2857143%;
  max-width: 39px;
  height: 39px;
  line-height: 39px;
  margin: 0;
  display: inline-block;
  position: relative;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  text-align: center;
}
.flatpickr-day.inRange,
.flatpickr-day.prevMonthDay.inRange,
.flatpickr-day.nextMonthDay.inRange,
.flatpickr-day.today.inRange,
.flatpickr-day.prevMonthDay.today.inRange,
.flatpickr-day.nextMonthDay.today.inRange,
.flatpickr-day:hover,
.flatpickr-day.prevMonthDay:hover,
.flatpickr-day.nextMonthDay:hover,
.flatpickr-day:focus,
.flatpickr-day.prevMonthDay:focus,
.flatpickr-day.nextMonthDay:focus {
  cursor: pointer;
  outline: 0;
  background: #e6e6e6;
  border-color: #e6e6e6;
}
.flatpickr-day.today {
  border-color: #959ea9;
}
.flatpickr-day.today:hover,
.flatpickr-day.today:focus {
  border-color: #959ea9;
  background: #959ea9;
  color: #fff;
}
.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange,
.flatpickr-day.selected.inRange,
.flatpickr-day.startRange.inRange,
.flatpickr-day.endRange.inRange,
.flatpickr-day.selected:focus,
.flatpickr-day.startRange:focus,
.flatpickr-day.endRange:focus,
.flatpickr-day.selected:hover,
.flatpickr-day.startRange:hover,
.flatpickr-day.endRange:hover,
.flatpickr-day.selected.prevMonthDay,
.flatpickr-day.startRange.prevMonthDay,
.flatpickr-day.endRange.prevMonthDay,
.flatpickr-day.selected.nextMonthDay,
.flatpickr-day.startRange.nextMonthDay,
.flatpickr-day.endRange.nextMonthDay {
  background: #569ff7;
  -webkit-box-shadow: none;
          box-shadow: none;
  color: #fff;
  border-color: #569ff7;
}
.flatpickr-day.selected.startRange,
.flatpickr-day.startRange.startRange,
.flatpickr-day.endRange.startRange {
  border-radius: 50px 0 0 50px;
}
.flatpickr-day.selected.endRange,
.flatpickr-day.startRange.endRange,
.flatpickr-day.endRange.endRange {
  border-radius: 0 50px 50px 0;
}
.flatpickr-day.selected.startRange + .endRange:not(:nth-child(7n+1)),
.flatpickr-day.startRange.startRange + .endRange:not(:nth-child(7n+1)),
.flatpickr-day.endRange.startRange + .endRange:not(:nth-child(7n+1)) {
  -webkit-box-shadow: -10px 0 0 #569ff7;
          box-shadow: -10px 0 0 #569ff7;
}
.flatpickr-day.selected.startRange.endRange,
.flatpickr-day.startRange.startRange.endRange,
.flatpickr-day.endRange.startRange.endRange {
  border-radius: 50px;
}
.flatpickr-day.inRange {
  border-radius: 0;
  -webkit-box-shadow: -5px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;
          box-shadow: -5px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;
}
.flatpickr-day.flatpickr-disabled,
.flatpickr-day.flatpickr-disabled:hover,
.flatpickr-day.prevMonthDay,
.flatpickr-day.nextMonthDay,
.flatpickr-day.notAllowed,
.flatpickr-day.notAllowed.prevMonthDay,
.flatpickr-day.notAllowed.nextMonthDay {
  color: rgba(57,57,57,0.3);
  background: transparent;
  border-color: transparent;
  cursor: default;
}
.flatpickr-day.flatpickr-disabled,
.flatpickr-day.flatpickr-disabled:hover {
  cursor: not-allowed;
  color: rgba(57,57,57,0.1);
}
.flatpickr-day.week.selected {
  border-radius: 0;
  -webkit-box-shadow: -5px 0 0 #569ff7, 5px 0 0 #569ff7;
          box-shadow: -5px 0 0 #569ff7, 5px 0 0 #569ff7;
}
.flatpickr-day.hidden {
  visibility: hidden;
}
.rangeMode .flatpickr-day {
  margin-top: 1px;
}
.flatpickr-weekwrapper {
  float: left;
}
.flatpickr-weekwrapper .flatpickr-weeks {
  padding: 0 12px;
  -webkit-box-shadow: 1px 0 0 #e6e6e6;
          box-shadow: 1px 0 0 #e6e6e6;
}
.flatpickr-weekwrapper .flatpickr-weekday {
  float: none;
  width: 100%;
  line-height: 28px;
}
.flatpickr-weekwrapper span.flatpickr-day,
.flatpickr-weekwrapper span.flatpickr-day:hover {
  display: block;
  width: 100%;
  max-width: none;
  color: rgba(57,57,57,0.3);
  background: transparent;
  cursor: default;
  border: none;
}
.flatpickr-innerContainer {
  display: block;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  overflow: hidden;
}
.flatpickr-rContainer {
  display: inline-block;
  padding: 0;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.flatpickr-time {
  text-align: center;
  outline: 0;
  display: block;
  height: 0;
  line-height: 40px;
  max-height: 40px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  overflow: hidden;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}
.flatpickr-time:after {
  content: "";
  display: table;
  clear: both;
}
.flatpickr-time .numInputWrapper {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
  width: 40%;
  height: 40px;
  float: left;
}
.flatpickr-time .numInputWrapper span.arrowUp:after {
  border-bottom-color: #393939;
}
.flatpickr-time .numInputWrapper span.arrowDown:after {
  border-top-color: #393939;
}
.flatpickr-time.hasSeconds .numInputWrapper {
  width: 26%;
}
.flatpickr-time.time24hr .numInputWrapper {
  width: 49%;
}
.flatpickr-time input {
  background: transparent;
  -webkit-box-shadow: none;
          box-shadow: none;
  border: 0;
  border-radius: 0;
  text-align: center;
  margin: 0;
  padding: 0;
  height: inherit;
  line-height: inherit;
  color: #393939;
  font-size: 14px;
  position: relative;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-appearance: textfield;
  -moz-appearance: textfield;
  appearance: textfield;
}
.flatpickr-time input.flatpickr-hour {
  font-weight: bold;
}
.flatpickr-time input.flatpickr-minute,
.flatpickr-time input.flatpickr-second {
  font-weight: 400;
}
.flatpickr-time input:focus {
  outline: 0;
  border: 0;
}
.flatpickr-time .flatpickr-time-separator,
.flatpickr-time .flatpickr-am-pm {
  height: inherit;
  float: left;
  line-height: inherit;
  color: #393939;
  font-weight: bold;
  width: 2%;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  -webkit-align-self: center;
      -ms-flex-item-align: center;
          align-self: center;
}
.flatpickr-time .flatpickr-am-pm {
  outline: 0;
  width: 18%;
  cursor: pointer;
  text-align: center;
  font-weight: 400;
}
.flatpickr-time input:hover,
.flatpickr-time .flatpickr-am-pm:hover,
.flatpickr-time input:focus,
.flatpickr-time .flatpickr-am-pm:focus {
  background: #eee;
}
.flatpickr-input[readonly] {
  cursor: pointer;
}
@-webkit-keyframes fpFadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -20px, 0);
            transform: translate3d(0, -20px, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}
@keyframes fpFadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -20px, 0);
            transform: translate3d(0, -20px, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}
.flatpickr-day.selected.startRange + .endRange:not(:nth-child(7n + 1)),
.flatpickr-day.startRange.startRange + .endRange:not(:nth-child(7n + 1)),
.flatpickr-day.endRange.startRange + .endRange:not(:nth-child(7n + 1)) {
  box-shadow: -10px 0 0 var(--actionPrimaryBackgroundHover) !important;
}

.flatpickr-calendar {
  background: var(--background3) !important;
  border: 1px solid var(--border1) !important;
  box-shadow: var(--menu-shadow) !important;
  width: 220px !important;
  height: 250px !important;
  overflow: hidden !important;
  line-height: 1.2 !important;
  padding: 4px !important;
}

.flatpickr-calendar * {
  font-size: 11px !important;
}
.flatpickr-calendar:after {
  border-width: 8px;
  margin: 0 -4px;
}

.flatpickr-calendar.arrowTop:before {
  border-bottom-color: var(--border1) !important;
}

.flatpickr-calendar.arrowTop:after {
  border-bottom-color: var(--background3) !important;
}

.flatpickr-months {
  display: grid !important;
  grid-template-columns: 1fr auto auto !important;
  grid-template-areas: 'month prev next' !important;
  align-items: center !important;
  padding: 0 !important;
  gap: 2px !important;
  height: 32px !important;
  margin-bottom: 8px !important;
}

.flatpickr-months::after {
  content: '' !important;
  position: absolute !important;
  z-index: 1 !important;
  top: 40px !important;
  left: 0 !important;
  right: -20px;
  width: 100% !important;
  height: 1px !important;
  background: var(--border1) !important;
}

.flatpickr-month {
  grid-area: month !important;
  display: flex !important;
  align-items: center !important;
  justify-self: start !important;
  gap: 6px !important;
}

.flatpickr-months .flatpickr-month {
  background: var(--background3) !important;
  color: var(--text1) !important;
}

.flatpickr-prev-month,
.flatpickr-next-month {
  padding: 3px !important;
  background: var(--background5) !important;
  border-radius: 50% !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

.flatpickr-prev-month {
  grid-area: prev !important;
  position: static !important;
  justify-self: center !important;
}

.flatpickr-next-month {
  grid-area: next !important;
  position: static !important;
  justify-self: center !important;
}

.flatpickr-months .flatpickr-prev-month,
.flatpickr-months .flatpickr-next-month {
  width: 18px !important;
  height: 18px !important;
}

.flatpickr-months .flatpickr-prev-month:hover,
.flatpickr-months .flatpickr-next-month:hover {
  filter: brightness(1.1) !important;
}

.flatpickr-months .flatpickr-prev-month svg {
  position: relative;
  left: -1px;
}

.flatpickr-months .flatpickr-next-month svg {
  position: relative;
  right: 1px;
}

.flatpickr-months .flatpickr-prev-month svg path,
.flatpickr-months .flatpickr-next-month svg path {
  stroke-width: 2 !important;
  stroke: var(--text1) !important;
  z-index: 10;
}

.flatpickr-months .flatpickr-prev-month svg,
.flatpickr-months .flatpickr-next-month svg {
  fill: var(--text1) !important;
  width: 8px !important;
  height: 8px !important;
}

.flatpickr-current-month {
  display: flex !important;
  align-items: center !important;
  padding: 0 !important;
  margin: 0 !important;
  width: 170px !important;
  position: static !important;
  gap: 6px !important;
  height: 24px !important;
}

.flatpickr-monthDropdown-months {
  background: var(--background3) !important;
  color: var(--text1) !important;
  border: 1px solid var(--border1) !important;
  margin-right: 4px !important;
  height: 24px !important;
  padding: 0 !important;
  width: 110px !important;
  flex: 1;
  font-size: 14px !important;
  border-radius: 4px !important;
}

.numInput {
  padding: 2px 10px 2px 2px !important;
  height: 24px !important;
  border-radius: 4px !important;
  width: 60px !important;
  border: 1px solid var(--border1) !important;
  text-align: center !important;
  background: var(--background3) !important;
  color: var(--text1) !important;
  font-size: 14px !important;
}

.numInputWrapper {
  width: 64px !important;
  display: block !important;
}

.numInputWrapper span {
  background: var(--border1) !important;
  position: absolute !important;
  right: 2px !important;
  width: 14px !important;
  padding: 0 4px 0 2px !important;
  height: 50% !important;
  line-height: 50% !important;
  opacity: 1 !important;
  cursor: pointer !important;
  box-sizing: border-box !important;
}

.flatpickr-current-month .numInputWrapper span.arrowDown {
  border-bottom-right-radius: 6px;
}

.flatpickr-current-month .numInputWrapper span.arrowUp {
  border-top-right-radius: 6px;
  top: 0 !important;
  border-bottom: 0 !important;
}

.flatpickr-current-month .numInputWrapper span.arrowUp:after {
  border-bottom-color: var(--text1) !important;
}

.flatpickr-current-month .numInputWrapper span.arrowDown:after {
  border-top-color: var(--text1) !important;
}

.flatpickr-innerContainer {
  width: 215px !important;
  height: auto !important;
  position: relative;
  left: -4px !important;
}

.flatpickr-rContainer {
  width: 215px !important;
  height: auto !important;
  padding: 0 !important;
}

.flatpickr-days {
  width: 215px !important;
}

.flatpickr-weekdays {
  background: var(--background3) !important;
  width: 215px !important;
  overflow: hidden !important;
  display: block !important;
}

.flatpickr-weekdays .flatpickr-weekdaycontainer {
  width: 215px !important;
  min-width: 215px !important;
  max-width: 215px !important;
  display: grid !important;
  grid-template-columns: repeat(7, 26px) !important;
  justify-content: center !important;
  gap: 3px !important;
  padding: 0 6px !important;
  box-sizing: border-box !important;
  flex: none !important;
}

.flatpickr-weekdays .flatpickr-weekday {
  color: var(--text2) !important;
  background: var(--background3) !important;
  text-align: center !important;
  padding: 0 !important;
  width: 26px !important;
  height: 26px !important;
  justify-self: center !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: none !important;
}

.flatpickr-days .dayContainer {
  width: 215px !important;
  min-width: 215px !important;
  max-width: 215px !important;
  display: grid !important;
  grid-template-columns: repeat(7, 26px) !important;
  justify-content: center !important;
  gap: 3px !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  flex-wrap: unset !important;
  text-align: center !important;
}

.flatpickr-day {
  color: var(--text1) !important;
  border: 1px solid transparent !important;
  width: 26px !important;
  height: 26px !important;
  line-height: 26px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  flex-basis: auto !important;
  max-width: 26px !important;
  min-width: 26px !important;
  border-radius: 3px !important;
}

.flatpickr-day:hover {
  background: var(--actionPrimaryBackgroundHover) !important;
  color: var(--text1) !important;
}

.flatpickr-day.selected {
  background: var(--actionPrimaryBackgroundHover) !important;
  color: var(--text1) !important;
  border-color: var(--actionPrimaryBackgroundHover) !important;
}

.flatpickr-day.startRange,
.flatpickr-day.endRange {
  background: var(--actionPrimaryBackgroundHover) !important;
  color: var(--text1) !important;
  border-color: var(--actionPrimaryBackgroundHover) !important;
  border: none !important;
}

.flatpickr-day.inRange {
  background: rgba(24, 124, 217, 0.2) !important;
  color: var(--text1) !important;
  border-color: var(--actionPrimaryBackground) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  border: none !important;
}

.flatpickr-day.today {
  border-color: rgba(24, 124, 217, 0.2) !important;
  color: var(--text1) !important;
  background: rgba(24, 124, 217, 0.2) !important;
}

.flatpickr-day.prevMonthDay,
.flatpickr-day.nextMonthDay {
  color: var(--text4) !important;
}
.flatpickr-day.prevMonthDay:hover,
.flatpickr-day.nextMonthDay:hover {
  color: var(--text1) !important;
}

.flatpickr-day.flatpickr-disabled,
.flatpickr-prev-month.flatpickr-disabled {
  color: var(--text4) !important;
  opacity: 0.4 !important;
  cursor: not-allowed !important;
  background: var(--background4) !important;
}

.flatpickr-day.flatpickr-disabled:hover {
  background: var(--background4) !important;
  color: var(--text4) !important;
  cursor: not-allowed !important;
}
