/* Bootstrap utility harmonization for portal, console, marketing, and status pages.
   Keeps Bootstrap classes readable in both light and dark themes. */

html[data-p67-theme] :where(.bg-white, .bg-light, .bg-body, .bg-body-tertiary, .alert-light, .text-bg-light) {
  background-color: var(--p67-surface, var(--p67-surface-1)) !important;
  border-color: var(--p67-border) !important;
  color: var(--p67-text, var(--p67-ink)) !important;
}

html[data-p67-theme] :where(.text-dark, .text-black) {
  color: var(--p67-text, var(--p67-ink)) !important;
}

html[data-p67-theme] :where(.text-muted, .text-body-secondary, .form-text) {
  color: var(--p67-text-muted, var(--p67-ink-muted)) !important;
}

html[data-p67-theme] :where(code, kbd, pre, .code-block, .font-monospace) {
  background: var(--p67-surface-2) !important;
  border-color: var(--p67-border) !important;
  color: var(--p67-text, var(--p67-ink)) !important;
}

html[data-p67-theme] :where(code, kbd, .font-monospace) {
  border-radius: var(--p67-radius-sm);
  overflow-wrap: anywhere;
}

html[data-p67-theme] :where(pre, .code-block) {
  border: 1px solid var(--p67-border);
  border-radius: var(--p67-radius-md);
  max-height: 34rem;
  overflow: auto;
  padding: .875rem;
  white-space: pre-wrap;
  word-break: break-word;
}

html[data-p67-theme] :where(.badge, .status-pill, .neutral-pill) {
  align-items: center;
  display: inline-flex;
  gap: .25rem;
  line-height: 1.1;
  max-width: 100%;
  white-space: normal;
}

html[data-p67-theme] :where(.btn, .p67-btn, button.button) {
  align-items: center;
  display: inline-flex;
  gap: .375rem;
  justify-content: center;
}

html[data-p67-theme] :where(.table-responsive, .list-group, .table-list) {
  border-color: var(--p67-border) !important;
}

html[data-p67-theme="dark"] :where(.bg-white, .bg-light, .bg-body, .bg-body-tertiary, .alert-light, .text-bg-light) {
  background-color: rgba(255, 255, 255, 0.045) !important;
  border-color: rgba(255, 255, 255, 0.14) !important;
  color: #f8fafc !important;
}

html[data-p67-theme="dark"] :where(code, kbd, pre, .code-block, .font-monospace) {
  background: rgba(0, 0, 0, 0.22) !important;
  border-color: rgba(255, 255, 255, 0.14) !important;
  color: #ede9fe !important;
}

html[data-p67-theme="dark"] :where(.text-secondary, .text-muted, .text-body-secondary, .form-text) {
  color: #b8b4c7 !important;
}

@media (max-width: 575.98px) {
  html[data-p67-theme] :where(.p67-section, .p67-home-section) {
    padding-left: .75rem;
    padding-right: .75rem;
  }

  html[data-p67-theme] :where(.p67-btn, .btn) {
    min-width: 0;
  }
}