﻿
.ui-datepicker {
    width: 17em;
    display: none;
    border-radius: 6px;
    font-size: 18px;
    padding: 10px;
    background-color: #d7f2e2;
    border: 1px solid green;
    background-color: white;
}

    .ui-datepicker .ui-datepicker-header {
        position: relative;
        padding: .2em 0;
        border-bottom: 1px green solid;
    }

    .ui-datepicker .ui-datepicker-prev,
    .ui-datepicker .ui-datepicker-next {
        position: absolute;
        top: 2px;
        border: 1px green solid;
        background-color: white !important;
        height: 26px;
        width: 26px;
    }

    .ui-datepicker .ui-datepicker-prev-hover,
    .ui-datepicker .ui-datepicker-next-hover {
        top:3px;
        background-color:#e6a2fc !important;
    }
    .ui-datepicker .ui-datepicker-prev {
        left: 2px;
        background-image: url('../Images/Icons/arrow-left-24.svg');
        background-repeat:no-repeat;
    }

    .ui-datepicker .ui-datepicker-next {
        right: 2px;
        background-image: url('../Images/Icons/arrow-right-24.svg');
        background-repeat: no-repeat;
    }

    .ui-datepicker .ui-datepicker-prev-hover {
        left: 2px;
    }

    .ui-datepicker .ui-datepicker-next-hover {
        right: 2px;
    }

    .ui-datepicker .ui-datepicker-prev span,
    .ui-datepicker .ui-datepicker-next span {
        display: block;
        position: absolute;
        left: 50%;
        margin-left: -8px;
        top: 50%;
        margin-top: -8px;
    }

    .ui-datepicker .ui-datepicker-title {
        margin: 0 2.3em;
        line-height: 1.8em;
        text-align: center;
        color: red;
    }
        .ui-datepicker .ui-datepicker-title select {
            font-size: 1em;
            margin: 1px 0;
        }

    .ui-datepicker select.ui-datepicker-month,
    .ui-datepicker select.ui-datepicker-year {
        width: 45%;
    }

    .ui-datepicker table {
        width: 100%;
        font-size: .9em;
        border-collapse: collapse;
        margin: 0 0 .4em;
    }

    .ui-datepicker th {
        padding: .7em .3em;
        text-align: center;
        font-weight: bold;
        border: 0 black solid;
    }

    .ui-datepicker td {
        border: 1px #cacaca solid;
        padding: 1px;
    }

        .ui-datepicker td span,
        .ui-datepicker td a {
            display: block;
            padding: .2em;
            text-align: right;
            text-decoration: none;
        }
            .ui-datepicker td a:hover {
                background-color: #d76bfa !important;
                color: white;
            }

    .ui-datepicker .ui-datepicker-buttonpane {
        background-image: none;
        margin: .7em 0 0 0;
        padding: 0 .2em;
        border-left: 0;
        border-right: 0;
        border-bottom: 0;
    }

        .ui-datepicker .ui-datepicker-buttonpane button {
            float: right;
            margin: .5em .2em .4em;
            cursor: pointer;
            padding: .2em .6em .3em .6em;
            width: auto;
            overflow: visible;
        }

            .ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
                float: left;
            }



    /* Icons */
    .ui-datepicker .ui-icon {
        display: block;
        text-indent: -99999px;
        overflow: hidden;
        background-repeat: no-repeat;
        left: .5em;
        top: .3em;
    }


    /* PATCH TO FIX ACTIVE COLOR (CURRENT DATE) */

.ui-datepicker-calendar .ui-state-active {
    color: #e91e62;
    color: white;
    border: 0px solid #19c632;
    background-color: #9a53e1 !important;
    font-size:1em;
}