/* Roadmap DATA (F-448) — la page reprend les classes de la Roadmap (proto.css, roadmap-gantt.css, filter-bar :
   .fb-bar, .fb-select-btn, .fb-drop, .fb-affichage) ; ici, seulement ce qui lui est propre. */
#page-data-roadmap { overflow: hidden; }
#page-data-roadmap .rm-body { padding: 0; }
/* Phases terminées avant Nydham, sans dates connues : hachures grises (pas un état de la Roadmap des épics). */
#page-data-roadmap .bar.rmd-avant { background: repeating-linear-gradient(-45deg, #e5e7eb, #e5e7eb 4px, #f9fafb 4px, #f9fafb 8px); color: #4b5563; box-shadow: none; outline: 1px dashed #cbd5e1; outline-offset: -1px; }
/* Phase en cours sans fin connue : la barre s'arrête à aujourd'hui, bord droit en pointillés (comme une conception ouverte). */
#page-data-roadmap .bar.rmd-ouverte { border-right: 2px dashed rgba(255, 255, 255, .85); border-radius: 4px 0 0 4px; }
#page-data-roadmap .rg-row-left:hover { background: #f5f7fb !important; }
#page-data-roadmap .rmd-lien:hover { text-decoration: underline !important; color: #1D4ED8 !important; }
#page-data-roadmap [role="button"]:focus-visible, #page-data-roadmap .rmd-lien:focus-visible { outline: 2px solid #4c37dd; outline-offset: 1px; }
#page-data-roadmap #rmd-body { scroll-behavior: auto; }
/* La barre de filtres de la Roadmap : un menu ouvert passe devant la frise. */
#page-data-roadmap #rmd-filtres { position: relative; z-index: 40; }
@media (max-width: 640px) { #page-data-roadmap #rmd-entete { padding: 10px 12px; } #page-data-roadmap .fb-bar { flex-wrap: wrap; } }

/* ── Le panneau d'un use case : le panneau « Statuts » d'un épic SI (gantt-view.js, .gep-panel), appliqué aux phases DATA ──
   Mêmes mesures que .gep-panel (440 px, ombre, entrée par la droite), mêmes en-têtes de blocs, mêmes lignes de période. */
#page-data-roadmap .rmd { position: relative; }
#page-data-roadmap .rmd-pn { position: absolute; top: 0; right: 0; bottom: 0; width: min(440px, 100%); z-index: 300; background: #fff; display: flex; flex-direction: column; box-shadow: -4px 0 32px rgba(0, 0, 0, .18); animation: gepSlideIn .22s cubic-bezier(.4, 0, .2, 1); }
#page-data-roadmap .rmd-pn[aria-busy="true"] .rmd-pn__d { opacity: .6; pointer-events: none; }
#page-data-roadmap .rmd-pn__h { padding: 7px 14px 8px; border-bottom: 1px solid #e6e2d8; flex-shrink: 0; }
#page-data-roadmap .rmd-pn__ligne1 { display: flex; align-items: center; gap: 6px; margin-bottom: 4px; }
#page-data-roadmap .rmd-pn__point { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; }
#page-data-roadmap .rmd-pn__ref { font-size: 12px; color: #6b7588; font-weight: 500; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#page-data-roadmap .rmd-pn__x { width: 22px; height: 22px; border: 1px solid #e6e2d8; border-radius: 4px; background: #fff; cursor: pointer; color: #6b7588; font-size: 12px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; font-family: inherit; padding: 0; }
#page-data-roadmap .rmd-pn__x:hover { color: #131a26; border-color: #cbd5e1; }
#page-data-roadmap .rmd-pn__h h2 { margin: 0 0 5px; font-size: 13px; font-weight: 800; color: #131a26; letter-spacing: -.02em; line-height: 1.3; }
#page-data-roadmap .rmd-pn__badges { display: flex; align-items: center; gap: 5px; flex-wrap: wrap; }
#page-data-roadmap .rmd-pn__barre { margin-top: 8px; }
#page-data-roadmap .rmd-pn__fiche { border: 0; border-radius: 6px; padding: 6px 11px; background: #0a6444; color: #fff; font: 600 12px/1.2 inherit; cursor: pointer; }
#page-data-roadmap .rmd-pn__fiche:hover { background: #075035; }
#page-data-roadmap .rmd-pn__ro { background: #FEF3C7; border-bottom: 1px solid #FDE68A; color: #92400E; font-size: 12px; font-weight: 600; padding: 7px 14px; line-height: 1.4; flex-shrink: 0; }
#page-data-roadmap .rmd-pn__tabs { display: flex; align-items: center; flex-wrap: wrap; border-bottom: 1px solid #e6e2d8; padding: 0 8px; flex-shrink: 0; }
/* Mesuré au clic le 02/11 : le bouton flottant de l'assistant (bas droite) recouvrait le 💾 de la fin prévisionnelle ;
   la marge du bas laisse le dernier bloc défiler au-dessus de lui. */
#page-data-roadmap .rmd-pn__d { flex: 1; min-height: 0; overflow: auto; padding-bottom: 96px; }
/* Un bloc par phase : bande de couleur de la phase en haut, titre en capitales, statut en pastille, chevron. */
#page-data-roadmap .rmd-sec { border-bottom: 1px solid #e0dcd4; }
#page-data-roadmap .rmd-sec__h { display: flex; align-items: center; padding: 8px 16px 7px; border-top: 3px solid var(--ph); border-bottom: 1px solid #e0dcd4; background: color-mix(in srgb, var(--ph) 5%, #fff); cursor: pointer; user-select: none; }
#page-data-roadmap .rmd-sec--indus .rmd-sec__h { cursor: default; }
#page-data-roadmap .rmd-sec__t { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 3px; }
#page-data-roadmap .rmd-sec__nom { font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .09em; color: var(--ph); text-align: center; }
#page-data-roadmap .rmd-sec__statut { font-size: 12px; font-weight: 700; padding: 2px 8px; border-radius: 999px; white-space: nowrap; }
#page-data-roadmap .rmd-sec__chev { font-size: 12px; color: var(--ph); opacity: .6; flex-shrink: 0; }
#page-data-roadmap .rmd-sec__b { padding: 8px 16px 12px; display: flex; flex-direction: column; gap: 8px; }
#page-data-roadmap .rmd-sec__dates { font-size: 12px; color: #475569; font-variant-numeric: tabular-nums; }
/* Les périodes (sous-étapes), comme C1 / D1 d'un épic. */
#page-data-roadmap .rmd-lignes { display: flex; flex-direction: column; }
#page-data-roadmap .rmd-ligne { display: flex; flex-wrap: nowrap; align-items: center; gap: 7px; padding: 5px 2px 1px; }
#page-data-roadmap .rmd-badge { font-size: 12px; font-weight: 800; line-height: 1; border: 1px solid; padding: 4px 7px; border-radius: 5px; flex-shrink: 0; min-width: 30px; text-align: center; white-space: nowrap; }
#page-data-roadmap .rmd-ligne__d { font-size: 12px; font-weight: 600; color: #475569; flex: 1 1 auto; min-width: 0; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#page-data-roadmap .rmd-fl { color: #CBD5E1; margin: 0 4px; }
#page-data-roadmap .rmd-df { color: #94A3B8; font-weight: 700; }
#page-data-roadmap .rmd-statut { display: inline-flex; align-items: center; gap: 5px; flex-shrink: 0; font-size: 12px; font-weight: 700; padding: 2px 8px; border-radius: 99px; white-space: nowrap; }
#page-data-roadmap .rmd-rond { width: 8px; height: 8px; border-radius: 50%; background: currentColor; flex-shrink: 0; }
#page-data-roadmap .rmd-rond--vide { background: transparent; box-shadow: inset 0 0 0 1.6px currentColor; }
#page-data-roadmap .rmd-j { font-size: 12px; font-weight: 700; color: #64748B; min-width: 28px; text-align: right; flex-shrink: 0; font-variant-numeric: tabular-nums; }
#page-data-roadmap .rmd-ico { display: flex; gap: 2px; flex-shrink: 0; }
#page-data-roadmap .rmd-i { width: 22px; height: 22px; border: 1px solid #e2e8f0; border-radius: 4px; background: #f8fafc; cursor: pointer; color: #475569; padding: 0; line-height: 1; display: flex; align-items: center; justify-content: center; font-size: 12px; font-family: inherit; }
#page-data-roadmap .rmd-i:hover { background: #eef2ff; border-color: #c7d2fe; color: #4338ca; }
#page-data-roadmap .rmd-i--suppr { border-color: #fecaca; background: #fef2f2; color: #dc2626; }
#page-data-roadmap .rmd-i--suppr:hover { background: #fee2e2; border-color: #fca5a5; color: #b91c1c; }
#page-data-roadmap .rmd-ligne__t { font-size: 12px; color: #64748B; padding: 0 2px 6px 41px; border-bottom: 1px dashed #ede9e0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* Consommé / prévu, comme le suivi de chiffrage d'une phase SI. */
#page-data-roadmap .rmd-conso__l { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 4px; }
#page-data-roadmap .rmd-conso__c { font-size: 13px; font-weight: 800; letter-spacing: -.02em; }
#page-data-roadmap .rmd-conso__c small, #page-data-roadmap .rmd-conso__p small { font-weight: 600; font-size: 12px; text-transform: uppercase; letter-spacing: .05em; opacity: .85; }
#page-data-roadmap .rmd-conso__p { font-size: 12px; font-weight: 700; color: #64748B; }
#page-data-roadmap .rmd-conso__b { display: flex; height: 8px; border-radius: 99px; overflow: hidden; }
#page-data-roadmap .rmd-conso__b span { display: block; height: 100%; }
/* Les gestes : la boîte « Date de démarrage » + « Lancer », « Suspendre », « Sous-étape terminée ». */
#page-data-roadmap .rmd-act { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; padding: 6px 8px; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 7px; }
#page-data-roadmap .rmd-act--lancer { background: color-mix(in srgb, var(--ph) 5%, #fff); border-color: color-mix(in srgb, var(--ph) 16%, #fff); }
#page-data-roadmap .rmd-act__l { font-size: 12px; color: #64748B; font-weight: 600; flex-shrink: 0; }
#page-data-roadmap .rmd-btn { padding: 2px 10px; font: 700 12px/1 inherit; border-radius: 5px; border: none; cursor: pointer; white-space: nowrap; height: 28px; color: #fff; background: #2563EB; }
#page-data-roadmap .rmd-btn:hover { filter: brightness(.92); }
#page-data-roadmap .rmd-btn--vert { background: #12823b; }
#page-data-roadmap .rmd-btn--gris { background: #6B7280; }
#page-data-roadmap .rmd-btn--rouge { background: #dc2626; }
#page-data-roadmap .rmd-btn--blanc { background: #fff; color: #334155; border: 1px solid #e2e8f0; }
#page-data-roadmap .rmd-ajout { width: 100%; padding: 7px 10px; font: 700 12.5px/1.2 inherit; border-radius: 6px; border: 1.5px dashed color-mix(in srgb, var(--ph) 35%, #fff); background: color-mix(in srgb, var(--ph) 3%, #fff); color: var(--ph); cursor: pointer; }
#page-data-roadmap .rmd-ajout:hover { background: color-mix(in srgb, var(--ph) 8%, #fff); }
/* « Finaliser » : le geste de clôture, comme « Marquer comme US rédigées » ; plein quand la phase est à finaliser. */
#page-data-roadmap .rmd-finaliser { width: 100%; padding: 7px 12px; font: 700 13px/1.2 inherit; border-radius: 7px; cursor: pointer; background: #fff; color: #12823b; border: 1.5px solid #12823b; }
#page-data-roadmap .rmd-finaliser--fort { background: #12823b; color: #fff; }
#page-data-roadmap .rmd-finaliser:hover { filter: brightness(.95); }
#page-data-roadmap .rmd-form { display: flex; flex-direction: column; gap: 6px; padding: 8px; background: #EFF6FF; border: 1px solid #BFDBFE; border-radius: 6px; margin: 4px 0 6px; }
#page-data-roadmap .rmd-form input[type="text"] { height: 30px; border: 1px solid #cbd5e1; border-radius: 6px; padding: 0 9px; font: 500 12.5px inherit; color: #0f172a; background: #fff; }
#page-data-roadmap .rmd-form__l { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
#page-data-roadmap .rmd-form__l > span { font-size: 12px; color: #1d4ed8; font-weight: 700; }
#page-data-roadmap .rmd-form--suppr { flex-direction: row; flex-wrap: wrap; align-items: center; background: #FEF2F2; border-color: #FECACA; color: #991B1B; font-size: 12.5px; font-weight: 600; }
/* L'industrialisation, comme le jalon MEP d'un épic : libellé en capitales, date, enregistrer. */
#page-data-roadmap .rmd-jalon { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 12.5px; }
#page-data-roadmap .rmd-jalon__l { font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--ph); }
#page-data-roadmap .rmd-jalon b { font-variant-numeric: tabular-nums; color: #131a26; }
#page-data-roadmap .rmd-jalon__c { display: inline-flex; align-items: center; gap: 6px; }
/* Historique : le journal des décisions, le plus récent en tête. */
#page-data-roadmap .rmd-hist { list-style: none; margin: 0; padding: 8px 16px; display: flex; flex-direction: column; }
#page-data-roadmap .rmd-hist li { display: flex; flex-direction: column; gap: 2px; padding: 8px 0; border-bottom: 1px solid #f1efe9; }
#page-data-roadmap .rmd-hist__d { font-size: 12px; font-weight: 700; color: #475569; font-variant-numeric: tabular-nums; }
#page-data-roadmap .rmd-hist__q { font-size: 12.5px; color: #131a26; }
#page-data-roadmap .rmd-hist__e { font-size: 12px; color: #64748B; }
#page-data-roadmap .rmd-hist--annulee .rmd-hist__q { text-decoration: line-through; opacity: .65; }
#page-data-roadmap .rmd-pn__vide { font-size: 12.5px; color: #64748b; font-style: italic; padding: 2px 0; }
#page-data-roadmap .rmd-pn__epics { display: flex; flex-direction: column; gap: 6px; font-size: 12.5px; padding: 12px 16px 4px; }
#page-data-roadmap .rmd-pn__lien { border: 0; background: none; padding: 0; text-align: left; color: #1d4ed8; font: 600 12.5px/1.4 inherit; cursor: pointer; }
#page-data-roadmap .rmd-pn__lien:hover, #page-data-roadmap .rmd-pn__fiche:focus-visible { text-decoration: underline; }
#page-data-roadmap .rmd-pn__note { margin: 8px 16px 0; font-size: 12px; color: #64748b; }
#page-data-roadmap .rmd-pn button:focus-visible, #page-data-roadmap .rmd-sec__h:focus-visible { outline: 2px solid #4c37dd; outline-offset: 2px; }