/* ASUI fix-ups on top of production's CSS (loaded last). Class-only; every rule says why it exists.
   Bricks 2.x keeps its element defaults in a cascade layer, so any unlayered rule beats them. The resets below are
   wrapped in :where() (zero specificity): they undo Bricks defaults production never sets, while every production
   rule that does set the same property still wins. */

/* Elementor row: a flex ROW whose width comes from Elementor's max-width (Bricks' container is a 1100px column). */
:where(.brxe-container.elementor-container) { width: auto; flex-direction: row; align-items: normal; }

/* Elementor column and column content: flex rows that wrap (Bricks' block is a column with align-items flex-start). */
:where(.brxe-block.elementor-column) { flex-direction: row; align-items: normal; }
:where(.brxe-block.elementor-widget-wrap) { flex-direction: row; flex-wrap: wrap; align-items: normal; align-content: flex-start; }

/* Elementor section: a plain block box (Bricks' section is a centred flex column). */
:where(.brxe-section.elementor-section) { display: block; align-items: normal; }

/* Bricks element defaults production does not have: max-width 100% on divs/blocks, button gap/letter-spacing/centring. */
:where(.elementor [class*="brxe-"]) { max-width: none; }
/* Icons: Bricks sets 60px on its icon element; production's <i> inherits size and colour from a.elementor-icon. */
:where(.elementor-icon > .brxe-icon) { font-size: inherit; line-height: inherit; color: inherit; border-color: inherit; }
:where(.bricks-button.elementor-button, .bricks-button.sc_button) { column-gap: normal; row-gap: normal; letter-spacing: normal; align-items: normal; justify-content: normal; max-width: none; }

/* Entrance animations: production's Elementor JS reveals .elementor-invisible elements; asui.js does it here. */
.asui-anim:not(.animated) { visibility: hidden; }

/* Bricks' frontend-layer.min.css has one rule OUTSIDE its cascade layer:
   .wp-block-embed, .wp-block-image:not(.align*), .wp-block-table, .wp-block-video { margin-block: 1em }
   It out-specifies production's theme rule. Restore what production computes: images/videos take the theme's
   paragraph margins (healthhub __custom), embeds/tables block-library's 0 0 1em. Same selectors + one class. */
.elementor .wp-block-image:not(.alignleft):not(.aligncenter):not(.alignright):not(.alignwide):not(.alignfull),
.elementor .wp-block-video { margin-block: var(--theme-font-p_margin-top) var(--theme-font-p_margin-bottom); }
.elementor .wp-block-embed, .elementor .wp-block-table { margin-block: 0 1em; }
@media (max-width: 1279px) {   /* healthhub __responsive.css: the same list takes margin-bottom: 1em below 1280px */
	.elementor .wp-block-image:not(.alignleft):not(.aligncenter):not(.alignright):not(.alignwide):not(.alignfull),
	.elementor .wp-block-video { margin-bottom: 1em; }
}

/* Provider page: the "Sees Patients at..." city list is a loop over relation 22 (one span per location); production
   typed it as "Gilbert, Chandler". The comma separator restores that punctuation. */
.asui-loc + .asui-loc::before { content: ", "; }