:root {
    --app-bg: #07111f;
    --app-bg-elevated: #0b1628;
    --app-surface: rgba(11, 22, 40, 0.92);
    --app-surface-2: rgba(15, 28, 49, 0.94);
    --app-surface-3: rgba(20, 36, 61, 0.96);
    --app-border: rgba(125, 170, 255, 0.18);
    --app-border-strong: rgba(125, 170, 255, 0.28);
    --app-text: #e8f0ff;
    --app-muted: #9eb3d1;
    --app-heading: #ffffff;
    --app-primary: #78a9ff;
    --app-primary-strong: #9bc0ff;
    --app-accent: #8df0cc;
    --app-shadow: 0 24px 60px rgba(0, 0, 0, 0.28);
    --app-shadow-soft: 0 14px 34px rgba(0, 0, 0, 0.22);
    --app-radius: 18px;
    --app-radius-sm: 14px;
    --relay-bg: var(--app-bg);
    --relay-surface: var(--app-surface);
    --relay-border: var(--app-border);
    --relay-text: var(--app-text);
    --relay-muted: var(--app-muted);
    --relay-primary: var(--app-primary);
    --relay-primary-dark: var(--app-primary-strong);
    --relay-shadow: var(--app-shadow-soft);
}
html { background: var(--app-bg); }
body.relay-theme-dark { background: radial-gradient(circle at top left, rgba(83, 130, 255, 0.16), transparent 30%), radial-gradient(circle at top right, rgba(77, 216, 173, 0.12), transparent 24%), linear-gradient(180deg, #091220 0%, #07111f 100%); color: var(--app-text); }
body.relay-theme-dark, body.relay-theme-dark .text-body, body.relay-theme-dark .table, body.relay-theme-dark .form-text, body.relay-theme-dark .small, body.relay-theme-dark .lead, body.relay-theme-dark label, body.relay-theme-dark .col-form-label, body.relay-theme-dark .form-label, body.relay-theme-dark .text-muted, body.relay-theme-dark .text-secondary, body.relay-theme-dark .text-body-secondary { color: var(--app-muted) !important; }
body.relay-theme-dark h1, body.relay-theme-dark h2, body.relay-theme-dark h3, body.relay-theme-dark h4, body.relay-theme-dark h5, body.relay-theme-dark h6, body.relay-theme-dark .relay-title, body.relay-theme-dark .relay-section-title, body.relay-theme-dark .display-1, body.relay-theme-dark .display-2, body.relay-theme-dark .display-3, body.relay-theme-dark .display-4, body.relay-theme-dark .display-5, body.relay-theme-dark .display-6, body.relay-theme-dark .fw-bold, body.relay-theme-dark .fw-semibold, body.relay-theme-dark strong, body.relay-theme-dark b, body.relay-theme-dark .text-dark, body.relay-theme-dark .text-black { color: var(--app-heading) !important; }
body.relay-theme-dark a { color: var(--app-primary-strong); }
body.relay-theme-dark a:hover { color: #c0d7ff; }
body.relay-theme-dark .body-content, body.relay-theme-dark footer { background: transparent; }
body.relay-theme-dark .navbar-azure { background: rgba(6, 14, 28, 0.88) !important; backdrop-filter: blur(18px); border-bottom: 1px solid var(--app-border); box-shadow: 0 12px 40px rgba(0, 0, 0, 0.26); }
body.relay-theme-dark .navbar-brand, body.relay-theme-dark .nav-link, body.relay-theme-dark .auth-guest-link, body.relay-theme-dark .user-profile-link, body.relay-theme-dark .logout-link { color: var(--app-text) !important; }
body.relay-theme-dark .nav-link:hover, body.relay-theme-dark .nav-link:focus, body.relay-theme-dark .auth-guest-link:hover, body.relay-theme-dark .user-profile-link:hover, body.relay-theme-dark .logout-link:hover { background: rgba(120, 169, 255, 0.14); color: #fff !important; }
body.relay-theme-dark .relay-card, body.relay-theme-dark .card, body.relay-theme-dark .kpi-card, body.relay-theme-dark .table-container, body.relay-theme-dark .controls-bar, body.relay-theme-dark .relay-form-wrapper, body.relay-theme-dark .side-menu-card, body.relay-theme-dark .relay-auth-card, body.relay-theme-dark .relay-hero, body.relay-theme-dark .api-tester-card, body.relay-theme-dark .devportal-card, body.relay-theme-dark .devportal-meta-item, body.relay-theme-dark .mapping-card, body.relay-theme-dark .field-row, body.relay-theme-dark .form-check.custom-checkbox, body.relay-theme-dark .field-box, body.relay-theme-dark .accordion-item, body.relay-theme-dark .list-group-item, body.relay-theme-dark .modal-content, body.relay-theme-dark .dropdown-menu, body.relay-theme-dark pre:not(.devportal-code):not(.api-tester-response pre), body.relay-theme-dark code:not(.badge-method):not(.code-snippet) { background: var(--app-surface) !important; border-color: var(--app-border) !important; color: var(--app-text); box-shadow: var(--app-shadow-soft); }
body.relay-theme-dark .card-header, body.relay-theme-dark .relay-card-header, body.relay-theme-dark .accordion-button, body.relay-theme-dark .api-tester-card-header, body.relay-theme-dark .devportal-card-header, body.relay-theme-dark .menu-section-header, body.relay-theme-dark .modal-header, body.relay-theme-dark .modal-footer { background: linear-gradient(180deg, rgba(120, 169, 255, 0.12), rgba(120, 169, 255, 0.04)) !important; border-color: var(--app-border) !important; color: var(--app-heading); }
body.relay-theme-dark .accordion-button:not(.collapsed) { background: linear-gradient(180deg, rgba(120, 169, 255, 0.18), rgba(120, 169, 255, 0.08)) !important; color: var(--app-heading) !important; }
body.relay-theme-dark .list-group-item, body.relay-theme-dark .relay-menu .list-group-item { color: var(--app-text) !important; background: transparent !important; }
body.relay-theme-dark .list-group-item:hover, body.relay-theme-dark .relay-menu .list-group-item:hover, body.relay-theme-dark .list-group-item-action:hover { background: rgba(120, 169, 255, 0.08) !important; }
body.relay-theme-dark .relay-menu .list-group-item.active, body.relay-theme-dark .relay-tab.active, body.relay-theme-dark .nav-pills .nav-link.active, body.relay-theme-dark .nav-tabs .nav-link.active { background: rgba(120, 169, 255, 0.16) !important; color: #fff !important; border-color: rgba(120, 169, 255, 0.34) !important; box-shadow: inset 3px 0 0 var(--app-primary); }
body.relay-theme-dark .relay-tab, body.relay-theme-dark .nav-tabs .nav-link, body.relay-theme-dark .nav-pills .nav-link { color: var(--app-muted) !important; }
body.relay-theme-dark .table, body.relay-theme-dark .relay-table { --bs-table-bg: transparent; --bs-table-color: var(--app-text); --bs-table-border-color: var(--app-border); --bs-table-hover-bg: rgba(120, 169, 255, 0.08); color: var(--app-text); }
body.relay-theme-dark .relay-table thead th, body.relay-theme-dark .table > :not(caption) > * > th { background: rgba(120, 169, 255, 0.08) !important; color: #c9dbff !important; border-color: var(--app-border) !important; }
body.relay-theme-dark .relay-table tbody td, body.relay-theme-dark .table > :not(caption) > * > * { border-color: rgba(125, 170, 255, 0.14) !important; }
body.relay-theme-dark .input-group-text, body.relay-theme-dark .form-control, body.relay-theme-dark .form-select, body.relay-theme-dark textarea, body.relay-theme-dark select, body.relay-theme-dark input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="range"]) { background: rgba(8, 18, 33, 0.86) !important; color: var(--app-text) !important; border: 1px solid var(--app-border) !important; box-shadow: none !important; }
body.relay-theme-dark .form-control::placeholder, body.relay-theme-dark textarea::placeholder, body.relay-theme-dark input::placeholder { color: #7f96b8 !important; }
body.relay-theme-dark .form-control:focus, body.relay-theme-dark .form-select:focus, body.relay-theme-dark textarea:focus, body.relay-theme-dark input:focus { border-color: rgba(120, 169, 255, 0.55) !important; box-shadow: 0 0 0 0.22rem rgba(120, 169, 255, 0.16) !important; }
body.relay-theme-dark .btn { border-radius: 12px; box-shadow: none; }
body.relay-theme-dark .btn-primary, body.relay-theme-dark .btn-success { background: linear-gradient(135deg, #5f95ff, #78a9ff) !important; border-color: #78a9ff !important; color: #031121 !important; font-weight: 700; }
body.relay-theme-dark .btn-primary:hover, body.relay-theme-dark .btn-success:hover { background: linear-gradient(135deg, #79abff, #99c1ff) !important; border-color: #99c1ff !important; color: #031121 !important; }
body.relay-theme-dark .btn-outline-secondary, body.relay-theme-dark .btn-outline-primary, body.relay-theme-dark .btn-light, body.relay-theme-dark .btn-white, body.relay-theme-dark .btn-secondary { background: rgba(120, 169, 255, 0.06) !important; color: var(--app-text) !important; border-color: var(--app-border) !important; }
body.relay-theme-dark .btn-outline-danger { background: rgba(220, 53, 69, 0.08) !important; }
body.relay-theme-dark .btn-outline-secondary:hover, body.relay-theme-dark .btn-outline-primary:hover, body.relay-theme-dark .btn-light:hover, body.relay-theme-dark .btn-white:hover, body.relay-theme-dark .btn-secondary:hover { background: rgba(120, 169, 255, 0.16) !important; border-color: rgba(120, 169, 255, 0.3) !important; }
body.relay-theme-dark .badge, body.relay-theme-dark .badge-custom, body.relay-theme-dark .relay-pill, body.relay-theme-dark .badge-method, body.relay-theme-dark .api-tester-pill { background: rgba(120, 169, 255, 0.12) !important; color: #dbe7ff !important; border: 1px solid rgba(120, 169, 255, 0.22) !important; }
body.relay-theme-dark .badge.bg-light, body.relay-theme-dark .bg-light, body.relay-theme-dark .bg-white, body.relay-theme-dark .bg-body, body.relay-theme-dark .bg-transparent { background: rgba(8, 18, 33, 0.84) !important; }
body.relay-theme-dark .alert { border-color: rgba(120, 169, 255, 0.18) !important; color: var(--app-text) !important; box-shadow: var(--app-shadow-soft); }
body.relay-theme-dark .alert-success { background: rgba(32, 201, 151, 0.11) !important; }
body.relay-theme-dark .alert-warning { background: rgba(255, 193, 7, 0.12) !important; }
body.relay-theme-dark .alert-danger { background: rgba(220, 53, 69, 0.12) !important; }
body.relay-theme-dark .alert-info { background: rgba(13, 202, 240, 0.12) !important; }
body.relay-theme-dark .border, body.relay-theme-dark .border-top, body.relay-theme-dark .border-bottom, body.relay-theme-dark .border-start, body.relay-theme-dark .border-end, body.relay-theme-dark hr { border-color: var(--app-border) !important; }
body.relay-theme-dark .dropdown-item, body.relay-theme-dark .dropdown-header { color: var(--app-text) !important; }
body.relay-theme-dark .dropdown-item:hover, body.relay-theme-dark .dropdown-item:focus, body.relay-theme-dark .dropdown-item.active, body.relay-theme-dark .dropdown-item:active { background: rgba(120, 169, 255, 0.16) !important; }
body.relay-theme-dark .modal-backdrop.show { opacity: .7; }
body.relay-theme-dark code, body.relay-theme-dark .code-snippet, body.relay-theme-dark .font-monospace, body.relay-theme-dark .api-tester-response, body.relay-theme-dark .devportal-code, body.relay-theme-dark .devportal-hero-code { color: #e7f1ff !important; }
body.relay-theme-dark .code-snippet, body.relay-theme-dark code { background: rgba(7, 17, 31, 0.92); border-radius: 10px; padding: 0.18rem 0.45rem; }
body.relay-theme-dark footer .text-muted { color: #86a5d1 !important; }
body.relay-theme-dark .relay-title, body.relay-theme-dark .price, body.relay-theme-dark .kpi-value, body.relay-theme-dark .setting-label, body.relay-theme-dark .devportal-method, body.relay-theme-dark .dir-indicator, body.relay-theme-dark .relay-kicker, body.relay-theme-dark .form-check-label { color: var(--app-heading) !important; }
body.relay-theme-dark .relay-lead, body.relay-theme-dark .relay-desc, body.relay-theme-dark .relay-muted, body.relay-theme-dark .kpi-label, body.relay-theme-dark .setting-desc, body.relay-theme-dark .devportal-meta-label, body.relay-theme-dark .devportal-subtle, body.relay-theme-dark .relay-breadcrumb, body.relay-theme-dark .step-label, body.relay-theme-dark .api-tester-small { color: var(--app-muted) !important; }
body.relay-theme-dark .relay-sticky-header { background: rgba(7, 17, 31, 0.88); border-bottom-color: var(--app-border); }
body.relay-theme-dark .security-notice { background: rgba(120, 169, 255, 0.10); color: #dce9ff; border-color: rgba(120, 169, 255, 0.22); }
body.relay-theme-dark .status-badge.enabled, body.relay-theme-dark .badge-active, body.relay-theme-dark .bg-success, body.relay-theme-dark .text-success-emphasis { background: rgba(45, 214, 145, 0.14) !important; color: #91f1c7 !important; border-color: rgba(45, 214, 145, 0.28) !important; }
body.relay-theme-dark .status-badge.warning, body.relay-theme-dark .bg-warning, body.relay-theme-dark .text-warning { background: rgba(255, 193, 7, 0.14) !important; color: #ffe08a !important; border-color: rgba(255, 193, 7, 0.22) !important; }
body.relay-theme-dark .status-badge.danger, body.relay-theme-dark .bg-danger, body.relay-theme-dark .text-danger, body.relay-theme-dark .text-danger-emphasis { background: rgba(255, 107, 129, 0.10) !important; color: #ffb8c5 !important; border-color: rgba(255, 107, 129, 0.18) !important; }
body.relay-theme-dark .bg-secondary, body.relay-theme-dark .text-secondary-emphasis { background: rgba(158, 179, 209, 0.12) !important; color: #cedcff !important; }
body.relay-theme-dark .status-badge, body.relay-theme-dark .badge-custom { border-radius: 999px; padding: 0.32rem 0.72rem; }
body.relay-theme-dark .devportal-hero, body.relay-theme-dark .relay-auth-card, body.relay-theme-dark .relay-hero { background: linear-gradient(180deg, rgba(14, 28, 49, 0.92), rgba(8, 18, 33, 0.94)), radial-gradient(circle at top left, rgba(120, 169, 255, 0.16), transparent 35%); }
body.relay-theme-dark .devportal-meta-item, body.relay-theme-dark .setting-row, body.relay-theme-dark .field-row, body.relay-theme-dark .custom-checkbox, body.relay-theme-dark .relay-binder .mapping-empty { background: rgba(7, 17, 31, 0.78) !important; }
body.relay-theme-dark .link-secondary, body.relay-theme-dark .text-primary, body.relay-theme-dark .text-info, body.relay-theme-dark .text-primary-emphasis { color: var(--app-primary-strong) !important; }
body.relay-theme-dark .bg-primary, body.relay-theme-dark .bg-info, body.relay-theme-dark .bg-primary-subtle { background: rgba(120, 169, 255, 0.16) !important; }
body.relay-theme-dark .page-link { background: rgba(8, 18, 33, 0.86); border-color: var(--app-border); color: var(--app-text); }
body.relay-theme-dark .page-item.active .page-link, body.relay-theme-dark .page-link:hover { background: rgba(120, 169, 255, 0.16); border-color: rgba(120, 169, 255, 0.28); color: #fff; }
body.relay-theme-dark .shadow-sm, body.relay-theme-dark .shadow, body.relay-theme-dark .shadow-lg { box-shadow: var(--app-shadow-soft) !important; }
body.relay-theme-dark .api-tester-response, body.relay-theme-dark .devportal-code, body.relay-theme-dark .devportal-hero-code { background: #06101d !important; border: 1px solid rgba(120, 169, 255, 0.16); }
body.relay-theme-dark .form-check-input { background-color: rgba(8, 18, 33, 0.92); border-color: var(--app-border); }
body.relay-theme-dark .form-check-input:checked { background-color: var(--app-primary); border-color: var(--app-primary); }
body.relay-theme-dark .spinner-border, body.relay-theme-dark .spinner-grow { color: var(--app-primary-strong); }
body.relay-theme-dark .auth-divider { border-color: rgba(120, 169, 255, 0.18) !important; }
@media (max-width: 991.98px) { body.relay-theme-dark .relay-shell, body.relay-theme-dark .container-fluid { padding-left: 0.9rem; padding-right: 0.9rem; } }

/* ---------------------------------------------------------------------
   Consolidated dark-theme overrides for audited views
   --------------------------------------------------------------------- */
body.relay-theme-dark,
body.relay-theme-dark button,
body.relay-theme-dark input,
body.relay-theme-dark select,
body.relay-theme-dark textarea { font-family: var(--relay-font-sans, "Segoe UI", Roboto, sans-serif); }
body.relay-theme-dark .relay-title,
body.relay-theme-dark .relay-section-title,
body.relay-theme-dark h1,
body.relay-theme-dark h2,
body.relay-theme-dark h3,
body.relay-theme-dark h4,
body.relay-theme-dark h5,
body.relay-theme-dark h6 { color: var(--app-heading) !important; }
body.relay-theme-dark .relay-header-compact .relay-title { color: var(--app-heading) !important; }
body.relay-theme-dark .relay-tone-subtle { background: linear-gradient(180deg, rgba(120, 169, 255, 0.08), rgba(120, 169, 255, 0.04)) !important; }
body.relay-theme-dark .relay-tone-danger { background: linear-gradient(180deg, rgba(255, 107, 129, 0.12), rgba(255, 107, 129, 0.05)) !important; }
body.relay-theme-dark .status-badge.red { background: rgba(255, 107, 129, 0.12) !important; color: #ffb8c5 !important; border-color: rgba(255, 107, 129, 0.2) !important; }
body.relay-theme-dark .status-panel-footer { background: rgba(7, 17, 31, 0.82) !important; border-color: var(--app-border) !important; }
body.relay-theme-dark .status-footer-link { color: var(--app-primary-strong) !important; }
body.relay-theme-dark .audit-jsonbox { background: #06101d !important; border-color: var(--app-border) !important; color: var(--app-text) !important; }
body.relay-theme-dark .api-tester-card { background: var(--app-surface) !important; border-color: var(--app-border) !important; box-shadow: var(--app-shadow-soft) !important; }
body.relay-theme-dark .api-tester-card-header { background: linear-gradient(180deg, rgba(120, 169, 255, 0.14), rgba(120, 169, 255, 0.05)) !important; border-color: var(--app-border) !important; }
body.relay-theme-dark .api-tester-pill { background: rgba(8, 18, 33, 0.86) !important; border-color: var(--app-border) !important; color: var(--app-text) !important; }
body.relay-theme-dark .api-tester-history-list::-webkit-scrollbar-thumb { background: rgba(120, 169, 255, 0.28) !important; }
body.relay-theme-dark .result-block,
body.relay-theme-dark .api-tester-response,
body.relay-theme-dark #respPreview { background: #06101d !important; color: #e7f1ff !important; border-color: rgba(120, 169, 255, 0.16) !important; }
body.relay-theme-dark .result-block-muted { background: rgba(10, 20, 36, 0.88) !important; color: #cbd9f4 !important; border-color: var(--app-border) !important; }
body.relay-theme-dark .kpi-item,
body.relay-theme-dark .tryit-result-card,
body.relay-theme-dark .tryit-inline-endpoint { background: rgba(8, 18, 33, 0.82) !important; border-color: var(--app-border) !important; color: var(--app-text) !important; }
body.relay-theme-dark .integration-ui-wrapper { color: var(--app-text); font-family: inherit; }
body.relay-theme-dark .integration-ui-wrapper .ui-card,
body.relay-theme-dark .integration-ui-wrapper .mp-pane,
body.relay-theme-dark .integration-ui-wrapper .mp-pane-canvas,
body.relay-theme-dark .integration-ui-wrapper .mp-studio-header,
body.relay-theme-dark .integration-ui-wrapper .mp-composer-panel,
body.relay-theme-dark .integration-ui-wrapper .mp-overview-card .card-body { background: var(--app-surface) !important; border-color: var(--app-border) !important; color: var(--app-text) !important; }
body.relay-theme-dark .integration-ui-wrapper .custom-input,
body.relay-theme-dark .integration-ui-wrapper .mp-search,
body.relay-theme-dark .integration-ui-wrapper .mp-composer-input,
body.relay-theme-dark .integration-ui-wrapper .mp-target-badge { background: rgba(8, 18, 33, 0.86) !important; color: var(--app-text) !important; border-color: var(--app-border) !important; }
body.relay-theme-dark .integration-ui-wrapper .custom-input:focus,
body.relay-theme-dark .integration-ui-wrapper .mp-search:focus,
body.relay-theme-dark .integration-ui-wrapper .mp-composer-input:focus { border-color: rgba(120, 169, 255, 0.55) !important; box-shadow: 0 0 0 0.22rem rgba(120, 169, 255, 0.16) !important; }
body.relay-theme-dark .integration-ui-wrapper .form-label,
body.relay-theme-dark .integration-ui-wrapper .mp-pane-title,
body.relay-theme-dark .integration-ui-wrapper .mp-studio-header-title,
body.relay-theme-dark .integration-ui-wrapper .mp-node,
body.relay-theme-dark .integration-ui-wrapper .mp-mapping-src,
body.relay-theme-dark .integration-ui-wrapper .mp-mapping-trg { color: var(--app-heading) !important; }
body.relay-theme-dark .integration-ui-wrapper .mp-pane-toolbar,
body.relay-theme-dark .integration-ui-wrapper .mapping-tools-header,
body.relay-theme-dark .integration-ui-wrapper .relay-card-header { background: linear-gradient(180deg, rgba(120, 169, 255, 0.12), rgba(120, 169, 255, 0.04)) !important; border-color: var(--app-border) !important; }
body.relay-theme-dark .integration-ui-wrapper .mp-overlay { background: transparent !important; }
body.relay-theme-dark .integration-ui-wrapper .mp-composer-box,
body.relay-theme-dark .integration-ui-wrapper .mp-node:hover,
body.relay-theme-dark .integration-ui-wrapper .bg-light,
body.relay-theme-dark .integration-ui-wrapper .bg-white { background: rgba(8, 18, 33, 0.78) !important; border-color: var(--app-border) !important; color: var(--app-text) !important; }
body.relay-theme-dark .integration-ui-wrapper .mp-node.selected { background: rgba(120, 169, 255, 0.16) !important; border-color: rgba(120, 169, 255, 0.3) !important; color: #fff !important; }
body.relay-theme-dark .integration-ui-wrapper .mp-line { stroke: rgba(120, 169, 255, 0.24) !important; }
body.relay-theme-dark .integration-ui-wrapper .mp-line.active { stroke: var(--app-primary-strong) !important; }