                .modal-doctor-portal {
   position: fixed;
   inset: 0;
   z-index: 9999;
   align-items: center;
   justify-content: flex-end;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.modal-doctor-portal.is-active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.ant-modal-mask {
   position: absolute;
   inset: 0;
   background: rgba(0, 0, 0, 0.5);
   backdrop-filter: blur(0.25rem);
}

.ant-modal-wrap {
   position: relative;
   z-index: 10;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 100%;
   height: 100%;
}

.modal-doctor-content {
    background: #ffffff;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    height: 100%;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.modal-doctor-portal.is-active .modal-doctor-content {
    opacity: 1;
}

.modal-scroll-area {
   overflow: hidden;
   flex: 1;
   display: flex;
   flex-direction: column;
   /*scrollbar-width: none;*/
   /*-ms-overflow-style: none;*/
}

@media (min-width: 640px) {
   .modal-doctor-content {
      width: 87.5rem;
      max-height: 80vh;
      border-radius: 1.25rem;
      padding: 2.25rem 3.75rem;
   }

   .modal-mobile-header {
      display: none;
   }

   .info-flex-container {
      display: flex;
      align-items: center;
   }

   .avatar-block {
      width: 15.9375rem;
      height: 20.125rem;
      position: relative;
      flex-shrink: 0;
   }

   .avatar-img {
      width: 100%;
      height: 100%;
      object-fit: contain;
      position: absolute;
      top: 0rem;
      left: 0rem;
   }

   .text-info-block {
      flex: 1;
      z-index:2;
   }

   .doctor-name-title {
      font-size: 1.75rem;
      line-height: 2.625rem;
      margin-bottom: 0.25rem;
   }

   .section-details-grid {
      display: flex;
      padding: 1.25rem 2rem 0;
      background: linear-gradient(180deg, rgba(156, 217, 255, 0.15) 0%, rgba(255, 255, 255, 0) 100%);
      border-radius: 0.75rem;
   }

   .grid-column {
      flex: 1;
   }

   .grid-column:first-child {
      margin-right: 3.75rem;
   }

   .column-title {
      font-size: 1rem;
      margin-bottom: 0.625rem;
   }

   .modal-doctor-close-btn {
      position: absolute;
      top: 0.875rem;
      right: 1rem;
      width: 2.5rem;
      height: 2.5rem;
      background: rgba(17, 17, 100, 0.1);
      border: none;
      border-radius: 50%;
      cursor: pointer;
      z-index: 20;
      display: flex;
      align-items: center;
      justify-content: center;
      color: rgba(4, 24, 33, 0.6);
   }

   .position-text {
      font-size: 0.75rem;
      font-style: normal;
      font-weight: 500;
      line-height: 150%;
   }
   .position-text.pc {
      display: block;
   }
   .position-text.mb {
      display: none;
   }
}

.position-text.pc {
   display: none;
}
.position-text.mb {
   display: block;
}

@media (max-width: 640px) {
   .modal-doctor-content {
      width: 100%;
      border-radius: 0;
   }

   .modal-scroll-area {
      padding: 0 1rem;
      padding-bottom: 2.5rem;
      overflow:auto;
      scrollbar-width: none; 
      -ms-overflow-style: none;
   }

   .modal-mobile-header {
      height: 3.125rem;
      padding: 0 1rem;
      display: flex;
      align-items: center;
      justify-content: space-between;
      border-bottom: 0.0375rem solid rgba(22, 22, 22, 0.2);
   }

   .mobile-header-title {
      color: #1991c7;
      font-weight: 700;
      font-size: 1.125rem;
   }

   .modal-doctor-close-btn {
      position: absolute;
      top: 0.625rem;
      right: 1rem;
      width: 1.875rem;
      height: 1.875rem;
      background: rgba(17, 17, 100, 0.1);
      border: none;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      z-index: 100;
   }

   .section-main-info {
      padding: 0.625rem 0rem;
   }

   .info-flex-container {
      display: flex;
      align-items: center;
   }

   .avatar-block {
      width: 7.5rem;
      height: 10.58825rem;
      position: relative;
      margin-right: 0.625rem;
      flex-shrink: 0;
   }

   .union-avt {
      display: none;
   }

   .avatar-img {
      width: 100%;
      height: 100%;
      object-fit: contain;
   }

   .doctor-name-title {
      font-size: 0.875rem;
      margin-bottom: 0.2rem;
      line-height: 1.3125rem;
   }

   .experience-highlight {
      font-size: 1.25rem;
      line-height: 1.75rem;
      text-align: center;
      margin-top: 0.875rem;
      text-transform: uppercase;
   }

   .section-details-grid {
      padding: 0.75rem;
      border-radius: 0.75rem;
      background: linear-gradient(180deg, rgba(156, 217, 255, 0.15) 0%, rgba(255, 255, 255, 0.1) 100%);
   }

   .grid-column {
      margin-bottom: 1rem;
   }

   .name-badge-container svg {
      width: 1.25rem;
   }

   .name-badge-container {
      padding: 0.5rem 0.625rem !important;
   }
}

.name-badge-container {
   background: linear-gradient(90deg, #134a9b 0%, #1b91c7 100%);
   border-radius: 0.625rem;
   padding: 0.5rem 1.25rem;
   display: inline-flex;
   flex-direction: column;
}

.doctor-name-title {
   color: #ffffff;
   font-weight: 700;
   margin: 0;
}

.position-flex {
   display: flex;
   align-items: center;
}

.icon-octagon {
   width: 1.25rem;
   height: 1.25rem;
   margin-right: 0.5rem;
}
.icon-octagon svg {
    width:100%;
    height:100%;
}

.position-text {
   color: rgba(255, 255, 255, 0.8);
   font-size: 1rem;
   font-weight: 500;
}

.experience-highlight {
   color: #08354a;
   font-size: 1.25rem;
   font-weight: 600;
   margin: 1rem 0;
     text-transform: uppercase;
   line-height: 140%;
}

.description-text {
  color: var(--Text-Body-DarkBlue-70, rgba(8, 53, 74, 0.7));

  /* PC/14/14-R */
  font-family: "Google Sans";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
  text-align: justify;
  margin-bottom:1.5rem;
  max-height:15rem;
  overflow:auto;
  padding-right:0.75rem;
}
.description-text p{
  padding-bottom: 0.875rem;
    
}
.description-text p:last-child{
  padding-bottom: 0;
}
.description-text strong {
  color: var(--Text-Body-DarkBlue-100, #08354a);
  font-weight: 500;
}
.column-title {
   color: #0897d8;
   font-weight: 700;
   padding-top:0.3rem;
}

.column-content {
   color: rgba(8, 53, 74, 0.7);
   font-size: 0.875rem;
   line-height: 1.31rem;
   text-align: justify;
}

.bold-text {
   color: #08354a;
   font-weight: 700;
}

.list-style ul {
   padding-left: 0;
   list-style: none;
   margin: 0;
}

.list-style li {
   margin-bottom: 0.5rem;
}

.avatar-gradient-overlay {
   position: absolute;
   bottom: 0;
   left: 0;
   right: 0;
   height: 50%;
   background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, white 100%);
}

.decor-shape-bg {
   width: 28rem;
   height: 19rem;
   position: absolute;
   left: 18.5rem;
   top: 17.5rem;
   background: rgba(0, 0, 0, 0.05);
   transform: rotate(180deg);
   opacity: 0.2;
   pointer-events: none;
}

.show-on-mobile {
   display: none;
}

@media (min-width: 641px) {
   .hide-on-mobile {
      display: block;
      
   }

   .section-details-grid {
       flex:1;
      display: flex;
      padding: 1.25rem 2rem 0;
      background: linear-gradient(180deg, rgba(156, 217, 255, 0.15) 0%, rgba(255, 255, 255, 0) 100%);
      border-radius: 0.75rem;
      overflow: hidden;
      scrollbar-width: none;
      -ms-overflow-style: none;
   }

   .section-details-grid::-webkit-scrollbar {
      display: none;
   }

   .grid-column {
      flex: 1;
      padding-bottom: 1.5rem;
      overflow:auto;
      padding-right:0.75rem;
   }

   .grid-column:first-child {
      margin-right: 3.75rem;
   }
}
.column-content strong{
    color: var(--Text-Body-DarkBlue-100, #08354A);
    font-weight: 700;
    line-height: 150%;
}
@media (max-width: 640px) {
    .experience-highlight {
        max-width:11rem;
        margin:0;
        margin-top:0.875rem;
    }
    .text-info-block{
        display:flex;
        flex-direction: column;
       justify-content: center;
       align-items: center;
       flex:1;
    }
    .list-style li {
        margin-bottom:0.12rem !important;
    }
    .column-content {
        color: var(--Text-Body-DarkBlue-70, rgba(8, 53, 74, 0.70));
        text-align: justify;
        font-family: "Google Sans";
        font-size: 0.75rem;
        font-style: normal;
        font-weight: 400;
        line-height: 150%; /* 1.125rem */
    }
    .column-title {
        margin-bottom:0.5rem;
        padding-top:0.1rem;
    }
   .description-text {
        color: var(--Text-Body-DarkBlue-70, rgba(8, 53, 74, 0.70));
        font-family: "Google Sans";
        font-size: 0.75rem;
        font-style: normal;
        font-weight: 400;
        line-height: 150%;
        max-height:unset;
        padding-right:0;
   }
   .description-text strong {
        color: var(--Text-Body-DarkBlue-100, #08354A);
      
        font-weight: 500;
   }
    .position-text {
        color: var(--White-80, rgba(255, 255, 255, 0.80));
        font-family: "Google Sans";
        font-size: 0.75rem;
        font-style: normal;
        font-weight: 500;
        line-height: 150%; /* 1.125rem */
    }
   .hide-on-mobile {
      display: none;
   }

   .show-on-mobile {
      display: block;
      margin-top: 1rem;
   }

   .info-flex-container {
      display: flex;
      align-items: center;
   }

   .avatar-block {
      margin-right: 0.75rem;
   }

   .name-badge-container {
      width: 100%;
   }
   .list-style ul {
      padding: 0 0 0 0.75rem !important;
   }
   .list-style>ul {
  
              padding-left: 1.3rem !important;
   }
}

.list-style ul {
   list-style-type: disc;
   margin: 0;
   padding: 0 0 0 1rem;
   padding-left: 1.1rem;
}

.list-style li {
   margin-bottom: 0.5rem;
   display: list-item;
}

.detail-docter__container-two--right__content {
   list-style-type: disc;
}
