/* Types d'admonition propres au cours de maths.
   Les noms correspondent aux classes reconnues par templates/filters/mkdocs.lua.

   Trois choses par type, et les trois sont nécessaires :

     1. la variable --md-admonition-icon--<type>, qui porte le dessin ;
     2. la couleur de la bordure et du bandeau de titre ;
     3. la règle ::before qui applique la variable en masque.

   Le point 3 est facile à oublier, et c'est ce qui manquait ici : Material ne
   câble --md-admonition-icon--<type> que pour ses propres types. Sans règle
   ::before, un type maison hérite de la règle de base, et affiche l'icône de
   `note` — un stylo dans un cercle — dans le bleu de `note`, quelle que soit
   la couleur de sa bordure. Les douze boîtes portaient donc la même icône.

   Les couleurs des blocs de cours sont celles de templates/pandoc/sequence.latex :
   le même bloc doit avoir la même couleur sur le papier et à l'écran. */

:root {
  --md-admonition-icon--definition:  url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M17 3H7a2 2 0 0 0-2 2v16l7-3 7 3V5a2 2 0 0 0-2-2Z"/></svg>');
  --md-admonition-icon--propriete:   url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10 10-4.5 10-10S17.5 2 12 2m-2 15-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9Z"/></svg>');
  --md-admonition-icon--theoreme:    url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V5a2 2 0 0 0-2-2m0 16H5V5h14v14M17.99 9l-1.41-1.42-6.59 6.59-2.58-2.57-1.42 1.41 4 3.99 8-8Z"/></svg>');
  --md-admonition-icon--methode:     url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M3 5h2v2H3V5Zm4 0h14v2H7V5ZM3 11h2v2H3v-2Zm4 0h14v2H7v-2ZM3 17h2v2H3v-2Zm4 0h14v2H7v-2Z"/></svg>');
  --md-admonition-icon--exemple:     url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 2a7 7 0 0 0-7 7c0 2.38 1.19 4.47 3 5.74V17a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1v-2.26c1.81-1.27 3-3.36 3-5.74a7 7 0 0 0-7-7M9 21a1 1 0 0 0 1 1h4a1 1 0 0 0 1-1v-1H9v1Z"/></svg>');
  --md-admonition-icon--exercice:    url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20.71 7.04c.39-.39.39-1.04 0-1.41l-2.34-2.34c-.37-.39-1.02-.39-1.41 0l-1.84 1.83 3.75 3.75M3 17.25V21h3.75L17.81 9.93l-3.75-3.75L3 17.25Z"/></svg>');
  --md-admonition-icon--activite:    url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9.5 3A6.5 6.5 0 0 1 16 9.5c0 1.61-.59 3.09-1.56 4.23l.27.27h.79l5 5-1.5 1.5-5-5v-.79l-.27-.27A6.516 6.516 0 0 1 9.5 16 6.5 6.5 0 0 1 3 9.5 6.5 6.5 0 0 1 9.5 3m0 2C7 5 5 7 5 9.5S7 14 9.5 14 14 12 14 9.5 12 5 9.5 5Z"/></svg>');
  --md-admonition-icon--objectifs:   url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm0 2a8 8 0 1 1 0 16 8 8 0 0 1 0-16Zm0 3a5 5 0 1 0 0 10 5 5 0 0 0 0-10Zm0 2a3 3 0 1 1 0 6 3 3 0 0 1 0-6Zm0 1.5a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3Z"/></svg>');
  --md-admonition-icon--automatisme: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M7 2v11h3v9l7-12h-4l4-8H7Z"/></svg>');
  --md-admonition-icon--attention:   url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M1 21h22L12 2 1 21Zm12-3h-2v-2h2v2Zm0-4h-2v-4h2v4Z"/></svg>');
  --md-admonition-icon--remarque:    url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M13 9h-2V7h2m0 10h-2v-6h2m-1-9A10 10 0 0 0 2 12a10 10 0 0 0 10 10 10 10 0 0 0 10-10A10 10 0 0 0 12 2Z"/></svg>');
  --md-admonition-icon--corrige:     url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9 20.42 2.79 14.21l2.83-2.83L9 14.77l9.88-9.89 2.83 2.83L9 20.42Z"/></svg>');
}

/* --- Définition : ce qu'on retient — un signet ------------------------- */
.md-typeset .admonition.definition           { border-color: #1565C0; }
.md-typeset .definition > .admonition-title  { background: #1565C01a; }
.md-typeset .definition > .admonition-title::before {
  background-color: #1565C0;
  -webkit-mask-image: var(--md-admonition-icon--definition);
          mask-image: var(--md-admonition-icon--definition);
}

/* --- Propriété et théorème : un résultat établi — une coche ------------ */
.md-typeset .admonition.propriete,
.md-typeset .admonition.theoreme             { border-color: #2E7D32; }
.md-typeset .propriete > .admonition-title,
.md-typeset .theoreme  > .admonition-title   { background: #2E7D321a; }
.md-typeset .propriete > .admonition-title::before,
.md-typeset .theoreme  > .admonition-title::before { background-color: #2E7D32; }
/* Coche ronde pour la propriété, carrée pour le théorème : même famille,
   deux dessins, puisqu'ils partagent la couleur. */
.md-typeset .propriete > .admonition-title::before {
  -webkit-mask-image: var(--md-admonition-icon--propriete);
          mask-image: var(--md-admonition-icon--propriete);
}
.md-typeset .theoreme > .admonition-title::before {
  -webkit-mask-image: var(--md-admonition-icon--theoreme);
          mask-image: var(--md-admonition-icon--theoreme);
}

/* --- Méthode : une suite d'étapes — une liste -------------------------- */
.md-typeset .admonition.methode              { border-color: #6A1B9A; }
.md-typeset .methode > .admonition-title     { background: #6A1B9A1a; }
.md-typeset .methode > .admonition-title::before {
  background-color: #6A1B9A;
  -webkit-mask-image: var(--md-admonition-icon--methode);
          mask-image: var(--md-admonition-icon--methode);
}

/* --- Activité : on cherche — une loupe --------------------------------- */
.md-typeset .admonition.activite             { border-color: #EF6C00; }
.md-typeset .activite > .admonition-title    { background: #EF6C001a; }
.md-typeset .activite > .admonition-title::before {
  background-color: #EF6C00;
  -webkit-mask-image: var(--md-admonition-icon--activite);
          mask-image: var(--md-admonition-icon--activite);
}

/* --- Exercice : ce que l'élève écrit — un crayon ----------------------- */
.md-typeset .admonition.exercice             { border-color: #37474F; }
.md-typeset .exercice > .admonition-title    { background: #37474F1a; }
.md-typeset .exercice > .admonition-title::before {
  background-color: #37474F;
  -webkit-mask-image: var(--md-admonition-icon--exercice);
          mask-image: var(--md-admonition-icon--exercice);
}

/* --- Automatisme : ce qui doit venir vite — un éclair ------------------ */
/* Rose, et non le cyan d'autrefois : celui-ci est passé à l'exemple. */
.md-typeset .admonition.automatisme          { border-color: #AD1457; }
.md-typeset .automatisme > .admonition-title { background: #AD14571a; }
.md-typeset .automatisme > .admonition-title::before {
  background-color: #AD1457;
  -webkit-mask-image: var(--md-admonition-icon--automatisme);
          mask-image: var(--md-admonition-icon--automatisme);
}

/* --- Corrigé : la réponse validée — une coche -------------------------- */
.md-typeset .admonition.corrige              { border-color: #B71C1C; }
.md-typeset .corrige > .admonition-title     { background: #B71C1C1a; }
.md-typeset .corrige > .admonition-title::before {
  background-color: #B71C1C;
  -webkit-mask-image: var(--md-admonition-icon--corrige);
          mask-image: var(--md-admonition-icon--corrige);
}

/* --- Objectifs : où l'on va — une cible -------------------------------- */
.md-typeset .admonition.objectifs            { border-color: #00695C; }
.md-typeset .objectifs > .admonition-title   { background: #00695C1a; }
.md-typeset .objectifs > .admonition-title::before {
  background-color: #00695C;
  -webkit-mask-image: var(--md-admonition-icon--objectifs);
          mask-image: var(--md-admonition-icon--objectifs);
}

/* --- Exemple : une idée qui éclaire — une ampoule ---------------------- */
.md-typeset .admonition.exemple              { border-color: #00838F; }
.md-typeset .exemple > .admonition-title     { background: #00838F1a; }
.md-typeset .exemple > .admonition-title::before {
  background-color: #00838F;
  -webkit-mask-image: var(--md-admonition-icon--exemple);
          mask-image: var(--md-admonition-icon--exemple);
}

/* --- Remarque : un aparté — un i ---------------------------------------- */
.md-typeset .admonition.remarque             { border-color: #546E7A; }
.md-typeset .remarque > .admonition-title    { background: #546E7A1a; }
.md-typeset .remarque > .admonition-title::before {
  background-color: #546E7A;
  -webkit-mask-image: var(--md-admonition-icon--remarque);
          mask-image: var(--md-admonition-icon--remarque);
}

/* --- Attention : à repérer sans lire — un triangle --------------------- */
.md-typeset .admonition.attention            { border-color: #D84315; }
.md-typeset .attention > .admonition-title   { background: #D843151a; }
.md-typeset .attention > .admonition-title::before {
  background-color: #D84315;
  -webkit-mask-image: var(--md-admonition-icon--attention);
          mask-image: var(--md-admonition-icon--attention);
}


/* Bloc réservé au professeur : déroulé, durées, modalités. Il n'existe que
   sur le site du professeur — prof.lua le supprime des variantes élève, dys
   et site. La teinte est celle de cProf dans boites.tex, pour que le site et
   le PDF nomment et colorent le même bloc de la même façon. */
:root {
  --md-admonition-icon--prof: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 3 1 9l11 6 9-4.91V17h2V9L12 3Zm-7 9.18v4L12 20l7-3.82v-4L12 16l-7-3.82Z"/></svg>');
}
.md-typeset .admonition.prof              { border-color: #455A64; }
.md-typeset .prof > .admonition-title     { background: #455A641a; }
.md-typeset .prof > .admonition-title::before {
  background-color: #455A64;
  -webkit-mask-image: var(--md-admonition-icon--prof);
          mask-image: var(--md-admonition-icon--prof);
}

/* Trou de la trace écrite. Sur le site des élèves il est rempli sans marque,
   la page étant la version de référence ; sur celui du professeur il garde le
   soulignement du PDF prof, pour qu'on voie d'un coup d'œil ce que l'élève
   aura à compléter. */
.md-typeset .trou-prof {
  border-bottom: 1px solid #C62828;
  color: #C62828;
}

/* Passage réservé au professeur au fil du texte : `[…]{.prof}`. Il ne paraît
   que sur le site du professeur — prof.lua le retire ailleurs — et reprend le
   gris du PDF prof, où \profnote lui donne déjà l'italique et cette couleur. */
.md-typeset .note-prof {
  color: #455A64;
  font-style: italic;
}

/* ------------------------------------------------------------------------
   Les ancres de boîtes.

   mkdocs.lua glisse dans chaque boîte de contenu un titre de niveau 3 qui
   reprend son libellé. Il ne s'affiche pas : il n'existe que pour peupler la
   table des matières de droite et pour donner à la boîte une ancre vers
   laquelle pointer un lien.

   `visibility: hidden` et non `display: none` : un élément sans boîte de
   rendu n'a pas de position, et le navigateur ne saurait pas où défiler
   lorsqu'on ouvre l'adresse de l'ancre. Ici la boîte existe, de hauteur
   nulle, à l'endroit exact où commence le contenu.

   `scroll-margin-top` place le haut de la boîte sous la barre fixe de
   Material, au lieu de le laisser passer dessous. Sa valeur couvre la barre
   et la hauteur du titre visible, sous lequel l'ancre se trouve : mesuré à
   37 pixels, identique pour tous les types de boîte.
   ------------------------------------------------------------------------ */
.md-typeset .ancre-boite {
  visibility: hidden;
  height: 0;
  margin: 0;
  padding: 0;
  font-size: 0;
  line-height: 0;
  scroll-margin-top: 9.5rem;
}

/* Le bouton « copier le lien », posé par ancres.js sur le titre de chaque
   boîte ancrable. Discret au repos, net au survol — et toujours visible au
   doigt, où il n'y a pas de survol. */
.md-typeset .admonition-title .ancre-copie {
  float: right;
  margin: -.1rem -.2rem 0 .4rem;
  padding: 0 .25rem;
  border: 0;
  background: none;
  color: currentColor;
  opacity: 0;
  cursor: pointer;
  font-size: .8em;
  line-height: 1.4;
  transition: opacity .15s;
}

.md-typeset .admonition-title .ancre-copie::before { content: "🔗"; }

.md-typeset .admonition:hover .ancre-copie,
.md-typeset .admonition-title .ancre-copie:focus-visible { opacity: .65; }

.md-typeset .admonition-title .ancre-copie:hover { opacity: 1; }

.md-typeset .admonition-title .ancre-copie--fait {
  opacity: 1;
}
.md-typeset .admonition-title .ancre-copie--fait::before { content: "✓"; }

@media (hover: none) {
  .md-typeset .admonition-title .ancre-copie { opacity: .55; }
}

/* ------------------------------------------------------------------------
   La légende des cadres, dans le bandeau.

   Un cadre porte le plus souvent un titre propre — « Axe de symétrie » et non
   « Définition » — si bien que seuls sa couleur et son pictogramme disent de
   quel type il s'agit. Le PDF écrit « Définition — Axe de symétrie » ; le
   site ne le peut pas sans alourdir chaque titre et chaque entrée de la table
   des matières. D'où ce menu.

   Les pastilles sont de vrais titres de cadre : même balisage que dans le
   texte, donc mêmes couleur et pictogramme, sans une règle de plus. Il n'y a
   ici que de la mise en boîte.
   ------------------------------------------------------------------------ */
/* Material replie le menu par `max-height: 0` au repos, et ne le déplie qu'au
   survol : c'est cette hauteur nulle qui fait qu'un menu fermé n'attrape pas
   la souris. Redéfinir `max-height` sans condition — ce que faisait une
   première version — laissait donc un panneau haut de six cents pixels,
   invisible mais survolable : la légende s'ouvrait dès que le curseur passait
   sous le bouton. La hauteur ne se relève qu'à l'état ouvert.

   Aucune marge intérieure sur `__inner` non plus, pour la même raison : elle
   s'ajoute à la hauteur maximale et laisserait une bande sensible sous le
   bouton. Ce sont les deux enfants qui la portent. */
/* La largeur maximale tient compte de l'alignement à droite : le panneau part
   du bord droit du bouton, lui-même à une cinquantaine de pixels du bord de
   l'écran. Une marge de 1,6rem seulement le faisait sortir par la gauche sur
   un téléphone. */
.md-legende .md-legende__inner {
  width: 23rem;
  max-width: calc(100vw - 3.2rem);
  overflow-y: auto;
}

.md-legende:hover .md-legende__inner,
.md-legende:focus-within .md-legende__inner {
  max-height: min(80vh, 30rem);
}

/* Material ouvre son menu centré sous le bouton — réglage fait pour le
   sélecteur de langue, dont les entrées sont courtes. La légende est le
   dernier bouton du bandeau et son panneau est large : centré, il sortait de
   l'écran par la droite. On l'aligne donc sur le bord droit du bouton, la
   pointe du menu avec. C'est le même correctif que pour le bouton « police »,
   dans polices.css. */
.md-legende .md-select__inner {
  left: auto;
  right: 0;
  transform: translate3d(0, .3rem, 0);
}

.md-legende:hover .md-select__inner,
.md-legende:focus-within .md-select__inner {
  transform: translate3d(0, 0, 0);
}

.md-legende .md-select__inner::after {
  left: auto;
  margin-left: 0;
  right: .5rem;
}

.md-legende__titre {
  margin: 0;
  padding: .6rem .7rem .35rem;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
  color: var(--md-default-fg-color--light);
}

/* `white-space: normal` : Material pose `nowrap` sur le menu du sélecteur de
   langue, dont on emprunte l'habillage. Les phrases de la légende
   débordaient alors sans le montrer — le texte sortait du cadre, invisible,
   au lieu de passer à la ligne. */
.md-legende__liste,
.md-legende__liste .md-legende__item,
.md-legende__texte {
  white-space: normal;
}

/* …mais pas le libellé de la pastille : « Automatisme » repassait à la ligne
   sur son dernier caractère. Il tient sur une ligne, et la pastille est
   dimensionnée sur le plus long des libellés. */
.md-legende__liste .md-legende__pastille .admonition-title {
  white-space: nowrap;
}

.md-legende__liste {
  margin: 0;
  padding: 0 .7rem .7rem;
  list-style: none;
}

.md-legende__item {
  display: flex;
  align-items: flex-start;
  gap: .5rem;
  margin: 0 0 .35rem;
}

/* La pastille : le titre de cadre, réduit et sans son corps. */
.md-legende__liste .md-legende__pastille.admonition {
  display: block;
  flex: 0 0 7.4rem;
  margin: 0;
  border: 0;
  border-radius: .15rem;
  box-shadow: none;
  overflow: hidden;
  font-size: .64rem;
}

.md-legende__liste .md-legende__pastille .admonition-title {
  margin: 0;
  padding: .18rem .35rem .18rem 1.45rem;
  font-size: .64rem;
  font-weight: 700;
  line-height: 1.4;
}

.md-legende__liste .md-legende__pastille .admonition-title::before {
  top: .22rem;
  left: .35rem;
  width: .85rem;
  height: .85rem;
}

.md-legende__texte {
  /* `min-width: 0` sans quoi le texte ne descend jamais sous la largeur de sa
     plus longue ligne : un élément de flex refuse de rétrécir en deçà de son
     contenu, et la phrase débordait du menu au lieu de passer à la ligne. */
  flex: 1 1 auto;
  min-width: 0;
  font-size: .66rem;
  line-height: 1.45;
  color: var(--md-default-fg-color--light);
  padding-top: .1rem;
}

/* ------------------------------------------------------------------------
   Le dessin du cours papier et du diaporama (style « onglet » de
   templates/pandoc/boites.tex) : fond blanc, cadre fin arrondi dans la couleur
   du bloc, titre noir dans un onglet posé à cheval sur le bord haut. Un élève
   qui passe de sa feuille au site, ou au tableau, reconnaît le même bloc.

   Les couleurs restent celles des règles par type ci-dessus : le cadre les
   porte, l'onglet les hérite par `border-color: inherit`. La pastille de la
   légende garde son propre dessin, d'où le :not(). */
.md-typeset :is(.admonition, details):is(.definition, .propriete, .theoreme,
    .methode, .activite, .exercice, .exemple, .remarque, .attention,
    .objectifs, .automatisme, .corrige, .prof):not(.md-legende__pastille) {
  border-width: .06rem;
  border-style: solid;
  border-radius: .5rem;
  background-color: var(--md-default-bg-color);
  box-shadow: none;
  overflow: visible;
  margin-top: 1.9em;
}
.md-typeset :is(.admonition, details):is(.definition, .propriete, .theoreme,
    .methode, .activite, .exercice, .exemple, .remarque, .attention,
    .objectifs, .automatisme, .corrige, .prof):not(.md-legende__pastille)
    > :is(.admonition-title, summary) {
  width: fit-content;
  max-width: calc(100% - 1.6rem);
  margin: -.95rem 0 .3rem .6rem;
  padding: .15rem .6rem .15rem 1.75rem;
  border: .06rem solid;
  border-color: inherit;
  border-radius: .35rem;
  background: var(--md-default-bg-color);
  color: var(--md-default-fg-color);
}
/* Le repli d'un bloc déplié (corrigé) a sa flèche à droite : place pour elle. */
.md-typeset details:is(.definition, .propriete, .theoreme, .methode,
    .activite, .exercice, .exemple, .remarque, .attention, .objectifs,
    .automatisme, .corrige, .prof) > summary {
  padding-right: 1.9rem;
}
.md-typeset :is(.admonition, details):is(.definition, .propriete, .theoreme,
    .methode, .activite, .exercice, .exemple, .remarque, .attention,
    .objectifs, .automatisme, .corrige, .prof):not(.md-legende__pastille)
    > :is(.admonition-title, summary)::before {
  left: .55rem;
  top: 50%;
  transform: translateY(-50%);
}
