diff --git a/web/assets/css/custom.css b/web/assets/css/custom.css
index 748a2429..2618e910 100644
--- a/web/assets/css/custom.css
+++ b/web/assets/css/custom.css
@@ -984,3 +984,78 @@ li.ant-select-dropdown-menu-item:empty:after {
 .dark .ant-input-number-handler:active {
     background: #0e49b5;
 }
+
+.dark .ant-input-number-handler:hover .ant-input-number-handler-down-inner,.dark .ant-input-number-handler:hover .ant-input-number-handler-up-inner {
+    color: #ffffff;
+}
+
+.dark .ant-input-number-handler-down {
+    border-top: 1px solid rgb(217 217 217 / 30%);
+}
+
+.dark .ant-calendar-year-panel {
+    background: #101828;
+}
+
+.dark .ant-calendar-year-panel-header .ant-calendar-year-panel-century-select,.dark .ant-calendar-year-panel-header .ant-calendar-year-panel-decade-select,.dark .ant-calendar-year-panel-header .ant-calendar-year-panel-month-select,.dark .ant-calendar-year-panel-header .ant-calendar-year-panel-year-select {
+    color: rgb(255 255 255 / 85%);
+}
+
+.dark .ant-calendar-year-panel-header {
+    border-bottom: 1px solid #222d42;
+}
+
+.dark .ant-calendar-year-panel-last-decade-cell .ant-calendar-year-panel-year,.dark .ant-calendar-year-panel-next-decade-cell .ant-calendar-year-panel-year {
+    color: rgb(255 255 255 / 35%);
+}
+
+.dark .ant-calendar-year-panel-year {
+    color: rgb(255 255 255 / 65%);
+}
+
+.dark .ant-calendar-year-panel-year:hover {
+    background: #222d42;
+}
+
+.dark .ant-calendar-header a:hover {
+    color: #ffffff;
+}
+
+.dark .ant-calendar-month-panel-header {
+    background-color: #101828;
+    border-bottom: 1px solid #222d42;
+}
+
+.dark .ant-calendar table {
+    background-color: #101828;
+}
+
+.dark .ant-calendar-month-panel-header .ant-calendar-month-panel-century-select,.dark .ant-calendar-month-panel-header .ant-calendar-month-panel-decade-select,.dark .ant-calendar-month-panel-header .ant-calendar-month-panel-month-select,.dark .ant-calendar-month-panel-header .ant-calendar-month-panel-year-select {
+    color: rgb(255 255 255 / 85%);
+}
+
+.dark .ant-calendar-month-panel-month {
+    color: rgb(255 255 255 / 65%);
+}
+
+.dark .ant-calendar-month-panel-month:hover {
+    background: #222d42;
+}
+
+.dark .ant-calendar-year-panel-selected-cell .ant-calendar-year-panel-year,.dark .ant-calendar-year-panel-selected-cell .ant-calendar-year-panel-year:hover {
+    color: #fff;
+    background: #0e49b5;
+}
+
+.dark .ant-calendar-month-panel-selected-cell .ant-calendar-month-panel-month,.dark .ant-calendar-month-panel-selected-cell .ant-calendar-month-panel-month:hover {
+    color: #fff;
+    background: #0e49b5
+}
+
+.dark .ant-calendar-last-month-cell .ant-calendar-date,.dark .ant-calendar-last-month-cell .ant-calendar-date:hover,.dark .ant-calendar-next-month-btn-day .ant-calendar-date,.dark .ant-calendar-next-month-btn-day .ant-calendar-date:hover {color: rgb(255 255 255 / 25%); background: transparent; border-color: transparent;}
+
+.dark .ant-calendar-today .ant-calendar-date:hover {
+    color: #ffffff;
+    border-color: #0e49b5;
+    background-color:#0e49b5;
+}
diff --git a/web/html/login.html b/web/html/login.html
index f4195dff..3828f1f2 100644
--- a/web/html/login.html
+++ b/web/html/login.html
@@ -46,6 +46,7 @@
         background-color: #fff;
         border-radius: 2rem;
         padding: 3rem;
+        transition: all 0.3s;
     }
     #login:hover {
         box-shadow: 0 2px 8px rgba(0,0,0,.09);