/* Ajusta Flatpickr (selector de fecha/hora moderno) a los mismos tokens
   de color del tema (--task-*), para que se vea igual en claro y oscuro
   sin necesitar un tema de Flatpickr aparte--ago-26 */
.flatpickr-calendar{
  background:var(--task-surface);
  box-shadow:var(--task-shadow);
  border:1px solid var(--task-border);
  border-radius:12px;
  color:var(--task-text);
}
.flatpickr-calendar.arrowTop:before,
.flatpickr-calendar.arrowTop:after{border-bottom-color:var(--task-border);}
.flatpickr-calendar.arrowBottom:before,
.flatpickr-calendar.arrowBottom:after{border-top-color:var(--task-border);}
.flatpickr-months .flatpickr-month{
  background:var(--task-primary);
  color:var(--task-ink-text);
  fill:var(--task-ink-text);
  border-radius:12px 12px 0 0;
}
.flatpickr-current-month{color:inherit;}
.flatpickr-current-month .flatpickr-monthDropdown-months{
  color:inherit;
  /* El select reserva ancho para el nombre de mes mas largo en espanol
     ("Septiembre"), asi que un mes corto como "Agosto" queda pegado a la
     izquierda de esa caja en vez de centrado; text-align-last centra el
     texto de la opcion seleccionada dentro de la caja cerrada--ago-26 */
  text-align:center;
  text-align-last:center;
}
.flatpickr-current-month .flatpickr-monthDropdown-months option{color:var(--task-text);background:var(--task-surface);}
/* El reset global de "select, input[type=number] { min-height:44px;
   border; background; border-radius }" (pensado para que los campos de
   los formularios sean faciles de tocar) se filtra hasta aca y hace que
   el select de mes y el input de anio midan mas que la barra morada de
   34px que los contiene -que recorta el sobrante (overflow:hidden)-,
   dejando el texto pegado al borde inferior visible en vez de centrado.
   Se regresan a como los pinta Flatpickr por su cuenta (compactos, sin
   fondo ni borde propio)--ago-26 */
.flatpickr-current-month .flatpickr-monthDropdown-months,
.flatpickr-current-month input.cur-year{
  color:inherit;
  min-height:auto;
  height:auto;
  border:0;
  background:transparent;
  border-radius:0;
}
.flatpickr-months .flatpickr-prev-month,
.flatpickr-months .flatpickr-next-month{color:var(--task-ink-text);fill:var(--task-ink-text);}
.flatpickr-months .flatpickr-prev-month:hover,
.flatpickr-months .flatpickr-next-month:hover{color:var(--task-surface-soft);}
.flatpickr-months .flatpickr-prev-month:hover svg,
.flatpickr-months .flatpickr-next-month:hover svg{fill:var(--task-surface-soft);}
span.flatpickr-weekday{background:var(--task-surface-soft);color:var(--task-muted);}
.flatpickr-day{color:var(--task-text);}
.flatpickr-day.prevMonthDay,
.flatpickr-day.nextMonthDay{color:var(--task-muted);opacity:0.55;}
.flatpickr-day.today{border-color:var(--task-primary);}
.flatpickr-day.today:hover,
.flatpickr-day.today:focus{border-color:var(--task-primary);background:var(--task-primary);color:var(--task-ink-text);}
.flatpickr-day:hover,
.flatpickr-day:focus{background:var(--task-surface-soft);border-color:var(--task-surface-soft);}
.flatpickr-day.selected,
.flatpickr-day.selected:hover,
.flatpickr-day.selected:focus{
  background:var(--task-primary);
  border-color:var(--task-primary);
  color:var(--task-ink-text);
}
.flatpickr-time{border-top:1px solid var(--task-border);}
.flatpickr-time input,
.flatpickr-time .flatpickr-am-pm{color:var(--task-text);background:transparent;}
.flatpickr-time input:hover,
.flatpickr-time .flatpickr-am-pm:hover{background:var(--task-surface-soft);}
.numInputWrapper span.arrowUp:after{border-bottom-color:var(--task-text);}
.numInputWrapper span.arrowDown:after{border-top-color:var(--task-text);}