.tabs--initialised .tabs__controls {
  padding-left: var(--spacing);
}

.tabs--initialised .tabs__controls li {
  margin-right: var(--spacing-small);
}

.tabs--initialised .tabs__controls button {
  border-inline: var(--border-light);
  font-weight: bold;
}

.tabs--initialised .tabs__controls button:hover,
.tabs--initialised .tabs__controls button:focus {
  text-decoration: none;
}

.tabs--initialised .tabs__controls button[aria-selected="false"] {
  color: var(--color-grey-darkest);
  border-block: var(--border-light);
  border-block-end-color: transparent;
  background-color: var(--color-tab-inactive);
}

.tabs--initialised .tabs__controls button[aria-selected="false"]:hover,
.tabs--initialised .tabs__controls button[aria-selected="false"]:focus,
.tabs--initialised .tabs__controls button[aria-selected="false"]:focus-within {
  color: var(--color-grey-darkest);
  background-color: var(--color-tab-inactive-hover);
}

.tabs--initialised .tabs__controls [aria-selected="true"] {
  color: var(--color-accent);
  border-block-start: 2px solid var(--color-accent);
  background-color: var(--color-white);
}

.tabs--initialised .tabs__controls > li + li button {
  border-inline-start: 1px solid var(--color-grey-light);
}

.tabs--initialised .tab-panel {
  border-color: var(--color-grey-light);
}
