/*
 * bandeau-compact.css — [E3518] LE BANDEAU DE COOKIES NE RECOUVRE PLUS LE TITRE D'ACCUEIL.
 *
 * LE DÉFAUT (mesuré au navigateur réel, E3508 puis E3518) : à la première visite, le bandeau du thème (`Styles/CookieConsent.css`, hors dépôt) occupe 48 % de la hauteur de l'écran (369 px sur un
 * 1366×768, 405 px sur un mobile de 844) et recouvre le bas du titre ET le sous-titre du héros d'accueil (le titre commence à ~340 px, le sous-titre finit à ~545 px) ; en mobile, la moitié du titre.
 * Toutes les versions (belge, France, anglais, néerlandais, brésilien). Les quatre cartes de réglages (système, chat, historique, Google) faisaient l'essentiel de la hauteur.
 *
 * LE REMÈDE RETENU : un bandeau COMPACT — titre, phrase d'explication et les trois boutons (« Tout refuser », « Personnaliser mes choix », « Tout accepter »), sur ~100 px en bureau ; les quatre cartes de
 * réglages ne sont plus ouvertes d'office : elles s'affichent au clic sur « Personnaliser mes choix » (petit script `bandeau-compact.js`, même dossier), ou d'emblée quand on rouvre les préférences après
 * un choix. Le consentement reste aussi facile à REFUSER qu'à ACCEPTER : les trois boutons sont là, visibles, dans l'écran, dès l'ouverture ; rien n'est retiré, seule la mise en page change.
 * Ce fichier n'AJOUTE que des règles qui viennent APRÈS celles du thème (même préfixe, spécificité plus haute) : il ne modifie ni ne copie le fichier du thème ; retiré, le bandeau redevient celui du thème.
 * Bandeau fermé (choix fait) : le bandeau est ôté de la page par le thème, ces règles n'ont plus rien à styler — la page est celle d'avant, sans décalage.
 * Généré/copié à la fabrication (étape `7a-bandeau-compact-e3518`) — ne pas éditer le fichier servi.
 */

/* ── Bandeau REPLIÉ (ouverture normale) : les cartes de réglages sont cachées ─────────────────────────────────────────────────────────────── */
.MoveAndStudyCore [data-mas-cookie-consent]:not(.mas-cookie-consent--detail) .mas-cookie-consent__cards { display: none; }

/* Bureau : une ligne d'en-tête (pastille, titre, boutons à droite), puis la phrase d'explication sur toute la largeur. */
.MoveAndStudyCore [data-mas-cookie-consent]:not(.mas-cookie-consent--detail) .mas-cookie-consent__dialog {
  max-height: none;
}
.MoveAndStudyCore [data-mas-cookie-consent]:not(.mas-cookie-consent--detail) .mas-cookie-consent__choices {
  grid-template-areas: "badge title actions" "lead lead lead";
  grid-template-columns: max-content minmax(0, 1fr) auto;
  grid-template-rows: auto auto;
  align-items: center;
  gap: .3rem 1rem;
  padding: .65rem 1.3rem .7rem;
  max-height: none;
  overflow: visible;
}
.MoveAndStudyCore [data-mas-cookie-consent]:not(.mas-cookie-consent--detail) .mas-cookie-consent__badge { padding: .35rem .6rem; }
.MoveAndStudyCore [data-mas-cookie-consent]:not(.mas-cookie-consent--detail) .mas-cookie-consent__lead { font-size: .8rem; line-height: 1.38; }
.MoveAndStudyCore [data-mas-cookie-consent]:not(.mas-cookie-consent--detail) .mas-cookie-consent__actions { align-self: center; }

/* Écran étroit (< 861 px) : titre sur sa ligne, phrase, puis les trois boutons EN LARGEUR, dans l'écran. Chaque pixel compte (le titre du héros finit vers 490-530 px sur un mobile, un téléphone
   n'offre souvent que 640-700 px de haut une fois ses barres affichées) : marges serrées, phrase en petits caractères, boutons de 2,2 rem — de 37 px de haut, larges d.au moins 100 px. */
@media (max-width: 860px) {
  .MoveAndStudyCore [data-mas-cookie-consent]:not(.mas-cookie-consent--detail) .mas-cookie-consent__dialog { max-height: min(62vh, 460px); }
  .MoveAndStudyCore [data-mas-cookie-consent]:not(.mas-cookie-consent--detail) .mas-cookie-consent__choices {
    grid-template-areas: "badge title" "lead lead" "actions actions";
    grid-template-columns: max-content minmax(0, 1fr);
    grid-template-rows: auto auto auto;
    gap: .15rem .55rem;
    padding: .5rem .8rem calc(.5rem + env(safe-area-inset-bottom, 0px));
    max-height: min(62vh, 460px);
    overflow-y: auto;
    overflow-x: hidden;
  }
  .MoveAndStudyCore [data-mas-cookie-consent]:not(.mas-cookie-consent--detail) .mas-cookie-consent__badge { padding: .25rem .5rem; font-size: .74rem; }
  .MoveAndStudyCore [data-mas-cookie-consent]:not(.mas-cookie-consent--detail) .mas-cookie-consent__title { font-size: 1.02rem; line-height: 1.2; }
  .MoveAndStudyCore [data-mas-cookie-consent]:not(.mas-cookie-consent--detail) .mas-cookie-consent__lead { font-size: .75rem; line-height: 1.3; }
  .MoveAndStudyCore [data-mas-cookie-consent]:not(.mas-cookie-consent--detail) .mas-cookie-consent__actions {
    grid-template-columns: max-content minmax(0, 1fr) max-content;
    gap: .35rem;
    margin: .3rem -.8rem calc(-.5rem - env(safe-area-inset-bottom, 0px));
    padding: .4rem .8rem calc(.45rem + env(safe-area-inset-bottom, 0px));
  }
  .MoveAndStudyCore [data-mas-cookie-consent]:not(.mas-cookie-consent--detail) .mas-cookie-consent__button {
    min-height: 2.3rem;
    padding-inline: .5rem;
    font-size: .74rem;
    line-height: 1.12;
    white-space: normal;
  }
}