What is the :has() Selector?

/* Select parent that contains child */
parent:has(child) { }

/* Card with image gets different style */
.card:has(img) {
  padding-top: 0;
}

/* Form with invalid input */
form:has(input:invalid) {
  border-color: red;
}

/* Figure with figcaption */
figure:has(figcaption) {
  border: 1px solid #ddd;
}

/* Previous sibling (has next sibling) */
li:has(+ li) {
  border-bottom: 1px solid #ddd;
}

/* Select label when checkbox is checked */
label:has(input:checked) {
  font-weight: bold;
}

/* Page has modal open */
body:has(.modal.open) {
  overflow: hidden;
}