/* Interface du service : sobre, lisible sur ordinateur et tablette ; thème sombre de Homeclik (bo/assets/css/hk.css : couleurs,
   fonds, boutons, champs, tableaux), police Inter servie par le service (inter/, version variable, licence SIL OFL) */
@font-face { font-family: "Inter"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("inter/InterVariable.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: italic; font-weight: 100 900; font-display: swap; src: url("inter/InterVariable-Italic.woff2") format("woff2"); }
:root {
	--fond: #1d162d;
	--surface: hsl(260.6, 30.8%, 19%);
	--bandeau: #221934;
	--texte: hsl(267, 17.2%, 85%);
	--titre: #e3dee8;
	--discret: hsl(267, 10%, 64%);
	--libelle: hsl(5.9, 33%, 62%);
	--bordure: rgba(255, 255, 255, .1);
	--bordure-champ: #3f3650;
	--champ: rgba(255, 255, 255, .02);
	--champ-actif: rgba(255, 255, 255, .08);
	--accent: #7c3aed;
	--accent-texte: #ffffff;
	--anneau: rgba(124, 58, 237, .2);
	--lien: hsl(17, 100%, 63.9%);
	--lien-survol: hsl(17, 100%, 73.9%);
	--secondaire: hsl(13, 65%, 53.1%);
	--ok-fond: rgba(34, 197, 94, .12);
	--ok-texte: #4ade80;
	--erreur-fond: rgba(239, 68, 68, .12);
	--erreur-texte: #f87171;
	color-scheme: dark;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--fond); color: var(--texte); font: 15px/1.5 Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; letter-spacing: -.01em; }
a { color: var(--lien); }
a:hover { color: var(--lien-survol); }
.entete { position: sticky; top: 0; z-index: 10; display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.5rem; padding: .75rem 1rem; background: var(--bandeau); border-bottom: 1px solid rgba(255, 255, 255, .06); }
.marque { display: inline-flex; align-items: center; gap: .6rem; font-weight: 600; text-decoration: none; color: var(--titre); }
.marque img { display: block; height: 1.5rem; width: auto; }
.marque span { padding-left: .6rem; border-left: 1px solid var(--bordure-champ); }
nav { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem 1rem; flex: 1; }
nav a { text-decoration: none; padding: .25rem 0; color: var(--texte); }
nav a:hover { color: var(--titre); }
nav a[aria-current="page"] { font-weight: 600; color: var(--lien); text-decoration: underline; text-underline-offset: .3em; }
.utilisateur { margin-left: auto; color: var(--discret); }
main { padding: 1.5rem 2rem 3rem; }
h1, h2, h3 { color: var(--titre); font-weight: 600; }
h1 { font-size: 1.5rem; margin: 0 0 1rem; }
h2 { font-size: 1.15rem; margin: 2rem 0 .75rem; }
.note { color: var(--discret); font-size: .9rem; }
.carte { max-width: 26rem; background: var(--surface); border: 1px solid rgba(255, 255, 255, .07); border-radius: 8px; box-shadow: 0 1px 3px rgba(0, 0, 0, .3); padding: 1.25rem; }
label { display: block; font-size: .75rem; font-weight: 600; letter-spacing: .03em; text-transform: uppercase; color: var(--libelle); margin: .75rem 0 .25rem; }
label:first-of-type { margin-top: 0; }
input[type="email"], input[type="password"], input[type="text"], select, textarea { width: 100%; padding: .55rem .7rem; font: inherit; color: var(--texte); background: var(--champ); border: 1px solid var(--bordure-champ); border-radius: 6px; transition: border-color .15s ease, box-shadow .15s ease; }
:is(input[type="email"], input[type="password"], input[type="text"], input[type="search"], select, textarea):focus { outline: none; background: var(--champ-actif); border-color: var(--accent); box-shadow: 0 0 0 3px var(--anneau); }
::placeholder { color: rgba(196, 187, 207, .4); }
select { background-color: rgba(255, 255, 255, .05); }
select option { background: var(--surface); color: var(--texte); }
button:focus-visible, a:focus-visible, input[type="checkbox"]:focus-visible, input[type="radio"]:focus-visible { outline: 2px solid var(--lien); outline-offset: 2px; }
input[type="checkbox"], input[type="radio"] { accent-color: var(--accent); }
button { font: inherit; cursor: pointer; border-radius: 6px; transition: filter .15s ease, background-color .15s ease, border-color .15s ease; }
form.carte button[type="submit"] { margin-top: 1.25rem; width: 100%; padding: .6rem 1rem; border: 0; background: var(--accent); color: var(--accent-texte); font-weight: 500; }
a.bouton { display: inline-block; padding: .5rem 1.25rem; border-radius: 6px; background: var(--accent); color: var(--accent-texte); font-weight: 500; text-decoration: none; }
:is(form.carte button[type="submit"], a.bouton, button.principal):hover { filter: brightness(1.12); color: var(--accent-texte); }
h3 { font-size: 1rem; margin: 1.25rem 0 .5rem; }
button.principal { padding: .5rem 1.25rem; border: 0; background: var(--accent); color: var(--accent-texte); font-weight: 500; }
input[type="file"] { width: 100%; font: inherit; color: var(--texte); }
input[type="file"]::file-selector-button { margin-right: .75rem; padding: .4rem 1rem; border: 0; border-radius: 6px; background: var(--secondaire); color: #fff; font: inherit; cursor: pointer; }
input[type="file"]::file-selector-button:hover { filter: brightness(1.08); }
.carte.large { max-width: 46rem; }
.grille { display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap: 0 1rem; }
.grille .pleine { grid-column: 1 / -1; }
.grille label { margin-top: .75rem; }
fieldset { border: 1px solid var(--bordure); border-radius: 6px; margin: 1rem 0 0; padding: .5rem 1rem .75rem; }
legend { font-weight: 500; padding: 0 .25rem; color: var(--titre); }
/* cases à cocher et boutons radio : libellé en texte courant, pas en étiquette de champ */
label.choix { display: block; font-size: inherit; font-weight: normal; letter-spacing: normal; text-transform: none; color: var(--texte); margin: .35rem 0; }
label.simple { display: inline; font-size: inherit; font-weight: normal; letter-spacing: normal; text-transform: none; color: var(--texte); margin: 0; }
.champ-erreur { color: var(--erreur-texte); font-size: .875rem; margin: .25rem 0 0; }
[aria-invalid="true"] { border-color: var(--erreur-texte); }
details { margin: 1rem 0; }
details summary { cursor: pointer; color: var(--lien); }
details.actions-import { margin-top: 2.5rem; border-top: 1px solid var(--bordure); padding-top: 1rem; }
details.actions-import .carte { margin: 1rem 0; }
.visuellement-cache { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
button.secondaire { padding: .3rem .75rem; border: 1px solid var(--bordure-champ); background: var(--champ); color: var(--texte); font-size: .875rem; font-weight: 500; }
button.secondaire:hover { border-color: rgba(255, 255, 255, .22); background: var(--champ-actif); }
button.lien { padding: 0; border: 0; background: none; color: var(--lien); text-decoration: underline; }
button.lien:hover { color: var(--lien-survol); }
.en-ligne { display: inline; margin: 0; }
.espace-haut { margin-top: 5px; }
.actions { white-space: nowrap; }
.actions form + form { margin-left: .4rem; }
.message { padding: .75rem 1rem; border-radius: 6px; background: var(--surface); border: 1px solid var(--bordure); }
.message p { margin: .25rem 0; }
.message.ok { background: var(--ok-fond); color: var(--ok-texte); border-color: rgba(34, 197, 94, .35); }
.message.erreur { background: var(--erreur-fond); color: var(--erreur-texte); border-color: rgba(239, 68, 68, .35); }
.secret { font: 600 1.25rem/1.4 ui-monospace, "SFMono-Regular", Menlo, monospace; letter-spacing: .05em; user-select: all; }
.defilement { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; background: var(--surface); border: 1px solid rgba(255, 255, 255, .07); }
th, td { padding: .5rem .75rem; text-align: left; vertical-align: top; border-bottom: 1px solid var(--bordure); }
th { font-weight: 600; font-size: .7rem; letter-spacing: .05em; text-transform: uppercase; color: var(--libelle); }
tbody tr:hover { background: rgba(124, 58, 237, .06); }
td.date { white-space: nowrap; font-variant-numeric: tabular-nums; }
td.nombre, th.nombre { text-align: right; font-variant-numeric: tabular-nums; }
/* éditeur de correspondances */
nav.filtres { display: flex; flex-wrap: wrap; gap: .25rem 1rem; margin: 1rem 0; }
nav.filtres a[aria-current="page"] { font-weight: 600; text-decoration: underline; text-underline-offset: .3em; }
form.editeur td { font-size: .875rem; }
form.editeur select { width: auto; padding: .3rem; font-size: .875rem; }
td.edition { min-width: 22rem; }
td.edition input { padding: .35rem .5rem; font-size: .875rem; }
input.source { font-family: ui-monospace, "SFMono-Regular", Menlo, monospace; }
input.note-champ { margin-top: .3rem; }
.erreurs-expression { color: var(--erreur-texte); font-size: .8rem; margin-top: .2rem; }
.erreurs-expression:empty { display: none; }
td.valeur { min-width: 7rem; max-width: 14rem; overflow-wrap: anywhere; }
/* assistant IA : état de l'analyse, proposition sous la saisie d'un champ */
section.assistant { background: var(--surface); border: 1px solid var(--bordure); border-radius: 8px; padding: .25rem 1rem; margin: 1rem 0; }
section.assistant h2 { font-size: 1rem; margin: .5rem 0 0; }
.proposition { margin-top: .4rem; padding: .4rem .5rem; border-left: 3px solid var(--accent); background: var(--fond); font-size: .8rem; }
.proposition label, .recherche label, .zones-formulaire label { text-transform: none; letter-spacing: normal; }
.proposition label { display: inline-flex; gap: .3rem; align-items: center; margin: .2rem 0 0; font-weight: 600; }
.pastille { display: inline-block; width: .7rem; height: .7rem; margin-right: .4rem; border-radius: 50%; vertical-align: -.05rem; }
.confiance-haute { background: #22c55e; }
.confiance-moyenne { background: #eab308; }
.confiance-faible { background: #ef4444; }
ul.valeurs-proposition { margin: .2rem 0; padding-left: 1rem; color: var(--discret); }
/* page Correspondances : éditeur à gauche, PDF d'origine à droite (zone du champ en cours encadrée par editeur.js) */
.editeur-pdf { display: grid; grid-template-columns: minmax(0, 1fr) minmax(22rem, 38%); gap: 1.25rem; align-items: start; }
.pdf-editeur { position: sticky; top: 3.75rem; max-height: calc(100vh - 4.25rem); overflow-y: auto; }
.pdf-editeur nav.filtres { margin: 0 0 .5rem; gap: .25rem .6rem; }
.pdf-editeur figure { position: relative; margin: 0; }
.pdf-editeur img { display: block; width: 100%; height: auto; border: 1px solid var(--bordure); background: #fff; cursor: crosshair; }
.zone-visee { position: absolute; outline: 3px solid #e07b00; outline-offset: 2px; background: rgba(224, 123, 0, .18); pointer-events: none; }
tr.ligne-visee > td:first-child { box-shadow: inset 3px 0 0 #e07b00; }
@media (max-width: 64rem) {
	.editeur-pdf { grid-template-columns: 1fr; }
	.pdf-editeur { order: -1; position: static; max-height: 50vh; }
}
.barre-actions { position: sticky; bottom: 0; background: var(--fond); padding: .75rem 0; margin: 0; border-top: 1px solid var(--bordure); }
/* zones d'un PDF : aperçu de la page à côté du tableau sur grand écran */
.zones { display: grid; grid-template-columns: minmax(0, 612px) minmax(0, 1fr); gap: 1.5rem; align-items: start; }
.apercu { margin: 0; position: sticky; top: 3.75rem; }
.apercu img { width: 100%; height: auto; border: 1px solid var(--bordure); background: #fff; }
.zones-formulaire td { font-size: .85rem; }
.zones-formulaire input[type="text"], .zones-formulaire select { padding: .3rem .4rem; font-size: .85rem; }
input.coord { width: 4.5rem; display: block; margin-bottom: .2rem; }
@media (max-width: 80rem) { .zones { grid-template-columns: 1fr; } .apercu { position: static; } }
/* complétion d'un PDF dans la page (PDF.js) : panneau des champs à compléter, visionneuse */
a.bouton-secondaire { display: inline-block; padding: .3rem .75rem; border: 1px solid var(--bordure-champ); border-radius: 6px; background: var(--champ); color: var(--lien); font-size: .875rem; text-decoration: none; white-space: nowrap; }
.completion { display: grid; grid-template-columns: minmax(16rem, 22rem) minmax(0, 1fr); gap: 1.25rem; align-items: start; }
.panneau-completion { position: sticky; top: 3.75rem; max-height: calc(100vh - 4.25rem); overflow-y: auto; }
.panneau-completion h2 { margin-top: 1rem; }
.etat-completion { font-size: .9rem; }
ol.champs-completion { margin: 0; padding-left: 1.5rem; font-size: .875rem; }
ol.champs-completion li { margin: .3rem 0; }
ol.champs-completion button.lien { text-align: left; }
ol.champs-completion li.rempli button.lien { color: var(--discret); }
.marque-rempli { margin-left: .3rem; color: var(--ok-texte); font-size: .8rem; font-weight: 600; }
.visionneuse { position: relative; height: calc(100vh - 7rem); min-height: 30rem; border: 1px solid var(--bordure); border-radius: 8px; background: hsl(260, 20%, 16%); }
.conteneur-pdf { position: absolute; inset: 0; overflow: auto; }
.conteneur-pdf .pdfViewer .page { margin: .75rem auto; }
a.voir-pdf { display: inline-flex; vertical-align: -.2rem; margin-left: .4rem; color: var(--discret); }
a.voir-pdf:hover, a.voir-pdf:focus-visible { color: var(--lien); }
/* fenêtre du PDF d'origine (page Référentiel, visionneuse_pdf.js) : sans marge intérieure, un clic sur le fond la ferme */
dialog.dialogue-pdf { width: min(64rem, 94vw); height: 92vh; max-height: 92vh; padding: 0; border: 1px solid var(--bordure-champ); border-radius: 8px; background: var(--surface); color: var(--texte); }
dialog.dialogue-pdf[open] { display: flex; flex-direction: column; }
dialog.dialogue-pdf::backdrop { background: rgba(0, 0, 0, .6); }
.entete-dialogue { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; padding: .6rem 1rem; border-bottom: 1px solid var(--bordure); }
.entete-dialogue strong { color: var(--titre); }
.entete-dialogue .etat-visionneuse { flex: 1; }
dialog.dialogue-pdf .visionneuse { flex: 1; height: auto; min-height: 0; border: 0; border-radius: 0 0 8px 8px; }
/* visionneuse : modèle de boîte par défaut du navigateur, attendu par PDF.js (une page est dimensionnée sans sa bordure ;
   en border-box, le dessin rétrécit et les champs se décalent) ; spécificité nulle : les règles de PDF.js l'emportent */
:where(.pdfViewer, .pdfViewer *) { box-sizing: content-box; }
/* champs du PDF : sans les réglages généraux des champs de l'interface (marges intérieures, couleurs du thème) */
.annotationLayer :is(input, textarea, select) { padding: 0 2px; color: #000; background-color: transparent; border-radius: 0; }
/* champ en peigne (un caractère par case) : PDF.js cale les caractères sur les cases depuis le bord gauche du champ ; sa bordure
   latérale de 2 px les décale et rogne la dernière case */
.annotationLayer .textWidgetAnnotation input.comb { border-left-width: 0; border-right-width: 0; }
.annotationLayer section.a-completer { outline: 2px dashed #e07b00; outline-offset: 1px; }
.annotationLayer section.champ-vise { outline: 3px solid #e07b00; outline-offset: 2px; }
@media (max-width: 64rem) {
	.completion { grid-template-columns: 1fr; }
	.panneau-completion { position: static; max-height: none; }
	.visionneuse { height: 80vh; }
	ol.champs-completion { max-height: 16rem; overflow-y: auto; }
}
/* choix des formulaires d'un import */
.recherche label { margin-top: 0; }
.en-ligne-champ { display: flex; gap: .5rem; max-width: 40rem; }
.en-ligne-champ input { flex: 1; }
.filtre-tableau { align-items: center; margin-bottom: .5rem; }
.filtre-tableau[hidden] { display: none; }
.choix-groupe label.simple { font-weight: bold; }
.filtre-tableau .note { white-space: nowrap; }
input[type="search"] { padding: .55rem .7rem; font: inherit; color: var(--texte); background: var(--champ); border: 1px solid var(--bordure-champ); border-radius: 6px; }
ul.resultats { list-style: none; padding: 0; }
ul.resultats li { padding: .4rem 0; border-bottom: 1px solid var(--bordure); }
tr.inapplicable td { color: var(--discret); }
textarea { resize: vertical; line-height: 1.4; }
p.commentaire { white-space: normal; background: var(--surface); border-left: 3px solid var(--bordure); padding: .5rem .75rem; }
.alerte { color: var(--erreur-texte); font-weight: 600; }
code { font-family: ui-monospace, "SFMono-Regular", Menlo, monospace; font-size: .9em; }
@media (max-width: 64rem) {
	th, td { padding: .5rem; }
	.actions { white-space: normal; }
	.actions form + form { margin-left: 0; }
	.actions form { display: block; margin-bottom: .3rem; }
}
@media (max-width: 40rem) {
	.utilisateur { margin-left: 0; }
	main { padding: 1rem 1rem 2rem; }
}