/* Standard CRM primary sections. Opt in by semantic purpose, never by card shape.
   heading/body markers keep nested panels, widgets, media and helpers unchanged. */
:root {
  --crm-primary-section-padding: 20px;
  --crm-primary-section-gap: 16px;
  --crm-primary-section-card-gap: 30px;
}
.ui-primary-section {
  padding: var(--crm-primary-section-padding) !important;
}
.ui-primary-section--roomy { --crm-primary-section-padding: 24px; }
@media (min-width: 768px) {
  .ui-primary-section--spacious { --crm-primary-section-padding: 32px; }
}
.ui-primary-section .ui-primary-section-heading {
  font-size: 18px;
  font-weight: 600;
  line-height: 24px;
}
.crm-layout-main .ui-primary-section > .ui-primary-section-body,
.crm-layout-main .ui-primary-section > .ui-primary-section-disclosure > .ui-primary-section-body {
  margin-top: var(--crm-primary-section-gap);
}
.crm-layout-main .ui-primary-section > .ui-primary-section-header {
  margin-bottom: 0;
}
/* Explicit page flows skip asset tags without touching unrelated form/UI elements. */
.crm-layout-main .ui-primary-section-flow > :is(.ui-primary-section, .ui-primary-section-grid, .ui-primary-section-frame) {
  margin-top: var(--crm-primary-section-card-gap);
  margin-bottom: 0;
}
.crm-layout-main .ui-primary-section-frame > .ui-primary-section {
  margin-top: 0;
  margin-bottom: 0;
}
/* Replace existing sibling margins; include explicit primary-card layout groups. */
.crm-layout-main :is(.ui-primary-section, .ui-primary-section-grid, .ui-primary-section-frame) + :is(.ui-primary-section, .ui-primary-section-grid, .ui-primary-section-frame) {
  margin-top: var(--crm-primary-section-card-gap);
  margin-bottom: 0;
}
/* Row gaps control stacked cards; horizontal grid spacing remains deliberate. */
.crm-layout-main .ui-primary-section-grid { row-gap: var(--crm-primary-section-card-gap); }
.crm-layout-main .ui-primary-section-grid > .ui-primary-section {
  margin-top: 0;
  margin-bottom: 0;
}
/* Collapsible headers/body share the inset but retain native details behavior. */
.ui-primary-section.ui-primary-section--collapsible {
  padding: 0 !important;
}
.ui-primary-section--collapsible > summary {
  padding: var(--crm-primary-section-padding);
}
.ui-primary-section--collapsible[open] > summary {
  padding-bottom: var(--crm-primary-section-gap);
}
.crm-layout-main .ui-primary-section--collapsible > .ui-primary-section-body {
  margin-top: 0;
  padding: 0 var(--crm-primary-section-padding) var(--crm-primary-section-padding);
}
.ui-primary-section--collapsible > .ui-primary-section-body > :first-child {
  margin-top: 0;
}
@media (max-width: 767px) {
  .ui-primary-section { --crm-primary-section-padding: 16px; }
}
