

.tab-treatment {margin:0px;width:100%;display: flex; gap:0px;   justify-content:left;  }
 

/* Style the buttons inside the tab */
.tab-treatment button {
    display: block;position:relative;
    background:#ffffff; 
	border: 1px solid #D1D1D1;
    color:#000000;
    padding:12px 30px;
    width:max-content;
    outline: none;
    text-align:center;
    cursor: pointer;
    transition: 0.3s;
    font-size:18px;
}
/* Change background color of buttons on hover */

.tablinks .fa{color:#ffffff;}
.tab-treatment button.active.fa{color:#ffffff;}
/* Create an active/current "tab button" class */
.tab-treatment button.active {color:#ffffff; background: #BA1717; }
.tab-treatment button.active::before {
  opacity: 1;
}
.tab-treatment button::before{
  position: absolute;
  bottom: -14px;
  left: 50%;
  content: "";
  border-top: 15px solid #BA1717;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  transform: translateX(-50%);
  opacity:0;
  transition: 0.5s all ease;
}

/* Style the tab content */
.tabcontent {
  padding:20px 12px;
  width:100%;
  border-left: none;
  height: 100%;
  display: none;
}
.tabcontent1 {
  display: none;
}

.home-patient-boxleft .tab-treatment {margin:0px auto;width:100%;display: flex; flex-direction: column; gap:30px;   justify-content: left;}
.home-patient-boxleft .tab-treatment button {display:flex; gap:20px; position:relative;background:#ffffff; padding:12px 15px;width:100%;border: none;outline: none;text-align:left;cursor: pointer;transition: 0.3s;font-size:18px;border-radius:8px;position:relative; border: 1px solid #fff;border-radius:12px; padding:30px 20px;}
.home-patient-boxleft .tab-treatment img{width:75px; height:80px; border-radius:25px;}
.home-patient-boxleft .tab-treatment h4{display:block; font-size:18px; color:#444; font-weight: bold;}
.home-patient-boxleft .tab-treatment h4 span{display:block; padding-top:10px; font-size:16px; color:#444; font-weight:normal;}
.home-patient-boxleft .tab-treatment button.active {background: rgba(104, 185, 46, 0.05); border: 1px solid #68B92E;border-radius:12px;}


.checkout-mid-left .tabcontent{height:auto; padding:0px;}
.checkout-mid-left .tab-treatment{margin:10px auto;width:100%;display: flex; flex-direction: column; gap:30px;   justify-content: left;}
.checkout-mid-left .tab-treatment button {width:100%; display:flex; gap:10px; position:relative;background:#ffffff; border:0px; border-bottom: 1px solid #ffffff !important; border-radius:0px; margin:   0px auto; padding: 10px 20px 10px;}
.checkout-mid-left .tab-treatment h2 {font-size: 20px;display: flex; align-items: center; justify-content:left;width: 100%;color: #16181D;font-weight: 700;position: relative; padding-left: 45px;}
.checkout-mid-left .tab-treatment h2 img {width: auto;height: 35px;position: absolute;top: 0px;left: 0px;}
.checkout-mid-left .tab-treatment button.active {border-bottom: 1px solid #DEE2DB !important; padding: 10px 20px 20px;}
.checkout-mid-left .tab-treatment button.active {color:#16181D;}


@media screen and (max-width:880px) {
.tabcontent{padding-top:10px; padding-left:0px; padding-right:0px;}
.tab-treatment{ width:100%;height:100%; margin:0px;}
.tab {width:100%; height:100%; margin-left:0%; margin-top:0px; border-bottom:0px solid #444; display:none;} 

.tab-treatment{flex-wrap: initial;justify-content: left;overflow-x: scroll;padding:30px 10px;overflow-y:hidden;gap: 15px;}
.tab-treatment button{flex: 0 0 auto;}
.examination-scheme-right .tabcontent{padding-right:20px;}
 
}