.flatpickr-input {
cursor: pointer;
z-index: 1
}
.flatpickr-mobileInput {
opacity: 0;
visibility: hidden;
position: absolute;
width: 0;
height: 0;
box-sizing: border-box;
padding: 0
}
.flatpickr-calendar {
background: #fff;
display: none;
text-align: center;
padding: 0;
border: 1px solid #e6e6e6;
font-size: 90%;
border-radius: 3px;
position: absolute;
min-width: 200px
}
.flatpickr-calendar.open {
opacity: 1;
z-index: 99999;
display: inline-block
}
.flatpickr-calendar.inline {
max-width: 19rem;
display: table;
margin-top: 2px;
position: relative
}
.flatpickr-calendar:after,
.flatpickr-calendar:before {
position: absolute;
display: block;
pointer-events: none;
border: solid transparent;
content: '';
height: 0;
width: 0;
left: 22px
}
.flatpickr-month,
.flatpickr-next-month i,
.flatpickr-prev-month i {
position: relative
}
.flatpickr-calendar:before {
border-width: 5px;
margin: 0 -5px
}
.flatpickr-calendar:after {
border-width: 4px;
margin: 0 -4px
}
.flatpickr-calendar.arrowTop:after,
.flatpickr-calendar.arrowTop:before {
bottom: 100%
}
.flatpickr-calendar.arrowTop:before {
border-bottom-color: #e6e6e6
}
.flatpickr-calendar.arrowTop:after {
border-bottom-color: #fff
}
.flatpickr-calendar.arrowBottom:after,
.flatpickr-calendar.arrowBottom:before {
top: 100%
}
.flatpickr-calendar.arrowBottom:before {
border-top-color: #e6e6e6
}
.flatpickr-calendar.arrowBottom:after {
border-top-color: #fff
}
.flatpickr-month {
background: 0 0;
color: rgba(0, 0, 0, .9);
fill: rgba(0, 0, 0, .9);
padding: 4px 0 0;
text-align: center
}
.flatpickr-next-month,
.flatpickr-prev-month {
text-decoration: none;
cursor: pointer
}
.flatpickr-next-month svg,
.flatpickr-prev-month svg {
width: 14px;
position: absolute;
top: 9px
}
.flatpickr-next-month svg path,
.flatpickr-prev-month svg path {
fill: inherit
}
.flatpickr-next-month svg:hover,
.flatpickr-prev-month svg:hover {
fill: #f99595
}
.flatpickr-next-month:hover,
.flatpickr-prev-month:hover {
color: #f99595
}
.flatpickr-prev-month svg {
left: 5px
}
.flatpickr-next-month svg {
right: 5px
}
.flatpickr-current-month {
font-size: 135%;
font-weight: 300;
color: inherit;
position: relative;
display: inline-block
}
.flatpickr-current-month .cur_month {
font-weight: 700;
color: inherit
}
.flatpickr-current-month .cur_year {
background: 0 0;
box-sizing: border-box;
color: inherit;
cursor: default;
padding: 0;
margin: 0;
width: 3.2em;
display: inline;
font-size: inherit;
font-weight: 300;
line-height: inherit;
height: initial;
border: 0
}
.flatpickr-current-month .cur_year:hover {
background: rgba(0, 0, 0, .05)
}
.flatpickr-weekdays {
background: 0 0;
text-align: center;
overflow: hidden
}
.flatpickr-days {
padding-top: 1px;
outline: 0
}
.flatpickr-day {
background: 0 0;
border: 1px solid transparent;
border-radius: 150px;
box-sizing: border-box;
color: #393939;
cursor: pointer;
display: inline-block;
font-weight: 300;
width: 35px;
height: 35px;
line-height: 35px;
margin: 0;
text-align: center
}
.flatpickr-day.nextMonthDay:focus,
.flatpickr-day.nextMonthDay:hover,
.flatpickr-day.prevMonthDay:focus,
.flatpickr-day.prevMonthDay:hover,
.flatpickr-day:focus,
.flatpickr-day:hover {
cursor: pointer;
outline: 0;
background: #e6e6e6;
border-color: #e6e6e6
}
.flatpickr-day.today {
border-color: #f99595
}
.flatpickr-day.today:focus,
.flatpickr-day.today:hover {
border-color: #f99595;
background: #f99595;
color: #fff
}
.flatpickr-day.selected,
.flatpickr-day.selected:focus,
.flatpickr-day.selected:hover {
background: #446cb3;
color: #fff;
border-color: #446cb3
}
.flatpickr-day.disabled,
.flatpickr-day.disabled:hover,
.flatpickr-day.nextMonthDay,
.flatpickr-day.prevMonthDay {
color: rgba(57, 57, 57, .3);
background: 0 0;
border-color: transparent;
cursor: default
}
span.flatpickr-weekday {
cursor: default;
font-size: 90%;
color: rgba(0, 0, 0, .54);
height: 24px;
line-height: 24px;
margin: 0;
background: 0 0;
text-align: center;
display: block;
float: left;
width: 14.28%;
font-weight: 700
}
.flatpickr-weekwrapper {
display: inline-block;
float: left
}
.flatpickr-weekwrapper .flatpickr-weeks {
padding: 0 .25rem;
border-right: 1px solid #e6e6e6
}
.flatpickr-weekwrapper .flatpickr-weekday {
float: none;
width: 100%
}
.flatpickr-weekwrapper span.flatpickr-day {
display: block;
width: 100%
}
.flatpickr-rContainer {
display: inline-block;
max-width: 249px
}
.flatpickr-time {
overflow: auto;
text-align: center;
border-top: 0;
outline: 0;
display: block;
display: flex
}
.flatpickr-am-pm,
.flatpickr-time input,
.flatpickr-time-separator {
height: 38px;
display: inline-block;
line-height: 38px;
color: #393939
}
.flatpickr{
width: 100%;
margin: 8px 0;
padding: 8px 6px;
font-size: 14px;
border: 0px;
}
.flatpickr-time input {
background: 0 0;
box-shadow: none;
border: 0;
border-radius: 0;
flex: 1;
width: 33%;
min-width: 33%;
text-align: center;
margin: 0;
padding: 0;
cursor: pointer;
font-weight: 700
}
.flatpickr-am-pm:focus,
.flatpickr-am-pm:hover,
.flatpickr-time input:focus,
.flatpickr-time input:hover {
background: #f0f0f0
}
.flatpickr-time input.flatpickr-minute {
width: 26%;
font-weight: 300
}
.flatpickr-time input.flatpickr-second {
font-weight: 300
}
.flatpickr-time input:focus {
outline: 0;
border: 0
}
.flatpickr-time.has-seconds input[type=number] {
width: 25%;
min-width: 25%
}
.hasTime .flatpickr-days,
.hasWeeks .flatpickr-days {
border-bottom: 0;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0
}
.hasWeeks .flatpickr-days {
border-left: 0
}
.flatpickr-rContainer+.flatpickr-time {
border-top: 1px solid #e6e6e6
}
.flatpickr-am-pm {
outline: 0;
width: 21%;
padding: 0 2%;
cursor: pointer;
text-align: left;
font-weight: 300
}
@media all and (-ms-high-contrast: none) {
.flatpickr-month {
padding: 0
}
}