/* Only the new presentation layer; never restyle unassigned native screens. */
.gems-member-widget { --gems-member-gap: 1rem; min-width: 0; overflow-wrap: anywhere; }
.gems-member-widget img { max-width: 100%; }
.gems-member-identity { display: flex; flex-direction: column; gap: var(--gems-member-gap); }
.gems-member-avatar img { display: block; height: auto; width: 160px; }
/* Beat Nouveau's live-directory heading margins; the flex gap owns this spacing. */
.gems-member-widget .gems-member-identity .gems-member-name { margin: 0; }
.gems-profile-fields { margin: 0; }
.gems-profile-field { margin-block-end: var(--gems-member-gap); }
.gems-profile-field dd { margin: .25rem 0 0; white-space: pre-line; }
/* Match this site's native profile defaults without its !important rules, so
   Elementor's field and group-heading controls can still override them. */
.gems-widget-fields { font-family: var(--gems-hanken, inherit); }
.gems-profile-group > h2 { font-family: var(--gems-axel, inherit); font-size: clamp(1.75rem, 1rem + 1.1vw, 2rem); font-weight: 700; color: var(--gems-deep-red, #802832); border: 0; }
.gems-profile-field dt { color: var(--gems-deep-red, #802832); font-weight: 700; }
.gems-portal-nav { display: flex; flex-wrap: wrap; gap: var(--gems-member-gap); padding: 0; }
.gems-member-widget nav ul { flex-wrap: wrap; }
.gems-native-form fieldset { min-width: 0; }
/* Native action labels must remain readable with large text in narrow columns. */
#buddypress .gems-native-form button { white-space: normal; overflow-wrap: anywhere; max-width: 100%; box-sizing: border-box; }
.gems-native-form p { margin-block-end: var(--gems-member-gap); }
.gems-form-preview label { display: block; }
.gems-form-preview input { display: block; width: 100%; }
.gems-preview-notice { padding: .75rem; border-inline-start: 3px solid currentColor; }
.gems-member-widget :focus-visible,
#buddypress .gems-member-widget :focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
.gems-member-cards .list-wrap { height: 100%; }
.gems-member-cards .elementor { width: 100%; }
/* Preview specimens never contain live forms. Keep native control types recognisable. */
.gems-form-preview .gems-preview-field { margin-block-end: 1rem; }
.gems-form-preview input[type=checkbox], .gems-form-preview input[type=radio] { display: inline-block; width: auto; }
.gems-form-preview select, .gems-form-preview textarea { display: block; width: 100%; }
.gems-form-preview fieldset { border: 0; padding: 0; margin: 0; }
.gems-form-preview :disabled { opacity: 1; cursor: default; }
.gems-payment-example { padding: 1rem; border: 1px dashed currentColor; margin-block: 1rem; }

/* The preview uses real BP wrappers/styles without running BP route controllers. */
body.gems-member-template-preview main#content > .page-header { display: none; }
.gems-preview-frame { min-width: 0; }
.gems-preview-frame > .page-header .entry-title { overflow-wrap: anywhere; }
.gems-preview-frame ul#members-list.gems-single-card-preview { grid-template-columns: minmax(0, 1fr); width: 100%; margin-inline: auto; }
.gems-preview-frame a[aria-disabled=true] { cursor: default; }
/* Inert div instead of a live form; mirror the theme's form-only layout rules. */
.gems-preview-frame #dir-members-search-form { display: flex; border: none; gap: .5rem; }
.gems-preview-frame #dir-members-search-form input { width: 100%; }
.gems-preview-frame #dir-members-search-form .dashicons-search::before { color: #fff; }
.gems-preview-frame #dir-filters { order: 3; }
.gems-preview-frame #gems-tags-filter-form { display: flex; }
.gems-preview-frame #members-order-by, .gems-preview-frame #gems-tags-dropdown { text-indent: 2px; }

/* Sidebar links point to the viewer's own account, not the profile being viewed. */
.gems-member-widget .gems-sidebar-nav ul { display: flex; flex-direction: column; gap: .375rem; margin: 0; padding: 0; list-style: none; }
.gems-member-widget .gems-sidebar-nav li { margin: 0; padding: 0; border: 0; }
.gems-sidebar-nav a, .gems-sidebar-nav span { display: block; padding: .65rem .75rem; border-radius: .5rem; text-decoration: none; line-height: 1.4; }
.gems-sidebar-nav [aria-current=page] { background: var(--gems-nav-active-background, #b1dee5); font-weight: 700; }
.gems-sidebar-nav :is(a, span):hover { background: var(--gems-nav-hover-background, #dbeef1); }

/* Outrank the theme's ul#members-list.item-list.members-list.bp-list rule.
   Otherwise Elementor updates the variables but the fixed theme grid still wins.
   Scope this to the results widget, in both editor and live/AJAX output. */
.gems-widget-directory ul#members-list.item-list.members-list.bp-list.gems-member-cards {
 display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--gems-card-min, 280px)), 1fr));
 gap: var(--gems-grid-gap, 32px); list-style: none;
}
.gems-widget-directory ul#members-list.item-list.members-list.bp-list.gems-member-cards::before { display: none; }
.gems-widget-directory ul#members-list.item-list.members-list.bp-list.gems-member-cards > li { width: auto; min-width: 0; margin: 0; float: none; }
@media (max-width: 767px) {
 .gems-member-view .gems-native-form input:not([type=checkbox]):not([type=radio]),
 .gems-member-view .gems-native-form select,
 .gems-member-view .gems-native-form textarea { max-width: 100%; box-sizing: border-box; }
 .gems-member-view .gems-native-form table { display: block; overflow-x: auto; }
}