/*
 * boutons-acp.css - Le bouton du design ACP, pour TOUTES les pages.
 *
 * A QUOI SERT CETTE FEUILLE
 * Une page qui veut un bouton au gabarit ACP n a plus rien a declarer : elle
 * ajoute ce lien, elle ecrit class="btn-acp" ou class="btn-acp-ghost", et c est
 * tout. C est le seul endroit ou ces valeurs vivent.
 *
 *   <link href="../commun/assets/css/boutons-acp.css" rel="stylesheet">
 *
 * POURQUOI ELLE EXISTE
 * liste-acp.css definit bien .btn-acp, mais SOUS .acp-modal (l.69) : le gabarit
 * ne servait donc que dans les modales. Toute page voulant un bouton hors modale
 * devait recopier le bloc entier chez elle -- ce que faisaient les dix pages de
 * be/ et cs/menu/index.php, onze copies d une vingtaine de lignes. Elles ont
 * fini par diverger : certaines a 7px 14px / 13.6px, d autres a 6px 12px /
 * 12.8px, pour un ecart de 3 px de hauteur visible a l ecran d un volet a
 * l autre. Cette feuille supprime la cause.
 *
 * LES VALEURS
 * Ce sont celles de liste-acp.css l.69, donc celles que cs/admin applique deja,
 * et ce sont aussi, au pixel, celles du bouton de barre DataTables
 * (datatables-acp.css l.36) : padding 6px 12px, corps 12.8px, graisse 500,
 * rayon 8px, gap 7px. Les deux se cotoient sur plusieurs ecrans -- le volet
 * Avancement du dossier notamment -- et doivent s y confondre.
 *
 * LE LINE-HEIGHT EST DECLARE, et ce n est pas cosmetique. Ni liste-acp.css ni
 * legacy-skin.css n en posent sur les boutons : sans declaration, la hauteur
 * dependrait du line-height du body de chaque page. Avec 1.5 : 1,5 x 12,8 =
 * 19,2 px de ligne, plus 12 px de marge verticale, plus 2 px de bordure,
 * soit 33,2 px de bouton -- exactement la hauteur du bouton de barre DataTables.
 * Ces 2 px de bordure sont expliques au paragraphe suivant.
 * Effet de bord utile : ces 19,2 px d interligne absorbent le debord de la
 * glyphe des Bootstrap Icons (.bi::before porte vertical-align:-.125em). Aucune
 * regle de neutralisation n est necessaire.
 *
 * LA BORDURE EST DECLAREE SUR LES DEUX VARIANTES, ET POUR LA MEME RAISON QUE LE
 * LINE-HEIGHT. Aucune hauteur n est declaree sur ces boutons : leur hauteur est donc
 * la somme de la ligne de texte, de la marge verticale et de la BORDURE. .btn-acp
 * portait border:0 et .btn-acp-ghost border:1px, si bien que les deux variantes
 * CANONIQUES ne faisaient pas la meme hauteur -- 31,2 px contre 33,2 -- et qu un
 * bouton principal pose a cote d un bouton secondaire tombait deux pixels plus bas.
 * C etait visible dans la modale de suppression de be/dossier.php, dont les deux
 * boutons se touchent. box-sizing n y change rien : il n agit que sur une hauteur
 * declaree, et il n y en a pas.
 * .btn-acp porte donc une bordure TRANSPARENTE. Elle ne se voit pas, et elle rend les
 * deux variantes strictement interchangeables en hauteur.
 * DEUX AUTRES FEUILLES ONT SUIVI, pour que l invariant annonce plus haut -- << au
 * pixel, celles du bouton de barre DataTables >> -- reste vrai : datatables-acp.css
 * (le bouton de barre) et liste-acp.css (le .btn-acp des modales), deux declarations
 * qui reprennent ce gabarit et portaient border:0.
 * NE PAS remettre border:0 sur .btn-acp sans retirer en meme temps la bordure de
 * .btn-acp-ghost : c est le couple qui doit rester coherent, pas chaque ligne.
 * RESTE VOLONTAIREMENT DEHORS : .acp-btn-search de liste-acp.css. Ce n est pas ce
 * gabarit -- 9px 16px et rayon 9 -- et les pages qui le veulent au gabarit ACP le
 * surchargent chez elles.
 *
 * LA REGLE << button. >> N EST PAS UN DOUBLON. legacy-skin.css est injecte APRES
 * la page dans les iframes des volets et repeint TOUT element <button> en
 * !important (l.133-154). Une declaration ordinaire perd contre cela quelle que
 * soit sa specificite : la specificite ne se compare qu a importance egale. Les
 * memes valeurs sont donc reposees en !important sur button.btn-acp, dont la
 * specificite (0,1,1) bat celle de << button >> (0,0,1) A IMPORTANCE EGALE.
 * L ordre des feuilles n entre pas en jeu, ce qui rend cette feuille utilisable
 * telle quelle depuis n importe quelle page, injectee ou non.
 *
 * CE QUI N EST PAS ICI
 * Rien de propre a un ecran. Les variantes locales -- teinte ambre d une
 * signature, bouton de filtre d une barre d outils, hauteur fixe d une tuile --
 * restent dans la page qui les emploie et se posent PAR-DESSUS ce gabarit.
 *
 * UNE SEULE EXCEPTION dans le projet, et elle est voulue : le bouton
 * << Se connecter >> de cs/menu/index.php porte la classe btn-login, pas
 * btn-acp. Il garde donc son propre habillage et n est pas concerne.
 */

/* ---------- le gabarit commun aux deux familles ---------- */
.btn-acp,
.btn-acp-ghost{
  display:inline-flex;align-items:center;justify-content:center;gap:7px;
  padding:6px 12px;
  font-family:inherit;font-size:12.8px;font-weight:500;line-height:1.5;
  border-radius:8px;
  cursor:pointer;text-decoration:none;white-space:nowrap;vertical-align:middle;
  box-shadow:none;
  transition:all .15s;
}

/* ---------- l action principale ---------- */
.btn-acp{background:#dc2626;color:#fff;border:1px solid transparent;}
.btn-acp:hover,
.btn-acp:focus{background:#b91c1c;color:#fff;text-decoration:none;}

/* ---------- l action secondaire ---------- */
.btn-acp-ghost{background:#f3f4f6;color:#374151;border:1px solid #e5e7eb;}
.btn-acp-ghost:hover,
.btn-acp-ghost:focus{background:#e5e7eb;color:#374151;text-decoration:none;}

/* ---------- etats ---------- */
.btn-acp:disabled,
.btn-acp-ghost:disabled{opacity:.45;cursor:not-allowed;}
.btn-acp:focus-visible,
.btn-acp-ghost:focus-visible{outline:2px solid #dc2626;outline-offset:2px;}

/* ---------- icones ----------
   Les svg en ligne sont ramenes a la taille de la glyphe d une police d icones.
   Les icones de police (.bi) ne sont PAS retouchees : leur corps est deja fixe
   par le font-size du bouton. */
.btn-acp svg,.btn-acp-ghost svg,
.btn-acp .acp-i,.btn-acp-ghost .acp-i{width:14px;height:14px;flex:none}

/* ---------- contre legacy-skin.css, voir l en-tete ---------- */
button.btn-acp,
button.btn-acp-ghost{
  border-radius:8px!important;   /* bat legacy-skin.css l.143 (6px)      */
  padding:6px 12px!important;    /* bat legacy-skin.css l.144 (8px 16px) */
  font-size:12.8px!important;    /* bat legacy-skin.css l.145 (13px)     */
  font-weight:500!important;     /* bat legacy-skin.css l.146            */
  gap:7px!important;             /* bat legacy-skin.css l.153 (5px)      */
  line-height:1.5!important;     /* la hauteur, cf. l en-tete            */
}
button.btn-acp{background:#dc2626!important;color:#fff!important;border:1px solid transparent!important}
button.btn-acp:hover{background:#b91c1c!important}
button.btn-acp-ghost{background:#f3f4f6!important;color:#374151!important;border:1px solid #e5e7eb!important}
button.btn-acp-ghost:hover{background:#e5e7eb!important;color:#374151!important}
