/*=========================================================
    KK DATE
=========================================================*/

.kk-date-wrapper{

    position:relative;

}

/*=========================================================
    INPUT
=========================================================*/

.kk-date-wrapper input{

    width:100%;

    height:62px;

    padding:22px 20px 8px 56px;

    border:1px solid var(--kk-border);

    border-radius:18px;

    background:#fff;

    outline:none;

    font-size:16px;

    font-family:inherit;

    transition:var(--kk-transition);

    cursor:pointer;

}

/*=========================================================
    LABEL
=========================================================*/

.kk-date-wrapper label{

    position:absolute;

    top:20px;

    left:56px;

    background:#fff;

    padding:0 6px;

    pointer-events:none;

    color:var(--kk-text-light);

    transition:.25s;

}

.kk-date-wrapper input:focus{

    border-color:var(--kk-primary);

    box-shadow:

        0 0 0 4px rgba(198,40,40,.08),

        0 8px 24px rgba(198,40,40,.05);

}

.kk-date-wrapper input:focus+label,

.kk-date-wrapper input:not(:placeholder-shown)+label,

.kk-date-wrapper input:valid+label{

    top:-9px;

    left:48px;

    font-size:13px;

    color:var(--kk-primary);

    font-weight:600;

}

/*=========================================================
    ICON
=========================================================*/

.kk-date-wrapper i{

    position:absolute;

    top:50%;

    left:20px;

    transform:translateY(-50%);

    color:var(--kk-text-light);

    transition:.3s;

}

.kk-date-wrapper input:focus~i{

    color:var(--kk-primary);

}

/*=========================================================
    CALENDAR ICON
=========================================================*/

.kk-date-wrapper input::-webkit-calendar-picker-indicator{

    cursor:pointer;

    opacity:.7;

    transition:.3s;

}

.kk-date-wrapper input::-webkit-calendar-picker-indicator:hover{

    opacity:1;

    transform:scale(1.15);

}