/* Charte des boutons OB GROUPE — pages de la plateforme hors simulateurs mono-boucle
   (ceux-ci ont css/simulateur-pid.css, même charte). Chargée APRÈS le <style> de chaque page.
   Ne concerne que les boutons d'ACTION (lancer, calculer, enregistrer, supprimer…) :
   les onglets, bascules et choix de réponse gardent leur style propre.

   Une taille unique (32 px ; 26 px pour les petits boutons de liste ; 42 px pleine largeur pour les
   formulaires publics sur téléphone) et une couleur par rôle :
     vert = action principale · gris = action secondaire · orange = avertissement / annuler
     violet = perturbation · bleu = enregistrer / modifier · bleu-vert = copier / exporter
     rouge = supprimer · indigo = générer
   Classes utilisables directement : .ob-btn + .ob-btn--vert/--gris/--orange/--violet/--bleu/
   --bleu-vert/--rouge/--indigo/--contour, et .ob-btn--petit / .ob-btn--large. */

:root{
  --btn-vert:#00915E;
  --btn-orange:#F58220;
  --btn-gris:#5B6B7A;
  --btn-violet:#7B5CC4;
  --btn-bleu:#2F6FDE;
  --btn-bleu-vert:#138A9E;
  --btn-rouge:#D6393E;
  --btn-indigo:#4B4FB8;
}

/* ---------- Base commune ---------- */
.ob-btn,
.btn,                                  /* dimensionnement, métrologie, signaux, supervision */
.btn-primary, .btn-secondary,          /* connexion, administration */
.export-btn, .qcm-next-btn, .btn-launch,
button.submit,                         /* inscription, émargement */
.center-gate button,
.formation-card .link-row button,
.subscriber-row button{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  height:32px;padding:0 16px;
  border:1px solid transparent;border-radius:6px;
  background:var(--btn-gris);color:#fff;
  font-family:var(--sans, -apple-system, "Segoe UI", Roboto, Arial, sans-serif);
  font-size:12.5px;font-weight:600;line-height:1;letter-spacing:.01em;white-space:nowrap;
  text-decoration:none;cursor:pointer;
  box-shadow:0 1px 2px rgba(0,0,0,.15);
  transition:filter .15s, box-shadow .15s, transform .05s;
}
.ob-btn:hover, .btn:hover, .btn-primary:hover, .btn-secondary:hover, .export-btn:hover,
.qcm-next-btn:hover, .btn-launch:hover, button.submit:hover, .center-gate button:hover,
.formation-card .link-row button:hover, .subscriber-row button:hover{
  filter:brightness(1.08);box-shadow:0 3px 8px rgba(0,0,0,.2);opacity:1;
}
.ob-btn:active, .btn:active, .btn-primary:active, .btn-secondary:active, .export-btn:active,
.qcm-next-btn:active, .btn-launch:active, button.submit:active, .center-gate button:active{
  transform:translateY(1px);box-shadow:0 1px 2px rgba(0,0,0,.15);
}
.ob-btn:focus-visible, .btn:focus-visible, .btn-primary:focus-visible, .btn-secondary:focus-visible,
.export-btn:focus-visible, .qcm-next-btn:focus-visible, .btn-launch:focus-visible,
button.submit:focus-visible, .center-gate button:focus-visible{
  outline:2px solid var(--btn-orange);outline-offset:2px;
}
.ob-btn:disabled, .btn:disabled, .btn-primary:disabled, .btn-secondary:disabled, .export-btn:disabled,
.btn-launch:disabled, button.submit:disabled{
  opacity:.5;filter:none;box-shadow:none;cursor:default;transform:none;
}

/* ---------- Tailles ---------- */
.ob-btn--petit,
.formation-card .link-row button,
.subscriber-row button{height:26px;padding:0 10px;font-size:11.5px;}
.ob-btn--large,
button.submit,
.center-gate button{display:flex;width:100%;height:42px;font-size:14px;}
.btn-launch{min-width:220px;}
/* bouton de validation d'un formulaire (connexion, création de formation) : un peu plus haut */
form .btn-primary{height:40px;font-size:14px;}

/* ---------- Couleurs par rôle ---------- */
/* boutons existants des pages, rangés par rôle */
.ob-btn--vert, .btn.primary, .btn-primary, .qcm-next-btn, .btn-launch, button.submit,
.center-gate button, .subscriber-row button.is-abonne{background:var(--btn-vert);color:#fff;border-color:transparent;}
.ob-btn--gris, .btn-secondary{background:var(--btn-gris);color:#fff;}
.ob-btn--orange, .btn.warn{background:var(--btn-orange);color:#fff;border-color:transparent;}
.ob-btn--violet{background:var(--btn-violet);color:#fff;}
.ob-btn--bleu, .btn.save-resultat-btn, #btn-hmt-apply{background:var(--btn-bleu);color:#fff;border-color:transparent;}
.ob-btn--bleu-vert, .export-btn, .formation-card .link-row button, #pres-export-btn{background:var(--btn-bleu-vert);color:#fff;border-color:transparent;}
.ob-btn--rouge{background:var(--btn-rouge);color:#fff;}
.ob-btn--indigo{background:var(--btn-indigo);color:#fff;}
/* contour : action discrète (refaire, abonné inactif…) */
.ob-btn--contour, .btn.ghost:not(.save-resultat-btn), .subscriber-row button.not-abonne{
  background:transparent;color:inherit;border-color:currentColor;box-shadow:none;opacity:.85;
}
.btn-launch:disabled{background:var(--btn-gris);color:#fff;}

/* classes explicites : elles l'emportent sur les règles de conteneur des pages (ex. .link-row button) */
button.ob-btn.ob-btn--vert{background:var(--btn-vert);color:#fff;border-color:transparent;}
button.ob-btn.ob-btn--gris{background:var(--btn-gris);color:#fff;border-color:transparent;}
button.ob-btn.ob-btn--orange{background:var(--btn-orange);color:#fff;border-color:transparent;}
button.ob-btn.ob-btn--violet{background:var(--btn-violet);color:#fff;border-color:transparent;}
button.ob-btn.ob-btn--bleu{background:var(--btn-bleu);color:#fff;border-color:transparent;}
button.ob-btn.ob-btn--bleu-vert{background:var(--btn-bleu-vert);color:#fff;border-color:transparent;}
button.ob-btn.ob-btn--rouge{background:var(--btn-rouge);color:#fff;border-color:transparent;}
button.ob-btn.ob-btn--indigo{background:var(--btn-indigo);color:#fff;border-color:transparent;}
button.ob-btn.ob-btn--petit{height:26px;padding:0 10px;font-size:11.5px;}

/* un bouton masqué par la page (classe .hidden ou attribut hidden) doit le rester :
   l'affichage « inline-flex » de la charte ne doit pas le faire réapparaître */
.ob-btn.hidden, .btn.hidden, .btn-primary.hidden, .btn-secondary.hidden, .export-btn.hidden,
.qcm-next-btn.hidden, .btn-launch.hidden, button.submit.hidden,
.ob-btn[hidden], .btn[hidden], .btn-primary[hidden], .btn-secondary[hidden], .export-btn[hidden],
.qcm-next-btn[hidden], .btn-launch[hidden], button.submit[hidden]{display:none;}