@import './var.css';

SBubble {
  fill: var(--intergalactic-chart-palette-order-1, oklch(0.58 0.168 278.2));
  stroke: var(--intergalactic-chart-grid-border, #fff);
  stroke-width: 2px;
  transition-property: cx, cy;
  transition-duration: var(--duration);
  transition-timing-function: ease-in-out;
  opacity: 0.5;

  &:hover {
    opacity: 0.8;
  }
}

g[visible='false'] {
  display: none;
}

SBubble[clickable] {
  cursor: pointer;
}

SBubble[color] {
  fill: var(--color);
}

SBubble[pattern][color] {
  fill: var(--pattern);
  stroke: var(--color);
  stroke-width: 1px;
}

SBubble[transparent] {
  opacity: 0.3;
}

SCenter {
  text-anchor: middle;
  /* disable-tokens-validator */
  font-size: calc(var(--intergalactic-fs-100, 12px) - 1px);
  stroke: var(--intergalactic-chart-palette-order-1, oklch(0.58 0.168 278.2));
}

SCenter[color] {
  stroke: var(--color);
}

SCenter[transparent] {
  opacity: 0.3;
}

SLabel {
  fill: var(--intergalactic-chart-palette-order-1, oklch(0.58 0.168 278.2));
}

SLabel[position='right'] {
  text-anchor: end;
}

SLabel[position='left'] {
  text-anchor: start;
}

SLabel[color] {
  fill: var(--color);
}

SLabel[transparent] {
  opacity: 0.3;
}