/* Cambiar color de fondo y texto en el encabezado del calendario */
.ui-datepicker-header.ui-widget-header.ui-helper-clearfix.ui-corner-all {
  background-color: #000000 !important;
  /* Fondo rojo */
}
/* Cambiar el color del mes en el encabezado del calendario a blanco */
.ui-datepicker-header .ui-datepicker-month {
  color: white !important;
}
/* Cambiar color de fondo y texto del encabezado del calendario */
.ui-datepicker-header.ui-widget-header.ui-helper-clearfix.ui-corner-all {
  background-color: #282828 !important;
  /* Fondo rojo */
  color: white !important;
  /* Texto en blanco */
}
/* Cambiar color del mes y año en blanco */
.ui-datepicker-header .ui-datepicker-month,
.ui-datepicker-header .ui-datepicker-year {
  color: white !important;
}
/* Cambiar color de las flechas de navegación a blanco y quitar icono de fondo */
.ui-datepicker-header .ui-datepicker-prev,
.ui-datepicker-header .ui-datepicker-next {
  color: #ffffff !important;
  background: none !important;
  /* Eliminar fondo de icono predeterminado */
}
/* Cambiar color de los íconos de flechas */
.ui-datepicker-prev::before,
.ui-datepicker-next::before {
  color: white !important;
}
/* Cambiar color de las flechas de navegación a blanco */
.ui-datepicker-prev,
.ui-datepicker-next {
  color: white !important;
}
/* Cambiar color de los íconos de flechas a blanco */
.ui-datepicker-prev::before,
.ui-datepicker-next::before {
  color: white !important;
}
/* Cambiar el fondo de las celdas con scope="col" a negro */
th[scope="col"] {
  background-color: black !important;
  /* Fondo negro */
  color: white !important;
  /* Color del texto en blanco para mayor contraste */
}
/* Cambiar el fondo de las unidades de día a negro al pasar el cursor */
.ui-datepicker td.ui-state-default:hover {
  background-color: black !important;
  /* Fondo negro al pasar el cursor */
  color: white !important;
  /* Color del texto en blanco para mayor contraste */
}
/* Cambiar el fondo de los días seleccionables a negro al pasar el cursor */
td[data-handler="selectDay"].ui-state-default:hover {
  background-color: black !important;
  /* Fondo negro al pasar el cursor */
  color: white !important;
  /* Color del texto en blanco para mayor contraste */
}
/* Cambiar el fondo de los días a negro al pasar el cursor */
.ui-state-default:hover {
  background-color: black !important;
  /* Fondo negro al pasar el cursor */
  color: white !important;
  /* Color del texto en blanco para mayor contraste */
}
/* Opcional: Cambiar el color de fondo de los días seleccionables cuando no se está pasando el cursor */
.ui-state-default {
  background-color: transparent;
  /* Fondo transparente por defecto */
  color: black;
  /* Color del texto por defecto */
}