/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/_next/static/media/ba9851c3c22cd980-s.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/_next/static/media/21350d82a1f187e9-s.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/_next/static/media/c5fe6dc8356a8c31-s.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/_next/static/media/19cfc7226ec3afaa-s.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/_next/static/media/df0a9ae256c0569c-s.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/_next/static/media/8e9860b6e62d6359-s.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/_next/static/media/e4af272ccee01ff0-s.p.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}@font-face {font-family: 'Inter Fallback';src: local("Arial");ascent-override: 90.44%;descent-override: 22.52%;line-gap-override: 0.00%;size-adjust: 107.12%
}.__className_f367f3 {font-family: 'Inter', 'Inter Fallback';font-style: normal
}

/* React Datepicker Theme Styles */

/* Base container */
.react-datepicker-popper {
  z-index: var(--z-popover, 100005) !important;
}

/* Forced stacking context for datepicker inside drawers */
.react-datepicker-popper-forced {
  position: relative !important;
  z-index: 100005 !important;
}

.react-datepicker-popper-forced .react-datepicker {
  position: relative;
  z-index: 100005 !important;
}

.react-datepicker-wrapper {
  width: 100%;
}

.react-datepicker {
  font-family: inherit;
  background-color: var(--menu-bg) !important;
  border: 1px solid var(--menu-border) !important;
  border-radius: var(--radius-md);
  box-shadow: 0 10px 25px var(--shadow-color-dark);
  backdrop-filter: blur(var(--glass-blur));
  -webkit-backdrop-filter: blur(var(--glass-blur));
  padding: 1rem;
}

/* Header */
.react-datepicker__header {
  background-color: var(--menu-bg) !important;
  border-bottom: 1px solid var(--border-muted) !important;
  padding-bottom: 0.5rem;
  margin-bottom: 0.5rem;
  border-radius: 0;
}

.react-datepicker__current-month,
.react-datepicker-time__header {
  color: var(--text-primary) !important;
  font-weight: 500;
  margin-bottom: 0.5rem;
  background-color: transparent !important;
}

.react-datepicker__day-names {
  display: flex;
  justify-content: space-around;
  background-color: transparent !important;
}

.react-datepicker__day-name {
  color: var(--text-secondary) !important;
  font-size: 0.875rem;
  width: 2.5rem;
  line-height: 2.5rem;
  margin: 0;
  background-color: transparent !important;
}

/* Navigation */
.react-datepicker__navigation {
  top: 1rem;
  width: 2rem;
  height: 2rem;
  border: 1px solid var(--border-muted);
  background-color: var(--menu-bg) !important;
  border-radius: var(--radius-sm);
  transition: all var(--transition-fast);
}

.react-datepicker__navigation:hover {
  background-color: var(--hover-bg) !important;
  border-color: var(--accent-color);
}

.react-datepicker__navigation-icon::before {
  border-color: var(--text-secondary);
  border-width: 2px 2px 0 0;
  width: 0.5rem;
  height: 0.5rem;
  top: 0.65rem;
}

.react-datepicker__navigation--previous {
  left: 1rem;
}

.react-datepicker__navigation--next {
  right: 1rem;
}

/* Calendar Days */
.react-datepicker__month {
  margin: 0;
  background-color: transparent !important;
}

.react-datepicker__week {
  display: flex;
  justify-content: space-around;
}

.react-datepicker__day {
  color: var(--text-primary) !important;
  width: 2.5rem;
  line-height: 2.5rem;
  margin: 0.125rem;
  border-radius: var(--radius-sm);
  transition: all var(--transition-fast);
  background-color: transparent !important;
}

.react-datepicker__day:not(.react-datepicker__day--disabled):not(.react-datepicker__day--outside-month):hover {
  background-color: var(--hover-bg) !important;
  border: 1px solid var(--accent-color);
}

.react-datepicker__day--selected,
.react-datepicker__day--keyboard-selected {
  background-color: var(--accent-color) !important;
  color: var(--accent-contrast) !important;
  font-weight: 500;
}

.react-datepicker__day--selected:hover,
.react-datepicker__day--keyboard-selected:hover {
  background-color: var(--accent-color) !important;
  opacity: 0.9;
}

.react-datepicker__day--today {
  background-color: var(--hover-bg) !important;
  font-weight: 500;
}

.react-datepicker__day--outside-month {
  color: var(--text-tertiary) !important;
  opacity: 0.5;
}

.react-datepicker__day--disabled {
  color: var(--text-tertiary) !important;
  opacity: 0.3;
  cursor: not-allowed;
}

.react-datepicker__day--disabled:hover {
  background-color: transparent !important;
  border: none;
}

/* Time Picker */
.react-datepicker__time-container {
  border-left: 1px solid var(--border-muted) !important;
  width: 100px;
  background-color: var(--menu-bg) !important;
}

.react-datepicker__time,
.react-datepicker__time-box {
  background-color: var(--menu-bg) !important;
}

.react-datepicker__time-caption {
  color: var(--text-secondary) !important;
  background-color: var(--menu-bg) !important;
  padding: 0.5rem;
  text-align: center;
  font-weight: 500;
}

.react-datepicker__time-list {
  height: 200px !important;
  overflow-y: auto !important;
  scrollbar-width: thin;
  scrollbar-color: var(--border-muted) transparent;
  background-color: var(--menu-bg) !important;
}

.react-datepicker__time-list::-webkit-scrollbar {
  width: 6px;
}

.react-datepicker__time-list::-webkit-scrollbar-track {
  background: transparent;
}

.react-datepicker__time-list::-webkit-scrollbar-thumb {
  background: var(--border-muted);
  border-radius: 3px;
}

.react-datepicker__time-list-item {
  color: var(--text-primary) !important;
  background-color: transparent !important;
  padding: 0.5rem;
  transition: all var(--transition-fast);
}

.react-datepicker__time-list-item:hover {
  background-color: var(--hover-bg) !important;
  color: var(--text-primary) !important;
}

.react-datepicker__time-list-item--selected {
  background-color: var(--accent-color) !important;
  color: var(--accent-contrast) !important;
  font-weight: 500;
}

.react-datepicker__time-list-item--selected:hover {
  background-color: var(--accent-color) !important;
  opacity: 0.9;
}

.react-datepicker__time-list-item--disabled {
  color: var(--text-tertiary) !important;
  opacity: 0.3;
  cursor: not-allowed;
}

/* Triangle Arrow */
.react-datepicker__triangle {
  display: none;
}

/* Override any default styles that might cause white backgrounds */
.react-datepicker__day-name,
.react-datepicker__day,
.react-datepicker__time-list-item {
  background-color: transparent !important;
}

/* Ensure all containers use proper theme backgrounds */
.react-datepicker__month-container {
  background-color: transparent !important;
}

.react-datepicker__year-month {
  background-color: transparent !important;
}

/* Fix for potential white background in month/year view */
.react-datepicker__month-text,
.react-datepicker__year-text,
.react-datepicker__quarter-text {
  background-color: transparent !important;
  color: var(--text-primary) !important;
}

.react-datepicker__month-text:hover,
.react-datepicker__year-text:hover,
.react-datepicker__quarter-text:hover {
  background-color: var(--hover-bg) !important;
}

/* Month/Year containers */
.react-datepicker__monthPicker,
.react-datepicker__yearPicker {
  background-color: var(--menu-bg) !important;
}

/* Aria-live region fix */
.react-datepicker__aria-live {
  display: none;
}

/* Dark Theme Specific Overrides */
[data-theme="dark"] .react-datepicker {
  background-color: var(--menu-bg) !important;
  box-shadow: 0 10px 35px rgba(0, 0, 0, 0.7);
}

[data-theme="dark"] .react-datepicker__header {
  background-color: var(--menu-bg) !important;
}

[data-theme="dark"] .react-datepicker__time-container,
[data-theme="dark"] .react-datepicker__time {
  background-color: var(--menu-bg) !important;
}

[data-theme="dark"] .react-datepicker__day:not(.react-datepicker__day--disabled):not(.react-datepicker__day--outside-month):hover {
  background-color: var(--hover-bg) !important;
  border-color: var(--accent-color);
}

[data-theme="dark"] .react-datepicker__time-list-item:hover {
  background-color: var(--hover-bg) !important;
}

/* Black Theme Specific Overrides */
[data-theme="black"] .react-datepicker {
  background-color: var(--menu-bg) !important;
  box-shadow: 0 10px 35px rgba(0, 0, 0, 0.9);
}

[data-theme="black"] .react-datepicker__header {
  background-color: var(--menu-bg) !important;
}

[data-theme="black"] .react-datepicker__time-container,
[data-theme="black"] .react-datepicker__time {
  background-color: var(--menu-bg) !important;
}

[data-theme="black"] .react-datepicker__day:not(.react-datepicker__day--disabled):not(.react-datepicker__day--outside-month):hover {
  background-color: var(--hover-bg) !important;
  border-color: var(--accent-color);
}

[data-theme="black"] .react-datepicker__time-list-item:hover {
  background-color: var(--hover-bg) !important;
}

/* Input field styles */
.react-datepicker__input-container input {
  width: 100%;
  padding: 0.5rem 1rem;
  background-color: var(--input-bg);
  border: 1px solid var(--input-border);
  border-radius: var(--radius-sm);
  color: var(--text-primary);
  transition: all var(--transition-fast);
}

.react-datepicker__input-container input:hover {
  border-color: var(--accent-color);
}

.react-datepicker__input-container input:focus {
  outline: none;
  border-color: var(--accent-color);
  ring: 2px solid var(--focus-ring);
  ring-offset: 2px;
}

/* Month/Year Dropdown */
.react-datepicker__month-dropdown,
.react-datepicker__year-dropdown {
  background-color: var(--menu-bg) !important;
  border: 1px solid var(--menu-border);
  border-radius: var(--radius-sm);
  color: var(--text-primary);
}

.react-datepicker__month-option,
.react-datepicker__year-option {
  padding: 0.5rem;
  transition: all var(--transition-fast);
  background-color: var(--menu-bg) !important;
}

.react-datepicker__month-option:hover,
.react-datepicker__year-option:hover {
  background-color: var(--menu-highlight) !important;
}

.react-datepicker__month-option--selected,
.react-datepicker__year-option--selected {
  background-color: var(--accent-color) !important;
  color: var(--accent-contrast) !important;
}

/* Ensure proper stacking above modals/drawers */
.datepicker-popper {
  z-index: 100005 !important;
}

/* Portal container */
.react-datepicker-portal {
  z-index: 100005 !important;
}

.react-datepicker-portal .react-datepicker__overlay {
  background-color: rgba(0, 0, 0, 0.4);
}

/* Force datepicker to render above drawers */
.react-datepicker__portal {
  position: fixed !important;
  z-index: 100005 !important;
}

.react-datepicker__portal .react-datepicker-popper {
  z-index: 100005 !important;
}

/* Ensure time list is also properly positioned */
.react-datepicker__time-container .react-datepicker__time {
  position: relative;
  z-index: 100005;
}

/* Fix positioning for datepicker */
.react-datepicker-popper[data-placement^="top"] {
  margin-bottom: 0 !important;
}

.react-datepicker-popper[data-placement^="bottom"] {
  margin-top: 0 !important;
}

/* Ensure proper absolute positioning */
.react-datepicker-wrapper {
  display: inline-block;
  width: 100%;
  position: relative;
}

.react-datepicker-popper {
  position: absolute !important;
  z-index: 100005 !important;
}

/* Responsive adjustments */
@media (max-width: 640px) {
  .react-datepicker {
    font-size: 0.875rem;
  }
  
  .react-datepicker__day {
    width: 2rem;
    line-height: 2rem;
  }
  
  .react-datepicker__time-container {
    width: 80px;
  }
}

/* DateTimePicker Theme Token Fix */
/* This file ensures the hour and minute fields in the DateTimePicker 
   conform to our theme tokens across all themes */

/* Time Container - Enhanced theme consistency */
.react-datepicker__time-container {
  background: var(--input-bg) !important;
  border-left: 1px solid var(--input-border) !important;
}

.react-datepicker__time-container .react-datepicker__time {
  background: var(--input-bg) !important;
}

.react-datepicker__time-container .react-datepicker__time-box {
  background: var(--input-bg) !important;
}

/* Time List - Enhanced theme consistency */
.react-datepicker__time-list {
  background: var(--input-bg) !important;
  border: 1px solid var(--input-border);
  scrollbar-color: var(--border-muted) transparent;
}

.react-datepicker__time-list::-webkit-scrollbar {
  width: 6px;
}

.react-datepicker__time-list::-webkit-scrollbar-track {
  background: transparent;
}

.react-datepicker__time-list::-webkit-scrollbar-thumb {
  background: var(--border-muted);
  border-radius: 3px;
}

.react-datepicker__time-list::-webkit-scrollbar-thumb:hover {
  background: var(--border);
}

/* Time List Items - Enhanced theme consistency */
.react-datepicker__time-list-item {
  color: var(--text-primary) !important;
  background: transparent !important;
  padding: 8px 12px;
  transition: all var(--transition-fast);
  cursor: pointer;
}

.react-datepicker__time-list-item:hover:not(.react-datepicker__time-list-item--disabled) {
  background: var(--button-outline-hover-bg) !important;
  color: var(--accent-color) !important;
  border-left: 3px solid var(--accent-color);
  padding-left: 9px;
}

.react-datepicker__time-list-item--selected {
  background: var(--accent-color) !important;
  color: var(--accent-contrast) !important;
  font-weight: 600;
  border-left: 3px solid var(--accent-color);
}

.react-datepicker__time-list-item--selected:hover {
  background: var(--button-hover) !important;
  color: var(--accent-contrast) !important;
}

.react-datepicker__time-list-item--disabled {
  color: var(--text-tertiary) !important;
  opacity: 0.5;
  cursor: not-allowed;
}

.react-datepicker__time-list-item--disabled:hover {
  background: transparent !important;
  border-left: none;
  padding-left: 12px;
}

/* Time Header/Caption - Enhanced theme consistency */
.react-datepicker-time__header,
.react-datepicker__time-caption {
  background: var(--input-bg) !important;
  color: var(--text-secondary) !important;
  border-bottom: 1px solid var(--input-border);
  padding: 8px;
  font-weight: 500;
  text-align: center;
}

/* Ensure time picker inherits correct theme in all modes */
[data-theme="light"] .react-datepicker__time-container,
[data-theme="light"] .react-datepicker__time-list {
  background: var(--input-bg) !important;
  border-color: var(--input-border) !important;
}

[data-theme="dark"] .react-datepicker__time-container,
[data-theme="dark"] .react-datepicker__time-list {
  background: var(--input-bg) !important;
  border-color: var(--input-border) !important;
}

[data-theme="black"] .react-datepicker__time-container,
[data-theme="black"] .react-datepicker__time-list {
  background: var(--input-bg) !important;
  border-color: var(--input-border) !important;
}

/* Focus states for keyboard navigation */
.react-datepicker__time-list-item:focus {
  outline: 2px solid var(--focus-ring);
  outline-offset: -2px;
}

/* Smooth transitions between states */
.react-datepicker__time-container * {
  transition: background-color var(--transition-fast), 
              color var(--transition-fast), 
              border-color var(--transition-fast);
}

/* Ensure proper contrast in all themes */
.react-datepicker__time-container {
  min-width: 100px;
  position: relative;
}

/* Add subtle shadow for depth */
.react-datepicker__time-list {
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1);
}

/* Active time indicator */
.react-datepicker__time-list-item--selected::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: var(--accent-contrast);
}

/* Improve readability with proper spacing */
.react-datepicker__time-list-item {
  position: relative;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Ensure time picker respects reduced motion preferences */
@media (prefers-reduced-motion: reduce) {
  .react-datepicker__time-container *,
  .react-datepicker__time-list-item {
    transition: none !important;
  }
}

/* Mobile responsive adjustments */
@media (max-width: 640px) {
  .react-datepicker__time-container {
    min-width: 80px;
  }
  
  .react-datepicker__time-list-item {
    padding: 6px 10px;
    font-size: 0.875rem;
  }
}