@font-face {
   font-family: "Baloo2";
   src: url("../../fonts/Baloo2/Baloo2-Bold.eot");
   src: url("../../fonts/Baloo2/Baloo2-Bold.eot?#iefix") format("embedded-opentype"),
     url("../../fonts/Baloo2/Baloo2-Bold.woff2") format("woff2"),
     url("../../fonts/Baloo2/Baloo2-Bold.woff") format("woff"),
     url("../../fonts/Baloo2/Baloo2-Bold.ttf") format("truetype"),
     url("../../fonts/Baloo2/Baloo2-Bold.svg#Baloo2-Bold") format("svg");
   font-weight: bold;
   font-style: normal;
   font-display: swap;
 }

 @font-face {
   font-family: "Baloo2";
   src: url("../../fonts/Baloo2/Baloo2-SemiBold.eot");
   src: url("../../fonts/Baloo2/Baloo2-SemiBold.eot?#iefix") format("embedded-opentype"),
     url("../../fonts/Baloo2/Baloo2-SemiBold.woff2") format("woff2"),
     url("../../fonts/Baloo2/Baloo2-SemiBold.woff") format("woff"),
     url("../../fonts/Baloo2/Baloo2-SemiBold.ttf") format("truetype"),
     url("../../fonts/Baloo2/Baloo2-SemiBold.svg#Baloo2-SemiBold") format("svg");
   font-weight: 600;
   font-style: normal;
   font-display: swap;
 }

 @font-face {
   font-family: "Baloo2";
   src: url("../../fonts/Baloo2/Baloo2-Regular.eot");
   src: url("../../fonts/Baloo2/Baloo2-Regular.eot?#iefix") format("embedded-opentype"),
     url("../../fonts/Baloo2/Baloo2-Regular.woff2") format("woff2"),
     url("../../fonts/Baloo2/Baloo2-Regular.woff") format("woff"),
     url("../../fonts/Baloo2/Baloo2-Regular.ttf") format("truetype"),
     url("../../fonts/Baloo2/Baloo2-Regular.svg#Baloo2-Regular") format("svg");
   font-weight: normal;
   font-style: normal;
   font-display: swap;
 }

 @font-face {
   font-family: "Baloo2";
   src: url("../../fonts/Baloo2/Baloo2-Medium.eot");
   src: url("../../fonts/Baloo2/Baloo2-Medium.eot?#iefix") format("embedded-opentype"),
     url("../../fonts/Baloo2/Baloo2-Medium.woff2") format("woff2"),
     url("../../fonts/Baloo2/Baloo2-Medium.woff") format("woff"),
     url("../../fonts/Baloo2/Baloo2-Medium.ttf") format("truetype"),
     url("../../fonts/Baloo2/Baloo2-Medium.svg#Baloo2-Medium") format("svg");
   font-weight: 500;
   font-style: normal;
   font-display: swap;
 }

 @font-face {
   font-family: "Baloo2";
   src: url("../../fonts/Baloo2/Baloo2-ExtraBold.eot");
   src: url("../../fonts/Baloo2/Baloo2-ExtraBold.eot?#iefix") format("embedded-opentype"),
     url("../../fonts/Baloo2/Baloo2-ExtraBold.woff2") format("woff2"),
     url("../../fonts/Baloo2/Baloo2-ExtraBold.woff") format("woff"),
     url("../../fonts/Baloo2/Baloo2-ExtraBold.ttf") format("truetype"),
     url("../../fonts/Baloo2/Baloo2-ExtraBold.svg#Baloo2-ExtraBold") format("svg");
   font-weight: bold;
   font-style: normal;
   font-display: swap;
 }

 /*//////////////////////////////////////////////////////////////////
[ RESTYLE TAG ]*/

 :root {
   --primary: rgb(128, 67, 140);
   --primary-light: rgba(128, 67, 140, 0.5);
   --primary-light2: rgba(249, 245, 249, 1);
   --primary-light3: rgb(231 218 231);
 }

 * {
   margin: 0px;
   padding: 0px;
   box-sizing: border-box;
 }

 body {
   /* height: 100%; */
   font-family: "Baloo2", sans-serif;
   padding-bottom: 175px;
   position: relative;
   padding-top: 81px;
 }

 .dashboard-body {
   padding-top: 180px;
 }

 /*---------------------------------------------*/
 a {
   font-family: "Baloo2";
   font-size: 14px;
   line-height: 1.7;
   color: #666666;
   margin: 0px;
   transition: all 0.4s;
   -webkit-transition: all 0.4s;
   -o-transition: all 0.4s;
   -moz-transition: all 0.4s;
 }

 a:focus {
   outline: none !important;
 }

 a:hover {
   text-decoration: none;
   color: #333333;
 }

 /*---------------------------------------------*/
 h1,
 h2,
 h3,
 h4,
 h5,
 h6 {
   margin: 0px;
 }

 p {
   font-family: "Baloo2";
   font-size: 14px;
   line-height: 1.7;
   margin: 0px;
 }

 ul,
 li {
   margin: 0px;
   list-style-type: none;
 }

 /*---------------------------------------------*/
 input {
   outline: none;
   border: none;
 }

 textarea {
   outline: none;
   border: none;
 }

 textarea:focus,
 input:focus {
   border-color: transparent !important;
 }

 input:focus::-webkit-input-placeholder {
   color: #adadad;
 }

 input:focus:-moz-placeholder {
   color: #adadad;
 }

 input:focus::-moz-placeholder {
   color: #adadad;
 }

 input:focus:-ms-input-placeholder {
   color: #adadad;
 }

 textarea:focus::-webkit-input-placeholder {
   color: #adadad;
 }

 textarea:focus:-moz-placeholder {
   color: #adadad;
 }

 textarea:focus::-moz-placeholder {
   color: #adadad;
 }

 textarea:focus:-ms-input-placeholder {
   color: #adadad;
 }

 input::-webkit-input-placeholder {
   color: #adadad;
 }

 input:-moz-placeholder {
   color: #adadad;
 }

 input::-moz-placeholder {
   color: #adadad;
 }

 input:-ms-input-placeholder {
   color: #adadad;
 }

 textarea::-webkit-input-placeholder {
   color: #adadad;
 }

 textarea:-moz-placeholder {
   color: #adadad;
 }

 textarea::-moz-placeholder {
   color: #adadad;
 }

 textarea:-ms-input-placeholder {
   color: #adadad;
 }

 /*---------------------------------------------*/
 button {
   outline: none !important;
   border: none;
   background: transparent;
 }

 button:hover {
   cursor: pointer;
 }

 iframe {
   border: none !important;
 }

 /*//////////////////////////////////////////////////////////////////
[ Utility ]*/
 .txt1 {
   font-family: "Baloo2";
   font-size: 15px;
   color: #999999;
   line-height: 1.5;
 }

 .txt2 {
   font-family: "Baloo2";
   font-size: 15px;
   color: var(--primary);
   line-height: 1.5;
 }

 /*//////////////////////////////////////////////////////////////////
[ login ]*/

 .limiter {
   width: 100%;
   margin: 0 auto;
   background: url(../images/bg@2x.png);
   background-repeat: no-repeat;
   background-position: center;
   background-attachment: fixed;
 }

 .text-primary {
   color: var(--primary) !important;
 }

 .container-login100 {
   width: 100%;
   min-height: 100vh;
   display: -webkit-box;
   display: -webkit-flex;
   display: -moz-box;
   display: -ms-flexbox;
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
   align-items: center;
   padding: 15px;
   background: transparent;
 }

 .wrap-login100 {
   width: 390px;
 }

 .logo-container img {
   width: 200px;
   margin-bottom: 13px;
 }

 /* Thin */
 .fw-100 {
   font-weight: 100 !important;
 }

 /* Extra Light */
 .fw-200 {
   font-weight: 200 !important;
 }

 /* Light */
 .fw-300 {
   font-weight: 300 !important;
 }

 /* Regular (Normal) */
 .fw-400 {
   font-weight: 400 !important;
 }

 /* Medium */
 .fw-500 {
   font-weight: 500 !important;
 }

 /* Semi-Bold */
 .fw-600 {
   font-weight: 600 !important;
 }

 /* Bold */
 .fw-700 {
   font-weight: 700 !important;
 }

 /* Extra Bold */
 .fw-800 {
   font-weight: 800 !important;
 }

 /* Black */
 .fw-900 {
   font-weight: 900 !important;
 }

 /*------------------------------------------------------------------
[ Form ]*/

 .login100-form {
   width: 100%;
   background: #fff;
   padding: 15px;
   border-radius: 10px;
 }

 .login100-form-title {
   display: block;
   font-family: "Baloo2";
   font-size: 39px;
   color: #333333;
   line-height: 1.2;
   text-align: center;
 }

 .login100-form-avatar {
   display: block;
   width: 120px;
   height: 120px;
   border-radius: 50%;
   overflow: hidden;
   margin: 0 auto;
 }

 .login100-form-avatar img {
   width: 100%;
 }

 /*------------------------------------------------------------------
[ Input ]*/

 .wrap-input100 {
   width: 100%;
   position: relative;
   border-bottom: 2px solid #d9d9d9;
 }

 .input100 {
   font-family: "Baloo2";
   font-size: 18px;
   color: #555555;
   line-height: 1.2;

   display: block;
   width: 100%;
   height: 52px;
   background: transparent;
   padding: 0 5px 0 40px;
 }

 .symbol-input100 {
   font-size: 22px;
   display: -webkit-box;
   display: -webkit-flex;
   display: -moz-box;
   display: -ms-flexbox;
   display: flex;
   align-items: center;
   position: absolute;
   border-radius: 25px;
   bottom: 0;
   left: 12px;
   width: 100%;
   height: 100%;
   pointer-events: none;
   color: var(--primary);
   -webkit-transition: all 0.4s;
   -o-transition: all 0.4s;
   -moz-transition: all 0.4s;
   transition: all 0.4s;
 }

 /*---------------------------------------------*/
 .focus-input100 {
   position: absolute;
   display: block;
   width: 100%;
   height: 100%;
   top: 0;
   left: 0;
   pointer-events: none;
 }

 .focus-input100::before {
   content: "";
   display: block;
   position: absolute;
   bottom: -2px;
   left: 0;
   width: 0;
   height: 2px;

   -webkit-transition: all 0.4s;
   -o-transition: all 0.4s;
   -moz-transition: all 0.4s;
   transition: all 0.4s;

   background: var(--primary);
 }

 /* 
.focus-input100::after {
  font-family: 'Poppins';
  font-size: 18px;
  color: #999999;
  line-height: 1.2;

  content: attr(data-placeholder);
  display: block;
  width: 100%;
  position: absolute;
  top: 15px;
  left: 0px;
  padding-left: 5px;

  -webkit-transition: all 0.4s;
  -o-transition: all 0.4s;
  -moz-transition: all 0.4s;
  transition: all 0.4s;
} */

 .input100:focus+.focus-input100::after {
   top: -20px;
   font-size: 15px;
 }

 .input100:focus+.focus-input100::before {
   width: 100%;
 }

 .has-val.input100+.focus-input100::after {
   top: -20px;
   font-size: 15px;
 }

 .has-val.input100+.focus-input100::before {
   width: 100%;
 }

 .input100:focus+.symbol-input100 {
   color: var(--primary);
 }

 /*------------------------------------------------------------------
[ Button ]*/
 .container-login100-form-btn {
   width: 100%;
   display: -webkit-box;
   display: -webkit-flex;
   display: -moz-box;
   display: -ms-flexbox;
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
 }

 .login100-form-btn {
   font-family: "Baloo2";
   font-size: 16px;
   color: #fff;
   line-height: 1.2;
   text-transform: uppercase;
   display: -webkit-box;
   display: -webkit-flex;
   display: -moz-box;
   display: -ms-flexbox;
   display: flex;
   justify-content: center;
   align-items: center;
   padding: 0 20px;
   width: 100%;
   height: 65px;
   background-color: var(--primary);
   border-radius: 10px;
   box-shadow: 0 10px 30px 0px var(--primary-light);
   -moz-box-shadow: 0 10px 30px 0px var(--primary-light);
   -webkit-box-shadow: 0 10px 30px 0px var(--primary-light);
   -o-box-shadow: 0 10px 30px 0px var(--primary-light);
   -ms-box-shadow: 0 10px 30px 0px var(--primary-light);

   -webkit-transition: all 0.4s;
   -o-transition: all 0.4s;
   -moz-transition: all 0.4s;
   transition: all 0.4s;
 }

 .login100-form-btn:hover {
   background-color: #333333;
   box-shadow: 0 10px 30px 0px rgba(51, 51, 51, 0.5);
   -moz-box-shadow: 0 10px 30px 0px rgba(51, 51, 51, 0.5);
   -webkit-box-shadow: 0 10px 30px 0px rgba(51, 51, 51, 0.5);
   -o-box-shadow: 0 10px 30px 0px rgba(51, 51, 51, 0.5);
   -ms-box-shadow: 0 10px 30px 0px rgba(51, 51, 51, 0.5);
 }

 /*------------------------------------------------------------------
[ Alert validate ]*/

 .validate-input {
   position: relative;
 }

 .alert-validate::before {
   content: attr(data-validate);
   position: absolute;
   max-width: 70%;
   background-color: #fff;
   border: 1px solid #c80000;
   border-radius: 2px;
   padding: 4px 25px 4px 10px;
   top: 50%;
   -webkit-transform: translateY(-50%);
   -moz-transform: translateY(-50%);
   -ms-transform: translateY(-50%);
   -o-transform: translateY(-50%);
   transform: translateY(-50%);
   right: 0px;
   pointer-events: none;

   font-family: "Baloo2";
   color: #c80000;
   font-size: 13px;
   line-height: 1.4;
   text-align: left;

   visibility: hidden;
   opacity: 0;

   -webkit-transition: opacity 0.4s;
   -o-transition: opacity 0.4s;
   -moz-transition: opacity 0.4s;
   transition: opacity 0.4s;
 }

 .alert-validate::after {
   content: "\f06a";
   font-family: FontAwesome;
   font-size: 16px;
   color: #c80000;

   display: block;
   position: absolute;
   background-color: #fff;
   top: 50%;
   -webkit-transform: translateY(-50%);
   -moz-transform: translateY(-50%);
   -ms-transform: translateY(-50%);
   -o-transform: translateY(-50%);
   transform: translateY(-50%);
   right: 5px;
 }

 .alert-validate:hover:before {
   visibility: visible;
   opacity: 1;
 }

 @media (max-width: 992px) {
   .alert-validate::before {
     visibility: visible;
     opacity: 1;
   }
 }

 /*//////////////////////////////////////////////////////////////////
[ Login more ]*/
 .login-more li {
   position: relative;
   padding-left: 16px;
 }

 .login-more li::before {
   content: "";
   display: block;
   position: absolute;
   width: 5px;
   height: 5px;
   border-radius: 50%;
   background-color: #cccccc;
   top: 45%;
   -webkit-transform: translateY(-50%);
   -moz-transform: translateY(-50%);
   -ms-transform: translateY(-50%);
   -o-transform: translateY(-50%);
   transform: translateY(-50%);
   left: 0;
 }

 .bg-common {
   background: url("../images/bg@2x.png");
   background-position: center;
   background-position: center;
   background-size: cover;
   /* background-attachment: fixed; */
   background-repeat: no-repeat;
 }

 .bg-primary {
   background: var(--primary) !important;
 }

 .dashboard-navbar {
   height: 180px;
   padding: 10px;
   justify-content: end;
   position: fixed;
   top: 0;
   margin: auto;
   width: 100%;
   z-index: 111;
 }

 .common-navbar {
   z-index: 11111;
   height: 80px;
   padding: 10px;
   justify-content: end;
   position: fixed;
   width: 100%;
   top: 0;

   justify-content: space-between;
 }

 .btn-toggle {
   display: inline-flex;
   align-items: center;
   padding: 0.25rem 0.5rem;
   font-weight: 600;
   color: rgba(0, 0, 0, 0.65);
   background-color: transparent;
   border: 0;
 }

 .btn-toggle:hover,
 .btn-toggle:focus {
   color: rgba(0, 0, 0, 0.85);
   background-color: #d2f4ea;
 }

 .btn-toggle::before {
   width: 1.25em;
   line-height: 0;
   content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='rgba%280,0,0,.5%29' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 14l6-6-6-6'/%3e%3c/svg%3e");
   transition: transform 0.35s ease;
   transform-origin: 0.5em 50%;
 }

 .btn-toggle[aria-expanded="true"] {
   color: rgba(0, 0, 0, 0.85);
 }

 .btn-toggle[aria-expanded="true"]::before {
   transform: rotate(90deg);
 }

 .btn-toggle-nav a {
   display: inline-flex;
   padding: 0.1875rem 0.5rem;
   margin-top: 0.125rem;
   margin-left: 1.25rem;
   text-decoration: none;
 }

 .btn-toggle-nav a:hover,
 .btn-toggle-nav a:focus {
   background-color: #d2f4ea;
 }

 .z-index-1 {
   z-index: -1;
 }

 .navbar-toggler {
   outline: none;
   box-shadow: none;
   border: none;
 }

 .navbar-toggler:focus {
   box-shadow: none;
 }

 .offcanvas {
   min-width: 300px !important;
   background: var(--primary-light2);
 }

 footer {
   position: fixed;
   width: 100%;
   background: white;
   bottom: 0;
   z-index: 111;
 }

 .footer-div {
   flex-direction: column;
   text-align: center;
 }

 .footer-div span {
   font-size: small;
 }

 .img-container {
   background: white;
   border-radius: 50%;
   padding: 10px;
   width: fit-content;
 }

 .logout-container {
   position: fixed;
   top: 15px;
   right: 15px;
 }

 .logout-container a {
   color: #fff;
   font-size: 15px;
   text-decoration: none;
   display: flex;
   align-items: center;
   font-weight: 500;
 }

 .logout-container svg {
   width: 20px;
   margin-left: 5px;
 }

 .overview-container {
   background: var(--primary-light2);
   border-radius: 10px;
   padding: 15px;
 }

 .overview-container h4 {
   display: flex;
   justify-content: space-between;
   margin-bottom: 15px;
   margin-top: 14px;
   padding: 0 15px;
   font-style: italic;
 }

 .overview-container h4 span {
   color: var(--primary);
   font-weight: 700;
 }

 .custom-dash-btn {
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   background: var(--primary);
   color: #fff;
   font-size: 20px;
   padding: 25px 22px;
   height: 100%;

   width: 100% !important;
   border-radius: 15px;
 }

 .custom-dash-btn:hover {
   border: 1px dashed var(--primary);
   color: var(--primary);
 }

 .custom-dash-btn:hover svg {
   fill: var(--primary);
 }

 .custom-dash-btn svg {
   width: 75px;
   height: 75px;
   margin-bottom: 14px;
 }

 .custom-dash-btn2 {
   display: flex;
   align-items: center;
   flex-direction: column;
   font-size: 25px;
   padding: 0;
 }

 .custom-dash-btn2 span {
   width: 100%;
   padding: 20px 0px;
   background: var(--primary-light2);
   border-radius: 14px;
   margin-bottom: 10px;
 }

 .custom-dash-btn2 svg {
   width: 75px;
   height: 75px;
 }

 .custom-dash-btn2 svg path {
   fill: var(--primary) !important;
 }

 .custom-dash-btn2:hover {
   color: var(--primary);
   font-weight: 700;
 }

 .custom-dash-btn2:hover span {
   background: var(--primary) !important;

 }

 .custom-dash-btn2:hover svg path {
   fill: #fff !important;

 }

 .crfBtn:hover svg path {
   fill: var(--primary) !important
 }

 .back-btn {
   font-size: 20px;
   text-decoration: none;
   font-style: italic;
   font-weight: 500;
 }

 .back-btn svg {
   margin-right: 15px;
 }

 .terms-list {
   margin-left: 20px;
   font-size: 15px;
 }

 .terms-list li {
   list-style: auto !important;
 }

 .signature-section {
   margin-top: 40px;
 }

 .signature-section div {
   margin-bottom: 10px;
 }

 .signature-section .signature {
   font-weight: bold;
   text-decoration: underline;
 }

 .amount {
   font-weight: bold;
 }

 .lower-alpha li {
   list-style: lower-alpha !important;
 }

 .text-justify {
   text-align: justify !important;
 }

 .custom-btn {
   background: var(--primary);
   color: #fff;
   font-size: 20px;
   padding: 10px 30px;
   width: auto !important;
   border-radius: 15px;
   margin: auto;
 }

 .custom-btn:hover {
   border: 1px dashed var(--primary);
   color: var(--primary);
   background-color: white !important;
 }

 #signature-pad {
   width: 100%;
   height: 380px;
   background: var(--primary-light2);
   border-radius: 15px;
 }

 .bg-secondary {
   background-color: rgb(214, 212, 215) !important;
 }

 .deactive {
   opacity: 0.5 !important;
   pointer-events: none !important;
 }

 .heading-container h3 {
   margin: 30px 0;
 }

 .heading-container span {
   position: relative;
 }

 .heading-container span:after {
   content: "";
   position: absolute;
   background: url("../images/shape_1.svg");
   width: 100%;
   height: 20px;
   bottom: -25px;
   left: 0;
   right: 0;
   margin: auto;
   background-repeat: no-repeat;
   background-position: center;
 }

 /* Chrome, Safari, Edge, Opera */
 input::-webkit-outer-spin-button,
 input::-webkit-inner-spin-button {
   -webkit-appearance: none;
   margin: 0;
 }

 /* Firefox */
 input[type="number"] {
   -moz-appearance: textfield;
 }

 .input-field input {
   width: 65px;
   height: 65px;
   background: var(--primary-light2);
   border-radius: 12px;
   text-align: center;
   font-size: 27px;
   font-weight: 600;
   color: var(--primary);
 }

 .mmcounter span {
   font-size: 17px;
 }

 .container_check {
   display: block;
   position: relative;
   padding-left: 35px;
   margin-bottom: 12px;
   cursor: pointer;
   font-size: 15px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none;
   color: var(--primary);
   font-weight: 600;
 }

 /* Hide the browser's default checkbox */
 .container_check input {
   position: absolute;
   opacity: 0;
   cursor: pointer;
   height: 0;
   width: 0;
 }

 /* Create a custom checkbox */
 .checkmark {
   position: absolute;
   top: 0;
   left: 0;
   height: 25px;
   width: 25px;
   background-color: #eee;
   bottom: 0;
   margin: auto;
   border-radius: 6px;
 }

 /* On mouse-over, add a grey background color */
 .container_check:hover input~.checkmark {
   background-color: #ccc;
 }

 /* When the checkbox is checked, add a blue background */
 .container_check input:checked~.checkmark {
   background-color: var(--primary);
 }

 /* Create the checkmark/indicator (hidden when not checked) */
 .checkmark:after {
   content: "";
   position: absolute;
   display: none;
 }

 /* Show the checkmark when checked */
 .container_check input:checked~.checkmark:after {
   display: block;
 }

 /* Style the checkmark/indicator */
 .container_check .checkmark:after {
   left: 9px;
   top: 4px;
   width: 7px;
   height: 12px;
   border: solid white;
   border-width: 0 2px 2px 0;
   -webkit-transform: rotate(45deg);
   -ms-transform: rotate(45deg);
   transform: rotate(45deg);
 }

 .container_check:has(.checkbox-one:disabled) {
   pointer-events: none;
   opacity: 0.5;
   /* Slightly transparent */
 }

 .custom-file {
   height: 62px !important;
   border-radius: 35px !important;
   border: 1px solid #ddd !important;
 }

 .custom-file:hover {
   background: var(--primary-light2);
 }

 .custom-file:focus {
   background: var(--primary-light2);
 }

 input.custom-file[type="file"] {
   padding: 17px 26px 0 26px;
 }

 input.custom-file[type="file"]:focus {
   box-shadow: none;
   outline: none;
 }

 input.custom-file[type="file"]::-webkit-file-upload-button,
 input.custom-file[type="file"].invalid::-webkit-file-upload-button,
 input.custom-file[type="file"].valid::-webkit-file-upload-button {
   color: #fff;
   font-size: 13px;
   border: 0;
   -webkit-border-radius: 35px;
   -moz-border-radius: 35px;
   -ms-border-radius: 35px;
   border-radius: 35px;
   padding: 8px 10px 8px 10px;
   background: var(--primary) !important;
   outline: none;
 }

 input.custom-file[type="file"]::-webkit-file-upload-button:focus,
 input.custom-file[type="file"].invalid::-webkit-file-upload-button:focus,
 input.custom-file[type="file"].valid::-webkit-file-upload-button:focus {
   box-shadow: none;
   outline: none;
 }

 .mainCropper {
   width: 300px;
   height: 300px;
   margin: auto;
 }

 .check-container2 {
   width: 8.7rem;
   height: 10.4rem;
   display: flex;
   flex-flow: column;
   align-items: center;
   justify-content: space-between;

   margin: auto;
 }

 .check-container2 .check-background {
   width: 100%;
   height: calc(100% - 1.25rem);
   background: linear-gradient(to bottom right,
       var(--primary),
       var(--primary-light2));
   box-shadow: 0px 0px 0px 65px rgba(255, 255, 255, 0.25) inset,
     0px 0px 0px 65px rgba(255, 255, 255, 0.25) inset;
   transform: scale(0.84);
   border-radius: 50% !important;
   animation: animateContainer 0.75s ease-out forwards 0.25s;
   display: flex;
   align-items: center;
   justify-content: center;
   opacity: 0;
 }

 .check-container2 .check-background svg {
   width: 50%;
   transform: translateY(0.25rem);
   stroke-dasharray: 80;
   stroke-dashoffset: 80;
   animation: animateCheck 0.35s forwards 1.25s ease-out;
 }

 .check-container2 .check-shadow {
   bottom: calc(-15% - 5px);
   left: 0;
   border-radius: 50%;
   background: radial-gradient(closest-side, var(--primary), transparent);
   animation: animateShadow 0.75s ease-out forwards 0.75s;
 }

 @keyframes animateContainer {
   0% {
     opacity: 0;
     transform: scale(0);
     box-shadow: 0px 0px 0px 65px rgba(255, 255, 255, 0.25) inset,
       0px 0px 0px 65px rgba(255, 255, 255, 0.25) inset;
   }

   25% {
     opacity: 1;
     transform: scale(0.9);
     box-shadow: 0px 0px 0px 65px rgba(255, 255, 255, 0.25) inset,
       0px 0px 0px 65px rgba(255, 255, 255, 0.25) inset;
   }

   43.75% {
     transform: scale(1.15);
     box-shadow: 0px 0px 0px 43.334px rgba(255, 255, 255, 0.25) inset,
       0px 0px 0px 65px rgba(255, 255, 255, 0.25) inset;
   }

   62.5% {
     transform: scale(1);
     box-shadow: 0px 0px 0px 0px rgba(255, 255, 255, 0.25) inset,
       0px 0px 0px 21.667px rgba(255, 255, 255, 0.25) inset;
   }

   81.25% {
     box-shadow: 0px 0px 0px 0px rgba(255, 255, 255, 0.25) inset,
       0px 0px 0px 0px rgba(255, 255, 255, 0.25) inset;
   }

   100% {
     opacity: 1;
     box-shadow: 0px 0px 0px 0px rgba(255, 255, 255, 0.25) inset,
       0px 0px 0px 0px rgba(255, 255, 255, 0.25) inset;
   }
 }

 @keyframes animateCheck {
   from {
     stroke-dashoffset: 80;
   }

   to {
     stroke-dashoffset: 0;
   }
 }

 @keyframes animateShadow {
   0% {
     opacity: 0;
     width: 100%;
     height: 15%;
   }

   25% {
     opacity: 0.25;
   }

   43.75% {
     width: 40%;
     height: 7%;
     opacity: 0.35;
   }

   100% {
     width: 85%;
     height: 15%;
     opacity: 0.25;
   }
 }

 .gst-container {
   padding: 20px;
   border: 1px solid var(--primary-light);
   border-radius: 15px;
 }

 .loader-div {
   position: fixed;
   top: 0;
   bottom: 0;
   margin: auto;
   height: 100%;
   width: 100%;
   background: white;
   z-index: 99999;
   display: flex;
   align-items: center;
   justify-content: center;
 }

 /* HTML: <div class="loader"></div> */
 /* HTML: <div class="loader"></div> */
 .loader {
   width: 15px;
   aspect-ratio: 1;
   border-radius: 50%;
   animation: l5 1s infinite linear alternate;
 }

 @keyframes l5 {
   0% {
     box-shadow: 20px 0 var(--primary), -20px 0 #0002;
     background: var(--primary)
   }

   33% {
     box-shadow: 20px 0 var(--primary), -20px 0 #0002;
     background: #0002
   }

   66% {
     box-shadow: 20px 0 #0002, -20px 0 var(--primary);
     background: #0002
   }

   100% {
     box-shadow: 20px 0 #0002, -20px 0 var(--primary);
     background: var(--primary)
   }
 }

 .tagify__dropdown__wrapper {
   background: #fff !important;
 }

 /* GOPI */
 .instruction-span {
   color: grey;
   font-size: 14px;
 }

 .form-group {
   padding: 15px 40px 15px 40px;
 }

 .preview-block .card-header h5 {
   color: var(--primary) !important;
 }

 .form-check-input:checked {
   background-color: var(--primary) !important;
   border-color: var(--primary) !important;
 }

 .form-check-input:focus {
   border-color: var(--primary);
   outline: 0;
   box-shadow: 0 0 0 0.2rem var(--primary-light3);
 }

 .swal2-container {
   z-index: 99999999999 !important;
 }

 .medicationTbl-div {
   border: 2px solid #ddd;
   border-radius: 13px;
 }

 .medicationTbl {
   border: 0;
   margin: 0;
   border-radius: 13px;
 }

 .medicationTbl table {
   margin: 0;
 }

 .medicationTbl tbody,
 td,
 tfoot,
 th,
 thead,
 tr {
   border-width: 0px;
 }

 .medicationTbl th {
   padding: 15px 10px;
   border-right: 3px solid #fff;
   text-align: center;
   background: var(--primary-light3);
   color: #000;
   font-size: 20px;
   font-weight: 600;
 }

 .medicationTbl th:first-child {
   border-left: 0px;
 }

 .medicationTbl th:last-child {
   border: 0px;
 }

 .medicationTbl td {
   border-right: 3px solid #dddddd75;
   font-weight: 500;
   font-size: larger;
   border-bottom: 0;
   height: 60px;
   text-align: center !important;
   padding: 4px 22px;
 }

 .medicationTbl td input {
   text-align: center !important;
   font-size: larger;
 }

 .medicationTbl td:last-child {
   border-right: 0px;
 }

 .medicationTbl tr {
   border-width: 3px;
   border-color: #dddddd75;
   border-left: 0 !important;
   border-right: 0 !important;
 }

 .medicationTbl tr:last-child {
   border-bottom: 0px;
 }

 .medicationTbl tr:first-child {
   border: 0 !important;
 }

 .row-btn {
   background-color: #d6c2d6 !important;
   border: solid 1px #d6c2d6;
 }



 .row-btn:hover,
 .row-btn:active {
   border: 1px dashed var(--primary);
   color: var(--primary);
   background-color: white !important;
 }

 .tbl-delete-btn {
   background: none;
   border: none;
   color: #dc3545;
 }

 /* RATING CSS */

 .rating__wrap {
   display: flex;
   font-size: 28px;
 }

 .rating__wrap:after {
   content: "";
   display: table;
   clear: both;
 }

 .rating__ico {
   /* float: right; */
   /* padding-left: 10px; */
   cursor: pointer;
 }

 .rating__ico:last-child {
   padding-left: 0;
 }

 .rating__input {
   display: none;
 }

 .rating__ico:hover:before,
 .rating__ico:hover~.rating__ico:before,
 .rating__input:checked~.rating__ico:before {
   content: var(--emoji);
   /* font-family: FontAwesome, sans-serif; */
 }

 .rating__ico:hover {
   transform: scale(1.2);
 }

 .Star-rating {
   --emoji: "\f005";
   /* Define the CSS variable */
 }

 .Star-rating .rating__ico {
   color: #ffb300;
   /* Define the CSS variable */
 }

 .Heart-rating .rating__ico {
   color: #b80000;
   /* Define the CSS variable */
 }

 .Heart-rating {
   --emoji: "\f004";
 }

 .Thumbs-up-rating {
   --emoji: "\f164";
 }

 .Thumbs-up-rating .rating__ico {
   color: #816144;
   /* Define the CSS variable */
 }

 .Number-rating .rating__ico {
   display: block;
   width: 35px;
   border: 2px solid purple;
   background-color: white;
   margin: 4px;
   text-decoration: none;
   font-size: 14px;
   line-height: 1.8;
   text-align: center;
   color: #3d3d3d;
   font-weight: 600;
   padding: 3px;
 }

 .Number-rating .rating__ico:hover,
 .Number-rating .rating__ico:hover~.rating__ico,
 .Number-rating .rating__input:checked~.rating__ico {
   border: 2px solid purple;
   background-color: purple;
   color: white;
 }

 .emoji-rating {
   display: flex;
   /* Flexbox layout */
   justify-content: end;
   align-items: center;
   gap: 15px;
   direction: rtl;
 }

 .emoji-rating input[type="radio"] {
   display: none;
   /* Hide radio buttons */
 }

 .emoji-rating label {
   font-size: 2rem;
   cursor: pointer;
   transition: transform 0.3s ease, color 0.3s ease;
   color: rgb(105, 105, 105);
 }

 .emoji-rating input[type="radio"]:checked~label {
   color: rgb(221, 169, 0);
 }

 .rating__input:disabled+label {
   cursor: not-allowed;
   /* Change cursor to indicate it's disabled */
   color: lightgray;
   /* Indicate visually that the label is disabled */
 }

 .emoji-rating label i {
   pointer-events: none;
 }

 /* Optional: Add hover effect */
 .emoji-rating label:hover {
   transform: scale(1.2);
   /* Slightly enlarge the emoji on hover */
 }

 .tagify__dropdown.extra-properties .tagify__dropdown__item>img {
   border-radius: 2px;
   display: inline-block;
   height: 20px;
   margin-right: 5px;
   transform: scale(0.75);
   transition: 0.12s ease-out;
   vertical-align: middle;
 }

 .tagify__dropdown.extra-properties .tagify__dropdown__item--active>img,
 .tagify__dropdown.extra-properties .tagify__dropdown__item:hover>img {
   margin-right: 12px;
   transform: none;
 }

 .tagify.countries .tagify__input {
   min-width: 175px;
 }

 .tagify.countries tag {
   white-space: nowrap;
 }

 .tagify.countries tag img {
   border-radius: 2px;
   display: inline-block;
   height: 16px;
   margin-right: 3px;
   pointer-events: none;
 }

 .tagify--select {
   width: 100%;
 }

 .tagify__dropdown__wrapper {
   background: var(--white);
   border-color: var(--recent-dashed-border);
 }

 .tagify__dropdown__item--active {
   background-color: #ccc;
   color: var(--body-font-color);
 }

 .tagify {
   --tags-focus-border-color: $gray-60;
 }

 .tagify__input {
   color: #121313;
 }

 .tagify--select:after {
   color: var(--chart-text-color);
 }

 .required {
   color: red;
 }

 .modal-toggle-wrapper .form-control::-moz-placeholder {
   font-size: 13px;
 }

 .modal-toggle-wrapper .form-control::placeholder {
   font-size: 13px;
 }

 .modal-toggle-wrapper .modal-img {
   display: flex;
   justify-content: center;
 }

 .modal-toggle-wrapper .modal-img img {
   height: 200px;
   width: 200px;
 }

 @media (max-width: 992px) {
   .modal-toggle-wrapper .modal-img img {
     height: calc(105.52381px + 9.52381vw);
     width: calc(105.52381px + 9.52381vw);
   }
 }

 .modal-toggle-wrapper .modal-img li img {
   height: 75px;
   width: 75px;
   margin-bottom: 15px;
 }

 @media (max-width: 992px) {
   .modal-toggle-wrapper .modal-img li img {
     height: calc(63.09524px + 3.72024vw);
     width: calc(63.09524px + 3.72024vw);
   }
 }

 .modal-toggle-wrapper .modal-img li+li {
   margin-left: -39px;
 }

 .modal-toggle-wrapper button svg {
   height: 16px;
   width: 16px;
 }

 .btn-primary {
   background-color: var(--primary) !important;
   border: 1px solid var(--primary) !important;
 }

 .disabled-form {
   pointer-events: none;
   cursor: none;
 }

 .signature-cropper {
   z-index: -11 !important;
 }

 .sign-container,
 .documents-container {
   height: 9rem;
   width: 7.5rem;
 }

 #croppedSignContainer .preview-image {
   width: 150px;
 }

 #croppedImageContainer1 .preview-image,
 #croppedImageContainer2 .preview-image {
   width: 200px;
 }

 .book {
   width: 172px;
   height: 243px;
 }

 .custom-table {
   border: 2px solid var(--primary);
   /* Table border color */
   border-radius: 13px;
   /* Rounded corners */
   /* overflow: hidden; */
 }

 .min-width-define {
   min-width: 100px;
 }

 .custom-table thead {
   background-color: var(--primary) !important;
   color: #fff;
   /* White text */
 }

 .custom-table th {
   text-align: center;
   background-color: var(--primary) !important;
   color: white;
   height: 60px;
   vertical-align: middle;
   font-weight: 500;
   text-transform: uppercase;
   font-size: 17px;
 }

 .custom-table td {
   text-align: center;
   vertical-align: middle;
   height: 65px;
 }

 .table-striped>tbody>tr:nth-of-type(odd)>* {
   background: var(--primary-light2) !important;
 }

 .icon-check {
   color: #5dae47;
   /* Green check */
   font-size: 1.2rem;
 }

 .icon-clock {
   color: #f18a26;
   /* Orange clock */
   font-size: 1.2rem;
 }

 .text-view {
   font-weight: bold;
   color: #333;
 }

 .text-disabled {
   color: #aaa;
   /* Grey for disabled text */
 }

 .edit-link {
   color: #000;
   text-decoration: underline;
 }

 .tooltip {
   z-index: 99999;
   background-color: rgb(255, 255, 255);
   font-weight: 600;
 }

 .tooltip .progress {
   height: 4px;
   width: 0%;
 }

 .tooltip.show {
   animation: fadeOut 6s forwards;
 }

 @keyframes fadeOut {
   0% {
     opacity: 1;
   }

   100% {
     opacity: 0;
     display: none;
   }
 }

 .tooltip .progress {
   animation: progressBar 3s linear forwards;
 }

 @keyframes progressBar {
   0% {
     width: 0%;
   }

   100% {
     width: 100%;
   }
 }

 .tooltip .progress,
 .progress-stacked {
   background-color: green;
 }

 .surveytitleheader {
   padding: 14px 16px;
   background: var(--primary-light2);
   margin: 15px 5px;
   display: inline-block;
   font-weight: 600;
   font-size: 20px;
   border-radius: 13px;
   text-align: left;
   word-break: break-word;
 }

 .btn {
   border-radius: 13px !important;
 }

 .preview_img {
   max-width: 250px;
 }

 .custom-btn-2 {
   padding: 10px 40px;

 }

 .main-card {
   border-radius: 13px;
   background: var(--primary-light2);
   border: 0;
 }

 .col-form-label {
   font-weight: 600;
   font-size: 1.08rem;
 }

 .instruction-span {
   font-weight: 400;
   margin-top: 5px;
 }

 .nine h1 {
   font-size: 30px;
   color: var(--primary);

 }

 textarea.form-control {
   height: 70px;
   border-radius: 13px;
   border: 0;
 }

 input.form-control {
   border: 0;
   border-radius: 13px;
   height: 45px;
 }

 .form-control:focus {
   box-shadow: 0 0 0 .25rem var(--primary-light3);
 }

 .input-group>:not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {
   border-radius: 0px 13px 13px 0;

 }

 .input-group>:not(:last-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {
   border-radius: 13px 0 0 13px;
   /* border: 0 !important; */
 }

 .input-group-text {
   border: 0;
   background: #fff;
 }

 .flatpickr-day.selected {
   background: var(--primary) !important;
   border-color: var(--primary) !important;
 }

 .tagify__input {
   background: #fff;
 }

 .form-check-label {
   cursor: pointer;
   padding-left: 5px;
 }


 .form-check-input {
   width: 1.25em !important;
   height: 1.25em !important;
   position: absolute;
   top: 0;
   bottom: 0;
   margin: auto;
 }

 .form-check {
   min-height: 1.8rem;
   position: relative;
   display: flex;
   align-items: center;
   min-width: 100px;
 }

 .otherDrugs {
   text-align: center;
   width: 100%;
   margin: auto;
 }

 .add-row-btn,
 .add-colum-btn {
   margin-top: 15px;
   padding: 10px 21px;
   display: flex;
   align-items: center;
   justify-content: center;
 }

 .add-row-btn i,
 .add-colum-btn i {
   margin-right: 10px;
 }

 .trash-deactive {
   opacity: 0.1;
   pointer-events: none;
 }




 .laboratory-tbl-div {
   border: 2px solid #ddd;
   border-radius: 13px;
 }

 .laboratory-tbl {
   border: 0;
   margin: 0;
   border-radius: 13px;
 }

 .laboratory-tbl table {
   margin: 0;
 }

 .laboratory-tbl tbody,
 td,
 tfoot,
 th,
 thead,
 tr {
   border-width: 0px;
 }

 .laboratory-tbl th {
   padding: 15px 10px;
   border-right: 3px solid #fff;
   text-align: center;
   background: var(--primary-light3);
   color: #000;
   font-size: 20px;
   font-weight: 600;
 }

 .laboratory-tbl th:first-child {
   border-left: 0px;
 }

 .laboratory-tbl th:last-child {
   border: 0px;
 }

 .laboratory-tbl td {
   border-right: 3px solid #dddddd75;
   font-weight: 500;
   font-size: medium;
   border-bottom: 0;
   height: 60px;
   text-align: left !important;
   border-left: 0 !important;
   padding: 0px 17px;
   min-width: 200px;
 }

 .laboratory-tbl td:last-child {
   border-right: 0px;
 }

 .laboratory-tbl tr {
   border-width: 3px;
   border-color: #dddddd75;
   border-left: 0 !important;
   border-right: 0 !important;
 }

 .laboratory-tbl tr:last-child {
   border-bottom: 0px;
 }

 .laboratory-tbl tr:first-child {
   border: 0 !important;
 }

 .laboratory-tbl table td input {
   border: 1px solid #ddd;
   text-align: center;
   width: auto;
   margin: auto;
 }

 .ReactionSection table {
   margin: 0;

 }

 .ReactionSection table td {
   min-width: 350px !important;
   vertical-align: middle;
 }

 .ReactionSection table td .input-group>:not(:last-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {
   border: 1px solid #ddd !important;
 }

 .ReactionSection table td .input-group>:not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {
   border: 1px solid #ddd !important;
 }

 .ReactionSection table td input {
   border: 1px solid #ddd;
 }

 .form-control.is-invalid {
   border-width: 1px !important;
   border-style: dashed !important;
   border-color: red !important;
 }

 .frontActive {
   font-style: italic;
   font-weight: 700;
   background: var(--primary-light3);
   color: var(--primary) !important;
 }


 legend {
   float: none !important;
   width: auto !important;
   padding: 5px 10px !important;
   margin-bottom: 0.5rem !important;
   font-size: 15px !important;
   background: rgb(124 67 142 / 10%);
   border-radius: 10px;
   color: var(--theme-default);
   font-weight: 600;
   margin: 0px 17px;
 }

 fieldset {
   min-width: 0;
   padding: 0 !important;
   margin: 0;
   border: 1px solid #ddd !important;
   border-radius: 10px;


 }

 .custom-icons {
   width: 25px;
   height: 25px;
 }

 .divider {
   border: 0.5px solid #dddddd;
   height: 30px;
   margin: 0 10px;
   align-items: center;
   text-align: center;
 }

 .accordion-button:not(.collapsed) {
   background-color: var(--primary-light3);
   color: var(--primary);
   font-weight: 600;
   font-size: large;
 }

 .accordion {
   --bs-accordion-bg: #ffffff00;
 }

 .accordion-button:focus {
   box-shadow: 0 0 0 0.25rem var(--primary-light2);
 }

 .accordion-item:first-of-type .accordion-button {
   border-top-left-radius: 13px;
   border-top-right-radius: 13px;
   z-index: 1
 }

 .accordion-body {
   background: var(--primary-light2);
   border-radius: 0 0 13px 13px;
 }

 .disabled-patient-btn {
   opacity: 0.1;
   cursor: no-drop;

   filter: grayscale(1);
 }

 .done-patient-msg {
   position: absolute;
   top: 0;
   bottom: 0;
   margin: auto;
   display: flex;
   align-items: center;
   text-align: center;
   padding: 25px;
   font-weight: 700;
   font-size: 17px;
 }

 .title-header {
   padding: 25px 0px 25px 0px;
   --r: 10px;
   line-height: 1.7;
   padding-inline: .5em;
   border-block: var(--r) solid #0000;
   border-radius: var(--r) 0 0 var(--r) / calc(2* var(--r)), 0 var(--r) var(--r) 0 / calc(2* var(--r));
   mask: radial-gradient(var(--r) at 100% var(--r), #0000 98%, #000 101%) 0 calc(-1* var(--r)) / var(--r) 100% repeat-y,
     radial-gradient(var(--r) at 0 var(--r), #0000 98%, #000 101%) 100% calc(-1* var(--r)) / var(--r) 100% repeat-y,
     conic-gradient(#000 0 0) padding-box;

   -webkit-mask: radial-gradient(var(--r) at 100% var(--r), #0000 98%, #000 101%) 0 calc(-1* var(--r)) / var(--r) 100% repeat-y,
     radial-gradient(var(--r) at 0 var(--r), #0000 98%, #000 101%) 100% calc(-1* var(--r)) / var(--r) 100% repeat-y,
     conic-gradient(#000 0 0) padding-box;

   background: #ffffff border-box;
 }

 .sub-header {
   padding: 10px 15px;
   font-weight: 700;
 }

 .sub-header span {
   background: var(--primary-light3);
   padding: 8px 16px;
   border-radius: 10px;
 }

 .matrix-table td {
   min-width: 350px;
   padding: 17px 17px;
 }

 .matrix-table td,
 .matrix-table th {
   text-align: left !important;
 }

 .matrix-table .input-group-text {
   border: 1px solid #ddd !important;
 }

 .matrix-table .tagify__input {
   min-width: auto;
 }

 .matrix-table textarea.form-control {
   border: 1px solid #ddd;
 }



 .border-form {
   border: 1px solid #ddd !important;
   border-radius: 10px !important;
   height: 40px !important;
   padding: .375rem .75rem !important
 }

 .border-form:focus {
   box-shadow: none !important;
   border: 1px solid #ddd !important;
 }

 .custom-file2 {

   border-radius: 10px !important;
   border: 1px solid #ddd !important;
 }

 .custom-file2:hover {
   background: var(--primary-light2);
 }

 .custom-file2:focus {
   background: var(--primary-light2);
 }

 input.custom-file2[type="file"] {
   padding: 3px 3px 3px 3px;
   width: 100%;
 }

 input.custom-file2[type="file"]:focus {
   box-shadow: none;
   outline: none;
 }

 input.custom-file2[type="file"]::-webkit-file-upload-button,
 input.custom-file2[type="file"].invalid::-webkit-file-upload-button,
 input.custom-file2[type="file"].valid::-webkit-file-upload-button {
   color: #fff;
   font-size: 13px;
   border: 0;
   -webkit-border-radius: 10px;
   -moz-border-radius: 10px;
   -ms-border-radius: 10px;
   border-radius: 10px;
   padding: 8px 10px 8px 10px;
   background: var(--primary) !important;
   outline: none;
 }

 input.custom-file2[type="file"]::-webkit-file-upload-button:focus,
 input.custom-file2[type="file"].invalid::-webkit-file-upload-button:focus,
 input.custom-file2[type="file"].valid::-webkit-file-upload-button:focus {
   box-shadow: none;
   outline: none;
 }


 .switchTabs {
   padding: 10px;
   background: #eff2fb;
   border-radius: 10px;
 }

 .switchTabs a {
   font-weight: 400;
   color: var(--primary);
   height: 50px;
   border: 1px dashed;
   border-radius: 0px !important;
   background-color: #fff !important;
   /* Example: blue background */


 }

 .switchTabs a:first-child {
   border-radius: 0px !important;
   border-top-left-radius: 10px !important;
   /* Optional: rounded corners */
   border-bottom-left-radius: 10px !important;
   /* Optional: rounded corners */
 }

 .switchTabs a:last-child {
   border-radius: 10px;
   border-top-right-radius: 10px !important;
   /* Optional: rounded corners */
   border-bottom-right-radius: 10px !important;
   /* Optional: rounded corners */
 }

 .switchTabs a:hover {
   color: #0f68a1;
   background: #e2f2fd !important;
   border: 1px dashed #0f68a1 !important;
 }


 .switchTabs a.active-tab {
   border: 1px;
   background-color: var(--primary) !important;
   /* Example: blue background */
   color: #fff;
   /* Example: white text */
 }

 .btnSwitch {
   position: fixed;
   bottom: 10%;
   z-index: 9;
   right: 1%;
 }


 .pending-badge {
   background-color: #fffcdd;
   color: #c79500;
   border-radius: 35px;
   border: 1px solid #e5e0c1;
   font-weight: 600;
   width: 100px;
   display: flex;
   align-items: center;
   justify-content: left;
   padding: 3px 5px;
 }

 .pending-badge img {
   background: #b17c19;
   border-radius: 18px;
   padding: 2px;
 }

 .submited-badge {
   background-color: #e7dae7;
   color: #81448a;
   border-radius: 35px;
   border: 1px solid #e0bde5;
   font-weight: 600;
   width: 100px;
   display: flex;
   align-items: center;
   justify-content: left;
   padding: 3px 5px;
 }

 .submited-badge img {
   background: #81448a;
   border-radius: 18px;
   padding: 3px;
 }

 .verify-badge {
   background-color: #d7ebd5;
   color: #125f11;
   border-radius: 35px;
   border: 1px solid #b3d3b5;
   font-weight: 600;
   width: 100px;
   display: flex;
   align-items: center;
   justify-content: left;
   padding: 3px 5px;
 }

 .verify-badge img {
   background: #0d7332;
   border-radius: 18px;
   padding: 3px;
 }

 .rejected-badge {
   background-color: #f7e3e3;
   color: #c50404;
   border-radius: 35px;
   border: 1px solid #e9c3c3;
   font-weight: 600;
   width: 100px;
   display: flex;
   align-items: center;
   justify-content: left;
   padding: 3px 5px;
   pointer-events: auto !important;
 }

 .rejected-badge img {
   background: #b10606;
   border-radius: 18px;
   padding: 2px;
 }

 .submited-badge img,
 .verify-badge img,
 .rejected-badge img,
 .pending-badge img {
   width: 22px;
   margin-right: 5px;
   /* height: 15px; */

 }

 .filter-bar {
   display: flex;
   align-items: center;
   gap: 10px;
   margin-bottom: 14px;
 }

 .tabs-row {
   display: flex;
   align-items: center;
   /* border-bottom: 2px solid #ede4f5; */
   width: 100%;
   margin-bottom: 10px;
 }

 /* ── Tab bar wrapper ── */
 .tabs {
   display: flex;
   align-items: center;
   gap: 4px;
   border-bottom: 2px solid #ede4f5;
   margin-bottom: 16px;
   padding-bottom: 0;
   flex-wrap: wrap;
   /* wraps on very small screens */
 }

 /* ── Individual tab ── */
 .tab {
   display: inline-flex;
   align-items: center;
   gap: 6px;
   padding: 10px 16px;
   font-weight: 600;
   font-size: 13px;
   cursor: pointer;
   color: #aaa;
   border-bottom: 3px solid transparent;
   margin-bottom: -2px;
   white-space: nowrap;
   transition: all 0.15s;
   flex-shrink: 0;
 }

 .tab:hover:not(.active) {
   color: #9b59b6;
 }

 .tab.active {
   color: #7C3F9B;
   border-bottom-color: #7C3F9B;
 }

 /* ── Count badge inside tab ── */
 .tab .count {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   background: #e8d5f5;
   color: #7C3F9B;
   font-size: 10px;
   font-weight: 700;
   border-radius: 999px;
   padding: 2px 7px;
   line-height: 1.4;
 }

 .tab.active .count {
   background: #7C3F9B;
   color: #fff;
 }

 /* ── Vertical separator ── */
 .bar-sep {
   width: 1px;
   height: 22px;
   background: #ddd;
   flex-shrink: 0;
   margin: 0 6px 2px;
 }

 /* ── Status filter dropdown ── */
 .filter-select {
   padding: 6px 30px 6px 12px;
   border: 1.5px solid #ddd0e3;
   border-radius: 8px;
   font-size: 14px;
   color: #7d4198;
   background: #fff;
   outline: none;
   cursor: pointer;
   appearance: none;
   -webkit-appearance: none;
   background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6 9l6 6 6-6' stroke='%237C3F9B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
   background-repeat: no-repeat;
   background-position: right 10px center;
   min-width: 250px;
   margin-bottom: 2px;
   transition: border-color 0.15s;
   font-weight: 500;
 }

 .filter-select:focus {
   border-color: #7C3F9B;
 }

 /* ── Mobile responsive ── */
 @media (max-width: 576px) {
   .tabs {
     gap: 0;
     border-bottom: none;
     /* remove bottom border on mobile */
     flex-direction: column;
     /* stack vertically */
     align-items: flex-start;
     margin-bottom: 12px;
   }

   /* tabs row stays horizontal */
   .tabs-row {
     display: flex;
     align-items: center;
     border-bottom: 2px solid #ede4f5;
     width: 100%;
     margin-bottom: 10px;
   }

   .tab {
     padding: 9px 12px;
     font-size: 12px;
   }

   .bar-sep {
     display: none;
     /* hide separator on mobile */
   }

   .filter-select {
     width: 100%;
     /* full width on mobile */
     min-width: unset;
     font-size: 13px;
     padding: 8px 30px 8px 12px;
     margin-bottom: 0;
   }
 }

 /* Desktop: show inline, hide mobile */
 .filter-mobile {
   display: none;
 }

 .filter-desktop {
   display: flex;
   align-items: center;
   margin-left: 4px;
 }

 @media (max-width: 576px) {
   .filter-desktop {
     display: none;
   }

   /* hide inline filter */
   .filter-mobile {
     display: block;
     width: 100%;
   }

   /* show below tabs */
 }

 .crf-dashboard-doctor {
   box-shadow: rgb(0 0 0 / 14%) 0px 5px 15px;
   padding: 10px;
   border-radius: 10px;
   margin-top: 20px;
 }

 .view-document-badge {
   background-color: #f3e5f3;
   color: #81448a;
   border-radius: 35px;
   border: 1px solid #e0bde5;
   font-weight: 600;
   width: fit-content;
   display: flex;
   align-items: center;
   justify-content: left;
   padding: 6px 10px;
   font-size: 12px;
   box-shadow: rgb(192 134 201 / 41%) 0px 5px 15px;

 }

 .view-document-badge img {
   width: 25px;
   background: #81448a;
   border-radius: 18px;
   padding: 3px;
   margin-right: 5px;
 }



 .custom-dash-crf-btn {
   display: flex;

   align-items: start;
   background: var(--primary);
   color: #fff;
   font-size: 20px;
   padding: 12px 15px;


   width: 100% !important;
   border-radius: 15px;
 }

 .custom-dash-crf-btn:hover {
   border: 1px dashed var(--primary);
   color: var(--primary);
 }

 .custom-dash-crf-btn:hover svg {
   fill: var(--primary);
 }

 .custom-dash-crf-btn svg {
   width: 30px;
   height: 30px;
   margin-right: 10px;

 }

 .select2-container .select2-search--inline .select2-search__field {
   font-family: 'Baloo2' !important;
 }