/*
 * Rich Text (HTML) section.
 *
 * A free-form content block for pasted rich text and HTML, the Ebenezer
 * stand-in for the removed default page editor. The content element styles
 * the common WordPress editor output (headings, lists, links, images with
 * alignment and caption classes, tables, quotes, code, embeds) so pasted
 * content matches the rest of the page without extra markup. The width
 * modifier switches between the full section container and a reading
 * measure. Colors are component custom props with light-surface defaults;
 * the purple-surface overrides live in the central page-sections stylesheet
 * under the theme-dark wrapper.
 */

.acu-rich-text {
  --acu-rich-text-copy: var(--acu-midnight-purple);
  --acu-rich-text-heading: var(--acu-wildcat-purple);
  --acu-rich-text-link: var(--acu-midnight-purple);
  --acu-rich-text-link-hover: var(--acu-vibrant-purple);
  --acu-rich-text-rule: rgba(33, 23, 75, 0.15);
  --acu-rich-text-quote: var(--acu-wildcat-purple);
  --acu-rich-text-quote-rule: var(--acu-citrus-orange);
  --acu-rich-text-muted-surface: rgba(33, 23, 75, 0.06);
  color: var(--acu-rich-text-copy);
  padding: clamp(var(--space-3xl), 7vw, var(--space-5xl)) 0;
  position: relative;
  width: 100%;
}

.acu-rich-text__inner {
  margin: 0 auto;
  max-width: var(--container-xl);
  padding: 0 var(--space-xl);
  width: 100%;
}

.acu-rich-text--narrow .acu-rich-text__inner {
  max-width: calc(var(--container-md) + (var(--space-xl) * 2));
}

.acu-rich-text__heading {
  color: var(--acu-rich-text-heading);
  font-family: var(--font-serif);
  font-size: clamp(var(--text-4xl), 4vw, var(--text-5xl));
  font-weight: var(--font-bold);
  letter-spacing: var(--tracking-tight);
  line-height: var(--leading-tight);
  margin: 0 0 var(--space-xl);
  text-wrap: balance;
}

.acu-rich-text__content {
  color: var(--acu-rich-text-copy);
  font-family: var(--font-sans);
  font-size: var(--text-md);
  font-weight: var(--font-regular);
  line-height: var(--leading-normal);
}

/* Contain floated alignleft/alignright images. */
.acu-rich-text__content::after {
  clear: both;
  content: "";
  display: block;
}

.acu-rich-text__content > :first-child {
  margin-top: 0;
}

.acu-rich-text__content > :last-child {
  margin-bottom: 0;
}

/* Flow spacing for the editor's block-level output. */
.acu-rich-text__content p,
.acu-rich-text__content ul,
.acu-rich-text__content ol,
.acu-rich-text__content dl,
.acu-rich-text__content table,
.acu-rich-text__content blockquote,
.acu-rich-text__content pre,
.acu-rich-text__content figure,
.acu-rich-text__content .wp-caption {
  margin: 0 0 var(--space-md);
}

.acu-rich-text__content h2,
.acu-rich-text__content h3,
.acu-rich-text__content h4,
.acu-rich-text__content h5,
.acu-rich-text__content h6 {
  color: var(--acu-rich-text-heading);
  font-family: var(--font-serif);
  font-weight: var(--font-bold);
  letter-spacing: var(--tracking-tight);
  line-height: var(--leading-snug);
  margin: var(--space-xl) 0 var(--space-sm);
  text-transform: none;
}

.acu-rich-text__content h2 {
  font-size: var(--text-3xl);
}

.acu-rich-text__content h3 {
  font-size: var(--text-2xl);
}

.acu-rich-text__content h4 {
  font-family: var(--font-sans);
  font-size: var(--text-xl);
}

.acu-rich-text__content h5,
.acu-rich-text__content h6 {
  font-family: var(--font-sans);
  font-size: var(--text-lg);
}

.acu-rich-text__content a {
  color: var(--acu-rich-text-link);
  font-weight: var(--font-semibold);
  text-decoration: underline;
  text-decoration-thickness: 0.0625rem;
  text-underline-offset: 0.2em;
  transition: color var(--motion-fast) var(--ease-out);
}

.acu-rich-text__content a:hover,
.acu-rich-text__content a:focus-visible {
  color: var(--acu-rich-text-link-hover);
  text-decoration-thickness: 0.125rem;
}

.acu-rich-text__content a:focus-visible {
  border-radius: 0.125rem;
  outline: 0.1875rem solid var(--acu-sky-blue);
  outline-offset: var(--space-2xs);
}

.acu-rich-text__content strong,
.acu-rich-text__content b {
  font-weight: var(--font-bold);
}

.acu-rich-text__content ul,
.acu-rich-text__content ol {
  padding-left: var(--space-lg);
}

.acu-rich-text__content ul {
  list-style: disc;
}

.acu-rich-text__content ol {
  list-style: decimal;
}

.acu-rich-text__content li {
  margin: 0 0 var(--space-2xs);
}

.acu-rich-text__content li > ul,
.acu-rich-text__content li > ol {
  margin: var(--space-2xs) 0 0;
}

.acu-rich-text__content dt {
  font-weight: var(--font-bold);
}

.acu-rich-text__content dd {
  margin: 0 0 var(--space-xs);
}

/* Images keep the classic editor's alignment and caption classes. */
.acu-rich-text__content img {
  height: auto;
  max-width: 100%;
  vertical-align: middle;
}

.acu-rich-text__content .aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.acu-rich-text__content .alignleft,
.acu-rich-text__content .alignright {
  display: block;
  margin-bottom: var(--space-md);
}

.acu-rich-text__content .wp-caption {
  max-width: 100%;
}

.acu-rich-text__content .wp-caption img,
.acu-rich-text__content figure img {
  display: block;
}

.acu-rich-text__content .wp-caption-text,
.acu-rich-text__content figcaption {
  font-size: var(--text-sm);
  line-height: var(--leading-snug);
  margin-top: var(--space-xs);
  opacity: 0.8;
}

.acu-rich-text__content table {
  border-collapse: collapse;
  width: 100%;
}

.acu-rich-text__content th,
.acu-rich-text__content td {
  border-bottom: 1px solid var(--acu-rich-text-rule);
  padding: var(--space-xs) var(--space-sm);
  text-align: left;
  vertical-align: top;
}

.acu-rich-text__content th {
  background-color: var(--acu-rich-text-muted-surface);
  font-weight: var(--font-bold);
}

/* The color restates the ACU theme's global blockquote purple as a
   component prop, so the quote can turn white on a dark surface. */
.acu-rich-text__content blockquote {
  border-left: 0.25rem solid var(--acu-rich-text-quote-rule);
  color: var(--acu-rich-text-quote);
  font-family: var(--font-serif);
  font-size: var(--text-lg);
  padding: var(--space-2xs) 0 var(--space-2xs) var(--space-lg);
}

.acu-rich-text__content blockquote > :last-child {
  margin-bottom: 0;
}

.acu-rich-text__content hr {
  border: 0;
  border-top: 1px solid var(--acu-rich-text-rule);
  margin: var(--space-xl) 0;
}

.acu-rich-text__content code,
.acu-rich-text__content pre {
  background-color: var(--acu-rich-text-muted-surface);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.9em;
}

.acu-rich-text__content code {
  border-radius: var(--radius-sm);
  padding: 0.1em 0.35em;
}

.acu-rich-text__content pre {
  border-radius: var(--radius-md);
  overflow-x: auto;
  padding: var(--space-md);
}

.acu-rich-text__content pre code {
  background-color: transparent;
  padding: 0;
}

/* Embeds never overflow the column. */
.acu-rich-text__content iframe,
.acu-rich-text__content video,
.acu-rich-text__content embed,
.acu-rich-text__content object {
  max-width: 100%;
}

.acu-rich-text__content iframe {
  border: 0;
}

@media (min-width: 40rem) {
  .acu-rich-text__content .alignleft {
    float: left;
    margin: 0 var(--space-lg) var(--space-md) 0;
  }

  .acu-rich-text__content .alignright {
    float: right;
    margin: 0 0 var(--space-md) var(--space-lg);
  }
}

@media (max-width: 63.9375rem) {
  .acu-rich-text__inner {
    padding-inline: var(--space-lg);
  }
}

@media (max-width: 47.9375rem) {
  .acu-rich-text {
    padding-block: var(--space-3xl);
  }

  .acu-rich-text__heading {
    font-size: 2rem;
    margin-bottom: var(--space-lg);
  }

  /* Wide tables scroll inside the column instead of breaking the page. */
  .acu-rich-text__content table {
    display: block;
    overflow-x: auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  .acu-rich-text__content a {
    transition: none;
  }
}