/* =====================================================================================
   QA Assessor design system (app). Locked 27 September 2026.

   One set of tokens; every component below reads them. The build step replaces "html.qa-app :is(body, #q#q#q) " with a
   selector prefix that outranks the platform's own styles, so these rules win consistently.
   Colours the platform hard-codes are snapped to the same palette by the app script (light) and
   mapped by the dark theme engine (dark), so the whole app shows one palette.
   ===================================================================================== */

html.qa-app {
  /* Colour */
  --q-brand: #1268B3;
  --q-brand-hover: #0D5798;
  --q-brand-soft: #EAF3FB;
  --q-brand-fill: #1268B3;
  --q-on-brand: #FFFFFF;
  --q-bg: #F4F6F8;
  --q-surface: #FFFFFF;
  --q-surface-2: #F8FAFC;
  --q-text: #111827;
  --q-text-2: #5F6B7A;
  --q-text-3: #8792A2;
  --q-border: #E2E7EC;
  --q-border-strong: #CBD3DC;
  --q-success: #198754;
  --q-success-soft: #EAF7EF;
  --q-warning: #B7791F;
  --q-warning-soft: #FFF7E6;
  --q-danger: #D92D20;
  --q-danger-soft: #FFF0EE;
  --q-info: #1268B3;
  --q-scrim: rgba(17, 24, 39, .45);
  --q-toast: #1F2937;
  /* Type */
  --q-font: Inter, -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display", Roboto, "Segoe UI", system-ui, "Helvetica Neue", Arial, sans-serif;
  --q-fs-title: 26px;
  --q-fs-h2: 20px;
  --q-fs-h3: 17px;
  --q-fs-body: 15px;
  --q-fs-2: 14px;
  --q-fs-meta: 13px;
  --q-fs-small: 12px;
  /* Shape and size */
  --q-r-sm: 8px;
  --q-r-ctl: 10px;
  --q-r-card: 12px;
  --q-r-sheet: 24px;
  --q-h-btn: 40px;
  --q-h-btn-lg: 44px;
  --q-h-input: 46px;
  --q-h-chip: 34px;
  --q-h-badge: 24px;
  --q-h-bar: 56px;
  --q-h-nav: 64px;
  --q-pad: 16px;
  --q-shadow-1: 0 1px 2px rgba(17, 24, 39, .05);
  --q-shadow-2: 0 -6px 28px rgba(17, 24, 39, .14);
  --q-ring: 0 0 0 3px rgba(18, 104, 179, .18);
  /* The platform's own variables now point at the same tokens */
  --qa-navy: var(--q-brand-hover);
  --qa-blue: var(--q-brand);
  --qa-blue-dark: var(--q-brand-hover);
  --qa-blue-soft: var(--q-brand-soft);
  --qa-green: var(--q-success);
  --qa-green-soft: var(--q-success-soft);
  --qa-amber: var(--q-warning);
  --qa-amber-soft: var(--q-warning-soft);
  --qa-red: var(--q-danger);
  --qa-red-soft: var(--q-danger-soft);
  --qa-gold: var(--q-warning);
  --qa-bg: var(--q-bg);
  --qa-card: var(--q-surface);
  --qa-text: var(--q-text);
  --qa-text-2: var(--q-text-2);
  --qa-text-3: var(--q-text-3);
  --qa-border: var(--q-border);
  --qa-line: var(--q-border);
  --qa-ink: var(--q-text);
  --qa-dim: var(--q-text-2);
  --qa-faint: var(--q-text-3);
  --qa-r-card: 12px;
  --qa-r-ctl: 10px;
  --qa-shadow: none;
  --qa-shadow-lg: var(--q-shadow-1);
  color-scheme: light;
  background: var(--q-bg) !important;
}
html.qa-app.qa-dark {
  --q-brand: #6FA8EC;
  --q-brand-hover: #95C0F2;
  --q-brand-soft: #16304D;
  --q-brand-fill: #2F7FD4;
  --q-bg: #0F1722;
  --q-surface: #16202C;
  --q-surface-2: #1B2633;
  --q-text: #E6ECF3;
  --q-text-2: #A3B0BF;
  --q-text-3: #7D8A9A;
  --q-border: #263345;
  --q-border-strong: #34445A;
  --q-success: #4CC38A;
  --q-success-soft: #123325;
  --q-warning: #E3A94B;
  --q-warning-soft: #33280F;
  --q-danger: #FF6B5E;
  --q-danger-soft: #3A1916;
  --q-scrim: rgba(0, 0, 0, .6);
  --q-toast: #2A3646;
  --q-shadow-1: none;
  --q-shadow-2: 0 -6px 28px rgba(0, 0, 0, .5);
  --q-ring: 0 0 0 3px rgba(111, 168, 236, .28);
  color-scheme: dark;
}

/* ---------- Base type ---------- */
html.qa-app body {
  background: var(--q-bg) !important;
  color: var(--q-text) !important;
  font-family: var(--q-font) !important;
  font-size: var(--q-fs-body) !important;
  line-height: 1.5 !important;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
html.qa-app :is(body, #q#q#q) :is(h1, h2, h3, h4, h5, h6, p, a, span, li, button, input, select, textarea, label, strong, b, em, small, div, td, th, dt, dd, blockquote, summary, legend, time, figcaption, nav, section, article):not([class*="fa-"]):not(.fa):not([class*="dashicons"]):not(.ab-icon):not(code):not(pre) {
  font-family: var(--q-font) !important;
}
html.qa-app :is(body, #q#q#q) :is(h1, h2, h3, h4, h5, h6) { line-height: 1.25 !important; letter-spacing: -.01em !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) h1 { font-size: 24px !important; font-weight: 700 !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) h2 { font-size: var(--q-fs-h2) !important; font-weight: 700 !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) h3 { font-size: var(--q-fs-h3) !important; font-weight: 600 !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) h4 { font-size: var(--q-fs-body) !important; font-weight: 600 !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) :is(p, li, td, dd) { font-size: var(--q-fs-body); line-height: 1.5; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) small, html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .description { font-size: var(--q-fs-meta) !important; color: var(--q-text-2) !important; }

/* ---------- Page ---------- */
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) { background: var(--q-bg) !important; padding-top: 0 !important; }
html.qa-app :is(body, #q#q#q) .policy-content { padding: 12px var(--q-pad) 24px !important; }
html.qa-app :is(body, #q#q#q) .section-inner { padding-left: 0 !important; padding-right: 0 !important; max-width: 100% !important; }

/* ---------- Top bar: 56px ---------- */
html.qa-app :is(body, #q#q#q) .qap-appbar {
  background: var(--q-surface) !important;
  border-bottom: 1px solid var(--q-border) !important;
  box-shadow: none !important;
}
html.qa-app :is(body, #q#q#q) .qap-appbar-in {
  height: var(--q-h-bar) !important;
  min-height: var(--q-h-bar) !important;
  padding: 0 8px 0 var(--q-pad) !important;
  gap: 4px !important;
  align-items: center !important;
}
html.qa-app :is(body, #q#q#q) .qap-appbar-logo { display: inline-flex !important; align-items: center !important; }
html.qa-app :is(body, #q#q#q) .qap-appbar-logo img { height: 30px !important; max-height: 30px !important; width: auto !important; }
html.qa-app :is(body, #q#q#q) .qap-appbar-user { display: flex !important; align-items: center !important; gap: 0 !important; margin-left: auto !important; }
html.qa-app :is(body, #q#q#q) :is(.qap-ab-bell, .qa-bar-search, .qa-bar-action) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 40px !important;
  height: 40px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: transparent !important;
  color: var(--q-text) !important;
  text-decoration: none !important;
  position: relative;
}
html.qa-app :is(body, #q#q#q) :is(.qap-ab-bell, .qa-bar-search, .qa-bar-action) :is(svg, .qa-ico) { width: 22px !important; height: 22px !important; }
html.qa-app :is(body, #q#q#q) :is(.qap-ab-bell, .qa-bar-search, .qa-bar-action):active { background: var(--q-surface-2) !important; }
html.qa-app :is(body, #q#q#q) .qap-ab-bell :is(.qap-count, .count, .qap-ab-dot, .qapf4-bell-count) {
  position: absolute !important;
  top: 6px !important;
  right: 6px !important;
  min-width: 16px !important;
  height: 16px !important;
  padding: 0 4px !important;
  border-radius: 8px !important;
  background: var(--q-danger) !important;
  color: #FFFFFF !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  line-height: 16px !important;
  box-shadow: 0 0 0 2px var(--q-surface) !important;
}
html.qa-app :is(body, #q#q#q) .qap-ab-me-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 40px !important;
  height: 40px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: transparent !important;
}
html.qa-app :is(body, #q#q#q) .qap-ab-me-btn img { width: 30px !important; height: 30px !important; border-radius: 50% !important; object-fit: cover !important; }
html.qa-app :is(body, #q#q#q) .qa-bar-title {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  letter-spacing: -.01em !important;
  color: var(--q-text) !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
html.qa-app.qa-inner .qa-bar-title { font-size: 17px !important; }
html.qa-app.qa-titled .qap-appbar-logo { display: none !important; }

/* ---------- Bottom navigation: 64px + safe area ---------- */
html.qa-app :is(body, #q#q#q) .qap-tabbar {
  height: auto !important;
  min-height: calc(var(--q-h-nav) + var(--safe-area-inset-bottom, env(safe-area-inset-bottom, 0px))) !important;
  padding: 0 0 var(--safe-area-inset-bottom, env(safe-area-inset-bottom, 0px)) !important;
  background: var(--q-surface) !important;
  border-top: 1px solid var(--q-border) !important;
  box-shadow: none !important;
}
html.qa-app :is(body, #q#q#q) .qap-tabbar > .qap-tab.qa-tab {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 3px !important;
  height: var(--q-h-nav) !important;
  min-height: var(--q-h-nav) !important;
  padding: 0 !important;
  color: var(--q-text-2) !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
}
html.qa-app :is(body, #q#q#q) .qap-tabbar > .qap-tab.qa-tab .qa-ico { width: 24px !important; height: 24px !important; stroke-width: 1.9 !important; fill: none !important; }
html.qa-app :is(body, #q#q#q) .qap-tabbar > .qap-tab.qa-tab.is-on { color: var(--q-brand) !important; }
html.qa-app :is(body, #q#q#q) .qap-tabbar > .qap-tab.qa-tab.is-on .qa-ico { stroke-width: 2.3 !important; fill: var(--q-brand-soft) !important; }
html.qa-app :is(body, #q#q#q) .qap-tabbar > .qap-tab.qa-tab.qa-tab-menu.is-on .qa-ico { fill: none !important; }
html.qa-app :is(body, #q#q#q) .qap-tabbar .qa-tab-label { font-size: var(--q-fs-small) !important; font-weight: 600 !important; line-height: 1.2 !important; letter-spacing: 0 !important; }
html.qa-app :is(body, #q#q#q) .qap-tabbar .qa-tab-badge { top: 7px !important; box-shadow: 0 0 0 2px var(--q-surface) !important; background: var(--q-danger) !important; }

/* ---------- Buttons: primary, secondary, tertiary, icon, danger ---------- */
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) :is(.qap-btn, .qap-pbtn, .button, .btn-primary, .btn-submit, button[type="submit"], input[type="submit"], .woocommerce-button, a.qa-btn):not(.qa-tab, .qap-tab, .qap-act, .qap-react, .qap-post-more, .qap-msg-more, .bp-secondary-action, .acomment-reply, .qa-copy, .qa-file-btn, [class*="toggle"], .qap-btn-outline, .qap-btn-ghost, .qap-btn-secondary, .bp-profile-button > a, .friendship-button, .activity-meta *) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  min-height: var(--q-h-btn) !important;
  height: auto !important;
  padding: 0 16px !important;
  border: 1px solid var(--q-brand-fill) !important;
  border-radius: var(--q-r-ctl) !important;
  background: var(--q-brand-fill) !important;
  color: var(--q-on-brand) !important;
  font-size: var(--q-fs-2) !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
  text-transform: none !important;
  box-shadow: none !important;
  width: auto;
}
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) :is(.qap-btn-outline, .qap-btn-ghost, .qap-btn-secondary, .button.alt-secondary, .generic-button > a, .generic-button > button, a.qa-btn-secondary, .friendship-button button, .friendship-button a, .qap-certcard-actions .qap-btn + .qap-btn, .qa-more-btn):not(.acomment-reply, .activity-meta *, .bp-secondary-action) {
  min-height: var(--q-h-btn) !important;
  padding: 0 14px !important;
  border: 1px solid var(--q-border-strong) !important;
  border-radius: var(--q-r-ctl) !important;
  background: var(--q-surface) !important;
  color: var(--q-text) !important;
  font-size: var(--q-fs-2) !important;
  font-weight: 600 !important;
  box-shadow: none !important;
}
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qa-more-btn { width: var(--q-h-btn) !important; padding: 0 !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) :is(.qap-btn, .button, button[type="submit"], input[type="submit"]):is(:disabled, [aria-disabled="true"]) { opacity: .5 !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) :is(.qap-btn-danger, .button.delete, .is-danger) { color: var(--q-danger) !important; }
/* Full-width only for form submissions and sheet actions */
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) form :is(button[type="submit"], input[type="submit"]):not(.qa-inline-submit) { min-height: var(--q-h-btn-lg) !important; }

/* Text links: blue only where a text action is meant */
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) :is(p, td, dd, .activity-inner) a:not([class]) { color: var(--q-brand) !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qap-note { color: var(--q-text-2) !important; font-size: var(--q-fs-2) !important; }

/* ---------- Forms ---------- */
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) :is(input[type="text"], input[type="email"], input[type="url"], input[type="tel"], input[type="number"], input[type="password"], input[type="search"], input[type="date"], input[type="datetime-local"], input[type="month"], select, textarea):not(.qa-plain) {
  min-height: var(--q-h-input) !important;
  padding: 10px 14px !important;
  border: 1px solid var(--q-border-strong) !important;
  border-radius: var(--q-r-ctl) !important;
  background-color: var(--q-surface) !important;
  color: var(--q-text) !important;
  font-size: 16px !important;
  line-height: 1.35 !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
  max-width: 100% !important;
}
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) textarea { min-height: 96px !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) :is(input, select, textarea):focus {
  border-color: var(--q-brand) !important;
  box-shadow: var(--q-ring) !important;
  outline: none !important;
}
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) :is(input, textarea)::placeholder { color: var(--q-text-3) !important; opacity: 1 !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) form label:not(.qa-plain):not([class*="radio"]):not([class*="check"]) { font-size: var(--q-fs-2) !important; font-weight: 600 !important; color: var(--q-text) !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) input[type="search"]:not(.qa-plain) {
  padding-left: 40px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238792A2' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: 12px 50% !important;
  background-size: 18px 18px !important;
  min-height: 44px !important;
}

/* ---------- Chips (filters) and badges (states) ---------- */
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) :is(.qa-chip, .qa-filter-chip, .qapf4-jchip, .qap-chip-btn) {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-height: var(--q-h-chip) !important;
  padding: 0 12px !important;
  border: 1px solid var(--q-border) !important;
  border-radius: 999px !important;
  background: var(--q-surface) !important;
  color: var(--q-text) !important;
  font-size: var(--q-fs-meta) !important;
  font-weight: 600 !important;
}
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) :is(.qap-badge, .qap-status, .qap-chip, .qap-nt-pill, .qap-certcard-top) {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  min-height: var(--q-h-badge) !important;
  height: auto !important;
  padding: 2px 10px !important;
  border: 0 !important;
  border-radius: 999px !important;
  font-size: var(--q-fs-small) !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  background: var(--q-surface-2) !important;
  color: var(--q-text-2) !important;
}
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) :is(.qap-status-active, .qap-badge-cert, .qap-chip-on, .qap-certcard-active .qap-certcard-top) { background: var(--q-success-soft) !important; color: var(--q-success) !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) :is(.qap-status-pending, .qap-status-review, .qap-status-submitted, .qap-chip-warn) { background: var(--q-warning-soft) !important; color: var(--q-warning) !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) :is(.qap-status-declined, .qap-status-suspended, .qap-status-withdrawn, .qap-status-expired, .qap-chip-bad) { background: var(--q-danger-soft) !important; color: var(--q-danger) !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) :is(.qap-status-info, .qap-chip-info) { background: var(--q-brand-soft) !important; color: var(--q-brand) !important; }

/* ---------- Tabs: text + 2px underline ---------- */
html.qa-app :is(body, #q#q#q) #buddypress :is(.bp-navs:not(.qap-srail), .activity-type-navs, .members-type-navs, .groups-type-navs, #subnav, .qap-msg-filters) {
  background: var(--q-surface) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--q-border) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 0 8px !important;
}
html.qa-app :is(body, #q#q#q) #buddypress :is(.bp-navs:not(.qap-srail), .activity-type-navs, .members-type-navs, .groups-type-navs, #subnav, .qap-msg-filters) ul {
  display: flex !important;
  flex-wrap: nowrap !important;
  justify-content: flex-start !important;
  gap: 0 !important;
  margin: 0 !important;
  padding: 0 8px !important;
  border: 0 !important;
  background: transparent !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: none !important;
  -webkit-overflow-scrolling: touch;
}
html.qa-app :is(body, #q#q#q) #buddypress :is(.bp-navs:not(.qap-srail), .activity-type-navs, .members-type-navs, .groups-type-navs, #subnav, .qap-msg-filters) ul::-webkit-scrollbar { display: none !important; }
html.qa-app :is(body, #q#q#q) #buddypress :is(.bp-navs:not(.qap-srail), .activity-type-navs, .members-type-navs, .groups-type-navs, #subnav, .qap-msg-filters) li {
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  min-width: 0 !important;
}
html.qa-app :is(body, #q#q#q) #buddypress :is(.bp-navs:not(.qap-srail), .activity-type-navs, .members-type-navs, .groups-type-navs, #subnav, .qap-msg-filters) li > a {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-height: 44px !important;
  padding: 0 10px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--q-text-2) !important;
  font-size: var(--q-fs-2) !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
  box-shadow: none !important;
  text-decoration: none !important;
}
html.qa-app :is(body, #q#q#q) #buddypress :is(.bp-navs:not(.qap-srail), .activity-type-navs, .members-type-navs, .groups-type-navs, #subnav, .qap-msg-filters) li:is(.selected, .current) > a {
  color: var(--q-text) !important;
  background: transparent !important;
}
html.qa-app :is(body, #q#q#q) #buddypress :is(.bp-navs:not(.qap-srail), .activity-type-navs, .members-type-navs, .groups-type-navs, #subnav, .qap-msg-filters) li:is(.selected, .current) > a::after {
  content: "" !important;
  position: absolute !important;
  left: 10px !important;
  right: 10px !important;
  bottom: 0 !important;
  height: 2px !important;
  border-radius: 2px !important;
  background: var(--q-brand) !important;
  display: block !important;
}
html.qa-app :is(body, #q#q#q) #buddypress :is(.bp-navs, .activity-type-navs, .members-type-navs) li a .count {
  min-width: 18px !important;
  height: 18px !important;
  padding: 0 5px !important;
  border: 0 !important;
  border-radius: 9px !important;
  background: var(--q-surface-2) !important;
  color: var(--q-text-2) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 18px !important;
}
html.qa-app :is(body, #q#q#q) #buddypress :is(.bp-navs, .activity-type-navs, .members-type-navs) li:is(.selected, .current) a .count { background: var(--q-brand-soft) !important; color: var(--q-brand) !important; }
/* Counts of zero say nothing */
html.qa-app :is(body, #q#q#q) #buddypress :is(.bp-navs, .activity-type-navs) li a .count:is(:empty, [data-count="0"]) { display: none !important; }

/* ---------- Cards: selective, flat ---------- */
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) :is(.qap-card, .qap-plain-card, .qap-rail-card, .qap-dash-panel, .woocommerce-MyAccount-content > .qap-form, .qap-result, .form-card, .qap-panel) {
  border: 1px solid var(--q-border) !important;
  border-radius: var(--q-r-card) !important;
  background: var(--q-surface) !important;
  box-shadow: none !important;
}
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) :is(.qap-card, .qap-plain-card, .qap-dash-panel, .form-card, .qap-panel) { padding: var(--q-pad) !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) :is(.qap-card, .qap-plain-card) :is(.qap-card, .qap-plain-card) { border: 0 !important; padding: 0 !important; background: transparent !important; }

/* ---------- Sheets, dialogs, toasts ---------- */
html.qa-app :is(body, #q#q#q) .qa-sheet {
  border-radius: var(--q-r-sheet) var(--q-r-sheet) 0 0 !important;
  background: var(--q-surface) !important;
  box-shadow: var(--q-shadow-2) !important;
}
html.qa-app :is(body, #q#q#q) .qa-sheet-backdrop { background: var(--q-scrim) !important; }
html.qa-app :is(body, #q#q#q) .qa-sheet-title { font-size: 18px !important; font-weight: 700 !important; color: var(--q-text) !important; }
html.qa-app :is(body, #q#q#q) .qa-sheet-btn { min-height: var(--q-h-btn-lg) !important; border-radius: var(--q-r-ctl) !important; font-size: 15px !important; font-weight: 600 !important; }
html.qa-app :is(body, #q#q#q) .qa-sheet-btn.is-primary { background: var(--q-brand-fill) !important; border-color: var(--q-brand-fill) !important; color: var(--q-on-brand) !important; }
html.qa-app :is(body, #q#q#q) .qa-sheet-btn:not(.is-primary):not(.is-danger) { background: var(--q-surface) !important; border: 1px solid var(--q-border-strong) !important; color: var(--q-text) !important; }
html.qa-app :is(body, #q#q#q) .qa-sheet-btn.is-danger { background: var(--q-danger) !important; border-color: var(--q-danger) !important; color: #FFFFFF !important; }
html.qa-app :is(body, #q#q#q) .qa-sheet-btn:disabled { opacity: .45 !important; }
html.qa-app :is(body, #q#q#q) :is(.qa-toast, .qa-conn, .qa-connection) {
  border-radius: var(--q-r-ctl) !important;
  background: var(--q-toast) !important;
  color: #FFFFFF !important;
  font-size: var(--q-fs-2) !important;
  font-weight: 500 !important;
  box-shadow: 0 6px 20px rgba(17, 24, 39, .18) !important;
}

/* ---------- Lists: rows and separators, not boxes ---------- */
html.qa-app :is(body, #q#q#q) .qa-menu-row, html.qa-app :is(body, #q#q#q) .qa-edit-row, html.qa-app :is(body, #q#q#q) .qa-status-row { min-height: 48px !important; }
html.qa-app :is(body, #q#q#q) .qa-menu-row { font-size: var(--q-fs-body) !important; color: var(--q-text) !important; }
html.qa-app :is(body, #q#q#q) .qa-menu-row .qa-ico { width: 22px !important; height: 22px !important; color: var(--q-text-2) !important; stroke-width: 1.9 !important; }
html.qa-app :is(body, #q#q#q) .qa-menu-children .qa-menu-row { min-height: 44px !important; font-size: var(--q-fs-2) !important; color: var(--q-text-2) !important; }
html.qa-app :is(body, #q#q#q) .qa-menu-section + .qa-menu-section,
html.qa-app :is(body, #q#q#q) .qa-menu-foot { border-top: 8px solid var(--q-bg) !important; }
html.qa-app :is(body, #q#q#q) .qa-menu-me { border-bottom: 1px solid var(--q-border) !important; }
html.qa-app :is(body, #q#q#q) .qa-menu-me img { width: 48px !important; height: 48px !important; }
html.qa-app :is(body, #q#q#q) .qa-menu-who strong { font-size: 16px !important; color: var(--q-text) !important; }
html.qa-app :is(body, #q#q#q) .qa-menu-who span { color: var(--q-brand) !important; font-size: var(--q-fs-meta) !important; font-weight: 600 !important; }

/* ---------- Full-width surfaces for social screens (Feed, Chat, Network, Notifications) ---------- */
html.qa-app :is(body, #q#q#q) :is(.qa-bleed, .qa-feed-status, #bp-nouveau-activity-form, .activity-list > li.activity-item, #members-list, .qap-msg-shell, .qap-nt-list, .qa-edit-list) {
  width: auto !important;
  max-width: none !important;
  margin-left: calc(-1 * var(--q-pad)) !important;
  margin-right: calc(-1 * var(--q-pad)) !important;
  border-radius: 0 !important;
  border-left: 0 !important;
  border-right: 0 !important;
  box-shadow: none !important;
}
html.qa-app :is(body, #q#q#q) #buddypress :is(.activity-type-navs, .members-type-navs, .groups-type-navs, .qap-msg-filters, #subnav.user-subnav) {
  margin-left: calc(-1 * var(--q-pad)) !important;
  margin-right: calc(-1 * var(--q-pad)) !important;
}

/* Feed: status line */
html.qa-app :is(body, #q#q#q) .qa-feed-status {
  margin-top: -12px !important;
  margin-bottom: 8px !important;
  padding: 12px var(--q-pad) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--q-border) !important;
  background: var(--q-surface) !important;
}
/* Feed: composer, about 64px + shortcuts */
html.qa-app :is(body, #q#q#q) #bp-nouveau-activity-form {
  margin-bottom: 8px !important;
  padding: 12px var(--q-pad) 4px !important;
  border: 0 !important;
  border-top: 1px solid var(--q-border) !important;
  border-bottom: 1px solid var(--q-border) !important;
  background: var(--q-surface) !important;
}
html.qa-app.qa-has-status :is(body, #q#q#q) #bp-nouveau-activity-form { border-top: 0 !important; margin-top: -8px !important; }
html.qa-app :is(body, #q#q#q) #bp-nouveau-activity-form #whats-new-form { display: flex !important; align-items: center !important; gap: 12px !important; margin: 0 !important; padding: 0 !important; }
html.qa-app :is(body, #q#q#q) #bp-nouveau-activity-form #whats-new-avatar { flex: 0 0 40px !important; margin: 0 !important; padding: 0 !important; }
html.qa-app :is(body, #q#q#q) #bp-nouveau-activity-form #whats-new-avatar img { width: 40px !important; height: 40px !important; border-radius: 50% !important; }
html.qa-app :is(body, #q#q#q) #bp-nouveau-activity-form #whats-new-content { flex: 1 1 auto !important; margin: 0 !important; padding: 0 !important; min-width: 0 !important; }
html.qa-app :is(body, #q#q#q) #bp-nouveau-activity-form #whats-new-textarea { margin: 0 !important; padding: 0 !important; }
html.qa-app :is(body, #q#q#q) #bp-nouveau-activity-form #whats-new {
  min-height: 42px !important;
  height: 42px !important;
  padding: 10px 16px !important;
  border: 1px solid var(--q-border) !important;
  border-radius: 21px !important;
  background: var(--q-surface-2) !important;
  font-size: var(--q-fs-body) !important;
  line-height: 1.35 !important;
  resize: none !important;
  box-shadow: none !important;
}
html.qa-app :is(body, #q#q#q) #bp-nouveau-activity-form.activity-form-expanded #whats-new,
html.qa-app :is(body, #q#q#q) #bp-nouveau-activity-form #whats-new:focus { height: auto !important; min-height: 96px !important; border-radius: var(--q-r-ctl) !important; background: var(--q-surface) !important; }
html.qa-app :is(body, #q#q#q) #buddypress #bp-nouveau-activity-form .qap-composer-actions {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 0 !important;
  margin: 8px 0 0 52px !important;
  padding: 0 !important;
  border: 0 !important;
}
html.qa-app :is(body, #q#q#q) #buddypress #bp-nouveau-activity-form .qap-composer-actions .qap-ca {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 6px !important;
  width: auto !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 8px 0 0 !important;
  border: 0 !important;
  border-radius: var(--q-r-sm) !important;
  background: transparent !important;
  color: var(--q-text-2) !important;
  font-size: var(--q-fs-meta) !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
  box-shadow: none !important;
}
html.qa-app :is(body, #q#q#q) #buddypress #bp-nouveau-activity-form .qap-composer-actions .qap-ca :is(svg, .qa-ico) { width: 20px !important; height: 20px !important; margin: 0 !important; color: var(--q-text-2) !important; stroke: currentColor !important; fill: none !important; }
html.qa-app :is(body, #q#q#q) #buddypress #bp-nouveau-activity-form .qap-composer-actions .qap-ca span { font-size: var(--q-fs-meta) !important; color: inherit !important; letter-spacing: 0 !important; }

/* Feed: posts as full-width surfaces with 8px between them */
html.qa-app :is(body, #q#q#q) #buddypress .activity-list { background: transparent !important; border: 0 !important; margin: 0 !important; padding: 0 !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list > li.activity-item {
  margin-bottom: 8px !important;
  padding: 12px var(--q-pad) 0 !important;
  border: 0 !important;
  border-top: 1px solid var(--q-border) !important;
  border-bottom: 1px solid var(--q-border) !important;
  background: var(--q-surface) !important;
}
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .activity-avatar { width: 44px !important; margin: 0 12px 0 0 !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .activity-avatar img { width: 44px !important; height: 44px !important; border-radius: 50% !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .activity-header { padding-right: 44px !important; margin: 0 !important; line-height: 1.35 !important; font-size: var(--q-fs-2) !important; color: var(--q-text-2) !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .activity-header :is(.qap-ah-name, a:first-child) { font-size: var(--q-fs-body) !important; font-weight: 600 !important; color: var(--q-text) !important; text-decoration: none !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .activity-header a { color: var(--q-text) !important; font-weight: 600 !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .activity-header .qap-ah-sub { display: block !important; font-size: var(--q-fs-meta) !important; font-weight: 400 !important; color: var(--q-text-2) !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .activity-header :is(.qap-ah-time, .activity-time-since) { display: inline !important; font-size: var(--q-fs-small) !important; font-weight: 400 !important; color: var(--q-text-3) !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .activity-inner { margin: 10px 0 0 !important; padding: 0 !important; font-size: var(--q-fs-body) !important; line-height: 1.5 !important; color: var(--q-text) !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .qap-topright { top: 6px !important; right: 4px !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .qap-post-more { width: 40px !important; height: 40px !important; border-radius: 50% !important; color: var(--q-text-2) !important; background: transparent !important; border: 0 !important; }
/* Post actions: quiet */
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .activity-meta { margin: 8px -8px 0 !important; padding: 2px 0 !important; border-top: 1px solid var(--q-border) !important; background: transparent !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .qap-bar { display: flex !important; justify-content: space-between !important; gap: 0 !important; margin: 0 !important; padding: 0 !important; border: 0 !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list :is(.qap-act, .acomment-reply) {
  flex: 1 1 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  min-height: 42px !important;
  padding: 0 4px !important;
  border: 0 !important;
  border-radius: var(--q-r-sm) !important;
  background: transparent !important;
  color: var(--q-text-2) !important;
  font-size: var(--q-fs-meta) !important;
  font-weight: 600 !important;
  box-shadow: none !important;
}
html.qa-app :is(body, #q#q#q) #buddypress .activity-list :is(.qap-act, .acomment-reply) svg { width: 20px !important; height: 20px !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list :is(.qap-act, .acomment-reply):active { background: var(--q-surface-2) !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .qap-act.is-on, html.qa-app :is(body, #q#q#q) #buddypress .activity-list .qap-like[aria-pressed="true"] { color: var(--q-brand) !important; }
/* A new connection inside a post: one compact row, not a second card */
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .bp-member-activity-preview { margin: 8px 0 4px !important; padding: 0 !important; border: 0 !important; background: transparent !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .bp-member-short-description {
  display: grid !important;
  grid-template-columns: 48px minmax(0, 1fr) auto !important;
  grid-template-rows: auto auto !important;
  column-gap: 12px !important;
  align-items: center !important;
  padding: 12px !important;
  border: 1px solid var(--q-border) !important;
  border-radius: var(--q-r-card) !important;
  background: var(--q-surface-2) !important;
  text-align: left !important;
}
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .bp-member-avatar-content { grid-row: 1 / span 2 !important; margin: 0 !important; width: 48px !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .bp-member-avatar-content img { width: 48px !important; height: 48px !important; border-radius: 50% !important; margin: 0 !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .bp-member-short-description-title { grid-column: 2 !important; margin: 0 !important; font-size: var(--q-fs-body) !important; font-weight: 600 !important; text-align: left !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .bp-member-short-description-title a { color: var(--q-text) !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .bp-member-nickname { grid-column: 2 !important; margin: 0 !important; font-size: var(--q-fs-meta) !important; text-align: left !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .bp-member-nickname a { color: var(--q-text-3) !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .bp-profile-button { grid-column: 3 !important; grid-row: 1 / span 2 !important; margin: 0 !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .bp-profile-button a { min-height: 36px !important; padding: 0 12px !important; border: 1px solid var(--q-border-strong) !important; border-radius: var(--q-r-ctl) !important; background: var(--q-surface) !important; color: var(--q-text) !important; font-size: var(--q-fs-meta) !important; font-weight: 600 !important; }

/* Loading: skeleton rows instead of "Loading..." */
html.qa-app :is(body, #q#q#q) #buddypress :is(.bp-feedback.loading, .loading.bp-feedback, #activity-stream > .loading, .activity > .bp-feedback.loading) {
  position: relative !important;
  min-height: 132px !important;
  margin: 0 calc(-1 * var(--q-pad)) 8px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: transparent !important;
  background:
    radial-gradient(circle 22px at 38px 34px, var(--q-border) 99%, transparent 100%),
    linear-gradient(var(--q-border), var(--q-border)) 72px 20px / 40% 12px no-repeat,
    linear-gradient(var(--q-border), var(--q-border)) 72px 42px / 26% 10px no-repeat,
    linear-gradient(var(--q-border), var(--q-border)) 16px 76px / calc(100% - 32px) 10px no-repeat,
    linear-gradient(var(--q-border), var(--q-border)) 16px 96px / 70% 10px no-repeat,
    var(--q-surface) !important;
  box-shadow: none !important;
}
html.qa-app :is(body, #q#q#q) #buddypress :is(.bp-feedback.loading, .loading.bp-feedback) * { visibility: hidden !important; }

/* ---------- Empty states and messages ---------- */
html.qa-app :is(body, #q#q#q) #buddypress .bp-feedback:not(.loading):not(.qa-keep),
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) :is(.woocommerce-info, .woocommerce-message, .qap-empty, .qap-msg-none) {
  display: block !important;
  margin: 0 0 12px !important;
  padding: 16px !important;
  border: 1px solid var(--q-border) !important;
  border-radius: var(--q-r-card) !important;
  background: var(--q-surface) !important;
  color: var(--q-text-2) !important;
  font-size: var(--q-fs-2) !important;
  line-height: 1.45 !important;
  box-shadow: none !important;
}
html.qa-app :is(body, #q#q#q) #buddypress .bp-feedback .bp-icon { display: none !important; }
html.qa-app :is(body, #q#q#q) #buddypress .bp-feedback p { margin: 0 !important; color: var(--q-text-2) !important; font-size: var(--q-fs-2) !important; }
html.qa-app :is(body, #q#q#q) #buddypress .bp-feedback.error, html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .woocommerce-error { border-color: var(--q-danger) !important; background: var(--q-danger-soft) !important; color: var(--q-danger) !important; }
html.qa-app :is(body, #q#q#q) #buddypress .bp-feedback.success, html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .woocommerce-message { border-color: transparent !important; background: var(--q-success-soft) !important; color: var(--q-success) !important; }

/* ---------- Avatars ---------- */
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) img.avatar, html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qap-avatar-img { border-radius: 50% !important; object-fit: cover !important; background: var(--q-surface-2) !important; }

/* ---------- Network: rows with separators ---------- */
html.qa-app :is(body, #q#q#q) #buddypress #members-list { margin-top: 0 !important; background: var(--q-surface) !important; border-top: 1px solid var(--q-border) !important; border-bottom: 1px solid var(--q-border) !important; padding: 0 !important; }
html.qa-app :is(body, #q#q#q) #buddypress #members-list > li {
  margin: 0 !important;
  padding: 12px var(--q-pad) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--q-border) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
html.qa-app :is(body, #q#q#q) #buddypress #members-list > li:last-child { border-bottom: 0 !important; }
html.qa-app :is(body, #q#q#q) #buddypress #members-list .list-wrap { display: flex !important; align-items: flex-start !important; gap: 12px !important; padding: 0 !important; margin: 0 !important; border: 0 !important; background: transparent !important; }
html.qa-app :is(body, #q#q#q) #buddypress #members-list .item-avatar { flex: 0 0 52px !important; width: 52px !important; margin: 0 !important; padding: 0 !important; }
html.qa-app :is(body, #q#q#q) #buddypress #members-list .item-avatar img { width: 52px !important; height: 52px !important; border-radius: 50% !important; }
html.qa-app :is(body, #q#q#q) #buddypress #members-list .item { flex: 1 1 auto !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; }
html.qa-app :is(body, #q#q#q) #buddypress #members-list .list-title { margin: 0 !important; font-size: var(--q-fs-body) !important; font-weight: 600 !important; line-height: 1.3 !important; }
html.qa-app :is(body, #q#q#q) #buddypress #members-list .list-title a { color: var(--q-text) !important; }
html.qa-app :is(body, #q#q#q) #buddypress #members-list .qap-ml-head { display: block !important; font-size: var(--q-fs-meta) !important; color: var(--q-text-2) !important; line-height: 1.35 !important; margin-top: 1px !important; }
html.qa-app :is(body, #q#q#q) #buddypress #members-list .qap-ml-badges { display: flex !important; flex-wrap: wrap !important; gap: 4px !important; margin: 4px 0 0 !important; }
html.qa-app :is(body, #q#q#q) #buddypress #members-list .item-meta, html.qa-app :is(body, #q#q#q) #buddypress #members-list .last-activity { margin: 2px 0 0 !important; font-size: var(--q-fs-small) !important; color: var(--q-text-3) !important; }
html.qa-app :is(body, #q#q#q) #buddypress #members-list .user-update { display: none !important; }
html.qa-app :is(body, #q#q#q) #buddypress #members-list :is(.action, .members-meta.action) { margin: 8px 0 0 !important; padding: 0 !important; display: flex !important; gap: 8px !important; }
html.qa-app :is(body, #q#q#q) #buddypress #members-list :is(.action, .members-meta.action) :is(button, a) { min-height: 36px !important; padding: 0 12px !important; font-size: var(--q-fs-meta) !important; }
html.qa-app :is(body, #q#q#q) #buddypress .component-filters, html.qa-app :is(body, #q#q#q) #buddypress .subnav-filters { margin: 0 0 8px !important; padding: 0 !important; }
html.qa-app :is(body, #q#q#q) #buddypress :is(.component-filters, .subnav-filters) select { min-height: 40px !important; font-size: var(--q-fs-2) !important; }

/* ---------- Chat: messenger rows ---------- */
html.qa-app :is(body, #q#q#q) .qap-msg-shell { border-top: 0 !important; border-bottom: 1px solid var(--q-border) !important; background: var(--q-surface) !important; padding: 0 !important; }
html.qa-app :is(body, #q#q#q) .qap-msg-shell .qap-msg-list { margin: 0 !important; }
html.qa-app :is(body, #q#q#q) .qap-msg-threads { margin: 0 !important; padding: 0 !important; border: 0 !important; }
html.qa-app :is(body, #q#q#q) .qap-msg-list, html.qa-app :is(body, #q#q#q) #buddypress ul.qap-msg-list {
  margin-top: 0 !important;
  padding: 0 !important;
  border-top: 1px solid var(--q-border) !important;
  border-bottom: 1px solid var(--q-border) !important;
  background: var(--q-surface) !important;
}
html.qa-app :is(body, #q#q#q) .qap-msg-item { position: relative !important; margin: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }
html.qa-app :is(body, #q#q#q) .qap-msg-item + .qap-msg-item::before { content: "" !important; position: absolute !important; top: 0 !important; left: 76px !important; right: 0 !important; height: 1px !important; background: var(--q-border) !important; }
html.qa-app :is(body, #q#q#q) .qap-msg-item > a { display: flex !important; align-items: center !important; gap: 12px !important; min-height: 72px !important; padding: 10px 48px 10px var(--q-pad) !important; text-decoration: none !important; color: var(--q-text) !important; }
html.qa-app :is(body, #q#q#q) .qap-msg-av, html.qa-app :is(body, #q#q#q) .qap-msg-av img { flex: 0 0 48px !important; width: 48px !important; height: 48px !important; border-radius: 50% !important; }
html.qa-app :is(body, #q#q#q) .qap-msg-body { flex: 1 1 auto !important; min-width: 0 !important; display: flex !important; flex-direction: column !important; gap: 2px !important; }
html.qa-app :is(body, #q#q#q) .qap-msg-row1 { display: flex !important; align-items: baseline !important; gap: 8px !important; }
html.qa-app :is(body, #q#q#q) .qap-msg-name { flex: 1 1 auto !important; min-width: 0 !important; font-size: var(--q-fs-body) !important; font-weight: 600 !important; color: var(--q-text) !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
html.qa-app :is(body, #q#q#q) .qap-msg-when { flex: 0 0 auto !important; font-size: var(--q-fs-small) !important; color: var(--q-text-3) !important; }
html.qa-app :is(body, #q#q#q) .qap-msg-prev { font-size: var(--q-fs-2) !important; color: var(--q-text-2) !important; line-height: 1.4 !important; display: -webkit-box !important; -webkit-line-clamp: 1 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; }
html.qa-app :is(body, #q#q#q) .qap-msg-item.is-unread .qap-msg-name, html.qa-app :is(body, #q#q#q) .qap-msg-item.unread .qap-msg-name { font-weight: 700 !important; }
html.qa-app :is(body, #q#q#q) .qap-msg-item:is(.is-unread, .unread) .qap-msg-prev { color: var(--q-text) !important; font-weight: 600 !important; }
html.qa-app :is(body, #q#q#q) .qap-msg-tools { position: absolute !important; top: 50% !important; right: 4px !important; transform: translateY(-50%) !important; }
html.qa-app :is(body, #q#q#q) .qap-msg-more { width: 40px !important; height: 40px !important; border: 0 !important; background: transparent !important; color: var(--q-text-3) !important; border-radius: 50% !important; }
html.qa-app.qa-chat :is(body, #q#q#q) .qa-chat-head { display: none !important; }

/* ---------- Notifications: rows ---------- */
html.qa-app :is(body, #q#q#q) :is(.qap-nt-list, #buddypress .notifications) { background: var(--q-surface) !important; }
html.qa-app :is(body, #q#q#q) .qap-nt-row {
  margin: 0 calc(-1 * var(--q-pad)) !important;
  padding: 12px var(--q-pad) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--q-border) !important;
  border-radius: 0 !important;
  background: var(--q-surface) !important;
  box-shadow: none !important;
}
html.qa-app :is(body, #q#q#q) .qap-nt-row:is(.is-unread, .unread) { background: var(--q-brand-soft) !important; }

/* ---------- Profile ---------- */
html.qa-app :is(body, #q#q#q) #buddypress #item-header.users-header {
  margin: -12px calc(-1 * var(--q-pad)) 8px !important;
  padding: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--q-border) !important;
  border-radius: 0 !important;
  background: var(--q-surface) !important;
  box-shadow: none !important;
  overflow: visible !important;
}
html.qa-app :is(body, #q#q#q) #buddypress #item-header #cover-image-container { margin: 0 !important; padding: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; border: 0 !important; }
html.qa-app :is(body, #q#q#q) #buddypress #item-header #header-cover-image {
  height: 132px !important;
  min-height: 132px !important;
  border-radius: 0 !important;
  background-color: var(--q-brand-hover) !important;
  background-size: cover !important;
  background-position: center !important;
}
html.qa-app :is(body, #q#q#q) #buddypress #item-header #item-header-cover-image { padding: 0 var(--q-pad) 16px !important; margin: 0 !important; background: transparent !important; }
html.qa-app :is(body, #q#q#q) #buddypress #item-header #item-header-avatar { margin: -46px 0 10px !important; padding: 0 !important; width: 92px !important; }
html.qa-app :is(body, #q#q#q) #buddypress #item-header #item-header-avatar img {
  width: 92px !important;
  height: 92px !important;
  border: 3px solid var(--q-surface) !important;
  border-radius: 50% !important;
  background: var(--q-surface-2) !important;
  box-shadow: none !important;
}
html.qa-app :is(body, #q#q#q) #buddypress #item-header #item-header-content { margin: 0 !important; padding: 0 !important; text-align: left !important; }
html.qa-app :is(body, #q#q#q) #buddypress #item-header .qap-name { margin: 0 !important; font-size: 22px !important; font-weight: 700 !important; line-height: 1.25 !important; color: var(--q-text) !important; }
html.qa-app :is(body, #q#q#q) #buddypress #item-header .user-nicename { display: none !important; }
html.qa-app :is(body, #q#q#q) #buddypress #item-header :is(.qap-headline, .qap-ph-headline, .qap-profile-headline) { margin: 2px 0 0 !important; font-size: var(--q-fs-body) !important; line-height: 1.4 !important; color: var(--q-text) !important; }
html.qa-app :is(body, #q#q#q) #buddypress #item-header :is(.qap-ph-meta, .qap-profile-meta, .qap-org) { margin: 2px 0 0 !important; font-size: var(--q-fs-meta) !important; color: var(--q-text-2) !important; }
html.qa-app :is(body, #q#q#q) #buddypress #item-header .member-header-actions {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 8px !important;
  margin: 12px 0 0 !important;
  padding: 0 !important;
}
html.qa-app :is(body, #q#q#q) #buddypress #item-header .member-header-actions > * { margin: 0 !important; flex: 0 0 auto !important; }
html.qa-app :is(body, #q#q#q) #buddypress #item-header .member-header-actions .qa-in-more { display: none !important; }
html.qa-app :is(body, #q#q#q) #buddypress #item-header .member-header-actions :is(button, a) { min-height: var(--q-h-btn) !important; width: auto !important; }
html.qa-app :is(body, #q#q#q) #buddypress #item-header .member-header-actions .qa-primary-action :is(button, a) {
  background: var(--q-brand-fill) !important;
  border-color: var(--q-brand-fill) !important;
  color: var(--q-on-brand) !important;
  padding: 0 18px !important;
}
html.qa-app :is(body, #q#q#q) #buddypress #item-header .member-header-actions .qa-member-more { width: var(--q-h-btn) !important; padding: 0 !important; }
html.qa-app :is(body, #q#q#q) #buddypress #item-header .member-header-actions .qa-member-more span { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; }
html.qa-app :is(body, #q#q#q) #buddypress #item-header .member-header-actions .qa-member-more svg { width: 20px !important; height: 20px !important; fill: currentColor !important; }
/* Profile tabs: underline, sticky under the top bar */
html.qa-app :is(body, #q#q#q) #buddypress nav.qap-srail {
  position: sticky !important;
  top: calc(var(--q-h-bar) + var(--safe-area-inset-top, env(safe-area-inset-top, 0px))) !important;
  z-index: 20 !important;
  margin: -8px calc(-1 * var(--q-pad)) 8px !important;
  padding: 0 8px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--q-border) !important;
  border-radius: 0 !important;
  background: var(--q-surface) !important;
  box-shadow: none !important;
}
html.qa-app :is(body, #q#q#q) #buddypress nav.qap-srail ul { display: flex !important; gap: 0 !important; margin: 0 !important; padding: 0 !important; grid-template-columns: none !important; }
html.qa-app :is(body, #q#q#q) #buddypress nav.qap-srail li { flex: 0 0 auto !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; }
html.qa-app :is(body, #q#q#q) #buddypress nav.qap-srail li > a {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-height: 46px !important;
  padding: 0 12px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--q-text-2) !important;
  font-size: var(--q-fs-2) !important;
  font-weight: 600 !important;
  box-shadow: none !important;
}
html.qa-app :is(body, #q#q#q) #buddypress nav.qap-srail li:is(.current, .selected) > a { color: var(--q-text) !important; background: transparent !important; }
html.qa-app :is(body, #q#q#q) #buddypress nav.qap-srail li:is(.current, .selected) > a::after { content: "" !important; position: absolute !important; left: 12px !important; right: 12px !important; bottom: 0 !important; height: 2px !important; border-radius: 2px !important; background: var(--q-brand) !important; }
html.qa-app :is(body, #q#q#q) #buddypress nav.qap-srail li > a .count { background: var(--q-surface-2) !important; color: var(--q-text-2) !important; border-radius: 9px !important; min-width: 18px !important; font-size: 11px !important; }
/* Profile sections: grouped surfaces, not stacked cards */
html.qa-app.qa-profile :is(body, #q#q#q) #buddypress #item-body :is(.qap-card, .qap-plain-card, .qap-psec, .profile .bp-widget) {
  margin: 0 calc(-1 * var(--q-pad)) 8px !important;
  padding: var(--q-pad) !important;
  border: 0 !important;
  border-top: 1px solid var(--q-border) !important;
  border-bottom: 1px solid var(--q-border) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* ---------- Dashboard ---------- */
html.qa-app :is(body, #q#q#q) .qa-dash-hello { margin: 4px 0 12px !important; font-size: var(--q-fs-h2) !important; font-weight: 700 !important; color: var(--q-text) !important; letter-spacing: -.01em !important; }
html.qa-app :is(body, #q#q#q) .qa-dash .qa-status-list { border-radius: 0 !important; border-left: 0 !important; border-right: 0 !important; }
html.qa-app :is(body, #q#q#q) .qa-dash .qa-dash-more { margin: 8px 0 0 !important; border-radius: 0 !important; border-left: 0 !important; border-right: 0 !important; }
html.qa-app :is(body, #q#q#q) .qa-status-row { padding: 12px var(--q-pad) !important; }
html.qa-app :is(body, #q#q#q) .qa-status-list { border-color: var(--q-border) !important; background: var(--q-surface) !important; }
html.qa-app :is(body, #q#q#q) .qa-status-row { border-bottom-color: var(--q-border) !important; }
html.qa-app :is(body, #q#q#q) .qa-status-title { font-size: var(--q-fs-body) !important; font-weight: 600 !important; color: var(--q-text) !important; }
html.qa-app :is(body, #q#q#q) .qa-status-text { font-size: var(--q-fs-meta) !important; color: var(--q-text-2) !important; }
html.qa-app :is(body, #q#q#q) .qa-status-action { font-size: var(--q-fs-2) !important; font-weight: 600 !important; color: var(--q-brand) !important; }

/* ---------- Certification: calm, structured ---------- */
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) ol.qap-steps { border-left-color: var(--q-border) !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qap-step-name { font-size: var(--q-fs-2) !important; font-weight: 600 !important; color: var(--q-text) !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) :is(.qap-table, table.shop_table) { border-color: var(--q-border) !important; border-radius: var(--q-r-card) !important; }

/* ---------- Edit profile rows ---------- */
html.qa-app :is(body, #q#q#q) .qa-edit-list { border-top: 1px solid var(--q-border) !important; border-bottom: 1px solid var(--q-border) !important; }
html.qa-app :is(body, #q#q#q) .qa-edit-row { padding: 10px var(--q-pad) !important; border-bottom-color: var(--q-border) !important; }
html.qa-app :is(body, #q#q#q) .qa-edit-label { font-size: var(--q-fs-meta) !important; color: var(--q-text-2) !important; }
html.qa-app :is(body, #q#q#q) .qa-edit-value { font-size: var(--q-fs-body) !important; color: var(--q-text) !important; }
html.qa-app :is(body, #q#q#q) .qa-edit-value.is-empty { color: var(--q-brand) !important; }

/* ---------- Motion ---------- */
@media (prefers-reduced-motion: reduce) {
  /* One short run, not an endless flicker: spinners and pulses rest in place. */
  html.qa-app *, html.qa-app *::before, html.qa-app *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

/* ---------- Titled tab screens (Chat, Network, Jobs) ---------- */
html.qa-app.qa-titled :is(body, #q#q#q) .qap-appbar-user { display: none !important; }
html.qa-app :is(body, #q#q#q) .qa-bar-actions { display: inline-flex !important; align-items: center !important; gap: 0 !important; margin-left: auto !important; }
html.qa-app.qa-titled :is(body, #q#q#q) .qa-title-row { display: none !important; }

/* ---------- Jobs: one compact search row ---------- */
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) form.qap-jobs-search {
  display: grid !important;
  grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr) 44px !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) form.qap-jobs-search > * { margin: 0 !important; min-width: 0 !important; width: auto !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) form.qap-jobs-search input { width: 100% !important; min-height: 44px !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) form.qap-jobs-search .qa-icon-submit { width: 44px !important; min-width: 44px !important; min-height: 44px !important; height: 44px !important; padding: 0 !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qa-icon-submit svg { width: 20px !important; height: 20px !important; }

/* Profile section tabs: the More button looks like the other tabs */
html.qa-app :is(body, #q#q#q) #buddypress nav.qap-srail li > button {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-height: 46px !important;
  padding: 0 12px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--q-text-2) !important;
  font-size: var(--q-fs-2) !important;
  font-weight: 600 !important;
  box-shadow: none !important;
}
html.qa-app :is(body, #q#q#q) #buddypress nav.qap-srail .qa-srail-badge { min-width: 18px !important; height: 18px !important; padding: 0 5px !important; border-radius: 9px !important; background: var(--q-surface-2) !important; color: var(--q-text-2) !important; font-size: 11px !important; line-height: 18px !important; }

/* Post actions: Like, Comment, Repost, Send in one quiet row */
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .activity-meta { display: flex !important; flex-wrap: wrap !important; align-items: center !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .activity-meta > .qap-summary { order: -1 !important; flex: 1 0 100% !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .activity-meta > .qap-summary:empty { display: none !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .activity-meta > .qap-bar { display: contents !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .activity-meta .qap-asme { display: none !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .activity-meta .qap-like-wrap { order: 1 !important; flex: 1 1 0 !important; display: flex !important; min-width: 0 !important; position: relative !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .activity-meta .qap-like-wrap > .qap-like { flex: 1 1 auto !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .activity-meta > .generic-button { order: 2 !important; flex: 1 1 0 !important; display: flex !important; margin: 0 !important; padding: 0 !important; min-width: 0 !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .activity-meta > .generic-button > a { flex: 1 1 auto !important; flex-direction: row !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .activity-meta .qap-repost { order: 3 !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .activity-meta .qap-send { order: 4 !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .activity-meta :is(.qap-act, .acomment-reply) { flex-direction: row !important; min-width: 0 !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .activity-meta :is(.qap-act-label, .bp-screen-reader-text) { position: static !important; width: auto !important; height: auto !important; clip: auto !important; overflow: visible !important; margin: 0 !important; font-size: var(--q-fs-meta) !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .activity-meta .acomment-reply::before { margin: 0 !important; font-size: 18px !important; width: 20px !important; height: 20px !important; line-height: 20px !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .activity-meta .acomment-reply svg { margin: 0 !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .activity-meta .comment-count:not([hidden]) { font-size: var(--q-fs-small) !important; color: var(--q-text-3) !important; }
/* Icons drawn with lines stay unfilled */
html.qa-app :is(body, #q#q#q) :is(.qap-ab-bell, .qa-bar-action, .qa-bar-search) .qa-ico { fill: none !important; stroke: currentColor !important; }
html.qa-app :is(body, #q#q#q) .qap-tabbar > .qap-tab.qa-tab { box-shadow: none !important; outline-offset: -4px !important; }
html.qa-app :is(body, #q#q#q) .qap-tabbar > .qap-tab.qa-tab::before, html.qa-app :is(body, #q#q#q) .qap-tabbar > .qap-tab.qa-tab::after { content: none !important; display: none !important; }

/* Detail screens: the name only. Tab screens other than the Feed: the name and their actions. */
html.qa-app.qa-inner :is(body, #q#q#q) .qap-appbar-logo,
html.qa-app.qa-inner :is(body, #q#q#q) .qap-appbar-user,
html.qa-app.qa-titled :is(body, #q#q#q) .qap-appbar-logo { display: none !important; }
/* Nothing floats between the top bar and the first surface */
html.qa-app :is(body, #q#q#q) .policy-content > :first-child, html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) #buddypress > :first-child { margin-top: 0 !important; }
html.qa-app.qa-root :is(body, #q#q#q) .policy-content { padding-top: 0 !important; }
html.qa-app.qa-root :is(body, #q#q#q) .qa-feed-status { margin-top: 0 !important; }
html.qa-app.qa-root :is(body, #q#q#q) #buddypress :is(.members-type-navs, .qap-msg-filters) { margin-top: 0 !important; }
html.qa-app.qa-profile :is(body, #q#q#q) .policy-content { padding-top: 0 !important; }
html.qa-app.qa-dash-root :is(body, #q#q#q) .policy-content { padding-top: 0 !important; }

/* Network: internal IDs stay on the profile; filters are compact */
html.qa-app :is(body, #q#q#q) #buddypress #members-list .qap-ml-badges .qap-badge:not(.qap-badge-cert) { display: none !important; }
html.qa-app :is(body, #q#q#q) #buddypress .component-filters { display: flex !important; justify-content: flex-end !important; margin: 0 0 8px !important; }
html.qa-app :is(body, #q#q#q) #buddypress :is(.component-filters, .subnav-filters) select {
  width: auto !important;
  min-height: 36px !important;
  height: 36px !important;
  padding: 0 32px 0 12px !important;
  border: 1px solid var(--q-border) !important;
  border-radius: 999px !important;
  background-color: var(--q-surface) !important;
  font-size: var(--q-fs-meta) !important;
  font-weight: 600 !important;
  color: var(--q-text) !important;
}
html.qa-app :is(body, #q#q#q) #buddypress .select-wrap { border: 0 !important; background: transparent !important; width: auto !important; }

/* Chat: search is one field; Enter searches */
html.qa-app :is(body, #q#q#q) .bp-messages-search-form { display: flex !important; gap: 0 !important; margin: 8px 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; }
html.qa-app :is(body, #q#q#q) .bp-messages-search-form input[type="search"] { flex: 1 1 auto !important; width: 100% !important; padding-left: 40px !important; }
html.qa-app :is(body, #q#q#q) .bp-messages-search-form button[type="submit"] { display: none !important; }
html.qa-app :is(body, #q#q#q) #subnav.bp-messages-filters, html.qa-app :is(body, #q#q#q) .bp-messages-filters { padding: 0 !important; margin: 0 !important; border: 0 !important; background: transparent !important; }

/* Profile header: cover band, photo over its edge, details on white */
html.qa-app :is(body, #q#q#q) #buddypress #item-header #cover-image-container {
  position: relative !important;
  margin: 0 calc(-1 * var(--q-pad)) 8px !important;
  background: var(--q-surface) !important;
  border-bottom: 1px solid var(--q-border) !important;
}
html.qa-app :is(body, #q#q#q) #buddypress #item-header #header-cover-image { position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important; width: 100% !important; }
html.qa-app :is(body, #q#q#q) #buddypress #item-header #item-header-cover-image { position: relative !important; top: 0 !important; transform: none !important; padding-top: 132px !important; }
html.qa-app :is(body, #q#q#q) #buddypress #item-header #item-header-avatar { position: relative !important; top: 0 !important; z-index: 2 !important; }
html.qa-app :is(body, #q#q#q) #buddypress #item-header .qap-headline { margin: 2px 0 0 !important; font-size: var(--q-fs-body) !important; line-height: 1.4 !important; color: var(--q-text) !important; }
html.qa-app :is(body, #q#q#q) #buddypress #item-header .qap-hero-loc { margin: 2px 0 0 !important; font-size: var(--q-fs-meta) !important; color: var(--q-text-2) !important; }
html.qa-app :is(body, #q#q#q) #buddypress #item-header .qap-hero-loc a { color: var(--q-text-2) !important; }
html.qa-app :is(body, #q#q#q) #buddypress #item-header .qap-conns { margin: 4px 0 0 !important; font-size: var(--q-fs-meta) !important; font-weight: 600 !important; color: var(--q-brand) !important; }
html.qa-app :is(body, #q#q#q) #buddypress #item-header .qap-conns a { color: var(--q-brand) !important; }
html.qa-app :is(body, #q#q#q) #buddypress #item-header .qap-hero-meta { display: flex !important; flex-wrap: wrap !important; gap: 6px !important; margin: 8px 0 0 !important; }
html.qa-app :is(body, #q#q#q) #buddypress #item-header .item-meta { margin: 4px 0 0 !important; font-size: var(--q-fs-small) !important; color: var(--q-text-3) !important; }
html.qa-app :is(body, #q#q#q) #buddypress #item-header .qap-name.qa-dup-title { display: block !important; }
/* Header actions sit after the details */
html.qa-app :is(body, #q#q#q) #buddypress #item-header #item-header-content { display: flex !important; flex-direction: column !important; }
html.qa-app :is(body, #q#q#q) #buddypress #item-header #item-header-content > .member-header-actions { order: 10 !important; }

/* ---------- Certification progress: dots joined by a line ---------- */
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) ol.qap-steps > li { min-height: 36px !important; margin: 0 !important; gap: 12px !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) ol.qap-steps > li:not(:last-child)::before { left: 9px !important; top: 26px !important; height: 18px !important; width: 2px !important; background: var(--q-border-strong) !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) ol.qap-steps > li:is(.is-done):not(:last-child)::before { background: var(--q-brand) !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) ol.qap-steps .qap-step-dot {
  flex: 0 0 20px !important;
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  border: 2px solid var(--q-border-strong) !important;
  border-radius: 50% !important;
  background: var(--q-surface) !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) ol.qap-steps > li.is-done .qap-step-dot {
  border-color: var(--q-brand) !important;
  background: var(--q-brand) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center / 12px no-repeat !important;
}
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) ol.qap-steps > li.is-now .qap-step-dot { border-color: var(--q-brand) !important; box-shadow: inset 0 0 0 3px var(--q-surface), inset 0 0 0 10px var(--q-brand) !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) ol.qap-steps .qap-step-name { font-size: var(--q-fs-2) !important; font-weight: 500 !important; color: var(--q-text-2) !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) ol.qap-steps > li:is(.is-done, .is-now) .qap-step-name { color: var(--q-text) !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) ol.qap-steps > li.is-now .qap-step-name { font-weight: 700 !important; }
/* One primary action at its natural width, ⋯ beside it */
html.qa-app :is(body, #q#q#q) .qa-primary-more { display: flex !important; flex-wrap: nowrap !important; gap: 8px !important; align-items: center !important; }
html.qa-app :is(body, #q#q#q) .qa-primary-more > :is(.qap-btn, .button, a) { flex: 0 1 auto !important; width: auto !important; }

/* ---------- Records: rows inside one surface, not cards inside a card ---------- */
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) :is(.qap-card, .qap-plain-card) table.qa-stack tr {
  margin: 0 !important;
  padding: 8px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--q-border) !important;
  border-radius: 0 !important;
  background: transparent !important;
}
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) :is(.qap-card, .qap-plain-card) table.qa-stack tr:last-child { border-bottom: 0 !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) table.qa-stack tr { border-color: var(--q-border) !important; border-radius: var(--q-r-card) !important; background: var(--q-surface) !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) table.qa-stack :is(td, th) { padding: 8px 0 !important; border-bottom: 0 !important; font-size: var(--q-fs-2) !important; color: var(--q-text) !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) table.qa-stack :is(td, th)[data-qa-label]::before { flex: 0 0 38% !important; font-size: var(--q-fs-meta) !important; font-weight: 500 !important; color: var(--q-text-2) !important; text-transform: none !important; letter-spacing: 0 !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) table.qa-stack .qa-stack-title { font-size: var(--q-fs-body) !important; font-weight: 600 !important; color: var(--q-text) !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qap-rlabel, html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qap-lbl, html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) dt { text-transform: none !important; letter-spacing: 0 !important; font-size: var(--q-fs-meta) !important; font-weight: 500 !important; color: var(--q-text-2) !important; }
/* Text actions (Withdraw, Remove) look like actions, not web links */
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) :is(a, button).qap-link-danger, html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) a[href*="withdraw"], html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) button[name*="withdraw"] { color: var(--q-danger) !important; text-decoration: none !important; font-weight: 600 !important; }

/* ---------- "How it works" instead of paragraphs at the top of working screens ---------- */
html.qa-app :is(body, #q#q#q) .qa-about-link {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-height: 36px !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--q-brand) !important;
  font-size: var(--q-fs-2) !important;
  font-weight: 600 !important;
  cursor: pointer;
}
html.qa-app :is(body, #q#q#q) .qa-about-link .qa-ico { width: 18px !important; height: 18px !important; }
html.qa-app :is(body, #q#q#q) .qa-about-body p { margin: 0 0 12px !important; font-size: var(--q-fs-body) !important; line-height: 1.5 !important; color: var(--q-text) !important; }

/* ---------- Empty state ---------- */
html.qa-app :is(body, #q#q#q) :is(.qa-empty, :is(#qapf4-main, #qapf2-main, main) p.qap-job-empty.qa-empty) {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 4px !important;
  margin: 0 !important;
  padding: 32px 16px !important;
  border: 0 !important;
  background: transparent !important;
  text-align: center !important;
  color: var(--q-text-2) !important;
}
html.qa-app :is(body, #q#q#q) .qa-empty strong { font-size: var(--q-fs-body) !important; font-weight: 600 !important; color: var(--q-text) !important; }
html.qa-app :is(body, #q#q#q) .qa-empty span { font-size: var(--q-fs-2) !important; color: var(--q-text-2) !important; }
html.qa-app :is(body, #q#q#q) .qa-empty .qa-empty-action {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 36px !important;
  margin-top: 8px !important;
  padding: 0 14px !important;
  border: 1px solid var(--q-border-strong) !important;
  border-radius: var(--q-r-ctl) !important;
  background: var(--q-surface) !important;
  color: var(--q-text) !important;
  font-size: var(--q-fs-meta) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}

/* ---------- Jobs ---------- */
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) form.qap-jobs-search { margin-top: 12px !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) form.qap-jobs-search input[type="search"] { padding-left: 38px !important; background-position: 11px 50% !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) form.qap-jobs-search input:not([type="search"]) { padding-left: 12px !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qap-jobs-shell { border: 0 !important; background: transparent !important; padding: 0 !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qap-jobs-shell > :first-child { padding: 0 0 8px !important; border-bottom: 0 !important; }

/* ---------- Notifications: filters and "Mark all as read" in one band ---------- */
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qap-nt-bar {
  margin: 0 calc(-1 * var(--q-pad)) !important;
  padding: 10px var(--q-pad) 4px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: var(--q-surface) !important;
}
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qap-nt-pills { display: flex !important; flex-wrap: wrap !important; gap: 6px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qap-nt-pills > * {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 32px !important;
  padding: 0 11px !important;
  border: 1px solid var(--q-border) !important;
  border-radius: 999px !important;
  background: var(--q-surface) !important;
  color: var(--q-text) !important;
  font-size: var(--q-fs-meta) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qap-nt-pills > :is(.is-on, .current, [aria-current], .active) { background: var(--q-brand-soft) !important; border-color: var(--q-brand-soft) !important; color: var(--q-brand) !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qapf4-nt-toolbar {
  display: flex !important;
  justify-content: flex-end !important;
  margin: 0 calc(-1 * var(--q-pad)) 8px !important;
  padding: 0 8px 4px !important;
  border-bottom: 1px solid var(--q-border) !important;
  background: var(--q-surface) !important;
}
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qapf4-nt-toolbar .qap-btn { min-height: 36px !important; padding: 0 8px !important; border: 0 !important; background: transparent !important; color: var(--q-brand) !important; font-size: var(--q-fs-meta) !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qap-nt-list { border-top: 0 !important; }

/* ---------- Staff workspace: tabs in one row ---------- */
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qap-apd-tabs {
  display: flex !important;
  gap: 0 !important;
  margin: 8px 0 12px !important;
  padding: 0 !important;
  border-bottom: 1px solid var(--q-border) !important;
  grid-template-columns: none !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: none !important;
}
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qap-apd-tabs::-webkit-scrollbar { display: none !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qap-apd-tabs > * {
  position: relative !important;
  flex: 0 0 auto !important;
  min-height: 44px !important;
  padding: 0 12px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--q-text-2) !important;
  font-size: var(--q-fs-2) !important;
  font-weight: 600 !important;
  display: inline-flex !important;
  align-items: center !important;
  text-decoration: none !important;
  box-shadow: none !important;
}
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qap-apd-tabs > :is(.is-on, .current, [aria-current="page"], [aria-selected="true"], .active) { color: var(--q-text) !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qap-apd-tabs > :is(.is-on, .current, [aria-current="page"], [aria-selected="true"], .active)::after { content: "" !important; position: absolute !important; left: 12px !important; right: 12px !important; bottom: 0 !important; height: 2px !important; background: var(--q-brand) !important; border-radius: 2px !important; }

/* ---------- Feed post layout: photo + header on one line, content and actions full width ---------- */
html.qa-app :is(body, #q#q#q) #buddypress .activity-list > li.activity-item {
  display: grid !important;
  grid-template-columns: 44px minmax(0, 1fr) !important;
  column-gap: 12px !important;
  align-items: start !important;
  position: relative !important;
}
html.qa-app :is(body, #q#q#q) #buddypress .activity-list > li.activity-item > .activity-avatar { grid-column: 1 !important; grid-row: 1 !important; float: none !important; margin: 0 !important; position: static !important; inset: auto !important; transform: none !important; align-self: start !important; height: 44px !important; line-height: 0 !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list > li.activity-item > .activity-avatar :is(a, img) { display: block !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list > li.activity-item > .activity-content { display: contents !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list > li.activity-item > .activity-content > .activity-header { grid-column: 2 !important; grid-row: 1 !important; align-self: center !important; min-width: 0 !important; width: auto !important; box-sizing: border-box !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list > li.activity-item > .activity-content > :not(.activity-header) { grid-column: 1 / -1 !important; min-width: 0 !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list > li.activity-item > :not(.activity-avatar):not(.activity-content):not(.qap-topright) { grid-column: 1 / -1 !important; min-width: 0 !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .activity-meta { margin: 8px -8px 0 !important; width: auto !important; max-width: none !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .activity-header { overflow-wrap: anywhere !important; }

/* ---------- Chat rows: the conversation and its ⋯ side by side ---------- */
html.qa-app :is(body, #q#q#q) .qap-msg-item { display: flex !important; align-items: center !important; }
html.qa-app :is(body, #q#q#q) .qap-msg-item > a { flex: 1 1 auto !important; min-width: 0 !important; padding-right: 4px !important; }
html.qa-app :is(body, #q#q#q) .qap-msg-tools { position: static !important; transform: none !important; flex: 0 0 auto !important; margin-right: 4px !important; padding: 0 !important; }
html.qa-app :is(body, #q#q#q) .qap-msg-item > a { border: 0 !important; }
html.qa-app :is(body, #q#q#q) .qap-msg-item .qap-msg-more { opacity: 1 !important; visibility: visible !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; padding: 0 !important; }
html.qa-app :is(body, #q#q#q) .qap-msg-item .qap-msg-more svg { width: 20px !important; height: 20px !important; fill: currentColor !important; }

/* Chat: tabs sit inside the full-width list, so they do not bleed again */
html.qa-app :is(body, #q#q#q) #buddypress .qap-msg-shell :is(.qap-msg-filters, #subnav) { margin-left: 0 !important; margin-right: 0 !important; }
html.qa-app :is(body, #q#q#q) #buddypress .qap-msg-shell :is(.qap-msg-filters, #subnav) li > a { margin: 0 !important; }
/* Chat search: one field; the magnifier inside it is the search button */
html.qa-app :is(body, #q#q#q) #buddypress .qap-msg-search { padding: 12px var(--q-pad) !important; margin: 0 !important; }
html.qa-app :is(body, #q#q#q) #buddypress form#user_messages_search_form { position: relative !important; display: block !important; width: 100% !important; margin: 0 !important; }
html.qa-app :is(body, #q#q#q) #buddypress #user_messages_search { width: 100% !important; max-width: none !important; padding-left: 44px !important; padding-right: 14px !important; background-image: none !important; }
html.qa-app :is(body, #q#q#q) #buddypress #user_messages_search_submit { position: absolute !important; left: 1px !important; top: 1px !important; bottom: 1px !important; width: 42px !important; min-width: 0 !important; height: auto !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; background: transparent !important; border: 0 !important; border-radius: 10px 0 0 10px !important; box-shadow: none !important; color: var(--q-text-3) !important; }
html.qa-app :is(body, #q#q#q) #buddypress #user_messages_search_submit .dashicons { width: 20px !important; height: 20px !important; font-size: 20px !important; line-height: 20px !important; color: inherit !important; }

/* Network: the sort menu is a compact chip, not a full-size field */
html.qa-app :is(body, #q#q#q) #buddypress #subnav-filters { margin: 8px 0 4px !important; min-height: 0 !important; justify-content: flex-end !important; }
html.qa-app :is(body, #q#q#q) #buddypress #subnav-filters #dir-filters { margin: 0 !important; }
html.qa-app :is(body, #q#q#q) #buddypress #subnav-filters select { height: 36px !important; min-height: 36px !important; width: auto !important; margin: 0 !important; padding: 0 32px 0 12px !important; font-size: var(--q-fs-meta) !important; font-weight: 600 !important; border-radius: 999px !important; background-position: right 10px center !important; }

/* ---------- Network rows: the photo link is the photo ---------- */
html.qa-app :is(body, #q#q#q) #buddypress #members-list .item-avatar a { display: block !important; width: 52px !important; height: 52px !important; }
html.qa-app :is(body, #q#q#q) #buddypress #members-list .list-title a { overflow-wrap: anywhere !important; }

/* ---------- Small controls get a full touch target ---------- */
html.qa-app :is(body, #q#q#q) .qap-vmark-btn { display: inline-flex !important; align-items: center !important; justify-content: center !important; min-width: 32px !important; min-height: 32px !important; margin: -3px -6px !important; vertical-align: middle !important; background: transparent !important; border: 0 !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qap-edit { display: inline-flex !important; align-items: center !important; min-height: 32px !important; padding: 0 4px !important; font-size: var(--q-fs-meta) !important; font-weight: 600 !important; color: var(--q-brand) !important; text-decoration: none !important; }
html.qa-app :is(body, #q#q#q) .qa-copy { width: 32px !important; height: 32px !important; min-width: 32px !important; margin: -8px -6px -8px -2px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; vertical-align: middle !important; }
html.qa-app :is(body, #q#q#q) .qa-copy svg { width: 18px !important; height: 18px !important; }

/* ---------- Long names and titles wrap instead of pushing things aside ---------- */
html.qa-app :is(body, #q#q#q) :is(.qa-status-title, .qa-status-text, .qa-edit-value, .qa-menu-label, .qap-ml-head, .qap-headline, .qap-hero-loc, .qap-name, .qap-msg-name, h1, h2, h3) { overflow-wrap: anywhere !important; }
html.qa-app :is(body, #q#q#q) .qa-status-info, html.qa-app :is(body, #q#q#q) .qa-edit-info, html.qa-app :is(body, #q#q#q) .qa-menu-label, html.qa-app :is(body, #q#q#q) .qap-msg-body { min-width: 0 !important; }
html.qa-app :is(body, #q#q#q) .qa-dash-more-body .qa-in-details { margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; }
html.qa-app :is(body, #q#q#q) .qa-dash-more-body .qa-in-details > :is(h2, h3) { display: none !important; }

/* =====================================================================================
   Shared components (one implementation each): SectionLabel, Badge, SmallButton, TextButton,
   ChipRow, StateChip, RowActions, RecordRow, CertificationSummary
   ===================================================================================== */
/* Section labels: small sentence-case labels, not uppercase bands */
html.qa-app :is(body, #q#q#q) .qa-sec-label, html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qa-sec-label {
  margin: 16px 0 6px !important;
  padding: 0 !important;
  font-size: var(--q-fs-meta) !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: var(--q-text-2) !important;
  line-height: 1.3 !important;
}
html.qa-app :is(body, #q#q#q) .qa-badge {
  display: inline-flex !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  min-height: var(--q-h-badge) !important;
  padding: 2px 10px !important;
  border-radius: 999px !important;
  font-size: var(--q-fs-small) !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  white-space: nowrap !important;
  background: var(--q-surface-2) !important;
  color: var(--q-text-2) !important;
}
html.qa-app :is(body, #q#q#q) .qa-badge.is-good { background: var(--q-success-soft) !important; color: var(--q-success) !important; }
html.qa-app :is(body, #q#q#q) .qa-badge.is-warn { background: var(--q-warning-soft) !important; color: var(--q-warning) !important; }
html.qa-app :is(body, #q#q#q) .qa-badge.is-bad { background: var(--q-danger-soft) !important; color: var(--q-danger) !important; }
html.qa-app :is(body, #q#q#q) .qa-badge.is-info { background: var(--q-brand-soft) !important; color: var(--q-brand) !important; }
html.qa-app :is(body, #q#q#q) .qa-btn-sm {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  min-height: 36px !important;
  padding: 0 14px !important;
  border: 1px solid var(--q-border-strong) !important;
  border-radius: var(--q-r-ctl) !important;
  background: var(--q-surface) !important;
  color: var(--q-text) !important;
  font-size: var(--q-fs-meta) !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  box-shadow: none !important;
  cursor: pointer;
}
html.qa-app :is(body, #q#q#q) .qa-btn-sm.is-primary { background: var(--q-brand-fill) !important; border-color: var(--q-brand-fill) !important; color: var(--q-on-brand) !important; }
html.qa-app :is(body, #q#q#q) .qa-btn-sm:disabled { opacity: .55 !important; }
html.qa-app :is(body, #q#q#q) .qa-text-btn {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 36px !important;
  padding: 0 4px !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--q-brand) !important;
  font-size: var(--q-fs-2) !important;
  font-weight: 600 !important;
  cursor: pointer;
  text-decoration: none !important;
}
html.qa-app :is(body, #q#q#q) .qa-chip-row {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 8px !important;
  margin: 0 calc(-1 * var(--q-pad)) 8px !important;
  padding: 2px var(--q-pad) !important;
  overflow-x: auto !important;
  scrollbar-width: none !important;
}
html.qa-app :is(body, #q#q#q) .qa-chip-row::-webkit-scrollbar { display: none !important; }
html.qa-app :is(body, #q#q#q) .qa-chip-row.qa-filter-chips { margin: 0 0 12px !important; padding: 2px 0 !important; }
html.qa-app :is(body, #q#q#q) a.qa-chip, html.qa-app :is(body, #q#q#q) a.qa-chip:hover { text-decoration: none !important; }
html.qa-app :is(body, #q#q#q) a.qa-chip:not(.is-on) { color: var(--q-text) !important; }
html.qa-app :is(body, #q#q#q) .qa-chip {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  flex: 0 0 auto !important;
  min-height: var(--q-h-chip) !important;
  padding: 0 12px !important;
  border: 1px solid var(--q-border) !important;
  border-radius: 999px !important;
  background: var(--q-surface) !important;
  color: var(--q-text) !important;
  font-size: var(--q-fs-meta) !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
  cursor: pointer;
}
html.qa-app :is(body, #q#q#q) .qa-chip .qa-ico { width: 16px !important; height: 16px !important; }
html.qa-app :is(body, #q#q#q) .qa-chip.is-on { background: var(--q-brand-soft) !important; border-color: var(--q-brand-soft) !important; color: var(--q-brand) !important; }
html.qa-app :is(body, #q#q#q) .qa-state-chip {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 32px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  background: var(--q-surface-2) !important;
  color: var(--q-text-2) !important;
  font-size: var(--q-fs-meta) !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
}
html.qa-app :is(body, #q#q#q) .qa-row-actions { display: flex !important; align-items: center !important; gap: 4px !important; flex: 0 0 auto !important; margin-left: auto !important; }
html.qa-app :is(body, #q#q#q) .qa-row-more, html.qa-app :is(body, #q#q#q) .qa-cert-actions .qa-more-btn {
  width: 36px !important;
  min-width: 36px !important;
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: transparent !important;
  color: var(--q-text-2) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Network rows: photo | name, role, credential | one action */
html.qa-app :is(body, #q#q#q) #buddypress #members-list .list-wrap { align-items: center !important; }
html.qa-app :is(body, #q#q#q) #buddypress #members-list .item-meta.last-activity { display: none !important; }
html.qa-app :is(body, #q#q#q) #buddypress #members-list .qap-ml-head { display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; }

/* Dashboard sections */
/* Dashboard: one white list; each section starts with a small label, sections are separated by a line */
html.qa-app :is(body, #q#q#q) .qa-dash { margin: 0 calc(-1 * var(--q-pad)) !important; background: var(--q-surface) !important; border-bottom: 1px solid var(--q-border) !important; }
html.qa-app :is(body, #q#q#q) .qa-dash-sec { margin: 0 !important; background: var(--q-surface) !important; }
html.qa-app :is(body, #q#q#q) .qa-dash-sec + .qa-dash-sec { border-top: 1px solid var(--q-border) !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qa-dash-sec .qa-sec-label { margin: 0 !important; padding: 14px var(--q-pad) 2px !important; background: transparent !important; }
html.qa-app :is(body, #q#q#q) .qa-dash-sec .qa-status-list { margin: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }
html.qa-app :is(body, #q#q#q) .qa-dash-sec .qa-status-list .qa-status-row:last-child { border-bottom: 0 !important; }
html.qa-app :is(body, #q#q#q) .qa-dash-sec .qa-dash-more { margin: 0 !important; border: 0 !important; border-top: 1px solid var(--q-border) !important; border-radius: 0 !important; background: transparent !important; }
html.qa-app :is(body, #q#q#q) .qa-dash-sec .qa-dash-more > summary { padding: 0 var(--q-pad) !important; min-height: 48px !important; font-size: var(--q-fs-2) !important; font-weight: 600 !important; }
html.qa-app :is(body, #q#q#q) .qa-dash-more-body { padding: 0 var(--q-pad) 12px !important; }
html.qa-app :is(body, #q#q#q) .qa-dash .qa-dash-hello { display: none !important; }

/* Certification summaries */
html.qa-app :is(body, #q#q#q) .qa-cert-list { margin: 0 0 8px !important; }
html.qa-app :is(body, #q#q#q) .qa-cert-item {
  margin: 0 0 8px !important;
  padding: 14px var(--q-pad) !important;
  border: 1px solid var(--q-border) !important;
  border-radius: var(--q-r-card) !important;
  background: var(--q-surface) !important;
}
html.qa-app :is(body, #q#q#q) .qa-cert-head { display: flex !important; align-items: flex-start !important; justify-content: space-between !important; gap: 12px !important; }
html.qa-app :is(body, #q#q#q) .qa-cert-titles { min-width: 0 !important; display: flex !important; flex-direction: column !important; gap: 2px !important; }
html.qa-app :is(body, #q#q#q) .qa-cert-title { margin: 0 !important; font-size: var(--q-fs-body) !important; font-weight: 600 !important; line-height: 1.35 !important; color: var(--q-text) !important; overflow-wrap: anywhere !important; }
html.qa-app :is(body, #q#q#q) .qa-cert-ref { display: flex !important; align-items: center !important; flex-wrap: wrap !important; min-height: 30px !important; font-size: var(--q-fs-small) !important; color: var(--q-text-3) !important; font-variant-numeric: tabular-nums !important; }
html.qa-app :is(body, #q#q#q) .qa-cert-ref .qa-copy { margin: -1px -6px -1px -2px !important; }
html.qa-app :is(body, #q#q#q) .qa-cert-progress { display: flex !important; flex-direction: column !important; gap: 6px !important; margin: 12px 0 0 !important; }
html.qa-app :is(body, #q#q#q) .qa-cert-bar { display: block !important; height: 4px !important; border-radius: 2px !important; background: var(--q-border) !important; overflow: hidden !important; }
html.qa-app :is(body, #q#q#q) .qa-cert-fill { display: block !important; height: 100% !important; border-radius: 2px !important; background: var(--q-brand) !important; }
html.qa-app :is(body, #q#q#q) .qa-cert-step { font-size: var(--q-fs-meta) !important; font-weight: 500 !important; color: var(--q-text-2) !important; }
html.qa-app :is(body, #q#q#q) .qa-cert-next { margin: 6px 0 0 !important; font-size: var(--q-fs-meta) !important; line-height: 1.45 !important; color: var(--q-text-2) !important; }
html.qa-app :is(body, #q#q#q) .qa-cert-actions { display: flex !important; flex-wrap: wrap !important; align-items: center !important; gap: 8px !important; margin: 12px 0 0 !important; }
html.qa-app :is(body, #q#q#q) .qa-cert-actions .qa-text-btn { margin-left: auto !important; }
html.qa-app :is(body, #q#q#q) .qa-cert-timeline { margin: 8px 0 0 !important; padding: 8px 0 0 !important; border-top: 1px solid var(--q-border) !important; }
html.qa-app :is(body, #q#q#q) .qa-cert-timeline[hidden] { display: none !important; }
html.qa-app :is(body, #q#q#q) .qa-cert-timeline ol.qap-steps { margin: 4px 0 0 !important; }

/* Record rows (Audit Log and other logs) */
html.qa-app :is(body, #q#q#q) .qa-rec-summary { margin: 4px 0 8px !important; font-size: var(--q-fs-meta) !important; font-weight: 600 !important; color: var(--q-text-2) !important; }
html.qa-app :is(body, #q#q#q) .qa-rec-list {
  margin: 0 calc(-1 * var(--q-pad)) 8px !important;
  border-top: 1px solid var(--q-border) !important;
  border-bottom: 1px solid var(--q-border) !important;
  background: var(--q-surface) !important;
}
html.qa-app :is(body, #q#q#q) .qa-rec + .qa-rec { border-top: 1px solid var(--q-border) !important; }
html.qa-app :is(body, #q#q#q) .qa-rec[hidden] { display: none !important; }
html.qa-app :is(body, #q#q#q) .qa-rec-main {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  min-height: 64px !important;
  margin: 0 !important;
  padding: 12px var(--q-pad) !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--q-text) !important;
  font: inherit !important;
  text-align: left !important;
  cursor: pointer;
}
html.qa-app :is(body, #q#q#q) .qa-rec-info { flex: 1 1 auto !important; min-width: 0 !important; display: flex !important; flex-direction: column !important; gap: 2px !important; }
html.qa-app :is(body, #q#q#q) .qa-rec-title { font-size: var(--q-fs-body) !important; font-weight: 600 !important; line-height: 1.35 !important; color: var(--q-text) !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; overflow-wrap: anywhere !important; }
html.qa-app :is(body, #q#q#q) .qa-rec-meta { font-size: var(--q-fs-meta) !important; line-height: 1.4 !important; color: var(--q-text-2) !important; display: -webkit-box !important; -webkit-line-clamp: 1 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; }
html.qa-app :is(body, #q#q#q) .qa-rec .qa-menu-chev { flex: 0 0 auto !important; color: var(--q-text-3) !important; transition: transform .18s ease !important; }
html.qa-app :is(body, #q#q#q) .qa-rec.is-open .qa-menu-chev { transform: rotate(90deg) !important; }
html.qa-app :is(body, #q#q#q) .qa-rec-detail { padding: 0 var(--q-pad) 14px !important; }
html.qa-app :is(body, #q#q#q) .qa-rec-detail[hidden] { display: none !important; }
html.qa-app :is(body, #q#q#q) .qa-rec-full { margin: 0 0 10px !important; font-size: var(--q-fs-2) !important; color: var(--q-text) !important; line-height: 1.5 !important; }
html.qa-app :is(body, #q#q#q) .qa-rec-actions { display: flex !important; flex-wrap: wrap !important; align-items: center !important; gap: 8px 12px !important; font-size: var(--q-fs-meta) !important; color: var(--q-text-3) !important; }
html.qa-app :is(body, #q#q#q) .qa-rec-actions > :is(a, button) { display: inline-flex !important; align-items: center !important; min-height: 36px !important; padding: 0 14px !important; border: 1px solid var(--q-border-strong) !important; border-radius: var(--q-r-ctl) !important; background: var(--q-surface) !important; color: var(--q-text) !important; font-size: var(--q-fs-meta) !important; font-weight: 600 !important; text-decoration: none !important; }
html.qa-app :is(body, #q#q#q) .qa-rec-actions > :is(.qap-danger, [class*="danger"]) { color: var(--q-danger) !important; }
html.qa-app :is(body, #q#q#q) .qa-rec-actions > :is(p, span, small, div) { flex: 1 0 100% !important; margin: 0 !important; font-size: var(--q-fs-small) !important; color: var(--q-text-3) !important; }
html.qa-app :is(body, #q#q#q) .qa-rec-actions form { display: inline-flex !important; margin: 0 !important; }
html.qa-app :is(body, #q#q#q) .qa-rec-actions form button { min-height: 36px !important; padding: 0 14px !important; border: 1px solid var(--q-border-strong) !important; border-radius: var(--q-r-ctl) !important; background: var(--q-surface) !important; color: var(--q-danger) !important; font-size: var(--q-fs-meta) !important; font-weight: 600 !important; }
/* Add a record: opened from + in the top bar */
html.qa-app :is(body, #q#q#q) details.qa-add-panel:not([open]) { display: none !important; }
html.qa-app :is(body, #q#q#q) details.qa-add-panel > summary { display: none !important; }
html.qa-app :is(body, #q#q#q) details.qa-add-panel[open] { margin: 0 0 12px !important; padding: 0 !important; border: 1px solid var(--q-border) !important; border-radius: var(--q-r-card) !important; background: var(--q-surface) !important; }
html.qa-app :is(body, #q#q#q) details.qa-add-panel form { padding: 12px var(--q-pad) var(--q-pad) !important; margin: 0 !important; }
html.qa-app :is(body, #q#q#q) .qa-add-head { display: flex !important; align-items: center !important; justify-content: space-between !important; margin: 0 0 8px !important; }
html.qa-app :is(body, #q#q#q) .qa-add-head strong { font-size: var(--q-fs-h3) !important; font-weight: 700 !important; color: var(--q-text) !important; }

/* Jobs: one search field, then chips */
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) form.qap-jobs-search.qa-search-only { display: block !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) form.qap-jobs-search.qa-search-only > :is(input[name="loc"], #qap-jobs-loc, .qa-icon-submit, button[type="submit"], .qap-jobs-post, label) { display: none !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) form.qap-jobs-search.qa-search-only input[name="q"] { width: 100% !important; }
html.qa-app :is(body, #q#q#q) .qa-filter-bar {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 calc(-1 * var(--q-pad)) 8px !important;
  padding: 2px var(--q-pad) !important;
  overflow-x: auto !important;
  scrollbar-width: none !important;
}
html.qa-app :is(body, #q#q#q) .qa-filter-bar::-webkit-scrollbar { display: none !important; }
html.qa-app :is(body, #q#q#q) .qa-filter-bar > :is(.qa-filter-btn, .qa-sort-btn, .qa-chip, .qa-filter-chip) {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  flex: 0 0 auto !important;
  min-height: var(--q-h-chip) !important;
  height: auto !important;
  padding: 0 12px !important;
  border: 1px solid var(--q-border) !important;
  border-radius: 999px !important;
  background: var(--q-surface) !important;
  color: var(--q-text) !important;
  font-size: var(--q-fs-meta) !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
}
html.qa-app :is(body, #q#q#q) .qa-filter-bar .qa-filter-chips { display: contents !important; }
html.qa-app :is(body, #q#q#q) .qa-filter-bar > .qa-sort-btn span, html.qa-app :is(body, #q#q#q) .qa-filter-bar > .qa-sort-btn strong { font-size: var(--q-fs-meta) !important; }
html.qa-app :is(body, #q#q#q) .qa-filter-bar .qa-ico { width: 16px !important; height: 16px !important; }
html.qa-app :is(body, #q#q#q) .qa-loc-sheet input { width: 100% !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qap-jobs-shell .qa-empty { padding: 24px 16px !important; }

/* Notifications: chips scroll sideways in one row; "Mark all read" lives in the top bar */
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qap-nt-pills { flex-wrap: nowrap !important; overflow-x: auto !important; scrollbar-width: none !important; margin: 0 calc(-1 * var(--q-pad)) !important; padding: 0 var(--q-pad) !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qap-nt-pills::-webkit-scrollbar { display: none !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qap-nt-pills > * { flex: 0 0 auto !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qap-nt-bar { padding-bottom: 10px !important; border-bottom: 1px solid var(--q-border) !important; margin-bottom: 8px !important; }
html.qa-app :is(body, #q#q#q) .qa-bar-text {
  flex: 0 0 auto !important;
  margin-left: auto !important;
  min-height: 40px !important;
  padding: 0 8px !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--q-brand) !important;
  font-size: var(--q-fs-2) !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
}
html.qa-app :is(body, #q#q#q) .qa-bar-add { margin-left: auto !important; }

/* Profile: Overview summarises; Credentials shows the full record */
html.qa-app :is(body, #q#q#q) .qap-profile p.qa-clamp { display: -webkit-box !important; -webkit-line-clamp: 4 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; }
html.qa-app :is(body, #q#q#q) .qap-profile li.qa-over { display: none !important; }
html.qa-app :is(body, #q#q#q) .qap-profile .qa-show-all li.qa-over { display: list-item !important; }
html.qa-app :is(body, #q#q#q) .qap-profile .qa-see-all, html.qa-app :is(body, #q#q#q) .qap-profile .qa-see-more { margin: 4px 0 0 -4px !important; }
html.qa-app :is(body, #q#q#q) .qap-profile.qa-cred-view > section.qap-psec:not(.qa-cred) { display: none !important; }
html.qa-app :is(body, #q#q#q) .qap-profile.qa-cred-view li.qa-over { display: list-item !important; }
html.qa-app :is(body, #q#q#q) .qap-profile.qa-cred-view .qa-see-all { display: none !important; }
html.qa-app :is(body, #q#q#q) .qap-profile:not(.qa-cred-view) > section.qap-psec.qa-cred[data-qa-name*="erification"] { display: none !important; }
html.qa-app :is(body, #q#q#q) .qap-profile:not(.qa-cred-view) > section.qap-psec.qa-reg-sec { display: none !important; }
html.qa-app :is(body, #q#q#q) #item-header .qap-hero-meta:not(:has(> :not(.qa-moved))) { display: none !important; }
html.qa-app :is(body, #q#q#q) .qa-reg-row { display: flex !important; align-items: center !important; min-height: 32px !important; margin: 0 !important; font-size: var(--q-fs-body) !important; font-weight: 600 !important; color: var(--q-text) !important; font-variant-numeric: tabular-nums !important; }
html.qa-app :is(body, #q#q#q) .qa-reg-row .qa-copy { margin: 0 0 0 4px !important; }
/* Profile tabs never run off the screen: they scroll sideways when there are many */
html.qa-app :is(body, #q#q#q) #buddypress nav.qap-srail ul { overflow-x: auto !important; scrollbar-width: none !important; flex-wrap: nowrap !important; }
html.qa-app :is(body, #q#q#q) #buddypress nav.qap-srail ul::-webkit-scrollbar { display: none !important; }
html.qa-app :is(body, #q#q#q) #buddypress nav.qap-srail li > :is(a, button) { padding: 0 10px !important; white-space: nowrap !important; }

/* Lists of links in content: each link is its own line, never overlapping the next */
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) :is(.qapf4-404, .qap-links) ul li > a:only-child { display: inline-block !important; padding: 6px 0 !important; line-height: 1.4 !important; }
/* Single post page: the header never runs past the screen */
html.qa-app :is(body, #q#q#q) #buddypress :is(.activity-header, .activity-inner) { max-width: 100% !important; min-width: 0 !important; overflow-wrap: anywhere !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .activity-comments .qap-cm-more,
html.qa-app :is(body, #q#q#q) #buddypress .qap-cm-more { width: 32px !important; height: 32px !important; min-width: 32px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; }
html.qa-app :is(body, #q#q#q) #buddypress .message-action-star { min-width: 36px !important; min-height: 36px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; }
/* Layers: one scale for everything that floats */
/* The platform's own layers reach 100000 (its sheets and toasts), so the app's scale sits in one
   ordered band above it: sticky tabs < bars < dropdowns < backdrop < sheet < toast < progress. */
html.qa-app {
  --q-z-sticky: 900;
  --q-z-bar: 9990;
  --q-z-dropdown: 9996;
  --q-z-backdrop: 100010;
  --q-z-sheet: 100020;
  --q-z-toast: 100030;
  --q-z-progress: 100040;
}
html.qa-app::before { z-index: var(--q-z-progress) !important; }
html.qa-app :is(body, #q#q#q) #qa-app-offline { z-index: var(--q-z-toast) !important; background: var(--q-toast) !important; font-family: var(--q-font) !important; border-radius: var(--q-r-ctl) !important; }
html.qa-app :is(body, #q#q#q) #qa-app-progress { z-index: var(--q-z-progress) !important; }
html.qa-app :is(body, #q#q#q) :is(.qapf4-bell-panel, .qap-post-pop, .qap-pop, .qap-msg-pop) { z-index: var(--q-z-dropdown) !important; }
html.qa-app :is(body, #q#q#q) .qap-appbar { z-index: var(--q-z-bar) !important; }
html.qa-app :is(body, #q#q#q) .qap-tabbar { z-index: var(--q-z-bar) !important; }
html.qa-app :is(body, #q#q#q) #buddypress nav.qap-srail { z-index: var(--q-z-sticky) !important; }
html.qa-app :is(body, #q#q#q) .qa-sheet-backdrop { z-index: var(--q-z-backdrop) !important; }
/* Sheets: header and actions stay put; only the content between them scrolls */
html.qa-app :is(body, #q#q#q) .qa-sheet { z-index: var(--q-z-sheet) !important; max-height: calc(100% - var(--safe-area-inset-top, env(safe-area-inset-top, 0px)) - 24px) !important; display: flex !important; flex-direction: column !important; overflow: hidden !important; font-family: var(--q-font) !important; }
html.qa-app :is(body, #q#q#q) .qa-sheet > :is(.qa-sheet-head, .qa-sheet-actions, .qa-sheet-text) { flex: 0 0 auto !important; }
html.qa-app :is(body, #q#q#q) .qa-sheet > :not(.qa-sheet-head):not(.qa-sheet-actions):not(.qa-sheet-text) { flex: 0 1 auto !important; min-height: 0 !important; overflow-y: auto !important; overscroll-behavior: contain !important; }
html.qa-app :is(body, #q#q#q) .qa-sheet.is-full .qa-sheet-actions { position: static !important; margin-top: 8px !important; }
html.qa-app :is(body, #q#q#q) :is(.qa-toast, .qa-conn, .qa-connection) { z-index: var(--q-z-toast) !important; }

/* ---------- Moved originals stay hidden, whatever the screen's own layout rules say ---------- */
html.qa-app :is(body, #q#q#q) .qa-moved.qa-moved.qa-moved,
html.qa-app :is(body, #q#q#q) #buddypress .qa-moved.qa-moved.qa-moved,
html.qa-app :is(body, #q#q#q) #buddypress #members-list .qa-moved.qa-moved.qa-moved,
html.qa-app :is(body, #q#q#q) #buddypress #item-header .qa-moved.qa-moved.qa-moved,
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qa-moved.qa-moved.qa-moved,
html.qa-app :is(body, #q#q#q) #buddypress :is(#qapf4-main, #qapf2-main, main) .qa-moved.qa-moved.qa-moved { display: none !important; }

/* ---------- Network: the search field opens from the magnifier in the top bar ---------- */
html.qa-app :is(body, #q#q#q) #buddypress #subnav-filters { flex-wrap: wrap !important; gap: 8px !important; }
html.qa-app.qa-search-open :is(body, #q#q#q) #buddypress #subnav-filters :is(.subnav-search, .dir-search) { display: block !important; }
html.qa-app.qa-search-open :is(body, #q#q#q) #buddypress #subnav-filters .subnav-search { flex: 1 1 100% !important; order: -1 !important; margin: 0 !important; }
html.qa-app :is(body, #q#q#q) #buddypress form.bp-dir-search-form { position: relative !important; display: block !important; width: 100% !important; margin: 0 !important; }
html.qa-app :is(body, #q#q#q) #buddypress form.bp-dir-search-form input[type="search"] { width: 100% !important; max-width: none !important; padding-left: 44px !important; padding-right: 14px !important; background-image: none !important; }
html.qa-app :is(body, #q#q#q) #buddypress :is(#subnav-filters, .group-search, .activity-search) form.bp-dir-search-form button[type="submit"] { position: absolute !important; left: 1px !important; top: 1px !important; bottom: 1px !important; width: 42px !important; min-width: 0 !important; height: auto !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; background: transparent !important; border: 0 !important; border-radius: 10px 0 0 10px !important; box-shadow: none !important; color: var(--q-text-3) !important; }
html.qa-app :is(body, #q#q#q) #buddypress form.bp-dir-search-form button[type="submit"] .dashicons { width: 20px !important; height: 20px !important; font-size: 20px !important; line-height: 20px !important; color: inherit !important; }

/* ---------- A container whose children are cards is not itself a card ---------- */
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qa-flat.qa-flat { background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 0 !important; border-radius: 0 !important; }

/* ---------- Content starts exactly below the top bar (the bar is 56px plus its 1px line) ---------- */
html.qa-app body.qap-app:is(body, #q#q#q) { padding-top: calc(var(--q-h-bar) + 1px) !important; }
/* Screens that open with their own tabs (Chat, Notifications, Settings) sit flush under the bar */
html.qa-app.qa-focus :is(body, #q#q#q) #buddypress :is(.bp-wrap, #item-body) { margin-top: 0 !important; }

/* ---------- Notifications: one filter band, then the list, no gaps between ---------- */
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qap-nt { gap: 0 !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qap-nt > .qap-card.qap-nt-bar.qap-nt-bar, html.qa-app :is(body, #q#q#q) #buddypress #item-body .qap-nt > .qap-card.qap-nt-bar.qap-nt-bar { padding: 10px var(--q-pad) !important; margin: 0 calc(-1 * var(--q-pad)) !important; border: 0 !important; border-bottom: 1px solid var(--q-border) !important; border-radius: 0 !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qap-nt > .qap-card.qap-nt-list.qap-nt-list, html.qa-app :is(body, #q#q#q) #buddypress #item-body .qap-nt > .qap-card.qap-nt-list.qap-nt-list { padding: 0 !important; margin: 0 calc(-1 * var(--q-pad)) !important; border: 0 !important; border-bottom: 1px solid var(--q-border) !important; border-radius: 0 !important; }

/* ---------- Feed: the time under a name is quiet, like every other time in the app ---------- */
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .activity-header a:is(.activity-time-since, .qap-ah-time) { color: var(--q-text-3) !important; font-weight: 400 !important; }
html.qa-app :is(body, #q#q#q) .qa-rec.is-open :is(.qa-rec-title, .qa-rec-meta) { display: block !important; -webkit-line-clamp: unset !important; overflow: visible !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .activity-header :is(.time-since, .activity-time-since, .qap-ah-time), html.qa-app :is(body, #q#q#q) #buddypress .activity-list .activity-header :is(.activity-time-since, .qap-ah-time) * { color: var(--q-text-3) !important; font-weight: 400 !important; }

/* ---------- Comments: "Like · Reply" sit together; the reaction count sits at the end ---------- */
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .qap-cm-bar { justify-content: flex-start !important; align-items: center !important; gap: 2px !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .qap-cm-bar .acomment-reply { flex: 0 0 auto !important; min-height: 32px !important; padding: 0 8px !important; justify-content: flex-start !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .qap-cm-bar .qap-cm-like { min-height: 32px !important; min-width: 32px !important; padding: 0 8px !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .qap-cm-bar .qap-cm-tally { margin-left: auto !important; }
/* The comment box is one field, not a field inside a rounded frame */
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .ac-form .ac-textarea { border: 0 !important; padding: 0 !important; background: transparent !important; border-radius: 0 !important; box-shadow: none !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .ac-form textarea.ac-input { border-radius: 22px !important; min-height: 44px !important; padding: 11px 16px !important; }
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .ac-form :is(input[type="submit"], button[type="submit"]) { min-height: 36px !important; height: 36px !important; padding: 0 16px !important; font-size: var(--q-fs-meta) !important; }
/* Chat: the list starts right under the top bar's line, without a second line */
html.qa-app :is(body, #q#q#q) #buddypress .qap-msg-shell .qap-msg-list { border-top: 0 !important; }

/* ---------- Network rows: 16px gutter (the old clearfix pseudo-elements were adding 12px each side) ---------- */
html.qa-app :is(body, #q#q#q) #buddypress #members-list > li { display: block !important; }
html.qa-app :is(body, #q#q#q) #buddypress #members-list > li::before, html.qa-app :is(body, #q#q#q) #buddypress #members-list > li::after { display: none !important; content: none !important; }
html.qa-app :is(body, #q#q#q) #buddypress #members-list .list-wrap > .item { flex: 1 1 120px !important; min-width: 0 !important; }
/* On the narrowest phones the actions move under the name instead of squeezing it */
@media (max-width: 359px) {
  html.qa-app :is(body, #q#q#q) #buddypress #members-list .list-wrap { flex-wrap: wrap !important; }
  html.qa-app :is(body, #q#q#q) #buddypress #members-list .list-wrap > .qa-row-actions { flex-basis: 100% !important; justify-content: flex-start !important; padding-left: 64px !important; }
}
/* Notification rows fill the list edge to edge and keep the 16px gutter inside */
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qap-nt-list > .qap-nt-row, html.qa-app :is(body, #q#q#q) #buddypress #item-body .qap-nt-list > .qap-nt-row { margin-left: 0 !important; margin-right: 0 !important; padding-left: var(--q-pad) !important; padding-right: var(--q-pad) !important; }

/* ---------- Touch targets: small links get a 32px tap area without moving the layout ---------- */
html.qa-app :is(body, #q#q#q) #buddypress .activity-comments a.activity-time-since { display: inline-block !important; padding: 8px 6px !important; margin: -8px -6px !important; line-height: 16px !important; }
html.qa-app :is(body, #q#q#q) .qap-appbar-logo { min-height: 40px !important; }

/* =====================================================================================
   App shell (drawn by the server at the top of every page; see includes/shell.php)
   One top bar and one tab bar, identical on every screen, so moving between screens never
   rebuilds them. Heights are fixed, so nothing below them moves when a page arrives.
   ===================================================================================== */
html.qa-app.qa-shell body.qap-app:is(body, #q#q#q), html.qa-app.qa-shell body:is(body, #q#q#q) {
  padding-top: calc(var(--q-h-bar) + 1px) !important;
  padding-bottom: calc(var(--q-h-nav) + var(--safe-area-inset-bottom, env(safe-area-inset-bottom, 0px))) !important;
}
html.qa-app :is(body, #q#q#q) #qa-top {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: var(--q-z-bar) !important;
  margin: 0 !important;
  padding: var(--safe-area-inset-top, env(safe-area-inset-top, 0px)) 0 0 !important;
  background: var(--q-surface) !important;
  border-bottom: 1px solid var(--q-border) !important;
  box-shadow: none !important;
}
html.qa-app :is(body, #q#q#q) #qa-top .qa-top-in {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  height: var(--q-h-bar) !important;
  padding: 0 8px 0 var(--q-pad) !important;
  margin: 0 !important;
}
html.qa-app :is(body, #q#q#q) #qa-top .qa-top-logo { display: inline-flex !important; align-items: center !important; height: 40px !important; margin: 0 !important; padding: 0 !important; text-decoration: none !important; }
html.qa-app :is(body, #q#q#q) #qa-top .qa-top-logo img { display: block !important; height: 32px !important; width: auto !important; max-width: 120px !important; }
html.qa-app :is(body, #q#q#q) #qa-top .qa-top-title {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 18px !important;
  line-height: 1.25 !important;
  font-weight: 700 !important;
  letter-spacing: -.01em !important;
  color: var(--q-text) !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
html.qa-app.qa-inner #qa-top .qa-top-title, html.qa-app #qa-top[data-qa-route="inner"] .qa-top-title { font-size: 17px !important; }
html.qa-app :is(body, #q#q#q) #qa-top .qa-top-actions { display: inline-flex !important; align-items: center !important; gap: 0 !important; margin-left: auto !important; flex: 0 0 auto !important; }
html.qa-app :is(body, #q#q#q) #qa-top .qa-top-btn {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: transparent !important;
  color: var(--q-text) !important;
  text-decoration: none !important;
  box-shadow: none !important;
  -webkit-tap-highlight-color: transparent;
}
html.qa-app :is(body, #q#q#q) #qa-top .qa-top-btn[hidden] { display: none !important; }
html.qa-app :is(body, #q#q#q) #qa-top .qa-top-btn .qa-ico { width: 22px !important; height: 22px !important; }
html.qa-app :is(body, #q#q#q) #qa-top .qa-top-btn:active { background: var(--q-surface-2) !important; }
html.qa-app :is(body, #q#q#q) #qa-top .qa-top-btn:focus-visible { outline: 2px solid var(--q-brand) !important; outline-offset: 2px !important; }
html.qa-app :is(body, #q#q#q) #qa-top .qa-top-me img { width: 32px !important; height: 32px !important; border-radius: 50% !important; object-fit: cover !important; display: block !important; }
html.qa-app :is(body, #q#q#q) #qa-top .qa-top-badge, html.qa-app :is(body, #q#q#q) #qa-tabs .qa-tabs-badge {
  position: absolute !important;
  min-width: 16px !important;
  height: 16px !important;
  padding: 0 4px !important;
  border-radius: 8px !important;
  background: var(--q-danger) !important;
  color: #FFFFFF !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  line-height: 16px !important;
  text-align: center !important;
  box-shadow: 0 0 0 2px var(--q-surface) !important;
}
html.qa-app :is(body, #q#q#q) #qa-top .qa-top-badge { top: 5px !important; right: 4px !important; }
html.qa-app :is(body, #q#q#q) #qa-top .qa-top-text {
  display: inline-flex !important;
  align-items: center !important;
  height: 40px !important;
  margin: 0 !important;
  padding: 0 8px !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--q-brand) !important;
  font-size: var(--q-fs-2) !important;
  font-weight: 600 !important;
  box-shadow: none !important;
}
html.qa-app :is(body, #q#q#q) #qa-top .qa-top-text[hidden] { display: none !important; }
/* A back chevron only in the iPhone home-screen web app, which has no other way back */
html.qa-app :is(body, #q#q#q) #qa-top .qa-top-back { display: none !important; margin-left: -8px !important; }
html.qa-app.qa-app-pwa.qa-app-ios #qa-top .qa-top-back { display: inline-flex !important; }

html.qa-app :is(body, #q#q#q) #qa-tabs {
  position: fixed !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  z-index: var(--q-z-bar) !important;
  display: flex !important;
  align-items: stretch !important;
  margin: 0 !important;
  padding: 0 0 var(--safe-area-inset-bottom, env(safe-area-inset-bottom, 0px)) !important;
  background: var(--q-surface) !important;
  border-top: 1px solid var(--q-border) !important;
  box-shadow: none !important;
}
html.qa-app.qa-keyboard #qa-tabs { display: none !important; }
html.qa-app :is(body, #q#q#q) #qa-tabs .qa-tabs-item {
  position: relative !important;
  flex: 1 1 0 !important;
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 3px !important;
  height: var(--q-h-nav) !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--q-text-2) !important;
  text-decoration: none !important;
  box-shadow: none !important;
  -webkit-tap-highlight-color: transparent;
}
html.qa-app :is(body, #q#q#q) #qa-tabs .qa-tabs-item .qa-ico { width: 24px !important; height: 24px !important; stroke-width: 1.9 !important; fill: none !important; }
html.qa-app :is(body, #q#q#q) #qa-tabs .qa-tabs-item.is-on { color: var(--q-brand) !important; }
html.qa-app :is(body, #q#q#q) #qa-tabs .qa-tabs-item.is-on .qa-ico { stroke-width: 2.3 !important; fill: var(--q-brand-soft) !important; }
html.qa-app :is(body, #q#q#q) #qa-tabs .qa-tabs-menu.is-on .qa-ico { fill: none !important; }
html.qa-app :is(body, #q#q#q) #qa-tabs .qa-tabs-item:active .qa-ico { transform: scale(.92); }
html.qa-app :is(body, #q#q#q) #qa-tabs .qa-tabs-item:focus-visible { outline: 2px solid var(--q-brand) !important; outline-offset: -4px !important; }
html.qa-app :is(body, #q#q#q) #qa-tabs .qa-tabs-label { font-size: var(--q-fs-small) !important; font-weight: 600 !important; line-height: 1.2 !important; letter-spacing: 0 !important; color: inherit !important; }
html.qa-app :is(body, #q#q#q) #qa-tabs .qa-tabs-badge { top: 7px !important; left: calc(50% + 6px) !important; }
@media (prefers-reduced-motion: no-preference) {
  html.qa-app :is(body, #q#q#q) #qa-tabs .qa-tabs-item .qa-ico { transition: transform .12s ease !important; }
}

/* ---------- Leaving a screen: the destination's bar, tab and skeleton show at once ---------- */
/* Skeletons are drawn with gradients in fixed-height tiles that repeat down the screen, the same size
   as the real rows, so nothing jumps when the real content replaces them. */
html.qa-app.qa-leaving body > *:not(#qa-top):not(#qa-tabs) { visibility: hidden !important; }
html.qa-app.qa-leaving body::after {
  content: "" !important;
  position: fixed !important;
  z-index: 1 !important;
  left: 0 !important;
  right: 0 !important;
  top: calc(var(--q-h-bar) + 1px + var(--safe-area-inset-top, env(safe-area-inset-top, 0px))) !important;
  bottom: calc(var(--q-h-nav) + var(--safe-area-inset-bottom, env(safe-area-inset-bottom, 0px))) !important;
  pointer-events: none !important;
  background-color: var(--q-bg) !important;
  --sk: var(--q-border);
  /* list rows: avatar, name, one line of text, separator (88px) */
  background-image:
    radial-gradient(circle 24px at 40px 44px, var(--sk) 97%, transparent 100%),
    linear-gradient(to bottom, transparent 30px, var(--sk) 30px 42px, transparent 42px),
    linear-gradient(to bottom, transparent 52px, var(--sk) 52px 62px, transparent 62px),
    linear-gradient(to bottom, var(--q-surface) 0 87px, var(--q-border) 87px 88px) !important;
  background-size: 100% 88px, 44% 88px, 62% 88px, 100% 88px !important;
  background-position: 0 0, 80px 0, 80px 0, 0 0 !important;
  background-repeat: repeat-y !important;
}
/* Feed: posts with a header and three lines, 12px apart */
html.qa-app.qa-leaving[data-qa-dest="feed"] body::after {
  background-image:
    radial-gradient(circle 22px at 38px 50px, var(--sk) 97%, transparent 100%),
    linear-gradient(to bottom, transparent 38px, var(--sk) 38px 50px, transparent 50px),
    linear-gradient(to bottom, transparent 58px, var(--sk) 58px 68px, transparent 68px),
    linear-gradient(to bottom, transparent 96px, var(--sk) 96px 106px, transparent 106px),
    linear-gradient(to bottom, transparent 116px, var(--sk) 116px 126px, transparent 126px),
    linear-gradient(to bottom, transparent 136px, var(--sk) 136px 146px, transparent 146px),
    linear-gradient(to bottom, transparent 12px, var(--q-surface) 12px 200px) !important;
  background-size: 100% 200px, 40% 200px, 56% 200px, calc(100% - 32px) 200px, 72% 200px, 48% 200px, 100% 200px !important;
  background-position: 0 0, 72px 0, 72px 0, 16px 0, 16px 0, 16px 0, 0 0 !important;
  background-repeat: repeat-y !important;
}
/* Jobs: the search field, then rows */
html.qa-app.qa-leaving[data-qa-dest="jobs"] body::after {
  background-image:
    linear-gradient(var(--q-surface) 0 0),
    linear-gradient(var(--q-bg) 0 0),
    linear-gradient(to bottom, transparent 22px, var(--sk) 22px 34px, transparent 34px),
    linear-gradient(to bottom, transparent 44px, var(--sk) 44px 54px, transparent 54px),
    linear-gradient(to bottom, var(--q-surface) 0 83px, var(--q-border) 83px 84px) !important;
  background-size: calc(100% - 32px) 46px, 100% 84px, 58% 84px, 38% 84px, 100% 84px !important;
  background-position: 16px 19px, 0 0, 16px 0, 16px 0, 0 0 !important;
  background-repeat: no-repeat, no-repeat, repeat-y, repeat-y, repeat-y !important;
}
/* Screens without a list: a few lines of text on the page background */
html.qa-app.qa-leaving:is([data-qa-dest="page"], [data-qa-dest="dashboard"]) body::after {
  background-image:
    linear-gradient(var(--sk) 0 0), linear-gradient(var(--sk) 0 0), linear-gradient(var(--sk) 0 0),
    linear-gradient(to bottom, var(--q-surface) 0 0) !important;
  background-size: 48% 12px, 76% 10px, 60% 10px, 100% 132px !important;
  background-position: 16px 28px, 16px 56px, 16px 78px, 0 0 !important;
  background-repeat: no-repeat !important;
}
@media (prefers-reduced-motion: no-preference) {
  html.qa-app.qa-leaving body::after { animation: qa-skeleton-pulse 1.2s ease-in-out .3s infinite !important; }
}
@keyframes qa-skeleton-pulse { 50% { opacity: .6; } }
/* The destination's bar while leaving (inert copies of the real buttons) */
html.qa-app :is(body, #q#q#q) #qa-top span.qa-top-btn { pointer-events: none !important; }
html.qa-app #qa-top[data-qa-route="inner"] .qa-top-back { display: none !important; }
html.qa-app.qa-app-pwa.qa-app-ios #qa-top[data-qa-route="inner"] .qa-top-back { display: inline-flex !important; }

/* ---------- Legacy parts that are never drawn in the app ---------- */
html.qa-app.qa-shell .qap-page-head { display: none !important; }
html.qa-app .qap-jobs-bar { display: none !important; }

/* ---------- Network: sort is a compact "Sort" chip at the end of the tabs row ---------- */
html.qa-app :is(body, #q#q#q) #buddypress nav.qa-has-sort { display: flex !important; align-items: center !important; }
html.qa-app :is(body, #q#q#q) #buddypress nav.qa-has-sort > ul { flex: 1 1 auto !important; min-width: 0 !important; }
html.qa-app :is(body, #q#q#q) #buddypress nav.qa-has-sort > .qa-sort-btn {
  flex: 0 0 auto !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 2px !important;
  height: 32px !important;
  min-height: 32px !important;
  margin: 0 12px 0 4px !important;
  padding: 0 8px 0 12px !important;
  border: 1px solid var(--q-border) !important;
  border-radius: 999px !important;
  background: var(--q-surface) !important;
  color: var(--q-text) !important;
  font-size: var(--q-fs-meta) !important;
  font-weight: 600 !important;
  box-shadow: none !important;
}
html.qa-app :is(body, #q#q#q) #buddypress nav.qa-has-sort > .qa-sort-btn .qa-ico { width: 16px !important; height: 16px !important; color: var(--q-text-2) !important; }
/* Counts on the Network and Feed tabs change once the list has loaded; they are not shown */
html.qa-app :is(body, #q#q#q) #buddypress :is(.activity-type-navs, .members-type-navs, .groups-type-navs) li a .count { display: none !important; }
/* With the sort chip moved, the filter row only holds the search, which opens from the top bar */
html.qa-app:not(.qa-search-open) :is(body, #q#q#q) #buddypress #subnav-filters:not(:has(select)) { display: none !important; }

/* ---------- Chat: one conversation list; Starred and Sent are under ⋯ in the top bar ---------- */
html.qa-app.qa-chat :is(body, #q#q#q) #buddypress :is(#subnav.qap-msg-filters, .qap-msg-filters) { display: none !important; }

/* ---------- Lists that arrive after the page: skeleton rows in the list's own place ---------- */
html.qa-app :is(body, #q#q#q) #buddypress [data-bp-list] #bp-ajax-loader {
  display: block !important;
  margin: 0 calc(-1 * var(--q-pad)) !important;
  padding: 0 !important;
  min-height: 352px !important;
  border: 0 !important;
  --sk: var(--q-border);
  background-color: var(--q-bg) !important;
  background-image:
    radial-gradient(circle 24px at 40px 44px, var(--sk) 97%, transparent 100%),
    linear-gradient(to bottom, transparent 30px, var(--sk) 30px 42px, transparent 42px),
    linear-gradient(to bottom, transparent 52px, var(--sk) 52px 62px, transparent 62px),
    linear-gradient(to bottom, var(--q-surface) 0 87px, var(--q-border) 87px 88px) !important;
  background-size: 100% 88px, 44% 88px, 62% 88px, 100% 88px !important;
  background-position: 0 0, 80px 0, 80px 0, 0 0 !important;
  background-repeat: repeat-y !important;
}
html.qa-app :is(body, #q#q#q) #buddypress [data-bp-list="activity"] #bp-ajax-loader {
  min-height: 400px !important;
  background-image:
    radial-gradient(circle 22px at 38px 50px, var(--sk) 97%, transparent 100%),
    linear-gradient(to bottom, transparent 38px, var(--sk) 38px 50px, transparent 50px),
    linear-gradient(to bottom, transparent 58px, var(--sk) 58px 68px, transparent 68px),
    linear-gradient(to bottom, transparent 96px, var(--sk) 96px 106px, transparent 106px),
    linear-gradient(to bottom, transparent 116px, var(--sk) 116px 126px, transparent 126px),
    linear-gradient(to bottom, transparent 136px, var(--sk) 136px 146px, transparent 146px),
    linear-gradient(to bottom, transparent 12px, var(--q-surface) 12px 200px) !important;
  background-size: 100% 200px, 40% 200px, 56% 200px, calc(100% - 32px) 200px, 72% 200px, 48% 200px, 100% 200px !important;
  background-position: 0 0, 72px 0, 72px 0, 16px 0, 16px 0, 16px 0, 0 0 !important;
}
html.qa-app :is(body, #q#q#q) #buddypress [data-bp-list] #bp-ajax-loader > * { display: none !important; }
@media (prefers-reduced-motion: no-preference) {
  html.qa-app :is(body, #q#q#q) #buddypress [data-bp-list] #bp-ajax-loader { animation: qa-skeleton-pulse 1.2s ease-in-out .3s infinite !important; }
}

html.qa-app :is(body, #q#q#q) .qa-dash-sec .qa-sec-label + .qa-dash-more { border-top: 0 !important; }
html.qa-app.qa-dash-root :is(body, #q#q#q) :is(#qapf4-main, main) .qa-dash { margin-top: 0 !important; }
/* Jobs: with no results, the empty state sits on the page, not in a large empty card */
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qap-jobs-list:has(> .qa-empty) { background: transparent !important; border: 0 !important; box-shadow: none !important; }
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qap-jobs-list > .qa-empty { padding: 32px 16px 24px !important; }
/* The shared card rule includes a two-class selector inside :is(), so this needs the repeated class to win */
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) .qap-jobs .qap-jobs-shell.qap-jobs-shell.qap-jobs-shell:has(.qap-jobs-list > .qa-empty) { background: transparent !important; border: 0 !important; box-shadow: none !important; }
/* Account pages: the empty left column of the website layout leaves no gap above the content */
html.qa-app :is(body, #q#q#q) .woocommerce:has(> .woocommerce-MyAccount-content) { row-gap: 0 !important; }

/* Lists that could not be loaded: one message with Try again, above the list that is still shown */
html.qa-app :is(body, #q#q#q) [data-bp-list] > .qa-load-error { padding: 20px 16px !important; background: var(--q-surface) !important; border-bottom: 1px solid var(--q-border) !important; list-style: none !important; }
html.qa-app :is(body, #q#q#q) .qa-empty button.qa-empty-action { font-family: inherit !important; cursor: pointer !important; line-height: 1 !important; }
/* Sort chip: an icon on phones where the tabs and the chip do not fit side by side */
html.qa-app :is(body, #q#q#q) #buddypress nav.qa-has-sort > .qa-sort-btn .qa-sort-ico { display: none !important; }
html.qa-app :is(body, #q#q#q) #buddypress nav.qa-has-sort.qa-sort-compact > ul > li > a { padding-left: 8px !important; padding-right: 8px !important; }
html.qa-app :is(body, #q#q#q) #buddypress nav.qa-has-sort.qa-sort-compact > .qa-sort-btn { width: 32px !important; min-width: 32px !important; padding: 0 !important; justify-content: center !important; margin: 0 8px 0 4px !important; }
html.qa-app :is(body, #q#q#q) #buddypress nav.qa-has-sort.qa-sort-compact > .qa-sort-btn :is(span, .qa-sort-caret) { display: none !important; }
html.qa-app :is(body, #q#q#q) #buddypress nav.qa-has-sort.qa-sort-compact > .qa-sort-btn .qa-sort-ico { display: block !important; width: 18px !important; height: 18px !important; color: var(--q-text) !important; }

/* ---------- Groups: the same full-width tab band and rows as Network ---------- */
html.qa-app :is(body, #q#q#q) #buddypress .groups-type-navs { margin-left: calc(-1 * var(--q-pad)) !important; margin-right: calc(-1 * var(--q-pad)) !important; }
html.qa-app :is(body, #q#q#q) #buddypress #groups-list {
  width: auto !important; max-width: none !important;
  margin: 0 calc(-1 * var(--q-pad)) !important; padding: 0 !important;
  background: var(--q-surface) !important;
  border: 0 !important; border-top: 1px solid var(--q-border) !important; border-bottom: 1px solid var(--q-border) !important;
  border-radius: 0 !important; box-shadow: none !important;
}
html.qa-app :is(body, #q#q#q) #buddypress #groups-list > li {
  margin: 0 !important; padding: 12px var(--q-pad) !important;
  border: 0 !important; border-bottom: 1px solid var(--q-border) !important; border-radius: 0 !important;
  background: transparent !important; box-shadow: none !important;
}
html.qa-app :is(body, #q#q#q) #buddypress #groups-list > li:last-child { border-bottom: 0 !important; }
html.qa-app :is(body, #q#q#q) #buddypress #groups-list > li :is(.list-wrap, .qap-card, .group-card) { width: auto !important; max-width: none !important; display: flex !important; align-items: flex-start !important; gap: 12px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }
html.qa-app :is(body, #q#q#q) #buddypress #groups-list .item-avatar { flex: 0 0 52px !important; width: 52px !important; margin: 0 !important; padding: 0 !important; }
html.qa-app :is(body, #q#q#q) #buddypress #groups-list .item-avatar img { width: 52px !important; height: 52px !important; border-radius: 12px !important; }
html.qa-app :is(body, #q#q#q) #buddypress #groups-list .item { flex: 1 1 auto !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; }
html.qa-app :is(body, #q#q#q) #buddypress #groups-list .list-title { margin: 0 !important; font-size: var(--q-fs-body) !important; font-weight: 600 !important; line-height: 1.3 !important; }
html.qa-app :is(body, #q#q#q) #buddypress #groups-list .list-title a { color: var(--q-text) !important; overflow-wrap: anywhere !important; }
html.qa-app :is(body, #q#q#q) #buddypress #groups-list :is(.item-meta, .last-activity, .group-details, .item-desc, .group-desc) { margin: 2px 0 0 !important; font-size: var(--q-fs-meta) !important; color: var(--q-text-2) !important; line-height: 1.4 !important; }

/* Stacked tables: a value with a second line is one block, right-aligned beside its label */
html.qa-app :is(body, #q#q#q) table.qa-stack .qa-stack-val { display: block !important; flex: 1 1 auto !important; min-width: 0 !important; text-align: right !important; }
html.qa-app :is(body, #q#q#q) table.qa-stack .qa-stack-val small { display: block !important; margin-top: 2px !important; font-size: var(--q-fs-small) !important; color: var(--q-text-2) !important; }

/* Platform filter pills (Company documentation and staff lists): the selected one is filled, with white text */
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) a.qap-pill.is-on, html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) a.qap-pill[aria-current] { background: var(--q-brand) !important; border-color: var(--q-brand) !important; color: #FFFFFF !important; }
html.qa-app.qa-dark :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main) a.qap-pill.is-on { color: #0E1318 !important; }
/* Platform stacked tables (qapf2-stack): small sentence-case labels, like the rest of the app */
html.qa-app :is(body, #q#q#q) table.qapf2-stack td[data-label]::before { text-transform: none !important; letter-spacing: 0 !important; font-size: var(--q-fs-meta) !important; font-weight: 600 !important; color: var(--q-text-2) !important; }
/* Post time: a 24px tap area around the short time ("1d") without moving it */
html.qa-app :is(body, #q#q#q) #buddypress .activity-list .activity-header a:is(.qap-ah-time, .activity-time-since) { display: inline-block !important; padding: 4px 6px !important; margin: -4px -6px !important; }
/* Names in post and comment headers: a 24px-high tap area without moving the text */
html.qa-app :is(body, #q#q#q) #buddypress .activity-list :is(a.qap-ah-name, a.qap-cm-name) { display: inline-block !important; max-width: 100% !important; white-space: normal !important; overflow-wrap: anywhere !important; padding: 3px 0 !important; margin: -3px 0 !important; }

/* ---------- A single group: the same header as a profile, and a full-width post search ---------- */
html.qa-app :is(body, #q#q#q) #buddypress #item-header.groups-header { margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; overflow: visible !important; }
html.qa-app :is(body, #q#q#q) #buddypress #item-header.groups-header #item-header-avatar img { border-radius: 16px !important; }
html.qa-app :is(body, #q#q#q) #buddypress #item-header.groups-header #item-header-content { display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 6px !important; padding: 0 !important; }
html.qa-app :is(body, #q#q#q) #buddypress :is(.group-search, .activity-search).bp-search { float: none !important; width: auto !important; max-width: none !important; margin: 0 0 12px !important; padding: 0 !important; }
html.qa-app :is(body, #q#q#q) #buddypress :is(.group-search, .activity-search) form.bp-dir-search-form { left: auto !important; right: auto !important; width: 100% !important; max-width: none !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; height: auto !important; }
html.qa-app :is(body, #q#q#q) #buddypress ul:has(> li.group-act-search) { float: none !important; width: 100% !important; padding: 0 !important; margin: 0 0 8px !important; list-style: none !important; }
html.qa-app :is(body, #q#q#q) #buddypress li.group-act-search { display: block !important; list-style: none !important; }
html.qa-app :is(body, #q#q#q) #buddypress :is(.group-search, .activity-search) form.bp-dir-search-form input[type="search"] { float: none !important; display: block !important; }
html.qa-app :is(body, #q#q#q) #buddypress #object-nav.groups-nav { margin-left: calc(-1 * var(--q-pad)) !important; margin-right: calc(-1 * var(--q-pad)) !important; border-radius: 0 !important; border-left: 0 !important; border-right: 0 !important; box-shadow: none !important; }
/* Chat: conversations hidden by the search box */
html.qa-app :is(body, #q#q#q) .qa-filtered-out { display: none !important; }
html.qa-app :is(body, #q#q#q) .qa-chat-nomatch { list-style: none !important; }
html.qa-app :is(body, #q#q#q) #buddypress .subnav-filters:has(li.group-act-search) { display: block !important; margin: 0 0 12px !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; }
html.qa-app :is(body, #q#q#q) #buddypress .subnav-filters:has(li.group-act-search) > :is(ul, .component-filters) { margin: 0 !important; }
/* Groups rows: no clearfix gutter before the row (the same fix as Network rows) */
html.qa-app :is(body, #q#q#q) #buddypress #groups-list > li { display: block !important; }
html.qa-app :is(body, #q#q#q) #buddypress #groups-list > li::before, html.qa-app :is(body, #q#q#q) #buddypress #groups-list > li::after { display: none !important; content: none !important; }
html.qa-app :is(body, #q#q#q) #buddypress #groups-list > li > .list-wrap { width: 100% !important; }
html.qa-app :is(body, #q#q#q) #buddypress #groups-list .list-wrap > .item { flex: 1 1 auto !important; min-width: 0 !important; }
/* An empty state that is switched off stays off (the empty-state rule sets display itself) */
html.qa-app :is(body, #q#q#q) :is(#qapf4-main, #qapf2-main, main, body) .qa-empty.qa-empty[hidden] { display: none !important; }
/* Zoom is allowed again (no maximum-scale), so on touch screens every typing field stays at 16px or more:
   iOS zooms into any field under 16px when it gets focus. */
@media (pointer: coarse) {
  /* The never-matching #q…:not(*) only lifts the rule's weight above the platform's field rules. */
  html.qa-app :is(body, #q#q#q) :is(#q#q#q#q#q#q:not(*), input[type="text"], input[type="email"], input[type="url"], input[type="tel"], input[type="number"], input[type="password"], input[type="search"], input[type="date"], input[type="time"], input[type="datetime-local"], input[type="month"], input[type="week"], input:not([type]), select, textarea) { font-size: 16px !important; }
}
/* A list that is loading again (filter, tab, Try again): its rows fade a little after a moment, only in that section */
html.qa-app :is(body, #q#q#q) [data-bp-list].qa-list-busy > :not(.qa-load-error):not(#bp-ajax-loader) { opacity: .5 !important; transition: opacity .2s ease .3s !important; }
@media (prefers-reduced-motion: reduce) { html.qa-app :is(body, #q#q#q) [data-bp-list].qa-list-busy > :not(.qa-load-error):not(#bp-ajax-loader) { transition: none !important; } }
/* Help: the release this phone is running */
html.qa-app :is(body, #q#q#q) .qa-help-version { margin: 20px var(--q-pad) 8px !important; font-size: var(--q-fs-meta) !important; color: var(--q-text-3) !important; font-variant-numeric: tabular-nums !important; user-select: text !important; -webkit-user-select: text !important; }