/* ==========================================================================
   Valideo — couche de compatibilité pour les pages non refondues.

   Bootstrap 5 n'est plus chargé : il entrait en conflit avec les tokens du
   design system sur les mêmes sélecteurs, et pesait 232 Ko de CSS plus 80 Ko
   de JS en CDN pour une poignée d'utilitaires.

   Ce fichier réimplémente exactement les classes que les onze pages non
   maquettées emploient réellement — relevé fait sur leur markup, pas par
   précaution. Le reste de leur mise en forme vient de public/css/app.css,
   qui n'est pas concerné.

   Chargé uniquement par layouts/main.blade.php.

   Points de rupture Bootstrap conservés à l'identique :
     sm 576 · md 768 · lg 992 · xl 1200
   Échelle d'espacement : 0=0 · 1=.25rem · 2=.5rem · 3=1rem · 4=1.5rem · 5=3rem
   (6 n'existe pas chez Bootstrap ; il est employé ici par le projet, à 4.5rem.)
   ========================================================================== */

/* ==========================================================================
   Reboot

   Ce n'est pas de la cosmétique : ces pages ont été dessinées en supposant les
   bases que Bootstrap pose. Sans « box-sizing: border-box », un .container
   large de 1140 px en occupe 1164 une fois son padding ajouté, une .card 310
   au lieu de 266, et l'accumulation décalait la page de près de 2 800 px.

   Chargé avant app.css : le projet garde donc la main sur tout ce qu'il
   redéfinit lui-même.
   ========================================================================== */
*,
*::before,
*::after {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  background-color: #fff;
  -webkit-text-size-adjust: 100%;
}

h1, h2, h3, h4, h5, h6 {
  margin-top: 0;
  margin-bottom: 0.5rem;
  font-weight: 500;
  line-height: 1.2;
}

p {
  margin-top: 0;
  margin-bottom: 1rem;
}

ul, ol {
  padding-left: 2rem;
  margin-top: 0;
  margin-bottom: 1rem;
}

ul ul, ol ul, ul ol, ol ol {
  margin-bottom: 0;
}

/* « bolder » et non 700 : c'est ce que pose Bootstrap, et la largeur du
   texte en dépend. */
b, strong {
  font-weight: bolder;
}

small {
  font-size: 0.875em;
}

img, svg {
  vertical-align: middle;
}

/* Les contrôles n'héritent pas de la police du document par défaut. */
button, input, optgroup, select, textarea {
  margin: 0;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}

button {
  text-transform: none;
  cursor: pointer;
}

table {
  border-collapse: collapse;
  caption-side: bottom;
}

th {
  text-align: inherit;
}

/* ---------- Conteneurs ---------- */
.container,
.container-fluid {
  width: 100%;
  padding-right: 12px;
  padding-left: 12px;
  margin-right: auto;
  margin-left: auto;
}

@media (min-width: 576px)  { .container { max-width: 540px; } }
@media (min-width: 768px)  { .container { max-width: 720px; } }
@media (min-width: 992px)  { .container { max-width: 960px; } }
@media (min-width: 1200px) { .container { max-width: 1140px; } }
@media (min-width: 1400px) { .container { max-width: 1320px; } }

/* ---------- Grille ----------
   Bootstrap pose la gouttière par des marges négatives sur .row et un padding
   sur les colonnes. On reprend ce mécanisme : les pages en dépendent pour
   aligner leurs bords sur ceux du conteneur. */
.row {
  /* La gouttière verticale par défaut est nulle ; les classes g-* la posent. */
  --gutter-y: 0;
  display: flex;
  flex-wrap: wrap;
  margin-top: calc(-1 * var(--gutter-y));
  margin-right: -12px;
  margin-left: -12px;
}

.row > * {
  flex-shrink: 0;
  width: 100%;
  max-width: 100%;
  padding-right: 12px;
  padding-left: 12px;
  margin-top: var(--gutter-y);
}

.col {
  flex: 1 0 0%;
}

.col-12 { flex: 0 0 auto; width: 100%; }

@media (min-width: 576px) {
  .col-sm-12 { flex: 0 0 auto; width: 100%; }
}

@media (min-width: 768px) {
  .col-md-3 { flex: 0 0 auto; width: 25%; }
  .col-md-5 { flex: 0 0 auto; width: 41.66666667%; }
  .col-md-6 { flex: 0 0 auto; width: 50%; }
  .col-md-8 { flex: 0 0 auto; width: 66.66666667%; }
}

@media (min-width: 992px) {
  .col-lg-4 { flex: 0 0 auto; width: 33.33333333%; }
  .col-lg-5 { flex: 0 0 auto; width: 41.66666667%; }
  .col-lg-6 { flex: 0 0 auto; width: 50%; }
  .col-lg-7 { flex: 0 0 auto; width: 58.33333333%; }
  .col-lg-8 { flex: 0 0 auto; width: 66.66666667%; }
}

/* ---------- Gouttières ----------
   Une gouttière verticale ne s'obtient pas par « row-gap » chez Bootstrap :
   la .row remonte de la valeur et chaque enfant redescend d'autant. La
   première ligne reste ainsi collée au haut du conteneur, et seules les
   suivantes sont séparées. Un row-gap, lui, ajoute la hauteur au total —
   d'où les 24 px d'écart mesurés avant cette correction. */
.g-4 { --gutter-y: 1.5rem; }
.gy-2 { --gutter-y: 0.5rem; }
.gy-5 { --gutter-y: 3rem; }

@media (min-width: 992px) {
  .gy-lg-0 { --gutter-y: 0; }
}

.gap-2 { gap: 0.5rem; }
.gap-3 { gap: 1rem; }
.column-gap-3 { column-gap: 1rem; }
.row-gap-2 { row-gap: 0.5rem; }

/* ---------- Affichage ---------- */
.d-none { display: none !important; }
.d-block { display: block !important; }
.d-flex { display: flex !important; }
.d-inline-flex { display: inline-flex !important; }

@media (min-width: 768px) {
  .d-md-inline { display: inline !important; }
}

@media (min-width: 992px) {
  .d-lg-none { display: none !important; }
  .d-lg-block { display: block !important; }
  .d-lg-flex { display: flex !important; }
  .d-lg-inline-flex { display: inline-flex !important; }
}

/* ---------- Flex ---------- */
.flex-column { flex-direction: column !important; }
.flex-wrap { flex-wrap: wrap !important; }
.flex-grow-1 { flex-grow: 1 !important; }
.flex-shrink-0 { flex-shrink: 0 !important; }

.align-items-start { align-items: flex-start !important; }
.align-items-center { align-items: center !important; }
.align-items-stretch { align-items: stretch !important; }

.justify-content-center { justify-content: center !important; }
.justify-content-between { justify-content: space-between !important; }

/* ---------- Espacement ---------- */
.mb-0 { margin-bottom: 0 !important; }
.mb-1 { margin-bottom: 0.25rem !important; }
.mb-2 { margin-bottom: 0.5rem !important; }
.mb-3 { margin-bottom: 1rem !important; }
.mb-4 { margin-bottom: 1.5rem !important; }
.mb-5 { margin-bottom: 3rem !important; }
/* mb-6 n'existe pas chez Bootstrap : employé par le projet. */
.mb-6 { margin-bottom: 4.5rem !important; }

.mt-1 { margin-top: 0.25rem !important; }
.mt-3 { margin-top: 1rem !important; }
.mt-4 { margin-top: 1.5rem !important; }
.mt-5 { margin-top: 3rem !important; }
.mt-auto { margin-top: auto !important; }

.mx-0 { margin-right: 0 !important; margin-left: 0 !important; }
.mx-auto { margin-right: auto !important; margin-left: auto !important; }
.ms-2 { margin-left: 0.5rem !important; }

@media (min-width: 768px) {
  .mb-md-3 { margin-bottom: 1rem !important; }
}

@media (min-width: 992px) {
  .mb-lg-0 { margin-bottom: 0 !important; }
}

.p-4 { padding: 1.5rem !important; }

.pt-2 { padding-top: 0.5rem !important; }
.pt-4 { padding-top: 1.5rem !important; }
.pt-5 { padding-top: 3rem !important; }
.pt-6 { padding-top: 4.5rem !important; }

.pb-5 { padding-bottom: 3rem !important; }
.pb-6 { padding-bottom: 4.5rem !important; }

.px-0 { padding-right: 0 !important; padding-left: 0 !important; }
.px-2 { padding-right: 0.5rem !important; padding-left: 0.5rem !important; }
.px-4 { padding-right: 1.5rem !important; padding-left: 1.5rem !important; }
.px-5 { padding-right: 3rem !important; padding-left: 3rem !important; }

.py-2 { padding-top: 0.5rem !important; padding-bottom: 0.5rem !important; }
.py-3 { padding-top: 1rem !important; padding-bottom: 1rem !important; }
.py-5 { padding-top: 3rem !important; padding-bottom: 3rem !important; }

@media (min-width: 576px) {
  .px-sm-2 { padding-right: 0.5rem !important; padding-left: 0.5rem !important; }
}

@media (min-width: 768px) {
  .px-md-3 { padding-right: 1rem !important; padding-left: 1rem !important; }
}

/* ---------- Texte ---------- */
.text-center { text-align: center !important; }
.text-left { text-align: left !important; }
.text-justify { text-align: justify !important; }

@media (min-width: 992px) {
  .text-lg-start { text-align: left !important; }
  .text-lg-end { text-align: right !important; }
}

.text-dark { color: #212529 !important; }
.text-muted { color: #6c757d !important; }

.fw-bold { font-weight: 700 !important; }
.fw-semibold { font-weight: 600 !important; }

.lead { font-size: 1.25rem; font-weight: 300; }
.small { font-size: 0.875em; }

/* ---------- Dimensions ---------- */
.w-100 { width: 100% !important; }
.h-100 { height: 100% !important; }
.min-vh-100 { min-height: 100vh !important; }
/* min-w-0 n'existe pas chez Bootstrap : employé par le projet pour éviter
   qu'un titre flexible ne s'écrase à zéro. */
.min-w-0 { min-width: 0 !important; }

/* ---------- Bordures, ombres, positions ---------- */
.border-0 { border: 0 !important; }
.rounded-0 { border-radius: 0 !important; }
/* rounded-lg est un reste de Bootstrap 4 ; conservé tel qu'employé. */
.rounded-lg { border-radius: 0.5rem !important; }
.shadow-lg { box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175) !important; }
.overflow-hidden { overflow: hidden !important; }
.position-relative { position: relative !important; }

.bg-light { background-color: #f8f9fa !important; }
.bg-success { background-color: #198754 !important; }

.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* ---------- Card ---------- */
.card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  background-color: #fff;
  background-clip: border-box;
  border: 1px solid rgba(0, 0, 0, 0.175);
  border-radius: 0.375rem;
}

.card-body {
  flex: 1 1 auto;
  padding: 1rem;
}

.card-title { margin-bottom: 0.5rem; }
.card-text:last-child { margin-bottom: 0; }

.card-img-top {
  width: 100%;
  border-top-left-radius: calc(0.375rem - 1px);
  border-top-right-radius: calc(0.375rem - 1px);
}

/* ---------- Badge ---------- */
.badge {
  display: inline-block;
  padding: 0.35em 0.65em;
  font-size: 0.75em;
  font-weight: 700;
  line-height: 1;
  color: #fff;
  text-align: center;
  white-space: nowrap;
  vertical-align: baseline;
  border-radius: 0.375rem;
}

/* ---------- Table ---------- */
.table {
  width: 100%;
  margin-bottom: 1rem;
  vertical-align: top;
  border-collapse: collapse;
}

.table > :not(caption) > * > * {
  padding: 0.5rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.175);
}

.table > thead { vertical-align: bottom; }

/* ---------- Boutons ----------
   Le projet redéfinit largement ses boutons dans public/css/app.css ; on ne
   fournit ici que la base et les variantes réellement employées. */
.btn {
  display: inline-block;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  cursor: pointer;
  user-select: none;
  background-color: transparent;
  border: 1px solid transparent;
  border-radius: 0.375rem;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out,
    border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.btn-sm {
  padding: 0.25rem 0.5rem;
  font-size: 0.875rem;
  border-radius: 0.25rem;
}

.btn-primary {
  color: #fff;
  background-color: #0d6efd;
  border-color: #0d6efd;
}

.btn-primary:hover {
  background-color: #0b5ed7;
  border-color: #0a58ca;
}

.btn-outline-secondary {
  color: #6c757d;
  border-color: #6c757d;
}

.btn-outline-secondary:hover {
  color: #fff;
  background-color: #6c757d;
}

.btn-group {
  position: relative;
  display: inline-flex;
  vertical-align: middle;
}

/* Les boutons d'un groupe se chevauchent d'un pixel : leurs bordures se
   confondent au lieu de doubler. */
.btn-group > :not(.btn-check:first-child) + .btn,
.btn-group > .btn-group:not(:first-child) {
  margin-left: -1px;
}

/* ---------- Navbar ----------
   Bootstrap annule le padding horizontal de la barre. Sans cette règle, un
   <nav class="navbar container"> garde les 12 px du conteneur et tout son
   contenu se décale de 12 px vers la droite. */
.navbar {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  padding: 0.5rem 0;
}

/* Un bouton radio masqué derrière son étiquette. */
.btn-check {
  position: absolute;
  clip: rect(0, 0, 0, 0);
  pointer-events: none;
}

/* ---------- Formulaires ---------- */
.form-control {
  display: block;
  width: 100%;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  background-color: #fff;
  border: 1px solid #dee2e6;
  border-radius: 0.375rem;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.form-control:focus {
  border-color: #86b7fe;
  outline: 0;
  box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}

.form-control-sm {
  padding: 0.25rem 0.5rem;
  font-size: 0.875rem;
  border-radius: 0.25rem;
}

.form-group { margin-bottom: 1rem; }

/* ---------- Alertes ---------- */
.alert {
  position: relative;
  padding: 1rem;
  margin-bottom: 1rem;
  border: 1px solid transparent;
  border-radius: 0.375rem;
}

/* ---------- Accordéon ----------
   Bootstrap le pilote en JavaScript par « data-bs-toggle="collapse" ».
   Le comportement est repris dans public/js/legacy-collapse.js ; ce qui suit
   n'est que sa mise en forme. */
.accordion {
  --accordion-border: 1px solid rgba(0, 0, 0, 0.125);
}

.accordion-item {
  background-color: #fff;
  border: var(--accordion-border);
}

.accordion-item:not(:first-of-type) {
  border-top: 0;
}

.accordion-item:first-of-type {
  border-top-left-radius: 0.375rem;
  border-top-right-radius: 0.375rem;
}

.accordion-item:last-of-type {
  border-bottom-right-radius: 0.375rem;
  border-bottom-left-radius: 0.375rem;
}

.accordion-header { margin-bottom: 0; }

.accordion-button {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  padding: 1rem 1.25rem;
  font-size: 1rem;
  color: #212529;
  text-align: left;
  background-color: #fff;
  border: 0;
  border-radius: 0;
  overflow-anchor: none;
  cursor: pointer;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out;
}

.accordion-button:not(.collapsed) {
  color: #0c63e4;
  background-color: #e7f1ff;
}

/* Le chevron : Bootstrap l'insère en image de fond et le fait pivoter. */
.accordion-button::after {
  flex-shrink: 0;
  width: 1.25rem;
  height: 1.25rem;
  margin-left: auto;
  content: '';
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3E%3Cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: 1.25rem;
  transition: transform 0.2s ease-in-out;
}

.accordion-button:not(.collapsed)::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%230c63e4'%3E%3Cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3E%3C/svg%3E");
  transform: rotate(-180deg);
}

.accordion-body { padding: 1rem 1.25rem; }

/* ---------- Replis ----------
   « collapse » masque, « collapse show » montre, « collapsing » anime.
   La hauteur est posée par le script pendant la transition. */
.collapse:not(.show) {
  display: none;
}

.collapsing {
  height: 0;
  overflow: hidden;
  transition: height 0.35s ease;
}

/* ---------- Menu déroulant ---------- */
.dropdown { position: relative; }

/* Le chevron du déclencheur : un triangle en bordures, comme chez Bootstrap.
   Il compte dans la largeur du lien — sans lui, la barre se resserre. */
.dropdown-toggle::after {
  display: inline-block;
  margin-left: 0.255em;
  vertical-align: 0.255em;
  content: '';
  border-top: 0.3em solid;
  border-right: 0.3em solid transparent;
  border-bottom: 0;
  border-left: 0.3em solid transparent;
}

.dropdown-menu {
  position: absolute;
  z-index: 1000;
  display: none;
  min-width: 10rem;
  padding: 0.5rem 0;
  margin: 0;
  font-size: 1rem;
  color: #212529;
  list-style: none;
  background-color: #fff;
  border: 1px solid rgba(0, 0, 0, 0.175);
  border-radius: 0.375rem;
}

.dropdown-menu.show { display: block; }

/* ---------- Images ---------- */
.img-fluid {
  max-width: 100%;
  height: auto;
}
