/* Rich text comes from the editor, so these styles also cover nested blocks. */

.c-content {
  display: flow-root;
  font-size: 1rem;
  min-width: 0;
  line-height: 1.5;
  text-align: justify;
  overflow-wrap: anywhere;

  @media (1024px < width) {
    font-size: 1rem;
  }
}

.c-content > p:not(:first-child) {
  /* margin-block-start: 0.5rem; */

  @media (1024px < width) {
    margin-block-start: 0.75rem;
  }
}

.c-content > h2:not(:first-child) {
  margin-block-start: 1.5rem;

  @media (1024px < width) {
    margin-block-start: 1.5rem;
  }
}

.c-content > h3:not(:first-child) {
  margin-block-start: 1.25rem;

  @media (1024px < width) {
    margin-block-start: 1.25rem;
  }
}

.c-content > h4:not(:first-child) {
  margin-block-start: 1.125rem;

  @media (1024px < width) {
    margin-block-start: 1.125rem;
  }
}

.c-content > :where(h1, h2, h3, h4, h5, h6) {
  font-weight: 700;
}

.c-content > h2 {
  font-size: 1.25rem;

  @media (1024px < width) {
    font-size: 1.5rem;
  }
}

.c-content > h3 {
  font-size: 1.125rem;

  @media (1024px < width) {
    font-size: 1.25rem;
  }
}

.c-content > h4 {
  font-size: 1.0625rem;

  @media (1024px < width) {
    font-size: 1.125rem;
  }
}

.c-content > figure,
.c-content > div figure,
.c-content > figure img,
.c-content > img,
.c-content > p img,
.c-content > div:not(.o-shortcode) img {
  width: 100%;
  max-width: 100%;
  border-radius: 0.5rem;
  overflow: hidden;

  @media (1024px < width) {
    border-radius: 0.75rem;
  }
}

.c-content > figure,
.c-content > img,
.c-content > p img,
.c-content > div:not(.o-shortcode) img {
  margin-block-start: 1.5rem;

  @media (1024px < width) {
    margin-block-start: 0.75rem;
  }
}

.c-content > figure figcaption,
.c-content > div figure figcaption {
  text-align: center;
  font-style: italic;
  margin-block-start: 0.5rem;
  font-size: 1rem;

  @media (1024px < width) {
    margin-block-start: 0.75rem;
    font-size: 1rem;
  }
}

.c-content > ul,
.c-content > ul li, 
.c-content > ol li {
  margin: 0;
}

.c-content > ul, 
.c-content > ol {
  display: flex;
  flex-direction: column;
  list-style-type: disc;
  margin-inline-start: 1.5rem;
  margin-block-start: 0.5rem;

  @media (1024px < width) {
    margin-block-start: 0.5rem;
  }
}

.c-content > ul li:not(:first-child), 
.c-content > ol li:not(:first-child) {
  /* margin-block-start: 0.375rem;

  @media (1024px < width) {
    margin-block-start: 0.5rem;
  } */
}

.c-content #ez-toc-container {
  width: 100% !important;
  border: 1px solid var(--color-neutral-primary-500) !important;
  border-radius: 0.75rem !important;
  padding: 1rem !important;
  background-color: var(--color-neutral-primary-100) !important;
  position: relative !important;
  margin-block-start: 1.5rem;

  @media (1024px < width) {
    margin-block-start: 1.5rem;
    padding: 1.5rem !important;
  }
}

.c-content #ez-toc-container .ez-toc-title {
  color: var(--color-primary-100) !important;
  font-weight: 700 !important;
  position: relative !important;
  margin-inline-start: 34px !important;
  font-size: 1rem !important;

  @media (1024px < width) {
    font-size: 1rem !important;
  }
}

.c-content #ez-toc-container .ez-toc-cssicon-toggle-label {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  position: absolute !important;
  right: 16px !important;
  top: 20px !important;
  width: 20px !important;
  height: 20px !important;

  @media (1024px < width) {
    right: 24px !important;
    top: 24px !important;
    width: 24px;
    height: 24px;
  }
}

.c-content #ez-toc-container .ez-toc-title::before {
  content: '';
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 5H20' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' stroke='%231D36B6'/%3E%3Cpath d='M4 12H20' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' stroke='%231D36B6'/%3E%3Cpath d='M4 19H20' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' stroke='%231D36B6'/%3E%3C/svg%3E%0A");
  background-size: 20px 20px;
  width: 20px;
  height: 20px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%) translateX(-34px);

  @media (1024px < width) {
    background-size: 24px 24px;
    width: 24px;
    height: 24px;
  }
}

.c-content #ez-toc-container .ez-toc-cssicon {
  display: flex !important;
  position: relative;
  left: 0 !important;
  border: none !important;
  width: 20px !important;
  height: 20px !important;

  @media (1024px < width) {
    width: 24px !important;
    height: 24px !important;
  }
}

.c-content #ez-toc-container .ez-toc-cssicon .ez-toc-icon-toggle-span {
  margin: 0 !important;
  opacity: 0;
  width: 20px !important;
  height: 20px !important;

  @media (1024px < width) {
    width: 24px !important;
    height: 24px !important;
  }
}

.c-content #ez-toc-container .ez-toc-cssicon::before {
  content: '';
  background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11.9138 15.8512L18.6563 8.93249L17.85 8.14874L11.925 14.2275L6.16125 8.15249L5.34375 8.92874L11.9138 15.8512Z' fill='%230A1931'/%3E%3C/svg%3E%0A");
  background-size: 20px 20px;
  width: 20px;
  height: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);

  @media (1024px < width) {
    background-size: 24px 24px;
    width: 24px !important;
    height: 24px !important;
  }
}

.c-content #ez-toc-container nav {
  margin-block-start: 0.75rem !important;

  @media (1024px < width) {
    margin-block-start: 1rem !important;
  }
}

.c-content #ez-toc-container nav .ez-toc-list {
  display: flex !important;
  flex-direction: column !important;
  row-gap: 0.5rem !important;

  @media (1024px < width) {
    font-size: 0.75rem !important;
  }
}

.c-content #ez-toc-container nav .ez-toc-list .ez-toc-link {
  font-weight: 700 !important;
  line-height: 1.5 !important;
  font-size: 1rem !important;

  @media (1024px < width) {
    font-size: 1rem !important;
  }
}