/**
 * Dashboard Dark Mode Overrides
 *
 * Centralized dark mode styles for all dashboard components.
 * Uses [data-theme="dark"] attribute set on <html> by MainLayout.
 *
 * NOTE: These rules MUST live in a .css file (not inline <style> in .razor)
 * because Razor's parser can misinterpret CSS attribute selectors with quotes.
 */

/* ============================================================
   DashboardViewer — canvas, widgets, filters, toolbar, footer
   ============================================================ */
[data-theme="dark"] .dashboard-canvas-compact {
    background: #0f172a;
}

[data-theme="dark"] .dashboard-header-compact {
    border-color: #334155;
}

[data-theme="dark"] .dashboard-widget-modern {
    background-color: #1e293b;
    border-color: #334155;
}

[data-theme="dark"] .widget-content,
[data-theme="dark"] .widget-content-full {
    background: #1e293b;
    color: #e2e8f0;
}

[data-theme="dark"] .filter-section-compact {
    background: #1e293b;
    border-color: #334155;
}

[data-theme="dark"] .filter-section-compact .filter-header {
    background: rgba(129, 140, 248, 0.08);
}

[data-theme="dark"] .filter-section-compact .filter-item {
    background: #334155;
    border-color: #475569;
}

[data-theme="dark"] .add-widget-toolbar-compact {
    background: #1e293b;
    border-color: #334155;
}

[data-theme="dark"] .pages-tabs-compact {
    background: #1e293b;
}

[data-theme="dark"] .dashboard-footer-compact {
    background: #1e293b;
}

[data-theme="dark"] .dashboard-widget-modern table th {
    background: #2a2a30;
    color: #cbd5e1;
    border-bottom-color: #475569;
}

[data-theme="dark"] .dashboard-widget-modern table td {
    color: #e2e8f0;
    border-bottom-color: #334155;
}

[data-theme="dark"] .table-datagrid .mud-table-head th {
    background: #334155 !important;
    color: #cbd5e1;
    border-bottom-color: #475569;
}

[data-theme="dark"] .table-datagrid .mud-table-body td {
    color: #e2e8f0;
    border-bottom-color: #334155;
}

[data-theme="dark"] .table-datagrid .mud-table-pagination {
    background: #334155;
    border-top-color: #475569;
}

[data-theme="dark"] .widget-export-button {
    background: rgba(30, 41, 59, 0.9);
}

[data-theme="dark"] .loading-shimmer {
    background: linear-gradient(90deg, #1e293b 25%, #334155 50%, #1e293b 75%);
    background-size: 400px 100%;
}

/* ============================================================
   DashboardGrid — widget cells, grid overlay, move panel
   ============================================================ */
[data-theme="dark"] .dashboard-grid-wrapper.edit-mode {
    background: #0f172a;
}

[data-theme="dark"] .grid-background-overlay {
    background-image:
        repeating-linear-gradient(
            to right,
            rgba(129, 140, 248, 0.08) 0px,
            rgba(129, 140, 248, 0.08) var(--cell-width),
            transparent var(--cell-width),
            transparent calc(var(--cell-width) + var(--gap))
        ),
        repeating-linear-gradient(
            to bottom,
            rgba(129, 140, 248, 0.06) 0px,
            rgba(129, 140, 248, 0.06) var(--cell-height),
            transparent var(--cell-height),
            transparent calc(var(--cell-height) + var(--gap))
        );
}

[data-theme="dark"] .widget-cell {
    background: #1e293b;
    border-color: #334155;
    box-shadow: var(--shadow-widget);
}

[data-theme="dark"] .widget-cell.editable:hover {
    border-color: #818cf8;
    box-shadow: var(--shadow-widget-hover);
}

[data-theme="dark"] .move-panel {
    background: #1e293b;
}

[data-theme="dark"] .move-panel-header {
    background: #334155;
    border-bottom-color: #475569;
    color: #e2e8f0;
}

[data-theme="dark"] .close-btn {
    color: #94a3b8;
}

[data-theme="dark"] .close-btn:hover {
    background: #334155;
    color: #e2e8f0;
}

[data-theme="dark"] .header-cell {
    background: rgba(129, 140, 248, 0.15);
    color: #a5b4fc;
}

[data-theme="dark"] .row-label {
    background: rgba(129, 140, 248, 0.15);
    color: #a5b4fc;
}

[data-theme="dark"] .move-cell {
    background: #334155;
    border-color: #475569;
}

[data-theme="dark"] .move-cell:hover {
    border-color: #818cf8;
    background: rgba(129, 140, 248, 0.15);
}

[data-theme="dark"] .move-cell.current {
    background: rgba(129, 140, 248, 0.25);
    border-color: #818cf8;
    box-shadow: inset 0 0 0 2px #818cf8;
}

[data-theme="dark"] .move-cell.occupied {
    background: rgba(255, 152, 0, 0.15);
    border-color: #ff9800;
}

[data-theme="dark"] .move-cell.occupied:hover {
    background: rgba(255, 152, 0, 0.25);
    border-color: #ffa726;
}

[data-theme="dark"] .move-cell.hover {
    background: #818cf8;
    border-color: #6366f1;
}

[data-theme="dark"] .scroll-btn {
    background: #334155;
    border-color: #475569;
    color: #94a3b8;
}

[data-theme="dark"] .scroll-btn:hover:not(:disabled) {
    background: rgba(129, 140, 248, 0.15);
    border-color: #818cf8;
}

[data-theme="dark"] .scroll-info {
    color: #94a3b8;
}

[data-theme="dark"] .move-grid-scroll-controls {
    border-top-color: #475569;
}

[data-theme="dark"] .move-grid-legend {
    border-top-color: #334155;
}

[data-theme="dark"] .legend-item {
    color: #94a3b8;
}

[data-theme="dark"] .legend-color.current {
    background: rgba(129, 140, 248, 0.25);
    border-color: #818cf8;
}

[data-theme="dark"] .legend-color.occupied {
    background: rgba(255, 152, 0, 0.15);
    border-color: #ff9800;
}

[data-theme="dark"] .legend-color.hover {
    background: #818cf8;
    border-color: #6366f1;
}

[data-theme="dark"] .move-panel-footer {
    background: #334155;
    border-top-color: #475569;
    color: #94a3b8;
}

[data-theme="dark"] .occupied-indicator {
    color: #ffb74d;
}

@media (max-width: 500px) {
    [data-theme="dark"] .widget-controls {
        background: rgba(30, 41, 59, 0.95);
    }
}

/* ============================================================
   DashboardDesignGrid — design widgets
   ============================================================ */
[data-theme="dark"] .design-widget {
    background: #1e293b;
    box-shadow: 0 2px 8px rgba(0,0,0,0.3);
}

[data-theme="dark"] .design-widget:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.4);
}

[data-theme="dark"] .widget-design-body {
    background: #334155;
}

[data-theme="dark"] .widget-placeholder {
    color: #475569;
}

[data-theme="dark"] .drop-zone.active {
    background: rgba(129, 140, 248, 0.1);
}

[data-theme="dark"] .resize-handle:hover {
    background: #818cf8;
}

/* ============================================================
   WidgetPropertiesPanel — edit panel
   ============================================================ */
[data-theme="dark"] .widget-properties-panel {
    background: #1e293b;
    box-shadow: 0 25px 80px rgba(0, 0, 0, 0.6);
}

[data-theme="dark"] .widget-properties-panel .panel-header {
    background: #334155;
    border-bottom-color: #475569;
}

[data-theme="dark"] .widget-properties-panel .close-btn {
    color: #94a3b8;
}

[data-theme="dark"] .widget-properties-panel .close-btn:hover {
    background: #334155;
    color: #e2e8f0;
}

[data-theme="dark"] .widget-properties-panel .panel-footer {
    background: #334155;
    border-top-color: #475569;
}

[data-theme="dark"] .widget-properties-panel::before {
    background: #475569;
}

/* ============================================================
   WidgetPropertyPanel — small property panel
   ============================================================ */
[data-theme="dark"] .property-panel .panel-header {
    background: #334155;
    border-bottom-color: #475569;
}

[data-theme="dark"] .color-picker-row span {
    color: #94a3b8;
}

/* ============================================================
   MobileWidgetStack
   ============================================================ */
[data-theme="dark"] .mobile-widget-stack {
    background: #0f172a;
}

[data-theme="dark"] .mobile-widget-card {
    background: #0f172a;
}

[data-theme="dark"] .mobile-widget-header {
    background: rgba(255, 255, 255, 0.02);
    border-bottom-color: #1e293b;
}

[data-theme="dark"] .widget-title {
    color: #e2e8f0;
}

/* ============================================================
   MobileBottomSheet
   ============================================================ */
[data-theme="dark"] .bottom-sheet {
    background: #1e293b;
}

[data-theme="dark"] .handle-bar {
    background: #475569;
}

[data-theme="dark"] .sheet-header {
    border-bottom-color: #334155;
}

[data-theme="dark"] .sheet-title {
    color: #e2e8f0;
}

[data-theme="dark"] .sheet-actions {
    border-top-color: #334155;
    background: #1e293b;
}

/* ============================================================
   AdaptiveDashboardContainer
   ============================================================ */
[data-theme="dark"] .mobile-edit-warning {
    background: #1e293b;
    box-shadow: 0 -2px 8px rgba(0,0,0,0.4);
}

/* ============================================================
   PublicDashboard — container, header, footer, widgets
   ============================================================ */
[data-theme="dark"] .dashboard-container {
    background: #0f172a;
}

[data-theme="dark"] .dashboard-header {
    background: #1e293b;
}

[data-theme="dark"] .dashboard-footer {
    background: #0f172a;
}

[data-theme="dark"] .dashboard-container .dashboard-widget-modern {
    background-color: #1e293b;
    border-color: #334155;
}

[data-theme="dark"] .dashboard-container .widget-card {
    background-color: #1e293b;
}

[data-theme="dark"] .dashboard-container .table-datagrid .mud-table-head th {
    background: #334155 !important;
    color: #cbd5e1;
    border-bottom-color: #475569;
}

[data-theme="dark"] .dashboard-container .table-datagrid .mud-table-body td {
    color: #e2e8f0;
    border-bottom-color: #334155;
}

[data-theme="dark"] .dashboard-container .table-datagrid .mud-table-pagination {
    background: #334155;
    border-top-color: #475569;
}

/* Loading container for public dashboard */
[data-theme="dark"] .loading-container {
    background: #0f172a;
}

/* ============================================================
   WidgetPropertiesPanel — panel content, tabs, text colors
   ============================================================ */
[data-theme="dark"] .widget-properties-panel .panel-content {
    background: #1e293b;
    color: #e2e8f0;
}

[data-theme="dark"] .widget-properties-panel .widget-tabs .mud-tabs-toolbar {
    background: #334155;
}

[data-theme="dark"] .widget-properties-panel .widget-tabs .mud-tab {
    color: #94a3b8;
}

[data-theme="dark"] .widget-properties-panel .widget-tabs .mud-tab.mud-tab-active {
    color: #a5b4fc;
}

[data-theme="dark"] .widget-properties-panel .tab-panel-content {
    background: #1e293b;
    color: #e2e8f0;
}

/* MudTextField / MudSelect / form inputs inside the panel */
[data-theme="dark"] .widget-properties-panel .mud-input-root {
    color: #e2e8f0;
}

[data-theme="dark"] .widget-properties-panel .mud-input-outlined .mud-input-outlined-border {
    border-color: #475569;
}

[data-theme="dark"] .widget-properties-panel .mud-input-label {
    color: #64748b;
}

[data-theme="dark"] .widget-properties-panel .mud-input-helper-text {
    color: #64748b;
}

/* ============================================================
   MudPaper dark overrides (MudBlazor surface)
   ============================================================ */
[data-theme="dark"] .mud-paper {
    background-color: var(--color-surface, #1e1e2e);
}

/* MudTable inside dark mode */
[data-theme="dark"] .mud-table {
    background-color: #252530;
}

[data-theme="dark"] .mud-table .mud-table-head th {
    background: #334155 !important;
    color: #cbd5e1;
}

[data-theme="dark"] .mud-table .mud-table-body td {
    color: #e2e8f0;
}

/* MudTabs dark mode */
[data-theme="dark"] .mud-tabs-toolbar {
    background: #334155;
}

/* MudAlert dark mode */
[data-theme="dark"] .mud-alert {
    color: #e2e8f0;
}

/* MudDivider dark mode */
[data-theme="dark"] .mud-divider {
    border-color: #334155;
}

/* ============================================================
   GLOBAL DARK MODE — Body & Root Elements
   Ensures no white background leaks through any component.
   ============================================================ */
[data-theme="dark"] body {
    background-color: #0f172a;
    color: #e2e8f0;
}

[data-theme="dark"] #app {
    background-color: #0f172a;
}

/* ============================================================
   GLOBAL DARK MODE — MudBlazor Component Overrides
   Comprehensive overrides for ALL MudBlazor components.
   ============================================================ */

/* MudDialog */
[data-theme="dark"] .mud-dialog {
    background-color: #1e293b;
    color: #e2e8f0;
}

[data-theme="dark"] .mud-dialog .mud-dialog-title {
    color: #ffffff;
}

[data-theme="dark"] .mud-dialog .mud-dialog-content {
    color: #e2e8f0;
}

[data-theme="dark"] .mud-dialog .mud-dialog-actions {
    background-color: #334155;
    border-top: 1px solid #334155;
}

/* MudCard */
[data-theme="dark"] .mud-card {
    background-color: #1e293b;
    color: #e2e8f0;
}

[data-theme="dark"] .mud-card-header {
    color: #ffffff;
}

/* MudExpansionPanel */
[data-theme="dark"] .mud-expand-panel {
    background-color: #1e293b;
    color: #e2e8f0;
}

[data-theme="dark"] .mud-expand-panel .mud-expand-panel-header {
    color: #e2e8f0;
}

/* MudTextField, MudSelect, MudAutocomplete */
[data-theme="dark"] .mud-input {
    color: #e2e8f0 !important;
}

[data-theme="dark"] .mud-input-root {
    color: #e2e8f0;
}

[data-theme="dark"] .mud-input-outlined .mud-input-outlined-border {
    border-color: #475569;
}

[data-theme="dark"] .mud-input-label {
    color: #64748b !important;
}

[data-theme="dark"] .mud-input-label.mud-input-label-animated {
    color: #64748b !important;
}

[data-theme="dark"] .mud-input-helper-text {
    color: #64748b;
}

[data-theme="dark"] .mud-input-adornment {
    color: #64748b;
}

/* MudSelect menu items */
[data-theme="dark"] .mud-list {
    background-color: #1e293b;
    color: #e2e8f0;
}

[data-theme="dark"] .mud-list-item {
    color: #e2e8f0;
}

[data-theme="dark"] .mud-list-item:hover {
    background-color: rgba(129, 140, 248, 0.12);
}

[data-theme="dark"] .mud-list-item.mud-selected-item {
    background-color: rgba(129, 140, 248, 0.2);
}

/* MudPopover / MudMenu dropdown */
[data-theme="dark"] .mud-popover {
    background-color: #1e293b;
    color: #e2e8f0;
}

/* MudMenu */
[data-theme="dark"] .mud-menu {
    background-color: #1e293b;
}

[data-theme="dark"] .mud-navmenu .mud-nav-link {
    color: #e2e8f0;
}

/* MudTooltip */
[data-theme="dark"] .mud-tooltip {
    background-color: #334155;
    color: #e2e8f0;
}

/* MudChip */
[data-theme="dark"] .mud-chip.mud-chip-outlined {
    border-color: #475569;
    color: #e2e8f0;
}

/* MudSwitch */
[data-theme="dark"] .mud-switch-label {
    color: #e2e8f0;
}

/* MudCheckBox */
[data-theme="dark"] .mud-checkbox-label {
    color: #e2e8f0;
}

/* MudRadio */
[data-theme="dark"] .mud-radio-label {
    color: #e2e8f0;
}

/* MudSnackbar */
[data-theme="dark"] .mud-snackbar {
    background-color: #334155;
    color: #e2e8f0;
}

/* MudBreadcrumbs */
[data-theme="dark"] .mud-breadcrumbs li {
    color: #94a3b8;
}

/* MudNumericField */
[data-theme="dark"] .mud-input-control .mud-input {
    color: #e2e8f0 !important;
}

/* MudDrawer */
[data-theme="dark"] .mud-drawer {
    background-color: #1e293b;
    color: #e2e8f0;
}

/* MudAppBar */
[data-theme="dark"] .mud-appbar {
    background-color: #1e293b;
}

/* ============================================================
   GLOBAL DARK MODE — Generic Inline Style Overrides
   Uses attribute selectors to override common inline style patterns.
   ============================================================ */

/* Override MudPaper with light inline backgrounds */
[data-theme="dark"] .mud-paper[style*="background-color: #fff3e0"],
[data-theme="dark"] .mud-paper[style*="background-color: #e3f2fd"],
[data-theme="dark"] .mud-paper[style*="background-color: #f5f5f5"] {
    background-color: #1e293b !important;
    color: #e2e8f0 !important;
}

/* Generic light background overrides via attribute selectors */
[data-theme="dark"] div[style*="background-color: #f5f5f5"],
[data-theme="dark"] div[style*="background-color: #e0e0e0"],
[data-theme="dark"] div[style*="background: #f5f5f5"],
[data-theme="dark"] div[style*="background: white"],
[data-theme="dark"] div[style*="background-color: white"],
[data-theme="dark"] div[style*="background: #fff"] {
    background-color: #1e293b !important;
    background: #1e293b !important;
    color: #e2e8f0 !important;
}

/* Linear gradient overrides for light gradients */
[data-theme="dark"] div[style*="linear-gradient(135deg, #f5f7fa"],
[data-theme="dark"] div[style*="linear-gradient(135deg, #e3f2fd"],
[data-theme="dark"] div[style*="linear-gradient(135deg, #f3e5f5"],
[data-theme="dark"] div[style*="linear-gradient(135deg, #e8f5e9"],
[data-theme="dark"] div[style*="linear-gradient(135deg, #f5f7fa 0%, #e4e8ec 100%)"],
[data-theme="dark"] div[style*="linear-gradient(135deg, #f5f7fa 0%, #e4e8eb 100%)"] {
    background: #1e293b !important;
    color: #e2e8f0 !important;
}

/* Code blocks */
[data-theme="dark"] code {
    color: #a5b4fc;
}

/* Links */
[data-theme="dark"] a:not(.mud-button-root):not(.mud-nav-link):not(.reload) {
    color: #a5b4fc;
}

/* ============================================================
   DARK MODE — QueryEditor SQL Explorer Sidebar
   ============================================================ */
[data-theme="dark"] .schema-tree {
    color: #e2e8f0;
}

[data-theme="dark"] .schema-tree .table-item,
[data-theme="dark"] .schema-tree .column-item {
    color: #e2e8f0;
}

[data-theme="dark"] .view-item {
    border-color: #334155;
}

[data-theme="dark"] .view-name {
    color: #e2e8f0;
}

[data-theme="dark"] .view-row-count {
    color: #94a3b8;
}

/* ============================================================
   DARK MODE — Data Model Diagram
   ============================================================ */
[data-theme="dark"] div[style*="background: linear-gradient(135deg, #f5f7fa 0%, #e4e8ec 100%)"] {
    background: #1e293b !important;
}

/* ============================================================
   DARK MODE — Onboarding Wizard
   ============================================================ */
[data-theme="dark"] div[style*="background-color: #fafafa"] {
    background-color: #1e293b !important;
}

[data-theme="dark"] div[style*="color: #333"] {
    color: #e2e8f0 !important;
}

[data-theme="dark"] div[style*="color: #666"] {
    color: #b0b0b0 !important;
}

[data-theme="dark"] div[style*="color: #999"] {
    color: #888 !important;
}

/* ============================================================
   DARK MODE — Report Designer & Viewer
   ============================================================ */
[data-theme="dark"] div[style*="background-color: #e0e0e0"] {
    background-color: #0f172a !important;
}

/* ============================================================
   DARK MODE — Shepherd.js Tour Overlay
   ============================================================ */
[data-theme="dark"] .shepherd-element .shepherd-content {
    background-color: #1e293b;
}

[data-theme="dark"] .shepherd-text {
    color: #e2e8f0;
}

[data-theme="dark"] .shepherd-footer {
    border-top-color: #334155;
}

[data-theme="dark"] .shepherd-arrow:before {
    background: #1e293b;
}

/* ============================================================
   DARK MODE — PublicDashboardLayout
   ============================================================ */
[data-theme="dark"] .public-dashboard-layout {
    background-color: #0f172a;
    color: #e2e8f0;
}

/* ============================================================
   DARK MODE — Loading Shimmer Override
   ============================================================ */
[data-theme="dark"] .loading-shimmer,
[data-theme="dark"] div[style*="linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%)"] {
    background: linear-gradient(90deg, #1e293b 25%, #334155 50%, #1e293b 75%) !important;
    background-size: 400px 100% !important;
}

/* ============================================================
   DARK MODE — ApexCharts global
   ============================================================ */
[data-theme="dark"] .apexcharts-canvas {
    background: transparent !important;
}

[data-theme="dark"] .apexcharts-legend-text {
    color: #e2e8f0 !important;
}

/* ============================================================
   DARK MODE — Sankey fallback notice
   ============================================================ */
[data-theme="dark"] .sankey-fallback-notice,
[data-theme="dark"] div[style*="background: #fff3e0"] {
    background: #1e293b !important;
    color: #ffb74d !important;
}

/* ============================================================
   DARK MODE — Scrollbar Styling
   ============================================================ */
[data-theme="dark"] ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

[data-theme="dark"] ::-webkit-scrollbar-track {
    background: #0f172a;
}

[data-theme="dark"] ::-webkit-scrollbar-thumb {
    background: #334155;
    border-radius: 4px;
}

[data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
    background: #475569;
}

/* ============================================================
   DARK MODE — MudContainer, MudMainContent generic surfaces
   ============================================================ */
[data-theme="dark"] .mud-main-content {
    background-color: #0f172a;
}

[data-theme="dark"] .mud-container {
    background-color: #0f172a;
    color: #e2e8f0;
}

/* Override inline hardcoded light backgrounds in dark mode */
[data-theme="dark"] div[style*="background-color: #f5f5f5"],
[data-theme="dark"] div[style*="background-color:#f5f5f5"] {
    background-color: #1e293b !important;
}

[data-theme="dark"] div[style*="background-color: #e0e0e0"],
[data-theme="dark"] div[style*="background-color:#e0e0e0"] {
    background-color: #334155 !important;
}

[data-theme="dark"] div[style*="background: white"],
[data-theme="dark"] div[style*="background:white"],
[data-theme="dark"] div[style*="background-color: white"],
[data-theme="dark"] div[style*="background-color:white"] {
    background-color: #1e293b !important;
    background: #1e293b !important;
}

[data-theme="dark"] div[style*="background: linear-gradient(135deg, #f5f7fa"] {
    background: linear-gradient(135deg, #1e293b 0%, #334155 100%) !important;
}

[data-theme="dark"] div[style*="background: #e3f2fd"] {
    background: #1e293b !important;
}

/* ============================================================
   DARK MODE — Semantic Layer Panel, Column Profiling
   ============================================================ */
[data-theme="dark"] .semantic-layer-panel {
    background-color: #1e293b;
    color: #e2e8f0;
}

/* ============================================================
   DARK MODE — Syncfusion PivotView / Grid
   These overrides complement the material3-dark.css theme
   for better visual integration with the dashboard dark mode.
   ============================================================ */
[data-theme="dark"] .pivot-widget-container {
    background: #1e293b;
}

[data-theme="dark"] .e-pivotview {
    background: #1e293b !important;
    color: #e2e8f0 !important;
}

[data-theme="dark"] .e-pivotview .e-grid {
    border-color: #475569 !important;
    background: #1e293b !important;
}

[data-theme="dark"] .e-pivotview .e-grid .e-headercell,
[data-theme="dark"] .e-pivotview .e-grid .e-headercontent {
    background: #334155 !important;
    color: #e2e8f0 !important;
    border-color: #475569 !important;
}

[data-theme="dark"] .e-pivotview .e-grid .e-rowcell {
    color: #e2e8f0 !important;
    border-color: #334155 !important;
    background: #1e293b !important;
}

[data-theme="dark"] .e-pivotview .e-grid .e-rowcell:hover,
[data-theme="dark"] .e-pivotview .e-grid .e-row:hover .e-rowcell {
    background: #334155 !important;
}

[data-theme="dark"] .e-pivotview .e-grid .e-summarycell {
    background: #334155 !important;
    color: #e2e8f0 !important;
    border-color: #475569 !important;
}

[data-theme="dark"] .e-pivotview .e-grouping-bar,
[data-theme="dark"] .e-pivotview .e-group-row,
[data-theme="dark"] .e-pivotview .e-group-column,
[data-theme="dark"] .e-pivotview .e-group-value,
[data-theme="dark"] .e-pivotview .e-group-filter {
    background: #334155 !important;
    color: #e2e8f0 !important;
    border-color: #475569 !important;
}

[data-theme="dark"] .e-pivotview .e-field-list,
[data-theme="dark"] .e-pivotfieldlist {
    background: #1e293b !important;
    color: #e2e8f0 !important;
}

[data-theme="dark"] .e-pivotview .e-pivot-button,
[data-theme="dark"] .e-pivotview .e-pvt-btn {
    background: #334155 !important;
    color: #e2e8f0 !important;
    border-color: #475569 !important;
}

[data-theme="dark"] .e-pivotview .e-icons {
    color: #94a3b8 !important;
}

[data-theme="dark"] .e-pivotview .e-grid .e-content {
    background: #1e293b !important;
}

[data-theme="dark"] .e-pivotview .e-grid .e-gridheader {
    border-color: #475569 !important;
}

/* Table widget dark mode enhancements */
[data-theme="dark"] .table-widget-container {
    background: #1e293b;
    border-color: #475569;
}

/* ============================================================
   DARK MODE — Monaco Editor (SQL)
   ============================================================ */
[data-theme="dark"] .monaco-editor {
    background-color: #1e293b;
}
