mempool/frontend/src/app/components/tx-bowtie-graph/tx-bowtie-graph.component.scss

.bowtie {
  .line {
    fill: none;

    &.input {
      stroke: url(#input-gradient);
    }
    &.output {
      stroke: url(#output-gradient);
    }
    &.fee {
      stroke: url(#fee-gradient);
    }

    &.highlight {
      z-index: 8;
      cursor: pointer;
      &.input {
        stroke: url(#input-highlight-gradient);
      }
      &.output {
        stroke: url(#output-highlight-gradient);
      }
    }
  }

  .line:hover, .connector:hover + .marker-target + .line, .marker-target:hover + .line {
    z-index: 10;
    cursor: pointer;
    &.input {
      stroke: url(#input-hover-gradient);
    }
    &.output {
      stroke: url(#output-hover-gradient);
    }
    &.fee {
      stroke: url(#fee-hover-gradient);
    }
  }

  .connector {
    stroke: none;
    opacity: 0.75;
    cursor: pointer;
    &.input {
      fill: url(#input-connector-gradient);
    }
    &.output {
      fill: url(#output-connector-gradient);
    }
  }

  .marker-target {
    stroke: none;
    fill: transparent;
    cursor: pointer;
  }
}