// Color
a,
.link,
button.link,
.tabs__link.is-active,
[open] .claro-details__summary--accordion,
[open] .claro-details__summary--accordion-item,
[open] .claro-details__summary--vertical-tabs-item,
.vertical-tabs__menu-item.is-selected .vertical-tabs__menu-link
{
  color: var(--gin-color-primary);
  text-decoration: none;

  &:hover {
    color: var(--gin-color-primary-hover);
  }

  &:active {
    color: var(--gin-color-primary-active);
  }
}

// Only hover
.is-horizontal .tabs__link,
.claro-details__summary,
.action-link
{
  &:hover {
    color: var(--gin-color-primary-hover);
  }
}

// Only focus
.claro-details[open] > .claro-details__summary
{
  &:focus {
    color: var(--gin-color-primary-active);
  }
}

// Border color
.form-boolean--type-checkbox:checked,
.form-boolean--type-radio:checked:not(:disabled),
.is-horizontal .tabs__link.is-active::before,
.tabs__tab.is-active::before,
[open] > .claro-details__summary--accordion:not(:focus):not(:active)::after,
[open] > .claro-details__summary--accordion-item:not(:focus):not(:active)::after,
.collapse-processed[open] > .claro-details__summary--accordion .details-title:not(:focus)::after,
.collapse-processed[open] > .claro-details__summary--accordion-item .details-title:not(:focus)::after,
[open] > .claro-details__summary--vertical-tabs-item:not(:focus):not(:active)::after,
.collapse-processed[open] > .claro-details__summary--vertical-tabs-item .details-title:not(:focus)::after,
.vertical-tabs__menu-item.is-selected .vertical-tabs__menu-link::before
{
  border-color: var(--gin-color-primary);

  &:hover {
    border-color: var(--gin-color-primary-hover);
  }

  &:active {
    border-color: var(--gin-color-primary-active);
  }
}
