/* Scoped component styles only. No resets, fonts, or global utility classes. */
.qem-wizard, .qem-wizard-notifications {
  --qw-accent: #283b5b;
  --qw-text: #182335;
  --qw-muted: #53637a;
  --qw-border: #c3ccd9;
  --qw-surface: #fff;
  --qw-error: #a51d2d;
  color: var(--qw-text);
  background: var(--qw-surface);
}
.qem-wizard [hidden] { display: none !important; }
.qem-wizard [data-wizard-nav] { display: flex; gap: .5rem; flex-wrap: wrap; margin-bottom: 1.5rem; }
.qem-wizard .qem-wizard__step-button {
  flex: 1 1 8rem; border: 0; border-top: .25rem solid var(--qw-border);
  background: transparent; color: var(--qw-muted); padding: .75rem .5rem;
  font: inherit; text-align: left; min-height: 3rem; cursor: pointer;
}
.qem-wizard .qem-wizard__step-button span { display: block; font-size: .8em; margin-bottom: .25rem; }
.qem-wizard .qem-wizard__step-button[aria-current="step"] { border-color: var(--qw-accent); color: var(--qw-accent); }
.qem-wizard .qem-wizard__step-button[data-complete="true"] { border-color: #24714c; }
.qem-wizard :focus-visible { outline: 3px solid var(--qw-accent); outline-offset: 3px; }
.qem-wizard [data-wizard-errors] { border: 1px solid var(--qw-error); border-radius: .5rem; padding: 1rem; margin-block: 1rem; color: var(--qw-error); }
.qem-wizard [data-wizard-errors] p { margin-top: 0; }
.qem-wizard [data-wizard-errors] button { font: inherit; color: inherit; background: none; border: 0; text-align: left; text-decoration: underline; cursor: pointer; padding: .35rem; }
.qem-wizard .qem-wizard__field-error { color: var(--qw-error); margin-block: .5rem; font-size: .9em; }
.qem-wizard [aria-invalid="true"] { outline: 2px solid var(--qw-error); outline-offset: 1px; }
.qem-wizard [data-wizard-status]:not(:empty) { padding: 1rem; border-radius: .5rem; margin-block: 1rem; }
.qem-wizard [data-wizard-actions] { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: .75rem; margin-top: 1.5rem; }
.qem-wizard [data-wizard-next], .qem-wizard [data-wizard-back], .qem-wizard [data-wizard-submit] {
  font: inherit; min-height: 2.75rem; padding: .65rem 1rem; border-radius: .45rem;
  border: 1px solid var(--qw-border); background: var(--qw-surface); color: var(--qw-text); cursor: pointer;
}
.qem-wizard [data-wizard-next], .qem-wizard [data-wizard-submit] { background: var(--qw-accent); color: #fff; }
.qem-wizard button:disabled { cursor: default; opacity: .6; }
.qem-wizard:not([data-wizard-ready]) [data-wizard-actions], .qem-wizard:not([data-wizard-ready]) [data-wizard-nav] { display: none; }
@media (max-width: 480px) {
  .qem-wizard .qem-wizard__step-button { flex-basis: 5rem; font-size: .9rem; }
  .qem-wizard [data-wizard-actions] > button { flex: 1; }
}
@media (forced-colors: active) {
  .qem-wizard .qem-wizard__step-button[aria-current="step"] { outline: 2px solid Highlight; }
  .qem-wizard [data-wizard-status] { border: 1px solid CanvasText; }
}

/* Reserve notification space above the form so outcomes do not move the wizard.
   Long messages scroll within this keyboard-focusable region. */
.qem-wizard-notifications { height: 6rem; margin-block: 1rem; background: transparent; }
.qem-wizard-notifications [hidden], .qem-wizard-notifications [data-wizard-status]:empty { display: none !important; }
.qem-wizard-notifications > div {
  box-sizing: border-box; max-height: 100%; overflow: auto; overflow-wrap: anywhere;
  padding: 1rem; border: 1px solid var(--qw-accent); border-left-width: .3rem;
  border-radius: .5rem; background: #fff; color: var(--qw-text);
}
.qem-wizard-notifications [data-wizard-errors], .qem-wizard-notifications [data-kind="error"] { border-color: var(--qw-error); color: var(--qw-error); }
.qem-wizard-notifications [data-kind="success"] { border-color: #24714c; color: #185b3a; }
.qem-wizard-notifications :focus-visible { outline: 2px solid var(--qw-accent); outline-offset: 2px; }
@media (max-width: 480px) { .qem-wizard-notifications { height: 8rem; } }
