.jalali-date-input {
  direction: ltr;
  text-align: right;
  font-variant-numeric: tabular-nums;
  cursor: pointer;
}

.jalali-date-input::placeholder {
  direction: rtl;
  text-align: right;
}

.jalali-date-input:disabled {
  cursor: not-allowed;
}

.jalali-date-input[data-jalali-readonly="true"] {
  cursor: default;
}

jdp-container {
  --jdp-primary: #2563eb;
  direction: rtl;
  font-family: inherit;
  color: var(--jdp-color-5);
  color-scheme: light;
  z-index: 10050;
}

jdp-container .jdp-day,
jdp-container .jdp-day-name,
jdp-container select,
jdp-container input {
  font-variant-numeric: tabular-nums;
}

jdp-container select,
jdp-container input {
  color: var(--jdp-color-5);
}

jdp-container select {
  color-scheme: inherit;
}

jdp-container select option {
  color: var(--jdp-color-5);
  background-color: var(--jdp-color-0);
}

jdp-container .jdp-time-container,
jdp-container .jdp-time,
jdp-container .jdp-time select {
  color: var(--jdp-color-5);
}

html[data-theme="dark"] jdp-container {
  --jdp-color-0: #0f1f33;
  --jdp-color-1: #162b45;
  --jdp-color-2: #25415f;
  --jdp-color-3: #4d6b8b;
  --jdp-color-4: #9db2c8;
  --jdp-color-5: #f5f9ff;
  color-scheme: dark;
}

@media (prefers-color-scheme: dark) {
  html:not([data-theme="light"]) jdp-container {
    --jdp-color-0: #0f1f33;
    --jdp-color-1: #162b45;
    --jdp-color-2: #25415f;
    --jdp-color-3: #4d6b8b;
    --jdp-color-4: #9db2c8;
    --jdp-color-5: #f5f9ff;
    color-scheme: dark;
  }
}

@media only screen and (max-width: 481px) {
  jdp-container {
    max-height: min(86vh, 620px);
    overflow-y: auto;
    padding-bottom: max(0.75rem, env(safe-area-inset-bottom));
  }
}
