/* Praxis Rivoir · ein gemeinsamer Fragebogen-Stil · 01.10.2026
   Schrittfarben aus CI_PRAXIS_RIVOIR.md; keine Änderung der globalen
   SPIRA-Palette. Farbe begleitet die Orientierung, nie eine Diagnose.
   Antworten behalten Text, native Auswahl und sichtbaren Tastaturfokus. */
.intake-start,
.praxis-checkout {
  --frage-ink: var(--ink, var(--tinte, #2a3540));
  --frage-lila: var(--link, #7465c0);
  --frage-blau: #2848a0;
  --frage-gold: #96742a;
  --frage-gruen: #386848;
  --frage-akzent: var(--frage-lila);
  --frage-nebel: var(--wash, #eeeaf4);
  --frage-rund: 18px;
}
.intake-start .journey-compass {
  border-color: color-mix(in srgb, var(--frage-lila) 24%, white);
  background: linear-gradient(115deg, var(--wash, #eeeaf4), var(--sunlight, #f8f4e0) 54%, var(--meadow, #e8f4ec));
  box-shadow: 0 8px 28px #2a354008;
}
.intake-start .journey-stops li:nth-child(1) { --frage-akzent: var(--frage-lila); }
.intake-start .journey-stops li:nth-child(2) { --frage-akzent: var(--frage-blau); }
.intake-start .journey-stops li:nth-child(3) { --frage-akzent: var(--frage-gold); }
.intake-start .journey-stops li:nth-child(4) { --frage-akzent: var(--frage-gruen); }
.intake-start .journey-stops button {
  border-color: color-mix(in srgb, var(--frage-akzent) 24%, white);
  background: color-mix(in srgb, var(--frage-akzent) 6%, white);
  color: var(--frage-ink);
}
.intake-start .journey-stops button[aria-current] {
  color: var(--frage-ink);
  border-color: var(--frage-akzent);
  background: color-mix(in srgb, var(--frage-akzent) 12%, white);
  box-shadow: inset 0 0 0 1px var(--frage-akzent);
}
.intake-start .journey-stops button:is([aria-current], .is-done) span {
  background: var(--frage-akzent);
  border-color: var(--frage-akzent);
}
.intake-start .journey-stops button:disabled { opacity: .8; }
.intake-start .intake-card[data-journey-step="0"] { --frage-akzent: var(--frage-lila); --frage-nebel: var(--wash, #eeeaf4); }
.intake-start .intake-card[data-journey-step="1"] { --frage-akzent: var(--frage-blau); --frage-nebel: #e4eef8; }
.intake-start .intake-card[data-journey-step="2"] { --frage-akzent: var(--frage-gold); --frage-nebel: var(--sunlight, #f8f4e0); }
.intake-start .intake-card[data-journey-step="3"] { --frage-akzent: var(--frage-gruen); --frage-nebel: var(--meadow, #e8f4ec); }
.intake-start .intake-card {
  border-color: color-mix(in srgb, var(--frage-akzent) 28%, white);
  background: linear-gradient(150deg, color-mix(in srgb, var(--frage-nebel) 72%, white), white 52%);
  box-shadow: 0 8px 28px #2a354008;
}
.intake-start .intake-card-heading {
  padding-bottom: 16px;
  border-bottom: 1px solid color-mix(in srgb, var(--frage-akzent) 20%, white);
  margin-bottom: 22px;
}
.intake-start .intake-card-heading h2 { color: var(--frage-ink); }
.intake-start .intake-card .frage {
  min-width: 0;
  padding: 16px;
  margin-block: 16px;
  border: 0;
  border-radius: var(--frage-rund);
  background: color-mix(in srgb, var(--frage-nebel) 45%, white);
}
.intake-start .intake-card .frage > legend {
  float: left;
  width: 100%;
  padding: 0;
  margin: 0 0 12px;
  color: var(--frage-ink);
}
.intake-start .intake-card .frage > legend + * { clear: both; }
.intake-start .intake-quick .wahl,
.praxis-checkout .wahl {
  min-height: 56px;
  padding: 14px 16px;
  border: 1px solid color-mix(in srgb, var(--frage-akzent) 32%, white);
  border-radius: 14px;
  background: white;
  color: var(--frage-ink);
  transition: border-color .15s, background-color .15s;
}
.intake-start .intake-quick .wahl:hover,
.praxis-checkout .wahl:hover { border-color: var(--frage-akzent); }
.intake-start .wahl:has(input:checked),
.praxis-checkout .wahl:has(input:checked) {
  border-color: var(--frage-akzent);
  background: color-mix(in srgb, var(--frage-akzent) 12%, white);
  color: var(--frage-ink);
  box-shadow: inset 0 0 0 1px var(--frage-akzent);
}
.intake-start .wahl:has(input:focus-visible),
.praxis-checkout .wahl:has(input:focus-visible) { outline: 2px solid var(--frage-akzent); outline-offset: 3px; }
.intake-start .intake-card input:is([type=radio], [type=checkbox]) { accent-color: var(--frage-akzent); }
.intake-start .intake-card :is(input:not([type=radio]):not([type=checkbox]), textarea, select) {
  border-color: color-mix(in srgb, var(--frage-akzent) 38%, white);
  border-radius: 12px;
  font-size: 1rem;
}
.intake-start .intake-card :is(input, textarea, select):focus-visible {
  outline: 2px solid var(--frage-akzent);
  outline-offset: 3px;
}
/* Alle Skalenwerte haben dieselbe Farbe: kein Urteil über die Antwort. */
.intake-einfach .intake-scale .wahl {
  min-height: 48px;
  border-color: color-mix(in srgb, var(--frage-akzent) 32%, white);
  background: white;
  color: var(--frage-ink);
}
.intake-einfach .intake-scale .wahl:has(input:checked) {
  color: var(--frage-ink);
  background: color-mix(in srgb, var(--frage-akzent) 18%, white);
  border-color: var(--frage-akzent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--frage-akzent) 20%, transparent);
}
.intake-start .journey-actions .knopf.is-ready:not(:disabled) { animation: none; }
.praxis-checkout {
  padding: 24px;
  border: 1px solid color-mix(in srgb, var(--frage-lila) 28%, white);
  border-radius: 22px;
  background: linear-gradient(130deg, var(--frage-nebel), white 70%);
  color: var(--frage-ink);
}
@media (max-width: 560px) {
  .intake-start .intake-card .frage { padding: 14px 12px; }
  .intake-start .intake-quick .wahl { padding: 13px 12px; }
  .praxis-checkout { padding: 18px 15px; }
}
@media (prefers-reduced-motion: reduce) {
  .intake-start .wahl, .praxis-checkout .wahl { transition: none; }
}
@media (forced-colors: active) {
  .intake-start :is(.intake-card, .journey-compass, .frage), .praxis-checkout { background: Canvas; border-color: CanvasText; }
  .intake-start .wahl, .praxis-checkout .wahl { color: CanvasText; background: Canvas; border-color: ButtonText; }
  .intake-start .wahl:has(input:checked), .praxis-checkout .wahl:has(input:checked) { color: HighlightText; background: Highlight; outline: 2px solid Highlight; }
  .intake-start .wahl:has(input:focus-visible), .praxis-checkout .wahl:has(input:focus-visible) { outline-color: Highlight; }
}

/* Medikationsbogen verwendet bestehende eigene Namen und ARIA-Wahlbuttons.
   Dieser Adapter ändert keine Fragen, Felder oder JavaScript-Zustände. */
.medication-request, .medication-compass, .pr-checkout {
  --frage-ink: var(--ink, #2a3540);
  --frage-lila: var(--link, #7465c0);
  --frage-blau: #2848a0;
  --frage-gold: #96742a;
  --frage-gruen: #386848;
  --frage-akzent: var(--frage-lila);
  --frage-nebel: var(--wash, #eeeaf4);
  --frage-rund: 18px;
}
.medication-request .intake-card[data-medication-step="0"],
.medication-compass li:nth-child(1) { --frage-akzent: var(--frage-lila); --frage-nebel: #eeeaf4; }
.medication-request .intake-card[data-medication-step="1"],
.medication-compass li:nth-child(2) { --frage-akzent: var(--frage-blau); --frage-nebel: #e4eef8; }
.medication-request .intake-card[data-medication-step="2"],
.medication-compass li:nth-child(3) { --frage-akzent: var(--frage-gold); --frage-nebel: #f8f4e0; }
.medication-request .intake-card[data-medication-step="3"],
.medication-compass li:nth-child(4) { --frage-akzent: var(--frage-gruen); --frage-nebel: #e8f4ec; }
.medication-compass {
  padding: 18px;
  border: 1px solid color-mix(in srgb, var(--frage-lila) 24%, white);
  border-radius: 22px;
  background: linear-gradient(115deg, #eeeaf4, #f8f4e0 54%, #e8f4ec);
}
.medication-compass button {
  color: var(--frage-ink);
  border-color: color-mix(in srgb, var(--frage-akzent) 32%, white);
  background: white;
}
.medication-compass button[aria-current="step"] {
  border-color: var(--frage-akzent);
  background: color-mix(in srgb, var(--frage-akzent) 12%, white);
}
.medication-request .intake-card {
  border-color: color-mix(in srgb, var(--frage-akzent) 28%, white);
  background: linear-gradient(150deg, color-mix(in srgb, var(--frage-nebel) 72%, white), white 52%);
  box-shadow: 0 8px 28px #2a354008;
}
.medication-request .intake-card .medication-field {
  padding: 16px;
  border: 0;
  border-radius: 18px;
  background: color-mix(in srgb, var(--frage-nebel) 45%, white);
}
.medication-request .medication-choice {
  border-color: color-mix(in srgb, var(--frage-akzent) 32%, white);
  color: var(--frage-ink);
}
.medication-request .medication-choice[aria-pressed="true"] {
  border-color: var(--frage-akzent);
  background: color-mix(in srgb, var(--frage-akzent) 12%, white);
  box-shadow: inset 0 0 0 1px var(--frage-akzent);
}
.medication-request .medication-choice[aria-pressed="true"]::before {
  border-color: var(--frage-akzent); background: var(--frage-akzent);
}
.medication-request :focus-visible, .medication-compass :focus-visible {
  outline: 2px solid var(--frage-akzent); outline-offset: 3px;
}
/* Gleiche Auswahlfarbe unabhängig vom Inhalt der Antwort. */
.intake-start .intake-quick .wahl:has(input:checked) {
  border-color: var(--frage-akzent);
  background: color-mix(in srgb, var(--frage-akzent) 12%, white);
  color: var(--frage-ink);
}
.intake-einfach .intake-scale .wahl:has(input:focus-visible) {
  outline: 2px solid var(--frage-akzent); outline-offset: 3px;
}
/* Fehler bleiben sichtbar, auch nach der gemeinsamen Feldgestaltung. */
.intake-start .intake-card :is(input:not([type=radio]):not([type=checkbox]), textarea, select)[aria-invalid=true] {
  border: 2px solid #8a303c; background: #fff5f5;
}
@media (max-width: 560px) {
  .intake-start .intake-contact-grid { grid-template-columns: minmax(0, 1fr); }
  .intake-start .intake-contact-grid .frage { padding: 10px 12px; }
  .medication-request .intake-card .medication-field { padding: 14px 12px; }
  .medication-compass { padding: 16px 12px; }
}
/* Systemfarben haben ausdrücklich Vorrang vor Akzenten und Mischflächen. */
@media (forced-colors: active) {
  .intake-start :is(.intake-card, .journey-compass, .frage),
  .medication-request :is(.intake-card, .medication-field),
  .medication-compass, .praxis-checkout, .pr-checkout {
    background: Canvas !important; color: CanvasText !important;
    border-color: CanvasText !important;
  }
  .intake-start .wahl, .medication-request .medication-choice,
  .medication-compass button {
    background: Canvas !important; color: CanvasText !important;
    border-color: ButtonText !important;
  }
  .intake-start .wahl:has(input:checked),
  .medication-request .medication-choice[aria-pressed="true"],
  .medication-compass button[aria-current="step"] {
    background: Highlight !important; color: HighlightText !important;
    outline: 2px solid Highlight;
  }
  .intake-start .wahl:has(input:focus-visible),
  .medication-request :focus-visible, .medication-compass :focus-visible {
    outline-color: Highlight;
  }
}

/* Bestehender öffentlicher Ausweisbogen: dieselbe Gestaltung, gleiche Felder. */
.praxis-form { --frage-akzent: #564596; --frage-ink: #2a3540; }
.praxis-form form.bogen { max-width: 76ch; margin-inline: auto; }
.praxis-form .frage {
  min-width: 0; padding: 18px; margin-block: 16px;
  border: 1px solid #d8d0e4; border-radius: 18px; background: #f6f3fa;
}
.praxis-form .frage legend { float: left; width: 100%; padding: 0; margin-bottom: 12px; font-weight: 600; color: var(--frage-ink); }
.praxis-form .frage > :not(legend) { clear: both; }
.praxis-form .frage :is(input:not([type=checkbox]):not([type=radio]), textarea) {
  width: 100%; min-width: 0; max-width: 100%; min-height: 48px;
  border: 1px solid #b5a9d0; border-radius: 12px; padding: 12px;
  font: inherit; font-size: 1rem; background: white; color: var(--frage-ink);
}
.praxis-form .frage :is(input,textarea):focus-visible { outline: 2px solid var(--frage-akzent); outline-offset: 3px; }
.praxis-form .senden .knopf { width: 100%; min-height: 50px; border-radius: 14px; }
.praxis-form .senden .knopf:focus-visible { outline: 3px solid #2848a0; outline-offset: 3px; }
.praxis-form .frage :is(input,textarea)[aria-invalid=true] { border: 2px solid #8a303c; background: #fff5f5; }
@media (forced-colors: active) {
  .praxis-form .frage { background: Canvas !important; color: CanvasText !important; border-color: CanvasText !important; }
}
