/*---------------------------------------the below css is used for the Summary in the new Career Report page----------------------*/

 .edvdo_individual_report_summary_outerbox{
    display: flex;
    width: 100%;
    flex-wrap: wrap;
}

.edvdo_individual_report_summary{
    width: 48%;
    display: flex;
    flex-direction: column;
    height: auto;
    flex-shrink: 0;
    border-radius: 20px;
    background: #FFF;
    margin: 1% 1%;
    padding: 3%;
    box-shadow: 0px 20px 24px -4px rgba(16, 24, 40, 0.10), 0px 8px 8px -4px rgba(16, 24, 40, 0.04);
}

.edvdo_individual_report_summary img{
    width: 100%;
    height: 25vh;
    object-fit: contain;
    margin: 2vh 0 2vh 0;
}

 /*---------------------------------------the above css is used for the Summary in the new Career Report page----------------------*/


.edvdo-subject-image-graph-legend-report-outermostbox{
    display: flex; 
    gap: 2%;
}

.edvdo-subject-image-graph-legend-report-outerbox{
    display:flex;
    align-items:center; 
    justify-content:center;
    width: 20%;
}

.edvdo-subject-image-graph-legend-report-outerbox img{
    width: 80%;
    object-fit: contain;
    max-height: 50vh;
}

.edvdo-subject-image-graph-legend-report-innerbox{
    display: flex; 
    flex-direction: column; 
    width: 78%;
}

.edvdo-subject-graph-legend-report-outerbox{
    width:60%;
    display:flex;
    align-items:center; 
    justify-content:center;
}
.edvdo-subject-graph-legend-report{
    width:40%;
    height:50%; 
    padding:10px;  
    display:flex; 
    flex-direction:column;
    margin-right: 5%;
    margin-left: 2.5%;
    margin-top: 40px;
}



/*_____subject graph starts____*/
.edvdo-subject-graph {
    display: inline-block;
    justify-content: center;
    align-items: center;
    width: 65%; /* Adjust this as needed */
    margin-left: 5%;
    margin-right: 2.5%;
    margin-top: 40px;
    padding: 40px 0 40px 0px;
}

.edvdo-subject_bar {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
    width: 100%;

}

.edvdo-subject_bar-label {
    text-align: right;
    margin: 0 10px 0 0;
    flex-shrink: 0;
    width: 10%; /* Adjust the width as needed */
}

.edvdo-subject_bar-value {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding-left: 50px ;
    height: 40px;
    background-color: #003F6B;
    z-index: 1;
}

.edvdo-subject_bar-marker {
    width: 10px;
    height: 60px; /* Ensure this matches the height of .bar-value */
    background: linear-gradient(
        to right,
        #253545 -0.9%,
        #414F5D 3.07%,
        #6E7883 10.13%,
        #959DA4 17.7%,
        #B6BBC0 25.71%,
        #D0D4D7 34.27%,
        #E5E7E9 43.57%,
        #F4F5F5 54%, 
        #FCFDFD 66.46%,
        #FFFFFF 86.34%
    );
    opacity: 0.3;
    margin: -5px -8px -5px 0; /* To add space between the marker and the bar */
    z-index: 2;
}


/*_____subject graph ends _____*/


.edvdo_subject_descriptions_career_report {
    display: flex;
    width: 100%;
}

.edvdo_subject_description_image_card_career_report {
    display: flex; 
    width: 100%; 
    background-color: #E6F4FF; 
    box-shadow: 0px 20px 24px -4px rgba(16, 24, 40, 0.10), 0px 8px 8px -4px rgba(16, 24, 40, 0.04);
    padding-left: 20px; 
    margin-bottom: 3vh; 
    height: 30vh; 
}

.edvdo_subject_description_card_career_report{
    display: flex; 
    width: 85%;
    flex-direction: column; 
    justify-content: center;
    align-items: flex-start;
}

.edvdo_subject_image_card_career_report{
    display: flex; 
    flex-direction: column; justify-content: flex-end; 
    width: 15%;
}

.edvdo_subject_image_card_career_report img{
    width:100%; height:25vh; 
    object-fit: cover;
}

.edvdo_assessment_report_row_value{
    display: flex;
    width: 100%;
    margin-bottom: 20px;
    flex-wrap: wrap;
}


.edvdo_value_description_image_card_career_report{
	
    display: flex; 
   width: 48%; 
   background-color: #E6F4FF; 
   box-shadow: 0px 20px 24px -4px rgba(16, 24, 40, 0.10), 0px 8px 8px -4px rgba(16, 24, 40, 0.04);
   padding-left: 20px; margin-bottom: 3vh; 
   height: 30vh; 
   margin: 1% 1%;
}



.edvdo_value_description_card_career_report{
   display: flex; 
   width: 75%;
   flex-direction: column; 
   justify-content: center;
   align-items: flex-start;
   
}



.edvdo_value_image_card_career_report{
       display: flex; 
   flex-direction: column; justify-content: flex-start;

   width: 25%;
}

.edvdo_value_image_card_career_report img{
    width:100%; height:25vh; 
    object-fit: cover;
}





.edvdo-report-cswd-outermost-container{
    display:flex;
    flex-direction: row;
}


.edvdo-report-cswd-outer-container{
    display:flex; 
    flex-direction: column; 
    width:50%;
}


/* Career Implications Section */
.edvdo-career-implications-box {
    width: 50%;
    height: auto;
    padding: 30px 40px;
    gap: 8px;
    border-radius: 0px 100px 0px 0px;
    background: rgba(255, 229, 176, 1);
}
.edvdo-report-strength-container {
   width: 100%;
    height: auto;
    padding: 30px 40px 36px 40px;
    gap: 8px;
    background: rgba(197, 233, 205, 1);
}

.edvdo-report-weakness-container {
   width: 100%;
    height: auto;
    padding: 30px 40px 36px 40px;
    gap: 8px;
    background: rgba(250, 197, 195, 1);
    
}

.edvdo-report-development-plan-container {
    width: 50%;
    height: auto;
    padding: 30px 40px 36px 40px;
    gap: 8px;
    background: rgba(31, 103, 73, 0.1);
    position: relative;
    
}

/* CSS for the Personality Box Layout */
.edvdo-report-overview-box {
    width: 100%;
    min-height: 60vh;
    border-radius: 8px;
    display: flex;
	flex-direction: column;
    align-items: center;
    background-color: #fff;
    border: 1px solid #ccc;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    overflow: hidden;
    margin-bottom: 10px;
	padding: 15px;
}

.edvdo-report-overview-box img {
    width: 100%;
    height: 25vh;
    border-radius: 8px;
    object-fit: cover;
}

.edvdo-report-overview-content {
    padding: 10px 0 0 0;
    flex: 1;
}


.edvdo_report_number_title_outer_box_career_report{
    display: flex; 
    justify-content: left; 
    align-items: center; 
    width: 100%; 
    height: auto;
}

.edvdo_report_number_box_career_report{
    display: flex; 
    flex-direction: column; 
    justify-content: center; 
    align-items: center; 
    width: 15%; 
    height: auto; 
    background-color: rgba(0, 149, 255, 1); 
    color: rgba(36, 36, 36, 1); 
    padding: 10px 10px 10px 10px; 
    margin: 0 10px 0 0;
}

.edvdo_report_blue_title_box{
    display: flex; 
    flex-direction: column; 
    justify-content: center; 
    align-items: flex-start; 
    width: 60%; 
    height: auto; 
    background-color: rgba(0, 63, 107, 1); 
    color: rgba(255, 255, 255, 1); 
    padding: 10px 0 10px 10px;
}

@media screen and (min-width: 481px) and (max-width: 1024px){


    .edvdo-report-cswd-outermost-container{
        display:flex;
        flex-direction: column;
    }
    
    
    .edvdo-report-cswd-outer-container{
        display:flex; 
        flex-direction: column; 
        width:100%;
    }

    .edvdo-career-implications-box {
        width: 100%;
        height: auto;
        padding: 20px;
        gap: 8px;
        border-radius: 0px 100px 0px 0px;
        background: rgba(255, 229, 176, 1);
    }

    .edvdo-report-strength-container {
        width: 100%;
         height: auto;
         padding: 20px;
         gap: 8px;
         background: rgba(197, 233, 205, 1);
     }
     
     .edvdo-report-weakness-container {
        width: 100%;
         height: auto;
         padding: 20px;
         gap: 8px;
         background: rgba(250, 197, 195, 1);
         
     }
     
     .edvdo-report-development-plan-container {
         width: 100%;
         height: auto;
         padding: 20px;
         gap: 8px;
         background: rgba(31, 103, 73, 0.1);
         position: relative;
         
     }
     

     .edvdo-report-overview-box {
        min-height: unset;
        height:auto;
    }





    .edvdo-subject-image-graph-legend-report-outermostbox{
        display: flex;
        flex-direction: column; 
        gap: 2%;
    }

     .edvdo-subject-image-graph-legend-report-outerbox{
        width: 100%;
    }
    
    .edvdo-subject-image-graph-legend-report-outerbox img{
        width: 100%;
    }


    .edvdo-subject-image-graph-legend-report-innerbox{
        width: 100%;
    }

     .edvdo_subject_description_image_card_career_report {
        padding: 10px; 
        min-height: 25vh;
        height: auto;
    }

    .edvdo_subject_description_card_career_report{
        width: 70%;
    }
    
    .edvdo_subject_image_card_career_report{
        width: 30%;
    }

    .edvdo_subject_image_card_career_report img{
        object-fit: contain;
    }

    .edvdo_value_description_image_card_career_report{
       width: 100%;
       padding: 10px; margin-bottom: 3vh; 
       min-height:25vh;
       height: auto;
    }

    .edvdo_individual_report_summary{
        width: 100%;
    }

    .edvdo_individual_report_summary img{
        width: 100%;
        height: 20vh;
    }

    .edvdo_report_blue_title_box{
        width: 80%; 
    }

}


@media screen and (min-width: 320px) and (max-width: 480px){

    .edvdo-report-cswd-outermost-container{
        display:flex;
        flex-direction: column;
    }
     
    .edvdo-report-cswd-outer-container{
        display:flex; 
        flex-direction: column; 
        width:100%;
    }

    .edvdo-career-implications-box {
        width: 100%;
        height: auto;
        padding: 20px;
        gap: 8px;
        border-radius: 0px 100px 0px 0px;
        background: rgba(255, 229, 176, 1);
    }

    .edvdo-report-strength-container {
        width: 100%;
         height: auto;
         padding: 20px;
         gap: 8px;
         background: rgba(197, 233, 205, 1);
     }
     
     .edvdo-report-weakness-container {
        width: 100%;
         height: auto;
         padding: 20px;
         gap: 8px;
         background: rgba(250, 197, 195, 1);
         
     }
     
     .edvdo-report-development-plan-container {
         width: 100%;
         height: auto;
         padding: 20px;
         gap: 8px;
         background: rgba(31, 103, 73, 0.1);
         position: relative;
         
     }


     .edvdo-subject-image-graph-legend-report-outermostbox{
        display: flex;
        flex-direction: column; 
        gap: 2%;
    }

     .edvdo-subject-image-graph-legend-report-outerbox{
        width: 100%;
    }
    
    .edvdo-subject-image-graph-legend-report-outerbox img{
        width: 100%;
    }

    .edvdo-subject-image-graph-legend-report-innerbox{
        width: 100%;
    }

     .edvdo_subject_description_image_card_career_report {
        padding: 10px; 
        min-height: 25vh;
        height: auto;
    }

    .edvdo_subject_description_card_career_report{
        width: 70%;
    }
    
    .edvdo_subject_image_card_career_report{
        width: 30%;
    }

    .edvdo_subject_image_card_career_report img{
        object-fit: contain;
    }

    .edvdo_value_description_image_card_career_report{
       width: 100%;
       padding: 10px; margin-bottom: 3vh; 
       min-height:25vh;
       height: auto;
    }

    .edvdo_individual_report_summary{
        width: 100%;
    }

    .edvdo_individual_report_summary img{
        width: 100%;
        height: 20vh;
    }

    .edvdo_report_blue_title_box{
        width: 80%; 
    }
}