@import url('https://cdn.jsdelivr.net/npm/lucide@latest/font/lucide.css'); /* Import Lucide Icons */

.callout[data-callout="trailhead"] { --callout-color: 188, 45, 190; --callout-icon: lucide-signpost-big; }
.callout[data-callout="quote"] { --callout-color: 118, 10, 169; --callout-icon: lucide-bird; }




/* Setting positioning of list-parents to relative to make ::before positioning work properly */
ul > li, ol > li {
  position: relative;
}

ol, ul {
  position: relative;
  padding-inline-start: 30px;
}

/* Actual definition of ::before-pseudo-elements with left border */
ol > li::before {
  content: "";
  position: absolute;
  height: calc(100% - 2em);
  top: 1.9em;
  margin-left: -15px;
  border-left: 1px solid white;
  opacity: .5;
}

ul > li::before {
  content: "";
  position: absolute;
  height: calc(100% - 2em);
  top: 1.9em;
  margin-left: -15px;
  border-left: 1px solid white;
  opacity: .25;
}

/* Some settings to fix certain alignment problems   */
/* works mostly without these but is not recommended */
p {
  margin-block-start: 0;
  margin-block-end: 0;
}

.markdown-preview-view.is-readable-line-width .markdown-preview-section, .markdown-source-view.is-readable-line-width .CodeMirror {
  line-height: 30px;
}

.theme-dark {
  --background-primary: #040404;
  --background-secondary: #100D13;
  --link-color: #C89AE8; 
  --link-color-hover: #FF3EB5; 
  --h1-color: #E8BDFA;
}

.theme-light {
  --background-primary: #ECE4FF;
  --background-secondary: #D9C9FF;
  --link-color: ; 
  --link-color-hover: ; 
}
strong {
  color: #A1FFA1 !important;
}

/* Also target the <b> tag for compatibility, though 'strong' is preferred */
b {
  color: #A1FFA1 !important;
}

.custom-like-wrapper {
  padding-bottom: 4em;
  overflow: visible;
}

.markdown-preview-sizer {
  overflow: visible !important;
  padding-bottom: 6em !important;
}