@import './global.less';
@import 'iconfont.less';
.k-datepicker {
    display: inline-block;
    position: relative;
    width:200px;
    &:before {
        content: '\e6d9';
        font-family: iconfont;
        display: block;
        position: absolute;
        width: 30px;
        height: 100%;
        top: 0;
        right: 0;
        font-size: 20px;
        line-height: 30px;
        text-align: center;
        color: #7f7f7f;
    }
    .k-datepicker-close {
        display: none;
        position: absolute;
        width: 34px;
        height: 32px;
        top: 1px;
        right: 1px;
        cursor: pointer;

    }
    .k-datepicker-close:before {
        display: block;
        content: "\e849";
        font-family: Ionicons;
        font-size: 15px;
        position: absolute;
        left: -0;
        top: 0;
        text-align: center;
        color: #999;
        width: 100%;
        line-height: 32px;
    }
    .k-datepicker-close:hover:before {
        // background-color: #afafaf;
        color: #555;
    }
    &>.k-datepicker-input {
        color: #666;
        transition: all 200ms ease;
        border: 1px solid #e5e5e5;
        height: 30px;
        box-sizing: border-box;
        outline: none;
        padding: 0 30px 0 12px;
        font-size: 12.5px;
        width: 100%;
        user-select: none;
        -ms-user-select: none;
        -moz-user-select: none;
        -webkit-user-select: none;
    }
    &>.k-datepicker-input.focus {
        border-color: @primary; // box-shadow: 0 0 5px rgba(59, 180, 242, 0.55);
        // -webkit-box-shadow: 0 0 5px rgba(59, 180, 242, 0.55);
        //box-shadow: 0 0 5px fade(@primary, 75%);
    }
    &>.k-datepicker-input:disabled {
        cursor: not-allowed;
        background-color: #eee; // border-color: #999;
        -webkit-box-shadow: none;
        opacity: .8;
        box-shadow: none;
    }
    .k-datepicker-range {
        min-width: 200px
    }
    .k-datepicker-range .k-datepicker-popup {
        width: 415px;
    }
    .k-datepicker-bottom {
        float: left;
        width: 100%;
        text-align: right;
    }
    .k-datepicker-btn {
        padding: 5px 10px;
        background: #1284e7;
        color: #fff;
        border-radius: 2px;
        display: inline-block;
        cursor: pointer;
    }
}

.k-datepicker-popup {
    position: absolute;
    //    transition: all 200ms ease;
    opacity: 1;
    transform: scaleY(1);
    transform-origin: center top;
    font-size: 12px;
    background: #fff;
    border: 1px solid #d9d9d9;
    //border-radius: @radius;
    //box-shadow: 0 1px 6px rgba(99, 99, 99, 0.2);
    outline: 0;
    padding: 5px;
    overflow: hidden;
    z-index: 1001;
}

.k-datepicker-mini {
    line-height: 23px;
    &>.k-datepicker-input {
        height: 25px;
        line-height: 25px;
    }
    .k-datepicker-close {
        width: 25px;
        &:before {
            font-size: 12px;
            height: 23px;
            line-height: 23px;
        }
    }
    &::before {
        height: 25px;
        line-height: 25px;
        width: 25px;
        font-size: 16px;
    }
}

.k-datepicker-clearable:hover:before {
    display: none;
}

.k-datepicker-clearable:hover .k-datepicker-close {
    display: block;
}