@import (reference) "./variable.less";

.ant-calendar-wrapper {
    position: fixed;
    bottom: 0;
    width: 100%;
    z-index: 99;
    background-color: #fff;
    border-radius: 16 * @rpx 16 * @rpx 0 0;
    display: flex;
    flex-direction: column;

    .ant-calendar-default-title-no-border-radius {
        border-radius: 0 !important;
    }

    .ant-calendar-default-title {
        position: relative;
        height: 98 * @rpx;
        line-height: 98 * @rpx;
        background-color: #fff;
        text-align: center;
        font-family: PingFangSC-Medium;
        font-size: 36 * @rpx;
        color: #333333;
        text-align: center;
        position: relative;
        border-bottom: 1px solid #eee;
        border-radius: 16 * @rpx 16 * @rpx 0 0;

        .ant-calendar-default-title-close {
            width: 24 * @rpx;
            height: 24 * @rpx;
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            right: 24 * @rpx;
        }
    }

    .ant-calendar-days {
        position: relative;
        height: 88 * @rpx;
        box-sizing: border-box;
        padding: 24 * @rpx 16 * @rpx;
        display: flex;
        background-color: #fff;
        z-index: 1;

        .ant-calendar-day {
            flex: 1;
            font-family: PingFangSC-Regular;
            font-size: 28 * @rpx;
            color: #333333;
            display: flex;
            align-items: center;
            justify-content: center;
        }
    }

    .ant-subcalendar-wrapper {
        // height: 60vh;
        flex: 1;
        box-sizing: border-box;
        position: relative;
        overflow: hidden;
    }

    .ant-subcalendar {
        -webkit-overflow-scrolling: auto;
        overflow-y: auto;
        // height: 60vh;
        height: 100%;
        box-sizing: border-box;

        .ant-calendar-subtitle-wrapper {
            height: 82 * @rpx;
            overflow: hidden;
        }
    
        .ant-calendar-subtitle {
            width: 100%;
            background: rgba(248,248,248,1);
            height: 82 * @rpx;
            box-sizing: border-box;
            padding-left: 40 * @rpx;
            display: flex;
            align-items: center;
            font-family: PingFangSC-Medium;
            font-size: 36 * @rpx;
            color: #333333;
            text-align: center;
            z-index: 1;
        }
    
        .ant-calendar-dates {
            display: flex;
            flex-direction: column;
            padding: 8 * @rpx 16 * @rpx 0 16 * @rpx;
    
            .ant-calendar-week {
                display: flex;
                flex-direction: row;
                // padding: 16 * @rpx;
                margin-bottom: 8 * @rpx;
    
                .ant-calendar-date-wrap {
                    position: relative;
                    text-align: center;
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                    justify-content: center;
                    height: 110 * @rpx;
                    width: 94 * @rpx;
                    flex: 1;
                }
            }
        }
    }

    .ant-calendar-button-wrapper {
        font-family: PingFangSC-Regular;
        font-size: 36 * @rpx;
        color: #FFFFFF;
        width: 100%;
        padding: 24 * @rpx;
        box-sizing: border-box;
        height: 214 * @rpx;
        display: flex;
        justify-content: space-around;
        border-top: 2 * @rpx solid #E5E5E5;
    }

    .ant-calendar-botton-inner-check,.ant-calendar-botton-inner-cancel {
        height: 98 * @rpx;
        background-color: #1677FF;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 4 * @rpx;
        flex: 1;
    }

    .ant-calendar-botton-inner-cancel {
        margin-right: 24 * @rpx;
    }

    .ant-calendar-button-range-wrapper {

        .ant-calendar-botton-inner-check {
            width: calc((100% - 48 * @rpx) / 2);
            margin: 0;
            margin-top: 24 * @rpx;
        }

        .ant-calendar-botton-inner-cancel {
            width: calc((100% - 48 * @rpx) / 2);
            border: 2 * @rpx solid #E5E5E5;
            color: #333333;
            height: 98 * @rpx;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 4 * @rpx;
            margin-top: 24 * @rpx;
        }
    }
}

.ant-calendar-title-fixed {
    position: absolute;
    top: -1 * @rpx;
}

.ant-calendar-botton-disabled {
    opacity: 0.4;
}