calendar.css

.DayPicker {
  background: #28262e;
  border-radius: 10px;
}

.DayPicker-wrapper {
  padding-bottom: 0;
}

.DayPicker,
.DayPicker-Month {
  width: 100%;
}

.DayPicker-Month {
  border-collapse: separate;
  border-spacing: 8px;
  margin: 16px;
}

.DayPicker-Day {
  width: 40px;
  height: 40px;
}

.DayPicker-Day--available:not(.DayPicker-Day--outside) {
  background: #3e3b47;
  border-radius: 10px;
  color: #fff;
}

.DayPicker:not(.DayPicker--interactionDisabled)
  .DayPicker-Day:not(.DayPicker-Day--disabled):not(.DayPicker-Day--selected):not(.DayPicker-Day--outside):hover {
  background: ${shade(0.2, '#3e3b47')};
}

.DayPicker-Day--today {
  font-weight: normal;
}

.DayPicker-Day--disabled {
  color: #666360 !important;
  background: transparent !important;
}

.DayPicker-Day--selected {
  background: #ff9000 !important;
  border-radius: 10px;
  color: #232129 !important;
}

Ficou muito bom galera! Ficaram top as alterações

Muito legal pessoal, parabéns pelo trampo

1. Cor do dia de hoje: O dia de hoje é destacado com a cor #ff9000 no texto do número do dia.
2. Dia desabilitado e dia de hoje desabilitado: Para o dia de hoje, quando ele estiver desabilitado, a cor do número do dia será laranja e o fundo ficará transparente.
3. Seleção de dia: Quando um dia for selecionado, a cor de fundo será definida pela variável --rdp-accent-color, e o texto será alterado para uma cor mais escura (#232129).
4. Estilo para os dias desabilitados: Para os outros dias desabilitados, a cor do texto será cinza (#a0a0a0) e o fundo será transparente.
5. Outros ajustes de estilo: Configuração da altura e largura dos dias, borda arredondada dos botões, cores de fundo, e estilo dos ícones de navegação (setas).

.rdp-root {
  --rdp-accent-color: #ff9000 !important;
  --rdp-today-color: #ff9000 !important;
  --rdp-day-height: 40px;
  --rdp-day-width: 40px;
  --rdp-day_button-border-radius: 10px;
  --rdp-day_button-width: 45px;

  .rdp-day_button {
    background: #3e3b47;
    padding: 0;
    margin: 4px;
    cursor: pointer;
    font: inherit;
    color: inherit;
    justify-content: center;
    align-items: center;
    display: flex;
  }

  .rdp-today {
    color: var(--rdp-today-color) !important;
  }

  .rdp-disabled.rdp-today .rdp-day_button {
    color: var(--rdp-today-color) !important;
    background: transparent !important;
  }

  .rdp-selected .rdp-day_button {
    background: var(--rdp-accent-color);
    color: #232129 !important;
    border: none;
    border-radius: 10px;
  }

  .rdp-disabled .rdp-day_button {
    color: #a0a0a0 !important;
    background: transparent !important;
  }

  .rdp-month {
    background: #28262e;
    padding: 24px;
  }

  .rdp-nav {
    inset-block-start: 24px;
    inset-inline-end: 0;
  }

  .rdp-chevron {
    fill: #f0f0ff;
  }
}