/* Dysautonomiboken - anpassningar av MkDocs Material
 *
 * Prioriteringar:
 *  1. WCAG AAA-kontrast
 *  2. Läsbarhet för brain fog / trötthet
 *  3. Utskriftsvänlighet
 *  4. Reducerad motion-respekt
 */

/* Variabler för konsekvent kontrast och färg */
:root {
  --dys-reading-max-width: 70ch;
  --dys-line-height: 1.7;
}

/* Brödtext - bättre läsbarhet */
.md-typeset {
  font-size: 0.82rem;
  line-height: var(--dys-line-height);
}

.md-typeset p,
.md-typeset li {
  max-width: var(--dys-reading-max-width);
}

/* Rubriker med tydligare hierarki */
.md-typeset h1 {
  font-weight: 700;
  letter-spacing: -0.01em;
}

.md-typeset h2 {
  font-weight: 600;
  margin-top: 2.5em;
  padding-top: 0.5em;
  border-top: 1px solid var(--md-default-fg-color--lightest);
}

.md-typeset h3 {
  font-weight: 600;
  margin-top: 1.8em;
}

/* Startsidans tagline */
.tagline {
  font-size: 1.15rem;
  color: var(--md-default-fg-color--light);
  margin-top: -0.8em;
  margin-bottom: 2em;
}

/* Grid cards på startsidan - bättre kontrast i hover */
.md-typeset .grid.cards > ul > li:hover,
.md-typeset .grid.cards > .card:hover {
  border-color: var(--md-accent-fg-color);
}

/* Evidensnivå-etiketter - tydlig visuell markering */
.md-typeset code {
  padding: 0.1em 0.4em;
  font-weight: 500;
}

/* Specialbehandling av [ETABLERAD], [OFF-LABEL VANLIG], etc
 * Dessa renderas som <code>-taggar av markdown-parsern.
 * Använder attribute selector för exakt matchning. */
.md-typeset :is(code, kbd):is(
    :has-text("[ETABLERAD]"),
    :has-text("[OFF-LABEL VANLIG]"),
    :has-text("[EXPERIMENTELL]"),
    :has-text("[SPEKULATIV]")
) {
  font-weight: 600;
}

/* Patient-ruta - admonition-variant för patientinriktat innehåll */
.md-typeset .admonition.patient,
.md-typeset details.patient {
  border-color: var(--md-accent-fg-color);
}

.md-typeset .patient > .admonition-title,
.md-typeset .patient > summary {
  background-color: color-mix(in srgb, var(--md-accent-fg-color) 12%, transparent);
}

.md-typeset .patient > .admonition-title::before,
.md-typeset .patient > summary::before {
  background-color: var(--md-accent-fg-color);
  -webkit-mask-image: var(--md-admonition-icon--note);
  mask-image: var(--md-admonition-icon--note);
}

/* Tabeller - bättre läsbarhet på mobil */
.md-typeset table:not([class]) {
  font-size: 0.78rem;
}

.md-typeset table:not([class]) th {
  background-color: var(--md-default-fg-color--lightest);
  font-weight: 600;
}

/* Länkar - tydligare fokus för tangentbordsnavigation */
.md-typeset a:focus-visible {
  outline: 2px solid var(--md-accent-fg-color);
  outline-offset: 2px;
  border-radius: 2px;
}

/* Respektera prefers-reduced-motion */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* Utskrift - dölj navigation, maximera läsbarhet */
@media print {
  .md-header,
  .md-tabs,
  .md-sidebar,
  .md-footer,
  .md-content__button {
    display: none !important;
  }

  .md-content {
    margin: 0 !important;
  }

  .md-typeset {
    font-size: 11pt;
    line-height: 1.5;
  }

  .md-typeset a {
    color: #000 !important;
    text-decoration: underline;
  }

  .md-typeset h1 {
    page-break-before: auto;
  }

  .md-typeset h2 {
    page-break-after: avoid;
  }

  /* Skriv ut länk-URL:er i parenteser */
  .md-typeset a[href^="http"]::after {
    content: " (" attr(href) ")";
    font-size: 0.85em;
    color: #555;
  }
}

/* Hero-sektion på startsidan - lite mer luft */
.md-content__inner > h1:first-child {
  margin-top: 0.5em;
}

/* "Senast uppdaterad"-information - diskret */
.md-source-file {
  font-size: 0.7rem;
  color: var(--md-default-fg-color--light);
}
