/* SuperNova Dark Theme */
/* Applied when data-theme="dark" */

:root[data-theme="dark"] {
    /* Surface Colors */
    --sn-white: #1a1d24;
    --sn-parchment: #0f172a;
    --sn-bg: #12151a;
    --sn-bg-dark: #0f172a;

    /* Text Colors */
    --sn-text: #e5e7eb;
    --sn-text-dark: #f8fafc;
    --sn-text-muted: #9ca3af;
    --sn-text-light: #6b7280;

    /* Border Colors */
    --sn-border: #374151;
    --sn-border-light: #2d3748;

    /* Shadows (darker for dark mode) */
    --sn-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.2);
    --sn-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.3), 0 2px 4px -2px rgba(0, 0, 0, 0.2);
    --sn-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.4), 0 4px 6px -4px rgba(0, 0, 0, 0.3);
    --sn-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.5), 0 8px 10px -6px rgba(0, 0, 0, 0.4);

    /* Header */
    --sn-header-bg: rgba(15, 23, 42, 0.95);

    /* Hero overlay */
    --sn-hero-overlay: linear-gradient(to right, rgba(15, 23, 42, 0.95) 0%, rgba(15, 23, 42, 0.8) 40%, rgba(15, 23, 42, 0.4) 70%, transparent 100%);

    /* Primary colors adjusted for dark mode (brighter for better visibility) */
    --sn-primary: #3b82f6;
    --sn-primary-light: #60a5fa;
    --sn-primary-dark: #2563eb;

    /* Dashboard card backgrounds (slightly more visible in dark mode) */
    --sn-dashboard-primary-bg: rgba(59, 130, 246, 0.15);
    --sn-dashboard-success-bg: rgba(34, 197, 94, 0.15);
    --sn-dashboard-info-bg: rgba(14, 165, 233, 0.15);
    --sn-dashboard-warning-bg: rgba(245, 158, 11, 0.15);

    /* Radzen CSS Variable Overrides */
    --rz-base-background-color: var(--sn-parchment);
    --rz-base-color: var(--sn-text);

    /* Card styling */
    --rz-card-background-color: var(--sn-white);
    --rz-card-border: 1px solid var(--sn-border);

    /* Text colors */
    --rz-text-color: var(--sn-text);
    --rz-text-secondary-color: var(--sn-text-muted);
    --rz-text-tertiary-color: var(--sn-text-light);
    --rz-text-h1-color: var(--sn-text-dark);
    --rz-text-h2-color: var(--sn-text-dark);
    --rz-text-h3-color: var(--sn-text-dark);
    --rz-text-h4-color: var(--sn-text-dark);
    --rz-text-h5-color: var(--sn-text-dark);
    --rz-text-h6-color: var(--sn-text-dark);

    /* Input/Form styling */
    --rz-input-background-color: var(--sn-bg);
    --rz-input-color: var(--sn-text);
    --rz-input-border: 1px solid var(--sn-border);
    --rz-input-focus-border: var(--sn-primary-light);
    --rz-input-placeholder-color: var(--sn-text-light);

    /* Form field styling */
    --rz-form-field-background-color: var(--sn-bg);
    --rz-form-field-border-color: var(--sn-border);
    --rz-form-field-label-color: var(--sn-text-muted);

    /* Button styling */
    --rz-button-background-color: var(--sn-bg);
    --rz-button-color: var(--sn-text);

    /* Badge styling */
    --rz-badge-background-color: var(--sn-primary-light);

    /* DataGrid/Table styling */
    --rz-grid-header-background-color: var(--sn-bg);
    --rz-grid-header-color: var(--sn-text-dark);
    --rz-grid-cell-background-color: var(--sn-white);
    --rz-grid-cell-color: var(--sn-text);
    --rz-grid-row-hover-background-color: var(--sn-bg);
    --rz-grid-border-color: var(--sn-border);
    --rz-data-grid-header-background-color: var(--sn-bg);
    --rz-data-grid-cell-background-color: var(--sn-white);
    --rz-datatable-header-background-color: var(--sn-bg);
    --rz-datatable-cell-background-color: var(--sn-white);

    /* Dropdown styling */
    --rz-dropdown-background-color: var(--sn-bg);
    --rz-dropdown-item-hover-background-color: var(--sn-border);

    /* Progress bar */
    --rz-progressbar-track-color: var(--sn-border);
    --rz-progressbar-value-color: var(--sn-primary-light);
}

/* Additional dark mode class for legacy compatibility */
body.dark-mode {
    background-color: var(--sn-parchment);
    color: var(--sn-text);
}