/* Public check marks: one of three colourways per page (purple, deep green or mint),
   set as --check-icon on <body> from check_icon(request.url.path). Use <span class="pub-check">. */
.pub-check {
  display: inline-block; flex: none; width: 1.375em; height: 1.375em; vertical-align: -0.3em;
  background: var(--check-icon, url("/images/ui-symbols/check-circle-mint.svg")) center / contain no-repeat;
}
/* Check marks drawn by page components take the same page colourway. */
/* The home page tour styles these with ID selectors, so this one needs !important. */
body .check-list li > svg { color: transparent !important; width: 20px !important; height: 20px !important; padding: 0 !important; box-sizing: border-box !important; flex: none; border-radius: 0 !important; background: var(--check-icon) center / contain no-repeat !important; }
body .home-main .hv2-checks li::before,
body .home-main .hv2-support .hv2-checks li::before { border: 0; border-radius: 0; background: var(--check-icon) center / contain no-repeat; }
body #pricing-preview .px-full-check { border-radius: 0; background: var(--check-icon) center / contain no-repeat; color: transparent; }
body #pricing-preview .px-full-check svg { visibility: hidden; }
/* The shared .check-mark tick (check-mark.css) takes the page colourway on public pages only. */
body[data-public-site] .check-mark { border-radius: 0; background: var(--check-icon) center / contain no-repeat; width: 1.375em; height: 1.375em; vertical-align: -0.3em; }
body[data-public-site] .check-mark::before { content: none; }
body #pricing-preview .pxc-list li::before,
body #pricing-preview :is(.pxc-free, .pxc-prime, .pxc-scale) .pxc-list li::before { -webkit-mask: none; mask: none; background: var(--check-icon) center / contain no-repeat; }

/* List bullets: one of two styles per public page, set as data-bullet on <body> by
   bullet_style(request.url.path): "square" = lime square with a navy edge, "dot" = purple dot.
   Applies to plain content lists in reading areas; styled lists (grids, chips, checklists) keep their own look. */
body[data-bullet] :is(.pr-reading, .ras-article, .publication-prose, .rc-prose, .ha-body, .legal-prose, .city-prose, .mk-page .mk-copy) ul:where(:not([class]), .ras-bullets, .ras-sublist) {
  list-style: none; padding-left: 0;
}
body[data-bullet] :is(.pr-reading, .ras-article, .publication-prose, .rc-prose, .ha-body, .legal-prose, .city-prose, .mk-page .mk-copy) ul:where(:not([class]), .ras-bullets, .ras-sublist) > li {
  position: relative; padding-left: 26px; list-style: none;
}
body[data-bullet] :is(.pr-reading, .ras-article, .publication-prose, .rc-prose, .ha-body, .legal-prose, .city-prose, .mk-page .mk-copy) ul:where(:not([class]), .ras-bullets, .ras-sublist) > li::before {
  content: ""; position: absolute; left: 6px; top: 0.85em; transform: translateY(-50%);
}
body[data-bullet="square"] :is(.pr-reading, .ras-article, .publication-prose, .rc-prose, .ha-body, .legal-prose, .city-prose, .mk-page .mk-copy) ul:where(:not([class]), .ras-bullets, .ras-sublist) > li::before {
  width: 9px; height: 9px; border-radius: 2px; background: #D1F48C; box-shadow: inset 0 0 0 1.5px #042238;
}
body[data-bullet="dot"] :is(.pr-reading, .ras-article, .publication-prose, .rc-prose, .ha-body, .legal-prose, .city-prose, .mk-page .mk-copy) ul:where(:not([class]), .ras-bullets, .ras-sublist) > li::before {
  width: 8px; height: 8px; border-radius: 50%; background: #6B48E0;
}
