/* ============================================================================
   Pro Re Nata — Consultation voyage (styles SPÉCIFIQUES au module voyage :
   cartes SVG/Leaflet, vaccins par patient, composition voyageur, risques).
   Les styles partagés du wizard (sections patient, ordonnance, impression,
   dark mode) vivent dans css/wizard.css depuis 2026-06.
   ============================================================================ */

/* ── Interactive SVG map — risk-based coloring ── */
.prn-map-card {
    border-radius: 14px;
    overflow: hidden;
    margin-bottom: 0.85rem;
    border: 1px solid #c8d8ce;
    box-shadow: 0 2px 12px rgba(0,0,0,0.07);
}
.prn-map-banner {
    background: linear-gradient(135deg, var(--prn-int-strong), var(--prn-int-hover-border));
    padding: 8px 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    font-family: var(--font-sans);
}
.prn-map-banner-title { display: inline-flex; align-items: center; gap: 6px; }
.prn-map-banner span {
    color: rgba(255,255,255,0.7);
    font-size: 10px;
    font-weight: 400;
}

/* Bouton toggle légende (carte SVG) — dans le banner */
.prn-map-legend-btn {
    appearance: none;
    border: 1px solid rgba(255,255,255,0.4);
    background: rgba(255,255,255,0.15);
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    padding: 4px 10px;
    min-height: 28px;
    border-radius: 6px;
    cursor: pointer;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    transition: background-color 100ms ease-out;
}
.prn-map-legend-btn:hover { background: rgba(255,255,255,0.25); }
.prn-map-legend-btn-show { display: none; }
.prn-map-legend-btn-hide { display: inline; }

.prn-map-card[data-collapsed] .prn-map-legend { display: none; }
.prn-map-card[data-collapsed] .prn-map-legend-btn-show { display: inline; }
.prn-map-card[data-collapsed] .prn-map-legend-btn-hide { display: none; }
.prn-map-water {
    background: linear-gradient(135deg, #c6e2f5, #a8d4ee);
    padding: 0;
}
.prn-map-water svg {
    width: 100%;
    max-height: 220px;
    display: block;
}
.prn-map-zone {
    transition: border-color 100ms ease-out, background-color 100ms ease-out;
    cursor: pointer;
}
.prn-map-legend {
    background: var(--prn-surface);
    padding: 8px 12px;
    border-top: 1px solid #e2e8e5;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: center;
}
.prn-map-legend-chip {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 10.5px;
    cursor: pointer;
    padding: 3px 8px;
    border-radius: 20px;
    background: var(--prn-surface-2);
    border: 1.5px solid transparent;
    transition: border-color 100ms ease-out, background-color 100ms ease-out;
}
.prn-map-legend-chip.is-selected {
    background: rgba(0,0,0,0.04);
    border-color: currentColor;
    font-weight: 700;
}
.prn-map-legend-chip .legend-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
}
.prn-map-legend-chip .legend-text {
    max-width: 140px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 500;
    color: #7a8f87;
}
.prn-map-legend-chip.is-selected .legend-text {
    font-weight: 700;
    color: #1e3a34;
}

/* Region select option alongside map */
.prn-region-opt {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    padding: 0.75rem 0.95rem;
    border: 2px solid var(--prn-line);
    border-radius: var(--radius);
    background: var(--prn-surface);
    cursor: pointer;
    transition: border-color 100ms ease-out, background-color 100ms ease-out;
}
.prn-region-opt:hover { border-color: var(--prn-int-hover-border); background: var(--prn-int-hover-bg); }
.prn-region-opt.is-selected { border-color: var(--prn-int-strong); background: var(--prn-int-hover-bg); }
.prn-region-opt strong { flex: 1; font-weight: 600; color: var(--prn-navy); }

/* ── Sprint 17 — Groupes de provinces par niveau de risque ──────────────────
   Quand un pays est découpé par provinces (Mexique 32, Inde 28, Rép. dom. 32),
   on regroupe la liste par niveau de risque pour faciliter la sélection. ─── */
.prn-regs--grouped {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}
.prn-regs-group {
    border: 1px solid var(--prn-line);
    border-radius: var(--radius);
    overflow: hidden;
    background: var(--prn-bg, var(--prn-surface));
}
.prn-regs-group[data-risk-level="élevé"] { border-color: rgba(217,83,79,0.4); }
.prn-regs-group[data-risk-level="modéré"] { border-color: rgba(240,173,78,0.4); }
.prn-regs-group[data-risk-level="faible"],
.prn-regs-group[data-risk-level="très faible"] { border-color: rgba(247,220,111,0.5); }
.prn-regs-group[data-risk-level="nul"] { border-color: rgba(92,184,92,0.35); }

.prn-regs-group-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.5rem 0.85rem;
    background: rgba(0,0,0,0.025);
    border-bottom: 1px solid var(--prn-line);
    font-size: 0.82rem;
}
[data-theme="dark"] .prn-regs-group-head { background: rgba(255,255,255,0.04); }

.prn-regs-group-title {
    font-weight: 600;
    color: var(--prn-navy);
    flex: 1;
}
.prn-regs-group-count {
    font-weight: 400;
    color: var(--prn-muted);
    font-size: 0.78rem;
}
.prn-regs-group-btn {
    display: inline-block;
    padding: 0.25rem 0.6rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--prn-int-strong, #0a3a5c);
    background: transparent;
    border: 1px solid var(--prn-int-strong, #0a3a5c);
    border-radius: 4px;
    cursor: pointer;
    transition: background 100ms ease-out, color 100ms ease-out;
}
.prn-regs-group-btn:hover {
    background: var(--prn-int-strong, #0a3a5c);
    color: var(--prn-int-strong-on, #fff);
}
.prn-regs-group-items {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0.6rem 0.85rem;
}

/* ── Badge de risque : maintenant fourni par .prn-risk-badge / .prn-risk-dot
   dans css/components.css (avec support dark-mode via data-level/--risk-color) ── */

/* ── En-tête d'étape avec hint multi-pays ── */
.prn-step-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: wrap;
    margin-bottom: 0.25rem;
}
.prn-country-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.25rem 0.7rem;
    background: linear-gradient(135deg, var(--prn-int-strong), var(--prn-int-hover-border));
    color: #fff;
    font-size: 0.75rem;
    font-weight: 700;
    border-radius: 999px;
    letter-spacing: 0.02em;
    box-shadow: 0 1px 3px rgba(26, 107, 90, 0.2);
}

/* ── Duration section ── */
.prn-durations {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}
.prn-dur-group {
    background: var(--prn-surface);
    border: 2px solid var(--prn-line);
    border-radius: var(--radius);
    padding: 1rem 1.15rem;
}
.prn-dur-group strong {
    display: block;
    font-size: 0.92rem;
    color: var(--prn-navy);
    margin-bottom: 0.5rem;
}
.prn-dur-input,
.prn-dur-region-input {
    padding: 0.45rem 0.5rem;
    border: 2px solid var(--prn-line);
    border-radius: 8px;
    font-size: 1rem;
    font-weight: 700;
    color: var(--prn-int-strong);
    text-align: center;
    font-family: var(--font-sans);
    outline: none;
}
.prn-dur-input:focus,
.prn-dur-region-input:focus { border-color: var(--prn-int-strong); }

.prn-dur-region-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
    padding: 6px 10px;
    border-radius: 8px;
}
.prn-dur-region-row.is-risk { background: var(--prn-danger-bg); border: 1px solid #e8a0a0; }
.prn-dur-region-row.is-safe { background: var(--prn-int-hover-bg); border: 1px solid #c8e0d0; }

/* ── Adults counter ── */
.prn-adults {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1rem;
    background: var(--prn-surface);
    border: 2px solid var(--prn-line);
    border-radius: var(--radius);
    margin-bottom: 0.75rem;
}
/* Kids */
.prn-kids-q {
    display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 0.75rem;
}
.prn-kids-list { display: flex; flex-direction: column; gap: 0.5rem; }
.prn-kid-remove {
    background: none; border: none; color: var(--prn-danger);
    font-size: 0.78rem; font-weight: 600; cursor: pointer;
}
.prn-kid-age,
.prn-kid-weight {
    width: 100%; padding: 0.5rem 0.65rem;
    border: 2px solid var(--prn-line); border-radius: 8px;
    font-size: 0.95rem; font-weight: 600; color: var(--prn-navy);
    font-family: var(--font-sans); outline: none;
}
.prn-kid-age:focus,
.prn-kid-weight:focus { border-color: var(--prn-int-strong); }
.prn-adult-age {
    width: 62px; margin-left: 6px; padding: 4px 6px;
    border: 1px solid var(--prn-line); border-radius: 8px;
    font-size: 0.85rem; color: var(--prn-navy);
    font-family: var(--font-sans); outline: none;
}
.prn-adult-age:focus { border-color: var(--prn-int-strong); }

/* Collapsible sections — overrides voyage sur .prn-collapsible (components.css)
   Sémantique voyage conservée : <h3> sans classe (toggle), chevron en texte ▼
   et paddings horizontaux à 0 (les .prn-results-section gèrent déjà le padding). */
.prn-collapsible {
    /* Annule border / border-radius / overflow / margin de components.css :
       .prn-results-section pose son propre styling. */
    border: none;
    border-radius: 0;
    overflow: visible;
    margin: 0;
}
.prn-collapsible .prn-collapsible-body {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease, padding 0.3s ease;
    padding: 0 0;
}
.prn-collapsible.is-open .prn-collapsible-body {
    max-height: 30000px;
    padding: 0.75rem 0;
}
.prn-collapsible h3 {
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.prn-collapsible h3 .prn-collapsible-chevron {
    /* Annule width/height fixes de components.css (qui supposent un SVG) :
       voyage utilise le caractère ▼ qui doit s'afficher en texte. */
    width: auto;
    height: auto;
    margin-left: auto;
    transition: transform 0.25s;
    font-size: 0.8rem;
    color: var(--prn-muted);
}
.prn-collapsible.is-open h3 .prn-collapsible-chevron { transform: rotate(180deg); }

/* Justification clinique INSPQ — affichée par défaut et ENCADRÉE comme les
   tableaux « Aide à la décision » (.prn-mam-table-wrap) : bordure légère, fond
   doux, coins arrondis. Override du .prn-collapsible voisin (border:none). */
.prn-results-section.prn-inspq-section {
    border: 1px solid var(--prn-line);
    border-radius: 8px;
    background: #fafdfb;
    padding: 0 14px 4px;
    margin: 0 0 14px;
}
.prn-results-section.prn-inspq-section > h3 {
    padding-top: 10px;
}

/* Alerts */
.prn-warning {
    font-size: 0.78rem; color: #8a5a10;
    padding: 0.5rem 0.75rem;
    background: #fdf6ec;
    border-radius: 6px;
    border-left: 3px solid #e8c547;
    margin: 0.5rem 0;
}
/* Vaccine cards */
.prn-vacc-section {
    margin-bottom: 1rem;
}
.prn-vacc-section h3 {
    font-family: var(--font-serif);
    font-size: 1rem;
    color: var(--prn-navy);
    margin: 0 0 0.5rem;
}
.prn-vacc-list { display: flex; flex-direction: column; gap: 8px; }
/* Carte vaccin — alignée sur la base de carte unifiée (.prn-rx-row,
   .prn-rx-info, .prn-rx-removed) : même border-radius, même border-left 4 px
   colorée par tier (recommandé / obligatoire), même padding. Le nom du
   vaccin (<strong>) suit la même typo que les noms de médicaments. */
.prn-vacc-card {
    border: 1px solid var(--prn-line);
    border-left: 4px solid var(--prn-line);
    border-radius: 8px;
    padding: 12px 14px;
    background: var(--prn-surface);
    margin: 0;
}
/* Recommandé = VERT ; à considérer = ambre — jamais de jaune sur une carte
   recommandée (demande owner 2026-07-22). */
.prn-vacc-card.is-rec { border-left-color: var(--prn-success); }
.prn-vacc-card.is-consider { border-left-color: var(--prn-warning); }
.prn-vacc-card.is-required { border-left-color: #d9534f; background: #fff7f7; }
/* Vaccin non indiqué pour la destination (INSPQ) : grisé, dé-emphasé. */
.prn-vacc-card.is-not-indicated { border-left-color: #cbd5e1; opacity: 0.62; }
.prn-vacc-card.is-not-indicated:hover,
.prn-vacc-card.is-not-indicated:focus-within { opacity: 1; }
.prn-vacc-card > strong {
    display: block;
    font-size: 16px;
    line-height: 1.3;
    letter-spacing: -0.005em;
    color: var(--prn-ink);
    margin: 0 0 4px;
    padding-right: 40px; /* laisse la place à la checkbox absolue (top:10 right:10) */
    text-decoration: underline;
    text-decoration-thickness: 1.5px;
    text-underline-offset: 4px;
    text-decoration-skip-ink: auto;
    text-decoration-color: var(--prn-line);
}
.prn-vacc-card.is-rec      > strong { text-decoration-color: var(--prn-success); }
.prn-vacc-card.is-consider > strong { text-decoration-color: var(--prn-warning); }
.prn-vacc-card.is-required > strong { text-decoration-color: #d9534f; }
.prn-vacc-card p { /* p direct enfant — texte description vaccin */
    margin: 0 0 0.35rem; font-size: 12.5px; color: var(--prn-ink-soft); line-height: 1.5;
}
/* Notes vaccinales (ageNote, zosterNote, pharmacistNote, etc.) — rendues via
   .prn-callout (système global). Densité ajustée pour rester compact dans
   la carte vaccin sans casser le rythme des paragraphes. */
.prn-vacc-card .prn-callout {
    font-size: 12px;
    padding: 6px 9px;
    margin: 4px 0 0;
    line-height: 1.45;
}
.prn-vacc-card .prn-callout strong { font-weight: 700; }

/* ── Onglets de variant (vaccins multi-formulations : Influenza IM/Flumist, Typhoide Typhim/Vivotif) ── */
.prn-variant-tabs {
    display: flex;
    gap: 4px;
    margin: 0.5rem 0 0.75rem;
    background: var(--prn-line);
    padding: 3px;
    border-radius: 8px;
    flex-wrap: wrap;
}
.prn-variant-tab {
    flex: 1 1 auto;
    min-width: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 7px 10px;
    font-size: 12px;
    font-weight: 600;
    color: var(--prn-ink-soft);
    background: transparent;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.15s, color 0.15s, box-shadow 0.15s;
    text-align: center;
    line-height: 1.2;
}
.prn-variant-tab:hover {
    background: rgba(255,255,255,0.5);
    color: var(--prn-ink);
}
.prn-variant-tab.is-active {
    background: var(--prn-surface);
    color: var(--prn-navy);
    box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}
.prn-variant-tab-label {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.prn-variant-tab-badge {
    font-size: 10px;
    font-weight: 700;
    padding: 1px 6px;
    border-radius: 10px;
    background: #d1e7dd;
    color: #0f5132;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    white-space: nowrap;
}
.prn-variant-tab.is-active .prn-variant-tab-badge {
    background: var(--prn-int-strong);
    color: var(--prn-int-strong-on);
}
@media (max-width: 480px) {
    .prn-variant-tab { font-size: 11px; padding: 6px 8px; }
    .prn-variant-tab-badge { font-size: 9px; padding: 1px 5px; }
}

/* ── Risk analysis cards (TD / Paludisme / MAM) ── */
.prn-risk-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 0.75rem;
    margin: 0.75rem 0 1rem;
}
.prn-risk-card {
    background: #fafdfb;
    border: 1px solid #d4e8e1;
    border-left: 6px solid var(--risk-color, #ccc);
    border-radius: 10px;
    padding: 0.9rem 1rem;
    transition: box-shadow 0.18s, transform 0.18s;
    position: relative;
    display: flex;
    flex-direction: column;
}
.prn-risk-card:hover { box-shadow: 0 4px 14px rgba(26,80,160,0.08); transform: translateY(-1px); }
.prn-risk-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-bottom: 0.4rem;
}
.prn-risk-card-tag {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.15rem 0.55rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 600;
    background: color-mix(in srgb, var(--risk-color, #ccc) 18%, transparent);
    color: #1a1a1a;
    border: 1px solid var(--risk-color, #ccc);
}
.prn-risk-card-tag::before {
    content: "";
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--risk-color, #ccc);
}
.prn-risk-card-tag.eff-overridden {
    background: var(--risk-color, #ccc);
    color: #fff;
    border-color: var(--risk-color, #ccc);
    margin-left: 0.3rem;
    font-weight: 700;
}
.prn-risk-card-tag.eff-overridden::before { background: var(--prn-surface); }
.prn-risk-card-bd-table {
    width: 100%;
    font-size: 0.78rem;
    border-collapse: collapse;
    margin-top: 0.35rem;
}
.prn-risk-card-bd-table td {
    padding: 0.25rem 0.4rem;
    border-bottom: 1px dashed rgba(0,0,0,0.06);
    vertical-align: top;
}
.prn-risk-card-bd-table td.lvl {
    text-align: right;
    white-space: nowrap;
}
.prn-risk-card-bd-table td.lvl strong { color: var(--cell-color, inherit); }
.prn-risk-card-bd-table td.lvl .dot {
    display: inline-block;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--cell-color, #ccc);
    margin-right: 0.3rem;
    vertical-align: middle;
}
.prn-risk-card-empty {
    font-size: 0.78rem;
    color: #888;
    margin-top: 0.4rem;
    font-style: italic;
}
.prn-risk-extra-note {
    margin-top: 0.5rem;
    padding: 0.5rem 0.7rem;
    border-radius: 6px;
    font-size: 0.78rem;
    line-height: 1.4;
}
.prn-risk-extra-note.warn { background: #fff3cd; border-left: 4px solid #f0ad4e; color: #664d03; }
.prn-risk-extra-note.danger { background: var(--prn-danger-bg); border-left: 4px solid #d9534f; color: #842029; }
.prn-risk-extra-note.info { background: #f4f7fb; border-left: 4px solid #4a7bbf; color: #1a3866; }
.prn-risk-override-box {
    margin-top: 0.5rem;
    padding: 0.6rem 0.7rem;
    background: var(--prn-surface);
    border: 1px dashed #c8dcd4;
    border-radius: 8px;
}
.prn-risk-override-lbl {
    display: block;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--prn-ink-soft);
    margin-bottom: 0.25rem;
}
.prn-risk-override-lbl.mt { margin-top: 0.5rem; }
.prn-risk-card-title {
    font-family: var(--font-serif);
    font-size: 0.98rem;
    color: var(--prn-navy);
    margin: 0 0 0.4rem;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}
.prn-risk-card details {
    margin-top: 0.6rem;
    border-top: 1px dashed var(--prn-line);
    padding-top: 0.5rem;
}
.prn-risk-card details summary {
    cursor: pointer;
    font-size: 0.78rem;
    color: var(--prn-blue);
    padding: 0.2rem 0;
    user-select: none;
}
.prn-risk-card details summary:hover { text-decoration: underline; }
.prn-risk-card details[open] summary { margin-bottom: 0.4rem; font-weight: 600; }
.prn-risk-card select.prn-risk-override,
.prn-risk-card textarea.prn-risk-reason {
    width: 100%;
    padding: 0.4rem 0.55rem;
    border: 1px solid var(--prn-line);
    border-radius: 5px;
    font-family: var(--font-sans);
    font-size: 0.82rem;
    color: var(--prn-ink);
    background: var(--prn-surface);
    margin-top: 0.2rem;
}
.prn-risk-card textarea.prn-risk-reason { resize: vertical; min-height: 50px; }
.prn-risk-card label.prn-risk-force-lbl {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin-top: 0.4rem;
    font-size: 0.8rem;
    color: var(--prn-ink);
    cursor: pointer;
}
.prn-risk-card input.prn-risk-force { accent-color: var(--prn-navy); width: 16px; height: 16px; }

/* ── Responsive ── */
@media (max-width: 640px) {
    .prn-map-water svg { max-height: 180px; }
    .prn-dur-group { padding: 0.75rem; }
    .prn-risk-grid { grid-template-columns: 1fr; }
}
.prn-pat-head .prn-kid-remove {
    margin-left: auto;
    padding: 4px 10px;
    background: transparent;
    color: var(--prn-danger);
    border: 1px solid #f5b3aa;
    border-radius: 6px;
    cursor: pointer;
    font-size: 11px;
    font-weight: 600;
}
.prn-pat-head .prn-kid-remove:hover { background: var(--prn-danger-bg); }

/* Champ texte libre : non utilisé par voyage-runner.js (rules .prn-freetext
   supprimées Sprint 5 — composant fourni par .prn-freetext / components.css). */

/* ============================================================================
   Vaccin — chips par patient
   ============================================================================ */
.prn-vp-chips {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin: 6px 30px 8px 0; /* laisse de la place pour la checkbox top-right */
    padding: 6px 8px;
    background: var(--prn-surface-2);
    border-radius: 8px;
    border-left: 3px solid var(--prn-int-strong);
}
.prn-vp-label {
    font-size: 11px;
    font-weight: 700;
    color: var(--prn-int-strong);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-right: 4px;
}
.prn-vp-chip {
    position: relative;
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    border: 1.5px solid #c4d4ce;
    border-radius: 999px;
    background: var(--prn-surface);
    cursor: pointer;
    font-size: 11.5px;
    font-weight: 600;
    color: #333;
    transition: border-color 100ms ease-out, background-color 100ms ease-out;
}
.prn-vp-chip:hover { border-color: var(--prn-int-strong); }
.prn-vp-chip.is-active {
    background: var(--prn-int-strong);
    border-color: var(--prn-int-strong);
    color: var(--prn-int-strong-on);
}
.prn-vp-chip.is-ci {
    background: #fdecec;
    border-color: #d9534f;
    color: #842029;
    text-decoration: line-through;
    cursor: not-allowed;
    opacity: 0.85;
}
.prn-vp-chip.is-ci:hover { border-color: #d9534f; }
.prn-vp-chip input { position: absolute; opacity: 0; pointer-events: none; }

/* Indications avec retours à la ligne (\n dans la donnée) */
.prn-vacc-card p { white-space: pre-line; }

/* ============================================================================
   Section thérapeutique par patient (ordonnance)
   ============================================================================ */
.prn-pat-rx-section {
    border-left: 5px solid var(--prn-int-strong);
}
.prn-pat-rx-section.is-kid {
    border-left-color: #0d6488;
}
.prn-pat-rx-section h3 {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Section vide (aucune CI pertinente pour ce voyage) */
.prn-section-empty {
    font-size: 12px;
    color: #999;
    font-style: italic;
    margin: 4px 0;
}
.prn-rx-info .prn-rx-info-title {
    display: block;
    font-weight: 700;
    font-size: 16px;
    line-height: 1.3;
    letter-spacing: -0.005em;
    color: #1e3a8a;
    margin: 0 0 3px;
    text-decoration: underline;
    text-decoration-thickness: 1.5px;
    text-underline-offset: 4px;
    text-decoration-skip-ink: auto;
    text-decoration-color: #3b82f6;
}
.prn-rx-info .prn-rx-info-action {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: #1d4ed8;
    margin: 0 0 6px;
}
.prn-rx-info .prn-rx-info-meta {
    display: block;
    font-size: 12px;
    color: #1d4ed8;
    margin-top: 4px;
    font-style: italic;
}

/* ─── Carte par option de traitement (rxLine) ────────────────────────────────
   Chaque option à cocher est rendue dans une carte distincte pour gagner en
   lisibilité par rapport à la liste compacte d'origine.
   - is-primary (★)   : 1re ligne, accent vert
   - is-alt           : alternative, accent ambre
   - is-neutral       : option auxiliaire (SRO, etc.), accent neutre
   - is-refused       : refus documenté — barré, atténué
   ============================================================================ */
/* Sous-titre de classe pharmacologique dans un bloc thérapeutique
   (« Antibiotiques », « Symptomatiques & réhydratation »…) — classe les choix
   par classe sans alourdir la liste. */
.prn-rx-class-head {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--prn-muted);
    margin: 10px 0 6px;
}
.prn-rx-class-head:first-child { margin-top: 0; }
.prn-rx-row.is-checked { box-shadow: inset 0 0 0 1px rgba(20, 83, 60, 0.10); }
/* Sélection de traitement plus sobre : plus de bande de couleur (verte/ambre)
   ni d'aplat teinté par tier sur le côté des lignes. La pastille « 1re ligne /
   Alternative » et le marqueur ★ portent la hiérarchie ; toutes les lignes
   partagent une bordure neutre uniforme. */
.prn-rx-row.is-primary,
.prn-rx-row.is-alt,
.prn-rx-row.is-neutral { border-left-color: var(--prn-line); background: #ffffff; }
.prn-rx-row.is-primary:hover,
.prn-rx-row.is-alt:hover,
.prn-rx-row.is-neutral:hover { background: #f8faf9; }
.prn-rx-row.is-primary.is-checked,
.prn-rx-row.is-alt.is-checked,
.prn-rx-row.is-neutral.is-checked { background: #f4f7f5; }
.prn-rx-row.is-refused {
    opacity: 0.55;
    background: #f8f9fa;
}
.prn-rx-row.is-refused .prn-rx-label-text { text-decoration: line-through; }
.prn-rx-row .prn-rx-label-text {
    font-size: 13.5px;
    color: var(--prn-ink);
    flex: 1;
}
/* Nom du médicament : focal point visuel du bloc. Couleur neutre (ink) — le
   tier (1re ligne / alt / neutre) est exprimé par la pastille de tier à côté
   du nom (la bande de couleur latérale a été retirée pour un rendu plus sobre).
   Le <strong> est utilisé partout par les appelants ; la posologie est dans un
   <span> ramené à une taille lisible. */
.prn-rx-row .prn-rx-label-text strong {
    font-size: 16px;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: -0.005em;
    color: var(--prn-ink);
    display: block;
    margin-bottom: 4px;
    text-decoration: underline;
    text-decoration-thickness: 1.5px;
    text-underline-offset: 4px;
    text-decoration-skip-ink: auto;
    text-decoration-color: var(--prn-line);
}
.prn-rx-row.is-primary  .prn-rx-label-text strong { text-decoration-color: var(--prn-line); }
.prn-rx-row.is-alt      .prn-rx-label-text strong { text-decoration-color: var(--prn-line); }
.prn-rx-row.is-neutral  .prn-rx-label-text strong { text-decoration-color: var(--prn-line); }
.prn-rx-row.is-refused  .prn-rx-label-text strong { text-decoration-color: #adb5bd; }
.prn-rx-row .prn-rx-label-text span:not(.prn-rx-tier) {
    /* Posologie : surcharge l'inline style 12px hérité du code historique.
       :not(.prn-rx-tier) évite que cette règle écrase la pastille de tier
       qui vit aussi dans un <span> à l'intérieur du <strong> du label. */
    font-size: 12.5px !important;
    line-height: 1.5;
    color: var(--prn-ink-soft) !important;
    display: block;
    margin-top: 2px;
}

/* Pastille de tier — affichée à droite du nom (« 1re ligne », « Alternative »,
   « Auxiliaire »). Remplace l'étoile Unicode insérée dans le <strong> et
   homogénéise l'indicateur de tier avec le tableau décisionnel. La pastille
   vit À L'INTÉRIEUR du <strong> souligné — on annule explicitement le
   soulignement hérité pour qu'il ne traverse pas la pastille. */
.prn-rx-tier {
    display: inline-block;
    font-size: 10.5px;
    font-weight: 700;
    line-height: 1;
    padding: 3px 7px;
    border-radius: 999px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    vertical-align: 0.15em;
    margin-left: 8px;
    white-space: nowrap;
    text-decoration: none;
}
.prn-rx-tier--first { background: #d1efe2; color: #14533c; }
.prn-rx-tier--alt { background: #fbe7c0; color: #7a4d04; }
.prn-rx-tier--neutral { background: #e2e8f0; color: #475569; }
.prn-rx-tier--refer { background: #dbe7ff; color: #1e3a8a; }
@media print {
    .prn-rx-tier {
        background: transparent !important;
        color: var(--prn-ink) !important;
        padding: 0;
        margin-left: 6px;
    }
    .prn-rx-tier::before { content: "[ "; }
    .prn-rx-tier::after { content: " ]"; }
}
.prn-rx-row .prn-rx-qty-prefix,
.prn-rx-row .prn-rx-qty-suffix {
    font-size: 11px;
    color: var(--prn-muted);
    font-weight: 500;
}
.prn-rx-row.is-refused .prn-rx-qty input { opacity: 0.5; }

/* Mobile (≤ 560 px) : empile la zone quantité sous le label pour éviter
   l'étalement horizontal et conserver une touche cible (44 px) confortable. */


/* Impression : on retire les bordures colorées et la couleur de fond pour
   un rendu papier sobre. La ligne reste lisible mais sans aplat coloré. */
@media print {
    .prn-rx-row .prn-rx-label-text strong { color: #000 !important; }
}

/* ─── Tableaux d'aide à la décision (TD, paludisme, MAM/OPHA) ─────────────────
   Lecture rapide au comptoir. Tableau plein en desktop (≥ 720 px),
   carte empilée en mobile (iPhone 14 = 390 px). Icônes ★ pour 1re ligne,
   ⚠ pour CI, 📋 pour référence médecin. Repliables — fermés par défaut pour
   alléger la page (élément <details>/<summary> natif).
   ============================================================================ */
details.prn-mam-table-wrap {
    margin: 0 0 12px;
    border: 1px solid var(--prn-line);
    border-radius: 8px;
    overflow: hidden;
    background: #fafdfb;
}
/* Supprime le marqueur natif des navigateurs (triangle/disclosure) */
.prn-mam-table-wrap > summary { list-style: none; }
.prn-mam-table-wrap > summary::-webkit-details-marker { display: none; }
.prn-mam-table-wrap > summary::marker { content: ""; }

summary.prn-mam-table-title {
    font-size: 12.5px;
    font-weight: 700;
    color: var(--prn-int-strong);
    background: #f1f8f5;
    padding: 8px 12px;
    display: flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    user-select: none;
    transition: background 0.15s;
}
summary.prn-mam-table-title:hover { background: #e8f1ec; }
summary.prn-mam-table-title:focus-visible {
    outline: 2px solid var(--prn-int-strong);
    outline-offset: -2px;
}
/* Chevron animé (▾ fermé, ▴ ouvert) */
summary.prn-mam-table-title::after {
    content: "▾";
    margin-left: 8px;
    font-size: 11px;
    color: var(--prn-muted);
    transition: transform 0.2s;
}
details[open] > summary.prn-mam-table-title::after { transform: rotate(180deg); }
details[open] > summary.prn-mam-table-title { border-bottom: 1px solid var(--prn-line); }
summary.prn-mam-table-title .prn-mam-table-hint {
    font-weight: 400;
    font-size: 11px;
    color: var(--prn-muted);
    margin-left: auto;
    font-style: italic;
}
/* Adapte le hint quand le tableau est ouvert (« cliquer pour masquer ») */
details[open] > summary.prn-mam-table-title .prn-mam-table-hint::after {
    content: " · ouvert";
}
.prn-mam-table-body {
    /* Permet le défilement horizontal des tableaux larges sur petites tablettes
       sans casser la mise en page mobile (où le tableau se transforme en cartes). */
    overflow-x: auto;
}
.prn-mam-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
    line-height: 1.45;
    color: var(--prn-ink);
}
.prn-mam-table thead th {
    background: #e8f5f1;
    color: var(--prn-int-strong);
    font-weight: 700;
    font-size: 11.5px;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    padding: 6px 8px;
    text-align: left;
    border-bottom: 1px solid #c8d8ce;
}
.prn-mam-table tbody td {
    padding: 8px;
    border-bottom: 1px solid #e6efe9;
    vertical-align: top;
}
.prn-mam-table tbody tr:last-child td { border-bottom: none; }
.prn-mam-table tbody tr.is-firstline { background: #ffffff; }
.prn-mam-table tbody tr.is-secondline { background: #fafafa; }
.prn-mam-table tbody tr.is-refer { background: #eff6ff; }
.prn-mam-table .prn-mam-med {
    font-weight: 700;
    color: var(--prn-ink);
    white-space: nowrap;
}
.prn-mam-table .prn-mam-med-line {
    display: block;
    font-weight: 400;
    font-size: 11px;
    color: var(--prn-muted);
    margin-top: 2px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.prn-mam-table .prn-mam-med .prn-mam-star-icon { color: #b38600; }
.prn-mam-table .prn-mam-med .prn-mam-refer-icon { color: #1e40af; }
.prn-mam-table .prn-mam-prefer { color: #14532d; }
.prn-mam-table .prn-mam-avoid { color: #7f1d1d; }
.prn-mam-table .prn-mam-prefer strong,
.prn-mam-table .prn-mam-avoid strong { color: inherit; }
.prn-mam-table .prn-mam-cell-list {
    margin: 0;
    padding-left: 16px;
}
.prn-mam-table .prn-mam-cell-list li { margin-bottom: 2px; }
.prn-mam-table .prn-mam-cell-list li:last-child { margin-bottom: 0; }

/* Mobile (≤ 720 px) : empile chaque ligne en carte avec étiquettes */
@media (max-width: 720px) {
    .prn-mam-table thead { display: none; }
    .prn-mam-table tbody, .prn-mam-table tr, .prn-mam-table td { display: block; width: 100%; }
    .prn-mam-table tbody tr {
        border-bottom: 1px solid var(--prn-line);
        padding: 8px 10px;
    }
    .prn-mam-table tbody tr:last-child { border-bottom: none; }
    .prn-mam-table tbody td {
        padding: 4px 0;
        border-bottom: none;
    }
    .prn-mam-table tbody td[data-label]::before {
        content: attr(data-label);
        display: block;
        font-size: 10.5px;
        font-weight: 700;
        color: var(--prn-int-strong);
        text-transform: uppercase;
        letter-spacing: 0.04em;
        margin-bottom: 2px;
    }
    .prn-mam-table tbody td.prn-mam-cell-med::before { display: none; }
    .prn-mam-table .prn-mam-med {
        font-size: 13px;
        white-space: normal;
    }
}

@media print {
    /* Le tableau comparatif est un aide-mémoire à l'écran seulement. */
    .prn-mam-table-wrap { display: none !important; }
}

/* Encadré rouge alerte CI à l'intérieur d'un bloc MNP (ex: red flags TD) */
.prn-mnp-redflag {
    background: var(--prn-danger-bg-soft);
    border: 2px solid #d9534f;
    border-left: 6px solid #b91c1c;
    color: #7a1212;
    padding: 10px 12px;
    border-radius: 6px;
    margin: 6px 0 10px;
    font-weight: 600;
    font-size: 12.5px;
    line-height: 1.45;
    display: flex;
    align-items: flex-start;
    gap: 6px;
}
@media print {
    .prn-mnp-redflag { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* Responsive — colonnes plus petites en mobile */
@media (max-width: 640px) {
    .prn-row-label { flex: 0 0 auto; }
}

/* Accessibilité — focus visible sur tous les éléments interactifs.
   Sprint D2 : .prn-pill retiré (sex/preg passent par PRN_PATIENT_SECTION
   → button.prn-chip avec son propre :focus-visible dans components.css). */
.prn-vp-chip input:focus-visible + span,
.prn-chk input:focus-visible + span {
    outline: 2px solid var(--prn-int-strong);
    outline-offset: 2px;
    border-radius: 4px;
}
.prn-pat-rx-section { padding: 1.1rem 1.25rem; }
.prn-pat-rx-section h3 {
    font-family: var(--font-serif);
    font-size: 1.1rem;
    margin-bottom: 0.85rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--prn-line);
}

/* ============================================================================
   Override DARK MODE — remappe toutes les couleurs pastel en dur du module
   voyage pour une cohérence visuelle parfaite. Chaque background pastel light
   devient un dark teinté correspondant, plus doux à l'œil.
   ============================================================================ */
[data-theme="dark"] .prn-map-water,
:root:not([data-theme="light"]) .prn-map-water {
    background: linear-gradient(135deg, rgba(95, 212, 210, 0.10), rgba(108, 200, 173, 0.08));
}
[data-theme="dark"] .prn-map-card,
:root:not([data-theme="light"]) .prn-map-card {
    border-color: var(--prn-line);
}
[data-theme="dark"] .prn-map-legend,
:root:not([data-theme="light"]) .prn-map-legend {
    border-top-color: var(--prn-line);
}
[data-theme="dark"] .prn-map-legend-chip .legend-text,
:root:not([data-theme="light"]) .prn-map-legend-chip .legend-text {
    color: var(--prn-muted);
}
[data-theme="dark"] .prn-map-legend-chip.is-selected .legend-text,
:root:not([data-theme="light"]) .prn-map-legend-chip.is-selected .legend-text {
    color: var(--prn-ink);
}
[data-theme="dark"] .prn-map-legend-chip.is-selected,
:root:not([data-theme="light"]) .prn-map-legend-chip.is-selected {
    background: rgba(255, 255, 255, 0.04);
}

/* Cartes vaccin obligatoire (alerte rouge) — pastel rouge → dark teinté */
[data-theme="dark"] .prn-vacc-card.is-required,
:root:not([data-theme="light"]) .prn-vacc-card.is-required {
    border-color: #fca5a5; background: rgba(252, 165, 165, 0.06);
}

/* Encadrés notes risque (warn/danger/info) — pastels remappés */
[data-theme="dark"] .prn-risk-extra-note.warn,
:root:not([data-theme="light"]) .prn-risk-extra-note.warn {
    background: rgba(252, 211, 77, 0.08); color: #fcd34d; border-left-color: #fcd34d;
}
[data-theme="dark"] .prn-risk-extra-note.danger,
:root:not([data-theme="light"]) .prn-risk-extra-note.danger {
    background: rgba(252, 165, 165, 0.08); color: #fca5a5; border-left-color: #fca5a5;
}
[data-theme="dark"] .prn-risk-extra-note.info,
:root:not([data-theme="light"]) .prn-risk-extra-note.info {
    background: rgba(95, 150, 212, 0.08); color: #93b8e0; border-left-color: #93b8e0;
}

/* Tag « niveau forcé » (eff-overridden) — --risk-color pointe désormais sur les
   tokens --prn-risk-* (pâles en dark) : texte sombre au lieu de blanc. */
[data-theme="dark"] .prn-risk-card-tag.eff-overridden,
:root:not([data-theme="light"]) .prn-risk-card-tag.eff-overridden {
    color: #0d1219;
}

/* Petits bandeaux info "Pour" PIQ + footer ordonnance */
[data-theme="dark"] [style*="background: #fafdfb"],
:root:not([data-theme="light"]) [style*="background: #fafdfb"],
[data-theme="dark"] [style*="background:#fafdfb"],
:root:not([data-theme="light"]) [style*="background:#fafdfb"] {
    background: var(--prn-surface-2) !important;
}
[data-theme="dark"] [style*="background: #fbfdfc"],
:root:not([data-theme="light"]) [style*="background: #fbfdfc"],
[data-theme="dark"] [style*="background:#fbfdfc"],
:root:not([data-theme="light"]) [style*="background:#fbfdfc"] {
    background: var(--prn-surface-2) !important;
}
[data-theme="dark"] [style*="background: #f0f4fb"],
:root:not([data-theme="light"]) [style*="background: #f0f4fb"] {
    background: rgba(95, 150, 212, 0.06) !important;
}

[data-theme="dark"] .prn-rx-row.is-primary,
:root:not([data-theme="light"]) .prn-rx-row.is-primary {
    background: rgba(110, 224, 222, 0.06);
}
[data-theme="dark"] .prn-rx-row.is-primary:hover,
:root:not([data-theme="light"]) .prn-rx-row.is-primary:hover {
    background: rgba(110, 224, 222, 0.10);
}
[data-theme="dark"] .prn-rx-row.is-primary.is-checked,
:root:not([data-theme="light"]) .prn-rx-row.is-primary.is-checked {
    background: rgba(110, 224, 222, 0.14);
}
[data-theme="dark"] .prn-rx-row.is-alt,
:root:not([data-theme="light"]) .prn-rx-row.is-alt {
    background: rgba(252, 211, 77, 0.06);
}
[data-theme="dark"] .prn-rx-row.is-alt:hover,
:root:not([data-theme="light"]) .prn-rx-row.is-alt:hover {
    background: rgba(252, 211, 77, 0.10);
}
[data-theme="dark"] .prn-rx-row.is-alt.is-checked,
:root:not([data-theme="light"]) .prn-rx-row.is-alt.is-checked {
    background: rgba(252, 211, 77, 0.14);
}
[data-theme="dark"] .prn-rx-row.is-neutral,
:root:not([data-theme="light"]) .prn-rx-row.is-neutral {
    background: var(--prn-surface-2);
}
[data-theme="dark"] .prn-rx-row.is-neutral:hover,
:root:not([data-theme="light"]) .prn-rx-row.is-neutral:hover {
    background: var(--prn-bg-alt);
}
[data-theme="dark"] .prn-rx-row.is-refused,
:root:not([data-theme="light"]) .prn-rx-row.is-refused {
    background: var(--prn-surface);
}

/* ── Table « médicaments / produits » (.prn-mam-table) ────────────────────── */
[data-theme="dark"] .prn-mam-table tbody tr.is-firstline,
:root:not([data-theme="light"]) .prn-mam-table tbody tr.is-firstline {
    background: var(--prn-surface);
}
[data-theme="dark"] .prn-mam-table tbody tr.is-secondline,
:root:not([data-theme="light"]) .prn-mam-table tbody tr.is-secondline {
    background: var(--prn-surface-2);
}
[data-theme="dark"] .prn-mam-table tbody tr.is-refer,
:root:not([data-theme="light"]) .prn-mam-table tbody tr.is-refer {
    background: rgba(95, 150, 212, 0.10);
}
[data-theme="dark"] .prn-mam-table tbody td,
:root:not([data-theme="light"]) .prn-mam-table tbody td {
    border-bottom-color: var(--prn-line);
}
[data-theme="dark"] summary.prn-mam-table-title:hover,
:root:not([data-theme="light"]) summary.prn-mam-table-title:hover {
    background: var(--prn-surface-2);
}

/* ── Containers fond clair pastel (sous-bandeaux résumé voyage) ──────────── */
[data-theme="dark"] .prn-vacc-card,
:root:not([data-theme="light"]) .prn-vacc-card {
    background: var(--prn-surface);
    border-color: var(--prn-line);
}

/* ── Bandeau titre carte SVG + bouton légende (le dégradé int-strong devient
   clair en dark : blanc sur teal clair illisible) ─────────────────────────── */
[data-theme="dark"] .prn-map-banner,
:root:not([data-theme="light"]) .prn-map-banner {
    background: linear-gradient(135deg, rgba(110, 224, 222, 0.18), rgba(108, 200, 173, 0.10));
    color: var(--prn-ink);
}
[data-theme="dark"] .prn-map-banner span,
:root:not([data-theme="light"]) .prn-map-banner span { color: var(--prn-muted); }
[data-theme="dark"] .prn-map-legend-btn,
:root:not([data-theme="light"]) .prn-map-legend-btn {
    border-color: var(--prn-line);
    background: rgba(255, 255, 255, 0.06);
    color: var(--prn-ink);
}
[data-theme="dark"] .prn-map-legend-btn:hover,
:root:not([data-theme="light"]) .prn-map-legend-btn:hover { background: rgba(255, 255, 255, 0.12); }

/* Pastille pays multi-destinations (même dégradé int-strong) */
[data-theme="dark"] .prn-country-pill,
:root:not([data-theme="light"]) .prn-country-pill {
    background: var(--prn-int-selected-bg);
    color: var(--prn-blue-2);
    box-shadow: none;
}

/* Encadré « Justification clinique INSPQ » — fond quasi blanc → surface */
[data-theme="dark"] .prn-results-section.prn-inspq-section,
:root:not([data-theme="light"]) .prn-results-section.prn-inspq-section {
    background: var(--prn-surface);
}

/* Encadré d'avertissement (.prn-warning) — crème → warn dark */
[data-theme="dark"] .prn-warning,
:root:not([data-theme="light"]) .prn-warning {
    background: rgba(252, 211, 77, 0.08);
    color: #ffc774;
    border-left-color: #fcd34d;
}

/* Onglets de variant vaccinal : hover translucide + badge pastel remappés */
[data-theme="dark"] .prn-variant-tab:not(.is-active):hover,
:root:not([data-theme="light"]) .prn-variant-tab:not(.is-active):hover {
    background: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .prn-variant-tab-badge,
:root:not([data-theme="light"]) .prn-variant-tab-badge {
    background: rgba(108, 200, 173, 0.15);
    color: #6cc8ad;
}

/* Cartes d'analyse de risque (TD / paludisme / MAM) — fond blanc → surface.
   border-left (6px, var(--risk-color)) conservée : on ne remappe que les
   3 autres côtés. */
[data-theme="dark"] .prn-risk-card,
:root:not([data-theme="light"]) .prn-risk-card {
    background: var(--prn-surface);
    border-top-color: var(--prn-line);
    border-right-color: var(--prn-line);
    border-bottom-color: var(--prn-line);
}
[data-theme="dark"] .prn-risk-card-tag:not(.eff-overridden),
:root:not([data-theme="light"]) .prn-risk-card-tag:not(.eff-overridden) { color: var(--prn-ink); }
[data-theme="dark"] .prn-risk-card-bd-table td,
:root:not([data-theme="light"]) .prn-risk-card-bd-table td {
    border-bottom-color: rgba(255, 255, 255, 0.08);
}

/* Chips « appliquer à » par patient — texte #333 / bordures claires remappés.
   Les états is-active / is-ci / :hover sont re-déclarés pour rester au-dessus
   de l'override de base (même spécificité sinon). */
[data-theme="dark"] .prn-vp-chip,
:root:not([data-theme="light"]) .prn-vp-chip {
    color: var(--prn-ink);
    border-color: var(--prn-line);
}
[data-theme="dark"] .prn-vp-chip:hover,
:root:not([data-theme="light"]) .prn-vp-chip:hover { border-color: var(--prn-int-strong); }
[data-theme="dark"] .prn-vp-chip.is-active,
:root:not([data-theme="light"]) .prn-vp-chip.is-active {
    border-color: var(--prn-int-strong);
    color: var(--prn-int-strong-on);
}
[data-theme="dark"] .prn-vp-chip.is-ci,
:root:not([data-theme="light"]) .prn-vp-chip.is-ci {
    background: #2a1414;
    border-color: #fca5a5;
    color: #ffe7e7;
}

/* Section rx enfant : liseré bleu foncé → bleu clair lisible */
[data-theme="dark"] .prn-pat-rx-section.is-kid,
:root:not([data-theme="light"]) .prn-pat-rx-section.is-kid { border-left-color: #58b0d6; }

/* Pastilles de tier (1re ligne / Alternative / Auxiliaire / Référer) */
[data-theme="dark"] .prn-rx-tier--first,
:root:not([data-theme="light"]) .prn-rx-tier--first { background: rgba(108, 200, 173, 0.18); color: #d1f3df; }
[data-theme="dark"] .prn-rx-tier--alt,
:root:not([data-theme="light"]) .prn-rx-tier--alt { background: rgba(252, 211, 77, 0.15); color: #ffc774; }
[data-theme="dark"] .prn-rx-tier--neutral,
:root:not([data-theme="light"]) .prn-rx-tier--neutral { background: var(--prn-surface-2); color: var(--prn-ink-soft); }
[data-theme="dark"] .prn-rx-tier--refer,
:root:not([data-theme="light"]) .prn-rx-tier--refer { background: rgba(95, 150, 212, 0.18); color: #93b8e0; }

/* Tableaux « Aide à la décision » : conteneur, titre, en-têtes, sémantique */
[data-theme="dark"] details.prn-mam-table-wrap,
:root:not([data-theme="light"]) details.prn-mam-table-wrap { background: var(--prn-surface); }
[data-theme="dark"] summary.prn-mam-table-title,
:root:not([data-theme="light"]) summary.prn-mam-table-title { background: var(--prn-surface-2); }
[data-theme="dark"] .prn-mam-table thead th,
:root:not([data-theme="light"]) .prn-mam-table thead th {
    background: var(--prn-surface-2);
    border-bottom-color: var(--prn-line);
}
[data-theme="dark"] .prn-mam-table .prn-mam-prefer,
:root:not([data-theme="light"]) .prn-mam-table .prn-mam-prefer { color: var(--prn-success); }
[data-theme="dark"] .prn-mam-table .prn-mam-avoid,
:root:not([data-theme="light"]) .prn-mam-table .prn-mam-avoid { color: var(--prn-danger); }
[data-theme="dark"] .prn-mam-table .prn-mam-med .prn-mam-refer-icon,
:root:not([data-theme="light"]) .prn-mam-table .prn-mam-med .prn-mam-refer-icon { color: #93b8e0; }

/* Encadré rouge alerte CI (red flags TD) — texte/bordures rouge foncé → clair */
[data-theme="dark"] .prn-mnp-redflag,
:root:not([data-theme="light"]) .prn-mnp-redflag {
    color: #ffe7e7;
    border-color: #fca5a5;
}

/* Conteneur Leaflet : fond sombre pendant le chargement des tuiles */
[data-theme="dark"] .prn-leaflet-container,
:root:not([data-theme="light"]) .prn-leaflet-container { background: var(--prn-surface-2); }

/* ============================================================================
   POC carte Leaflet (Pérou) — container, légende et tweaks dark mode
   ============================================================================ */
.prn-map-card--leaflet { padding: 0; overflow: hidden; }
.prn-leaflet-container {
    width: 100%;
    min-height: 480px;
    border-radius: 0 0 16px 16px;
    background: #c6e2f5;
    z-index: 0; /* sous le sticky header */
    position: relative; /* ancre le tiroir de légende superposé */
}

/* Sprint 33 — Barre de badges pathogènes au-dessus de la carte Leaflet.
   4 boutons (Malaria / Dengue / Zika / Chikungunya) avec niveau de risque
   par pays. Clic → met à jour le panneau notes Sprint 31. */
.prn-map-pathogens {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 8px 12px;
    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
    font-size: 12px;
}
.prn-map-pathogen-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    border-radius: 8px;
    border: 1px solid #cbd5e1;
    background: #fff;
    cursor: pointer;
    font-size: 12px;
    color: #1f2937;
    transition: transform 0.1s ease, box-shadow 0.1s ease;
}
.prn-map-pathogen-badge:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(0,0,0,0.08);
}
.prn-map-pathogen-badge:focus-visible {
    outline: 2px solid #2563eb;
    outline-offset: 2px;
}
.prn-map-pathogen-icon { font-size: 14px; }
.prn-map-pathogen-name { font-weight: 600; }
.prn-map-pathogen-level {
    padding: 2px 6px;
    border-radius: 6px;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.prn-map-pathogen-badge--elevated { border-color: #fca5a5; }
.prn-map-pathogen-badge--elevated .prn-map-pathogen-level { background: #fee2e2; color: #991b1b; }
.prn-map-pathogen-badge--low { border-color: #fcd34d; }
.prn-map-pathogen-badge--low      .prn-map-pathogen-level { background: #fef3c7; color: #92400e; }
.prn-map-pathogen-badge--none { border-color: #d1d5db; }
.prn-map-pathogen-badge--none     .prn-map-pathogen-level { background: #f3f4f6; color: #4b5563; }
[data-theme="dark"] .prn-map-pathogens,
:root:not([data-theme="light"]) .prn-map-pathogens {
    background: #0f172a;
    border-bottom-color: #334155;
}
[data-theme="dark"] .prn-map-pathogen-badge,
:root:not([data-theme="light"]) .prn-map-pathogen-badge {
    background: #1e293b;
    border-color: #334155;
    color: #e2e8f0;
}
[data-theme="dark"] .prn-map-pathogen-badge--elevated .prn-map-pathogen-level,
:root:not([data-theme="light"]) .prn-map-pathogen-badge--elevated .prn-map-pathogen-level { background: #450a0a; color: #fca5a5; }
[data-theme="dark"] .prn-map-pathogen-badge--low .prn-map-pathogen-level,
:root:not([data-theme="light"]) .prn-map-pathogen-badge--low .prn-map-pathogen-level { background: #422006; color: #fcd34d; }
[data-theme="dark"] .prn-map-pathogen-badge--none .prn-map-pathogen-level,
:root:not([data-theme="light"]) .prn-map-pathogen-badge--none .prn-map-pathogen-level { background: #1f2937; color: #9ca3af; }

/* Barre « Rechercher une ville » — localise un point sur la carte et coche
   la zone qui le contient. */
.prn-map-search {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
}
.prn-map-search-input {
    flex: 1 1 220px;
    min-width: 0;
    padding: 7px 10px;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    font-size: 13px;
    color: #1f2937;
    background: #fff;
}
.prn-map-search-input:focus-visible {
    outline: 2px solid #2563eb;
    outline-offset: 1px;
}
.prn-map-search-btn {
    padding: 7px 14px;
    border: 1px solid #2563eb;
    border-radius: 8px;
    background: #2563eb;
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.1s ease;
}
.prn-map-search-btn:hover { background: #1d4ed8; }
.prn-map-search-btn:focus-visible { outline: 2px solid #1e3a8a; outline-offset: 2px; }
.prn-map-search-status {
    flex: 1 1 100%;
    font-size: 12px;
    color: #475569;
    min-height: 16px;
}
.prn-map-search-status[data-kind="ok"] { color: #15803d; }
.prn-map-search-status[data-kind="warn"] { color: #b45309; }
.prn-map-search-status[data-kind="pending"] { color: #2563eb; }
/* Marqueur de résultat de recherche : halo pulsant pour le repérer. */
.prn-map-search-pin {
    animation: prn-map-search-pulse 1.4s ease-out infinite;
}
@media (prefers-reduced-motion: reduce) {
    .prn-map-search-pin { animation: none; }
}
/* Marqueur ville bicolore (ville très touristique ET ≥ 2500 m) : on neutralise
   le cadre blanc par défaut de Leaflet (.leaflet-div-icon) pour ne laisser que
   la pastille moitié mauve / moitié orange. */
.prn-city-split-icon {
    background: transparent;
    border: 0;
}
/* Pastilles d'itinéraire numérotées (ordre de sélection des villes) + trait
   de liaison : la pastille colorée est dessinée en HTML inline, on neutralise
   donc le cadre blanc par défaut de Leaflet comme pour la pastille bicolore. */
.prn-itin-marker {
    background: transparent;
    border: 0;
}
.prn-itin-badge { cursor: pointer; }
/* Étape d'itinéraire = pastille numérotée + étiquette de NOM permanente à
   droite (lisible sans survol — on voit tout de suite où va le patient). */
.prn-itin-stop {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.prn-itin-name {
    position: absolute;
    left: calc(100% + 6px);
    top: 50%;
    transform: translateY(-50%);
    white-space: nowrap;
    background: rgba(255, 255, 255, 0.97);
    border: 1.5px solid #0f766e;
    border-radius: 999px;
    padding: 3px 10px;
    font-size: 13px;
    font-weight: 700;
    color: #0f172a;
    box-shadow: 0 2px 7px rgba(0, 0, 0, 0.32);
    pointer-events: none;   /* n'intercepte pas les clics carte/zones */
}
.prn-itin-stop--high .prn-itin-name { border-color: #b45309; }
.prn-itin-name-alt {
    color: #475569;
    font-weight: 600;
    font-size: 11px;
}

/* ── Mode « aperçu d'itinéraire » ────────────────────────────────────────────
   Posé par map-leaflet.js (updateItinFocus) sur le conteneur : dès qu'au
   moins une ville est SÉLECTIONNÉE et tant que la carte reste dézoomée
   (< z8), les noms de villes du fond (tuiles labels Carto) et les pastilles
   de villes non sélectionnées s'estompent — les villes de l'itinéraire
   ressortent seules. Zoomer restaure tous les noms (exploration fine).
   NB : on estompe le PANE des labels (.leaflet-labels-pane) et non le
   conteneur de la couche de tuiles — Leaflet écrit une opacité INLINE sur ce
   dernier (elle battrait la règle CSS). */
.leaflet-labels-pane,
.prn-city-dot,
.prn-city-split-icon { transition: opacity 0.25s ease; }
.prn-map--itin-focus .leaflet-labels-pane { opacity: 0.22; }
.prn-map--itin-focus .prn-city-dot { opacity: 0.45; }
.prn-map--itin-focus .prn-city-split-icon { opacity: 0.5; }
/* Flèches de direction sur le trait (sens de visite 1 → 2 → 3). */
.prn-itin-arrow-icon {
    background: transparent;
    border: 0;
}
.prn-itin-arrow { display: block; }

/* Bandeau-itinéraire sous la barre de recherche : « Itinéraire : 1 Lima ·
   154 m → 2 Cusco · 3399 m  [⤢ Tout l'itinéraire] ». Chaque étape est
   cliquable (voir sur la carte) et retirable (✕). */
.prn-itin-strip {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    background: #f0fdfa;
    border-bottom: 1px solid #99f6e4;
    font-size: 12.5px;
}
.prn-itin-strip-label {
    font-weight: 700;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #115e59;
}
.prn-itin-chip {
    display: inline-flex;
    align-items: stretch;
    background: #fff;
    border: 1px solid #5eead4;
    border-radius: 999px;
    overflow: hidden;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.07);
}
.prn-itin-chip--high { border-color: #fcd34d; }
.prn-itin-chip-go {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 3px 8px 3px 4px;
    border: 0;
    background: transparent;
    font: inherit;
    font-size: 12.5px;
    color: #0f172a;
    cursor: pointer;
}
.prn-itin-chip-go:hover { background: #ccfbf1; }
.prn-itin-chip-go:focus-visible,
.prn-itin-chip-x:focus-visible,
.prn-itin-fit:focus-visible { outline: 2px solid #0d9488; outline-offset: -2px; }
.prn-itin-chip-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #1a6b5a;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    flex-shrink: 0;
}
.prn-itin-chip--high .prn-itin-chip-num { background: #b45309; }
.prn-itin-chip-alt { color: #64748b; font-size: 11px; }
.prn-itin-chip-x {
    border: 0;
    border-left: 1px solid #e2e8f0;
    background: transparent;
    padding: 0 8px;
    color: #94a3b8;
    font-size: 11px;
    cursor: pointer;
    transition: background 0.1s ease, color 0.1s ease;
}
.prn-itin-chip-x:hover { background: #fef2f2; color: #b91c1c; }
.prn-itin-chip-arrow { color: #0d9488; font-weight: 700; }
.prn-itin-fit {
    margin-left: auto;
    padding: 4px 10px;
    border: 1px solid #99f6e4;
    border-radius: 999px;
    background: #fff;
    color: #115e59;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.1s ease;
}
.prn-itin-fit:hover { background: #ccfbf1; }
/* Échantillon « itinéraire » dans la légende de la carte. */
.prn-map-legend-itin-sample {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #1a6b5a;
    color: #fff;
    font-size: 9px;
    font-weight: 700;
    flex-shrink: 0;
    border: 1.5px solid #fff;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2);
}
/* Dark mode du bandeau + étiquettes carte */
[data-theme="dark"] .prn-itin-strip,
:root:not([data-theme="light"]) .prn-itin-strip {
    background: #042f2e;
    border-bottom-color: #134e4a;
}
[data-theme="dark"] .prn-itin-strip-label,
:root:not([data-theme="light"]) .prn-itin-strip-label { color: #5eead4; }
[data-theme="dark"] .prn-itin-chip,
:root:not([data-theme="light"]) .prn-itin-chip {
    background: #1e293b;
    border-color: #0f766e;
}
[data-theme="dark"] .prn-itin-chip--high,
:root:not([data-theme="light"]) .prn-itin-chip--high { border-color: #92400e; }
[data-theme="dark"] .prn-itin-chip-go,
:root:not([data-theme="light"]) .prn-itin-chip-go { color: #e2e8f0; }
[data-theme="dark"] .prn-itin-chip-go:hover,
:root:not([data-theme="light"]) .prn-itin-chip-go:hover { background: #134e4a; }
[data-theme="dark"] .prn-itin-chip-x,
:root:not([data-theme="light"]) .prn-itin-chip-x { border-left-color: #334155; }
[data-theme="dark"] .prn-itin-chip-x:hover,
:root:not([data-theme="light"]) .prn-itin-chip-x:hover { background: #450a0a; color: #fca5a5; }
[data-theme="dark"] .prn-itin-fit,
:root:not([data-theme="light"]) .prn-itin-fit {
    background: #1e293b;
    border-color: #0f766e;
    color: #5eead4;
}
[data-theme="dark"] .prn-itin-fit:hover,
:root:not([data-theme="light"]) .prn-itin-fit:hover { background: #134e4a; }
/* Les étiquettes de nom restent sur FOND CLAIR même en dark : la carte
   (tuiles Voyager) reste claire, une pastille sombre y flotterait. */
[data-theme="dark"] .prn-map-search,
:root:not([data-theme="light"]) .prn-map-search {
    background: #0f172a;
    border-bottom-color: #334155;
}
[data-theme="dark"] .prn-map-search-input,
:root:not([data-theme="light"]) .prn-map-search-input {
    background: #1e293b;
    border-color: #334155;
    color: #e2e8f0;
}
[data-theme="dark"] .prn-map-search-status,
:root:not([data-theme="light"]) .prn-map-search-status { color: #94a3b8; }
/* Conserve les couleurs sémantiques du statut (ok/warn/pending) en dark —
   sinon l'override générique ci-dessus les écrase (même spécificité, déclaré après). */
[data-theme="dark"] .prn-map-search-status[data-kind="ok"],
:root:not([data-theme="light"]) .prn-map-search-status[data-kind="ok"] { color: var(--prn-success); }
[data-theme="dark"] .prn-map-search-status[data-kind="warn"],
:root:not([data-theme="light"]) .prn-map-search-status[data-kind="warn"] { color: #fcd34d; }
[data-theme="dark"] .prn-map-search-status[data-kind="pending"],
:root:not([data-theme="light"]) .prn-map-search-status[data-kind="pending"] { color: var(--prn-blue-2); }

/* Sprint 31 — Panneau notes cliniques à côté de la carte Leaflet.
   Mobile : empilé sous la carte. Desktop ≥ 900px : à droite. */
.prn-map-with-panel {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
}
.prn-map-card--with-panel .prn-leaflet-container {
    border-radius: 0;
    min-height: 480px;
}
.prn-map-note-panel {
    background: #fafafa;
    border-top: 1px solid #e2e8f0;
    padding: 14px 16px;
    min-height: 120px;
    font-size: 13px;
    line-height: 1.5;
    color: #1f2937;
}
.prn-map-note-empty {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #64748b;
}
.prn-map-note-empty-icon {
    font-size: 24px;
    flex-shrink: 0;
}
.prn-map-note-empty p {
    margin: 0;
    font-size: 12px;
}
.prn-map-note-header { margin-bottom: 6px; }
.prn-map-note-badge {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.prn-map-note-badge--elevated { background: #fee2e2; color: #991b1b; }
.prn-map-note-badge--low { background: #fef3c7; color: #92400e; }
.prn-map-note-badge--none { background: #f3f4f6; color: #4b5563; }
.prn-map-note-title {
    margin: 4px 0 10px;
    font-size: 14px;
    font-weight: 600;
    color: #0f172a;
    line-height: 1.4;
}
.prn-map-note-meta {
    display: grid;
    grid-template-columns: 110px 1fr;
    gap: 8px;
    padding: 6px 0;
    border-top: 1px dashed #e5e7eb;
    font-size: 12px;
}
.prn-map-note-meta:first-of-type { border-top: 0; }
.prn-map-note-meta span {
    color: #64748b;
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: 0.04em;
}
.prn-map-note-meta strong {
    color: #0f172a;
    font-weight: 600;
    overflow-wrap: anywhere;
}
.prn-map-note-source {
    margin: 10px 0 0;
    padding-top: 8px;
    border-top: 1px solid #e5e7eb;
    font-size: 10px;
    color: #94a3b8;
    font-style: italic;
}

/* Sprint 32 — note clinique ville touristique (longue ligne descriptive) */
.prn-map-note-city-detail {
    margin: 10px 0 0;
    padding: 8px 10px;
    background: rgba(255, 255, 255, 0.6);
    border-left: 3px solid #94a3b8;
    border-radius: 4px;
    font-size: 12px;
    line-height: 1.5;
    color: #1f2937;
}
.prn-map-note-content[data-risk="elevated"] .prn-map-note-city-detail { border-left-color: #ef4444; }
.prn-map-note-content[data-risk="low"]      .prn-map-note-city-detail { border-left-color: #f59e0b; }
.prn-map-note-content[data-risk="none"]     .prn-map-note-city-detail { border-left-color: #10b981; }
[data-theme="dark"] .prn-map-note-city-detail,
:root:not([data-theme="light"]) .prn-map-note-city-detail {
    background: rgba(15, 23, 42, 0.5);
    color: #e2e8f0;
}

@media (min-width: 900px) {
    .prn-map-with-panel {
        grid-template-columns: 1fr 320px;
    }
    .prn-map-card--with-panel .prn-leaflet-container {
        min-height: 600px;
        border-radius: 0;
    }
    .prn-map-note-panel {
        border-top: 0;
        border-left: 1px solid #e2e8f0;
        max-height: 600px;
        overflow-y: auto;
    }
}

/* Dark mode */
[data-theme="dark"] .prn-map-note-panel,
:root:not([data-theme="light"]) .prn-map-note-panel {
    background: #1e293b;
    border-color: #334155;
    color: #e2e8f0;
}
[data-theme="dark"] .prn-map-note-empty,
:root:not([data-theme="light"]) .prn-map-note-empty { color: #94a3b8; }
[data-theme="dark"] .prn-map-note-title,
:root:not([data-theme="light"]) .prn-map-note-title { color: #f1f5f9; }
[data-theme="dark"] .prn-map-note-meta,
:root:not([data-theme="light"]) .prn-map-note-meta { border-top-color: #334155; }
[data-theme="dark"] .prn-map-note-meta strong,
:root:not([data-theme="light"]) .prn-map-note-meta strong { color: #f1f5f9; }
[data-theme="dark"] .prn-map-note-source,
:root:not([data-theme="light"]) .prn-map-note-source {
    border-top-color: #334155;
    color: #64748b;
}
[data-theme="dark"] .prn-map-note-badge--elevated,
:root:not([data-theme="light"]) .prn-map-note-badge--elevated { background: #450a0a; color: #fca5a5; }
[data-theme="dark"] .prn-map-note-badge--low,
:root:not([data-theme="light"]) .prn-map-note-badge--low { background: #422006; color: #fcd34d; }
[data-theme="dark"] .prn-map-note-badge--none,
:root:not([data-theme="light"]) .prn-map-note-badge--none { background: #1f2937; color: #9ca3af; }

/* Légende custom rendue par map-leaflet.js (control bottomright) */
/* ── Légende Leaflet = tiroir latéral gauche ──────────────────────────
   Panneau pleine hauteur ancré au bord gauche de la carte, qui glisse
   depuis la gauche. Une poignée (onglet) sur son bord droit reste toujours
   visible pour l'ouvrir/fermer. Styles scopés au tiroir pour ne pas
   affecter la légende à chips de la carte SVG (`.prn-map-legend` ligne ~242). */
.prn-map-legend--drawer {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 270px;
    max-width: 80%;
    box-sizing: border-box;
    background: rgba(255, 255, 255, 0.97);
    backdrop-filter: blur(6px);
    border-right: 1px solid var(--prn-line);
    box-shadow: 2px 0 12px rgba(0, 0, 0, 0.18);
    font-size: 12px;
    color: var(--prn-ink);
    line-height: 1.35;
    display: flex;
    flex-direction: column;
    z-index: 1000;
    transform: translateX(0);
    transition: transform 0.25s ease;
}

.prn-map-legend--drawer .prn-map-legend-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 12px 14px;
}

/* Poignée (onglet) sur le bord droit du tiroir — toujours visible. */
.prn-map-legend--drawer .prn-map-legend-toggle {
    position: absolute;
    top: 10px;
    left: 100%;
    min-height: 40px;
    padding: 8px 6px;
    border: 1px solid var(--prn-line);
    border-left: none;
    border-radius: 0 8px 8px 0;
    background: rgba(255, 255, 255, 0.97);
    backdrop-filter: blur(6px);
    color: var(--prn-ink);
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    line-height: 1.1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 2px 0 8px rgba(0, 0, 0, 0.12);
    writing-mode: vertical-rl;
    white-space: nowrap;
    transition: background-color 100ms ease-out, border-color 100ms ease-out;
}
.prn-map-legend--drawer .prn-map-legend-toggle:hover {
    background: var(--prn-int-hover-bg);
    border-color: var(--prn-int-hover-border);
}
.prn-map-legend--drawer .prn-map-legend-toggle-open { display: none; }
.prn-map-legend--drawer .prn-map-legend-toggle-close { display: inline; }

/* État fermé : le tiroir glisse hors de la carte, seule la poignée reste. */
.prn-map-legend--drawer.prn-map-legend--collapsed {
    transform: translateX(-100%);
}
.prn-map-legend--drawer.prn-map-legend--collapsed .prn-map-legend-toggle-open { display: inline; }
.prn-map-legend--drawer.prn-map-legend--collapsed .prn-map-legend-toggle-close { display: none; }
.prn-map-legend-title {
    font-weight: 700;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--prn-muted);
    margin-bottom: 6px;
}
.prn-map-legend-row {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px 6px;
    margin: 0 -6px;
    border-radius: 6px;
    transition: background .15s;
}
.prn-map-legend-row:hover { background: rgba(95, 150, 212, 0.10); }
.prn-map-legend-row.is-selected {
    background: rgba(95, 150, 212, 0.18);
    font-weight: 600;
}
.prn-map-legend-swatch {
    display: inline-block;
    width: 14px; height: 14px;
    border-radius: 3px;
    border: 1.5px solid;
    flex-shrink: 0;
}
/* Swatch « risque conditionnel » : contour pointillé + trame claire, pour
   refléter le rendu carte (zone à risque seulement sous un critère). */
.prn-map-legend-swatch--cond {
    border-style: dashed;
    border-color: #8d5a1d;
    background-image: repeating-linear-gradient(
        45deg, transparent, transparent 2px,
        rgba(141, 90, 29, 0.35) 2px, rgba(141, 90, 29, 0.35) 4px
    );
}
.prn-map-legend-label { flex: 1; font-size: 12px; }
.prn-map-legend-sep {
    height: 1px;
    background: var(--prn-line);
    margin: 8px -4px;
}
.prn-map-legend-mini {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    color: var(--prn-muted);
    padding: 2px 0;
}
.prn-map-legend-dot {
    display: inline-block;
    width: 9px; height: 9px;
    border-radius: 50%;
    flex-shrink: 0;
    border: 1.5px solid rgba(0, 0, 0, 0.2);
}
.prn-map-legend-source {
    margin-top: 8px;
    padding-top: 6px;
    border-top: 1px dashed var(--prn-line);
    font-size: 10px;
    color: var(--prn-muted);
    font-style: italic;
}

/* Dark mode : on garde la légende lisible */
[data-theme="dark"] .prn-map-legend,
:root:not([data-theme="light"]) .prn-map-legend {
    background: rgba(20, 27, 37, 0.96);
    border-color: var(--prn-line);
    color: var(--prn-ink);
}
[data-theme="dark"] .prn-map-legend-row:hover,
:root:not([data-theme="light"]) .prn-map-legend-row:hover {
    background: rgba(95, 150, 212, 0.18);
}
[data-theme="dark"] .prn-map-legend--drawer .prn-map-legend-toggle,
:root:not([data-theme="light"]) .prn-map-legend--drawer .prn-map-legend-toggle {
    background: rgba(20, 27, 37, 0.96);
    border-color: var(--prn-line);
    color: var(--prn-ink);
}

/* Tooltips Leaflet dans la même charte */
.leaflet-tooltip {
    border-radius: 6px;
    font-size: 12px;
    padding: 4px 8px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
}
.leaflet-popup-content {
    margin: 10px 12px;
    font-size: 13px;
    line-height: 1.45;
}

/* Voyage — résultats clairs : onglet sans recommandation (grisé) + badge verdict */
.prn-results-tab.is-empty { opacity: .5; }
.prn-tab-verdict { display: block; font-size: 10px; font-weight: 600; margin-top: 2px; opacity: .85; }
.prn-results-counter { font-size: 12px; color: var(--prn-muted); margin: -6px 0 12px; }

/* Voyage — bouton ⓘ « pourquoi » (détails repliables natifs) */
.prn-why > summary.prn-why-summary { cursor: pointer; list-style: none; font-weight: 700; font-size: 13.5px; }
.prn-why > summary.prn-why-summary::-webkit-details-marker { display: none; }
.prn-why > summary.prn-why-summary::marker { content: ""; }
.prn-why-hint { font-weight: 500; font-size: 11px; color: var(--prn-muted); }
.prn-why-med { margin: 4px 0 8px; }
.prn-why-med > summary.prn-why-summary { font-weight: 600; font-size: 11.5px; padding: 3px 0; color: var(--prn-navy); }
.prn-why-panel { margin: 4px 0 0; padding: 8px 12px; background: var(--prn-surface); border: 1px solid var(--prn-line); border-left: 3px solid var(--prn-int-strong, #1a6b5a); border-radius: 6px; font-size: 12.5px; line-height: 1.55; }
@keyframes prn-map-search-pulse {
    0%   { stroke-opacity: 1;   stroke-width: 3; }
    70%  { stroke-opacity: 0.3; stroke-width: 9; }
    100% { stroke-opacity: 1;   stroke-width: 3; }
}

/* Voyage — bandeaux inline du panneau résultats (audit dark 2026-07) :
   les gradients clairs inline (alertes sécurité/Zika, note « résultats
   périmés ») ne sont couverts par aucun shim background — on les remappe
   ici pour le thème sombre (le mode clair garde le style inline). */
[data-theme="dark"] .prn-safety-alerts,
:root:not([data-theme="light"]) .prn-safety-alerts {
    background: var(--prn-warning-bg) !important;
    border-color: var(--prn-warning) !important;
}
[data-theme="dark"] .prn-safety-alerts :is(h3, ul, div),
:root:not([data-theme="light"]) .prn-safety-alerts :is(h3, ul, div) {
    color: var(--prn-warning) !important;
}
[data-theme="dark"] .prn-results-stale-note,
:root:not([data-theme="light"]) .prn-results-stale-note {
    background: rgba(95, 150, 212, 0.10) !important;
    border-color: #93b8e0 !important;
    color: #93b8e0 !important;
}

/* Voyage — wizard : compléments dark pour styles inline du runner (audit dark
   2026-07). Le mode clair garde les styles inline du JS ; on ne remappe que
   le thème sombre (!important requis pour battre les styles inline). */

/* Bandeau « Reprendre la consultation » (brouillon) — couleurs light + dark
   ici (le cssText JS ne porte que la mise en page). */
#prn-draft-banner {
    background: linear-gradient(90deg, #e0f2fe, #dbeafe);
    border: 1px solid #93c5fd;
    border-left: 5px solid #2563eb;
    color: #1e3a8a;
}
[data-theme="dark"] #prn-draft-banner,
:root:not([data-theme="light"]) #prn-draft-banner {
    background: rgba(147, 197, 253, 0.12);
    border-color: rgba(147, 197, 253, 0.4);
    border-left-color: #93c5fd;
    color: #bfdbfe;
}

/* Note INSPQ contextuelle par pays (inspqCountryNoteHtml) — cartes pastel
   remappées par niveau de risque via data-level. */
[data-theme="dark"] .prn-inspq-country[data-level="élevé"],
:root:not([data-theme="light"]) .prn-inspq-country[data-level="élevé"] {
    background: rgba(252, 165, 165, 0.10) !important;
    border-left-color: #fca5a5 !important;
    color: #ffe7e7 !important;
}
[data-theme="dark"] .prn-inspq-country[data-level="modéré"],
:root:not([data-theme="light"]) .prn-inspq-country[data-level="modéré"] {
    background: rgba(253, 186, 116, 0.10) !important;
    border-left-color: #fdba74 !important;
    color: #ffe6c4 !important;
}
[data-theme="dark"] .prn-inspq-country[data-level="faible"],
:root:not([data-theme="light"]) .prn-inspq-country[data-level="faible"],
[data-theme="dark"] .prn-inspq-country[data-level="très faible"],
:root:not([data-theme="light"]) .prn-inspq-country[data-level="très faible"] {
    background: rgba(252, 211, 77, 0.08) !important;
    border-left-color: #fcd34d !important;
    color: #ffe6c4 !important;
}
[data-theme="dark"] .prn-inspq-country[data-level="nul"],
:root:not([data-theme="light"]) .prn-inspq-country[data-level="nul"] {
    background: rgba(147, 197, 253, 0.12) !important;
    border-left-color: #93c5fd !important;
    color: #bfdbfe !important;
}
[data-theme="dark"] .prn-inspq-country[data-level="vide"],
:root:not([data-theme="light"]) .prn-inspq-country[data-level="vide"] {
    background: var(--prn-surface-2) !important;
    color: var(--prn-ink) !important;
}

/* Légende de la carte SVG — texte de niveau + pastille getRiskColor (palette
   600-900 pensée pour fond clair) éclaircis en dark via color-mix. */
[data-theme="dark"] .prn-map-legend-chip .legend-level,
:root:not([data-theme="light"]) .prn-map-legend-chip .legend-level {
    color: color-mix(in srgb, var(--risk-color, var(--prn-ink)) 45%, white) !important;
}
[data-theme="dark"] .prn-map-legend-chip .legend-dot,
:root:not([data-theme="light"]) .prn-map-legend-chip .legend-dot {
    background: color-mix(in srgb, var(--risk-color, var(--prn-ink)) 45%, white) !important;
}

/* Eau de la carte SVG — dégradé bleu clair → bleu nuit (l'override dark de
   .prn-map-water est sinon masqué par le <rect> plein cadre). */
[data-theme="dark"] .prn-map-water-stop1,
:root:not([data-theme="light"]) .prn-map-water-stop1 { stop-color: #2b4a66 !important; }
[data-theme="dark"] .prn-map-water-stop2,
:root:not([data-theme="light"]) .prn-map-water-stop2 { stop-color: #1e3750 !important; }