.dsb_dot_perc {
    white-space: nowrap;
}

@media only screen and (max-width: 2559px) and (min-width: 1840px) {
    .wrapper .carousel {
        grid-auto-columns: calc((100% / 6.5) - 9px);
    }
}

@media only screen and (max-width: 1839px) and (min-width: 1440px) {
    .wrapper .carousel {
        grid-auto-columns: calc((100% / 5.5) - 9px);
    }
}

@media only screen and (max-width:1600px) {
    .dsb_payment_distribution {
        gap: 3rem;
    }
}

@media only screen and (max-width: 1450px) {
    .dsb_chart_img img {
        width: 80%;
    }

    .dsb_payment_distribution {
        gap: 2rem;
    }

    .dsb_dot_perc {
        margin-left: 15px;
    }

    .dsb_cir_chart_list_ul li {
        margin-bottom: 10px;
    }

    .dsb_cir_chart_list {
        gap: 1rem;
    }

    .dsb_cir_chart {
        margin-bottom: 10px;
    }

    .dasboard_cards_numbers {
        gap: 0.5rem;
    }

}

@media screen and (max-width: 1439px) and (min-width: 1260px) {
    .wrapper .carousel {
        grid-auto-columns: calc((100% / 4.5) - 9px);
    }
}




@media only screen and (width: 1024px) and (height: 1292px) {}

@media only screen and (max-width:1399px) {
    .dasboard_cards_inner {
        flex-basis: calc(50% - 10px);
        justify-content: start;
    }

    .subtd-table img.banking-img {
        height: 26px;
        width: auto;
    }
}

@media only screen and (max-width:1350px) {
    .dasboard_cards_inner {
        flex-basis: calc(50% - 15px);
    }
}


@media screen and (max-width: 1259px) and (min-width: 990px) {
    .wrapper .carousel {
        grid-auto-columns: calc((100% / 3.5) - 9px);
    }
}


@media only screen and (max-width: 1250px) {
    .recent_transac_table td {
        padding: 15px 10px 15px 10px;
    }

    .name_filed_td {
        gap: 10px;
    }

    .recent_transac_table .last_td {
        gap: 1rem;
    }

    .recent_transaction_table_overview {
        padding: 20px 10px 16px 10px;
    }

    .name_filed_td .initial {
        width: 30px;
        height: 30px;
    }

    .recent_transac_table thead {
        height: 50px;
    }
}



@media only screen and (max-width: 1200px) {
    .body_content {
        padding: 16px 20px 0px 20px;
    }

    .nav_left_bar {
        width: 57%;
    }

    .main_nav {
        padding: 20px 20px 20px 26px;
        gap: 20px;
    }

    .dsb_payment_distribution {
        margin-top: 2rem;
        padding: 10px
    }

    .dsb_chart_img img {
        width: 80%;
    }

    .dsb_dot_chart {
        width: 10px;
        height: 10px;
        margin-right: 5px;
    }

    .dsb_payments_overview {
        gap: 2rem;
        flex-direction: column;
    }

    .dsb_payments_inner {
        padding: 20px 20px;
    }

    .dsb_payments_inner_alter {
        gap: 3rem;
    }

    .rt_merchants_overview {
        flex-direction: column;
    }

    .sett_cont_sec {
        gap: 3rem;
    }

    .gst_tdr_content_sec {
        flex-direction: column;
    }

    .dsb_cir_chart_list_ul {
        flex-basis: auto;
    }

    .rt_merchants_overview .dsb_cir_chart_list {
        display: flex;
        justify-content: start;
        gap: 2rem;
    }

}


@media only screen and (max-width: 1024px) {
    .dsb_cir_chart_list {
        gap: 4rem;
    }

    .dsb_chart_img img {
        width: 80%;
    }

    .nav_left_bar {
        width: 55%;
    }

    .dsb_btn_load {
        margin-left: 3px;
    }

    .dsb_ch_btn {
        padding: 7px;
    }

    .dsb_payment_distribution {
        gap: 1rem;
    }

    .dsb_dot_perc {
        margin-left: 7px;
    }

    .body_content {
        padding: 16px 15px 0px 15px;
    }

    .dasboard_cards {
        gap: 12px;
    }

    .recent_transac_table td {
        font-size: 11px;
    }

    .recent_transac_table .last_td a {
        font-size: 11px;
    }

    .name_filed_td .initial {
        font-size: 9px;
    }

    .recent_transac_table thead {
        height: 40px;
    }

    .name_filed_td .names_div span {
        font-size: 10px;
    }

    .dasboard_cards_inner {
        flex-basis: calc(50% - 15px);
    }

    .dsb_payment_distribution {
        flex-direction: column;
    }

    .dsb_payment_distribution .dsb_pay_wallet {
        flex: auto;
        height: 222px;
        background-size: cover;
        background-position: center center;
    }

    .dsb_payment_distribution {
        gap: 30px;
    }

    .nav_left_bar_parent {
        flex-direction: column;
    }

    .set_note_bar {
        align-self: flex-end;
    }
}


@media only screen and (max-width:1023px) {
    .dsb_cir_chart_list_ul {
        flex-basis: auto;
    }

    .dsb_dot_perc {
        justify-content: flex-end;
    }

    .gross_transactions_chart img {
        max-width: 760px;
        max-height: 218px;
        object-fit: contain;
    }

    .gross_transactions_chart img {
        max-width: 760px;
        max-height: 218px;
    }
}


@media only screen and (max-width: 1000px) {

    .nav_left_bar {
        width: 50%;
    }

    .dsb_payments_heading {
        gap: 10px;
    }
}

@media only screen and (max-width: 992px) {
    .dsb_chart_img img {
        width: 80%;
    }

    .body_content {
        padding: 16px 10px 0px 10px;
    }

    .dsb_dot_chart {
        width: 8px;
        height: 8px;
    }

    .dsb_cir_chart_list {
        gap: 0.6rem;
    }

    .dsb_payment_distribution_inner .dasboard_cards_numbers {
        flex-direction: column;
        align-items: flex-start;
    }


}

@media screen and (max-width: 989px) and (min-width: 600px) {
    .wrapper .carousel {
        grid-auto-columns: calc((100% / 2.5) - 9px);
    }
}

@media only screen and (max-width: 950px) {
    .recent_transac_table {
        white-space: nowrap;
    }
}

@media only screen and (max-width: 900px) {


    .dsb_dot_perc {
        margin-left: 5px;
    }

    .tgle_check_box_input[type="checkbox"]::after {
        width: 8px;
        height: 8px;
    }

    .tgle_check_box_input[type="checkbox"] {
        width: 15px;
        height: 8px;
    }

    .multi_slider>.thumb {
        width: 24px;
        height: 24px;
    }

    .multi_slider {
        height: 6px;
    }

    .toggle_switch_head {
        gap: 1rem;
    }

    .gross_transactions_overview {
        padding: 18px 10px;
    }
}


@media only screen and (max-width: 850px) {
    .dsb_payments_heading img {
        width: 1rem;
    }

    .toggle_switch_wrap .txt_div {
        font-size: 10px;
    }
}

@media only screen and (max-width: 800px) {

    .dsb_chart_img img {
        width: 80%;
    }

    .dasboard_cards_inner {
        padding: 12px 12px 12px;
        border-radius: 12px;
    }

    .main_nav {
        padding: 16px 16px 16px 16px;
    }

    .nav_left_bar h5.username {
        font-size: 1rem;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
    }


    .section_title_section {
        flex-direction: column;
        gap: 10px;

    }

    .flat_datepicker_wrap {
        margin-bottom: 15px;
    }

}

@media only screen and (max-width: 767px) {


    .dsb_payment_distribution {
        flex-direction: column;
    }

    .dsb_payment_distribution_inner .dsb_cir_chart_list {
        justify-content: space-between;
        gap: 30px;
    }

    .gross_transactions_chart img {
        max-width: 610px;
        max-height: 108px;
    }

    .dasboard_cards_inner.dasboard_cards_inner {
        border-radius: 15px !important;
    }

    .dasboard_cards_payment .dasboard_cards_content {
        padding: 5px 9px !important;
    }

    .rt_select_drp {
        padding: 0.8rem;
    }

    .add_more_data_overview {
        height: 200px;
        margin: 0px 10px;
    }

    .dsb_payments_inner {
        margin: 0px 10px;
    }

    .recent_transaction_table_overview {
        margin: 30px 10px 0px;
    }

    .rt_merchants_overview .inner {
        margin: 0px 10px;
    }

    .inner.merchant_box {
        margin: 0px 10px;
    }

    .gst_tdr_overview {
        margin: 0px 10px;
    }

    .add_more_img {
        height: 40px;
        width: 40px;
    }

    .add_more_img img {
        height: 20px;
        width: 20px;
    }

    .dasboard_cards_inner.dasboard_cards_inner {
        height: 100%;
        flex-basis: calc(100% - 6px);
        /* background-size: 100% 100%; */
        border-radius: 25px;
    }

    #py_entries {
        padding: 8px 30px 8px 8px;
    }

    .dasboard_cards {
        flex-wrap: wrap;
    }

    .dasboard_cards_content_inner {
        margin-bottom: 15px;
        height: max-content;
    }

    .dasboard_cards_content {
        padding: 6px;
    }

    .saerchbr {
        flex-direction: column;
        align-items: self-start;
    }

    .dsb_payment_distribution .dsb_pay_wallet {
        height: 190px;
        padding-bottom: 15px;
    }
        .ticket_fileselct_input::before{
            height: 38px;
        }
}




@media only screen and (max-width:520px) {
    .flat_datepicker_wrap {
        flex-direction: column;
        align-items: flex-end;
    }

    .Export-button {
        gap: 8px;
    }
}


@media screen and (max-width: 600px) and (min-width: 400px) {
    .wrapper .carousel {
        grid-auto-columns: calc((100% / 1.5) - 9px);
    }

    .view-profile1 {
        padding: 0;
    }

    .view-profile {
        padding: 8px 10px;
    }

    .setting-popup-main {
        width: 250px;
    }

    #view-profile-btn {
        padding: 8px 60px;
    }

    .name-img-profile img {
        width: 50px;
        height: 50px;
    }

    .sign-out-btn {
        padding: 0;
    }

    .view-profile1 {
        padding: 15px 0px;
    }
}


@media screen and (max-width: 600px) {
    .wrapper .carousel {
        grid-auto-columns: 100%;
    }
}


@media only screen and (max-width:570px) {

    .notify-box {
        width: 300px;
    }

    .dasboard_cards_inner.dasboard_cards_inner {
        flex-basis: calc(100% - 6px);
    }

    .topnav.topnav {
        gap: 16px;
    }

    .topnav .badge {
        padding: 2px 8px;
    }

    .transaction td {
        padding: 8px 12px;
    }

    .banking-img {
        height: 35px;
        width: 35px;
    }

    .btnstyle2 {
        height: 35px;
        width: 35px;
    }

    #merchant_category_id {
        width: 200px;
        height: 200px;
    }
}


@media screen and (max-width: 500px) {
    .trans-pagination a {
        width: 30px;
        height: 30px;
    }

    #merchant_category_id {
        width: 185px;
        height: 185px;
    }

    @media (max-width: 500px) {
        .refund_download_btn img {
            width: 18px;
            height: 18px;
        }
    }
}

@media screen and (max-width: 479px) {
    .saerchbr {
        flex-direction: column;
        align-items: self-start;
    }

    .input-div .input-serch,
    .input-div {
        width: 100%;
    }

    .refund_title_sec .button_d_flex {
        flex-direction: column;
        margin-right: auto;
    }

    .dsb_cir_chart_list_ul {
        width: 75%;
    }

    .dsb_cir_chart_list {
        gap: 20px;
        flex-direction: column;
    }

    #merchant_category_id {
        width: 250px;
        height: 250px;
    }
}

@media screen and (max-width: 450px) {
    .dsb_payment_distribution .dsb_pay_wallet {
        height: 150px;
    }
}

@media only screen and (max-width:420px) {

    .gross_transactions_chart img {
        max-height: 78px !important;
    }

    .dash_content_hd,
    .dash_content_p,
    .dash_card_num {
        white-space: nowrap;
        overflow: hidden;
        width: auto;
        text-overflow: ellipsis;
    }

    .payments_overview_list_num {
        font-size: 11px;
    }

    .gst_tdr_content_sec .gst_tdr_item {
        padding: 20px 16px;
    }

    .rt_merchants_overview .inner {
        padding: 20px 16px;
    }

    .dsb_payments_inner {
        padding: 20px 16px;
    }

    .dsb_payment_distribution_inner {
        border-radius: 10px;
    }

    .dsb_payment_distribution_inner .dasboard_cards_numbers {
        margin-bottom: 10px;
    }

    .dasboard_cards_inner.dasboard_cards_inner {
        border-radius: 20px;
    }

    .nav_left_bar.nav_left_bar {
        width: 66%;
    }

    .notify-box {
        width: 235px;
        padding: 12px;
        align-items: center;
    }

    .dsb_payment_distribution .dsb_pay_wallet {
        height: 150px;
        padding-bottom: 0;
    }

    .container_payment_create_invoice,
    .py_send_btn .modal-content,
    .py_error_cls_inner,
    .tickets_add_tickets_container,
    .tickets_prew_tickets_container,
    .tc_success_overlay_cls_inner {
        max-width: 95%;
    }

}

@media only screen and (max-width:399px) {
    .setting-popup-main {
        width: 230px;
    }

    #view-profile-btn {
        padding: 5px 25px;
    }

    .sign-out-btn {
        padding: 0;
        font-size: 13px;
    }

        .dropdown-content a img {
            width: 22px;
            height: 22px;
        }
        
    .name-img-profile img {
        width: 40px;
        height: 40px;
    }

    .droplist-section .button-group i {
        font-size: 14px;
    }

    .tc_merchant_content .section_title_section {
        margin-bottom: 20px;
    }

    .main_nav {
        gap: 10px;
    }

    .set_note_bar {
        margin-top: 10px;
    }

    .Export-button i {
        font-size: 14px;
    }

    .main_content {
        padding-bottom: 30px;
    }

    .view-profile {
        padding: 15px 10px;
    }

    .flat_datepicker_input_wrap {
        width: 230px;
    }
}

@media only screen and (max-width:381px) {
    .button-group {
        gap: 8px;
    }

    .Reload-button {
        gap: 5px;
    }

    .Reset-filter-button {
        padding: 5px 5px;
        gap: 5px;
    }
}

@media only screen and (max-width:380px) {
    .trans-pagination a {
        gap: 4px;
    }

    .drop-zone label {
        flex-direction: column;
    }

    .refund_download_btn {
        padding: 8px 8px;
        gap: 6px;
    }

    .refund_download_btn img {
        width: 20px;
        height: 20px;
    }

}


@media only screen and (max-width:370px) {
    .flatpickr-day {
        height: 35px;
        max-width: 30px;
        line-height: 35px;
    }

    .flat_datepicker_input_wrap .flatpickr-calendar {
        width: 250px;
    }

    .flatpickr-rContainer {
        width: 250px;
    }
}

@media only screen and (max-width:360px) {

    #merchant_category_id {
        width: 220px;
        height: 220px;
    }

    .dsb_payment_distribution .dsb_pay_wallet {
        padding: 8px 8px 8px !important;
    }

    .payments_overview_list {
        margin-top: 0px;
    }

    .refund_num {
        margin-top: 0px;
        padding: 5px 12px;
    }

    .select_drp_sec {
        gap: 7px;
    }

    .rt_select_drp {
        font-size: 12px;
    }

    .gst_tdr_content_sec .gst_tdr_item {
        gap: 10px;
        padding: 15px 15px;
    }

    .dsb_payments_inner {
        padding: 15px 15px;
    }

    .main_nav {
        padding: 15px 10px 10px 10px;
    }

    .multi_slider>.thumb {
        width: 20px;
        height: 20px;
    }

    .multi_slider {
        height: 3px;
    }

    .recent_transac_table td {
        padding: 10px 10px 10px 10px;
    }

    .dsb_payments_overview {
        margin-top: 20px;
        gap: 20px;
    }

    .dash_content_hd,
    .dash_content_p,
    .dash_card_num {
        width: 45px;
    }

    .dasboard_cards_inner.dasboard_cards_inner {
        flex-basis: calc(100% - 0px);
    }

    .dash_content_hd,
    .dash_content_p,
    .dash_card_num {
        width: auto;
    }

    .dsb_payment_distribution .dsb_pay_wallet {
        padding: 8px 10px 8px;
    }

    .dsb_payments_inner_alter {
        gap: 10px;
    }

    .table_title_head {
        margin-bottom: 15px;
    }

    .dsb_payment_distribution .dsb_pay_wallet {
        background-size: cover;
    }

    .gross_transactions_overview {
        margin-top: 20px;
    }

    .recent_transaction_table_overview {
        margin-top: 20px;
    }

    .rt_merchants_overview {
        margin-top: 20px;
    }

    .add-more-data-section {
        padding: 15px 15px;
    }

    .saerchbr {
        font-size: 13px;
    }

    .card-data-text {
        line-height: 1.5;
    }

    .card-data-comment {
        line-height: 1.3;
    }

    .add_more_data_overview {
        height: 150px;
    }

    .input-div .input-serch,
    .input-div {
        font-size: 12px;
    }

    .input-serch::placeholder {
        font-size: 12px;
    }

    .text-data-div {
        height: 100px;
    }

    .addmore-data-btn {
        line-height: 15px;
    }

    .sett_cont_sec {
        gap: 1rem;
    }

    .settlement_box .dsb_payments_heading {
        margin-bottom: 0;
    }

    .rt_merchants_overview .refund_num {
        margin-bottom: 0;
    }

    .dsb_payments_inner_alter {
        gap: 20px;
    }

    .nav_left_bar_parent {
        flex-direction: column;
        gap: 15px;
    }

    .notify-box {
        width: 240px;
        align-items: center;
    }

    input.input_tr_dt {
        padding: 1px 30px 0px 8px;
    }

    .tc_transaction_content .section_title_section {
        gap: 10px;
    }

    .navbar-scetion {
        gap: 10px;
    }

    .Reset-filter-button {
        padding: 8px 8px;
    }

    .Reload-button {
        gap: 6px;
    }

    .body_content {
        padding: 12px 10px 0px 10px;
    }

    .button-container-filter .middle-button {
        width: 100px;
        height: 2rem;
    }

    .filter-div .merchant_btn {
        height: 2rem;
        font-size: 13px;
    }

    .filter-div .vendors_merchant {
        height: 2rem;
        font-size: 13px;
    }

    .button-group {
        width: 100%;
        justify-content: flex-start;
    }

    .container_payment_create_invoice,
    .py_send_btn .modal-content,
    .py_error_cls_inner,
    .tickets_add_tickets_container,
    .tickets_prew_tickets_container,
    .tc_success_overlay_cls_inner {
        padding: 25px 16px 25px;
    }

    .ticket_form_selectdiv:after {
        font: normal normal normal 15px/1 FontAwesome;
    }

    .main_nav {
        gap: 10px;
    }

    .setting-popup-main {
        width: 210px;
    }

    .view-profile {
        padding: 15px 0px;
    }

    .view-profile1 {
        padding: 10px;
    }
}

@media only screen and (max-width:359px) {
    .rt_merchants_overview .dsb_cir_chart_list {
        flex-direction: column;
    }

    .dsb_cir_chart_list_ul {
        width: 100%;
    }

    .notify-box {
        width: 200px;
        gap: 12px;
        padding: 10px;
    }

    .cal_title_text {
        width: 100%;
    }

    .Reset-filter-button {
        padding: 5px 5px;
    }

    .Reload-button {
        padding: 5px 5px;
    }

    .Reset-filter-button {
        gap: 5px;
    }
}


@media screen and (device-width: 834px) and (device-height: 1194px) {
    .nav_search_bar_inner {
        width: 100%;
    }

    .nav_left_bar {
        width: 0%;
    }

    .set_note_bar {
        align-self: center;
    }

    .main_nav {
        padding: 20px 0px 20px 0px;
    }
        .droplist-section .button-group i{
            font-size: 14px;
        }
                .notification_container{
                    top:27%;
                }
}