.jalali-date-field {
  padding-left: 2.8rem !important;
  background-image:
    linear-gradient(transparent, transparent),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23617370' stroke-width='1.8'%3E%3Crect x='3' y='5' width='18' height='16' rx='3'/%3E%3Cpath d='M16 3v4M8 3v4M3 10h18'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: 0.8rem center;
}

.jalali-calendar {
  position: fixed;
  z-index: 10000;
  direction: rtl;
  padding: 0.8rem;
  color: #193d3a;
  border: 1px solid rgba(28, 74, 69, 0.16);
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 22px 60px rgba(20, 53, 50, 0.2);
  font-family: Vazirmatn, Tahoma, sans-serif;
  animation: jalali-in 0.18s ease;
}

.jalali-calendar[hidden] {
  display: none;
}
.jalali-calendar__head,
.jalali-calendar__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}
.jalali-calendar__head {
  padding: 0.25rem 0.2rem 0.8rem;
}
.jalali-calendar__head strong {
  font-size: 0.95rem;
}
.jalali-calendar button {
  border: 0;
  font: inherit;
  cursor: pointer;
}
.jalali-calendar__head button {
  width: 34px;
  height: 34px;
  border-radius: 11px;
  color: #2e7169;
  background: #edf7f5;
  font-size: 1.45rem;
}
.jalali-calendar__week,
.jalali-calendar__days {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 0.18rem;
  text-align: center;
}
.jalali-calendar__week {
  margin-bottom: 0.25rem;
  color: #7b8f8c;
  font-size: 0.72rem;
}
.jalali-calendar__week span {
  padding: 0.35rem 0;
}
.jalali-calendar__days button,
.jalali-calendar__days > span {
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  border-radius: 10px;
}
.jalali-calendar__days button {
  color: #284946;
  background: transparent;
  font-size: 0.82rem;
}
.jalali-calendar__days button:hover {
  color: #1e625b;
  background: #eaf6f3;
}
.jalali-calendar__days button.is-today {
  outline: 1px solid #ff8468;
  outline-offset: -2px;
}
.jalali-calendar__days button.is-selected {
  color: #fff;
  background: #2f7c71;
  box-shadow: 0 6px 14px rgba(47, 124, 113, 0.25);
}
.jalali-calendar__footer {
  margin-top: 0.7rem;
  padding-top: 0.65rem;
  border-top: 1px solid #edf0ef;
}
.jalali-calendar__footer button {
  color: #36766f;
  background: transparent;
  font-size: 0.76rem;
}

@keyframes jalali-in {
  from {
    opacity: 0;
    transform: translateY(-5px) scale(0.98);
  }
}

[data-theme="dark"] .jalali-calendar {
  color: #edf8f5;
  border-color: rgba(255, 255, 255, 0.12);
  background: rgba(23, 39, 40, 0.99);
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.45);
}
[data-theme="dark"] .jalali-calendar__head button {
  color: #bce5dd;
  background: #253f3f;
}
[data-theme="dark"] .jalali-calendar__days button {
  color: #e6f3f0;
}
[data-theme="dark"] .jalali-calendar__days button:hover {
  background: #294846;
}
[data-theme="dark"] .jalali-calendar__footer {
  border-color: rgba(255, 255, 255, 0.09);
}