<VxCalendar
                                        mode="multiple"
                                        defaultMonth={new Date( 2024, 5, 10 )}
                                        hidden={[
                                             new Date( 2024, 5, 10 ),
                                             new Date( 2024, 5, 12 ),
                                             new Date( 2024, 5, 20 ),
                                        ]}
                                        min={2}
                                        footer={{ text: "Example title", showDate: true }}
                                   />

                                    <VxCalendar
                                        mode="single"
                                        footer={{ text: "Example title", showDate: true }}
                                        modifiersStyles={{}}
                                        modifiersClassNames={{
                                             selected: 'my-selected',
                                             today: 'my-today',
                                             head: 'custom-head'
                                        }}
                                        id="my-calendar"
                                        css={"
                                             #my-calendar .rdp-caption{
                                                  flex-direction:row-reverse;
                                             }
                                             #my-calendar .rdp-month{
                                                       background-color:#2E2F3A;
                                                       padding:10px;
                                                       border-radius:10px;
                                                       color:#fff;
                                                  }
                                                  #my-calendar .rdp-head_row { 
                                                       color: #fff; 
                                                  }
                                                  #my-calendar .rdp-day{
                                                       color:#77787E;
                                                  }
                                                  #my-calendar .my-selected:not([disabled]) { 
                                                       font-weight: bold; 
                                                       border-radius:9px;
                                                       background-color:#B08FF3;
                                                       color:#fff;
                                                       transition:all .2s ease-in-out;
                                                  }
                                                  #my-calendar .my-selected:hover:not([disabled]) { 
                                                       background-color:#DFD2FA;
                                                       color: #B08FF3;
                                                  }
                                                  #my-calendar .rdp-button:hover:not([disabled]):not(.rdp-day_selected){
                                                       background-color:#DFD2FA;
                                                       color:#fff;
                                                       transition:all .2s ease-in-out;
                                                       border-radius:9px;
                                                  }
                                                  #my-calendar .my-today { 
                                                       font-weight: bold;
                                                       font-size: 140%; 
                                                       color: #B08FF3;
                                                  }
                                                  #my-calendar .rdp-tfoot td{
                                                       padding:10px;
                                                       border-radius:9px;
                                                       width:fit-content;
                                                       background-color:#B08FF3;
                                                       color: #fff;
                                                       text-align:center;
                                                  }
                                                  "}
                                             />