/* ============================================================
   MonGerant · banniere de consentement
   ============================================================

   Chargee sur toutes les pages, mais elle ne dessine rien tant que
   js/mesure.js n'a pas cree la boite : si aucun traceur publicitaire n'est
   configure, ce fichier ne sert a rien et ne coute que sa taille.

   La politique de securite du site interdit tout style en ligne. Rien ne
   peut donc etre pose depuis le JavaScript : tout est ici.
   ============================================================ */

.mg-consent {
  position: fixed;
  z-index: 200;
  left: 16px;
  right: 16px;
  bottom: 16px;
  max-width: 560px;
  margin: 0 auto;
  padding: 20px 22px;
  border-radius: 18px;
  background: rgba(20, 20, 22, .96);
  color: #fff;
  backdrop-filter: saturate(180%) blur(20px);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  box-shadow: 0 18px 50px rgba(0, 0, 0, .45);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  font-size: 14px;
  line-height: 1.55;
  animation: mg-consent-entree .45s cubic-bezier(0.22, 0.61, 0.36, 1) both;
}

/* Le lecteur audio est fixe en bas de la page de presentation. Sur un
   telephone, les deux se recouvriraient : la banniere passe au-dessus et
   laisse la place au lecteur en dessous. */
@media (max-width: 700px) {
  .mg-consent { bottom: 96px; }
}

@keyframes mg-consent-entree {
  from { opacity: 0; transform: translateY(18px); }
  to   { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .mg-consent { animation: none; }
}

.mg-consent-texte p { margin: 0 0 8px; }
.mg-consent-titre {
  font-weight: 700;
  font-size: 15px;
  color: #fff;
}
.mg-consent-texte p:not(.mg-consent-titre) { color: rgba(255, 255, 255, .78); }

.mg-consent-lien {
  display: inline-block;
  color: rgba(255, 255, 255, .78);
  font-size: 13px;
  text-decoration: none;
  border-bottom: 1px solid rgba(255, 255, 255, .35);
  padding-bottom: 1px;
}
.mg-consent-lien:hover { color: #fff; border-color: #fff; }

.mg-consent-boutons {
  display: flex;
  gap: 10px;
  margin-top: 16px;
}

/* Quarante-quatre pixels de haut : la taille en dessous de laquelle un
   pouce rate le bouton une fois sur trois. */
.mg-consent-boutons button {
  flex: 1;
  min-height: 44px;
  padding: 11px 18px;
  border-radius: 999px;
  border: 1px solid transparent;
  font-family: inherit;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: background .25s ease, color .25s ease, border-color .25s ease;
}

.mg-consent-accepter { background: #fff; color: #000; }
.mg-consent-accepter:hover { background: rgba(255, 255, 255, .85); }

/* Refuser doit etre aussi facile a trouver qu'accepter. Un refus cache
   derriere un lien gris est un consentement extorque, et un consentement
   extorque ne vaut rien le jour ou il est conteste. */
.mg-consent-refuser {
  background: transparent;
  color: #fff;
  border-color: rgba(255, 255, 255, .45);
}
.mg-consent-refuser:hover { border-color: #fff; background: rgba(255, 255, 255, .08); }

/* ─────────── Le reglage, dans la politique cookies ─────────── */
#mg-reglage {
  margin: 18px 0 0;
  padding: 18px 20px;
  border: 1px solid #e3e3e6;
  border-radius: 14px;
  background: #fafafa;
}
#mg-reglage p { margin: 0 0 12px; }
#mg-reglage button {
  min-height: 44px;
  padding: 11px 22px;
  border-radius: 999px;
  border: 1px solid #1d1d1f;
  background: #1d1d1f;
  color: #fff;
  font-family: inherit;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
}
#mg-reglage button:hover { background: #000; }

@media print {
  .mg-consent { display: none; }
}
