/* Annotate Block Colors and fonts */
/* Branches explorer */
/* Font */
/* Icons Colors*/
/* Call to Action Colors */
/* History Page */
/* VC Icons (will move to icon strip) */
.branch-updates-details-list {
  padding: 0px 20px 25px 20px;
}

.branch-updates-details-list .ms-DetailsList [role="presentation"] > .ms-FocusZone {
  width: 100%;
}

.branch-updates-details-list .group-header {
  height: 32px;
  padding: 10px 0px 4px 0px;
  font-size: 12px;
  font-weight: 600;
  border-bottom:  1px solid;
  border-bottom-color: rgba( 244, 244, 244 ,  1 );
  border-bottom-color: rgba( var(--palette-neutral-4,244, 244, 244) ,  1 );
}

.branch-updates-details-list .group-header .header-primary-text {
  float: left;
  padding-right: 8px;
}

.branch-updates-details-list .group-header .header-secondary-text {
  float: left;
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
}

.branch-updates-details-list .ms-GroupSpacer {
  width: 0px !important;
}

.branch-updates-details-list .ms-GroupSpacer + .ms-DetailsRow-fields > .ms-DetailsRow-cell {
  padding: 0px 0px;
  margin: 0px;
  overflow: visible;
}

.branch-updates-details-list .ms-DetailsRow {
  margin: 0px 0px;
}

.branch-updates-details-list .ms-List-cell .history-result {
  border-bottom:  1px solid;
  border-bottom-color: rgba( 244, 244, 244 ,  1 );
  border-bottom-color: rgba( var(--palette-neutral-4,244, 244, 244) ,  1 );
  vertical-align: middle;
}

.branch-updates-details-list .ms-List-cell .history-result .list-item-header {
  padding: 8px 0px;
  outline: transparent;
  /*
         * Keeping a transparent border for non-focus scenario so that when
         * in focus the height/width remains same to avoid jumpy behavior.
         */
  border: 1px solid transparent;
}

.branch-updates-details-list .ms-List-cell .history-result .list-item-header:focus {
  border-color: rgba(0, 0, 0, .55);
  border-color: var(--text-secondary-color,rgba(0, 0, 0, .55));
}

@media all and (-ms-high-contrast: white-on-black) {
  .branch-updates-details-list .ms-List-cell .history-result .list-item-header {
    outline: transparent;
    border: 1px solid transparent;
  }
  .branch-updates-details-list .ms-List-cell .history-result .list-item-header:focus {
    border-color: rgba( 255, 255, 255 ,  1 );
    border-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
  }
}

@media all and (-ms-high-contrast: black-on-white) {
  .branch-updates-details-list .ms-List-cell .history-result .list-item-header {
    outline: transparent;
    border: 1px solid transparent;
  }
  .branch-updates-details-list .ms-List-cell .history-result .list-item-header:focus {
    border-color: rgba(0, 0, 0, .55);
    border-color: var(--text-secondary-color,rgba(0, 0, 0, .55));
  }
}

.vss-focus-visible .branch-updates-details-list .ms-List-cell .history-result .avatar-card .avatar .avatar-identity-picture:focus {
  outline: 1px solid rgba( 0, 0, 0 ,  1 );
  outline: 1px solid rgba( var(--palette-neutral-100,0, 0, 0) ,  1 );
}

.branch-updates-details-list .ms-List-cell .history-result .avatar-card .card-details .first-line {
  line-height: 20px;
}

.branch-updates-details-list .ms-List-cell .history-result .avatar-card .card-details .first-line .primarylink-text {
  font-size: 15px;
  color: rgba( 0, 0, 0 ,  1 );
  color: rgba( var(--palette-neutral-100,0, 0, 0) ,  1 );
  font-weight: 600;
}

.branch-updates-details-list .ms-List-cell .history-result .avatar-card .card-details .first-line .vc-force-push-badge {
  font-size: 12px;
  color: rgba( 168, 0, 0 ,  1 );
  color: rgba( var(--palette-accent1-dark,168, 0, 0) ,  1 );
  margin-top: 2px;
  margin-left: 6px;
  line-height: 14px;
  display: inline-block;
  height: 18px;
  background-color: rgba( 249, 235, 235 ,  1 );
  background-color: rgba( var(--palette-accent1-light,249, 235, 235) ,  1 );
  padding: 1px 6px 0 6px;
  text-decoration: none;
}

.branch-updates-details-list .ms-List-cell .history-result .avatar-card .card-details .second-line .flyout.vc-build-status.enabled {
  display: inline-block;
  margin-left: 12px;
}

.branch-updates-details-list .ms-List-cell .history-result .avatar-card .card-details .second-line .flyout.vc-build-status.enabled div[role="button"]:focus {
  outline: 1px solid rgba( 102, 102, 102 ,  1 );
  outline: 1px solid rgba( var(--palette-neutral-60,102, 102, 102) ,  1 );
}

.branch-updates-details-list .ms-List-cell .history-result .avatar-card .card-details .second-line .flyout.vc-build-status.enabled div[role="button"] .flyout-header:hover {
  background: none;
}

.branch-updates-details-list .ms-List-cell .history-result .avatar-card .card-details .second-line .flyout.vc-build-status.enabled div[role="button"] .flyout-header .status-icon.bowtie-icon {
  font-size: 12px;
}

.branch-updates-details-list .ms-List-cell .history-result .expandable {
  display: inline-block;
  float: left;
  width: 32px;
  height: 40px;
  padding: 8px 8px;
}

.branch-updates-details-list .ms-List-cell .history-result .expandable .branch-update-toggle-button {
  background-color: transparent;
  border: none;
  box-shadow: none;
  padding: 0px;
  width: 16px;
  height: 24px;
}

.branch-updates-details-list .ms-List-cell .history-result .expandable .branch-update-toggle-button span {
  line-height: 24px;
  height: 24px;
  margin: 0px;
}

.branch-updates-details-list .ms-List-cell .history-result .expandable .branch-update-toggle-button .branch-update-expand {
  font-size: 12px;
  padding: 0px;
  transform: rotate(0deg);
  transform-origin: 50% 50%;
  transition: transform .1s linear, -webkit-transform .1s linear;
}

.branch-updates-details-list .ms-List-cell .history-result .avatar-card {
  width: calc(100% - 32px);
}

.branch-updates-details-list .ms-List-cell .history-result .branch-update-list-item-expanded {
  padding-left: 74px;
}

.branch-updates-details-list .ms-List-cell .history-result .branch-update-list-item-expanded > div[data-is-focusable=true] {
  outline: transparent;
  /*
         * Keeping a transparent border for non-focus scenario so that when
         * in focus the height/width remains same to avoid jumpy behavior.
         */
  border: 1px solid transparent;
}

.branch-updates-details-list .ms-List-cell .history-result .branch-update-list-item-expanded > div[data-is-focusable=true]:focus {
  border-color: rgba(0, 0, 0, .55);
  border-color: var(--text-secondary-color,rgba(0, 0, 0, .55));
}

@media all and (-ms-high-contrast: white-on-black) {
  .branch-updates-details-list .ms-List-cell .history-result .branch-update-list-item-expanded > div[data-is-focusable=true] {
    outline: transparent;
    border: 1px solid transparent;
  }
  .branch-updates-details-list .ms-List-cell .history-result .branch-update-list-item-expanded > div[data-is-focusable=true]:focus {
    border-color: rgba( 255, 255, 255 ,  1 );
    border-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
  }
}

@media all and (-ms-high-contrast: black-on-white) {
  .branch-updates-details-list .ms-List-cell .history-result .branch-update-list-item-expanded > div[data-is-focusable=true] {
    outline: transparent;
    border: 1px solid transparent;
  }
  .branch-updates-details-list .ms-List-cell .history-result .branch-update-list-item-expanded > div[data-is-focusable=true]:focus {
    border-color: rgba(0, 0, 0, .55);
    border-color: var(--text-secondary-color,rgba(0, 0, 0, .55));
  }
}

.branch-updates-details-list .ms-List-cell .history-result .branch-update-list-item-expanded .ms-List-page:last-child .ms-List-cell:last-child .ms-DetailsRow[data-is-focusable=true] {
  border-bottom: none;
}

.branch-updates-details-list .ms-List-cell .history-result.expanded .expandable .branch-update-expand {
  transform: rotate(-180deg);
}