/* Bloc « Échéances à venir » (cfo-echeances-widget.js), partagé par le tableau
   de bord et le tableau de bord du comptable (comptable.html). Sorti de
   index.html le 2026-10-15, sans changement. */
.hdsn-ech { display: grid; grid-template-columns: minmax(240px, 320px) 1fr; gap: 24px;
  padding: 20px 24px; margin: 24px 0 20px; background: #fff;
  border: 1px solid rgba(42, 89, 64, 0.10); border-radius: 16px;
  box-shadow: 0 2px 12px rgba(42, 89, 64, 0.05); }
@media (max-width: 800px) { .hdsn-ech { grid-template-columns: 1fr; } }
.hdsn-ech-head { display: flex; align-items: center; justify-content: space-between; gap: 10px;
  flex-wrap: wrap; grid-column: 1 / -1; margin-bottom: 4px; }
/* Téléphone : le bouton « Tout voir » passe à la ligne au lieu de sortir de sa
   carte (audit G09-UI-14). */
@media (max-width: 480px) { .hdsn-ech-voir.hdsn-ech-voir { white-space: normal; max-width: 100%; } }
.hdsn-ech-title { font-size: 16px; font-weight: 700; letter-spacing: 0.02em; color: var(--et-petrol, var(--mint-darker)); }
.hdsn-ech-title svg { vertical-align: -3px; margin-right: 6px; }
/* « Toutes les échéances » : un vrai bouton de 32 px À L'ÉCRAN (38 px
   de CSS sous le zoom global de 0,85), plus un lien de 17 px de haut au
   coin du bloc (ERGO-C-15, Fitts). */
/* Classe doublée : le thème pose `body:is(…) * { color: inherit }` (0,1,2), qui l'emportait sur une classe seule — la couleur ne s'affichait pas (relecture du 2026-09-29, mesuré dans Chromium). */
.hdsn-ech-voir.hdsn-ech-voir { display: inline-flex; align-items: center; min-height: 38px; padding: 0 14px;
  border: 1px solid rgba(42, 89, 64, 0.18); border-radius: 999px;
  font-size: 13px; font-weight: 600; color: var(--mint-darker); text-decoration: none; white-space: nowrap; }
.hdsn-ech-voir:hover { background: rgba(42, 89, 64, 0.06); }
/* Le geste de chaque échéance, sous son titre (ERGO-C-08, C-15) :
   24 px à l'écran au moins (30 px de CSS sous le zoom de 0,85). */
.hdsn-ech-agir.hdsn-ech-agir { align-self: flex-start; display: inline-flex; align-items: center; min-height: 30px;
  font-size: 12.5px; font-weight: 600; color: var(--mint-darker); text-decoration: none; }
.hdsn-ech-agir:hover { text-decoration: underline; }
.hdsn-ech-cal { display: grid; grid-template-columns: repeat(7, 1fr); gap: 3px; align-content: start; }
.hdsn-ech-cal-mois { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between;
  font-size: 13px; font-weight: 600; color: var(--et-text-soft, #5a6a73); margin-bottom: 4px; }
.hdsn-ech-cal-mois > span { text-transform: capitalize; }
.hdsn-ech-cal-nav { border: none; background: transparent; cursor: pointer; font-size: 15px; line-height: 1;
  padding: 3px 8px; border-radius: 6px; color: var(--et-petrol, var(--mint-darker)); }
.hdsn-ech-cal-nav:hover:not(:disabled) { background: rgba(42, 89, 64, 0.08); }
.hdsn-ech-cal-nav:disabled { opacity: 0.25; cursor: default; }
.hdsn-ech-cal-dow { font-size: 10px; text-align: center; color: var(--et-text-soft, #5a6a73); opacity: 0.7; }
.hdsn-ech-cal-day { font-size: 12px; text-align: center; padding: 5px 0; border-radius: 6px;
  font-variant-numeric: tabular-nums; color: var(--et-text-soft, #5a6a73); position: relative;
  border: none; background: transparent; font-family: inherit; width: 100%; margin: 0; }
.hdsn-ech-cal-day.vide { visibility: hidden; }
.hdsn-ech-cal-day.weekend { background: rgba(27, 20, 16, 0.045); }
.hdsn-ech-cal-day.aujourdhui { font-weight: 700; border: 1px solid rgba(42, 89, 64, 0.25); }
.hdsn-ech-cal-day.a-echeance { font-weight: 700; }
.hdsn-ech-cal-day.urgent { background: rgba(184, 74, 53, 0.12); color: var(--coral-deep, #B84A35); }
.hdsn-ech-cal-day.proche { background: rgba(212, 169, 60, 0.16); color: var(--warning-text, #6B4F0E); }
.hdsn-ech-cal-day.calme { background: rgba(61, 122, 90, 0.12); color: var(--mint-deep, #3D7A5A); }
button.hdsn-ech-cal-day { cursor: pointer; }
button.hdsn-ech-cal-day:hover, button.hdsn-ech-cal-day:focus-visible {
  outline: 2px solid rgba(42, 89, 64, 0.35); outline-offset: 1px; }
.hdsn-ech-cal-day.jour-actif { box-shadow: inset 0 0 0 2px var(--et-petrol, var(--mint-darker)); }
.hdsn-ech-cal-detail { grid-column: 1 / -1; }
.hdsn-ech-cal-detail:not([hidden]) { margin-top: 8px; padding: 10px 12px; border-radius: 8px;
  background: rgba(42, 89, 64, 0.035); display: flex; flex-direction: column; gap: 8px; }
.hdsn-ech-cal-detail-item { border-left: 3px solid rgba(42, 89, 64, 0.15); padding-left: 8px;
  display: flex; flex-direction: column; gap: 2px; }
.hdsn-ech-cal-detail-item.urgent { border-left-color: var(--coral-deep, #B84A35); }
.hdsn-ech-cal-detail-item.proche { border-left-color: var(--warning-border, #D4A93C); }
.hdsn-ech-cal-detail-item.calme { border-left-color: var(--mint-deep, #3D7A5A); }
.hdsn-ech-cal-detail-lib { font-size: 12.5px; font-weight: 600; color: var(--et-petrol, var(--mint-darker)); }
.hdsn-ech-legende { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 6px 14px;
  margin-top: 10px; padding-top: 8px; border-top: 1px solid rgba(42, 89, 64, 0.08); }
.hdsn-ech-leg-item { display: flex; align-items: center; gap: 5px; font-size: 10.5px; color: var(--et-text-soft, #5a6a73); }
.hdsn-ech-leg-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; flex-shrink: 0; }
.hdsn-ech-leg-dot.urgent { background: var(--coral-deep, #B84A35); }
.hdsn-ech-leg-dot.proche { background: var(--warning-border, #D4A93C); }
.hdsn-ech-leg-dot.calme { background: var(--mint-deep, #3D7A5A); }
.hdsn-ech-leg-dot.weekend { border-radius: 2px; background: rgba(27, 20, 16, 0.18); }
.hdsn-ech-list { display: flex; flex-direction: column; gap: 8px; }
.hdsn-ech-item { display: flex; flex-direction: column; gap: 3px;
  padding: 8px 10px; border-radius: 8px; border-left: 3px solid rgba(42, 89, 64, 0.15); background: rgba(42, 89, 64, 0.02); }
.hdsn-ech-item.urgent { border-left-color: var(--coral-deep, #B84A35); }
.hdsn-ech-item.proche { border-left-color: var(--warning-border, #D4A93C); }
.hdsn-ech-item.calme { border-left-color: var(--mint-deep, #3D7A5A); }
.hdsn-ech-item-row { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.hdsn-ech-item-lib { font-size: 13px; color: var(--et-petrol, var(--mint-darker)); }
.hdsn-ech-item-when { display: flex; flex-direction: column; align-items: flex-end; gap: 1px; flex-shrink: 0; }
.hdsn-ech-item-quand { font-size: 12px; font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; }
.hdsn-ech-item-date { font-size: 10px; color: var(--et-text-soft, #5a6a73); white-space: nowrap; font-variant-numeric: tabular-nums; }
.hdsn-ech-item-detail { font-size: 11.5px; color: var(--et-text-soft, #5a6a73); }
.hdsn-ech-empty, .hdsn-ech-error { grid-column: 1 / -1; font-size: 13px; color: var(--et-text-soft, #5a6a73); padding: 8px 2px; }
.hdsn-ech-error { color: var(--coral-deep, #B84A35); }