.bottomNote {
  background-color: #fff176;
  padding: 8px 12px;
  border-top: 1px dashed #d0d0d0;
  border-radius: 0 0 15px 15px;
}
.cancelled {
  text-decoration: line-through;
}
.busy {
  color: #b71c1c;
}
.itemRow {
  font-size: 12px;
  line-height: 1.5;
  padding: 3px 2px;
  position: relative;
}
.itemRow.cancelled {
  background-color: #f5f5f5;
}
.itemRow .cancelled {
  text-decoration: line-through;
}
.itemRow:hover {
  background-color: #eeeeee;
}
.itemRow.selected {
  color: #477ACD;
  background-color: #eeeeee;
}
.itemRow.appointment {
  border-left: 4px solid #f57c00;
}
.itemRow .itemComment {
  position: absolute;
  width: 250px;
  background-color: #ffe359;
  border-radius: 2px;
  left: -20px;
  top: 23px;
  margin: 0 8px;
  z-index: 2;
  font-size: 10px;
}
.chargeCard {
  width: 700px;
  margin: 4px 4px;
  padding: 8px 0 0;
}
.chargeCard:hover {
  background-color: #fefefe;
}
.chargeCard:hover .hiddenButton {
  opacity: 1;
}
.chargeCard .hiddenButton {
  opacity: 0;
}
.chargeCard.appointments-context {
  border-left: 4px solid #f57c00;
}
.chargeCard.surgery-context {
  border-left: 4px solid #f57c00;
}
.chargeCard.fertility-context {
  border-left: 4px solid #f57c00;
}
.chargeCard.center-context {
  border-left: 4px solid #f57c00;
}
.backOfficeSubtitle {
  margin-top: 15px;
  margin-left: 10px;
}
.fixedSideBar {
  position: fixed;
  background-color: white;
  color: #404041;
  width: 250px;
  height: 200px;
  top: 44px;
  left: 10px;
  z-index: 2;
}
.tag {
  background-color: #f57f17;
  color: white;
  margin: 0 5px;
  padding: 0 5px;
  font-weight: 400;
  border-radius: 2px;
  font-size: 11px;
  line-height: 1.4;
}
.tag.small {
  padding: 1px 4px 0;
  font-size: 10px;
}
.tag.whiteTag {
  background-color: white;
  color: #404041;
}
.tag.greyTag,
.tag.cancelado {
  background-color: #404041;
  color: white !important;
}
.tag.pending,
.tag.rejected,
.tag.pendiente {
  background-color: #d32f2f;
  color: white;
}
.tag.in-review,
.tag.processing,
.tag .in-process,
.tag .not-billed {
  background-color: #f57f17;
  color: white;
}
.tag.closed,
.tag.recepcionado {
  background-color: #9c27b0;
  color: white;
}
.tag.invoiced,
.tag.sent {
  background-color: #477ACD;
  color: white;
}
.tag.reprogramed {
  border-radius: 2px;
}
.tag.reprogramed.rCancelled {
  background-color: #b71c1c;
  color: #fff;
}
.tag.reprogramed.rescheduled {
  background-color: #1b5e20;
  color: #f9f9f9;
}
.tag.reprogramed.pending {
  background-color: #cecece;
  color: #404041;
}
.tag.to-fix {
  background-color: #9c27b0;
}
.tag.reviewed {
  background-color: #1b5e20;
}
.tag.reviewed-wrong {
  background-color: #b71c1c;
}
.tag.final-revision {
  background-color: #0d47a1;
}
.tag.ready-to-audit {
  background-color: #ee9b00;
}
.tag.missing-documentation {
  background-color: #344966;
}
.tag.canceled {
  background-color: #0D1821;
}
.tag.charged {
  background-color: #388e3c;
  color: white;
}
.tag.forbidden {
  cursor: not-allowed !important;
}
.tag.whiteTag path {
  fill: white;
}
.tag.redTag {
  background-color: #d32f2f;
  color: white !important;
}
.tag.purpleTag,
.tag.atendido {
  background-color: #ba68c8;
  color: white !important;
}
.tag.greenTag,
.tag.confirmado {
  background-color: #388e3c;
  color: white !important;
}
.tag.blueTag {
  background-color: #1976d2;
  color: white !important;
}
.tag.isolated {
  margin: 0 1px;
}
.tag.paymentState {
  border-radius: 2px;
  color: #fff;
}
.tag.paymentState.pending {
  background-color: #e65100;
}
.tag.paymentState.paid {
  background-color: #1b5e20;
}
.tag.paymentState.notPaid {
  background-color: #b71c1c;
}
.tag.transactionState.pending {
  background-color: #FFD700;
}
.tag.transactionState.charged {
  background-color: #28A745;
}
.tag.transactionState.paid {
  background-color: #1E7E34;
}
.tag.transactionState.annulled {
  background-color: #9B111E;
}
.tag.transactionState.generated {
  background-color: #0E5762;
}
.tag.transactionState.billed {
  background-color: #543A85;
}
.today {
  background-color: #f1f1f1;
  border-radius: 3px;
}
.userServiceCell {
  cursor: pointer;
  padding: 4px 8px;
  height: 40px;
  border-radius: 3px;
  position: relative;
}
.userServiceCell.exception {
  background: repeating-linear-gradient(-45deg, #f0f0f0, #f0f0f0 7px, white 7px, white 14px);
}
.userServiceCell.cellInCenterBar {
  cursor: default;
  height: 22px;
  line-height: 1.2;
  font-size: 12px;
  color: #fff;
  background-color: #313131;
  width: 100%;
}
.userServiceCell.cellInCenterBar.absence {
  background-color: #858585;
}
.centerBar {
  background: #f6f6f6;
  border-radius: 5px;
  padding: 0 8px;
  height: 30px;
}
.materialButton {
  background-color: transparent;
  outline: 0;
}
.materialButton:focus {
  outline: 0;
}
.materialButton.square {
  border-radius: 0;
}
.materialButton.underlined {
  border-bottom: 2px solid #404041;
  font-weight: 700;
}
.materialButton.green {
  color: #388e3c !important;
}
.materialButton.green path {
  fill: #388e3c !important;
}
.materialButton.green:hover {
  color: #1b5e20 !important;
}
.materialButton.green:hover path {
  fill: #1b5e20 !important;
}
.materialButton.red {
  color: #d32f2f !important;
}
.materialButton.red path {
  fill: #d32f2f !important;
}
.materialButton.red:hover {
  color: #b71c1c !important;
}
.materialButton.red:hover path {
  fill: #b71c1c !important;
}
.materialButton.hoverRed:hover {
  background-color: #f1d9d9;
  color: #b71c1c !important;
}
.materialButton.hoverRed:hover path {
  fill: #b71c1c !important;
}
.materialButton.hoverGreen:hover {
  background-color: #d8ebd9;
  color: #1b5e20 !important;
}
.materialButton.hoverGreen:hover path {
  fill: #1b5e20 !important;
}
.materialButton.caps {
  text-transform: uppercase;
}
.materialButton.blackButton {
  background-color: #404041;
  color: white;
}
.materialButton.blackButton path {
  fill: white;
}
.materialButton.menuButton {
  color: #666666;
  padding-left: 16px;
  margin: 0px;
  height: 36px;
  border-radius: 0 15px 15px 0;
}
.materialButton.menuButton path {
  fill: #666666;
}
.materialButton.menuButton:hover {
  background-color: #e4e4e4;
}
.materialButton.menuButton.selected {
  background-color: white;
  border: 1px solid #e8e8e8;
  color: #404041;
  font-weight: 700;
}
.materialButton.menuButton.selected path {
  fill: #404041;
}
.materialButton.submenuButtonPortal {
  color: #666666;
  padding-left: 20px;
  margin: 0px;
  height: 36px;
  border-radius: 0 15px 15px 0;
}
.materialButton.submenuButtonPortal path {
  fill: #666666;
}
.materialButton.submenuButtonPortal:hover {
  background-color: #e4e4e4;
}
.materialButton.submenuButtonPortal.selected {
  background-color: white;
  border: 1px solid #e8e8e8;
  color: #404041;
  font-weight: 700;
}
.materialButton.submenuButtonPortal.selected path {
  fill: #404041;
}
.materialButton.topMenuButton {
  padding: 8px;
  margin: 0 8px;
  border: 2px solid transparent;
  color: #666666;
}
.materialButton.topMenuButton path {
  fill: #666666;
}
.materialButton.topMenuButton:hover {
  background-color: #e4e4e4;
}
.materialButton.topMenuButton.selected {
  border-bottom: 2px solid #404041;
  color: #404041;
  font-weight: 700;
}
.materialButton.topMenuButton.selected path {
  fill: #404041;
}
.materialButton.submenuButton {
  background-color: #ececec;
  color: #666666;
  border-radius: 0;
  margin: 0;
  padding: 0;
  height: 25px;
  font-weight: 200;
}
.materialButton.submenuButton path {
  fill: #666666;
}
.materialButton.submenuButton:hover {
  font-weight: 400;
}
.materialButton.submenuButton.selected {
  color: #404041;
  font-weight: 700;
}
.materialButton.submenuButton.selected path {
  fill: #404041;
}
.materialButton.whiteButton {
  background-color: white;
  color: #404041 !important;
}
.materialButton.whiteButton path {
  fill: #404041 !important;
}
.materialButton.whiteButton:hover {
  background-color: #F5F5F5;
}
.materialButton.blue {
  color: #1976d2 !important;
}
.materialButton.blue path {
  fill: #1976d2 !important;
}
.materialButton.blue:hover {
  color: #0d47a1 !important;
}
.materialButton.blue:hover path {
  fill: #0d47a1 !important;
}
.materialButton.inHospital {
  background-color: #3f51b5;
  color: white;
}
.materialButton.inHospital:hover {
  background-color: #32408f;
}
.materialButton.outpatient {
  background-color: #ff9800;
  color: white;
}
.materialButton.outpatient:hover {
  background-color: #cc7a00;
}
.materialButton.dayhospital {
  background-color: #9c27b0;
  color: white;
}
.materialButton.dayhospital:hover {
  background-color: #771e86;
}
.materialButton.episode {
  background-color: #009688;
  color: white;
}
.materialButton.episode:hover {
  background-color: #00635a;
}
.materialButton.outlined {
  border: 1px solid #C3C3C3;
  text-transform: uppercase;
  font-size: 13px;
  color: #477ACD;
  flex-direction: row;
  align-items: center;
  display: flex;
  margin: 0;
}
.materialButton.outlined.disabled {
  color: #909090 !important;
  background-color: #eeeeee !important;
}
.materialButton.outlined.disabled path {
  fill: #909090 !important;
}
.materialButton.outlined.selected {
  border: 3px solid #1976d2;
}
.materialButton.outlined span {
  margin-left: 4px;
}
.materialButton.outlined path {
  fill: #477ACD;
}
.materialButton.outlined:hover {
  background-color: #eeeeee;
  box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
}
.materialButton.outlined.action {
  border-radius: 10px;
  color: #404041;
  font-size: 13px;
  padding: 6px 10px;
  margin-right: 10px;
}
.materialButton.outlined.action path {
  fill: #404041;
}
.materialButton.outlined.action:hover {
  color: #477ACD;
}
.materialButton.outlined.action:hover path {
  fill: #477ACD;
}
.materialButton.outlined.whatsapp {
  border: 1px solid #e6e6e6;
  border-radius: 18px;
  color: white;
  font-size: 12px;
  padding: 6px 10px;
  background-color: #59a559;
}
.materialButton.outlined.whatsapp path {
  fill: white;
}
.materialButton.outlined.gray {
  color: #404041;
}
.materialButton.outlined.gray path {
  fill: #404041;
}
.materialButton.pending,
.materialButton.not-started,
.materialButton.pre-processed {
  background-color: #666666;
  color: white;
}
.materialButton.in-review,
.materialButton.in-process,
.materialButton.not-billed {
  background-color: #e65100;
  color: white;
}
.materialButton.reviewed,
.materialButton.sent {
  background-color: #1b5e20;
  color: white;
}
.materialButton.reviewed-wrong {
  background-color: #b71c1c;
  color: white;
}
.materialButton.to-fix,
.materialButton.in-transit {
  background-color: #9c27b0;
  color: white;
}
.materialButton.final-revision,
.materialButton.informed,
.materialButton.finalized,
.materialButton.billed {
  background-color: #0d47a1;
  color: white;
}
.materialButton.ready-to-audit {
  background-color: #ee9b00;
  color: white;
}
.materialButton.missing-documentation {
  background-color: #344966;
  color: white;
}
.materialButton.canceled {
  background-color: #0D1821;
  color: white;
}
.materialButton.invoiced,
.materialButton.partial-informed {
  background-color: #477ACD;
  color: white;
}
.materialButton.charged {
  background-color: #388e3c;
  color: white;
}
.materialButton.forbidden {
  cursor: not-allowed !important;
}
.materialButton.singleLetter {
  border-radius: 50%;
  height: 16px;
  width: 16px;
  font-size: 11px;
  padding: 3px 5px;
}
.materialButton.singleLetter.reviewed {
  background-color: #388e3c;
  color: white;
}
.materialButton.singleLetter.pending {
  background-color: #fbc02d;
  color: #404041;
}
.materialButton.action {
  border-radius: 10px;
  font-size: 16px;
  text-transform: uppercase;
}
.materialButton.avoid-clicks {
  pointer-events: none;
  color: #bbb;
}
.materialButton.smallButton {
  font-size: 12px;
  padding: 6px 8px;
}
.materialButton[disabled] {
  background-color: #e0e0e0 !important;
  color: #9e9e9e !important;
  cursor: default !important;
}
.materialButton[disabled] path {
  fill: #9e9e9e !important;
}
.space-left {
  margin-left: 8px;
}
.space-right {
  margin-right: 8px;
}
.space-sides {
  margin-left: 8px;
  margin-right: 8px;
}
.fixedHeader {
  position: fixed;
  top: -40px;
  left: 290px;
  min-height: 40px;
  transition: all 200ms ease-in-out;
  background-color: white;
  padding: 8px;
  width: 700px;
  z-index: 2;
  cursor: pointer;
}
.fixedHeader.appointment {
  border-left: 4px solid #f57c00;
}
.attachedfile {
  height: 100px;
  border-radius: 5px;
  margin: 4px;
  display: flex;
  position: relative;
  min-width: 70px;
}
.attachedfile .progressline {
  background-color: #477ACD;
  height: 4px;
  width: 1px;
  margin-top: 1px;
}
.attachedfile .progressnumber {
  position: absolute;
  bottom: 0;
  right: 0;
  left: 0;
  top: 0;
  z-index: 2;
  margin: auto;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  font-size: 9px;
  padding: 11px 7px;
  background-color: #477ACD;
  color: white;
}
.attachedfile img {
  max-height: calc(100% - 4px);
  z-index: 1;
}
.attachedfile svg {
  width: 24px;
  height: 24px;
}
.attachedfile svg,
.attachedfile .attachButtons,
.attachedfile .attachedthumbnail {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}
.attachedfile .attachButtons {
  opacity: 0;
  border-radius: 5px;
  background-color: rgba(0, 0, 0, 0.6);
  height: 40px;
  width: fit-content;
  justify-content: space-around;
  z-index: 2;
}
.attachedfile:hover .attachButtons {
  opacity: 1;
}
.h-0 {
  transition: all 150ms linear;
  overflow: hidden;
  height: 0;
}
.h-25 {
  height: 25px !important;
}
.materialCard.cardContainer {
  border: 1px solid #d0d0d0;
  background-color: white;
}
.materialCard.cardContainer.interactive {
  cursor: pointer;
}
.materialCard.cardContainer.interactive:hover {
  border-color: #404041;
}
.materialCard.cardWithDescription {
  width: 370px;
  height: 120px;
}
.materialCard.cardWithoutDescription {
  width: 370px;
  height: 65px;
  border-radius: 10px;
  padding-top: 16px;
}
.materialCard.cardWithoutDescription:hover {
  color: #404041;
}
.materialCard.cardWithoutDescription:hover path {
  fill: #404041;
}
.materialCard.cardWithoutDescription svg,
.materialCard.cardWithoutDescription i {
  margin-left: 5px;
}
.materialCard.centerCard {
  height: 80px;
  min-height: 80px;
  align-items: flex-start;
  padding: 0;
  margin: 6px 0;
  font-weight: 200;
  line-height: 1.5;
  opacity: 0.7;
}
.materialCard.centerCard:hover {
  opacity: 1;
  border: 1px solid #e5e5e5;
}
.materialCard.centerCard:hover .centerCardInfo {
  background-color: #F3F3F3;
}
.materialCard.centerCard .centerCardInfo {
  padding: 0 8px;
  border-radius: 0 15px 15px 0;
  background-color: white;
}
.materialCard.centerCard.selected {
  opacity: 1;
  color: #404041;
  font-weight: 700;
  border: 1px solid #e5e5e5;
}
.materialCard.centerCard.selected .centerCardInfo {
  background-color: #FAFAFA;
}
.materialCard.bl.default {
  border-left: 4px solid #7986cb;
}
.materialCard.bl.outpatient {
  border-left: 4px solid #ff9800;
}
.materialCard.bl.inhospital {
  border-left: 4px solid #3f51b5;
}
.materialCard.bl.episode {
  border-left: 4px solid #009688;
}
.materialCard.white {
  background-color: white;
}
.materialCard .hiddenItem {
  opacity: 0;
}
.materialCard:hover .hiddenItem {
  opacity: 1;
}
.materialCard .noHiddenItem {
  display: none;
}
.materialCard:hover .noHiddenItem {
  display: inherit;
}
.materialCard.ambulatory {
  border-left: 4px solid #f57c00;
}
.materialCard.deletedStudy,
.materialCard.deletedGeneticEvent {
  opacity: 0.5;
}
.materialCard.deletedStudy:hover,
.materialCard.deletedGeneticEvent:hover {
  opacity: 0.8;
}
.pillFilterColumn {
  align-items: start;
  max-width: 150px;
}
.fabContainer {
  position: fixed;
  bottom: 0;
  right: 0;
  padding: 0;
  width: 1px;
  height: 1px;
  transition: all 150ms linear;
  color: #ECECEC;
  z-index: 21;
}
.fabContainer.help {
  left: 0;
  right: auto;
}
.fabContainer.help .fab {
  background-color: #477ACD;
  right: auto;
  left: 25px;
}
.fabContainer .fab {
  position: absolute;
  height: 56px;
  width: 56px;
  border-radius: 50%;
  border: none;
  padding: 15px;
  bottom: 20px;
  right: 25px;
  transition: transform 200ms cubic-bezier(0.4, 0, 1, 1);
  cursor: pointer;
}
.fabContainer .fab.hoverLabel:hover .fabLabel {
  opacity: 1;
  right: 70px;
  display: flex;
  max-width: fit-content;
}
.fabContainer .fab.default {
  background-color: #477ACD;
}
.fabContainer .fab.outpatient {
  background-color: #ff9800;
}
.fabContainer .fab.outpatient:hover {
  background-color: #cc7a00;
}
.fabContainer .fab.outpatient.spontaneous {
  background-color: #ffb74d;
}
.fabContainer .fab.outpatient.spontaneous:hover {
  background-color: #ffa21a;
}
.fabContainer .fab.episode {
  background-color: #009688;
}
.fabContainer .fab.episode:hover {
  background-color: #00635a;
}
.fabContainer .fab.episode.spontaneous {
  background-color: #4db6ac;
}
.fabContainer .fab.episode.spontaneous:hover {
  background-color: #3c948b;
}
.fabContainer .fab.day {
  background-color: #9c27b0;
}
.fabContainer .fab.day:hover {
  background-color: #771e86;
}
.fabContainer .fab.day.spontaneous {
  background-color: #ba68c8;
}
.fabContainer .fab.day.spontaneous:hover {
  background-color: #a844b9;
}
.fabContainer .fab .fabOpenDot {
  background-color: #d32f2f;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  position: absolute;
  top: 0;
  right: 0;
}
.fabContainer .fab.inHospital {
  background-color: #3f51b5;
}
.fabContainer .fab.inHospital:hover {
  background-color: #32408f;
}
.fabContainer .fab.outPatient {
  background-color: #ff9800;
}
.fabContainer .fab.outPatient:hover {
  background-color: #cc7a00;
}
.fabContainer .fab .firstIcon {
  transition: all 100ms cubic-bezier(0.4, 0, 1, 1);
  transform: rotate(0deg);
}
.fabContainer .fab .secondIcon {
  transition: all 100ms cubic-bezier(0.4, 0, 1, 1);
  transform: rotate(-90deg);
  margin-top: -29px;
  display: flex;
  opacity: 0;
}
.fabContainer .fabChild {
  position: absolute;
  cursor: pointer;
  bottom: 28px;
  right: 33px;
  height: 40px;
  width: 40px;
  border-radius: 50%;
  border: none;
  padding: 8px 7px;
  transition: transform 200ms cubic-bezier(0.4, 0, 1, 1);
}
.fabContainer .fabChild.hoverLabel:hover .fabLabel {
  opacity: 1;
  right: 70px;
  display: flex;
  max-width: fit-content;
}
.fabContainer .fabChild.default {
  background-color: #477ACD;
}
.fabContainer .fabChild.open {
  background-color: #d32f2f !important;
  transform: translateY(-60px);
}
.fabContainer .fabChild.open:hover {
  background-color: #b71c1c !important;
}
.fabContainer .fabChild.outpatient {
  background-color: #ff9800;
}
.fabContainer .fabChild.outpatient:hover {
  background-color: #cc7a00;
}
.fabContainer .fabChild.outpatient.spontaneous {
  background-color: #ffb74d;
}
.fabContainer .fabChild.outpatient.spontaneous:hover {
  background-color: #ffa21a;
}
.fabContainer .fabChild.episode {
  background-color: #009688;
}
.fabContainer .fabChild.episode:hover {
  background-color: #00635a;
}
.fabContainer .fabChild.episode.spontaneous {
  background-color: #4db6ac;
}
.fabContainer .fabChild.episode.spontaneous:hover {
  background-color: #3c948b;
}
.fabContainer .fabChild.day {
  background-color: #9c27b0;
}
.fabContainer .fabChild.day:hover {
  background-color: #771e86;
}
.fabContainer .fabChild.day.spontaneous {
  background-color: #ba68c8;
}
.fabContainer .fabChild.day.spontaneous:hover {
  background-color: #a844b9;
}
.fabContainer .fabChild.inHospital {
  background-color: #7986cb;
}
.fabContainer .fabChild.inHospital:hover {
  background-color: #3f51b5;
}
.fabContainer .fabChild.outPatient {
  background-color: #ffb74d;
}
.fabContainer .fabChild.outPatient:hover {
  background-color: #ff9800;
}
.fabContainer .fabChild.inHospitalDark {
  background-color: #3f51b5;
}
.fabContainer .fabChild.inHospitalDark:hover {
  background-color: #32408f;
}
.fabContainer .fabChild.outPatientDark {
  background-color: #ff9800;
}
.fabContainer .fabChild.outPatientDark:hover {
  background-color: #cc7a00;
}
.fabContainer .fabChild.gray {
  background-color: #404041;
}
.fabContainer .fabChild.gray:hover {
  background-color: #272727;
}
.fabContainer .fabLabel {
  opacity: 0;
  display: none;
  position: absolute;
  right: -150px;
  top: 16px;
  text-align: right;
  background-color: rgba(70, 70, 70, 0.9);
  border-radius: 2px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
  font-weight: bold;
  line-height: 1em;
  max-width: 0px;
  overflow: hidden;
  padding: 6px 8px;
  text-overflow: ellipsis;
  vertical-align: middle;
  white-space: nowrap;
  transition: all 150ms linear;
}
.fabContainer .fabLabel.visibleLabel {
  max-width: 400px;
  display: inline-block;
  opacity: 1;
  right: 70px;
}
.fabContainer .fabLabel.childLabel {
  margin: -8px -8px 0 0;
}
.iconButton {
  background-color: transparent;
  border: 0;
  outline: 0;
  cursor: pointer;
  border-radius: 50%;
  color: #404041;
  height: 32px;
  min-height: 32px;
  width: 32px;
  min-width: 32px;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.iconButton[disabled] {
  color: #9e9e9e !important;
  cursor: default !important;
}
.iconButton[disabled] path {
  fill: #9e9e9e !important;
}
.iconButton:focus {
  outline: 0;
}
.iconButton path {
  fill: #404041;
}
.iconButton:hover {
  background-color: rgba(0, 0, 0, 0.05);
  color: black;
}
.iconButton:hover path {
  fill: black;
}
.iconButton.disabledButton {
  opacity: 0.5;
  background-color: transparent;
  cursor: default !important;
}
.iconButton.white {
  color: white !important;
}
.iconButton.white path {
  fill: white;
}
.iconButton.white:hover {
  opacity: 0.5;
  color: white !important;
}
.iconButton.red {
  color: #d32f2f !important;
}
.iconButton.red path {
  fill: #d32f2f;
}
.iconButton.red:hover {
  background-color: #b71c1c !important;
  color: white !important;
}
.iconButton.green {
  color: #388e3c !important;
}
.iconButton.green path {
  fill: #388e3c !important;
}
.iconButton.green:hover {
  background-color: #1b5e20 !important;
  color: white !important;
}
.iconButton.green:hover path {
  fill: white !important;
}
.iconButton.blue {
  color: #1976d2 !important;
}
.iconButton.blue path {
  fill: #1976d2 !important;
}
.iconButton.blue:hover {
  background-color: #0d47a1 !important;
  color: white !important;
}
.iconButton.blue:hover path {
  fill: white !important;
}
.iconButton.blueColor {
  color: #1976d2 !important;
}
.iconButton.blueColor path {
  fill: #1976d2 !important;
}
.iconButton.blueColor:hover {
  color: #0d47a1 !important;
}
.iconButton.blueColor:hover path {
  fill: #0d47a1 !important;
}
.iconButton.colorButton {
  background-color: #1976d2;
  color: white;
}
.iconButton.colorButton path {
  fill: white;
}
.iconButton.outpatientButton {
  background-color: #ff9800;
  color: white;
}
.iconButton.outpatientButton path {
  fill: white;
}
.iconButton.outpatientButton:hover {
  opacity: 0.5;
  color: white !important;
}
.iconButton.outpatientButton:hover path {
  fill: white;
}
.iconButton.episodeButton {
  background-color: #009688;
  color: white;
}
.iconButton.episodeButton path {
  fill: white;
}
.iconButton.episodeButton:hover {
  opacity: 0.5;
  color: white !important;
}
.iconButton.episodeButton:hover path {
  fill: white;
}
.iconButton.actionButton {
  background-color: #d0d0d0;
  color: #404041;
  z-index: 2;
}
.iconButton.actionButton path {
  fill: #404041;
}
.iconButton.actionButton:hover {
  background-color: #1976d2;
  color: white;
}
.iconButton.actionButton:hover path {
  fill: white;
}
.iconButton.greenButton {
  background-color: #388e3c;
  color: white;
  z-index: 2;
}
.iconButton.greenButton path {
  fill: white;
}
.iconButton.greenButton:hover {
  background-color: #1b5e20;
  color: white;
}
.iconButton.greenButton:hover path {
  fill: white;
}
.iconButton.redButton {
  background-color: #d32f2f;
  color: white;
  z-index: 2;
}
.iconButton.redButton path {
  fill: white;
}
.iconButton.redButton:hover {
  background-color: #b71c1c;
  color: white;
}
.iconButton.redButton:hover path {
  fill: white;
}
.iconButton.whiteButton {
  background-color: white;
  color: #404041;
}
.iconButton.whiteButton path {
  fill: #404041;
}
.iconButton:hover {
  box-shadow: 0 0 0 0px rgba(0, 0, 0, 0.3) !important;
  color: black;
}
.iconButton:hover path {
  fill: black;
}
.iconButton.hoverRoundGray:hover {
  background-color: #d6d6d6;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2) !important;
}
.hiddenItemParent .hiddenItemChild {
  opacity: 0;
}
.hiddenItemParent:hover .hiddenItemChild {
  opacity: 1;
}
.hiddenItemParent .noItemChild {
  display: none;
}
.hiddenItemParent:hover .noItemChild {
  display: flex;
}
.hiddenItemParent > .hiddenDirectItem {
  opacity: 0;
}
.hiddenItemParent:hover > .hiddenDirectItem {
  opacity: 1;
}
.closeButton {
  display: none;
  color: #212121;
  line-height: 2;
  margin-right: 3px;
}
.closeButton:focus-within .navPanel {
  display: none!important;
}
.keyboardArrowDownButton {
  margin-right: 3px;
}
.buttonNavPanel {
  border: none;
  border-radius: 24px;
  width: auto;
  height: 36px;
  padding: 0;
  background: transparent;
  transition: 150ms all linear;
  cursor: pointer;
  border: 1px solid transparent;
}
.buttonNavPanel:focus-within {
  width: 268px;
  border: 1px solid #d0d0d0;
  border-bottom: 0;
  border-radius: 10px 10px 0 0;
  outline: 0;
  outline-color: transparent;
  background-color: #fff;
  cursor: initial;
}
.buttonNavPanel:focus-within .navBarTitle {
  color: #212121;
}
.buttonNavPanel:focus-within .navPanel,
.buttonNavPanel:focus-within .closeButton {
  display: initial;
}
.buttonNavPanel:focus-within .keyboardArrowDownButton {
  display: none;
}
.containerNavPanel {
  position: relative;
  border-radius: 2px;
  width: 268px;
  margin-left: 7px;
}
.navPanel {
  display: none;
  max-height: 93vh;
  overflow-x: hidden;
  overflow-y: auto;
  width: 268px;
  position: absolute;
  top: 36px;
  left: 0;
  transition: 150ms all ease-out;
  z-index: 2;
  margin: 0;
  border: 1px solid #d0d0d0;
  border-top: none;
  border-radius: 0 0 10px 10px;
  background-color: white;
  padding: 0 5px 5px;
}
.actualSection {
  background-color: #f5f5f5;
}
.feedbackDialog {
  line-height: 1.4;
  width: 350px;
  top: 48px;
  margin: 0 auto;
}
.navPanelSelector {
  cursor: pointer;
  transition: all 150ms linear;
  color: #212121;
  border-radius: 5px;
  border: 1px solid transparent;
  align-items: center;
  padding: 5px 4px;
}
.navPanelSelector:hover {
  background-color: #f5f5f5;
  border: 1px solid #c1c1c1;
}
.navPanelSelector:hover .hiddenItem {
  opacity: 1;
}
.navPanelSelector .hiddenItem {
  opacity: 0;
}
.navPanelSelector .navPanelTitle {
  font-size: 12px;
  text-align: center;
  line-height: 1.3;
}
.navPanelSelector .navPanelDescription {
  font-size: 12px;
  opacity: 0.6;
  font-style: italic;
  max-height: 35px;
  overflow: auto;
}
.professionalCard {
  background-color: white;
  width: 700px;
  align-items: stretch;
}
.professionalCard .professionalPicture {
  border-radius: 50%;
  width: 30px;
  height: 30px;
  background-color: #404041;
  font-size: 17px;
  justify-content: center;
  line-height: 1;
  color: white;
  font-weight: 200;
}
.appointmentCard {
  background-color: white;
  color: #404041;
  border-radius: 15px;
  margin: 4px 8px;
  padding: 6px 10px;
  width: 600px;
  height: 100%;
  font-weight: 200;
  line-height: 1.2;
}
.appointmentCard.outpatient {
  border-left: 4px solid #ff9800;
}
.appointmentCard .date {
  font-size: 14px;
  width: 90px;
  text-align: center;
}
.appointmentCard .appointmentCardHeader {
  height: 35px;
  margin: 0 -8px;
  padding: 8px;
}
.appointmentSection {
  transition: all 150ms linear;
  padding: 8px;
  justify-content: center;
  opacity: 1;
}
.appointmentSection .appInputIcon {
  margin-right: 8px;
}
.appointmentSection .appointmentInput {
  border-radius: 28px;
  padding: 5px 5px 5px 14px;
  width: 430px;
}
.appointmentSection .appointmentInput input {
  font-size: 12px;
}
.appointmentSection .appointmentInput input::-webkit-input-placeholder {
  font-size: 12px;
}
.appointmentSection .appointmentInput path {
  fill: #666666;
}
.appointmentSection .searchInput {
  border-radius: 28px;
  padding: 5px 24px 5px 14px;
  width: 344px;
  height: 40px;
}
.appointmentSection .searchInput.ambulatory_surgery {
  background-color: #36a998;
  color: white;
}
.appointmentSection .searchInput.ambulatory_surgery path {
  fill: white;
}
.appointmentSection .searchInput.ambulatory_surgery input::placeholder {
  color: white;
}
.appointmentSection .searchInput input {
  font-weight: 200;
  font-size: 18px;
  border: none !important;
}
.appointmentSection .searchInput input::-webkit-input-placeholder {
  font-size: 18px;
  font-weight: 200;
  opacity: 0.5;
}
.appointmentSection .searchInput path {
  fill: #666666;
}
.appointmentSection .searchInput:hover {
  background-color: #fafafa;
}
.appointmentSection .selectedAppointmentInput {
  background-color: white !important;
}
.appointmentSection .selectedAppointmentInput input {
  border: none !important;
}
.appointmentSection .selectedAppointmentInput path {
  opacity: 1;
}
.searchSection,
.filterSection {
  transition: all 150ms linear;
  opacity: 1;
}
.searchSection.hiddenSection,
.filterSection.hiddenSection {
  display: none;
  opacity: 0;
  padding: 8px 0;
  margin: 8px 0;
  width: 0;
  overflow: hidden;
}
.searchSection .availableSegment,
.filterSection .availableSegment {
  cursor: pointer;
  transition: all 150ms linear;
  width: 180px;
  border: 1px solid #d0d0d0;
}
.searchSection .availableSegment:hover,
.filterSection .availableSegment:hover {
  background-color: #f7f7f7;
}
.searchSection .availableSegment.shortDuration,
.filterSection .availableSegment.shortDuration {
  color: #404041 !important;
  background: repeating-linear-gradient(-45deg, #f0f0f0, #f0f0f0 7px, white 7px, white 14px);
}
.searchSection .availableSegment.shortDuration path,
.filterSection .availableSegment.shortDuration path {
  fill: #404041 !important;
}
.searchSection .availableSegment.shortDuration.selected,
.filterSection .availableSegment.shortDuration.selected {
  background: repeating-linear-gradient(-45deg, #ffb74d, #ffb74d 7px, #ff9800 7px, #ff9800 14px);
}
.searchSection .availableSegment.shortDuration.selected path,
.filterSection .availableSegment.shortDuration.selected path {
  fill: white !important;
}
.searchSection .availableSegment.shortDuration.appointment,
.filterSection .availableSegment.shortDuration.appointment {
  color: white !important;
  background: repeating-linear-gradient(-45deg, #696969, #696969 7px, #404041 7px, #404041 14px) !important;
}
.searchSection .availableSegment.shortDuration.appointment path,
.filterSection .availableSegment.shortDuration.appointment path {
  fill: white !important;
}
.searchSection .availableSegment.shortDuration.appointment.selected,
.filterSection .availableSegment.shortDuration.appointment.selected {
  background: repeating-linear-gradient(-45deg, #6d1212, #6d1212 7px, #b71c1c 7px, #b71c1c 14px) !important;
}
.searchSection .availableSegment.appointment,
.filterSection .availableSegment.appointment {
  color: white;
}
.searchSection .availableSegment.appointment path,
.filterSection .availableSegment.appointment path {
  fill: white;
}
.searchSection .availableSegment.appointment.overturn,
.filterSection .availableSegment.appointment.overturn {
  margin-top: -3px !important;
  background-color: #d32f2f;
  min-height: 30px !important;
  padding: 0 8px;
  cursor: default;
}
.searchSection .availableSegment.appointment.overturn.selected,
.filterSection .availableSegment.appointment.overturn.selected {
  background-color: #d32f2f;
}
.searchSection .availableSegment.appointment.overturn:hover,
.filterSection .availableSegment.appointment.overturn:hover {
  background-color: #c02929 !important;
}
.searchSection .availableSegment.appointment.toBeSet,
.filterSection .availableSegment.appointment.toBeSet {
  background-color: #666666;
  color: #e6e6e6;
  min-height: 30px !important;
  cursor: not-allowed;
}
.searchSection .availableSegment.appointment.toBeSet path,
.filterSection .availableSegment.appointment.toBeSet path {
  fill: #e6e6e6;
}
.searchSection .availableSegment.appointment.toBeSet:hover,
.filterSection .availableSegment.appointment.toBeSet:hover {
  background-color: #595959 !important;
}
.searchSection .segmentConfig,
.filterSection .segmentConfig {
  position: absolute;
  width: 404px;
  margin: 0 8px;
  background-color: white;
  color: #404041;
  border-bottom-width: 4px;
  top: -1px;
  left: 100%;
  cursor: default;
}
.searchSection .segmentConfig path,
.filterSection .segmentConfig path {
  fill: #404041 !important;
}
.searchSection .segmentConfig.appointment,
.filterSection .segmentConfig.appointment {
  border: 1px solid #d32f2f;
  border-bottom-width: 4px;
}
.searchSection .segmentConfig.appointment .overturnHeader,
.filterSection .segmentConfig.appointment .overturnHeader {
  background-color: #d32f2f;
  color: white;
  padding: 4px 8px;
  font-weight: 200;
  margin: -8px -8px 8px -8px;
  border-top-left-radius: 13px;
  border-top-right-radius: 13px;
}
.appointmentDay {
  cursor: pointer;
  border-radius: 10px;
  line-height: 1;
  padding: 6px 0;
}
.appointmentDay.today {
  background-color: #f1f1f1;
}
.appointmentDay:hover .appointmentDayRange {
  color: white;
}
.appointmentDay:hover .appointmentDayRange .freeRange.bg-episode,
.appointmentDay:hover .appointmentDayRange .freeRange.bg-ambulatory_surgery {
  background-color: #4db6ac;
  border: 1px solid #4db6ac;
}
.appointmentDay:hover .appointmentDayRange .freeRange.bg-ambulatory {
  background-color: #ffb74d;
  border: 1px solid #ffb74d;
}
.appointmentDay .appointmentDayRange {
  width: 50px;
  height: 100%;
  margin: 5px 16px;
  border-radius: 2px 2px 0 0;
  text-align: center;
  justify-content: flex-end;
  transition: 150ms all linear;
}
.appointmentDay .appointmentDayRange .freeRange {
  background-color: white;
  border: 1px solid #d0d0d0;
}
.appointmentDay.selected {
  font-weight: 700;
}
.appointmentDay.selected.color-episode,
.appointmentDay.selected.color-c {
  color: #009688;
}
.appointmentDay.selected.color-ambulatory {
  color: #ff9800;
}
.appointmentDay.selected .freeRange.bg-episode,
.appointmentDay.selected .freeRange.bg-ambulatory_surgery {
  background-color: #009688;
}
.appointmentDay.selected .freeRange.bg-ambulatory {
  background-color: #ff9800;
}
.navigateDate {
  padding: 0 25px;
  border-radius: 2px;
  margin: 0 0 100px 0;
  cursor: pointer;
  justify-content: center;
}
.navigateDate:hover {
  background-color: #d6d6d6;
}
.navigateWeek {
  padding: 0 10px;
  border-radius: 2px;
  cursor: pointer;
  justify-content: center;
}
.navigateWeek:hover {
  background-color: #d6d6d6;
}
.space-bottom {
  margin-bottom: 8px;
}
.space-top {
  margin-top: 8px;
}
.defaultTextarea {
  height: 80px;
  font-size: 12px;
}
.smallInputTitle {
  font-size: 12px;
  font-weight: 200;
}
.materialInput:focus {
  border-bottom: 1px solid rgba(0, 0, 0, 0.2) !important;
}
.materialInput.noArrow {
  background-image: none;
  -webkit-appearance: none;
  cursor: pointer;
}
.materialInput.timeInput::-webkit-inner-spin-button,
.materialInput.timeInput::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.materialInput.hideSpinners::-webkit-inner-spin-button,
.materialInput.hideSpinners::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.materialInput.numberInput {
  font-size: 32px;
  width: 100px;
  margin: 0 5px;
  text-align: center;
}
.minorInfoText {
  color: #afafaf;
  font-size: 12px;
}
.minorInfoText .highlighted {
  color: #404041;
}
.lessProminentText {
  color: #909090;
  font-size: 14px;
}
.cellPhoneinput::placeholder {
  opacity: 1;
  font-size: 12px;
  color: #afafaf;
}
.cellPhoneinput.hidePlaceholder::placeholder {
  opacity: 0;
}
.defaultSemantic {
  border-bottom: 1px solid rgba(0, 0, 0, 0) !important;
  border-radius: 0;
  padding: 0 30px 0 0;
}
.ui.search.dropdown {
  min-width: 50px;
}
.ui.search.dropdown.large {
  width: 100%;
}
.invisibleSemantic {
  border-bottom: 0px solid transparent !important;
  border-radius: 0;
  padding: 0 30px 0 0;
}
.currentMenuAItem:hover {
  text-decoration: none;
}
.patientPicture {
  width: 60px;
  height: 60px;
  border-radius: 15px;
  transition: all 150ms linear;
  position: relative;
}
.patientPicture .patientGender {
  font-size: 30px;
  color: white;
}
.patientPicture.isDead {
  color: #717171 !important;
}
.patientCard {
  background-color: white;
  width: 500px;
  min-height: 80px;
  font-size: 14px;
  overflow: hidden;
  transition: all 300ms ease-in-out;
  margin: 4px auto;
  border: 1px solid #d0d0d0;
}
.patientCard.expanded {
  margin: 5px auto;
  min-height: fit-content;
}
.patientCard.expanded.rounded {
  border-radius: 20px;
}
.patientCard .patientInfo {
  transition: all 150ms linear;
  align-self: stretch;
  min-height: 0;
  max-height: 0;
}
.patientCard .patientInfo.expanded {
  max-height: 400px;
  overflow: auto;
}
.patientCard .patientInfo .patientInfoContent {
  padding: 10px;
  font-size: 12px;
  align-self: flex-start;
  margin-left: 54px;
}
.patientCard .patientInfo .patientInfoContent .noExtraInfo {
  text-align: center;
  font-size: 18px;
  height: 100%;
}
.patientCard.disabled {
  opacity: 0.5;
}
.patientCard.isDead {
  background-color: #717171 !important;
  color: white !important;
}
.patientCard.isDead:hover {
  background-color: #585858 !important;
  color: white !important;
}
.patientCard.isDead path {
  fill: white !important;
}
.patientCard.isDead i {
  color: white !important;
}
.patientCardTemp {
  background-color: white;
  width: 500px;
  min-height: 80px;
  font-size: 14px;
  overflow: hidden;
  transition: all 300ms ease-in-out;
  margin: 4px auto;
  border: 1px solid #d0d0d0;
}
.patientCardTemp.expanded {
  margin: 5px auto;
  min-height: 200px;
}
.patientCardTemp.expanded.rounded {
  border-radius: 20px;
}
.patientCardTemp .personDetails {
  white-space: nowrap;
  max-width: 320px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.patientCardTemp .personInitials {
  min-width: 60px;
  height: 60px;
}
.patientCardTemp .itemsContainer {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.patientCardTemp .patientInfo {
  transition: all 150ms linear;
  align-self: stretch;
  min-height: 0;
  max-height: 0;
}
.patientCardTemp .patientInfo.expanded {
  max-height: 400px;
  min-height: 200px;
  overflow: auto;
}
.patientCardTemp .patientInfo .patientInfoContent {
  padding: 10px;
  font-size: 12px;
  align-self: flex-start;
  margin-left: 54px;
}
.patientCardTemp .patientInfo .patientInfoContent .noExtraInfo {
  text-align: center;
  font-size: 18px;
  height: 100%;
}
.patientCardTemp.disabled {
  opacity: 0.5;
}
.patientCardTemp.isDead {
  background-color: #717171 !important;
  color: white !important;
}
.patientCardTemp.isDead:hover {
  background-color: #585858 !important;
  color: white !important;
}
.patientCardTemp.isDead path {
  fill: white !important;
}
.patientCardTemp.isDead i {
  color: white !important;
}
.patientSelected {
  border: 2px solid #007bff;
  background-color: #e9f5ff;
}
.patient-labels-container {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 5px;
  margin-bottom: 5px;
  align-items: center;
}
.patient-label {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 12px;
  font-size: 11px;
  font-weight: 400;
  color: white;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
  border-radius: 2px;
  white-space: nowrap;
  min-height: 16px;
  line-height: 16px;
}
.appointmentPanel {
  position: fixed;
  top: 42px;
  bottom: 2px;
  padding: 0;
  margin: auto;
  right: -360px;
  width: 360px;
  background-color: white;
  z-index: 2;
  transition: all 150ms linear;
  overflow: auto;
  overflow-x: hidden;
}
.appointmentPanel::-webkit-scrollbar-track {
  border-radius: 15px;
}
.appointmentPanel.open {
  right: 2px;
}
.availabilitiesPanel {
  position: fixed;
  background-color: white;
  z-index: 3;
  transition: all 150ms linear;
  right: 8px;
  top: 96px;
  bottom: 84px;
  width: 296px;
  box-shadow: -1px 1px 2px rgba(0, 0, 0, 0.25);
  visibility: hidden;
}
.availabilitiesPanel.open {
  visibility: visible;
}
.availabilitiesPanel .availabilitiesFrom {
  border: 1px solid #b7b7b7;
  border-radius: 2px;
  padding: 2px 5px;
  position: sticky;
  top: 0;
  background: #fff;
}
.availabilitiesPanel .minPaddingRight {
  padding-right: 10px;
}
.availabilitiesPanel .stickyElement {
  position: sticky;
  top: 0;
  background: #fff;
  z-index: 2;
}
.availabilitiesPanel .subTitle {
  width: calc(100% - 5px);
  border-bottom: 1px solid #afafaf;
  padding-bottom: 1px;
  margin: 0 5px 5px 0;
}
.crossed {
  text-decoration: line-through;
}
.listLeftRoundInfo {
  margin-right: 5px;
  width: 25px;
  height: 25px;
  color: white;
  justify-content: center;
  background-color: #404041;
  font-weight: 400;
  border-radius: 50%;
}
.weeklyAppointment {
  position: absolute;
  width: 99%;
  margin: 0 1px;
  min-height: 20px;
  font-size: 12px;
  padding: 4px;
  background-color: #ff9800;
  color: white;
  border-radius: 2px;
  overflow: visible;
  cursor: pointer;
}
.weeklyAppointment.sobreturno {
  background-color: #d32f2f !important;
  color: white !important;
  border: 1px solid transparent;
  width: 50%;
  right: 0;
  z-index: 2;
}
.weeklyAppointment.pendiente {
  background-color: white;
}
.weeklyAppointment.pendiente.bg-ambulatory {
  color: #ff9800;
  border: 1px solid #ff9800;
}
.weeklyAppointment.pendiente.bg-ambulatory_surgery {
  color: #009688;
  border: 1px solid #009688;
}
.weeklyAppointment.pendiente.bg-dayhospital {
  color: #9c27b0;
  border: 1px solid #9c27b0;
}
.weeklyAppointment.workingHours {
  background-color: white;
  opacity: 0.65;
  cursor: default;
  border: 0;
  border-top: 1px solid #cecece;
  border-bottom: 1px solid #cecece;
}
.weeklyAppointment.notWorking {
  background: repeating-linear-gradient(-45deg, white, white 5px, #404041 5px, #404041 10px);
  opacity: 0.2;
  cursor: default;
}
.weeklyAppointmentDetail {
  position: fixed;
  width: 400px;
  height: 500px;
  top: 10px;
  bottom: 0;
  right: 0;
  left: 0;
  z-index: 2;
  background-color: white;
  margin: auto;
  box-shadow: 1px 4px 12px 7px rgba(0, 0, 0, 0.3);
}
.weeklyBillableDetails {
  background-color: #535353;
  color: white;
  position: absolute;
  height: 460px;
  width: 280px;
  top: 20px;
  bottom: 0;
  right: 0;
  left: 0%;
  margin: auto;
  box-shadow: 1px 4px 4px 0px rgba(0, 0, 0, 0.3);
  transition: all 300ms linear;
  z-index: -1;
}
.weeklyBillableDetails.open {
  left: 100%;
}
.weeklyAppointmentBackdrop {
  background-color: black;
  opacity: 0.15;
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  z-index: 2;
}
.weekToday {
  background-color: #f3f3f3;
}
.scheduleHour {
  border: 0;
  background-color: #ececec;
  border-bottom: 1px solid #cecece;
  border-left: 1px solid #cecece;
  cursor: default;
}
.professionalHeader {
  border-bottom: 1px solid #d0d0d0;
  background-color: #e2e2e2;
}
.currentTimeLine {
  background-color: #d32f2f;
  height: 2px;
  width: 98%;
  margin: 0 2px;
  position: absolute;
}
.unfocusedInput {
  opacity: 0;
}
.fakeBackdrop {
  background-color: black;
  opacity: 0.5;
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  z-index: 2;
}
.newBillableDialog {
  position: fixed;
  width: 700px;
  height: 290px;
  top: 10px;
  bottom: 0;
  right: 0;
  left: 0;
  z-index: 2;
  background-color: white;
  margin: auto;
  box-shadow: 0px 5px 7px 0px rgba(0, 0, 0, 0.3);
}
.patientSectionMenu {
  width: 200px;
  padding: 8px 8px 8px 0;
  justify-content: center;
}
.noExtraInfo {
  opacity: 0.4;
  font-style: italic;
}
.ellipsisText {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.materialFlag {
  margin-right: 5px;
  border-radius: 2px;
  background-color: lightgray;
}
.patientEditDialog {
  position: fixed;
  width: 700px;
}
.sectionTitle {
  font-size: 24px;
  font-weight: 200;
}
.funderCard {
  background-color: #d5d5d5;
  border-radius: 10px;
  color: #404041;
  height: 120px;
  width: 300px;
  line-height: 1;
}
.funderCard .bigData {
  font-size: 18px;
  font-weight: 700;
}
.funderCard .smallData {
  font-size: 14px;
}
.funderCard .field {
  opacity: 0.7;
  font-size: 10px;
}
.profileAttachment {
  min-width: 100px;
  min-height: 100px;
  margin: 0;
  border: 1px dashed #AFAFAF;
  background-color: #ECECEC;
  justify-content: center;
  color: #BDBDBD;
}
.profileAttachment:hover {
  background-color: #DCDCDC;
}
.indexNumber {
  border: 1px solid #404041;
  color: #404041;
  min-width: 17px;
  width: 17px;
  height: 17px;
  border-radius: 50%;
  text-align: center;
  font-size: 9px;
  padding: 0;
  line-height: 1.8;
}
.indexNumber.big {
  width: 22px;
  height: 22px;
  padding: 2px;
}
.professionalBadge {
  width: 530px;
  background-color: white;
  flex-direction: column;
  display: flex;
  line-height: 1.1;
  margin: 1px 8px;
  transition: all 150ms linear;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
}
.professionalBadge:hover {
  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
}
.professionalBadge.expanded {
  margin: 8px;
  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
}
.professionalBadge .pName {
  font-size: 22px;
  font-weight: 200;
  padding: 0 4px;
  max-width: 100%;
}
.professionalBadge .pPhoto {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  margin: 0 8px;
}
.professionalBadge .pSpecialties {
  font-size: 12px;
  font-weight: 200;
  padding: 2px 4px;
  max-width: 100%;
}
.initials {
  text-align: center;
  border-radius: 15px;
  padding: 8px 0;
  background-color: #404041;
  color: white;
  justify-content: space-around;
  font-size: 30px;
  font-weight: 200;
}
.initials.outpatient {
  background-color: #ff9800;
}
.initials.inhospital {
  background-color: #3f51b5;
}
.initials.episode {
  background-color: #009688;
}
.appDashCard {
  background-color: white;
  width: 375px;
  border: 1px solid #d0d0d0;
}
.hoverGray:hover {
  background-color: #e6e6e6;
}
.framedStatic {
  border: 1px solid #E0E0E0;
  background-color: #FBFBFB;
  border-radius: 2px;
  padding: 8px;
}
.framedDarkStatic {
  border: 1px solid #E0E0E0;
  background-color: #E0E0E0;
  border-radius: 2px;
  padding: 8px;
}
.framed {
  padding: 8px;
  border: 1px solid transparent;
}
.framed:hover {
  border: 1px solid #E0E0E0;
  background-color: #FBFBFB;
  border-radius: 2px;
}
.dialogContentRow {
  height: 42px;
}
.subtitleDialogSticky {
  display: block;
  position: sticky;
  top: 0;
  background-color: #fff;
  padding: 7px 0;
  color: #9e9e9e;
}
.noValueText {
  font-style: italic;
  font-size: 14px;
  opacity: 0.5;
}
.invalidText {
  font-style: italic;
  color: #b71c1c;
  font-size: 12px;
}
.u-outpatient {
  border-bottom: 1px solid #ffb74d;
}
.u-inhospital {
  border-bottom: 1px solid #7986cb;
}
.u-dayhospital {
  border-bottom: 1px solid #ba68c8;
}
.nullified {
  text-decoration: line-through;
  font-style: italic;
  opacity: 0.8;
}
.universalSearch {
  position: fixed;
  z-index: 1000;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  justify-content: center;
}
.universalSearch .backdrop {
  position: absolute;
  z-index: -1;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.2);
}
.universalSearch .main {
  z-index: 2;
  background-color: #F7F7F7;
  width: 700px;
  height: 60px;
  border-radius: 15px;
  padding: 0 8px;
  transition: all 150ms linear;
  position: relative;
  border: 1px solid #898989;
}
.universalSearch .main.searchMade {
  max-height: 500px;
  height: auto;
  border-radius: 15px;
  padding: 10px;
  overflow: auto;
}
.universalSearch .main .search {
  font-size: 30px;
  border: 0 !important;
  margin-left: 8px;
}
.universalSearch .main .typeahead {
  position: absolute;
  top: 100%;
  left: -1px;
  right: -1px;
  max-height: 300px;
  background-color: #F7F7F7;
  border-radius: 0 0 15px 15px;
  border: 1px solid #898989;
  border-top: 0;
  overflow: auto;
}
.universalSearch .main .typeahead .materialButton {
  min-height: 44px;
  max-width: 700px;
}
.universalSearch .main .itemIcon {
  min-width: 28px;
  width: 28px;
  height: 28px;
  margin: 0 4px;
}
.universalSearch .main .itemName {
  font-size: 16px;
}
.universalSearch .main .itemSubtitle {
  font-size: 12px;
  opacity: 0.6;
}
.arrivalDialogHeader {
  min-height: 90px;
  color: white;
  border-bottom: 1px solid #b5b5b5;
}
.arrivalDialogHeader path {
  fill: white;
}
.arrivalDialogHeader.rounded {
  border-bottom: 0px;
  border-radius: 15px 15px 0 0;
  padding: 0;
}
dialog.rounded {
  border-radius: 15px;
  padding: 0;
  box-shadow: 0 0 0 0 transparent;
}
.dialogBody {
  max-height: 70vh;
  overflow: auto;
}
.locationName {
  justify-content: center;
  font-weight: 400;
  font-size: 18px;
  text-align: center;
  padding: 4px;
}
.locationsDay {
  min-height: fit-content;
}
.locationsDay .locationsHeader {
  background-color: #efefef;
  padding: 8px;
  margin: 0;
}
.locationsDay .hourCell {
  justify-content: center;
  font-size: 10px;
  padding-top: 2px;
  min-width: 30px;
}
.locationsDay .proAvailability {
  background-color: #404041;
  position: absolute;
  width: 98%;
  color: white;
  border-radius: 15px;
  margin: 0 1%;
  padding: 3px;
}
.locationsDay .proAppointment {
  position: absolute;
  width: 80%;
  border-radius: 2px;
  margin: 0 5% 0 15%;
  font-size: 9px;
}
#fixedLocationsHeader {
  position: fixed;
  right: 0;
  left: 0px;
  background-color: #efefef;
  padding: 8px 10px;
  z-index: 2;
}
.agendaAppointment {
  border-radius: 2px;
  padding: 0 8px;
  cursor: pointer;
}
.agendaAppointment:hover {
  background-color: #ececec;
}
.rescheduleContainer {
  border-radius: 10px;
  padding: 4px 8px;
  width: 700px;
}
.rescheduleContainer:hover {
  background-color: #dedede;
}
.colorBullet {
  min-width: 15px;
  height: 15px;
  border-radius: 50%;
  color: white;
  font-size: 10px;
  text-align: center;
  line-height: 1.5;
  position: relative;
  overflow: visible;
}
.colorBullet.pendiente {
  background-color: #f57f17;
}
.colorBullet.cancelado {
  background-color: #d32f2f;
}
.colorBullet.reprogramado {
  background-color: #388e3c;
}
.ccButton {
  font-size: 32px;
  padding: 20px;
  margin: 20px;
  border-radius: 15px;
  cursor: pointer;
  transition: all 200ms linear;
}
.ccButton.outpatient {
  background-color: #a68759;
  color: white;
}
.ccButton.outpatient:hover {
  background-color: #ff9800;
}
.ccButton.dayhospital {
  background-color: #8b7a8e;
  color: white;
}
.ccButton.dayhospital:hover {
  background-color: #9c27b0;
}
.ccButton.episode {
  background-color: #6d908d;
  color: white;
}
.ccButton.episode:hover {
  background-color: #009688;
}
.shortcutsHeader {
  margin-bottom: 5px;
  align-self: center;
  font-size: 16px;
}
.shortcutTitle {
  font-weight: 200;
  padding: 2px 0;
}
.shortcutLetter {
  background-color: #e2e2e2;
  border: 1px solid #c1c1c1;
  color: #9c9c9c;
  border-radius: 2px;
  font-weight: 200;
  margin: 2px;
  font-size: 11px;
  width: 17px;
  text-align: center;
}
.countdownContainer {
  position: fixed;
  bottom: 20px;
  left: 20px;
  margin: 0 auto;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  color: #404041;
  justify-content: center;
  font-size: 24px;
}
.countdownContainer .countdownCover {
  position: absolute;
  background-color: white;
  border-radius: 50%;
  width: 70px;
  height: 70px;
  color: #404041;
  justify-content: center;
}
.header .topHeader {
  border-bottom: 1px solid #d0d0d0;
  padding-right: 8px;
}
.header .bottomHeader {
  padding: 0 8px 0 0;
}
.tableFooter {
  height: 40px;
  min-height: 40px;
  background-color: white;
}
.navDrawer {
  position: fixed;
  bottom: 0;
  top: 40px;
  width: 310px;
  background-color: white;
  z-index: 3;
  transition: all 150ms linear;
  padding: 8px;
}
.navDrawer.left {
  left: -310px;
}
.navDrawer.left.open {
  left: 0px;
}
.navDrawer.right {
  right: -310px;
}
.navDrawer.right.open {
  right: 0px;
}
.navDrawer.summary {
  top: 135px;
  bottom: 70px;
}
.navDrawer.summary.open {
  right: 20px;
}
.navDrawer .drawerContent {
  min-height: fit-content;
  cursor: pointer;
}
.navDrawer .drawerContent > div.horizontalLayout {
  margin: 8px;
}
.navDrawer .drawerContent:hover {
  font-weight: 700;
  background-color: #fafafa;
}
.navDrawer .drawerContent .closed {
  opacity: 0.5;
}
.tableTitle {
  background-color: lightgray;
  font-weight: 700;
}
.tableContent {
  padding: 4px;
  width: 150px;
  min-height: 35px;
  justify-content: flex-end;
}
.itemTableRow {
  position: relative;
  padding: 0;
  font-size: 12px;
  white-space: nowrap;
  height: 40px;
  transition: all 150ms linear;
  min-height: 40px;
  width: fit-content;
  cursor: pointer;
}
.itemTableRow.cancelledItem {
  opacity: 0.3;
}
.itemTableRow.cancelledItem:hover {
  opacity: 0.7;
}
.itemTableRow.selected {
  background-color: #477ACD !important;
  color: white !important;
}
.itemTableRow.selected .itemCell {
  border-bottom: 1px solid #5e89de;
}
.itemTableRow.selected .itemCell .materialButton {
  color: white !important;
}
.itemTableRow.selected .itemCell path {
  fill: white !important;
}
.itemTableRow.selected:hover {
  background-color: #0d47a1 !important;
}
.itemTableRow.selected:hover .itemCell,
.itemTableRow.selected:hover .itemAbsolute {
  background-color: #0d47a1 !important;
}
.itemTableRow.selected .itemCell,
.itemTableRow.selected .itemAbsolute {
  border-bottom: 1px solid #5e89de;
  background-color: #477ACD !important;
  color: white !important;
}
.itemTableRow:hover {
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
  z-index: 2;
}
.itemTableRow:hover .itemCell {
  background-color: white;
}
.itemTableRow .itemCell {
  padding: 0 4px;
  height: 100%;
  border-bottom: 1px solid #f1f1f1;
  background-color: #fefefe;
  overflow: hidden;
  text-overflow: ellipsis;
  display: flex;
  flex-direction: row;
  align-items: center;
}
.itemTableRow .itemCell .noValue {
  font-style: italic;
  opacity: 0.25;
}
.itemTableRow .itemCell .groupCharge {
  color: #e4e4e4;
  font-style: italic;
}
.itemTableRow .itemCell.pending,
.itemTableRow .itemCell.not-started,
.itemTableRow .itemCell.pre-processed {
  background-color: #666666;
  color: white;
}
.itemTableRow .itemCell.in-review,
.itemTableRow .itemCell.partial-informed,
.itemTableRow .itemCell.not-billed {
  background-color: #1976d2;
  color: white;
}
.itemTableRow .itemCell.processing,
.itemTableRow .itemCell.in-process,
.itemTableRow .itemCell.in-progress {
  background-color: #e65100;
  color: white;
}
.itemTableRow .itemCell.to-fix,
.itemTableRow .itemCell.in-transit {
  background-color: #9c27b0;
  color: white;
}
.itemTableRow .itemCell.reviewed,
.itemTableRow .itemCell.informed,
.itemTableRow .itemCell.final-revision,
.itemTableRow .itemCell.billed {
  background-color: #0d47a1;
  color: white;
}
.itemTableRow .itemCell.reviewed-wrong {
  background-color: #b71c1c;
  color: white;
}
.itemTableRow .itemCell.sent,
.itemTableRow .itemCell.finished {
  background-color: #1b5e20;
  color: white;
}
.itemTableRow .itemCell.deleted {
  background-color: #d32f2f;
  color: white;
}
.itemTableRow .itemCell.ready-to-audit {
  background-color: #ee9b00;
  color: white;
}
.itemTableRow .itemCell.missing-documentation {
  background-color: #344966;
  color: white;
}
.itemTableRow .itemCell.canceled {
  background-color: #0D1821;
  color: white;
}
.itemTableRow .itemCell.canceledItem.chargeState {
  text-decoration: line-through;
}
.itemTableRow .itemCell.pending.chargeState,
.itemTableRow .itemCell.not-started.chargeState,
.itemTableRow .itemCell.pre-processed.chargeState {
  background-color: #666666;
  color: white;
}
.itemTableRow .itemCell.in-review.chargeState,
.itemTableRow .itemCell.not-billed.chargeState,
.itemTableRow .itemCell.in-process.chargeState {
  background-color: #e65100;
  color: white;
}
.itemTableRow .itemCell.to-fix.chargeState,
.itemTableRow .itemCell.in-transit.chargeState {
  background-color: #9c27b0;
  color: white;
}
.itemTableRow .itemCell.reviewed.chargeState,
.itemTableRow .itemCell.informed.chargeState,
.itemTableRow .itemCell.billed.chargeState {
  background-color: #1b5e20;
  color: white;
}
.itemTableRow .itemCell.reviewed-wrong.chargeState {
  background-color: #b71c1c;
  color: white;
}
.itemTableRow .itemCell.final-revision.chargeState,
.itemTableRow .itemCell.finalized.chargeState {
  background-color: #0d47a1;
  color: white;
}
.itemTableRow .itemCell.ready-to-audit.chargeState {
  background-color: #ee9b00;
  color: white;
}
.itemTableRow .itemCell.missing-documentation.chargeState {
  background-color: #344966;
  color: white;
}
.itemTableRow .itemCell.canceled.chargeState {
  background-color: #0D1821;
  color: white;
}
.smallColumn {
  min-width: 40px !important;
  width: 40px !important;
}
.itemAbsolute {
  position: sticky;
  left: 0;
  border-right: 3px solid #EBEBEB;
  border-bottom: 1px solid #f1f1f1;
  height: 100%;
  background-color: white;
  z-index: 1;
}
.itemTableHeader {
  border-bottom: 1px solid #EBEBEB;
  background-color: white;
  border-radius: 2px;
  position: sticky;
  top: 0;
  height: 40px;
  width: fit-content;
  z-index: 3;
  display: -webkit-inline-box;
}
.itemTableHeader .itemTableCategory {
  padding: 5px 4px 2px;
  font-weight: 700;
  font-size: 11px;
  display: flex;
  flex-direction: row;
  align-items: center;
  text-transform: uppercase;
}
.itemTableHeader .itemTableCategory.button {
  cursor: pointer;
}
.itemTableHeader .itemTableCategory.button:hover {
  background-color: #fafafa;
  font-weight: 700;
}
.filterPill {
  background-color: white;
  color: #404041;
  padding: 3px 8px;
  margin: 3px;
  border-radius: 15px;
  font-size: 11px;
  line-height: 1;
  cursor: pointer;
  white-space: nowrap;
}
.filterPill:hover {
  background-color: #d4d4d4;
}
.filterPill.greyBackground {
  background-color: #d4d4d4;
}
.filterPill.greyBackground:hover {
  background-color: #c7c7c7;
}
.filterPill.greyBackground.selected {
  background-color: #1976d2;
  color: white;
}
.filterPillNotClickable {
  background-color: white;
  color: #404041;
  padding: 3px 8px;
  margin: 3px;
  border-radius: 15px;
  font-size: 11px;
  line-height: 1;
  white-space: nowrap;
}
.filterPillNotClickable.inAdvancedSearch {
  white-space: normal;
  padding: 4px 8px;
  border-radius: 5px;
}
.loader {
  margin: 25px auto 15px;
  width: 70px;
  text-align: center;
}
.loader > div {
  width: 18px;
  height: 18px;
  background-color: #333;
  border-radius: 100%;
  display: inline-block;
  -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
  animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}
.loader .bounce1 {
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}
.loader .bounce2 {
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}
@-webkit-keyframes sk-bouncedelay {
  0%,
  80%,
  100% {
    -webkit-transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
  }
}
@keyframes sk-bouncedelay {
  0%,
  80%,
  100% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
.lightBox {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 40px;
  bottom: 0;
  left: 0;
  right: 0;
  align-items: stretch;
  background-color: black;
  cursor: default;
  z-index: 100;
  font-size: 18px;
}
.lightBox .image {
  background-repeat: no-repeat;
  background-position: 50% 50%;
  position: relative;
}
.lightBox .buttons {
  position: absolute;
  top: -40px;
  right: 20px;
  left: 20px;
  transition: all 150ms linear;
}
.lightBox .buttons i:hover {
  background-color: rgba(255, 255, 255, 0.2);
}
.lightBox .navButtons {
  position: absolute;
  top: 50%  ;
  bottom: 50%;
  transition: all 150ms linear;
}
.lightBox .navButtons.left {
  left: -50px;
}
.lightBox .navButtons.right {
  right: -50px;
}
.lightBox .navButtons i:hover {
  background-color: rgba(255, 255, 255, 0.2);
}
.lightBox .info {
  background-color: white;
  color: #404041;
  padding: 0;
  width: 0;
  transition: all 150ms linear;
}
.lightBox .info .infoHeader {
  padding: 10px 15px;
}
.lightBox .info .infoContent {
  padding: 10px 24px;
}
.lightBox .info .infoContent i {
  color: #767676;
}
.lightBox .info .infoContent path {
  fill: #767676;
}
.lightBox .info.visible {
  width: 345px;
}
.lightBox .info .lightboxData {
  padding: 20px 0;
}
.lightBox .lightBoxContainer:hover .buttons {
  top: 5px;
}
.lightBox .lightBoxContainer:hover .navButtons.left {
  left: 20px;
}
.lightBox .lightBoxContainer:hover .navButtons.right {
  right: 20px;
}
.lightBox .lightBoxContainer:hover .thumbnails {
  bottom: 0;
}
.lightBox .thumbnails {
  background-color: rgba(0, 0, 0, 0.3);
  position: absolute;
  bottom: -100px;
  left: 0;
  right: 0;
  height: 100px;
  overflow-x: auto;
  transition: all 150ms linear;
}
.lightBox .thumbnails .thumb {
  max-width: 100px;
  max-height: 60px;
  opacity: 0.5;
}
.lightBox .thumbnails .thumb:hover {
  opacity: 0.75;
}
.lightBox .thumbnails .thumb.selected {
  opacity: 1 !important;
  outline: 2px solid white;
}
.miNavigation {
  padding: 8px 0;
  background-color: white;
  line-height: 1;
  width: 200px;
  border-radius: 3px;
  position: fixed;
  top: 110px;
  left: calc(50vw - 566px);
  border: 1px solid #d0d0d0;
}
.miNavigation .title {
  font-size: 18px;
}
.miNavigation .item {
  padding: 0 8px 0 10px;
  font-weight: 200;
  min-height: 28px;
  font-size: 14px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 2;
  cursor: pointer;
  transition: all 0ms linear;
}
.miNavigation .item:hover {
  font-weight: 600;
}
.miNavigation .item.selectedItem {
  font-weight: 600;
  background-color: #F5F5F5;
  transition: all 0ms linear;
  cursor: default;
}
.navigationSection {
  padding: 8px;
  border: 1px solid #dadada;
  background-color: #ececec;
}
.materialSlider {
  -webkit-appearance: none;
  background-color: transparent;
}
.materialSlider:focus {
  outline: none;
}
.materialSlider::-webkit-slider-thumb {
  -webkit-appearance: none;
  height: 18px;
  width: 6px;
  background: white;
  cursor: ew-resize;
  box-shadow: 1px 0 0 rgba(0, 0, 0, 0.1);
  border: 0 solid transparent;
  border-radius: 2px;
  margin-top: -6px;
}
.materialSlider::-webkit-slider-runnable-track {
  width: 100%;
  height: 3px;
  cursor: pointer;
  box-shadow: 1px 0 0 rgba(0, 0, 0, 0.1);
  border: 0 solid transparent;
  background: #f0f0f0;
  border-radius: 0;
}
.mainSearchResults {
  transition: all 150ms linear;
}
.bigSearchContainer {
  z-index: 3;
  height: 40px;
  width: 500px;
  border-radius: 28px;
  padding: 5px 6px 5px 24px;
  margin: 0;
  background-color: white;
  transition: all 300ms ease-in-out;
}
.bigSearchContainer.cardContainer {
  border: 1px solid #d0d0d0;
  background-color: white;
}
.advancedSearch {
  z-index: 2;
  position: absolute;
  top: 8px;
  left: 0;
  right: 0;
  height: fit-content;
  overflow: hidden;
  background-color: white;
  transition: all 150ms linear;
  padding-top: 0;
  transform: scaleY(0);
}
.advancedSearch.open {
  padding-top: 30px;
  transform: scaleY(1);
  overflow: visible;
}
.note {
  background-color: #ffef7c;
}
.subText {
  opacity: 0.5;
  font-size: 12px;
  margin-left: 4px;
}
.color-in-process,
.color-in-process.outlined,
.color-in-preparation,
.color-in-preparation.outlined {
  color: #e65100;
}
.color-sent,
.color-sent.outlined {
  color: #0d47a1;
}
.color-accepted,
.color-accepted.outlined,
.color-in-transit,
.color-in-transit.outlined {
  color: #1b5e20;
}
.color-rejected,
.color-rejected.outlined {
  color: #b71c1c;
}
.color-realized,
.color-realized.outlined,
.color-ready,
.color-ready.outlined {
  color: #9c27b0;
}
.color-expired,
.color-expired.outlined {
  color: #909090;
}
.color-payed,
.color-payed.outlined,
.color-delivered,
.color-delivered.outlined {
  color: #388e3c;
}
.color-episode,
.color-ambulatory_surgery {
  color: #009688 !important;
}
.color-episode path,
.color-ambulatory_surgery path {
  fill: #009688 !important;
}
.color-ambulatory {
  color: #ff9800 !important;
}
.color-ambulatory path {
  fill: #ff9800 !important;
}
.color-day_hospital {
  color: #9c27b0 !important;
}
.color-day_hospital path {
  fill: #9c27b0 !important;
}
.bg-in-process,
.bg-in-preparation {
  background-color: #e65100;
  color: white !important;
  font-weight: 650;
  letter-spacing: 0.5px;
}
.bg-in-process:hover,
.bg-in-preparation:hover {
  background-color: #cd4800 !important;
}
.bg-sent {
  background-color: #0d47a1;
  color: white !important;
  font-weight: 650;
  letter-spacing: 0.5px;
}
.bg-sent:hover {
  background-color: #0b3d89 !important;
}
.bg-accepted,
.bg-in-transit {
  background-color: #1b5e20;
  color: white !important;
  font-weight: 650;
  letter-spacing: 0.5px;
}
.bg-accepted:hover,
.bg-in-transit:hover {
  background-color: #154a19 !important;
}
.bg-rejected {
  background-color: #b71c1c;
  color: white !important;
  font-weight: 650;
  letter-spacing: 0.5px;
}
.bg-rejected:hover {
  background-color: #a11919 !important;
}
.bg-realized,
.bg-ready {
  background-color: #9c27b0;
  color: white !important;
  font-weight: 650;
  letter-spacing: 0.5px;
}
.bg-realized:hover,
.bg-ready:hover {
  background-color: #89229b !important;
}
.bg-expired {
  background-color: #909090;
  color: white !important;
  font-weight: 650;
  letter-spacing: 0.5px;
}
.bg-expired:hover {
  background-color: #838383 !important;
}
.bg-payed,
.bg-delivered {
  background-color: #388e3c;
  color: white !important;
  font-weight: 650;
  letter-spacing: 0.5px;
}
.bg-payed:hover,
.bg-delivered:hover {
  background-color: #317c34 !important;
}
.bg-editing_appointment {
  border: 5px solid red !important;
  color: white;
}
.bg-episode,
.bg-ambulatory_surgery {
  background-color: #009688;
  color: white;
}
.bg-episode-light,
.bg-ambulatory_surgery-light {
  background-color: #4db6ac;
  color: white;
}
.bg-episode path,
.bg-ambulatory_surgery path {
  fill: white;
}
.bg-episode.materialButton:hover,
.bg-ambulatory_surgery.materialButton:hover {
  opacity: 0.8;
  color: white !important;
}
.bg-episode.materialButton:hover path,
.bg-ambulatory_surgery.materialButton:hover path {
  fill: white;
}
.bg-episode:hover,
.bg-ambulatory_surgery:hover {
  background-color: #007d71 !important;
}
.bg-day_hospital {
  background-color: #9c27b0;
  color: white;
}
.bg-day_hospital-light {
  background-color: #ba68c8;
}
.bg-day_hospital path {
  fill: white;
}
.bg-day_hospital.materialButton:hover {
  opacity: 0.8;
  color: white !important;
}
.bg-day_hospital.materialButton:hover path {
  fill: white;
}
.bg-ambulatory {
  background-color: #ff9800;
  color: white;
}
.bg-ambulatory-light {
  background-color: #ffb74d;
}
.bg-ambulatory path {
  fill: white;
}
.bg-ambulatory.materialButton:hover {
  opacity: 0.8;
  color: white !important;
}
.bg-ambulatory.materialButton:hover path {
  fill: white;
}
.bg-ambulatory:hover {
  background-color: #e68900 !important;
}
.bg-laboratory {
  background-color: #404041;
  color: white;
}
.bg-laboratory path {
  fill: white;
}
.bg-laboratory.materialButton:hover {
  opacity: 0.8;
  color: white !important;
}
.bg-laboratory.materialButton:hover path {
  fill: white;
}
.bt-episode,
.bt-ambulatory_surgery {
  border-top: 1px solid #009688;
}
.bt-ambulatory {
  border-top: 1px solid #ff9800;
}
.bt-day_hospital {
  border-top: 1px solid #9c27b0;
}
.bt-laboratory {
  border-top: 1px solid #404041;
}
.bl-absences {
  border-left: 4px solid #404041;
}
.bl-episode,
.bl-ambulatory_surgery {
  border-left: 4px solid #009688;
}
.bl-ambulatory {
  border-left: 4px solid #ff9800;
}
.bl-day_hospital {
  border-left: 4px solid #9c27b0;
}
.bl-laboratory {
  border-left: 4px solid #404041;
}
.border-white {
  border: 1px solid white !important;
}
.border-lightgray {
  border: 1px solid #dcdcdc !important;
}
.border-dark {
  border: 1px solid #212121 !important;
}
.border-episode,
.border-ambulatory_surgery {
  border: 1px solid #009688 !important;
}
.border-ambulatory {
  border: 1px solid #ff9800 !important;
}
.border-day_hospital {
  border: 1px solid #9c27b0 !important;
}
.border-laboratory {
  border: 1px solid #404041 !important;
}
.border-default {
  border: 1px solid #d0d0d0;
}
.preference-tag {
  border-style: solid;
  border-width: 1px;
}
.scheduleTag {
  margin: 1px;
  font-size: 10px;
  border-radius: 2px;
  padding: 2px 4px;
  line-height: 1;
}
.scheduleTag.white {
  color: white !important;
}
.scheduleTag.white path {
  fill: white !important;
}
.disabledColourText {
  color: #9e9e9e !important;
}
.materialDragAndDrop {
  background-color: #F5F5F5;
  border: 1px dashed #C5C5C5;
  color: #9E9E9E;
  border-radius: 2px;
  cursor: pointer;
  text-align: center;
  align-items: center;
  padding: 14px;
  margin: 10px;
}
.materialDragAndDrop:hover {
  background-color: #e8e8e8;
}
.materialDragAndDrop .text {
  font-size: 24px;
  margin: 10px;
}
.materialDragAndDrop.dragover {
  background-color: #cfcfcf;
}
.newAppointmentMenu {
  justify-content: flex-end;
  overflow: visible;
  align-items: flex-end;
  width: 64px;
  padding: 4px;
}
.newAppointmentMenu .floatingLabel {
  width: 0;
  transition: all 150ms linear;
  overflow: hidden;
}
.newAppointmentMenu .materialButton {
  transition: width 150ms linear, border-radius 200ms linear;
  position: relative;
  padding: 10px;
  width: auto;
}
.newAppointmentMenu .materialButton.single {
  border-radius: 15px;
}
.newAppointmentMenu .materialButton.top {
  border-radius: 15px 15px 0 0;
}
.newAppointmentMenu .materialButton.top:hover {
  border-radius: 15px 15px 0 15px;
}
.newAppointmentMenu .materialButton.bottom {
  border-radius: 0 0 15px 15px;
}
.newAppointmentMenu .materialButton.bottom:hover {
  border-radius: 15px 0 15px 15px;
}
.newAppointmentMenu .materialButton:hover {
  opacity: 1;
  transition: width 150ms linear, border-radius 200ms linear;
}
.newAppointmentMenu .materialButton:hover .floatingLabel {
  margin-right: 8px;
  width: 100%;
}
.textButton {
  cursor: pointer;
  padding: 2px 10px;
  border: 0;
  margin: 2px 10px;
  color: #477ACD;
  background-color: transparent;
}
.textButton:hover {
  color: #3061b1;
}
.textButton.small {
  font-size: 12px;
  margin: 1px 0;
}
.textButton.disabledButton {
  color: #9e9e9e;
  cursor: default;
}
.textButton.selected {
  background-color: #477ACD;
  border-radius: 2px;
  color: white;
}
.textButton.selected:hover {
  background-color: #3061b1;
}
.rounded {
  border-radius: 15px;
  padding: 10px 12px;
}
.animated {
  transition: all 150ms linear;
}
.alreadySelectedButton:hover {
  cursor: default;
}
.defaultOmniaMsgColor {
  background-color: #f89802;
}
.warningOmniaMsgColor {
  background-color: #f80e02;
}
.portalContentLoading {
  justify-content: center;
  height: 100%;
}
.errorText {
  width: 90%;
  margin-left: 8px;
  font-size: 12px;
  color: #e40b00;
}
.errorText span {
  line-height: 1.4;
}
.omniaNotification {
  position: fixed;
  z-index: 1000;
  left: 15px;
  bottom: 15px;
  border-radius: 3px;
  background-color: #404041;
  color: white;
  padding: 8px;
}
.groupedDeal.ambulatory {
  border-left: 2px solid #ff9800 !important;
}
.groupedDeal.ambulatory_surgery {
  border-left: 2px solid #009688 !important;
}
.groupedDeal.laboratory {
  border-left: 2px solid #404041 !important;
}
.postCallFlap {
  border-left: 1px solid white;
  border-right: 1px solid white;
  border-bottom: 0;
  padding: 10px 7px;
  width: 25%;
  font-size: 14px;
  text-align: center;
  background-color: #e4e4e4;
  color: #477ACD;
  border-radius: 6px 6px 0 0;
  cursor: pointer;
  font-weight: bold;
}
.postCallFlap.selected {
  background-color: #6086c5 !important;
  color: white;
}
.postCallFlap.first {
  border-left: 0px solid transparent;
}
.postCallFlap.last {
  border-right: 0px solid transparent;
}
#mainNavbar:hover button {
  transition: all 150ms linear;
  background-color: #f7f7f7;
}
#hubSpotConversation {
  cursor: pointer;
  position: relative;
}
#hubSpotConversation .showWidget {
  display: initial;
}
#hubSpotConversation #hubSpotConversationWidget {
  position: absolute;
  top: 40px;
  right: 0;
  padding: 5px;
  background: #eaeaea;
  box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1);
  border: 1px solid #d0d0d0;
  border-radius: 4px;
  border-top-right-radius: 0;
  border-top-left-radius: 0;
  height: 400px;
  width: 313px;
}
#hubSpotConversation #hubspot-conversations-inline-iframe {
  height: calc(400px - 42px);
  width: 100%;
  border: 1px solid #d0d0d0;
  border-radius: 2px;
}
#hubSpotConversation .widgetHeader {
  width: 100%;
  display: flex;
  justify-content: space-between;
  padding: 5px;
}
#hubSpotConversation .widgetHeader span {
  margin: 0;
  display: flex;
  font-size: 12px;
  color: #666;
}
.avoidClicks {
  pointer-events: none;
}
.avoidClicks .noShowWhenAvoidClick {
  display: none;
}
.omniaAd {
  font-size: 14px;
  height: 100px;
  align-items: flex-end;
  color: #909090;
}
.searchOption {
  opacity: 1 !important;
}
.uppercase {
  text-transform: uppercase;
}
.lowercase {
  text-transform: lowercase;
}
.capitalize-first:first-letter {
  text-transform: uppercase;
}
.actualLabel,
.setDescription {
  display: none;
}
.fixedContentHeader {
  width: 100vw;
  height: 105px;
  border-bottom: 1px solid #999999;
  align-items: flex-start;
  justify-content: space-between;
  background-color: #fff;
  padding: 11px;
  position: sticky;
  top: 0;
  z-index: 1;
}
.fixedContentHeader.ambulatory {
  border-left: solid 15px #ff9800;
}
.fixedContentHeader.ambulatory_surgery {
  border-left: solid 15px #009688;
}
.fixedContentHeader.day_hospital {
  border-left: solid 15px #9c27b0;
}
.fixedContentHeader.laboratory {
  border-left: solid 15px #404041;
}
.fixedContentHeader .infoContentHeader {
  height: 100%;
}
.fixedContentHeader .infoContentHeader .titleContentHeader {
  height: 72px;
  margin: auto 11px;
  justify-content: space-between;
}
.fixedContentHeader .infoContentHeader .titleContentHeader p {
  margin: 0;
  color: #888;
}
.fixedContentHeader .actionButtonsHeader {
  min-width: 180px;
  justify-content: space-between;
}
.actionsButton {
  border-radius: 30px;
  border: 1px solid #d0d0d0;
  background: #fff;
  padding: 4px 8px;
  font-size: 16px;
}
.actionsButton.backButton {
  font-weight: 600;
}
.actionsButton span {
  margin: 1px 2px 0 0;
}
.actionsButton.moreOptionsButton {
  font-size: 20px;
  border-radius: 50%;
  padding: 4px;
}
.actionsButton:focus {
  outline: none;
  border: 1px solid #000;
}
.deals .dropdown .dropdownContent {
  z-index: 1;
  min-width: 165px;
  padding: 5px 5px;
  border: 1px solid #d0d0d0;
  border-radius: 8px;
  border-top-right-radius: 0;
  top: 38px;
  right: 14px;
  background: #fff;
}
.deals .dropdown .dropdownContent .dropdownMenuItem {
  padding: 0;
}
.deals .dropdown .dropdownContent .dropdownMenuItem:hover {
  padding: 0;
}
.deals .dropdown .dropdownContent .iconButton:hover {
  box-shadow: none!important;
}
.contentBody {
  padding: 20px 50px 50px;
  background-color: #fff;
  min-height: calc(100% - 105px);
  overflow-y: auto;
  align-items: flex-start;
}
.contentBody .generalBodyInfo {
  width: 35%;
  min-height: 100%;
}
.contentBody .generalBodyInfo .dataBodyGroup {
  width: 100%;
  margin-bottom: 46px;
  padding-right: 28px;
}
.contentBody .generalBodyInfo .dataBodyGroup .titleDataBodyGroup {
  font-size: 16px;
  color: #666;
  margin-bottom: 16px;
  margin-right: 8px;
}
.contentBody .generalBodyInfo .dataBodyGroup .card {
  background-color: #F9F9F9;
  border: 1px solid #d0d0d0;
  border-radius: 5px;
  padding: 6px;
  display: flex;
  flex-wrap: wrap;
  min-height: 42px;
  margin: 15px 0;
}
.contentBody .generalBodyInfo .dataBodyGroup .card.pointer {
  cursor: pointer;
}
.contentBody .generalBodyInfo .dataBodyGroup .card.open {
  border: 1px solid #666;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  width: calc(100% + 29px);
  border-right: none;
  position: relative;
}
.contentBody .generalBodyInfo .dataBodyGroup .card.open.actual .actualLabel {
  border: 1px solid #666;
  border-bottom: none;
}
.contentBody .generalBodyInfo .dataBodyGroup .card.open .setDescription {
  display: initial;
  color: #000;
  font-size: 12px;
  width: 100%;
  margin: 8px 0 0;
  white-space: pre-wrap;
}
.contentBody .generalBodyInfo .dataBodyGroup .card.open.pointer {
  cursor: default;
}
.contentBody .generalBodyInfo .dataBodyGroup .card.actual {
  margin-top: 38px;
  border-radius: 0;
  border-bottom-left-radius: 5px;
  position: relative;
}
.contentBody .generalBodyInfo .dataBodyGroup .card.actual .actualLabel {
  display: initial;
  position: absolute;
  top: -23px;
  left: -1px;
  border: 1px solid #d0d0d0;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  padding: 2px 5px;
  padding-bottom: 0;
  border-bottom: none;
  background-color: #F9F9F9;
  font-size: 12px;
}
.contentBody .generalBodyInfo .dataBodyGroup .card .subcard {
  background-color: #fff;
  border: 1px solid #d0d0d0;
  border-radius: 2px;
  padding: 6px 10px;
  margin-right: 20px;
  color: #000;
}
.contentBody .generalBodyInfo .dataBodyGroup .card .subcard .index {
  padding: 8px 10px 8px 0;
  border-right: 1px solid #d0d0d0;
  margin-right: 8px;
  color: #666;
}
.contentBody .generalBodyInfo .dataBodyGroup .card.newCard {
  background-color: #fff;
  border-style: dashed;
  cursor: pointer;
}
.contentBody .generalBodyInfo .dataBodyGroup .link {
  color: #0A78F9;
  padding-left: 11px;
  cursor: pointer;
}
.noteContainer {
  border: 1px solid #d0d0d0;
  background-color: #f9f9f9;
  border-radius: 5px;
  padding: 11px;
  color: #000;
  min-height: 80px;
  font-size: 11px;
  outline: none;
  margin-bottom: 15px;
  box-shadow: none;
  width: 100%;
}
.noteContainer::placeholder {
  color: #666;
}
.noteContainer:focus {
  border: 1px solid #000;
  box-shadow: none;
}
.iconHelp {
  padding: 2px;
  border: 1px solid #666;
  border-radius: 50%;
  margin-top: 3px;
  cursor: pointer;
}
.setInfo {
  width: 65%;
  min-height: 100%;
  background-color: #F9F9F9;
  border: 1px solid #666;
  border-radius: 5px;
  padding: 30px;
}
.setInfo .header {
  border-bottom: 0.5px solid #ccc;
  padding-bottom: 5px;
  margin-bottom: 25px;
}
.setInfo .header .sectionLink {
  position: relative;
  cursor: pointer;
}
.setInfo .header .sectionLink.active::after {
  content: '';
  width: 100%;
  position: absolute;
  top: 31px;
  left: 0;
  height: 2px;
  background-color: #000;
  color: #000;
}
.setInfo .header span {
  padding: 0 5px;
  margin-right: 5px;
}
.setInfo .header .searchInput {
  width: 220px;
  background: #fff;
  padding: 6px 12px;
  border-bottom: none;
  font-size: 11px;
  border-radius: 25px;
  border: 1px solid #d0d0d0;
  color: #888;
  box-shadow: none;
  margin-right: 5px;
}
.setInfo .header .searchInput:focus {
  box-shadow: none;
  outline: none;
}
.setInfo .setCard {
  background-color: #fff;
  border: 1px solid #d0d0d0;
  border-radius: 5px;
  margin-right: 20px;
  color: #000;
  margin: 14px 2px;
  align-items: flex-start;
}
.setInfo .setCard .index {
  color: #666;
  padding: 6px 10px;
  width: 40px;
  text-align: center;
}
.setInfo .setCard .content {
  align-items: flex-start;
  width: calc(100% - 40px);
  border-left: 1px solid #d0d0d0;
  padding: 8px 10px;
}
.setInfo .setCard .content p {
  margin: 0;
}
.setInfo .setCard .content .title {
  font-size: 14px;
  color: #000;
  line-height: 1.2;
}
.setInfo .setCard .content .code {
  font-size: 9px;
  color: #888;
  font-style: italic;
}
.setInfo .setCard .content .extraInfo {
  margin: 0 10px 4px;
  align-items: flex-start;
}
.setInfo .setCard .content .extraInfo .extraInfoText {
  font-size: 11px;
  padding: 0 4px;
  color: #C0C0C0;
  line-height: 1.4;
}
.setInfo .setCard .content .extraInfo .activeShow {
  display: none;
}
.setInfo .setCard .content .extraInfo.active .activeShow {
  display: initial;
}
.setInfo .setCard .content .extraInfo.active .extraInfoText {
  color: #000;
}
.setInfo .setCard .content .extraInfo.active .activeNoShow {
  display: none;
}
.setInfo .setCard .content .ui.search.dropdown {
  width: 300px;
}
.setInfo .setCard.newCard {
  background-color: transparent;
  border-style: dashed;
  cursor: pointer;
  justify-content: flex-start;
  color: #666;
  align-items: center;
}
.setInfo .setCard.newCard .title {
  border-left: 1px dashed #d0d0d0;
  padding-left: 14px;
  height: 34px;
  line-height: 34px;
}
.openProduct {
  transform: rotate(270deg);
}
.openProduct.open {
  transform: rotate(90deg);
}
.openCard {
  width: 100%;
}
.openCard .extraInfoExpanded {
  color: #666;
  font-size: 11px;
  margin: 2px 0;
}
.openCard .extraInfoExpanded span span {
  color: #000;
}
.openCard .specCard {
  width: 49%;
  border-radius: 4px;
  border: 1px solid #d0d0d0;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
  padding: 5px;
  align-items: flex-start;
  font-size: 11px;
  margin: 5px 0;
}
.openCard .specCard p {
  color: #666;
}
.openCard .specCard p span {
  color: #000;
}
.content .openCard .specCard p {
  margin: 3px 0;
}
.miniCard {
  width: 94%;
  border: 1px solid #CECECE;
  border-radius: 2px;
  padding: 2px 4px;
  margin: 4px 0;
}
.miniCard .miniCardContainer {
  width: 100%;
  justify-content: space-between;
}
.miniCard .openMiniCard {
  width: 100%;
}
.explanation {
  margin: 17px 0;
  background: #F9F9F9;
  border: 1px solid #d0d0d0;
  border-radius: 5px;
  padding: 4px 8px;
  color: #666;
  font-size: 12px;
  align-items: flex-start;
  justify-content: space-between;
}
.explanation p {
  width: 96%;
  padding: 3px 0;
}
.content .setCard.ruleCard {
  padding: 16px 10px;
}
.content .setCard.ruleCard .title {
  font-weight: bolder;
}
.content .setCard.ruleCard hr {
  margin: 14px 0;
}
.content .setCard.ruleCard .subTitle {
  color: #666;
  font-size: 12px;
  margin: 10px 0 0;
}
.content .setCard.ruleCard .pillProduct {
  padding: 2px 4px;
  font-size: 14px;
  margin: 5px 10px 5px 0;
  border: 1px solid #d0d0d0;
  border-radius: 2px;
  width: fit-content;
  color: #000;
}
.content .setCard.ruleCard .setAction {
  font-size: 16px;
  color: #666;
}
.editingInput {
  width: 65%;
  margin: 15px 0;
}
.flexContentBetween {
  justify-content: space-between;
}
.flexAlignStart {
  align-items: flex-start;
}
.flexAlignStretch {
  align-items: stretch;
}
.flexWrap {
  flex-wrap: wrap;
}
.deals input {
  font-size: 12px;
}
.loadingBackgroundAnimation {
  margin: auto;
  background-image: linear-gradient(100deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5) 50%, rgba(255, 255, 255, 0) 80%);
  background-size: 100px 44px;
  background-position: 0 0;
  animation: shine 1.2s ease-in-out infinite;
  background-repeat: no-repeat;
  cursor: default;
}
@keyframes shine {
  0% {
    opacity: 0.3;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0.3;
    background-position: 100% 0;
  }
}
.searchButton {
  border-radius: 20px;
  height: 38px;
  overflow: visible;
  justify-content: center;
  align-items: center;
  padding: 0;
  width: 38px;
}
.selectableViewApp {
  width: 178px;
  border: 1px solid #c8c8c8;
  border-radius: 5px;
  padding: 4px 8px 8px;
  margin: 0 0 8px;
  font-size: 12px;
}
.selectableViewApp .disabled {
  filter: opacity(0.4);
}
.passwordStrengthContainer {
  border: 1px solid #ececec;
  border-radius: 2px;
  height: 10px;
  position: relative;
  margin: 0 8px;
  flex: 1;
}
.passwordStrengthContainer .passwordStrength {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
}
.cashAccountFlap {
  border-top: 1px solid black;
  border-left: 1px solid white;
  border-right: 1px solid white;
  padding: 10px 7px;
  width: 25%;
  font-size: 14px;
  text-align: center;
  border-radius: 6px 6px 0 0;
  border-color: black;
  cursor: pointer;
}
.cashAccountFlap.selected {
  font-weight: 800;
}
.cashAccountFlap.first {
  border-left: 0px solid transparent;
}
.patientSavingAccountFlap {
  border-top: 1px solid black;
  border-left: 1px solid white;
  border-right: 1px solid white;
  padding: 10px 7px;
  width: 25%;
  font-size: 14px;
  text-align: center;
  border-radius: 6px 6px 0 0;
  border-color: black;
  cursor: pointer;
}
.patientSavingAccountFlap.selected {
  font-weight: 800;
  color: #477ACD;
}
.patientSavingAccountFlap.first {
  border-left: 0px solid transparent;
}
.overlay {
  opacity: 1 !important;
  z-index: 100;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.1);
  height: 100%;
}
.vitu-button {
  transition: all 150ms linear;
  cursor: pointer;
}
.vitu-button[disabled] {
  background-color: #f6f6f6;
  opacity: 0.5;
  cursor: default !important;
}
.vitu-button:hover {
  color: #3061b1;
}
.result-hover {
  transition: all 150ms linear;
}
.result-hover:hover {
  color: #ff0;
  background-color: #00f;
}
.result-cell {
  padding: 5px;
  border: 1px solid black;
}
/* ENDLESS ROTATE */
.rotate {
  animation: rotate 1.5s linear infinite;
}
@keyframes rotate {
  to {
    transform: rotate(360deg);
  }
}
/* SPINNER JUST FOR DEMO */
.spinner {
  display: inline-block;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  box-shadow: inset -2px 0 0 2px #0bf;
}
.circle-loader {
  border: 8px solid #f3f3f3;
  /* Light grey */
  border-top: 8px solid #3498db;
  /* Blue */
  border-radius: 50%;
  width: 20px;
  height: 20px;
  animation: spin 2s linear infinite;
}
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
/* Input validations classes */
.input-group-container {
  display: flex;
  flex-direction: column;
  position: relative;
}
.input-group-container > .validation-placeholder {
  position: absolute;
  top: 100%;
  right: 0%;
  white-space: nowrap;
  color: red;
  font-size: 90%;
  font-weight: bolder;
  opacity: 0;
  transition: opacity 0.3s linear, visibility 0.3s linear 0.3s;
}
.input-group-container.show-validation > .validation-placeholder {
  opacity: 1;
}
.input-group-container.show-validation > input {
  border-bottom-color: red !important;
}
/* LOGIN */
.container.login {
  background-color: white;
  min-height: 100%;
  min-width: 1024px;
  width: 100%;
  height: auto;
  position: relative;
  top: 0;
  left: 0;
}
.container.login .loginImgContainer > img {
  margin: auto;
  height: 60%;
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  left: 450px;
}
.container.login .formContainer {
  background-color: white;
  margin: auto;
  padding: 20px;
  width: 450px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 30px;
}
.container.login .formContainer .loginInput {
  border-radius: 6px;
  border: 1px solid #cecece;
  box-shadow: 0 0 0 0 transparent;
  padding: 5px 10px;
  margin: 6px 10px;
}
.container.login .formContainer .loginInput > input {
  border: 0px solid transparent;
  box-shadow: 0 0 0 0 transparent;
  color: #404041;
  font-size: 15px;
  padding: 0;
  margin: 0;
  min-height: 28px;
}
.container.login .formContainer .loginInput > input::placeholder {
  font-size: 15px;
  color: #c0c0c0;
}
.container.login .formContainer .loginInput > input:focus {
  outline: 0;
}
.login-logo {
  margin: 30px 0 0;
  max-width: 350px;
  max-height: 200px;
}
.login-logo-portal {
  margin: 30px 0 0;
  max-width: 315px;
  max-height: 180px;
}
/* DASHBOARD */
.main-dashboard > .dashboardHeader {
  margin-top: 75px;
}
.main-dashboard > .dashboardContent .cardWithoutDescription .dashboardIcon {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 30px;
  width: 30px;
}
.main-dashboard > .dashboardContent .cardWithoutDescription .dashboardIcon i {
  font-size: 30px;
}
.main-dashboard > .dashboardContent .cardWithoutDescription svg,
.main-dashboard > .dashboardContent .cardWithoutDescription i {
  margin-left: 0;
}
/* Work Center Selection Dialog */
#locationSelector .centerIcon {
  border-radius: 15px 0 0 15px;
  height: 78px;
  width: 78px;
  justify-content: center;
  background-color: #F1F1F1;
}
#locationSelector .centerCardInfo {
  width: 80%;
}
#locationSelector .centerCardInfo .centerName {
  font-size: 20px;
}
/* PRESCRIPTION APP */
.prescriptionContainer {
  -webkit-box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, 0.33);
  -moz-box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, 0.33);
  box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, 0.33);
}
#prescriptionApp {
  font-family: 'Roboto', sans-serif !important;
  background-color: white;
  margin: auto;
  width: 600px;
  min-height: 460px;
  padding: 30px;
  border-radius: 2%;
  border: 1px solid #cecece;
  position: relative;
  /* Ensures that the absolute footer is positioned within this container */
}
#prescriptionApp .patientHeader {
  position: sticky;
  top: 0;
  background-color: white;
  padding-bottom: 5px;
}
#prescriptionApp .patientContent {
  height: 295px;
  overflow-y: auto;
  flex-grow: 1;
}
#prescriptionApp .stickyPatientFooter {
  z-index: 10;
  padding-top: 15px;
  display: flex;
  align-self: flex-end;
  position: sticky;
  bottom: 0;
  background-color: white;
}
#prescriptionApp .message {
  border: solid 1.5px #00000045;
  border-radius: 10px;
  padding: 10px;
}
#prescriptionApp .message p {
  margin: 0;
}
#prescriptionApp .message a {
  cursor: pointer;
}
#prescriptionApp .title {
  color: #000000;
  font-size: 16px;
  font-weight: 800;
}
#prescriptionApp .text {
  line-height: 130%;
  color: #00000090;
  margin-bottom: 10px;
}
#prescriptionApp .patientCreationContainer {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  align-content: center;
  gap: 10px;
  margin-top: -5px;
}
#prescriptionApp .patientCreation {
  font-size: 16px;
  font-weight: 800;
  color: #477acd;
}
#prescriptionApp .patientCreation:hover {
  text-decoration: underline;
  cursor: pointer;
}
#prescriptionApp .dialogContent {
  padding: 0;
}
#prescriptionApp .dialogContent > ul {
  display: flex;
  flex-direction: column;
  height: 100%;
  gap: 1.5rem;
  list-style: none;
  padding: 0;
}
#prescriptionApp .dialogContent > ul .sharePrescriptionOption {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
}
#prescriptionApp .dialogContent > ul .sharePrescriptionOption .inputTitle {
  margin-right: 10px;
  width: 35%;
  font-size: 14px;
  font-weight: 800;
}
#prescriptionApp .dialogContent > ul .sharePrescriptionOption .sharePrescriptionIcon {
  margin-right: 10px;
  color: #404041;
}
#prescriptionApp .dialogContent > ul .sharePrescriptionOption .sharePrescriptionInput {
  width: 100%;
  height: fit-content;
  padding: 5px 5px 5px 10px;
  border: solid 1.5px #00000045;
  border-radius: 10px;
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
}
#prescriptionApp .dialogContent > ul .sharePrescriptionOption .sharePrescriptionInput input {
  width: 100%;
  border: none;
  outline: none;
  font-size: 16px;
}
#prescriptionApp .dialogContent > ul .sharePrescriptionOption .sharePrescriptionLink {
  font-size: 12px;
  color: #7a7676;
}
#prescriptionApp .dialogContent > ul .sharePrescriptionOption .sharePrescriptionLink .sharePrescriptionLinkTitle {
  font-size: 16px;
}
#prescriptionApp .dialogContent > ul .sharePrescriptionOption .disabled {
  opacity: 0.5;
  pointer-events: none;
  text-decoration: none;
  cursor: not-allowed;
}
#prescriptionApp .dialogContent > ul .sharePrescriptionButton {
  font-size: 14px !important;
  color: #477acd;
  cursor: pointer;
}
#prescriptionApp .dialogContent > ul .sharePrescriptionButton:hover {
  text-decoration: underline;
}
#prescriptionApp .dialogContent > ul .disableSearchButton {
  font-size: 14px !important;
  color: #00000045;
  cursor: not-allowed;
}
#prescriptionApp .dialogContent > ul .disableSearchButton:hover {
  text-decoration: none;
}
#prescriptionApp .dialogContent > ul .wrongInput .sharePrescriptionInput {
  border-color: red;
}
#prescriptionApp .dialogContent > ul .inValidInputField {
  color: grey;
  cursor: not-allowed;
}
#prescriptionApp .dialogContent > ul .inValidInputField:hover {
  text-decoration: none;
}
#prescriptionApp .dialogContent > ul .notAllowedInputField {
  color: grey;
  background-color: #0000000f;
}
#prescriptionApp .dialogContent > ul .notAllowedInputField:hover {
  text-decoration: none;
}
#prescriptionApp .dialogContent > ul .notAllowedInputField input {
  cursor: not-allowed;
}
#prescriptionApp .customBtn {
  background-color: #477acd;
  border-radius: 8px;
  color: white;
  font-size: 14px;
  margin: 0;
  text-align: center;
  width: 100px;
  padding: 5px;
  border: none;
}
#prescriptionApp .customBtn:hover {
  background-color: #2758a5;
  cursor: pointer;
}
#prescriptionApp .disableButton {
  background-color: #00000045;
  border-radius: 8px;
  font-size: 14px;
  margin: 0;
  text-align: center;
  width: 100px;
  padding: 5px;
  border: none;
  color: white;
  cursor: not-allowed;
}
#prescriptionApp .disableButton:hover {
  text-decoration: none;
}
#prescriptionApp .finalizeContainer {
  display: flex;
  align-self: flex-end;
}
.genderOptions {
  width: 100%;
  height: fit-content;
  padding: 5px 0px 0px 0px;
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  align-content: center;
}
.genderOptions span {
  border: solid 1.5px #00000045;
  border-radius: 5px;
  padding: 5px 10px 5px 10px;
  cursor: pointer;
}
.genderOptions input[type="radio"] {
  display: none;
}
.genderOptions input[type="radio"]:checked + span {
  background: #a0c4ff;
  border-radius: 5px;
  padding: 5px 10px 5px 10px;
}
.birthdateOptions select {
  line-height: normal;
  color: #827d7d;
  font-style: italic;
  padding: 5px 10px 5px 10px;
  border-radius: 5px;
  border: solid 1.5px #00000045;
  text-align: center;
}
/* Hack to avoid showing arrows Chrome https://stackoverflow.com/questions/16603979/how-to-remove-the-default-arrow-icon-from-a-dropdown-list-select-element/70272859#70272859 */
.birthdateOptions select {
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  background-image: none;
}
.birthdateOptions input[type="number"] {
  line-height: normal;
  padding: 5px 10px 5px 10px;
  border-radius: 5px;
  border: solid 1.5px #00000045;
  text-align: center;
}
/* FINISH #prescriptionApp styles */
#patientInvitation .inputFieldContainer {
  padding: 15px 60px;
}
#patientInvitation .inputFieldContainer > ul {
  display: flex;
  flex-direction: column;
  height: 100%;
  gap: 1.5rem;
  list-style: none;
  padding: 0;
}
#patientInvitation .inputFieldContainer > ul .sharePrescriptionOption {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
}
#patientInvitation .inputFieldContainer > ul .sharePrescriptionOption .inputTitle {
  margin-right: 10px;
  width: 35%;
  font-size: 14px;
  font-weight: 800;
}
#patientInvitation .inputFieldContainer > ul .sharePrescriptionOption .sharePrescriptionInput {
  width: 100%;
  height: fit-content;
  padding: 5px 5px 5px 10px;
  border: solid 1.5px #00000045;
  border-radius: 5px;
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  background-color: white;
}
#patientInvitation .inputFieldContainer > ul .sharePrescriptionOption .sharePrescriptionInput input {
  width: 100%;
  border: none;
  outline: none;
  font-size: 14px;
}
#patientInvitation .inputFieldContainer > ul .sharePrescriptionOption .wrongInput .sharePrescriptionInput {
  border-color: red !important;
}
#patientInvitation .customBtn {
  background-color: #477acd;
  border-radius: 8px;
  color: white;
  font-size: 14px;
  margin: 0;
  text-align: center;
  width: 100px;
  padding: 5px;
  border: none;
}
#patientInvitation .customBtn:hover {
  background-color: #2758a5;
  cursor: pointer;
}
#patientInvitation .disableButton {
  background-color: #00000045;
  border-radius: 8px;
  font-size: 14px;
  margin: 0;
  text-align: center;
  width: 100px;
  padding: 5px;
  border: none;
  color: white;
  cursor: not-allowed;
}
#patientInvitation .disableButton:hover {
  text-decoration: none;
}
#patientInvitation .genderOptions {
  font-size: 12px;
}
#patientInvitation .formFlex {
  flex: 0.6;
}
#patientInvitation .imageFlex {
  flex: 0.4;
}
.visibleOnHover {
  transition: all 150ms linear;
  opacity: 0;
  height: 0;
}
.visibleOnHoverParent:hover > .visibleOnHover {
  opacity: 1;
  height: auto;
}
.shareModal {
  background-color: white;
  margin: auto;
  width: 600px;
}
.shareModal .dialogHeader {
  color: black;
  font-weight: 700;
}
.shareModal .dialogContent > ul {
  display: flex;
  flex-direction: column;
  gap: 5px;
  list-style: none;
  padding: 0;
}
.shareModal .dialogContent > ul .sharePrescriptionOption {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
}
.shareModal .dialogContent > ul .sharePrescriptionOption .sharePrescriptionIcon {
  margin-right: 10px;
  color: #404041;
}
.shareModal .dialogContent > ul .sharePrescriptionOption .sharePrescriptionInput {
  width: 100%;
  height: fit-content;
  padding: 5px;
  border: solid 1px #000;
  border-radius: 5px;
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
}
.shareModal .dialogContent > ul .sharePrescriptionOption .sharePrescriptionInput input {
  width: 100%;
  border: none;
  outline: none;
}
.shareModal .dialogContent > ul .sharePrescriptionOption .sharePrescriptionLink {
  font-size: 12px;
  color: #7a7676;
}
.shareModal .dialogContent > ul .sharePrescriptionOption .sharePrescriptionLink .sharePrescriptionLinkTitle {
  font-size: 16px;
}
.shareModal .dialogContent > ul .sharePrescriptionButton {
  color: #477acd;
  cursor: pointer;
}
.shareModal .dialogContent > ul .sharePrescriptionButton:hover {
  text-decoration: underline;
}
.shareModal .dialogContent > ul .wrongInput .sharePrescriptionInput {
  border-color: red;
}
.shareModal .dialogContent > ul .wrongInput .sharePrescriptionButton {
  color: grey;
  cursor: not-allowed;
}
.shareModal .dialogContent > ul .wrongInput .sharePrescriptionButton:hover {
  text-decoration: none;
}
/******************************************************************/
/*                            MEDIA QUERIES                       */
/******************************************************************/
@media screen and (max-width: 1200px) {
  /* LOGIN */
  .container.login {
    height: 100%;
    min-width: 100%;
    top: 0;
    display: flex;
    flex-direction: row-reverse;
    justify-content: center;
  }
  .container.login .chromeVersion {
    z-index: 10;
    position: absolute;
    top: 0;
  }
  .container.login .loginImgContainer {
    min-height: 725px;
    width: 50%;
    position: relative;
    flex: auto;
    display: grid;
    place-content: center;
  }
  .container.login .loginImgContainer > img {
    width: 100%;
    height: 100%;
    position: relative;
    left: 0;
  }
  .container.login .formContainer {
    width: 50%;
    position: relative;
    left: 0;
  }
  /* DASHBOARD */
  .main-dashboard > .dashboardHeader .welcomeText {
    font-size: 30px;
  }
}
@media only screen and (max-width: 768px) {
  /* LOGIN */
  .container.login {
    min-width: 0;
    width: 100%;
  }
  .container.login .loginImgContainer {
    display: none;
  }
  .container.login .formContainer {
    padding: 20px;
    width: 100%;
    position: relative;
    left: 0;
  }
  .container.login .omniaAd {
    display: grid;
    grid-template-columns: repeat(2, auto);
  }
  .container.login .omniaAd .languageSelector {
    grid-column: span 2;
    display: flex;
    justify-content: center;
  }
  /* DASHBOARD */
  .main-dashboard > .dashboardHeader .welcomeText {
    display: none;
  }
  .main-dashboard > .dashboardHeader .userNameText {
    display: none;
  }
  .patientsCardContainer .patientCardTemp {
    max-width: 420px;
    font-size: 12px;
  }
  .patientsCardContainer .patientCardTemp .infoPatientContainer .visibleInfo .personDetails {
    display: grid;
  }
  #prescriptionApp {
    font-size: 12px;
    width: 460px;
    padding: 15px;
  }
  .birthdateOptions select {
    font-size: 12px;
    padding: 2px;
  }
  .birthdateOptions input[type="number"] {
    font-size: 12px;
    padding: 2px;
  }
  .genderOptions {
    font-size: 12px;
    padding: 5px 0px 0px 0px;
  }
  .genderOptions span {
    padding: 2px;
  }
  .genderOptions input[type="radio"]:checked + span {
    padding: 2px;
  }
  /* FINISH #prescriptionApp styles */
  #patientInvitation .inputFieldContainer {
    padding: 15px 20px;
  }
  #patientInvitation .inputFieldContainer > ul .sharePrescriptionOption .genderOptions {
    font-size: 12px;
  }
  #patientInvitation .hideImage {
    display: none;
  }
  #patientInvitation .formFlex {
    flex: 1;
  }
  #patientInvitation .imageFlex {
    flex: none;
  }
}
@media only screen and (max-width: 480px) {
  /* LOGIN */
  .container.login .chromeVersion {
    font-size: 10px;
  }
  .login-logo {
    max-width: 350px;
    max-height: 150px;
  }
  .login-logo-portal {
    max-height: 130px;
  }
  /* DASHBOARD */
  .main-dashboard > .dashboardContent .cardWithoutDescription {
    max-width: 100%;
    width: 100%;
    height: fit-content;
  }
  .main-dashboard > .dashboardContent .cardWithoutDescription .cardTitle {
    white-space: unset;
    font-size: 12px;
  }
  .main-dashboard > .dashboardContent .cardWithoutDescription .dashboardIcon {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 20px;
    width: 20px;
  }
  .main-dashboard > .dashboardContent .cardWithoutDescription .dashboardIcon i {
    font-size: 20px;
  }
  .main-dashboard > .dashboardContent .cardWithoutDescription .dashboardIcon div {
    height: 20px !important;
    width: 20px !important;
  }
  .main-dashboard .appsMenu {
    width: 100vw;
    position: fixed;
    margin-top: 40px;
  }
  .main-dashboard .appsMenu .appsMenuTriangle {
    display: none;
  }
  .main-dashboard .appsMenu .notificationMenuContent {
    width: 100%;
  }
  /* Work Center Selection Dialog */
  #locationSelector .locationSelectorTitle {
    font-size: 16px;
  }
  #locationSelector .centerCard {
    height: 60px;
    min-height: 60px;
  }
  #locationSelector .centerCard .centerIcon {
    height: 58px;
    width: 58px;
  }
  #locationSelector .centerCard .centerCardInfo {
    justify-content: center;
  }
  #locationSelector .centerCard .centerCardInfo .centerName {
    font-size: 18px;
  }
  #full-navbar .chromeVersion {
    display: none;
  }
  #full-navbar .buttonNavPanel .navBarTitle {
    display: none;
  }
  #full-navbar .dropdownCard .loggedPerson {
    display: none;
  }
  #full-navbar .dropdownCard .currentCenterName {
    display: none;
  }
  .patientsCardContainer .patientCardTemp {
    max-width: 29.6rem;
  }
  .patientsCardContainer .patientCardTemp .personInitials {
    display: none;
  }
  .patientsCardContainer .patientCardTemp .infoPatientContainer .patientPicture {
    display: none;
  }
  .patientsCardContainer .patientCardTemp .infoPatientContainer .visibleInfo .personDetails {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }
  .patientsCardContainer .patientCardTemp .infoPatientContainer .itemsContainer {
    flex-direction: column;
  }
  .prescriptionContainer {
    margin-top: 20px !important;
    box-shadow: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
  }
  #prescriptionApp {
    font-size: 12px;
    border-radius: 0%;
    border: none;
    width: 370px;
    padding: 0;
    width: fit-content;
  }
  #prescriptionApp .patientContent {
    height: 400px;
    overflow-y: scroll;
    /* Mantiene la funcionalidad de scroll */
    scrollbar-width: none;
    /* Firefox */
    -ms-overflow-style: none;
    /* Internet Explorer 10+ */
  }
  #prescriptionApp .patientContent::-webkit-scrollbar {
    display: none;
    /* Chrome, Safari, Opera */
  }
  #prescriptionApp .dialogContent > ul .sharePrescriptionOption .inputTitle {
    margin-right: 10px;
    width: 35%;
    font-size: 12px;
  }
  #prescriptionApp .dialogContent > ul .sharePrescriptionOption .sharePrescriptionIcon {
    margin-right: 10px;
  }
  #prescriptionApp .dialogContent > ul .sharePrescriptionOption .sharePrescriptionInput {
    padding: 5px 5px 5px 10px;
  }
  #prescriptionApp .dialogContent > ul .sharePrescriptionOption .sharePrescriptionLink {
    font-size: 12px;
  }
  #prescriptionApp .dialogContent > ul .sharePrescriptionOption .sharePrescriptionLink .sharePrescriptionLinkTitle {
    font-size: 12px;
  }
  #prescriptionApp .dialogContent > ul .sharePrescriptionButton {
    font-size: 12px !important;
    color: #477acd;
    cursor: pointer;
  }
  #prescriptionApp .dialogContent > ul .sharePrescriptionButton:hover {
    text-decoration: underline;
  }
  #prescriptionApp .dialogContent > ul .disableSearchButton {
    font-size: 12px !important;
  }
  #prescriptionApp .finalizeContainer {
    width: 100%;
    display: flex;
    flex-direction: column;
  }
  #prescriptionApp .finalizeBtn {
    width: 100%;
  }
  .birthdateOptions select {
    font-size: 12px;
    padding: 2px;
  }
  .birthdateOptions input[type="number"] {
    font-size: 12px;
    padding: 2px;
  }
  .genderOptions {
    font-size: 12px;
    padding: 5px 0px 0px 0px;
  }
  .genderOptions span {
    padding: 2px;
  }
  .genderOptions input[type="radio"]:checked + span {
    padding: 2px;
  }
  /* FINISH #prescriptionApp styles */
}
@media only screen and (max-width: 992px) and (max-aspect-ratio: 13/9) {
  .container.login .loginImgContainer {
    display: none;
  }
  .container.login .formContainer {
    width: 100%;
  }
}