@import url("bxtl-barre.css");
/* =====================================================================
   Outils du support Boxtal — thème commun (bxtl.unfroidecanard.com)
   Même charte que la page d'accueil du site et que l'Assistant support :
   bleu marine Boxtal, accent orange, cartes blanches sur fond gris clair.
   Chargé après le style propre à chaque page : les sélecteurs commencent par
   « :root » pour passer devant lui sans avoir à modifier chaque page.
   ===================================================================== */
/* ---------------------------------------------------------------- page */
:root body{font-family:var(--bx-ui);background:var(--bx-fond);color:var(--bx-encre);line-height:1.55;
  margin:0;padding:0 24px 48px;-webkit-font-smoothing:antialiased}
:root body > h1:first-of-type,:root .page-head h1{margin-top:28px}
:root h1{font-size:28px;line-height:1.2;font-weight:700;color:var(--bx-encre);letter-spacing:-.01em}
:root h2{font-size:21px;line-height:1.3;font-weight:650;color:var(--bx-encre)}
:root h3{font-size:17px;line-height:1.35;font-weight:650;color:var(--bx-bleu)}
:root h4{font-size:15px;color:var(--bx-bleu)}
:root a{color:var(--bx-bleu);text-decoration-color:rgba(31,59,115,.35);text-underline-offset:2px}
:root a:hover{color:var(--bx-bleu-fonce);text-decoration-color:currentColor}
:root :focus-visible{outline:2px solid var(--bx-orange);outline-offset:2px}
:root hr{border:0;border-top:1px solid var(--bx-trait);margin:24px 0}
:root ::selection{background:var(--bx-bleu-clair)}

/* ---------------------------------------------------------------- blocs et cartes */
:root .page{max-width:1150px;margin:0 auto;padding:8px 0 40px}
:root .card,:root .box,:root .block,:root .section,:root .result-card{background:var(--bx-surface);border:1px solid var(--bx-trait);
  border-radius:var(--bx-r-grand);box-shadow:var(--bx-ombre)}
:root .card{padding:20px 22px}
:root .card h2,:root .card h3{margin-top:0}
:root .muted,:root .hint,:root small{color:var(--bx-doux)}

/* ---------------------------------------------------------------- formulaires */
:root input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=submit]):not([type=button]):not([type=range]):not([type=color]),
:root select,:root textarea{font:inherit;font-size:15px;color:var(--bx-encre);background:#fff;border:1px solid var(--bx-trait-fort);
  border-radius:var(--bx-r);padding:8px 11px;box-shadow:none;transition:border-color .15s,box-shadow .15s}
:root input:not([type=checkbox]):not([type=radio]):focus,:root select:focus,:root textarea:focus{outline:none;border-color:var(--bx-bleu);
  box-shadow:0 0 0 3px rgba(31,59,115,.14)}
:root input::placeholder,:root textarea::placeholder{color:var(--bx-pale)}
:root input[type=checkbox],:root input[type=radio]{accent-color:var(--bx-bleu)}
:root label{color:var(--bx-encre)}
:root .form-row label{font-weight:600;font-size:14px;color:var(--bx-doux)}
:root fieldset{border:1px solid var(--bx-trait);border-radius:var(--bx-r-grand);background:var(--bx-surface)}
:root legend{color:var(--bx-bleu);font-weight:650;padding:0 6px}

/* ---------------------------------------------------------------- boutons */
:root button,:root .button,:root .btn,:root .btn-link,:root .btn-green,:root .btn-blue,:root input[type=submit],:root input[type=button]{font-family:var(--bx-ui);font-weight:600;
  background:var(--bx-bleu);color:#fff;border:1px solid var(--bx-bleu);border-radius:var(--bx-r);cursor:pointer;
  transition:background .15s,border-color .15s,box-shadow .15s,transform .1s;text-decoration:none}
:root button:hover,:root .button:hover,:root .btn:hover,:root .btn-link:hover,:root .btn-green:hover,:root .btn-blue:hover,:root input[type=submit]:hover,:root input[type=button]:hover{
  background:var(--bx-bleu-fonce);border-color:var(--bx-bleu-fonce);color:#fff}
:root button:active,:root .btn:active,:root .button:active{transform:translateY(1px)}
:root button:disabled,:root .button:disabled,:root .btn:disabled,:root input[type=submit]:disabled{background:var(--bx-trait-fort);
  border-color:var(--bx-trait-fort);color:#fff;cursor:not-allowed;transform:none}
/* boutons secondaires */
:root .btn-grey,:root .btn-secondary,:root .btn-gray,:root .btn-mini,:root button.secondary{background:var(--bx-surface);color:var(--bx-bleu);border:1px solid var(--bx-trait-fort)}
:root .btn-grey:hover,:root .btn-secondary:hover,:root .btn-gray:hover,:root button.secondary:hover{background:var(--bx-bleu-tres-clair);
  color:var(--bx-bleu);border-color:var(--bx-bleu)}
/* « Accueil » : bouton discret, comme un lien de navigation */
:root button[onclick*="index.php"],:root a[href$="index.php"] > button,:root a.btn[href$="index.php"],:root a.btn-link[href$="index.php"],:root a.btn-green[href$="index.php"],
:root a.button[href$="index.php"]{background:var(--bx-surface);color:var(--bx-bleu);border:1px solid var(--bx-trait-fort)}
:root button[onclick*="index.php"]:hover,:root a[href$="index.php"] > button:hover,:root a.btn[href$="index.php"]:hover,:root a.btn-link[href$="index.php"]:hover,
:root a.btn-green[href$="index.php"]:hover,:root a.button[href$="index.php"]:hover{background:var(--bx-bleu-tres-clair);border-color:var(--bx-bleu);color:var(--bx-bleu)}

/* ---------------------------------------------------------------- tableaux */
:root table{border-collapse:collapse;border-color:var(--bx-trait)}
:root th{background:var(--bx-bleu-tres-clair);color:var(--bx-bleu);font-weight:650;border-color:var(--bx-trait)}
:root td{border-color:var(--bx-trait)}
:root tbody tr:hover > td{background:var(--bx-surface-2)}
:root .table-wrap{border:1px solid var(--bx-trait);border-radius:var(--bx-r-grand);background:var(--bx-surface);overflow-x:auto}

/* ---------------------------------------------------------------- code */
:root code,:root pre,:root kbd,:root samp{font-family:var(--bx-mono);font-size:13px}
:root pre{background:var(--bx-surface-2);border:1px solid var(--bx-trait);border-radius:var(--bx-r);padding:12px 14px}
:root :not(pre) > code{background:var(--bx-bleu-tres-clair);border-radius:4px;padding:1px 5px}

/* ---------------------------------------------------------------- messages */
:root .ok,:root .success,:root .status-ok{background:var(--bx-ok-clair);border-color:var(--bx-ok);color:#1d5e4a}
:root .ko,:root .error,:root .erreur{background:var(--bx-erreur-clair);border-color:var(--bx-erreur);color:var(--bx-erreur)}
:root .warn,:root .warning{background:var(--bx-alerte-clair);border-color:var(--bx-alerte);color:#7a3e0c}
:root .info{background:var(--bx-bleu-tres-clair);border-color:var(--bx-bleu)}
:root .callout{border-left:4px solid var(--bx-orange);background:var(--bx-orange-clair);border-radius:0 var(--bx-r) var(--bx-r) 0}
:root .badge,:root .tag,:root .pill,:root .chip{border-radius:999px;background:var(--bx-bleu-clair);color:var(--bx-bleu)}

/* ---------------------------------------------------------------- onglets */
:root .tabs a{background:var(--bx-surface);border:1px solid var(--bx-trait);color:var(--bx-doux)}
:root .tabs a:hover{border-color:var(--bx-bleu);color:var(--bx-bleu)}
:root .tabs a.active{background:var(--bx-bleu);border-color:var(--bx-bleu);color:#fff}

/* ---------------------------------------------------------------- détails */
:root details > summary{cursor:pointer;color:var(--bx-bleu);font-weight:600}

@media (max-width:640px){
  :root body{padding:0 14px 36px}
  :root .bx-barre{margin:0 -14px 8px;padding:10px 14px}
  :root .bx-marque small{display:none}
  :root h1{font-size:23px}
}
@media print{:root .bx-barre{display:none}:root body{background:#fff}}
