# Charte graphique — PLANNING TEAM

**Grande Pharmacie de Morancé** · établie le 26/08/2026

## Nom de l'outil

**PLANNING TEAM — Grande Pharmacie de Morancé**
Nom court à l'écran et dans l'onglet : **PLANNING TEAM**.

## Logo

`logo-pharmacie-morance.jpg` (5144 × 5096, fond blanc) — logo officiel de la pharmacie :
feuille turquoise dans un cercle ouvert, croix pharmacie anthracite, wordmark
« PHARMACIE de Morancé ».

Emplois :
- **en-tête de l'application** : logo seul (le symbole, sans wordmark) + « PLANNING TEAM » ;
- **PDF pour l'équipe et pour le cabinet** : logo complet avec wordmark, en haut à gauche ;
- **favicon / icône du raccourci** : le symbole seul.

> À produire : une version **PNG à fond transparent** et une version **SVG** du symbole seul.
> Le JPEG actuel a un fond blanc opaque, qui se verra sur tout fond coloré.

## Couleurs

Prélevées directement dans le logo.

| Rôle | Hex | Contraste sur blanc | Usage |
|---|---|---|---|
| **Turquoise marque** | `#7AC7C1` | 1,95:1 | Aplats, fonds, bandeaux, remplissage des créneaux. **Jamais de texte.** |
| **Turquoise accent** | `#2E7A75` | 5,05:1 ✅ AA | Texte sur fond clair, boutons, liens, libellés actifs. |
| **Turquoise foncé** | `#1F6763` | 6,61:1 ✅ AA | Titres, en-têtes de tableau, état sélectionné. |
| **Anthracite** | `#5A5B5D` | 6,80:1 ✅ AA | Texte secondaire, bordures, croix du logo. |
| **Anthracite foncé** | `#3A3B3D` | 11,21:1 ✅ AAA | Texte principal. |
| **Turquoise pâle** | `#E8F4F3` | — | Fonds de lignes alternées, zones inactives, week-end. |
| Blanc | `#FFFFFF` | — | Fond général. |

Couleurs d'état (hors marque, réservées aux alertes du planning) :

| Rôle | Hex | Usage |
|---|---|---|
| Alerte | `#B3261E` | Règle violée : moins de 3 personnes, aucun pharmacien présent. |
| Vigilance | `#8A5A00` | Écart d'heures sur le cycle, solde de CP anormal. |
| Validé | `#2E7A75` | Demande de congé acceptée, cycle conforme. |

Règle : le turquoise de marque `#7AC7C1` ne porte **jamais** de texte (1,95:1). Pour du texte
turquoise, utiliser `#2E7A75` ou `#1F6763`. Sur un aplat `#7AC7C1`, écrire en `#3A3B3D`
(contraste 5,75:1).

## Typographie

Sans-serif géométrique, dans l'esprit du wordmark du logo (lettres larges, ouvertes).
Pile recommandée :

```
font-family: 'Poppins', 'Century Gothic', 'Questrial', system-ui, -apple-system,
             'Segoe UI', Roboto, sans-serif;
```

- Titres en **majuscules espacées** (`letter-spacing: 0.08em`), comme « PHARMACIE » du logo.
- Grille du planning : chiffres en **tabulaires** (`font-variant-numeric: tabular-nums`) pour
  que les colonnes d'heures s'alignent.

## Principes d'interface

- Le planning est une **grille dense** : la couleur sert à lire vite (une teinte par personne,
  dérivée du turquoise), pas à décorer.
- Les alertes se voient **sans lire** : le créneau en défaut se colore, le compteur passe en
  rouge.
- Sur téléphone (vue équipe), une colonne par jour, pas de scroll horizontal.