/* BOOKMARKS - LIGHT */
body {
  background-color: var(--color-remedy-green-light);
}
body .page-header-excerpt {
  background-color: #6B7A60;
}
body .page-header-excerpt p {
  color: var(--color-grey-light);
}
body .page-header-title h1 {
  color: var(--color-white);
}
body .page-header-title i {
  color: var(--color-grey-light);
}
body .section-header h5 {
  color: var(--color-white);
}
body .remedy-category {
  break-inside: avoid;
  display: flex;
  font-family: "Courier Prime", monospace;
  flex-direction: column;
  padding: 36px 0;
}
body .remedy-category a {
  padding: 4px 0 4px 12px;
}
body .remedy-category h1 {
  position: sticky !important;
  top: 0 !important;
}
body .remedy-glossary {
  display: flex;
  flex-wrap: wrap;
  margin: 12px 0 72px;
}
body .remedy-glossary a {
  background: none;
  border: 3px solid var(--color-yellow);
  border-radius: 8px 0 8px 0;
  color: var(--color-yellow);
  font-family: "Cutive Mono", monospace;
  font-size: var(--font-l);
  font-weight: 900;
  padding: 12px;
  margin: 4px;
}
body .remedy-glossary a:hover {
  animation: blinker 1s linear infinite;
  background: var(--color-yellow);
  border: 3px solid var(--color-yellow);
  border-radius: 8px 0 8px 0;
  color: var(--color-remedy-green-light);
}
body .remedy-list {
  color: var(--color-remedy-green-dark);
  padding: 0 44px;
}
body .remedy-list-item {
  margin: 0 0 24px;
}
body .remedy-list-item p {
  border: 2px solid var(--color-remedy-green-medium);
  border-radius: 12px;
  display: inline-block;
  margin: 12px 0;
  padding: 4px 24px;
}
body .remedy-list-title {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 16px;
}
body .remedy-list-title h3 {
  font-weight: 900;
  padding: 12px 0;
}
body .remedy-section-title {
  align-items: center;
  display: flex;
  flex-direction: row;
}
body .remedy-section-title h2 {
  color: var(--color-white);
  font-size: var(--font-xl);
  padding: 24px 16px 24px 0;
  text-transform: uppercase;
}
body .remedy-section-subtitle {
  color: var(--color-grey-light);
  font-size: var(--font-m);
  font-style: italic;
  line-height: 1.4rem;
  margin: 0 0 24px 44px;
  text-shadow: var(--text-shadow-3);
}
body .remedy-section {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 0%;
  padding: 36px 0 0;
}
body .remedy-section h3 {
  color: var(--color-grey-light);
  font-size: var(--font-l);
}
body .remedy-section a:hover {
  color: #fff;
  animation: blinker 1s linear infinite;
}
body .remedy-section span {
  opacity: 0.29;
}
body .remedy-tag {
  background-color: #6B7A60;
  border-radius: 3px;
  color: var(--color-grey-light);
  cursor: pointer;
  display: inline-block;
  letter-spacing: 0;
  margin: 16px 16px 16px 0;
  opacity: 0.8;
  padding: 4px 12px;
}
body .remedy-tag:hover {
  opacity: 1;
}
body .remedy-title {
  color: var(--color-yellow);
}
body .remedy-title h1 {
  font-size: var(--font-xl);
  font-weight: 900;
  padding: 4px 0;
  text-decoration: underline;
}
body .remedy-title p {
  color: var(--color-remedy-green-medium);
  font-size: var(--font-l);
  text-shadow: var(--text-shadow-3);
}
body .bookmark-old a {
  color: var(--color-grey-light);
  text-decoration: line-through;
}
body .bookmark-old a:hover {
  animation: blinker 1s linear infinite;
  opacity: 0.5;
}

/* BOOKMARKS - DARK */
body.dark-mode {
  background-color: var(--color-remedy-green-dark);
}
body.dark-mode .page-header-excerpt {
  background: #343A2F;
}
body.dark-mode .page-header-excerpt p {
  color: var(--color-grey-light);
}
body.dark-mode .page-header-title i {
  color: var(--color-remedy-green-light);
}
body.dark-mode .remedy h2 {
  color: var(--color-remedy-green-light);
}
body.dark-mode .remedy p {
  color: var(--color-remedy-green-light);
}
body.dark-mode .remedy-list {
  color: var(--color-grey-light);
}
body.dark-mode .remedy-tag {
  background-color: var(--color-remedy-green-light);
}
body.dark-mode .remedy-title p {
  color: var(--color-remedy-green-light);
}
