/* Compilé depuis scss/pages/agenda.scss (bloc #agenda-calendar). */
/* Sur une colonne, #month-select apporte déjà 3em au-dessus. */
.body-pages section#agenda {
  padding-top: 1.5em; }

/* Sur plusieurs colonnes, le mois et les flèches sont portés par l'en-tête du
   calendrier : ce titre ferait doublon au-dessus de la liste. Masqué en CSS
   seulement — il reste le support de l'état (data-month / data-year) lu par
   agenda-calendar.js. La section reprend l'espace qu'il occupait. */
@media screen and (min-width: 992px) {
  .body-pages section#agenda {
    padding-top: 4em; }
  .body-pages section#agenda #month-select {
    display: none; } }

#agenda-calendar {
  margin-bottom: 40px; }
  /* Respiration entre le calendrier et la grille des événements. */
  @media screen and (min-width: 992px) {
    #agenda-calendar {
      padding-right: 45px; } }
  #agenda-calendar .calendar {
    padding: 20px 15px;
    background-color: #fff;
    box-shadow: #0000002e 0 0 35px; }
    /* En-tête identique à celui du calendrier de la page d'accueil : mêmes
       flèches, même affichage du mois (volontairement redondant avec le titre
       #month-select au-dessus de la liste). */
    #agenda-calendar .calendar header {
      position: relative; }
      #agenda-calendar .calendar header .simple-calendar-btn {
        top: 35px; }
        #agenda-calendar .calendar header .simple-calendar-btn.btn-prev {
          left: 35px; }
        #agenda-calendar .calendar header .simple-calendar-btn.btn-next {
          right: 35px; }
      /* Sur une colonne, le calendrier passe juste sous le titre #month-select :
         répéter le mois et l'année n'a plus de sens. Seules les flèches restent. */
      @media screen and (max-width: 991px) {
        #agenda-calendar .calendar header {
          height: 40px; }
          #agenda-calendar .calendar header .month {
            display: none; }
          #agenda-calendar .calendar header .simple-calendar-btn {
            top: 5px; }
            #agenda-calendar .calendar header .simple-calendar-btn.btn-prev {
              left: 15px; }
            #agenda-calendar .calendar header .simple-calendar-btn.btn-next {
              right: 15px; } }
    #agenda-calendar .calendar table {
      margin-top: 0; }
    #agenda-calendar .calendar .day:hover {
      border-color: #991414; }
    #agenda-calendar .calendar .day.today {
      background-color: #fff;
      color: inherit;
      border-color: #991414; }
    #agenda-calendar .calendar .day.has-event {
      background-color: #991414;
      color: #fff; }
      #agenda-calendar .calendar .day.has-event::after {
        display: none; }
      #agenda-calendar .calendar .day.has-event.wrong-month {
        opacity: 0.2; }
    #agenda-calendar .calendar .event-container {
      padding: 40px 25px;
      background-color: #fff;
      text-align: left; }
      #agenda-calendar .calendar .event-container .event {
        background-color: #991414; }
      #agenda-calendar .calendar .event-container .event-summary {
        font-weight: 800; }
      #agenda-calendar .calendar .event-container .event-hour {
        display: none; }
      #agenda-calendar .calendar .event-container .close:before,
      #agenda-calendar .calendar .event-container .close:after {
        background-color: #000; }
    #agenda-calendar .calendar .filler {
      background-color: #f4f4f4; }

@media screen and (max-width: 991px) {
  #agenda-calendar {
    max-width: 420px;
    margin-left: auto;
    margin-right: auto; } }
