/* MetaB app deployment theme, loaded after the compiled app CSS. */
:root {
  --apiw-brand: #509ee2;
  --apiw-brand-strong: #2d86d4;
  --apiw-brand-soft: #dceefa;
  --apiw-brand-wash: #f4f9fe;
  --apiw-text: #303b45;
  --apiw-text-soft: #606b75;
  --apiw-text-muted: #7d8790;
  --apiw-page: #f9f9fa;
  --apiw-surface: #ffffff;
  --apiw-border: #dcdfe3;
  --apiw-border-soft: #e7eaee;
  --apiw-band: #f3f5f7;
  --apiw-admin: #ffffff;
  --apiw-admin-active: #e8f3fd;
  --apiw-admin-hover: rgba(80, 158, 226, 0.12);
  --apiw-admin-border: #e3e8ef;
  --apiw-success: #7caf43;
  --apiw-danger: #e45f5f;
  --apiw-purple: #6363c5;
  --apiw-shadow: 0 1px 2px rgba(23, 32, 51, 0.06);
  --apiw-shadow-raised: 0 6px 18px rgba(7, 23, 34, 0.08);
  --ai-primary-50: #edf6ff;
  --ai-primary-100: #dceeff;
  --ai-primary-200: #bddfff;
  --ai-primary-300: #91c9f5;
  --ai-primary-400: #69b4ec;
  --ai-primary-500: var(--apiw-brand);
  --ai-primary-600: var(--apiw-brand-strong);
  --ai-primary-700: #1c6fb6;
  --ai-primary-800: #195b91;
  --ai-primary-900: #194d78;
  --ai-success-500: var(--apiw-success);
  --ai-success-600: #70a83d;
  --ai-gradient-bg: linear-gradient(135deg, #ffffff 0%, var(--apiw-brand-soft) 100%);
  --ai-gradient-text: none;
  --ai-glow: 0 0 0 3px rgba(79, 159, 229, 0.18);
  --ai-card-hover-shadow: var(--apiw-shadow-raised);
  --brand-navy: var(--apiw-text);
  --brand-navy-2: #344154;
  --brand-gold: var(--apiw-brand);
  --surface: var(--apiw-surface);
  --border: var(--apiw-border);
  --muted: var(--apiw-text-soft);
  --nav-bg: var(--apiw-surface);
  --nav-border: var(--apiw-border);
  --nav-text: var(--apiw-text);
  --bg-primary: var(--apiw-surface);
  --bg-secondary: var(--apiw-page);
  --bg-tertiary: var(--apiw-band);
  --text-primary: var(--apiw-text);
  --text-secondary: var(--apiw-text-soft);
  --text-tertiary: var(--apiw-text-muted);
  --text-inverse: #ffffff;
  --chart-bg: var(--apiw-surface);
  --chart-grid: var(--apiw-border);
  --chart-axis: var(--apiw-text-soft);
  --color-primary: var(--apiw-brand);
  --color-primary-contrast: #ffffff;
  --tenant-gradient-start: var(--apiw-brand);
  --tenant-gradient-end: var(--apiw-brand-strong);
  --tenant-admin-primary: var(--apiw-brand);
  --tenant-admin-primary-strong: var(--apiw-brand-strong);
  --border-primary: var(--apiw-border);
  --shadow-sm: var(--apiw-shadow);
  --shadow-md: var(--apiw-shadow-raised);
}
:root[data-theme="dark"] {
  --apiw-brand: #69b4ec;
  --apiw-brand-strong: #91c9f5;
  --apiw-brand-soft: #153149;
  --apiw-brand-wash: #101b28;
  --apiw-text: #eef5fb;
  --apiw-text-soft: #b8c5d6;
  --apiw-text-muted: #8ea0b5;
  --apiw-page: #0f1722;
  --apiw-surface: #151e2b;
  --apiw-border: #2b3b50;
  --apiw-band: #111c29;
  --apiw-admin: var(--apiw-surface);
  --apiw-admin-active: #153149;
  --apiw-admin-hover: rgba(105, 180, 236, 0.12);
  --apiw-admin-border: var(--apiw-border);
  --apiw-shadow: 0 1px 2px rgba(0, 0, 0, 0.36);
  --apiw-shadow-raised: 0 16px 38px rgba(0, 0, 0, 0.34);
  --brand-navy: var(--apiw-text);
  --brand-navy-2: var(--apiw-text-soft);
  --surface: var(--apiw-surface);
  --border: var(--apiw-border);
  --muted: var(--apiw-text-soft);
  --nav-bg: var(--apiw-surface);
  --nav-border: var(--apiw-border);
  --nav-text: var(--apiw-text);
  --bg-primary: var(--apiw-surface);
  --bg-secondary: var(--apiw-page);
  --bg-tertiary: var(--apiw-band);
  --text-primary: var(--apiw-text);
  --text-secondary: var(--apiw-text-soft);
  --text-tertiary: var(--apiw-text-muted);
  --color-primary: var(--apiw-brand);
  --color-primary-contrast: #08111c;
  --tenant-gradient-start: #1a5c89;
  --tenant-gradient-end: #102b43;
  --tenant-admin-primary: var(--apiw-brand);
  --tenant-admin-primary-strong: var(--apiw-brand-strong);
  --border-primary: var(--apiw-border);
  --shadow-sm: var(--apiw-shadow);
  --shadow-md: var(--apiw-shadow-raised);
}
body {
  background: var(--apiw-page);
  color: var(--apiw-text);
  font-family: Lato, Arial, sans-serif;
}
a {
  color: var(--apiw-brand-strong);
}
.button,
.admin-page .button,
.admin-ds-primary-button,
.auth-page-login .auth-login-submit,
.auth-page-forgot .auth-login-submit,
.auth-page-invitation .auth-card .button:not(.button-secondary) {
  border-color: var(--apiw-brand);
  border-radius: 6px;
  background: var(--apiw-brand);
  box-shadow: none;
  color: #ffffff;
}
.button:hover:not(:disabled),
.admin-page .button:hover:not(:disabled),
.admin-ds-primary-button:hover,
.auth-page-login .auth-login-submit:hover:not(:disabled),
.auth-page-forgot .auth-login-submit:hover:not(:disabled),
.auth-page-invitation .auth-card .button:not(.button-secondary):hover:not(:disabled) {
  background: var(--apiw-brand-strong);
  box-shadow: 0 3px 8px rgba(45, 134, 212, 0.22);
  transform: none;
}
.button-secondary,
.admin-secondary-button,
.admin-ds-secondary-button,
.admin-ds-secondary-link {
  border-color: var(--apiw-border);
  border-radius: 6px;
  background: var(--apiw-surface);
  color: var(--apiw-text);
}
.button-secondary:hover:not(:disabled),
.admin-secondary-button:hover:not(:disabled),
.admin-ds-secondary-button:hover,
.admin-ds-secondary-link:hover {
  border-color: var(--apiw-brand);
  background: var(--apiw-brand-soft);
  color: var(--apiw-text);
}
input:focus,
select:focus,
textarea:focus,
.admin-form input:focus,
.admin-form select:focus,
.admin-form textarea:focus,
.admin-ds-search-field input:focus,
.admin-ds-source-filter select:focus,
.api-docs-toolbar select:focus {
  border-color: var(--apiw-brand);
  box-shadow: 0 0 0 3px rgba(79, 159, 229, 0.18);
  outline: none;
}
.auth-page,
.auth-page-login,
.auth-page-forgot,
.auth-page-invitation,
.auth-page-mfa,
.auth-page-setup-flow {
  background:
    linear-gradient(135deg, rgba(79, 159, 229, 0.98), rgba(45, 111, 159, 0.96)),
    var(--apiw-brand);
}
.auth-page-platform-brand {
  background: var(--apiw-page);
}
.auth-card,
.auth-page-login .auth-card-login,
.auth-page-forgot .auth-card-forgot,
.auth-page-invitation .auth-card-invitation {
  border: 1px solid rgba(255, 255, 255, 0.7);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.97);
  box-shadow: var(--apiw-shadow-raised);
}
.auth-card-setup {
  border-color: var(--apiw-border);
  background: var(--apiw-surface);
}
.auth-brand-mark,
.auth-login-product-mark,
.brand-mark {
  border-radius: 8px;
  background: var(--apiw-brand);
  color: #ffffff;
}
.auth-login-brand-header {
  border-bottom-color: var(--apiw-border);
}
.auth-login-brand h1 {
  background: none;
  color: var(--apiw-text);
  -webkit-text-fill-color: currentColor;
}
.auth-login-brand p,
.auth-card-header p,
.auth-inline-status {
  color: var(--apiw-text-soft);
}
.auth-page-login .auth-form input,
.auth-page-forgot .auth-form input,
.auth-page-invitation .auth-form input,
.auth-card-setup .auth-form input,
.auth-card-setup .auth-form textarea,
.auth-card-setup .auth-form select {
  border-color: var(--apiw-border);
  background: var(--apiw-brand-wash);
  color: var(--apiw-text);
}
.product-shell,
.home-shell,
.admin-layout,
.home-main {
  background: var(--apiw-page);
  color: var(--apiw-text);
}
.customer-sidebar {
  border-right: 1px solid var(--apiw-border);
  background: var(--apiw-surface);
  box-shadow: 1px 0 0 rgba(23, 32, 51, 0.02);
  color: var(--apiw-text);
  font-family: Lato, Arial, sans-serif;
}
.brand-block,
.admin-brand,
.brand-title {
  color: var(--apiw-text);
}
.brand-subtitle,
.menu-title,
.nav-section-title,
.user-role {
  color: var(--apiw-text-muted);
}
.brand-mark {
  border-radius: 6px;
  background: var(--apiw-brand);
  color: #ffffff;
}
.menu-item {
  border-radius: 4px;
  color: var(--apiw-text-soft);
  font-weight: 700;
}
.menu-item:hover {
  border-color: transparent;
  background: var(--apiw-brand-soft);
  color: var(--apiw-text);
}
.menu-item.active,
.menu-item[aria-current="page"] {
  border-color: transparent;
  background: var(--apiw-brand-soft);
  color: var(--apiw-brand-strong);
  font-weight: 700;
}
.sidebar-footer .profile-button,
.customer-sidebar-footer .profile-button {
  border-color: var(--apiw-border);
  background: #ffffff;
  color: var(--apiw-text);
}
.admin-sidebar {
  background: var(--apiw-admin);
  border-right: 1px solid var(--apiw-admin-border);
  box-shadow: 1px 0 0 rgba(23, 32, 51, 0.02);
  color: var(--apiw-text);
  font-family: Lato, Arial, sans-serif;
  scrollbar-color: rgba(80, 158, 226, 0.36) rgba(80, 158, 226, 0.08);
}
.admin-header,
.admin-footer {
  border-color: var(--apiw-admin-border);
}
.admin-brand,
.admin-title,
.admin-sidebar .brand-title {
  color: var(--apiw-text);
}
.admin-icon,
.dashboard-btn,
.mobile-dashboard-btn {
  border-radius: 6px;
  background: var(--apiw-brand-soft);
  color: var(--apiw-brand-strong);
}
.admin-links .nav-section-title {
  color: var(--apiw-text-muted);
  letter-spacing: 0;
}
.admin-nav-link,
.admin-sidebar .nav-link {
  border-radius: 4px;
  color: var(--apiw-text-soft);
  font-weight: 600;
}
.admin-nav-link:hover,
.admin-sidebar .nav-link:hover {
  background: var(--apiw-admin-hover);
  color: var(--apiw-text);
}
.admin-nav-link[aria-current="page"],
.admin-nav-link.router-link-active,
.admin-sidebar .nav-link[aria-current="page"],
.admin-sidebar .nav-link.router-link-active {
  background: var(--apiw-admin-active);
  color: var(--apiw-brand-strong);
}
.admin-content,
.workspace.admin-content {
  background: var(--apiw-page);
}
.logout-btn-admin {
  border: 1px solid var(--apiw-admin-border);
  border-radius: 6px;
  background: var(--apiw-surface);
  color: var(--apiw-text);
}
.logout-btn-admin:hover {
  border-color: var(--apiw-brand);
  background: var(--apiw-brand-soft);
  color: var(--apiw-brand-strong);
}
.admin-page {
  --admin-primary: var(--apiw-brand);
  --admin-primary-strong: var(--apiw-brand-strong);
  --admin-text: var(--apiw-text);
  --admin-text-soft: var(--apiw-text-soft);
  --admin-panel: var(--apiw-surface);
  --admin-border: var(--apiw-border);
  --admin-band: var(--apiw-band);
  --admin-shadow: var(--apiw-shadow);
}
.panel,
.admin-page .panel,
.admin-toolbar,
.admin-form-panel,
.admin-table-panel,
.admin-summary-panel,
.admin-ds-dictionary-filters,
.admin-ds-empty-state,
.admin-ds-loading-state,
.admin-ds-table-container,
.admin-ds-connection-sidebar,
.admin-ds-connection-panel,
.admin-ds-connection-card,
.api-guide-hero,
.api-guide-quick-start,
.api-guide-feature,
.api-guide-examples,
.api-docs-hero,
.api-docs-toolbar,
.api-docs-summary,
.api-docs-redoc-shell,
.api-docs-fallback,
.api-docs-empty,
.api-docs-loading {
  border-color: var(--apiw-border);
  border-radius: 6px;
  background: var(--apiw-surface);
  box-shadow: var(--apiw-shadow);
}
.admin-page thead th,
.admin-page tbody tr:hover,
.admin-status-card,
.api-guide-feature > header,
.api-guide-example-grid article,
.api-guide-where,
.api-docs-summary,
.api-docs-summary > div {
  background: var(--apiw-band);
}
.admin-page-header .eyebrow,
.eyebrow,
.api-guide-kicker,
.api-docs-kicker,
.admin-ds-info-button {
  color: var(--apiw-brand-strong);
}
.admin-ds-info-button {
  border-color: color-mix(in srgb, var(--apiw-brand) 36%, var(--apiw-border));
  background: var(--apiw-brand-soft);
}
.admin-page table,
.admin-ds-dictionary-table {
  background: var(--apiw-surface);
}
.admin-page th,
.admin-page td,
.admin-ds-dictionary-table td,
.admin-ds-dictionary-table th[scope="row"],
.api-docs-redoc-shell > header,
.api-docs-fallback > header,
.api-docs-operation {
  border-color: var(--apiw-border);
}
.admin-ds-status-pill.is-ready,
.admin-ds-source-badge,
.admin-ds-count-pill {
  background: var(--apiw-brand-soft);
  color: var(--apiw-brand-strong);
}
.admin-danger-button,
.api-docs-method--delete {
  background: var(--apiw-danger);
  color: #ffffff;
}
.api-docs-method--get {
  background: var(--apiw-success);
  color: #ffffff;
}
.api-docs-method--post {
  background: var(--apiw-brand);
  color: #ffffff;
}
.api-docs-method--put,
.api-docs-method--patch {
  background: var(--apiw-purple);
  color: #ffffff;
}
.api-docs-toolbar label,
.api-docs-toolbar-status,
.api-docs-hero p,
.api-docs-fallback p,
.api-docs-empty p,
.api-guide-hero p,
.api-guide-quick-start p,
.api-guide-feature p,
.api-guide-examples p,
.api-guide-where span,
.api-guide-feature li,
.api-guide-quick-start li,
.admin-ds-page-subtitle {
  color: var(--apiw-text-soft);
}
.api-docs-toolbar select,
.api-docs-summary > div,
.api-docs-operation code,
.api-docs-operation h3,
.api-guide-example-grid pre {
  border-color: var(--apiw-border);
}
.api-docs-summary strong,
.api-docs-hero h1,
.api-docs-redoc-shell h2,
.api-docs-fallback h2,
.api-docs-empty h2,
.api-guide-hero h1,
.api-guide-quick-start h2,
.api-guide-feature h2,
.api-guide-examples h2,
.api-guide-example-grid h3,
.admin-ds-page-title {
  color: var(--apiw-text);
}
.api-docs-operation summary,
.api-docs-contract {
  color: var(--apiw-brand-strong);
}
.api-docs-operation pre,
.api-guide-example-grid pre {
  background: #101827;
  color: #e8f1fb;
}

/* Keep the theme stable in source/Vite mode, where component CSS loads after static links. */
html body,
html body .product-shell,
html body .home-shell,
html body .admin-layout,
html body .home-main,
html body .workspace.admin-content {
  background: var(--apiw-page) !important;
  color: var(--apiw-text) !important;
  font-family: Lato, Arial, sans-serif !important;
}

html body .customer-sidebar {
  border-right: 1px solid var(--apiw-border) !important;
  background: var(--apiw-surface) !important;
  box-shadow: 1px 0 0 rgba(23, 32, 51, 0.02) !important;
  color: var(--apiw-text) !important;
}

html body .brand-block,
html body .brand-title {
  color: var(--apiw-text) !important;
}

html body .brand-title {
  color: transparent !important;
  font-size: 0 !important;
}

html body .brand-title::after {
  content: "MetaB" !important;
  color: var(--apiw-text) !important;
  font-size: 0.95rem !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
}

html body .brand-subtitle,
html body .menu-title,
html body .nav-section-title,
html body .user-role {
  color: var(--apiw-text-muted) !important;
}

html body .brand-mark {
  border-radius: 6px !important;
  background: var(--apiw-brand) !important;
  color: #ffffff !important;
}

html body .menu-item {
  border-radius: 4px !important;
  color: var(--apiw-text-soft) !important;
  font-weight: 700 !important;
}

html body .menu-item:hover,
html body .menu-item.active,
html body .menu-item[aria-current="page"] {
  border-color: transparent !important;
  background: var(--apiw-brand-soft) !important;
  color: var(--apiw-brand-strong) !important;
}

html body .admin-sidebar {
  background: var(--apiw-admin) !important;
  border-right: 1px solid var(--apiw-admin-border) !important;
  box-shadow: 1px 0 0 rgba(23, 32, 51, 0.02) !important;
  color: var(--apiw-text) !important;
}

html body .admin-header,
html body .admin-footer {
  border-color: var(--apiw-admin-border) !important;
}

html body .admin-brand,
html body .admin-title,
html body .admin-sidebar .brand-title {
  color: var(--apiw-text) !important;
}

html body .admin-icon,
html body .dashboard-btn,
html body .mobile-dashboard-btn {
  border-radius: 6px !important;
  background: var(--apiw-brand-soft) !important;
  color: var(--apiw-brand-strong) !important;
}

html body .admin-links .nav-section-title {
  color: var(--apiw-text-muted) !important;
}

html body .admin-nav-link,
html body .admin-sidebar .nav-link {
  border-radius: 4px !important;
  color: var(--apiw-text-soft) !important;
  font-weight: 600 !important;
}

html body .admin-nav-link:hover,
html body .admin-sidebar .nav-link:hover {
  background: var(--apiw-admin-hover) !important;
  color: var(--apiw-text) !important;
}

html body .admin-nav-link[aria-current="page"],
html body .admin-nav-link.router-link-active,
html body .admin-sidebar .nav-link[aria-current="page"],
html body .admin-sidebar .nav-link.router-link-active {
  background: var(--apiw-admin-active) !important;
  color: var(--apiw-brand-strong) !important;
}

html body .panel,
html body .admin-page .panel,
html body .admin-toolbar,
html body .admin-form-panel,
html body .admin-table-panel,
html body .admin-summary-panel,
html body .admin-ds-table-container,
html body .api-guide-hero,
html body .api-guide-quick-start,
html body .api-guide-feature,
html body .api-guide-examples,
html body .api-docs-hero,
html body .api-docs-toolbar,
html body .api-docs-summary,
html body .api-docs-redoc-shell {
  border-color: var(--apiw-border) !important;
  border-radius: 6px !important;
  background: var(--apiw-surface) !important;
  box-shadow: var(--apiw-shadow) !important;
}

html body .button,
html body .admin-page .button,
html body .admin-ds-primary-button {
  border-color: var(--apiw-brand) !important;
  border-radius: 6px !important;
  background: var(--apiw-brand) !important;
  box-shadow: none !important;
  color: #ffffff !important;
}

/* Authenticated inner-page treatment. These rules intentionally flatten the
   product UI toward Metabase's white shell, light-gray page, blue accent style. */
html body .home-content,
html body .standalone-content,
html body .sql-editor-layout,
html body .admin-page,
html body .admin-ds-management-page,
html body .admin-ds-dictionary-page {
  background: var(--apiw-page) !important;
  color: var(--apiw-text) !important;
}

html body .home-content:not(.home-content--flush),
html body .standalone-content:not(.standalone-content--full),
html body .workspace.admin-content {
  padding: 24px !important;
}

html body .page-header,
html body .admin-base-product-header,
html body .admin-ds-page-header,
html body .sql-header {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--apiw-text) !important;
}

html body .page-header h1,
html body .admin-page-title,
html body .admin-base-product-header h1,
html body .admin-ds-page-title,
html body .sql-editor-title-group h1 {
  color: var(--apiw-text) !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
}

html body .page-header p,
html body .admin-page-subtitle,
html body .admin-base-product-header p,
html body .admin-ds-page-subtitle,
html body .sql-editor-status {
  color: var(--apiw-text-soft) !important;
}

html body .sql-editor-panel,
html body .sql-editor-query-panel,
html body .sql-editor-results-panel,
html body .sql-editor-schema-panel,
html body .sql-editor-right-content,
html body .sql-editor-side-section,
html body .sql-editor-save-panel,
html body .sql-editor-empty-state,
html body .sql-editor-pivot-sidebar,
html body .sql-editor-pivot-summary,
html body .admin-base-product-banner,
html body .admin-base-product-metric,
html body .admin-base-product-filterbar,
html body .admin-parity-card,
html body .admin-parity-workspace,
html body .admin-status-card,
html body .admin-ds-dictionary-filters,
html body .admin-ds-empty-state,
html body .admin-ds-loading-state,
html body .admin-ds-connection-sidebar,
html body .admin-ds-connection-panel,
html body .admin-ds-connection-card,
html body .admin-custom-sources .data-sources-container,
html body .admin-custom-sources .data-sources-table-container {
  border: 1px solid var(--apiw-border) !important;
  border-radius: 8px !important;
  background: var(--apiw-surface) !important;
  box-shadow: var(--apiw-shadow) !important;
  color: var(--apiw-text) !important;
}

html body .metab-home-action-card:hover,
html body .recent-card:hover,
html body .sql-editor-suggestion:hover:not(:disabled),
html body .sql-editor-quick-action:hover:not(:disabled),
html body .admin-ds-connection-card:hover {
  border-color: var(--apiw-brand) !important;
  box-shadow: 0 2px 8px rgba(43, 53, 68, 0.08) !important;
  transform: none !important;
}

html body .sql-editor-right-tabs button[aria-selected="true"],
html body .sql-editor-tab.is-active,
html body .sql-editor-status-dot,
html body .admin-base-product-banner-icon,
html body .admin-ds-source-badge,
html body .admin-ds-count-pill,
html body .admin-ds-status-pill,
html body .admin-ds-table-icon {
  background: var(--apiw-brand-soft) !important;
  color: var(--apiw-brand-strong) !important;
}

html body .sql-editor-primary-button,
html body .sql-editor-run-button,
html body .sql-editor-ai-send-button,
html body .shell-dialog-primary,
html body .admin-primary-button {
  border-color: var(--apiw-brand) !important;
  border-radius: 6px !important;
  background: var(--apiw-brand) !important;
  box-shadow: none !important;
  color: #ffffff !important;
}

html body .sql-editor-secondary-button,
html body .sql-editor-icon-button,
html body .sql-editor-inline-button,
html body .shell-dialog-secondary,
html body .admin-secondary-button,
html body .admin-ds-secondary-button,
html body .admin-ds-secondary-link {
  border-color: var(--apiw-border) !important;
  border-radius: 6px !important;
  background: var(--apiw-surface) !important;
  box-shadow: none !important;
  color: var(--apiw-text) !important;
}

html body .sql-editor-secondary-button:hover:not(:disabled),
html body .sql-editor-icon-button:hover:not(:disabled),
html body .sql-editor-inline-button:hover:not(:disabled),
html body .shell-dialog-secondary:hover:not(:disabled),
html body .admin-secondary-button:hover:not(:disabled),
html body .admin-ds-secondary-button:hover:not(:disabled),
html body .admin-ds-secondary-link:hover {
  border-color: var(--apiw-brand) !important;
  background: var(--apiw-brand-soft) !important;
  color: var(--apiw-brand-strong) !important;
}

html body input,
html body select,
html body textarea,
html body .sql-editor-field input,
html body .sql-editor-field select,
html body .sql-editor-field textarea,
html body .sql-editor-search-field input,
html body .admin-base-product-filterbar input,
html body .admin-ds-source-filter select,
html body .admin-ds-search-field input {
  border-color: var(--apiw-border) !important;
  border-radius: 6px !important;
  background: var(--apiw-surface) !important;
  color: var(--apiw-text) !important;
  box-shadow: none !important;
}

html body input::placeholder,
html body textarea::placeholder {
  color: var(--apiw-text-muted) !important;
}

html body input:focus,
html body select:focus,
html body textarea:focus {
  border-color: var(--apiw-brand) !important;
  box-shadow: 0 0 0 3px rgba(80, 158, 226, 0.18) !important;
  outline: none !important;
}

html body table,
html body .admin-page table,
html body .admin-ds-dictionary-table,
html body .admin-custom-sources .data-sources-table,
html body .sql-editor-result-table,
html body .sql-editor-columns-table,
html body .sql-editor-pivot-table {
  border-color: var(--apiw-border) !important;
  background: var(--apiw-surface) !important;
  color: var(--apiw-text) !important;
}

html body thead,
html body .admin-page thead,
html body .admin-ds-dictionary-table thead,
html body .admin-custom-sources .data-sources-table th,
html body .sql-editor-result-table th,
html body .sql-editor-columns-table th,
html body .sql-editor-pivot-table th {
  background: var(--apiw-band) !important;
  color: var(--apiw-text-soft) !important;
  font-weight: 700 !important;
}

html body th,
html body td,
html body .admin-page th,
html body .admin-page td,
html body .admin-ds-dictionary-table th,
html body .admin-ds-dictionary-table td,
html body .sql-editor-result-table th,
html body .sql-editor-result-table td,
html body .sql-editor-columns-table th,
html body .sql-editor-columns-table td {
  border-color: var(--apiw-border-soft) !important;
}

html body tbody tr:hover,
html body .admin-page tbody tr:hover,
html body .admin-ds-dictionary-table tbody tr:hover,
html body .sql-editor-result-table tbody tr:hover {
  background: var(--apiw-brand-wash) !important;
}

html body .sql-editor-pivot-sidebar-header,
html body .sql-editor-ai-header,
html body .modal-header,
html body .admin-modal-header {
  border-color: var(--apiw-border) !important;
  background: var(--apiw-surface) !important;
  color: var(--apiw-text) !important;
}

html body .admin-base-product-metric strong,
html body .sql-editor-pivot-summary strong {
  color: var(--apiw-text) !important;
}

html body .sql-editor-table-item p,
html body .sql-editor-table-item small,
html body .admin-ds-source-badge small,
html body .admin-ds-type-count,
html body .admin-ds-panel-state-note {
  color: var(--apiw-text-soft) !important;
}

html body .modal-panel,
html body .shell-dashboard-dialog,
html body .commercial-dialog,
html body .admin-ds-bulk-dialog,
html body .sql-editor-cell-viewer-box {
  border: 1px solid var(--apiw-border) !important;
  border-radius: 8px !important;
  background: var(--apiw-surface) !important;
  box-shadow: var(--apiw-shadow-raised) !important;
  color: var(--apiw-text) !important;
}

html body .modal-backdrop,
html body .shell-dashboard-dialog-backdrop,
html body .commercial-dialog-backdrop {
  background: rgba(28, 39, 53, 0.36) !important;
}

/* Dashboard sidebar in the MetaB profile. */
html body .dashboard-list-panel.dashboard-sidebar-menu {
  border-color: var(--apiw-border-soft) !important;
  background: var(--apiw-surface) !important;
  box-shadow: none !important;
  color: var(--apiw-text) !important;
  font-family: Lato, Arial, sans-serif !important;
}

html body .dashboard-sidebars--view .dashboard-list-panel.dashboard-sidebar-menu {
  flex-basis: 280px !important;
  width: 280px !important;
  border-right: 1px solid var(--apiw-border-soft) !important;
  padding: 14px 0 12px !important;
}

html body .dashboard-sidebar-header,
html body .dashboard-sidebar-footer {
  border-color: var(--apiw-border-soft) !important;
}

html body .dashboard-sidebar-header {
  min-height: 48px !important;
  padding: 4px 18px 12px !important;
  border-bottom: 0 !important;
}

html body .dashboard-brand {
  gap: 10px !important;
}

html body .dashboard-brand-title {
  color: var(--apiw-text) !important;
  font-weight: 700 !important;
  font-size: 1rem !important;
  line-height: 1.15 !important;
}

html body .dashboard-brand-subtitle {
  color: var(--apiw-text-muted) !important;
  font-size: 0.72rem !important;
  line-height: 1.2 !important;
}

html body .dashboard-brand-logo {
  width: 32px !important;
  height: 32px !important;
  border: 1px solid var(--apiw-border-soft) !important;
  border-radius: 6px !important;
  background: var(--apiw-surface) !important;
  padding: 3px !important;
}

html body .dashboard-menu-search {
  border-color: var(--apiw-border) !important;
  border-radius: 6px !important;
  background: var(--apiw-surface) !important;
  color: var(--apiw-text-soft) !important;
  min-height: 36px !important;
  margin: 0 14px 10px !important;
  padding: 0 10px !important;
  box-shadow: inset 0 1px 0 rgba(7, 23, 34, 0.02) !important;
}

html body .dashboard-menu-search svg {
  color: var(--apiw-text-muted) !important;
  stroke: currentColor !important;
  width: 15px !important;
  height: 15px !important;
}

html body .dashboard-menu-search input {
  color: var(--apiw-text) !important;
  font-size: 0.82rem !important;
}

html body .dashboard-menu-search input::placeholder {
  color: var(--apiw-text-muted) !important;
}

html body .dashboard-sections {
  gap: 2px !important;
  padding: 4px 8px 10px !important;
  scrollbar-color: var(--apiw-border) transparent !important;
}

html body .dashboard-sidebar-menu .dashboard-section {
  margin: 0 !important;
}

html body .dashboard-sidebar-menu .section-header {
  min-height: 32px !important;
  border-radius: 6px !important;
  color: var(--apiw-text-soft) !important;
  font-size: 0.8rem !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  padding: 7px 9px !important;
  text-transform: none !important;
}

html body .dashboard-sidebar-menu .section-header:hover {
  background: var(--apiw-brand-wash) !important;
  color: var(--apiw-brand-strong) !important;
}

html body .dashboard-sidebar-menu .section-toggle {
  width: 14px !important;
  height: 14px !important;
  color: var(--apiw-text-muted) !important;
}

html body .dashboard-list {
  padding: 1px 0 5px !important;
}

html body .dashboard-list-row {
  padding: 0 !important;
}

html body .dashboard-list-item {
  min-height: 32px !important;
  gap: 8px !important;
  border-radius: 6px !important;
  color: var(--apiw-text-soft) !important;
  font-size: 0.82rem !important;
  font-weight: 500 !important;
  margin: 1px 0 !important;
  padding: 7px 9px 7px 18px !important;
}

html body .dashboard-list-item:hover {
  background: var(--apiw-brand-wash) !important;
  color: var(--apiw-brand-strong) !important;
}

html body .dashboard-list-item[aria-current="page"],
html body .dashboard-list-item.router-link-active {
  background: var(--apiw-admin-active) !important;
  box-shadow: none !important;
  color: var(--apiw-brand-strong) !important;
  font-weight: 700 !important;
}

html body .dashboard-sidebar-menu .dashboard-name {
  color: inherit !important;
  font-weight: inherit !important;
  line-height: 1.25 !important;
}

html body .dashboard-item-content {
  min-width: 0 !important;
  gap: 7px !important;
}

html body .dashboard-indicator,
html body .dashboard-indicator.global,
html body .dashboard-indicator.tenant {
  width: 6px !important;
  height: 6px !important;
  background: var(--apiw-border) !important;
}

html body .dashboard-list-item:hover .dashboard-indicator,
html body .dashboard-list-item[aria-current="page"] .dashboard-indicator,
html body .dashboard-list-item.router-link-active .dashboard-indicator {
  background: var(--apiw-brand) !important;
}

html body .dashboard-sidebar-menu .badge {
  border-color: var(--apiw-border-soft) !important;
  border-radius: 4px !important;
  background: transparent !important;
  color: var(--apiw-text-muted) !important;
  font-size: 0.58rem !important;
  font-weight: 700 !important;
  padding: 1px 4px !important;
}

html body .dashboard-empty-menu {
  color: var(--apiw-text-muted) !important;
  font-size: 0.82rem !important;
  font-weight: 500 !important;
  padding: 12px 10px !important;
}

html body .dashboard-sidebar-footer {
  gap: 10px !important;
  padding: 12px 14px 0 !important;
}

html body .dashboard-footer-actions {
  gap: 8px !important;
}

html body .dashboard-add-btn,
html body .dashboard-ai-btn,
html body .dashboard-home-btn {
  border-color: var(--apiw-border) !important;
  border-radius: 6px !important;
  background: var(--apiw-surface) !important;
  color: var(--apiw-text) !important;
  box-shadow: none !important;
  min-height: 34px !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
}

html body .dashboard-add-btn:hover,
html body .dashboard-ai-btn:hover,
html body .dashboard-home-btn:hover {
  border-color: var(--apiw-brand) !important;
  background: var(--apiw-brand-soft) !important;
  color: var(--apiw-brand-strong) !important;
}

html body .dashboard-add-btn {
  border-color: var(--apiw-border) !important;
  background: var(--apiw-surface) !important;
  color: var(--apiw-text) !important;
  padding: 0 12px !important;
}

html body .dashboard-add-btn:hover {
  background: var(--apiw-brand-wash) !important;
  border-color: var(--apiw-brand) !important;
  color: var(--apiw-brand-strong) !important;
}

html body .dashboard-home-primary {
  border-color: var(--apiw-brand) !important;
  background: var(--apiw-brand) !important;
  box-shadow: none !important;
  color: #ffffff !important;
}

html body .dashboard-home-primary:hover,
html body .dashboard-home-primary:focus-visible {
  border-color: var(--apiw-brand-strong) !important;
  background: var(--apiw-brand-strong) !important;
  color: #ffffff !important;
}

html body .dashboard-sidebar-profile .shared-profile-dropdown--dark .profile-button {
  border-color: var(--apiw-border) !important;
  border-radius: 6px !important;
  background: var(--apiw-surface) !important;
  color: var(--apiw-text) !important;
  min-height: 40px !important;
  padding: 6px 8px !important;
}

html body .dashboard-sidebar-profile .shared-profile-dropdown--dark .profile-button:hover,
html body .dashboard-sidebar-profile .shared-profile-dropdown--dark .profile-button:focus-visible {
  border-color: var(--apiw-brand) !important;
  background: var(--apiw-brand-wash) !important;
  color: var(--apiw-brand-strong) !important;
}

html body .dashboard-sidebar-profile .shared-profile-dropdown--dark .profile-name,
html body .dashboard-sidebar-profile .shared-profile-dropdown--dark .profile-caret {
  color: var(--apiw-text) !important;
}

html body .dashboard-sidebar-profile .shared-profile-dropdown--dark .profile-role {
  color: var(--apiw-text-muted) !important;
}

html body .dashboard-sidebar-profile .shared-profile-dropdown--dark .profile-avatar {
  background: var(--apiw-brand-soft) !important;
  color: var(--apiw-brand-strong) !important;
}

html body .shared-profile-dropdown--light .profile-button,
html body .floating-profile-menu .profile-button,
html body .app-navbar-actions .profile-button {
  border-color: var(--apiw-border) !important;
  background: var(--apiw-surface) !important;
  color: var(--apiw-text) !important;
  box-shadow: var(--apiw-shadow) !important;
}

html body .shared-profile-dropdown--light .profile-name,
html body .floating-profile-menu .profile-name,
html body .app-navbar-actions .profile-name,
html body .shared-profile-dropdown--light .profile-caret,
html body .floating-profile-menu .profile-caret,
html body .app-navbar-actions .profile-caret {
  color: var(--apiw-text) !important;
}

html body .shared-profile-dropdown--light .profile-role,
html body .floating-profile-menu .profile-role,
html body .app-navbar-actions .profile-role {
  color: var(--apiw-text-muted) !important;
}

html body .shared-profile-dropdown--light .profile-avatar,
html body .floating-profile-menu .profile-avatar,
html body .app-navbar-actions .profile-avatar {
  background: var(--apiw-brand-soft) !important;
  color: var(--apiw-brand-strong) !important;
}

html body .shared-profile-dropdown--light .profile-trigger-icon,
html body .floating-profile-menu .profile-trigger-icon,
html body .app-navbar-actions .profile-trigger-icon {
  color: var(--apiw-brand-strong) !important;
  fill: currentColor !important;
}

html body .shared-profile-dropdown--light .profile-menu,
html body .floating-profile-menu .profile-menu,
html body .app-navbar-actions .profile-menu {
  border-color: var(--apiw-border) !important;
  background: var(--apiw-surface) !important;
  box-shadow: var(--apiw-shadow-raised) !important;
  color: var(--apiw-text) !important;
}

html body .shared-profile-dropdown--light .profile-menu-item,
html body .floating-profile-menu .profile-menu-item,
html body .app-navbar-actions .profile-menu-item {
  color: var(--apiw-text) !important;
}

html body .shared-profile-dropdown--light .profile-menu-item:hover,
html body .floating-profile-menu .profile-menu-item:hover,
html body .app-navbar-actions .profile-menu-item:hover {
  background: var(--apiw-brand-wash) !important;
  color: var(--apiw-brand-strong) !important;
}

:root:not([data-theme="dark"]) body .shared-profile-dropdown .profile-button {
  border: 1px solid #cfd8e3 !important;
  background: var(--apiw-brand-wash) !important;
  color: var(--apiw-text) !important;
  box-shadow: 0 1px 2px rgba(23, 32, 51, 0.08) !important;
}

:root:not([data-theme="dark"]) body .shared-profile-dropdown .profile-name,
:root:not([data-theme="dark"]) body .shared-profile-dropdown .profile-caret {
  color: var(--apiw-text) !important;
}

:root:not([data-theme="dark"]) body .shared-profile-dropdown .profile-role {
  color: var(--apiw-text-muted) !important;
}

:root:not([data-theme="dark"]) body .shared-profile-dropdown .profile-avatar {
  border: 1px solid rgba(45, 134, 212, 0.22) !important;
  background: var(--apiw-brand-soft) !important;
  color: var(--apiw-brand-strong) !important;
}

:root:not([data-theme="dark"]) body .shared-profile-dropdown .profile-trigger-icon {
  color: var(--apiw-brand-strong) !important;
  fill: currentColor !important;
}

html body .home-shell:not(.home-shell--analyzer) .customer-sidebar {
  width: 324px !important;
  padding: 22px 20px !important;
}

html body .home-shell:not(.home-shell--analyzer) .home-main {
  background: var(--apiw-page) !important;
}

html body .metab-home-hero {
  width: min(860px, 100%) !important;
  align-items: center !important;
  gap: 28px !important;
  margin: 0 auto !important;
  padding: 62px 20px 0 !important;
}

html body .metab-home-heading {
  align-items: center !important;
  gap: 14px !important;
  text-align: center !important;
}

html body .metab-home-heading::before {
  content: "" !important;
  display: block !important;
  width: 9px !important;
  height: 9px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: var(--apiw-brand) !important;
  box-shadow:
    15px 0 #d6eafa,
    30px 0 #d6eafa,
    45px 0 var(--apiw-brand),
    0 15px var(--apiw-brand),
    15px 15px var(--apiw-brand),
    30px 15px #d6eafa,
    45px 15px var(--apiw-brand),
    0 30px var(--apiw-brand),
    15px 30px #d6eafa,
    30px 30px var(--apiw-brand),
    45px 30px var(--apiw-brand),
    0 45px var(--apiw-brand),
    15px 45px #d6eafa,
    30px 45px #d6eafa,
    45px 45px var(--apiw-brand) !important;
  margin: 0 45px 42px 0 !important;
}

html body .metab-home-hero .hero-title {
  color: transparent !important;
  font-size: 0 !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  text-align: center !important;
}

html body .metab-home-hero .hero-title::after {
  content: "Hey there, MetaB" !important;
  color: var(--apiw-text) !important;
  font-size: 1.5rem !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
}

html body .metab-home-subtitle {
  display: none !important;
}

html body .metab-home-actions {
  width: min(760px, 100%) !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px !important;
}

html body .metab-home-action-card {
  min-height: 82px !important;
  grid-template-columns: 36px minmax(0, 1fr) !important;
  gap: 12px !important;
  border-radius: 6px !important;
  background: var(--apiw-surface) !important;
  box-shadow: 0 8px 20px rgba(43, 53, 68, 0.07) !important;
  padding: 16px !important;
}

html body .metab-home-action-icon {
  width: 36px !important;
  height: 36px !important;
  border-radius: 999px !important;
  background: #fff7df !important;
  color: #c88416 !important;
  font-size: 0.66rem !important;
}

html body .metab-home-action-copy strong {
  font-size: 0.95rem !important;
}

html body .metab-home-action-copy span {
  color: var(--apiw-text-muted) !important;
  font-size: 0.82rem !important;
}

@media (min-width: 769px) {
  html body .admin-shell.admin-layout {
    display: block !important;
    background: var(--apiw-page) !important;
  }

  html body .admin-shell.admin-layout .admin-sidebar {
    position: fixed !important;
    inset: 0 0 auto 0 !important;
    z-index: 90 !important;
    display: flex !important;
    width: 100% !important;
    height: 64px !important;
    min-height: 64px !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12) !important;
    background: var(--apiw-purple) !important;
    box-shadow: none !important;
    color: #ffffff !important;
  }

  html body .admin-shell.admin-layout .admin-header {
    display: flex !important;
    flex: 0 0 236px !important;
    height: 64px !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 10px !important;
    border: 0 !important;
    background: transparent !important;
    padding: 0 20px !important;
  }

  html body .admin-shell.admin-layout .admin-brand {
    min-width: 0 !important;
    color: #ffffff !important;
  }

  html body .admin-shell.admin-layout .admin-title {
    color: transparent !important;
    font-size: 0 !important;
  }

  html body .admin-shell.admin-layout .admin-title::after {
    content: "MetaB Admin" !important;
    color: #ffffff !important;
    font-size: 1rem !important;
    font-weight: 800 !important;
    line-height: 1.1 !important;
  }

  html body .admin-shell.admin-layout .admin-icon {
    width: 30px !important;
    height: 30px !important;
    border-radius: 4px !important;
    background: rgba(255, 255, 255, 0.16) !important;
    color: #ffffff !important;
  }

  html body .admin-shell.admin-layout .admin-icon svg {
    width: 20px !important;
    height: 20px !important;
  }

  html body .admin-shell.admin-layout .admin-footer {
    display: none !important;
  }

  html body .admin-shell.admin-layout .user-info-section {
    position: fixed !important;
    top: 10px !important;
    right: 14px !important;
    z-index: 95 !important;
    display: block !important;
    width: 44px !important;
    height: 44px !important;
  }

  html body .admin-shell.admin-layout .user-info-section .shared-profile-dropdown {
    width: 44px !important;
    min-width: 0 !important;
  }

  html body .admin-shell.admin-layout .user-info-section .profile-button {
    display: inline-flex !important;
    width: 44px !important;
    height: 44px !important;
    justify-content: center !important;
    border: 1px solid rgba(255, 255, 255, 0.35) !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, 0.12) !important;
    box-shadow: none !important;
    color: #ffffff !important;
    padding: 0 !important;
  }

  html body .admin-shell.admin-layout .user-info-section .profile-button:hover,
  html body .admin-shell.admin-layout .user-info-section .profile-button:focus-visible {
    border-color: rgba(255, 255, 255, 0.68) !important;
    background: rgba(0, 0, 0, 0.16) !important;
    color: #ffffff !important;
  }

  html body .admin-shell.admin-layout .user-info-section .profile-avatar {
    width: 30px !important;
    height: 30px !important;
    border: 1px solid rgba(255, 255, 255, 0.4) !important;
    background: rgba(255, 255, 255, 0.9) !important;
    color: var(--apiw-purple) !important;
  }

  html body .admin-shell.admin-layout .user-info-section .profile-trigger-icon {
    color: var(--apiw-purple) !important;
    fill: currentColor !important;
  }

  html body .admin-shell.admin-layout .user-info-section .profile-identity,
  html body .admin-shell.admin-layout .user-info-section .profile-caret {
    display: none !important;
  }

  html body .admin-shell.admin-layout .user-info-section .profile-menu {
    top: calc(100% + 10px) !important;
    right: 0 !important;
    left: auto !important;
    width: 240px !important;
    border: 1px solid var(--apiw-border) !important;
    border-radius: 6px !important;
    background: var(--apiw-surface) !important;
    box-shadow: var(--apiw-shadow-raised) !important;
    color: var(--apiw-text) !important;
  }

  html body .admin-shell.admin-layout .user-info-section .profile-menu-header,
  html body .admin-shell.admin-layout .user-info-section .profile-menu-item {
    color: var(--apiw-text) !important;
  }

  html body .admin-shell.admin-layout .user-info-section .profile-menu-item:hover {
    background: var(--apiw-brand-wash) !important;
    color: var(--apiw-brand-strong) !important;
  }

  html body .admin-shell.admin-layout .admin-top-groups {
    display: flex !important;
    flex: 1 1 auto !important;
    height: 64px !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 6px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    padding: 0 78px 0 4px !important;
    scrollbar-color: rgba(255, 255, 255, 0.5) transparent !important;
  }

  html body .admin-shell.admin-layout .admin-top-group {
    flex: 0 0 auto !important;
    height: 38px !important;
    border: 0 !important;
    border-radius: 4px !important;
    background: transparent !important;
    color: rgba(255, 255, 255, 0.86) !important;
    cursor: pointer !important;
    font-family: Lato, Arial, sans-serif !important;
    font-size: 0.84rem !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
    padding: 0 13px !important;
    white-space: nowrap !important;
  }

  html body .admin-shell.admin-layout .admin-top-group:hover {
    background: rgba(0, 0, 0, 0.15) !important;
    color: #ffffff !important;
  }

  html body .admin-shell.admin-layout .admin-top-group.is-active,
  html body .admin-shell.admin-layout .admin-top-group[aria-pressed="true"] {
    background: rgba(0, 0, 0, 0.24) !important;
    color: #ffffff !important;
  }

  html body .admin-shell.admin-layout .admin-links {
    position: fixed !important;
    top: 64px !important;
    bottom: 0 !important;
    left: 0 !important;
    z-index: 70 !important;
    display: flex !important;
    width: 256px !important;
    height: auto !important;
    flex-direction: column !important;
    gap: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    border-right: 1px solid var(--apiw-border) !important;
    background: var(--apiw-surface) !important;
    box-shadow: 1px 0 0 rgba(23, 32, 51, 0.02) !important;
    padding: 18px 16px !important;
    scrollbar-color: rgba(48, 59, 69, 0.24) transparent !important;
  }

  html body .admin-shell.admin-layout .admin-links .nav-section {
    display: flex !important;
    width: 100% !important;
    flex: 1 1 auto !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 4px !important;
    margin: 0 !important;
  }

  html body .admin-shell.admin-layout .admin-links .nav-section-title {
    display: block !important;
    color: var(--apiw-text-muted) !important;
    font-size: 0.78rem !important;
    font-weight: 800 !important;
    letter-spacing: 0 !important;
    margin: 0 0 10px !important;
    padding: 0 10px !important;
    text-transform: none !important;
  }

  html body .admin-shell.admin-layout .admin-nav-link,
  html body .admin-shell.admin-layout .admin-sidebar .nav-link {
    flex: 0 0 auto !important;
    min-width: 0 !important;
    width: 100% !important;
    min-height: 36px !important;
    height: auto !important;
    gap: 10px !important;
    justify-content: flex-start !important;
    margin: 0 !important;
    border-radius: 4px !important;
    background: transparent !important;
    color: var(--apiw-text-soft) !important;
    font-size: 0.84rem !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    padding: 9px 10px !important;
    white-space: normal !important;
  }

  html body .admin-shell.admin-layout .admin-nav-link .nav-icon,
  html body .admin-shell.admin-layout .admin-sidebar .nav-link .nav-icon {
    display: block !important;
    width: 18px !important;
    height: 18px !important;
    color: var(--apiw-text-muted) !important;
    stroke: currentColor !important;
  }

  html body .admin-shell.admin-layout .admin-nav-link:hover,
  html body .admin-shell.admin-layout .admin-sidebar .nav-link:hover {
    background: var(--apiw-brand-wash) !important;
    color: var(--apiw-text) !important;
  }

  html body .admin-shell.admin-layout .admin-nav-link[aria-current="page"],
  html body .admin-shell.admin-layout .admin-nav-link.router-link-active,
  html body .admin-shell.admin-layout .admin-sidebar .nav-link[aria-current="page"],
  html body .admin-shell.admin-layout .admin-sidebar .nav-link.router-link-active {
    background: var(--apiw-brand-soft) !important;
    color: var(--apiw-brand-strong) !important;
  }

  html body .admin-shell.admin-layout .admin-nav-link[aria-current="page"] .nav-icon,
  html body .admin-shell.admin-layout .admin-nav-link.router-link-active .nav-icon,
  html body .admin-shell.admin-layout .admin-sidebar .nav-link[aria-current="page"] .nav-icon,
  html body .admin-shell.admin-layout .admin-sidebar .nav-link.router-link-active .nav-icon {
    color: var(--apiw-brand-strong) !important;
  }

  html body .admin-shell.admin-layout .workspace.admin-content {
    width: 100% !important;
    min-height: 100vh !important;
    margin-left: 0 !important;
    background: var(--apiw-page) !important;
    padding: 96px 32px 32px 288px !important;
  }

  html body .admin-shell.admin-layout .admin-page,
  html body .admin-shell.admin-layout .admin-ds-management-page,
  html body .admin-shell.admin-layout .admin-ds-dictionary-page {
    width: min(1120px, 100%) !important;
    max-width: 1120px !important;
    margin: 0 auto !important;
  }
}

@media (min-width: 769px) and (max-width: 1100px) {
  html body .admin-shell.admin-layout .admin-header {
    flex-basis: 200px !important;
  }

  html body .admin-shell.admin-layout .admin-links {
    width: 232px !important;
    padding: 16px 12px !important;
  }

  html body .admin-shell.admin-layout .workspace.admin-content {
    padding-left: 260px !important;
  }
}

html body .admin-shell .admin-page-header,
html body .admin-shell .admin-dashboard-management-header,
html body .admin-shell .admin-base-product-header,
html body .admin-shell .admin-ds-page-header {
  align-items: flex-start !important;
  border-bottom: 1px solid var(--apiw-border) !important;
  margin: 0 0 20px !important;
  padding: 0 0 20px !important;
}

html body .admin-shell .admin-page-title,
html body .admin-shell .admin-dashboard-management-page .admin-page-title,
html body .admin-shell .admin-base-product-header h1,
html body .admin-shell .admin-ds-page-title {
  color: var(--apiw-text) !important;
  font-size: 1.65rem !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
}

html body .admin-shell .admin-page-subtitle,
html body .admin-shell .admin-dashboard-management-page .admin-page-subtitle,
html body .admin-shell .admin-base-product-header p,
html body .admin-shell .admin-ds-page-subtitle {
  color: var(--apiw-text-soft) !important;
  font-size: 0.94rem !important;
  line-height: 1.5 !important;
}

html body .admin-shell .admin-dashboard-management-create,
html body .admin-shell .admin-primary-button,
html body .admin-shell .admin-ds-primary-button,
html body .admin-shell .admin-page .button:not(.button-secondary) {
  border: 1px solid var(--apiw-brand) !important;
  border-radius: 4px !important;
  background: var(--apiw-brand) !important;
  box-shadow: none !important;
  color: #ffffff !important;
  font-weight: 800 !important;
}

html body .admin-shell .admin-dashboard-management-create:hover,
html body .admin-shell .admin-primary-button:hover:not(:disabled),
html body .admin-shell .admin-ds-primary-button:hover,
html body .admin-shell .admin-page .button:not(.button-secondary):hover:not(:disabled) {
  border-color: var(--apiw-brand-strong) !important;
  background: var(--apiw-brand-strong) !important;
  box-shadow: none !important;
  color: #ffffff !important;
  transform: none !important;
}

html body .admin-shell .admin-dashboard-management-stats,
html body .admin-shell .admin-base-product-metrics,
html body .admin-shell .admin-parity-metrics,
html body .admin-shell .admin-data-pipelines-stats,
html body .admin-shell .admin-ai-stats-grid,
html body .admin-shell .tenant-governance-metrics {
  gap: 12px !important;
}

html body .admin-shell .admin-dashboard-management-stat,
html body .admin-shell .admin-base-product-metric,
html body .admin-shell .admin-parity-metric,
html body .admin-shell .admin-data-pipelines-stat,
html body .admin-shell .admin-ai-stat-card,
html body .admin-shell .tenant-governance-metrics article,
html body .admin-shell .admin-comms-card,
html body .admin-shell .smtp-card,
html body .admin-shell .mfa-type-card,
html body .admin-shell .info-card {
  border: 1px solid var(--apiw-border) !important;
  border-radius: 6px !important;
  background: var(--apiw-surface) !important;
  box-shadow: var(--apiw-shadow) !important;
  color: var(--apiw-text) !important;
}

html body .admin-shell .admin-dashboard-management-stat .stat-icon,
html body .admin-shell .admin-data-pipelines-stat > span,
html body .admin-shell .admin-base-product-banner-icon,
html body .admin-shell .admin-ds-table-icon {
  background: var(--apiw-brand-soft) !important;
  color: var(--apiw-brand-strong) !important;
}

html body .admin-shell .admin-dashboard-management-stat .stat-icon svg,
html body .admin-shell .admin-data-pipelines-stat > span svg {
  fill: currentColor !important;
  stroke: currentColor !important;
}

html body .admin-shell .admin-dashboard-management-stat strong,
html body .admin-shell .admin-base-product-metric strong,
html body .admin-shell .admin-parity-metric strong,
html body .admin-shell .admin-data-pipelines-stat strong,
html body .admin-shell .tenant-governance-metrics strong {
  color: var(--apiw-text) !important;
  font-weight: 800 !important;
}

html body .admin-shell .admin-dashboard-management-stat p,
html body .admin-shell .admin-base-product-metric p,
html body .admin-shell .admin-base-product-metric span,
html body .admin-shell .admin-parity-metric span,
html body .admin-shell .admin-data-pipelines-stat p,
html body .admin-shell .tenant-governance-metrics p,
html body .admin-shell .tenant-governance-metrics span {
  color: var(--apiw-text-muted) !important;
}

html body .admin-shell .admin-dashboard-management-panel,
html body .admin-shell .admin-base-product-banner,
html body .admin-shell .admin-base-product-filterbar,
html body .admin-shell .admin-settings-card,
html body .admin-shell .admin-parity-card,
html body .admin-shell .admin-parity-workspace,
html body .admin-shell .admin-toolbar,
html body .admin-shell .admin-form-panel,
html body .admin-shell .admin-table-panel,
html body .admin-shell .admin-summary-panel,
html body .admin-shell .tenant-governance-status,
html body .admin-shell .tenant-governance-table-card,
html body .admin-shell .admin-ds-table-container,
html body .admin-shell .admin-ds-dictionary-filters,
html body .admin-shell .admin-ds-empty-state,
html body .admin-shell .admin-ds-loading-state,
html body .admin-shell .admin-ds-connection-sidebar,
html body .admin-shell .admin-ds-connection-panel,
html body .admin-shell .admin-ds-connection-card {
  border: 1px solid var(--apiw-border) !important;
  border-radius: 6px !important;
  background: var(--apiw-surface) !important;
  box-shadow: var(--apiw-shadow) !important;
  color: var(--apiw-text) !important;
}

html body .admin-shell .admin-dashboard-management-filters,
html body .admin-shell .admin-toolbar,
html body .admin-shell .admin-base-product-filterbar,
html body .admin-shell .admin-ds-dictionary-filters {
  border-color: var(--apiw-border) !important;
  background: var(--apiw-surface) !important;
}

html body .admin-shell .admin-dashboard-management-filters input,
html body .admin-shell .admin-dashboard-management-filters select,
html body .admin-shell .admin-page input,
html body .admin-shell .admin-page select,
html body .admin-shell .admin-page textarea,
html body .admin-shell .admin-ds-search-field input,
html body .admin-shell .admin-ds-source-filter select {
  border: 1px solid var(--apiw-border) !important;
  border-radius: 4px !important;
  background: #ffffff !important;
  color: var(--apiw-text) !important;
  box-shadow: none !important;
}

html body .admin-shell .admin-dashboard-management-filters input:focus,
html body .admin-shell .admin-dashboard-management-filters select:focus,
html body .admin-shell .admin-page input:focus,
html body .admin-shell .admin-page select:focus,
html body .admin-shell .admin-page textarea:focus,
html body .admin-shell .admin-ds-search-field input:focus,
html body .admin-shell .admin-ds-source-filter select:focus {
  border-color: var(--apiw-brand) !important;
  box-shadow: 0 0 0 3px rgba(80, 158, 226, 0.18) !important;
}

html body .admin-shell .admin-dashboard-management-panel table,
html body .admin-shell .admin-page table,
html body .admin-shell .tenant-governance-table-card table,
html body .admin-shell .admin-ds-table-container table {
  border-collapse: collapse !important;
  color: var(--apiw-text) !important;
  font-size: 0.88rem !important;
}

html body .admin-shell .admin-dashboard-management-panel thead th,
html body .admin-shell .admin-page thead th,
html body .admin-shell .tenant-governance-table-card thead th,
html body .admin-shell .admin-ds-table-container thead th {
  border-bottom: 1px solid var(--apiw-border) !important;
  background: #f6f8fa !important;
  color: var(--apiw-text-muted) !important;
  font-size: 0.76rem !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  text-transform: uppercase !important;
}

html body .admin-shell .admin-dashboard-management-panel tbody td,
html body .admin-shell .admin-page tbody td,
html body .admin-shell .tenant-governance-table-card tbody td,
html body .admin-shell .admin-ds-table-container tbody td {
  border-bottom: 1px solid var(--apiw-border-soft) !important;
  color: var(--apiw-text-soft) !important;
}

html body .admin-shell .admin-dashboard-management-panel tbody tr:hover,
html body .admin-shell .admin-page tbody tr:hover,
html body .admin-shell .tenant-governance-table-card tbody tr:hover,
html body .admin-shell .admin-ds-table-container tbody tr:hover {
  background: var(--apiw-brand-wash) !important;
}

html body .admin-shell .admin-dashboard-management-actions .action-btn,
html body .admin-shell .admin-dashboard-management-more summary,
html body .admin-shell .smtp-action-button,
html body .admin-shell .admin-secondary-button,
html body .admin-shell .admin-ds-secondary-button,
html body .admin-shell .admin-page .button-secondary {
  border: 1px solid var(--apiw-border) !important;
  border-radius: 4px !important;
  background: var(--apiw-surface) !important;
  box-shadow: none !important;
  color: var(--apiw-text-soft) !important;
}

html body .admin-shell .admin-dashboard-management-actions .action-btn:hover,
html body .admin-shell .admin-dashboard-management-more summary:hover,
html body .admin-shell .smtp-action-button:hover,
html body .admin-shell .admin-secondary-button:hover:not(:disabled),
html body .admin-shell .admin-ds-secondary-button:hover,
html body .admin-shell .admin-page .button-secondary:hover:not(:disabled) {
  border-color: var(--apiw-brand) !important;
  background: var(--apiw-brand-wash) !important;
  color: var(--apiw-brand-strong) !important;
  transform: none !important;
}

html body .admin-shell .admin-dashboard-management-menu {
  border: 1px solid var(--apiw-border) !important;
  border-radius: 6px !important;
  background: var(--apiw-surface) !important;
  box-shadow: var(--apiw-shadow-raised) !important;
}

html body .admin-shell .admin-dashboard-management-menu button {
  color: var(--apiw-text) !important;
}

html body .admin-shell .admin-dashboard-management-menu button:hover {
  background: var(--apiw-brand-wash) !important;
  color: var(--apiw-brand-strong) !important;
}

@media (max-width: 900px) {
  html body .home-shell:not(.home-shell--analyzer) .customer-sidebar {
    width: 276px !important;
  }

  html body .metab-home-actions {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}