ch-tab-render.tab {
  background-color: transparent;
  border-color: transparent;
}
ch-tab-render.tab::part(tab-list block-start) {
  border-block-end: none;
}
ch-tab-render.tab::part(tab block closable), ch-tab-render.tab::part(tab block not-closable) {
  background-color: transparent;
}

:host {
  display: grid;
  block-size: 100%;
  grid-template-areas: "header header" "main aside";
  grid-template-rows: max-content 1fr;
  grid-template-columns: 1fr 280px;
  row-gap: var(--spacing-gap-l);
}

.section {
  display: contents;
}

.header {
  display: grid;
  grid-area: header;
  grid-template-areas: "plugin-icon plugin-details";
  grid-template-columns: 64px 1fr;
  column-gap: var(--spacing-gap-xl);
  padding-block-start: var(--spacing-padding-xxl);
  padding-block-end: var(--spacing-padding-xl);
  padding-inline: var(--spacing-padding-xxl);
}

.plugin__icon {
  grid-area: plugin-icon;
  inline-size: 100%;
  block-size: auto;
  display: block;
}

.plugin__details {
  grid-area: plugin-details;
  display: flex;
  flex-direction: column;
  gap: var(--spacing-gap-m);
}

.plugin__publisher {
  display: flex;
  align-items: center;
  gap: var(--spacing-gap-xs);
}

.plugin__description {
  line-height: var(--line-height-spacious);
}

.plugin__actions-container {
  margin-block-start: var(--spacing-padding-m);
  align-items: center;
}

.action-button {
  min-inline-size: 100px;
}
.action-button.more-versions-available {
  border-start-end-radius: 0 !important;
  border-end-end-radius: 0 !important;
}

.installed-container {
  display: flex;
  align-items: center;
  gap: var(--spacing-gap-m);
}
.installed-container ch-image {
  --ch-image-size: 20px;
}

.main {
  grid-area: main;
}

.docsTab {
  block-size: 100%;
}

.aside {
  grid-area: aside;
  overflow: auto;
  border-block-start: 1px solid var(--items-container__border-color);
}

.fields__list {
  list-style: none;
  padding: 0;
  margin: 0;
  font-size: var(--font-size-body-s);
}

.plugin__info-category {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-gap-m);
}
.plugin__info-category:not(:first-child) {
  padding-block-start: var(--spacing-padding-xl);
  margin-block-start: var(--spacing-padding-xl);
  border-block-start: 1px solid var(--color-border-surface-on-elevation-1);
}

.fields__list:not(.fields__list--as-tags) {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-gap-m);
}
.fields__list:not(.fields__list--as-tags) .field__li {
  display: flex;
  gap: var(--spacing-gap-xl);
}

.fields__list--as-tags {
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-gap-m);
}
.fields__list--as-tags .field__li {
  border: 1px solid var(--color-border-surface-on-elevation-1);
  padding-block: var(--spacing-padding-xxs);
  padding-inline: var(--spacing-padding-m);
  border-radius: 4px;
  text-transform: lowercase;
}
.fields__list--as-tags .field__link {
  color: var(--color-text-neutral-strawberry);
}
.fields__list--as-tags .field__link:hover {
  color: var(--color-accent-primary-default);
}
.fields__list--as-tags .field__link:active {
  color: var(--color-accent-primary-hover);
}

.field__name,
.field__value {
  flex: 1;
}

.field__link {
  color: var(--color-accent-primary-default);
}
.field__link:hover {
  color: var(--color-accent-primary-hover);
}
.field__link:active {
  color: var(--color-accent-primary-pressed);
}

.docsTab {
  background-color: transparent !important;
}

.dropdown.button-icon-only::part(expandable-button) {
  padding: calc( (var(--control-block-size) - 2 * var(--control-border-width) - 16px) / 2 ) !important;
  border-start-start-radius: 0 !important;
  border-end-start-radius: 0 !important;
}

.version-buttons-container {
  display: flex;
  align-items: center;
  gap: 1px;
}

ch-markdown-viewer {
  block-size: 100%;
  overflow: auto;
}

.text-underline {
  text-decoration: underline;
}