/* Shared Iron controls. Presentation only: no layout, permissions or app quotas. */
:root {
  --iron-field: #151a1e;
  --iron-panel: #20262b;
  --iron-border: #626e76;
  --iron-text: #f2f4f5;
  --iron-muted: #b9c2c8;
  --iron-orange: #f45b0b;
  --iron-yellow: #ffcf00;
}

/* Keep native controls and keyboard behavior; exclude non-text input types. */
:root
  body
  :is(input, select, textarea):where(
    :not(
      [type='checkbox'],
      [type='radio'],
      [type='range'],
      [type='color'],
      [type='hidden'],
      [type='image'],
      [type='submit'],
      [type='button'],
      [type='reset']
    )
  ),
:root
  body
  :is(form, .search, .library-search, .my-library, .community-section)
  :is(input, select, textarea):where(
    :not(
      [type='checkbox'],
      [type='radio'],
      [type='range'],
      [type='color'],
      [type='hidden'],
      [type='image'],
      [type='submit'],
      [type='button'],
      [type='reset']
    )
  ),
:root #view-plans :is(input, select, textarea):where(:not([type='checkbox'])) {
  color-scheme: dark;
  background-color: var(--iron-field);
  color: var(--iron-text);
  border: 1px solid var(--iron-border);
  border-radius: 3px;
  box-shadow: inset 0 1px 3px #0003;
  caret-color: var(--iron-yellow);
  min-height: 44px;
}
:root body :is(input, textarea)::placeholder {
  color: #aeb8bf;
  opacity: 1;
}
:root body select {
  padding-right: 36px;
}
:root body :is(option, optgroup) {
  background: var(--iron-field);
  color: var(--iron-text);
}
:root body :is(input, select, textarea):focus-visible,
:root #view-plans :is(input, select, textarea):focus-visible {
  border-color: var(--iron-orange);
  outline: 2px solid var(--iron-yellow);
  outline-offset: 3px;
}
:root body :is(input, select, textarea)[aria-invalid='true'] {
  border-color: #ff9c86;
}
:root body :is(input, select, textarea):disabled,
:root #view-plans :is(input, select, textarea):disabled {
  background: #292f34;
  color: #a5afb6;
  border-color: #515b63;
  cursor: not-allowed;
}
:root body input:read-only:not([type='checkbox'], [type='radio'], [type='hidden']) {
  border-style: dashed;
}
:root body input:autofill {
  box-shadow: inset 0 0 0 100px var(--iron-field);
  -webkit-text-fill-color: var(--iron-text);
  caret-color: var(--iron-yellow);
}
:root body input:-webkit-autofill {
  box-shadow: inset 0 0 0 100px var(--iron-field);
  -webkit-text-fill-color: var(--iron-text);
  caret-color: var(--iron-yellow);
}
:root body input:is([type='checkbox'], [type='radio']) {
  color-scheme: dark;
  accent-color: var(--iron-orange);
  flex-shrink: 0;
}
:root body input::file-selector-button {
  background: #303a41;
  color: var(--iron-text);
  border: 1px solid #7a8790;
  border-radius: 2px;
  padding: 9px 12px;
  margin-right: 12px;
  cursor: pointer;
}

/* Native-looking buttons were most visible in dynamically loaded account tools. */
:root
  :is(
    .my-library,
    .cloud-project,
    .resource-files,
    .release-list,
    .admin-filters,
    .library-filters,
    .customer-search,
    .software-license-form,
    .community-section,
    .iron-message-actions,
    .account-file-list
  )
  button:where(:not(.primary-button, .danger-button, .submit, .iron-message-confirm)),
:root .secondary-button,
:root .danger-button {
  background: var(--iron-panel);
  color: var(--iron-text);
  border: 1px solid var(--iron-border);
  border-radius: 3px;
  min-height: 44px;
  padding: 11px 15px;
  font-family: inherit;
  cursor: pointer;
}
:root
  :is(
    .auth-form,
    .production-login,
    .password-form,
    .mfa-form,
    .profile-form,
    .cad-consent-form,
    .software-license-form
  )
  button[type='submit'],
:root .primary-button,
:root .submit,
:root :is(.admin-filters, .library-filters) button.active,
:root .iron-message-actions .iron-message-confirm {
  background: var(--iron-yellow);
  color: #111315;
  border: 1px solid var(--iron-yellow);
  min-height: 44px;
  border-radius: 3px;
}
:root .danger-button {
  border-color: #fa9b87;
  color: #ffb8a8;
}
:root body :is(button, summary):focus-visible {
  outline: 2px solid var(--iron-yellow);
  outline-offset: 3px;
}
:root body button:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}
@media (hover: hover) {
  :root
    :is(
      .my-library,
      .resource-files,
      .release-list,
      .admin-filters,
      .library-filters,
      .community-section,
      .iron-message-actions
    )
    button:enabled:hover:where(
      :not(.primary-button, .danger-button, .submit, .iron-message-confirm)
    ),
  :root .secondary-button:enabled:hover {
    border-color: var(--iron-orange);
    background: #303a41;
    color: var(--iron-text);
  }
  :root .primary-button:enabled:hover,
  :root .submit:enabled:hover,
  :root .iron-message-actions .iron-message-confirm:enabled:hover {
    background: var(--iron-orange);
    border-color: var(--iron-orange);
    color: #111315;
  }
}

/* Dark form surfaces replace unrelated white boxes, without moving sections. */
:root
  :is(
    .auth-card,
    .production-login,
    .password-form,
    .mfa-form,
    .preview-access,
    .activation-status,
    .mfa-enrollment,
    .cad-consent-panel,
    .software-license-form,
    .cloud-project details
  ),
:root #view-plans .plan-panel {
  background: var(--iron-panel);
  color: var(--iron-text);
  border-color: var(--iron-border);
  box-shadow: none;
  color-scheme: dark;
}
:root #view-plans .plan-panel {
  border-top-color: var(--iron-orange);
}
:root .my-library > div > button {
  margin: 4px 8px 4px 0;
}
:root
  :is(
    .auth-card,
    .preview-access,
    .activation-status,
    .mfa-enrollment,
    .cad-consent-panel,
    .software-license-form,
    .cloud-project details,
    .production-login,
    .password-form,
    .mfa-form
  )
  :is(p, small, label, .consent span),
:root #view-plans .plan-panel :is(p, li, label) {
  color: var(--iron-muted);
}
:root :is(.auth-card, .cad-consent-panel, .cloud-project details) a {
  color: var(--iron-yellow);
}
:root .auth-tabs button {
  background: var(--iron-field);
  color: var(--iron-muted);
  border-bottom-color: var(--iron-border);
  min-height: 44px;
}
:root .auth-tabs button.active {
  background: var(--iron-panel);
  color: var(--iron-yellow);
  border-bottom: 2px solid var(--iron-orange);
}
:root .auth-card .text-button {
  color: var(--iron-muted);
}
:root :is(.library-search, .search) {
  background: var(--iron-field);
  border-color: var(--iron-border);
  color: var(--iron-text);
}
:root :is(.community-item, .cloud-project, .mfa-enrollment) summary {
  background: var(--iron-field);
  color: var(--iron-yellow);
  border: 1px solid var(--iron-border);
  border-radius: 3px;
  padding: 12px;
  min-height: 44px;
  cursor: pointer;
}
:root .mfa-secret {
  background: var(--iron-field);
  color: var(--iron-text);
}
/* QR codes deliberately retain their white quiet zone for camera recognition. */
:root .mfa-qr {
  background: #fff;
  color-scheme: light;
}
:root :is(.auth-card, .activation-status) :is(.error, .auth-status.error) {
  color: #ffb8a8;
}
:root :is(.auth-card, .activation-status) :is(.success, .auth-status.success) {
  color: #95e0b2;
}

@media (forced-colors: active) {
  :root body :is(input, select, textarea, button, summary) {
    forced-color-adjust: auto;
    box-shadow: none;
  }
}
@media print {
  :root .claim-receipt {
    background: #fff;
    color: #000;
  }
}