@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap");
@import url(https://unpkg.com/@webpixels/css@1.1.5/dist/index.css);


/* Bootstrap Icons */
@import url("https://cdnjs.cloudflare.com/ajax/libs/bootstrap-icons/1.4.0/font/bootstrap-icons.min.css");
*{
  margin: 0;
  padding: 0;
  outline: none;
  border: none;
  text-decoration: none;
  list-style: none;
  box-sizing: border-box;
  font-family: "Poppins", sans-serif;
}

body{
 background-color:#D9EDF7 ;
}


.main-login-page{
  padding: 100px;
  height: 100vh;
  border-radius: .75rem;
}

.login-feilds{
  width: 600px;
  height: 475px;

  padding: 60px;
  border-radius: 10px;}

.login-content h4{
margin-bottom: 40px;
}

.login-btn .btn-secondary{
  width: 100%;
  border-radius: 30px;
  box-shadow: none;
  background-color: #0560b8;
  color: white;
  margin-bottom: 30px;
}

.login-btn .btn-secondary:hover{
  background-color: #000000;
  transition: .3s ease;
}


.btn-new-account{
  background-color: inherit;
}
.btn-new-account a{
  color: #0560b8;
  background-color: inherit;
}

.login-feilds .form-control{
  border: 1px solid #0560b8;
  border-radius: 30px;
}

.login-feilds .form-control:focus{
  box-shadow: none;
}

.main-tabs-links{
  margin-left: 40px;
  background-color: #0560b8;
  padding: 0px 20px 0px 20px ;

  box-shadow: 0px 3px 11px -6px rgba(10, 22, 70, 0.3), 0px 0px 4px 2px rgba(10, 22, 70, .06) !important;
  position: fixed;
  width: 100%;
  top:0;
  z-index: 9999;
  color: #fff;
}

.main-tabs-links .nav-link{
  color: #fff;
    font-family: "Poppins", sans-serif;
    font-size: 14px;
    font-weight: 500;
}

.main-tabs-links .nav-tabs{
border-bottom: none;
}
.main-body{
  margin-top: 60px;
}
.right-section {
  margin-left: 76px;
    margin-top: 30px;
    margin-top: 80px;

}
.left-nav{
  position: fixed;
  top: 0;
  bottom: 0;
  height: 100vh;
  left: 0;
  width: 90px;
  background: #C95715;
  color: #ffffff;
  overflow: hidden;
  transition: .3s;
  z-index: 99999;
}
.left-nav a{
  display: flex;
  align-items: center;
  text-decoration: none;
   transition: .3s;
}
.left-nav a,.left-nav i {color: white}
.left-nav:hover{
  width: 280px;
}

.left-nav span{
  display: none
}

.left-nav li {
    padding: 18px 15px;
    font-size: 18px;
    display: flex;
     transition: .3s;
    justify-content: center;
}
.left-nav:hover li{
   justify-content:start;

}
.left-nav li:hover{
   background-color: #d35e1a;
}
.left-nav li:hover i{color: white}
.left-nav:hover span{
  display: block
}
.left-nav:hover .nav-item{color: white}
.logo{
  text-align: center;
  display: flex;
  margin: 10px 0 0 10px;
  padding-bottom: 1rem;
  padding-top: 1rem;
  color: #ffffff;
}
.logo:hover{
    background-color: #ffffff;
    color: #C95715;
}
.fa:hover{
    padding: 0 0 0 0;
}

nav .fas{
  position: relative;
  width: 70px;
  height: 40px;
  top: 15px;
  font-size: 20px;
  text-align: center;
  color: #fff;
}
.nav-item{
  position: relative;
  list-style: none;
  margin-left: 10px;
}

.navbar-nav .nav-link{
  border-bottom: 2px solid transparent;
  transition: .3s ease;
}

.navbar-nav .nav-link:hover{
  border-bottom: 2px solid #ffffff;

}

.navbar-nav .nav-link:focus{
  border-bottom: 2px solid #ffffff;

}
.navbar-brand{
  color: #fff !important;
}
nav a:hover .nav-item{color: black}
a:hover i{
  color: #C95715;
  transition: 0.5s;
}
.logout{
  position: absolute;
  bottom: 0;
}
.logout_top{
  color: #fff;
}
.text-orange{
  color: #0560b8 !important;
}
.logout_top:hover{
  color: #ffffff;
}

.container{
  display: flex;
}
 .header{
  background-image: linear-gradient(#e7e7e7, #D6DBFF);
    position: fixed;
    top: 0;
    width: calc(100% - 90px);
    z-index: 9999;
    box-shadow: 0 .125rem .25rem rgba(0,0,0,.075)!important;
    margin-left: 90px;
 }
/* MAin Section */

.main-top{
  display: flex;
  border-radius: 10px;
  align-items: center;
  height:60px;
  width: 100%;
}
.main-top h1{
    padding-left: 20px;
}
.main-top i{
    position: relative;
  color: rgb(110, 109, 109);
  cursor: pointer;
}

.ms-auto{
  margin-left: auto;
}
.shadow-lg{
  box-shadow: 0px 3px 11px -6px rgba(10, 22, 70, 0.3), 0px 0px 4px 2px rgba(10, 22, 70, .06) !important;
}
.content {
  background-color: #fff;
  padding: 10px;
  margin-top: 50px;
  padding-left: 10 px;
  margin-left: 73px;
  border-radius: 10px;
}


.main-content .img-bg{
background-image: url(../imgs/1.png);
height: 300px; background-repeat: no-repeat;
padding: 30px;
background-size: 104%;
}

.img-daily-habits{
background-image: url(../imgs/2.png);
height: 300px; background-repeat: no-repeat;
padding: 30px;
border-radius: 10px;
background-size: 104%;
}

.img-sleep{
background-image: url(../imgs/3.png);
height: 300px; background-repeat: no-repeat;
padding: 30px;
border-radius: 10px;
background-size: 104%;
}

.img-Blood-Glucose{
background-image: url(../imgs/4.png);
height: 300px; background-repeat: no-repeat;
padding: 30px;
border-radius: 10px;
background-size: 104%;
}

.img-weight{
background-image: url(../imgs/4.png);
height: 300px; background-repeat: no-repeat;
padding: 30px;
border-radius: 10px;
background-size: 104%;
}
.main-content{
  position: relative;
}
.overlay {
  position: absolute;
  background: #000000;
  width: 100%;
  height: 280px;
  opacity: 0.7;
}
.main-content h4{
  color: #ffffff;
  text-align: center;
  padding-top: 10px;
}

.main-content h1{
  color: #ffffff;
  text-align: center;
  font-size: 30px;
  padding-top: 50px;
}

.img-Calories{
background-image: url(../imgs/calories.png);
height: 300px; background-repeat: no-repeat;
padding: 30px;
border-radius: 10px;
}

.main-content a{
  text-decoration: none;
  color: #000000;
  font-weight: 400;
}
.vitals-content{
  background-image: url(../imgs/running.png);
  background-repeat: no-repeat;
  min-height: 380px;
  padding: 20px;
  border-radius: 10px;

}

.upcoming-content{
  background-color: #eeeeee;
  border-radius: 10px;

}

.upcoming-content h4{
  font-weight: 600;
  padding: 20px 0 20px 20px;
  color: #C95715;
  text-transform: uppercase;

}
.btn-primary{
  background-color: #0560b8;
  border: none;
  color: #ffffff;
  box-shadow: none;
}

.btn-primary:hover{
background-color: #000000;
color: #ffffff;
}
.btn-primary:focus{
  background-color: #0560b8;
  border: none;
  color: #ffffff;

  box-shadow: none;
}

.card-body{
 background-color: #eeeeee;}
.Progress-content h6{
    background-position: center;
    display: block;
    float: left;
    overflow: hidden;
    position: relative;
    font-size: 25px;
    padding-top: 30px;
    padding-right: 40px;
    font-weight: 500;
}
.health-goals{
  margin-top: 30px;
  min-height: 300px;
  padding: 20px;
  border-radius: 10px;
  background-color: #fff6f1;
}
.health-goals h1{
  font-size: 42px;
}
.health-goals li{
  list-style-type: circle;
  font-size: 20px;
}
.journey-body{
  margin-top: 10px;
  height:270px;
  padding: 20px 20px;
  justify-content: end;
  background-color: #ffe4d4;
  border-radius: 10px;
}
.journey-body h4{
  padding-top: 10px;
}
.journey-body a:hover{
  cursor: pointer;
}
.Supplements-content{
  background-color: #cdcdcd
}

.Supplements-body li{
  list-style-type: square;
}
.health-goals-survey{
  background-image: url(../imgs/health-goals.png);
  background-repeat: no-repeat;
  margin-top: 30px;
  min-height: 300px;
  padding: 20px;
  border-radius: 10px;
}
.underline{
  text-decoration: underline;
}
.small-headings{
  background-color: #C95715;
  text-align: left;
  padding: 10px 5px 10px 5px;
  min-width: 100px;
  color: #ffffff;
  border-radius: 5px;
}
.small-headings_p{
  padding: 10px 0px 10px 0px;
}
li.dot{
  list-style: none;
  margin-left: 5px;
  font-weight: 500;
}

.Supplements{
  background-image: url(../imgs/supplements.png);
  border-radius: 10px;
  margin-top: 30px;
  height:350px;
  color: #000000;
}
.pl5{
  padding-left: 5px !important;
}

/* ....2nd Page... */


.col-lg-6{
  flex: 0 0 auto;
    width: 47%
}

.ms-auto{
  margin-left: auto;
}
.graph-img-left{
 width: auto;
}
.graph-img-right{
  width: auto;

 }

 /* ........Table........ */


 .thead{
  background-color: #002B39;
 }
 .table thead th{
  color: #D6DBFF;
 }
 .card{
  margin-top: 20px;
 }


 .user-bio{
background-color: #ededed;
padding: 20px 30px 20px 20px;
margin-left: 107px;
border-radius: 10px;
 }

 .user-links span{
  color: #000000;
  font-weight: 500;
 }

 .user-links a{
  color: rgb(51, 51, 51);
 }

 .user-bio .border-bottom{
  border: 1px solid #898989;
 }

 .main-right-bio{
  border: 1px solid #a7a7a7;
  border-radius: 10px;
 }

 .bio-p{
  padding: 20px;
 }

 .border-bio{
  border: 1px solid #0560b8;
 }
 #formFile{

 }
.bio-content{
  background-color: #fff;
  border-radius: 10px;
}
 .bio-content .form-control{
  border: 1px solid #c4c4c4;
  border-radius: 10px;
 }

 .bio-content .form-select{
  border: 1px solid #c4c4c4;
  border-radius: 10px;

 }

 .bio-feild{
  padding: 40px 30px 50px 30px;
 }

 .box{
  background-color: #c95715;
  padding: 10px;
 }

 .right-margin{
  margin-left: 10px;
  padding-left: 20px;
  padding-right: 20px;
 }

 .Advisors-Content{
  margin-left: 30px;
 }

 /* medical-history start */

 .medical-history{
  border: 1px solid #0560b8;
  border-radius: 10px;
  background-color: #fff;
 }

 .medical-history h4{
padding: 20px;
 }

 .medical-border{
  border-bottom: 1px solid #0560b8;
 }

 .medical-feild{
  padding: 30px;
 }

 .medical-feild .form-control{
  border: 1px solid #CDCDCD;
 }

 .navbar-expand-lg .navbar-nav .nav-link{
  padding-top:0;
  padding-bottom: 0;
 }


 .appointment-user img{
  border-radius: 50%;
 }

 .appointment-border{
  border-bottom: 1px solid #6d6d6d;
 }

 .appointment-feild{
  padding: 30px;
 }

 .appointment-user table{
  width: 100%;
  border-radius: 10px;

 }
 .appointment-user table th{
  color: #fff;
  font-weight: bold;

 }

 .bold{
  font-weight: 500;
 }

 .icon-green{
  color: #5ACA67;
 }
 .icon-red{
  color: #F0746B;
 }

.appointment-user table:nth-child(odd) {
  background-color: #fff;
  margin-bottom: 10px;
  position: relative;
  border: 1px solid #0560b8;

}
 .appointment-user table:nth-child(even){
background-color: #f7f7f7;
  margin-bottom: 10px;

 }




 .appointment-user th,td{
  padding: 10px;

 }
 .border-none{
  border-left: none;
 }


 .col-form-label{
  color: #686868;
 }

 .form-check-label{
  color: #686868;
 }
 .form-check-input{
  border: 1px solid #0560b8;
 }

 .form-check-input:checked{
background-color: #0560b8;
border: 1px solid #0560b8;
box-shadow: none;
 }
.backdrop{
  position: fixed !important;
  opacity: 0.5;
}
.cursor{
  cursor: pointer;
  text-decoration: none;
  color : #0560b8;
}
.cursor-white{
  cursor: pointer;
  text-decoration: none;
  color : #fff
}
.ellipsis{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width:300px
}
.comments{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width:250x
}
.audio_list_ellipsis{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width:250px
}
.ml5{
  margin-left: 5px;
}
.ml10{
  margin-left: 2.5rem;
}
.index-img img{
  border-radius: 10px;
  width: 200px !important;
}
.main-content-index{
  background-color: #fff;
  height: 280px;
  padding: 20px;
}

/********************* Home Work *******************/
.nav-pills .nav-link.active{
  background-color: #006180;
  color: #fff;
}
.nav-link:hover{
  color: inherit;
}
.nav-pills .nav-link{
  color: #000000;
}

.topic-bg-right .form-control{
  border:1px solid #a5a5a5;
}

.accordion-button{
  border-bottom: 1px solid #6d6d6d;
  padding: 10px;
  color: #000;
}
.accordion-button:focus{
  box-shadow: none;
  border-bottom: 1px solid #6d6d6d;
}
.upcoming-content .nav-pills .nav-link{
  text-align: left;

  border-radius: 0;
}
.nav-pills .nav-link{
  text-align: left;

  border-radius: 0;
}
.accordion-body{
  padding-left: 0px;
  padding-top: 10px;
  background-color: #fff;
}

.accordion-button:not(.collapsed){
  background-color: #C95715;
  color: #fff;
}
.accordion-button::after{
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e")
}
.accordion-button:not(.collapsed)::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e")
}
.accordion-item:last-of-type .accordion-button.collapsed{
  border-radius: 0;
}
.btn-danger{
  background-color:#dc3545;
}

.add-visitors{
  border: 1px solid #5d5d5d;
  padding: 20px;
  background-color: #fff;
  border-radius: 10px;
   box-shadow: 0px 3px 11px -6px rgba(10, 22, 70, 0.3), 0px 0px 4px 2px rgba(10, 22, 70, .06) !important;
   margin-top: 110px;
}
.btn-primary{
  background-color: #006180;
}
.adviser-btn .btn-primary{
  margin-right: 30px;
  margin-bottom: 30px;
  width: 230px;
  }
  .btn-primary:hover{
    background-color: #fc6006;
    color: #fff;
  }
.advisor-selected{
  background-color: #fc6006;
  color: #fff;
}
