/* Doctor detail */
.col-8 ul ul {
  list-style-type: circle;
  margin-block-start: 0px;
  margin-block-end: 0px;
  padding-inline-start: 16px;
}

.col-8 ul ul li {
  list-style: disc;
}

.doctors__detail-img {
  position: relative;
  overflow: hidden;
  height: 100%;
  height: 380px;
}

.doctors__detail-img .doctor-img-test {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* max-height: 390px; */
  left: 50%;
  top: 0;
  transition: all 0.2s linear;
  transform: scale(1) translateX(-50%);
}

.detail__mobile {
  display: none;
}

.section__detail {
  margin-top: 160px;
}

.doctors__item-img {
  position: relative;
  overflow: hidden;
  height: 100%;
  /* height: 320px; */
}

.doctors__item-img::before,
.doctors__item-img::after {
  content: none;
  visibility: hidden;
  display: none;
}

.doctors__item-thumbnail:hover .doctors__item-img {
  filter: unset;
  box-shadow: none;
}

.doctors__item-thumbnail:hover .doctor-img-test {
  transform: scale(1) translateX(-50%);
}

.doctors__item-img .doctor-img-test {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* max-height: 390px; */
  left: 50%;
  top: 0;
  transition: all 0.2s linear;
  transform: scale(1) translateX(-50%);
}

.button__detail--top {
  padding-bottom: 17px;
  padding-top: 29px;
  transform: scale(1.0);
  transition: 0.3s linear all;
}

.button__detail--bottom {
  transform: scale(1.0);
  transition: 0.3s linear all;
}

.button__detail--top:hover,
.button__detail--bottom:hover {
  transform: scale(1.04);
  transition: 0.3s linear all;
}

.btn__booking--detail {
  align-items: center;
  border: 0;
  background-color: var(--primary-color);
  border-radius: 32px;
  /* padding: 16.5px 73px 18.5px 73px; */
  padding: 13px 36px;
  transition: 0.3s linear all;
  color: #f7f3eb;
  width: 100%;
  font-size: 20px;
  line-height: 28px;
  font-family: 'Be Vietnam Pro-Medium';
  font-weight: 500;
}

.button__detail--bottom a {
  display: inline-block;
  align-items: center;
  border: 0;
  text-align: center;
  background-color: #897cf4;
  border-radius: 32px;
  /* padding: 16.5px 73px 18.5px 73px; */
  padding: 16px 36px;
  transition: 0.3s linear all;
  color: #f7f3eb;
  font-size: 20px;
  width: 100%;
  font-family: 'Be Vietnam Pro-Medium';
}

.doctor__content {
  display: flex;
  flex-direction: column;
  gap: 24px;
  margin-bottom: 125px;
  margin-left: 50px;
}

.doctor__content .doctor__content--name h3 {
  font-size: 30px;
  color: var(--primary-color);
  font-family: 'Megante';
  letter-spacing: 0.6px;
  line-height: 50px;
  font-weight: 400;
}

.doctor__content .doctor__content--name h4 {
  font-size: 20px;
  line-height: 29px;
  color: var(--primary-color);
  font-family: 'Be Vietnam Pro-Medium';
}


.doctor__detail--content ul {
  list-style-type: disc;
  list-style: inside;
}



.doctor__detail--content ol {
  list-style-type: circle;
}

.doctor__detail--content .doctor__tetail--dot {

  list-style-type: disc;

  list-style: inside;

}



.doctor__detail--content .doctor__tetail--circle {

  list-style-type: circle;

}

/* Dùng chung cho toàn bộ title của doctor detail */

.doctor__content .doctor__detail--title {
  font-size: 23px;
  letter-spacing: 0.46px;
  line-height: 40px;
  font-family: 'Megante';
  color: #897cf4;
  font-weight: 400;
}

/* Dùng chung cho toàn bộ sub của doctor detail */

.doctor__content .doctor__detail--sub {
  font-size: 23px;
  letter-spacing: 0.46px;
  line-height: 40px;
  font-family: 'Megante';
  color: #39398e;
}

.doctor__content .doctor__detail--content {
  font-weight: 300;
  color: var(--primary-color);
  line-height: 28px;
  font-size: 16px;
  font-family: 'Be Vietnam Pro-Light';
}

.doctor__detail--content ul li {
  font-weight: 300;
  font-family: 'Be Vietnam Pro-Light';
}


/* @media (min-width: 1024px) {
  .detail__desktop {
    display: none;
  }

  .detail__mobile {
    display: inline;
  }
} */


.committed {
  display: none;
}


/* Lam rieng CSS cho content */

.col-8 p {
  font-weight: 300;
  color: var(--primary-color);
  line-height: 28px;
  font-size: 16px;
  font-family: 'Be Vietnam Pro-Light';
}

.col-8 strong span {
  font-size: 23px;
  letter-spacing: 0.46px;
  line-height: 71px;
  font-family: 'Megante';
}

.col-8 h2 strong {
  font-size: 23px;
  letter-spacing: 0.46px;
  line-height: 71px;
  font-family: 'Megante';
  color: #897cf4;
  font-weight: 400;
}

.col-8 ul {
  font-weight: 300;
  color: var(--primary-color);
  line-height: 28px;
  font-size: 16px;
  font-family: 'Be Vietnam Pro-Light';
}

.doctor__content ul li {
  display: list-item;
  list-style: inside;
  margin-left: 24px;
}


.doctor__content ul li ul li::marker {
  color: var(--subbullet-color);
}


.col-md-8 p {
  font-weight: 300;
  color: var(--primary-color);
  font-size: 12px;
  line-height: 19px;
  margin-bottom: 20px;
  font-family: 'Be Vietnam Pro-Light';
}

.col-md-8 strong span {
  font-size: 12px;
  line-height: 19px;
  margin-bottom: 10px;
  letter-spacing: 0.46px;
  font-family: 'Megante';

}


.col-md-8 h2 {
  font-size: 12px;
  color: #897cf4;
  line-height: 19px;
  margin-bottom: 10px;
}


.doctor__detail--exp {
  font-size: 12px;
  line-height: 19px;
  margin-bottom: 10px;
  color: #39398e;
}



.col-md-8 h2 strong {
  font-size: 12px;
  line-height: 19px;
  margin-bottom: 10px;
  letter-spacing: 0.46px;
  font-family: 'Megante';
  color: #897cf4;
  font-weight: 400;
}

.col-md-8 ul {
  font-weight: 300;
  color: var(--primary-color);
  font-size: 12px;
  line-height: 19px;
  margin-bottom: 4px;
  font-family: 'Be Vietnam Pro-Light';
}

@media (max-width: 1024px) {
  .detail__desktop {
    display: none;
  }

  .detail__mobile {
    display: inline;
  }


  .committed {
    display: block;
  }




  .detail__content {
    padding: 30px 58px 0px;
  }

  .detail__content .detail__content--title {
    font-size: 12px;
    line-height: 18px;
    text-align: center;
    color: #39398e;
    font-family: 'Be Vietnam Pro-Light';
  }

  .section__detail {
    margin-top: 46px;
  }

  .wrap-flex {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 18px;
  }

  .wrap-flex .doctorInfor__detail--name {
    font-size: 12px;
    letter-spacing: 0.24px;
    /* line-height: 30px; */
    line-height: 18px;
    font-family: "Megante'";
    color: var(--primary-color);
  }

  .wrap-flex .doctorInfor__detail--position {
    font-size: 10px;
    color: #39398e;
    line-height: 15px;
    font-family: 'Be Vietnam Pro-Medium';
    padding-bottom: 35px;
    font-weight: 500;
  }

  .wrap {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }

  .btn__booking--detail {
    padding: 5px 39px;
    font-size: 9px;
    line-height: 8px;
    border-radius: 22px;
  }

  .button--global {
    border: 0;
    border-radius: 22px;
    padding: 12px 20px;
    background-color: var(--primary-color);
    color: #fff;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    width: 100%;
  }

  .doctorInfor__detail--btns .btn-booking {
    margin-bottom: 10px;
    font-family: 'Be Vietnam Pro-Medium', sans-serif;
  }

  .doctorInfor__detail--btns .btn-search {
    background-color: #897cf4;
    font-family: 'Be Vietnam Pro-Medium', sans-serif;
  }

  .doctor__content {
    margin-left: 20px;
    margin-top: 35px;
    margin-bottom: 80px;
  }

  .doctor__content .doctor__detail--title,
  .doctor__content .doctor__detail--sub {
    font-size: 12px;
    color: #897cf4;
    line-height: 19px;
    margin-bottom: 10px;
  }

  .doctor__content .doctor__content--experience .doctor__detail--title span {
    color: #39398e;
  }

  .doctor__content .doctor__detail--content {
    font-size: 12px;
    line-height: 19px;
    margin-bottom: 20px;
  }


  .doctor__content {
    gap: 8px;
  }

  .doctor__content ul li {
    margin-left: 12px;
  }


  .col-md-8 ul ul {
    padding-left: 8px;
  }




}

@media (min-width: 768px) and (max-width: 1024px) {
  .wrap-flex {
    grid-template-columns: none;
  }

  .wrap-flex .doctorInfor__detail--position {
    padding-bottom: 15px;
  }

  .wrap-flex .doctorInfor__detail--name {
    line-height: 20px;
  }

  .doctor__content {
    margin-top: 0px;
  }




}

@media (max-width: 1024px) {
  .banner .section__banner-page .doctor-content {
    top: 20%;
    left: unset;
    transform: unset;
    right: 20%;
  }
}

@media (max-width: 768px) {
  .banner .section__banner-page .doctor-content {
    top: 5%;
    right: 20%;
  }
}

@media (max-width : 576px) {
  .wrap-flex .doctorInfor__detail--position {
    padding-bottom: 42px;
  }


  .button--global {
    border-radius: 22px;
    padding: 10px 0px;
    font-size: 12px;
    line-height: inherit;
    line-height: 18px;
  }


  .doctor__content {
    margin-left: 0px;
  }
}


@media (max-width: 400px) {
  .wrap-flex {
    grid-gap: 12px;
  }


  .button--global {
    border-radius: 22px;
    padding: 4px 0;
    font-size: 10px;
  }

}