/* KRB newsletter rich text overrides
   Checked against:
   - Webflow staging: https://krb-rebuild.webflow.io/newsletters/welcome-to-2024-at-krb
   - Live WP page:    https://www.krb.nsw.edu.au/newsletter/welcome-to-2024-at-krb/

   Notes:
   - Uses descendant selectors so it still works if the CMS/rich-text content is nested in an extra wrapper div.
   - h2 is being used as the old WP section label style, e.g. WELCOME / IMPORTANT INFORMATION FOR 2024.
   - h3 is being used as the old WP article title style, e.g. Key Dates for Term 1 / HSC Results.
   - Heading properties use !important to beat the earlier equal-specificity snippet already on staging.
*/

.newsletter_rich-text.w-richtext,
.newsletter_rich-text.w-richtext > div {
  color: #1a1515;
  font-family: var(--_text-base---font--body);
  font-size: 1rem;
  line-height: 1.5;
  font-weight: 400;
}

.newsletter_rich-text.w-richtext * {
  box-sizing: border-box;
}

.newsletter_rich-text.w-richtext > *:first-child,
.newsletter_rich-text.w-richtext > div > *:first-child {
  margin-top: 0;
}

.newsletter_rich-text.w-richtext > *:last-child,
.newsletter_rich-text.w-richtext > div > *:last-child {
  margin-bottom: 0;
}

.newsletter_rich-text.w-richtext p {
  margin-top: 0;
  margin-bottom: 1rem;
  color: #1a1515;
  font-family: var(--_text-base---font--body);
  font-size: 1rem;
  line-height: 1.5;
  font-weight: 400;
}

.newsletter_rich-text.w-richtext a {
  color: var(--_theme---link, var(--_color---red));
  font-weight: inherit;
  text-decoration: underline !important;
}

.newsletter_rich-text.w-richtext a:hover,
.newsletter_rich-text.w-richtext a:focus-visible {
  color: var(--_theme---link, var(--_color---red));
  text-decoration: underline !important;
}

.newsletter_rich-text.w-richtext strong,
.newsletter_rich-text.w-richtext b {
  font-weight: 700;
}

.newsletter_rich-text.w-richtext em,
.newsletter_rich-text.w-richtext i {
  font-style: italic;
}

/* WP .section-title style */
.newsletter_rich-text.w-richtext h2 {
  margin-top: 1rem !important;
  margin-bottom: 1rem !important;
  color: #1a1515 !important;
  font-family: var(--_text-base---font--body) !important;
  font-size: 1.5rem !important;
  line-height: 1.8 !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-transform: uppercase !important;
}

/* WP .newsletter-article__title style */
.newsletter_rich-text.w-richtext h3 {
  margin-top: 0 !important;
  margin-bottom: 1.25rem !important;
  color: #1a1515 !important;
  font-family: var(--_text-base---font--heading) !important;
  font-size: 2.5rem !important;
  line-height: 1.2 !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

.newsletter_rich-text.w-richtext h4 {
  margin-top: 0 !important;
  margin-bottom: 1.125rem !important;
  color: #1a1515 !important;
  font-family: var(--_text-base---font--heading) !important;
  font-size: 1.875rem !important;
  line-height: 1.2 !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

.newsletter_rich-text.w-richtext h5,
.newsletter_rich-text.w-richtext h6 {
  margin-top: 1rem !important;
  margin-bottom: 1rem !important;
  color: #1a1515 !important;
  font-family: var(--_text-base---font--body) !important;
  font-size: 1.5rem !important;
  line-height: 1.8 !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-transform: uppercase !important;
}

.newsletter_rich-text.w-richtext p + h2,
.newsletter_rich-text.w-richtext ul + h2,
.newsletter_rich-text.w-richtext ol + h2,
.newsletter_rich-text.w-richtext figure + h2,
.newsletter_rich-text.w-richtext iframe + h2,
.newsletter_rich-text.w-richtext div + h2 {
  margin-top: 3rem !important;
}

.newsletter_rich-text.w-richtext p + h3,
.newsletter_rich-text.w-richtext ul + h3,
.newsletter_rich-text.w-richtext ol + h3,
.newsletter_rich-text.w-richtext figure + h3,
.newsletter_rich-text.w-richtext iframe + h3,
.newsletter_rich-text.w-richtext div + h3 {
  margin-top: 2rem !important;
}

.newsletter_rich-text.w-richtext ul,
.newsletter_rich-text.w-richtext ol {
  margin-top: 0;
  margin-bottom: 1rem;
  padding-left: 2.5rem;
  color: #1a1515;
  font-family: var(--_text-base---font--body);
  font-size: 1rem;
  line-height: 1.5;
  font-weight: 400;
}

.newsletter_rich-text.w-richtext li {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-left: 0 !important;
}

.newsletter_rich-text.w-richtext ul {
  list-style-type: disc;
}

.newsletter_rich-text.w-richtext ol {
  list-style-type: decimal;
}

.newsletter_rich-text.w-richtext figure {
  margin: 1.5rem 0;
}

.newsletter_rich-text.w-richtext img {
  display: block;
  max-width: 100%;
  height: auto;
}

.newsletter_rich-text.w-richtext figcaption {
  margin-top: 0.5rem;
  color: #1a1515;
  font-family: var(--_text-base---font--body);
  font-size: 0.875rem;
  line-height: 1.4;
}

.newsletter_rich-text.w-richtext blockquote {
  margin: 1.5rem 0;
  padding: 0 0 0 1.5rem;
  border-left: 0.125rem solid var(--_theme---link, var(--_color---red));
  color: #1a1515;
  font-family: var(--_text-base---font--heading);
  font-size: 1.5rem;
  line-height: 1.4;
  font-weight: 400;
}

.newsletter_rich-text.w-richtext table {
  width: 100%;
  margin: 1.5rem 0;
  border-collapse: collapse;
  color: #1a1515;
  font-family: var(--_text-base---font--body);
  font-size: 1rem;
  line-height: 1.5;
}

.newsletter_rich-text.w-richtext th,
.newsletter_rich-text.w-richtext td {
  padding: 0.5rem;
  border: 0.0625rem solid rgba(26, 21, 21, 0.2);
  text-align: left;
  vertical-align: top;
}

.newsletter_rich-text.w-richtext th {
  font-weight: 700;
}

@media screen and (max-width: 767px) {
  .newsletter_rich-text.w-richtext h2,
  .newsletter_rich-text.w-richtext h5,
  .newsletter_rich-text.w-richtext h6 {
    font-size: 1.25rem !important;
    line-height: 1.6 !important;
  }

  .newsletter_rich-text.w-richtext h3 {
    font-size: 2rem !important;
    line-height: 1.2 !important;
  }

  .newsletter_rich-text.w-richtext h4 {
    font-size: 1.5rem !important;
    line-height: 1.25 !important;
  }
}
