/*
 * Clinica — couche de compatibilite Bootstrap 4 -> 5
 *
 * Les 344 vues de l'application utilisent le vocabulaire Bootstrap 4. Plutot
 * que de les reecrire une par une, ce fichier reintroduit les classes
 * supprimees ou renommees par Bootstrap 5. Les vues restent inchangees.
 *
 * Couverture mesuree sur le depot :
 *   float-left/right (196 fichiers), form-group (193), data-toggle (110),
 *   close (101), ml-/mr-/pl-/pr- (45), badge-* (45), form-row (36),
 *   text-right/left (28), media (25), btn-block (10), input-group-append (4),
 *   custom-control (3), custom-select / custom-file (1).
 * Les attributs data-toggle / data-dismiss / data-target sont traites en JS
 * (theme/js/bs4-compat.js), le reste est purement visuel.
 */

/* ---------------------------------------------------------------- flottants */
.float-left  { float: left  !important; }
.float-right { float: right !important; }
.float-none  { float: none  !important; }

/* ---------------------------------------------------------------- alignement */
.text-left  { text-align: left  !important; }
.text-right { text-align: right !important; }

/* ---------------------------------------------------------------- marges et paddings directionnels */
.ml-0 { margin-left: 0 !important; }
.ml-1 { margin-left: .25rem !important; }
.ml-2 { margin-left: .5rem !important; }
.ml-3 { margin-left: 1rem !important; }
.ml-4 { margin-left: 1.5rem !important; }
.ml-5 { margin-left: 3rem !important; }
.ml-auto { margin-left: auto !important; }

.mr-0 { margin-right: 0 !important; }
.mr-1 { margin-right: .25rem !important; }
.mr-2 { margin-right: .5rem !important; }
.mr-3 { margin-right: 1rem !important; }
.mr-4 { margin-right: 1.5rem !important; }
.mr-5 { margin-right: 3rem !important; }
.mr-auto { margin-right: auto !important; }

.pl-0 { padding-left: 0 !important; }
.pl-1 { padding-left: .25rem !important; }
.pl-2 { padding-left: .5rem !important; }
.pl-3 { padding-left: 1rem !important; }
.pl-4 { padding-left: 1.5rem !important; }
.pl-5 { padding-left: 3rem !important; }

.pr-0 { padding-right: 0 !important; }
.pr-1 { padding-right: .25rem !important; }
.pr-2 { padding-right: .5rem !important; }
.pr-3 { padding-right: 1rem !important; }
.pr-4 { padding-right: 1.5rem !important; }
.pr-5 { padding-right: 3rem !important; }

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

.form-row {
  display: flex;
  flex-wrap: wrap;
  margin-right: -5px;
  margin-left: -5px;
}
.form-row > [class*="col-"] { padding-right: 5px; padding-left: 5px; }

/* .custom-select et .custom-file deviennent .form-select / .form-control */
.custom-select {
  display: block;
  width: 100%;
  padding: .5rem 2.25rem .5rem .875rem;
  font-size: var(--bs-body-font-size);
  color: var(--cl-text);
  background-color: var(--cl-surface);
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%2364748b' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right .75rem center;
  background-size: 16px 12px;
  border: 1px solid var(--cl-border-strong);
  border-radius: var(--cl-radius-sm);
  appearance: none;
}

.custom-control { position: relative; display: block; min-height: 1.5rem; padding-left: 1.75rem; }
.custom-control-input { position: absolute; left: 0; z-index: -1; width: 1rem; height: 1.25rem; opacity: 0; }
.custom-control-label { position: relative; margin-bottom: 0; vertical-align: top; cursor: pointer; }
.custom-control-label::before {
  position: absolute;
  top: .25rem;
  left: -1.75rem;
  display: block;
  width: 1rem;
  height: 1rem;
  content: "";
  background-color: var(--cl-surface);
  border: 1px solid var(--cl-border-strong);
  border-radius: .25rem;
}
.custom-checkbox .custom-control-input:checked ~ .custom-control-label::before,
.custom-radio .custom-control-input:checked ~ .custom-control-label::before {
  background-color: var(--cl-primary-500);
  border-color: var(--cl-primary-500);
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
}
.custom-radio .custom-control-label::before { border-radius: 50%; }

/* Bootstrap 5 stylise directement les enfants du groupe : les conteneurs
   intermediaires de Bootstrap 4 doivent devenir transparents. */
.input-group-append,
.input-group-prepend { display: flex; }
.input-group-append .input-group-text,
.input-group-prepend .input-group-text { height: 100%; }

/* ---------------------------------------------------------------- boutons */
.btn-block { display: block; width: 100%; }
.btn-block + .btn-block { margin-top: .5rem; }

/* .close remplace par .btn-close : on garde l'apparence croix sans le glyphe texte */
.close {
  box-sizing: content-box;
  width: 1em;
  height: 1em;
  padding: .25em;
  color: var(--cl-text);
  background: transparent
    url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e")
    center/1em auto no-repeat;
  border: 0;
  border-radius: var(--cl-radius-sm);
  opacity: .5;
  font-size: 0;          /* masque le caractere x des vues */
  line-height: 1;
  text-shadow: none;
  transition: opacity var(--cl-transition);
}
.close:hover { opacity: .9; }
[data-bs-theme="dark"] .close { filter: invert(1) grayscale(100%) brightness(200%); }

/* ---------------------------------------------------------------- badges */
.badge-primary   { color: #fff; background-color: var(--cl-primary-600); }
.badge-secondary { color: #fff; background-color: var(--cl-ink-500); }
.badge-success   { color: #05603a; background-color: #d1fadf; }
.badge-danger    { color: #912018; background-color: #fee4e2; }
.badge-warning   { color: #93370d; background-color: #fef0c7; }
.badge-info      { color: #175cd3; background-color: #d1e9ff; }
.badge-light     { color: var(--cl-text); background-color: var(--cl-surface-muted); }
.badge-dark      { color: #fff; background-color: var(--cl-ink-800); }
[data-bs-theme="dark"] .badge-success { color: #6ce9a6; background-color: rgb(5 150 105 / .18); }
[data-bs-theme="dark"] .badge-danger  { color: #fda29b; background-color: rgb(220 38 38 / .18); }
[data-bs-theme="dark"] .badge-warning { color: #fec84b; background-color: rgb(217 119 6 / .18); }
[data-bs-theme="dark"] .badge-info    { color: #84caff; background-color: rgb(37 99 235 / .18); }

/* ---------------------------------------------------------------- objet media */
.media { display: flex; align-items: flex-start; }
.media-body { flex: 1 1 auto; min-width: 0; }

/* ---------------------------------------------------------------- typographie */
.font-weight-bold   { font-weight: 600 !important; }
.font-weight-normal { font-weight: 400 !important; }
.font-weight-light  { font-weight: 300 !important; }

/* ---------------------------------------------------------------- divers Bootstrap 4 */
.sr-only {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.jumbotron {
  padding: 2rem 1.5rem;
  background-color: var(--cl-surface-muted);
  border-radius: var(--cl-radius-lg);
}

/* =================================================================
 * Héritage Bootstrap 3
 * =================================================================
 * Une partie des vues n'a jamais été migrée en Bootstrap 4 : elles
 * emploient encore la coque .panel, les flottants .pull-*, la grille
 * .col-xs-* et .btn-xs. Rien de tout cela n'existe en Bootstrap 5, donc
 * ces blocs s'affichaient sans surface, sans bordure et sans padding.
 * Relevé sur le dépôt : 516 occurrences de .panel dans 100 fichiers,
 * 92 .pull-*, 126 .btn-xs.
 */

/* --- coque .panel : alignée sur .card --- */
.panel {
  position: relative;
  display: flex;
  flex-direction: column;
  margin-bottom: 1.25rem;
  background: var(--cl-surface);
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-lg);
  box-shadow: var(--cl-shadow-xs);
}
.panel-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  padding: .9rem 1.15rem;
  background: transparent;
  border-bottom: 1px solid var(--cl-border);
  border-radius: var(--cl-radius-lg) var(--cl-radius-lg) 0 0;
  color: var(--cl-text);
  font-size: .975rem;
  font-weight: 600;
}
.panel-body { padding: 1.15rem; }
.panel-footer {
  padding: .9rem 1.15rem;
  background: transparent;
  border-top: 1px solid var(--cl-border);
  border-radius: 0 0 var(--cl-radius-lg) var(--cl-radius-lg);
}
/* aucune variante colorée : règle absolue 1.3 bis */
.panel-primary, .panel-info, .panel-success, .panel-warning, .panel-danger, .panel-default {
  border-color: var(--cl-border) !important;
}
.panel-primary > .panel-heading, .panel-info > .panel-heading,
.panel-success > .panel-heading, .panel-warning > .panel-heading,
.panel-danger > .panel-heading, .panel-default > .panel-heading {
  background: transparent !important;
  border-color: var(--cl-border) !important;
  color: var(--cl-text) !important;
}
/* R4 — un tableau large dans un .panel-body défile, il ne déborde pas */
.panel-body:has(table), .adv-table, .panel-body:has(.adv-table) {
  max-width: 100%;
  overflow-x: auto;
}
/* R1.2 — échelle typographique, comme dans .card */
.panel h1, .panel h2 { font-size: 1.15rem; font-weight: 650; }
.panel h3 { font-size: 1rem; font-weight: 600; }
.panel h4, .panel h5, .panel h6 { font-size: .875rem; font-weight: 600; }
.panel p, .panel .table { font-size: .875rem; }

/* --- flottants Bootstrap 3 --- */
.pull-right { float: right !important; }
.pull-left  { float: left !important; }

/* --- grille .col-xs-* (supprimée depuis Bootstrap 4) --- */
[class*="col-xs-"] { position: relative; padding-right: calc(var(--bs-gutter-x, 1.25rem) * .5); padding-left: calc(var(--bs-gutter-x, 1.25rem) * .5); }
.col-xs-1  { flex: 0 0 8.3333%;  max-width: 8.3333%; }
.col-xs-2  { flex: 0 0 16.6667%; max-width: 16.6667%; }
.col-xs-3  { flex: 0 0 25%;      max-width: 25%; }
.col-xs-4  { flex: 0 0 33.3333%; max-width: 33.3333%; }
.col-xs-5  { flex: 0 0 41.6667%; max-width: 41.6667%; }
.col-xs-6  { flex: 0 0 50%;      max-width: 50%; }
.col-xs-7  { flex: 0 0 58.3333%; max-width: 58.3333%; }
.col-xs-8  { flex: 0 0 66.6667%; max-width: 66.6667%; }
.col-xs-9  { flex: 0 0 75%;      max-width: 75%; }
.col-xs-10 { flex: 0 0 83.3333%; max-width: 83.3333%; }
.col-xs-11 { flex: 0 0 91.6667%; max-width: 91.6667%; }
.col-xs-12 { flex: 0 0 100%;     max-width: 100%; }

/* --- gabarits divers --- */
.btn-xs { padding: .3rem .55rem; font-size: .78rem; line-height: 1.25; border-radius: var(--cl-radius-sm); }
.space15 { display: block; height: 1rem; }
.well {
  padding: 1rem;
  background: var(--cl-surface-muted);
  border: 1px solid var(--cl-border);
  border-radius: var(--cl-radius);
}

/* --- .hidden (Bootstrap 3) ---
   Supprimee en Bootstrap 4 au profit de .d-none. 42 occurrences dans les vues :
   sans cette regle, des blocs censes etre masques restent VISIBLES, dont un
   second bouton de validation dans les modales de rendez-vous. Ce n'est pas un
   defaut cosmetique mais fonctionnel. */
.hidden { display: none !important; }

/* --- classes de grille detournees ---
   68 boutons portent .row et 130 elements cumulent col-* et .row : la marge
   negative de gouttiere n'est compensee par rien et deborde de 10 px de chaque
   cote, ou transforme un bouton en conteneur flex. */
.btn.row {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-inline: 0;
  width: auto;
}
[class*="col-"].row { margin-right: 0; margin-left: 0; }