@media (max-width: 768px) {
  .chart-container {
    display: flex;
    flex-direction: column-reverse;
  }
  .chart-pie-revenue {
    margin-bottom: -38px;
    margin-top: -25px !important;
  }
  .years-select-container {
    display: flex !important;
    justify-content: flex-end !important;
  }
  .select-year-revenue {
    min-width: auto !important;
  }
}
.select-year-revenue {
  width: 81px !important;
}

.chart-container {
  display: flex;
  align-items: center;
}

.legend-container {
  font-family: Figtree, sans-serif;
  background-color: #f2f2f2;
  padding: 24px;
  border-radius: 10px;
  width: 100%;
  height: -moz-min-content;
  height: min-content;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  margin-bottom: 40px;
}

.legend-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 18px;
}

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

.legend-text span {
  width: 31.5px;
  height: 24px;
  border-radius: 6px;
  margin-right: 16px;
}

.legend-text img {
  width: 30px;
  height: 30px;
  margin-right: 16px;
}

.legend-details {
  font-size: 16px;
}

.legend-value {
  font-size: 16px;
  margin-right: 12px;
}

.legend-color {
  width: 20px;
  height: 20px;
  border-radius: 3px;
}

.total-container {
  display: flex;
  justify-content: space-between;
}

.total-container span {
  font-size: 16px;
}

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

.legend-name {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 7px;
}

.legend-revenue {
  font-size: 14px;
  font-weight: 400;
}

.chart-pie-revenue {
  width: 100%;
  margin-top: -45px;
}

.tooltip {
  position: relative;
  display: inline-block;
}

.tooltip .tooltiptext {
  visibility: hidden;
  background-color: #555;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px;
  position: absolute;
  z-index: 1;
  bottom: 0;
  left: 0;
  opacity: 0;
  transition: opacity 0.3s;
  margin-left: -8px;
  min-width: 260px;
  margin-bottom: 20px;
  width: auto !important;
  height: auto !important;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
  opacity: 1;
}

.fi-caf {
  background-image: url(/images/globo-africa.svg?5daa75f1c6c7f5030d13d69d3530dbf5);
}

.fi-cam {
  background-image: url(/images/globo-americas.svg?94f208d05e36fdeaa15460a7f8212d10);
}

.fi-ceu {
  background-image: url(/images/globo-europa.svg?028619ab52b02654834fdf5cb2eaf845);
}

.fi-cas {
  background-image: url(/images/globo-asia.svg?ee4864685445eed891cbed8238f3e5be);
}

.fi-coc {
  background-image: url(/images/globo-oceania.svg?ee4864685445eed891cbed8238f3e5be);
}

.fi-others {
  background-image: url(/images/others.svg?4f449592bf6b9e43a2c10070230b6d10);
}
