/*********************************************
 * Datepicker
**********************************************/
.gfield.gfield--type-date .ginput_container.ginput_complex {gap:10px;}

/* Field icon */
.ginput_container_date {position:relative; display:flex;}
.ginput_container_date:not(.gform-grid-col):before {
    content:"\e933"; font-family:var(--vii-font-icomoon);
    position:absolute; top:50%; right:15px; z-index:1;
    transform:translateY(-50%); pointer-events:none;
    transition:var(--vii-transition);color:var(--vii-color-dark-2);
}
.ginput_container_date:hover:before {color:var(--vii-color-text);}

/* select */
.ginput_container_date .es-dropdown {width:100%;}

/* Datepicker popup */
.gform-theme-datepicker {
    z-index:99999 !important;
    background-color:#fff; border-radius:5px; overflow:hidden;
    border:2px solid var(--vii-color-primary); margin-top:1px;
    box-shadow:0 0 10px 0 rgba(0, 0, 0, .1);
}
.screen-reader-text {display:none;}

/* Header */
.ui-datepicker-header {
    border-radius:5px 5px 0 0; display:flex; justify-content:space-between;
    background:#eee;
}
.ui-datepicker-prev {order:1;}
.ui-datepicker-title {order:2;}
.ui-datepicker-next {order:3;}

/* Header arrows */
.ui-datepicker-prev, .ui-datepicker-next {
    height:30px; display:flex; align-items:center; justify-content:center; padding:3px 5px;
    cursor:pointer; font-size:0; width:35px;
}
.ui-datepicker-prev:before, .ui-datepicker-next:before {
    font-family:var(--vii-font-icomoon); font-size:10px;
}
.ui-datepicker-prev:before {content:"\e92a";}
.ui-datepicker-next:before {content:"\e92b";}

/* Header select */
.ui-datepicker-title select {
    background:#eee; padding:2px 5px; height:30px; cursor:pointer;
    transition:all .3s ease;
}

/* Calendar */
.gform-theme-datepicker .ui-datepicker-calendar {margin-bottom:0; text-align:center;}
.gform-theme-datepicker .ui-datepicker-calendar tr {border-top:1px solid #eee;}
.gform-theme-datepicker .ui-datepicker-calendar th,
.gform-theme-datepicker .ui-datepicker-calendar td {
    width:45px; height:33px; font-size:15px;
    border:none; padding:0; line-height:1;
    display:inline-flex; align-items:center; justify-content:center;
}

/* Disabled */
.ui-state-disabled .ui-state-default {background:transparent; opacity:.3; cursor:not-allowed;}

/* Default */
.ui-state-default {
    width:100%; height:100%;
    display:inline-flex; align-items:center; justify-content:center;
}
.ui-datepicker-title select option,
.ui-datepicker-title select:hover option {background:#fff; color:var(--vii-color-text);}

/* Hover */
.ui-datepicker-title select:hover,
.ui-datepicker-prev:hover, .ui-datepicker-next:hover,
.ui-datepicker-calendar:hover .ui-state-default.ui-state-active:hover,
.ui-state-default.ui-state-active,
.ui-state-default:hover,
.ui-datepicker-title select option:hover,
.ui-datepicker-title select:hover option:hover,
.ui-datepicker-title select option[selected="selected"] {
    background:var(--vii-color-primary); color:var(--vii-color-on-primary);
}

/* Active */
.ui-datepicker-calendar:hover .ui-state-default.ui-state-active {background:#eee; color:var(--vii-color-text);}