/* Course outline cards (home page #courses) */

.courses {
  background: rgb(231, 230, 230);
  padding: 1rem 1.25rem 3.25rem;
  border-radius: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0;
  position: relative;
  overflow: visible;
}

.course-card__title {
  margin: 0;
  padding: 0;
  line-height: 1.2;
  font-size: 1.3rem;
  text-transform: uppercase;
}

/* Remove wrapper boxes between title and CKEditor blocks */
.course-card__body,
.course-card__body > .richtext--compact {
  display: contents;
}

/* First content block sits directly under the card title */
.courses > .course-card__title + :where(p, ul, ol, h1, h2, h3, h4, h5, h6, figure, div) {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

.courses > :where(p, ul, ol) {
  margin: 0 0 0.45rem;
  padding: 0;
}

.courses > :where(h1, h2, h3, h4, h5, h6) {
  margin: 0 0 0.35rem;
  padding: 0;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.35;
  text-transform: none;
}

.courses > :where(h1, h2, h3, h4, h5, h6) ~ :where(h1, h2, h3, h4, h5, h6) {
  margin-top: 0.5rem;
}

.courses > figure.image {
  margin: 0.5rem 0;
}

.courses > figure.image:first-of-type {
  margin-top: 0 !important;
}

.courses > ul,
.courses > ol {
  display: block;
  padding-left: 1.35rem;
  list-style-position: outside;
}

.courses > li {
  margin-bottom: 0.25rem;
}

.courses > .outline-pending {
  margin: 0.25rem 0 0;
  font-size: 0.95rem;
}

.courses > .footer {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 2.9rem;
  margin: 0;
}
