/* MediaCom OS — design system. Blanc, calme, précis : la couleur ne sert qu'à l'action et au statut. */
:root {
  --fond: #ffffff;
  --fond-2: #f7f7f8;          /* zones très discrètes (survol, champs) */
  --fond-3: #f0f0f2;
  --texte: #111113;
  --texte-2: #5f6168;
  --texte-3: #9a9ca3;
  --filet: #ececee;
  --filet-fort: #dcdde1;
  --accent: #0b74c4;          /* le bleu MediaCom : action, sélection */
  --accent-doux: #eaf3fb;
  --vert: #1a7f45; --vert-doux: #e9f6ee;
  --orange: #b25e00; --orange-doux: #fdf3e6;
  --rouge: #c8312b; --rouge-doux: #fdeceb;
  --rayon: 10px;
  --rayon-petit: 7px;
  --ombre-flottante: 0 10px 40px rgba(17, 17, 19, .12), 0 1px 3px rgba(17, 17, 19, .08);
  --police: -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'Segoe UI', Inter, Roboto, 'Helvetica Neue', Arial, sans-serif;
  --haut: env(safe-area-inset-top, 0px);
  --bas: env(safe-area-inset-bottom, 0px);
  --barre: 232px;
  --marque: #0b74c4;          /* (documents imprimés) */
  color-scheme: light;
}
body.sombre {
  --fond: #0f0f11; --fond-2: #17171a; --fond-3: #1f1f23; --texte: #f2f2f3; --texte-2: #a6a8ae; --texte-3: #6d6f76;
  --filet: #232327; --filet-fort: #303036; --accent: #4ea3e6; --accent-doux: #142433;
  --vert: #4cc27f; --vert-doux: #12261b; --orange: #f0a64a; --orange-doux: #2a2010; --rouge: #f0726b; --rouge-doux: #2c1615;
  --ombre-flottante: 0 10px 40px rgba(0, 0, 0, .5);
  color-scheme: dark;
}

* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }
body { background: var(--fond); color: var(--texte); font: 14px/1.5 var(--police); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; font-feature-settings: 'tnum' 0; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }
h1, h2, h3, h4 { margin: 0; font-weight: 600; letter-spacing: -.012em; }
p { margin: 0; }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 6px; }
.discret { color: var(--texte-2); }
.petit { font-size: 12.5px; }
.ic { stroke: currentColor; fill: none; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.nombre { font-variant-numeric: tabular-nums; }
.rouge { color: var(--rouge); } .orange { color: var(--orange); } .vert { color: var(--vert); }

/* ───────── champs et boutons ───────── */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]), select, textarea {
  width: 100%; min-height: 36px; padding: 7px 10px; border: 1px solid var(--filet-fort); border-radius: var(--rayon-petit); background: var(--fond); outline: none; transition: border-color .12s, box-shadow .12s;
}
textarea { resize: vertical; line-height: 1.45; }
input:focus, select:focus, textarea:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-doux); }
input[type="color"] { width: 44px; height: 32px; border: 1px solid var(--filet-fort); border-radius: 6px; background: var(--fond); padding: 2px; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 32px; padding: 6px 12px; border: 1px solid var(--filet-fort); border-radius: var(--rayon-petit); background: var(--fond); color: var(--texte); font-weight: 500; white-space: nowrap; transition: background .12s, border-color .12s, color .12s; }
.btn:hover { background: var(--fond-2); }
.btn.principal { background: var(--texte); border-color: var(--texte); color: var(--fond); }
.btn.principal:hover { background: #2a2a2e; }
body.sombre .btn.principal:hover { background: #e2e2e4; }
.btn.accent { background: var(--accent); border-color: var(--accent); color: #fff; }
.btn.danger { background: var(--rouge); border-color: var(--rouge); color: #fff; }
.btn.discret { border-color: transparent; background: transparent; color: var(--texte-2); }
.btn.discret:hover { background: var(--fond-2); color: var(--texte); }
.btn:disabled { opacity: .45; cursor: not-allowed; }
.btn.petit { min-height: 28px; padding: 3px 9px; font-size: 13px; }
.icone-btn { display: inline-grid; place-items: center; width: 32px; height: 32px; border: 0; border-radius: var(--rayon-petit); background: transparent; color: var(--texte-2); }
.icone-btn:hover { background: var(--fond-2); color: var(--texte); }
.lien { border: 0; background: none; padding: 0; color: var(--accent); font-weight: 500; }
.lien:hover { text-decoration: underline; }
.lien.discret { color: var(--texte-2); }
.champ { display: grid; gap: 5px; }
.champ-libelle { font-size: 12.5px; font-weight: 500; color: var(--texte-2); }
.champ-aide { font-size: 12px; color: var(--texte-3); }
.deux { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.trois { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.ligne-gestes { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.statut { display: inline-flex; align-items: center; gap: 5px; padding: 1px 8px; border-radius: 999px; font-size: 12px; font-weight: 500; background: var(--fond-3); color: var(--texte-2); white-space: nowrap; }
.statut::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; opacity: .8; }
.statut.vert { background: var(--vert-doux); color: var(--vert); }
.statut.orange { background: var(--orange-doux); color: var(--orange); }
.statut.rouge { background: var(--rouge-doux); color: var(--rouge); }
.statut.bleu { background: var(--accent-doux); color: var(--accent); }
.statut.nu::before { display: none; }
.avatar { display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--fond-3); color: var(--texte-2); font-size: 10.5px; font-weight: 600; flex: none; }
.avatar.moi { background: var(--accent-doux); color: var(--accent); }
.avatar.vide { background: transparent; border: 1px dashed var(--filet-fort); }
.segments { display: inline-flex; padding: 2px; border-radius: 9px; background: var(--fond-3); gap: 2px; }
.segments button { border: 0; background: transparent; padding: 4px 11px; border-radius: 7px; color: var(--texte-2); font-weight: 500; font-size: 13px; display: inline-flex; align-items: center; gap: 6px; }
.segments button.actif { background: var(--fond); color: var(--texte); box-shadow: 0 1px 2px rgba(0, 0, 0, .08); }
body.sombre .segments button.actif { background: var(--filet-fort); }
.puces { display: flex; flex-wrap: wrap; gap: 6px; }
.puce { border: 1px solid var(--filet-fort); background: var(--fond); color: var(--texte-2); border-radius: 999px; padding: 3px 11px; font-size: 13px; }
.puce:hover { color: var(--texte); border-color: var(--texte-3); }
.puce.actif { background: var(--texte); border-color: var(--texte); color: var(--fond); }
.vide { padding: 40px 12px; text-align: center; color: var(--texte-2); display: grid; gap: 4px; }
.vide p:first-child { color: var(--texte); font-weight: 500; }
.chargement { display: flex; gap: 5px; justify-content: center; padding: 30px 0; }
.chargement i { width: 6px; height: 6px; border-radius: 50%; background: var(--texte-3); animation: points 1s infinite ease-in-out; }
.chargement i:nth-child(2) { animation-delay: .15s; } .chargement i:nth-child(3) { animation-delay: .3s; }
@keyframes points { 0%, 80%, 100% { opacity: .25; transform: translateY(0); } 40% { opacity: 1; transform: translateY(-3px); } }
.erreur { color: var(--rouge); }
kbd { font: 11px var(--police); padding: 1px 5px; border: 1px solid var(--filet-fort); border-radius: 4px; color: var(--texte-3); background: var(--fond); }

/* ───────── connexion ───────── */
.connexion { min-height: 100%; display: grid; place-items: center; padding: 24px; }
.connexion form, .connexion .connexion-boite { width: min(340px, 100%); display: grid; gap: 12px; }
.connexion .marque { font-size: 22px; font-weight: 700; letter-spacing: -.02em; margin-bottom: 4px; }
.connexion .marque span { color: var(--accent); }
.connexion .btn { min-height: 40px; }

/* ───────── la coquille : barre latérale + page ───────── */
.os { display: grid; grid-template-columns: var(--barre) 1fr; min-height: 100vh; }
.barre { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; gap: 2px; padding: calc(16px + var(--haut)) 12px 14px; border-right: 1px solid var(--filet); background: var(--fond); }
.barre-marque { font-weight: 700; letter-spacing: -.02em; font-size: 15px; padding: 2px 10px 14px; }
.barre-marque span { color: var(--accent); }
.barre-recherche { display: flex; align-items: center; gap: 8px; margin: 0 0 12px; padding: 6px 10px; border: 1px solid var(--filet-fort); border-radius: var(--rayon-petit); background: var(--fond); color: var(--texte-3); text-align: left; }
.barre-recherche span { flex: 1; }
.barre-lien { display: flex; align-items: center; gap: 10px; padding: 6px 10px; border: 0; border-radius: var(--rayon-petit); background: transparent; color: var(--texte-2); font-weight: 500; text-align: left; position: relative; }
.barre-lien:hover { background: var(--fond-2); color: var(--texte); }
.barre-lien.actif { background: var(--fond-3); color: var(--texte); }
.barre-lien .compte { margin-left: auto; font-size: 11.5px; font-weight: 600; color: var(--texte-3); font-variant-numeric: tabular-nums; }
.barre-lien .compte.alerte { color: var(--rouge); }
.barre-bas { margin-top: auto; display: grid; gap: 2px; padding-top: 10px; border-top: 1px solid var(--filet); }
.barre-moi { display: flex; align-items: center; gap: 10px; }
.page { min-width: 0; padding: calc(28px + var(--haut)) 40px 120px; }
.page-centre { max-width: 760px; margin: 0 auto; }
.page-large { max-width: 1180px; margin: 0 auto; }
.page-tete { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 22px; }
.page-tete h1 { font-size: 26px; letter-spacing: -.022em; }
.page-tete .sous-titre { color: var(--texte-2); margin-top: 4px; }
.page-outils { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.maj { position: sticky; top: 0; z-index: 20; display: flex; gap: 10px; align-items: center; justify-content: center; padding: 8px 16px; background: var(--accent-doux); color: var(--accent); font-size: 13px; border: 0; width: 100%; }
.maj strong { font-weight: 600; }
.hors-ligne .barre-marque::after { content: ' · hors ligne'; color: var(--orange); font-weight: 500; font-size: 12px; }

/* ───────── listes : des lignes séparées par un filet (pas de cartes) ───────── */
.groupe { margin-top: 26px; }
.groupe:first-child { margin-top: 0; }
.groupe-titre { display: flex; align-items: baseline; gap: 8px; font-size: 12.5px; font-weight: 600; color: var(--texte-2); padding: 0 2px 8px; border-bottom: 1px solid var(--filet); }
.groupe-titre .nb { color: var(--texte-3); font-weight: 500; }
.groupe-titre.rouge { color: var(--rouge); }
.ligne { display: flex; align-items: center; gap: 12px; padding: 10px 2px; border-bottom: 1px solid var(--filet); min-height: 48px; position: relative; }
.ligne.cliquable { cursor: pointer; }
.ligne.cliquable:hover { background: linear-gradient(to right, transparent, var(--fond-2) 2%, var(--fond-2) 98%, transparent); }
.ligne-corps { flex: 1; min-width: 0; display: grid; gap: 1px; }
.ligne-titre { font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ligne-sous { color: var(--texte-2); font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ligne-fin { display: flex; align-items: center; gap: 10px; flex: none; color: var(--texte-2); font-size: 13px; }
.coche { width: 20px; height: 20px; flex: none; border: 1.5px solid var(--filet-fort); border-radius: 50%; background: var(--fond); display: grid; place-items: center; color: transparent; padding: 0; transition: all .12s; }
.coche:hover { border-color: var(--accent); }
.coche.faite { background: var(--accent); border-color: var(--accent); color: #fff; }
.coche .ic { width: 12px; height: 12px; stroke-width: 2.4; }
.pastille-icone { width: 28px; height: 28px; border-radius: 8px; display: grid; place-items: center; background: var(--fond-3); color: var(--texte-2); flex: none; }
.pastille-icone.bleu { background: var(--accent-doux); color: var(--accent); }
.pastille-icone.rouge { background: var(--rouge-doux); color: var(--rouge); }
.pastille-icone.vert { background: var(--vert-doux); color: var(--vert); }
.pastille-icone.orange { background: var(--orange-doux); color: var(--orange); }
.date { font-variant-numeric: tabular-nums; white-space: nowrap; }
.date.retard { color: var(--rouge); font-weight: 500; }
.date.jour { color: var(--accent); font-weight: 500; }

/* tableaux (dense) */
.table-zone { overflow-x: auto; }
.table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.table th { text-align: left; font-size: 12px; font-weight: 500; color: var(--texte-3); padding: 8px 10px; border-bottom: 1px solid var(--filet); white-space: nowrap; user-select: none; }
.table th button { border: 0; background: none; padding: 0; color: inherit; font: inherit; }
.table td { padding: 9px 10px; border-bottom: 1px solid var(--filet); vertical-align: middle; }
.table tr.cliquable { cursor: pointer; }
.table tr.cliquable:hover td { background: var(--fond-2); }
.table .n { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.table input, .table select { min-height: 30px !important; padding: 4px 8px !important; border-color: transparent !important; background: transparent !important; }
.table input:hover, .table select:hover { border-color: var(--filet-fort) !important; }

/* les chiffres : grands, sobres, alignés */
.chiffres { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 1px; background: var(--filet); border: 1px solid var(--filet); border-radius: var(--rayon); overflow: hidden; margin-bottom: 18px; }
.chiffre { padding: 14px 16px; display: grid; gap: 2px; align-content: start; text-align: left; border: 0; background: var(--fond); color: inherit; }
button.chiffre { cursor: pointer; }
button.chiffre:hover { background: var(--fond-2); }
.chiffre-titre { font-size: 12.5px; color: var(--texte-2); }
.chiffre-valeur { font-size: 24px; font-weight: 600; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.chiffre-detail { font-size: 12px; color: var(--texte-3); }
.chiffre.rouge .chiffre-valeur { color: var(--rouge); }
.phrase { font-size: 19px; line-height: 1.55; letter-spacing: -.01em; color: var(--texte-2); max-width: 760px; }
.phrase strong { color: var(--texte); font-weight: 600; }
.phrase .rouge { color: var(--rouge); font-weight: 600; }

/* ───────── panneaux (glissent depuis la droite) ───────── */
.panneau-fond { position: fixed; inset: 0; z-index: 60; background: rgba(17, 17, 19, 0); transition: background .16s; }
.panneau-fond.ouvert { background: rgba(17, 17, 19, .08); }
.panneau { position: absolute; top: 0; right: 0; bottom: 0; width: min(560px, 100vw); background: var(--fond); border-left: 1px solid var(--filet); box-shadow: var(--ombre-flottante); display: flex; flex-direction: column; transform: translateX(24px); opacity: 0; transition: transform .16s ease-out, opacity .16s; }
.panneau.large { width: min(720px, 100vw); }
.panneau-fond.ouvert .panneau { transform: none; opacity: 1; }
.panneau-fond.sortie .panneau { transform: translateX(24px); opacity: 0; }
.panneau-tete { display: flex; align-items: center; gap: 8px; padding: calc(12px + var(--haut)) 14px 10px 22px; border-bottom: 1px solid var(--filet); }
.panneau-titre { flex: 1; font-size: 15px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.panneau-gestes { display: flex; gap: 4px; }
.panneau-corps { flex: 1; overflow-y: auto; padding: 22px 22px calc(40px + var(--bas)); }

/* fenêtres (confirmer, petit formulaire) */
.fenetre-fond { position: fixed; inset: 0; z-index: 90; background: rgba(17, 17, 19, .28); display: grid; place-items: center; padding: 16px; animation: apparait .12s ease-out; }
.fenetre { width: min(560px, 100%); max-height: 88vh; overflow-y: auto; background: var(--fond); border-radius: 14px; box-shadow: var(--ombre-flottante); padding: 22px; display: grid; gap: 14px; animation: monte .14s ease-out; }
.fenetre.etroite { width: min(420px, 100%); }
.fenetre h3 { font-size: 16px; }
.fenetre-tete { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.fenetre-actions { display: flex; justify-content: flex-end; gap: 8px; }
@keyframes apparait { from { opacity: 0; } }
@keyframes monte { from { opacity: 0; transform: translateY(8px); } }

/* messages en bas */
.os-message { position: fixed; left: 50%; bottom: calc(84px + var(--bas)); z-index: 100; transform: translate(-50%, 16px); opacity: 0; pointer-events: none; display: flex; align-items: center; gap: 14px; max-width: min(560px, calc(100vw - 24px)); padding: 10px 14px 10px 16px; border-radius: 10px; background: var(--texte); color: var(--fond); font-size: 13.5px; box-shadow: var(--ombre-flottante); transition: all .16s; }
.os-message.visible { opacity: 1; transform: translate(-50%, 0); pointer-events: auto; }
.os-message.erreur { background: var(--rouge); color: #fff; }
.os-message button { border: 0; background: none; color: inherit; font-weight: 600; text-decoration: underline; padding: 0; white-space: nowrap; }

/* ───────── recherche universelle (⌘K) ───────── */
.commande-fond { position: fixed; inset: 0; z-index: 95; background: rgba(17, 17, 19, .2); display: flex; justify-content: center; padding: 12vh 16px 16px; animation: apparait .1s; }
.commande { width: min(620px, 100%); max-height: 64vh; display: flex; flex-direction: column; background: var(--fond); border-radius: 14px; box-shadow: var(--ombre-flottante); overflow: hidden; animation: monte .12s ease-out; }
.commande-haut { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-bottom: 1px solid var(--filet); color: var(--texte-3); }
.commande-haut input { border: 0 !important; box-shadow: none !important; padding: 0 !important; min-height: 0 !important; font-size: 16px; }
.commande-liste { overflow-y: auto; padding: 6px; }
.commande-groupe { font-size: 11.5px; font-weight: 600; color: var(--texte-3); padding: 10px 10px 4px; }
.commande-ligne { width: 100%; display: flex; align-items: center; gap: 12px; padding: 8px 10px; border: 0; border-radius: 8px; background: none; text-align: left; color: var(--texte); }
.commande-ligne.actif { background: var(--fond-3); }
.commande-ligne small { display: block; color: var(--texte-2); font-size: 12.5px; }
.commande-ligne .ic { color: var(--texte-2); }

/* ───────── Jarvis : la barre (toujours là) et le panneau (qui sait ce qu'on regarde) ───────── */
.jarvis-barre { position: fixed; left: calc(var(--barre) + (100vw - var(--barre)) / 2); bottom: calc(18px + var(--bas)); transform: translateX(-50%); z-index: 50; width: min(560px, calc(100vw - var(--barre) - 48px)); display: flex; align-items: center; gap: 10px; padding: 6px 6px 6px 14px; border: 1px solid var(--filet-fort); border-radius: 14px; background: var(--fond); box-shadow: 0 6px 24px rgba(17, 17, 19, .08); cursor: text; transition: border-color .12s, box-shadow .12s; }
.jarvis-barre:hover { border-color: var(--texte-3); }
.jarvis-barre .ic-jarvis { color: var(--accent); }
.jarvis-barre-texte { flex: 1; min-width: 0; color: var(--texte-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.jarvis-contexte { font-size: 12px; color: var(--texte-2); background: var(--fond-3); padding: 2px 8px; border-radius: 999px; max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.jarvis-barre .attente { width: 8px; height: 8px; border-radius: 50%; background: var(--accent); animation: battement 1.2s infinite; }
@keyframes battement { 50% { opacity: .3; } }
body.jarvis-ouvert .jarvis-barre { opacity: 0; pointer-events: none; }
.jarvis { position: fixed; top: 0; right: 0; bottom: 0; z-index: 70; width: min(440px, 100vw); display: flex; flex-direction: column; background: var(--fond); border-left: 1px solid var(--filet); box-shadow: var(--ombre-flottante); transform: translateX(105%); transition: transform .18s ease-out; }
body.jarvis-ouvert .jarvis { transform: none; }
.jarvis-tete { display: flex; align-items: center; gap: 10px; padding: calc(12px + var(--haut)) 12px 10px 16px; border-bottom: 1px solid var(--filet); }
.jarvis-tete strong { font-size: 15px; }
.jarvis-tete .jarvis-contexte { margin-right: auto; }
.jarvis-orbe { width: 34px; height: 34px; border: 0; padding: 0; background: none; border-radius: 50%; flex: none; }
.jarvis-orbe canvas { width: 100%; height: 100%; display: block; }
.jarvis-fil { flex: 1; overflow-y: auto; padding: 18px 18px 8px; display: grid; gap: 18px; align-content: start; }
.jarvis-accueil { display: grid; gap: 10px; padding: 8px 0 4px; }
.jarvis-accueil h3 { font-size: 20px; letter-spacing: -.02em; }
.jarvis-q { font-weight: 600; color: var(--texte); }
.jarvis-q small, .jarvis-r small { display: block; font-weight: 400; color: var(--texte-3); font-size: 12px; }
.jarvis-r { display: grid; gap: 8px; color: var(--texte); line-height: 1.55; }
.jarvis-r p { white-space: pre-wrap; }
.jarvis-r.attente { color: var(--texte-3); }
.jarvis-suites { display: flex; flex-wrap: wrap; gap: 6px; }
.jarvis-suites button { border: 1px solid var(--filet-fort); background: var(--fond); border-radius: 999px; padding: 4px 11px; font-size: 13px; color: var(--texte); }
.jarvis-suites button:hover { border-color: var(--accent); color: var(--accent); }
.jarvis-carte { border: 1px solid var(--filet); border-radius: var(--rayon); padding: 14px; display: grid; gap: 10px; background: var(--fond); }
.jarvis-carte h4 { font-size: 14px; }
.jarvis-carte.accord { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-doux); }
.jarvis-faits { display: grid; gap: 4px; font-size: 13px; }
.jarvis-fait { display: grid; grid-template-columns: 120px 1fr; gap: 10px; }
.jarvis-fait span:first-child { color: var(--texte-2); }
.jarvis-texte { white-space: pre-wrap; font-size: 13.5px; line-height: 1.55; background: var(--fond-2); border-radius: 8px; padding: 12px; max-height: 340px; overflow-y: auto; }
.jarvis-pied { border-top: 1px solid var(--filet); padding: 10px 12px calc(12px + var(--bas)); display: grid; gap: 8px; }
.jarvis-saisie { display: flex; align-items: flex-end; gap: 6px; border: 1px solid var(--filet-fort); border-radius: 12px; padding: 4px 4px 4px 12px; }
.jarvis-saisie:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-doux); }
.jarvis-saisie textarea { border: 0 !important; box-shadow: none !important; padding: 7px 0 !important; min-height: 34px !important; max-height: 160px; resize: none; }
.jarvis-envoyer { width: 32px; height: 32px; border-radius: 9px; border: 0; background: var(--texte); color: var(--fond); display: grid; place-items: center; flex: none; }
.jarvis-envoyer:disabled { opacity: .3; }
.jarvis-etat { font-size: 12px; color: var(--texte-3); min-height: 16px; }
.jarvis-voix-texte { font-size: 13px; color: var(--texte-2); }
.jarvis-mode { display: flex; gap: 6px; align-items: center; font-size: 12px; color: var(--texte-2); }
.jarvis-proposition { border: 1px dashed var(--accent); border-radius: var(--rayon); padding: 12px; display: grid; gap: 8px; }
.jarvis-proposition.appliquee { border-style: solid; border-color: var(--vert); }
.jarvis-proposition.refusee { opacity: .55; border-style: solid; border-color: var(--filet); }
.comparaison { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; font-size: 13px; }
.comparaison > div { border: 1px solid var(--filet); border-radius: 8px; padding: 8px 10px; }
.comparaison > .nouveau { border-color: var(--accent); background: var(--accent-doux); }
.comparaison p { margin: 3px 0; }
.voix-reglages { display: grid; gap: 8px; padding: 10px; border: 1px solid var(--filet); border-radius: var(--rayon); font-size: 13px; }

/* ───────── Aujourd'hui ───────── */
.salut { font-size: 28px; letter-spacing: -.025em; font-weight: 600; }
.salut-date { color: var(--texte-2); margin-top: 4px; }
.resume-jour { margin: 18px 0 26px; }
.tournee-bandeau { display: flex; align-items: center; gap: 14px; padding: 14px 16px; border: 1px solid var(--filet); border-radius: var(--rayon); margin-bottom: 26px; }
.tournee-bandeau .ligne-corps { gap: 2px; }

/* ───────── Pipeline : la bande des phases + la file d'action ───────── */
.bande { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)) 1px repeat(2, minmax(0, .8fr)); border: 1px solid var(--filet); border-radius: 12px; overflow: hidden; margin-bottom: 18px; }
.bande-sep { background: var(--filet); }
.phase { position: relative; display: grid; gap: 2px; padding: 12px 14px 12px; border: 0; background: var(--fond); text-align: left; color: var(--texte); transition: background .12s; min-width: 0; }
.phase + .phase:not(.apres-sep) { border-left: 1px solid var(--filet); }
.phase:hover { background: var(--fond-2); }
.phase.actif { background: var(--accent-doux); }
.phase.actif .phase-nom { color: var(--accent); }
.phase.survol { background: var(--accent-doux); box-shadow: inset 0 0 0 2px var(--accent); }
.phase-nom { font-size: 12.5px; color: var(--texte-2); font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.phase-nombre { font-size: 22px; font-weight: 600; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.phase-montant { font-size: 12px; color: var(--texte-3); font-variant-numeric: tabular-nums; }
.phase:not(.cote)::after { content: ''; position: absolute; left: 14px; right: 14px; bottom: 0; height: 2px; border-radius: 2px; background: var(--accent); transform: scaleX(var(--part, 0)); transform-origin: left; opacity: .5; }
.pipeline-outils { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 8px; }
.pipeline-outils .recherche { flex: 1; min-width: 200px; max-width: 340px; }
.opportunite { display: grid; grid-template-columns: 20px minmax(0, 1.5fr) minmax(0, 2fr) 96px 28px; align-items: center; gap: 12px; padding: 9px 4px; border-bottom: 1px solid var(--filet); min-height: 52px; cursor: pointer; position: relative; }
.opportunite:hover { background: var(--fond-2); }
.opportunite.arrive { animation: arrive .5s ease-out; }
@keyframes arrive { from { background: var(--accent-doux); } }
.opportunite .priorite { color: var(--texte-3); width: 20px; height: 20px; display: grid; place-items: center; border: 0; background: none; padding: 0; }
.opportunite .priorite.haute { color: #e0a400; }
.opportunite .priorite.haute .ic { fill: currentColor; }
.opp-nom { min-width: 0; }
.opp-nom strong { display: block; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.opp-nom small { color: var(--texte-2); font-size: 12.5px; display: flex; gap: 6px; align-items: center; overflow: hidden; white-space: nowrap; }
.opp-phase { color: var(--texte-3); }
.opp-action { min-width: 0; color: var(--texte-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13.5px; }
.opp-action.vide-action { color: var(--texte-3); font-style: italic; }
.opp-gestes { position: absolute; right: 44px; top: 50%; transform: translateY(-50%); display: none; gap: 4px; background: linear-gradient(to right, transparent, var(--fond-2) 14px); padding-left: 18px; }
.opportunite:hover .opp-gestes, .opportunite:focus-within .opp-gestes { display: flex; }
.opp-gestes button { border: 1px solid var(--filet-fort); background: var(--fond); border-radius: 999px; padding: 2px 10px; font-size: 12.5px; white-space: nowrap; }
.opp-gestes button:hover { border-color: var(--texte-3); }
.opp-gestes button.bon { color: var(--vert); } .opp-gestes button.mauvais { color: var(--rouge); }
.opportunite[draggable="true"] { -webkit-user-drag: element; }
.opportunite.porte { opacity: .4; }
body.glisse .phase { outline: 1px dashed var(--filet-fort); outline-offset: -4px; }

/* ───────── fiche entreprise ───────── */
.fiche-tete { display: grid; gap: 6px; margin-bottom: 18px; }
.fiche-nom { font-size: 24px; letter-spacing: -.02em; font-weight: 600; display: flex; align-items: center; gap: 8px; }
.fiche-meta { display: flex; flex-wrap: wrap; gap: 6px 14px; color: var(--texte-2); font-size: 13.5px; align-items: center; }
.fiche-meta select { width: auto; min-height: 28px; padding: 2px 8px; font-weight: 500; }
.question { border: 1px solid var(--filet); border-radius: 12px; padding: 14px; display: grid; gap: 10px; margin-bottom: 14px; }
.question-titre { font-size: 13px; font-weight: 600; }
.issues { display: flex; flex-wrap: wrap; gap: 6px; }
.issue { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border: 1px solid var(--filet-fort); border-radius: 999px; background: var(--fond); font-weight: 500; font-size: 13.5px; }
.issue:hover { border-color: var(--texte-3); }
.issue.bon { color: var(--vert); } .issue.mauvais { color: var(--rouge); } .issue.neutre { color: var(--orange); }
.issue.bon:hover { background: var(--vert-doux); } .issue.mauvais:hover { background: var(--rouge-doux); } .issue.neutre:hover { background: var(--orange-doux); }
.prochaine { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.prochaine input[type="text"] { flex: 1; min-width: 180px; }
.prochaine input[type="date"] { width: 150px; }
.actions-fiche { display: flex; flex-wrap: wrap; gap: 6px; margin: 14px 0 18px; }
.actions-fiche .btn { gap: 6px; }
.noter { display: flex; gap: 6px; align-items: flex-end; border: 1px solid var(--filet-fort); border-radius: 10px; padding: 4px 4px 4px 12px; margin-bottom: 18px; }
.noter:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-doux); }
.noter textarea { border: 0 !important; box-shadow: none !important; padding: 6px 0 !important; min-height: 32px !important; resize: none; }
.fil { display: grid; }
.evenement { display: grid; grid-template-columns: 22px 1fr; gap: 10px; padding: 9px 0; border-bottom: 1px solid var(--filet); }
.evenement:last-child { border-bottom: 0; }
.evenement-ic { color: var(--texte-3); padding-top: 1px; }
.evenement-ic.note { color: var(--accent); }
.evenement-ic.importante { color: #e0a400; }
.evenement-texte { white-space: pre-wrap; overflow-wrap: anywhere; }
.evenement-meta { font-size: 12px; color: var(--texte-3); display: flex; gap: 10px; align-items: center; }
.evenement-meta button { border: 0; background: none; padding: 0; color: var(--texte-3); font-size: 12px; }
.evenement-meta button:hover { color: var(--texte); }
.rubrique { border-top: 1px solid var(--filet); }
.rubrique:last-child { border-bottom: 1px solid var(--filet); }
.rubrique > summary { list-style: none; display: flex; align-items: center; gap: 10px; padding: 12px 0; cursor: pointer; font-weight: 500; }
.rubrique > summary::-webkit-details-marker { display: none; }
.rubrique > summary .ic-droite { margin-left: auto; color: var(--texte-3); transition: transform .14s; }
.rubrique[open] > summary .ic-droite { transform: rotate(90deg); }
.rubrique > summary .resume { color: var(--texte-3); font-weight: 400; font-size: 13px; }
.rubrique-corps { padding: 2px 0 18px; display: grid; gap: 12px; }
.sections { margin-top: 22px; }
.fichier-ligne { display: flex; align-items: center; gap: 10px; padding: 6px 0; }
.fichier-ligne img { width: 40px; height: 40px; object-fit: cover; border-radius: 6px; }
.fichier-ligne a { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.services { display: flex; flex-wrap: wrap; gap: 6px; }

/* analyse IA, audits */
.ia-entete { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; justify-content: space-between; }
.ia-partie { border-top: 1px solid var(--filet); padding: 10px 0; }
.ia-partie > summary { font-weight: 500; cursor: pointer; list-style: none; }
.ia-sorte { margin-top: 8px; }
.ia-sorte strong { font-size: 12px; color: var(--texte-2); font-weight: 600; }
.ia-sorte ul { margin: 4px 0 0; padding-left: 18px; display: grid; gap: 3px; }
.ia-sorte.hypotheses li { color: var(--texte-2); font-style: italic; }
.source-lien { font-size: 12px; }
.source-lien.douteuse { color: var(--orange); }
.audit-texte p { margin: 0 0 8px; } .audit-texte ul { margin: 0 0 8px; padding-left: 18px; }
.ordre-ligne { display: flex; align-items: center; gap: 8px; padding: 6px 0; border-bottom: 1px solid var(--filet); }

/* ───────── Agenda ───────── */
.mois { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); border-left: 1px solid var(--filet); border-top: 1px solid var(--filet); }
.mois-jour-nom { font-size: 12px; color: var(--texte-3); padding: 6px 8px; border-right: 1px solid var(--filet); border-bottom: 1px solid var(--filet); }
.case { min-height: 108px; padding: 6px; border-right: 1px solid var(--filet); border-bottom: 1px solid var(--filet); display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.case.autre { background: var(--fond-2); }
.case.autre .case-num { color: var(--texte-3); }
.case.survol { background: var(--accent-doux); }
.case-num { font-size: 12.5px; font-weight: 500; align-self: flex-start; border: 0; background: none; padding: 1px 6px; border-radius: 999px; color: var(--texte-2); }
.case.aujourdhui .case-num { background: var(--accent); color: #fff; }
.evt { display: block; width: 100%; text-align: left; border: 0; border-radius: 5px; padding: 2px 6px; font-size: 12px; background: var(--fond-3); color: var(--texte); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; border-left: 2px solid var(--texte-3); }
.evt.rdv { border-left-color: var(--accent); background: var(--accent-doux); }
.evt.relance { border-left-color: var(--orange); }
.evt.tournage { border-left-color: #7c3aed; }
.evt.publication { border-left-color: var(--vert); }
.evt.admin { border-left-color: var(--rouge); }
.evt.fait { opacity: .5; text-decoration: line-through; }
.evt-plus { font-size: 11.5px; color: var(--texte-3); padding-left: 6px; }
.semaine { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 0; border-top: 1px solid var(--filet); }
.semaine-jour { min-height: 300px; border-right: 1px solid var(--filet); padding: 8px 6px; display: flex; flex-direction: column; gap: 4px; }
.semaine-jour:first-child { border-left: 1px solid var(--filet); }
.semaine-tete { display: flex; align-items: baseline; gap: 6px; padding: 0 2px 6px; }
.semaine-tete strong { font-size: 18px; font-weight: 600; }
.semaine-jour.aujourdhui .semaine-tete strong { color: var(--accent); }
.legende { display: flex; flex-wrap: wrap; gap: 12px; font-size: 12.5px; color: var(--texte-2); }
.legende label { display: inline-flex; align-items: center; gap: 6px; }

/* ───────── Finances ───────── */
.jauge { display: block; min-width: 40px; height: 4px; border-radius: 999px; background: var(--fond-3); overflow: hidden; }
.jauge span { display: block; height: 100%; background: var(--accent); border-radius: 999px; }
.facture-lignes-edition { display: grid; gap: 6px; }
.facture-ligne-edition { display: grid; grid-template-columns: 1fr 70px 110px 28px; gap: 6px; align-items: center; }
.total { text-align: right; font-size: 15px; }
.total strong { font-size: 20px; font-weight: 600; }
.resume-facture { display: grid; gap: 4px; margin-bottom: 14px; }
.resume-facture .montant { font-size: 30px; font-weight: 600; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.alerte-douce { padding: 10px 12px; border-radius: 10px; background: var(--orange-doux); color: var(--orange); font-size: 13.5px; }
.alerte-douce .lien { color: inherit; text-decoration: underline; }
.encadre { padding: 14px 16px; border-radius: 12px; background: var(--fond-2); display: grid; gap: 10px; }

/* ───────── Fichiers ───────── */
.ariane { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; color: var(--texte-2); margin-bottom: 10px; }
.ariane button { border: 0; background: none; padding: 2px 4px; border-radius: 5px; color: var(--texte-2); }
.ariane button:hover { background: var(--fond-2); color: var(--texte); }
.ariane button:last-child { color: var(--texte); font-weight: 500; }

/* ───────── tournée (plein écran, sur le terrain) ───────── */
.tournee-fond { position: fixed; inset: 0; z-index: 80; background: var(--fond); display: flex; flex-direction: column; align-items: center; padding: calc(20px + var(--haut)) 20px calc(20px + var(--bas)); overflow-y: auto; animation: apparait .14s; }
.tournee { width: min(560px, 100%); display: grid; gap: 18px; }
.tournee-haut { display: flex; align-items: center; gap: 12px; color: var(--texte-2); font-size: 13px; }
.tournee-progression { flex: 1; display: flex; gap: 3px; }
.tournee-progression i { flex: 1; height: 3px; border-radius: 3px; background: var(--fond-3); }
.tournee-progression i.fait { background: var(--accent); }
.tournee-progression i.ici { background: var(--texte); }
.tournee h2 { font-size: 30px; letter-spacing: -.025em; }

/* ───────── téléphone et tablette ───────── */
.onglets { display: none; }
@media (max-width: 900px) {
  .os { grid-template-columns: 1fr; }
  .barre { display: none; }
  .page { padding: calc(16px + var(--haut)) 16px calc(150px + var(--bas)); }
  .page-tete h1 { font-size: 24px; }
  .jarvis-barre { left: 50%; width: calc(100vw - 24px); bottom: calc(70px + var(--bas)); }
  .onglets { display: grid; grid-template-columns: repeat(5, 1fr); position: fixed; left: 0; right: 0; bottom: 0; z-index: 55; padding: 6px 4px calc(6px + var(--bas)); background: rgba(255, 255, 255, .96); border-top: 1px solid var(--filet); -webkit-backdrop-filter: saturate(1.4) blur(12px); backdrop-filter: saturate(1.4) blur(12px); }
  body.sombre .onglets { background: rgba(15, 15, 17, .94); }
  .onglets button { display: grid; justify-items: center; gap: 2px; border: 0; background: none; color: var(--texte-3); font-size: 10.5px; font-weight: 500; padding: 4px 0; }
  .onglets button.actif { color: var(--texte); }
  .onglets button.jarvis-onglet { color: var(--accent); }
  .panneau, .panneau.large { width: 100vw; }
  .jarvis { width: 100vw; }
  .os-message { bottom: calc(132px + var(--bas)); }
  .deux, .trois { grid-template-columns: 1fr; }
  .bande { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .bande-sep { display: none; }
  .phase { border-top: 1px solid var(--filet); }
  .phase:nth-child(-n+3) { border-top: 0; }
  .phase + .phase:not(.apres-sep) { border-left: 0; }
  .phase:not(:nth-child(3n+1)) { border-left: 1px solid var(--filet) !important; }
  .opportunite { grid-template-columns: 20px minmax(0, 1fr) 76px; }
  .opp-action, .opportunite > .avatar { display: none; }
  .opp-gestes { display: none !important; }
  .mois .evt { font-size: 10.5px; padding: 1px 3px; }
  .case { min-height: 72px; padding: 3px; }
  .semaine { grid-template-columns: 1fr; }
  .semaine-jour { min-height: 0; border-left: 1px solid var(--filet); border-bottom: 1px solid var(--filet); }
  .chiffre-valeur { font-size: 20px; }
  .chiffres { grid-template-columns: 1fr 1fr; }
  .chiffre + .chiffre { padding-left: 0; border-left: 0; }
  .chiffre:nth-child(even) { padding-left: 14px; border-left: 1px solid var(--filet); }
  .facture-ligne-edition { grid-template-columns: 1fr 52px 80px 24px; }
  .comparaison { grid-template-columns: 1fr; }
  .cache-mobile { display: none !important; }
}
@media (min-width: 901px) and (max-width: 1180px) {
  :root { --barre: 200px; }
  .page { padding-left: 28px; padding-right: 28px; }
}

/* ───────── documents imprimés : proposition, audit, facture ───────── */
.doc-fond { position: fixed; inset: 0; z-index: 98; overflow-y: auto; padding: 16px; background: rgba(17, 17, 19, .55); }
.doc-outils { max-width: 794px; margin: 0 auto 12px; display: flex; flex-wrap: wrap; gap: 10px; align-items: center; color: #e4e4e7; font-size: 13px; }
@media print {
  @page { size: A4; margin: 14mm; }
  body > *:not(.doc-fond) { display: none !important; }
  body { background: #fff !important; }
  .doc-fond { position: static; padding: 0; background: none; overflow: visible; }
  .doc-outils { display: none; }
  .proposition { box-shadow: none; padding: 0; max-width: none; border-radius: 0; }
  .proposition-contenu li { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}
.proposition { max-width: 794px; margin: 0 auto; padding: 56px 60px; background: #fff; color: #18181b; border-radius: 6px; box-shadow: 0 30px 80px rgba(0, 0, 0, .4); font-size: 14.5px; line-height: 1.55; }
.proposition-tete { display: flex; justify-content: space-between; gap: 20px; padding-bottom: 22px; border-bottom: 3px solid #18181b; }
.proposition-marque { font-size: 28px; font-weight: 900; letter-spacing: -.03em; }
.proposition-marque span { color: var(--marque); }
.proposition-tete p { font-size: 12.5px; color: #71717a; }
.proposition-ref { display: flex; flex-direction: column; align-items: flex-end; font-size: 12.5px; color: #52525b; }
.proposition-ref strong { font-size: 15px; color: #18181b; text-transform: uppercase; letter-spacing: .08em; }
.proposition-client { margin: 26px 0 8px; display: flex; flex-direction: column; }
.proposition-client span { font-size: 11.5px; text-transform: uppercase; letter-spacing: .12em; color: #a1a1aa; font-weight: 700; }
.proposition-client strong { font-size: 18px; }
.proposition-client p { color: #52525b; }
.proposition h1 { font-size: 24px; letter-spacing: -.02em; margin: 22px 0 14px; }
.proposition h2 { font-size: 13px; text-transform: uppercase; letter-spacing: .1em; color: #71717a; margin-bottom: 8px; }
.proposition-contenu ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; }
.proposition-contenu li { padding: 10px 14px 10px 36px; border-radius: 8px; background: #f4f4f5; position: relative; }
.proposition-contenu li::before { content: '✓'; position: absolute; left: 14px; color: var(--marque); font-weight: 900; }
.proposition-prix { width: 100%; margin: 24px 0; border-collapse: collapse; }
.proposition-prix th, .proposition-prix td { padding: 11px 0; border-bottom: 1px solid #e4e4e7; text-align: left; }
.proposition-prix td { text-align: right; font-weight: 800; font-size: 16px; }
.proposition-prix tr:first-child td { color: var(--marque); font-size: 20px; }
.proposition-notes p { white-space: pre-wrap; color: #3f3f46; }
.proposition-accord { margin-top: 36px; display: grid; grid-template-columns: 1fr 1.3fr; gap: 20px; align-items: end; }
.proposition-accord p { font-size: 12.5px; color: #71717a; }
.proposition-cadre { height: 110px; border: 1.5px dashed #a1a1aa; border-radius: 8px; }
.audit { max-width: 794px; margin: 0 auto 24px; background: #fff; color: #18181b; font-family: var(--audit-police); border-radius: 14px; overflow: hidden; box-shadow: 0 20px 60px rgba(0, 0, 0, .35); }
.audit-couverture { min-height: 1000px; display: flex; flex-direction: column; justify-content: space-between; gap: 40px; padding: 56px; }
.couverture-pleine .audit-couverture { background: var(--audit-c1); color: #fff; }
.couverture-sobre .audit-couverture { background: #fff; border-top: 16px solid var(--audit-c1); }
.audit-marques { display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.audit-logo { max-height: 64px; max-width: 220px; object-fit: contain; }
.couverture-pleine .audit-logo { background: #fff; padding: 8px 12px; border-radius: 10px; }
.couverture-pleine .proposition-marque, .couverture-pleine .proposition-marque span { color: #fff; }
.audit-titre small { text-transform: uppercase; letter-spacing: .14em; font-size: 13px; font-weight: 700; opacity: .85; }
.audit-titre h1 { font-size: 46px; line-height: 1.1; margin: 12px 0 16px; }
.couverture-sobre .audit-titre h1 { color: var(--audit-c2); }
.audit-titre p { font-size: 19px; line-height: 1.45; max-width: 560px; margin: 0; opacity: .95; }
.audit-pied { font-size: 13px; opacity: .85; margin: 0; }
.audit-partie { padding: 36px 56px 8px; }
.audit-partie h2 { color: var(--audit-c2); font-size: 22px; margin: 0 0 14px; padding-bottom: 10px; border-bottom: 3px solid var(--audit-c1); }
.audit-partie h2 span { color: var(--audit-c1); margin-right: 12px; }
.audit-partie p { line-height: 1.6; margin: 0 0 12px; font-size: 15px; }
.audit-partie ul { margin: 0 0 14px; padding-left: 20px; display: grid; gap: 6px; font-size: 15px; line-height: 1.5; }
.audit-partie li::marker { color: var(--audit-c1); }
.audit-partie:last-child { padding-bottom: 48px; }
@media (max-width: 700px) {
  .audit-couverture { min-height: 600px; padding: 32px 24px; }
  .audit-titre h1 { font-size: 34px; }
  .audit-partie { padding: 28px 24px 4px; }
}
@media print {
  .audit { box-shadow: none; border-radius: 0; max-width: none; margin: 0; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .audit-couverture { min-height: 265mm; break-after: page; }
  .audit-partie { padding: 18px 0 4px; break-inside: auto; }
  .audit-partie h2 { break-after: avoid; }
}
.facture-lignes { width: 100%; border-collapse: collapse; margin: 10px 0 16px; font-size: 14px; }
.facture-lignes th { text-align: left; border-bottom: 2px solid #18181b; padding: 8px 6px; font-size: 12.5px; }
.facture-lignes td { border-bottom: 1px solid #e4e4e7; padding: 8px 6px; }
.facture-lignes th:not(:first-child), .facture-lignes td:not(:first-child) { text-align: right; white-space: nowrap; }
.facture-mentions { margin-top: 18px; font-size: 12px; color: #52525b; display: grid; gap: 4px; }
.facture-mentions p { margin: 0; }
.champ-mdp { position: relative; display: block; }
.champ-mdp input { width: 100%; padding-right: 84px; }
.champ-mdp .lien { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); font-size: 13px; }

/* ───────── compléments : agenda, réglages, chronologie ───────── */
.chiffre.orange .chiffre-valeur { color: var(--orange); }
.chiffre.choisi .chiffre-titre { color: var(--accent); font-weight: 600; }
.jauge.rouge > span { background: var(--rouge); }
.jauge.orange > span { background: var(--orange); }
.segments.defilant { max-width: 100%; overflow-x: auto; scrollbar-width: none; }
.segments.defilant::-webkit-scrollbar { display: none; }
.icone-btn.actif, .icone-btn.actif-etoile { color: #e0a400; }
.icone-btn.actif-etoile .ic { fill: currentColor; }
.icone-btn.accent { background: var(--accent); color: #fff; }
.icone-btn.accent:hover { background: var(--accent); filter: brightness(1.08); color: #fff; }
.puce.suggestion { display: inline-flex; align-items: center; gap: 4px; border-style: dashed; color: var(--accent); }
.puce .point, .point { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 6px; vertical-align: 0; background: var(--texte-3); }
.point.tache { background: var(--texte-2); } .point.tournage { background: #7c3aed; } .point.publication { background: var(--vert); } .point.rdv { background: var(--accent); }
.point.relance { background: var(--orange); } .point.facture, .point.charge, .point.devis { background: var(--rouge); }
.puce.sorte:not(.actif-doux) { color: var(--texte-3); text-decoration: line-through; }
.pipeline-outils .bande-sep { width: 1px; height: 20px; background: var(--filet-fort); margin: 0 4px; }
.zone-liste { min-height: 40px; }
.chronologie { display: grid; }
.carte-zone { position: relative; height: calc(100dvh - 190px); min-height: 420px; border: 1px solid var(--filet); border-radius: var(--rayon); overflow: hidden; }

/* agenda */
.evt.long { display: flex; align-items: center; gap: 8px; white-space: normal; padding: 6px 8px; border-radius: 7px; font-size: 13px; }
.evt.long .evt-corps { flex: 1; min-width: 0; display: grid; gap: 1px; }
.evt-titre { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 500; }
.evt-sous { font-size: 11.5px; color: var(--texte-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.evt-heure { color: var(--texte-2); margin-right: 4px; font-variant-numeric: tabular-nums; }
.evt.retard { box-shadow: inset 0 0 0 1px var(--rouge-doux); }
.evt.retard .evt-sous { color: var(--rouge); }
.evt.conflit { box-shadow: inset 0 0 0 1px var(--orange); }
.evt[draggable="true"] { cursor: grab; }
.evt:hover { filter: brightness(.97); }
body.sombre .evt:hover { filter: brightness(1.15); }
.pile-evt { display: grid; gap: 4px; }
.rond-personne { flex: none; width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; font-size: 10.5px; font-weight: 600; color: #fff; background: var(--texte-3); }
.rond-personne.libre { background: var(--fond); color: var(--texte-3); border: 1px dashed var(--texte-3); }
.semaine-jour { position: relative; }
.semaine-jour.passe:not(.aujourdhui) { background: var(--fond-2); }
.semaine-jour.survol { background: var(--accent-doux); }
.semaine-tete { border: 0; background: none; text-align: left; color: inherit; width: 100%; }
.ajout-jour { margin-top: auto; align-self: center; border: 1px dashed transparent; background: none; color: var(--texte-3); border-radius: 6px; width: 100%; height: 28px; display: grid; place-items: center; opacity: 0; transition: opacity .12s; }
.semaine-jour:hover .ajout-jour, .ajout-jour:focus-visible { opacity: 1; border-color: var(--filet-fort); }

/* réglages */
.reglages { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 36px; align-items: start; }
.reglages-nav { position: sticky; top: 16px; display: grid; gap: 14px; }
.reglages-nav > div { display: grid; gap: 1px; }
.reglages-groupe { font-size: 11.5px; text-transform: uppercase; letter-spacing: .06em; color: var(--texte-3); padding: 0 10px 4px; }
.reglages-nav button { display: flex; align-items: center; gap: 10px; border: 0; background: none; text-align: left; padding: 7px 10px; border-radius: 7px; color: var(--texte-2); }
.reglages-nav button:hover { background: var(--fond-2); color: var(--texte); }
.reglages-nav button.actif { background: var(--fond-3); color: var(--texte); font-weight: 500; }
.reglages-titre { font-size: 18px; font-weight: 600; margin-bottom: 14px; }
.reglages-contenu { display: grid; gap: 16px; max-width: 720px; }
kbd { font-family: inherit; font-size: 12px; padding: 1px 6px; border: 1px solid var(--filet-fort); border-radius: 5px; background: var(--fond); min-width: 64px; text-align: center; }
@media (max-width: 900px) {
  .reglages { grid-template-columns: 1fr; gap: 16px; }
  .reglages-nav { position: static; display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; }
  .reglages-nav > div { display: flex; gap: 4px; }
  .reglages-groupe { display: none; }
  .reglages-nav button { white-space: nowrap; border: 1px solid var(--filet); }
  .cache-mobile { display: none; }
  .carte-zone { height: calc(100dvh - 230px); }
}
.table td { white-space: nowrap; max-width: 280px; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 1100px) { .table .cache-mobile { display: none; } }
/* téléphone : filtres repliés derrière « Filtres », note sur deux lignes, titres sur deux lignes */
.seulement-mobile { display: none; }
@media (max-width: 700px) {
  .seulement-mobile { display: inline-flex; }
  .replie:not(.ouvert) > select, .replie:not(.ouvert) > .puce:not(.toujours), .replie:not(.ouvert) > .bande-sep, .replie:not(.ouvert) > .lien { display: none; }
  .noter { flex-wrap: wrap; padding: 6px 6px 6px 12px; }
  .noter textarea { flex: 1 0 100%; }
  .noter select { margin-right: auto; }
  .ligne-titre { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
}
.prochaine input[type="date"] { flex: 0 0 160px; width: 160px; }
@media (max-width: 1180px) { .semaine { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); } .semaine-jour { min-height: 180px; border-left: 1px solid var(--filet); border-bottom: 1px solid var(--filet); } }
.facture-lignes-edition + .lien { display: inline-block; }

/* ───────── messages d'équipe ───────── */
body[data-ecran="messages"] .page { padding: 0; height: 100dvh; overflow: hidden; }
body[data-ecran="messages"] .page > div { height: 100%; }
.messagerie { display: grid; grid-template-columns: 320px minmax(0, 1fr); height: 100%; }
.groupes { border-right: 1px solid var(--filet); overflow-y: auto; padding: calc(24px + var(--haut)) 12px 90px; }
.groupes-tete { display: flex; align-items: center; justify-content: space-between; padding: 0 8px 12px; }
.groupes-tete h1 { font-size: 22px; }
.groupe-ligne { display: flex; gap: 10px; align-items: center; width: 100%; border: 0; background: none; text-align: left; padding: 9px 8px; border-radius: 9px; color: inherit; }
.groupe-ligne:hover { background: var(--fond-2); }
.groupe-ligne.actif { background: var(--fond-3); }
.groupe-ligne.non-lu .ligne-titre, .groupe-ligne.non-lu .ligne-sous { color: var(--texte); font-weight: 600; }
.groupe-ligne.range { opacity: .65; }
.groupe-icone { flex: none; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; background: var(--fond-3); color: var(--texte-2); overflow: hidden; }
.groupe-fin { display: grid; justify-items: end; gap: 3px; flex: none; }
.conversation { display: flex; flex-direction: column; min-width: 0; min-height: 0; }
.conversation > .vide { margin: auto; }
.conversation-tete { display: flex; align-items: center; gap: 10px; padding: calc(16px + var(--haut)) 24px 12px; border-bottom: 1px solid var(--filet); }
.conversation-tete strong { font-size: 16px; font-weight: 600; }
.membres-mini { display: flex; align-items: center; gap: 2px; }
.membres-mini .avatar { margin-right: -4px; border: 2px solid var(--fond); }
.fil-messages { flex: 1; overflow-y: auto; padding: 18px 24px; display: flex; flex-direction: column; gap: 2px; }
.jour-separateur { align-self: center; font-size: 12px; color: var(--texte-3); margin: 14px 0 8px; }
.jour-separateur::first-letter { text-transform: uppercase; }
.bulle { display: flex; gap: 8px; align-items: flex-end; max-width: min(620px, 82%); margin-top: 8px; }
.bulle.suite { margin-top: 0; padding-left: 36px; }
.bulle.moi { align-self: flex-end; flex-direction: row-reverse; }
.bulle.moi.suite { padding-left: 0; }
.bulle-corps { background: var(--fond-2); border-radius: 14px; padding: 7px 12px 6px; display: grid; gap: 1px; min-width: 0; }
.bulle.moi .bulle-corps { background: var(--accent); color: #fff; }
.bulle-auteur { font-size: 12px; font-weight: 600; color: var(--texte-2); }
.bulle-texte { white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.45; }
.bulle-heure { font-size: 10.5px; opacity: .6; justify-self: end; }
.vu-par { align-self: flex-end; font-size: 11.5px; color: var(--texte-3); margin-top: 3px; }
.composer { display: flex; gap: 8px; align-items: flex-end; padding: 10px 24px calc(14px + var(--bas)); border-top: 1px solid var(--filet); }
/* sur l'écran Messages, on écrit à l'équipe : la barre de Jarvis s'efface (⌘J l'ouvre toujours) */
body[data-ecran="messages"] .jarvis-barre { display: none; }
.composer textarea { flex: 1; resize: none; min-height: 40px; max-height: 160px; border-radius: 20px; padding: 9px 14px; }
.avatar.photo { object-fit: cover; padding: 0; background: var(--fond-3); }
@media (max-width: 900px) {
  body[data-ecran="messages"] .page { height: calc(100dvh - 64px - var(--bas)); }
  .composer { padding-bottom: 12px; }
}
@media (max-width: 760px) {
  .messagerie { grid-template-columns: 1fr; }
  .messagerie.conversation-ouverte .groupes, .messagerie:not(.conversation-ouverte) .conversation { display: none; }
  .groupes { border-right: 0; }
  .conversation-tete, .fil-messages { padding-left: 14px; padding-right: 14px; }
  .composer { padding: 10px 14px 12px; }
}