.demande {

  margin: auto;

  border: 1px solid var(--theme, #d8dae0);
  border-radius: 12px;
  padding: 0 0 18px;
  overflow: hidden;
  max-width: min(30rem, calc(calc(100vw / var(--zoom-texte, 1)) - 32px));
  background: var(--bg, #fff);
  color: var(--fg, #26262a);
  box-shadow: 0 18px 46px var(--theme-shadow, rgba(0, 0, 0, .22)),
              0 2px 10px rgba(0, 0, 0, .12);
}

.demande::backdrop { background: rgba(20, 22, 28, .38); }

.demande-entete {
  display: flex; align-items: center; justify-content: center; gap: 8px;

  margin: 0; padding: 11px 42px;
  text-align: center;
  font-size: 15.5px; font-weight: 700; letter-spacing: .01em;
}
.demande-entete-picto { font-size: 16px; }

.demande-entete {
  background: var(--theme-bg, #EDF1F5);
  color: var(--theme-deep, #26313b);
  border-bottom: 2px solid var(--theme, #8aa0b4);
}

.demande > :not(.demande-entete) { margin-left: 24px; margin-right: 24px; }

.demande-texte {

  margin: 18px 0 20px;
  font-size: .95rem;
  line-height: 1.5;
  white-space: pre-line;   
  white-space: pre-line;   
}

.demande input.demande-champ, .demande textarea.demande-champ { width: calc(100% - 48px); }
.demande-champ {
  display: block;
  box-sizing: border-box;
  margin: 0 0 18px;
  padding: 9px 11px;
  font: inherit;
  font-size: .95rem;
  color: var(--fg, #26262a);
  background: var(--bg, #fff);
  border: 1px solid var(--line, #d8dae0);
  border-radius: 8px;
}
.demande-champ:focus-visible {
  outline: 2px solid var(--focus, #2b6cb0);
  outline-offset: 1px;
  border-color: transparent;
}

.demande-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.demande .btn-danger {
  background: var(--bad, #e0524b);
  border-color: var(--bad, #e0524b);
  color: #fff;
}
.demande .btn-danger:hover { filter: brightness(.94); }

.demande .btn:focus-visible {
  outline: 2px solid var(--focus, #2b6cb0);
  outline-offset: 2px;
}

.demande-voies {
  display: flex; flex-direction: column; gap: 8px;
  margin: 14px 0 4px;
}
.demande-voie {
  display: flex; flex-direction: column; gap: 3px;
  text-align: left; width: 100%;
  padding: 11px 14px;
  border: 1px solid var(--border, #d7dee6); border-radius: 8px;
  background: var(--bg-white, #fff); cursor: pointer;
  transition: border-color .12s, background .12s;
}
.demande-voie:hover, .demande-voie:focus-visible {
  border-color: var(--theme, #555);
  background: var(--theme-bg, rgba(0,0,0,.03));
}
.demande-voie-titre { font-size: 14px; font-weight: 600; color: var(--fg-dark, #26313b); }

.demande-voie-aide { font-size: 12px; color: var(--fg-mid, #5a6672); }

.demande-choix .demande-actions:empty { display: none; }

.demande-coche { flex-direction: row; align-items: center; gap: 10px; }
.demande-coche input { width: 16px; height: 16px; flex: none; accent-color: var(--theme, #0F766E); cursor: pointer; }
.demande-coche input:disabled { cursor: not-allowed; }
.demande-coche:has(input:disabled) { opacity: .5; cursor: not-allowed; }
.demande-coche .demande-voie-aide { margin-left: auto; }

.demande-plusieurs .demande-voies { max-height: calc(46vh / var(--zoom-texte, 1)); overflow-y: auto; }

.demande-compte { margin: 12px 0 20px; font-size: 12px; color: var(--fg-mid, #5a6672); text-align: right; }
.demande-compte-picto { margin-right: 6px; }
.demande-compte-trop { color: var(--warn, #b8860b); font-weight: 600; }

.demande-entete { position: relative; }
.demande-x {
  position: absolute; right: 8px; top: 50%; transform: translateY(-50%);
  width: 26px; height: 26px; padding: 0; line-height: 1;
  border: 0; border-radius: 7px; background: transparent; cursor: pointer;
  color: var(--theme-deep, #26313b); font-size: 14px; opacity: .65;
}
.demande-x:hover, .demande-x:focus-visible { opacity: 1; background: rgba(0, 0, 0, .06); }