.local-task__link {
  background-color: var(--lumi-local-task-background);
  border: none;
  border-radius: var(--lumi-local-task-border-radius);
  color: var(--lumi-local-task-color);
  display: block;
  font-size: var(--lumi-local-task-font-size);
  font-weight: var(--lumi-local-task-font-weight);
  padding: 3px 10px;
  text-decoration: none;
}

.local-task__link:hover,
.local-task__link:focus,
.local-task--active .local-task__link {
  background: var(--lumi-local-task-background-active);
  color: var(--lumi-local-task-color-active);
  text-decoration: none;
}

.local-tasks--horizontal .local-task:not(:last-child) .local-task__link {
  margin-right: calc(var(--lumi-gutter) / 2);
}

.local-tasks--vertical .local-task:not(:last-child) .local-task__link {
  margin-bottom: calc(var(--lumi-gutter) / 2);
}

.local-task--has-icon .local-task__link {
  align-items: center;
  display: flex;
  justify-content: center;
}

.local-task__link__icon {
  margin-right: calc(var(--lumi-gutter) / 4);
}

.local-task--tooltip-label .local-task__link {
  height: var(--lumi-local-task-icon-button-size);
  position: relative;
  width: var(--lumi-local-task-icon-button-size);
}

.local-task--tooltip-label .local-task__link__icon {
  margin: 0;
}

.local-task--tooltip-label .local-task__link__text {
  background: var(--lumi-local-task-background-active);
  border-radius: var(--lumi-local-task-border-radius);
  box-sizing: border-box;
  color: var(--lumi-local-task-color-active);
  display: none;
  height: var(--lumi-local-task-icon-button-size);
  left: 0;
  line-height: var(--lumi-local-task-icon-button-size);
  padding: 0 calc(var(--lumi-gutter) / 2);
  position: absolute;
  top: calc(100% + (var(--lumi-gutter) /4));
  z-index: 10000;
  white-space: nowrap;
  overflow: auto;
}

.local-task--tooltip-label .local-task__link:hover .local-task__link__text, .local-task--tooltip-label .local-task__link:focus .local-task__link__text {
  display: block;
}

.local-tasks--fixed-left .local-task--tooltip-label .local-task__link__text {
  left: calc(100% + (var(--lumi-gutter) /4));
  top: 0;
}

.local-tasks--fixed-right .local-task--tooltip-label .local-task__link__text {
  left: inherit;
  right: calc(100% + (var(--lumi-gutter) /4));
  top: 0;
}

[class*='local-tasks--fixed-bottom'] .local-task--tooltip-label .local-task__link__text {
  bottom: calc(100% + (var(--lumi-gutter) /4));
  top: inherit;
}

.local-tasks--fixed-bottom-right .local-task--tooltip-label .local-task__link__text {
  left: inherit;
  right: 0;
}