/* =========================================================
   _math-extras.css — stile MathJax (SVG) per Quarto
   Obiettivi:
   - più respiro verticale per display math
   - niente tagli di glifi alti / accollature
   - colore ereditato dal testo (look editoriale)
   - resa migliore del \boldsymbol e dei mathvariant=bold
   - buona leggibilità in dark mode
   - piccoli aggiustamenti responsive
   ========================================================= */

/* ---------- Spaziatura e layout di base ---------- */

/* Display math: più respiro verticale */
mjx-container[jax="SVG"][display="true"] {
  margin: 1.1em 0 !important; /* leggermente più di 1em, per arieggiare */
}

/* Inline math: integra il ritmo del testo senza “saltare” la riga */
mjx-container[jax="SVG"]:not([display="true"]) {
  margin: 0 0.08em; /* micro-spazio laterale per evitare collisioni con la punteggiatura */
  line-height: 1;   /* evita eccessi di altezza di riga */
}

/* Evita tagli dei glifi (ascendenti/descendenti, accollature) */
mjx-container[jax="SVG"] svg {
  overflow: visible !important;
}

/* Allinea con la colonna e il tono del testo */
mjx-container[jax="SVG"] {
  color: inherit;     /* il colore segue il testo circostante */
  vertical-align: baseline;
}

/* Quando MathJax forza display inline-block, manteniamo l’allineamento */
mjx-container[jax="SVG"][display="true"] {
  display: block;
}

/* ---------- Bold rafforzato (\boldsymbol, \mathbf, ecc.) ---------- */

/* MathJax (SVG) mappa il bold su un mathvariant: rafforziamo il peso */
mjx-mi[mathvariant="bold"],
mjx-mn[mathvariant="bold"],
mjx-mo[mathvariant="bold"],
mjx-mtext[mathvariant="bold"] {
  font-weight: 700 !important;
}

/* Alcuni token bold vengono wrappati in <mjx-b> */
mjx-b {
  font-weight: 700 !important;
}

/* Anche i gruppi “tecnici” possono ricevere l’attributo mathvariant */
[glyph-orientation-vertical] mjx-mi[mathvariant="bold"],
[glyph-orientation-vertical] mjx-mn[mathvariant="bold"],
[glyph-orientation-vertical] mjx-mo[mathvariant="bold"] {
  font-weight: 700 !important;
}

/* ---------- Dimensioni e leggibilità ---------- */

/* Leggero upscaling della math inline su schermi piccoli per leggibilità */
@media (max-width: 640px) {
  mjx-container[jax="SVG"]:not([display="true"]) {
    font-size: 1.02em;
  }
}

/* Evita che le equazioni superino la colonna: consenti wrapping del container */
mjx-container[jax="SVG"][display="true"] {
  overflow-x: auto;           /* se davvero troppo larga, consenti scroll orizzontale */
  overflow-y: visible;
  -webkit-overflow-scrolling: touch;
}

/* ---------- Numerazione delle equazioni (quando attiva in MathJax) ---------- */

/* Allinea il numero vicino al margine destro senza “staccarlo” visivamente */
mjx-container[jax="SVG"][display="true"] .mjx-eqn {
  color: inherit;
  opacity: 0.85;              /* leggero tono più tenue del corpo equazione */
  padding-left: 0.5em;
}

/* ---------- Integrazione con blocchi di codice/figure ---------- */

/* Evita collisioni con figcaption o code caption */
.figure mjx-container[jax="SVG"][display="true"],
.panel-tabset mjx-container[jax="SVG"][display="true"] {
  margin-top: 0.9em !important;
  margin-bottom: 1.1em !important;
}

/* Nei callout minimal, non “soffocare” la math */
.callout .callout-body mjx-container[jax="SVG"][display="true"] {
  margin: 1em 0 !important;
}

/* ---------- Dark mode ---------- */

/* In dark mode, la math segue il colore del testo (già inherit) 
   ma riduciamo l’opacità dei numeri per non “staccare” troppo */
@media (prefers-color-scheme: dark) {
  mjx-container[jax="SVG"] {
    color: inherit;
  }
  mjx-container[jax="SVG"][display="true"] .mjx-eqn {
    opacity: 0.75;
  }
}

/* ---------- Micro-ritocchi tipografici ---------- */

/* Evita che apici/sottoscritti comprimano la riga circostante in inline math */
mjx-container[jax="SVG"] mjx-msubsup,
mjx-container[jax="SVG"] mjx-msub,
mjx-container[jax="SVG"] mjx-msup {
  line-height: 0;
}

/* Spazio appena maggiore attorno a frazioni inline per respirare */
mjx-container[jax="SVG"] mjx-mfrac {
  margin: 0 0.02em;
}

/* Mantieni coerente lo spessore delle linee (frazioni, radicali) in alta densità pixel */
mjx-container[jax="SVG"] path {
  shape-rendering: geometricPrecision;
}

/* ---------- Compatibilità “difensiva” ---------- */

/* Se per qualsiasi motivo MathJax passasse a CHTML, non applichiamo regole SVG */
mjx-container[jax="CHTML"] {
  /* Intenzionalmente vuoto: evita sovrascritture indesiderate */
}

/* Numero equazione appena più distante e tenue */
mjx-container[jax="SVG"][display="true"] .mjx-eqn {
  padding-left: 0.75em;
  opacity: 0.72;
}

/* Equazioni molto larghe: non uscire dalla colonna */
mjx-container[jax="SVG"][display="true"] {
  max-width: 100%;
}

/* Schermi molto piccoli: riduci leggermente il display math */
@media (max-width: 420px) {
  mjx-container[jax="SVG"][display="true"] { font-size: 0.98em; }
}


/* _math-extras.css - integrazioni */

/* Matematica che respira con il testo */
mjx-container[jax="SVG"] {
  font-family: "ETBook", "EB Garamond", serif !important;
}

/* Display math più "libresca" */
mjx-container[jax="SVG"][display="true"] {
  margin: 1.618rem 0;
  padding: 0.5rem 0;
  position: relative;
}

/* Sottile ombreggiatura per le formule importanti */
mjx-container[jax="SVG"][display="true"]:hover {
  background: color-mix(in srgb, currentColor 3%, transparent);
  border-radius: 3px;
  transition: background 0.3s ease;
}


/* Claude */

mjx-container[jax="SVG"] {
  font-family: "Palatino", "TeX Gyre Pagella", serif;
}

.important-equation mjx-container[jax="SVG"][display="true"]::before {
  content: "⁂";
  position: absolute;
  top: -0.5rem;
  left: 50%;
  transform: translateX(-50%);
}