:root {
  color: #212529;
  background: #fff;
  font-family: "Source Sans 3", "Segoe UI", sans-serif;
  line-height: 1.5;
}

* { box-sizing: border-box; }

body { margin: 0; }

h1, h2, h3, .marque-texte {
  font-family: "Source Serif 4", Georgia, serif;
  font-weight: 600;
  line-height: 1.2;
}

h1 { font-size: 1.9rem; margin: 0; }
h2 { font-size: 1.4rem; margin: 0 0 0.4rem; }
h3 { margin: 0; font-size: 1.15rem; }

a { color: #0f6eb5; }
a:hover { color: #00619e; }

.entete { background: #000; color: #fff; }
.barre {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem 1rem;
  align-items: center;
  justify-content: space-between;
  margin: 0 auto;
  padding: 0.75rem 1rem;
}
.marque {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  color: #fff;
  text-decoration: none;
}
.marque img { height: 4rem; width: auto; }
.marque strong, .marque-texte { display: block; color: #fff; font-size: 1.25rem; }
.marque small { color: rgba(255,255,255,0.75); }
.barre-droite { display: flex; flex-wrap: wrap; gap: 0.6rem 1rem; align-items: center; }
nav[aria-label="Sections"], nav[aria-label="Accès public"] { display: flex; flex-wrap: wrap; gap: 0.2rem; }
nav[aria-label="Sections"] a, nav[aria-label="Accès public"] a {
  color: #fff;
  text-decoration: none;
  border-radius: 0.4rem;
  padding: 0.35rem 0.55rem;
  font-size: 0.95rem;
}
nav[aria-label="Sections"] a:hover, nav[aria-label="Accès public"] a:hover { background: rgba(255,255,255,0.1); color: #fff; }
nav[aria-label="Accès public"] a[aria-current="page"] {
  text-decoration: underline;
  text-underline-offset: 0.35rem;
}
nav[aria-label="Sections"] a[aria-current="page"] {
  background: rgba(255,255,255,0.1);
  text-decoration: underline;
  text-decoration-color: #196db6;
  text-underline-offset: 0.45rem;
  text-decoration-thickness: 2px;
}
.quitter {
  height: 2.25rem;
  border: 1px solid rgba(255,255,255,0.5);
  background: transparent;
  color: #fff;
  border-radius: 0.4rem;
  padding: 0 0.75rem;
  cursor: pointer;
}
.quitter:hover { background: rgba(255,255,255,0.1); }
.trait-cmas { height: 6px; background: linear-gradient(to bottom, #196db6 0 50%, #e93323 50% 100%); }

.large, .etroit { margin: 0 auto; padding: 1.25rem 1rem 2rem; }
.large { max-width: 72rem; }
.etroit, .installation { max-width: 42rem; }
.pied { border-top: 1px solid #d5dee3; color: rgba(33,37,41,0.7); font-size: 0.9rem; }
.pied .large, .pied .etroit { padding-top: 0.8rem; padding-bottom: 1rem; }

.intro, .meta { color: rgba(33,37,41,0.78); font-size: 0.95rem; }
.titre-ligne, .rangee { display: flex; flex-wrap: wrap; gap: 0.6rem 1rem; align-items: center; justify-content: space-between; }
.titre-ligne { margin-bottom: 1rem; }
.sous { margin-top: 0.5rem; }

.btn, button.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.5rem;
  padding: 0.35rem 0.9rem;
  border-radius: 0.5rem;
  border: 1px solid #0f6eb5;
  background: #0f6eb5;
  color: #fff;
  text-decoration: none;
  font: inherit;
  cursor: pointer;
}
.btn:hover { background: #00619e; color: #fff; }
.carte-moniteurs { height: 32rem; width: 100%; border: 1px solid #d5dee3; border-radius: 0.75rem; margin: 1rem 0; }
.pile-cartes { position: relative; margin: 1rem 0; }
.pile-cartes .carte-moniteurs { margin: 0; }
.cadre-quebec { position: relative; overflow: hidden; background: #d5e6f0; }
.pile-cartes .cadre-quebec { position: absolute; inset: 0; z-index: 1; }
.pin-quebec { position: absolute; width: 0.8rem; height: 0.8rem; margin: -0.9rem 0 0 -0.4rem; border: 2px solid #fff; border-radius: 999px; background: #e93323; }
.liste-localiser { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.35rem; }
.liste-localiser li { padding: 0.45rem 0; border-bottom: 1px solid #d5dee3; }
.btn.secondaire, a.btn.secondaire { background: #fff; color: #212529; border-color: #d5dee3; }
.btn.secondaire:hover { color: #00619e; }
dialog.confirmation {
  border: 1px solid #d5dee3;
  border-radius: 0.75rem;
  padding: 1.25rem;
  max-width: 28rem;
  color: #212529;
}
dialog.confirmation::backdrop { background: rgba(33, 37, 41, 0.45); }
dialog.confirmation p { margin: 0 0 1rem; }
dialog.confirmation .rangee { justify-content: flex-start; }

.grille, .filtres { display: grid; gap: 0.8rem; }
.filtres { grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); align-items: end; margin: 1rem 0; }
.champ, .filtres label { display: grid; gap: 0.3rem; font-size: 0.92rem; }
input, select, textarea {
  min-height: 2.5rem;
  border: 1px solid #d5dee3;
  border-radius: 0.5rem;
  padding: 0.35rem 0.6rem;
  font: inherit;
  color: #212529;
  background: #fff;
  width: 100%;
}
.champ small, .alerte { color: #e93323; }
.aide, .masque { color: rgba(33,37,41,0.7); }
.masque { letter-spacing: 0.12em; }
.alerte, .succes, .encart, .vide {
  border-radius: 0.75rem;
  padding: 0.75rem 0.9rem;
}
.alerte { background: #fff; border: 1px solid #e93323; }
.succes { background: #fff; border: 1px solid #196db6; color: #00619e; }
.encart, .vide, .carte, .liste, .table-wrap, .fiche {
  background: #fff;
  border: 1px solid #d5dee3;
  border-radius: 0.75rem;
}
.vide { border-style: dashed; }
.fiche { display: grid; gap: 0.7rem; padding: 1rem; margin: 1rem 0; }
.fiche div { display: grid; gap: 0.15rem; }
.fiche dt { font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.04em; color: rgba(33,37,41,0.6); }
@media (min-width: 700px) {
  .fiche { grid-template-columns: 1fr 1fr; }
  .grille { grid-template-columns: 1fr 1fr; }
  .grille .btn, .grille h2 { grid-column: 1 / -1; }
}

.comptes { list-style: none; padding: 0; margin: 0 0 1rem; display: grid; grid-template-columns: 1fr 1fr; gap: 0.7rem; }
@media (min-width: 800px) { .comptes { grid-template-columns: repeat(4, 1fr); } }
.comptes a {
  display: block;
  border: 1px solid #d5dee3;
  border-radius: 0.75rem;
  padding: 0.8rem;
  text-decoration: none;
  color: inherit;
}
.comptes a:hover { border-color: #196db6; }
.comptes strong { display: block; font-family: "Source Serif 4", Georgia, serif; font-size: 1.8rem; color: #196db6; }

.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 0.95rem; }
th, td { text-align: left; padding: 0.7rem 0.75rem; border-bottom: 1px solid #d5dee3; vertical-align: top; }
th { color: rgba(33,37,41,0.7); font-weight: 600; }
.liste { list-style: none; margin: 0; padding: 0; }
.liste li, .docs li {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0.4rem 1rem;
  padding: 0.8rem 1rem;
  border-bottom: 1px solid #d5dee3;
}
.liste li:last-child, .docs li:last-child { border-bottom: 0; }
.docs { list-style: none; padding: 0; display: grid; gap: 0.7rem; }
.docs li { border: 1px solid #d5dee3; border-radius: 0.75rem; align-items: center; }
.docs img { width: 5.5rem; height: 4rem; object-fit: cover; background: #f4f7f8; border-radius: 0.4rem; }
.pile { display: flex; flex-direction: column; gap: 0.25rem; }
.onglets { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 0.5rem 0 1rem; }
.onglets a {
  display: inline-flex;
  align-items: center;
  min-height: 2.5rem;
  padding: 0.35rem 0.8rem;
  border: 1px solid #d5dee3;
  border-radius: 0.5rem;
  text-decoration: none;
  color: #212529;
  background: #fff;
}
.onglets a[aria-current="page"] { border-color: #196db6; color: #00619e; font-weight: 700; }
.portrait { width: 6rem; height: 6rem; object-fit: cover; border-radius: 0.75rem; background: #f4f7f8; }
.portrait-vide {
  display: grid;
  place-items: center;
  width: 6rem;
  height: 6rem;
  border: 1px dashed #d5dee3;
  border-radius: 0.75rem;
  font-size: 0.8rem;
  text-align: center;
  padding: 0.35rem;
  color: rgba(33,37,41,0.7);
}
.identite { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; justify-content: space-between; }
.badge { display: inline-flex; border-radius: 999px; padding: 0.1rem 0.55rem; font-size: 0.82rem; border: 1px solid #d5dee3; }
.statut-actif, .statut-paye { color: #00619e; border-color: #196db6; }
.statut-inactif, .statut-brouillon { color: rgba(33,37,41,0.7); }
.statut-probation { color: #e93323; border-color: #e93323; }
.statut-envoye { color: #00619e; border-color: #00619e; }
.statut-traite { color: #fff; background: #196db6; border-color: #196db6; }
.statut-annule { color: #212529; border-color: #212529; }
.statut-rembourse { color: #e93323; border-color: #e93323; }
.ligne-facture { display: grid; gap: 0.6rem; padding-bottom: 0.8rem; border-bottom: 1px solid #d5dee3; }
@media (min-width: 800px) { .ligne-facture { grid-template-columns: 2fr 0.7fr 0.9fr; } }
.cartes-paiement { display: grid; gap: 0.8rem; }
@media (min-width: 700px) { .cartes-paiement { grid-template-columns: 1fr 1fr; } }
.grille .plein { grid-column: 1 / -1; }
textarea { min-height: 8rem; }
form.emission .bloc-nouveau { display: none; }
form.emission:has(input[name="recherche"][value="nouveau"]:checked) .bloc-existant { display: none; }
form.emission:has(input[name="recherche"][value="nouveau"]:checked) .bloc-nouveau { display: block; }
.pagination { display: flex; flex-wrap: wrap; gap: 0.6rem 1rem; align-items: center; margin: 0.6rem 0 1rem; }
.tailles a, .pages a, .pages span { margin-right: 0.45rem; }
.tailles a[aria-current="page"] { font-weight: 700; color: #00619e; }
.pages span.inactif { color: rgba(33, 37, 41, 0.4); }
.carte { padding: 0.9rem 1rem; margin-bottom: 0.8rem; }
.categorie { letter-spacing: 0.14em; text-transform: uppercase; color: #00619e; font-size: 0.82rem; }
.lead { font-size: 1.15rem; }
.certificat { border: 1px solid #d5dee3; border-radius: 0.75rem; overflow: hidden; background: #fff; }
.certificat header { background: #000; color: #fff; display: flex; gap: 1rem; align-items: center; padding: 1.1rem 1.3rem; }
.certificat header img { height: 6rem; width: auto; }
.corps-cert { padding: 1.4rem 1.3rem 1.6rem; }
.barre-rouge { height: 0.5rem; background: #e93323; }
section { margin-top: 1.5rem; }
main.etroit:has(.confirmation) { max-width: 8.7in; }
.confirmation {
  box-sizing: border-box;
  margin: 0 auto;
  padding: 0.7in 0.6in 0.55in;
  border: 3px solid #003dcc;
  background: #fff;
  color: #000;
  text-align: center;
  font-family: Arial, Helvetica, sans-serif;
}
.confirmation img { display: block; height: 1.7in; width: auto; margin: 0 auto; }
.confirmation h1 { margin: 0.32in 0 0; font-size: 18pt; line-height: 1.2; font-weight: 700; color: #0f6eb6; }
.confirmation .nom-personne { margin: 0.28in 0 0; font-size: 18pt; font-weight: 700; }
.confirmation .declaration { max-width: 6.7in; margin: 0.32in auto 0; font-size: 14pt; font-weight: 700; line-height: 1.25; }
.confirmation .qualification { margin: 0.38in 0 0; font-size: 18pt; font-weight: 700; }
.confirmation .filet { width: 86%; margin: 0.38in auto 0; border: 0; border-top: 1px solid #808080; }
.confirmation .rubrique { margin: 0.38in 0 0; font-size: 18pt; font-weight: 700; color: #0f6eb6; }
.confirmation .etiquette, .confirmation .valeur { margin: 0; font-size: 12pt; font-weight: 700; line-height: 1.25; }
.confirmation .etiquette { margin-top: 0.04in; }
.confirmation .espace { margin-top: 0.16in; }
.confirmation .org { margin: 0; font-size: 10pt; font-weight: 400; line-height: 1.3; }
.confirmation .rubrique + .org, .confirmation .rubrique + .etiquette { margin-top: 0.06in; }

@media print {
  .no-print { display: none !important; }
  body { background: #fff; }
  .confirmation { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}