.text-primary { color: #21776A !important; }
.bg-primary { background-color: #21776A !important; }
.swal2-html-container { color: #7b7b7b; font-size: 1em !important; }
.swal2-html-container p { line-height: 1.5em !important; }
.swal2-styled.swal2-confirm { background-color: #144840 !important; }

/*  CSS for slider */
.slider-checkbox [type="checkbox"] {
  display: none;
}

/*  Height and width can be adjusted,
Border radius is 50% of height */
.slider-checkbox label {
  display: block;
  width: 40px;
  height: 20px;
  position: relative;
  background: #d2d2d2;
  border-radius: 10px;
  transition: background 0.2s ease;
  cursor: pointer;
}

.slider-checkbox label::before {
  content: '';
  display: block;
  width: 50%;
  height: 100%;
  background: #ffffff;
  border-radius: 50%;
  box-shadow: 0 0 0 1px #c3c3c3;
  position: absolute;
  left: 0;
  top: 0;
  transition: transform 0.2s ease-in-out;
}

/*  CSS for when slider is checked: */
.slider-checkbox [type="checkbox"]:checked + label {
  background: #4caf50;
}

.slider-checkbox [type="checkbox"]:checked + label::before {
  -webkit-transform: translateX(100%); 
  transform: translateX(100%); 
}

input[type=radio] { display: none; }
input[type=radio]:checked + .label-color span { transform: scale(1.25); }

input[type=radio]:checked + .label-color .red    { border: 2px solid #711313; }
input[type=radio]:checked + .label-color .orange { border: 2px solid #873a08; }
input[type=radio]:checked + .label-color .yellow { border: 2px solid #816102; }
input[type=radio]:checked + .label-color .green  { border: 2px solid #21776A; }
input[type=radio]:checked + .label-color .blue   { border: 2px solid #103f62; }
input[type=radio]:checked + .label-color .violet { border: 2px solid #321a64; }
input[type=radio]:checked + .label-color .purple { border: 2px solid #501962; }
input[type=radio]:checked + .label-color .pink   { border: 2px solid #851554; }

.label-color { display: inline-block; width: 25px; height: 25px; margin-right: 10px; cursor: pointer; }
.label-color:hover span { transform: scale(1.25); }
.label-color span { display: block; width: 100%; height: 100%; transition: transform 0.2s ease-in-out; }

.label-color span.red    { background: #DB2828; }
.label-color span.orange { background: #F2711C; }
.label-color span.yellow { background: #FBBD08; }
.label-color span.green  { background: #21776A; }
.label-color span.blue   { background: #2185D0; }
.label-color span.violet { background: #6435C9; }
.label-color span.purple { background: #A333C8; }
.label-color span.pink   { background: #E03997; }

.bg-session-red    { background: #DB2828 !important; color: #ffffff !important; }
.bg-session-orange { background: #F2711C !important; color: #ffffff !important; }
.bg-session-yellow { background: #FBBD08 !important; color: #ffffff !important; }
.bg-session-green  { background: #21776A !important; color: #ffffff !important; }
.bg-session-blue   { background: #2185D0 !important; color: #ffffff !important; }
.bg-session-violet { background: #6435C9 !important; color: #ffffff !important; }
.bg-session-purple { background: #A333C8 !important; color: #ffffff !important; }
.bg-session-pink   { background: #E03997 !important; color: #ffffff !important; }

[data-primary="color_9"] .fc-daygrid-dot-event .fc-daygrid-event-dot { border-color: #ffffff !important; }

.icon-facebook { background-color: #1367c8; color: #fff; }
.icon-twitter  { background-color: #00aced; color: #fff; }
.icon-linkedin { background-color: #0074b6; color: #fff; }

.multiselect { background: #fff !important; border: 1px solid #EEEEEE !important; color: #808588 !important; width: 100% !important; height: 40px !important; border-radius: 0.75rem !important; text-align: left !important; font-size: 0.875rem !important; padding: 0.375rem 0.75rem !important; }
.multiselect-container>li { padding: 10px 0px !important; border-bottom: 1px solid #d6d6d6 !important; }

.div-welcome-patient { padding: 25px !important; background-color: #21776a1a !important; border: 1px solid #21776a !important; }
.div-search-psychologist { padding: 40px 100px !important; background-color: #21776a1a !important; border: 1px solid #21776a !important; }

.box-message { background-color: #f7f7f7 !important; padding: 15px !important; margin-bottom: 30px !important; border-radius: 10px !important; }

.bg-answers-success { background-color: #b2dc98 !important; color: #fff !important; padding: 5px 30px !important; }
.bg-answers-error   { background-color: #fd6f6f !important; color: #fff !important; padding: 5px 30px !important; }
.bg-answers-pending { background-color: #a5dce3 !important; color: #fff !important; padding: 5px 30px !important; }
.bg-answers-success label { margin: 0px !important; }
.bg-answers-error label   { margin: 0px !important; }
.bg-answers-pending label { margin: 0px !important; }

.alert-important { background-color: #f0f0f0; border: 1px solid #d7d7d7; border-left: 5px solid #d7d7d7; border-left-color: #fb535b; border-radius: 0px; color: #3c3c3c; font-size: 14px; margin: 10px 0; padding: 10px; }

.main-head {
  background: #0D1440;
  box-shadow: 0px 1px 10px -6px rgba(0, 0, 0, .15);
  padding: 1rem;
  margin-bottom: 0;
  margin-top: 5rem;
  color: #fff;
  font-weight: 500;
  text-transform: uppercase;
  border-radius: 4px;
  font-size: 16px;
}

.pricing-table {
  background: #fff;
  box-shadow: 0px 1px 10px -6px rgba(0, 0, 0, .15);
  padding: 2rem;
  border-radius: 4px;
  transition: .3s;
}

.pricing-table:hover {
  box-shadow: 0px 1px 10px -4px rgba(0, 0, 0, .15);
}

.pricing-table .pricing-label {
  border-radius: 2px;
  padding: .25rem .5rem;
  margin-bottom: 1rem;
  display: inline-block;
  font-size: 12px;
  font-weight: 500;
}

.pricing-table h2 {
  color: #3b3b3b;
  font-size: 24px;
  font-weight: 500;
}

.pricing-table h5 {
  color: #B3B3B3;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px !important;
}

.pricing-table .pricing-features {
  margin-top: 2rem;
}

.pricing-table .pricing-features .feature {
  font-size: 14px;
  margin: .5rem 0;
  color: #B3B3B3;
}

.pricing-table .pricing-features .feature span {
  display: inline-block;
  float: right;
  color: #3b3b3b;
  font-weight: 500;
}

.pricing-table  .price-tag {
  margin-top: 2rem;
  text-align: center;
  font-weight: 500;
}

.pricing-table .price-tag .symbol {
  font-size: 24px;
}

.pricing-table .price-tag .amount {
  letter-spacing: -2px;
  font-size: 60px;
}

.pricing-table .price-tag .after {
  color: #3b3b3b;
  font-weight: 500;
}

.pricing-table .price-button {
  display: block;
  color: #fff;
  margin-top: 2rem;
  padding: .75rem;
  border-radius: 2px;
  text-align: center;
  font-weight: 500;
  transition: .3s;
}

.pricing-table .price-button:hover {
  text-decoration: none;
}

.purple .pricing-label {
  background: #cad2ff;
  color: #627afe;
}

.purple .price-tag {
  color: #627afe;
}

.purple .price-button {
  background: #627afe;
}

.purple .price-button:hover {
  background: #546dfe;
}

.turquoise .pricing-label {
  background: #b9edee;
  color: #44cdd2;
}

.turquoise .price-tag {
  color: #44cdd2;
}

.turquoise .price-button {
  background: #44cdd2;
}

.turquoise .price-button:hover {
  background: #2dbcc4;
}

.green .pricing-label {
  background: #dcc89c;
  color: #d2a644;
}

.green .price-tag {
  color: #d2a644;
}

.green .price-button {
  background: #d2a644;
}

.green .price-button:hover {
  background: #a58234;
}



.red .pricing-label {
  background: #ffc4c4;
  color: #ff5e5e;
}

.red .price-tag {
  color: #ff5e5e;
}

.red .price-button {
  background: #ff5e5e;
}

.red .price-button:hover {
  background: #f23c3c;
}
