/*
 * UI Governance runtime control plane.
 * The server emits only schema-validated variables and policy attributes.
 * Every selector remains opt-in through the Design System runtime body class.
 */
@layer governance-runtime {
  body.hrc-ui-governance-runtime {
    --hrc-runtime-page-padding: clamp(
      var(--hrc-mobile-padding, 14px),
      2vw,
      var(--hrc-desktop-padding, 28px)
    );
    --hrc-runtime-card-padding-base: var(--hrc-card-padding, 24px);
    --hrc-runtime-card-padding: var(--hrc-runtime-card-padding-base);
    --hrc-runtime-radius: var(--hrc-radius, 12px);
    --hrc-runtime-control-background: var(--hrc-color-surface);
    --hrc-runtime-control-border: var(--hrc-color-border-strong);
    --hrc-runtime-card-background: var(--hrc-color-surface);
    --hrc-runtime-card-backdrop: none;
    --hrc-runtime-card-shadow: var(--hrc-shadow-xs);
    --hrc-runtime-primary-background: linear-gradient(
      120deg,
      var(--hrc-primary),
      var(--hrc-secondary, var(--hrc-purple-500, var(--hrc-primary))) 62%,
      var(--hrc-success)
    );
    --hrc-runtime-primary-border: transparent;
    --hrc-runtime-primary-color: var(--hrc-neutral-0);
  }

  body.hrc-ui-governance-runtime .qm-content {
    container: hrc-governance-content / inline-size;
    width: 100%;
    max-width: var(--hrc-content-max-width, 1600px);
    margin-inline: auto;
    padding-inline: var(--hrc-runtime-page-padding);
  }

  body.hrc-ui-governance-runtime[data-ui-content-width="contained"] .qm-content {
    max-width: 1280px;
  }

  body.hrc-ui-governance-runtime[data-ui-content-width="fluid"] .qm-content {
    width: 100%;
  }

  body.hrc-ui-governance-runtime :is(
    .hrc-card,
    .panel,
    .finance-filter,
    .finance-ai,
    .kpi-card,
    .stat-card
  ) {
    border-color: color-mix(in srgb, var(--hrc-primary) 16%, var(--hrc-color-border));
    border-radius: var(--hrc-radius, 12px);
    background: var(--hrc-runtime-card-background);
    box-shadow: var(--hrc-runtime-card-shadow);
    backdrop-filter: var(--hrc-runtime-card-backdrop);
  }

  body.hrc-ui-governance-runtime :is(.hrc-card__body, .panel-body) {
    padding: var(--hrc-runtime-card-padding);
  }

  body.hrc-ui-governance-runtime[data-ui-card-policy="acrylic-light"] {
    --hrc-runtime-card-background: color-mix(
      in srgb,
      var(--hrc-color-surface) var(--hrc-acrylic-surface-mix, 92%),
      var(--hrc-primary)
    );
    --hrc-runtime-card-backdrop: blur(var(--hrc-acrylic-blur, 10px));
  }

  body.hrc-ui-governance-runtime[data-ui-card-policy="flat"] {
    --hrc-runtime-card-shadow: none;
  }

  body.hrc-ui-governance-runtime[data-ui-card-policy="elevated"] {
    --hrc-runtime-card-shadow: var(--hrc-shadow-md);
  }

  body.hrc-ui-governance-runtime .grid-2,
  body.hrc-ui-governance-runtime .grid-3,
  body.hrc-ui-governance-runtime [class*="accounting-overview-"] {
    gap: var(--hrc-card-gap, 20px);
  }

  body.hrc-ui-governance-runtime .hrc-btn,
  body.hrc-ui-governance-runtime .btn {
    min-height: max(var(--hrc-control-height, 42px), var(--hrc-touch-target, 44px));
    border-radius: var(--hrc-radius-control, var(--hrc-runtime-radius));
  }

  body.hrc-ui-governance-runtime .form-control,
  body.hrc-ui-governance-runtime .form-select {
    min-height: max(var(--hrc-control-height, 44px), var(--hrc-touch-target, 44px));
    border-color: var(--hrc-runtime-control-border);
    border-radius: var(--hrc-radius-control, var(--hrc-runtime-radius));
    background-color: var(--hrc-runtime-control-background);
  }

  body.hrc-ui-governance-runtime[data-ui-density="compact"] {
    /* Compact changes internal spacing, never the interactive hit box. */
    --hrc-control-height: 44px;
    --hrc-runtime-card-padding: max(12px, calc(var(--hrc-runtime-card-padding-base) - 6px));
  }

  body.hrc-ui-governance-runtime[data-ui-density="comfortable"] {
    --hrc-control-height: 44px;
    --hrc-runtime-card-padding: min(36px, calc(var(--hrc-runtime-card-padding-base) + 4px));
  }

  body.hrc-ui-governance-runtime[data-ui-button-policy="solid"] {
    --hrc-runtime-primary-background: var(--hrc-primary);
    --hrc-runtime-primary-border: var(--hrc-primary);
  }

  body.hrc-ui-governance-runtime[data-ui-button-policy="outline"] {
    --hrc-runtime-primary-background: transparent;
    --hrc-runtime-primary-border: var(--hrc-primary);
    --hrc-runtime-primary-color: var(--hrc-primary);
  }

  body.hrc-ui-governance-runtime :is(
    .hrc-btn--primary,
    .btn-primary,
    .finance-filter-submit
  ) {
    border-color: var(--hrc-runtime-primary-border);
    background: var(--hrc-runtime-primary-background);
    color: var(--hrc-runtime-primary-color);
  }

  body.hrc-ui-governance-runtime[data-ui-form-policy="filled"] {
    --hrc-runtime-control-background: var(--hrc-color-surface-soft);
    --hrc-runtime-control-border: transparent;
  }

  body.hrc-ui-governance-runtime[data-ui-table-policy="compact"] :is(
    .hrc-table,
    .table
  ) > :not(caption) > * > * {
    padding-block: var(--hrc-space-2);
  }

  body.hrc-ui-governance-runtime[data-ui-modal-policy="drawer"] :is(
    .modal-dialog,
    .hrc-modal__dialog
  ) {
    width: 92vw;
    max-width: 560px;
    min-height: 100dvh;
    margin: 0 0 0 auto;
  }

  body.hrc-ui-governance-runtime[data-ui-navigation-policy="scroll"] .hrc-tabs,
  body.hrc-ui-governance-runtime[data-ui-navigation-policy="scroll"] .qm-horizontal-nav {
    flex-wrap: nowrap;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
  }

  body.hrc-ui-governance-runtime[data-ui-navigation-policy="wrap"] .hrc-tabs,
  body.hrc-ui-governance-runtime[data-ui-navigation-policy="wrap"] .qm-horizontal-nav {
    flex-wrap: wrap;
  }

  body.hrc-ui-governance-runtime .table-responsive {
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
  }

  @container hrc-governance-content (max-width: 920px) {
    body.hrc-ui-governance-runtime :is(.grid-3, .accounting-overview-operations) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }

  @container hrc-governance-content (max-width: 620px) {
    body.hrc-ui-governance-runtime :is(
      .grid-2,
      .grid-3,
      .accounting-overview-charts,
      .accounting-overview-operations,
      .accounting-overview-cash-debt
    ) {
      grid-template-columns: 1fr;
      gap: var(--hrc-mobile-gap, 12px);
    }
  }
}

@media (prefers-reduced-motion: reduce) {
  body.hrc-ui-governance-runtime *,
  body.hrc-ui-governance-runtime *::before,
  body.hrc-ui-governance-runtime *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/*
 * Global semantic-color compatibility boundary.
 * This adapter is loaded after legacy route bundles and gives every shared
 * surface the same Light/Dark token contract without owning a second palette.
 */
body.hrc-design-system-v1.hrc-ui-governance-runtime {
  background: var(--color-surface-canvas);
  color: var(--color-text-primary);
}

body.hrc-design-system-v1.hrc-ui-governance-runtime .qm-content :is(
  .hrc-surface,
  .hrc-card,
  .hrc-kpi,
  .hrc-filter-panel,
  .hrc-form-section,
  .hrc-table-scroll,
  .ui-card,
  .ui-toolbar,
  .ui-tabs,
  .ui-toc,
  .card,
  .panel,
  .modal-content,
  .dropdown-menu
) {
  border-color: var(--color-border-default) !important;
  background-color: var(--color-surface-primary) !important;
  color: var(--color-text-primary) !important;
}

body.hrc-design-system-v1.hrc-ui-governance-runtime .qm-content :is(
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  .hrc-kpi__value,
  .hrc-card__title,
  .card-title,
  .modal-title
) {
  color: var(--color-text-primary) !important;
}

body.hrc-design-system-v1.hrc-ui-governance-runtime .qm-content :is(
  p:not(.ui-hero__description),
  small,
  label,
  .form-label,
  .hrc-field__label,
  .hrc-kpi__label,
  .hrc-kpi__meta,
  .hrc-card__meta,
  .text-muted
) {
  color: var(--color-text-muted) !important;
}

body.hrc-design-system-v1.hrc-ui-governance-runtime .qm-content .ui-hero .ui-hero__description {
  color: var(--color-text-secondary) !important;
}

body.hrc-design-system-v1.hrc-ui-governance-runtime .qm-content :is(
  input,
  select,
  textarea,
  .form-control,
  .form-select,
  .hrc-input,
  .hrc-select,
  .hrc-textarea
) {
  border-color: var(--color-border-strong) !important;
  background-color: var(--color-surface-primary) !important;
  color: var(--color-text-primary) !important;
}

body.hrc-design-system-v1.hrc-ui-governance-runtime .qm-content :is(
  input,
  textarea,
  .form-control,
  .hrc-input,
  .hrc-textarea
)::placeholder {
  color: var(--color-text-muted) !important;
  opacity: var(--hrc-opacity-muted);
}

body.hrc-design-system-v1.hrc-ui-governance-runtime .qm-content :is(
  a:not(.hrc-btn):not(.ui-btn):not(.btn),
  .hrc-link
) {
  color: var(--color-icon-brand) !important;
}

body.hrc-design-system-v1.hrc-ui-governance-runtime .qm-content :is(
  .hrc-icon,
  .ui-icon,
  .input-group-text
) {
  color: var(--color-icon-secondary) !important;
}

body.hrc-design-system-v1.hrc-ui-governance-runtime .qm-content :is(
  .hrc-table,
  .ui-table,
  .table
) {
  border-color: var(--color-border-default) !important;
  color: var(--color-text-primary) !important;
}

body.hrc-design-system-v1.hrc-ui-governance-runtime .qm-content :is(
  .hrc-table,
  .ui-table,
  .table
) :is(th, td) {
  border-color: var(--color-border-default) !important;
  background-color: var(--color-surface-primary) !important;
  color: var(--color-text-primary) !important;
}

body.hrc-design-system-v1.hrc-ui-governance-runtime .qm-content :is(
  .hrc-table,
  .ui-table,
  .table
) thead th {
  background-color: var(--color-surface-secondary) !important;
  color: var(--color-text-secondary) !important;
}

body.hrc-design-system-v1.hrc-ui-governance-runtime .qm-content :is(
  .hrc-badge,
  .hrc-tag,
  .hrc-status,
  .ui-badge,
  .badge,
  .pill,
  .tag,
  .status-badge,
  .label,
  .chip
) {
  border-color: var(--color-border-default) !important;
  background: var(--color-surface-secondary) !important;
  color: var(--color-icon-brand) !important;
}

body.hrc-design-system-v1.hrc-ui-governance-runtime .qm-content :is(
  .hrc-badge,
  .hrc-tag,
  .hrc-status,
  .ui-badge,
  .badge,
  .pill,
  .tag,
  .status-badge,
  .label,
  .chip
):is([data-state="success"], .bg-success, .text-bg-success, .success, .status-success) {
  border-color: var(--color-border-success) !important;
  background: var(--color-surface-success) !important;
  color: var(--color-text-success) !important;
}

body.hrc-design-system-v1.hrc-ui-governance-runtime .qm-content :is(
  .hrc-badge,
  .hrc-tag,
  .hrc-status,
  .ui-badge,
  .badge,
  .pill,
  .tag,
  .status-badge,
  .label,
  .chip
):is([data-state="warning"], .bg-warning, .text-bg-warning, .warning, .status-warning) {
  border-color: var(--color-border-warning) !important;
  background: var(--color-surface-warning) !important;
  color: var(--color-text-warning) !important;
}

body.hrc-design-system-v1.hrc-ui-governance-runtime .qm-content :is(
  .hrc-badge,
  .hrc-tag,
  .hrc-status,
  .ui-badge,
  .badge,
  .pill,
  .tag,
  .status-badge,
  .label,
  .chip
):is([data-state="error"], .bg-danger, .text-bg-danger, .danger, .status-danger, .error) {
  border-color: var(--color-border-danger) !important;
  background: var(--color-surface-danger) !important;
  color: var(--color-text-danger) !important;
}

body.hrc-design-system-v1.hrc-ui-governance-runtime .qm-content :is(
  .hrc-btn--secondary,
  .ui-btn:not(.ui-btn--primary),
  .btn:not(.btn-primary):not(.btn-danger):not(.btn-success):not(.btn-warning)
) {
  border-color: var(--color-border-default) !important;
  background: var(--color-surface-raised) !important;
  color: var(--color-text-primary) !important;
}

/*
 * Namespaced route adapter for unlayered legacy ERP assets. The component
 * contract remains in design-components.css; this late adapter only preserves
 * its semantic tokens when legacy bundles are present on governance routes.
 */

/* Light-only product policy. Dark selectors and tokens remain in source for a
 * future gated release; current theme controls never render or receive focus. */
html[data-hrc-theme-policy="light-only"] {
  color-scheme: only light;
}

html[data-hrc-theme-policy="light-only"] :is(
  [data-erp-theme-toggle],
  [data-workers-theme-toggle],
  [data-qm-theme-choice],
  [data-ui-admin-theme-preview],
  [data-ai-theme],
  [data-preview-theme="dark"],
  .ai-theme-toggle,
  .public-theme-toggle
) {
  display: none;
}

body.hrc-design-system-v1.ui-governance-route .ui-governance-page .ui-search input {
  border-color: var(--hrc-color-border-strong);
  background: var(--hrc-color-surface);
  color: var(--hrc-color-text);
}

body.hrc-design-system-v1.ui-governance-route .ui-governance-page .hrc-btn--primary-cta,
body.hrc-design-system-v1.ui-governance-route .ui-governance-page .hrc-btn--primary-cta:is(
  :hover,
  :active,
  :disabled,
  [aria-disabled="true"],
  [data-state="disabled"],
  [data-demo-state="hover"],
  [data-demo-state="active"]
) {
  color: var(--hrc-action-cta-foreground);
}

body.hrc-design-system-v1.ui-governance-route .ui-governance-page .hrc-btn--primary-cta :where(i, svg) {
  color: currentColor;
}

body.hrc-design-system-v1.ui-governance-route .ui-governance-page .hrc-btn--primary-cta:is(
  [aria-busy="true"],
  [data-state="loading"]
) {
  color: transparent;
}

body.hrc-design-system-v1.ui-governance-route .ui-governance-page .hrc-btn--primary-cta:is(
  [aria-busy="true"],
  [data-state="loading"]
)::after {
  color: var(--hrc-action-cta-foreground);
}

/*
 * Control-plane touch contract. The unlayered ERP compatibility bundle keeps
 * 40/42px desktop controls for legacy routes. These two authenticated system
 * surfaces own a stricter 44px contract, so their late semantic adapter must
 * win that compatibility rule without changing the rest of the ERP.
 */
body.qm-erp2050.hrc-design-system-v1.hrc-ui-governance-runtime.ui-governance-route .qm-content :where(
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]):not(.ui-hidden-visually):not(.qm-hidden-original-select),
  select:not(.ui-hidden-visually):not(.qm-hidden-original-select)
) {
  min-height: max(var(--hrc-control-height, 44px), var(--hrc-touch-target, 44px)) !important;
  min-block-size: max(var(--hrc-control-height, 44px), var(--hrc-touch-target, 44px)) !important;
}

body.qm-erp2050.hrc-design-system-v1.hrc-ui-governance-runtime.ui-governance-route .qm-content :where(
  button,
  .ui-btn,
  .ui-icon-btn,
  .ui-tab,
  .ui-toc a
) {
  min-width: var(--hrc-touch-target, 44px) !important;
  min-inline-size: var(--hrc-touch-target, 44px) !important;
  min-height: max(var(--hrc-control-height, 44px), var(--hrc-touch-target, 44px)) !important;
  min-block-size: max(var(--hrc-control-height, 44px), var(--hrc-touch-target, 44px)) !important;
}

/*
 * A tiny non-zero duration can leave a CSS transition at its old presentation
 * value when an embedded browser freezes the reduced-motion timeline. Removing
 * the transition entirely makes the first theme change atomic and predictable.
 */
@media (prefers-reduced-motion: reduce) {
  body.qm-erp2050.hrc-design-system-v1.hrc-ui-governance-runtime.ui-governance-route,
  body.qm-erp2050.hrc-design-system-v1.hrc-ui-governance-runtime.ui-governance-route
  .ui-governance-page:is([data-native-surface="design-system"], [data-native-surface="ui-governance"]),
  body.qm-erp2050.hrc-design-system-v1.hrc-ui-governance-runtime.ui-governance-route
  .ui-governance-page:is([data-native-surface="design-system"], [data-native-surface="ui-governance"]) *,
  body.qm-erp2050.hrc-design-system-v1.hrc-ui-governance-runtime.ui-governance-route
  .ui-governance-page:is([data-native-surface="design-system"], [data-native-surface="ui-governance"]) *::before,
  body.qm-erp2050.hrc-design-system-v1.hrc-ui-governance-runtime.ui-governance-route
  .ui-governance-page:is([data-native-surface="design-system"], [data-native-surface="ui-governance"]) *::after {
    scroll-behavior: auto !important;
    transition: none !important;
    animation: none !important;
  }
}