/* Shared spacing for form fields, action rows and sections across platform screens. */
:root {
  --q-form-gap: clamp(16px, 1.25vw, 24px);
  --q-form-section-gap: clamp(20px, 1.65vw, 30px);
  --q-action-gap: 12px;
  --q-action-hit: 44px;
}

:root body :is(
  .modal-actions,.dialog-actions,.record-actions,.record-save-bar,.approval-actions,
  .asset-workflow-actions,.communication-actions,.war-room-actions,.so-actions,
  .vm-actions,.platform-actions,.plan-actions,.intel-actions,.recent-mfa-actions,
  .session-control-toolbar,.filter-actions,.enterprise-toolbar,.op-toolbar,
  .so-toolbar,.vm-toolbar,.dc-toolbar,.dc-controls,.ex-table-toolbar,.ex-hero-actions,
  .collaboration-compose-footer,.chat-workflow-actions
) {
  gap: var(--q-action-gap);
  flex-wrap: wrap;
  min-inline-size: 0;
}

:root body :is(.modal-actions,.dialog-actions,.record-actions,.record-save-bar,
  .approval-actions,.asset-workflow-actions,.communication-actions,.war-room-actions,
  .so-actions,.vm-actions,.platform-actions,.plan-actions,.intel-actions,
  .recent-mfa-actions,.enterprise-toolbar,.chat-workflow-actions,.filter-actions)
  > :is(button,a:not([role=tab])):not(.icon-button) {
  min-block-size: var(--q-action-hit);
  max-inline-size: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
}

:root body :is(.form-grid,.structured-form,.portal-form-row,.so-form-grid,
  .dc-form-grid,.vm-form-grid,.op-form-grid,.ex-form-grid,.credential-field-grid,
  .sla-fields,.identity-provider-form-body,.user-form-section,.workplace-suite .workplace-form) {
  gap: var(--q-form-gap);
  min-inline-size: 0;
}
:root body :is(.structured-form,.record-page form,.sla-editor form,.portal-dialog form,
  .signin-card form,.login-card form,.login-panel form) {
  row-gap: var(--q-form-section-gap);
}
:root body :is(.form-field,.portal-dialog form label,.sla-editor form label,
  .identity-provider-form-body label,.user-form-section label,.workplace-suite .workplace-field) {
  row-gap: 8px;
  min-inline-size: 0;
}
:root body :is(.form-section,.config-section,.user-form-section) > :is(h2,h3,h4) {
  margin-block-end: 12px;
}
:root body :is(.record-page .section-intro,.modal-header,.portal-dialog .dialog-header) {
  margin-block-end: var(--q-form-gap);
}
:root body :is(.portal-dialog,.sla-editor,.so-form-grid,.dc-form-grid,.vm-form-grid,
  .op-form-grid,.form-section,.config-section,.user-form-section,.provider-fields)
  :is(input:not([type=checkbox],[type=radio],[type=hidden],[type=range],[type=color]),select,textarea) {
  min-inline-size: 0;
  max-inline-size: 100%;
}
:root body :is(.record-save-bar,.portal-dialog .dialog-actions,.recent-mfa-actions) {
  padding-block: 12px;
}

:root body :is(form,dialog) :where(div,footer):has(> button + button):not(
  [role],.row-actions,.top-actions,.portal-header-actions,.platform-tabs,.record-tab-strip,
  .modal-header,.dc-spatial-toolbar,.dc-spatial-toolbar *,[data-compact-actions],
  .reference-picker,.reference-picker *,.ref-picker,.ref-picker *,.segmented,.chip-list
) > button + button {
  margin-inline-start: 0;
}

/* Legacy inline actions have no wrapper class. Space only groups made up of
   buttons/links inside forms and dialogs, leaving labeled inputs in their grids. */
:root body :is(form,dialog) :where(div,footer):has(> button + button):not(
  :has(> :not(button,a,span[role=status])),[role],.row-actions,.top-actions,
  .portal-header-actions,.platform-tabs,.record-tab-strip,.modal-header,
  .dc-spatial-toolbar,.dc-spatial-toolbar *,[data-compact-actions],
  .reference-picker,.reference-picker *,.ref-picker,.ref-picker *,.segmented,.chip-list
) {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--q-action-gap);
}

/* Shared record layouts previously hard-coded dense gaps with !important. */
:root body.agent-experience .record-tab-panel,
:root body.agent-experience .record-tab-panel .form-grid {
  gap: var(--q-form-gap) !important;
}
:root body.agent-experience .record-tab-panel {
  padding: clamp(16px, 1.4vw, 24px) !important;
}
:root body.agent-experience .record-tab-panel .form-section {
  padding: clamp(16px, 1.4vw, 24px) !important;
}

@media (max-width: 600px) {
  :root { --q-form-gap: 16px; --q-form-section-gap: 20px; --q-action-gap: 10px; }
  :root body :is(.record-actions,.dialog-actions,.modal-actions,.platform-actions) {
    row-gap: var(--q-action-gap);
  }
  :root body :is(.modal-actions,.dialog-actions,.record-save-bar) > [role=status] {
    flex-basis: 100%;
  }
}