:root {
  --md-primary-fg-color: #16324A;
  --md-primary-fg-color--dark: #0e2233;
  --md-accent-fg-color: #0E7490;
}
[data-md-color-scheme="slate"] {
  --md-primary-fg-color: #0E7490;
  --md-accent-fg-color: #4dd0e1;
}

/* ---------------------------------------------------------------- respiro */
/* Le pagine del corso sono lunghe: qui si allarga l'interlinea e si stacca
   ogni sezione da quella precedente, perche' la pagina non risulti densa. */
.md-typeset {
  line-height: 1.68;
}
.md-typeset h2 {
  margin-top: 2.6em;
  border-bottom: 2px solid #0E749033;
  padding-bottom: .2em;
}
.md-typeset h3 {
  margin-top: 1.9em;
}
.md-typeset h1 {
  color: var(--md-primary-fg-color);
  font-weight: 700;
  margin-bottom: .6em;
}
[data-md-color-scheme="slate"] .md-typeset h1 { color: #7fd4e4; }

/* ------------------------------------------------- modelli e formule lunghe */
/* I modelli dell'istanza hanno una colonna per variabile: su schermo stretto
   scorrono in orizzontale invece di sbordare dalla pagina. */
.md-typeset mjx-container[display="true"] {
  overflow-x: auto;
  overflow-y: hidden;
  max-width: 100%;
  padding: 0.55em 0.1em;
  margin: 1.35em 0;
  scrollbar-width: thin;
}
.md-typeset mjx-container[display="true"]::-webkit-scrollbar { height: 6px; }
.md-typeset mjx-container[display="true"]::-webkit-scrollbar-thumb {
  background: #0E749055;
  border-radius: 3px;
}

/* --------------------------------------------------------------- schede */
.md-typeset .grid.cards > ul > li {
  border: 1px solid #0E749030;
  border-left: 4px solid #0E7490;
  border-radius: 8px;
  transition: box-shadow .15s, transform .15s;
}
.md-typeset .grid.cards > ul > li:hover {
  box-shadow: 0 6px 16px rgba(22, 50, 74, 0.25);
  transform: translateY(-2px);
}

/* --------------------------------------------------------------- tabelle */
/* Le tabelle dei bound sono fatte di numeri: cifre a larghezza fissa, cosi'
   le colonne restano incolonnate anche a occhio. */
.md-typeset table:not([class]) {
  font-variant-numeric: tabular-nums;
  margin: 1.4em 0;
}
.md-typeset table:not([class]) th {
  background: #0E74900f;
  font-weight: 600;
}
[data-md-color-scheme="slate"] .md-typeset table:not([class]) th {
  background: #4dd0e11a;
}
.md-typeset table:not([class]) td,
.md-typeset table:not([class]) th {
  padding: .58em .9em;
}

/* ---------------------------------------------------------------- figure */
.md-typeset img {
  border-radius: 6px;
  display: block;
  margin: 1.6em auto;
  max-width: 100%;
}
/* la riga di testo che segue un'immagine fa da didascalia */
.md-typeset img + em,
.md-typeset figcaption {
  display: block;
  text-align: center;
  font-size: .82em;
  color: var(--md-default-fg-color--light);
}

/* ------------------------------------------------------------ admonition */
.md-typeset .admonition,
.md-typeset details {
  margin: 1.6em 0;
  border-radius: 7px;
  box-shadow: none;
  border-left-width: 4px;
}

/* ------------------------------------------------------------ codice */
.md-typeset pre > code { border-radius: 6px; }
.md-typeset code { font-size: .84em; }

/* ------------------------------------------------- il modello dell'istanza */
/* Una colonna per variabile: su schermo stretto il blocco scorre, e una
   sfumatura sul bordo destro segnala che c'e' altro da vedere. */
.md-typeset .modello-esteso {
  position: relative;
  overflow-x: auto;
  overflow-y: hidden;
  margin: 1.4em 0;
  padding-bottom: .2em;
  scrollbar-width: thin;
}
.md-typeset .modello-esteso.largo mjx-container[display="true"] {
  font-size: .86em;
}
.md-typeset .modello-esteso mjx-container[display="true"] {
  margin: .4em 0;
  overflow: visible;
}
.md-typeset .modello-esteso::-webkit-scrollbar { height: 6px; }
.md-typeset .modello-esteso::-webkit-scrollbar-thumb {
  background: #0E749055;
  border-radius: 3px;
}

/* la riga di scheda in cima a una pagina: utile, ma non e' l'apertura */
.md-typeset .scheda {
  font-size: .72rem;
  line-height: 1.6;
  color: var(--md-default-fg-color--light);
}
.md-typeset .scheda strong {
  color: var(--md-default-fg-color--light);
  font-weight: 600;
}
.md-typeset .scheda code {
  font-size: .9em;
  background-color: var(--md-code-bg-color);
}