/* Palette CREAGIDEM (ADR-0020, appliquée à Bootstrap par ADR-0035) — relevée sur
   https://www.creagidem.com : bleu marine des titres/menus, accent orangé/tan du
   logo (le beige de fond a été abandonné par ADR-0082 puis ADR-0083). Vérifiée par lecture
   des styles calculés du site réel, pas supposée. */
:root {
    --creagidem-navy: #003567;
    /* Survol = navy éclairci de 8 % (ThemeDefauts, ADR-0100), la valeur que l'injecteur posait jusqu'ici dans les deux
       modes dès qu'une ligne THEME_SETTINGS existait (#00457f n'était plus que le repli sans ligne). */
    --creagidem-navy-hover: #144573;
    --creagidem-heading: #333366;
    /* Le beige #ECE7E5 relevé sur le site a été le fond de page jusqu'à ADR-0082 décision 6b : il
       rendait les contrôles de saisie peu visibles, et le fond est passé à --creagidem-page-bg.
       La variable --creagidem-cream qui le portait a été **supprimée** (ADR-0083 décision 4) : elle
       n'avait plus aucun usage dans le dépôt, et une variable de palette morte diverge au premier
       changement de charte. La valeur reste dans l'ADR si un aplat chaud est un jour demandé. */
    --creagidem-accent: #c68f67;
    --creagidem-navbar-height: 3.5rem;

    /* ADR-0082 décision 6b : fond de page clair et neutre, cartes/champs/modales en blanc — les
       cases à cocher, champs et bordures se détachent nettement, ce que le beige ne permettait pas.
       Repli prévu si le rendu est refusé : #ffffff. */
    --creagidem-page-bg: #f7f7f7;
    --creagidem-surface: #ffffff;

    /* Surcharge des variables Bootstrap consommées via var() par les utilitaires
       (.bg-primary, anneau de focus...) et par AdminLTE (--lte-card-variant-bg : .card-primary/
       .bg-primary/.text-bg-primary ne lisent pas --bs-primary, AdminLTE fige sa propre couleur de
       variante à la compilation SCSS, vérifié sur le CSS compilé livré dans le paquet). Ces usages
       sont tous "couleur de fond" (bouton, en-tête de carte, bordure) — navy/tan restent lisibles
       avec leur texte blanc associé en mode clair comme en mode sombre, pas besoin de variante par
       thème. Les composants qui figent leurs couleurs en hexadécimal à la compilation
       (.btn-primary, .form-control:focus, .form-check-input:checked) sont réécrits explicitement
       plus bas — Bootstrap 5.3 ne les expose pas tous via var(). */
    --bs-primary: var(--creagidem-navy);
    --bs-primary-rgb: 0, 53, 103;
    --bs-secondary: var(--creagidem-accent);
    --bs-secondary-rgb: 198, 143, 103;
    /* Dérivés du navy par var() (ADR-0100) : un navy choisi dans le thème les entraîne, sans valeur figée ici. */
    --bs-focus-ring-color: rgba(var(--bs-primary-rgb), .25);
    --lte-card-variant-bg: var(--creagidem-navy);
    --lte-card-variant-bg-rgb: var(--bs-primary-rgb);
}

.card-secondary,
.bg-secondary,
.text-bg-secondary {
    --lte-card-variant-bg: var(--creagidem-accent);
    --lte-card-variant-bg-rgb: var(--bs-secondary-rgb);
}

/* Ces usages-ci sont au contraire du TEXTE (fond de page, corps de texte, liens, .text-primary) :
   du navy sur un fond sombre serait illisible, donc réservés au mode clair uniquement
   (":not([data-bs-theme=dark])" plutôt que ":root, [data-bs-theme=light]" — nécessaire pour que
   l'attribut l'emporte sur :root, qui matche toujours sinon). Mode sombre (ColorModeToggle,
   ADR-0048) : on garde volontairement la palette sombre standard d'AdminLTE pour ce prompt plutôt
   que de recalculer une variante teintée CREAGIDEM (YAGNI) — point à trancher par Davy si le rendu
   par défaut ne convient pas, voir bilan. */
:root:not([data-bs-theme="dark"]) {
    --bs-body-bg: var(--creagidem-page-bg);
    --bs-body-color: var(--creagidem-heading);
    --bs-primary-text-emphasis: var(--creagidem-navy);
    --bs-link-color: var(--creagidem-navy);
    --bs-link-color-rgb: 0, 53, 103;
    --bs-link-hover-color: var(--creagidem-navy-hover);
    --bs-link-hover-color-rgb: 0, 69, 127;
}

/* ADR-0082 décision 6b, suite : Bootstrap fait reposer le fond des cartes, des modales et des
   champs sur --bs-body-bg (--bs-card-bg / --bs-modal-bg sont posées par les règles .card / .modal
   elles-mêmes, une redéfinition sur :root ne les atteindrait pas). Le fond de page devenant gris
   très clair, on remet explicitement ces trois surfaces en blanc pour qu'elles se détachent.
   Un seul endroit pour toute l'application (ADR-0049, règle 6 du skill) : aucun écran ne redéfinit
   ces couleurs localement. Mode sombre : non concerné, ces règles ne s'y appliquent pas ; les mêmes surfaces (et les
   menus) n'y prennent --creagidem-surface que si l'option « Surfaces » sombre est choisie - règles écrites alors par
   ThemeCssHelper (ADR-0101 décision 4), sinon Bootstrap : fond de page. */
:root:not([data-bs-theme="dark"]) .card {
    --bs-card-bg: var(--creagidem-surface);
}

:root:not([data-bs-theme="dark"]) .modal {
    --bs-modal-bg: var(--creagidem-surface);
}

:root:not([data-bs-theme="dark"]) .form-control,
:root:not([data-bs-theme="dark"]) .form-select {
    background-color: var(--creagidem-surface);
}

/* `.form-control:disabled` / `.form-select:disabled` gardent le gris Bootstrap (--bs-secondary-bg) :
   la règle ci-dessus ne doit pas rendre un champ désactivé indiscernable d'un champ saisissable. */
:root:not([data-bs-theme="dark"]) .form-control:disabled,
:root:not([data-bs-theme="dark"]) .form-select:disabled {
    background-color: var(--bs-secondary-bg);
}

h1:focus {
    outline: none;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    margin: 0;
    /* Le token Bootstrap, pas --creagidem-heading (ADR-0100) : en clair il vaut --creagidem-heading (règle
       :root:not([data-bs-theme="dark"]) ci-dessus, rendu inchangé) ; en sombre, le texte posé hors carte restait
       #333366 sur #212529 (1,5:1, relevé) et l'option « Texte courant » du thème n'avait aucun effet. */
    color: var(--bs-body-color);
}

/* ---- Boutons/formulaires Bootstrap : couleurs figées en hexadécimal à la compilation,
   réécrites avec la palette CREAGIDEM (voir commentaire ci-dessus). ---- */

.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--creagidem-navy);
    --bs-btn-border-color: var(--creagidem-navy);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--creagidem-navy-hover);
    --bs-btn-hover-border-color: var(--creagidem-navy-hover);
    --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--creagidem-navy-hover);
    --bs-btn-active-border-color: var(--creagidem-navy-hover);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--creagidem-navy);
    --bs-btn-disabled-border-color: var(--creagidem-navy);
}

.btn-secondary {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--creagidem-accent);
    --bs-btn-border-color: var(--creagidem-accent);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: color-mix(in srgb, var(--creagidem-accent), black 12%);
    --bs-btn-hover-border-color: color-mix(in srgb, var(--creagidem-accent), black 12%);
    --bs-btn-focus-shadow-rgb: var(--bs-secondary-rgb);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: color-mix(in srgb, var(--creagidem-accent), black 18%);
    --bs-btn-active-border-color: color-mix(in srgb, var(--creagidem-accent), black 18%);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--creagidem-accent);
    --bs-btn-disabled-border-color: var(--creagidem-accent);
}

/* Bouton à contour = texte de marque, dans les deux modes (ADR-0100) : en clair le token vaut le navy (rendu
   inchangé), en sombre sa teinte éclaircie. L'ancienne règle [data-bs-theme="dark"] .btn-outline-primary (bouton
   « Voir la liste » du tableau de bord illisible en sombre, ADR-0048 ; boutons grisés de ConfigurationSocietes
   invisibles, ADR-0051) est fondue ici : même contenu, et l'option « Texte de marque » agit aussi en clair. */
.btn-outline-primary {
    --bs-btn-color: var(--creagidem-texte-marque);
    --bs-btn-border-color: var(--creagidem-texte-marque);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--creagidem-texte-marque);
    --bs-btn-hover-border-color: var(--creagidem-texte-marque);
    --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--creagidem-texte-marque);
    --bs-btn-active-border-color: var(--creagidem-texte-marque);
    --bs-btn-disabled-color: var(--creagidem-texte-marque);
    --bs-btn-disabled-border-color: var(--creagidem-texte-marque);
}

/* Tokens de TEXTE de marque, par thème (ADR-0098 décision 9, contrastes WCAG mesurés au bilan du prompt
   « Dossier client » 2/2). Un écran ne pose jamais de règle [data-bs-theme="dark"] locale : il lit ces tokens.
   - --creagidem-texte-marque : navy en texte. Clair = navy (inchangé) ; sombre = navy éclairci (45 % de navy,
     #8ca4bb : 5,99:1 sur #212529, 5,17:1 sur la surface tertiaire), lu aussi par .btn-outline-primary / .text-primary ci-dessous (55 % auparavant, #7390ab : 4,63:1 sur
     #212529 mais 4,00:1 sur la surface tertiaire, KO). Le navy plein y donnait 1,25:1 (titres d'onglets, en-têtes
     de colonnes du dossier). Depuis ADR-0099 (décision 3) puis ADR-0100, la teinte est une option du thème, dans chaque
     mode (THEME_SETTINGS.options_clair / options_sombre, clé creagidem-texte-marque) que ThemeStyleInjector pose sous
     le même sélecteur, après ce fichier : les valeurs ci-dessous ne sont plus que le repli sans option choisie.
   - --creagidem-surface en sombre : les surfaces « blanches » du thème clair (boutons du bandeau des tiroirs)
     prennent le fond tertiaire sombre de Bootstrap, au lieu du blanc (illisible) ou d'une règle locale. Choisie dans le
     thème sombre, l'option « Surfaces » colore aussi cartes, fenêtres, champs et menus (ADR-0101 décision 4).
   - --bs-link-color-rgb en sombre : jusqu'à ADR-0100, ThemeStyleInjector posait `:root { --bs-link-color-rgb: navy }`
     APRÈS ce fichier et pour tous les thèmes (il écrit désormais un bloc par mode) - en sombre, chaque lien (téléphones, e-mails de /clients…) sortait en navy,
     1,25:1. :root[data-bs-theme="dark"] (spécificité 0,2,0) l'emporte sur ce :root injecté (0,1,0) et rend au mode
     sombre les liens standard de Bootstrap 5.3 (#6ea8fe / #8bb9fe), comme le reste de sa palette (ADR-0048). La
     donnée THEME_SETTINGS et le thème clair ne sont pas touchés. */
:root {
    --creagidem-texte-marque: var(--creagidem-navy);
}

:root[data-bs-theme="dark"] {
    --creagidem-texte-marque: color-mix(in srgb, var(--creagidem-navy) 45%, white);
    --creagidem-surface: var(--bs-tertiary-bg);
    --bs-link-color-rgb: 110, 168, 254;
    --bs-link-hover-color-rgb: 139, 185, 254;
}

/* Titres et textes .text-primary = texte de marque, dans les deux modes (ADR-0100). En clair le token vaut le navy :
   rendu identique au rgba(var(--bs-primary-rgb)) de Bootstrap ; en sombre, sa teinte éclaircie (règle d'origine
   [data-bs-theme="dark"] .text-primary, ADR-0048 : navy plein illisible sur #212529, mesuré). L'option « Texte de
   marque » du thème agit ainsi sur tous les titres, pas seulement en sombre. */
.text-primary {
    color: var(--creagidem-texte-marque) !important;
}

.pagination {
    --bs-pagination-active-bg: var(--creagidem-navy);
    --bs-pagination-active-border-color: var(--creagidem-navy);
    --bs-pagination-focus-box-shadow: 0 0 0 .25rem var(--bs-focus-ring-color);
}

table th[role="button"] {
    cursor: pointer;
    user-select: none;
}

.form-control:focus,
.form-select:focus {
    border-color: var(--creagidem-navy);
    box-shadow: 0 0 0 .25rem var(--bs-focus-ring-color);
}

/* ADR-0082 décision 6a : **toutes** les cases à cocher et tous les boutons radio de l'application
   sont bordés en accent tan, pas seulement ceux de la fiche utilisateur et des deux colonnes en
   lecture seule qui portaient `border-secondary` localement. La bordure gris très clair de
   Bootstrap (#dee2e6) sur une carte blanche rend une case décochée presque invisible — constaté sur
   capture au prompt 6/7. Règle unique ici, aucune classe locale (règle 6 du skill ui-blazor) : les
   trois écrans qui la portaient (UtilisateurDetail, Utilisateurs, Materiels) ont été nettoyés.
   Posée avant `:checked`, qui reste navy et gagne de toute façon en spécificité.
   Appliquée aux deux thèmes, pour que l'aspect d'une case ne dépende pas du mode. */
.form-check-input {
    border-color: var(--creagidem-accent);
}

.form-check-input:checked {
    background-color: var(--creagidem-navy);
    border-color: var(--creagidem-navy);
}

.form-check-input:focus {
    border-color: var(--creagidem-navy);
    box-shadow: 0 0 0 .25rem var(--bs-focus-ring-color);
}

/* Curseur (.form-range, premier usage : opacité du filigrane de la fenêtre de mail, prompt Mail interne 2d) : Bootstrap fige son
   pouce en bleu à la compilation. Texte de marque (navy en clair, navy éclairci en sombre), accent quand il est saisi. Une règle par
   moteur : un sélecteur de pseudo-élément inconnu invaliderait toute la règle. */
.form-range::-webkit-slider-thumb {
    background-color: var(--creagidem-texte-marque);
}

.form-range::-webkit-slider-thumb:active {
    background-color: var(--creagidem-accent);
}

.form-range::-moz-range-thumb {
    background-color: var(--creagidem-texte-marque);
}

.form-range::-moz-range-thumb:active {
    background-color: var(--creagidem-accent);
}

/* ---- Page de connexion ---- */

/* Pas de background-color propre : hérite de <body> (déjà thémé clair/sombre via --bs-body-bg,
   règle Bootstrap standard) — un fond crème figé ici créait un cadre crème autour d'une carte de
   connexion sombre une fois le mode sombre actif (repéré à la vérification visuelle réelle). */

.login-card {
    width: 100%;
    max-width: 24rem;
}

.login-logo {
    font-size: 1.75rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.login-logo-creagi {
    color: var(--creagidem-navy);
}

.login-logo-dem {
    color: var(--creagidem-accent);
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
    text-align: start;
}

/* RichTextEditor.razor (ADR-0056, TipTap) : le CSS de TipTap n'habille pas ses tableaux/titres par
   défaut, et .form-control gère seulement la bordure/le fond, pas le contenu ProseMirror interne.
   var(--bs-border-color) suit déjà le thème clair/sombre (pas de règle [data-bs-theme=dark] dédiée
   nécessaire ici). */
.rich-text-editor-content .ProseMirror {
    min-height: inherit;
    outline: none;
}

.rich-text-editor-content .ProseMirror h1,
.rich-text-editor-content .ProseMirror h2,
.rich-text-editor-content .ProseMirror h3 {
    color: var(--creagidem-navy);
}

.rich-text-editor-content .ProseMirror p {
    margin-bottom: 0.5rem;
}

/* ADR-0067 : images insérées dans l'éditeur (données incluses dans le HTML) — jamais plus larges que la page. */
.rich-text-editor-content .ProseMirror img {
    max-width: 100%;
    height: auto;
}

.rich-text-editor-content .ProseMirror img.ProseMirror-selectednode {
    outline: 2px solid var(--creagidem-navy);
}

.rich-text-editor-content .ProseMirror table {
    border-collapse: collapse;
    table-layout: fixed;
    width: 100%;
    margin-bottom: 0.5rem;
}

.rich-text-editor-content .ProseMirror td,
.rich-text-editor-content .ProseMirror th {
    border: 1px solid var(--bs-border-color);
    padding: 0.25rem 0.5rem;
    vertical-align: top;
}

.rich-text-editor-content .ProseMirror th {
    background-color: var(--bs-tertiary-bg);
    font-weight: 600;
}

/* ADR-0129 déc. 1 (b), ADR-0130 déc. 2 : tableau sans bordure (mise en page des courriers) - aucune bordure, à l'écran comme
   à l'impression (voir @media print plus bas), sans quadrillage de compensation. */
.rich-text-editor-content .ProseMirror table[data-bordure="aucune"] td,
.rich-text-editor-content .ProseMirror table[data-bordure="aucune"] th {
    border: none;
}

/* ADR-0129 🟡 1 : symboles des courriers (❒, 🞐, ⮚…) sans police propre dessinés par la police de repli servie en local
   (Noto Sans Symbols 2, déclarée par CataloguePolices), et non par les polices de symboles du poste de la pile de
   l'interface (Segoe UI Symbol, absente hors Windows). Placée en tête sans risque : sa face est limitée par unicode-range à
   ces symboles, tout autre caractère garde la police de l'interface (thème compris). */
.rich-text-editor-content .ProseMirror {
    font-family: "Noto Sans Symbols 2", var(--bs-body-font-family);
}

/* Courriers (prompt 3) : un document imprimé édité dans RichTextEditor (paramètre StyleDocument) garde sa police par défaut
   (celle du PDF, posée sur le conteneur : PoliceCorpsCourrier) au lieu de celle de l'interface, et ses paragraphes n'ont que
   leur espacement propre, comme dans le PDF (RenduCourrier.CssCorps). La police de repli des symboles est déclarée sous le
   nom de chaque famille du catalogue (CataloguePolices) : rien à ajouter à la pile. */
.rich-text-editor-content.rte-document .ProseMirror {
    font-family: inherit;
    font-size: inherit;
    line-height: normal;
}

/* Le document est une page imprimée : fond blanc et texte noir dans les deux thèmes (couleurs du PDF, pas du thème) - en
   sombre, les couleurs propres du courrier (titre bleu marine RVB(0, 0, 100), texte noir des tableaux) resteraient
   illisibles sur le fond de l'interface. Repli si refusé : retirer ce bloc (l'éditeur suit alors le thème). */
:root .rich-text-editor .rich-text-editor-content.rte-document {
    color-scheme: light;
    background-color: #fff;
    color: #000;
}

/* Retrait du bloc adresse (100 mm), tableaux et images à leur taille : en mobile, le document défile dans sa zone, jamais la
   page de l'écran (A3). */
.rich-text-editor-content.rte-document {
    overflow-x: auto;
}

/* Largeur utile de la page (mise en page de l'agence du document, paramètre StyleDocument : --rte-largeur-page) : les lignes se
   coupent comme dans le PDF. */
.rich-text-editor-content.rte-document .ProseMirror {
    width: var(--rte-largeur-page, auto);
}

.rich-text-editor-content.rte-document .ProseMirror p {
    margin: 0;
}

/* ADR-0057 : nouvelles commandes toolbar (citation, ligne horizontale) sans style TipTap par défaut
   -- mark (surlignage) garde le style natif du navigateur (fond/texte jaune/noir explicites,
   lisible tel quel en clair comme en sombre, pas de règle dédiée nécessaire). */
.rich-text-editor-content .ProseMirror blockquote {
    border-left: 3px solid var(--creagidem-accent);
    margin: 0 0 0.5rem;
    padding: 0.25rem 0 0.25rem 1rem;
    color: var(--bs-secondary-color);
    font-style: italic;
}

.rich-text-editor-content .ProseMirror hr {
    border: none;
    border-top: 1px solid var(--bs-border-color);
    margin: 1rem 0;
}

/* ADR-0126 déc. 2 (courriers) : saut de page. À l'écran, repère pointillé et libellé (le nœud est vide, le libellé vient du
   CSS) ; à l'impression, break-after: page et aucune hauteur. */
.rich-text-editor-content .ProseMirror div[data-type="saut-page"] {
    position: relative;
    height: 0;
    margin: 1rem 0;
    border-top: 2px dashed var(--creagidem-accent);
}

.rich-text-editor-content .ProseMirror div[data-type="saut-page"]::after {
    content: "Saut de page";
    position: absolute;
    top: 0.1rem;
    right: 0;
    font-size: 0.7rem;
    line-height: 1;
    color: var(--creagidem-accent);
}

.rich-text-editor-content .ProseMirror div[data-type="saut-page"].ProseMirror-selectednode {
    outline: 2px solid var(--creagidem-navy);
}

@media print {
    div[data-type="saut-page"] {
        break-after: page;
        height: 0;
        margin: 0;
        border: 0;
    }

    div[data-type="saut-page"]::after {
        content: none;
    }

    table[data-bordure="aucune"] td,
    table[data-bordure="aucune"] th {
        border: none !important;
    }
}

/* ADR-0126 déc. 2 : liste des polices de la barre d'outils (chaque nom écrit dans sa police, comme ChoixPolice). */
.rte-police {
    position: relative;
}

.rte-police-bouton {
    min-width: 9rem;
    max-width: 12rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.rte-police-liste {
    position: absolute;
    z-index: 1060;
    top: 100%;
    left: 0;
    min-width: 12rem;
    max-height: 18rem;
    overflow-y: auto;
}
/* CgvDgt.razor (prompt 6/8) : les CGV sont en petits caractères (6 à 8,5 pt, tailles d'origine conservées
   dans le HTML importé du RTF). Le `zoom` n'agrandit que l'affichage de l'éditeur — le HTML enregistré
   garde ses tailles réelles (impression). Paragraphes serrés comme dans la fenêtre legacy : les
   paragraphes vides (espaceurs, sans taille propre une fois convertis) prennent la taille de base des
   CGV (7 pt) au lieu de la taille de page. Repli si refusé visuellement : supprimer ce bloc. */
.cgv-editor .rich-text-editor-content .ProseMirror {
    zoom: 1.5;
}

.cgv-editor .rich-text-editor-content .ProseMirror p {
    font-size: 7pt;
    line-height: 1.3;
    margin-bottom: 0.1rem;
}

/* ---- Choix de l'utilisateur applicatif (2ᵉ étape de connexion, ADR-0074) ---- */

/* La carte de connexion Identity fait 24rem : trop étroit pour une grille d'utilisateurs. On
   n'élargit que cet écran-là, sans toucher au LoginLayout ni à la page de connexion. */
.login-card:has(.choix-utilisateur) {
    max-width: 44rem;
}

.choix-utilisateur-connexion {
    background-color: rgba(var(--bs-primary-rgb), 0.06);
    border: 1px solid rgba(var(--bs-primary-rgb), 0.18);
    border-radius: var(--bs-border-radius-lg);
    padding: 1rem;
}

/* Grille responsive : autant de cartes que la largeur le permet, une seule colonne large en
   dessous de ~320px de contenu — pas de défilement horizontal en mobile. */
.choix-utilisateur-grille {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(6rem, 1fr));
    gap: 0.75rem;
}

.choix-utilisateur-carte {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.35rem;
    padding: 0.6rem 0.35rem;
    border: 1px solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
    background-color: var(--bs-body-bg);
    text-decoration: none;
    color: inherit;
    transition: transform 0.12s ease, border-color 0.12s ease, box-shadow 0.12s ease;
}

.choix-utilisateur-carte:hover,
.choix-utilisateur-carte:focus-visible {
    border-color: var(--bs-primary);
    box-shadow: 0 0.25rem 0.75rem rgba(var(--bs-primary-rgb), 0.18);
    transform: translateY(-2px);
    text-decoration: none;
}

.choix-utilisateur-carte.est-selectionne {
    border-color: var(--bs-primary);
    background-color: rgba(var(--bs-primary-rgb), 0.1);
    box-shadow: inset 0 0 0 1px var(--bs-primary);
}

.choix-utilisateur-login {
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-align: center;
    line-height: 1.15;
    overflow-wrap: anywhere;
    color: var(--creagidem-accent);
}

.choix-utilisateur-carte.est-selectionne .choix-utilisateur-login {
    color: var(--bs-primary);
}

/* Images d'utilisateur (UtilisateurAvatar) : carré, silhouette centrée, couleur par type. */
.utilisateur-avatar {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 3.25rem;
    height: 3.25rem;
    flex: 0 0 auto;
    border-radius: 50%;
    overflow: hidden;
    background-color: rgba(var(--bs-primary-rgb), 0.08);
}

.utilisateur-avatar-lg {
    width: 6rem;
    height: 6rem;
}

/* Miniature affichée à côté du nom de l'utilisateur connecté dans la barre (ADR-0077 décision 1). */
.utilisateur-avatar-sm {
    width: 1.5rem;
    height: 1.5rem;
}

/* Dans la barre (fond bleu marine), la silhouette suit la couleur de l'en-tête plutôt que le `color` par type d'avatar,
   qui la rendrait illisible sur ce fond (règle venue d'AppShellChrome.razor.css : les couleurs de l'en-tête sont ici). */
.app-navbar .app-user {
    color: rgba(255, 255, 255, .85);
}

/* Bascule de thème (BasculeTheme, balisage du ColorModeToggle du paquet : li.nav-item.dropdown > button#bd-theme.nav-link) : rendue hors de
   tout .navbar-nav, elle prenait la couleur des liens (--bs-nav-link-color, #333366 mesuré), illisible sur le bleu de
   l'en-tête en clair. Blanche dans les deux thèmes, au repos, au survol, au focus et menu ouvert, comme les autres icônes
   de l'en-tête (text-white) - ADR-0149 déc. 6. (0,4,0) l'emporte sur `.nav-link:hover / :focus` de Bootstrap (0,2,0). */
.app-navbar .nav-item.dropdown > .nav-link,
.app-navbar .nav-item.dropdown > .nav-link:hover,
.app-navbar .nav-item.dropdown > .nav-link:focus,
.app-navbar .nav-item.dropdown > .nav-link.show {
    color: var(--bs-white);
}

/* Anneau de focus clavier : celui de Bootstrap (primaire à 25 %) ne se voyait pas sur le bleu de l'en-tête (capture) ; blanc à 50 %. */
.app-navbar .nav-item.dropdown > .nav-link:focus-visible {
    box-shadow: 0 0 0 .2rem rgba(var(--bs-white-rgb), .5);
}

/* Menu de la bascule sous 576 px : aligné à droite sur son bouton (dropdown-menu-end), il sortait de l'écran à gauche (bouton à
   46 px du bord, menu de 128 px : 66 px hors écran, mesuré à 375 px - l'en-tête passe sur deux lignes et place la bascule à gauche).
   Aligné sur le bord gauche du bouton, il tient dans l'écran (prompt Divers 3). */
@media (max-width: 575.98px) {
    .app-navbar .nav-item.dropdown > #bd-theme ~ .dropdown-menu {
        right: auto;
        left: 0;
    }
}

.app-navbar .utilisateur-avatar {
    background-color: rgba(255, 255, 255, 0.18);
}

.app-navbar .utilisateur-avatar > svg {
    color: inherit;
}

.utilisateur-avatar > svg,
.utilisateur-avatar > img {
    width: 68%;
    height: 68%;
}

.utilisateur-avatar > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.utilisateur-avatar-admin { color: var(--creagidem-accent); }
.utilisateur-avatar-homme { color: var(--creagidem-navy); }
.utilisateur-avatar-femme { color: #b5657f; }
.utilisateur-avatar-neutre { color: var(--bs-secondary-color); }

/* ---- Onglets aux couleurs CREAGIDEM (ADR-0124 décision 4) ----

   Rendu des onglets du dossier client (ADR-0095, skill ui-blazor B8), d'abord écrit dans DossierClient.razor.css
   (::deep .dossier-onglets), factorisé ici pour que tout écran à onglets prenne le même : texte de marque, onglet actif en
   accent et gras, grisé en couleur secondaire. Uniquement des tokens, redéfinis par thème plus haut (--creagidem-texte-marque,
   --creagidem-accent) : aucune règle [data-bs-theme="dark"] ici.
   - .onglets-marque : couleurs, sur un .nav (nav-tabs). `.nav.onglets-marque .nav-link` (0,3,0) l'emporte sur
     `.nav-link:hover / :focus` de Bootstrap (0,2,0) - le survol garde le texte de marque, seule la bordure de survol de
     .nav-tabs apparaît, comme avant la factorisation - et `.nav-link.active` (0,4,0) sur `.nav-tabs .nav-link.active`
     (0,3,0), sans dépendre de l'ordre des feuilles.
   - .onglets-defilants : rangée sur une ligne qui défile dans sa barre sous la largeur utile (mobile, A3), jamais la page. */
.nav.onglets-marque .nav-link {
    white-space: nowrap;
    color: var(--creagidem-texte-marque);
}

.nav.onglets-marque .nav-link.active {
    color: var(--creagidem-accent);
    font-weight: 600;
}

.nav.onglets-marque .nav-link.disabled {
    color: var(--bs-secondary-color);
}

.nav.onglets-defilants {
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: thin;
}


/* ---- Refus d'autorisation (verifDroit, ADR-0074) ---- */

.acces-refuse {
    max-width: 40rem;
}

/* ---- Écran « pleine hauteur » (ADR-0090 décision 2) ----

   Un écran dont le contenu principal - typiquement une liste virtualisée - doit prendre toute la
   hauteur disponible et défiler chez lui, sans que la page défile et sans hauteur figée du genre
   `calc(100vh - 31rem)`. L'écran déclare simplement un conteneur `.page-pleine-hauteur` en racine.

   Vérifié sur pièces dans adminlte.css avant d'écrire ces règles (ADR-0048/0050) :
   `.app-wrapper` est une grille `min-content 1fr min-content` en `min-height: 100vh`, `.app-main`
   est déjà `display: flex; flex-direction: column` et occupe la rangée `1fr`, et l'en-tête est
   `position: sticky` (classe `fixed-header`) donc il garde sa place dans le flux. Il ne manque
   donc que deux choses : autoriser `.app-main` à ne pas être poussé par son contenu
   (`min-height: 0`, sinon la rangée `1fr` grossit) et faire de `.app-body` un maillon flex.

   `:has()` rend la chose **opt-in** : aucun des autres écrans n'est touché, ce qui évite de faire
   de `.app-body` un conteneur flex pour toute l'application (des marges qui cessent de fusionner,
   des blocs qui se compriment - une régression par écran).

   Désactivé en mobile : la carte de filtres y mange déjà la hauteur, la page doit défiler. */
/* Le maillon qu'il ne faut pas oublier, et que la première mesure a révélé : `.app-wrapper` n'a
   qu'un `min-height: 100vh`, donc une hauteur **indéfinie**. Une rangée `1fr` dans une grille de
   hauteur indéfinie se comporte comme `auto` : elle grossit avec son contenu. Relevé avant
   correctif, fenêtre de 950 px : la fenêtre de liste mesurait 1 139 800 px et c'est la page qui
   défilait. Une hauteur ferme suffit - `min-height: 100vh` la rendait déjà au moins aussi haute. */
.app-wrapper:has(> .app-main > .app-body > .page-pleine-hauteur) {
    height: 100vh;
}

.app-main:has(> .app-body > .page-pleine-hauteur) {
    min-height: 0;
}

.app-body:has(> .page-pleine-hauteur) {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
}

.page-pleine-hauteur {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
}

/* Par défaut, rien ne se comprime : seul l'élément qui porte sa propre règle `flex: 1 1 auto`
   (la zone de liste) prend la place restante. */
.page-pleine-hauteur > * {
    flex: 0 0 auto;
}

@media (max-width: 767.98px) {
    .app-wrapper:has(> .app-main > .app-body > .page-pleine-hauteur) {
        height: auto;
    }

    .app-main:has(> .app-body > .page-pleine-hauteur),
    .app-body:has(> .page-pleine-hauteur),
    .page-pleine-hauteur {
        display: block;
        min-height: 0;
    }
}

/* Arbre des modèles de courriers (ArbreModeles.razor) : lignes pleine largeur, dossiers repliables, sélection en accent.
   Partagé par la liste des modèles (Configuration > Éditions) et le choix du modèle d'un nouveau courrier (dossier client) -
   déplacé de ModelesCourriers.razor.css au prompt 4 des courriers, règles inchangées. Le conteneur défilant reste propre à
   chaque écran. */
.mc-ligne {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    width: 100%;
    min-height: 2.25rem;
    padding: 0.3rem 0.75rem;
    border: 0;
    border-bottom: 1px solid var(--bs-border-color-translucent);
    background: transparent;
    color: var(--bs-body-color);
    text-align: left;
    user-select: none;
}

.mc-ligne:hover {
    background-color: var(--bs-tertiary-bg);
}

.mc-ligne:focus-visible {
    outline: 2px solid var(--creagidem-accent);
    outline-offset: -2px;
}

.mc-dossier .mc-libelle {
    font-weight: 600;
    color: var(--creagidem-texte-marque);
}

.mc-choisi,
.mc-choisi:hover {
    background-color: color-mix(in srgb, var(--creagidem-accent) 20%, transparent);
    box-shadow: inset 3px 0 0 var(--creagidem-accent);
}

.mc-libelle {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mc-chevron {
    display: inline-flex;
    flex: none;
    width: 14px;
    transition: transform 0.15s ease;
}

.mc-chevron-ouvert {
    transform: rotate(90deg);
}

.mc-icone {
    display: inline-flex;
    flex: none;
}

.mc-icone-dossier {
    color: var(--creagidem-accent);
}

.mc-icone-texte {
    color: var(--creagidem-texte-marque);
}

.mc-icone-pdf {
    color: var(--bs-danger-text-emphasis);
}

.mc-agence {
    flex: none;
}

@media (prefers-reduced-motion: reduce) {
    .mc-chevron {
        transition: none;
    }
}

@media (max-width: 767.98px) {
    .mc-libelle {
        white-space: normal;
    }
}
