.up-arrow {
  display: inline-block;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-image: url('data:image/svg+xml,<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.12896 0.593906C6.49758 -0.142789 7.54893 -0.142789 7.91755 0.593907L13.5044 11.7594C13.8371 12.4243 13.3536 13.2069 12.6101 13.2069H1.43638C0.69287 13.2069 0.209381 12.4243 0.542086 11.7594L6.12896 0.593906Z" fill="%23087C32"/></svg>');
}

.down-arrow {
  display: inline-block;

  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-image: url('data:image/svg+xml,<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7.11867 14.817C7.49574 15.5203 8.50426 15.5203 8.88133 14.817L15.8708 1.77958C16.228 1.11341 15.7454 0.307091 14.9895 0.307091H1.0105C0.254629 0.307091 -0.227979 1.11341 0.129165 1.77958L7.11867 14.817Z" fill="%23D91400"/></svg>');
}

.arrow {
  width: 11px;
  height: 14.5px;
  cursor: pointer;
}

.arrows-container {
  display: flex;
  flex-direction: column;
}

.arrow-component-container {
  display: flex;
  align-items: center;
  gap: 5px;
  width: fit-content;
}
.arrows-component-star {
  color: #ffbf00;
  font-size: 30px;
}