.book-slot{padding-left: 40px; padding-right: 40px;}
.doctor-slot{justify-content: flex-start; gap: 10px;}
.doctor-slot-img{width: 115px; border-radius: 10px; overflow: hidden; line-height: 0;}
.doctor-slot-text .parassmheading{color: var(--light-black); font-weight: 700;}
.doctor-slot-text p{color: var(--gray-color);}

.book-date{padding-top: 50px; gap: 80px;}
.book-date .paraslgheading{color: var(--light-black); font-weight: 700; text-transform: capitalize; margin-bottom: 30px;}
.book-date-left, .book-date-right{width: 35%;}
.book-date-right{width: 55%;}
.book-date-right .time-slot{color: var(--blue-color);}

.book-time-list{grid-template-columns: repeat(6, 1fr); gap: 10px;}
.book-time-list .time-slot{width: 100%; font-size: 14px; color: var(--gray-color); height: 40px; background: var(--white-color); border-radius: 50px; display: flex; align-items: center; justify-content: center; padding: 2px 10px; border: 1px solid #DDDBDB; cursor: pointer;}
.book-time-list .time-slot.active, .book-time-list .time-slot:hover{border-color: var(--blue-color); background: var(--blue-color); color: var(--white-color);}
.book-time-list .time-slot:disabled, .book-time-list .time-slot:hover:disabled{color: #DADBDB; border-color: #DDDBDB; background: var(--white-color);} 
.book-date-bottom .anchor-bg-btn{width: 250px;}
.p-slot{
  border-bottom: 1px solid #ddd;
  margin: 20px 0;
  padding-bottom: 10px;
}
.calender{width: 100%; background: var(--white-color); box-shadow: 0 0 15px rgba(0,0,0,.15); position: relative; border-radius: 12px; overflow: hidden;}
.calender .anchor-button{width: 100%; justify-content: center; padding: 20px; background: var(--blue-color);}
.calender .anchor-button{color: var(--white-color);}
.calender .anchor-button span{background: var(--white-color);}
.calender .anchor-button span::after{border-top: 3px solid var(--light-black); border-right: 3px solid var(--light-black);}

.book-radio-group{width: 100%; justify-content: center; display: flex; align-items: center;justify-content: center; gap: 30px;}
.book-radio-group label{font-size: 18px; color: var(--light-black); position: relative; display: flex; align-items: center; cursor: pointer;}
.book-radio-group input{width: 20px; height: 20px; border: 2px solid var(--gray-color); border-radius: 50%; margin: 0; margin-right: 20px;}

.book-tab{width: 100%;}
.book-tab ul{padding: 0; margin: 0; list-style: none; display: flex; align-items: center; justify-content: center; gap: 30px;}
.book-tab ul li{font-size: 18px; color: var(--light-black);}
.book-tab ul li a{text-decoration: none; color: var(--light-black); position: relative; padding-left: 40px; cursor: pointer;}
.book-tab ul li a::after{content: ''; position: absolute; top: 0; bottom: 0; left: 0; margin: auto; width: 20px; height: 20px; border-radius: 50%; border: 2px solid var(--gray-color);}
.book-tab ul li.active a, .book-tab ul li:hover a{color: var(--blue-color);}
.book-tab ul li.active a::after, .book-tab ul li:hover a::after{background: var(--blue-color); border-color: var(--blue-color);}
/* HTML: <div class="loader"></div> */
.loader {
    width: 50px;
    aspect-ratio: 1;
    border-radius: 50%;
    background: 
      radial-gradient(farthest-side,var(--blue-color) 94%,#0000) top/8px 8px no-repeat,
      conic-gradient(#0000 30%,var(--blue-color));
    -webkit-mask: radial-gradient(farthest-side,#0000 calc(100% - 8px),#000 0);
    animation: l13 1s infinite linear;
  }
  @keyframes l13{ 
    100%{transform: rotate(1turn)}
  }
  
  .book-appointment-button-wrapper{
    margin-top: 30px;
  }
  .book-appointment-button-wrapper .book-date-bottom{
    margin-top: 20px;
  }


.accordion-item .accordion-header{border-bottom: 1px solid var(--slight-gray-color); padding: 15px 0; cursor: pointer;}
.accordion-item .accordion-header .parasmdheading{width: 90%; color: var(--light-black); font-weight: 700;}
.accordion-item .accordion-arrow{width: 18px; height: 14px;}
.accordion-item .accordion-arrow .arrow-blue{display: none;}
.accordion-item .accordion-content{padding: 15px 0; display: none;}

.accordion-item.opened .accordion-content{display: block;}
.accordion-item.opened .accordion-arrow .arrow-blue{display: block; transform: rotate(180deg);}
.accordion-item.opened .accordion-arrow .arrow-black{display: none;}


  @media screen and (max-width:1350px) {
    .book-time-list{grid-template-columns: repeat(4, 1fr);}
    }

@media screen and (max-width:1199px) {
.book-slot{padding-left: 0px; padding-right: 0px;}
.book-date{padding-top: 30px; gap: 30px;}
.book-date-left, .book-date-right{width: 40%;}
.book-date-right{width: 50%;}

}
@media screen and (max-width:991px) {
.book-time-list{grid-template-columns: repeat(3, 1fr);}
}
@media screen and (max-width:767px) {
.book-date-left, .book-date-right{width: 100%;}
.book-date .paraslgheading{margin-bottom: 20px;}
.book-tab ul{gap: 15px;}
.book-tab ul li{font-size: 16px;}
.book-tab ul li a{padding-left: 25px;}
.book-tab ul li a::after{width: 15px; height: 15px; top: 2px;}
}