/* Onglet Chiffres sur iPhone (screens/commissions/Mobile.js, MoisPage.js, screens/statistiques/Mobile.js, MoisStat.js),
   repris de la maquette validée par Dylan le 27/09/2026 (D12 à D14). */

.chiffres-controls { margin: 0 0 var(--s-4); }
.notice-amber { background: var(--amber-soft); color: var(--amber); margin: 0 0 var(--s-4); }
.mois-sec { margin-top: var(--s-6); }
.mois-actions { flex-direction: column; margin-top: var(--s-4); }
.mois-actions .btn { width: 100%; }

/* Graphique des six derniers mois : chaque colonne se touche (D13) */
.stat-mobile .stat-cap { margin: -4px 0 var(--s-3); }
.bar-hits { position: absolute; inset: 0; display: flex; }
.bar-hits button { flex: 1; border: 0; background: none; padding: 0; cursor: pointer; -webkit-tap-highlight-color: transparent; }
/* Six barres seulement : la place suffit pour écrire le montant au-dessus de chacune (masqué ailleurs sur petit écran) */
.stat-mobile .bar-value { display: block; }

/* Trois chiffres du mois avec leur variation (cases de activite.css) */
.stat-trio .ds { gap: 4px; }
.stat-trio .ds-v { font-size: 20px; }
.stat-trio .delta { justify-self: start; font-size: 12px; padding: 1px 7px; }
.delta-none { color: var(--text-3); background: none; padding: 0; }

/* Détail d'un mois : variation sous le chiffre d'affaires, résumé des objectifs, comparaison ligne à ligne */
.dh-delta { margin: 2px 0 0; display: flex; align-items: center; gap: 6px; }
.sumup { display: grid; gap: var(--s-2); }
.su-n { margin: 0; font-size: 15px; color: var(--text-2); }
.su-n b { font-size: 17px; }
.su-dots { display: flex; gap: 6px; }
.su-dots i { flex: 1; height: 6px; border-radius: 3px; }
.su-ok { background: var(--green); } .su-wait { background: var(--amber); } .su-miss { background: var(--red); }
.cmp .kv .k { flex: 1 1 auto; }
.cmp .kv .v { flex: none; }
.cmp-d { flex: none; min-width: 78px; display: flex; justify-content: flex-end; }
