/**
 * Sélecteur de plage de dates du filtre « Période ».
 *
 * Parti pris : ne rien redessiner. Le champ visible porte les classes de
 * formulaire du cœur (`form-text form-element`), donc il hérite exactement de
 * la bordure, du rayon, de la hauteur, de la fonte et du focus que le thème
 * applique aux deux autres filtres. Cette feuille ne fait que deux choses : neutraliser
 * l'encadrement que Views pose autour d'un filtre « entre deux valeurs », et
 * placer le bouton d'effacement dans le champ.
 */

/* Views enveloppe les deux bornes dans un fieldset, qui dessine sa propre
   boîte : sans cela, la période s'afficherait encadrée à côté de deux champs
   nus. La classe n'est posée que par le JavaScript : sans lui, l'encadrement
   et les deux champs date natifs reviennent, et le filtre reste utilisable. */
/* Sélecteur doublé (`.fieldset.newsroom-date-range`) : Claro habille `.fieldset`
   à la même spécificité, et sa feuille est chargée après la nôtre. Un cran de
   plus suffit — inutile de sortir `!important`. */
.fieldset.newsroom-date-range {
  position: relative;
  display: inline-flex;
  align-items: center;
  background: none;
  /* Alignement sur les autres filtres exposés : le fieldset que Views pose
     autour d'un filtre « entre deux valeurs » n'est pas mis en ligne tout
     seul. */
  margin: 12px 8px 0 0;
  padding: 0;
  border: 0;
  align-self: flex-end;
}

/* Better Exposed Filters emboîte le fieldset dans un conteneur qui devient
   l'élément de la barre de filtres à sa place : l'alignement bascule sur lui
   et le fieldset perd ses marges. Sans BEF, le fieldset reste l'enfant direct
   de la barre et ces deux règles ne s'appliquent pas. */
.views-exposed-form__item:has(> .fieldset.newsroom-date-range) {
  margin: 12px 8px 0 0;
  align-self: flex-end;
}

.views-exposed-form__item > .fieldset.newsroom-date-range {
  margin: 0;
}

/* Les deux bornes d'origine cèdent la place au calendrier. Masquées et non
   retirées : elles portent toujours les valeurs soumises. */
.newsroom-date-range .fieldset__wrapper {
  display: none;
}

.newsroom-date-range__input {
  inline-size: 16rem;
  /* Réserve la place du bouton d'effacement. */
  padding-inline-end: 2.25rem;
}

.newsroom-date-range__clear {
  position: absolute;
  inset-inline-end: 0.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  inline-size: 1.5rem;
  block-size: 1.5rem;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: none;
  color: var(--newsroom-text-light, #6b7280);
  font-size: 1rem;
  line-height: 1;
  cursor: pointer;
}

.newsroom-date-range__clear:hover {
  background: var(--newsroom-app-bg, #f3f4f6);
  color: var(--newsroom-text, #374151);
}

/* Le calendrier se pose en absolu : sans cela il s'ouvre derrière les blocs de
   contenu, qui portent leur propre contexte d'empilement. */
.flatpickr-calendar {
  z-index: 1000;
}