/*
 * ALFARI Darstellungsvertrag für Plugin-Zustände.
 * Plugins liefern Semantik und Texte; das Theme liefert Kontrast, Abstände,
 * Fokus, mobile Anordnung und sichtbare Lade-/Deaktivierungszustände.
 */
:where(
  body.alfari-app-mode,
  body.alfari-member-access-page,
  body.login.alfari-account-access
){
  --alfari-ui-state-text:#202326;
  --alfari-ui-state-muted:#50585c;
  --alfari-ui-state-line:#aeb4b7;
  --alfari-ui-state-info:#315d78;
  --alfari-ui-state-success:#38691e;
  --alfari-ui-state-warning:#856313;
  --alfari-ui-state-error:#963c35;
}

:where(
  body.alfari-app-mode .alfari-app-workspace,
  body.alfari-member-access-page main,
  body.login.alfari-account-access #login
) :where(
  [data-alfari-form-feedback],
  .alfari-form-feedback,
  [data-alfari-error-summary],
  .alfari-error-summary
){
  display:grid;
  gap:8px;
  width:100%;
  min-width:0;
  margin:0 0 18px;
  padding:16px 18px;
  border:1px solid var(--alfari-ui-state-line);
  border-left:6px solid var(--alfari-ui-state-info);
  border-radius:12px;
  background:#f1f6f8;
  color:var(--alfari-ui-state-text);
  font-size:clamp(.96rem,2vw,1.05rem);
  line-height:1.55;
  overflow-wrap:anywhere;
}

:where(
  body.alfari-app-mode .alfari-app-workspace,
  body.alfari-member-access-page main,
  body.login.alfari-account-access #login
) :where(
  [data-alfari-form-feedback],
  .alfari-form-feedback,
  [data-alfari-error-summary],
  .alfari-error-summary
) :where(h2,h3,strong){
  margin:0;
  color:var(--alfari-ui-state-text);
  font-size:1.05em;
  font-weight:850;
  line-height:1.35;
}

:where(
  body.alfari-app-mode .alfari-app-workspace,
  body.alfari-member-access-page main,
  body.login.alfari-account-access #login
) :where(
  [data-alfari-form-feedback],
  .alfari-form-feedback,
  [data-alfari-error-summary],
  .alfari-error-summary
) :where(p,ul,ol){margin:0}

:where(
  body.alfari-app-mode .alfari-app-workspace,
  body.alfari-member-access-page main,
  body.login.alfari-account-access #login
) :where(
  [data-alfari-form-feedback="success"],
  .alfari-form-feedback.is-success
){border-left-color:var(--alfari-ui-state-success);background:#f2f7ee}

:where(
  body.alfari-app-mode .alfari-app-workspace,
  body.alfari-member-access-page main,
  body.login.alfari-account-access #login
) :where(
  [data-alfari-form-feedback="warning"],
  .alfari-form-feedback.is-warning
){border-left-color:var(--alfari-ui-state-warning);background:#fff8e5}

:where(
  body.alfari-app-mode .alfari-app-workspace,
  body.alfari-member-access-page main,
  body.login.alfari-account-access #login
) :where(
  [data-alfari-form-feedback="error"],
  .alfari-form-feedback.is-error,
  [data-alfari-error-summary],
  .alfari-error-summary
){border-left-color:var(--alfari-ui-state-error);background:#fff2f0}

:where(
  body.alfari-app-mode .alfari-app-workspace,
  body.alfari-member-access-page main,
  body.login.alfari-account-access #login
) :where(
  [data-alfari-error-summary],
  .alfari-error-summary
):focus{
  outline:3px solid var(--alfari-ui-state-error);
  outline-offset:3px;
}

:where(
  body.alfari-app-mode .alfari-app-workspace,
  body.alfari-member-access-page main,
  body.login.alfari-account-access #login
) :where([data-alfari-field-error],.alfari-field-error){
  display:block;
  margin:5px 0 0;
  color:#7e2924;
  font-size:.92rem;
  font-weight:750;
  line-height:1.45;
}

:where(
  body.alfari-app-mode .alfari-app-workspace,
  body.alfari-member-access-page main,
  body.login.alfari-account-access #login
) :where(input,select,textarea)[aria-invalid="true"]{
  border-color:var(--alfari-ui-state-error)!important;
  box-shadow:0 0 0 3px rgba(150,60,53,.2)!important;
}

:where(
  body.alfari-app-mode .alfari-app-workspace,
  body.alfari-member-access-page main,
  body.login.alfari-account-access #login
) :where([data-alfari-form-status],.alfari-form-status){
  display:block;
  min-height:1.4em;
  margin:8px 0 0;
  color:var(--alfari-ui-state-muted);
  font-size:.92rem;
  line-height:1.45;
}

:where(
  body.alfari-app-mode .alfari-app-workspace,
  body.alfari-member-access-page main,
  body.login.alfari-account-access #login
) [data-alfari-loading="true"]{
  cursor:progress;
}

:where(
  body.alfari-app-mode .alfari-app-workspace,
  body.alfari-member-access-page main,
  body.login.alfari-account-access #login
) :where(
  button,
  .button,
  input[type="submit"]
)[data-alfari-loading="true"]{
  position:relative;
  padding-right:3.1rem;
  opacity:.82;
}

:where(
  body.alfari-app-mode .alfari-app-workspace,
  body.alfari-member-access-page main,
  body.login.alfari-account-access #login
) :where(
  button,
  .button,
  input[type="submit"]
)[data-alfari-loading="true"]::after{
  position:absolute;
  top:50%;
  right:1.15rem;
  width:1rem;
  height:1rem;
  margin-top:-.5rem;
  border:2px solid currentColor;
  border-right-color:transparent;
  border-radius:50%;
  content:"";
  animation:alfari-ui-spin .75s linear infinite;
}

:where(
  body.alfari-app-mode .alfari-app-workspace,
  body.alfari-member-access-page main,
  body.login.alfari-account-access #login
) :where(
  button,
  .button,
  input[type="submit"],
  input[type="button"]
):disabled{
  border-color:#9ca2a5!important;
  background:#e2e4e5!important;
  color:#4e5559!important;
  cursor:not-allowed;
  opacity:1;
}

:where(
  body.alfari-app-mode .alfari-app-workspace,
  body.alfari-member-access-page main
) :where(
  [data-alfari-onboarding-actions],
  .alfari-onboarding-actions
) :where(
  [data-alfari-action="back"],
  .alfari-action-back
){
  border-color:#757c80;
  background:#fff;
  color:#2d3235;
}

@keyframes alfari-ui-spin{to{transform:rotate(360deg)}}

@media(max-width:600px){
  :where(
    body.alfari-app-mode .alfari-app-workspace,
    body.alfari-member-access-page main,
    body.login.alfari-account-access #login
  ) :where(
    [data-alfari-form-feedback],
    .alfari-form-feedback,
    [data-alfari-error-summary],
    .alfari-error-summary
  ){padding:15px 16px}

  :where(
    body.alfari-app-mode .alfari-app-workspace,
    body.alfari-member-access-page main
  ) :where(
    [data-alfari-onboarding-actions],
    .alfari-onboarding-actions,
    [data-alfari-form-actions],
    .alfari-form-actions
  ){display:grid;grid-template-columns:1fr;gap:10px}

  :where(
    body.alfari-app-mode .alfari-app-workspace,
    body.alfari-member-access-page main
  ) :where(
    [data-alfari-onboarding-actions],
    .alfari-onboarding-actions,
    [data-alfari-form-actions],
    .alfari-form-actions
  ) :where(button,.button,input[type="submit"]){width:100%;min-height:54px}
}

@media(prefers-reduced-motion:reduce){
  :where(
    body.alfari-app-mode,
    body.alfari-member-access-page,
    body.login.alfari-account-access
  ) [data-alfari-loading="true"]::after{animation-duration:1.5s}
}