@import 'https://fonts.googleapis.com/css2?family=Fira+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap';

:root {
    /* ==========================================
       OptiFlex 4PL Enterprise Color System
       Based on brand colors from logo
       ========================================== */
    
    /* Core Surfaces */
    --kendo-color-app-surface: #ffffff;
    --kendo-color-on-app-surface: #0f1724;
    --kendo-color-subtle: #6b7280;
    --kendo-color-surface: #f8fafc;
    --kendo-color-surface-alt: #ffffff;
    --kendo-color-on-surface: #0b1220;
    --kendo-color-on-surface-alt: #1e2256;
    
    /* Borders */
    --kendo-color-border: rgba(30, 34, 86, 0.12);
    --kendo-color-border-alt: rgba(30, 34, 86, 0.08);
    
    /* Base Color (Navy Blue) */
    --kendo-color-base: #1e2256;
    --kendo-color-base-hover: #17203f;
    --kendo-color-base-active: #0f1a33;
    --kendo-color-base-subtle: #e9edf8;
    --kendo-color-base-subtle-hover: #dfe6f4;
    --kendo-color-base-subtle-active: #d4ddf0;
    --kendo-color-on-base: #ffffff;
    --kendo-color-base-emphasis: #0b1220;
    --kendo-color-base-on-subtle: #1e2256;
    --kendo-color-base-on-surface: #1e2256;
    
    /* Primary (Navy Blue - Brand Color) */
    --kendo-color-primary: #1e2256;
    --kendo-color-primary-hover: #2a2f6b;
    --kendo-color-primary-active: #363d80;
    --kendo-color-primary-subtle: #eef2fa;
    --kendo-color-primary-subtle-hover: #e4eaf8;
    --kendo-color-primary-subtle-active: #d9e1f4;
    --kendo-color-on-primary: #ffffff;
    --kendo-color-primary-emphasis: #0b1220;
    --kendo-color-primary-on-subtle: #1e2256;
    --kendo-color-primary-on-surface: #1e2256;
    
    /* Secondary (Orange - Call-to-Action) */
    --kendo-color-secondary: #f05a2d;
    --kendo-color-secondary-hover: #f37a52;
    --kendo-color-secondary-active: #f5936f;
    --kendo-color-secondary-subtle: #fef3ef;
    --kendo-color-secondary-subtle-hover: #fde8e0;
    --kendo-color-secondary-subtle-active: #fcddd1;
    --kendo-color-on-secondary: #ffffff;
    --kendo-color-secondary-emphasis: #c0471f;
    --kendo-color-secondary-on-subtle: #f05a2d;
    --kendo-color-secondary-on-surface: #f37a52;
    
    /* Tertiary (Light Blue - Accent) */
    --kendo-color-tertiary: #b7cbe9;
    --kendo-color-tertiary-hover: #c5d6ed;
    --kendo-color-tertiary-active: #d3e0f1;
    --kendo-color-tertiary-subtle: #f6f9fd;
    --kendo-color-tertiary-subtle-hover: #f0f5fb;
    --kendo-color-tertiary-subtle-active: #e9f0f9;
    --kendo-color-on-tertiary: #0b1220;
    --kendo-color-tertiary-emphasis: #92acd8;
    --kendo-color-tertiary-on-subtle: #5d84bf;
    --kendo-color-tertiary-on-surface: #7d9ed1;
    
    /* Info (Professional Blue) */
    --kendo-color-info: #2b7ed2;
    --kendo-color-info-hover: #4d95dc;
    --kendo-color-info-active: #6faae4;
    --kendo-color-info-subtle: #e8f3fb;
    --kendo-color-info-subtle-hover: #d9ebf9;
    --kendo-color-info-subtle-active: #c9e3f6;
    --kendo-color-info-emphasis: #1e5c9a;
    --kendo-color-on-info: #ffffff;
    --kendo-color-info-on-subtle: #2b7ed2;
    --kendo-color-info-on-surface: #4d95dc;
    
    /* Success (Professional Green) */
    --kendo-color-success: #2e9d5a;
    --kendo-color-success-hover: #3fb167;
    --kendo-color-success-active: #52c178;
    --kendo-color-success-subtle: #ebf7f0;
    --kendo-color-success-subtle-hover: #ddf2e6;
    --kendo-color-success-subtle-active: #cfeddc;
    --kendo-color-success-emphasis: #237a45;
    --kendo-color-on-success: #ffffff;
    --kendo-color-success-on-subtle: #2e9d5a;
    --kendo-color-success-on-surface: #3fb167;
    
    /* Warning (Professional Amber) */
    --kendo-color-warning: #e8a028;
    --kendo-color-warning-hover: #ebb04a;
    --kendo-color-warning-active: #eec06b;
    --kendo-color-warning-subtle: #fdf8ec;
    --kendo-color-warning-subtle-hover: #fcf3df;
    --kendo-color-warning-subtle-active: #faeed2;
    --kendo-color-warning-emphasis: #b87f1f;
    --kendo-color-on-warning: #ffffff;
    --kendo-color-warning-on-subtle: #e8a028;
    --kendo-color-warning-on-surface: #ebb04a;
    
    /* Error (Professional Red) */
    --kendo-color-error: #d64545;
    --kendo-color-error-hover: #dd6565;
    --kendo-color-error-active: #e48585;
    --kendo-color-error-subtle: #fceded;
    --kendo-color-error-subtle-hover: #fae1e1;
    --kendo-color-error-subtle-active: #f7d5d5;
    --kendo-color-error-emphasis: #ab3636;
    --kendo-color-on-error: #ffffff;
    --kendo-color-error-on-subtle: #d64545;
    --kendo-color-error-on-surface: #dd6565;
    
    /* Light & Dark */
    --kendo-color-light: #f8fafc;
    --kendo-color-light-hover: #f1f5f9;
    --kendo-color-light-active: #e2e8f0;
    --kendo-color-light-subtle: #fefefe;
    --kendo-color-light-subtle-hover: #fdfdfd;
    --kendo-color-light-subtle-active: #fcfcfc;
    --kendo-color-light-emphasis: #cbd5e1;
    --kendo-color-on-light: #0f1724;
    --kendo-color-light-on-surface: #f1f5f9;
    --kendo-color-light-on-subtle: #475569;
    
    --kendo-color-dark: #0b1220;
    --kendo-color-dark-hover: #1e2256;
    --kendo-color-dark-active: #2a2f6b;
    --kendo-color-dark-subtle: #1a1f3a;
    --kendo-color-dark-subtle-hover: #252b4d;
    --kendo-color-dark-subtle-active: #303760;
    --kendo-color-dark-emphasis: #475569;
    --kendo-color-on-dark: #ffffff;
    --kendo-color-dark-on-surface: #cbd5e1;
    --kendo-color-dark-on-subtle: #f8fafc;
    
    /* Chart Series Colors (Data Visualization) */
    --kendo-color-series-a: #1e2256;          /* Primary Navy */
    --kendo-color-series-a-bold: #16194a;
    --kendo-color-series-a-bolder: #0f112b;
    --kendo-color-series-a-subtle: #565980;
    --kendo-color-series-a-subtler: #8e90aa;
    
    --kendo-color-series-b: #2b7ed2;          /* Info Blue */
    --kendo-color-series-b-bold: #205e9d;
    --kendo-color-series-b-bolder: #153f69;
    --kendo-color-series-b-subtle: #609edd;
    --kendo-color-series-b-subtler: #95bee8;
    
    --kendo-color-series-c: #b7cbe9;          /* Tertiary Light Blue */
    --kendo-color-series-c-bold: #8998af;
    --kendo-color-series-c-bolder: #5b6574;
    --kendo-color-series-c-subtle: #c9d8ee;
    --kendo-color-series-c-subtler: #dbe5f4;
    
    --kendo-color-series-d: #6b7280;          /* Neutral Gray */
    --kendo-color-series-d-bold: #505560;
    --kendo-color-series-d-bolder: #353940;
    --kendo-color-series-d-subtle: #90959f;
    --kendo-color-series-d-subtler: #b5b8bf;
    
    --kendo-color-series-e: #f05a2d;          /* Secondary Orange */
    --kendo-color-series-e-bold: #b44321;
    --kendo-color-series-e-bolder: #782d16;
    --kendo-color-series-e-subtle: #f38361;
    --kendo-color-series-e-subtler: #f7ac96;
    
    --kendo-color-series-f: #e6eef8;          /* Very Light Blue */
    --kendo-color-series-f-bold: #acb2ba;
    --kendo-color-series-f-bolder: #73777c;
    --kendo-color-series-f-subtle: #ecf2fa;
    --kendo-color-series-f-subtler: #f2f6fb;
    
    /* Typography */
    --kendo-font-family: 'Fira Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
    --kendo-font-size: 14px;
    --kendo-font-size-xs: 11px;
    --kendo-font-size-sm: 12px;
    --kendo-font-size-md: 14px;
    --kendo-font-size-lg: 16px;
    --kendo-font-size-xl: 20px;
    
    /* Headings */
    --kendo-h1-font-size: 48px;
    --kendo-h2-font-size: 36px;
    --kendo-h3-font-size: 28px;
    --kendo-h4-font-size: 24px;
    --kendo-h5-font-size: 18px;
    --kendo-h6-font-size: 14px;
    
    /* Line Heights */
    --kendo-line-height-xs: 1.2;
    --kendo-line-height-sm: 1.25;
    --kendo-line-height-md: 1.42;
    --kendo-line-height-lg: 1.5;
    --kendo-h1-line-height: 1.2;
    --kendo-h2-line-height: 1.25;
    --kendo-h3-line-height: 1.3;
    --kendo-h4-line-height: 1.35;
    --kendo-h5-line-height: 1.4;
    --kendo-h6-line-height: 1.5;
    
    /* Font Weights */
    --kendo-h1-font-weight: 300;
    --kendo-h2-font-weight: 400;
    --kendo-h3-font-weight: 400;
    --kendo-h4-font-weight: 500;
    --kendo-h5-font-weight: 500;
    --kendo-h6-font-weight: 600;
    
    /* Border Radius */
    --kendo-border-radius-none: 0px;
    --kendo-border-radius-xs: 2px;
    --kendo-border-radius-sm: 4px;
    --kendo-border-radius-md: 6px;
    --kendo-border-radius-lg: 8px;
    --kendo-border-radius-xl: 12px;
    --kendo-border-radius-xxl: 16px;
    --kendo-border-radius-xxxl: 24px;
    --kendo-border-radius-full: 9999px;
    
    /* Shadows (Elevation) */
    --kendo-elevation-1: 0 1px 2px rgba(11, 18, 32, 0.04);
    --kendo-elevation-2: 0 4px 8px rgba(11, 18, 32, 0.06);
    --kendo-elevation-3: 0 8px 16px rgba(11, 18, 32, 0.08);
    --kendo-elevation-4: 0 12px 24px rgba(11, 18, 32, 0.10);
    --kendo-elevation-5: 0 16px 32px rgba(11, 18, 32, 0.12);
    
    /* Spacing Scale */
    --kendo-spacing-0: 0px;
    --kendo-spacing-1: 4px;
    --kendo-spacing-2: 8px;
    --kendo-spacing-3: 12px;
    --kendo-spacing-4: 16px;
    --kendo-spacing-5: 20px;
    --kendo-spacing-6: 24px;
    --kendo-spacing-7: 32px;
    --kendo-spacing-8: 40px;
}

#blazor-error-ui {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

#blazor-error-ui .dismiss {
    cursor: pointer;
    position: absolute;
    right: 0.75rem;
    top: 0.5rem;
}