/* ═══════════════════════════════════════════════════════════════════════════════════════════════════════════
   PONT VERS LE PARCOURS LIVE (2026-10-07) : fenêtre « Présentations PowerPoint », composant
   Shared/PontParcoursReglage.razor. Préfixe ppl- ; le reste vient des règles de la fenêtre (memo-). Couleurs : jetons
   de l'application (clair et sombre).
   ═══════════════════════════════════════════════════════════════════════════════════════════════════════════ */
.ppl .memo-segments { align-self: flex-start; }
.ppl-attente { font-style: italic; }

/* Lien trouvé : pictogramme, titre (ou choix entre plusieurs), « Ouvrir ». */
.ppl-lien { display: flex; align-items: center; gap: 10px; min-width: 0; padding: 8px 11px; border-radius: 10px;
            border: 1px solid var(--o8, rgba(255,255,255,.12)); background: color-mix(in oklab, var(--surf-2, #13202b) 60%, transparent); }
.ppl-ic { flex: 0 0 auto; width: 26px; height: 26px; border-radius: 8px; display: grid; place-items: center;
          color: var(--brand, #00b1cf); background: color-mix(in srgb, var(--brand, #00b1cf) 14%, transparent); }
.ppl-titre { flex: 1 1 auto; min-width: 0; font-size: .82rem; font-weight: 650; color: var(--tx1, #e9f1f2);
             overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ppl-choix { flex: 1 1 auto; min-width: 0; padding: 6px 8px; border-radius: 8px; font-size: .8rem;
             border: 1px solid var(--o8, rgba(255,255,255,.18)); background: var(--surf-1, #0e1620); color: var(--tx1, #e9f1f2); }
.ppl-lien .memo-lien { flex: 0 0 auto; text-decoration: none; }

/* Aucun lien : la phrase, puis le bouton qui ouvre le flux du parcours. */
.ppl-vide { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap;
            padding: 8px 11px; border-radius: 10px; border: 1px dashed var(--o8, rgba(255,255,255,.18)); }
.ppl-vide > span { font-size: .8rem; color: var(--tx2, #c9d6da); min-width: 0; }
.ppl-vide .memo-btn { flex: 0 0 auto; }

@media (max-width: 520px) {
    .ppl-vide .memo-btn { width: 100%; }
}