/* Ajustements du thème (lot 1, 22/10/2026), chargés après styles.css. */

/* Écrans tactiles uniquement : la zone de toucher des petits liens est agrandie par un
   pseudo-élément transparent qui déborde du lien. Rien ne change à l'affichage. */
@media (pointer: coarse) {
  .social-links a,
  .site-header__links a,
  .site-header .hamburger,
  .breadcrumbs a,
  .news__morelink,
  .site-footer__contact a {
    position: relative;
  }
  .social-links a::after,
  .site-header__links a::after,
  .site-header .hamburger::after,
  .breadcrumbs a::after,
  .news__morelink::after,
  .site-footer__contact a::after {
    content: "";
    position: absolute;
  }
  /* icônes 30×30 espacées de 40 px : 40×44, sans empiéter sur l'icône voisine */
  .social-links a::after { top: -7px; bottom: -7px; left: -5px; right: -5px; }
  /* barre du haut de 36 px : « Espace pro » en occupe toute la hauteur */
  .site-header__links a::after { top: -9px; bottom: -9px; left: -6px; right: -6px; }
  .site-header .hamburger::after { top: -12px; bottom: -12px; left: -8px; right: -8px; }
  .breadcrumbs a::after { top: -13px; bottom: -13px; left: -4px; right: -4px; }
  .news__morelink::after { top: -11px; bottom: -11px; left: -6px; right: -6px; }
  .site-footer__contact a::after { top: -12px; bottom: -12px; left: 0; right: 0; }
}

/* Champ de recherche SiteSearch360 : le script, chargé en fin de page puis libéré par Cookiebot, restylait le champ
   sous les yeux du visiteur (champ élargi, police réduite, bouton qui apparaît puis vire au rouge). Ces règles lui
   donnent dès le premier affichage l'aspect final que produit le script (ss360Config du gabarit Base et règles
   .ss360-custom-search de styles.css) : à reprendre si cette configuration change. */
.site-header__button [role="search"] {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  position: relative;
  width: 100%;
  max-width: 100%;
  padding: 0 30px 0 0;
}
#searchBox {
  box-sizing: border-box;
  width: 100%;
  max-width: 420px;
  height: 44px;
  margin: 0;
  padding: 8px;
  border: 1px solid #e3e3e3;
  border-radius: 0;
  box-shadow: none;
  background: #fff;
  color: #0a0a0a;
  font-size: 14px;
  line-height: 1.5;
}
#searchButton {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  height: 44px;
  margin: 0;
  padding: 8px;
  border: 1px solid #e3e3e3;
  border-radius: 0;
  background-color: #e21b23;
  cursor: pointer;
}
/* loupe blanche tant que le script n'a pas inséré la sienne (même dessin, même place) */
#searchButton:empty {
  background: #e21b23 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23ffffff' viewBox='0 0 24 24'%3E%3Cpath d='M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z'/%3E%3C/svg%3E") center / 26px 26px no-repeat;
}
/* le script insère d'abord une loupe noire, puis la blanche : toujours blanche */
#searchButton img { filter: brightness(0) invert(1); }
@media screen and (max-width: 63.9375em) {
  .site-header__button [role="search"] { padding: 15px 10px 0; }
  #searchBox { max-width: 100%; }
}

/* Pagination des actualités (12 par page) */
.news__pagination {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  margin: 1rem 0 2rem;
}
.news__pagination .button {
  margin: 0;
  min-height: 2.75rem; /* 44 px */
  display: inline-flex;
  align-items: center;
}
