/* BB Perfect v4.5.36 P10-R — React-first conflict guard.
   Scoped isolation for BB Perfect surfaces only. No business logic lives here. */
.bbppm-react-first,
.bbppm-conflict-free,
.bbppm-portal,
.bbppm-cleaner-mobile-app,
.bbppm-admin-ui,
.bbppm-app-v31,
.bbppm-react-admin-surface {
  --bbppm-react-bg: #f7f4ed;
  --bbppm-react-surface: #ffffff;
  --bbppm-react-border: rgba(18, 59, 54, 0.14);
  --bbppm-react-text: #123b36;
  --bbppm-react-muted: #5f746f;
  --bbppm-react-accent: #ee714e;
  box-sizing: border-box;
}
.bbppm-react-first *,
.bbppm-conflict-free *,
.bbppm-portal *,
.bbppm-cleaner-mobile-app *,
.bbppm-admin-ui *,
.bbppm-app-v31 *,
.bbppm-react-admin-surface * { box-sizing: border-box; }

/* Neutralize third-party Bootstrap grid leakage inside BB Perfect surfaces. */
.bbppm-react-first .container,
.bbppm-react-first .container-fluid,
.bbppm-conflict-free .container,
.bbppm-conflict-free .container-fluid,
.bbppm-portal .container,
.bbppm-portal .container-fluid,
.bbppm-cleaner-mobile-app .container,
.bbppm-cleaner-mobile-app .container-fluid {
  width: auto;
  max-width: none;
  padding-left: 0;
  padding-right: 0;
  margin-left: 0;
  margin-right: 0;
}
.bbppm-react-first .row,
.bbppm-conflict-free .row,
.bbppm-portal .row,
.bbppm-cleaner-mobile-app .row {
  display: block;
  flex-wrap: initial;
  margin-left: 0;
  margin-right: 0;
}
.bbppm-react-first [class^="col-"],
.bbppm-react-first [class*=" col-"],
.bbppm-conflict-free [class^="col-"],
.bbppm-conflict-free [class*=" col-"],
.bbppm-portal [class^="col-"],
.bbppm-portal [class*=" col-"],
.bbppm-cleaner-mobile-app [class^="col-"],
.bbppm-cleaner-mobile-app [class*=" col-"] {
  position: static;
  width: auto;
  max-width: none;
  padding-left: 0;
  padding-right: 0;
  flex: none;
}

/* Canonical React-style cards replacing old Bootstrap/WP card surfaces. */
.bbppm-react-card,
.bbppm-cleaner-react-card,
.bbppm-react-admin-card {
  background: var(--bbppm-react-surface);
  color: var(--bbppm-react-text);
  border: 1px solid var(--bbppm-react-border);
  border-radius: 22px;
  box-shadow: 0 18px 50px rgba(18, 59, 54, 0.08);
  padding: 20px;
  margin: 16px 0;
}
.bbppm-react-card h1,.bbppm-react-card h2,.bbppm-react-card h3,
.bbppm-cleaner-react-card h1,.bbppm-cleaner-react-card h2,.bbppm-cleaner-react-card h3,
.bbppm-react-admin-card h1,.bbppm-react-admin-card h2,.bbppm-react-admin-card h3 { color: var(--bbppm-react-text); margin-top: 0; }
.bbppm-react-card p,.bbppm-cleaner-react-card p,.bbppm-react-admin-card p { color: var(--bbppm-react-muted); }
.bbppm-react-card table.widefat,
.bbppm-react-admin-card table.widefat { border-radius: 14px; overflow: hidden; border-color: var(--bbppm-react-border); }

/* React-first forms: readable fields, clear touch targets, no Bootstrap form-control dependency. */
.bbppm-react-first input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]),
.bbppm-react-first select,
.bbppm-react-first textarea,
.bbppm-conflict-free input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]),
.bbppm-conflict-free select,
.bbppm-conflict-free textarea,
.bbppm-cleaner-mobile-app input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]),
.bbppm-cleaner-mobile-app select,
.bbppm-cleaner-mobile-app textarea {
  min-height: 44px;
  border-radius: 14px;
  border: 1px solid var(--bbppm-react-border);
  background: #fff;
  color: var(--bbppm-react-text);
  box-shadow: none;
}
.bbppm-react-first button,
.bbppm-react-first .button,
.bbppm-conflict-free button,
.bbppm-conflict-free .button,
.bbppm-cleaner-mobile-app button,
.bbppm-cleaner-mobile-app .button {
  min-height: 42px;
  border-radius: 999px;
  font-weight: 800;
  line-height: 1.1;
}
.bbppm-cleaner-mobile-app button,
.bbppm-cleaner-mobile-app .button,
.bbppm-cleaner-mobile-app .bbppm-v4-action,
.bbppm-cleaner-mobile-app .primary,
.bbppm-cleaner-mobile-app .secondary,
.bbppm-cleaner-mobile-app .danger {
  min-height: 48px;
  padding: 12px 16px;
  touch-action: manipulation;
}

/* Mobile app should never inherit desktop Bootstrap spacing or overflow. */
.bbppm-cleaner-mobile-app,
.bbppm-cleaner-mobile-app .bbppm-cleaner-app-main,
.bbppm-cleaner-mobile-app .bbppm-job-section,
.bbppm-cleaner-mobile-app .bbppm-v4-form,
.bbppm-cleaner-mobile-app .bbppm-v432-account-grid {
  max-width: 100%;
  overflow-wrap: anywhere;
}
.bbppm-cleaner-mobile-app table { max-width: 100%; }
.bbppm-cleaner-mobile-app .bbppm-v4-table,
.bbppm-cleaner-mobile-app .bbppm-data-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.bbppm-cleaner-mobile-app .bbppm-v4-form label,
.bbppm-cleaner-mobile-app .bbppm-v4-two label { display: grid; gap: 7px; }

/* Hide fallback nav only when the React replacement has mounted successfully. */
.bbppm-cleaner-mobile-app[data-bbppm-react-nav-ready="1"] [data-bbppm-cleaner-nav-fallback] { display: none; }

@media (max-width: 520px) {
  .bbppm-react-card,
  .bbppm-cleaner-react-card,
  .bbppm-react-admin-card { border-radius: 18px; padding: 16px; margin: 12px 0; }
  .bbppm-cleaner-mobile-app button,
  .bbppm-cleaner-mobile-app .button,
  .bbppm-cleaner-mobile-app .bbppm-v4-action { width: 100%; justify-content: center; }
}
