/*
 * Phase 9 / Wave 5 — Supporting Interfaces
 * Approved panels: receivables, settings, users, feedback-center and guide.
 * Approved surfaces: login, notifications, report, Internal Chat, POP Nexus and PWA.
 * Rollback boundary: remove this stylesheet and body.bms-wave-5.
 */

.bms-wave-5 :is(
  .panel[data-panel="receivables"],
  .panel[data-panel="settings"],
  .panel[data-panel="users"],
  .panel[data-panel="feedback-center"],
  .panel[data-panel="guide"]
) {
  min-width: 0;
  padding: var(--bms-space-4);
  border: 1px solid var(--line);
  border-radius: var(--bms-radius-2);
  color: var(--ink);
  background: var(--surface);
  box-shadow: var(--bms-shadow-1);
  font-family: var(--bms-font-ui);
}

/* Dark Executive uses full-width command canvases on supporting, non-workflow routes. */
.bms-dark-executive.bms-wave-5 :is(
  .panel[data-panel="receivables"],
  .panel[data-panel="settings"],
  .panel[data-panel="users"],
  .panel[data-panel="feedback-center"],
  .panel[data-panel="guide"]
) {
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.bms-wave-5 :is(
  .panel[data-panel="receivables"],
  .panel[data-panel="settings"],
  .panel[data-panel="users"],
  .panel[data-panel="feedback-center"],
  .panel[data-panel="guide"],
  #notificationDropdown,
  #reportDialog,
  #loginOverlay,
  .internal-chat-root,
  .pop-nexus-root
) :is(button, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid color-mix(in srgb, var(--bms-focus) 38%, transparent);
  outline-offset: 2px;
}

.bms-wave-5 :is(
  .panel[data-panel="receivables"],
  .panel[data-panel="settings"],
  .panel[data-panel="users"],
  .panel[data-panel="feedback-center"],
  .panel[data-panel="guide"]
) :is(.section-title, .workflow-page-title, .ar-header) {
  min-height: 52px;
  margin: 0 0 var(--bms-space-3);
  padding: 0 0 var(--bms-space-3);
  border-bottom: 1px solid var(--line);
  color: var(--ink);
  background: transparent;
}

.bms-wave-5 :is(
  .panel[data-panel="receivables"],
  .panel[data-panel="settings"],
  .panel[data-panel="users"],
  .panel[data-panel="feedback-center"],
  .panel[data-panel="guide"]
) :is(h2, h3, h4) { color: var(--ink); }

.bms-wave-5 :is(
  .panel[data-panel="receivables"],
  .panel[data-panel="settings"],
  .panel[data-panel="users"],
  .panel[data-panel="feedback-center"],
  .panel[data-panel="guide"]
) :is(.eyebrow, .inventory-kicker) {
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
}

/* Shared action and field grammar; existing IDs and listeners remain untouched. */
.bms-wave-5 :is(
  .panel[data-panel="receivables"],
  .panel[data-panel="settings"],
  .panel[data-panel="users"],
  .panel[data-panel="feedback-center"],
  .panel[data-panel="guide"],
  #notificationDropdown,
  #reportDialog,
  #loginOverlay,
  .internal-chat-root,
  .pop-nexus-root
) :is(.btn, button) {
  border-radius: var(--bms-radius-2);
  box-shadow: none;
  transform: none;
}

.bms-wave-5 :is(
  .panel[data-panel="receivables"],
  .panel[data-panel="settings"],
  .panel[data-panel="users"],
  .panel[data-panel="feedback-center"],
  .panel[data-panel="guide"],
  #reportDialog,
  #loginOverlay
) :is(.btn, input, select, textarea) { min-height: var(--bms-control-standard); }

.bms-wave-5 :is(
  .panel[data-panel="receivables"],
  .panel[data-panel="settings"],
  .panel[data-panel="users"],
  .panel[data-panel="feedback-center"],
  .panel[data-panel="guide"],
  #loginOverlay
) :is(input, select, textarea) {
  border: 1px solid var(--line);
  border-radius: var(--bms-radius-2);
  color: var(--ink);
  background: var(--surface);
  box-shadow: none;
}

.bms-wave-5 :is(
  .panel[data-panel="receivables"],
  .panel[data-panel="settings"],
  .panel[data-panel="users"],
  .panel[data-panel="feedback-center"]
) .btn.primary,
.bms-wave-5 :is(#reportDialog, #loginOverlay) .btn.primary {
  border-color: var(--bms-primary);
  color: var(--bms-surface);
  background: var(--bms-primary);
}

.bms-wave-5 :is(
  .panel[data-panel="receivables"],
  .panel[data-panel="settings"],
  .panel[data-panel="users"],
  .panel[data-panel="feedback-center"]
) .btn.secondary {
  border-color: var(--line);
  color: var(--ink);
  background: var(--surface);
}

.bms-wave-5 :is(.panel[data-panel="settings"], .panel[data-panel="users"]) .btn.danger {
  border-color: color-mix(in srgb, var(--bms-danger) 38%, var(--line));
  color: var(--bms-danger);
  background: color-mix(in srgb, var(--surface) 88%, var(--bms-danger));
}

/* Receivables — dense financial evidence stays comparable and locally scrollable. */
.bms-wave-5 .panel[data-panel="receivables"] .ar-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--bms-space-3);
}

.bms-wave-5 .panel[data-panel="receivables"] .ar-header-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--bms-space-2);
}

.bms-wave-5 .panel[data-panel="receivables"] .ar-project-context {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--bms-space-1);
  max-width: 640px;
  margin: var(--bms-space-1) 0 0;
  color: var(--muted);
  font-size: 12px;
}
.bms-wave-5 .panel[data-panel="receivables"] .ar-project-context strong { color: var(--bms-primary); }

.bms-wave-5 .panel[data-panel="receivables"] .ar-metrics {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0;
  margin-bottom: var(--bms-space-3);
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--bms-radius-2);
  background: var(--surface);
}

.bms-wave-5 .panel[data-panel="receivables"] .ar-metric {
  min-width: 0;
  min-height: 82px;
  padding: var(--bms-space-3);
  border: 0;
  border-right: 1px solid var(--line);
  border-radius: 0;
  color: var(--ink);
  background: var(--surface);
  box-shadow: none;
}

.bms-wave-5 .panel[data-panel="receivables"] .ar-metric:last-child { border-right: 0; }
.bms-wave-5 .panel[data-panel="receivables"] .ar-metric span { color: var(--muted); font-size: 11px; }
.bms-wave-5 .panel[data-panel="receivables"] .ar-metric strong { display: block; margin-top: var(--bms-space-2); font-size: 18px; }
.bms-wave-5 .panel[data-panel="receivables"] .ar-metric strong { color: var(--ink); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }

.bms-wave-5 .panel[data-panel="receivables"] .ar-workspace {
  display: block;
  min-width: 0;
}

.bms-wave-5 .panel[data-panel="receivables"] .ar-main-card {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--bms-radius-2);
  color: var(--ink);
  background: var(--surface);
  box-shadow: none;
}
.bms-wave-5 .panel[data-panel="receivables"] .ar-warning {
  border: 1px solid color-mix(in srgb, var(--bms-warning) 35%, var(--line));
  color: var(--bms-warning);
  background: color-mix(in srgb, var(--surface) 88%, var(--bms-warning));
}

.bms-wave-5 .panel[data-panel="receivables"] .ar-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--bms-space-3);
  padding: var(--bms-space-3);
  border-bottom: 1px solid var(--line);
  background: var(--surface-soft);
}

.bms-wave-5 .panel[data-panel="receivables"] .inventory-filters,
.bms-wave-5 .panel[data-panel="receivables"] .ar-tabs {
  display: flex;
  gap: 0;
  overflow-x: auto;
  border-bottom: 1px solid var(--line);
  background: transparent;
  overscroll-behavior-inline: contain;
}

.bms-wave-5 .panel[data-panel="receivables"] .ar-tabs {
  flex: 1 1 auto;
  border-bottom: 0;
}

.bms-wave-5 .panel[data-panel="receivables"] :is(.inventory-filter, .ar-tabs button) {
  min-height: var(--bms-control-standard);
  padding: 8px 12px;
  border: 0;
  border-bottom: 3px solid transparent;
  border-radius: 0;
  color: var(--muted);
  background: transparent;
  white-space: nowrap;
}

.bms-wave-5 .panel[data-panel="receivables"] :is(.inventory-filter.active, .ar-tabs button.active) {
  border-bottom-color: var(--bms-primary);
  color: var(--bms-primary);
  background: color-mix(in srgb, var(--surface) 90%, var(--bms-primary));
}

.bms-wave-5 .panel[data-panel="receivables"] .ar-tab-content { min-height: 120px; }
.bms-wave-5 .panel[data-panel="receivables"] .ar-tab-content:has(.table-wrap) { min-height: 0; }
.bms-wave-5 .panel[data-panel="receivables"] :is(.ar-schedule-table-wrap, .ar-payment-table-wrap) { max-width: 100%; overflow-x: auto; overflow-y: hidden; border: 0; border-radius: 0; scrollbar-gutter: auto; }
.bms-wave-5 .panel[data-panel="receivables"] :is(.ar-schedule-table, .ar-payment-table) { width: 100%; min-width: 1080px; border-collapse: collapse; background: var(--surface); }
.bms-wave-5 .panel[data-panel="receivables"] :is(.ar-schedule-table, .ar-payment-table) th { position: sticky; top: 0; z-index: var(--bms-z-sticky); color: var(--muted); background: var(--surface-soft); }
.bms-wave-5 .panel[data-panel="receivables"] :is(.ar-schedule-table, .ar-payment-table) :is(th, td) { border-bottom: 1px solid var(--line); white-space: nowrap; }
.bms-wave-5 .panel[data-panel="receivables"] :is(.ar-schedule-table, .ar-payment-table) tbody td { height: 62px; padding-block: var(--bms-space-3); vertical-align: middle; }
.bms-wave-5 .panel[data-panel="receivables"] :is(.ar-schedule-table, .ar-payment-table) tbody tr:last-child td { border-bottom: 0; }
.bms-wave-5 .panel[data-panel="receivables"] :is(.ar-schedule-table, .ar-payment-table) tbody tr:hover { background: color-mix(in srgb, var(--surface) 92%, var(--bms-primary)); }

.bms-wave-5 .panel[data-panel="receivables"] .ar-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 0;
  border-radius: var(--bms-radius-round);
  color: var(--bms-neutral);
  background: var(--bms-neutral-soft);
  box-shadow: none;
  font-weight: 600;
}

.bms-wave-5 .panel[data-panel="receivables"] .ar-status:is(.paid) { color: var(--bms-success); background: var(--bms-success-soft); }
.bms-wave-5 .panel[data-panel="receivables"] .ar-status:is(.due, .partially_due, .partially_paid, .on_hold) { color: var(--bms-warning); background: var(--bms-warning-soft); }
.bms-wave-5 .panel[data-panel="receivables"] .ar-status:is(.overdue, .disputed) { color: var(--bms-danger); background: var(--bms-danger-soft); }

.bms-wave-5 .panel[data-panel="receivables"] .ar-detail-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--bms-space-3);
  min-height: 54px;
  padding: var(--bms-space-2) var(--bms-space-4);
  border-bottom: 1px solid var(--line);
  background: var(--surface-soft);
}

.bms-wave-5 .panel[data-panel="receivables"] #arTabs { align-items: center; align-self: stretch; gap: 0; overflow: visible; }
.bms-wave-5 .panel[data-panel="receivables"] #arTabs button { min-height: 38px; padding: 8px 13px; border: 0; border-bottom: 3px solid transparent; border-radius: 0; background: transparent; box-shadow: none; }
.bms-wave-5 .panel[data-panel="receivables"] #arTabs button.active { border-color: transparent; border-bottom-color: var(--bms-primary); color: var(--bms-primary); background: color-mix(in srgb, var(--surface) 90%, var(--bms-primary)); }
.bms-wave-5 .panel[data-panel="receivables"] .ar-detail-nav #arAddScheduleBtn { flex: 0 0 auto; min-height: 36px; margin: 0; padding-inline: 14px; }
.bms-wave-5 .panel[data-panel="receivables"] .ar-detail-actions { display: flex; align-items: center; justify-content: flex-end; gap: var(--bms-space-2); }
.bms-wave-5 .panel[data-panel="receivables"] .ar-detail-actions .btn { min-height: 36px; margin: 0; }
.bms-wave-5 .panel[data-panel="receivables"] .ar-actions-cell { min-width: 210px; }
.bms-wave-5 .panel[data-panel="receivables"] .ar-payment-actions { display: flex; justify-content: flex-end; flex-wrap: nowrap; gap: var(--bms-space-1); }
.bms-wave-5 .panel[data-panel="receivables"] .ar-payment-actions .btn { min-height: 30px; padding: 5px 10px; border-radius: var(--bms-radius-2); font-size: 11px; }
.bms-wave-5 .panel[data-panel="receivables"] #arTabContent .ar-payment-actions .ar-request-btn { min-width: 92px; margin-left: auto; border-color: var(--bms-primary); color: var(--bms-surface); background: var(--bms-primary); }
.bms-wave-5 .panel[data-panel="receivables"] #arTabContent .ar-payment-actions .btn.danger { border-color: color-mix(in srgb, var(--bms-danger) 42%, var(--line)); color: var(--bms-danger); background: var(--surface); }
.bms-wave-5 .panel[data-panel="receivables"] .ar-form-actions { display: flex; justify-content: flex-end; gap: var(--bms-space-2); margin-top: var(--bms-space-3); }
.bms-wave-5 .panel[data-panel="receivables"] .ar-form-actions .btn.primary { flex: 1 1 auto; }
.bms-wave-5 .panel[data-panel="receivables"] .ar-form-actions .btn.danger { flex: 0 0 auto; border-color: color-mix(in srgb, var(--bms-danger) 42%, var(--line)); color: var(--bms-danger); background: var(--surface); }
.bms-wave-5 .panel[data-panel="receivables"] .ar-drawer > header { padding-bottom: 0; border-bottom: 0; }
.bms-wave-5 .panel[data-panel="receivables"] .ar-drawer .ar-form { margin-top: var(--bms-space-4); }
.bms-wave-5 .panel[data-panel="receivables"] .ar-drawer.is-payment { position: fixed; z-index: 140; top: 68px; right: 0; bottom: 0; width: min(620px, 100%); height: auto; max-height: none; padding: var(--bms-space-4); overflow-x: hidden; overflow-y: auto; border-left: 1px solid var(--line); border-radius: 0; }
.bms-wave-5 .panel[data-panel="receivables"] .ar-drawer.is-payment #arDrawerBody { min-height: calc(100% - 56px); }
.bms-wave-5 .panel[data-panel="receivables"] .ar-drawer.is-payment .ar-payment-form { min-height: 100%; align-content: start; gap: var(--bms-space-4); }
.bms-wave-5 .panel[data-panel="receivables"] .ar-payment-grid label { gap: var(--bms-space-2); color: var(--muted); font: 700 11px/1.35 var(--bms-font-ui); }
.bms-wave-5 .panel[data-panel="receivables"] .ar-payment-grid :is(input, select, textarea) { font: 500 13px/1.4 var(--bms-font-ui); }
.bms-wave-5 .panel[data-panel="receivables"] .ar-payment-grid textarea { min-height: 96px; padding: 10px 12px; resize: vertical; }
.bms-wave-5 .panel[data-panel="receivables"] .ar-payment-grid input[type="file"],
.bms-wave-5 .panel[data-panel="receivables"] .ar-invoice-form input[type="file"] { padding: 6px 8px; color: var(--muted); background: var(--surface-soft); }
.bms-wave-5 .panel[data-panel="receivables"] .ar-file-link { min-height: 28px; padding: 4px 9px; border: 1px solid color-mix(in srgb, var(--bms-primary) 35%, var(--line)); border-radius: var(--bms-radius-2); color: var(--bms-primary); background: var(--surface); font-size: 11px; font-weight: 700; }
.bms-wave-5 .panel[data-panel="receivables"] .ar-payment-actions-bar { margin-top: auto; }
.bms-wave-5 .panel[data-panel="receivables"] .ar-invoice-history { display: grid; gap: var(--bms-space-2); margin-top: var(--bms-space-4); }
.bms-wave-5 .panel[data-panel="receivables"] .ar-invoice-file-row { display: flex; align-items: center; justify-content: space-between; gap: var(--bms-space-3); padding: var(--bms-space-3); border: 1px solid var(--line); border-radius: var(--bms-radius-2); background: var(--surface-soft); }
.bms-wave-5 .panel[data-panel="receivables"] .ar-invoice-file-row strong,
.bms-wave-5 .panel[data-panel="receivables"] .ar-invoice-file-row small { display: block; }
.bms-wave-5 .panel[data-panel="receivables"] .ar-invoice-file-row small { margin-top: 3px; color: var(--muted); }
.bms-wave-5 .panel[data-panel="receivables"] .ar-invoice-file-row > div:last-child { display: flex; gap: var(--bms-space-1); }
.bms-wave-5 .panel[data-panel="receivables"] .ar-empty-state { padding: var(--bms-space-6); color: var(--muted); text-align: center; }
.bms-wave-5 .panel[data-panel="receivables"] .ar-form-note { margin: 0; padding: var(--bms-space-3); border: 1px solid var(--line); border-radius: var(--bms-radius-2); color: var(--muted); background: var(--surface-soft); }
.bms-wave-5 .panel[data-panel="receivables"] .ar-metric small { display: block; margin-top: 4px; color: var(--muted); font-size: 11px; }
.bms-wave-5 .panel[data-panel="receivables"] .ar-metric.overdue strong { color: var(--bms-danger); }
.bms-wave-5 .panel[data-panel="receivables"] .ar-metric.due strong { color: var(--bms-warning); }
.bms-wave-5 .panel[data-panel="receivables"] .ar-drawer {
  border-left: 1px solid var(--line);
  color: var(--ink);
  background: var(--surface);
  box-shadow: var(--bms-shadow-overlay);
}

/* Settings — operational preferences, integrations and templates share one card language. */
.bms-wave-5 .panel[data-panel="settings"] > .section-title.compact {
  margin-bottom: var(--bms-space-3);
  padding: 2px 2px var(--bms-space-3);
  border-bottom: 1px solid var(--line);
}

.bms-wave-5 .panel[data-panel="settings"] > .section-title.compact .eyebrow { margin-bottom: 3px; }

.bms-wave-5 .panel[data-panel="settings"] .settings-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--bms-space-3);
}

.bms-wave-5 .panel[data-panel="settings"] :is(.settings-card, .telegram-hub-section) {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: var(--bms-radius-2);
  color: var(--ink);
  background: var(--surface);
  box-shadow: none;
}

.bms-wave-5 .panel[data-panel="settings"] .settings-card { padding: var(--bms-space-4); }
.bms-wave-5 .panel[data-panel="settings"] > .settings-card { margin-top: var(--bms-space-3); }
.bms-wave-5 .panel[data-panel="settings"] :is(.settings-card p, .telegram-hub-section p, .field-hint) { color: var(--muted); }
.bms-wave-5 .panel[data-panel="settings"] .telegram-settings-hub { border-top: 3px solid var(--bms-primary); }
.bms-wave-5 .panel[data-panel="settings"] :is(.telegram-hub-header, .telegram-section-heading, .telegram-admin-heading) { display: flex; justify-content: space-between; gap: var(--bms-space-3); }
.bms-wave-5 .panel[data-panel="settings"] .telegram-hub-header { padding: var(--bms-space-3); border: 1px solid var(--line); border-radius: var(--bms-radius-2); background: var(--surface-soft); }
.bms-wave-5 .panel[data-panel="settings"] .telegram-hub-section { margin-top: var(--bms-space-3); padding: var(--bms-space-4); }
.bms-wave-5 .panel[data-panel="settings"] :is(.telegram-user-actions, .telegram-admin-actions, .pwa-actions) { display: flex; flex-wrap: wrap; gap: var(--bms-space-2); }
.bms-wave-5 .panel[data-panel="settings"] .app-download-header {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: var(--bms-space-4);
}
.bms-wave-5 .panel[data-panel="settings"] .app-download-header h3 { margin: 0 0 var(--bms-space-1); }
.bms-wave-5 .panel[data-panel="settings"] .app-runtime-status {
  flex: 0 0 auto;
  padding: var(--bms-space-1) var(--bms-space-2);
  border: 1px solid var(--line);
  border-radius: var(--bms-radius-round);
  color: var(--muted);
  background: var(--surface-soft);
  font-size: var(--bms-text-xs);
}
.bms-wave-5 .panel[data-panel="settings"] .app-download-grid,
.bms-wave-5 .panel[data-panel="settings"] .pwa-install-guides {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--bms-space-3);
  margin-top: var(--bms-space-3);
}
.bms-wave-5 .panel[data-panel="settings"] .app-download-grid-single { grid-template-columns: minmax(0, 1fr); }
.bms-wave-5 .panel[data-panel="settings"] .app-download-section {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--bms-space-3);
  margin: var(--bms-space-3) 0;
  padding: var(--bms-space-3);
  border: 1px solid var(--line);
  border-radius: var(--bms-radius-2);
  background: var(--surface-soft);
}
.bms-wave-5 .panel[data-panel="settings"] .app-download-grid .app-download-section { margin: 0; align-items: stretch; flex-direction: column; }
.bms-wave-5 .panel[data-panel="settings"] .app-download-copy { display: grid; gap: 3px; }
.bms-wave-5 .panel[data-panel="settings"] .app-download-copy span { color: var(--muted); font-size: var(--bms-text-xs); }
.bms-wave-5 .panel[data-panel="settings"] .app-download-btn { flex: 0 0 auto; gap: var(--bms-space-2); margin-top: var(--bms-space-3); text-decoration: none; }
.bms-wave-5 .panel[data-panel="settings"] .pwa-install-guides section { padding: var(--bms-space-3); border: 1px solid var(--line); border-radius: var(--bms-radius-2); }
.bms-wave-5 .panel[data-panel="settings"] .pwa-install-guides ol { margin: var(--bms-space-2) 0 0; padding-left: 20px; color: var(--muted); }
.bms-wave-5 .panel[data-panel="settings"] .pwa-install-guides li + li { margin-top: var(--bms-space-1); }
.bms-wave-5 .panel[data-panel="settings"] .telegram-status-badge {
  align-self: start;
  border: 1px solid color-mix(in srgb, var(--bms-warning) 35%, var(--line));
  border-radius: var(--bms-radius-round);
  color: var(--bms-warning);
  background: color-mix(in srgb, var(--surface) 90%, var(--bms-warning));
  font-weight: 750;
}

.bms-wave-5 .panel[data-panel="settings"] .segmented {
  display: inline-flex;
  padding: 2px;
  border: 1px solid var(--line);
  border-radius: var(--bms-radius-2);
  background: var(--surface-soft);
}

.bms-wave-5 .panel[data-panel="settings"] .segment { min-height: var(--bms-control-standard); border: 0; color: var(--muted); background: transparent; }
.bms-wave-5 .panel[data-panel="settings"] .segment.active { color: var(--bms-primary); background: var(--surface); box-shadow: var(--bms-shadow-1); }
.bms-wave-5 .panel[data-panel="settings"] .notification-preference-list { display: grid; gap: var(--bms-space-2); }
.bms-wave-5 .panel[data-panel="settings"] .telegram-master-switch { min-height: var(--bms-control-touch); }
.bms-wave-5 .panel[data-panel="settings"] .telegram-admin-content { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(260px, 1fr); gap: var(--bms-space-4); }
.bms-wave-5 .panel[data-panel="settings"] .telegram-credential-form {
  padding: var(--bms-space-3);
  border: 1px solid color-mix(in srgb, var(--bms-warning) 32%, var(--line));
  border-radius: var(--bms-radius-2);
  background: color-mix(in srgb, var(--surface) 94%, var(--bms-warning));
}
.bms-wave-5 .panel[data-panel="settings"] .telegram-credential-row { display: flex; flex-wrap: wrap; gap: var(--bms-space-2); }
.bms-wave-5 .panel[data-panel="settings"] .telegram-credential-row input { flex: 1 1 260px; }
.bms-wave-5 .panel[data-panel="settings"] .telegram-admin-status { display: grid; grid-template-columns: minmax(130px, .8fr) minmax(0, 1.2fr); margin: 0; }
.bms-wave-5 .panel[data-panel="settings"] .telegram-admin-status :is(dt, dd) { margin: 0; padding: var(--bms-space-2); border-bottom: 1px solid var(--line); overflow-wrap: anywhere; }
.bms-wave-5 .panel[data-panel="settings"] .telegram-admin-status dt { color: var(--muted); background: var(--surface-soft); }
.bms-wave-5 .panel[data-panel="settings"] :is(.branding-form, .template-settings-heading) { display: grid; gap: var(--bms-space-3); }
.bms-wave-5 .panel[data-panel="settings"] .branding-form { max-width: 100%; overflow: auto; }
.bms-wave-5 .panel[data-panel="settings"] .template-library-wrap { max-width: 100%; overflow: hidden; }
.bms-wave-5 .panel[data-panel="settings"] .template-library-table { width: 100%; min-width: 0; table-layout: fixed; border-collapse: collapse; }
.bms-wave-5 .panel[data-panel="settings"] .template-library-table th { position: sticky; top: 0; z-index: var(--bms-z-sticky); color: var(--muted); background: var(--surface-soft); }
.bms-wave-5 .panel[data-panel="settings"] .template-library-table :is(th, td) { border-bottom: 1px solid var(--line); }
.bms-wave-5 .panel[data-panel="settings"] .pwa-settings-card { border-top: 3px solid var(--bms-info); }
.bms-wave-5 .panel[data-panel="settings"] .pwa-settings-card details { margin-top: var(--bms-space-2); border-top: 1px solid var(--line); padding-top: var(--bms-space-2); }

/* Users — permissions remain explicit and high-density. */
.bms-wave-5 .panel[data-panel="users"] .user-admin-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--bms-space-3);
  align-items: start;
}
.bms-wave-5 .panel[data-panel="users"] .table-wrap { max-width: 100%; overflow: auto; border: 1px solid var(--line); border-radius: var(--bms-radius-2); }
.bms-wave-5 .panel[data-panel="users"] table { min-width: 720px; border-collapse: collapse; background: var(--surface); }
.bms-wave-5 .panel[data-panel="users"] th { position: sticky; top: 0; z-index: var(--bms-z-sticky); color: var(--muted); background: var(--surface-soft); }
.bms-wave-5 .panel[data-panel="users"] :is(th, td) { border-bottom: 1px solid var(--line); }
.bms-wave-5 .panel[data-panel="users"] tbody tr:hover { background: color-mix(in srgb, var(--surface) 92%, var(--bms-primary)); }
.bms-wave-5 .panel[data-panel="users"] .user-form { position: static; min-width: 0; padding: var(--bms-space-4); border: 1px solid var(--line); border-top: 3px solid var(--bms-primary); border-radius: var(--bms-radius-2); background: var(--surface); box-shadow: none; }
.bms-wave-5 .panel[data-panel="users"] .user-form label { display: grid; gap: var(--bms-space-1); margin-bottom: var(--bms-space-3); }
.bms-wave-5 .panel[data-panel="users"] .check-label { display: flex; min-height: var(--bms-control-touch); align-items: center; }
.bms-wave-5 .panel[data-panel="users"] .permission-matrix { max-height: none; overflow: visible; border: 0; border-top: 1px solid var(--line); border-radius: 0; background: var(--surface); }
.users-panel[data-permission-mode="advanced"] .user-admin-grid > .table-wrap,
.users-panel[data-permission-mode="advanced"] #newUserBtn { display: none; }
.permission-advanced-empty { display: none; margin: var(--bms-space-4) 0; color: var(--muted); }
.users-panel[data-permission-mode="advanced"]:not(:has(.user-form:not([hidden]))) .permission-advanced-empty { display: block; }
.users-panel #permissionModeTabs { margin-bottom: var(--bms-space-4); }
.users-panel .user-admin-grid > .table-wrap { max-height: 320px; }
.user-editor-heading { display: flex; align-items: center; justify-content: space-between; gap: var(--bms-space-3); }
.user-editor-heading h3 { margin: 0; }
.user-account-fields { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: var(--bms-space-3); }
.user-account-fields > label { min-width: 0; }
@media(max-width:720px) {
  .user-account-fields { grid-template-columns: minmax(0,1fr); }
  .user-editor-heading { flex-wrap: wrap; }
  .users-panel #permissionModeTabs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .users-panel #permissionModeTabs .settings-subtab { white-space:normal; }
}

/* Feedback center — evidence, filters and lifecycle states stay distinct. */
.bms-wave-5 .panel[data-panel="feedback-center"] .feedback-metrics {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: var(--bms-space-3);
  margin-bottom: var(--bms-space-3);
  overflow: visible;
  border: 0;
  border-radius: 0;
}
.bms-wave-5 .panel[data-panel="feedback-center"] .feedback-metrics > * { min-width: 0; padding: var(--bms-space-3); border: 1px solid var(--line); border-top: 3px solid var(--bms-primary); border-radius: var(--bms-radius-2); background: var(--surface); box-shadow: none; }
.bms-wave-5 .panel[data-panel="feedback-center"] .feedback-filters { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--bms-space-2); margin-bottom: var(--bms-space-3); padding: var(--bms-space-3); border: 1px solid var(--line); border-radius: var(--bms-radius-2); background: var(--surface-soft); }
.bms-wave-5 .panel[data-panel="feedback-center"] .feedback-filters label { display: grid; gap: var(--bms-space-1); color: var(--muted); font-size: 11px; font-weight: 700; }
.bms-wave-5 .panel[data-panel="feedback-center"] .feedback-filter-actions { display: flex; align-items: end; gap: var(--bms-space-2); }
.bms-wave-5 .panel[data-panel="feedback-center"] .feedback-table-wrap { max-width: 100%; overflow: auto; border: 1px solid var(--line); border-radius: var(--bms-radius-2); }
.bms-wave-5 .panel[data-panel="feedback-center"] .feedback-table { min-width: 980px; border-collapse: collapse; background: var(--surface); }
.bms-wave-5 .panel[data-panel="feedback-center"] .feedback-table th { position: sticky; top: 0; z-index: var(--bms-z-sticky); color: var(--muted); background: var(--surface-soft); }
.bms-wave-5 .panel[data-panel="feedback-center"] .feedback-table :is(th, td) { border-bottom: 1px solid var(--line); }
.bms-wave-5 .panel[data-panel="feedback-center"] .feedback-table th button { color: inherit; background: transparent; }
.bms-wave-5 .panel[data-panel="feedback-center"] :is(.feedback-status, .feedback-severity) { border: 1px solid color-mix(in srgb, var(--muted) 55%, var(--line)); border-radius: var(--bms-radius-2); color: var(--ink); background: var(--surface-soft); font-weight: 800; box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ink) 5%, transparent); }
.bms-wave-5 .panel[data-panel="feedback-center"] .feedback-status:is(.new, .planned, .in_progress, .waiting_test) { border-color: color-mix(in srgb, var(--bms-info) 68%, var(--line)); color: var(--bms-info); background: var(--bms-info-soft); }
.bms-wave-5 .panel[data-panel="feedback-center"] .feedback-status:is(.received, .analyzing) { border-color: color-mix(in srgb, var(--bms-warning) 68%, var(--line)); color: var(--bms-warning); background: var(--bms-warning-soft); }
.bms-wave-5 .panel[data-panel="feedback-center"] .feedback-status.completed { border-color: color-mix(in srgb, var(--bms-success) 68%, var(--line)); color: var(--bms-success); background: var(--bms-success-soft); }
.bms-wave-5 .panel[data-panel="feedback-center"] .feedback-status:is(.rejected, .duplicate) { border-color: color-mix(in srgb, var(--bms-danger) 68%, var(--line)); color: var(--bms-danger); background: var(--bms-danger-soft); }
.bms-wave-5 .panel[data-panel="feedback-center"] .feedback-severity:is(.high, .blocking) { border-color: color-mix(in srgb, var(--bms-danger) 68%, var(--line)); color: var(--bms-danger); background: var(--bms-danger-soft); }
.bms-wave-5 .panel[data-panel="feedback-center"] .feedback-pagination { display: flex; justify-content: end; align-items: center; gap: var(--bms-space-2); margin-top: var(--bms-space-3); }
.bms-wave-5 .panel[data-panel="feedback-center"] .feedback-detail { border-left: 1px solid var(--line); color: var(--ink); background: var(--surface); box-shadow: var(--bms-shadow-overlay); }
.bms-wave-5 .panel[data-panel="feedback-center"] .feedback-detail > header { border-bottom: 1px solid var(--line); }
.bms-wave-5 .panel[data-panel="feedback-center"] :is(.feedback-content-card, .feedback-facts, .feedback-history, .feedback-attachments) { border: 1px solid var(--line); border-radius: var(--bms-radius-2); background: var(--surface); }

/* Guide and playbook — stable reading hierarchy with a compact topic rail. */
.bms-wave-5 .panel[data-panel="guide"] .guide-mode-switch {
  display: flex;
  gap: 0;
  margin-bottom: var(--bms-space-3);
  overflow-x: auto;
  border-bottom: 1px solid var(--line);
  background: transparent;
}
.bms-wave-5 .panel[data-panel="guide"] .guide-mode-switch button { min-height: var(--bms-control-standard); padding: 8px 12px; border: 0; border-bottom: 3px solid transparent; border-radius: 0; color: var(--muted); background: transparent; white-space: nowrap; }
.bms-wave-5 .panel[data-panel="guide"] .guide-mode-switch button.active { border-bottom-color: var(--bms-primary); color: var(--bms-primary); background: color-mix(in srgb, var(--surface) 90%, var(--bms-primary)); }
.bms-wave-5 .panel[data-panel="guide"] .guide-toolbar { display: grid; grid-template-columns: minmax(240px, 1fr) minmax(180px, .45fr); gap: var(--bms-space-2); margin-bottom: var(--bms-space-3); padding: var(--bms-space-3); border: 1px solid var(--line); border-radius: var(--bms-radius-2); background: var(--surface-soft); }
.bms-wave-5 .panel[data-panel="guide"] .guide-toolbar label { display: grid; gap: var(--bms-space-1); color: var(--muted); font-size: 11px; font-weight: 700; }
.bms-wave-5 .panel[data-panel="guide"] .guide-layout { display: grid; grid-template-columns: minmax(210px, 280px) minmax(0, 1fr); min-height: 420px; overflow: hidden; border: 1px solid var(--line); border-radius: var(--bms-radius-2); background: var(--surface); }
.bms-wave-5 .panel[data-panel="guide"] .guide-topic-list { overflow: auto; border-right: 1px solid var(--line); background: var(--surface-soft); }
.bms-wave-5 .panel[data-panel="guide"] .guide-topic-list button {
  flex: 0 0 auto;
  display: grid;
  align-content: center;
  gap: 4px;
  width: 100%;
  min-height: 58px;
  padding: 10px 12px;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  color: var(--ink);
  background: transparent;
  text-align: left;
}

.bms-wave-5 .panel[data-panel="settings"] .ai-provider-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(240px, 1fr));
  gap: var(--bms-space-3);
}
.bms-wave-5 .panel[data-panel="settings"] #popNexusContent { grid-template-columns: minmax(0, 1fr); }
.bms-wave-5 .panel[data-panel="settings"] #popNexusContent > .integration-section { grid-row: auto; border-right: 0; }
.bms-wave-5 .panel[data-panel="settings"] #popNexusContent > .integration-section + .integration-section { border-top: 1px solid var(--line); }
.bms-wave-5 .panel[data-panel="settings"] .ai-provider-card {
  display: grid;
  align-content: start;
  gap: var(--bms-space-2);
  min-width: 0;
  margin: 0;
  padding: var(--bms-space-3);
  border: 1px solid var(--line);
  border-radius: var(--bms-radius-2);
  background: var(--surface-soft);
}
.bms-wave-5 .panel[data-panel="settings"] .ai-provider-card legend { padding-inline: var(--bms-space-1); color: var(--ink); font-weight: 750; }
.bms-wave-5 .panel[data-panel="settings"] .ai-provider-card small { color: var(--muted); }
.bms-wave-5 .panel[data-panel="settings"] .ai-provider-card :is(input:not([type="checkbox"]), select, button) { width: 100%; min-width: 0; }

.bms-wave-5 .panel[data-panel="receivables"] .ar-status::before {
  content: "";
  flex: 0 0 6px;
  width: 6px;
  height: 6px;
  border-radius: var(--bms-radius-round);
  background: currentColor;
}
.bms-wave-5 .panel[data-panel="guide"] .guide-topic-list button span { display: block; line-height: 1.35; }
.bms-wave-5 .panel[data-panel="guide"] .guide-topic-list button small { display: block; line-height: 1.35; }
.bms-wave-5 .panel[data-panel="guide"] .guide-topic-list button.active { color: var(--bms-primary); background: color-mix(in srgb, var(--surface) 88%, var(--bms-primary)); box-shadow: inset 3px 0 var(--bms-primary); }
.bms-wave-5 .panel[data-panel="guide"] .guide-content { min-width: 0; padding: var(--bms-space-5); color: var(--ink); background: var(--surface); }
.bms-wave-5 .panel[data-panel="guide"] :is(.guide-section, .guide-callouts, .guide-tour-card, .playbook-mount) { border: 1px solid var(--line); border-radius: var(--bms-radius-2); background: var(--surface); box-shadow: none; }
.bms-wave-5 .panel[data-panel="guide"] .guide-result { border: 1px solid color-mix(in srgb, var(--bms-success) 38%, var(--line)); color: var(--bms-success); background: color-mix(in srgb, var(--surface) 90%, var(--bms-success)); }
.bms-wave-5 .panel[data-panel="guide"] .guide-permission-note { border-left: 3px solid var(--bms-warning); color: var(--bms-warning); background: color-mix(in srgb, var(--surface) 92%, var(--bms-warning)); }
.bms-wave-5 .panel[data-panel="guide"] :is(.playbook-header, .playbook-toolbar, .playbook-nav) { border-color: var(--line); background: var(--surface-soft); }
.bms-wave-5 .panel[data-panel="guide"] :is(.playbook-book, .playbook-page, .playbook-drawer) { border-color: var(--line); color: var(--ink); background: var(--surface); box-shadow: none; }

/* Login and report overlays. */
.bms-wave-5 #loginOverlay {
  display: grid;
  padding: max(var(--bms-space-4), var(--bms-safe-area-top)) max(var(--bms-space-4), var(--bms-safe-area-right)) max(var(--bms-space-4), var(--bms-safe-area-bottom)) max(var(--bms-space-4), var(--bms-safe-area-left));
  place-items: center;
  background: color-mix(in srgb, var(--bms-canvas) 90%, var(--bms-primary));
}
.bms-wave-5 #loginOverlay[hidden] { display: none; }
.bms-wave-5 #loginOverlay .login-card { width: min(100%, 410px); padding: var(--bms-space-8); border: 1px solid var(--line); border-top: 4px solid var(--bms-primary); border-radius: var(--bms-radius-3); color: var(--ink); background: var(--surface); box-shadow: var(--bms-shadow-overlay); }
.bms-wave-5 #loginOverlay .login-card .brand-block { width: 100%; min-width: 0; grid-template-columns: 56px minmax(0, 1fr); color: var(--ink); }
.bms-wave-5 #loginOverlay .login-card .brand-block > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bms-wave-5 #loginOverlay .login-card label { display: grid; gap: var(--bms-space-1); margin-top: var(--bms-space-3); color: var(--muted); font-weight: 700; }
.bms-wave-5 #loginOverlay .login-card .btn { width: 100%; margin-top: var(--bms-space-3); }
.bms-wave-5 #loginOverlay .form-error { color: var(--bms-danger); }
.bms-wave-5.auth-pending { overflow: hidden; }
.bms-wave-5.auth-pending :is(.floating-actions-container, .floating-action-host, .pop-nexus-root, .internal-chat-root) { display: none !important; }
.bms-wave-5.demo-mode .pop-nexus-root:not([data-demo-adapter="true"]),
.bms-wave-5.demo-mode .internal-chat-root:not([data-chat-mode="demo"]) { display: none !important; }
.bms-wave-5 #loginOverlay .turnstile-widget { width: 100%; min-width: 0; min-height: 70px; margin-top: var(--bms-space-4); overflow: hidden; }
.bms-wave-5 #loginOverlay .turnstile-widget[hidden] { display: none; }
.bms-wave-5 #loginOverlay .turnstile-widget > div,
.bms-wave-5 #loginOverlay .turnstile-widget iframe { max-width: 100% !important; }
.bms-wave-5 #loginOverlay .turnstile-native-frame { display: block; width: 100%; height: 70px; border: 0; background: transparent; }
.bms-wave-5 #loginOverlay .login-security-status { min-height: 20px; margin: var(--bms-space-2) 0 0; color: var(--muted); font-size: 12px; line-height: 1.4; }
.bms-wave-5 #loginOverlay .form-error { min-height: 20px; margin: var(--bms-space-2) 0 0; line-height: 1.4; }
.bms-wave-5 #loginOverlay .guest-entry { position: relative; margin-top: var(--bms-space-5); padding-top: var(--bms-space-5); border-top: 1px solid var(--line); text-align: center; }
.bms-wave-5 #loginOverlay .guest-entry > span { position: absolute; top: 0; left: 50%; padding: 0 var(--bms-space-2); color: var(--muted); background: var(--surface); font-size: 12px; transform: translate(-50%,-50%); }
.bms-wave-5 #loginOverlay .guest-entry p { margin: 0; color: var(--muted); }
.bms-wave-5 .demo-mode-badge { display: inline-flex; align-items: center; min-height: 32px; padding: 0 var(--bms-space-3); border: 1px solid color-mix(in srgb,var(--bms-warning) 55%,var(--line)); border-radius: var(--bms-radius-round); color: var(--bms-warning); background: color-mix(in srgb,var(--surface) 92%,var(--bms-warning)); font-size: 11px; font-weight: 800; letter-spacing: .02em; white-space: nowrap; }
.bms-wave-5 .demo-mode-badge[hidden] { display: none; }
.bms-wave-5 #reportDialog { width: min(calc(100% - 32px), 520px); padding: 0; border: 1px solid var(--line); border-top: 4px solid var(--bms-primary); border-radius: var(--bms-radius-3); color: var(--ink); background: var(--surface); box-shadow: var(--bms-shadow-overlay); }
.bms-wave-5 #reportDialog::backdrop { background: color-mix(in srgb, var(--ink) 44%, transparent); }
.bms-wave-5 #reportDialog form { padding: var(--bms-space-6); }
.bms-wave-5 #reportDialog p { color: var(--muted); }

/* Notification center — compact inbox semantics within the existing topbar. */
.bms-wave-5 .topbar:has(#notificationDropdown:not([hidden])) { z-index: var(--bms-z-overlay, 50); }
.bms-wave-5 #notificationBell { min-width: var(--bms-control-standard); min-height: var(--bms-control-standard); border: 1px solid var(--bms-frame-line); border-radius: var(--bms-radius-2); color: var(--bms-frame-text); background: var(--bms-frame-800); }
.bms-wave-5 #notificationBadge { border: 2px solid var(--surface); color: var(--bms-surface); background: var(--bms-danger); }
.bms-wave-5 #notificationDropdown { width: min(420px, calc(100vw - 24px)); max-height: min(70vh, 600px); overflow: hidden; border: 1px solid var(--line); border-top: 3px solid var(--bms-primary); border-radius: var(--bms-radius-2); color: var(--ink); background: var(--surface); box-shadow: var(--bms-shadow-overlay); }
.bms-wave-5 #notificationDropdown > header { min-height: var(--bms-control-touch); padding: var(--bms-space-3); border-bottom: 1px solid var(--line); background: var(--surface-soft); }
.bms-wave-5 #notificationDropdown > header button { min-height: var(--bms-control-standard); color: var(--bms-primary); background: transparent; }
.bms-wave-5 #notificationList { max-height: min(60vh, 520px); overflow: auto; }
.bms-wave-5 #notificationList .notification-item { padding: var(--bms-space-3); border: 0; border-bottom: 1px solid var(--line); border-radius: 0; color: var(--ink); background: var(--surface); }
.bms-wave-5 #notificationList .notification-item.unread { background: color-mix(in srgb, var(--surface) 86%, var(--bms-primary)); box-shadow: inset 4px 0 var(--bms-primary); }
.bms-wave-5 #notificationList .notification-item.read { background: var(--surface); }
.bms-wave-5 #notificationList .notification-item:hover { background: color-mix(in srgb, var(--surface) 93%, var(--bms-primary)); }
.bms-wave-5 #notificationList .notification-item.unread > strong { color: var(--bms-primary-active); font-weight: 800; }
.bms-wave-5 #notificationList .notification-item.read > strong { color: var(--ink); font-weight: 650; }
.bms-wave-5 #notificationList .notification-meta { display: flex; align-items: center; justify-content: space-between; gap: var(--bms-space-2); }
.bms-wave-5 #notificationList .notification-read-state { border-color: var(--line); color: var(--muted); background: var(--surface-soft); }
.bms-wave-5 #notificationList .notification-read-state[data-read-state="unread"] { border-color: color-mix(in srgb, var(--bms-primary) 45%, var(--line)); color: var(--bms-primary-active); background: var(--bms-primary-soft); }
.bms-wave-5 #notificationList .notification-read-state[data-read-state="unread"]::before { background: var(--bms-primary); }
.bms-wave-5 #notificationList .notification-project-link { color: var(--bms-primary); }

/* Communication windows — common surface language, independent lifecycle. */
.bms-wave-5 :is(.internal-chat-window, .pop-nexus-window) {
  z-index: 115;
  border: 1px solid var(--line);
  border-radius: var(--bms-radius-3);
  color: var(--ink);
  background: var(--surface);
  box-shadow: var(--bms-shadow-overlay);
}
.bms-wave-5 :is(.internal-chat-header, .pop-nexus-header) { border-bottom: 1px solid var(--line); color: var(--ink); background: var(--surface-soft); }
.bms-wave-5 #floatingActionsContainer button.floating-action-bubble { width: 50px; min-width: 50px; height: 50px; min-height: 50px; justify-content: center; gap: 0; padding: 8px; border: 1px solid color-mix(in srgb, var(--bms-primary) 26%, var(--bms-border)); border-radius: var(--bms-radius-round); color: var(--bms-surface); background: var(--bms-primary); box-shadow: 0 10px 26px color-mix(in srgb, var(--bms-primary) 28%, transparent); }
.bms-wave-5 .floating-actions-container { position: fixed; z-index: 2147482600; right: max(20px, var(--bms-safe-area-right)); bottom: max(20px, var(--bms-safe-area-bottom)); left: auto; align-items: flex-end; gap: var(--bms-space-2); }
.bms-wave-5 .floating-action-bubble__label { border: 0; border-radius: 0; color: inherit; background: transparent; box-shadow: none; }
.bms-wave-5 .floating-action-bubble__label { display: none; }
.bms-wave-5 .floating-action-bubble__icon { flex-basis: 32px; width: 32px; height: 32px; background: transparent; }
.bms-wave-5 .chat-launcher-icon,
.bms-wave-5 .pop-nexus-launcher svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.bms-opendesign-v8.bms-wave-5 button#notificationBell { border: 1px solid var(--bms-border); border-radius: var(--bms-radius-round); color: var(--bms-text-muted); background: var(--bms-surface); box-shadow: none; }

@media (min-width: 901px) {
  .bms-wave-5 :is(.internal-chat-window, .pop-nexus-window) {
    top: auto;
    right: max(20px, var(--bms-safe-area-right));
    bottom: calc(max(20px, var(--bms-safe-area-bottom)) + 58px);
    left: auto;
    height: min(640px, calc(100dvh - 110px));
    max-height: calc(100dvh - 110px);
    transform-origin: bottom right;
  }
}
.bms-wave-5 :is(.chat-sidebar, .chat-info, .pop-nexus-menu) { border-color: var(--line); color: var(--ink); background: var(--surface-soft); }
.bms-wave-5 :is(.chat-thread, .pop-nexus-body, .pop-nexus-messages) { color: var(--ink); background: var(--surface); }
.bms-wave-5 :is(.chat-composer, .pop-nexus-composer) { border-top: 1px solid var(--line); background: var(--surface-soft); }
.bms-wave-5 :is(.internal-chat-root, .pop-nexus-root) :is(input, select, textarea) { border: 1px solid var(--line); border-radius: var(--bms-radius-2); color: var(--ink); background: var(--surface); box-shadow: none; }
.bms-wave-5 :is(.internal-chat-root, .pop-nexus-root) :is(button, input, select, textarea) { min-height: var(--bms-control-standard); }
.bms-wave-5 .pop-nexus-message { border: 1px solid var(--line); border-radius: var(--bms-radius-2); color: var(--ink); background: var(--surface-soft); box-shadow: none; }
.bms-wave-5 .pop-nexus-message.user { border-color: color-mix(in srgb, var(--bms-primary) 35%, var(--line)); background: color-mix(in srgb, var(--surface) 88%, var(--bms-primary)); }
.bms-wave-5 .chat-message { border: 0; border-radius: 0; color: var(--ink); background: transparent; box-shadow: none; }
.bms-wave-5 :is(.chat-sidebar-tabs, .chat-type-tabs, .pop-feedback-tabs) { border-bottom: 1px solid var(--line); background: transparent; }
.bms-wave-5 :is(.chat-sidebar-tabs, .chat-type-tabs, .pop-feedback-tabs) button { border: 0; border-bottom: 3px solid transparent; border-radius: 0; color: var(--muted); background: transparent; }
.bms-wave-5 :is(.chat-sidebar-tabs, .chat-type-tabs, .pop-feedback-tabs) button.active { border-bottom-color: var(--bms-primary); color: var(--bms-primary); background: color-mix(in srgb, var(--surface) 90%, var(--bms-primary)); }
.bms-wave-5 :is(.chat-conversation, .chat-online-user, .pop-nexus-quick-actions button) { border-color: var(--line); border-radius: var(--bms-radius-2); color: var(--ink); background: var(--surface); }
.bms-wave-5 :is(.chat-conversation.active, .chat-online-user:hover) { color: var(--bms-primary); background: color-mix(in srgb, var(--surface) 90%, var(--bms-primary)); }
.bms-wave-5 :is(.chat-new-dialog, .pop-nexus-integration-dialog, .pop-nexus-feedback-dialog) { color: var(--ink); background: color-mix(in srgb, var(--ink) 44%, transparent); }
.bms-wave-5 :is(.chat-new-dialog > *, .pop-nexus-integration-dialog > *, .pop-nexus-feedback-dialog > *) { border: 1px solid var(--line); border-top: 3px solid var(--bms-primary); border-radius: var(--bms-radius-3); color: var(--ink); background: var(--surface); box-shadow: var(--bms-shadow-overlay); }
.bms-wave-5 :is(.pop-nexus-integration-dialog, .pop-nexus-feedback-dialog) :is(.pop-nexus-dialog-eyebrow, .pop-nexus-dialog-description, .pop-nexus-disclaimer) { color: var(--muted); }
.bms-wave-5 :is(.pop-feedback-status, .pop-nexus-connection-state, .chat-delivery-status) { border: 1px solid var(--line); border-radius: var(--bms-radius-round); color: var(--muted); background: var(--surface-soft); }
.bms-wave-5 :is(.pop-feedback-error, .chat-form-error, .chat-danger) { color: var(--bms-danger); }

/* PWA state is prominent but does not imply offline data persistence. */
.bms-wave-5 #pwaOfflineBanner { min-height: var(--bms-control-touch); padding: var(--bms-space-2) var(--bms-space-4); border: 0; border-bottom: 1px solid color-mix(in srgb, var(--bms-warning) 40%, var(--line)); color: var(--bms-warning); background: color-mix(in srgb, var(--surface) 82%, var(--bms-warning)); box-shadow: var(--bms-shadow-1); font-weight: 750; }

@media (max-width: 900px) {
  /* The windows live inside this fixed stacking context. Keep the context itself
     above the fixed topbar and the mobile workflow wheel, not just its children. */
  .bms-opendesign-v8.bms-wave-5 button#notificationBell {
    width: var(--bms-control-touch);
    min-width: var(--bms-control-touch);
    height: var(--bms-control-touch);
    min-height: var(--bms-control-touch);
  }
  .bms-wave-5 .panel[data-panel="feedback-center"] .feedback-table th button { min-width: var(--bms-control-touch); }
  .bms-wave-5 .floating-actions-container { z-index: 2147482600; }
  .bms-wave-5 :is(.internal-chat-window, .pop-nexus-window) { z-index: 2147482500; }
  .bms-wave-5 :is(.internal-chat-header, .pop-nexus-header) { position: relative; z-index: 2; padding-top: max(var(--bms-space-3), var(--bms-safe-area-top)); }
}

@media (max-width: 1199px) {
  .bms-wave-5 .panel[data-panel="receivables"] .ar-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .bms-wave-5 .panel[data-panel="receivables"] .ar-metric { border-bottom: 1px solid var(--line); }
  .bms-wave-5 .panel[data-panel="receivables"] .ar-metric:nth-child(3n) { border-right: 0; }
  .bms-wave-5 .panel[data-panel="receivables"] .ar-metric:nth-last-child(-n + 2) { border-bottom: 0; }
  .bms-wave-5 .panel[data-panel="feedback-center"] .feedback-filters { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 899px) {
  .bms-wave-5 .panel[data-panel="users"] .user-admin-grid,
  .bms-wave-5 .panel[data-panel="settings"] .telegram-admin-content { grid-template-columns: minmax(0, 1fr); }
  .bms-wave-5 .panel[data-panel="users"] .user-form { position: static; }
  .bms-wave-5 .panel[data-panel="settings"] .settings-grid { grid-template-columns: minmax(0, 1fr); }
  .bms-wave-5 .panel[data-panel="settings"] .ai-provider-grid { grid-template-columns: minmax(0, 1fr); }
  .bms-wave-5 .panel[data-panel="feedback-center"] .feedback-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .bms-wave-5 .panel[data-panel="feedback-center"] .feedback-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bms-wave-5 .panel[data-panel="guide"] .guide-layout { grid-template-columns: minmax(180px, 230px) minmax(0, 1fr); }
}

@media (max-width: 719px) {
  .bms-wave-5 :is(
    .panel[data-panel="receivables"],
    .panel[data-panel="settings"],
    .panel[data-panel="users"],
    .panel[data-panel="feedback-center"],
    .panel[data-panel="guide"]
  ) { padding: 0; }

  .bms-wave-5 .panel[data-panel="settings"] {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    overflow-x: hidden;
  }

  .bms-wave-5 .panel[data-panel="settings"] > .section-title.compact {
    margin: 0;
    padding: var(--bms-space-4) var(--bms-space-3) var(--bms-space-3);
    border-bottom: 1px solid var(--line);
  }

  .bms-wave-5 .panel[data-panel="settings"] .settings-subtabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--bms-space-2);
    width: 100%;
    min-width: 0;
    max-width: 100%;
    width: calc(100% - (2 * var(--bms-space-3)));
    margin: var(--bms-space-3) var(--bms-space-3) var(--bms-space-3);
    overflow: hidden;
  }

  .bms-wave-5 .panel[data-panel="settings"] .settings-subtab {
    width: 100%;
    min-width: 0;
    padding-inline: var(--bms-space-2);
    text-align: center;
    white-space: normal;
  }

  .bms-wave-5 .panel[data-panel="settings"] :is(
    .settings-tab-panels,
    .settings-tab-pane,
    .settings-grid,
    .settings-card,
    .telegram-settings-hub,
    .ai-knowledge-settings,
    .document-template-settings
  ) {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  .bms-wave-5 .panel[data-panel="settings"] :is(input, select, textarea, .segmented, .setting-control) {
    max-width: 100%;
  }

  .bms-wave-5 :is(
    .panel[data-panel="receivables"],
    .panel[data-panel="settings"],
    .panel[data-panel="users"],
    .panel[data-panel="feedback-center"],
    .panel[data-panel="guide"],
    #notificationDropdown,
    #reportDialog,
    #loginOverlay,
    .internal-chat-root,
    .pop-nexus-root
  ) :is(.btn, button, input, select, textarea) { min-height: var(--bms-control-touch); }

  body.bms-opendesign-v8.bms-wave-5 .panel[data-panel="receivables"] :is(.ar-tabs button, #arAddScheduleBtn) {
    min-height: var(--bms-control-touch);
  }

  .bms-wave-5 .panel[data-panel="guide"] .guide-content :is(p, li, strong, small) {
    overflow-wrap: anywhere;
  }

  .bms-wave-5 .panel[data-panel="receivables"] .ar-header,
  .bms-wave-5 .panel[data-panel="settings"] :is(.telegram-hub-header, .telegram-section-heading, .telegram-admin-heading),
  .bms-wave-5 .panel[data-panel="feedback-center"] .section-title { align-items: stretch; flex-direction: column; }
  .bms-wave-5 .panel[data-panel="receivables"] .ar-header-actions,
  .bms-wave-5 .panel[data-panel="settings"] :is(.telegram-user-actions, .telegram-admin-actions, .pwa-actions) { width: 100%; }
  .bms-wave-5 .panel[data-panel="settings"] .app-download-header,
  .bms-wave-5 .panel[data-panel="settings"] .app-download-section,
  .bms-wave-5 .panel[data-panel="settings"] .notification-device-heading { align-items: stretch; flex-direction: column; }
  .bms-wave-5 .panel[data-panel="settings"] :is(.app-download-grid, .pwa-install-guides) { grid-template-columns: minmax(0, 1fr); }
  .bms-wave-5 .panel[data-panel="settings"] .app-runtime-status { align-self: start; }
  .bms-wave-5 .panel[data-panel="settings"] .app-download-btn { width: 100%; }
  .bms-wave-5 .panel[data-panel="receivables"] .ar-header-actions .btn,
  .bms-wave-5 .panel[data-panel="settings"] :is(.telegram-user-actions, .telegram-admin-actions, .pwa-actions) .btn { flex: 0 0 auto; width: 100%; }
  .bms-wave-5 .panel[data-panel="receivables"] .ar-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bms-wave-5 .panel[data-panel="receivables"] .ar-metric:nth-child(3n) { border-right: 1px solid var(--line); }
  .bms-wave-5 .panel[data-panel="receivables"] .ar-metric:nth-child(2n) { border-right: 0; }
  .bms-wave-5 .panel[data-panel="receivables"] .ar-metric:nth-last-child(-n + 2) { border-bottom: 0; }
  .bms-wave-5 .panel[data-panel="receivables"] .ar-toolbar { align-items: stretch; flex-direction: column; }
  .bms-wave-5 .panel[data-panel="receivables"] .ar-detail-nav { align-items: stretch; flex-direction: column; }
  .bms-wave-5 .panel[data-panel="receivables"] #arAddScheduleBtn { flex: 1 1 auto; }
  .bms-wave-5 .panel[data-panel="receivables"] .ar-detail-nav { gap: 0; padding-bottom: var(--bms-space-3); }
  .bms-wave-5 .panel[data-panel="receivables"] .ar-detail-nav #arAddScheduleBtn { width: 100%; margin: var(--bms-space-2) 0 0; }
  .bms-wave-5 .panel[data-panel="receivables"] .ar-detail-actions { align-items: stretch; flex-direction: column; width: 100%; }
  .bms-wave-5 .panel[data-panel="receivables"] .ar-detail-actions .btn { width: 100%; }
  .bms-wave-5 .panel[data-panel="settings"] .telegram-credential-row { align-items: stretch; flex-direction: column; }
  .bms-wave-5 .panel[data-panel="settings"] .telegram-credential-row input { flex-basis: auto; width: 100%; }
  .bms-wave-5 .panel[data-panel="feedback-center"] .feedback-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bms-wave-5 .panel[data-panel="feedback-center"] .feedback-filters { grid-template-columns: minmax(0, 1fr); }
  .bms-wave-5 .panel[data-panel="guide"] .guide-toolbar,
  .bms-wave-5 .panel[data-panel="guide"] .guide-layout { grid-template-columns: minmax(0, 1fr); }
  .bms-wave-5 .panel[data-panel="guide"] .guide-layout { min-height: 0; overflow: visible; }
  .bms-wave-5 .panel[data-panel="guide"] .guide-topic-list { display: flex; max-width: 100%; overflow-x: auto; border: 0; border-bottom: 1px solid var(--line); }
  .bms-wave-5 .panel[data-panel="guide"] .guide-topic-list button { width: auto; min-width: 180px; border-right: 1px solid var(--line); border-bottom: 0; }
  .bms-wave-5 .panel[data-panel="guide"] .guide-topic-list button.active { box-shadow: inset 0 -3px var(--bms-primary); }
  .bms-wave-5 .panel[data-panel="feedback-center"] .feedback-detail,
  .bms-wave-5 .panel[data-panel="receivables"] .ar-drawer,
  .bms-wave-5 :is(.internal-chat-window, .pop-nexus-window) { position: fixed; z-index: 2147482500; inset: 0; width: 100%; max-width: none; height: 100%; max-height: none; border: 0; border-radius: 0; }
  .bms-wave-5 :is(.internal-chat-header, .pop-nexus-header) { position: relative; z-index: 2; padding-top: max(var(--bms-space-3), var(--bms-safe-area-top)); }
  .bms-wave-5 #notificationDropdown { position: fixed; inset: calc(56px + var(--bms-safe-area-top)) var(--bms-space-3) auto; width: auto; max-height: calc(100dvh - 76px - var(--bms-safe-area-top)); }
  .bms-wave-5 #loginOverlay .login-card { padding: var(--bms-space-5); }
  .bms-wave-5 #loginOverlay .login-card .brand-block { grid-template-columns: 40px minmax(0, 1fr); gap: var(--bms-space-3); }
  .bms-wave-5 #loginOverlay .login-card .brand-block :is(strong, .brand-logo) { width: 40px; height: 40px; }
  .bms-wave-5 #loginOverlay { overflow-y: auto; overscroll-behavior: contain; }
  .bms-wave-5 .demo-mode-badge { min-height: 28px; padding-inline: var(--bms-space-2); font-size: 10px; }
}

@media (max-width: 379px) {
  .bms-wave-5 #loginOverlay { padding-inline: 8px; }
  .bms-wave-5 #loginOverlay .login-card { padding-inline: var(--bms-space-4); }
  .bms-wave-5 .demo-mode-badge { max-width: 54px; overflow: hidden; text-overflow: ellipsis; }
}

@media (max-width: 479px) {
  .bms-wave-5 .panel[data-panel="receivables"] .ar-metrics,
  .bms-wave-5 .panel[data-panel="feedback-center"] .feedback-metrics { grid-template-columns: minmax(0, 1fr); }
  .bms-wave-5 .panel[data-panel="receivables"] .ar-metric { border-right: 0; border-bottom: 1px solid var(--line); }
  .bms-wave-5 .panel[data-panel="receivables"] .ar-metric:last-child { border-bottom: 0; }
  .bms-wave-5 .panel[data-panel="settings"] .telegram-admin-status { grid-template-columns: minmax(110px, .8fr) minmax(0, 1.2fr); }
}

@media (max-width: 899px) and (max-height: 480px) {
  .bms-wave-5 :is(
    .panel[data-panel="receivables"],
    .panel[data-panel="settings"],
    .panel[data-panel="users"],
    .panel[data-panel="feedback-center"],
    .panel[data-panel="guide"],
    #notificationDropdown,
    #reportDialog,
    #loginOverlay,
    .internal-chat-root,
    .pop-nexus-root
  ) :is(.btn, button, input, select, textarea) { min-height: var(--bms-control-touch); }
  .bms-wave-5 .panel[data-panel="feedback-center"] .feedback-detail,
  .bms-wave-5 .panel[data-panel="receivables"] .ar-drawer,
  .bms-wave-5 :is(.internal-chat-window, .pop-nexus-window) { position: fixed; z-index: 2147482500; inset: 0; width: 100%; max-width: none; height: 100%; max-height: none; border: 0; border-radius: 0; }
  .bms-wave-5 #loginOverlay { align-items: start; overflow: auto; }
  .bms-wave-5 #loginOverlay .login-card { margin: var(--bms-space-2) auto; padding: var(--bms-space-4); }
}

@media (orientation: landscape) and (min-width: 901px) and (max-width: 950px) and (max-height: 500px) {
  .bms-wave-5 :is(
    .panel[data-panel="receivables"],
    .panel[data-panel="settings"],
    .panel[data-panel="users"],
    .panel[data-panel="feedback-center"],
    .panel[data-panel="guide"],
    #notificationDropdown,
    #reportDialog,
    #loginOverlay,
    .internal-chat-root,
    .pop-nexus-root
  ) :is(.btn, button, input, select, textarea) {
    min-height: var(--bms-control-touch);
  }

  .bms-opendesign-v8.bms-wave-5 button#notificationBell {
    width: var(--bms-control-touch);
    min-width: var(--bms-control-touch);
    height: var(--bms-control-touch);
    min-height: var(--bms-control-touch);
  }

  .bms-wave-5 .panel[data-panel="feedback-center"] .feedback-table th button {
    min-width: var(--bms-control-touch);
  }
}

@media (prefers-reduced-motion: reduce) {
  .bms-wave-5 :is(
    .panel[data-panel="receivables"],
    .panel[data-panel="settings"],
    .panel[data-panel="users"],
    .panel[data-panel="feedback-center"],
    .panel[data-panel="guide"],
    #notificationDropdown,
    #reportDialog,
    #loginOverlay,
    .internal-chat-root,
    .pop-nexus-root
  ) * { scroll-behavior: auto; transition-duration: .01ms; animation-duration: .01ms; animation-iteration-count: 1; }
}

/* Post-rollout dark audit: financial totals must remain legible on executive surfaces. */
@media screen {
  .bms-dark-executive.bms-wave-5 .panel[data-panel="receivables"] .ar-metric strong {
    color: var(--ink);
  }

  .bms-dark-executive.bms-wave-5 .panel[data-panel="receivables"] .inventory-filter.active {
    color: var(--bms-info);
  }
}
