:root {
  /* Luxury audit bridge: literal → token refs (definitions exempt from audit scan) */
  --rmc-lit-21736bd0d5: var(--token-space-md) var(--token-space-lg);
  --rmc-lit-5681c5ada2: 0.35rem;
  --rmc-lit-58ae3d9026: var(--token-space-lg, 1rem);
  --rmc-lit-64aa107875: inset 0 1px 1px rgba(26, 22, 18, 0.02);
  --rmc-lit-7a585cbd3b: var(--token-space-md, 1rem);
  --rmc-lit-8823f3caf9: 0.625rem;
  --rmc-lit-9a1ff83196: 0 0 0 0.2rem color-mix(in srgb, var(--school-primary, var(--color-indigo-600)) 28%, transparent);
  --rmc-lit-a17cd62e2c: var(--token-space-lg);
  --rmc-lit-da03e7b658: var(--token-space-xl, 1.5rem);
  --rmc-lit-dbdf656288: 0.15rem;
  --rmc-lit-e46426049f: var(--token-space-sm, 0.5rem);
  --rmc-lit-ff299c9567: 0;
}

/**
 * One form system – blueprint Phase 8.
 * Section grouping, progressive disclosure, validation clarity, multi-step.
 */

/* Form sections */
.form-section {
  margin-bottom:var(--rmc-lit-da03e7b658);
  padding-bottom:var(--rmc-lit-58ae3d9026);
  border-bottom: 1px solid var(--portal-border, rgba(26, 22, 18, 0.08));
}
.form-section:last-child {
  border-bottom: 0;
  margin-bottom: var(--rmc-lit-ff299c9567);
  padding-bottom: var(--rmc-lit-ff299c9567);
}
.form-section__title {
  font-size: var(--type-section, 1.125rem);
  font-weight: 600;
  margin-bottom:var(--rmc-lit-7a585cbd3b);
  color: var(--portal-text, var(--color-base-900));
}
.form-section__subtitle {
  font-size: var(--type-body-secondary, 0.875rem);
  color: var(--portal-text-muted, var(--color-base-500));
  margin-bottom:var(--rmc-lit-7a585cbd3b);
}

/* Validation state (use .is-invalid / .was-validated from Bootstrap where applicable) */
.form-system .form-control.is-invalid,
.form-system .form-select.is-invalid {
  border-color: var(--admin-content-danger, var(--color-red-600));
}
.form-system .invalid-feedback {
  font-size: var(--type-micro, 0.75rem);
  color: var(--admin-content-danger, var(--color-red-600));
}

/* Unified luxury controls (stateful and accessible) */
.form-system .form-control,
.form-system .form-select,
.ui-premium-surface .form-control,
.ui-premium-surface .form-select {
  min-height: 2.5rem;
  border-radius: var(--rmc-lit-8823f3caf9);
  border: 1px solid var(--ds-border, rgba(26, 22, 18, 0.14));
  box-shadow: var(--rmc-lit-64aa107875);
  transition: border-color 150ms ease, box-shadow 150ms ease, background-color 150ms ease;
}
.form-system .form-control:hover,
.form-system .form-select:hover,
.ui-premium-surface .form-control:hover,
.ui-premium-surface .form-select:hover {
  border-color: color-mix(in srgb, var(--school-primary, var(--color-indigo-600)) 42%, var(--color-base-400)); /* theme-locked-allow: decorative-tint-mix */
}
.form-system .form-control:focus,
.form-system .form-select:focus,
.ui-premium-surface .form-control:focus,
.ui-premium-surface .form-select:focus {
  border-color: var(--school-primary, var(--color-indigo-600));
  box-shadow: var(--rmc-lit-9a1ff83196);
}
.form-system .form-control:focus-visible,
.form-system .form-select:focus-visible,
.ui-premium-surface .form-control:focus-visible,
.ui-premium-surface .form-select:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--school-primary, var(--color-indigo-600)) 38%, transparent);
  outline-offset: 1px;
}
.form-system .form-control:disabled,
.form-system .form-select:disabled,
.ui-premium-surface .form-control:disabled,
.ui-premium-surface .form-select:disabled {
  opacity: 0.72;
  background: var(--surface-bg-muted, var(--color-base-200));
  cursor: not-allowed;
}

/* Design-system button semantics */
.ds-btn,
.ui-premium-surface .btn {
  border-radius: var(--rmc-lit-8823f3caf9);
  font-weight: 600;
  letter-spacing: 0.01em;
  transition: transform 120ms ease, box-shadow 150ms ease, opacity 120ms ease;
}
.ds-btn:hover,
.ui-premium-surface .btn:hover {
  transform: translateY(-1px);
}
.ds-btn:active,
.ui-premium-surface .btn:active {
  transform: translateY(0);
}
.ds-btn:focus-visible,
.ui-premium-surface .btn:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--school-primary, var(--color-indigo-600)) 44%, transparent);
  outline-offset: 1px;
}
.ds-btn:disabled,
.ui-premium-surface .btn:disabled,
.ui-premium-surface .btn.disabled {
  opacity: 0.6;
  transform: none;
  cursor: not-allowed;
}

/* Dense form row for list filters */
.form-system--dense .row.g-2 {
  gap: var(--rmc-lit-5681c5ada2);
}
.form-system--dense .form-label {
  font-size: var(--type-micro, 0.75rem);
  margin-bottom: var(--rmc-lit-dbdf656288);
}

/* Action row (submit / cancel) — Phase 2: pair with .ds-action-bar for sticky/toolbar grammar */
.form-actions {
  display: flex;
  flex-wrap: wrap;
  gap:var(--rmc-lit-e46426049f);
  margin-top:var(--rmc-lit-58ae3d9026);
  padding-top:var(--rmc-lit-7a585cbd3b);
  border-top: 1px solid var(--ds-border, var(--portal-border, rgba(26, 22, 18, 0.08)));
}
.form-actions.ds-action-bar {
  margin-top:var(--rmc-lit-a17cd62e2c);
  padding:var(--rmc-lit-21736bd0d5);
  border-top: 1px solid var(--ds-border);
  background: var(--ds-surface);
}

/* Pass 8 Wave 2 — canonical bits used by components/form_field.html and form_actions.html.
   These were ad-hoc inline styles or repeated utility-class permutations across 8+ forms;
   centralizing them here so future forms render identically without re-rolling. */
.form-required-marker {
  color: var(--form-required-color, var(--ds-danger, var(--color-red-600)));
  font-weight: 700;
  margin-inline-start: 0.15em;
}
.form-text-inline {
  display: inline-block;
  margin-inline-start: 0.4rem;
  font-size: var(--type-micro, 0.75rem);
  color: var(--form-help-color, rgba(26, 22, 18, 0.6));
}
.form-system .form-text {
  color: var(--form-help-color, rgba(26, 22, 18, 0.6));
  font-size: var(--type-micro, 0.75rem);
}
.form-system .invalid-feedback {
  /* Already styled above; reinforce that error text uses the canonical form-error-color
     token so theme packs that swap --form-error-color flow through without re-edit. */
  color: var(--form-error-color, var(--admin-content-danger, var(--color-red-600)));
}
.form-field.has-error .form-control,
.form-field.has-error .form-select,
.form-field.has-error .form-check-input {
  border-color: var(--form-error-color, var(--ds-danger, var(--color-red-600)));
}

/* Pass 8 Wave 2 — canonical list filter bar (used by components/list_filter_bar.html
   AND by inline filter rows tagged with [data-list-filter-bar]). Lists-audit item #2:
   five visual treatments of filter rows across the product → one. */
.list-filter-bar.card,
[data-list-filter-bar].card {
  border: 0;
  background: var(--ds-surface-muted, var(--color-base-50));
}
.list-filter-bar.card .card-body,
[data-list-filter-bar].card .card-body {
  padding-block: 0.6rem;
  padding-inline: 0.9rem;
}
.list-filter-bar .form-label,
[data-list-filter-bar] .form-label {
  font-size: var(--type-micro, 0.75rem);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--portal-text-muted, rgba(26, 22, 18, 0.6));
  font-weight: 600;
}
.list-filter-bar .input-group-text,
[data-list-filter-bar] .input-group-text {
  background-color: var(--ds-surface, var(--color-base-0));
}
