:root {
  --fond: #f4f6f8;
  --carte: #ffffff;
  --texte: #1b2430;
  --discret: #5b6776;
  --accent: #0b5fa5;
  --accent-texte: #ffffff;
  --bordure: #d5dbe3;
  --erreur: #b3261e;
  --ok: #1b7f3b;
}
@media (prefers-color-scheme: dark) {
  :root {
    --fond: #11161c;
    --carte: #1b232c;
    --texte: #e8edf2;
    --discret: #9aa7b5;
    --accent: #4da3e8;
    --accent-texte: #07121d;
    --bordure: #2e3945;
    --erreur: #ff8a80;
    --ok: #6fd08c;
  }
}
* { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--fond);
  color: var(--texte);
  font: 16px/1.45 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
main { max-width: 640px; margin: 0 auto; padding: 16px; }
h1 { font-size: 1.35rem; margin: 8px 0 16px; }
h2 { font-size: 1.1rem; margin: 20px 0 8px; }
.carte { background: var(--carte); border: 1px solid var(--bordure); border-radius: 12px; padding: 16px; margin-bottom: 16px; }
label { display: block; font-weight: 600; margin: 12px 0 4px; }
input, select, button { font: inherit; }
input, select {
  width: 100%; min-height: 44px; padding: 8px 12px;
  border: 1px solid var(--bordure); border-radius: 8px;
  background: var(--fond); color: var(--texte);
}
button, .bouton {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 44px; padding: 8px 16px; border: 0; border-radius: 8px;
  background: var(--accent); color: var(--accent-texte); font-weight: 600; cursor: pointer; text-decoration: none;
}
button.secondaire { background: transparent; color: var(--accent); border: 1px solid var(--accent); }
button.plein { width: 100%; margin-top: 16px; }
.projet {
  display: block; width: 100%; text-align: left; margin: 8px 0; padding: 14px 16px; min-height: 56px;
  background: var(--carte); color: var(--texte); border: 2px solid var(--bordure); border-radius: 12px;
}
.projet[aria-pressed="true"] { border-color: var(--accent); }
.projet small { display: block; color: var(--discret); font-weight: 400; }
.message { min-height: 1.4em; margin-top: 12px; }
.message.erreur { color: var(--erreur); }
.message.ok { color: var(--ok); }
.discret { color: var(--discret); }
.entete { display: flex; justify-content: space-between; align-items: center; gap: 8px; flex-wrap: wrap; }
.onglets { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.onglets button[aria-selected="true"] { background: var(--accent); color: var(--accent-texte); }
.onglets button { background: transparent; color: var(--accent); border: 1px solid var(--accent); }
ul.liste { list-style: none; padding: 0; margin: 0; }
ul.liste li { padding: 10px 0; border-bottom: 1px solid var(--bordure); }
ul.liste li:last-child { border-bottom: 0; }
.etiquette { display: inline-block; padding: 2px 8px; border-radius: 999px; border: 1px solid var(--bordure); font-size: .8rem; color: var(--discret); margin-left: 6px; }
.cache { display: none !important; }

.marque { text-align: center; margin-bottom: 12px; }
.marque-nom { font-size: 1.1rem; font-weight: 600; margin-bottom: 8px; }
.badge-proto { display: inline-flex; align-items: center; gap: 6px; padding: 4px 12px; border: 1px solid var(--bordure); border-radius: 999px; font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.08em; }
.icone-proto { flex: none; }


/* ---- poste de travail (administrateurs, ingenieurs) ; les techniciens restent en mobile ---- */
.bureau main { max-width: 1200px; }
.deux-colonnes { display: block; }
@media (min-width: 1100px) {
  .bureau .deux-colonnes { display: grid; grid-template-columns: minmax(320px, 1fr) 2fr; gap: 16px; align-items: start; }
}
.panneau-recherche { margin-bottom: 12px; padding: 12px; border: 1px dashed var(--bordure); border-radius: 8px; }
.panneau-recherche .ligne { display: flex; gap: 8px; flex-wrap: wrap; }
.panneau-recherche .ligne input { flex: 1; min-width: 200px; }
button.resultat { width: 100%; text-align: left; background: transparent; color: var(--texte); border: 1px solid var(--bordure); margin-top: 6px; }
button.resultat:hover { border-color: var(--accent); }
h3 { font-size: 1rem; margin: 16px 0 6px; }
h4 { font-size: .95rem; margin: 10px 0 2px; color: var(--discret); }

.logo-stantec { display: block; margin: 0 auto 12px; max-width: 220px; width: 100%; height: auto; background: #fff; padding: 8px; border-radius: 8px; }

.ligne-google { display: flex; gap: 8px; align-items: stretch; }
.ligne-google input { flex: 1; min-width: 0; }
.bouton-google { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 44px; background: transparent; color: var(--accent); border: 1px solid var(--accent); border-radius: 8px; padding: 0; }
.bouton-google[aria-expanded=true] { background: var(--accent); color: var(--accent-texte); }


#sms-chantier:empty { display: none; }

/* Sections du projet (onglets, vignettes) */
.onglets { display: flex; gap: 6px; flex-wrap: wrap; margin: 12px 0; }
.onglet { flex: 1 1 auto; min-height: 44px; padding: 8px 12px; border: 1px solid #b8c2cc; border-radius: 8px; background: #fff; font: inherit; cursor: pointer; }
.onglet[aria-selected="true"] { background: #0b5c8a; border-color: #0b5c8a; color: #fff; font-weight: 600; }
.vignette { max-width: 160px; max-height: 120px; border-radius: 6px; margin: 6px 0; display: block; }
.vignette.grande { max-width: 100%; max-height: 320px; }
#sections-projet textarea { width: 100%; box-sizing: border-box; }
#sections-projet audio { width: 100%; max-width: 360px; }
#sections-projet .ligne { display: flex; gap: 8px; flex-wrap: wrap; margin: 8px 0; }


/* Reponses aux textos : boutons au format du doigt, discrets */
.texto-tete { cursor: pointer; padding: 4px 0; }
.texto-tete[aria-expanded="true"] { border-left: 3px solid #0b5c8a; padding-left: 8px; }
.texto.sortant { text-align: right; color: #0b5c8a; }
.reponse { margin: 6px 0 10px; }
.rapides { display: flex; flex-wrap: wrap; gap: 6px; }
.rapide { min-height: 44px; min-width: 44px; padding: 0 14px; border: 1px solid #0b5c8a; border-radius: 22px; background: #fff; color: #0b5c8a; font: inherit; font-size: 0.95rem; cursor: pointer; }
.rapide:disabled { opacity: 0.5; }
.plein-rapide { background: #0b5c8a; color: #fff; }
.ligne.libre { display: flex; gap: 6px; margin-top: 6px; align-items: center; }
.ligne.libre input { flex: 1; min-height: 44px; margin: 0; }
details.reglage { margin-top: 12px; }
details.reglage summary { cursor: pointer; min-height: 44px; display: flex; align-items: center; font-size: 0.9rem; color: #0b5c8a; }


/* Galerie de photos */
.grille-photos { display: flex; flex-wrap: wrap; gap: 10px; margin: 6px 0 12px; }
.photo { margin: 0; max-width: 170px; }
.photo figcaption { font-size: 0.8rem; word-break: break-word; }
#galerie summary { cursor: pointer; min-height: 44px; display: flex; align-items: center; }
#galerie h4 { margin: 10px 0 0; }


/* Effacer : discret, rouge, au format du doigt */
.rapide.effacer { border-color: #b3261e; color: #b3261e; min-height: 44px; font-size: 0.85rem; margin-top: 4px; }


/* Un projet ouvert : la liste des projets et l'entete se replient pour laisser la place au projet ; la fleche ramene a la liste. */
.entete-projet { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.entete-projet h2 { margin: 0; font-size: 1.05rem; flex: 1; min-width: 0; overflow-wrap: anywhere; }
.retour { flex: none; min-width: 44px; min-height: 44px; padding: 0 12px; font-size: 1.4rem; line-height: 1; }
#accueil.en-projet #bonjour, #accueil.en-projet #role-site, #accueil.en-projet #alertes-texto, #accueil.en-projet #carte-projets { display: none; }

/* Historique des textos en conversation */
.conv-choix { display: flex; align-items: center; gap: 10px; margin: 0 0 12px; }
.conv-choix label { margin: 0; font-weight: 600; }
.conv-choix select { flex: 1; min-width: 0; }
.conv { list-style: none; margin: 0; padding: 0 0 24px; display: flex; flex-direction: column; max-width: 720px; }
.conv-jour { align-self: center; margin: 18px 0 8px; padding: 3px 12px; border-radius: 12px; background: var(--bordure); color: var(--discret); font-size: 0.8rem; font-weight: 600; }
.conv-tete { margin: 14px 4px 6px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; font-size: 0.85rem; color: var(--discret); }
.conv-tete strong { color: var(--texte); font-size: 0.95rem; }
.conv-projet { padding: 1px 8px; border: 1px solid var(--bordure); border-radius: 10px; font-size: 0.75rem; }
.conv-ligne { display: flex; margin: 8px 0 0; }
.conv-ligne.conv-suite { margin-top: 3px; }
.conv-entrant { justify-content: flex-start; }
.conv-sortant { justify-content: flex-end; }
.conv-bulle { max-width: 82%; padding: 8px 12px 6px; border-radius: 18px; line-height: 1.35; overflow-wrap: anywhere; white-space: pre-wrap; }
.conv-entrant .conv-bulle { background: var(--carte); color: var(--texte); border: 1px solid var(--bordure); border-bottom-left-radius: 5px; }
.conv-sortant .conv-bulle { background: var(--accent); color: var(--accent-texte); border-bottom-right-radius: 5px; }
.conv-texte { display: block; }
.conv-heure { display: block; margin-top: 2px; font-size: 0.7rem; opacity: 0.7; text-align: right; }

/* Enregistrement vocal en cours : impossible a manquer */
.enregistre { border: 2px solid #c62828; border-radius: 10px; padding: 10px; background: #fdecea; }
.enregistre > button:first-child { background: #c62828; border-color: #c62828; color: #fff; font-weight: 700; }
.enregistre .message { color: #b71c1c; font-weight: 700; font-size: 1.2rem; }
.enregistre .message::before { content: ""; display: inline-block; width: .8em; height: .8em; margin-right: .5em; border-radius: 50%; background: #c62828; animation: pouls 1s infinite; }
@keyframes pouls { 50% { opacity: .15; } }
@media (prefers-reduced-motion: reduce) { .enregistre .message::before { animation: none; } }

/* Alertes de texto non activees : bandeau impossible a manquer */
.bandeau-alerte { border: 2px solid #e65100; border-radius: 10px; padding: 12px; background: #fff3e0; margin: 10px 0; }
.bandeau-alerte strong { color: #bf360c; display: block; margin-bottom: 4px; }
.bandeau-alerte button { background: #e65100; border-color: #e65100; color: #fff; font-weight: 700; }

/* Periode de travail */
.periode-info { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 4px 0 12px; }
.bandeau-periode { border: 2px solid #2b5ca8; border-radius: 10px; padding: 12px; background: #eef4fc; margin: 10px 0; }
.bandeau-periode input[type="time"] { font-size: 1.3rem; padding: 8px; }

.bandeau-periode input[type="time"] { width: 100%; box-sizing: border-box; }
.bandeau-periode .ligne { gap: 10px; }
.bandeau-periode button { margin-top: 8px; }
.bandeau-periode { overflow: hidden; }

.qui-est-ce { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.75rem; padding-top: 0.75rem; border-top: 1px solid #d5dbe3; }
.qui-est-ce select, .qui-est-ce input { width: 100%; }

.correction { margin-top: 0.5rem; }
.correction textarea, .correction input { width: 100%; margin-top: 0.4rem; }
.correction-histo { border-left: 3px solid #d5dbe3; padding-left: 0.6rem; margin: 0.5rem 0; }
.correction-texte { white-space: pre-wrap; }
.correction-pastille { background: none; border: 1px solid #8a94a3; border-radius: 0.6rem; font-size: 0.75rem; padding: 0 0.4rem; margin-left: 0.4rem; cursor: pointer; }
.conv-quart { align-self: stretch; text-align: center; border-radius: 6px; background: var(--bordure); color: var(--texte); }

.marque-badge { padding: 2px 10px; border: 2px solid var(--accent); border-radius: 6px; color: var(--accent); font-weight: 800; font-size: 0.8rem; letter-spacing: 0.18em; }
.marque-texte { color: var(--discret); font-size: 0.85rem; letter-spacing: 0.04em; }
.marque-logo { height: 28px; width: auto; background: #fff; padding: 2px 8px; border-radius: 6px; }
.retour-projet { display: inline-block; padding: 10px 14px; border: 1px solid var(--accent); border-radius: 8px; color: var(--accent); text-decoration: none; font-weight: 600; }

/* Projet ouvert : barre du haut cachee (retour par la fleche) et blocs resserres pour que tout tienne a l'ecran */
@media (max-width: 767px) { body.en-projet #barre { display: none; } body.en-projet.a-coque main { padding-bottom: 8px; } }
body.en-projet main { padding-top: 8px; padding-bottom: 8px; }
body.en-projet #projet-actif { padding: 12px; margin-bottom: 8px; }
body.en-projet #projet-actif h2 { font-size: 1.1rem; margin: 0; }
body.en-projet .periode-info { gap: 6px 8px; margin: 4px 0 8px; }
body.en-projet .periode-info > strong { flex: 1 1 100%; font-size: 1rem; }
body.en-projet .periode-info button { min-height: 40px; padding: 4px 12px; font-size: .95rem; }
body.en-projet .periode-info a.discret { font-size: .9rem; padding: 2px 0; }
body.en-projet .periode-info p { margin: 0; flex: 1 1 100%; font-size: .85rem; line-height: 1.3; }
body.en-projet .onglets { display: grid; grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); gap: 6px; margin: 8px 0; }
body.en-projet .onglet { min-height: 40px; padding: 4px 6px; }
/* Visionneuse de documents (PDF, images) */
body.visionneuse-ouverte { overflow: hidden; }
.visionneuse { position: fixed; inset: 0; z-index: 1000; display: flex; flex-direction: column; background: #101418; color: #fff; }
.visionneuse-haut, .visionneuse-bas { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 12px; background: #1b222a; }
.visionneuse-bas { justify-content: center; }
.visionneuse-titre { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.visionneuse-corps { flex: 1; min-height: 0; overflow: auto; display: flex; align-items: flex-start; justify-content: center; }
.visionneuse-pdf { width: 100%; height: 100%; border: 0; background: #fff; }
.visionneuse-image { max-width: 100%; height: auto; margin: auto; }
.visionneuse button.secondaire, .visionneuse a.secondaire { background: #fff; }
.a-classer { border: 1px solid var(--accent); border-radius: 8px; padding: 8px 12px; margin-bottom: 12px; }
/* Visionneuse : gros boutons de retour, faciles a toucher */
.visionneuse-haut { justify-content: flex-start; }
.visionneuse-retour { min-height: 48px; padding: 8px 18px; font-size: 1.05rem; background: #fff; color: #0b5c8a; flex: none; }
.visionneuse-fermer { min-height: 48px; padding: 8px 18px; background: #fff; color: #0b5c8a; }
.visionneuse-bas { gap: 10px; }
/* Courriel de planification tel que recu */
.courriel-recu { margin: 8px 0; border: 1px solid var(--bordure); border-radius: 8px; padding: 8px 12px; }
.courriel-recu summary { cursor: pointer; font-weight: 600; min-height: 32px; }
.courriel-texte { white-space: pre-wrap; overflow-wrap: anywhere; margin-top: 8px; line-height: 1.45; max-height: 60vh; overflow: auto; }
/* Visionneuse PDF dessinee par pdf.js : pages empilees, defilement par la zone du corps */
.visionneuse-pdfpages { display: flex; flex-direction: column; align-items: center; gap: 8px; width: 100%; padding: 4px; }
.visionneuse-page { background: #fff; max-width: 100%; box-shadow: 0 1px 4px rgba(0,0,0,.5); }
.visionneuse-note { color: #fff; padding: 16px; }
.texto-modif textarea { width: 100%; box-sizing: border-box; margin-top: 0.4rem; }
.texto-modif button { margin: 0.4rem 0.4rem 0 0; }
.correction-avant del { color: #b00020; }
.correction-apres { margin-top: 0.2rem; }
.correction-initiales { display: inline-block; background: #0b5c8a; color: #fff; border-radius: 0.6rem; font-size: 0.75rem; padding: 0 0.45rem; margin-right: 0.4rem; }
.correction-meta { font-size: 0.8rem; }

/* ================= Coque de navigation (une seule, sur toutes les pages) ================= */
:root { --largeur-lateral: 260px; --survol: color-mix(in srgb, var(--accent) 8%, transparent); --selection: color-mix(in srgb, var(--accent) 14%, transparent); }
:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
.coque-marque { display: flex; align-items: center; gap: 10px; }
.coque-titre { color: var(--discret); font-size: .85rem; }
.coque-identite { display: flex; flex-direction: column; line-height: 1.3; margin-bottom: 8px; }
.nav-groupe { display: flex; flex-direction: column; gap: 2px; margin-top: 16px; }
.nav-groupe-titre { color: var(--discret); font-size: .8rem; font-weight: 600; padding: 0 12px 4px; }
.nav-lien { display: flex; align-items: center; gap: 12px; min-height: 44px; padding: 8px 12px; border-radius: 8px; color: var(--texte); text-decoration: none; font-weight: 500; }
.nav-lien svg { flex: none; color: var(--discret); }
.nav-lien:hover { background: var(--survol); }
.nav-lien[aria-current=page] { background: var(--selection); color: var(--accent); font-weight: 700; box-shadow: inset 3px 0 0 var(--accent); }
.nav-lien[aria-current=page] svg { color: var(--accent); }
.nav-sortie { width: 100%; margin-top: 8px; }

/* Telephone : bandeau de marque, barre d'onglets en bas, feuille "Plus" */
.nav-lateral { display: none; }
.entete-mobile { display: flex; align-items: center; gap: 10px; padding: 8px 16px; background: var(--carte); border-bottom: 1px solid var(--bordure); }
.onglets-bas { position: fixed; left: 0; right: 0; bottom: 0; z-index: 50; display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; background: var(--carte); border-top: 1px solid var(--bordure); padding-bottom: env(safe-area-inset-bottom); }
.onglet-bas { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; min-height: 58px; padding: 6px 2px; border: 0; border-radius: 0; background: transparent; color: var(--discret); font-size: .72rem; font-weight: 500; text-decoration: none; }
.onglet-bas span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.onglet-bas[aria-current=page], .onglet-bas[aria-expanded=true] { color: var(--accent); font-weight: 700; }
body.a-coque main { padding-bottom: calc(80px + env(safe-area-inset-bottom)); }
.feuille-plus { position: fixed; inset: 0; z-index: 60; display: flex; align-items: flex-end; background: rgba(0, 0, 0, .45); }
.feuille-contenu { width: 100%; max-height: 85vh; overflow-y: auto; background: var(--carte); border-radius: 16px 16px 0 0; padding: 16px 16px calc(16px + env(safe-area-inset-bottom)); }

/* Poste de travail : menu lateral fixe, contenu centre dans le reste de l'ecran */
@media (min-width: 768px) {
  .entete-mobile, .onglets-bas, .feuille-plus { display: none !important; }
  .nav-lateral { display: flex; flex-direction: column; position: fixed; top: 0; bottom: 0; left: 0; width: var(--largeur-lateral); padding: 20px 12px; background: var(--carte); border-right: 1px solid var(--bordure); overflow-y: auto; z-index: 40; }
  .nav-lateral .coque-titre { margin: 8px 12px 0; }
  .nav-lateral .coque-marque { padding: 0 12px; }
  .nav-pied { margin-top: auto; padding-top: 16px; border-top: 1px solid var(--bordure); }
  .nav-pied .coque-identite { padding: 0 12px; }
  body.a-coque { padding-left: var(--largeur-lateral); }
  body.a-coque main { max-width: 1180px; padding: 28px 32px 48px; }
  body.a-coque h1 { font-size: 1.6rem; margin: 0 0 20px; }
  /* Liste des projets : grille de cartes plutot que de longues barres */
  #liste-projets { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 10px; }
  #liste-projets .projet { margin: 0; }
}
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; transition: none !important; } }

/* Parametres : sous-navigation par sections et marque blanche */
.sous-nav { display: flex; gap: 4px; border-bottom: 1px solid var(--bordure); margin: 0 0 16px; overflow-x: auto; }
.sous-onglet { background: transparent; color: var(--texte); border-radius: 8px 8px 0 0; border-bottom: 3px solid transparent; white-space: nowrap; font-weight: 500; }
.sous-onglet:hover { background: var(--survol); }
.sous-onglet[aria-selected=true] { color: var(--accent); border-bottom-color: var(--accent); font-weight: 700; }
.ligne-couleur { display: flex; gap: 8px; }
.ligne-couleur input[type=color] { width: 64px; padding: 4px; flex: none; }
.ligne-couleur input[type=text] { flex: 1; min-width: 0; }
.apercu-logo { display: inline-block; padding: 12px 16px; background: #fff; border: 1px solid var(--bordure); border-radius: 8px; }
.apercu-logo img { display: block; max-width: 220px; height: auto; max-height: 64px; }

/* marque blanche : coordonnees, palette suggeree */
.marque-coord { font-size: .8rem; padding: 0 12px 12px; overflow-wrap: anywhere; }
.marque-coord a { display: block; }
.marque .marque-coord { padding: 8px 0 0; text-align: center; }
.palette { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0; }
.pastille { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 6px 12px; border: 1px solid var(--bordure); border-radius: 8px; background: var(--carte); color: var(--texte); font: inherit; cursor: pointer; }
.pastille:disabled { opacity: .55; cursor: not-allowed; }
.pastille-couleur { width: 24px; height: 24px; border-radius: 50%; border: 1px solid var(--bordure); flex: none; }
.icone-gemini { vertical-align: -3px; }

/* console des clients */
.liste-clients { list-style: none; margin: 0; padding: 0; }
.client-ligne { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; padding: 12px 0; border-top: 1px solid var(--bordure); }
.client-ligne:first-child { border-top: 0; }
.client-nom { font-weight: 600; flex: 1 1 200px; }
.etat-instance { display: inline-flex; align-items: center; gap: 6px; font-size: .9rem; }
.etat-instance::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--erreur); }
.etat-instance.en-ligne::before { background: var(--ok); }
.sortie-creation { white-space: pre-wrap; overflow-wrap: anywhere; font-size: .8rem; max-height: 320px; overflow: auto; padding: 12px; border: 1px solid var(--bordure); border-radius: 8px; background: var(--fond); }

/* Liste + detail (Mon equipe, Projets et utilisateurs) */
.md { display: grid; grid-template-columns: minmax(260px, 340px) 1fr; gap: 16px; align-items: start; }
.md-liste { position: sticky; top: 12px; max-height: calc(100vh - 40px); overflow: auto; }
.md-liste input[type=search] { width: 100%; box-sizing: border-box; margin-bottom: 8px; }
.md-items { display: flex; flex-direction: column; gap: 4px; }
.md-groupe { margin: 12px 0 4px; font-size: .85rem; font-weight: 700; color: var(--discret); }
.item-liste { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; width: 100%; text-align: left; background: transparent; color: var(--texte); border: 1px solid transparent; border-left: 4px solid transparent; border-radius: 8px; padding: 10px 12px; cursor: pointer; }
.item-liste:hover { background: var(--survol); }
.item-liste[aria-current=true] { border-color: var(--bordure); border-left-color: var(--accent); background: var(--survol); }
.item-liste .titre { font-weight: 600; }
.item-liste .sous { font-size: .85rem; color: var(--discret); }
.md-entete { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-bottom: 8px; }
.md-entete h2 { margin: 0; flex: 1 1 auto; }
.md-contenu h3 { margin: 18px 0 8px; }
.retour-liste { display: none; }
.bouton-lien { display: inline-block; padding: 10px 16px; border-radius: 8px; background: var(--accent); color: #fff; text-decoration: none; font-weight: 600; }
.md-section { border-top: 1px solid var(--bordure); margin-top: 18px; padding-top: 6px; }
.md-ligne { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding: 8px 0; border-top: 1px solid var(--bordure); }
.md-ligne:first-child { border-top: 0; }
.md-ligne .grandit { flex: 1 1 200px; }
@media (max-width: 1099px) {
  .md { grid-template-columns: 1fr; }
  .md-liste { position: static; max-height: none; }
  .md.en-detail .md-liste { display: none; }
  .md:not(.en-detail) .md-detail { display: none; }
  .md.en-detail .retour-liste { display: inline-block; }
}
/* Appels rapides : cibles tactiles larges pour le technicien sur la route */
.appels-liste { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); margin: 12px 0 20px; }
.gros-appel { display: flex; flex-direction: column; gap: 4px; padding: 18px 20px; min-height: 84px; justify-content: center; border-radius: 14px; background: var(--accent); color: var(--accent-texte); text-decoration: none; }
.gros-appel:focus-visible { outline: 3px solid var(--texte); outline-offset: 3px; }
.gros-appel-nom { font-size: 1.25rem; font-weight: 700; }
.gros-appel-tel { font-size: 1.1rem; letter-spacing: .02em; }
.gros-appel-note { font-size: .9rem; opacity: .9; }
/* Appels rapides : colonnes (2 sur telephone, 3 et plus sur grand ecran), un bloc par projet puis le general */
.appels-groupe { margin: 0 0 22px; }
.appels-groupe h2 { margin: 0 0 10px; font-size: 1.1rem; }
.appels-liste { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
@media (min-width: 720px) { .appels-liste { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .appels-liste { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.appel-cellule { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.appel-cellule .gros-appel { flex: 1; overflow-wrap: break-word; }
.appels-liste { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }
@media (min-width: 720px) { .appels-liste { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); } }
.appel-cellule .gros-appel-nom { font-size: 1.1rem; }
.appel-edition { display: flex; flex-direction: column; gap: 6px; }
.refermer { display: block; width: 100%; margin-top: 12px; }
.bandeau-simulation { position: sticky; top: 0; z-index: 60; display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: space-between; padding: 10px 14px; background: #b3261e; color: #fff; font-weight: 600; }
.bandeau-simulation button { background: #fff; color: #b3261e; border-color: #fff; }
.demande-reinit { position: fixed; inset: 0; z-index: 200; display: flex; align-items: center; justify-content: center; padding: 16px; background: rgba(0, 0, 0, .55); }
.demande-reinit-carte { max-width: 460px; max-height: 92vh; overflow: auto; padding: 20px; border-radius: 14px; background: var(--carte, #fff); color: var(--texte, #111); }
.demande-reinit-carte h2 { margin-top: 0; }
.reinit, .horloge { margin-top: 16px; }
.entete-retour { margin-right: 10px; padding: 8px 12px; border: 1px solid var(--accent); border-radius: 10px; background: transparent; color: var(--accent); font: inherit; font-weight: 700; }

/* Appels rapides : mode edition */
#mode-edition { margin: 4px 0 8px; }
.gros-appel-edit { border: 3px dashed currentColor; cursor: pointer; font: inherit; text-align: left; width: 100%; }
.gros-appel-fige { opacity: .55; }
.appel-edition { gap: 10px; padding: 12px; border: 2px solid var(--accent); border-radius: 14px; background: var(--fond-carte, transparent); grid-column: 1 / -1; }
.appel-champ { display: flex; flex-direction: column; gap: 4px; font-weight: 600; }
.appel-deux-lignes { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }

/* Appels rapides : une seule fiche, pleine largeur */
#appels.une-fiche { display: block; }
#appels.une-fiche .appel-edition { max-width: 36rem; }
#appels.une-fiche .appel-deux-lignes { grid-template-columns: 1fr 1fr; }