:root {
  /* Mapped from extracted design tokens */
  --bx-interact-primary: #0b0b0d;
  --bx-interact-gold: #c8a25a;
  --bx-interact-danger: #e06e5c;
  --bx-interact-success: #47b881;
  --bx-interact-warning: #e0be79;
  --bx-interact-surface: #101114;
  --bx-interact-text: #f2f2f2;
  --bx-interact-muted: #9c9fa5;
  --bx-interact-border: rgba(141, 146, 153, 0.28);
  --bx-interact-danger-rgb: 224, 110, 92;
  --bx-interact-success-rgb: 71, 184, 129;
  --bx-interact-warning-rgb: 224, 190, 121;
  --bx-interact-gold-rgb: 200, 162, 90;

  /* Interaction-specific */
  --bx-interact-transition: 150ms ease;
  --bx-interact-transition-md: 250ms ease;
  --bx-interact-radius-btn: var(--bx-radius-sm, 6px);
  --bx-interact-shadow-hover: 0 4px 12px rgba(0, 0, 0, 0.25);
  --bx-interact-focus-ring: 0 0 0 2px var(--bx-interact-gold);
}

:where(.btn, .btn-bx-primary, .btn-bx-secondary, .btn-bx-danger, .btn-bx-success, .btn-bx-warning, .btn-bx-outline) {
  min-height: var(--bx-control-height, 34px);
  padding-block: var(--bx-btn-py, 0.3rem);
  padding-inline: var(--bx-btn-px, 0.7rem);
  border-radius: var(--bx-interact-radius-btn);
  line-height: var(--bx-line-height-tight, 1.3);
}

:where(.btn-bx-primary, .btn.btn-primary) {
  color: var(--bx-interact-text);
  border-color: rgba(var(--bx-interact-gold-rgb), 0.58);
  background:
    linear-gradient(135deg, rgba(var(--bx-interact-gold-rgb), 0.24), rgba(var(--bx-interact-gold-rgb), 0.045) 44%),
    var(--gradient-metal-dark, var(--bx-interact-primary));
  box-shadow: var(--shadow-gold, 0 18px 54px rgba(var(--bx-interact-gold-rgb), 0.14));
}

:where(.btn-bx-secondary, .btn.btn-ghost) {
  color: var(--color-soft-silver, var(--bx-interact-text));
  border-color: var(--bx-interact-border);
  background:
    linear-gradient(180deg, var(--surface-reflect, rgba(255, 255, 255, 0.045)), transparent),
    rgba(5, 5, 5, 0.45);
}

:where(.btn-bx-outline, .btn.btn-outline, .btn.btn-link) {
  color: var(--color-soft-silver, var(--bx-interact-text));
  border-color: rgba(var(--bx-interact-gold-rgb), 0.34);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.012)),
    transparent;
}

:where(.btn-bx-danger, .btn.btn-danger) {
  color: var(--bx-interact-text);
  border-color: rgba(var(--bx-interact-danger-rgb), 0.58);
  background:
    linear-gradient(180deg, rgba(var(--bx-interact-danger-rgb), 0.18), rgba(var(--bx-interact-danger-rgb), 0.055)),
    var(--bx-interact-surface);
}

.btn-bx-success {
  color: var(--bx-interact-text);
  border-color: rgba(var(--bx-interact-success-rgb), 0.58);
  background:
    linear-gradient(180deg, rgba(var(--bx-interact-success-rgb), 0.18), rgba(var(--bx-interact-success-rgb), 0.055)),
    var(--bx-interact-surface);
}

.btn-bx-warning {
  color: var(--bx-interact-text);
  border-color: rgba(var(--bx-interact-warning-rgb), 0.62);
  background:
    linear-gradient(180deg, rgba(var(--bx-interact-warning-rgb), 0.18), rgba(var(--bx-interact-warning-rgb), 0.055)),
    var(--bx-interact-surface);
}

:where(.btn, .btn-bx-primary, .btn-bx-secondary, .btn-bx-danger, .btn-bx-success, .btn-bx-warning, .btn-bx-outline):hover {
  border-color: rgba(var(--bx-interact-gold-rgb), 0.7);
  box-shadow: var(--bx-interact-shadow-hover);
}

:where(.btn, .btn-bx-primary, .btn-bx-secondary, .btn-bx-danger, .btn-bx-success, .btn-bx-warning, .btn-bx-outline, button, a, input, select, textarea):focus-visible {
  outline: none;
  box-shadow: var(--bx-interact-focus-ring), var(--bx-interact-shadow-hover);
}

:where(.btn, button):disabled,
:where(.btn, button)[aria-disabled="true"],
.bx-processing {
  cursor: not-allowed;
  opacity: 0.56;
  transform: none;
}

.btn-bx-sm,
.btn.btn-compact,
.btn.btn-small {
  min-height: var(--bx-control-height-sm, 30px);
  padding-block: var(--bx-space-2xs, 0.2rem);
  padding-inline: var(--bx-space-sm, 0.5rem);
  font-size: var(--bx-font-size-sm, 0.8rem);
}

.btn-bx-icon,
.sidebar-close,
.back-to-top {
  inline-size: var(--bx-control-height, 34px);
  block-size: var(--bx-control-height, 34px);
  min-inline-size: var(--bx-control-height, 34px);
  padding: 0;
}

.header-navigation-group .sidebar-toggle-button {
  display: inline-flex;
}

@media (max-width: 767px) {
  .header-navigation-group .sidebar-toggle-button {
    min-width: var(--bx-control-height, 34px);
    inline-size: var(--bx-control-height, 34px);
    padding-inline: 0;
  }

  .header-navigation-group .sidebar-toggle-button [data-sidebar-toggle-label] {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
  }
}

.bx-loading {
  pointer-events: none;
}

.bx-loading::after {
  inline-size: 0.85em;
  block-size: 0.85em;
  margin-inline-start: var(--bx-space-xs, 0.3rem);
  border: 2px solid currentColor;
  border-block-start-color: transparent;
  border-radius: 50%;
  animation: bx-spin 700ms linear infinite;
  opacity: 1;
  transform: none;
}

.bx-checkbox-custom,
.bx-radio-custom,
.bx-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  min-height: 34px;
  color: var(--color-soft-silver, var(--bx-interact-text));
  cursor: pointer;
}

:where(
  .bx-checkbox-custom input[type="checkbox"],
  body main input[type="checkbox"]:not([data-native-checkbox]):not([role="switch"]):not([data-bx-toggle])
) {
  position: relative;
  flex: 0 0 auto;
  inline-size: 1rem;
  block-size: 1rem;
  min-inline-size: 1rem;
  min-block-size: 1rem;
  max-inline-size: 1rem;
  max-block-size: 1rem;
  margin: 0;
  appearance: none;
  border: 1px solid rgba(var(--bx-interact-gold-rgb), 0.44);
  border-radius: 4px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent),
    var(--bx-interact-surface);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    0 0 0 1px rgba(255, 255, 255, 0.018);
  cursor: pointer;
  transition:
    border-color var(--bx-interact-transition),
    background var(--bx-interact-transition),
    box-shadow var(--bx-interact-transition),
    transform var(--bx-interact-transition);
}

.bx-radio-custom input[type="radio"] {
  position: relative;
  flex: 0 0 auto;
  inline-size: 20px;
  block-size: 20px;
  margin: 0;
  appearance: none;
  border: 1px solid var(--bx-interact-border);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.045), transparent),
    var(--bx-interact-surface);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.055);
  transition: border-color var(--bx-interact-transition), background var(--bx-interact-transition), box-shadow var(--bx-interact-transition);
}

.bx-radio-custom input[type="radio"] {
  border-radius: 50%;
}

:where(
  .bx-checkbox-custom input[type="checkbox"],
  body main input[type="checkbox"]:not([data-native-checkbox]):not([role="switch"]):not([data-bx-toggle])
)::after {
  content: "";
  position: absolute;
  inset-block-start: 1px;
  inset-inline-start: 4px;
  inline-size: 5px;
  block-size: 9px;
  border: solid #101010;
  border-width: 0 2px 2px 0;
  opacity: 0;
  transform: rotate(45deg) scale(0.72);
  transform-origin: center;
  transition:
    opacity var(--bx-interact-transition),
    transform var(--bx-interact-transition);
}

.bx-radio-custom input[type="radio"]::after {
  content: "";
  position: absolute;
  inset: 4px;
  border-radius: 50%;
  background: var(--bx-interact-primary);
  opacity: 0;
  transform: scale(0.72);
  transition: opacity var(--bx-interact-transition), transform var(--bx-interact-transition);
}

:where(
  .bx-checkbox-custom input[type="checkbox"],
  body main input[type="checkbox"]:not([data-native-checkbox]):not([role="switch"]):not([data-bx-toggle])
):checked,
.bx-radio-custom input[type="radio"]:checked {
  border-color: rgba(var(--bx-interact-gold-rgb), 0.78);
  background:
    radial-gradient(circle at 50% 45%, rgba(255, 255, 255, 0.32), transparent 34%),
    linear-gradient(145deg, var(--color-gold-light, #e0bd70), var(--bx-interact-gold));
  box-shadow:
    0 0 0 3px rgba(var(--bx-interact-gold-rgb), 0.14),
    0 10px 24px rgba(var(--bx-interact-gold-rgb), 0.18);
}

:where(
  .bx-checkbox-custom input[type="checkbox"],
  body main input[type="checkbox"]:not([data-native-checkbox]):not([role="switch"]):not([data-bx-toggle])
):checked::after,
.bx-radio-custom input[type="radio"]:checked::after {
  opacity: 1;
  transform: rotate(45deg) scale(1);
}

:where(
  .bx-checkbox-custom input[type="checkbox"],
  body main input[type="checkbox"]:not([data-native-checkbox]):not([role="switch"]):not([data-bx-toggle])
):checked {
  animation: bx-checkbox-pop 180ms ease-out;
}

:where(
  .bx-checkbox-custom input[type="checkbox"],
  .bx-radio-custom input[type="radio"],
  body main input[type="checkbox"]:not([data-native-checkbox]):not([role="switch"]):not([data-bx-toggle])
):focus-visible {
  outline: none;
  box-shadow:
    0 0 0 3px rgba(var(--bx-interact-gold-rgb), 0.2),
    0 0 0 1px rgba(var(--bx-interact-gold-rgb), 0.62);
}

:where(
  .bx-checkbox-custom input[type="checkbox"],
  body main input[type="checkbox"]:not([data-native-checkbox]):not([role="switch"]):not([data-bx-toggle])
):invalid {
  border-color: rgba(255, 112, 112, 0.72);
}

:where(
  .bx-checkbox-custom input[type="checkbox"],
  .bx-radio-custom input[type="radio"],
  body main input[type="checkbox"]:not([data-native-checkbox]):not([role="switch"]):not([data-bx-toggle])
):disabled {
  opacity: 0.48;
  cursor: not-allowed;
  filter: grayscale(0.35);
}

.bx-checkbox-custom:has(input:disabled),
.bx-radio-custom:has(input:disabled) {
  cursor: not-allowed;
  color: var(--color-text-muted, #8d9299);
}

.bx-radio-custom input[type="radio"]:checked::after {
  transform: scale(1);
}

.bx-toggle input[type="checkbox"] {
  position: relative;
  inline-size: 38px;
  block-size: 20px;
  margin: 0;
  appearance: none;
  border: 1px solid var(--bx-interact-border);
  border-radius: 999px;
  background: var(--bx-interact-surface);
  transition: border-color var(--bx-interact-transition), background var(--bx-interact-transition);
}

.bx-toggle input[type="checkbox"]::after {
  content: "";
  position: absolute;
  inset-block-start: 3px;
  inset-inline-start: 3px;
  inline-size: 12px;
  block-size: 12px;
  border-radius: 50%;
  background: var(--color-soft-silver, var(--bx-interact-text));
  transition: transform var(--bx-interact-transition), background var(--bx-interact-transition);
}

.bx-toggle input[type="checkbox"]:checked {
  border-color: rgba(var(--bx-interact-gold-rgb), 0.78);
  background: rgba(var(--bx-interact-gold-rgb), 0.24);
}

.bx-toggle input[type="checkbox"]:checked::after {
  background: var(--bx-interact-gold);
  transform: translateX(18px);
}

[dir="rtl"] .bx-toggle input[type="checkbox"]:checked::after {
  transform: translateX(-18px);
}

:where(input[type="search"].bx-input-search, input.bx-input-search, .client-input, .route-filter-input, .crm-filter-input),
:where(select.bx-select-styled, select.client-input, select.route-filter-input),
:where(.auth-form input, .contact-form input, .contact-form textarea) {
  min-height: var(--bx-control-height, 34px);
  border-radius: var(--bx-interact-radius-btn);
  border-color: var(--bx-interact-border);
  color: var(--bx-interact-text);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.012)),
    var(--bx-interact-surface);
  transition: border-color var(--bx-interact-transition), box-shadow var(--bx-interact-transition), background var(--bx-interact-transition);
}

:where(input[type="search"].bx-input-search, input.bx-input-search, .client-input, .route-filter-input, .crm-filter-input):focus,
:where(select.bx-select-styled, select.client-input, select.route-filter-input):focus {
  outline: none;
  border-color: rgba(var(--bx-interact-gold-rgb), 0.72);
  box-shadow: var(--bx-interact-focus-ring);
}

.bx-search-wrap {
  position: relative;
  display: block;
}

.bx-search-wrap::before {
  content: "";
  position: absolute;
  inset-block-start: 50%;
  inset-inline-start: var(--bx-space-sm, 0.5rem);
  inline-size: 10px;
  block-size: 10px;
  border: 1px solid var(--bx-interact-gold);
  border-radius: 50%;
  transform: translateY(-50%);
  pointer-events: none;
}

.bx-search-wrap::after {
  content: "";
  position: absolute;
  inset-block-start: calc(50% + 4px);
  inset-inline-start: calc(var(--bx-space-sm, 0.5rem) + 9px);
  inline-size: 6px;
  block-size: 1px;
  background: var(--bx-interact-gold);
  transform: rotate(45deg);
  pointer-events: none;
}

.bx-search-wrap > input {
  padding-inline-start: calc(var(--bx-space-xl, 1.5rem) + 0.35rem);
}

.bx-select-styled {
  appearance: none;
  padding-inline-end: var(--bx-space-xl, 1.5rem);
  background-image:
    linear-gradient(45deg, transparent 50%, var(--bx-interact-gold) 50%),
    linear-gradient(135deg, var(--bx-interact-gold) 50%, transparent 50%);
  background-position:
    calc(100% - 15px) 50%,
    calc(100% - 10px) 50%;
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
}

[dir="rtl"] .bx-select-styled {
  background-position: 15px 50%, 10px 50%;
}

.bx-filter-panel,
[data-phase34-filter-panel],
.blackx-filter-shell,
.client-filter-panel,
.property-filter-panel,
.request-filter-panel,
.route-filter-panel,
.crm-filters,
.deal-filter-panel,
.vault-filter-bar,
.organization-filter,
.report-filter-bar,
.blackx-filter-form {
  border-radius: var(--bx-radius-md, 10px);
  border-color: var(--bx-interact-border);
  background:
    linear-gradient(135deg, rgba(var(--bx-interact-gold-rgb), 0.05), transparent 38%),
    rgba(255, 255, 255, 0.018);
}

.bx-filter-panel[hidden] {
  display: none;
}

/* Phase 34: full-system filter, checkbox, header, and action harmonization. */
.bx-page-header {
  display: grid;
  gap: var(--bx-space-sm, 0.5rem);
  width: min(100%, var(--bx-page-align-wide, 1480px));
  margin-inline: auto;
}

/* Phase 34.1: apply the header surface to real rendered hero/header classes, not only the shared partial. */
.bx-page-header,
[data-page-header].dashboard-header,
[data-page-header].organization-hero,
[data-page-header].media-library-hero,
[data-page-header].media-form-hero,
[data-page-header].media-decision-page,
[data-page-header].blackx-discover-hero,
[data-page-header].blackx-form-hero,
[data-page-header].blackx-post-detail__hero,
.page-hero.profile-hero,
.page-hero.access-hero,
.crm-hero,
.property-hero,
.client-intelligence-hero,
.client-list-hero,
.client-form-hero,
.client-profile-hero,
.client-related-hero,
.client-self-hero,
.request-workflow-hero,
.request-board-hero,
.request-form-hero,
.request-profile-hero,
.request-related-hero,
.request-portal-hero,
.deal-overview-hero,
.deal-board-hero,
.deal-form-hero,
.deal-profile-hero,
.deal-subpage-hero,
.deal-client-hero,
.deal-conversion-hero,
.report-page-head,
body.has-auth-sidebar [data-page-header].dashboard-header,
body.has-auth-sidebar [data-page-header].organization-hero,
body.has-auth-sidebar [data-page-header].media-library-hero,
body.has-auth-sidebar [data-page-header].media-form-hero,
body.has-auth-sidebar [data-page-header].media-decision-page,
body.has-auth-sidebar [data-page-header].blackx-discover-hero,
body.has-auth-sidebar [data-page-header].blackx-form-hero,
body.has-auth-sidebar [data-page-header].blackx-post-detail__hero,
body.has-auth-sidebar .page-hero.profile-hero,
body.has-auth-sidebar .page-hero.access-hero,
body.has-auth-sidebar .crm-hero,
body.has-auth-sidebar .property-hero,
body.has-auth-sidebar .client-intelligence-hero,
body.has-auth-sidebar .client-list-hero,
body.has-auth-sidebar .client-form-hero,
body.has-auth-sidebar .client-profile-hero,
body.has-auth-sidebar .client-related-hero,
body.has-auth-sidebar .client-self-hero,
body.has-auth-sidebar .request-workflow-hero,
body.has-auth-sidebar .request-board-hero,
body.has-auth-sidebar .request-form-hero,
body.has-auth-sidebar .request-profile-hero,
body.has-auth-sidebar .request-related-hero,
body.has-auth-sidebar .request-portal-hero,
body.has-auth-sidebar .deal-overview-hero,
body.has-auth-sidebar .deal-board-hero,
body.has-auth-sidebar .deal-form-hero,
body.has-auth-sidebar .deal-profile-hero,
body.has-auth-sidebar .deal-subpage-hero,
body.has-auth-sidebar .deal-client-hero,
body.has-auth-sidebar .deal-conversion-hero,
body.has-auth-sidebar .report-page-head {
  box-sizing: border-box;
  padding: var(--bx-surface-padding, 1.35rem);
  border: 1px solid rgba(var(--bx-interact-gold-rgb), 0.18);
  border-radius: var(--bx-radius-md, 10px);
  background:
    linear-gradient(135deg, rgba(var(--bx-interact-gold-rgb), 0.055), transparent 44%),
    rgba(5, 5, 5, 0.42);
  box-shadow: var(--shadow-panel, 0 18px 48px rgba(0, 0, 0, 0.48));
}

.bx-page-header__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--bx-space-md, 0.75rem);
  align-items: end;
}

.bx-page-breadcrumbs,
.bx-page-meta,
.bx-page-actions,
.bx-stats-row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--bx-space-xs, 0.3rem);
  min-width: 0;
}

.bx-page-breadcrumbs {
  color: var(--color-text-dim, #9c9fa5);
  font-size: var(--bx-font-size-xs, 0.72rem);
}

.bx-page-breadcrumbs > * + *::before {
  content: "/";
  margin-inline-end: var(--bx-space-xs, 0.3rem);
  color: rgba(var(--bx-interact-gold-rgb), 0.55);
}

.bx-page-actions {
  justify-content: flex-end;
  align-items: center;
  margin-top: 0;
}

.bx-page-meta {
  align-items: center;
  color: var(--color-text-dim, #9c9fa5);
  font-family: var(--font-data);
  font-size: var(--bx-font-size-xs, 0.72rem);
}

.bx-page-context,
.bx-page-warning,
.bx-info-card {
  min-width: 0;
  padding: var(--bx-space-sm, 0.5rem) var(--bx-space-md, 0.75rem);
  border: 1px solid rgba(141, 146, 153, 0.16);
  border-radius: var(--bx-radius-sm, 6px);
  background: rgba(255, 255, 255, 0.035);
}

.bx-page-warning {
  border-color: rgba(222, 105, 105, 0.34);
  color: #f0c1c1;
}

.bx-stats-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 9rem), 1fr));
}

.bx-info-card {
  display: grid;
  gap: var(--bx-space-2xs, 0.2rem);
}

.bx-info-card span {
  color: var(--color-gold-light, #e0be79);
  font-family: var(--font-data);
  font-size: var(--bx-font-size-xs, 0.72rem);
  font-weight: 800;
  text-transform: uppercase;
}

.bx-info-card strong {
  color: var(--color-white-soft, #f2f2f2);
}

:where(
  .bx-filter-panel,
  [data-phase34-filter-panel],
  .blackx-filter-shell,
  .client-filter-panel,
  .property-filter-panel,
  .request-filter-panel,
  .deal-filter-panel,
  .crm-filters,
  .route-filter-panel,
  .vault-filter-bar,
  .organization-filter,
  .report-filter-bar,
  .blackx-filter-form
) {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 11.5rem), 1fr));
  gap: var(--bx-space-sm, 0.5rem);
  align-items: end;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin-bottom: var(--bx-space-xl, 1.25rem);
  padding: var(--bx-card-padding, 1.18rem);
  overflow: visible;
}

:where(.route-filter-panel, .bx-filter-panel) > form {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 11.5rem), 1fr));
  gap: var(--bx-space-sm, 0.5rem);
  align-items: end;
  min-width: 0;
}

:where(
  .bx-filter-panel,
  [data-phase34-filter-panel],
  .blackx-filter-shell,
  .client-filter-panel,
  .property-filter-panel,
  .request-filter-panel,
  .deal-filter-panel,
  .crm-filters,
  .route-filter-panel,
  .vault-filter-bar,
  .organization-filter,
  .report-filter-bar,
  .blackx-filter-form
) :where(label, .crud-field, .crm-field, .client-field, .property-field, .request-field, .deal-field) {
  display: grid;
  gap: var(--bx-space-xs, 0.3rem);
  min-width: 0;
}

:where(
  .bx-filter-panel,
  [data-phase34-filter-panel],
  .blackx-filter-shell,
  .client-filter-panel,
  .property-filter-panel,
  .request-filter-panel,
  .deal-filter-panel,
  .crm-filters,
  .route-filter-panel,
  .vault-filter-bar,
  .organization-filter,
  .report-filter-bar,
  .blackx-filter-form
) :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
  width: 100%;
  min-width: 0;
  min-height: var(--bx-control-height, 38px);
  max-width: 100%;
  padding-block: var(--bx-space-xs, 0.3rem);
  padding-inline: var(--bx-space-sm, 0.5rem);
  box-sizing: border-box;
}

:where(
  .bx-filter-panel,
  [data-phase34-filter-panel],
  .blackx-filter-shell,
  .client-filter-panel,
  .property-filter-panel,
  .request-filter-panel,
  .deal-filter-panel,
  .crm-filters,
  .route-filter-panel,
  .vault-filter-bar,
  .organization-filter,
  .report-filter-bar,
  .blackx-filter-form
) :where(.action-row, .bx-filter-actions) {
  grid-column: 1 / -1;
  margin-top: 0;
}

:where(
  .bx-filter-panel,
  [data-phase34-filter-panel],
  .blackx-filter-shell,
  .client-filter-panel,
  .property-filter-panel,
  .request-filter-panel,
  .deal-filter-panel,
  .crm-filters,
  .route-filter-panel,
  .vault-filter-bar,
  .organization-filter,
  .report-filter-bar,
  .blackx-filter-form
) :where(.btn, button[type="submit"], button[type="reset"], input[type="submit"]) {
  align-self: end;
  white-space: normal;
}

.bx-checkbox,
.bx-form-check,
:where(.property-checkbox, .media-checkbox, .client-checkbox, .organization-checkbox, .platform-checkbox-grid label, .platform-cell-form label, .phase26-check) {
  display: inline-flex;
  align-items: center;
  gap: var(--bx-space-xs, 0.3rem);
  min-height: var(--bx-control-height-sm, 32px);
  min-width: 0;
  max-width: 100%;
  color: var(--color-soft-silver, #b6bcc3);
}

:where(
  .bx-checkbox-input,
  .bx-checkbox input[type="checkbox"],
  .bx-form-check input[type="checkbox"],
  .property-checkbox input[type="checkbox"],
  .media-checkbox input[type="checkbox"],
  .client-checkbox input[type="checkbox"],
  .organization-checkbox input[type="checkbox"],
  .platform-checkbox-grid input[type="checkbox"],
  .platform-cell-form input[type="checkbox"],
  .phase26-check input[type="checkbox"],
  input[type="checkbox"].crud-input,
  input[type="checkbox"].crm-input,
  input[type="checkbox"].property-input,
  input[type="checkbox"].client-input,
  input[type="checkbox"].request-input,
  input[type="checkbox"].deal-input,
  input[type="checkbox"].media-input
):not([role="switch"]):not([data-bx-toggle]) {
  flex: 0 0 auto;
  inline-size: 1rem;
  block-size: 1rem;
  min-inline-size: 1rem;
  min-block-size: 1rem;
  max-inline-size: 1rem;
  max-block-size: 1rem;
  width: 1rem;
  height: 1rem;
  min-height: 1rem;
}

.bx-checkbox-label,
:where(.property-checkbox span, .media-checkbox span, .client-checkbox span, .organization-checkbox span, .platform-checkbox-grid label, .platform-cell-form label) {
  min-width: 0;
  overflow-wrap: anywhere;
  line-height: var(--bx-line-height-tight, 1.3);
}

.action-row,
.bx-action-row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--bx-space-sm, 0.5rem);
  align-items: center;
  min-width: 0;
}

@media (max-width: 640px) {
  .bx-page-header__inner {
    grid-template-columns: 1fr;
  }

  .bx-page-actions {
    justify-content: flex-start;
  }

  :where(
    .bx-filter-panel,
    [data-phase34-filter-panel],
    .blackx-filter-shell,
    .client-filter-panel,
    .property-filter-panel,
    .request-filter-panel,
    .deal-filter-panel,
    .crm-filters,
    .route-filter-panel,
    .vault-filter-bar,
    .organization-filter,
    .report-filter-bar,
    .blackx-filter-form
  ),
  :where(.route-filter-panel, .bx-filter-panel) > form {
    grid-template-columns: 1fr;
  }
}

.bx-badge {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding-block: var(--bx-badge-py, 0.15rem);
  padding-inline: var(--bx-badge-px, 0.4rem);
  border: 1px solid var(--bx-interact-border);
  border-radius: 999px;
  color: var(--color-soft-silver, var(--bx-interact-text));
  font-size: var(--bx-badge-font, 0.72rem);
}

.bx-tooltip {
  position: relative;
}

.bx-tooltip[data-tooltip]:hover::after,
.bx-tooltip[data-tooltip]:focus-visible::after {
  content: attr(data-tooltip);
  position: absolute;
  inset-block-end: calc(100% + var(--bx-space-xs, 0.3rem));
  inset-inline-start: 50%;
  z-index: 1400;
  max-inline-size: 220px;
  padding: var(--bx-space-xs, 0.3rem) var(--bx-space-sm, 0.5rem);
  border: 1px solid var(--bx-interact-border);
  border-radius: var(--bx-interact-radius-btn);
  color: var(--bx-interact-text);
  background: var(--bx-interact-surface);
  box-shadow: var(--shadow-panel, var(--bx-interact-shadow-hover));
  font-size: var(--bx-font-size-xs, 0.72rem);
  line-height: var(--bx-line-height-tight, 1.3);
  text-align: center;
  transform: translateX(-50%);
  white-space: normal;
}

.bx-pagination,
.property-pagination {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--bx-space-xs, 0.3rem);
}

.bx-pagination a,
.property-pagination a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--bx-control-height-sm, 30px);
  padding-inline: var(--bx-space-sm, 0.5rem);
  border: 1px solid var(--bx-interact-border);
  border-radius: var(--bx-interact-radius-btn);
  color: var(--color-soft-silver, var(--bx-interact-text));
  background: rgba(5, 5, 5, 0.42);
}

.bx-focus-ring {
  box-shadow: var(--bx-interact-focus-ring);
}

@keyframes bx-spin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes bx-checkbox-pop {
  0% {
    transform: scale(0.92);
  }

  60% {
    transform: scale(1.08);
  }

  100% {
    transform: scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  .bx-loading::after {
    animation: none;
  }

  .bx-checkbox-custom *,
  .bx-radio-custom *,
  body main input[type="checkbox"],
  body main input[type="checkbox"]::after,
  :where(.btn, button, input, select, textarea),
  .bx-checkbox-custom input,
  .bx-radio-custom input,
  .bx-toggle input {
    animation: none;
    transition: none;
  }
}
