.myfooter {
  color: darkgray;
  padding-top: 1em;
  font-size: 60%;
}

li > br {
  margin-bottom: 0.2rem !important;
}

/* Allow PRE tags to scroll like .code blocks */
.sl-markdown-content > pre {
  overflow: scroll;
}

/* But make them wrap if requested */
.sl-markdown-content > pre.wrap {
  text-wrap: wrap;
  overflow: visible;
  padding-left: 3em !important;
  text-indent: -2em !important;
  background-color: var(--sl-color-gray-7);
}

:root {
  --sl-text-code: 0.8rem;
}

.starlight-aside {
  margin-top: 2em !important;
}

.ec-line .code {
  text-indent: -1em !important;
  padding-left: 2em !important;
  text-wrap: wrap;
  word-break: break-word;
}

.comentario-root {
  margin-top: 5em;
}

/* Neutralize Starlight’s default styling */
details.collapsible {
  all: unset;
  display: block; /* restore block behavior */
  margin-top: 1.5rem;
  margin-bottom: 1em;
}

/* Style the summary like a button */
details.collapsible summary {
  all: unset;
  cursor: pointer;
  display: flex;
  align-items: center;
  padding: 0.5rem 1rem;
  border: 1px solid var(--sl-color-gray-5);
  border-radius: 0.5rem;
  background: var(--sl-color-accent-low);
  font-weight: 500;
}

details[open].collapsible {
  background-color: var(--sl-color-accent-low);
  border-radius: 0.5rem;
  border-left: 1px solid var(--sl-color-gray-5);
  border-right: 1px solid var(--sl-color-gray-5);
  border-bottom: 1px solid var(--sl-color-gray-5);
}

/* Make bottom border disappear when details are opened */
details[open].collapsible summary {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom: none;
  margin-bottom: 1.5rem;
}

/* Collapsible content */
details.collapsible > *:not(summary) {
  margin-bottom: 1rem;
  /* background: var(--sl-color-accent-low); */
  margin: 0 1rem 1rem 1rem;
}
