/* La mise en forme des messages de JARVIS : une carte façon Réglages d'iOS (titre, lignes nom / valeur, pastilles vert / orange / rouge)
   et du texte avec gras, listes et paragraphes. Noir, bleu #0a84ff pour l'action, couleurs système d'iOS pour les états. Tout est préfixé mzf-. */
.mzc-bulle.mzc-format { white-space: normal; }
.mzc-format .mzf-p, .mzc-format .mzf-intro, .mzc-format .mzf-note { margin: 0; }
.mzc-format .mzf-p + .mzf-p { margin-top: 6px; }
.mzc-format .mzf-espace { height: 7px; }
.mzc-format strong { font-weight: 650; }
.mzc-format .mzf-puces { list-style: none; margin: 4px 0; padding: 0; display: grid; gap: 3px; }
.mzc-format .mzf-puces li { position: relative; padding-left: 16px; }
.mzc-format .mzf-puces li::before { content: ''; position: absolute; left: 3px; top: .6em; width: 5px; height: 5px; border-radius: 50%; background: rgb(var(--th-s) / calc(.5 * var(--th-sa))); }
.mzc-format .mzf-puces li.is-fait { color: var(--dim, rgb(var(--th-s) / calc(.62 * var(--th-sa)))); }
.mzc-format .mzf-puces li.is-fait::before { content: '✓'; top: 0; left: 0; width: auto; height: auto; background: none; color: var(--th-green); font-size: 13px; }

/* la carte : pas de marge dans la bulle, les lignes vont d'un bord à l'autre */
.mzc-bulle.mzc-carte { padding: 12px 0 2px; min-width: min(300px, 74vw); }   /* vw : un pourcentage se calcule sur une colonne qui prend la taille de son contenu */
.mzc-carte .mzf-titre { margin: 0 15px 2px; font: 650 17px/1.25 var(--font, -apple-system, system-ui, sans-serif); letter-spacing: -.02em; }
.mzc-carte .mzf-intro { margin: 2px 15px 6px; color: var(--dim, rgb(var(--th-s) / calc(.62 * var(--th-sa)))); font: 450 15px/1.35 var(--font, -apple-system, system-ui, sans-serif); }
.mzc-carte .mzf-note { margin: 0; padding: 8px 15px 11px; color: var(--dim, rgb(var(--th-s) / calc(.62 * var(--th-sa)))); font: 450 14px/1.35 var(--font, -apple-system, system-ui, sans-serif); box-shadow: inset 0 .5px 0 rgb(var(--th-w) / calc(.12 * var(--th-fa))); }
.mzc-carte .mzf-puces { margin: 4px 15px 10px; }
.mzc-carte .mzf-lignes { list-style: none; margin: 8px 0 0; padding: 0; }
.mzc-carte .mzf-lignes:last-child { margin-bottom: 0; }
.mzc-carte .mzf-lignes li { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; min-height: 40px; padding: 9px 15px; box-shadow: inset 0 .5px 0 rgb(var(--th-w) / calc(.12 * var(--th-fa))); }
.mzc-carte .mzf-k { flex: none; max-width: 44%; color: var(--dim, rgb(var(--th-s) / calc(.62 * var(--th-sa)))); font: 450 15px/1.3 var(--font, -apple-system, system-ui, sans-serif); }
.mzc-carte .mzf-v { flex: 1; min-width: 0; display: flex; align-items: baseline; justify-content: flex-end; gap: 8px; text-align: right; font: 600 15px/1.3 var(--font, -apple-system, system-ui, sans-serif); letter-spacing: -.01em; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.mzc-carte .mzf-v strong { font-weight: 700; }
.mzf-pt { flex: none; width: 10px; height: 10px; border-radius: 50%; align-self: flex-start; margin-top: .42em; background: rgb(var(--th-s) / calc(.3 * var(--th-sa))); }
.mzf-pt.is-vert { background: var(--th-green); }
.mzf-pt.is-orange { background: var(--th-orange); }
.mzf-pt.is-rouge { background: var(--th-red); }
.mzf-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@media (max-width: 360px) { .mzc-carte .mzf-lignes li { flex-wrap: wrap; } .mzc-carte .mzf-k { max-width: none; } .mzc-carte .mzf-v { flex-basis: 100%; justify-content: flex-start; text-align: left; } }
.mzc-carte .mzf-p { margin: 6px 15px; }
.mzc-carte .mzf-titre ~ .mzf-p:last-child { margin-bottom: 11px; }
.mzc-carte .mzf-espace { display: none; }
/* une valeur longue (plusieurs mots, une liste de noms) passe sous son nom, alignée à gauche : elle se lit d'une traite, comme une ligne longue de Réglages */
.mzc-carte .mzf-lignes li.is-long { flex-direction: column; gap: 3px; }
.mzc-carte .mzf-lignes li.is-long .mzf-k { max-width: none; font-size: 13.5px; }
.mzc-carte .mzf-lignes li.is-long .mzf-v { flex: none; width: 100%; justify-content: flex-start; text-align: left; font-weight: 550; }
.mzc-carte .mzf-k:empty { display: none; }
