<div class="row mt-2">
    <div class="col-lg-12">
        <div class="card cardXX d-flex position-relative flex-column cardBg pr3">
            <div class="row mt-2 mb-0 ml-2 mr-2">
                <!-- Overall Section -->
                <div class="col-lg-4 pr2">
                    <h5 class="div-head" >
                        <b style="font-weight:500">Overall</b>
                    </h5>
                    <div class="left-section">
                        <div class="card cardXX d-flex position-relative flex-column cardBg mt-2">
                            <h5 class="div-head" >
                                <b style="font-weight:500">Gender</b>
                            </h5>
                            <div class="gender_img_container d-flex mt-2">
                                <div class="gender_item" data-name = "gender_male_profiling_chart" onclick="clickableSlice(this, 'gender_male_profiling_chart','gender','Male','img','fresh');">
                                    <img src="assets/images/male.png" class="gender_img" alt="">
                                    <div class="gender_value male_value" id="male_value_dfns">40%</div>
                                </div>
                                <div class="gender_item" data-name = "gender_female_profiling_chart" onclick="clickableSlice(this, 'gender_female_profiling_chart','gender','Female','img','fresh');">
                                    <img src="assets/images/female.png" class="gender_img" alt="">
                                    <div class="gender_value female_value" id="female_value_dfns">40%</div>
                                </div>
                            </div>
                        </div>
                        <div class="card cardXX d-flex position-relative flex-column cardBg mt-2">
                            <h5 class="div-head" >
                                <b style="font-weight:500">Age</b>
                            </h5>
                            <div id="age_op_dfns" class="animate__animated animate__fadeInLeft tab2_chart" style="height:300px" data-name="age_profiling_chart"></div>
                        </div>
                        <div class="card cardXX d-flex position-relative flex-column cardBg mt-2">
                            <h5 class="div-head" ><b style="font-weight:500">Income</b></h5>
                            <div id="income_op_dfns" class="animate__animated animate__fadeInLeft tab2_chart" style="height:270px" data-name="income_profiling_chart"></div>
                        </div>
                        <div class="card cardXX d-none position-relative flex-column cardBg mt-2">
                            <h5 class="div-head" ><b style="font-weight:500">Segment</b></h5>
                            <div id="segment_op_dfns" class="animate__animated animate__fadeInLeft tab2_chart" style="height:270px"></div>
                        </div>
                        <div class="card cardXX d-none position-relative flex-column cardBg mt-2">
                            <h5 class="div-head" ><b style="font-weight:500">Types</b></h5>
                            <div id="type_op_dfns" class="animate__animated animate__fadeInLeft tab2_chart" style="height:270px"></div>
                        </div>
                        <div class="card cardXX d-none position-relative flex-column cardBg mt-2">
                            <h5 class="div-head" ><b style="font-weight:500">Dwell Time Departure</b></h5>
                            <div id="dwell_op_dfnsD" class="animate__animated animate__fadeInLeft tab2_chart" style="height:270px"></div>
                        </div>
                        <div class="card cardXX d-none position-relative flex-column cardBg mt-2">
                            <h5 class="div-head" ><b style="font-weight:500">Dwell Time Arrival</b></h5>
                            <div id="dwell_op_dfnsA" class="animate__animated animate__fadeInLeft tab2_chart" style="height:270px"></div>
                        </div>
                        <div class="card cardXX d-none position-relative flex-column cardBg mt-2">
                            <h5 class="div-head" ><b style="font-weight:500">Frequency International</b></h5>
                            <div id="frequency_op_dfnsI" class="animate__animated animate__fadeInLeft tab2_chart" style="height:270px"></div>
                        </div>
                        <div class="card cardXX d-none position-relative flex-column cardBg mt-2">
                            <h5 class="div-head" ><b style="font-weight:500">Frequency Domestic</b></h5>
                            <div id="frequency_op_dfnsD" class="animate__animated animate__fadeInLeft tab2_chart" style="height:270px"></div>
                        </div>
                        <div class="card cardXX d-none position-relative flex-column cardBg mt-2">
                            <h5 class="div-head" ><b style="font-weight:500">Travelling</b></h5>
                            <div id="travelling_op_dfns" class="animate__animated animate__fadeInLeft tab2_chart" style="height:270px"></div>
                        </div>
                        <div class="card cardXX d-none position-relative flex-column cardBg mt-2">
                            <h5 class="div-head" ><b style="font-weight:500">Reason of Travel</b></h5>
                            <div id="purpose_op_dfns" class="animate__animated animate__fadeInLeft tab2_chart" style="height:270px"></div>
                        </div>
                        <div class="card cardXX d-none position-relative flex-column cardBg mt-2">
                            <h5 class="div-head" ><b style="font-weight:500">Terminal</b></h5>
                            <div id="terminal_op_dfns" class="animate__animated animate__fadeInLeft tab2_chart" style="height:270px"></div>
                        </div>
                        <div class="card cardXX d-none position-relative flex-column cardBg mt-2">
                            <h5 class="div-head" ><b style="font-weight:500">Traveller</b></h5>
                            <div id="traveller_op_dfns" class="animate__animated animate__fadeInLeft tab2_chart" style="height:270px"></div>
                        </div>
                    </div>
                </div>
                <!-- LOB Section -->
                <div class="col-lg-8 pr5">
                    <h5 class="div-head" >
                        <b style="font-weight:500">Duty Free LOB</b>
                    </h5>
                    <div class="right-section">
                        <div class="chart_div">
                            <div class="card cardXX d-flex position-relative flex-column cardBg mt-2">
                                <h5 class="div-head" style="font-size:14px;padding-top:15px;padding-bottom:10px"><b style="font-weight:500">What all had you planned to shop from the duty free offerings at airport?</b></h5>
                                <div id="q201" class="animate__animated animate__fadeInLeft mb-2 tab2_chart"></div>
                            </div>
                            <div class="card cardXX d-flex position-relative flex-column cardBg mt-2">
                                <h5 class="div-head" style="font-size:14px;padding-top:15px;padding-bottom:10px"><b style="font-weight:500">Why did you not shop from the duty free offerings at this airport in your current travel?</b></h5>
                                <div id="q202" class="animate__animated animate__fadeInLeft mb-2 tab2_chart" style="height:550px"></div>
                            </div>             
                            <div class="card cardXX d-none position-relative flex-column cardBg mt-2">
                                <h5 class="div-head" style="font-size:14px;padding-top:15px;padding-bottom:10px"><b style="font-weight:500">Did you purchase from duty free offerings at other foreign airports in the last few international trips?</b></h5>
                                <table class="tblZ mb-2" id="q206_tbl" cellpadding="0" cellspacing="0">
                                    <tbody>
                                        
                                    </tbody>
                                </table>
                            </div>
                            <div class="card cardXX d-flex position-relative flex-column cardBg mt-2">
                                <h5 class="div-head" style="font-size:14px;padding-top:15px;padding-bottom:10px"><b style="font-weight:500">What additional services would you like to see being offered at duty-free offerings at airport?</b></h5>
                                <div id="q209" class="animate__animated animate__fadeInLeft mb-2 tab2_chart"></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>








<!-- <div class="row mt-2">
    <div class="col-lg-12 chart_div">
        <div class="card cardXX d-flex position-relative flex-column cardBg pr3">
            
        </div>
    </div>
    <div class="col-lg-12 tbl_div">
        <div class="card cardXX d-flex position-relative flex-column cardBg pr3">
            <h5 class="div-head" style="font-size:14px;padding-top:15px;padding-bottom:10px"><b style="font-weight:500">What all had you planned to shop from the duty free offerings at airport?</b></h5>
            <table class="table table-striped table-bordered no-footer text-center display animate__animated animate__fadeInLeft" id="q201_tbl" cellpadding="0" cellspacing="0">
                <thead>
                    
                </thead>
                <tbody>
                    
                </tbody>
            </table>
        </div>
    </div>
</div>

<div class="row mt-2">
    <div class="col-lg-12 chart_div">
        <div class="card cardXX d-flex position-relative flex-column cardBg pr3">
            
        </div>
    </div>
    <div class="col-lg-12 tbl_div">
        <div class="card cardXX d-flex position-relative flex-column cardBg pr3">
            <h5 class="div-head" style="font-size:14px;padding-top:15px;padding-bottom:10px"><b style="font-weight:500">Why did you not shop from the duty free offerings at this airport in your current travel?</b></h5>
            <table class="table table-striped table-bordered no-footer text-center display animate__animated animate__fadeInLeft" id="q202_tbl" cellpadding="0" cellspacing="0">
                <thead>
                    
                </thead>
                <tbody>
                    
                </tbody>
            </table>
        </div>
    </div>
</div>

<div class="row mt-2">
    <div class="col-lg-12 chart_div">
        <div class="card cardXX d-flex position-relative flex-column cardBg pr3">
            
        </div>
    </div>
    <div class="col-lg-12 tbl_div">
        <div class="card cardXX d-flex position-relative flex-column cardBg pr3">
            <h5 class="div-head" style="font-size:14px;padding-top:15px;padding-bottom:10px"><b style="font-weight:500">Did you purchase from duty free offerings at other foreign airports in the last few international trips?</b></h5>
            <table class="table table-striped table-bordered no-footer text-center display animate__animated animate__fadeInLeft" id="q206_tbl2" cellpadding="0" cellspacing="0">
                <thead>
                    
                </thead>
                <tbody>
                    
                </tbody>
            </table>
        </div>
    </div>
</div>

<div class="row mt-2">
    <div class="col-lg-12 chart_div">
        <div class="card cardXX d-flex position-relative flex-column cardBg pr3">
            <h5 class="div-head" style="font-size:14px;padding-top:15px;padding-bottom:10px"><b style="font-weight:500">What additional services would you like to see being offered at duty-free offerings at airport?</b></h5>
            <div id="q209" class="animate__animated animate__fadeInLeft mb-2 tab2_chart"></div>
        </div>
    </div>
    <div class="col-lg-12 tbl_div">
        <div class="card cardXX d-flex position-relative flex-column cardBg pr3">
            <h5 class="div-head" style="font-size:14px;padding-top:15px;padding-bottom:10px"><b style="font-weight:500">What additional services would you like to see being offered at duty-free offerings at airport?</b></h5>
            <table class="table table-striped table-bordered no-footer text-center display animate__animated animate__fadeInLeft" id="q209_tbl" cellpadding="0" cellspacing="0">
                <thead>
                    
                </thead>
                <tbody>
                    
                </tbody>
            </table>
        </div>
    </div>
</div> -->
