#sankey {
  position: relative;
  float: left;
}

#sankey .path1,
#sankey .path2 {
  fill: none;
  filter: contrast(0.7) brightness(1.2);
}

#sankey .path1,
#sankey .path2,
#sankey .node,
.legend-stage,
.legend-stage label{
  cursor: pointer;
  font-family: Fira Sans;
  font-weight: 400;
  font-size: 13px;
  color: #828282;
}

#sankey path,
#sankey rect,
#sankey text {
  transition: 0.5s;
  transition-delay: 0.3s;
}

#sankey path.enabled,
#sankey rect.enabled,
#sankey text.enabled {
  transition-delay: 0s;
}

#sankey svg.filtered path,
#sankey svg.filtered rect, 
#sankey svg.filtered text {
  filter: contrast(0.2) brightness(1.7);
  z-index: 1;
}

#sankey .enabled {
  filter: contrast(1.0) brightness(1.0) !important;
  z-index: 2;
}

#sankey .path1.enabled,
#sankey .path2.enabled {
  filter: contrast(0.7) brightness(1.2) !important;
}

#sankey-wrapper{
  float: left;
}

#dataviz.mobile #sankey-wrapper{
  margin: 0 auto;
  float: none;
}

.legend-container {
  width: 100%;
  box-sizing: border-box;
  height: 80px;
  padding: 5px 0 0 13px;
  clear: both;
}

.legend-title {
  text-transform: uppercase;
  font-weight: 500;
  color: #828282;
  font-size: 12px;
}

.legend-stages-labels {
  display: flex;
  align-items: center;
}

.legend-stage {
  display: flex;
  align-items: center;
  margin-right: 32px;
}

.legend-stage-box-inicial {
  width: 25px;
  height: 10px;
  background-color: #e2dcea;
  margin-right: 12px;
}

.legend-stage-box-intermediario {
  width: 25px;
  height: 10px;
  background-color: #9e92ba;
  margin-right: 12px;
}

.legend-stage-box-avancado {
  width: 25px;
  height: 10px;
  background-color: #6b4c98;
  margin-right: 12px;
}

.legend-stage-box-concluido {
  width: 25px;
  height: 10px;
  background-color: #3d085b;
  margin-right: 12px;
}


#dataviz.mobile .legend-container {
  height: 120px;
}

#dataviz.mobile .legend-stage {
  display: grid;
  margin-right: 20px;
}

#dataviz.mobile .legend-stages-labels {
  display: flex;
  align-items: center;
}

#dataviz.mobile .legend-stage-box-inicial {
  margin-bottom: 11px;
}

#dataviz.mobile .legend-stage-box-intermediario {
  margin-bottom: 11px;
}

#dataviz.mobile .legend-stage-box-avancado {
  margin-bottom: 11px;
}

#dataviz.mobile .legend-stage-box-concluido {
  margin-bottom: 11px;
}


#sankey svg {
  float: left;
}

#sankey .level1-label {
  text-transform: uppercase;
  font-size: 12px;
  color: #6b4c98;
  margin-top: -7px;
}

#sankey-tooltip {
  position: absolute;
  box-sizing: border-box;
  padding: 14px;
  max-width: 240px;
  background: #FFF;
  border: 1px solid #828282;  
  box-shadow: 0px 4px 12px rgba(107, 76, 152, 0.3);
}

#sankey-tooltip-arrow{
  background-image: url(../images/sankey-tooltip-arrow.png);
  content: ' ';
  width: 20px;
  height: 12px;
  display: block;
  position: absolute;
}

#sankey-tooltip-arrow.left{
  left: -16px;
  transform: rotate(-90deg);
}

#sankey-tooltip-arrow.right{
  right: -16px;
  transform: rotate(90deg);
}

#sankey-tooltip-arrow.top{
  top: 18px;
}

#sankey-tooltip-arrow.bottom{
  margin-top: -6px;
}

#sankey-tooltip .tooltip-title{
  color: #393939;
  font-size: 14px;
  font-weight: 600;
  text-transform: uppercase;
  margin-bottom: 16px;
  line-height: 18px;
}

#sankey-tooltip .tooltip-subtitle{
  color: #828282;
  font-size: 12px;
  font-weight: 500;
  text-transform: uppercase;
  margin-top: 16px;
  margin-bottom: -3px;
}

#sankey-tooltip .tooltip-hyperlink{
  color: #F59F4D;
  font-weight: 700;
  font-size: 14px;
  line-height: 20px;
  text-decoration: none;
  margin-top: 30px;
  display: block;
}

#sankey-tooltip .tooltip-stage{
  color: #393939;
}

#sankey-tooltip .tooltip-content{
  color: #393939;
  font-size: 14px;
  font-weight: 400;
  margin: 2px 0 2px 0;
}

.sankey-sidebar {
  float: left; 
  border: 1px solid #828282;
  border-radius: 4px;
  margin-top: 25px;
}

#dataviz.mobile .sankey-sidebar{
  margin: 0px auto !important;
  float: none;
}

#dataviz.mobile .sankey-sidebar h2{
  display: none;
}

#dataviz .left h2{
  margin-bottom: -2px;
}

.sankey-sidebar h2 {
  margin: 0px;
}

.sankey-sidebar .priority {
  background: right 7px no-repeat url("data:image/svg+xml,%3Csvg width='11' height='10' viewBox='0 0 11 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.55102 0.133354L7.00374 3.03751C7.03813 3.10525 7.10689 3.15605 7.19285 3.17298L10.4507 3.63866C10.6484 3.66406 10.7344 3.9096 10.5883 4.05354L8.23297 6.31421C8.1728 6.37348 8.14701 6.44968 8.1642 6.52588L8.72294 9.71792C8.75733 9.91265 8.54243 10.0651 8.36191 9.97192L5.44787 8.46481C5.3791 8.43094 5.29314 8.43094 5.21577 8.46481L2.30173 9.97192C2.12121 10.0651 1.90631 9.91265 1.9407 9.71792L2.49944 6.52588C2.51663 6.44968 2.49084 6.36501 2.43067 6.31421L0.0753643 4.05354C-0.0707678 3.9096 0.00659625 3.67253 0.2129 3.63866L3.47079 3.17298C3.54815 3.16451 3.61692 3.11371 3.6599 3.03751L5.11262 0.133354C5.19858 -0.0444514 5.45646 -0.0444514 5.55102 0.133354Z' fill='%23F59F4D'/%3E%3C/svg%3E");
  padding-right: 15px;
  margin-right: 7px;
}

.sankey-sidebar .sankey-sidebar-item-name.priority{
  background-position-y: 2px;
}

#star-right{
  background: right 4px no-repeat url("data:image/svg+xml,%3Csvg width='11' height='10' viewBox='0 0 11 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.55102 0.133354L7.00374 3.03751C7.03813 3.10525 7.10689 3.15605 7.19285 3.17298L10.4507 3.63866C10.6484 3.66406 10.7344 3.9096 10.5883 4.05354L8.23297 6.31421C8.1728 6.37348 8.14701 6.44968 8.1642 6.52588L8.72294 9.71792C8.75733 9.91265 8.54243 10.0651 8.36191 9.97192L5.44787 8.46481C5.3791 8.43094 5.29314 8.43094 5.21577 8.46481L2.30173 9.97192C2.12121 10.0651 1.90631 9.91265 1.9407 9.71792L2.49944 6.52588C2.51663 6.44968 2.49084 6.36501 2.43067 6.31421L0.0753643 4.05354C-0.0707678 3.9096 0.00659625 3.67253 0.2129 3.63866L3.47079 3.17298C3.54815 3.16451 3.61692 3.11371 3.6599 3.03751L5.11262 0.133354C5.19858 -0.0444514 5.45646 -0.0444514 5.55102 0.133354Z' fill='%23F59F4D'/%3E%3C/svg%3E");
  padding-right: 15px;
  margin-right: 7px;
}

.sankey-sidebar ul {
  margin: 0px;
}

.sankey-sidebar-content {
  margin-top: 13px;
  overflow-y: auto;
  position: relative;
}

.sankey-sidebar-content .gradient {
  background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
  position: absolute;
  left: 0px;
  width: 100%;
  pointer-events: none;
}

.sankey-sidebar-content::-webkit-scrollbar {
  width: 8px;
  height: 8px;
 }
 .sankey-sidebar-content::-webkit-scrollbar-thumb {
  background-color: #828282;
  border-radius: 0px;
 }
 .sankey-sidebar-content::-webkit-scrollbar-track{
  background: #ffffff;
  border-radius: 0px;
 }

.sankey-sidebar-item {
  margin-bottom: 24px;
}

.sankey-sidebar-item-name {
  color: #5A5A5A;
  font-size: 12px;
  text-transform: uppercase;
  font-weight: 500;
  margin-right: 40px;
  line-height: 120%;
}

.sankey-sidebar-item-name:hover {
  cursor: pointer;
}

.sankey-sidebar-progress {
  height: 16px;
  margin-top: 10px;
}

.sankey-sidebar-item-progress{
  position: relative;
  margin-top: 8px;
}

.sankey-sidebar-item-progress-line {
  border-bottom: 4px solid#CFBFE7;
}

.sankey-sidebar-item-progress-number {
  margin-right: 22px;
  position: absolute;
  right: 0px;
  bottom: -12px;
  font-size: 12px; 
}

#sankey-mode-toggle{
  display: flex;
  justify-content: center;
}

#sankey-bt-toggle-chart,
#sankey-bt-toggle-data{
  width: 152px;
  border-radius: 6px;
  line-height: 15px;
  padding: 8px;
  border: 1px solid #F59F4D;
  text-align: center;
  color: #F59F4D;
  margin: 15px;
  cursor: pointer;
}

#sankey-bt-toggle-chart.active,
#sankey-bt-toggle-data.active{
  background-color: #F59F4D;
  color: #FFF;
}

#sankey-sidebar-toggle{
  display: flex;
  justify-content: center;
}

#sankey-bt-toggle-level1,
#sankey-bt-toggle-level3{
  color: #F59F4D;
  margin: 15px;
  cursor: pointer;
}

#sankey-bt-toggle-level1.active,
#sankey-bt-toggle-level3.active{
  text-decoration: underline;
}

.level-text{
  text-transform: uppercase;
  font-size: 14px;
  /* font-weight: 600; */
  font-family: Inter;
}

.title-sidebar{
  color: #393939;
  font-family: Roboto;
  font-weight: 700;
  font-size: 16px;
  line-height: 19px;
  margin-bottom: 10px;
  display: inline-block;
}