/* Site public : thème autonome (aucune dépendance à jQuery ni à Bootstrap).
 * Couleurs reprises de l'existant : bleu #107ACA, orange #FD8F01. Pour changer l'allure du site, modifiez d'abord les variables ci-dessous. */
:root {
  --blue:#107ACA; --blue-d:#0b5a9c; --blue-dd:#0b2540; --blue-l:#eaf3fb;
  --orange:#FD8F01; --orange-d:#c86a00; --ink:#1d2733; --muted:#5a6b7b; --line:#dbe4ec; --bg:#f4f8fb;
  --radius:12px; --shadow:0 2px 14px rgba(11,37,64,.09);
}
* { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body.sx { margin:0; background:var(--bg); color:var(--ink); font:17px/1.6 system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; }
.sx a { color:var(--blue-d); }
.sx img { max-width:100%; height:auto; }
.sx :focus-visible { outline:3px solid var(--orange); outline-offset:2px; }
.sx-skip { position:absolute; left:-999px; top:0; background:#fff; color:var(--ink); padding:.6rem 1rem; z-index:200; border-radius:0 0 8px 0; }
.sx-skip:focus { left:0; }
.sx-wrap { max-width:1040px; margin:0 auto; padding:0 1rem; }

/* ---- en-tête ---- */
.sx-header { position:sticky; top:0; z-index:100; background:#fff; box-shadow:0 1px 0 var(--line), 0 4px 16px rgba(11,37,64,.06); }
.sx-bar { max-width:1040px; margin:0 auto; padding:.55rem 1rem; display:flex; align-items:center; gap:.5rem 1rem; flex-wrap:wrap; }
.sx-brand { font-weight:800; font-size:1.15rem; color:var(--blue-dd) !important; text-decoration:none; margin-right:auto; letter-spacing:.2px; }
.sx-brand::before { content:"✚"; color:var(--blue); margin-right:.45rem; }
.sx-nav { order:10; width:100%; border-top:1px solid var(--line); margin-top:.2rem; padding-top:.2rem; }
.sx-nav ul { list-style:none; margin:0; padding:0; display:flex; align-items:center; gap:.15rem; flex-wrap:wrap; }
.sx-nav a, .sx-nav button { display:block; font:inherit; font-size:.97rem; font-weight:600; color:var(--ink); background:none; border:0; padding:.55rem .8rem; border-radius:8px; cursor:pointer; text-decoration:none; }
.sx-nav a:hover, .sx-nav button:hover { background:var(--blue-l); color:var(--blue-d); }
.sx-nav a[aria-current="page"] { color:var(--blue-d); box-shadow:inset 0 -3px 0 var(--orange); border-radius:8px 8px 0 0; }
.sx-nav > ul > li { display:flex; align-items:center; }
.sx-dd { position:relative; }
.sx-dd > button::after { content:"▾"; margin-left:.3rem; font-size:.8em; }
.sx-dd > ul { display:none; position:absolute; left:0; top:100%; min-width:230px; background:#fff; border:1px solid var(--line); border-radius:10px; box-shadow:var(--shadow); padding:.35rem; flex-direction:column; align-items:stretch; gap:0; z-index:150; }
.sx-dd.is-open > ul { display:flex; }
@media (hover:hover) and (min-width:861px) { .sx-dd:hover > ul { display:flex; } }
.sx-dd > ul a { padding:.5rem .8rem; font-weight:500; }
.sx-cta { display:inline-block; background:var(--orange); color:#1a1100 !important; font-weight:800; text-decoration:none; padding:.6rem 1.15rem; border-radius:999px; box-shadow:0 2px 0 var(--orange-d); white-space:nowrap; }
.sx-cta:hover { background:#ffa11f; }
.sx-burger { display:none; font:inherit; font-weight:700; background:var(--blue-l); color:var(--blue-d); border:0; padding:.55rem 1rem; border-radius:8px; cursor:pointer; }
@media (max-width:860px) {
  .sx-burger { display:inline-block; }
  .sx-nav { display:none; }
  .sx-nav.is-open { display:block; }
  .sx-nav ul { flex-direction:column; align-items:stretch; padding:.3rem 0 .6rem; }
  .sx-nav a, .sx-nav button { width:100%; text-align:left; padding:.8rem .6rem; }
  .sx-dd > ul { position:static; display:none; box-shadow:none; border:0; border-left:3px solid var(--blue-l); border-radius:0; margin-left:.6rem; }
  .sx-dd.is-open > ul { display:flex; }
}

/* ---- titre de page ---- */
.sx-hero { background:linear-gradient(135deg, var(--blue-d), var(--blue)); color:#fff; padding:2.2rem 0 4.2rem; }
.sx-hero h1 { margin:0; font-size:2rem; font-size:clamp(1.7rem, 4.5vw, 2.5rem); line-height:1.15; font-weight:800; }

/* ---- contenu ---- */
.sx-main { max-width:1040px; margin:-2.8rem auto 3rem; padding:0 1rem; }
.sx-card { background:#fff; border-radius:var(--radius); box-shadow:var(--shadow); padding:1.6rem 1.5rem 2rem; min-height:320px; }
@media (min-width:700px) { .sx-card { padding:2rem 2.4rem 2.4rem; } }
.sx-card h2 { margin:0 0 1rem; font-size:1.35rem; line-height:1.35; color:var(--blue-dd); }
.sx-card h3 { margin:1.6rem 0 .7rem; font-size:1.15rem; color:var(--blue-d); }

/* liste de conseils */
.sx-links { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(auto-fill, minmax(230px, 1fr)); gap:.9rem; }
.sx-links a { display:flex; align-items:center; min-height:72px; padding:1rem 1.2rem; background:var(--blue-l); border:1px solid #cfe2f3; border-left:6px solid var(--blue); border-radius:10px; font-weight:700; font-size:1.05rem; color:var(--blue-dd); text-decoration:none; }
.sx-links a:hover { background:#dcecfa; transform:translateY(-2px); box-shadow:var(--shadow); }
@media (prefers-reduced-motion:no-preference) { .sx-links a { transition:transform .15s, box-shadow .15s, background .15s; } }
.sx-empty { color:var(--muted); font-style:italic; }

/* ---- pied de page ---- */
.sx-footer { background:var(--blue-dd); color:#cfe0f1; padding:1.6rem 0; font-size:.93rem; }
.sx-footer a { color:#fff; }
.sx-footer p { margin:.2rem 0; }

/* ============ Questionnaires « Dois-je consulter ? » : habillage du contenu existant (les textes ne changent pas) ============ */
.sx-q > div[style*="min-height"] { background:transparent !important; padding:0 !important; min-height:0 !important; }
.sx-q br + br { display:none; }
.sx-q div + br, .sx-q center + br, .sx-q table + br, .sx-q h2 + br, .sx-q h3 + br, .sx-q ul + br, .sx-q hr + br { display:none; }
.sx-q center { display:block; text-align:center; margin:.4rem 0 .2rem; }
.sx-q ul { margin:.6rem 0 1rem; padding-left:1.4rem; }
.sx-q li { margin:.35rem 0; }
.sx-q center ul, .sx-q center ol { text-align:left; max-width:36rem; margin-left:auto; margin-right:auto; }
.sx-q hr { border:0; border-top:1px solid var(--line); margin:1.5rem 0; }
.sx-q img { border-radius:8px; }
.sx-q em { color:var(--muted); }

/* choix de symptôme (Fièvre | Vomissements | Diarrhée) */
.sx-q table[align="center"], .sx-q table[align="center"] tbody { display:block; margin:.6rem auto 1.2rem; }
.sx-q table[align="center"] tr { display:flex; flex-wrap:wrap; justify-content:center; gap:.5rem; }
.sx-q table[align="center"] td { display:block; padding:0; }
.sx-q table[align="center"] td:nth-child(even) { display:none; }   /* cellules d'espacement (&nbsp;) de l'ancienne mise en page */
.sx-q table[align="center"] a { display:block !important; padding:.65rem 1.2rem !important; border:2px solid var(--orange) !important; border-radius:999px !important; background:#fff !important; color:var(--ink) !important; font-size:1rem !important; font-weight:700 !important; text-decoration:none !important; text-align:center; }
.sx-q table[align="center"] a:hover { background:#fff3e0 !important; }
.sx-q table[align="center"] a.is-current { background:var(--orange) !important; color:#1a1100 !important; }

/* titres d'étape */
.sx-q div[style*="background-color:#107ACA"] { background:var(--blue-l) !important; color:var(--blue-dd) !important; border:0 !important; border-left:6px solid var(--blue) !important; border-radius:8px; padding:.7rem 1rem !important; text-align:left !important; font-size:1.05rem !important; font-weight:700 !important; margin:1.6rem 0 .9rem; }

/* boutons de réponse */
.sx-q [onclick][style*="cursor:pointer"] { display:inline-block; width:auto !important; max-width:100%; min-height:46px; margin:.3rem .25rem; padding:.7rem 1.3rem !important; border:2px solid var(--blue) !important; border-radius:999px; background:#fff !important; color:var(--blue-d) !important; font-size:1rem !important; font-weight:700 !important; line-height:1.3; text-align:center !important; white-space:normal !important; cursor:pointer; user-select:none; }
.sx-q [onclick][style*="cursor:pointer"]:hover { background:var(--blue-l) !important; }
.sx-q [onclick][style*="cursor:pointer"][aria-pressed="true"] { background:var(--blue) !important; color:#fff !important; }
.sx-q [onclick][style*="cursor:pointer"] img { margin:.4rem 0; }

/* résultats : l'échelle de couleurs du Dr est conservée (rouge = 15, saumon = urgences, orange = consultation du jour, vert = conseils / consultation) */
.sx-q [style*="background-color:#FF5151"], .sx-q [style*="background-color:#FF8D8D"], .sx-q [style*="background-color:#FFAE7C"], .sx-q [style*="background-color:#A8FFBB"] {
  background:var(--rbg) !important; color:var(--ink) !important; border:0 !important; border-left:8px solid var(--rc) !important; border-radius:8px;
  padding:1rem 1.2rem !important; text-align:left !important; font-size:1.1rem !important; font-weight:700 !important; margin:.9rem 0; }
.sx-q [style*="background-color:#FF5151"] { --rc:#d90429; --rbg:#ffe1e4; }
.sx-q [style*="background-color:#FF8D8D"] { --rc:#e5383b; --rbg:#ffeaea; }
.sx-q [style*="background-color:#FFAE7C"] { --rc:#f77f00; --rbg:#fff0e0; }
.sx-q [style*="background-color:#A8FFBB"] { --rc:#2d9f4f; --rbg:#e6f6ea; }
/* OPTION (désactivée) : pour que « Consultez un médecin. » (vomissements, diarrhée) s'affiche en orange comme « Consultation du jour »
   et non en vert, supprimez la ligne « début » et la ligne « fin » qui entourent la règle ci-dessous.
-- début --
#frequence1, #deshydrat1, #facteurs1, #contexte1, #arret1 { --rc:#f77f00 !important; --rbg:#fff0e0 !important; }
-- fin -- */

@media print { .sx-header, .sx-footer, .sx-hero { display:none; } .sx-main { margin:0; } .sx-card { box-shadow:none; } }


/* ==========================================================
   ACCUEIL : BLOCS ET CARTES RESPONSIVES
   ========================================================== */

.sx-home-intro {
    margin-bottom: 2rem;
    padding: 1.5rem;
    border-left: 5px solid var(--orange);
    border-radius: var(--radius);
    background: var(--blue-l);
}

.sx-home-intro p {
    margin: 0 0 1rem;
    font-size: 1.05rem;
}

.sx-home-section {
    margin: 2rem 0;
}

.sx-home-section > h2 {
    margin: 0 0 1rem;
    color: var(--blue-dd);
    font-size: 1.4rem;
}

.sx-home-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.sx-home-tile {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
    padding: 1.25rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #fff;
    box-shadow: var(--shadow);
}

.sx-home-tile h3 {
    margin: .5rem 0;
    color: var(--blue-dd);
    font-size: 1.1rem;
}

.sx-home-tile p {
    margin: .25rem 0 1rem;
    color: var(--muted);
}

.sx-home-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: var(--blue-l);
    color: var(--blue-d);
    font-size: 1.5rem;
}

.sx-home-tile-orange {
    border-top: 4px solid var(--orange);
}

.sx-home-tile-orange .sx-home-icon {
    background: #fff0dc;
    color: var(--orange-d);
}

.sx-home-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    max-width: 100%;
    margin-top: auto;
    padding: .65rem 1rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fff;
    color: var(--blue-d);
    font-weight: 700;
    text-decoration: none;
    text-align: center;
    overflow-wrap: anywhere;
}

.sx-home-button:hover {
    background: var(--blue-l);
}

.sx-home-button-primary {
    border-color: var(--orange);
    background: var(--orange);
    color: #1a1100;
}

.sx-home-button-primary:hover {
    background: #ffa11f;
    color: #1a1100;
}

.sx-home-panel {
    min-width: 0;
    padding: 1rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #fff;
    box-shadow: var(--shadow);
    overflow-wrap: anywhere;
}

.sx-home-panel iframe {
    display: block;
    max-width: 100%;
}

.sx-contact-content > *:first-child {
    margin-top: 0;
}

.sx-contact-content > *:last-child {
    margin-bottom: 0;
}

.sx-contact-content img {
    max-width: 100%;
    height: auto;
}

.sx-contact-content table {
    max-width: 100%;
}

.sx-home-video {
    min-height: 190px;
}

@media (max-width: 800px) {
    .sx-home-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 520px) {
    .sx-home-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .sx-home-intro {
        padding: 1rem;
    }

    .sx-home-tile {
        padding: 1rem;
    }

    .sx-home-button {
        width: 100%;
    }

    .sx-home-panel {
        padding: .65rem;
    }
}



.sx-video-button {
    display: block;
    padding: 12px 16px;
	border-color: var(--orange);
    background: var(--orange);
    border-radius: 10px;
    color: #ffffff !important;
    text-decoration: none;
    font-weight: 600;
    transition: background .2s, border-color .2s;
}

.sx-video-button:hover,
.sx-video-button:focus-visible {
    background: var(--blue-l);
    border-color: var(--blue);
    color: #000000 !important;

}

.sx-video-button:focus-visible {
    outline: 3px solid var(--blue);
    outline-offset: 2px;
}



/* =========================================
   Coordonnées : cartes et carte Google Maps
   ========================================= */

.coord-page {
    color: var(--ink);
    min-width: 0;
}

.coord-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: stretch;
    gap: 20px;
    margin: 8px 0 24px;
}

.coord-card {
    min-width: 0;
    padding: 24px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    overflow-wrap: anywhere;
}

.coord-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    margin-bottom: 14px;
    border-radius: 12px;
    background: var(--blue-l);
    font-size: 23px;
}

.coord-card h2 {
    margin: 0 0 14px;
    color: var(--blue-dd);
    font-size: 1.2rem;
    line-height: 1.4;
}

.coord-card p {
    margin: 0 0 12px;
    line-height: 1.7;
}

.coord-card p:last-child {
    margin-bottom: 0;
}

.coord-link {
    display: inline-block;
    margin-top: 8px;
    padding: 10px 14px;
    border-radius: 8px;
    background: var(--blue);
    color: #fff !important;
    text-decoration: none;
    font-weight: 600;
    transition: background .2s ease;
}

.coord-link:hover {
    background: var(--blue-d);
    color: #fff;
}

.coord-link:focus-visible {
    outline: 3px solid var(--orange);
    outline-offset: 3px;
}

.coord-map {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: #fff;
    box-shadow: var(--shadow);
}

.coord-map iframe {
    display: block;
    width: 100%;
    height: 400px;
    border: 0;
}

@media (max-width: 900px) {
    .coord-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .coord-card:last-child {
        grid-column: 1 / -1;
    }
}

@media (max-width: 600px) {
    .coord-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 14px;
    }

    .coord-card:last-child {
        grid-column: auto;
    }

    .coord-card {
        padding: 20px;
    }

    .coord-map iframe {
        height: 300px;
    }
}



/* ==========================================================
   PAGE « DOIS-JE CONSULTER ? »
   Styles regroupés — version responsive
   ========================================================== */

/* Conteneur général : styles limités à cette page */
.sx-consulter {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    padding: 20px;
    box-sizing: border-box;
    color: var(--ink);
    line-height: 1.65;
}

.sx-consulter *,
.sx-consulter *::before,
.sx-consulter *::after {
    box-sizing: border-box;
}

/* Titres et textes */
.sx-consulter h2,
.sx-consulter h3 {
    color: var(--blue-d);
    line-height: 1.35;
}

.sx-consulter p {
    margin: 0 0 1rem;
}

/* ==========================================================
   CHOIX INTERACTIFS
   On cible uniquement les choix identifiés par leur ID
   ========================================================== */

.sx-consulter #age1a,
.sx-consulter #age1b,
.sx-consulter #age1c,
.sx-consulter #age1d,
.sx-consulter #intensite1a,
.sx-consulter #intensite1b,
.sx-consulter #intensite1c,
.sx-consulter #intensite1d,
.sx-consulter #duree1a,
.sx-consulter #duree1b,
.sx-consulter #signe1a,
.sx-consulter #signe1b,
.sx-consulter #signe1c,
.sx-consulter #signe1d {
    display: inline-block;
    max-width: 100%;
    margin: 5px;
    padding: 10px 16px !important;
    border: 1px solid var(--blue) !important;
    border-radius: 10px !important;
    background-color: #fff !important;
    background-image: none !important;
    color: var(--blue-d) !important;
    font-size: 1rem !important;
    line-height: 1.45;
    text-align: center;
    cursor: pointer;
    transition:
        background-color 0.18s ease,
        color 0.18s ease,
        border-color 0.18s ease,
        box-shadow 0.18s ease;
}

/* Survol des choix */
.sx-consulter #age1a:hover,
.sx-consulter #age1b:hover,
.sx-consulter #age1c:hover,
.sx-consulter #age1d:hover,
.sx-consulter #intensite1a:hover,
.sx-consulter #intensite1b:hover,
.sx-consulter #intensite1c:hover,
.sx-consulter #intensite1d:hover,
.sx-consulter #duree1a:hover,
.sx-consulter #duree1b:hover,
.sx-consulter #signe1a:hover,
.sx-consulter #signe1b:hover,
.sx-consulter #signe1c:hover,
.sx-consulter #signe1d:hover {
    background-color: var(--blue-l) !important;
}

/* Choix sélectionnés : le script historique leur donne un fond rouge */
.sx-consulter #age1a[style*="red"],
.sx-consulter #age1b[style*="red"],
.sx-consulter #age1c[style*="red"],
.sx-consulter #age1d[style*="red"],
.sx-consulter #intensite1a[style*="red"],
.sx-consulter #intensite1b[style*="red"],
.sx-consulter #intensite1c[style*="red"],
.sx-consulter #intensite1d[style*="red"],
.sx-consulter #duree1a[style*="red"],
.sx-consulter #duree1b[style*="red"],
.sx-consulter #signe1a[style*="red"],
.sx-consulter #signe1b[style*="red"],
.sx-consulter #signe1c[style*="red"],
.sx-consulter #signe1d[style*="red"] {
    background-color: var(--blue-d) !important;
    color: #fff !important;
    border-color: var(--blue-d) !important;
    box-shadow: 0 0 0 3px var(--blue-l) !important;
}

/* ==========================================================
   SIGNES DE GRAVITÉ
   ========================================================== */

.sx-consulter .sx-gravite {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    width: 100%;
    margin: 20px auto;
}

.sx-consulter #signe1a,
.sx-consulter #signe1b,
.sx-consulter #signe1c,
.sx-consulter #signe1d {
    width: 100%;
    max-width: 620px;
}

/* Ne pas imposer de dimensions à l'aperçu de l'image */
.sx-consulter #pupura {
    max-width: 100%;
    height: auto;
}

/* ==========================================================
   SOUS-CADRES DE RÉSULTATS
   Style conservé : « Se rendre aux urgences », conseils, etc.
   ========================================================== */

.sx-consulter #age1,
.sx-consulter #age2,
.sx-consulter #age3,
.sx-consulter #age4,
.sx-consulter #intense1,
.sx-consulter #intense2,
.sx-consulter #intense3,
.sx-consulter #intense4,
.sx-consulter #duree1,
.sx-consulter #duree2,
.sx-consulter #gravite1 {
    width: 100%;
    margin: 16px 0 !important;
    padding: 16px 20px !important;
    border: 1px solid var(--line) !important;
    border-left: 5px solid var(--blue) !important;
    border-radius: 12px !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
    line-height: 1.65;
    text-align: center !important;
    overflow-wrap: anywhere;
    box-shadow: 0 2px 8px rgba(11, 37, 64, 0.06);
}

/* Résultats nécessitant une réaction urgente */
.sx-consulter #age1,
.sx-consulter #gravite1 {
    background-color: #fff0f0 !important;
    color: #8f2020 !important;
    border-left-color: #c62828 !important;
}

/* Résultats nécessitant un avis médical */
.sx-consulter #age2,
.sx-consulter #age4,
.sx-consulter #intense3,
.sx-consulter #duree2 {
    background-color: #fff5e8 !important;
    color: #854700 !important;
    border-left-color: var(--orange) !important;
}

/* Conseils et résultats rassurants */
.sx-consulter #age3,
.sx-consulter #intense1,
.sx-consulter #intense2,
.sx-consulter #intense4,
.sx-consulter #duree1 {
    background-color: #effaf2 !important;
    color: #205d32 !important;
    border-left-color: #3b9956 !important;
}

/* Liens dans les résultats */
.sx-consulter #age1 a,
.sx-consulter #age2 a,
.sx-consulter #age3 a,
.sx-consulter #age4 a,
.sx-consulter #intense1 a,
.sx-consulter #intense2 a,
.sx-consulter #intense3 a,
.sx-consulter #intense4 a,
.sx-consulter #duree1 a,
.sx-consulter #duree2 a,
.sx-consulter #gravite1 a {
    color: var(--blue-d) !important;
    text-decoration: underline;
    font-weight: 700;
}

/* ==========================================================
   ACCESSIBILITÉ
   ========================================================== */

.sx-consulter [onclick]:focus-visible {
    outline: 3px solid var(--orange) !important;
    outline-offset: 3px;
}

/* ==========================================================
   RESPONSIVE : TABLETTES ET MOBILES
   ========================================================== */

@media (max-width: 700px) {
    .sx-consulter {
        padding: 12px;
    }

    .sx-consulter #age1a,
    .sx-consulter #age1b,
    .sx-consulter #age1c,
    .sx-consulter #age1d,
    .sx-consulter #intensite1a,
    .sx-consulter #intensite1b,
    .sx-consulter #intensite1c,
    .sx-consulter #intensite1d,
    .sx-consulter #duree1a,
    .sx-consulter #duree1b,
    .sx-consulter #signe1a,
    .sx-consulter #signe1b,
    .sx-consulter #signe1c,
    .sx-consulter #signe1d {
        margin: 4px 0;
        padding: 10px 12px !important;
    }

    .sx-consulter #age1,
    .sx-consulter #age2,
    .sx-consulter #age3,
    .sx-consulter #age4,
    .sx-consulter #intense1,
    .sx-consulter #intense2,
    .sx-consulter #intense3,
    .sx-consulter #intense4,
    .sx-consulter #duree1,
    .sx-consulter #duree2,
    .sx-consulter #gravite1 {
        padding: 14px !important;
        margin: 12px 0 !important;
        text-align: left !important;
    }
}


/* ==========================================================
   QUESTIONNAIRE DIARRHÉE — compléments de style
   ========================================================== */

.sx-diarrhee .sx-intro {
    margin: 12px 0 24px;
    font-size: 1.2rem;
    font-weight: 600;
    line-height: 1.5;
}

.sx-diarrhee .sx-symptomes {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin: 20px 0 28px;
}

.sx-diarrhee .sx-symptomes a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 10px 18px;
    border: 1px solid var(--blue);
    border-radius: 10px;
    background: #fff;
    color: var(--blue-d);
    font-weight: 700;
    text-decoration: none;
    transition: background-color .18s ease, color .18s ease;
}

.sx-diarrhee .sx-symptomes a:hover,
.sx-diarrhee .sx-symptomes a[aria-current="page"] {
    background: var(--blue-d);
    color: #fff;
}

.sx-diarrhee .sx-etape {
    margin: 18px 0;
    padding: 12px 16px;
    border-radius: 10px;
    background: var(--blue-d);
    color: #fff;
    font-size: 1.05rem;
    font-weight: 700;
    text-align: center;
}

/* Choix interactifs : uniquement ceux de cette page */
.sx-diarrhee span[id="age1oui"],
.sx-diarrhee span[id="age1non"],
.sx-diarrhee span[id^="frequence1"],
.sx-diarrhee span[id^="deshydrat1"],
.sx-diarrhee span[id^="facteurs1"],
.sx-diarrhee span[id^="arret1"] {
    display: inline-block;
    margin: 6px 4px;
    padding: 10px 16px !important;
    border: 1px solid var(--blue) !important;
    border-radius: 10px !important;
    background: #fff !important;
    color: var(--blue-d) !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
    line-height: 1.4;
    white-space: normal !important;
    cursor: pointer;
}

/* Résultats : mise en page harmonisée */
.sx-diarrhee #age1,
.sx-diarrhee #frequence1,
.sx-diarrhee #deshydrat1,
.sx-diarrhee #facteurs1,
.sx-diarrhee #arret1 {
    width: 100%;
    margin: 16px 0 !important;
    padding: 16px 20px !important;
    border: 1px solid var(--line) !important;
    border-left: 5px solid #3b9956 !important;
    border-radius: 12px !important;
    background: #effaf2 !important;
    color: #205d32 !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
    line-height: 1.65;
    text-align: center !important;
    box-shadow: 0 2px 8px rgba(11, 37, 64, .06);
}

/* Conseils à domicile */
.sx-diarrhee #domicile {
    margin: 18px 0;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fff;
    overflow-wrap: anywhere;
}

.sx-diarrhee #domicile ul {
    padding-left: 24px;
    text-align: left;
}

.sx-diarrhee #domicile li {
    margin: 8px 0;
}

.sx-diarrhee #domicile img {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 16px auto;
    border-radius: 10px;
}

@media (max-width: 600px) {
    .sx-diarrhee {
        padding: 12px;
    }

    .sx-diarrhee .sx-symptomes {
        display: grid;
        grid-template-columns: 1fr;
    }

    .sx-diarrhee .sx-symptomes a {
        width: 100%;
    }

    .sx-diarrhee #age1,
    .sx-diarrhee #frequence1,
    .sx-diarrhee #deshydrat1,
    .sx-diarrhee #facteurs1,
    .sx-diarrhee #arret1 {
        padding: 14px !important;
        text-align: left !important;
    }
}



/* =========================================================
   Questionnaire pédiatrique : vomissements
   Styles limités à cette page
   ========================================================= */

.sx-vomissements {
    box-sizing: border-box;
    width: 100%;
    max-width: 1050px;
    margin: 0 auto;
    padding: 24px;
    background: #fff;
    color: var(--ink, #243247);
    border-radius: var(--radius, 16px);
}

.sx-vomissements *,
.sx-vomissements *::before,
.sx-vomissements *::after {
    box-sizing: border-box;
}

.sx-vomissements .sx-intro {
    margin-bottom: 24px;
    text-align: center;
}

.sx-vomissements .sx-intro h2 {
    margin: 0 0 22px;
    font-size: clamp(1.35rem, 3vw, 1.9rem);
    line-height: 1.4;
}

.sx-vomissements .sx-intro h3 {
    margin: 26px 0 0;
    font-size: 1.45rem;
    color: var(--blue-d, #145b91);
}

.sx-vomissements .sx-symptomes {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin: 0 auto;
}

.sx-vomissements .sx-symptomes a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 10px 18px;
    border: 1px solid var(--orange-d, #d87500);
    border-radius: 10px;
    background: var(--orange, #fd8f01);
    color: #fff;
    font-size: 1rem;
    font-weight: 700;
    text-decoration: none;
    transition: background-color .2s ease, transform .2s ease;
}

.sx-vomissements .sx-symptomes a:hover {
    background: var(--orange-d, #d87500);
    transform: translateY(-1px);
}

.sx-vomissements .sx-symptomes a.actif {
    background: var(--blue-d, #145b91);
    border-color: var(--blue-d, #145b91);
}

.sx-vomissements .sx-etape {
    margin: 20px 0;
    padding: 20px;
    border: 1px solid var(--line, #dce3eb);
    border-radius: var(--radius, 16px);
    background: #fff;
    box-shadow: var(--shadow, 0 4px 16px rgba(25, 45, 70, .07));
}

.sx-vomissements .sx-etape-titre {
    margin: 0 0 20px;
    padding: 13px 16px;
    border-radius: 10px;
    background: var(--blue, #107aca);
    color: #fff;
    font-size: 1.1rem;
    font-weight: 700;
    line-height: 1.4;
    text-align: center;
}

.sx-vomissements .sx-question {
    text-align: center;
}

.sx-vomissements .sx-question p {
    margin: 12px 0 18px;
    font-size: 1.05rem;
    line-height: 1.7;
}

.sx-vomissements .sx-question ul,
.sx-vomissements .sx-rappel ul {
    display: inline-block;
    max-width: 100%;
    margin: 8px auto 22px;
    padding-left: 24px;
    text-align: left;
    line-height: 1.75;
}

.sx-vomissements .sx-question li,
.sx-vomissements .sx-rappel li {
    margin-bottom: 8px;
}

.sx-vomissements .sx-choix {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
    margin: 18px 0 8px;
}

.sx-vomissements .sx-choix-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: 11px 22px;
    border: 2px solid var(--orange-d, #d87500);
    border-radius: 10px;
    background: var(--orange, #fd8f01);
    color: #fff;
    font: inherit;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.35;
    text-align: center;
    cursor: pointer;
    transition: background-color .2s ease, border-color .2s ease,
                box-shadow .2s ease, transform .2s ease;
}

.sx-vomissements .sx-choix-btn:hover {
    background: var(--orange-d, #d87500);
    transform: translateY(-1px);
}

.sx-vomissements .sx-choix-btn.selectionne {
    background: var(--blue-d, #145b91);
    border-color: var(--blue-d, #145b91);
    box-shadow: 0 0 0 3px rgba(16, 122, 202, .16);
}

.sx-vomissements .sx-choix-btn:focus-visible,
.sx-vomissements .sx-symptomes a:focus-visible,
.sx-vomissements a:focus-visible {
    outline: 3px solid #172f4f;
    outline-offset: 3px;
}

.sx-vomissements .sx-resultat {
    margin-top: 22px;
    padding: 18px 20px;
    border: 1px solid #e8b86c;
    border-left: 5px solid #c87900;
    border-radius: 12px;
    background: #fff4df;
    color: #593800;
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1.65;
    text-align: center;
}

.sx-vomissements .sx-resultat-urgent {
    border-color: #d94a4a;
    border-left-color: #b42323;
    background: #fff0f0;
    color: #741b1b;
}

.sx-vomissements .sx-conseils {
    background: #f8fbff;
}

.sx-vomissements .sx-conseils > .sx-question {
    padding: 4px 0 12px;
}

.sx-vomissements .sx-rappel {
    margin-top: 22px;
    padding: 20px;
    border: 1px solid var(--line, #dce3eb);
    border-radius: 12px;
    background: #fff;
}

.sx-vomissements .sx-rappel h4 {
    margin: 0 0 14px;
    color: var(--blue-d, #145b91);
    font-size: 1.15rem;
}

.sx-vomissements .sx-rappel a {
    color: var(--blue-d, #145b91);
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.sx-vomissements .sx-video {
    display: inline-block;
    max-width: 100%;
    margin: 12px auto;
}

.sx-vomissements .sx-video img {
    display: block;
    width: 100%;
    max-width: 420px;
    height: auto;
    border-radius: 12px;
}

.sx-vomissements .sx-arret {
    margin-top: 26px;
}

/* Adaptation aux petits écrans */
@media (max-width: 640px) {
    .sx-vomissements {
        padding: 14px;
        border-radius: 10px;
    }

    .sx-vomissements .sx-etape {
        margin: 16px 0;
        padding: 14px;
    }

    .sx-vomissements .sx-etape-titre {
        padding: 12px;
        font-size: 1rem;
    }

    .sx-vomissements .sx-symptomes {
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .sx-vomissements .sx-symptomes a {
        width: 100%;
    }

    .sx-vomissements .sx-choix {
        gap: 10px;
    }

    .sx-vomissements .sx-choix-btn {
        flex: 1 1 130px;
        max-width: 100%;
        padding: 12px 14px;
    }

    .sx-vomissements .sx-rappel {
        padding: 14px;
    }

    .sx-vomissements .sx-resultat {
        padding: 15px;
        font-size: 1rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .sx-vomissements *,
    .sx-vomissements *::before,
    .sx-vomissements *::after {
        transition: none !important;
        transform: none !important;
    }
}
