/*
 * Fieldale.Logging.Blazor – Dashboard Theme Variables
 *
 * All colors are expressed as CSS custom properties on .fld-dashboard.
 * The "default" theme preserves existing Bootstrap-bright values.
 * The "neutral" theme desaturates everything for dark-sidebar host apps.
 *
 * Consumers can override any --fld-* variable in their own stylesheet.
 */

/* ------------------------------------------------------------------ */
/*  DEFAULT THEME  (matches current hardcoded look)                   */
/* ------------------------------------------------------------------ */
.fld-dashboard {
    /* --- Status / Bootstrap-mapped colors --- */
    --fld-color-danger:    #dc3545;
    --fld-color-warning:   #ffc107;
    --fld-color-success:   #198754;
    --fld-color-info:      #0dcaf0;
    --fld-color-primary:   #0d6efd;
    --fld-color-secondary: #6c757d;

    /* --- Bootstrap RGB overrides (scoped) --- */
    --bs-danger-rgb:    220, 53, 69;
    --bs-warning-rgb:   255, 193, 7;
    --bs-success-rgb:   25, 135, 84;
    --bs-info-rgb:      13, 202, 240;
    --bs-primary-rgb:   13, 110, 253;
    --bs-secondary-rgb: 108, 117, 125;

    /* --- Code / dark surfaces --- */
    --fld-code-bg:      #0b1120;
    --fld-code-text:    #f8fafc;
    --fld-code-border:  #1e293b;
    --fld-json-bg:      #0f172a;
    --fld-json-text:    #e2e8f0;

    /* --- Surfaces --- */
    --fld-surface:         #fff;
    --fld-surface-muted:   #f8f9fa;
    --fld-surface-alt:     #f8fafc;
    --fld-inline-code-bg:  #f3f4f6;

    /* --- Borders --- */
    --fld-border:        #e5e7eb;
    --fld-border-error:  #fecaca;

    /* --- Error palette --- */
    --fld-error-bg:            #fef2f2;
    --fld-error-bg-alt:        #fff5f5;
    --fld-error-text:          #842029;
    --fld-error-text-strong:   #b91c1c;
    --fld-error-accent:        #ef4444;
    --fld-error-border:        #f5c2c7;

    /* --- Subtle badges --- */
    --fld-badge-danger-bg:   #fee2e2;
    --fld-badge-danger-text:  #7f1d1d;
    --fld-badge-info-bg:     #dbeafe;
    --fld-badge-info-text:   #1e3a8a;

    /* --- Accents --- */
    --fld-accent:          #38bdf8;
    --fld-accent-strong:   #1d4ed8;
    --fld-timeline-line:   #cbd5f5;

    /* --- Overlays / modals --- */
    --fld-overlay:        rgba(0, 0, 0, 0.55);
    --fld-overlay-dark:   rgba(15, 23, 42, 0.7);
    --fld-shadow:         0 20px 60px rgba(0, 0, 0, 0.25);
    --fld-shadow-subtle:  0 4px 12px rgba(15, 23, 42, 0.05);

    /* --- Meta --- */
    --fld-meta-text:            #475569;
    --fld-error-accent-glow:    rgba(239, 68, 68, 0.25);
}


/* ------------------------------------------------------------------ */
/*  NEUTRAL THEME  (muted, works with dark sidebars)                  */
/* ------------------------------------------------------------------ */
.fld-dashboard[data-fld-theme="neutral"] {
    /* --- Status colors (desaturated) --- */
    --fld-color-danger:    #a85560;
    --fld-color-warning:   #b8a040;
    --fld-color-success:   #4e8a6a;
    --fld-color-info:      #5a9aaa;
    --fld-color-primary:   #5a7dbf;
    --fld-color-secondary: #7a8490;

    /* --- Bootstrap RGB overrides (muted) --- */
    --bs-danger-rgb:    168, 85, 96;
    --bs-warning-rgb:   184, 160, 64;
    --bs-success-rgb:   78, 138, 106;
    --bs-info-rgb:      90, 154, 170;
    --bs-primary-rgb:   90, 125, 191;
    --bs-secondary-rgb: 122, 132, 144;

    /* --- Code / dark surfaces (slightly lighter) --- */
    --fld-code-bg:      #1e2433;
    --fld-code-text:    #d4d8e0;
    --fld-code-border:  #2d3548;
    --fld-json-bg:      #1a2030;
    --fld-json-text:    #c8cdd6;

    /* --- Surfaces (warmer neutrals) --- */
    --fld-surface:         #fff;
    --fld-surface-muted:   #f5f5f4;
    --fld-surface-alt:     #f7f7f6;
    --fld-inline-code-bg:  #ededec;

    /* --- Borders --- */
    --fld-border:        #d6d3d1;
    --fld-border-error:  #e8c4c0;

    /* --- Error palette (toned down) --- */
    --fld-error-bg:            #faf5f4;
    --fld-error-bg-alt:        #f9f5f4;
    --fld-error-text:          #7a5050;
    --fld-error-text-strong:   #905050;
    --fld-error-accent:        #c07070;
    --fld-error-border:        #ddb8b5;

    /* --- Subtle badges --- */
    --fld-badge-danger-bg:   #f0dcd8;
    --fld-badge-danger-text:  #6a4040;
    --fld-badge-info-bg:     #dde5f0;
    --fld-badge-info-text:   #3a4a6a;

    /* --- Accents --- */
    --fld-accent:          #7aaac0;
    --fld-accent-strong:   #506a9a;
    --fld-timeline-line:   #c0c5d0;

    /* --- Overlays / modals --- */
    --fld-overlay:        rgba(0, 0, 0, 0.45);
    --fld-overlay-dark:   rgba(30, 36, 50, 0.6);
    --fld-shadow:         0 16px 48px rgba(0, 0, 0, 0.18);
    --fld-shadow-subtle:  0 3px 10px rgba(30, 36, 50, 0.06);

    /* --- Meta --- */
    --fld-meta-text:            #64706a;
    --fld-error-accent-glow:    rgba(192, 112, 112, 0.2);
}