/* CT System — generated design tokens 2026-07-28T15:54:40+00:00 */

:root {
    /* ── Color Types ── */
    --color-white: #ffffff;
    --color-gray_50: #fafafa;
    --color-gray-50: #F9FAFB;
    --color-gray_100: #f5f5f5;
    --color-gray_200: #e5e5e5;
    --color-gray-100: #F3F4F6;
    --color-gray-200: #E5E7EB;
    --color-gray_300: #d4d4d4;
    --color-gray_400: #a3a3a3;
    --color-gray-300: #D1D5DB;
    --color-gray-400: #9CA3AF;
    --color-gray_500: #737373;
    --color-gray-500: #6B7280;
    --color-gray_600: #525252;
    --color-gray-600: #4B5563;
    --color-gray_700: #404040;
    --color-gray-700: #374151;
    --color-gray_800: #262626;
    --color-gray-800: #1F2937;
    --color-gray_900: #171717;
    --color-gray-900: #111827;
    --color-slate_50: #f8fafc;
    --color-slate: #2C3E50;
    --color-slate_100: #f1f5f9;
    --color-slate_200: #e2e8f0;
    --color-slate_300: #cbd5e1;
    --color-slate_400: #94a3b8;
    --color-blue-light: #DBEAFE;
    --color-slate_500: #64748b;
    --color-blue-soft: #EFF6FF;
    --color-slate_600: #475569;
    --color-button-blue: #3B82F6;
    --color-slate_700: #334155;
    --color-blue-dark: #2563EB;
    --color-slate_800: #1e293b;
    --color-slate_900: #0f172a;
    --color-red_50: #fef2f2;
    --color-green-soft: #D1FAE5;
    --color-red_100: #fee2e2;
    --color-green: #22C55E;
    --color-red_200: #fecaca;
    --color-green-dark: #15803D;
    --color-red_300: #fca5a5;
    --color-red_400: #f87171;
    --color-red_500: #ef4444;
    --color-red_600: #dc2626;
    --color-red_700: #b91c1c;
    --color-red_800: #991b1b;
    --color-red_900: #7f1d1d;
    --color-yellow-soft: #FEF3C7;
    --color-yellow: #EAB308;
    --color-yellow-dark: #92400E;
    --color-orange_50: #fff7ed;
    --color-orange_100: #ffedd5;
    --color-orange_200: #fed7aa;
    --color-orange_300: #fdba74;
    --color-orange_400: #fb923c;
    --color-red-soft: #FEE2E2;
    --color-orange_500: #f97316;
    --color-orange_600: #ea580c;
    --color-red: #EF4444;
    --color-red-dark: #B91C1C;
    --color-orange_700: #c2410c;
    --color-orange_800: #9a3412;
    --color-orange_900: #7c2d12;
    --color-orange-soft: #FFEDD5;
    --color-yellow_50: #fefce8;
    --color-yellow_100: #fef9c3;
    --color-orange: #F97316;
    --color-yellow_200: #fef08a;
    --color-orange-dark: #C2410C;
    --color-yellow_300: #fde047;
    --color-yellow_400: #facc15;
    --color-yellow_500: #eab308;
    --color-yellow_600: #ca8a04;
    --color-yellow_700: #a16207;
    --color-yellow_800: #854d0e;
    --color-yellow_900: #713f12;
    --color-purple-soft: #EDE9FE;
    --color-purple: #8B5CF6;
    --color-purple-dark: #6D28D9;
    --color-green_50: #f0fdf4;
    --color-green_100: #dcfce7;
    --color-green_200: #bbf7d0;
    --color-green_300: #86efac;
    --color-green_400: #4ade80;
    --color-teal-soft: #CCFBF1;
    --color-green_500: #22c55e;
    --color-green_600: #16a34a;
    --color-teal: #14B8A6;
    --color-teal-dark: #0F766E;
    --color-green_700: #15803d;
    --color-green_800: #166534;
    --color-green_900: #14532d;
    --color-primary: #3B82F6;
    --color-teal_50: #f0fdfa;
    --color-primary-hover: #2563EB;
    --color-teal_100: #ccfbf1;
    --color-success: #22C55E;
    --color-teal_200: #99f6e4;
    --color-warning: #EAB308;
    --color-teal_300: #5eead4;
    --color-teal_400: #2dd4bf;
    --color-error: #EF4444;
    --color-info: #3B82F6;
    --color-teal_500: #14b8a6;
    --color-teal_600: #0d9488;
    --color-teal_700: #0f766e;
    --color-teal_800: #115e59;
    --color-teal_900: #134e4a;
    --color-background-page: #F3F4F6;
    --color-background-content: #FFFFFF;
    --color-background-alternate: #F9FAFB;
    --color-background-muted: #F3F4F6;
    --color-background-deeper: #E5E7EB;
    --color-background-hover: #EFF6FF;
    --color-blue_50: #eff6ff;
    --color-blue_100: #dbeafe;
    --color-background-selected: #DBEAFE;
    --color-background-overlay: rgba(255,255,255,0.8);
    --color-blue_200: #bfdbfe;
    --color-blue_300: #93c5fd;
    --color-blue_400: #60a5fa;
    --color-text-primary: #1F2937;
    --color-blue_500: #3b82f6;
    --color-text-secondary: #374151;
    --color-blue_600: #2563eb;
    --color-text-muted: #6B7280;
    --color-blue_700: #1d4ed8;
    --color-blue_800: #1e40af;
    --color-text-disabled: #9CA3AF;
    --color-text-inverse: #FFFFFF;
    --color-blue_900: #1e3a8a;
    --color-border-default: #D1D5DB;
    --color-purple_50: #faf5ff;
    --color-purple_100: #f3e8ff;
    --color-border-subtle: #E5E7EB;
    --color-border-strong: #2C3E50;
    --color-purple_200: #e9d5ff;
    --color-border-focus: #3B82F6;
    --color-purple_300: #d8b4fe;
    --color-purple_400: #c084fc;
    --color-purple_500: #a855f7;
    --color-purple_600: #9333ea;
    --color-purple_700: #7e22ce;
    --color-purple_800: #6b21a8;
    --color-purple_900: #581c87;
    --color-pink_50: #fdf2f8;
    --color-pink_100: #fce7f3;
    --color-pink_200: #fbcfe8;
    --color-pink_300: #f9a8d4;
    --color-pink_400: #f472b6;
    --color-pink_500: #ec4899;
    --color-pink_600: #db2777;
    --color-pink_700: #be185d;
    --color-pink_800: #9d174d;
    --color-pink_900: #831843;
    --color-black: #000000;
}

:root {
    /* ── Font Types ── */
    --font-display-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-display-size: 32px;
    --font-display-weight: 700;
    --font-display-style: normal;
    --font-display-color: var(--color-text-primary);
    --font-title-lg-family: 'Segoe UI', sans-serif;
    --font-title-lg-size: 20px;
    --font-title-lg-weight: 700;
    --font-title-lg-style: normal;
    --font-title-lg-color: var(--color-gray_900);
    --font-page-title-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-page-title-size: 24px;
    --font-page-title-weight: 600;
    --font-page-title-style: normal;
    --font-page-title-color: var(--color-text-primary);
    --font-title-family: 'Segoe UI', sans-serif;
    --font-title-size: 17px;
    --font-title-weight: 700;
    --font-title-style: normal;
    --font-title-color: var(--color-gray_900);
    --font-page-subtitle-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-page-subtitle-size: 20px;
    --font-page-subtitle-weight: 600;
    --font-page-subtitle-style: normal;
    --font-page-subtitle-color: var(--color-text-primary);
    --font-section-title-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-section-title-size: 16px;
    --font-section-title-weight: 600;
    --font-section-title-style: normal;
    --font-section-title-color: var(--color-text-primary);
    --font-title-sm-family: 'Segoe UI', sans-serif;
    --font-title-sm-size: 14px;
    --font-title-sm-weight: 700;
    --font-title-sm-style: normal;
    --font-title-sm-color: var(--color-gray_900);
    --font-subsection-title-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-subsection-title-size: 14px;
    --font-subsection-title-weight: 600;
    --font-subsection-title-style: normal;
    --font-subsection-title-color: var(--color-text-primary);
    --font-heading-family: 'Segoe UI', sans-serif;
    --font-heading-size: 13px;
    --font-heading-weight: 700;
    --font-heading-style: normal;
    --font-heading-color: var(--color-gray_900);
    --font-header-title-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-header-title-size: 18px;
    --font-header-title-weight: 600;
    --font-header-title-style: normal;
    --font-header-title-color: var(--color-text-primary);
    --font-heading-sm-family: 'Segoe UI', sans-serif;
    --font-heading-sm-size: 11px;
    --font-heading-sm-weight: 700;
    --font-heading-sm-style: normal;
    --font-heading-sm-color: var(--color-gray_600);
    --font-body-strong-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-body-strong-size: 14px;
    --font-body-strong-weight: 600;
    --font-body-strong-style: normal;
    --font-body-strong-color: var(--color-text-primary);
    --font-body-compact-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-body-compact-size: 13px;
    --font-body-compact-weight: 400;
    --font-body-compact-style: normal;
    --font-body-compact-color: var(--color-text-primary);
    --font-label-family: 'Segoe UI', sans-serif;
    --font-label-size: 12px;
    --font-label-weight: 600;
    --font-label-style: normal;
    --font-label-color: var(--color-gray_600);
    --font-column-title-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-column-title-size: 13px;
    --font-column-title-weight: 600;
    --font-column-title-style: normal;
    --font-column-title-color: var(--color-text-secondary);
    --font-label-sm-family: 'Segoe UI', sans-serif;
    --font-label-sm-size: 11px;
    --font-label-sm-weight: 600;
    --font-label-sm-style: normal;
    --font-label-sm-color: var(--color-gray_600);
    --font-caption-strong-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-caption-strong-size: 12px;
    --font-caption-strong-weight: 600;
    --font-caption-strong-style: normal;
    --font-caption-strong-color: var(--color-text-primary);
    --font-micro-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-micro-size: 11px;
    --font-micro-weight: 400;
    --font-micro-style: normal;
    --font-micro-color: var(--color-text-secondary);
    --font-field-family: 'Segoe UI', sans-serif;
    --font-field-size: 12px;
    --font-field-weight: 500;
    --font-field-style: normal;
    --font-field-color: var(--color-gray_600);
    --font-stage-label-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-stage-label-size: 11px;
    --font-stage-label-weight: 700;
    --font-stage-label-style: normal;
    --font-stage-label-color: var(--color-text-primary);
    --font-body-lg-family: 'Segoe UI', sans-serif;
    --font-body-lg-size: 14px;
    --font-body-lg-weight: 400;
    --font-body-lg-style: normal;
    --font-body-lg-color: var(--color-gray_900);
    --font-button-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-button-size: 13px;
    --font-button-weight: 500;
    --font-button-style: normal;
    --font-button-color: var(--color-text-primary);
    --font-body-family: 'Segoe UI', sans-serif;
    --font-body-size: 13px;
    --font-body-weight: 400;
    --font-body-style: normal;
    --font-body-color: var(--color-gray_900);
    --font-data-mono-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Courier New', monospace;
    --font-data-mono-size: 13px;
    --font-data-mono-weight: 400;
    --font-data-mono-style: normal;
    --font-data-mono-color: var(--color-text-primary);
    --font-body-sm-family: 'Segoe UI', sans-serif;
    --font-body-sm-size: 12px;
    --font-body-sm-weight: 400;
    --font-body-sm-style: normal;
    --font-body-sm-color: var(--color-gray_900);
    --font-caption-family: 'Segoe UI', sans-serif;
    --font-caption-size: 11px;
    --font-caption-weight: 400;
    --font-caption-style: normal;
    --font-caption-color: var(--color-gray_600);
    --font-hint-family: 'Segoe UI', sans-serif;
    --font-hint-size: 11px;
    --font-hint-weight: 400;
    --font-hint-style: oblique;
    --font-hint-color: var(--color-gray_500);
}

:root {
    /* ── Line Types ── */
    --line-hairline-weight: 0.5px;
    --line-hairline-style: solid;
    --line-hairline-color: var(--color-gray_200);
    --line-hairline: 0.5px solid var(--color-gray_200);
    --line-hairline-dashed-weight: 1px;
    --line-hairline-dashed-style: dashed;
    --line-hairline-dashed-color: var(--color-border-subtle);
    --line-hairline-dashed: 1px dashed var(--color-border-subtle);
    --line-minor-weight: 1px;
    --line-minor-style: solid;
    --line-minor-color: var(--color-border-subtle);
    --line-minor: 1px solid var(--color-border-subtle);
    --line-normal-weight: 1px;
    --line-normal-style: solid;
    --line-normal-color: var(--color-gray_200);
    --line-normal: 1px solid var(--color-gray_200);
    --line-minor-dashed-weight: 1px;
    --line-minor-dashed-style: dashed;
    --line-minor-dashed-color: var(--color-border-subtle);
    --line-minor-dashed: 1px dashed var(--color-border-subtle);
    --line-minor-dotted-weight: 1px;
    --line-minor-dotted-style: dotted;
    --line-minor-dotted-color: var(--color-border-subtle);
    --line-minor-dotted: 1px dotted var(--color-border-subtle);
    --line-major-weight: 1px;
    --line-major-style: solid;
    --line-major-color: var(--color-border-default);
    --line-major: 1px solid var(--color-border-default);
    --line-thick-weight: 2px;
    --line-thick-style: solid;
    --line-thick-color: var(--color-gray_300);
    --line-thick: 2px solid var(--color-gray_300);
    --line-major-dashed-weight: 1px;
    --line-major-dashed-style: dashed;
    --line-major-dashed-color: var(--color-border-default);
    --line-major-dashed: 1px dashed var(--color-border-default);
    --line-heavy-weight: 4px;
    --line-heavy-style: solid;
    --line-heavy-color: var(--color-gray_400);
    --line-heavy: 4px solid var(--color-gray_400);
    --line-emphasis-weight: 2px;
    --line-emphasis-style: solid;
    --line-emphasis-color: var(--color-border-strong);
    --line-emphasis: 2px solid var(--color-border-strong);
    --line-heavy-mark-weight: 3px;
    --line-heavy-mark-style: solid;
    --line-heavy-mark-color: var(--color-border-strong);
    --line-heavy-mark: 3px solid var(--color-border-strong);
    --line-accent-weight: 1px;
    --line-accent-style: solid;
    --line-accent-color: var(--color-primary);
    --line-accent: 1px solid var(--color-primary);
    --line-dashed-weight: 1px;
    --line-dashed-style: dashed;
    --line-dashed-color: var(--color-gray_300);
    --line-dashed: 1px dashed var(--color-gray_300);
    --line-accent-dashed-weight: 1px;
    --line-accent-dashed-style: dashed;
    --line-accent-dashed-color: var(--color-primary);
    --line-accent-dashed: 1px dashed var(--color-primary);
    --line-thick-dashed-weight: 2px;
    --line-thick-dashed-style: dashed;
    --line-thick-dashed-color: var(--color-gray_300);
    --line-thick-dashed: 2px dashed var(--color-gray_300);
    --line-focus-ring-weight: 2px;
    --line-focus-ring-style: solid;
    --line-focus-ring-color: var(--color-border-focus);
    --line-focus-ring: 2px solid var(--color-border-focus);
    --line-dotted-weight: 1px;
    --line-dotted-style: dotted;
    --line-dotted-color: var(--color-gray_300);
    --line-dotted: 1px dotted var(--color-gray_300);
    --line-status-success-weight: 1px;
    --line-status-success-style: solid;
    --line-status-success-color: var(--color-success);
    --line-status-success: 1px solid var(--color-success);
    --line-status-warning-weight: 1px;
    --line-status-warning-style: solid;
    --line-status-warning-color: var(--color-warning);
    --line-status-warning: 1px solid var(--color-warning);
    --line-status-error-weight: 1px;
    --line-status-error-style: solid;
    --line-status-error-color: var(--color-error);
    --line-status-error: 1px solid var(--color-error);
}

:root {
    /* ── Shadow Types ── */
    --shadow-none: none;
    --shadow-sm: 0 1px 4px 0 rgba(0,0,0,0.06);
    --shadow-md: 0 8px 24px 0 rgba(0,0,0,0.16);
    --shadow-lg: 0 24px 70px 0 rgba(0,0,0,0.4);
    --shadow-focus: 0 0 0 3px rgba(59,130,246,0.4);
}

:root {
    /* ── Configurations ── */

    /* accounting */
    --cfg-account-customer-refunds: 25200;
    --cfg-account-fx-gain-loss: 85000;
    --cfg-account-payable: 21100;
    --cfg-account-inventory: 13100;
    --cfg-account-landed-cost-clearing: 13300;
    --cfg-account-opening-balance-equity: 39000;
    --cfg-account-sales-discounts: 47000;
    --cfg-account-sales-tax-payable: 24100;
    --cfg-account-unbilled-receivables: 12500;
    --cfg-account-revenue: 41000;
    --cfg-account-retained-earnings: 32000;
    --cfg-account-receivable: 12100;
    --cfg-account-customer-prepayments: 25100;
    --cfg-account-rounding: 93000;
    --cfg-account-cogs: 51000;
    --cfg-account-bad-debts: 78200;

    /* calendar */
    --cfg-calendar-workday-end-line-color: var(--color-red_600);
    --cfg-calendar-workday-end-line-weight: var(--line-normal-weight);
    --cfg-calendar-workday-end-line-style: var(--line-normal-style);
    --cfg-calendar-workday-end-line-color: var(--line-normal-color);
    --cfg-calendar-workday-end-line: var(--line-normal);
    --cfg-calendar-work-day-start: 9;
    --cfg-calendar-time-scale-to-column-gap: 8px;
    --cfg-calendar-workday-start-line-color: var(--color-red_600);
    --cfg-calendar-day-start: 0;
    --cfg-calendar-item-hover-background-color: var(--color-blue_100);
    --cfg-calendar-personal-day-end: 20:00;
    --cfg-calendar-item-border-shadow: var(--shadow-none);
    --cfg-calendar-work-day-end: 19:00;
    --cfg-calendar-page-edge-to-item-spacing: 54px;
    --cfg-calendar-time-pixels-per-minute: 4px;
    --cfg-calendar-header-padding: 10px;
    --cfg-calendar-drag-gap-width: 8px;
    --cfg-calendar-hour-line-weight: var(--line-normal-weight);
    --cfg-calendar-hour-line-style: var(--line-normal-style);
    --cfg-calendar-hour-line-color: var(--line-normal-color);
    --cfg-calendar-hour-line: var(--line-normal);
    --cfg-calendar-icon-spacing: 4px;
    --cfg-calendar-item-background-opacity: 0.85;
    --cfg-calendar-item-border-line-weight: var(--line-normal-weight);
    --cfg-calendar-item-border-line-style: var(--line-normal-style);
    --cfg-calendar-item-border-line-color: var(--line-normal-color);
    --cfg-calendar-item-border-line: var(--line-normal);
    --cfg-calendar-item-border-color: var(--color-blue_500);
    --cfg-calendar-day-hover-background-color: var(--color-gray_100);
    --cfg-calendar-personal-day-start: 10:00;
    --cfg-calendar-header-background-filter-color: var(--color-yellow_100);
    --cfg-calendar-icon-height: 16px;
    --cfg-calendar-page-edge-to-hour-line-spacing: 8px;
    --cfg-calendar-item-border-radius: 4px;
    --cfg-calendar-item-font-family: var(--font-body-family);
    --cfg-calendar-item-font-size: var(--font-body-size);
    --cfg-calendar-item-font-weight: var(--font-body-weight);
    --cfg-calendar-item-font-style: var(--font-body-style);
    --cfg-calendar-item-font-color: var(--font-body-color);
    --cfg-calendar-item-padding: 6px;
    --cfg-calendar-time-scale-font-family: var(--font-field-family);
    --cfg-calendar-time-scale-font-size: var(--font-field-size);
    --cfg-calendar-time-scale-font-weight: var(--font-field-weight);
    --cfg-calendar-time-scale-font-style: var(--font-field-style);
    --cfg-calendar-time-scale-font-color: var(--font-field-color);
    --cfg-calendar-work-week-end: 5;
    --cfg-calendar-work-week-start: 1;
    --cfg-calendar-workday-start-line-weight: var(--line-normal-weight);
    --cfg-calendar-workday-start-line-style: var(--line-normal-style);
    --cfg-calendar-workday-start-line-color: var(--line-normal-color);
    --cfg-calendar-workday-start-line: var(--line-normal);
    --cfg-calendar-time-to-item-spacing: 51px;
    --cfg-calendar-auto-revert-interval: 30;
    --cfg-calendar-auto-scroll-rate: 200;
    --cfg-calendar-day-end: 24;
    --cfg-calendar-day-font-family: var(--font-label-family);
    --cfg-calendar-day-font-size: var(--font-label-size);
    --cfg-calendar-day-font-weight: var(--font-label-weight);
    --cfg-calendar-day-font-style: var(--font-label-style);
    --cfg-calendar-day-font-color: var(--font-label-color);
    --cfg-calendar-header-background-normal-color: var(--color-white);
    --cfg-calendar-deadline-days: 7;

    /* checkboxes */
    --cfg-checkbox-disabled-border-color: var(--color-gray_200);
    --cfg-checkbox-indeterminate-mark-color: var(--color-white);
    --cfg-checkbox-idle-background-color: var(--color-white);
    --cfg-checkbox-border-radius: 4px;
    --cfg-checkbox-check-mark-color: var(--color-white);
    --cfg-checkbox-checked-background-color: var(--color-blue_500);
    --cfg-checkbox-disabled-background-color: var(--color-gray_100);
    --cfg-checkbox-idle-border-color: var(--color-gray_300);
    --cfg-checkbox-checked-border-color: var(--color-slate_700);
    --cfg-checkbox-border-line-weight: var(--line-normal-weight);
    --cfg-checkbox-border-line-style: var(--line-normal-style);
    --cfg-checkbox-border-line-color: var(--line-normal-color);
    --cfg-checkbox-border-line: var(--line-normal);

    /* control bars */
    --cfg-control-bar-divider-color: var(--color-gray_300);
    --cfg-control-bar-selected-background-color: var(--color-slate_700);
    --cfg-control-bar-selected-content-color: var(--color-white);
    --cfg-control-bar-padding-horizontal: 12px;
    --cfg-control-bar-font-family: var(--font-label-family);
    --cfg-control-bar-font-size: var(--font-label-size);
    --cfg-control-bar-font-weight: var(--font-label-weight);
    --cfg-control-bar-font-style: var(--font-label-style);
    --cfg-control-bar-font-color: var(--font-label-color);
    --cfg-control-bar-border-radius: 4px;
    --cfg-control-bar-border-line-weight: var(--line-normal-weight);
    --cfg-control-bar-border-line-style: var(--line-normal-style);
    --cfg-control-bar-border-line-color: var(--line-normal-color);
    --cfg-control-bar-border-line: var(--line-normal);
    --cfg-control-bar-border-color: var(--color-gray_300);
    --cfg-control-bar-height: 26px;
    --cfg-control-bar-hover-background-color: var(--color-gray_100);
    --cfg-control-bar-hover-content-color: var(--color-gray_900);
    --cfg-control-bar-idle-background-color: var(--color-white);
    --cfg-control-bar-idle-content-color: var(--color-gray_500);

    /* country */

    /* dashboard */
    --cfg-dashboard-tile-spacing: 12px;
    --cfg-dashboard-tile-height: 90px;
    --cfg-tile-status-normal-color: var(--color-green_500);
    --cfg-tile-status-warning-color: var(--color-yellow_500);
    --cfg-tile-status-urgent-color: var(--color-red_500);
    --cfg-dashboard-tile-border-shadow: var(--shadow-sm);
    --cfg-dashboard-tile-icon-height: 32px;
    --cfg-dashboard-tile-border-radius: 6px;
    --cfg-dashboard-tile-hover-background-color: var(--color-gray_100);
    --cfg-dashboard-tile-title-font-family: var(--font-heading-sm-family);
    --cfg-dashboard-tile-title-font-size: var(--font-heading-sm-size);
    --cfg-dashboard-tile-title-font-weight: var(--font-heading-sm-weight);
    --cfg-dashboard-tile-title-font-style: var(--font-heading-sm-style);
    --cfg-dashboard-tile-title-font-color: var(--font-heading-sm-color);
    --cfg-dashboard-tile-selected-border-color: var(--color-blue_500);
    --cfg-dashboard-tile-selected-background-color: var(--color-blue_50);
    --cfg-dashboard-tile-padding: 12px;
    --cfg-dashboard-tile-idle-border-color: var(--color-gray_200);
    --cfg-dashboard-tile-idle-background-color: var(--color-white);
    --cfg-dashboard-tile-icon-to-text-spacing: 10px;
    --cfg-dashboard-tile-hover-border-color: var(--color-gray_300);
    --cfg-dashboard-tile-count-font-family: var(--font-title-lg-family);
    --cfg-dashboard-tile-count-font-size: var(--font-title-lg-size);
    --cfg-dashboard-tile-count-font-weight: var(--font-title-lg-weight);
    --cfg-dashboard-tile-count-font-style: var(--font-title-lg-style);
    --cfg-dashboard-tile-count-font-color: var(--font-title-lg-color);
    --cfg-dashboard-tile-border-line-weight: var(--line-normal-weight);
    --cfg-dashboard-tile-border-line-style: var(--line-normal-style);
    --cfg-dashboard-tile-border-line-color: var(--line-normal-color);
    --cfg-dashboard-tile-border-line: var(--line-normal);

    /* date picker */
    --cfg-date-picker-border-radius: 8px;
    --cfg-date-picker-border-shadow: var(--shadow-md);
    --cfg-date-picker-day-disabled-text-color: var(--color-gray_400);
    --cfg-date-picker-background-color: var(--color-white);
    --cfg-date-picker-day-font-family: var(--font-body-family);
    --cfg-date-picker-day-font-size: var(--font-body-size);
    --cfg-date-picker-day-font-weight: var(--font-body-weight);
    --cfg-date-picker-day-font-style: var(--font-body-style);
    --cfg-date-picker-day-font-color: var(--font-body-color);
    --cfg-date-picker-day-hover-background-color: var(--color-gray_100);
    --cfg-date-picker-day-selected-background-color: var(--color-blue_500);
    --cfg-date-picker-day-selected-text-color: var(--color-white);
    --cfg-date-picker-weekday-font-family: var(--font-caption-family);
    --cfg-date-picker-weekday-font-size: var(--font-caption-size);
    --cfg-date-picker-weekday-font-weight: var(--font-caption-weight);
    --cfg-date-picker-weekday-font-style: var(--font-caption-style);
    --cfg-date-picker-weekday-font-color: var(--font-caption-color);
    --cfg-date-picker-day-today-border-color: var(--color-blue_500);
    --cfg-date-picker-header-font-family: var(--font-heading-sm-family);
    --cfg-date-picker-header-font-size: var(--font-heading-sm-size);
    --cfg-date-picker-header-font-weight: var(--font-heading-sm-weight);
    --cfg-date-picker-header-font-style: var(--font-heading-sm-style);
    --cfg-date-picker-header-font-color: var(--font-heading-sm-color);
    --cfg-date-picker-time-font-family: var(--font-body-family);
    --cfg-date-picker-time-font-size: var(--font-body-size);
    --cfg-date-picker-time-font-weight: var(--font-body-weight);
    --cfg-date-picker-time-font-style: var(--font-body-style);
    --cfg-date-picker-time-font-color: var(--font-body-color);
    --cfg-date-picker-border-line-weight: var(--line-normal-weight);
    --cfg-date-picker-border-line-style: var(--line-normal-style);
    --cfg-date-picker-border-line-color: var(--line-normal-color);
    --cfg-date-picker-border-line: var(--line-normal);
    --cfg-date-picker-nav-icon-color: var(--color-gray_600);

    /* dialogs */
    --cfg-dialog-border-radius: 8px;
    --cfg-dialog-border-color: var(--color-gray_200);
    --cfg-dialog-content-padding-horizontal: 16px;
    --cfg-dialog-divider-line-weight: var(--line-normal-weight);
    --cfg-dialog-divider-line-style: var(--line-normal-style);
    --cfg-dialog-divider-line-color: var(--line-normal-color);
    --cfg-dialog-divider-line: var(--line-normal);
    --cfg-dialog-divider-color: var(--color-gray_200);
    --cfg-dialog-content-padding-vertical: 16px;
    --cfg-dialog-item-input-focus-border-color: var(--color-blue_500);
    --cfg-dialog-item-input-border-radius: 6px;
    --cfg-dialog-item-input-border-color: var(--color-gray_300);
    --cfg-dialog-item-input-background-color: var(--color-white);
    --cfg-dialog-item-data-font-family: var(--font-body-family);
    --cfg-dialog-item-data-font-size: var(--font-body-size);
    --cfg-dialog-item-data-font-weight: var(--font-body-weight);
    --cfg-dialog-item-data-font-style: var(--font-body-style);
    --cfg-dialog-item-data-font-color: var(--font-body-color);
    --cfg-dialog-header-padding-vertical: 12px;
    --cfg-dialog-header-padding-horizontal: 16px;
    --cfg-dialog-header-height: 60px;
    --cfg-dialog-header-footer-border-line-weight: var(--line-normal-weight);
    --cfg-dialog-header-footer-border-line-style: var(--line-normal-style);
    --cfg-dialog-header-footer-border-line-color: var(--line-normal-color);
    --cfg-dialog-header-footer-border-line: var(--line-normal);
    --cfg-dialog-header-footer-border-color: var(--color-gray_200);
    --cfg-dialog-header-footer-background-color: var(--color-gray_50);
    --cfg-dialog-animation-duration: 200ms;
    --cfg-dialog-border-line-weight: var(--line-normal-weight);
    --cfg-dialog-border-line-style: var(--line-normal-style);
    --cfg-dialog-border-line-color: var(--line-normal-color);
    --cfg-dialog-border-line: var(--line-normal);
    --cfg-dialog-content-background-color: var(--color-white);
    --cfg-dialog-border-shadow: var(--shadow-lg);
    --cfg-dialog-footer-height: 60px;
    --cfg-dialog-background-color: var(--color-white);
    --cfg-dialog-footer-padding-vertical: 12px;
    --cfg-dialog-item-input-disabled-opacity: 0.5;
    --cfg-dialog-item-input-border-line-weight: var(--line-normal-weight);
    --cfg-dialog-item-input-border-line-style: var(--line-normal-style);
    --cfg-dialog-item-input-border-line-color: var(--line-normal-color);
    --cfg-dialog-item-input-border-line: var(--line-normal);
    --cfg-dialog-transition-duration: 150ms;
    --cfg-dialog-small-width: 400px;
    --cfg-dialog-footer-padding-horizontal: 16px;
    --cfg-dialog-overlay-color: var(--color-black);
    --cfg-dialog-overlay-blur: 4px;
    --cfg-dialog-medium-width: 560px;
    --cfg-dialog-max-height-default: 600px;
    --cfg-dialog-margin: 24px;
    --cfg-dialog-large-width: 720px;
    --cfg-dialog-item-vertical-spacing: 16px;
    --cfg-dialog-item-required-indicator: *;
    --cfg-dialog-item-pad-right: 8px;
    --cfg-dialog-item-pad-left: 8px;
    --cfg-dialog-item-label-width: 120px;
    --cfg-dialog-item-label-to-data-spacing: 8px;
    --cfg-dialog-item-label-font-family: var(--font-field-family);
    --cfg-dialog-item-label-font-size: var(--font-field-size);
    --cfg-dialog-item-label-font-weight: var(--font-field-weight);
    --cfg-dialog-item-label-font-style: var(--font-field-style);
    --cfg-dialog-item-label-font-color: var(--font-field-color);
    --cfg-dialog-item-input-required-color: var(--color-red_600);
    --cfg-dialog-item-input-placeholder-font-family: var(--font-hint-family);
    --cfg-dialog-item-input-placeholder-font-size: var(--font-hint-size);
    --cfg-dialog-item-input-placeholder-font-weight: var(--font-hint-weight);
    --cfg-dialog-item-input-placeholder-font-style: var(--font-hint-style);
    --cfg-dialog-item-input-placeholder-font-color: var(--font-hint-color);
    --cfg-dialog-item-input-padding: 12px;
    --cfg-dialog-item-input-height: 36px;

    /* dropdowns */
    --cfg-dropdown-border-radius: 8px;
    --cfg-dropdown-border-shadow: var(--shadow-md);
    --cfg-dropdown-border-color: var(--color-gray_200);
    --cfg-dropdown-border-line-weight: var(--line-normal-weight);
    --cfg-dropdown-border-line-style: var(--line-normal-style);
    --cfg-dropdown-border-line-color: var(--line-normal-color);
    --cfg-dropdown-border-line: var(--line-normal);

    /* field display */
    --cfg-color-field-border-color: var(--color-gray_300);

    /* form fields */
    --cfg-form-field-border-color: var(--color-gray_200);
    --cfg-form-field-vertical-spacing: 6px;
    --cfg-form-field-required-indicator-color: var(--color-red_600);
    --cfg-form-field-panel-padding: 18px;
    --cfg-form-field-padding-vertical: 5px;
    --cfg-form-field-padding-horizontal: 10px;
    --cfg-form-field-label-to-border-vertical-spacing: 8px;
    --cfg-form-field-label-to-border-horizontal-spacing: 8px;
    --cfg-form-field-label-font-family: var(--font-field-family);
    --cfg-form-field-label-font-size: var(--font-field-size);
    --cfg-form-field-label-font-weight: var(--font-field-weight);
    --cfg-form-field-label-font-style: var(--font-field-style);
    --cfg-form-field-label-font-color: var(--font-field-color);
    --cfg-form-field-focus-border-color: var(--color-blue_500);
    --cfg-form-field-disabled-border-color: var(--color-gray_200);
    --cfg-form-field-disabled-background-color: var(--color-gray_100);
    --cfg-form-field-data-font-family: var(--font-body-family);
    --cfg-form-field-data-font-size: var(--font-body-size);
    --cfg-form-field-data-font-weight: var(--font-body-weight);
    --cfg-form-field-data-font-style: var(--font-body-style);
    --cfg-form-field-data-font-color: var(--font-body-color);
    --cfg-form-field-border-radius: 6px;
    --cfg-form-field-background-color-read-only: var(--color-gray_100);
    --cfg-form-field-background-color-editable: var(--color-gray_50);
    --cfg-form-field-hover-border-color: var(--color-gray_400);
    --cfg-form-field-horizontal-spacing: 36px;
    --cfg-form-field-border-shadow: var(--shadow-none);
    --cfg-form-field-label-width: 120px;
    --cfg-form-field-height: 30px;

    /* form pages */
    --cfg-form-page-background-color: var(--color-gray_100);
    --cfg-form-page-horizontal-margin: 18px;

    /* form panels */
    --cfg-form-panel-border-radius: 8px;
    --cfg-form-panel-header-item-to-title-spacing: 6px;
    --cfg-form-panel-border-line-weight: var(--line-normal-weight);
    --cfg-form-panel-border-line-style: var(--line-normal-style);
    --cfg-form-panel-border-line-color: var(--line-normal-color);
    --cfg-form-panel-border-line: var(--line-normal);
    --cfg-form-panel-content-background-color: var(--color-white);
    --cfg-form-panel-header-button-to-title-spacing: 8px;
    --cfg-form-panel-header-counter-font-family: var(--font-caption-family);
    --cfg-form-panel-header-counter-font-size: var(--font-caption-size);
    --cfg-form-panel-header-counter-font-weight: var(--font-caption-weight);
    --cfg-form-panel-header-counter-font-style: var(--font-caption-style);
    --cfg-form-panel-header-counter-font-color: var(--font-caption-color);
    --cfg-form-panel-header-divider-line-weight: var(--line-normal-weight);
    --cfg-form-panel-header-divider-line-style: var(--line-normal-style);
    --cfg-form-panel-header-divider-line-color: var(--line-normal-color);
    --cfg-form-panel-header-divider-line: var(--line-normal);
    --cfg-form-panel-header-divider-line-color: var(--color-gray_300);
    --cfg-form-panel-header-hover-background-color: var(--color-gray_50);
    --cfg-form-panel-header-item-border-line-weight: var(--line-normal-weight);
    --cfg-form-panel-header-item-border-line-style: var(--line-normal-style);
    --cfg-form-panel-header-item-border-line-color: var(--line-normal-color);
    --cfg-form-panel-header-item-border-line: var(--line-normal);
    --cfg-form-panel-header-search-padding-horizontal: 8px;
    --cfg-form-panel-header-search-placeholder-font-family: var(--font-hint-family);
    --cfg-form-panel-header-search-placeholder-font-size: var(--font-hint-size);
    --cfg-form-panel-header-search-placeholder-font-weight: var(--font-hint-weight);
    --cfg-form-panel-header-search-placeholder-font-style: var(--font-hint-style);
    --cfg-form-panel-header-search-placeholder-font-color: var(--font-hint-color);
    --cfg-form-panel-header-search-border-line-weight: var(--line-normal-weight);
    --cfg-form-panel-header-search-border-line-style: var(--line-normal-style);
    --cfg-form-panel-header-search-border-line-color: var(--line-normal-color);
    --cfg-form-panel-header-search-border-line: var(--line-normal);
    --cfg-form-panel-border-color: var(--color-gray_200);
    --cfg-form-panel-header-item-border-radius: 40px;
    --cfg-form-panel-header-search-background-color: var(--color-white);
    --cfg-form-panel-header-padding-horizontal: 14px;
    --cfg-form-panel-header-search-border-radius: 4px;
    --cfg-form-panel-header-padding-vertical: 10px;
    --cfg-form-panel-header-search-focus-border-color: var(--color-blue_500);
    --cfg-form-panel-header-search-font-family: var(--font-label-family);
    --cfg-form-panel-header-search-font-size: var(--font-label-size);
    --cfg-form-panel-header-search-font-weight: var(--font-label-weight);
    --cfg-form-panel-header-search-font-style: var(--font-label-style);
    --cfg-form-panel-header-search-font-color: var(--font-label-color);
    --cfg-form-panel-header-search-height: 26px;
    --cfg-form-panel-header-search-border-color: var(--color-gray_300);
    --cfg-form-panel-header-search-width: 150px;
    --cfg-form-panel-header-title-font-family: var(--font-heading-family);
    --cfg-form-panel-header-title-font-size: var(--font-heading-size);
    --cfg-form-panel-header-title-font-weight: var(--font-heading-weight);
    --cfg-form-panel-header-title-font-style: var(--font-heading-style);
    --cfg-form-panel-header-title-font-color: var(--font-heading-color);
    --cfg-form-panel-header-item-border-color: var(--color-gray_300);
    --cfg-form-panel-header-item-height: 26px;
    --cfg-form-panel-header-background-color: var(--color-white);
    --cfg-form-panel-header-item-to-item-spacing: 20px;
    --cfg-form-panel-to-panel-spacing: 16px;
    --cfg-form-panel-border-shadow: var(--shadow-sm);

    /* form sections */
    --cfg-form-section-divider-color: var(--color-gray_200);
    --cfg-form-section-toggle-to-title-spacing: 8px;
    --cfg-form-section-title-font-family: var(--font-heading-sm-family);
    --cfg-form-section-title-font-size: var(--font-heading-sm-size);
    --cfg-form-section-title-font-weight: var(--font-heading-sm-weight);
    --cfg-form-section-title-font-style: var(--font-heading-sm-style);
    --cfg-form-section-title-font-color: var(--font-heading-sm-color);
    --cfg-form-section-header-toggle-height: 14px;
    --cfg-form-section-divider-weight: var(--line-normal-weight);
    --cfg-form-section-divider-style: var(--line-normal-style);
    --cfg-form-section-divider-color: var(--line-normal-color);
    --cfg-form-section-divider: var(--line-normal);
    --cfg-form-section-header-margin-bottom: 10px;
    --cfg-form-section-header-hover-background-color: var(--color-gray_50);

    /* form titles */
    --cfg-form-title-padding-vertical: 16px;
    --cfg-form-title-icon-height: 18px;
    --cfg-form-title-icon-content-color: var(--color-blue_500);
    --cfg-form-title-icon-background-color: var(--color-blue_100);
    --cfg-form-title-font-family: var(--font-title-family);
    --cfg-form-title-font-size: var(--font-title-size);
    --cfg-form-title-font-weight: var(--font-title-weight);
    --cfg-form-title-font-style: var(--font-title-style);
    --cfg-form-title-font-color: var(--font-title-color);
    --cfg-form-title-to-icon-spacing: 12px;

    /* form_view */
    --cfg-data-fields-form: "global_title_font_color":"#ffffff","global_body_font_color":"#ffffff","button_text_idle_color":"#ffffff","button_text_hover_color":"#ffffff","button_text_selected_color":"#ffffff","button_text_disabled_color":"#ffffff","header_background_color":"#ffffff","header_button_height":"36","header_button_horizontal_spacing":"11","header_divider_line_color":"#d4d4d4","form_page_background_color":"#f5f5f5","form_panel_background_color":"#ffffff","form_panel_border_color":"#e5e5e5","form_title_icon_color":"#3b82f6","form_title_text_font_color":"#171717","form_stage_idle_background_color":"#ffffff","form_stage_idle_text_color":"#737373","form_stage_active_background_color":"#16a34a","form_stage_active_text_color":"#ffffff","form_section_header_font_color":"#525252","form_section_divider_color":"#e5e5e5","form_section_background_color":"#ffffff","form_field_label_font_color":"#525252","form_field_data_font_color":"#171717","form_field_box_background_color":"#fafafa","form_field_box_border_color":"#e5e5e5","form_field_readonly_background_color":"#f5f5f5","form_field_focus_border_color":"#3b82f6","list_header_background_color":"#ffffff","list_header_font_color":"#ffffff","list_header_divider_color":"#ffffff","list_column_font_color":"#ffffff","list_row_background_color":"#ffffff","list_row_alt_background_color":"#ffffff","list_row_hover_background_color":"#fafafa","list_row_border_color":"#ffffff","tile_background_color":"#ffffff","tile_border_color":"#e2e8f0","tile_title_font_color":"#ffffff","tile_hover_background_color":"#f3f4f6","tile_body_font_color":"#ffffff","tile_select_btn_background_color":"#ffffff","tile_select_btn_text_color":"#ffffff","tile_select_btn_hover_color":"#ffffff","button_idle_background_color":"#ffffff","button_idle_border_color":"#3b82f6","button_hover_background_color":"#3b82f6","button_selected_background_color":"#3b82f6","form_field_label_position":"above","form_field_content_alignment":"spaced","tile_show_select_button":"0";
    --cfg-dialogs-form: "global_title_font_color":"#ffffff","global_body_font_color":"#ffffff","button_text_idle_color":"#ffffff","button_text_hover_color":"#ffffff","button_text_selected_color":"#ffffff","button_text_disabled_color":"#ffffff","header_background_color":"#ffffff","header_divider_line_color":"#e2e8f0","form_page_background_color":"#e5e5e5","form_panel_background_color":"#ffffff","form_panel_padding":"21","form_panel_spacing":"20","form_panel_border_color":"#f5f5f5","form_title_icon_size":"30","form_title_icon_color":"#737373","form_title_text_font_size":"23","form_title_text_font_weight":"700","form_title_text_font_color":"#525252","form_title_margin_bottom":"7","form_stage_idle_background_color":"#ffffff","form_stage_idle_text_color":"#737373","form_stage_active_background_color":"#16a34a","form_stage_active_text_color":"#ffffff","form_section_header_font_size":"6","form_section_header_font_color":"#525252","form_section_divider_color":"#e5e5e5","form_section_background_color":"#e5e5e5","form_field_label_font_size":"12","form_field_label_font_color":"#a3a3a3","form_field_label_to_data_spacing":"7","form_field_data_font_size":"12","form_field_data_font_color":"#525252","form_field_box_background_color":"#f5f5f5","form_field_box_border_color":"#ffffff","form_field_readonly_background_color":"#e5e5e5","form_field_focus_border_color":"#737373","form_field_box_border_width":"20","form_field_vertical_spacing":"1","list_header_background_color":"#ffffff","list_header_font_color":"#ffffff","list_header_divider_color":"#ffffff","list_column_font_color":"#ffffff","list_row_background_color":"#ffffff","list_row_alt_background_color":"#ffffff","list_row_hover_background_color":"#fafafa","list_row_border_color":"#ffffff","tile_background_color":"#ffffff","tile_border_color":"#ffffff","tile_title_font_color":"#ffffff","tile_hover_background_color":"#ffffff","tile_body_font_color":"#ffffff","tile_select_btn_background_color":"#ffffff","tile_select_btn_text_color":"#ffffff","tile_select_btn_hover_color":"#ffffff","form_field_label_position":"above","form_field_content_alignment":"spaced","tile_show_select_button":"0";
    --cfg-projects-form: "global_title_font_color":"#ffffff","global_body_font_color":"#ffffff","button_text_idle_color":"#ffffff","button_text_hover_color":"#ffffff","button_text_selected_color":"#ffffff","button_text_disabled_color":"#ffffff","header_background_color":"#ffffff","header_button_horizontal_spacing":"10","header_divider_line_color":"#000000","form_page_background_color":"#f5f5f5","form_panel_background_color":"#ffffff","form_panel_border_color":"#e5e5e5","form_title_icon_color":"#3b82f6","form_title_text_font_color":"#171717","form_stage_idle_background_color":"#ffffff","form_stage_idle_text_color":"#737373","form_stage_active_background_color":"#16a34a","form_stage_active_text_color":"#ffffff","form_section_header_font_color":"#525252","form_section_divider_color":"#e5e5e5","form_section_background_color":"#ffffff","form_field_label_font_color":"#525252","form_field_data_font_color":"#171717","form_field_box_background_color":"#fafafa","form_field_box_border_color":"#e5e5e5","form_field_readonly_background_color":"#f5f5f5","form_field_focus_border_color":"#3b82f6","list_header_background_color":"#ffffff","list_header_font_color":"#ffffff","list_header_divider_color":"#ffffff","list_column_font_color":"#ffffff","list_row_background_color":"#ffffff","list_row_alt_background_color":"#ffffff","list_row_hover_background_color":"#fafafa","list_row_border_color":"#ffffff","tile_background_color":"#ffffff","tile_border_color":"#e2e8f0","tile_title_font_color":"#ffffff","tile_hover_background_color":"#f3f4f6","tile_body_font_color":"#ffffff","tile_select_btn_background_color":"#ffffff","tile_select_btn_text_color":"#ffffff","tile_select_btn_hover_color":"#ffffff","form_field_label_position":"above","form_field_content_alignment":"spaced","tile_show_select_button":"0";
    --cfg-configurations-form: "global_title_font_color":"#000000","global_body_font_color":"#374151","button_text_idle_color":"#ffffff","button_text_hover_color":"#ffffff","button_text_selected_color":"#ffffff","button_text_disabled_color":"#ffffff","header_background_color":"#ffffff","header_button_height":"36","header_button_horizontal_spacing":"8","header_divider_line_color":"#e2e8f0","form_page_background_color":"#f5f5f5","form_panel_background_color":"#ffffff","form_panel_border_color":"#e5e5e5","form_title_icon_color":"#3b82f6","form_title_text_font_color":"#171717","form_stage_idle_background_color":"#ffffff","form_stage_idle_text_color":"#737373","form_stage_active_background_color":"#16a34a","form_stage_active_text_color":"#ffffff","form_section_header_font_color":"#525252","form_section_divider_color":"#e5e5e5","form_section_background_color":"#ffffff","form_field_label_font_color":"#525252","form_field_data_font_color":"#171717","form_field_box_background_color":"#fafafa","form_field_box_border_color":"#e5e5e5","form_field_box_border_radius":"2","form_field_readonly_background_color":"#e5e5e5","form_field_focus_border_color":"#3b82f6","form_field_box_border_width":"-1","form_field_vertical_spacing":"8","list_header_background_color":"#f5f5f5","list_header_font_color":"#374151","list_header_divider_color":"#e5e7eb","list_column_font_color":"#1f2937","list_row_background_color":"#ffffff","list_row_alt_background_color":"#f9fafb","list_row_hover_background_color":"#fafafa","list_row_border_color":"#e5e7eb","tile_background_color":"#ffffff","tile_border_color":"#e5e7eb","tile_title_font_color":"#111827","tile_hover_background_color":"#f0f9ff","tile_body_font_color":"#6b7280","tile_select_btn_background_color":"#2563eb","tile_select_btn_text_color":"#ffffff","tile_select_btn_hover_color":"#1d4ed8","button_idle_background_color":"#ffffff","button_idle_border_color":"#d4d4d4","button_hover_background_color":"#3b82f6","button_selected_background_color":"#3b82f6","form_field_label_position":"above","form_field_content_alignment":"spaced","tile_show_select_button":"0";
    --cfg-customers-form: "global_title_font_color":"#e5e5e5","global_body_font_color":"#374151","button_text_idle_color":"#ffffff","button_text_hover_color":"#ffffff","button_text_selected_color":"#ffffff","button_text_disabled_color":"#ffffff","header_background_color":"#ffffff","header_divider_line_color":"#000000","form_page_background_color":"#f5f5f5","form_panel_background_color":"#ffffff","form_panel_border_color":"#e5e5e5","form_title_icon_color":"#3b82f6","form_title_text_font_color":"#171717","form_stage_idle_background_color":"#ffffff","form_stage_idle_text_color":"#737373","form_stage_active_background_color":"#16a34a","form_stage_active_text_color":"#ffffff","form_section_header_font_color":"#525252","form_section_divider_color":"#e5e5e5","form_section_background_color":"#ffffff","form_field_label_font_color":"#525252","form_field_data_font_color":"#171717","form_field_box_background_color":"#fafafa","form_field_box_border_color":"#e5e5e5","form_field_readonly_background_color":"#f5f5f5","form_field_focus_border_color":"#3b82f6","list_header_background_color":"#f9fafb","list_header_font_color":"#374151","list_header_divider_color":"#e5e7eb","list_column_font_color":"#1f2937","list_row_background_color":"#ffffff","list_row_alt_background_color":"#f9fafb","list_row_hover_background_color":"#fafafa","list_row_border_color":"#e5e7eb","tile_background_color":"#ffffff","tile_border_color":"#e2e8f0","tile_title_font_color":"#111827","tile_hover_background_color":"#f3f4f6","tile_body_font_color":"#6b7280","tile_select_btn_background_color":"#2563eb","tile_select_btn_text_color":"#ffffff","tile_select_btn_hover_color":"#1d4ed8","form_field_label_position":"above","form_field_content_alignment":"spaced","tile_show_select_button":"0";

    /* gantt */
    --cfg-gantt-timeline-period-font-family: var(--font-caption-family);
    --cfg-gantt-timeline-period-font-size: var(--font-caption-size);
    --cfg-gantt-timeline-period-font-weight: var(--font-caption-weight);
    --cfg-gantt-timeline-period-font-style: var(--font-caption-style);
    --cfg-gantt-timeline-period-font-color: var(--font-caption-color);
    --cfg-gantt-bar-track-color: var(--color-gray_200);
    --cfg-gantt-critical-path-color: var(--color-red_500);
    --cfg-gantt-dependency-arrow-color: var(--color-gray_400);
    --cfg-gantt-dependency-line-color: var(--color-gray_400);
    --cfg-gantt-grid-line-weight: var(--line-hairline-weight);
    --cfg-gantt-grid-line-style: var(--line-hairline-style);
    --cfg-gantt-grid-line-color: var(--line-hairline-color);
    --cfg-gantt-grid-line: var(--line-hairline);
    --cfg-gantt-grid-line-color: var(--color-gray_200);
    --cfg-gantt-milestone-color: var(--color-purple_500);
    --cfg-gantt-milestone-size: 14px;
    --cfg-gantt-dependency-line-weight: var(--line-normal-weight);
    --cfg-gantt-dependency-line-style: var(--line-normal-style);
    --cfg-gantt-dependency-line-color: var(--line-normal-color);
    --cfg-gantt-dependency-line: var(--line-normal);
    --cfg-gantt-background-color: var(--color-white);
    --cfg-gantt-timeline-header-font-family: var(--font-label-family);
    --cfg-gantt-timeline-header-font-size: var(--font-label-size);
    --cfg-gantt-timeline-header-font-weight: var(--font-label-weight);
    --cfg-gantt-timeline-header-font-style: var(--font-label-style);
    --cfg-gantt-timeline-header-font-color: var(--font-label-color);
    --cfg-gantt-today-marker-color: var(--color-red_500);
    --cfg-gantt-bar-idle-background-color: var(--color-blue_500);
    --cfg-gantt-bar-height: 20px;
    --cfg-gantt-row-alternate-background-color: var(--color-gray_50);
    --cfg-gantt-row-height: 36px;
    --cfg-gantt-row-hover-background-color: var(--color-blue_50);
    --cfg-gantt-row-line-color: var(--color-gray_100);
    --cfg-gantt-task-indent: 16px;
    --cfg-gantt-task-name-font-family: var(--font-body-family);
    --cfg-gantt-task-name-font-size: var(--font-body-size);
    --cfg-gantt-task-name-font-weight: var(--font-body-weight);
    --cfg-gantt-task-name-font-style: var(--font-body-style);
    --cfg-gantt-task-name-font-color: var(--font-body-color);
    --cfg-gantt-task-panel-width: 280px;
    --cfg-gantt-timeline-header-background-color: var(--color-gray_50);
    --cfg-gantt-timeline-header-border-color: var(--color-gray_200);
    --cfg-gantt-weekend-background-color: var(--color-gray_50);
    --cfg-gantt-bar-border-radius: 4px;
    --cfg-gantt-bar-dragging-opacity: 0.6;
    --cfg-gantt-bar-hover-background-color: var(--color-blue_600);
    --cfg-gantt-bar-label-color: var(--color-white);
    --cfg-gantt-bar-label-font-family: var(--font-caption-family);
    --cfg-gantt-bar-label-font-size: var(--font-caption-size);
    --cfg-gantt-bar-label-font-weight: var(--font-caption-weight);
    --cfg-gantt-bar-label-font-style: var(--font-caption-style);
    --cfg-gantt-bar-label-font-color: var(--font-caption-color);
    --cfg-gantt-bar-progress-fill-color: var(--color-blue_700);
    --cfg-gantt-bar-selected-border-color: var(--color-blue_700);

    /* headers button colors */
    --cfg-header-button-idle-border-color: var(--color-gray_300);
    --cfg-header-button-hover-background-color: var(--color-button-blue);
    --cfg-header-button-hover-border-color: var(--color-button-blue);
    --cfg-header-button-selected-border-color: var(--color-button-blue);
    --cfg-header-button-selected-content-color: var(--color-background-content);
    --cfg-header-button-selected-background-color: var(--color-button-blue);
    --cfg-header-button-hover-content-color: var(--color-background-content);
    --cfg-header-button-idle-content-color: var(--color-blue-dark);
    --cfg-header-button-idle-background-color: var(--color-background-content);
    --cfg-header-button-disabled-background-color: var(--color-gray_100);
    --cfg-header-button-disabled-content-color: var(--color-gray_400);
    --cfg-header-button-disabled-border-color: var(--color-gray_200);

    /* icons */
    --cfg-icon-padding-horizontal: 8px;
    --cfg-icon-border-corner-radius: 8px;
    --cfg-icon-border-reference-height: 48px;
    --cfg-icon-content-to-height-ratio: 0.6;
    --cfg-icon-text-font-family: var(--font-label-family);
    --cfg-icon-text-font-size: var(--font-label-size);
    --cfg-icon-text-font-weight: var(--font-label-weight);
    --cfg-icon-text-font-style: var(--font-label-style);
    --cfg-icon-text-font-color: var(--font-label-color);
    --cfg-icon-text-letter-spacing: 0.5px;
    --cfg-icon-border-width: 2px;

    /* kanban */
    --cfg-kanban-card-hover-shadow: var(--shadow-md);
    --cfg-kanban-card-subtitle-font-family: var(--font-body-sm-family);
    --cfg-kanban-card-subtitle-font-size: var(--font-body-sm-size);
    --cfg-kanban-card-subtitle-font-weight: var(--font-body-sm-weight);
    --cfg-kanban-card-subtitle-font-style: var(--font-body-sm-style);
    --cfg-kanban-card-subtitle-font-color: var(--font-body-sm-color);
    --cfg-kanban-card-title-font-family: var(--font-label-family);
    --cfg-kanban-card-title-font-size: var(--font-label-size);
    --cfg-kanban-card-title-font-weight: var(--font-label-weight);
    --cfg-kanban-card-title-font-style: var(--font-label-style);
    --cfg-kanban-card-title-font-color: var(--font-label-color);
    --cfg-kanban-column-background-color: var(--color-gray_50);
    --cfg-kanban-column-border-color: var(--color-gray_200);
    --cfg-kanban-column-border-line-weight: var(--line-normal-weight);
    --cfg-kanban-column-border-line-style: var(--line-normal-style);
    --cfg-kanban-column-border-line-color: var(--line-normal-color);
    --cfg-kanban-column-border-line: var(--line-normal);
    --cfg-kanban-column-border-radius: 8px;
    --cfg-kanban-column-collapsed-width: 48px;
    --cfg-kanban-column-count-background-color: var(--color-gray_200);
    --cfg-kanban-board-padding: 16px;
    --cfg-kanban-column-count-font-family: var(--font-caption-family);
    --cfg-kanban-column-count-font-size: var(--font-caption-size);
    --cfg-kanban-column-count-font-weight: var(--font-caption-weight);
    --cfg-kanban-column-count-font-style: var(--font-caption-style);
    --cfg-kanban-column-count-font-color: var(--font-caption-color);
    --cfg-kanban-column-header-background-color: var(--color-white);
    --cfg-kanban-column-header-font-family: var(--font-heading-sm-family);
    --cfg-kanban-column-header-font-size: var(--font-heading-sm-size);
    --cfg-kanban-column-header-font-weight: var(--font-heading-sm-weight);
    --cfg-kanban-column-header-font-style: var(--font-heading-sm-style);
    --cfg-kanban-column-header-font-color: var(--font-heading-sm-color);
    --cfg-kanban-column-header-padding: 12px;
    --cfg-kanban-column-spacing: 12px;
    --cfg-kanban-column-width: 280px;
    --cfg-kanban-dropzone-background-color: var(--color-blue_50);
    --cfg-kanban-dropzone-border-color: var(--color-blue_500);
    --cfg-kanban-dropzone-border-line-weight: var(--line-dashed-weight);
    --cfg-kanban-dropzone-border-line-style: var(--line-dashed-style);
    --cfg-kanban-dropzone-border-line-color: var(--line-dashed-color);
    --cfg-kanban-dropzone-border-line: var(--line-dashed);
    --cfg-kanban-placeholder-background-color: var(--color-gray_200);
    --cfg-kanban-board-background-color: var(--color-gray_100);
    --cfg-kanban-card-background-color: var(--color-white);
    --cfg-kanban-card-border-color: var(--color-gray_200);
    --cfg-kanban-card-border-line-weight: var(--line-normal-weight);
    --cfg-kanban-card-border-line-style: var(--line-normal-style);
    --cfg-kanban-card-border-line-color: var(--line-normal-color);
    --cfg-kanban-card-border-line: var(--line-normal);
    --cfg-kanban-card-border-radius: 6px;
    --cfg-kanban-card-border-shadow: var(--shadow-sm);
    --cfg-kanban-card-dragging-opacity: 0.6;
    --cfg-kanban-card-footer-font-family: var(--font-caption-family);
    --cfg-kanban-card-footer-font-size: var(--font-caption-size);
    --cfg-kanban-card-footer-font-weight: var(--font-caption-weight);
    --cfg-kanban-card-footer-font-style: var(--font-caption-style);
    --cfg-kanban-card-footer-font-color: var(--font-caption-color);
    --cfg-kanban-card-padding: 12px;
    --cfg-kanban-card-selected-border-color: var(--color-blue_500);
    --cfg-kanban-card-spacing: 8px;
    --cfg-kanban-card-stripe-color: var(--color-blue_500);

    /* list columns */
    --cfg-list-column-divider-weight: var(--line-normal-weight);
    --cfg-list-column-divider-style: var(--line-normal-style);
    --cfg-list-column-divider-color: var(--line-normal-color);
    --cfg-list-column-divider: var(--line-normal);
    --cfg-list-column-divider-color: var(--color-gray_200);
    --cfg-list-column-label-active-background-color: var(--color-gray_100);
    --cfg-list-column-horizontal-padding: 12px;
    --cfg-list-column-label-font-family: var(--font-label-family);
    --cfg-list-column-label-font-size: var(--font-label-size);
    --cfg-list-column-label-font-weight: var(--font-label-weight);
    --cfg-list-column-label-font-style: var(--font-label-style);
    --cfg-list-column-label-font-color: var(--font-label-color);
    --cfg-list-column-label-hover-background-color: var(--color-gray_200);
    --cfg-list-column-resize-indicator-color: var(--color-blue_500);
    --cfg-list-column-title-idle-background-color: var(--color-gray_50);
    --cfg-list-column-label-selected-background-color: var(--color-blue_50);
    --cfg-list-column-label-idle-background-color: var(--color-gray_50);

    /* list groups */
    --cfg-list-group-header-font-type-family: var(--font-label-family);
    --cfg-list-group-header-font-type-size: var(--font-label-size);
    --cfg-list-group-header-font-type-weight: var(--font-label-weight);
    --cfg-list-group-header-font-type-style: var(--font-label-style);
    --cfg-list-group-header-font-type-color: var(--font-label-color);
    --cfg-list-group-header-background-color: var(--color-slate_100);
    --cfg-list-group-indent-width: 16px;
    --cfg-list-group-header-level-2-font-type-family: var(--font-label-sm-family);
    --cfg-list-group-header-level-2-font-type-size: var(--font-label-sm-size);
    --cfg-list-group-header-level-2-font-type-weight: var(--font-label-sm-weight);
    --cfg-list-group-header-level-2-font-type-style: var(--font-label-sm-style);
    --cfg-list-group-header-level-2-font-type-color: var(--font-label-sm-color);
    --cfg-list-group-header-counter-font-type-family: var(--font-caption-family);
    --cfg-list-group-header-counter-font-type-size: var(--font-caption-size);
    --cfg-list-group-header-counter-font-type-weight: var(--font-caption-weight);
    --cfg-list-group-header-counter-font-type-style: var(--font-caption-style);
    --cfg-list-group-header-counter-font-type-color: var(--font-caption-color);

    /* list pages */
    --cfg-list-page-outer-margin: 18px;
    --cfg-list-border-color: var(--color-gray_200);

    /* list rows */
    --cfg-list-inline-edit-input-padding-horizontal: 7px;
    --cfg-list-inline-edit-input-height: 26px;
    --cfg-list-inline-edit-focus-ring-color: var(--color-blue_500);
    --cfg-list-drag-icon-size: 16px;
    --cfg-list-drag-icon-color: var(--color-slate_400);
    --cfg-list-bulk-edit-bar-border-color: var(--color-red_200);
    --cfg-list-bulk-edit-bar-background-color: var(--color-red_50);
    --cfg-list-row-action-icon-color: var(--color-gray_500);
    --cfg-list-subtotal-row-background-color: var(--color-gray_50);
    --cfg-list-row-vertical-padding: 8px;
    --cfg-list-row-selected-background-color: var(--color-blue_50);
    --cfg-list-row-idle-background-color: var(--color-white);
    --cfg-list-row-hover-background-color: var(--color-gray_50);
    --cfg-list-row-font-family: var(--font-body-family);
    --cfg-list-row-font-size: var(--font-body-size);
    --cfg-list-row-font-weight: var(--font-body-weight);
    --cfg-list-row-font-style: var(--font-body-style);
    --cfg-list-row-font-color: var(--font-body-color);
    --cfg-list-alternate-row-idle-background-color: var(--color-white);
    --cfg-list-row-divider-color: var(--color-gray_100);
    --cfg-list-row-divider-weight: var(--line-normal-weight);
    --cfg-list-row-divider-style: var(--line-normal-style);
    --cfg-list-row-divider-color: var(--line-normal-color);
    --cfg-list-row-divider: var(--line-normal);
    --cfg-list-row-disabled-background-color: var(--color-gray_100);
    --cfg-list-row-action-icon-hover-color: var(--color-blue_500);
    --cfg-list-row-action-icon-disabled-color: var(--color-gray_300);
    --cfg-list-row-editing-background-color: var(--color-blue_50);

    /* list_view */
    --cfg-configurations-list: "header_button_idle_background_color":"background-content","header_button_idle_content_color":"blue-dark";

    /* menu */
    --cfg-menu-hover-background-color: var(--color-gray_100);
    --cfg-menu-idle-background-color: var(--color-white);
    --cfg-menu-font-hover-color: var(--color-gray_800);
    --cfg-menu-font-selected-color: var(--color-blue_500);
    --cfg-menu-font-idle-color: var(--color-gray_800);
    --cfg-menu-font-family: var(--font-body-family);
    --cfg-menu-font-size: var(--font-body-size);
    --cfg-menu-font-weight: var(--font-body-weight);
    --cfg-menu-font-style: var(--font-body-style);
    --cfg-menu-font-color: var(--font-body-color);
    --cfg-menu-width: 220px;
    --cfg-menu-slide-timer: 0.3;
    --cfg-menu-selected-background-color: var(--color-blue_50);
    --cfg-menu-left-padding: 16px;
    --cfg-menu-item-height: 32px;
    --cfg-menu-child-indent: 20px;

    /* multi select */
    --cfg-multi-select-background-color: var(--color-blue_50);
    --cfg-dropdown-max-items: 8;
    --cfg-multi-select-spacing: 4px;
    --cfg-multi-select-remove-icon-color: var(--color-blue_600);
    --cfg-multi-select-remove-icon: remove_icon.close;
    --cfg-multi-select-padding-vertical: 3px;
    --cfg-multi-select-padding-horizontal: 8px;
    --cfg-multi-select-border-radius: 4px;

    /* page headers */
    --cfg-page-header-background-color: var(--color-white);
    --cfg-page-header-record-counter-font-family: var(--font-caption-family);
    --cfg-page-header-record-counter-font-size: var(--font-caption-size);
    --cfg-page-header-record-counter-font-weight: var(--font-caption-weight);
    --cfg-page-header-record-counter-font-style: var(--font-caption-style);
    --cfg-page-header-record-counter-font-color: var(--font-caption-color);
    --cfg-page-header-search-background-color: var(--color-white);
    --cfg-page-header-search-border-color: var(--color-gray_300);
    --cfg-page-header-search-border-line-weight: var(--line-normal-weight);
    --cfg-page-header-search-border-line-style: var(--line-normal-style);
    --cfg-page-header-search-border-line-color: var(--line-normal-color);
    --cfg-page-header-search-border-line: var(--line-normal);
    --cfg-page-header-item-height: 36px;
    --cfg-page-header-search-border-radius: 4px;
    --cfg-page-header-search-focus-border-color: var(--color-blue_500);
    --cfg-page-header-search-font-family: var(--font-body-family);
    --cfg-page-header-search-font-size: var(--font-body-size);
    --cfg-page-header-search-font-weight: var(--font-body-weight);
    --cfg-page-header-search-font-style: var(--font-body-style);
    --cfg-page-header-search-font-color: var(--font-body-color);
    --cfg-page-header-search-height: 32px;
    --cfg-page-header-search-padding-horizontal: 10px;
    --cfg-page-header-search-placeholder-font-family: var(--font-hint-family);
    --cfg-page-header-search-placeholder-font-size: var(--font-hint-size);
    --cfg-page-header-search-placeholder-font-weight: var(--font-hint-weight);
    --cfg-page-header-search-placeholder-font-style: var(--font-hint-style);
    --cfg-page-header-search-placeholder-font-color: var(--font-hint-color);
    --cfg-page-header-search-width: 220px;
    --cfg-page-header-title-font-family: var(--font-title-lg-family);
    --cfg-page-header-title-font-size: var(--font-title-lg-size);
    --cfg-page-header-title-font-weight: var(--font-title-lg-weight);
    --cfg-page-header-title-font-style: var(--font-title-lg-style);
    --cfg-page-header-title-font-color: var(--font-title-lg-color);
    --cfg-page-header-divider-line-color: var(--color-gray_300);
    --cfg-page-header-divider-line-weight: var(--line-normal-weight);
    --cfg-page-header-divider-line-style: var(--line-normal-style);
    --cfg-page-header-divider-line-color: var(--line-normal-color);
    --cfg-page-header-divider-line: var(--line-normal);
    --cfg-page-header-button-padding-vertical: 0px;
    --cfg-page-header-button-padding-horizontal: 10px;
    --cfg-page-header-dropdown-font-family: var(--font-body-family);
    --cfg-page-header-dropdown-font-size: var(--font-body-size);
    --cfg-page-header-dropdown-font-weight: var(--font-body-weight);
    --cfg-page-header-dropdown-font-style: var(--font-body-style);
    --cfg-page-header-dropdown-font-color: var(--font-body-color);
    --cfg-page-header-item-to-item-spacing: 6px;
    --cfg-page-header-dropdown-item-hover-background-color: var(--color-gray_50);
    --cfg-page-header-dropdown-item-selected-background-color: var(--color-blue_50);
    --cfg-page-header-item-border-color: var(--color-gray_300);
    --cfg-page-header-item-border-line-weight: var(--line-normal-weight);
    --cfg-page-header-item-border-line-style: var(--line-normal-style);
    --cfg-page-header-item-border-line-color: var(--line-normal-color);
    --cfg-page-header-item-border-line: var(--line-normal);
    --cfg-page-header-item-border-radius: 4px;
    --cfg-page-header-item-to-title-spacing: 6px;
    --cfg-page-header-dropdown-background-color: var(--color-white);
    --cfg-page-header-shadow: var(--shadow-sm);
    --cfg-page-header-padding-horizontal: 16px;
    --cfg-page-header-padding-vertical: 8px;
    --cfg-page-header-record-counter-color: var(--color-gray_500);

    /* pages */
    --cfg-page-font-family: var(--font-body-family);
    --cfg-page-font-size: var(--font-body-size);
    --cfg-page-font-weight: var(--font-body-weight);
    --cfg-page-font-style: var(--font-body-style);
    --cfg-page-font-color: var(--font-body-color);
    --cfg-page-background-color: var(--color-gray_100);

    /* priority indicators */
    --cfg-priority-star-active-color: var(--color-yellow_500);
    --cfg-priority-star-idle-color: var(--color-gray_300);
    --cfg-priority-star-size: 16px;

    /* progress indicators */
    --cfg-progress-field-border-radius: 4px;
    --cfg-loading-overlay-color: var(--color-white);
    --cfg-loading-spinner-color: var(--color-blue_500);
    --cfg-progress-field-bar-color: var(--color-blue_500);
    --cfg-progress-field-height: 8px;
    --cfg-progress-field-track-color: var(--color-gray_200);

    /* radio buttons */
    --cfg-radio-selected-border-color: var(--color-slate_700);
    --cfg-radio-idle-border-color: var(--color-gray_300);
    --cfg-radio-border-line-weight: var(--line-normal-weight);
    --cfg-radio-border-line-style: var(--line-normal-style);
    --cfg-radio-border-line-color: var(--line-normal-color);
    --cfg-radio-border-line: var(--line-normal);
    --cfg-radio-disabled-background-color: var(--color-gray_100);
    --cfg-radio-disabled-border-color: var(--color-gray_200);
    --cfg-radio-idle-background-color: var(--color-white);
    --cfg-radio-selected-dot-color: var(--color-slate_700);

    /* stage indicators */
    --cfg-stage-indicator-border-color: var(--color-gray_300);
    --cfg-stage-indicator-point-padding: 16px;
    --cfg-stage-indicator-letter-spacing: 0.5px;
    --cfg-stage-indicator-idle-content-color: var(--color-gray_500);
    --cfg-stage-indicator-idle-background-color: var(--color-white);
    --cfg-stage-indicator-font-family: var(--font-label-family);
    --cfg-stage-indicator-font-size: var(--font-label-size);
    --cfg-stage-indicator-font-weight: var(--font-label-weight);
    --cfg-stage-indicator-font-style: var(--font-label-style);
    --cfg-stage-indicator-font-color: var(--font-label-color);
    --cfg-stage-indicator-flat-padding: 12px;
    --cfg-stage-indicator-border-line-weight: var(--line-normal-weight);
    --cfg-stage-indicator-border-line-style: var(--line-normal-style);
    --cfg-stage-indicator-border-line-color: var(--line-normal-color);
    --cfg-stage-indicator-border-line: var(--line-normal);
    --cfg-stage-indicator-arrow-depth: 8px;
    --cfg-stage-indicator-text-to-height-ratio: 0.8;
    --cfg-stage-indicator-tail-padding: 12px;
    --cfg-stage-indicator-selected-content-color: var(--color-white);
    --cfg-stage-indicator-selected-background-color: var(--color-green_600);
    --cfg-stage-indicator-segment-gap: 4px;

    /* status colors */
    --cfg-status-color-delay: var(--color-green_700);
    --cfg-status-color-inactive: var(--color-gray_400);
    --cfg-status-color-normal: var(--color-green_500);
    --cfg-status-color-done: var(--color-gray_500);
    --cfg-status-color-urgent: var(--color-green_600);
    --cfg-status-color-warning: var(--color-green_600);

    /* text buttons */
    --cfg-text-button-primary-disabled-text-color: var(--color-gray_400);
    --cfg-text-button-primary-hover-background-color: var(--color-blue_600);
    --cfg-text-button-primary-hover-border-color: var(--color-blue_700);
    --cfg-text-button-primary-hover-text-color: var(--color-white);
    --cfg-text-button-primary-idle-background-color: var(--color-blue_500);
    --cfg-text-button-border-radius: 6px;
    --cfg-text-button-font-family: var(--font-label-family);
    --cfg-text-button-font-size: var(--font-label-size);
    --cfg-text-button-font-weight: var(--font-label-weight);
    --cfg-text-button-font-style: var(--font-label-style);
    --cfg-text-button-font-color: var(--font-label-color);
    --cfg-text-button-padding-horizontal: 20px;
    --cfg-text-button-padding-vertical: 9px;
    --cfg-text-button-primary-disabled-background-color: var(--color-gray_100);
    --cfg-text-button-primary-disabled-border-color: var(--color-gray_200);
    --cfg-text-button-primary-idle-border-color: var(--color-blue_600);
    --cfg-text-button-primary-idle-text-color: var(--color-white);
    --cfg-text-button-primary-selected-background-color: var(--color-blue_700);
    --cfg-text-button-primary-selected-border-color: var(--color-blue_800);
    --cfg-text-button-primary-selected-text-color: var(--color-white);
    --cfg-text-button-secondary-disabled-background-color: var(--color-gray_100);
    --cfg-text-button-secondary-disabled-border-color: var(--color-gray_200);
    --cfg-text-button-secondary-disabled-text-color: var(--color-gray_400);
    --cfg-text-button-secondary-hover-background-color: var(--color-gray_100);
    --cfg-text-button-secondary-hover-border-color: var(--color-gray_400);
    --cfg-text-button-secondary-hover-text-color: var(--color-gray_900);
    --cfg-text-button-secondary-idle-background-color: var(--color-white);
    --cfg-text-button-secondary-idle-border-color: var(--color-gray_300);
    --cfg-text-button-border-line-weight: var(--line-normal-weight);
    --cfg-text-button-border-line-style: var(--line-normal-style);
    --cfg-text-button-border-line-color: var(--line-normal-color);
    --cfg-text-button-border-line: var(--line-normal);
    --cfg-text-button-to-button-spacing: 8px;
    --cfg-text-button-secondary-idle-text-color: var(--color-gray_500);
    --cfg-text-button-secondary-selected-background-color: var(--color-slate_700);
    --cfg-text-button-secondary-selected-border-color: var(--color-slate_700);
    --cfg-text-button-secondary-selected-text-color: var(--color-white);

    /* tiles */
    --cfg-tile-border-selected-line-weight: var(--line-thick-weight);
    --cfg-tile-border-selected-line-style: var(--line-thick-style);
    --cfg-tile-border-selected-line-color: var(--line-thick-color);
    --cfg-tile-border-selected-line: var(--line-thick);
    --cfg-tile-border-selected-shadow: var(--shadow-none);
    --cfg-tile-select-button-height: 0px;
    --cfg-tile-minimum-width: 240px;
    --cfg-tile-border-color-editable: var(--color-red_700);
    --cfg-tile-vertical-gap: 14px;
    --cfg-tile-padding-vertical: 14px;
    --cfg-tile-horizontal-gap: 14px;
    --cfg-tile-padding-horizontal: 16px;
    --cfg-tile-background-color: var(--color-white);
    --cfg-tile-border-color-read-only: var(--color-gray_200);
    --cfg-tile-border-color-selected: var(--color-blue_600);
    --cfg-tile-maximum-width: 360px;
    --cfg-tile-minimum-height: 0px;

    /* toggles */
    --cfg-toggle-track-width: 36px;
    --cfg-toggle-transition-duration: 150ms;
    --cfg-toggle-off-track-color: var(--color-gray_300);
    --cfg-toggle-track-height: 20px;
    --cfg-toggle-on-track-color: var(--color-slate_700);
    --cfg-toggle-disabled-track-color: var(--color-gray_200);
    --cfg-toggle-knob-color: var(--color-white);
    --cfg-toggle-knob-size: 16px;

    /* tooltips */
    --cfg-tooltip-border-radius: 4px;
    --cfg-tooltip-arrow-size: 6px;
    --cfg-tooltip-background-color: var(--color-gray_900);
    --cfg-tooltip-border-shadow: var(--shadow-sm);
    --cfg-tooltip-delay: 400ms;
    --cfg-tooltip-font-family: var(--font-caption-family);
    --cfg-tooltip-font-size: var(--font-caption-size);
    --cfg-tooltip-font-weight: var(--font-caption-weight);
    --cfg-tooltip-font-style: var(--font-caption-style);
    --cfg-tooltip-font-color: var(--font-caption-color);
    --cfg-tooltip-max-width: 240px;
    --cfg-tooltip-padding-horizontal: 8px;
    --cfg-tooltip-padding-vertical: 5px;
    --cfg-tooltip-text-color: var(--color-white);

    /* uploads */
    --cfg-upload-dropzone-border-line-weight: var(--line-dashed-weight);
    --cfg-upload-dropzone-border-line-style: var(--line-dashed-style);
    --cfg-upload-dropzone-border-line-color: var(--line-dashed-color);
    --cfg-upload-dropzone-border-line: var(--line-dashed);
    --cfg-upload-dropzone-border-color: var(--color-gray_300);
    --cfg-upload-dropzone-background-color: var(--color-gray_50);
    --cfg-upload-progress-track-color: var(--color-gray_200);
    --cfg-upload-preview-border-radius: 6px;
    --cfg-upload-preview-size: 64px;
    --cfg-upload-progress-bar-color: var(--color-blue_500);
    --cfg-upload-hint-font-family: var(--font-hint-family);
    --cfg-upload-hint-font-size: var(--font-hint-size);
    --cfg-upload-hint-font-weight: var(--font-hint-weight);
    --cfg-upload-hint-font-style: var(--font-hint-style);
    --cfg-upload-hint-font-color: var(--font-hint-color);
    --cfg-upload-dropzone-border-radius: 8px;
    --cfg-upload-dropzone-hover-background-color: var(--color-gray_100);
    --cfg-upload-icon-color: var(--color-gray_400);
}

:root {
    /* ── Legacy aliases (layout compatibility) ── */
    --page-background-color: var(--cfg-page-background-color, #f5f7fa);
    --page-outer-margin: var(--cfg-page-outer-margin, 16px);
    --page-font-color: var(--cfg-page-font-color, var(--color-text-primary, #1a202c));
    --page-major-border-color: var(--cfg-page-major-border-color, #e2e8f0);
    --page-major-border-weight: var(--cfg-page-major-border-weight, 1px);
    --page-minor-border-color: var(--cfg-page-minor-border-color, #f0f0f0);
    --page-minor-border-weight: var(--cfg-page-minor-border-weight, 1px);
    --major-border-color: var(--cfg-page-header-divider-line-color);
    --major-border-weight: var(--cfg-page-header-divider-line-weight);
    --minor-border-color: var(--color-border-subtle);
    --font-color: var(--color-text-primary);
    --header-vertical-padding: var(--cfg-page-header-padding-vertical);
    --title-text-font: var(--cfg-page-header-title-font-family);
    --title-text-size: var(--cfg-page-header-title-font-size);
    --title-text-style: var(--cfg-page-header-title-font-weight);
    --button-height: var(--cfg-page-header-item-height);
    --button-horizontal-spacing: var(--cfg-page-header-item-to-item-spacing);
    --button-idle-background-color: var(--cfg-header-button-idle-background-color);
    --button-hover-background-color: var(--cfg-header-button-hover-background-color);
    --button-selected-background-color: var(--cfg-header-button-selected-background-color);
    --button-idle-symbol-color: var(--cfg-header-button-idle-content-color);
    --button-hover-symbol-color: var(--cfg-header-button-hover-content-color);
    --button-selected-symbol-color: var(--cfg-header-button-selected-content-color);
    --button-idle-border-color: var(--cfg-header-button-idle-border-color);
    --button-hover-border-color: var(--cfg-header-button-hover-border-color);
    --button-selected-border-color: var(--cfg-header-button-selected-border-color);
    --cfg-button-corner-radius: calc(var(--cfg-icon-border-corner-radius, 4) * 1px);
    --cfg-button-border-width: calc(var(--cfg-icon-border-width, 1) * 1px);
    --cfg-button-padding-horizontal: calc(var(--cfg-icon-padding-horizontal, 8) * 1px);
    --cfg-button-padding-vertical: calc(var(--cfg-icon-padding-vertical, 8) * 1px);
    --search-box-width: var(--cfg-page-header-search-width);
    --search-box-height: var(--cfg-page-header-search-height);
    --search-text-font: var(--cfg-page-header-search-font-family);
    --search-text-size: var(--cfg-page-header-search-font-size);
    --menu-width: var(--cfg-menu-width, 220px);
    --menu-slide-timer: var(--cfg-menu-slide-timer, 0.25s);
    --menu-background-color: var(--cfg-menu-idle-background-color, #ffffff);
    --menu-text-color: var(--cfg-menu-font-idle-color, #1f2937);
    --menu-hover-background-color: var(--cfg-menu-hover-background-color, #f3f4f6);
    --menu-font: var(--cfg-menu-font-family, "Segoe UI", sans-serif);
    --menu-font-size: var(--cfg-menu-font-size, 14px);
    --menu-item-height: var(--cfg-menu-item-height, 34px);
    --menu-child-indent: var(--cfg-menu-child-indent, 18px);
    --menu-left-padding: var(--cfg-menu-left-padding, 18px);
    --list-header-bg: var(--cfg-list-column-title-idle-background-color);
    --list-header-color: var(--color-text-secondary);
    --list-row-bg: var(--cfg-list-row-idle-background-color);
    --list-row-alt-bg: var(--cfg-list-alternate-row-idle-background-color);
    --list-row-hover-bg: var(--cfg-list-row-hover-background-color);
    --list-row-selected-bg: var(--cfg-list-row-selected-background-color);
    --status-normal-color: var(--cfg-status-color-normal);
    --status-warning-color: var(--cfg-status-color-warning);
    --status-urgent-color: var(--cfg-status-color-urgent);
    --header-chevron-bg-idle: var(--cfg-stage-indicator-idle-background-color, #e2e8f0);
    --header-chevron-font-idle: var(--cfg-stage-indicator-idle-content-color, #4b5563);
    --header-chevron-bg-selected: var(--cfg-stage-indicator-selected-background-color, #3b82f6);
    --header-chevron-font-selected: var(--cfg-stage-indicator-selected-content-color, #ffffff);
    --header-chevron-arrow-size: var(--cfg-stage-indicator-arrow-depth, 12px);
    --header-chevron-gap: var(--cfg-stage-indicator-segment-gap, 2px);
    --header-chevron-h-padding: var(--cfg-stage-indicator-flat-padding, 12px);
    --header-chevron-end-padding: var(--cfg-stage-indicator-flat-padding, 16px);
    --header-chevron-tail-padding: var(--cfg-stage-indicator-tail-padding, 12px);
    --header-chevron-head-padding: var(--cfg-stage-indicator-point-padding, 12px);
    --header-chevron-border-weight: var(--cfg-stage-indicator-border-line-weight, 1px);
    --header-stage-font-family: var(--cfg-stage-indicator-font-family);
    --header-stage-font-size: var(--cfg-stage-indicator-font-size);
    --header-stage-font-weight: var(--cfg-stage-indicator-font-weight);
    --header-stage-letter-spacing: var(--cfg-stage-indicator-letter-spacing, 0.5px);
    --cfg-calendar-hour-line-width: var(--cfg-calendar-hour-line-weight);
    --cfg-calendar-item-border-width: var(--cfg-calendar-item-border-line-weight);
}

input[type="checkbox"] {
    -webkit-appearance: none;
    appearance: none;
    width: 16px;
    height: 16px;
    border: var(--cfg-checkbox-border-line-weight, 1px) var(--cfg-checkbox-border-line-style, solid) var(--cfg-checkbox-idle-border-color, #d4d4d4);
    border-radius: var(--cfg-checkbox-border-radius, 4px);
    background-color: var(--cfg-checkbox-idle-background-color, #ffffff);
    display: inline-grid;
    place-content: center;
    cursor: pointer;
    flex-shrink: 0;
    vertical-align: middle;
}
input[type="checkbox"]::after {
    content: "";
    width: 10px;
    height: 10px;
    transform: scale(0);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M13.5 4.5 6.5 11.5 2.5 7.5' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M13.5 4.5 6.5 11.5 2.5 7.5' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
    background-color: var(--cfg-checkbox-check-mark-color, #ffffff);
}
input[type="checkbox"]:checked,
input[type="checkbox"]:indeterminate {
    background-color: var(--cfg-checkbox-checked-background-color, #334155);
    border-color: var(--cfg-checkbox-checked-border-color, #334155);
}
input[type="checkbox"]:checked::after {
    transform: scale(1);
}
input[type="checkbox"]:indeterminate::after {
    transform: scale(1);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8h10' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8h10' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
    background-color: var(--cfg-checkbox-indeterminate-mark-color, #ffffff);
}
input[type="checkbox"]:disabled {
    background-color: var(--cfg-checkbox-disabled-background-color, #f5f5f5);
    border-color: var(--cfg-checkbox-disabled-border-color, #e5e5e5);
    cursor: not-allowed;
}
/* The form view's readonly checkboxes draw their own check via background-image
   (input.field-checkbox.readonly) — suppress the mask mark so they don't get two. */
input[type="checkbox"].readonly::after {
    content: none;
}
