.daterangepicker .drp-calendar{
    max-width: unset !important;
}

@media screen and (max-width: 768px) {
    .daterangepicker{
        position: fixed !important;
        left: 0 !important;
        top: unset !important;
        bottom: 0 !important;
        right: 0 !important;
        width: 100% !important;
    }
    .calendar-table{
        width: 100%;
        height: 100%;
    }

    .drp-calendar{
        width: 100%;
        height: 100%;
    }

    .daterangepicker:before{
        left: 0 !important;
        right: 0;
        bottom: 0;
        background: #00000080;
        position: fixed;
        z-index: -1;
    }

    .daterangepicker:after{
        border: none;
        top: unset !important;
    }
}