/*
 * checklist-static.css — Font Awesome checklist (.sb-checklist)
 * Loaded separately from Tailwind to preserve \f00c escape.
 *
 * Must override:
 *  - Tailwind Typography .prose ul/li ::marker styles
 *  - Theme's content.css / prose.css red-dot ::before with position: absolute
 *  - Theme's li position: relative + padding-left: 1.25rem
 */

.sb-checklist,
.prose .sb-checklist,
.entry-content .sb-checklist {
  list-style: none !important;
  padding-left: 0 !important;
  padding-inline-start: 0 !important;
  color: inherit;
}

.sb-checklist > li,
.prose .sb-checklist > li,
.entry-content .sb-checklist > li,
.prose :where(ul).sb-checklist > li,
.entry-content :where(ul).sb-checklist > li {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  gap: 0.5rem !important;
  padding: 0.375rem 0 !important;
  padding-left: 0 !important;
  padding-inline-start: 0 !important;
  position: static !important;
  color: inherit !important;
}

/* Kill the ::marker */
.sb-checklist > li::marker,
.prose .sb-checklist > li::marker {
  content: none !important;
  display: none !important;
}

/* Checkmark icon — must override the red-dot ::before */
.sb-checklist > li::before,
.prose .sb-checklist > li::before,
.entry-content .sb-checklist > li::before,
.prose :where(ul).sb-checklist > li::before,
.entry-content :where(ul).sb-checklist > li::before {
  content: "\f00c" !important;
  font-family: 'Font Awesome 5 Pro' !important;
  font-weight: 400 !important;
  font-size: 0.85em !important;
  line-height: inherit !important;
  flex-shrink: 0 !important;
  display: inline-block !important;
  width: auto !important;
  height: auto !important;
  background: none !important;
  background-color: transparent !important;
  position: static !important;
  top: auto !important;
  left: auto !important;
  margin: 0.2em 0 0 0 !important;
  color: inherit;
}

/* Links inherit text color */
.sb-checklist a {
  color: inherit !important;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.sb-checklist a:hover {
  opacity: 0.8;
}
