.dark [img-light] {
  display: none;
}

html:not(.dark) [img-dark] {
  display: none;
}

details summary {
  cursor: pointer;
}

/* Overrides */

.sp .sp-link.link:hover,
.sp .sp-link.link:focus {
  background-color: var(--vitest-c-sponsor-hover) !important;
}

/* outline styles for buttons and VPButton anchors */
button:focus,
button:focus-visible,
.DocSearch-Button:focus,
.DocSearch-Button:focus-visible,
a:focus-visible,
a:focus {
  border-radius: 2px;
  outline: 2px solid var(--vp-c-text-1);
}

a:focus:not(:focus-visible),
button:focus:not(:focus-visible) {
  outline: none !important;
}

/* custom block styles */
html:not(.dark) .custom-block.tip code {
  color: var(--vitest-custom-block-tip-code-text) !important;
}

html:not(.dark) .custom-block.info code {
  color: var(--vitest-custom-block-info-code-text) !important;
}

.custom-block.tip a:hover,
.vp-doc .custom-block.tip a:hover>code {
  color: var(--vp-c-brand-1) !important;
  opacity: 1;
}

.custom-block.info a:hover,
.vp-doc .custom-block.info a:hover>code {
  color: var(--vp-c-brand-1) !important;
  opacity: 1;
}

html:not(.dark) .custom-block.info a:hover,
html:not(.dark) .vp-doc .custom-block.info a:hover>code {
  color: var(--vitest-custom-block-info-code-text) !important;
  opacity: 1;
}

.custom-block.warning a:hover,
.vp-doc .custom-block.warning a:hover>code {
  color: var(--vp-c-warning-1) !important;
  opacity: 1;
}

.custom-block.danger a:hover,
.vp-doc .custom-block.danger a:hover>code {
  color: var(--vp-c-danger-1) !important;
  opacity: 1;
}

/* search # styles */
:not(.dark) .title-icon {
  opacity: 1 !important;
}

.dark .title-icon {
  opacity: 0.67 !important;
}

.VPSocialLink {
  transform: scale(0.9);
}

.vp-doc a {
  text-decoration-style: dotted;
}

.custom-block a:focus,
.custom-block a:active,
.custom-block a:hover,
.custom-block a:active,
.vp-doc a:focus,
.vp-doc a:active,
.vp-doc a:hover,
.vp-doc a:active {
  text-decoration: underline;
}

.vp-doc th,
.vp-doc td {
  padding: 6px 10px;
  border: 1px solid #8882;
}

/* h3 breaks SEO => replaced with h2 with the same size */
.home-content h2 {
  margin-top: 2rem;
  font-size: 1.35rem;
  border-bottom: none;
  margin-bottom: 0;
}

img.resizable-img {
  width: unset;
  height: unset;
}

.VPTeamMembersItem.medium .profile .data .affiliation {
  min-height: unset;
}

.VPTeamMembersItem.medium .profile .data .desc {
  min-height: unset;
}

/* fix height ~ 2 lines of text: 3 cards per row */
@media (min-width: 648px) {
  .VPTeamMembersItem.medium .profile .data .affiliation {
    min-height: 4rem;
  }

  .VPTeamMembersItem.medium .profile .data .desc {
    min-height: 4rem;
  }
}

/* fix height ~ 2 lines of text: 3 or more cards per row */
.VPTeamMembersItem.small .profile .data .affiliation {
  min-height: 3rem;
}

.VPTeamMembersItem.small .profile .data .desc {
  min-height: 3rem;
}

/* fix height ~ 3 lines of text: 4 cards per row */
@media (min-width: 1064px) and (max-width: 1143px) {
  .VPTeamMembersItem.small .profile .data .affiliation {
    min-height: 4rem;
  }

  .VPTeamMembersItem.small .profile .data .desc {
    min-height: 4rem;
  }
}

/* fix height ~ 3 lines of text: 3 cards per row */
@media (min-width: 815px) and (max-width: 875px) {
  .VPTeamMembersItem.small .profile .data .affiliation {
    min-height: 4rem;
  }

  .VPTeamMembersItem.small .profile .data .desc {
    min-height: 4rem;
  }
}

/* fix height ~ 3 lines of text: 2 cards per row */
@media (max-width: 612px) {
  .VPTeamMembersItem.small .profile .data .affiliation {
    min-height: 4rem;
  }

  .VPTeamMembersItem.small .profile .data .desc {
    min-height: 4rem;
  }
}

/* fix height: one card per row */
@media (max-width: 568px) {
  .VPTeamMembersItem.small .profile .data .affiliation {
    min-height: unset;
  }

  .VPTeamMembersItem.small .profile .data .desc {
    min-height: unset;
  }
}

.highlighted-word {
  background-color: var(--vp-code-line-highlight-color);
  transition: background-color 0.5s;
  display: inline-block;
}

/* credit goes to https://dylanatsmith.com/wrote/styling-the-kbd-element */
html:not(.dark) kbd {
  --kbd-color-background: #f7f7f7;
  --kbd-color-border: #cbcccd;
  --kbd-color-text: #222325;
}

kbd {
  --kbd-color-background: #898b90;
  --kbd-color-border: #3d3e42;
  --kbd-color-text: #222325;

  background-color: var(--kbd-color-background);
  color: var(--kbd-color-text);
  border-radius: 0.25rem;
  border: 1px solid var(--kbd-color-border);
  box-shadow: 0 2px 0 1px var(--kbd-color-border);
  font-family: var(--font-family-sans-serif);
  font-size: 0.75em;
  line-height: 1;
  min-width: 0.75rem;
  text-align: center;
  padding: 2px 5px;
  position: relative;
  top: -1px;
}