.breaking-changes-selector {
  background: var(--sidebar-bg, #f5f7f7);
  color: var(--body-text, #333);
  padding: 15px;
  border-radius: 4px;
  margin-bottom: 20px;
}

.breaking-changes-selector div {
  margin: 10px 0;
}

.breaking-changes-selector label {
  margin-right: 8px;
}

.breaking-changes-selector select {
  margin-right: 15px;
  padding: 4px;
  background: var(--body-bg, #fff);
  color: var(--body-text, #333);
}

.breaking-changes-selector input[type="checkbox"] {
  margin-right: 4px;
}

#breaking-changes-results {
  margin-top: 15px;
}

#breaking-changes-results ul {
  margin-top: 10px;
}

.transformation-info {
  margin-left: 20px;
  padding: 5px 10px;
  background-color: var(--code-bg, #e6f7ff);
  border-left: 3px solid var(--link-color, #1890ff);
  color: var(--body-text, #333);
  margin-top: 5px;
  margin-bottom: 5px;
  font-size: 0.9em;
}

.component-checkbox {
  display: inline-block;
  margin-left: 20px;
}

.transformation-request {
  margin-top: 15px;
  padding: 10px;
  background-color: var(--sidebar-bg, #f0f0f0);
  color: var(--body-text, #333);
  border-radius: 4px;
  font-size: 0.9em;
  font-style: italic;
}