/*                                    */
/* rendre flatpickr plus "responsive" */
/*     (pas de taille fixée en px)    */
/*                                    */


/* Nota Bene:
 * ----------
 * pour que cela fasse effet, il faut réécrire la taille de .flatpickr-calendar 
 * (si on ne le fait pas, c'est la taille par défaut qui est appliquéé de la manière habituelle
 * 
 * Si la taille est changée, faut aussi réécrire certaines propirétés de .flatpickr-day
 * .flatpickr-day {
 *  line-height: 27px;
 *  height: 29px;
 *  font-size: 90%;
 * }
 
 */


.flatpickr-innerContainer {
  width: 100%;
}
.flatpickr-weekwrapper {
  width: 13.5%;
}
span.flatpickr-weekday {
  font-size: 70%;
}
.flatpickr-rContainer {
  width: 85%;
}
.flatpickr-weekdays {
  width: 100%;
}
.flatpickr-weekdaycontainer {
  max-width: 100%;
  min-width: 100%;
  width: 100%;
}
.flatpickr-days {
  min-width: 100%;
  max-width: 100%;
}
.dayContainer {
  width: 100%;
  min-width: 100%;
  max-width: 100%;
}

/*                                                    */
/* Ajustement de la taille en mode "time picker" seul */
/*      Vraiment, sion fait pas ça, c'est moche :-/   */
/*                                                    */

.flatpickr-calendar.hasTime.noCalendar 
{
    width: 8rem;
}

/*                               */
/* Ajustement des graisses suite */
/*   à l'intégration de poppins  */
/*                               */

span.flatpickr-weekday {
 font-weight: 500;
}

.flatpickr-current-month {
  margin-left: 1rem;
  font-size: 1rem;
  left: 1.1rem;
  padding-top: .5rem;
}

.flatpickr-current-month .flatpickr-monthDropdown-months {
  padding: 0;
  -webkit-appearance: none;
  margin: 0;
  font-weight: 500;
  text-align: center;
}
   

.flatpickr-current-month .numInputWrapper {
  width: 5ch;
  font-size: 1rem;
}


/**************************/
/* style par david        */
/**************************/
.flatpickr-months .flatpickr-prev-month:hover svg, .flatpickr-months .flatpickr-next-month:hover svg {
    fill: var(--primary);
}

.flatpickr-day.selected, 
.flatpickr-day.startRange, 
.flatpickr-day.endRange, 
.flatpickr-day.selected.inRange, 
.flatpickr-day.startRange.inRange, 
.flatpickr-day.endRange.inRange, 
.flatpickr-day.selected:focus, 
.flatpickr-day.startRange:focus, 
.flatpickr-day.endRange:focus, 
.flatpickr-day.selected:hover, 
.flatpickr-day.startRange:hover, 
.flatpickr-day.endRange:hover, 
.flatpickr-day.selected.prevMonthDay, 
.flatpickr-day.startRange.prevMonthDay, 
.flatpickr-day.endRange.prevMonthDay, 
.flatpickr-day.selected.nextMonthDay, 
.flatpickr-day.startRange.nextMonthDay, 
.flatpickr-day.endRange.nextMonthDay {
    background: var(--primary);
    border-color: var(--primary);
}

.flatpickr-day.inRange, 
.flatpickr-day.prevMonthDay.inRange, 
.flatpickr-day.nextMonthDay.inRange, 
.flatpickr-day.today.inRange, 
.flatpickr-day.prevMonthDay.today.inRange, 
.flatpickr-day.nextMonthDay.today.inRange, 
.flatpickr-day:hover, 
.flatpickr-day.prevMonthDay:hover, 
.flatpickr-day.nextMonthDay:hover, 
.flatpickr-day:focus, 
.flatpickr-day.prevMonthDay:focus, 
.flatpickr-day.nextMonthDay:focus {
    background: var(--bamakoSecondaryLight);
    border-color: var(--bamakoSecondaryLight);
}


/*****************************
 * 
 *  Tailles d'affichage
 */

.flatpickr--mini .flatpickr-calendar { width: 15rem !important; }

.flatpickr--mini .flatpickr-day { /*Tailles valables pour une largeur de conteneur de 15em*/
 line-height: 27px;
 height: 29px;
 font-size: 90%;
}