/* Generated by tools/generate-dossier-status-assets.js. Edit shared/dossier-status.json. */
:root {
  --status-preparation: #7A7060;
  --status-preparation-text: #5C5445;
  --status-preparation-bg: #F4F0E8;
  --status-instruction: #F28622;
  --status-instruction-text: #C96D10;
  --status-instruction-bg: #FDF0E0;
  --status-instruction-readable-text: #A8580C;
  --status-a-completer: #D99A00;
  --status-a-completer-text: #9A6B00;
  --status-a-completer-bg: #FFF6D8;
  --status-a-completer-readable-text: #946600;
  --status-a-corriger: #D65A31;
  --status-a-corriger-text: #B84522;
  --status-a-corriger-bg: #FFF0E8;
  --status-validation: #5B6FD8;
  --status-validation-text: #4355B3;
  --status-validation-bg: #EEF1FF;
  --status-paiement: #3F7CAC;
  --status-paiement-text: #2F638C;
  --status-paiement-bg: #EAF4FB;
  --status-paye: #2E8B57;
  --status-paye-text: #236B44;
  --status-paye-bg: #EAF7F0;
  --status-rejete: #C73737;
  --status-rejete-text: #9F2D2D;
  --status-rejete-bg: #FDECEC;
  --status-to-complete: var(--status-a-completer);
  --status-to-complete-text: var(--status-a-completer-text);
  --status-to-complete-bg: var(--status-a-completer-bg);
  --status-to-correct: var(--status-a-corriger);
  --status-to-correct-text: var(--status-a-corriger-text);
  --status-to-correct-bg: var(--status-a-corriger-bg);
  --status-payment: var(--status-paiement);
  --status-payment-text: var(--status-paiement-text);
  --status-payment-bg: var(--status-paiement-bg);
  --status-paid: var(--status-paye);
  --status-paid-text: var(--status-paye-text);
  --status-paid-bg: var(--status-paye-bg);
  --status-rejected: var(--status-rejete);
  --status-rejected-text: var(--status-rejete-text);
  --status-rejected-bg: var(--status-rejete-bg);
}

:is(.badge, .status-badge, .dossier-status-badge, .status-pill, .dos-badge, .ds-pill, .s-pill).dossier-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  box-sizing: border-box;
  min-width: 0;
  max-width: 100%;
  min-height: 28px;
  padding: 5px 10px;
  border: 1px solid;
  border-radius: 999px;
  font: 700 12px/1.2 Inter, system-ui, sans-serif;
  letter-spacing: normal;
  text-transform: none;
  white-space: normal;
  overflow-wrap: anywhere;
  text-align: center;
}
.dossier-status:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
.instruction-timeline .step > div, .instruction-step > div { min-width: 0; }
.instruction-timeline .step strong, .instruction-step strong { white-space: normal; overflow-wrap: anywhere; }
@media (max-width: 600px) { .dossier-status { padding-inline: 8px; } }

:is(.dossier-status[data-dossier-status='preparation'], .badge-status-preparation, .status-badge.s-preparation, .dossier-status-badge.ds-preparation, .status-pill.ds-preparation, .dos-badge-preparation, .ds-preparation, .s-preparation) {
  color: var(--status-preparation-readable-text, var(--status-preparation-text));
  background: var(--status-preparation-bg);
  border-color: var(--status-preparation);
}
.instruction-timeline[data-dossier-status='preparation'] .step.is-current .dot, .instruction-steps[data-dossier-status='preparation'] .instruction-step.is-current > span { border-color: var(--status-preparation); background: var(--status-preparation); }
.instruction-timeline[data-dossier-status='preparation'] .step.is-current { border-color: var(--status-preparation); background: var(--status-preparation-bg); }
.instruction-timeline[data-dossier-status='preparation'] .step.is-current strong, .instruction-timeline[data-dossier-status='preparation'] .step.is-current span { color: var(--status-preparation-readable-text, var(--status-preparation-text)); }
.filter-tabs button[data-filter='preparation'] { color: var(--status-preparation-readable-text, var(--status-preparation-text)); background: var(--status-preparation-bg); border-color: var(--status-preparation); }
.filter-tabs button[data-filter='preparation'].active { box-shadow: inset 0 0 0 1px var(--status-preparation); }
:is(.dossier-status[data-dossier-status='instruction'], .badge-status-instruction, .status-badge.s-instruction, .dossier-status-badge.ds-instruction, .status-pill.ds-instruction, .dos-badge-instruction, .ds-instruction, .s-instruction) {
  color: var(--status-instruction-readable-text, var(--status-instruction-text));
  background: var(--status-instruction-bg);
  border-color: var(--status-instruction);
}
.instruction-timeline[data-dossier-status='instruction'] .step.is-current .dot, .instruction-steps[data-dossier-status='instruction'] .instruction-step.is-current > span { border-color: var(--status-instruction); background: var(--status-instruction); }
.instruction-timeline[data-dossier-status='instruction'] .step.is-current { border-color: var(--status-instruction); background: var(--status-instruction-bg); }
.instruction-timeline[data-dossier-status='instruction'] .step.is-current strong, .instruction-timeline[data-dossier-status='instruction'] .step.is-current span { color: var(--status-instruction-readable-text, var(--status-instruction-text)); }
.filter-tabs button[data-filter='instruction'] { color: var(--status-instruction-readable-text, var(--status-instruction-text)); background: var(--status-instruction-bg); border-color: var(--status-instruction); }
.filter-tabs button[data-filter='instruction'].active { box-shadow: inset 0 0 0 1px var(--status-instruction); }
:is(.dossier-status[data-dossier-status='a_completer'], .badge-status-a_completer, .status-badge.s-a_completer, .dossier-status-badge.ds-a_completer, .status-pill.ds-a_completer, .dos-badge-a_completer, .ds-a_completer, .s-a_completer) {
  color: var(--status-a-completer-readable-text, var(--status-a-completer-text));
  background: var(--status-a-completer-bg);
  border-color: var(--status-a-completer);
}
.instruction-timeline[data-dossier-status='a_completer'] .step.is-current .dot, .instruction-steps[data-dossier-status='a_completer'] .instruction-step.is-current > span { border-color: var(--status-a-completer); background: var(--status-a-completer); }
.instruction-timeline[data-dossier-status='a_completer'] .step.is-current { border-color: var(--status-a-completer); background: var(--status-a-completer-bg); }
.instruction-timeline[data-dossier-status='a_completer'] .step.is-current strong, .instruction-timeline[data-dossier-status='a_completer'] .step.is-current span { color: var(--status-a-completer-readable-text, var(--status-a-completer-text)); }
.filter-tabs button[data-filter='a_completer'] { color: var(--status-a-completer-readable-text, var(--status-a-completer-text)); background: var(--status-a-completer-bg); border-color: var(--status-a-completer); }
.filter-tabs button[data-filter='a_completer'].active { box-shadow: inset 0 0 0 1px var(--status-a-completer); }
:is(.dossier-status[data-dossier-status='a_corriger'], .badge-status-a_corriger, .status-badge.s-a_corriger, .dossier-status-badge.ds-a_corriger, .status-pill.ds-a_corriger, .dos-badge-a_corriger, .ds-a_corriger, .s-a_corriger) {
  color: var(--status-a-corriger-readable-text, var(--status-a-corriger-text));
  background: var(--status-a-corriger-bg);
  border-color: var(--status-a-corriger);
}
.instruction-timeline[data-dossier-status='a_corriger'] .step.is-current .dot, .instruction-steps[data-dossier-status='a_corriger'] .instruction-step.is-current > span { border-color: var(--status-a-corriger); background: var(--status-a-corriger); }
.instruction-timeline[data-dossier-status='a_corriger'] .step.is-current { border-color: var(--status-a-corriger); background: var(--status-a-corriger-bg); }
.instruction-timeline[data-dossier-status='a_corriger'] .step.is-current strong, .instruction-timeline[data-dossier-status='a_corriger'] .step.is-current span { color: var(--status-a-corriger-readable-text, var(--status-a-corriger-text)); }
.filter-tabs button[data-filter='a_corriger'] { color: var(--status-a-corriger-readable-text, var(--status-a-corriger-text)); background: var(--status-a-corriger-bg); border-color: var(--status-a-corriger); }
.filter-tabs button[data-filter='a_corriger'].active { box-shadow: inset 0 0 0 1px var(--status-a-corriger); }
:is(.dossier-status[data-dossier-status='validation'], .badge-status-validation, .status-badge.s-validation, .dossier-status-badge.ds-validation, .status-pill.ds-validation, .dos-badge-validation, .ds-validation, .s-validation) {
  color: var(--status-validation-readable-text, var(--status-validation-text));
  background: var(--status-validation-bg);
  border-color: var(--status-validation);
}
.instruction-timeline[data-dossier-status='validation'] .step.is-current .dot, .instruction-steps[data-dossier-status='validation'] .instruction-step.is-current > span { border-color: var(--status-validation); background: var(--status-validation); }
.instruction-timeline[data-dossier-status='validation'] .step.is-current { border-color: var(--status-validation); background: var(--status-validation-bg); }
.instruction-timeline[data-dossier-status='validation'] .step.is-current strong, .instruction-timeline[data-dossier-status='validation'] .step.is-current span { color: var(--status-validation-readable-text, var(--status-validation-text)); }
.filter-tabs button[data-filter='validation'] { color: var(--status-validation-readable-text, var(--status-validation-text)); background: var(--status-validation-bg); border-color: var(--status-validation); }
.filter-tabs button[data-filter='validation'].active { box-shadow: inset 0 0 0 1px var(--status-validation); }
:is(.dossier-status[data-dossier-status='paiement'], .badge-status-paiement, .status-badge.s-paiement, .dossier-status-badge.ds-paiement, .status-pill.ds-paiement, .dos-badge-paiement, .ds-paiement, .s-paiement) {
  color: var(--status-paiement-readable-text, var(--status-paiement-text));
  background: var(--status-paiement-bg);
  border-color: var(--status-paiement);
}
.instruction-timeline[data-dossier-status='paiement'] .step.is-current .dot, .instruction-steps[data-dossier-status='paiement'] .instruction-step.is-current > span { border-color: var(--status-paiement); background: var(--status-paiement); }
.instruction-timeline[data-dossier-status='paiement'] .step.is-current { border-color: var(--status-paiement); background: var(--status-paiement-bg); }
.instruction-timeline[data-dossier-status='paiement'] .step.is-current strong, .instruction-timeline[data-dossier-status='paiement'] .step.is-current span { color: var(--status-paiement-readable-text, var(--status-paiement-text)); }
.filter-tabs button[data-filter='paiement'] { color: var(--status-paiement-readable-text, var(--status-paiement-text)); background: var(--status-paiement-bg); border-color: var(--status-paiement); }
.filter-tabs button[data-filter='paiement'].active { box-shadow: inset 0 0 0 1px var(--status-paiement); }
:is(.dossier-status[data-dossier-status='paye'], .badge-status-paye, .status-badge.s-paye, .dossier-status-badge.ds-paye, .status-pill.ds-paye, .dos-badge-paye, .ds-paye, .s-paye) {
  color: var(--status-paye-readable-text, var(--status-paye-text));
  background: var(--status-paye-bg);
  border-color: var(--status-paye);
}
.instruction-timeline[data-dossier-status='paye'] .step.is-current .dot, .instruction-steps[data-dossier-status='paye'] .instruction-step.is-current > span { border-color: var(--status-paye); background: var(--status-paye); }
.instruction-timeline[data-dossier-status='paye'] .step.is-current { border-color: var(--status-paye); background: var(--status-paye-bg); }
.instruction-timeline[data-dossier-status='paye'] .step.is-current strong, .instruction-timeline[data-dossier-status='paye'] .step.is-current span { color: var(--status-paye-readable-text, var(--status-paye-text)); }
.filter-tabs button[data-filter='paye'] { color: var(--status-paye-readable-text, var(--status-paye-text)); background: var(--status-paye-bg); border-color: var(--status-paye); }
.filter-tabs button[data-filter='paye'].active { box-shadow: inset 0 0 0 1px var(--status-paye); }
:is(.dossier-status[data-dossier-status='rejete'], .badge-status-rejete, .status-badge.s-rejete, .dossier-status-badge.ds-rejete, .status-pill.ds-rejete, .dos-badge-rejete, .ds-rejete, .s-rejete) {
  color: var(--status-rejete-readable-text, var(--status-rejete-text));
  background: var(--status-rejete-bg);
  border-color: var(--status-rejete);
}
.instruction-timeline[data-dossier-status='rejete'] .step.is-current .dot, .instruction-steps[data-dossier-status='rejete'] .instruction-step.is-current > span { border-color: var(--status-rejete); background: var(--status-rejete); }
.instruction-timeline[data-dossier-status='rejete'] .step.is-current { border-color: var(--status-rejete); background: var(--status-rejete-bg); }
.instruction-timeline[data-dossier-status='rejete'] .step.is-current strong, .instruction-timeline[data-dossier-status='rejete'] .step.is-current span { color: var(--status-rejete-readable-text, var(--status-rejete-text)); }
.filter-tabs button[data-filter='rejete'] { color: var(--status-rejete-readable-text, var(--status-rejete-text)); background: var(--status-rejete-bg); border-color: var(--status-rejete); }
.filter-tabs button[data-filter='rejete'].active { box-shadow: inset 0 0 0 1px var(--status-rejete); }