html[data-theme="dark"] {
    /* jQuery UI Datepicker Dark Mode */

    .ui-datepicker {
        background: #333;
        /* Dark background */
        color: #eee;
        /* Light text */
        border: 1px solid #555;
        /* Darker border */

        .ui-datepicker-header {
            background: #444;
            /* Slightly lighter header */
            border-bottom: 1px solid #555;
        }

        .ui-datepicker-prev,
        .ui-datepicker-next {
            color: #ccc;
            /* Lighter arrow color */
        }

        .ui-datepicker-prev-hover,
        .ui-datepicker-next-hover {
            color: #fff;
            /* Even lighter arrow hover */
        }

        .ui-datepicker-title {
            color: #eee;

            select {
                background: #555;
                /* Darker select background */
                color: #eee;
                border: 1px solid #777;
            }
        }

        th {
            color: #ccc;
        }

        td {
            border: 1px solid #333;
            /* border for each day */

            a {
                color: #eee;

                &.ui-state-default {
                    /* Normal day */
                    background: #333;
                    color: #eee;
                    border-color: #666;
                }

                &.ui-state-hover {
                    /* Hovered day */
                    background: #555;
                    color: #fff;
                }

                &.ui-state-active {
                    /* Selected day */
                    background: #0078D4;
                    /* Blue active day, change as needed */
                    color: #fff;
                }
            }
        }

        .ui-datepicker-buttonpane {
            background: #444;
            border-top: 1px solid #555;

            button {
                background: #555;
                color: #eee;
                border: 1px solid #777;

                &:hover {
                    background: #777;
                }
            }
        }
    }

    .ui-timepicker-div{
        .ui-widget-header{
            background: #333;
            border-color: #666;
        }        
    }
}