/* Gesamter Kalender */
.ui-datepicker {
  background: var(--body-bg);
  color: var(--body-text);
  border: 2px solid var(--headfoot-bg);
  border-radius: 6px;
  box-shadow: 0 0 12px var(--glow-3);
  box-sizing: border-box; 
}

.ui-state {
  background: var(--teaser-bg);
  color: var(--teaser-text);
  border: 10px solid var(--body-bg);
}

.ui-datepicker.ui-widget.ui-helper-clearfix.ui-corner-all {
  background: var(--body-bg);
  border: 1px solid var(--headfoot-bg);
  border-radius: 6px;
}

/* Kopf (Monat/Jahr) */
.ui-datepicker-header.ui-widget-header.ui-helper-clearfix.ui-corner-all {
  background: var(--body-bg);
  color: var(--teaser-text);
  border: 2px solid var(--body-bg);
}

/* Pfeile */
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
  border-radius: 50%;
  border: 1px solid var(--body-text);
}

.ui-datepicker .ui-datepicker-prev:active,
.ui-datepicker .ui-datepicker-next:active {
  background-color: var(--body-bg);
}

@media (hover: hover) {
  .ui-datepicker .ui-datepicker-prev:hover,
  .ui-datepicker .ui-datepicker-next:hover {
    color: var(--body-bg);
    background-color: var(--body-text);
    border-radius: 50%;
    border: 1px solid var(--body-text);
  }
  .ui-datepicker-prev:hover .ui-icon,
  .ui-datepicker-next:hover .ui-icon {
    background-color: var(--body-bg);
  }
}
/* Mobile: Active & Focus zurücksetzen */
.ui-datepicker-prev:active,
.ui-datepicker-next:active,
.ui-datepicker-prev:focus,
.ui-datepicker-next:focus {
    background: var(--body-bg) !important;
    outline: none;
}

.ui-datepicker .ui-icon {
  background: var(--body-text);
  width: 16px;
  height: 16px;
  background-size: contain;
  background-repeat: no-repeat;
}

.ui-datepicker-prev:active .ui-icon,
.ui-datepicker-next:active .ui-icon {
  background-color: var(--body-text);
}

.ui-datepicker-prev .ui-icon {
  mask: url("/assets/images/prev.svg") no-repeat center;
  -webkit-mask: url("/assets/images/prev.svg") no-repeat center;
}

.ui-datepicker-next .ui-icon {
  mask: url("/assets/images/next.svg") no-repeat center;
  -webkit-mask: url("/assets/images/next.svg") no-repeat center;
}

.ui-datepicker-year,
.ui-datepicker-month {
  background: var(--body-bg);
  color: var(--body-text);
  border: 1px solid var(--body-text);
  padding: 3px;
}

/* Wochentage-Zeile insgesamt */
.ui-datepicker thead th {
  padding: 8px 0px;
  line-height: 1;
}

/* Wochentage */
.ui-datepicker th {
  background: var(--body-bg);
  color: var(--body-text);
  font-weight: 600;
}

/* Normale Tage */
.ui-datepicker td a.ui-state-default {
  background: var(--body-bg);
  color: var(--body-text);
  border: 1px solid var(--body-text);
  border-radius: 6px;
}

/* Hover */
.ui-datepicker td a:hover {
  background: var(--body-text);
  color: var(--body-bg);
}

/* Ausgewählter Tag */
.ui-datepicker .ui-state-active {
  background: var(--body-text);
  color: var(--body-bg);
}