/* ============================================================================
   Documentation Resthome — thème « docs » aux couleurs LPLG.
   Base : Material for MkDocs. Couleurs ADAPTATIVES clair + sombre.
     bleu #0F43FF · fond clair #FBFCFF · titres Roboto Slab · corps Inter
   ============================================================================ */

@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Roboto+Slab:wght@500;600;700&display=swap");

/* ---------- Palette & polices ---------- */
:root {
  --md-primary-fg-color:        #0F43FF;
  --md-primary-fg-color--light: #4f74ff;
  --md-primary-fg-color--dark:  #0a34cc;
  --md-primary-bg-color:        #ffffff;
  --md-primary-bg-color--light: #ffffffcc;
  --md-accent-fg-color:         #0F43FF;
  --md-accent-fg-color--transparent: #0f43ff1a;
  --md-typeset-a-color:         #0F43FF;

  --md-text-font:    "Inter";
  --md-heading-font: "Inter";
  --lplg-slab-font:  "Roboto Slab";

  --lplg-blue:   #0F43FF;
  --lplg-blue-2: #d8dffd;
  --lplg-border: #e6e9f2;
}
[data-md-color-scheme="default"] { --md-default-bg-color: #FBFCFF; }

/* Mode sombre : bleus plus clairs + bordures sombres. */
[data-md-color-scheme="slate"] {
  --md-primary-fg-color:  #4f74ff;
  --md-accent-fg-color:   #6f8dff;
  --md-accent-fg-color--transparent: #6f8dff26;
  --md-typeset-a-color:   #8aa2ff;
  --lplg-border: #2b3a4a;
}

/* ---------- Typographie ---------- */
.md-typeset { font-size: 0.78rem; line-height: 1.65; }
.md-typeset p { margin: 0.7em 0 0.9em; }

/* Titres en Roboto Slab — couleur héritée du thème (clair/sombre). */
.md-typeset h1,
.md-typeset h2,
.md-typeset h3,
.md-typeset h4 {
  font-family: var(--lplg-slab-font), Georgia, "Times New Roman", serif;
}
.md-typeset h1 {
  color: var(--md-default-fg-color);
  font-weight: 700;
  letter-spacing: -0.005em;
  margin-bottom: 0.7em;
}
.md-typeset h2 {
  color: var(--md-default-fg-color);
  font-weight: 600;
  padding-bottom: 0.28em;
  border-bottom: 1px solid var(--lplg-border);
  margin-top: 2.2em;
}
.md-typeset h3 { color: var(--md-default-fg-color); font-weight: 700; margin-top: 1.6em; }

/* ---------- Encadrés (admonitions) ---------- */
.md-typeset .admonition,
.md-typeset details {
  border: 1px solid var(--lplg-border);
  border-left-width: 4px;
  border-radius: 6px;
  box-shadow: none;
  font-size: 0.75rem;
}
.md-typeset .admonition-title,
.md-typeset summary { font-weight: 700; background-color: transparent; }
.md-typeset .admonition.note,
.md-typeset details.note { border-left-color: var(--lplg-blue); background: #f2f5ff; }
.md-typeset .note > .admonition-title::before { background-color: var(--lplg-blue); }
.md-typeset .admonition.tip,
.md-typeset details.tip { border-left-color: #00a67d; background: #eefaf5; }
.md-typeset .tip > .admonition-title::before { background-color: #00a67d; }
.md-typeset .admonition.warning,
.md-typeset details.warning { border-left-color: #e8871e; background: #fff6ea; }
.md-typeset .warning > .admonition-title::before { background-color: #e8871e; }
/* Fonds d'encadrés en mode sombre. */
[data-md-color-scheme="slate"] .md-typeset .admonition.note,
[data-md-color-scheme="slate"] .md-typeset details.note { background: #16203a; }
[data-md-color-scheme="slate"] .md-typeset .admonition.tip,
[data-md-color-scheme="slate"] .md-typeset details.tip { background: #10261f; }
[data-md-color-scheme="slate"] .md-typeset .admonition.warning,
[data-md-color-scheme="slate"] .md-typeset details.warning { background: #2a2113; }

/* ---------- Images / captures encadrées ---------- */
.md-typeset img:not(.twemoji):not(.emojione):not([src$=".svg"]) {
  max-width: 100%;
  border: 1px solid var(--lplg-border);
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(27, 39, 51, 0.08);
  margin: 0.6em 0;
}
.md-typeset figure > figcaption { font-size: 0.72rem; opacity: 0.75; margin-top: 0.4em; }
/* Captures de l'app Soins : un écran de téléphone, affiché à sa taille de
   téléphone — étiré sur la largeur du texte, il devient une colonne géante.
   Ciblées par le NOM de fichier (phone-…) : Sphinx copie les images dans
   _images/ et le dossier d'origine disparaît de l'URL publiée. Les mêmes
   :not() que la règle générale ci-dessus : sans eux, elle gagne en spécificité
   et remet marge et arrondi — l'image restait collée à gauche. */
.md-typeset img[src*="/phone-"]:not(.twemoji):not(.emojione):not([src$=".svg"]) {
  display: block;
  width: 300px;
  max-width: 100%;
  margin: 0.8em auto;
  border-radius: 18px;
}

/* ---------- Tableaux ---------- */
.md-typeset table:not([class]) {
  border: 1px solid var(--lplg-border);
  border-radius: 8px;
  overflow: hidden;
  font-size: 0.74rem;
}
.md-typeset table:not([class]) th {
  background: var(--md-accent-fg-color--transparent);
  font-weight: 700;
}

/* ---------- En-tête CLAIR (LPLG) ---------- */
.md-header {
  background: #ffffff;
  color: #1b2733;
  border-bottom: 1px solid var(--lplg-border);
  box-shadow: 0 1px 4px rgba(27, 39, 51, 0.05);
}
[data-md-color-scheme="slate"] .md-header {
  background: #0d1522;
  color: #eef2f7;
  border-bottom-color: #223247;
}
/* Logo LPLG = bulle BLEUE cliquable (retour lplg.eu) — l'accent de marque. */
.md-header__button.md-logo {
  margin: 0 0.1rem 0 0.45rem;
  padding: 0;
  width: 1.75rem;
  height: 1.75rem;
  background: var(--lplg-blue);
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.md-header__button.md-logo img,
.md-header__button.md-logo svg { width: 1.05rem; height: 1.05rem; }
.md-header__title { margin-left: 0.4rem; font-size: 1rem; color: inherit; }
.md-header__topic .md-ellipsis { font-weight: 700; letter-spacing: -0.01em; }
.md-header__end { display: flex; align-items: center; gap: 0.25rem; }

/* Icônes + dropdown de version : couleur du texte (donc adaptatifs clair/sombre). */
.md-header__button.md-icon { color: currentColor; opacity: 0.68; }
.md-header__button.md-icon:hover { opacity: 1; }
.md-header [data-md-component="palette"] .md-icon svg,
.md-header__option .md-icon svg { fill: currentColor; }
.md-header .md-version__current { color: inherit; font-weight: 600; }
.md-header .md-version__link { color: inherit; }

.md-grid { max-width: 100%; }
/* Largeur de lecture. Mesuré le 04/09/2026 : à 50rem, une ligne portait 108
   caractères — la lisibilité décroche au-delà de 80, et l'œil perd la ligne
   suivante en revenant à la marge. 40rem ramène la mesure autour de 85 tout en
   gardant aux captures la largeur d'affichage que demande leur charte
   (768-933 px). `margin: auto` centre le bloc entre la navigation et le
   sommaire : sans lui, le texte reste collé à gauche et le sommaire dérive
   très loin à droite sur un grand écran. */
.md-content { max-width: 40rem; margin-left: auto; margin-right: auto; }
.md-header__inner { position: relative; gap: 0.35rem; }

/* Recherche CENTRÉE sur écran large : titre à gauche, contrôles à droite,
   recherche en position absolue au centre (native : overlay + clic intacts). */
@media screen and (min-width: 76.25em) {
  .md-header__inner { position: relative; }
  /* Le titre GARDE son flex-grow (thème) : sinon son topic absolu l'effondre à 0
     et « Resthome docs » disparaît. En grandissant, il pousse les contrôles à droite. */
  .md-header__title { flex: 1 1 auto; min-width: 6rem; }
  /* AU REPOS : boîte de recherche centrée, largeur maîtrisée. */
  .md-search {
    position: absolute; left: 50%; top: 50%;
    transform: translate(-50%, -50%);
    width: 22rem; flex: none; z-index: 2;
  }
  .md-search__inner { float: none; }
  .md-search__form { width: 100%; }
  /* ACTIVE (focus) : on relâche les contraintes → l'overlay natif reprend toute
     sa largeur (sinon les résultats sont coupés). */
  [data-md-toggle="search"]:checked ~ .md-header .md-search {
    position: static; transform: none; width: auto; z-index: 2;
  }
  [data-md-toggle="search"]:checked ~ .md-header .md-search__form { width: auto; }
}
/* Champ de recherche : clair, bordé (sur header blanc). */
.md-search__form {
  border-radius: 8px;
  background: var(--md-default-bg-color);
  border: 1px solid var(--lplg-border);
  box-shadow: none;
}
.md-search__form:hover { background: var(--md-default-bg-color); }
.md-search__input { color: var(--md-default-fg-color); }
.md-search__input::placeholder { color: #6b7280; }
.md-search__icon { color: #6b7280; }
[data-md-color-scheme="slate"] .md-search__form { background: #16202e; border-color: #223247; }

/* GitHub : icône seule, teinte du texte (sombre sur header clair). */
.md-header__source { max-width: 2.4rem; margin-left: 0.15rem; }
.md-source__repository, .md-source__facts { display: none; }
.md-header__source .md-icon svg, .md-header__source svg { fill: currentColor; }
.md-header__source .md-source__icon { opacity: 0.68; }
.md-header__source:hover .md-source__icon { opacity: 1; }

/* Sélecteur de langue FR|NL|EN (injecté dans l'en-tête par layout.html). */
.lplg-langswitch {
  display: inline-flex; align-items: center; flex: 0 0 auto;
  margin: 0 0.3rem; border: 1px solid var(--lplg-border);
  border-radius: 7px; overflow: hidden;
}
.lplg-langswitch .lplg-lang {
  padding: 0.2rem 0.5rem; font-size: 0.7rem; font-weight: 700;
  letter-spacing: 0.02em; color: inherit; opacity: 0.72; text-decoration: none;
  border-left: 1px solid var(--lplg-border);
}
.lplg-langswitch .lplg-lang:first-child { border-left: 0; }
.lplg-langswitch .lplg-lang:hover { opacity: 1; background: var(--md-accent-fg-color--transparent); }
.lplg-langswitch .lplg-lang.is-current { background: var(--lplg-blue); color: #fff; opacity: 1; }
[data-md-color-scheme="slate"] .lplg-langswitch { border-color: #223247; }

/* Lien « Site Resthome » vers la vitrine lplg.eu (injecté par layout.html). */
.lplg-site-link {
  display: inline-flex; align-items: center; gap: 0.3rem; flex: 0 0 auto;
  padding: 0.28rem 0.55rem; font-size: 0.7rem; font-weight: 600;
  letter-spacing: 0.01em; color: inherit; opacity: 0.78; text-decoration: none;
  white-space: nowrap; border-radius: 7px;
}
.lplg-site-link:hover { opacity: 1; background: var(--md-accent-fg-color--transparent); }
.lplg-site-link svg { width: 0.85rem; height: 0.85rem; fill: currentColor; opacity: 0.8; }
/* Header serré sur mobile : on masque le lien vitrine (l'icône GitHub suffit). */
@media screen and (max-width: 44.9375em) { .lplg-site-link { display: none; } }

/* ---------- Barre latérale — disposition « à la Odoo » ----------
   Groupes titrés avec icône (Démarrer, Applications, Administration, Aide),
   sections repliables à chevron GAUCHE, sous-pages indentées, page active en
   pastille pleine. L'arbre complet est écrit par le thème
   (globaltoc_collapse = False dans conf.py) : chaque section se déplie sur place.
   Rien n'est ciblé par position : les groupes et les sections portent un id
   stable (#__nav_N_label, #__nav_2_N) donné par le thème dans l'ordre du sommaire. */
.md-sidebar--primary { border-right: 1px solid var(--lplg-border); }
.md-sidebar--primary .md-nav--primary { background: transparent; }
.md-nav { font-size: 0.74rem; line-height: 1.4; }
.md-nav--primary > .md-nav__title {
  font-weight: 700; font-size: 0.72rem;
  text-transform: uppercase; letter-spacing: 0.06em; color: #8a93ab;
}

@media screen and (min-width: 76.25em) {
  /* Plus large que les 12,1rem du thème : à 15rem encore, la moitié des
     sous-pages (« Les admissions (pipeline CRM) ») passaient sur deux lignes. */
  .md-sidebar--primary { width: 17rem; }
  /* Le thème réserve à droite `100% - 11,5rem` : sans ça le contenu restait
     à 230 px quelle que soit la largeur de la colonne. */
  .md-sidebar--primary .md-sidebar__inner { padding-right: 0; }
  /* Le thème décale tout le corps de 30px sous l'en-tête : le filet de la
     colonne de gauche démarrait 30px trop bas et ne rejoignait pas la barre
     du haut — un blanc en escalier. La colonne part du bas de l'en-tête,
     l'air est rendu au contenu. */
  .md-main__inner { margin-top: 0; }
  /* Ni le thème ni nous ne touchions l'ascenseur des colonnes : Chrome sous
     Windows posait donc sa barre par défaut, 10px avec ses deux flèches,
     entre la colonne et le contenu. Fine, sans flèches, visible au survol. */
  .md-sidebar__scrollwrap { scrollbar-width: thin; scrollbar-color: transparent transparent; }
  .md-sidebar__scrollwrap:hover { scrollbar-color: #c3cad6 transparent; }
  .md-sidebar__scrollwrap::-webkit-scrollbar { width: 6px; }
  .md-sidebar__scrollwrap::-webkit-scrollbar-button { display: none; width: 0; height: 0; }
  .md-sidebar__scrollwrap::-webkit-scrollbar-track { background: transparent; }
  .md-sidebar__scrollwrap::-webkit-scrollbar-thumb {
    background: transparent; border-radius: 3px; transition: background 0.2s;
  }
  .md-sidebar__scrollwrap:hover::-webkit-scrollbar-thumb { background: #c3cad6; }
  [data-md-color-scheme="slate"] .md-sidebar__scrollwrap:hover { scrollbar-color: #3a4558 transparent; }
  [data-md-color-scheme="slate"] .md-sidebar__scrollwrap:hover::-webkit-scrollbar-thumb { background: #3a4558; }
  .md-sidebar--primary { padding-top: 0.9rem; }
  .md-content__inner { padding-top: 1.6rem; }
  /* Une seule source d'indentation (la marge des sous-pages plus bas) : le
     padding de chaque liste du thème s'empilait niveau après niveau. */
  .md-nav--primary .md-nav__list { padding-left: 0; }

  /* Le sommaire de page intégré au tiroir mobile doublonne la page active
     (deux pilules) : il reste dans la colonne de droite. */
  .md-nav--primary label.md-nav__link[for="__toc"],
  .md-nav--primary label.md-nav__link[for="__toc"] ~ .md-nav { display: none !important; }

  /* Une seule colonne de texte pour toute la barre, comme chez Odoo :
       [chevron 1,25rem][icône 1,05rem + 0,4rem][texte]
     Les pages simples réservent les deux premières cases, les sous-pages
     repartent de ce rail et descendent d'un cran par niveau. */
  .md-nav--primary {
    --rh-nav-chevron: 1.25rem;   /* gouttière du chevron */
    --rh-nav-icon: 1.45rem;      /* icône + son écart */
    --rh-nav-rail: 2.85rem;      /* chevron + icône : le rail du texte */
    --rh-nav-step: 1.05rem;      /* un niveau d'imbrication */
  }

  /* --- Groupes --------------------------------------------------------- */
  .md-nav--primary > .md-nav__list > .md-nav__item--section { margin: 0 0 1.15rem; }
  /* L'icône du groupe se cale sur celles des sections : même abscisse,
     même rail de texte ensuite. */
  .md-nav--primary > .md-nav__list > .md-nav__item--section > .md-nav__link {
    display: flex; align-items: center; gap: 0.4rem;
    margin: 0 0 0.3rem; padding: 0.25rem 0.5rem 0.25rem var(--rh-nav-chevron);
    font-size: 0.8rem; font-weight: 600; letter-spacing: 0;
    color: var(--lplg-blue); background: none; cursor: default;
  }
  .md-nav--primary > .md-nav__list > .md-nav__item--section > .md-nav__link .md-nav__icon { display: none; }
  .md-nav--primary > .md-nav__list > .md-nav__item--section > .md-nav__link::before {
    content: ""; flex: 0 0 auto; width: 1.05rem; height: 1.05rem;
    background-color: currentColor;
    -webkit-mask: var(--rh-group-icon) center / contain no-repeat;
    mask: var(--rh-group-icon) center / contain no-repeat;
  }
  /* Icône de chaque groupe : variables ci-dessous ; QUEL groupe les reçoit est
     calculé au build par _ext/countries.py, d'après la première page de chaque
     toctree de content/index.md (rh_nav_group_icons dans conf.py). Les groupes
     pays reçoivent leur drapeau de la même façon : ajouter un pays ne décale
     plus rien ici. */
  :root {
    --rh-icon-start: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 2c3.4 2.2 5.2 6 5 10.2l2.3 3.3V19l-3.4-1.4H8.1L4.7 19v-3.5L7 12.2C6.8 8 8.6 4.2 12 2zm0 6.2a1.9 1.9 0 100 3.8 1.9 1.9 0 000-3.8zM10 19h4l-2 3z'/></svg>");
    --rh-icon-apps: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M4 3h6a1 1 0 011 1v6a1 1 0 01-1 1H4a1 1 0 01-1-1V4a1 1 0 011-1zm10 0h6a1 1 0 011 1v6a1 1 0 01-1 1h-6a1 1 0 01-1-1V4a1 1 0 011-1zM4 13h6a1 1 0 011 1v6a1 1 0 01-1 1H4a1 1 0 01-1-1v-6a1 1 0 011-1zm13 0a4 4 0 110 8 4 4 0 010-8z'/></svg>");
    --rh-icon-admin: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 8a4 4 0 100 8 4 4 0 000-8zm9 5v-2l-2.3-.5a7 7 0 00-.7-1.7l1.3-2-1.4-1.4-2 1.3a7 7 0 00-1.7-.7L13 3h-2l-.5 2.3a7 7 0 00-1.7.7l-2-1.3-1.4 1.4 1.3 2a7 7 0 00-.7 1.7L3 11v2l2.3.5c.2.6.4 1.2.7 1.7l-1.3 2 1.4 1.4 2-1.3c.5.3 1.1.5 1.7.7L11 21h2l.5-2.3c.6-.2 1.2-.4 1.7-.7l2 1.3 1.4-1.4-1.3-2c.3-.5.5-1.1.7-1.7L21 13z'/></svg>");
    --rh-icon-help: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 2a10 10 0 100 20 10 10 0 000-20zm0 15.5a1.3 1.3 0 110-2.6 1.3 1.3 0 010 2.6zm1.7-6.3c-.6.5-1 .9-1.1 1.5 0 .2-.1.5-.1.8h-2c0-.4 0-.8.1-1.1.2-.7.7-1.2 1.2-1.6.6-.5.9-.8.9-1.4a1.4 1.4 0 00-2.8 0H8a3.4 3.4 0 116.8 0c0 .9-.5 1.5-1.1 2z'/></svg>");
  }
  .md-nav--primary > .md-nav__list > .md-nav__item--section > .md-nav { margin: 0; }
  .md-nav--primary > .md-nav__list > .md-nav__item--section > .md-nav > .md-nav__list { padding: 0 0 0 0.2rem; }

  /* --- Lignes ---------------------------------------------------------- */
  .md-nav--primary .md-nav__item { padding: 0; }
  .md-nav--primary .md-nav__list .md-nav__link {
    display: flex; align-items: center;
    margin: 1px 0; padding: 0.32rem 0.5rem 0.32rem var(--rh-nav-rail);
    border-radius: 6px; color: #2b3440;
  }
  .md-nav--primary .md-nav__list .md-nav__link:hover { background: #f1f3f7; color: #1b2733; }

  /* Section repliable : [chevron][titre], le chevron passe à GAUCHE. */
  .md-nav--primary .md-nav__list .md-nav__container {
    display: flex; align-items: stretch; gap: 0;  /* le thème en met 8px */
    margin: 1px 0; padding: 0; border-radius: 6px;
  }
  .md-nav--primary .md-nav__list .md-nav__container:hover { background: #f1f3f7; }
  .md-nav--primary .md-nav__list .md-nav__container > .md-nav__link { margin: 0; background: none; }
  .md-nav--primary .md-nav__list .md-nav__container > a.md-nav__link { flex: 1 1 auto; padding-left: 0.15rem; }
  .md-nav--primary .md-nav__list .md-nav__container > label.md-nav__link {
    order: -1; flex: 0 0 var(--rh-nav-chevron); justify-content: center;
    padding: 0; cursor: pointer;
  }
  .md-nav--primary .md-nav__container .md-nav__icon { width: 0.9rem; height: 0.9rem; margin: 0; }
  .md-nav--primary .md-nav__container .md-nav__icon::after {
    transform: none; transition: transform 0.2s ease;
  }
  .md-nav--primary .md-nav__toggle:checked + .md-nav__container .md-nav__icon::after { transform: rotate(90deg); }
  /* Section ouverte : titre en gras. */
  .md-nav--primary .md-nav__toggle:checked + .md-nav__container > a.md-nav__link { font-weight: 700; color: #1b2733; }
  /* Section qui contient la page ouverte : en couleur de marque, pour qu'on
     voie la branche où l'on se trouve sans avoir à lire toute la colonne. */
  .md-nav--primary .md-nav__item--nested:has(.md-nav__link--active) > .md-nav__container > a.md-nav__link,
  .md-nav--primary .md-nav__item--nested:has(.md-nav__link--active) > .md-nav__container > label .md-nav__icon {
    color: var(--lplg-blue);
  }

  /* Sous-pages : un cran à droite du titre de leur section, jamais à gauche. */
  .md-nav--primary .md-nav__item--nested:not(.md-nav__item--section) > .md-nav > .md-nav__list {
    margin-left: var(--rh-nav-step); padding: 0;  /* le thème remet 12px à gauche */
  }
  /* Le dépliage du thème anime la hauteur de la boîte, mais la laissait
     `overflow: visible` : en se refermant, les sous-pages débordaient sur la
     section suivante. Découpée, la liste s'enroule comme un store. */
  .md-nav--primary .md-nav__item--nested:not(.md-nav__item--section) > .md-nav { overflow: hidden; }

  /* Page active : pastille pleine de marque. */
  .md-nav--primary .md-nav__list .md-nav__link--active,
  .md-nav--primary .md-nav__list .md-nav__container:has(> a.md-nav__link--active) {
    background: var(--lplg-blue); color: #fff !important; font-weight: 700;
  }
  .md-nav--primary .md-nav__list .md-nav__container:has(> a.md-nav__link--active) > .md-nav__link { color: #fff !important; }
  .md-nav--primary .md-nav__list .md-nav__link--active:hover,
  .md-nav--primary .md-nav__list .md-nav__container:has(> a.md-nav__link--active):hover { background: var(--lplg-blue); }

  /* --- Icônes d'app devant les sections d'application ------------------ */
  /* La case est réservée sur TOUTES les sections, même celles qui n'ont pas
     d'icône (Configuration) : sinon leur titre revient sur le rail du chevron
     et casse la colonne. Sans `--rh-app-icon`, la case reste vide. */
  .md-nav--primary { --rh-app-icon: none; }
  .md-nav--primary .md-nav__list .md-nav__container > a.md-nav__link::before {
    content: ""; flex: 0 0 auto; width: 1.05rem; height: 1.05rem; margin-right: 0.4rem;
    background: var(--rh-app-icon) center / contain no-repeat; border-radius: 3px;
  }
  #__nav_2_1 + .md-nav__container > a { --rh-app-icon: url("app-icons/residents.png"); }
  #__nav_2_2 + .md-nav__container > a { --rh-app-icon: url("app-icons/admissions.png"); }
  #__nav_2_3 + .md-nav__container > a { --rh-app-icon: url("app-icons/billing.png"); }
  #__nav_2_4 + .md-nav__container > a { --rh-app-icon: url("app-icons/split-billing.png"); }
  #__nav_2_5 + .md-nav__container > a { --rh-app-icon: url("app-icons/care.png"); }
  #__nav_2_6 + .md-nav__container > a { --rh-app-icon: url("app-icons/care-mobile.png"); }
  #__nav_2_7 + .md-nav__container > a { --rh-app-icon: url("app-icons/meals.png"); }
  #__nav_2_8 + .md-nav__container > a { --rh-app-icon: url("app-icons/family-portal.png"); }
  /* Espace Belgique : eHealth, Forfait et Centre de jour sont les seules
     sections dépliables. On les reconnaît à leurs sous-pages (jamais à leur
     position, qui change dès qu'on ajoute une page). */
  .md-nav__item--nested:has(> nav a[href*="suivi-simulations/"]) > .md-nav__container > a { --rh-app-icon: url("app-icons/funding.png"); }
  /* eHealth, Centre de jour et Documents n'ont pas d'icône d'app propre :
     pictogramme à la couleur du texte. */
  .md-nav__item--nested:has(> nav a[href*="mda-erreurs/"]) > .md-nav__container > a::before,
  .md-nav__item--nested:has(> nav a[href*="norme-personnel/"]) > .md-nav__container > a::before,
  #__nav_2_9 + .md-nav__container > a::before {
    background: currentColor; opacity: 0.75;
    -webkit-mask: var(--rh-app-icon) center / contain no-repeat;
    mask: var(--rh-app-icon) center / contain no-repeat;
  }
  /* Le Centre de jour a un soleil : on vient la journée. */
  .md-nav__item--nested:has(> nav a[href*="norme-personnel/"]) > .md-nav__container > a { --rh-app-icon: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 7.5a4.5 4.5 0 100 9 4.5 4.5 0 000-9zM11 1h2v3.2h-2zm0 18.8h2V23h-2zM1 11h3.2v2H1zm18.8 0H23v2h-3.2zM4.1 5.5l1.4-1.4 2.3 2.3-1.4 1.4zm12.1 12.1l1.4-1.4 2.3 2.3-1.4 1.4zM4.1 18.5l2.3-2.3 1.4 1.4-2.3 2.3zm12.1-12.1l2.3-2.3 1.4 1.4-2.3 2.3z'/></svg>"); }
  .md-nav__item--nested:has(> nav a[href*="mda-erreurs/"]) > .md-nav__container > a { --rh-app-icon: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M20.5 9.5C20.5 12 12 20 12 20S3.5 12 3.5 9.5 5.5 5 8 5c1.5 0 3 1 4 2.5C13 6 14.5 5 16 5c2.5 0 4.5 2 4.5 4.5z'/></svg>"); }
  #__nav_2_9 + .md-nav__container > a { --rh-app-icon: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M6 2h8l4 4v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2zm7 1.5V8h4.5L13 3.5zM8 13h8v-2H8zm0 4h8v-2H8z'/></svg>"); }

  /* --- Mode sombre ------------------------------------------------------ */
  [data-md-color-scheme="slate"] .md-nav--primary > .md-nav__list > .md-nav__item--section > .md-nav__link { color: #8aa2ff; }
  [data-md-color-scheme="slate"] .md-nav--primary .md-nav__list .md-nav__link { color: #b7c0cc; }
  [data-md-color-scheme="slate"] .md-nav--primary .md-nav__list .md-nav__link:hover,
  [data-md-color-scheme="slate"] .md-nav--primary .md-nav__list .md-nav__container:hover { background: #1b2636; color: #eef2f7; }
  [data-md-color-scheme="slate"] .md-nav--primary .md-nav__toggle:checked + .md-nav__container > a.md-nav__link { color: #eef2f7; }
  [data-md-color-scheme="slate"] .md-nav--primary .md-nav__item--nested:has(.md-nav__link--active) > .md-nav__container > a.md-nav__link,
  [data-md-color-scheme="slate"] .md-nav--primary .md-nav__item--nested:has(.md-nav__link--active) > .md-nav__container > label .md-nav__icon { color: #8aa2ff; }
  [data-md-color-scheme="slate"] .md-nav--primary .md-nav__list .md-nav__link--active,
  [data-md-color-scheme="slate"] .md-nav--primary .md-nav__list .md-nav__container:has(> a.md-nav__link--active) { background: #3b5bff; }
}

/* ---------- Cartes de la page d'accueil (sphinx-design + grid.cards) ---------- */
.md-typeset .sd-card,
.md-typeset .grid.cards > ul > li,
.md-typeset .grid > .card {
  border: 1px solid var(--lplg-border);
  border-radius: 0.7rem;
  box-shadow: none;
  transition: border-color 0.2s, box-shadow 0.2s, transform 0.2s;
}
.md-typeset .sd-card:hover,
.md-typeset .grid.cards > ul > li:hover,
.md-typeset .grid > .card:hover {
  border-color: var(--md-primary-fg-color);
  box-shadow: 0 0.3rem 0.9rem rgba(15, 67, 255, 0.14);
  transform: translateY(-2px);
}
/* Titre de carte = lien bleu de marque, sans soulignement ; corps en encre douce. */
.md-typeset .sd-card-title,
.md-typeset .sd-card-title a { color: var(--md-primary-fg-color); font-weight: 700; }
.md-typeset .sd-card-title a { text-decoration: none; }
.md-typeset .sd-card-title a:hover { text-decoration: underline; }
.md-typeset .sd-card-body { color: var(--md-default-fg-color--light); font-size: 0.75rem; }
.md-typeset .grid.cards .twemoji svg,
.md-typeset .grid.cards .lg svg { fill: var(--md-primary-fg-color); }

.md-content__button { color: var(--md-primary-fg-color); }

/* Sélecteur de pays (en-tête) — _static/rh-country.js, _ext/countries.py.
   Même gabarit que le sélecteur de langue, à sa gauche. */
.rh-switch { position: relative; flex: 0 0 auto; margin: 0 0.15rem 0 0.3rem; }
.rh-switch__button {
  display: inline-flex; align-items: center; gap: 0.35rem;
  padding: 0.2rem 0.45rem; font: inherit; font-size: 0.7rem; font-weight: 700;
  color: inherit; background: transparent; cursor: pointer;
  border: 1px solid var(--lplg-border); border-radius: 7px;
}
.rh-switch__button:hover,
.rh-switch.is-open .rh-switch__button { background: var(--md-accent-fg-color--transparent); }
.rh-flag { width: 1.05rem; height: 0.7rem; flex: 0 0 auto; border-radius: 2px;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.18); }
.rh-caret { width: 0.9rem; height: 0.9rem; fill: currentColor; opacity: 0.75; margin-right: -0.15rem; }
.rh-switch__menu {
  display: none; position: absolute; top: calc(100% + 0.35rem); right: 0; z-index: 10;
  min-width: 12rem; padding: 0.3rem; border-radius: 9px;
  background: var(--md-default-bg-color); color: var(--md-default-fg-color);
  box-shadow: 0 6px 22px rgba(0, 0, 0, 0.22); border: 1px solid var(--lplg-border);
}
.rh-switch.is-open .rh-switch__menu { display: block; }
.rh-switch__menu .rh-country {
  display: flex; align-items: center; gap: 0.55rem; padding: 0.45rem 0.6rem;
  border-radius: 6px; font-size: 0.72rem; font-weight: 600; color: inherit !important;
  text-decoration: none;
}
.rh-switch__menu .rh-country:hover, .rh-switch__menu .rh-country:focus { background: var(--md-accent-fg-color--transparent); outline: none; }
.rh-switch__menu .rh-country.is-current { background: var(--lplg-blue); color: #fff !important; }
.rh-country__name { flex: 1 1 auto; }
.rh-soon {
  white-space: nowrap;
  font-size: 0.58rem; font-weight: 700; letter-spacing: 0.03em; text-transform: uppercase;
  padding: 0.1rem 0.4rem; border-radius: 1rem; background: #FBBC05; color: #1a1a1a;
}
[data-md-color-scheme="slate"] .rh-switch__button,
[data-md-color-scheme="slate"] .rh-switch__menu { border-color: #223247; }
/* Téléphone : le drapeau seul dans l'en-tête, le nom reste dans le menu. */
@media screen and (max-width: 44.9375em) { .rh-switch__name { display: none; } }

/* Encadré pays dans une page commune — `:class: rh-country rh-country-be`.
   Il ne s'affiche que pour le pays choisi (CSS émise par _ext/countries.py)
   et renvoie vers les spécificités de ce pays. Titre précédé du drapeau. */
.md-typeset .admonition.rh-country { border-color: var(--lplg-blue); }
.md-typeset .admonition.rh-country > .admonition-title { background: var(--lplg-blue-2); padding-left: 2.2rem; }
.md-typeset .admonition.rh-country > .admonition-title::before {
  -webkit-mask: none; mask: none; background: var(--rh-flag) center / cover no-repeat;
  width: 1.05rem; height: 0.7rem; top: 50%; transform: translateY(-50%); left: 0.7rem;
  border-radius: 2px; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.18);
}
[data-md-color-scheme="slate"] .md-typeset .admonition.rh-country > .admonition-title { background: #1b2a4a; }

/* En-tête : « WideCare › Resthome · Maisons de repos › [pays ▾] » — la
   hiérarchie de la documentation, lue de gauche à droite (layout.html,
   _static/rh-country.js). Le titre ne s'étire plus : le sélecteur de pays le
   suit, et ce qui vient ensuite (recherche, langues) est poussé à droite. */
.md-header__title { flex-grow: 0; }
.rh-countryswitch { margin-right: auto; }
.rh-switch { margin-left: 0.1rem; }
.rh-switch::before {
  content: "›"; margin-right: 0.45rem; opacity: 0.55; font-weight: 400;
}
.rh-switch { display: inline-flex; align-items: center; }
.rh-brand { font-weight: 800; letter-spacing: 0.01em; }
.rh-crumb-sep { margin: 0 0.45rem; opacity: 0.55; font-weight: 400; }
.rh-suite { font-weight: 700; }
.rh-suite-label {
  margin-left: 0.45rem; padding: 0.05rem 0.45rem; border-radius: 1rem;
  font-size: 0.62rem; font-weight: 600; vertical-align: middle;
  background: var(--md-accent-fg-color--transparent); opacity: 0.9;
}
/* Téléphone : le fil se réduit à « Resthome », le pays reste en drapeau. */
@media screen and (max-width: 44.9375em) {
  .rh-brand, .rh-suite-label, .rh-switch__name, .rh-suiteswitch::before { display: none; }
}

/* Menu des suites : le nom de la suite, et son métier en petit dessous. */
.rh-suite-sub { display: block; font-size: 0.6rem; font-weight: 500; opacity: 0.75; }
.rh-brand { color: inherit !important; text-decoration: none; }
.rh-brand:hover { text-decoration: underline; }

/* Portail WideCare (content/widecare.md, directive {rh-suites}) : une carte
   par suite ; celle qui a sa documentation s'ouvre, les autres sont annoncées. */
.rh-suite-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(11.5rem, 1fr));
  gap: 0.8rem; margin: 1.2rem 0 1.6rem; }
.md-typeset .rh-suite-card { display: flex; flex-direction: column; gap: 0.25rem;
  padding: 0.9rem 1rem; border: 1px solid var(--lplg-border); border-radius: 10px;
  color: inherit; text-decoration: none; min-height: 6.5rem; }
.md-typeset a.rh-suite-card.is-live { border-color: var(--lplg-blue);
  box-shadow: 0 2px 10px rgba(15, 67, 255, 0.12); }
.md-typeset a.rh-suite-card.is-live:hover { transform: translateY(-2px);
  box-shadow: 0 5px 16px rgba(15, 67, 255, 0.2); }
.rh-suite-card__name { font-size: 0.95rem; font-weight: 800; }
.rh-suite-card__label { font-size: 0.72rem; opacity: 0.75; }
.rh-suite-card__badge { margin-top: auto; align-self: flex-start; font-size: 0.6rem;
  font-weight: 700; letter-spacing: 0.03em; text-transform: uppercase; padding: 0.12rem 0.5rem;
  border-radius: 1rem; background: var(--lplg-blue); color: #fff; }
.rh-suite-card__badge.is-soon { background: #FBBC05; color: #1a1a1a; }
.md-typeset div.rh-suite-card { opacity: 0.85; }
/* Portail (pas de menus de suite ni de pays) : le titre repousse lui-même le
   reste de l'en-tête à droite. */
.md-header__inner:not(:has(.rh-switch)) .md-header__title { margin-right: auto; }