@layer media_query {

    @media(max-width:992px) {


        .select_items_big2 .cross_btn2 {

            padding-right: 1rem;
            padding-top: 0.85rem;
            display: flex;
            justify-content: flex-end;

        }

        body:has(.optionboxappear) {
            overflow-y: hidden;
        }


        body:has(.optionboxappear) .js_scroll_blanket {
            display: block;
        }

        .select_items_big2 {
            transition: all 0.5s ease-in-out;
            /* transition-delay: 0.5s;*/
            transform: translateY(200dvh);
            display: grid;
            grid-template-rows: max-content 1fr;
            max-height: 100dvh;
            z-index: 8000;
            overflow-y: hidden;
            width: 100%;
            left: auto;
            top: auto;
            bottom: 0;

        }

        .select_items_big2 .select_items {
            overflow-y: auto;
        }

        .select_items_big2.select_box_active {
            transform: translateY(0px);

        }

        .select_items .my_placeholder {}

        .select_items .combo_option {
            white-space: normal;
        }
    }

    @media(max-width:767px) {
        .custom_select {
            min-width: unset;
        }
    }

}

@layer media_query {
    @media only screen and (max-width:992px) {
        .datepicker {
            left: 50% !important;
            top: 50% !important;
            transform: translate(-50%, -50%);
        }

        body:has(.active_datepicker) {
            overflow: hidden;
        }

        body:has(.active_datepicker) .js_scroll_blanket {
            display: block;
        }

        .datepicker {
            box-shadow: none;
        }

        .datepicker .close_wrapper {
            display: flex;
        }
    }
}

@layer media_query {
    @media(max-width: 992px) {
        .form_wrapper1_1 .form_inner {
            grid-template-columns: repeat(4, 1fr);
        }

        .form_wrapper1_1 .form_group:nth-child(1) {
            grid-column: 1 / 3;
        }

        .form_wrapper1_1 .form_group:nth-child(2) {
            grid-column: 3 / -1;
        }

        .form_wrapper1_1 .form_group:nth-child(3) {
            grid-column: 1 / 2;
        }

        .form_wrapper1_1 .form_group:nth-child(5) {
            grid-column: 3 / -1;
        }
    }

    @media(max-width: 767px) {
        .form_wrapper1_1 .form_inner {
            grid-template-columns: 100%;
        }

        .form_wrapper1_1 .form_group:nth-child(1) {
            grid-column: unset;
        }

        .form_wrapper1_1 .form_group:nth-child(2) {
            grid-column: unset;
        }

        .form_wrapper1_1 .form_group:nth-child(3) {
            grid-column: unset;
        }

        .form_wrapper1_1 .form_group:nth-child(5) {
            grid-column: unset;
        }
    }
}

@layer media_query{
    @media(max-width: 767px){
        .form_wrapper1_2 .form_inner{
            grid-template-columns: 100%;
        }
    }
}

@layer media_query {
    @media(max-width: 992px) {
        .form_wrapper1_4 .form_inner {
            grid-template-columns: repeat(2, 1fr);
        }
    }

    @media(max-width: 767px) {
        .form_wrapper1_4 .form_inner {
            grid-template-columns: 100%;
        }
    }
}

@layer media_query {
    @media(max-width: 767px) {
        .form_wrapper1 .btn_row2 {
            flex-wrap: wrap;
            row-gap: 1rem;
        }

        .form_wrapper1 .btn_row2 * {
            
        }
    }
}

@layer media_query{
    @media(max-width: 992px){
        .form_wrapper1:has(+.tab_dropdown){
            margin-bottom: 3rem;
        }
    }
}

@layer media_query {
    @media(max-width: 767px) {
        .pagination ol {
            order: 1;
            width: 100%;
        }

        .pagination .pagin_prev_btn {
            order: 2;
        }

        .pagination .pagin_next_btn {
            order: 3;
        }
    }
}

@layer media_query{
    @media(max-width: 992px){
        .datepicker_container.show{
            left: 50%;
            top:50%;
            transform: translate(-50%,-50%);
            position: fixed;
        }
        body:has(.datepicker_container.show){
            overflow: hidden;
        }
        body:has(.datepicker_container.show) .js_scroll_blanket{
            display: block;
        }
    }
}

@layer media_query{
    @media(max-width: 992px){
        .btn_row_under{
            grid-template-columns: repeat(auto-fit, minmax(min(400px, 100%), 1fr));
        }
    }
}