.edp-container .edp-caret-button.edp-disabled,
.edp-container .edp-caret.edp-disabled,
.edp-container .edp-button.edp-disabled,
.edp-container .edp-year-button.edp-disabled {
  color: rgba(0,0,0,0.16);
  cursor: not-allowed;
}
.edp-container {
  display: inline-block;
  width: 300px;
  overflow: hidden;
}
.edp-container .edp-header-section {
  background-color: #60b5cd;
  padding: 8px 24px 0px 24px;
  color: rgba(255,255,255,0.8);
}
.edp-container .edp-header-section .edp-header-active {
  color: #fff;
}
.edp-container .edp-header-section .edp-header-year {
  margin-bottom: 4px;
  display: inline-block;
  padding: 10px;
  transition: box-shadow 0.25s;
  box-shadow: 1px 1px 1px 1px rgba(0,0,0,0.18);
  cursor: pointer;
  font-size: 14px;
}
.edp-container .edp-header-section .edp-header-year.edp-header-active {
  box-shadow: 0px 0px 0px 0px rgba(0,0,0,0.18);
  font-weight: bolder;
}
.edp-container .edp-month-wrapper {
  position: relative;
  width: 300px;
  height: 240px;
}
.edp-container .edp-month-day-wrapper {
  position: relative;
  height: 48px;
  padding-bottom: 8px;
  overflow: hidden;
}
.edp-container .edp-header-month-day {
  padding-top: 0px;
  position: absolute;
  cursor: pointer;
  font-size: 32px;
  font-weight: 500;
  height: 40px;
  animation-duration: 0.35s;
  animation-fill-mode: forwards;
  line-height: 40px;
  transition: box-shadow 0.25s;
  padding: 0px 8px;
}
.edp-container .edp-header-month-day.edp-month-day-previous {
  margin-right: 1px;
  animation-name: edp-slideupprevious;
}
.edp-container .edp-header-month-day:not(.edp-month-day-previous) {
  margin-right: 1px;
  animation-name: edp-slideupnext;
}
.edp-container .edp-header-month-day:not(.edp-header-active):not(.edp-month-day-previous) {
  box-shadow: 1px 1px 1px 1px rgba(0,0,0,0.18);
}
.edp-container .edp-month-slider {
  top: 0;
  left: 0;
  width: 300px;
  height: 240px;
  position: absolute;
  animation-duration: 0.35s;
  animation-fill-mode: forwards;
}
.edp-container .edp-month-slider.edp-in-next {
  animation-name: edp-slidenext;
}
.edp-container .edp-month-slider.edp-in-previous {
  animation-name: edp-slideprevious;
}
.edp-container .edp-month-slider.edp-out-next {
  animation-name: edp-slideoutnext;
}
.edp-container .edp-month-slider.edp-out-previous {
  animation-name: edp-slideoutprevious;
}
.edp-container .edp-caret-button {
  cursor: pointer;
  padding: 8px;
}
.edp-container .edp-caret {
  height: 12px;
  width: 12px;
  display: inline-block;
  border-left: 2px solid rgba(0,0,0,0.54);
  border-bottom: 2px solid rgba(0,0,0,0.54);
  cursor: pointer;
}
.edp-container .edp-caret.edp-disabled {
  opacity: 0.2;
}
.edp-container .edp-caret.edp-caret-left {
  transform: rotate(45deg);
}
.edp-container .edp-caret.edp-caret-right {
  transform: rotate(-135deg);
}
.edp-container .edp-month-change-section {
  display: flex;
  color: rgba(0,0,0,0.84);
  justify-content: space-between;
  align-items: center;
  height: 40px;
}
.edp-container .edp-column {
  width: 40px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  display: inline-block;
}
.edp-container .edp-day-symbol {
  font-size: 12px;
  color: rgba(0,0,0,0.54);
}
.edp-container .edp-day-number {
  font-size: 12px;
  color: rgba(0,0,0,0.86);
  transition: background-color 0.3s;
  border-radius: 50%;
  background-color: rgba(0,0,0,0);
  cursor: pointer;
}
.edp-container .edp-day-number:hover:not(.edp-empty-column):not(.edp-disabled-column):not(.edp-day-number-selected) {
  background-color: rgba(0,0,0,0.08);
}
.edp-container .edp-day-number.edp-day-number-today {
  color: #60b5cd;
  font-weight: bolder;
}
.edp-container .edp-day-number.edp-day-number-selected {
  background-color: #60b5cd;
  color: #fff;
}
.edp-container .edp-empty-column {
  pointer-events: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  user-select: none;
  color: rgba(255,255,255,0);
}
.edp-container .edp-disabled-column {
  color: rgba(0,0,0,0.54);
}
.edp-container .edp-body-section {
  background-color: #fff;
  padding-left: 8px;
  padding-right: 8px;
}
.edp-container .edp-bottom-section {
  display: flex;
  justify-content: flex-end;
  padding-bottom: 16px;
}
.edp-container .edp-button {
  color: #60b5cd;
  border: none;
  outline: none;
  background-color: #fff;
  font-weight: bold;
  min-width: 64px;
  padding: 8px;
  border-radius: 3px;
  cursor: pointer;
  background-color: rgba(0,0,0,0);
  transition: 0.3s;
  line-height: 100%;
}
.edp-container .edp-button:not(:last-child) {
  margin-right: 16px;
}
.edp-container .edp-button:hover:not(.edp-disabled) {
  background-color: rgba(0,0,0,0.08);
}
.edp-container .edp-button:focus {
  outline: none;
}
.edp-container .edp-year-button {
  color: #60b5cd;
  padding: 0px;
  width: 200px;
  transition: 0.3s;
  box-shadow: 0 0px 0px rgba(0,0,0,0);
  height: 40px;
  line-height: 40px;
}
.edp-container .edp-year-button:hover {
  box-shadow: 0 1px 3px rgba(0,0,0,0.16);
}
.edp-container .edp-year-button.edp-year-button-selected {
  height: 50px;
  line-height: 50px;
  font-size: 32px;
}
.edp-container .edp-year-picker {
  height: 320px;
  position: relative;
  display: flex;
  justify-content: center;
  overflow: auto;
}
@-moz-keyframes edp-slideupprevious {
  from {
    transform: translateY(0%);
  }
  to {
    transform: translateY(-100%);
  }
}
@-webkit-keyframes edp-slideupprevious {
  from {
    transform: translateY(0%);
  }
  to {
    transform: translateY(-100%);
  }
}
@-o-keyframes edp-slideupprevious {
  from {
    transform: translateY(0%);
  }
  to {
    transform: translateY(-100%);
  }
}
@keyframes edp-slideupprevious {
  from {
    transform: translateY(0%);
  }
  to {
    transform: translateY(-100%);
  }
}
@-moz-keyframes edp-slideupnext {
  from {
    transform: translateY(100%);
  }
  to {
    transform: translateY(0%);
  }
}
@-webkit-keyframes edp-slideupnext {
  from {
    transform: translateY(100%);
  }
  to {
    transform: translateY(0%);
  }
}
@-o-keyframes edp-slideupnext {
  from {
    transform: translateY(100%);
  }
  to {
    transform: translateY(0%);
  }
}
@keyframes edp-slideupnext {
  from {
    transform: translateY(100%);
  }
  to {
    transform: translateY(0%);
  }
}
@-moz-keyframes edp-slidenext {
  from {
    transform: translateX(100%);
  }
  to {
    transform: translateX(0%);
  }
}
@-webkit-keyframes edp-slidenext {
  from {
    transform: translateX(100%);
  }
  to {
    transform: translateX(0%);
  }
}
@-o-keyframes edp-slidenext {
  from {
    transform: translateX(100%);
  }
  to {
    transform: translateX(0%);
  }
}
@keyframes edp-slidenext {
  from {
    transform: translateX(100%);
  }
  to {
    transform: translateX(0%);
  }
}
@-moz-keyframes edp-slideprevious {
  from {
    transform: translateX(-100%);
  }
  to {
    transform: translateX(0%);
  }
}
@-webkit-keyframes edp-slideprevious {
  from {
    transform: translateX(-100%);
  }
  to {
    transform: translateX(0%);
  }
}
@-o-keyframes edp-slideprevious {
  from {
    transform: translateX(-100%);
  }
  to {
    transform: translateX(0%);
  }
}
@keyframes edp-slideprevious {
  from {
    transform: translateX(-100%);
  }
  to {
    transform: translateX(0%);
  }
}
@-moz-keyframes edp-slideoutnext {
  from {
    transform: translateX(0%);
  }
  to {
    transform: translateX(-100%);
  }
}
@-webkit-keyframes edp-slideoutnext {
  from {
    transform: translateX(0%);
  }
  to {
    transform: translateX(-100%);
  }
}
@-o-keyframes edp-slideoutnext {
  from {
    transform: translateX(0%);
  }
  to {
    transform: translateX(-100%);
  }
}
@keyframes edp-slideoutnext {
  from {
    transform: translateX(0%);
  }
  to {
    transform: translateX(-100%);
  }
}
@-moz-keyframes edp-slideoutprevious {
  from {
    transform: translateX(0%);
  }
  to {
    transform: translateX(100%);
  }
}
@-webkit-keyframes edp-slideoutprevious {
  from {
    transform: translateX(0%);
  }
  to {
    transform: translateX(100%);
  }
}
@-o-keyframes edp-slideoutprevious {
  from {
    transform: translateX(0%);
  }
  to {
    transform: translateX(100%);
  }
}
@keyframes edp-slideoutprevious {
  from {
    transform: translateX(0%);
  }
  to {
    transform: translateX(100%);
  }
}

/* Surcharges du menu latéral :
 * - rendre le sidebar scrollable verticalement
 * - compacter la hauteur des items pour limiter le débordement
 */

aside.is-placed-left .menu.is-menu-main {
    overflow-y: auto;
    max-height: calc(100vh - 3.25rem);
}

.aside .menu-list li ul li a {
    padding: 0.35rem 0 0.35rem 0.75rem;
}

.aside .menu-label {
    margin-top: 0.4rem;
    margin-bottom: 0.4rem;
}

/* Contraste : les défauts Bulma (#727c8f sur #2e323a ≈ 3:1 ; #666f81 sur
 * #2e323a ≈ 2.4:1) sont sous le seuil WCAG AA. On éclaircit liens et
 * libellés pour repasser au-dessus de 4.5:1. */
.aside .menu-list a {
    color: #c6cbd6;
}

.aside .menu-label {
    color: #aab1c2;
}

/* Items <button class="dropdown-item"> : neutralise les défauts natifs du
 * <button> (fond gris, bordure) et harmonise hover / item actif avec le
 * reste de l'app (Bulma met du bleu vif sur .is-active, trop tranchant ici).
 */
button.dropdown-item {
    background: transparent;
    border: none;
    cursor: pointer;
}

button.dropdown-item.is-active {
    background-color: whitesmoke;
    color: inherit;
}

button.dropdown-item:hover {
    background-color: #fafafa;
    color: inherit;
}

/* Sections repliables (<details>/<summary>) : harmoniser avec les autres
 * menu-label et rendre le summary cliquable de façon visible. */
.aside .menu-foldable {
    margin: 0;
}

.aside .menu-foldable > summary.menu-label--foldable {
    cursor: pointer;
    list-style: revert;
    padding-left: 0.25rem;
}

.aside .menu-foldable > summary.menu-label--foldable::-webkit-details-marker {
    color: #aab1c2;
}

.aside .menu-foldable[open] > summary.menu-label--foldable {
    color: #ffffff;
}

/* Ouverture du menu latéral en mobile (< 1024px).
 * Le template JustBoil attendait que son JS pose has-aside-mobile-expanded
 * sur <html> ; ici c'est Elm qui la pose sur le conteneur racine. Règles
 * miroir de bulma.0.9.min.css — le préfixe html.has-aside-mobile-transition
 * sert à dépasser la spécificité de la règle `left: -15rem` du template. */
@media screen and (max-width: 1023px) {
    html.has-aside-mobile-transition .has-aside-mobile-expanded aside.aside {
        left: 0;
    }

    .has-aside-mobile-expanded #app,
    .has-aside-mobile-expanded nav.navbar {
        margin-left: 15rem;
    }
}
/* Listes : affichage partiel plutôt que scrollbar horizontale.
 * table-layout: fixed force la table à tenir dans son conteneur ;
 * le texte trop long est tronqué avec une ellipse. Sous 769px le
 * mode cartes Buefy (has-mobile-cards) prend le relais, on ne
 * touche qu'au mode table.
 *
 * En disposition fixe, une colonne sans largeur reçoit une part égale
 * du reste. La case à cocher a ses 40px dans les règles Buefy que porte
 * portal/static/bulma.0.9.min.css ; les colonnes courtes (code, booléen) sont
 * marquées col-etroite par Record.View.largeurColonne, et leur titre se
 * replie plutôt que de s'ellipser. */
@media screen and (min-width: 769px) {
    .b-table .table {
        table-layout: fixed;
    }

    .b-table .table td:not(.is-actions-cell):not(.is-checkbox-cell),
    .b-table .table th:not(.is-checkbox-cell):not(.col-etroite) {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .b-table .table th.col-etroite {
        width: 8rem;
    }
}

/* Barre de filtre : le sélecteur de clé étrangère est partagé avec les
 * formulaires, qui le veulent en taille normale ; ici il s'aligne sur les
 * champs is-small voisins (même règle que .button.is-small de Bulma). */
.filtre-fk .button {
    font-size: 0.75rem;
    border-radius: 2px;
}

/* L'état d'un règlement au portail est une phrase (« Envoyé à la banque,
 * prélèvement prévu vers le … ») : la pastille doit pouvoir passer à la
 * ligne, sinon elle déborde l'écran d'un téléphone. */
.tag.etat-lu {
    white-space: normal;
    height: auto;
}
/* Un champ date ne grandit pas (`is-narrow`) et se mesure donc sur son
 * contenu, aide comprise : 400 caractères sur une ligne font 2 000 px, et
 * la rangée sortait de l'écran sans barre de défilement (Bulma pose
 * overflow-x: hidden sur html). L'aide ne compte plus dans la mesure
 * (width: 0) et prend ensuite la largeur du libellé et de la saisie
 * (min-width: 100 %). */
.field-body > .field.is-narrow > .help {
    width: 0;
    min-width: 100%;
}