/* Only history bars use this palette. Current service status stays unchanged. */
.tick[data-makura-uptime-band] {
  background-color: var(--makura-tick-color) !important;
  transition: opacity 150ms ease;
}

.tick[data-makura-uptime-band="green"] {
  --makura-tick-color: var(--color-statuspage-green, #059669);
}

.tick[data-makura-uptime-band="lime"] {
  --makura-tick-color: #a3e635;
}

.tick[data-makura-uptime-band="yellow"] {
  --makura-tick-color: #facc15;
}

.tick[data-makura-uptime-band="red"] {
  --makura-tick-color: var(--color-statuspage-red, #b91c1c);
}

.tick[data-makura-uptime-band="maintenance"] {
  --makura-tick-color: var(--color-statuspage-blue, #0369a1);
}

.tick[data-makura-uptime-band]:hover,
.tick[data-makura-uptime-band].hover {
  opacity: 0.6;
}

[data-makura-uptime-label],
[data-tooltip-slot="makura-uptime"] {
  margin: 0.25rem 0.5rem;
  font-size: 0.8125rem;
  font-weight: 500;
  text-align: center;
}