jdp-container {
position: absolute;
max-width: 307.875px;
background: #fff;
display: block;
direction: rtl;
padding: .5rem 0;
box-shadow: 0 1px 6px rgba(0, 0, 0, .12), 0 1px 4px rgba(0, 0, 0, .24);
border-radius: 4px;
overflow: hidden;
-ms-touch-action: manipulation;
touch-action: manipulation;
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
user-select: none;
-moz-animation: jdpOpenAnimation .3s cubic-bezier(.23, 1, .32, 1);
-webkit-animation: jdpOpenAnimation .3s cubic-bezier(.23, 1, .32, 1);
animation: jdpOpenAnimation .3s cubic-bezier(.23, 1, .32, 1);
font-family: "iranyekan", sans-serif;
}
jdp-container, jdp-container *, jdp-container :after, jdp-container :before {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box
}
jdp-container .jdp-icon-minus, jdp-container .jdp-icon-plus {
display: inline-block;
text-align: center;
cursor: pointer;
vertical-align: middle;
overflow: hidden;
flex: none;
text-decoration: none;
border: 1px solid #e6e6e6;
border-radius: 4px
}
jdp-container .jdp-icon-minus svg, jdp-container .jdp-icon-plus svg {
width: 1.5rem;
height: 1.5rem;
padding: .375rem
}
jdp-container .jdp-icon-minus.not-in-range, jdp-container .jdp-icon-plus.not-in-range {
cursor: not-allowed
}
jdp-container .jdp-icon-minus.not-in-range svg, jdp-container .jdp-icon-plus.not-in-range svg {
opacity: .3
}
jdp-container .jdp-months, jdp-container .jdp-years {
display: -webkit-inline-box;
display: -webkit-flex;
display: -ms-inline-flexbox;
display: inline-flex;
margin: 0 2.5%;
font-size: 120%;
color: rgba(0, 0, 0, .8);
fill: rgba(0, 0, 0, .8)
}
jdp-container .jdp-months {
width: 55%
}
jdp-container .jdp-years {
width: 35%
}
jdp-container .jdp-month, jdp-container .jdp-month input, jdp-container .jdp-month select, jdp-container .jdp-year, jdp-container .jdp-year input, jdp-container .jdp-year select {
width: 100%;
height: auto;
text-align: center;
background: transparent;
border: none;
border-radius: 0;
padding: 0;
margin: 0;
display: inline-block;
font-size: inherit;
font-family: inherit;
vertical-align: initial;
font-weight: 300;
color: inherit;
line-height: inherit;
outline: none
}
jdp-container .jdp-month:active, jdp-container .jdp-month:focus, jdp-container .jdp-month input:active, jdp-container .jdp-month input:focus, jdp-container .jdp-month select:active, jdp-container .jdp-month select:focus, jdp-container .jdp-year:active, jdp-container .jdp-year:focus, jdp-container .jdp-year input:active, jdp-container .jdp-year input:focus, jdp-container .jdp-year select:active, jdp-container .jdp-year select:focus {
outline: none
}
jdp-container .jdp-month:hover, jdp-container .jdp-month input:hover, jdp-container .jdp-month select:hover, jdp-container .jdp-year:hover, jdp-container .jdp-year input:hover, jdp-container .jdp-year select:hover {
background: rgba(0, 0, 0, .05)
}
jdp-container .jdp-month input, jdp-container .jdp-year input {
cursor: text;
-webkit-appearance: none;
-moz-appearance: textfield
}
jdp-container .jdp-month input::-webkit-inner-spin-button, jdp-container .jdp-month input::-webkit-outer-spin-button, jdp-container .jdp-year input::-webkit-inner-spin-button, jdp-container .jdp-year input::-webkit-outer-spin-button {
-webkit-appearance: none
}
jdp-container .jdp-month select, jdp-container .jdp-year select {
cursor: pointer;
position: relative;
-webkit-appearance: menulist;
-moz-appearance: menulist
}
jdp-container .jdp-days {
padding: .5rem 0 0;
outline: 0;
text-align: left;
width: 100%;
display: inline-block;
display: -ms-flexbox;
display: flex;
flex-wrap: wrap;
-ms-flex-wrap: wrap;
-ms-flex-pack: justify;
justify-content: space-around
}
jdp-container .jdp-day, jdp-container .jdp-day-name {
background: none;
border: 1px solid transparent;
font-weight: 400;
width: 14.2857143%;
flex-basis: 14.2857143%;
height: 31px;
line-height: 31px;
margin: 2px 0;
display: inline-block;
position: relative;
justify-content: center;
text-align: center;
color: rgba(0, 0, 0, .8)
}
jdp-container .jdp-day-name.today, jdp-container .jdp-day.today {
border-color: rgba(0, 0, 0, .3)
}
jdp-container .jdp-day-name.selected, jdp-container .jdp-day.selected {
background-color: #569ff7 !important;
color: #fff !important
}
jdp-container .jdp-day-name.last-week, jdp-container .jdp-day.last-week {
color: #f44336
}
jdp-container .jdp-day:empty {
background: rgba(0, 0, 0, .05);
border-color: #fff
}
jdp-container .jdp-day:not(:empty) {
cursor: pointer;
border-radius: 4px;
transition: .1s linear
}
jdp-container .jdp-day:not(:empty):hover {
background: rgba(0, 0, 0, .1);
transform: scale(1.15);
z-index: 1
}
jdp-container .jdp-day-name {
border-radius: 0;
font-weight: 900;
font-size: 90%;
background-color: rgba(0, 0, 0, .1);
cursor: default
}
jdp-container .jdp-footer {
padding: .5rem .5rem 0;
outline: 0;
width: 100%;
display: inline-block;
display: -ms-flexbox;
display: flex;
flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
-ms-flex-pack: justify;
justify-content: space-between
}
jdp-container .jdp-btn-empty, jdp-container .jdp-btn-today {
background: #569ff7;
font-size: 90%;
padding: .3em .6em;
border-radius: 5px;
font-weight: 400;
display: inline-block;
text-align: center;
color: #fff;
cursor: pointer
}
@-webkit-keyframes jdpOpenAnimation {
0% {
opacity: 0;
transform: scale(.8)
}
to {
opacity: 1;
transform: scale(1)
}
}
@keyframes jdpOpenAnimation {
0% {
opacity: 0;
transform: scale(.8)
}
to {
opacity: 1;
transform: scale(1)
}
}
@media only screen and (max-width: 307.875px) {
jdp-container {
max-width: 90%
}
}