.variable-group-overview-container .variable-group-overview .dtc-vg-overview-error {
  padding-bottom: 0px;
}

.variable-group-details-container {
  margin: 10px 20px 10px 0;
  max-width: 1280px;
}

.variable-group-details-container .dtc-vg-view-no-vg-message {
  font-size: 14px;
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
  padding: 10px 0px 10px 40px;
}

.variable-group-details-container .dtc-vg-view-no-vg-message .dtc-vg-view-learn-more-link {
  margin-left: 2px;
}

.variable-group-details-container .dtc-variable-group-toggle-icon {
  font-size: 12px;
}

.variable-group-details-container .dtc-variable-group-expanded {
  transform: rotate(180deg);
}

.variable-group-details-container .dtc-variable-group-header {
  padding: 8px 3px;
  margin-left: 1px;
  margin-bottom: 1px;
  margin-top: 1px;
  font-size: 14px;
  outline: none;
}

.variable-group-details-container .dtc-variable-group-header:hover {
  background-color: rgba( 244, 244, 244 ,  1 );
  background-color: rgba( var(--palette-neutral-4,244, 244, 244) ,  1 );
}

.variable-group-details-container .dtc-variable-group-header:focus {
  background-color: rgba( 239, 246, 252 ,  1 );
  background-color: rgba( var(--palette-primary-tint-40,239, 246, 252) ,  1 );
}

.variable-group-details-container .dtc-variable-group-header.dtc-vg-header-active {
  background-color: rgba( 239, 246, 252 ,  1 );
  background-color: rgba( var(--palette-primary-tint-40,239, 246, 252) ,  1 );
}

.vss-focus-visible .variable-group-details-container .dtc-variable-group-header.dtc-vg-header-active:focus {
  outline: 1px solid rgba( 0, 0, 0 ,  1 );
  outline: 1px solid rgba( var(--palette-neutral-100,0, 0, 0) ,  1 );
}

.variable-group-details-container .dtc-variable-group-header.dtc-vg-header-active .dtc-variable-group-header-focus-zone .dtc-remove-variable-group-button,
.variable-group-details-container .dtc-variable-group-header.dtc-vg-header-active .dtc-variable-group-header-focus-zone .dtc-variable-group-more-actions {
  visibility: visible;
}

.variable-group-details-container .dtc-variable-group-header .dtc-variable-group-header-focus-zone {
  display: flex;
}

.variable-group-details-container .dtc-variable-group-header .dtc-variable-group-header-focus-zone .dtc-variable-group-toggle-button {
  margin-left: 2px;
  bottom: 8px;
}

.variable-group-details-container .dtc-variable-group-header .dtc-variable-group-header-focus-zone .dtc-variable-group-header-info {
  max-width: 600px;
  margin-left: 10px;
  flex: 0 1 37%;
}

.variable-group-details-container .dtc-variable-group-header .dtc-variable-group-header-focus-zone .dtc-variable-group-header-info.dtc-variable-group-deleted .dtc-variable-group-name {
  color: rgba( 218, 10, 0 ,  1 );
  color: rgba( var(--palette-accent1,218, 10, 0) ,  1 );
}

.variable-group-details-container .dtc-variable-group-header .dtc-variable-group-header-focus-zone .dtc-variable-group-header-info.dtc-variable-group-deleted .dtc-variable-group-description {
  color: rgba( 218, 10, 0 ,  1 );
  color: rgba( var(--palette-accent1,218, 10, 0) ,  1 );
}

.variable-group-details-container .dtc-variable-group-header .dtc-variable-group-header-focus-zone .dtc-variable-group-header-info.dtc-variable-group-not-accessible .dtc-variable-group-name {
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
}

.variable-group-details-container .dtc-variable-group-header .dtc-variable-group-header-focus-zone .dtc-variable-group-header-info.dtc-variable-group-not-accessible .dtc-variable-group-description {
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
}

.variable-group-details-container .dtc-variable-group-header .dtc-variable-group-header-focus-zone .dtc-variable-group-header-info:not(.dtc-variable-group-deleted) .dtc-variable-group-name-link {
  color: rgba(0, 0, 0, .9);
  color: var(--text-primary-color,rgba(0, 0, 0, .9));
}

.vss-focus-visible .variable-group-details-container .dtc-variable-group-header .dtc-variable-group-header-focus-zone .dtc-variable-group-header-info:not(.dtc-variable-group-deleted) .dtc-variable-group-name-link:focus {
  outline: 1px solid rgba( 0, 0, 0 ,  1 );
  outline: 1px solid rgba( var(--palette-neutral-100,0, 0, 0) ,  1 );
}

.variable-group-details-container .dtc-variable-group-header .dtc-variable-group-header-focus-zone .dtc-variable-group-header-info:not(.dtc-variable-group-deleted) .dtc-variable-group-name-link:hover, .variable-group-details-container .dtc-variable-group-header .dtc-variable-group-header-focus-zone .dtc-variable-group-header-info:not(.dtc-variable-group-deleted) .dtc-variable-group-name-link:focus {
  color: rgba(0, 90, 158, 1);
  color: var(--communication-foreground,rgba(0, 90, 158, 1));
}

.variable-group-details-container .dtc-variable-group-header .dtc-variable-group-header-focus-zone .dtc-variable-group-header-info .dtc-variable-group-name {
  font-weight: bold;
  font-size: 14px;
  padding: 1px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
}

.variable-group-details-container .dtc-variable-group-header .dtc-variable-group-header-focus-zone .dtc-variable-group-header-info .dtc-variable-group-description {
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
}

.variable-group-details-container .dtc-variable-group-header .dtc-variable-group-header-focus-zone .dtc-variable-group-header-info .dtc-vg-error-icon, .variable-group-details-container .dtc-variable-group-header .dtc-variable-group-header-focus-zone .dtc-variable-group-header-info .dtc-vg-warning-icon {
  margin-top: 2px;
}

.variable-group-details-container .dtc-variable-group-header .dtc-variable-group-header-focus-zone .dtc-variable-group-header-info .dtc-vg-error-icon {
  color: rgba( 218, 10, 0 ,  1 );
  color: rgba( var(--palette-accent1,218, 10, 0) ,  1 );
}

.variable-group-details-container .dtc-variable-group-header .dtc-variable-group-header-focus-zone .dtc-variable-group-header-info .dtc-vg-warning-icon {
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
}

.variable-group-details-container .dtc-variable-group-header .dtc-variable-group-header-focus-zone .dtc-variable-group-more-actions {
  visibility: hidden;
}

.variable-group-details-container .dtc-variable-group-header .dtc-variable-group-header-focus-zone .dtc-variable-group-scopes {
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
  margin-left: 10px;
}

.variable-group-details-container .dtc-variable-group-header .dtc-variable-group-header-focus-zone .dtc-remove-variable-group-button {
  margin-left: auto;
  visibility: hidden;
}

.variable-group-details-container .dtc-variable-group-header .dtc-variable-group-header-focus-zone:focus .dtc-remove-variable-group-button,
.variable-group-details-container .dtc-variable-group-header .dtc-variable-group-header-focus-zone:focus .dtc-variable-group-more-actions, .variable-group-details-container .dtc-variable-group-header .dtc-variable-group-header-focus-zone:hover .dtc-remove-variable-group-button,
.variable-group-details-container .dtc-variable-group-header .dtc-variable-group-header-focus-zone:hover .dtc-variable-group-more-actions {
  visibility: visible;
}

.variable-group-details-container .dtc-vg-view-footer {
  margin-top: 15px;
}

.variable-group-details-container .dtc-vg-view-footer .dtc-vg-view-manage-vg-link {
  display: inline-block;
  margin-top: 7px;
}

.variable-group-details-container .dtc-vg-view-footer .dtc-vg-view-spacer {
  display: inline-block;
  padding-left: 2px;
  padding-right: 10px;
  vertical-align: top;
  margin-top: 6px;
}

.variable-group-details-container .dtc-vg-view-footer .dtc-add-variable-group-button {
  margin-left: 36px;
  margin-right: 10px;
}
