/* Application-specific styles that supplement Tailwind CSS.
   Brand palette tokens and font configuration live in app/assets/tailwind/application.css. */

/* Hide the native <details> triangle from summary elements used as icon buttons. */
details > summary { list-style: none; }
details > summary::-webkit-details-marker { display: none; }

/* Glossary term trigger — inline button produced by GlossaryHighlighter. */
.glossary-term {
  display: inline;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-decoration: underline;
  text-decoration-style: dotted;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
  cursor: help;
}

.glossary-term:focus-visible {
  outline: 2px solid var(--color-imasus-dark-green, #1F3D3F);
  outline-offset: 2px;
  border-radius: 2px;
}

/* Popover surface positioned by the GlossaryPopoverController. */
.glossary-popover {
  max-width: 22rem;
  padding: 1rem;
  border-radius: 0.5rem;
  background: #ffffff;
  color: #1F3D3F;
  box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.15), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  border: 1px solid rgb(31 61 63 / 0.1);
}

.glossary-popover__term {
  margin: 0;
  font-size: 1rem;
  font-weight: 600;
}

.glossary-popover__definition {
  margin: 0.5rem 0 0.75rem;
  font-size: 0.875rem;
  line-height: 1.5;
  color: rgb(31 61 63 / 0.85);
}

.glossary-popover__link {
  display: inline-block;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #1F3D3F;
  text-decoration: underline;
}

/* Action Text rendered output and the Trix editor's editable area —
   both share the .trix-content class. Tailwind's preflight resets
   list-style and heading margins, which strips the visual rhythm
   that authors see in the toolbar (numbered lists with no numbers,
   headings flush against paragraphs). These rules restore typographic
   defaults inside .trix-content without affecting the rest of the app. */
.trix-content {
  color: var(--color-imasus-dark-green, #1F3D3F);
  line-height: 1.65;
}
.trix-content > * + * { margin-top: 1rem; }
.trix-content h1 {
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.2;
  margin-top: 2rem;
}
.trix-content h2 {
  font-size: 1.375rem;
  font-weight: 700;
  line-height: 1.3;
  margin-top: 2rem;
}
.trix-content h3 {
  font-size: 1.125rem;
  font-weight: 700;
  line-height: 1.35;
  margin-top: 1.5rem;
}
.trix-content h1:first-child,
.trix-content h2:first-child,
.trix-content h3:first-child { margin-top: 0; }

.trix-content ul,
.trix-content ol {
  padding-left: 1.5rem;
}
.trix-content ul { list-style: disc; }
.trix-content ol { list-style: decimal; }
.trix-content li + li { margin-top: 0.25rem; }
.trix-content li > ul,
.trix-content li > ol { margin-top: 0.25rem; }

.trix-content blockquote {
  border-left: 3px solid rgb(31 61 63 / 0.2);
  padding-left: 1rem;
  font-style: italic;
  color: rgb(31 61 63 / 0.75);
}

.trix-content a {
  color: var(--color-imasus-red, #FA3449);
  text-decoration: underline;
}

.trix-content strong { font-weight: 700; }
.trix-content em { font-style: italic; }
