.p-autoclog__viewer_icon,
.autoclog__viewer_icon {
  &:before {
    border: 2px solid $primary;
    background-color: $bg2;
  }
}

.p-autoclog__viewer_details,
.autoclog__viewer_details {
  background: $button;
  color: $primary;
  border: 1px solid $primary;
}

.autoclog_send_viewer__clog {
  background: $button;
  color: $primary;
}

.autoclog_send_viewer {
  .c-toggle__input {
    background: $button;

    &:checked {
      background: $primary;
    }
  }
}

@keyframes clog {
  0% {
    box-shadow: inset 0 0 15px 5px $active;
  }

  to {
    box-shadow: none;
  }
}

.autoclog_toggle {
  border: 2px solid $border;
  background: $bg;
}

.autoclog_toggle--active {
  border: 2px solid $accent;
}

.autoclog_toggle__lever {
  background: $border;
}

.autoclog_toggle--active .autoclog_toggle__lever {
  background: $accent;
}

.p-autoclog_send_viewer_clog__content {
  background: $bg;
  color: $accent;
}

.p-autoclog_send_viewer_clog__copy_toast {
  background-color: $notif;
  color: $fg;

  > i {
    color: $primary;
  }
}
