/* DataHubX global visual system - PortfolioAI-inspired dark-first UI */
:root {
  color-scheme: dark;
  --dx-bg: #050b14;
  --dx-bg-soft: #071426;
  --dx-surface: #0b1f38;
  --dx-surface-2: #0f2744;
  --dx-surface-3: #102a4c;
  --dx-border: rgba(125,207,255,.14);
  --dx-border-strong: rgba(125,207,255,.28);
  --dx-text: #e6f1ff;
  --dx-muted: #9fb7d3;
  --dx-primary: #4f8cff;
  --dx-primary-2: #7c5cff;
  --dx-cyan: #38bdf8;
  --dx-success: #34d399;
  --dx-warning: #fbbf24;
  --dx-danger: #fb7185;
  --dx-radius: 14px;
  --dx-shadow: 0 16px 40px rgba(0,0,0,.22);
}
html.datahubx-theme-light, body.datahubx-theme-light {
  color-scheme: light;
  --dx-bg: #f5f7fb;
  --dx-bg-soft: #f8fafc;
  --dx-surface: #ffffff;
  --dx-surface-2: #ffffff;
  --dx-surface-3: #f8fafc;
  --dx-border: rgba(100,116,139,.18);
  --dx-border-strong: rgba(37,99,235,.28);
  --dx-text: #0f172a;
  --dx-muted: #64748b;
  --dx-shadow: 0 14px 34px rgba(15,23,42,.08);
}
html, body { margin:0; min-height:100%; background:var(--dx-bg); color:var(--dx-text); }
body { font-family: Inter, Pretendard, "Segoe UI", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif; }
#app { min-height:100vh; background:var(--dx-bg); }

/* Initial boot screen */
.loading-section {
  min-height: 100vh !important; height: auto !important;
  display:flex !important; align-items:center; justify-content:center !important;
  text-align:center; position:relative; overflow:hidden;
  background:
    radial-gradient(circle at 18% 10%, rgba(79,140,255,.20), transparent 30%),
    radial-gradient(circle at 82% 0%, rgba(124,92,255,.15), transparent 28%),
    linear-gradient(180deg,#071426 0%,#050b14 100%);
}
.loading-section::before {
  content:""; position:absolute; inset:0; pointer-events:none; opacity:.32;
  background-image: linear-gradient(rgba(125,207,255,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(125,207,255,.04) 1px, transparent 1px);
  background-size:32px 32px;
}
.loading-content { position:relative; z-index:1; min-width:260px; padding:34px 38px; border:1px solid var(--dx-border); border-radius:22px; background:rgba(11,31,56,.66); backdrop-filter:blur(16px); box-shadow:var(--dx-shadow); }
.loading-brand { display:flex; align-items:center; justify-content:center; gap:12px; margin-bottom:10px; }
.loading-brand-mark { width:42px; height:42px; border-radius:13px; display:grid; place-items:center; font-weight:900; color:#fff; background:linear-gradient(135deg,var(--dx-primary),var(--dx-primary-2)); box-shadow:0 8px 24px rgba(79,140,255,.32); }
.loading-section h2 { color:#fff !important; font-size:25px; letter-spacing:.01em; margin:0; }
.loading-caption { color:#9fb7d3; font-size:12px; margin-top:5px; }
.loader { display:flex; justify-content:center; gap:8px; margin-top:24px !important; }
.loader-dot { width:8px !important; height:8px !important; background:#69a4ff !important; box-shadow:0 0 16px rgba(105,164,255,.7); animation:dxPulse 1.25s infinite ease-in-out both !important; }
.loader-dot.dot1 { animation-delay:-.24s !important; }
.loader-dot.dot2 { animation-delay:-.12s !important; }
.loader-dot.dot3 { animation-delay:0s !important; }
@keyframes dxPulse { 0%,80%,100%{transform:scale(.65);opacity:.35} 40%{transform:scale(1.15);opacity:1} }

/* Global MudBlazor surfaces */
.datahubx-theme-dark .mud-paper,
.datahubx-theme-dark .mud-card,
.datahubx-theme-dark .mud-popover,
.datahubx-theme-dark .mud-dialog,
.datahubx-theme-dark .mud-menu,
.datahubx-theme-dark .mud-table-container {
  background-color:var(--dx-surface-2) !important; color:var(--dx-text) !important;
  border-color:var(--dx-border) !important;
}
.datahubx-theme-dark .mud-paper,
.datahubx-theme-dark .mud-card { border:1px solid var(--dx-border); border-radius:var(--dx-radius); box-shadow:0 8px 24px rgba(0,0,0,.10); }
.datahubx-theme-light .mud-paper,
.datahubx-theme-light .mud-card { border:1px solid var(--dx-border); border-radius:var(--dx-radius); box-shadow:var(--dx-shadow); }

/* Tables */
.datahubx-theme-dark .mud-table-root { background:transparent !important; }
.datahubx-theme-dark .mud-table-head .mud-table-cell { color:#bcd2eb !important; font-weight:700; background:rgba(5,11,20,.35) !important; border-bottom:1px solid var(--dx-border-strong) !important; }
.datahubx-theme-dark .mud-table-body .mud-table-row { transition:background .14s ease; }
.datahubx-theme-dark .mud-table-body .mud-table-row:nth-child(even) { background:rgba(148,163,184,.025) !important; }
.datahubx-theme-dark .mud-table-body .mud-table-row:hover { background:rgba(79,140,255,.085) !important; }
.datahubx-theme-dark .mud-table-cell { border-color:rgba(125,207,255,.08) !important; }

/* Inputs */
.datahubx-theme-dark .mud-input-outlined-border { border-color:rgba(148,189,234,.22) !important; }
.datahubx-theme-dark .mud-input-control:hover .mud-input-outlined-border { border-color:rgba(105,164,255,.52) !important; }
.datahubx-theme-dark .mud-input-control.mud-input-focused .mud-input-outlined-border { border-color:#69a4ff !important; box-shadow:0 0 0 3px rgba(79,140,255,.09); }
.datahubx-theme-dark input,
.datahubx-theme-dark textarea,
.datahubx-theme-dark .mud-select-input { color:var(--dx-text) !important; }

/* Tabs */
.datahubx-theme-dark .datahubx-themed-tabs .mud-tabs-toolbar,
.datahubx-theme-dark .mud-tabs-toolbar { background:rgba(5,11,20,.24) !important; border:1px solid var(--dx-border); border-radius:12px; padding:4px; }
.datahubx-theme-dark .mud-tab { border-radius:9px !important; min-height:38px; color:var(--dx-muted) !important; }
.datahubx-theme-dark .mud-tab.mud-tab-active { color:#eef6ff !important; background:linear-gradient(135deg,rgba(79,140,255,.18),rgba(124,92,255,.12)) !important; }
.datahubx-theme-dark .mud-tabs-slider { background:linear-gradient(90deg,var(--dx-primary),var(--dx-primary-2)) !important; height:2px !important; }

/* Buttons and chips */
.datahubx-theme-dark .mud-button-filled-primary { background:linear-gradient(135deg,var(--dx-primary),var(--dx-primary-2)) !important; color:#fff !important; box-shadow:0 8px 20px rgba(79,140,255,.18); }
.datahubx-theme-dark .mud-button-outlined { border-color:var(--dx-border-strong) !important; }
.datahubx-theme-dark .mud-chip { border-radius:999px; }

/* Dialog and snackbar polish */
.datahubx-theme-dark .mud-dialog { border:1px solid var(--dx-border-strong) !important; border-radius:18px !important; box-shadow:0 28px 80px rgba(0,0,0,.45) !important; }
.datahubx-theme-dark .mud-snackbar { border-radius:12px !important; box-shadow:var(--dx-shadow) !important; }

/* Scrollbar */
* { scrollbar-width:thin; scrollbar-color:rgba(125,207,255,.24) transparent; }
*::-webkit-scrollbar { width:9px; height:9px; }
*::-webkit-scrollbar-track { background:transparent; }
*::-webkit-scrollbar-thumb { background:rgba(125,207,255,.20); border:2px solid transparent; background-clip:padding-box; border-radius:999px; }
*::-webkit-scrollbar-thumb:hover { background:rgba(125,207,255,.34); border:2px solid transparent; background-clip:padding-box; }

/* Error bar */
#blazor-error-ui { background:#35151c !important; color:#ffe4e8 !important; border-top:1px solid rgba(251,113,133,.35); box-shadow:0 -12px 30px rgba(0,0,0,.25) !important; }
#blazor-error-ui .reload { color:#93c5fd; font-weight:700; margin-left:10px; }

@media (max-width: 768px) {
  .loading-content { margin:20px; min-width:0; width:calc(100% - 40px); }
  .mud-table-container { border-radius:12px !important; }
}

/* =========================================================
   Dark-mode icon contrast normalization
   - Fixes low-contrast default MudBlazor icons across menus,
     nav, buttons, list items, inputs, tables, dialogs and popovers.
   - Semantic colors (primary/success/warning/error) are preserved.
   ========================================================= */
.datahubx-theme-dark {
  --dx-icon: #9fb7d3;
  --dx-icon-strong: #dbeafe;
  --dx-icon-hover: #93c5fd;
  --dx-icon-muted: #7f94af;
}

/* Navigation / menu / list icons */
.datahubx-theme-dark .mud-nav-link-icon,
.datahubx-theme-dark .mud-menu-item .mud-icon-root,
.datahubx-theme-dark .mud-list-item .mud-list-item-icon .mud-icon-root,
.datahubx-theme-dark .mud-list-item-icon .mud-icon-root,
.datahubx-theme-dark .mud-treeview-item .mud-icon-root,
.datahubx-theme-dark .mud-breadcrumbs .mud-icon-root {
  color: var(--dx-icon) !important;
  fill: currentColor !important;
}

.datahubx-theme-dark .mud-menu-item:hover .mud-icon-root,
.datahubx-theme-dark .mud-list-item:hover .mud-list-item-icon .mud-icon-root,
.datahubx-theme-dark .mud-treeview-item:hover .mud-icon-root,
.datahubx-theme-dark .mud-nav-link:hover .mud-nav-link-icon {
  color: var(--dx-icon-hover) !important;
}

/* Generic icon buttons / action icons */
.datahubx-theme-dark .mud-icon-button:not(.mud-primary-text):not(.mud-secondary-text):not(.mud-success-text):not(.mud-warning-text):not(.mud-error-text):not(.mud-info-text) .mud-icon-root,
.datahubx-theme-dark .mud-table-cell .mud-icon-button:not(.mud-primary-text):not(.mud-secondary-text):not(.mud-success-text):not(.mud-warning-text):not(.mud-error-text):not(.mud-info-text) .mud-icon-root,
.datahubx-theme-dark .mud-dialog .mud-icon-button:not(.mud-primary-text):not(.mud-secondary-text):not(.mud-success-text):not(.mud-warning-text):not(.mud-error-text):not(.mud-info-text) .mud-icon-root,
.datahubx-theme-dark .mud-popover .mud-icon-button:not(.mud-primary-text):not(.mud-secondary-text):not(.mud-success-text):not(.mud-warning-text):not(.mud-error-text):not(.mud-info-text) .mud-icon-root {
  color: var(--dx-icon) !important;
  fill: currentColor !important;
}

.datahubx-theme-dark .mud-icon-button:hover .mud-icon-root,
.datahubx-theme-dark .mud-table-cell .mud-icon-button:hover .mud-icon-root,
.datahubx-theme-dark .mud-dialog .mud-icon-button:hover .mud-icon-root,
.datahubx-theme-dark .mud-popover .mud-icon-button:hover .mud-icon-root {
  color: var(--dx-icon-strong) !important;
}

/* Button start/end icons follow readable foreground */
.datahubx-theme-dark .mud-button-root:not(.mud-button-filled-primary):not(.mud-button-filled-secondary):not(.mud-button-filled-success):not(.mud-button-filled-warning):not(.mud-button-filled-error) .mud-icon-root {
  color: var(--dx-icon) !important;
  fill: currentColor !important;
}

.datahubx-theme-dark .mud-button-root:not(.mud-button-filled-primary):not(.mud-button-filled-secondary):not(.mud-button-filled-success):not(.mud-button-filled-warning):not(.mud-button-filled-error):hover .mud-icon-root {
  color: var(--dx-icon-hover) !important;
}

.datahubx-theme-dark .mud-button-filled-primary .mud-icon-root,
.datahubx-theme-dark .mud-button-filled-secondary .mud-icon-root,
.datahubx-theme-dark .mud-button-filled-success .mud-icon-root,
.datahubx-theme-dark .mud-button-filled-warning .mud-icon-root,
.datahubx-theme-dark .mud-button-filled-error .mud-icon-root {
  color: #ffffff !important;
  fill: currentColor !important;
}

/* Input/select adornments */
.datahubx-theme-dark .mud-input-adornment,
.datahubx-theme-dark .mud-input-adornment .mud-icon-root,
.datahubx-theme-dark .mud-select .mud-icon-root,
.datahubx-theme-dark .mud-picker .mud-icon-root {
  color: var(--dx-icon) !important;
  fill: currentColor !important;
}

.datahubx-theme-dark .mud-input-control:focus-within .mud-input-adornment .mud-icon-root,
.datahubx-theme-dark .mud-select:focus-within .mud-icon-root {
  color: var(--dx-icon-hover) !important;
}

/* Expansion panels, chips, pagination and misc controls */
.datahubx-theme-dark .mud-expand-panel-header .mud-icon-root,
.datahubx-theme-dark .mud-table-pagination .mud-icon-root,
.datahubx-theme-dark .mud-pagination .mud-icon-root,
.datahubx-theme-dark .mud-chip .mud-icon-root,
.datahubx-theme-dark .mud-stepper .mud-icon-root {
  color: var(--dx-icon) !important;
  fill: currentColor !important;
}

/* Explicit semantic foregrounds remain semantic */
.datahubx-theme-dark .mud-primary-text .mud-icon-root,
.datahubx-theme-dark .mud-icon-root.mud-primary-text { color: var(--mud-palette-primary) !important; }
.datahubx-theme-dark .mud-secondary-text .mud-icon-root,
.datahubx-theme-dark .mud-icon-root.mud-secondary-text { color: var(--mud-palette-secondary) !important; }
.datahubx-theme-dark .mud-success-text .mud-icon-root,
.datahubx-theme-dark .mud-icon-root.mud-success-text { color: var(--mud-palette-success) !important; }
.datahubx-theme-dark .mud-warning-text .mud-icon-root,
.datahubx-theme-dark .mud-icon-root.mud-warning-text { color: var(--mud-palette-warning) !important; }
.datahubx-theme-dark .mud-error-text .mud-icon-root,
.datahubx-theme-dark .mud-icon-root.mud-error-text { color: var(--mud-palette-error) !important; }
.datahubx-theme-dark .mud-info-text .mud-icon-root,
.datahubx-theme-dark .mud-icon-root.mud-info-text { color: var(--mud-palette-info) !important; }

/* Disabled controls should still be visible but subdued */
.datahubx-theme-dark .mud-disabled .mud-icon-root,
.datahubx-theme-dark .mud-icon-button:disabled .mud-icon-root,
.datahubx-theme-dark .mud-button-root:disabled .mud-icon-root {
  color: #61758e !important;
  opacity: .72 !important;
}

/* =========================================================
   Dark-mode chip / badge contrast normalization
   - Improves default outlined chips such as Data Catalog Type (VIEW/TABLE/etc.)
   - Keeps semantic primary/success/warning/error/info chips unchanged.
   ========================================================= */
.datahubx-theme-dark .mud-chip.mud-chip-outlined.mud-chip-color-default,
.datahubx-theme-dark .mud-chip.mud-chip-outlined.mud-default-text,
.datahubx-theme-dark .mud-chip.mud-chip-outlined:not(.mud-primary-text):not(.mud-secondary-text):not(.mud-success-text):not(.mud-warning-text):not(.mud-error-text):not(.mud-info-text) {
  color: #b8c9dc !important;
  border-color: #7f97b3 !important;
  background: rgba(127, 151, 179, .055) !important;
}

.datahubx-theme-dark .mud-chip.mud-chip-outlined.mud-chip-color-default .mud-chip-content,
.datahubx-theme-dark .mud-chip.mud-chip-outlined.mud-default-text .mud-chip-content,
.datahubx-theme-dark .mud-chip.mud-chip-outlined:not(.mud-primary-text):not(.mud-secondary-text):not(.mud-success-text):not(.mud-warning-text):not(.mud-error-text):not(.mud-info-text) .mud-chip-content {
  color: #c9d8e8 !important;
  font-weight: 600;
}

.datahubx-theme-dark .mud-chip.mud-chip-outlined.mud-chip-color-default:hover,
.datahubx-theme-dark .mud-chip.mud-chip-outlined.mud-default-text:hover,
.datahubx-theme-dark .mud-chip.mud-chip-outlined:not(.mud-primary-text):not(.mud-secondary-text):not(.mud-success-text):not(.mud-warning-text):not(.mud-error-text):not(.mud-info-text):hover {
  color: #e6f0fb !important;
  border-color: #93c5fd !important;
  background: rgba(59, 130, 246, .10) !important;
}

/* Data Catalog / Data Map table chips: ensure compact labels remain legible */
.datahubx-theme-dark .mud-table-cell .mud-chip.mud-chip-outlined {
  min-height: 24px;
}

/* Re-assert semantic chip colors after the generic default-chip rule */
.datahubx-theme-dark .mud-chip.mud-primary-text,
.datahubx-theme-dark .mud-chip.mud-chip-color-primary { color: var(--mud-palette-primary) !important; border-color: var(--mud-palette-primary) !important; }
.datahubx-theme-dark .mud-chip.mud-secondary-text,
.datahubx-theme-dark .mud-chip.mud-chip-color-secondary { color: var(--mud-palette-secondary) !important; border-color: var(--mud-palette-secondary) !important; }
.datahubx-theme-dark .mud-chip.mud-success-text,
.datahubx-theme-dark .mud-chip.mud-chip-color-success { color: var(--mud-palette-success) !important; border-color: var(--mud-palette-success) !important; }
.datahubx-theme-dark .mud-chip.mud-warning-text,
.datahubx-theme-dark .mud-chip.mud-chip-color-warning { color: var(--mud-palette-warning) !important; border-color: var(--mud-palette-warning) !important; }
.datahubx-theme-dark .mud-chip.mud-error-text,
.datahubx-theme-dark .mud-chip.mud-chip-color-error { color: var(--mud-palette-error) !important; border-color: var(--mud-palette-error) !important; }
.datahubx-theme-dark .mud-chip.mud-info-text,
.datahubx-theme-dark .mud-chip.mud-chip-color-info { color: var(--mud-palette-info) !important; border-color: var(--mud-palette-info) !important; }

/* =========================================================
   DataHubX Dark Theme - Outlined Button Contrast
   ========================================================= */

.mud-theme-dark .mud-button-root.mud-button-outlined:not(.mud-button-outlined-primary):not(.mud-button-outlined-secondary):not(.mud-button-outlined-success):not(.mud-button-outlined-warning):not(.mud-button-outlined-error),
.mud-theme-dark .mud-button-root.mud-button-outlined.mud-button-outlined-default {
    color: #a9bfd9 !important;
    border-color: #46627f !important;
    background: rgba(30, 64, 102, 0.10) !important;
}

    .mud-theme-dark .mud-button-root.mud-button-outlined:not(.mud-button-outlined-primary):not(.mud-button-outlined-secondary):not(.mud-button-outlined-success):not(.mud-button-outlined-warning):not(.mud-button-outlined-error) .mud-icon-root,
    .mud-theme-dark .mud-button-root.mud-button-outlined.mud-button-outlined-default .mud-icon-root {
        color: #a9bfd9 !important;
    }

.mud-theme-dark .mud-button-root.mud-button-outlined:not(:disabled):hover {
    color: #d8eaff !important;
    border-color: #60a5fa !important;
    background: rgba(59, 130, 246, 0.12) !important;
}

    .mud-theme-dark .mud-button-root.mud-button-outlined:not(:disabled):hover .mud-icon-root {
        color: #93c5fd !important;
    }

.mud-theme-dark .mud-button-root.mud-button-outlined:disabled {
    color: #70839a !important;
    border-color: #33485f !important;
    opacity: 1 !important;
}

    .mud-theme-dark .mud-button-root.mud-button-outlined:disabled .mud-icon-root {
        color: #70839a !important;
    }