/* ===== Bandeau « Filtres » repliable, commun admin et public (SEPQ-15) ===== */
.filtres {
  background: var(--fond-carte-2, #fcfcfd);
  border: 1px solid var(--bordure, #e5e9f0);
  border-radius: 12px;
  margin: 0 auto 20px;
  max-width: 700px;
}
.filtres-entete {
  align-items: center;
  background: none;
  border: none;
  color: var(--texte, #0b2a55);
  cursor: pointer;
  display: flex;
  gap: 12px;
  padding: 12px 16px;
  text-align: left;
  width: 100%;
}
/* Neutralise les anciens styles publics appliqués à tous les boutons
   (fond crème, fond rouge au survol — collant sur mobile —, marge et coins de minBoot.css) */
.filtres-entete,
.filtres-entete:hover,
.filtres-entete:focus,
.filtres-entete:active {
  background: none;
  border-radius: 12px;
  box-shadow: none;
  color: var(--texte, #0b2a55);
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  margin: 0;
  transition: none;
}
.filtres-entete:focus-visible {
  border-radius: 12px;
  outline: 2px solid #1e5fa8;
  outline-offset: -2px;
}
.filtres-icone {
  color: var(--accent, #1e5fa8);
  flex-shrink: 0;
}
.filtres-titres {
  display: flex;
  flex: 1;
  flex-direction: column;
  min-width: 0;
}
.filtres-titre {
  font-size: 16px;
  font-weight: 700;
}
.filtres-resume {
  color: var(--texte-doux, #64748b);
  font-size: 13px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
/* Un filtre est appliqué : le résumé affiche les valeurs choisies */
.filtres--actifs .filtres-resume {
  color: var(--accent, #1e5fa8);
  font-weight: 600;
}
.filtres-chevron {
  color: var(--texte-doux, #64748b);
  flex-shrink: 0;
  transition: transform 0.2s ease;
}
.filtres--ouvert .filtres-chevron {
  transform: rotate(180deg);
}
.filtres-corps {
  border-top: 1px solid #edf0f5;
  margin: 0 16px;
  padding: 14px 0 6px;
}
.filtres-corps[hidden] {
  display: none;
}
.filtres-champs {
  display: grid;
  gap: 0 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
/* Nombre impair de champs : le premier prend toute la largeur (ex. Catégorie, puis Tri | Saison) */
.filtres-champs > :first-child:nth-last-child(odd) {
  grid-column: 1 / -1;
}
.filtres-form label,
.filtres-form .form-label {
  color: var(--texte-doux, #64748b);
  display: block;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0.02em;
  margin-bottom: 4px;
  text-transform: uppercase;
}
/* Styles complets (et pas seulement des retouches) : côté public, Bootstrap 5 n'est pas chargé */
.filtres-form select,
.filtres-form input[type="text"],
.filtres-form input[type="search"] {
  background-color: var(--fond-carte-2, #f6f8fc);
  border: 1px solid var(--bordure, #e2e8f0);
  border-radius: 8px;
  box-shadow: none;
  box-sizing: border-box;
  color: var(--texte, #0b2a55);
  display: block;
  font-size: 15px;
  height: auto;
  line-height: 1.4;
  margin: 0;
  padding: 7px 12px;
  width: 100%;
}
.filtres-form select {
  -webkit-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%2364748b' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
  background-position: right 12px center;
  background-repeat: no-repeat;
  background-size: 14px 10px;
  padding-right: 34px;
}
.filtres-form select:focus,
.filtres-form input:focus {
  border-color: #1e5fa8;
  box-shadow: 0 0 0 3px rgba(30, 95, 168, 0.15);
}
.filtres-form .mb-3,
.filtres-champs > div {
  margin-bottom: 10px !important;
}
/* Zones mises à jour par les filtres : estompées pendant le chargement */
.filtres-zone-chargement {
  opacity: 0.5;
  transition: opacity 0.15s ease;
}
/* Pages publiques : espace au-dessus du bandeau */
.filtres-conteneur {
  margin-top: 16px;
}
/* Bouton « Rechercher » masqué par filtres.js : forcé, car le CSS public donne un display aux .btn */
.filtres [data-filtres-valider][hidden] {
  display: none !important;
}
/* Typo du bandeau indépendante de la police de base de la page (admin et public diffèrent) */
.filtres {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 15px;
  line-height: 1.4;
}
/* Champs alignés à gauche partout (l'ancien style « material-select » de l'accueil centre le texte) */
.filtres-form select {
  text-align: left;
  text-align-last: left;
}
/* Zone d'en-tête mise à jour par les filtres : sans boîte propre, pour que le <header> garde sa hauteur
   en % (min-height: 100% sur desktop, calculée par rapport au <body>) — sinon la photo disparaît */
#zoneEntete {
  display: contents;
}
/* Bouton « Partager / Copier le lien » des pages publiques (SEPQ-16) : bouton rond dans l'en-tête, avant le chevron
   (pas de ligne supplémentaire), infobulle au survol ; neutralise les anciens styles de boutons publics */
.filtres-haut {
  position: relative;
}
/* Place réservée au bouton à droite du résumé */
.filtres-haut--partage .filtres-titres {
  padding-right: 40px;
}
.filtres-partage,
.filtres-partage:hover,
.filtres-partage:focus,
.filtres-partage:active {
  align-items: center;
  background: var(--fond-accent, #e8eef7);
  border: none;
  border-radius: 50%;
  box-shadow: none;
  color: var(--accent, #1e5fa8);
  cursor: pointer;
  display: inline-flex;
  height: 32px;
  justify-content: center;
  margin: 0;
  padding: 0;
  position: absolute;
  right: 42px;
  top: 50%;
  transform: translateY(-50%);
  transition: none;
  width: 32px;
}
.filtres-partage:hover {
  background: var(--fond-accent-2, #dbe6f5);
}
.filtres-partage:focus-visible {
  outline: 2px solid #1e5fa8;
  outline-offset: 2px;
}
/* Libellé lu par les lecteurs d'écran, affiché en infobulle (souris) */
.filtres-partage-libelle {
  clip: rect(0 0 0 0);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}
.filtres-partage::after {
  background: #1f2937;
  border-radius: 6px;
  color: #fff;
  content: "Copier le lien";
  font-size: 12px;
  font-weight: 500;
  opacity: 0;
  padding: 4px 9px;
  pointer-events: none;
  position: absolute;
  right: -4px;
  top: calc(100% + 8px);
  transition: opacity .15s;
  white-space: nowrap;
  z-index: 5;
}
@media (hover: hover) {
  .filtres-partage:hover::after {
    opacity: 1;
  }
}
/* Confirmation « Lien copié » */
.filtres-partage--ok,
.filtres-partage--ok:hover {
  background: #dcfce7;
  color: #15803d;
}
.filtres-partage.filtres-partage--ok::after {
  content: "Lien copié";
  opacity: 1;
}

/* ===== Thème sombre (SEPQ-36) : partage et filtres choisis en blanc ===== */
[data-theme="dark"] .filtres-partage,
[data-theme="dark"] .filtres-partage:hover,
[data-theme="dark"] .filtres-partage:focus,
[data-theme="dark"] .filtres-partage:active,
[data-theme="dark"] .filtres--actifs .filtres-resume {
  color: #fff;
}