﻿@import 'https://fonts.googleapis.com/css2?family=Assistant:wght@200..800&display=swap';

:root {
    /* Color System Swatches */
    /* Misc */
    --kendo-color-app-surface: #151828;
    --kendo-color-surface: #2F344C;
    --kendo-color-surface-alt: #232739;
    --kendo-color-on-app-surface: #EFF0F5;
    --kendo-color-subtle: #8E95B9;
    --kendo-color-border: rgba(239, 240, 245, .16);
    --kendo-color-border-alt: rgba(239, 240, 245, .24);
    /*  Base */
    --kendo-color-base-subtle: #414762;
    --kendo-color-base-subtle-hover: #3E4565;
    --kendo-color-base-subtle-active: #464E72;
    --kendo-color-base: #4A506E;
    --kendo-color-base-hover: #4A506E;
    --kendo-color-base-active: #52587A;
    --kendo-color-base-emphasis: #6C749D;
    --kendo-color-on-base: #EFF0F5;
    --kendo-color-base-on-surface: #CDD0E0;
    --kendo-color-base-on-subtle: #EFF0F5;
    /* Primary */
    /* Primary (updated to new main color #00b0f0) */
    --kendo-color-primary-subtle: #11334C;
    --kendo-color-primary-subtle-hover: #10405C;
    --kendo-color-primary-subtle-active: #0E4C6C;
    --kendo-color-primary: #00B0F0;
    --kendo-color-primary-hover: #2EBEF3;
    --kendo-color-primary-active: #52C9F5;
    --kendo-color-primary-emphasis: #0089BB;
    --kendo-color-on-primary: white;
    --kendo-color-primary-on-surface: #00B0F0;
    --kendo-color-primary-on-subtle: #BFEBFB;
    /* Secondary */
    --kendo-color-secondary-subtle: #5E668D;
    --kendo-color-secondary-subtle-hover: #6C749D;
    --kendo-color-secondary-subtle-active: #7C84AC;
    --kendo-color-secondary: #7C84AC;
    --kendo-color-secondary-hover: #8F96B8;
    --kendo-color-secondary-active: #A7ACC8;
    --kendo-color-secondary-emphasis: #A7ACC8;
    --kendo-color-on-secondary: #151828;
    --kendo-color-secondary-on-surface: #A7ACC8;
    --kendo-color-secondary-on-subtle: #EFF0F5;
    /* Tertiary */
    --kendo-color-tertiary-subtle: #1F2F5C;
    --kendo-color-tertiary-subtle-hover: #263B73;
    --kendo-color-tertiary-subtle-active: #2E468A;
    --kendo-color-tertiary: #6681CC;
    --kendo-color-tertiary-hover: #7D94D4;
    --kendo-color-tertiary-active: #94A7DC;
    --kendo-color-tertiary-emphasis: #4665B9;
    --kendo-color-on-tertiary: #1C1D22;
    --kendo-color-tertiary-on-surface: #7D94D4;
    --kendo-color-tertiary-on-subtle: #D1D9F0;
    /* Error */
    --kendo-color-error-subtle: #5E1C1C;
    --kendo-color-error-subtle-hover: #6E2121;
    --kendo-color-error-subtle-active: #852828;
    --kendo-color-error: #DD7E7E;
    --kendo-color-error-hover: #E18E8E;
    --kendo-color-error-active: #E59E9E;
    --kendo-color-error-emphasis: #A53131;
    --kendo-color-on-error: #1C1D22;
    --kendo-color-error-on-surface: #E18E8E;
    --kendo-color-error-on-subtle: #F4D7D7;
    /* Success */
    --kendo-color-success-subtle: #1C5F38;
    --kendo-color-success-subtle-hover: #206E41;
    --kendo-color-success-subtle-active: #257E4A;
    --kendo-color-success: #6AD395;
    --kendo-color-success-hover: #89DCAB;
    --kendo-color-success-active: #A9E5C2;
    --kendo-color-success-emphasis: #2F9D5D;
    --kendo-color-on-success: #1C1D22;
    --kendo-color-success-on-surface: #89DCAB;
    --kendo-color-success-on-subtle: #E0F6E9;
    /* Warning */
    --kendo-color-warning-subtle: #474300;
    --kendo-color-warning-subtle-hover: #5C5600;
    --kendo-color-warning-subtle-active: #706900;
    --kendo-color-warning: #D1C975;
    --kendo-color-warning-hover: #D9D28C;
    --kendo-color-warning-active: #DED89C;
    --kendo-color-warning-emphasis: #9E9410;
    --kendo-color-on-warning: #1C1D22;
    --kendo-color-warning-on-surface: #D9D28C;
    --kendo-color-warning-on-subtle: #F2F0D9;
    /* Info */
    --kendo-color-info-subtle: #243A56;
    --kendo-color-info-subtle-hover: #2D486C;
    --kendo-color-info-subtle-active: #365681;
    --kendo-color-info: #5A82BA;
    --kendo-color-info-hover: #658CC3;
    --kendo-color-info-active: #6F96CD;
    --kendo-color-info-emphasis: #456DA5;
    --kendo-color-on-info: #1C1D22;
    --kendo-color-info-on-surface: #658CC3;
    --kendo-color-info-on-subtle: #D1DEEF;
    /* Light */
    --kendo-color-light-subtle: #A7ACC8;
    --kendo-color-light-subtle-hover: #BABED4;
    --kendo-color-light-subtle-active: #CDD0E0;
    --kendo-color-light: #BABED4;
    --kendo-color-light-hover: #CDD0E0;
    --kendo-color-light-active: #E0E1EB;
    --kendo-color-light-emphasis: #A7ACC8;
    --kendo-color-on-light: #2F344C;
    --kendo-color-light-on-surface: #CDD0E0;
    --kendo-color-light-on-subtle: #232739;
    /* Dark */
    --kendo-color-dark-subtle: #232739;
    --kendo-color-dark-subtle-hover: #2F344C;
    --kendo-color-dark-subtle-active: #414762;
    --kendo-color-dark: #2F344C;
    --kendo-color-dark-hover: #414762;
    --kendo-color-dark-active: #4A506E;
    --kendo-color-dark-emphasis: #5E668D;
    --kendo-color-on-dark: #E0E1EB;
    --kendo-color-dark-on-surface: #414762;
    --kendo-color-dark-on-subtle: #EFF0F5;
    /* Series A */
    --kendo-color-series-a-subtler: #68273A;
    --kendo-color-series-a: #B54A6A;
    --kendo-color-series-a-bold: #C4788F;
    --kendo-color-series-a-subtle: #953753;
    --kendo-color-series-a-bolder: #D095A6;
    /* Series B */
    --kendo-color-series-b-subtler: #42676B;
    --kendo-color-series-b: #6F9FA4;
    --kendo-color-series-b-bold: #88B0B4;
    --kendo-color-series-b-subtle: #5A8B90;
    --kendo-color-series-b-bolder: #A4C8CB;
    /* Series C */
    --kendo-color-series-c-subtler: #61451A;
    --kendo-color-series-c: #A9782D;
    --kendo-color-series-c-bold: #C18B49;
    --kendo-color-series-c-subtle: #896124;
    --kendo-color-series-c-bolder: #CEA36F;
    /* Series D */
    --kendo-color-series-d-subtler: #3B3F68;
    --kendo-color-series-d: #6269A7;
    --kendo-color-series-d-bold: #767DBC;
    --kendo-color-series-d-subtle: #515790;
    --kendo-color-series-d-bolder: #9197C9;
    /* Series E */
    --kendo-color-series-e-subtler: #51511F;
    --kendo-color-series-e: #9C9C3B;
    --kendo-color-series-e-bold: #BFBF55;
    --kendo-color-series-e-subtle: #7E7E2F;
    --kendo-color-series-e-bolder: #D2D288;
    /* Series F */
    --kendo-color-series-f-subtler: #2E486B;
    --kendo-color-series-f: #5479AB;
    --kendo-color-series-f-bold: #7D99BF;
    --kendo-color-series-f-subtle: #3D608F;
    --kendo-color-series-f-bolder: #A0B4D0;
    /* Typography */

    --kendo-font-family: 'Assistant', serif;
    --kendo-font-size: 16px;
    --kendo-font-size-xs: 12px;
    --kendo-font-size-sm: 14px;
    --kendo-font-size-md: var(--kendo-font-size);
    --kendo-font-size-lg: 18px;
    --kendo-font-size-xl: 20px;
    --kendo-line-height: 1.42;
    --kendo-line-height-xs: 1.2;
    --kendo-line-height-sm: 1.25;
    --kendo-line-height-md: var(--kendo-line-height);
    --kendo-line-height-lg: 1.5;
    --kendo-h1-font-size: calc(var(--kendo-font-size) * 4);
    --kendo-h2-font-size: calc(var(--kendo-font-size) * 3.5);
    --kendo-h3-font-size: calc(var(--kendo-font-size) * 3);
    --kendo-h4-font-size: calc(var(--kendo-font-size) * 2.5);
    --kendo-h5-font-size: calc(var(--kendo-font-size) * 2);
    --kendo-h6-font-size: calc(var(--kendo-font-size) * 1.5);
    --kendo-h1-line-height: calc(var(--kendo-h1-font-size) * 1.25);
    --kendo-h2-line-height: calc(var(--kendo-h2-font-size) * 1.25);
    --kendo-h3-line-height: calc(var(--kendo-h3-font-size) * 1.25);
    --kendo-h4-line-height: calc(var(--kendo-h4-font-size) * 1.25);
    --kendo-h5-line-height: calc(var(--kendo-h5-font-size) * 1.25);
    --kendo-h6-line-height: calc(var(--kendo-h6-font-size) * 1.25);
    --kendo-h1-font-weight: 400;
    --kendo-h2-font-weight: 400;
    --kendo-h3-font-weight: 400;
    --kendo-h4-font-weight: 700;
    --kendo-h5-font-weight: 700;
    --kendo-h6-font-weight: 700;
    /* Border radius */
    --kendo-border-radius-xs: 1px;
    --kendo-border-radius-sm: 2px;
    --kendo-border-radius-md: 4px;
    --kendo-border-radius-lg: 8px;
    --kendo-border-radius-xl: 12px;
    --kendo-border-radius-xxl: 24px;
    --kendo-border-radius-xxxl: 48px;
    --kendo-border-radius-full: 9999px;
    /* Card Gradient */
    --card-gradient: radial-gradient(50% 50% at 50% 50%, color-mix(in srgb, var(--kendo-color-on-app-surface) 10%, transparent) 0%, color-mix(in srgb, var(--kendo-color-surface-alt) 10%, transparent) 100%), var(--kendo-color-surface-alt);

