@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Mulish:ital,wght@0,200..1000;1,200..1000&display=swap');

body {
    /*background-color: #F2F6FE;*/
    background-color: #004a94;
    font-family: "Mulish", sans-serif;
    font-optical-sizing: auto;
    /*color:#89A4B7;*/
    /*color: #d9edf8;*/
    color:#89A4B7;
    width: 100%;
    /*font-weight: <weight>;*/
    /*font-style: normal;*/

}

.site_container {
    display: flex;
    width: 90%;
    min-height: 100%;
    justify-self: center;
    
}



.side_container {
    color: #d9edf8;
    width: 15%;
    height: 100%;
    position: sticky;
    top: 30;
    
    
}

.main_container {
    background-color: white;
    width: 90%;
    padding: 25px;
    margin: 10px;
    border-radius: 10px;
    
}


.site_title {
    font-weight: 900;
}

.navigation_item {
    
    padding: 8px;
}

.navigation_item:hover {
    background-color: #E8E8E8;
    border-radius: 5px;
    
    
}

.navigation_icon {
    padding: 0px;
}

.navigation_text {
    text-decoration: none;
    color: inherit;
    padding-left: 10px;
}

.navigation_text_submenu {
    font-size: 80%;
    padding-left: 20px;
}

.side_container_logo_container {
    
    height: 15%;
    display: flex;
    align-items: center;
    
}

.side_container_navigation_menu {
    display: flex;
    flex-direction: column;
    height: 85%;
}

.navigation_option_container {
    color:#89A4B7;
    padding: 15px 0px;
    display: flex;
    align-content: center;
    width: 90%;
    border-radius: 10px;
    margin: 5px 0px;
    
}

.nav_container {
    font-size: 85%;
}



.navigation_option_text {
    color:#89A4B7;
    padding-left: 15px;
}

.nav_option_selected
{
    color: white;
}

.site_container_main_container {
    display: flex;
    flex-direction: column;
    background-color: white;
    border-radius: 15px;
    row-gap: 15px;
}

.main_container_header {
    
    display: flex;
    margin-top: 15px;
    height: 13%;
    align-items: center;
    justify-content: space-between;
    padding: 0px 15px; 

    
    
}

.header_page_name {
    font-weight: 800;
    font-size: 145%;
    color: black;
    padding: 0px;
    text-transform: capitalize;
}

.header_breadcrumb {
    font-size: 13px;
    font-weight: 200;
    padding: 0px;
    display: flex;
}

.breadcrumb_item {
    padding-right: 5px;
}


.main_container_content_container {
    background-color: white;
    height: 85%;
    display: flex;
    flex-direction: column;
    row-gap: 15px;
}   




.customer_home_main_container {
    display: flex;
    column-gap: 15px;
    height: 90%;

  
}

.customer_home_main_content {
    width: 75%;
    display: flex;
    flex-direction: column;
    row-gap: 15px;

}

.customer_home_filter_container {
    width: 25%;
    border: 1px solid #E8E8E8;
    border-radius: 15px;
}

.customer_home_row_container {
    
    border-radius: 15px;
    display: flex;
    column-gap: 10px;
    justify-content: space-between;
}



.customer_home_filter_title {
    color: black;
    padding: 10px;
    font-size: 13px;
    font-weight: 800;
}


.survey_card {
    border: 1px solid #E8E8E8;
    border-radius: 15px;
    height: 300px;
    width: 350px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    
}



.survey_updated_date {
    font-size: 10px;
    height: 50px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    
}

.side_filter_title {
    color: black;
    font-size: 75%;
    font-weight: 800;
}

.side_filter_container {
    max-height: 100%;
    border: 1px solid #E8E8E8;
    border-radius: 15px;
    padding: 10px;  
}



.section_title {
    font-size: 95%;
    font-weight: 800;
    margin: 10px 0px;
    color: white;
    /*background-color: #E8E8E8;*/
    background-color: #004a94;
    padding: 7px 15px;
    border-radius: 10px;

}

select {
    border: 1px solid #E8E8E8;
    border-radius: 5px;
}

.survey_response_details {
    font-size: 80%;
}

.survey_response_details_label {
    font-weight: 900;
}

.respondent_demographic_details {
    font-size: 80%;
}

.respondent_demographic_details_label {
    font-weight: 900;
}




.impact_individual_responses_container table {
    font-size: 75%;
    border-collapse: separate;
    border-spacing: 4px 5px;
    padding: 5px;
    
}

.impact_individual_responses_container thead {
    margin-bottom: 10px;
    background-color: #F2F6FE;
    z-index: 100;
    position: sticky;
    top: 0;
}



.impact_individual_responses_container th {
    padding: 2px 5px;
}

.impact_individual_responses_container td {
    padding: 5px;   
    

}



.impact_individual_question {
    width: 50%;
    font-weight: 700;
}

.impact_individual_responses_container {
    border: 1px solid #E8E8E8;
    border-radius: 15px;
    padding: 10px;

}


.user_details_label {
    font-size: 90%;
    font-weight: 800;
}

.user_details_text {
    font-size: 90%;
    padding-left: 10px;
}

.invalid_input {
    border: 1px solid red;
    
    
}

.valid_input {
    border: 2px solid green;
}

.error_message {
    color: red;
    font-size: 70%;
}