/*!********************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[2]!./node_modules/driver.js/dist/driver.css ***!
  \********************************************************************************************************************************************************************************************************************************/
.driver-active .driver-overlay,.driver-active *{pointer-events:none}.driver-active .driver-active-element,.driver-active .driver-active-element *,.driver-popover,.driver-popover *{pointer-events:auto}@keyframes animate-fade-in{0%{opacity:0}to{opacity:1}}.driver-fade .driver-overlay{animation:animate-fade-in .2s ease-in-out}.driver-fade .driver-popover{animation:animate-fade-in .2s}.driver-popover{all:unset;box-sizing:border-box;color:#2d2d2d;margin:0;padding:15px;border-radius:5px;min-width:250px;max-width:300px;box-shadow:0 1px 10px #0006;z-index:1000000000;position:fixed;top:0;right:0;background-color:#fff}.driver-popover *{font-family:Helvetica Neue,Inter,ui-sans-serif,"Apple Color Emoji",Helvetica,Arial,sans-serif}.driver-popover-title{font:19px/normal sans-serif;font-weight:700;display:block;position:relative;line-height:1.5;zoom:1;margin:0}.driver-popover-close-btn{all:unset;position:absolute;top:0;right:0;width:32px;height:28px;cursor:pointer;font-size:18px;font-weight:500;color:#d2d2d2;z-index:1;text-align:center;transition:color;transition-duration:.2s}.driver-popover-close-btn:hover,.driver-popover-close-btn:focus{color:#2d2d2d}.driver-popover-title[style*=block]+.driver-popover-description{margin-top:5px}.driver-popover-description{margin-bottom:0;font:14px/normal sans-serif;line-height:1.5;font-weight:400;zoom:1}.driver-popover-footer{margin-top:15px;text-align:right;zoom:1;display:flex;align-items:center;justify-content:space-between}.driver-popover-progress-text{font-size:13px;font-weight:400;color:#727272;zoom:1}.driver-popover-footer button{all:unset;display:inline-block;box-sizing:border-box;padding:3px 7px;text-decoration:none;text-shadow:1px 1px 0 #fff;background-color:#fff;color:#2d2d2d;font:12px/normal sans-serif;cursor:pointer;outline:0;zoom:1;line-height:1.3;border:1px solid #ccc;border-radius:3px}.driver-popover-footer .driver-popover-btn-disabled{opacity:.5;pointer-events:none}:not(body):has(>.driver-active-element){overflow:hidden!important}.driver-no-interaction,.driver-no-interaction *{pointer-events:none!important}.driver-popover-footer button:hover,.driver-popover-footer button:focus{background-color:#f7f7f7}.driver-popover-navigation-btns{display:flex;flex-grow:1;justify-content:flex-end}.driver-popover-navigation-btns button+button{margin-left:4px}.driver-popover-arrow{content:"";position:absolute;border:5px solid #fff}.driver-popover-arrow-side-over{display:none}.driver-popover-arrow-side-left{left:100%;border-right-color:transparent;border-bottom-color:transparent;border-top-color:transparent}.driver-popover-arrow-side-right{right:100%;border-left-color:transparent;border-bottom-color:transparent;border-top-color:transparent}.driver-popover-arrow-side-top{top:100%;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent}.driver-popover-arrow-side-bottom{bottom:100%;border-left-color:transparent;border-top-color:transparent;border-right-color:transparent}.driver-popover-arrow-side-center{display:none}.driver-popover-arrow-side-left.driver-popover-arrow-align-start,.driver-popover-arrow-side-right.driver-popover-arrow-align-start{top:15px}.driver-popover-arrow-side-top.driver-popover-arrow-align-start,.driver-popover-arrow-side-bottom.driver-popover-arrow-align-start{left:15px}.driver-popover-arrow-align-end.driver-popover-arrow-side-left,.driver-popover-arrow-align-end.driver-popover-arrow-side-right{bottom:15px}.driver-popover-arrow-side-top.driver-popover-arrow-align-end,.driver-popover-arrow-side-bottom.driver-popover-arrow-align-end{right:15px}.driver-popover-arrow-side-left.driver-popover-arrow-align-center,.driver-popover-arrow-side-right.driver-popover-arrow-align-center{top:50%;margin-top:-5px}.driver-popover-arrow-side-top.driver-popover-arrow-align-center,.driver-popover-arrow-side-bottom.driver-popover-arrow-align-center{left:50%;margin-left:-5px}.driver-popover-arrow-none{display:none}

/*!***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[2]!./node_modules/resolve-url-loader/index.js??ruleSet[1].rules[6].rules[1].use[0]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[6].rules[1].use[1]!./src/styles.scss?ngGlobalStyle ***!
  \***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
@charset "UTF-8";
/* You can add global styles to this file, and also import other style files */
/**
 * Design System Entry Point
 *
 * Import this file to get access to the complete design system:
 * - Design tokens (CSS variables)
 * - Component styles (badges, buttons, forms, etc.)
 * - Table styles (reusable table patterns)
 * - Pagination styles
 * - Search and filter bar styles
 * - Menu styles (context menus, dropdowns)
 *
 * Usage in component SCSS:
 *   @import '@core/design-system/styles';
 */
/**
 * Design System Tokens (Generated)
 *
 * ⚠️ DO NOT EDIT THIS FILE MANUALLY ⚠️
 * This file is auto-generated from TypeScript token definitions.
 * Run 'npm run generate:tokens' to regenerate.
 *
 * Source: src/app/core/design-system/tokens/
 */
:root {
  --color-brand: #0cabf5;
  --color-primary: #2aa5e8;
  --color-primary-hover: #1d7fb8;
  --color-primary-contrast: #ffffff;
  --color-text-primary: #0f172a;
  --color-text-secondary: #475569;
  --color-text-muted: #64748b;
  --color-text-inverse: #e6edf8;
  --color-mute: #94a3b8;
  --color-bg-primary: #f1f5f9;
  --color-bg-secondary: #f8fafc;
  --color-bg-tertiary: #f1f5f9;
  --color-surface: #ffffff;
  --color-surface2: #f8fafc;
  --color-surface3: #f1f5f9;
  --color-surface-external: #fef9e7;
  --color-border: #cbd5e1;
  --color-border2: #cbd5e1;
  --color-border-subtle: #e2e8f0;
  --color-border-strong: #94a3b8;
  --color-line: #e2e8f0;
  --color-accent: #2aa5e8;
  --color-accent2: #1d7fb8;
  --color-accent3: #4fc3f7;
  --color-accent-text: #0d7ab8;
  --color-focus: #2aa5e8;
  --color-success: #16a34a;
  --color-success-hover: #22c55e;
  --color-error: #dc2626;
  --color-error-hover: #ef4444;
  --color-warning: #d97706;
  --color-warning-hover: #f59e0b;
  --color-info: #0d7ab8;
  --color-info-hover: #1d7fb8;
  --color-status-good: #16a34a;
  --color-status-good-text: #15803d;
  --color-status-good-bg: rgba(34, 197, 94, 0.1);
  --color-status-warn: #d97706;
  --color-status-bad: #dc2626;
  --color-rule-allow: #16a34a;
  --color-rule-deny: #dc2626;
  --color-protocol-tcp: #0d7ab8;
  --color-protocol-udp: #7c3aed;
  --color-protocol-other: #d97706;
  --color-protocol-external: #ea580c;
  --color-trust-verified: #16a34a;
  --color-trust-verified-text: #15803d;
  --color-trust-verified-bg: rgba(34, 197, 94, 0.1);
  --color-trust-unverified: #dc2626;
  --color-trust-unverified-text: #b91c1c;
  --color-trust-unverified-bg: rgba(239, 68, 68, 0.08);
  --color-card-bg: #ffffff;
  --color-card-border: #cbd5e1;
  --color-card-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
  --color-toolbar-button-bg: #ffffff;
  --color-toolbar-button-text: #0f172a;
  --color-toolbar-button-hover-bg: #f8fafc;
  --color-button-primary-bg: #2aa5e8;
  --color-button-primary-text: #ffffff;
  --color-button-primary-hover-bg: #1d7fb8;
  --color-button-secondary-bg: #ffffff;
  --color-button-secondary-text: #0f172a;
  --color-button-secondary-border: #e2e8f0;
  --color-button-secondary-hover-bg: #f8fafc;
  --color-button-success-bg: #16a34a;
  --color-button-success-text: #ffffff;
  --color-button-success-hover-bg: #22c55e;
  --color-button-error-bg: #dc2626;
  --color-button-error-text: #ffffff;
  --color-button-error-hover-bg: #ef4444;
  --color-severity-critical: #ef4444;
  --color-severity-critical-text: #b91c1c;
  --color-severity-critical-bg: rgba(239, 68, 68, 0.08);
  --color-severity-critical-border: #ef4444;
  --color-severity-high: #f59e0b;
  --color-severity-high-text: #b45309;
  --color-severity-high-bg: rgba(245, 158, 11, 0.1);
  --color-severity-high-border: #f59e0b;
  --color-severity-medium: #f97316;
  --color-severity-medium-text: #c2410c;
  --color-severity-medium-bg: rgba(249, 115, 22, 0.1);
  --color-severity-medium-border: #f97316;
  --color-severity-low: #2aa5e8;
  --color-severity-low-text: #0d7ab8;
  --color-severity-low-bg: rgba(42, 165, 232, 0.1);
  --color-severity-low-border: #2aa5e8;
  --color-severity-info: #a78bfa;
  --color-severity-info-text: #6d28d9;
  --color-severity-info-bg: rgba(167, 139, 250, 0.1);
  --color-severity-info-border: #a78bfa;
  --color-status-active-bg: rgba(34, 197, 94, 0.1);
  --color-status-active-text: #15803d;
  --color-status-active-border: #16a34a;
  --color-status-inactive-bg: rgba(100, 116, 139, 0.1);
  --color-status-inactive-text: #64748b;
  --color-status-inactive-border: #64748b;
  --color-status-pending-bg: rgba(217, 119, 6, 0.1);
  --color-status-pending-text: #d97706;
  --color-status-pending-border: #d97706;
  --color-status-approved-bg: rgba(34, 197, 94, 0.1);
  --color-status-approved-text: #15803d;
  --color-status-approved-border: #16a34a;
  --color-filter-bg: #f8fafc;
  --color-filter-border: #cbd5e1;
  --color-filter-selected-bg: #2aa5e8;
  --color-filter-selected-text: #ffffff;
  --color-dropdown-bg: #ffffff;
  --color-dropdown-border: #cbd5e1;
  --color-hover-bg: #f8fafc;
  --color-button-hover-bg: #f8fafc;
  --color-focus-ring: #2aa5e8;
  --color-highlight: rgba(42, 165, 232, 0.1);
  --color-text-highlight: rgba(42, 165, 232, 0.1);
  --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04);
  --shadow-md: 0 2px 8px rgba(15, 23, 42, 0.06);
  --shadow-lg: 0 8px 24px rgba(15, 23, 42, 0.1);
  --color-primary-background-alpha10: rgba(25, 118, 210, 0.1);
  --color-primary-background-alpha20: rgba(25, 118, 210, 0.2);
  --color-primary-border-alpha30: rgba(25, 118, 210, 0.3);
  --color-primary-overlay-alpha50: rgba(25, 118, 210, 0.5);
  --color-success-background-alpha10: rgba(40, 167, 69, 0.1);
  --color-success-background-alpha20: rgba(40, 167, 69, 0.2);
  --color-success-border-alpha30: rgba(40, 167, 69, 0.3);
  --color-success-overlay-alpha50: rgba(40, 167, 69, 0.5);
  --color-warning-background-alpha10: rgba(255, 193, 7, 0.1);
  --color-warning-background-alpha20: rgba(255, 193, 7, 0.2);
  --color-warning-border-alpha30: rgba(255, 193, 7, 0.3);
  --color-warning-overlay-alpha50: rgba(255, 193, 7, 0.5);
  --color-error-background-alpha10: rgba(220, 53, 69, 0.1);
  --color-error-background-alpha20: rgba(220, 53, 69, 0.2);
  --color-error-border-alpha30: rgba(220, 53, 69, 0.3);
  --color-error-overlay-alpha50: rgba(220, 53, 69, 0.5);
  --color-info-background-alpha10: rgba(23, 162, 184, 0.1);
  --color-info-background-alpha20: rgba(23, 162, 184, 0.2);
  --color-info-border-alpha30: rgba(23, 162, 184, 0.3);
  --color-info-overlay-alpha50: rgba(23, 162, 184, 0.5);
  --gradient-card: linear-gradient(135deg, #ffffff 0%, #f5f5f5 100%);
  --gradient-primary: linear-gradient(
    135deg,
    var(--color-primary) 0%,
    var(--color-primary-hover) 100%
  );
  --gradient-accent: linear-gradient(135deg, #0cabf5 0%, #1565c0 100%);
  --gradient-success: linear-gradient(135deg, #28a745 0%, #16a34a 100%);
  --gradient-error: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
  --gradient-warning: linear-gradient(135deg, #ffc107 0%, #ff9800 100%);
  --gradient-info: linear-gradient(135deg, #17a2b8 0%, #00bcd4 100%);
  --gradient-overlay: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%);
  --gradient-shimmer: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.2) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  --color-copilot-accent: #7c3aed;
  --color-copilot-accent-hover: #6d28d9;
  --color-copilot-accent-bg: #ede9fe;
  --color-copilot-accent-bg-hover: #ddd6fe;
  --color-copilot-accent-text: #6d28d9;
  --color-copilot-risk-critical-bg: rgba(239, 68, 68, 0.2);
  --color-copilot-risk-critical-text: #dc3545;
  --color-copilot-risk-critical-border: rgba(239, 68, 68, 0.4);
  --color-copilot-risk-high-bg: rgba(251, 146, 60, 0.2);
  --color-copilot-risk-high-text: #ff9800;
  --color-copilot-risk-high-border: rgba(251, 146, 60, 0.4);
  --color-copilot-risk-medium-bg: rgba(250, 204, 21, 0.2);
  --color-copilot-risk-medium-text: #f57c00;
  --color-copilot-risk-medium-border: rgba(250, 204, 21, 0.4);
  --color-copilot-risk-low-bg: rgba(34, 197, 94, 0.2);
  --color-copilot-risk-low-text: #28a745;
  --color-copilot-risk-low-border: rgba(34, 197, 94, 0.4);
  --color-copilot-risk-unknown-bg: rgba(100, 116, 139, 0.2);
  --color-copilot-risk-unknown-text: #6c757d;
  --color-copilot-risk-unknown-border: rgba(100, 116, 139, 0.4);
  --spacing-spacing-xs: 4px;
  --spacing-spacing-sm: 8px;
  --spacing-spacing-md: 12px;
  --spacing-spacing-lg: 16px;
  --spacing-spacing-xl: 24px;
  --spacing-spacing-xxl: 30px;
  --spacing-card-padding: 24px;
  --spacing-card-gap: 16px;
  --spacing-button-padding-vertical: 8px;
  --spacing-button-padding-horizontal: 12px;
  --spacing-button-gap: 8px;
  --spacing-input-padding-vertical: 8px;
  --spacing-input-padding-horizontal: 12px;
  --spacing-form-row-gap: 16px;
  --spacing-form-label-margin: 4px;
  --spacing-section-margin-bottom: 24px;
  --spacing-page-margin-bottom: 30px;
  --spacing-page-margin: 30px;
  --spacing-container-padding: 24px;
  --spacing-grid-gap: 16px;
  --typography-font-family-base:
    "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --typography-font-family-mono:
    "JetBrains Mono", ui-monospace, "Cascadia Code", Menlo, Consolas, monospace;
  --typography-font-size-page-title: 32px;
  --typography-font-weight-page-title: 700;
  --typography-line-height-page-title: 1.2;
  --typography-font-size-h1: 32px;
  --typography-font-weight-h1: 700;
  --typography-line-height-h1: 1.2;
  --typography-font-size-h2: 24px;
  --typography-font-weight-h2: 600;
  --typography-line-height-h2: 1.2;
  --typography-font-size-h3: 20px;
  --typography-font-weight-h3: 600;
  --typography-line-height-h3: 1.2;
  --typography-font-size-h4: 18px;
  --typography-font-weight-h4: 600;
  --typography-line-height-h4: 1.5;
  --typography-font-size-body: 14px;
  --typography-font-weight-body: 400;
  --typography-line-height-body: 1.5;
  --typography-font-size-body-lg: 16px;
  --typography-font-weight-body-lg: 400;
  --typography-line-height-body-lg: 1.5;
  --typography-font-size-body-sm: 13px;
  --typography-font-weight-body-sm: 400;
  --typography-line-height-body-sm: 1.5;
  --typography-font-size-caption: 12px;
  --typography-font-weight-caption: 400;
  --typography-line-height-caption: 1.5;
  --typography-font-size-label: 13px;
  --typography-font-weight-label: 500;
  --typography-line-height-label: 1.5;
  --typography-font-size-button: 14px;
  --typography-font-weight-button: 500;
  --typography-line-height-button: 1.5;
  --typography-font-size-badge: 11px;
  --typography-font-weight-badge: 600;
  --typography-line-height-badge: 1.2;
  --typography-font-size-code: 13px;
  --typography-font-weight-code: 400;
  --typography-line-height-code: 1.5;
  --layout-radius-none: 0px;
  --layout-radius-sm: 4px;
  --layout-radius-base: 6px;
  --layout-radius-lg: 8px;
  --layout-radius-xl: 12px;
  --layout-radius-full: 9999px;
  --layout-control-height-sm: 32px;
  --layout-control-height-base: 36px;
  --layout-control-height-lg: 40px;
  --layout-shadow-none: none;
  --layout-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04);
  --layout-shadow-base: 0 2px 8px rgba(15, 23, 42, 0.06);
  --layout-shadow-md: 0 2px 8px rgba(15, 23, 42, 0.06);
  --layout-shadow-lg: 0 8px 24px rgba(15, 23, 42, 0.1);
  --layout-shadow-xl: 0 8px 24px rgba(15, 23, 42, 0.1);
  --layout-card-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
  --layout-modal-shadow: 0 8px 24px rgba(15, 23, 42, 0.1);
  --layout-dropdown-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
  --layout-button-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.eng-theme--dark {
  --color-brand: #0cabf5;
  --color-primary: #2aa5e8;
  --color-primary-hover: #4fc3f7;
  --color-primary-contrast: #ffffff;
  --color-text-primary: #e6edf8;
  --color-text-secondary: #aabad4;
  --color-text-muted: #6d8bb3;
  --color-text-inverse: #0f172a;
  --color-mute: #4a6690;
  --color-bg-primary: #0a1527;
  --color-bg-secondary: #0e1b31;
  --color-bg-tertiary: #10233f;
  --color-surface: #10233f;
  --color-surface2: #15294a;
  --color-surface3: #1a3358;
  --color-surface-external: #2a1a1f;
  --color-border: #1e3a67;
  --color-border2: #294b80;
  --color-border-subtle: #1e3a67;
  --color-border-strong: #294b80;
  --color-line: #22406f;
  --color-accent: #2aa5e8;
  --color-accent2: #1d7fb8;
  --color-accent3: #4fc3f7;
  --color-accent-text: #2aa5e8;
  --color-focus: #2aa5e8;
  --color-success: #22c55e;
  --color-success-hover: #16a34a;
  --color-error: #ef4444;
  --color-error-hover: #dc2626;
  --color-warning: #f59e0b;
  --color-warning-hover: #d97706;
  --color-info: #2aa5e8;
  --color-info-hover: #4fc3f7;
  --color-status-good: #22c55e;
  --color-status-good-text: #4ade80;
  --color-status-good-bg: rgba(34, 197, 94, 0.14);
  --color-status-warn: #f59e0b;
  --color-status-bad: #ef4444;
  --color-rule-allow: #22c55e;
  --color-rule-deny: #ef4444;
  --color-protocol-tcp: #4fc3f7;
  --color-protocol-udp: #a78bfa;
  --color-protocol-other: #f59e0b;
  --color-protocol-external: #f97316;
  --color-trust-verified: #16a34a;
  --color-trust-verified-text: #4ade80;
  --color-trust-verified-bg: rgba(34, 197, 94, 0.12);
  --color-trust-unverified: #dc2626;
  --color-trust-unverified-text: #fca5a5;
  --color-trust-unverified-bg: rgba(239, 68, 68, 0.12);
  --color-card-bg: #10233f;
  --color-card-border: #1e3a67;
  --color-card-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
  --color-toolbar-button-bg: #ffffff;
  --color-toolbar-button-text: #2c3e50;
  --color-toolbar-button-hover-bg: #f5f5f5;
  --color-button-primary-bg: #2aa5e8;
  --color-button-primary-text: #ffffff;
  --color-button-primary-hover-bg: #4fc3f7;
  --color-button-secondary-bg: #15294a;
  --color-button-secondary-text: #e6edf8;
  --color-button-secondary-border: #294b80;
  --color-button-secondary-hover-bg: #1a3358;
  --color-button-success-bg: #22c55e;
  --color-button-success-text: #ffffff;
  --color-button-success-hover-bg: #16a34a;
  --color-button-error-bg: #ef4444;
  --color-button-error-text: #ffffff;
  --color-button-error-hover-bg: #dc2626;
  --color-severity-critical: #ef4444;
  --color-severity-critical-text: #fca5a5;
  --color-severity-critical-bg: rgba(239, 68, 68, 0.14);
  --color-severity-critical-border: #ef4444;
  --color-severity-high: #f59e0b;
  --color-severity-high-text: #fcd34d;
  --color-severity-high-bg: rgba(245, 158, 11, 0.14);
  --color-severity-high-border: #f59e0b;
  --color-severity-medium: #f97316;
  --color-severity-medium-text: #fdba74;
  --color-severity-medium-bg: rgba(249, 115, 22, 0.14);
  --color-severity-medium-border: #f97316;
  --color-severity-low: #2aa5e8;
  --color-severity-low-text: #4fc3f7;
  --color-severity-low-bg: rgba(42, 165, 232, 0.14);
  --color-severity-low-border: #2aa5e8;
  --color-severity-info: #a78bfa;
  --color-severity-info-text: #c4b5fd;
  --color-severity-info-bg: rgba(167, 139, 250, 0.14);
  --color-severity-info-border: #a78bfa;
  --color-status-active-bg: rgba(34, 197, 94, 0.12);
  --color-status-active-text: #4ade80;
  --color-status-active-border: #16a34a;
  --color-status-inactive-bg: rgba(109, 139, 179, 0.12);
  --color-status-inactive-text: #6d8bb3;
  --color-status-inactive-border: #6d8bb3;
  --color-status-pending-bg: rgba(245, 158, 11, 0.12);
  --color-status-pending-text: #fcd34d;
  --color-status-pending-border: #f59e0b;
  --color-status-approved-bg: rgba(34, 197, 94, 0.12);
  --color-status-approved-text: #4ade80;
  --color-status-approved-border: #16a34a;
  --color-filter-bg: #0e1b31;
  --color-filter-border: #1e3a67;
  --color-filter-selected-bg: #2aa5e8;
  --color-filter-selected-text: #ffffff;
  --color-dropdown-bg: #10233f;
  --color-dropdown-border: #294b80;
  --color-hover-bg: #15294a;
  --color-button-hover-bg: #15294a;
  --color-focus-ring: #2aa5e8;
  --color-highlight: rgba(42, 165, 232, 0.18);
  --color-text-highlight: rgba(42, 165, 232, 0.18);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.2);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.3);
  --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.4);
  --color-primary-background-alpha10: rgba(25, 118, 210, 0.1);
  --color-primary-background-alpha20: rgba(25, 118, 210, 0.2);
  --color-primary-border-alpha30: rgba(25, 118, 210, 0.3);
  --color-primary-overlay-alpha50: rgba(25, 118, 210, 0.5);
  --color-success-background-alpha10: rgba(40, 167, 69, 0.1);
  --color-success-background-alpha20: rgba(40, 167, 69, 0.2);
  --color-success-border-alpha30: rgba(40, 167, 69, 0.3);
  --color-success-overlay-alpha50: rgba(40, 167, 69, 0.5);
  --color-warning-background-alpha10: rgba(255, 193, 7, 0.1);
  --color-warning-background-alpha20: rgba(255, 193, 7, 0.2);
  --color-warning-border-alpha30: rgba(255, 193, 7, 0.3);
  --color-warning-overlay-alpha50: rgba(255, 193, 7, 0.5);
  --color-error-background-alpha10: rgba(220, 53, 69, 0.1);
  --color-error-background-alpha20: rgba(220, 53, 69, 0.2);
  --color-error-border-alpha30: rgba(220, 53, 69, 0.3);
  --color-error-overlay-alpha50: rgba(220, 53, 69, 0.5);
  --color-info-background-alpha10: rgba(23, 162, 184, 0.1);
  --color-info-background-alpha20: rgba(23, 162, 184, 0.2);
  --color-info-border-alpha30: rgba(23, 162, 184, 0.3);
  --color-info-overlay-alpha50: rgba(23, 162, 184, 0.5);
  --gradient-card: linear-gradient(135deg, #243447 0%, #1f2b3b 100%);
  --gradient-primary: linear-gradient(
    135deg,
    var(--color-primary) 0%,
    var(--color-primary-hover) 100%
  );
  --gradient-accent: linear-gradient(135deg, #0cabf5 0%, #1565c0 100%);
  --gradient-success: linear-gradient(135deg, #28a745 0%, #16a34a 100%);
  --gradient-error: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
  --gradient-warning: linear-gradient(135deg, #ffc107 0%, #ff9800 100%);
  --gradient-info: linear-gradient(135deg, #17a2b8 0%, #00bcd4 100%);
  --gradient-overlay: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%);
  --gradient-shimmer: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.2) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  --color-copilot-accent: #7c3aed;
  --color-copilot-accent-hover: #6d28d9;
  --color-copilot-accent-bg: #ede9fe;
  --color-copilot-accent-bg-hover: #ddd6fe;
  --color-copilot-accent-text: #6d28d9;
  --color-copilot-risk-critical-bg: rgba(239, 68, 68, 0.2);
  --color-copilot-risk-critical-text: rgba(248, 113, 113, 1);
  --color-copilot-risk-critical-border: rgba(239, 68, 68, 0.4);
  --color-copilot-risk-high-bg: rgba(251, 146, 60, 0.2);
  --color-copilot-risk-high-text: rgba(251, 146, 60, 1);
  --color-copilot-risk-high-border: rgba(251, 146, 60, 0.4);
  --color-copilot-risk-medium-bg: rgba(250, 204, 21, 0.2);
  --color-copilot-risk-medium-text: rgba(253, 224, 71, 1);
  --color-copilot-risk-medium-border: rgba(250, 204, 21, 0.4);
  --color-copilot-risk-low-bg: rgba(34, 197, 94, 0.2);
  --color-copilot-risk-low-text: rgba(74, 222, 128, 1);
  --color-copilot-risk-low-border: rgba(34, 197, 94, 0.4);
  --color-copilot-risk-unknown-bg: rgba(100, 116, 139, 0.2);
  --color-copilot-risk-unknown-text: rgba(148, 163, 184, 1);
  --color-copilot-risk-unknown-border: rgba(100, 116, 139, 0.4);
}

:root {
  --color-background-gray: var(--color-bg-secondary);
  --color-white: var(--color-bg-primary);
  --color-card-background: var(--color-card-bg);
  --color-filter-background: var(--color-filter-bg);
  --color-filter-selected: var(--color-filter-selected-bg);
  --color-dropdown-background: var(--color-dropdown-bg);
  --font-size-sm: var(--typography-font-size-body-sm);
  --font-size-base: var(--typography-font-size-body);
  --font-size-lg: var(--typography-font-size-h2);
  --font-weight-normal: var(--typography-font-weight-body);
  --font-weight-medium: var(--typography-font-weight-label);
  --font-weight-bold: var(--typography-font-weight-h1);
  --line-height-base: var(--typography-line-height-body);
  --line-height-tight: var(--typography-line-height-h1);
  --control-height: var(--layout-control-height-base);
  --radius-base: var(--layout-radius-base);
  --radius-lg: var(--layout-radius-lg);
  --spacing-xs: var(--spacing-spacing-xs);
  --spacing-sm: var(--spacing-spacing-sm);
  --spacing-md: var(--spacing-spacing-md);
  --spacing-lg: var(--spacing-spacing-lg);
  --spacing-xl: var(--spacing-spacing-xl);
  --spacing-xxl: var(--spacing-spacing-xxl);
}

.eng-theme--dark {
  --color-border-accent: var(--color-border-strong);
  --color-hover-background: var(--color-hover-bg);
  --color-button-hover: var(--color-button-hover-bg);
}

/**
 * segmentation-v2 Compact Alias Names
 *
 * Temporary aliases mapping the compact `--bg`, `--ink`, `--accent`, etc.
 * naming convention used in segmentation-v2 to the canonical
 * `--color-bg-primary`, `--color-text-primary` semantic tokens.
 *
 * Purpose: lets segmentation-v2 SCSS files keep working while we migrate
 * them onto the global design system. Once Phase 4 finishes rewiring
 * segmentation-v2 to consume the canonical names, this file can be deleted.
 *
 * Do NOT introduce new usages of these short names in any other view.
 */
:root,
.eng-theme--light,
.eng-theme--dark {
  --bg: var(--color-bg-primary);
  --bg-2: var(--color-bg-secondary);
  --surface: var(--color-surface);
  --surface-2: var(--color-surface2);
  --surface-3: var(--color-surface3);
  --surface-external: var(--color-surface-external);
  --border: var(--color-border);
  --border-2: var(--color-border2);
  --line: var(--color-line);
  --ink: var(--color-text-primary);
  --ink-2: var(--color-text-secondary);
  --ink-3: var(--color-text-muted);
  --mute: var(--color-mute);
  --accent: var(--color-accent);
  --accent-2: var(--color-accent2);
  --accent-3: var(--color-accent3);
  --focus: var(--color-focus);
  --good: var(--color-status-good);
  --warn: var(--color-status-warn);
  --bad: var(--color-status-bad);
  --rule-allow: var(--color-rule-allow);
  --rule-deny: var(--color-rule-deny);
  --tcp: var(--color-protocol-tcp);
  --udp: var(--color-protocol-udp);
  --other: var(--color-protocol-other);
  --external: var(--color-protocol-external);
  --verified: var(--color-trust-verified);
  --verified-text: var(--color-trust-verified-text);
  --verified-bg: var(--color-trust-verified-bg);
  --unverified: var(--color-trust-unverified);
  --unverified-text: var(--color-trust-unverified-text);
  --unverified-bg: var(--color-trust-unverified-bg);
}

/**
 * Design System — Typography utilities
 *
 * Composable classes for the typography patterns used in segmentation-v2.
 *
 * Usage:
 *   <span class="eng-eyebrow">CATEGORY</span>
 *   <span class="eng-numeric">1,234</span>
 *   <code class="eng-mono">0a:b3:fc:...</code>
 */
/**
 * Design System Tokens (Generated)
 *
 * ⚠️ DO NOT EDIT THIS FILE MANUALLY ⚠️
 * This file is auto-generated from TypeScript token definitions.
 * Run 'npm run generate:tokens' to regenerate.
 *
 * Source: src/app/core/design-system/tokens/
 */
:root {
  --color-brand: #0cabf5;
  --color-primary: #2aa5e8;
  --color-primary-hover: #1d7fb8;
  --color-primary-contrast: #ffffff;
  --color-text-primary: #0f172a;
  --color-text-secondary: #475569;
  --color-text-muted: #64748b;
  --color-text-inverse: #e6edf8;
  --color-mute: #94a3b8;
  --color-bg-primary: #f1f5f9;
  --color-bg-secondary: #f8fafc;
  --color-bg-tertiary: #f1f5f9;
  --color-surface: #ffffff;
  --color-surface2: #f8fafc;
  --color-surface3: #f1f5f9;
  --color-surface-external: #fef9e7;
  --color-border: #cbd5e1;
  --color-border2: #cbd5e1;
  --color-border-subtle: #e2e8f0;
  --color-border-strong: #94a3b8;
  --color-line: #e2e8f0;
  --color-accent: #2aa5e8;
  --color-accent2: #1d7fb8;
  --color-accent3: #4fc3f7;
  --color-accent-text: #0d7ab8;
  --color-focus: #2aa5e8;
  --color-success: #16a34a;
  --color-success-hover: #22c55e;
  --color-error: #dc2626;
  --color-error-hover: #ef4444;
  --color-warning: #d97706;
  --color-warning-hover: #f59e0b;
  --color-info: #0d7ab8;
  --color-info-hover: #1d7fb8;
  --color-status-good: #16a34a;
  --color-status-good-text: #15803d;
  --color-status-good-bg: rgba(34, 197, 94, 0.1);
  --color-status-warn: #d97706;
  --color-status-bad: #dc2626;
  --color-rule-allow: #16a34a;
  --color-rule-deny: #dc2626;
  --color-protocol-tcp: #0d7ab8;
  --color-protocol-udp: #7c3aed;
  --color-protocol-other: #d97706;
  --color-protocol-external: #ea580c;
  --color-trust-verified: #16a34a;
  --color-trust-verified-text: #15803d;
  --color-trust-verified-bg: rgba(34, 197, 94, 0.1);
  --color-trust-unverified: #dc2626;
  --color-trust-unverified-text: #b91c1c;
  --color-trust-unverified-bg: rgba(239, 68, 68, 0.08);
  --color-card-bg: #ffffff;
  --color-card-border: #cbd5e1;
  --color-card-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
  --color-toolbar-button-bg: #ffffff;
  --color-toolbar-button-text: #0f172a;
  --color-toolbar-button-hover-bg: #f8fafc;
  --color-button-primary-bg: #2aa5e8;
  --color-button-primary-text: #ffffff;
  --color-button-primary-hover-bg: #1d7fb8;
  --color-button-secondary-bg: #ffffff;
  --color-button-secondary-text: #0f172a;
  --color-button-secondary-border: #e2e8f0;
  --color-button-secondary-hover-bg: #f8fafc;
  --color-button-success-bg: #16a34a;
  --color-button-success-text: #ffffff;
  --color-button-success-hover-bg: #22c55e;
  --color-button-error-bg: #dc2626;
  --color-button-error-text: #ffffff;
  --color-button-error-hover-bg: #ef4444;
  --color-severity-critical: #ef4444;
  --color-severity-critical-text: #b91c1c;
  --color-severity-critical-bg: rgba(239, 68, 68, 0.08);
  --color-severity-critical-border: #ef4444;
  --color-severity-high: #f59e0b;
  --color-severity-high-text: #b45309;
  --color-severity-high-bg: rgba(245, 158, 11, 0.1);
  --color-severity-high-border: #f59e0b;
  --color-severity-medium: #f97316;
  --color-severity-medium-text: #c2410c;
  --color-severity-medium-bg: rgba(249, 115, 22, 0.1);
  --color-severity-medium-border: #f97316;
  --color-severity-low: #2aa5e8;
  --color-severity-low-text: #0d7ab8;
  --color-severity-low-bg: rgba(42, 165, 232, 0.1);
  --color-severity-low-border: #2aa5e8;
  --color-severity-info: #a78bfa;
  --color-severity-info-text: #6d28d9;
  --color-severity-info-bg: rgba(167, 139, 250, 0.1);
  --color-severity-info-border: #a78bfa;
  --color-status-active-bg: rgba(34, 197, 94, 0.1);
  --color-status-active-text: #15803d;
  --color-status-active-border: #16a34a;
  --color-status-inactive-bg: rgba(100, 116, 139, 0.1);
  --color-status-inactive-text: #64748b;
  --color-status-inactive-border: #64748b;
  --color-status-pending-bg: rgba(217, 119, 6, 0.1);
  --color-status-pending-text: #d97706;
  --color-status-pending-border: #d97706;
  --color-status-approved-bg: rgba(34, 197, 94, 0.1);
  --color-status-approved-text: #15803d;
  --color-status-approved-border: #16a34a;
  --color-filter-bg: #f8fafc;
  --color-filter-border: #cbd5e1;
  --color-filter-selected-bg: #2aa5e8;
  --color-filter-selected-text: #ffffff;
  --color-dropdown-bg: #ffffff;
  --color-dropdown-border: #cbd5e1;
  --color-hover-bg: #f8fafc;
  --color-button-hover-bg: #f8fafc;
  --color-focus-ring: #2aa5e8;
  --color-highlight: rgba(42, 165, 232, 0.1);
  --color-text-highlight: rgba(42, 165, 232, 0.1);
  --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04);
  --shadow-md: 0 2px 8px rgba(15, 23, 42, 0.06);
  --shadow-lg: 0 8px 24px rgba(15, 23, 42, 0.1);
  --color-primary-background-alpha10: rgba(25, 118, 210, 0.1);
  --color-primary-background-alpha20: rgba(25, 118, 210, 0.2);
  --color-primary-border-alpha30: rgba(25, 118, 210, 0.3);
  --color-primary-overlay-alpha50: rgba(25, 118, 210, 0.5);
  --color-success-background-alpha10: rgba(40, 167, 69, 0.1);
  --color-success-background-alpha20: rgba(40, 167, 69, 0.2);
  --color-success-border-alpha30: rgba(40, 167, 69, 0.3);
  --color-success-overlay-alpha50: rgba(40, 167, 69, 0.5);
  --color-warning-background-alpha10: rgba(255, 193, 7, 0.1);
  --color-warning-background-alpha20: rgba(255, 193, 7, 0.2);
  --color-warning-border-alpha30: rgba(255, 193, 7, 0.3);
  --color-warning-overlay-alpha50: rgba(255, 193, 7, 0.5);
  --color-error-background-alpha10: rgba(220, 53, 69, 0.1);
  --color-error-background-alpha20: rgba(220, 53, 69, 0.2);
  --color-error-border-alpha30: rgba(220, 53, 69, 0.3);
  --color-error-overlay-alpha50: rgba(220, 53, 69, 0.5);
  --color-info-background-alpha10: rgba(23, 162, 184, 0.1);
  --color-info-background-alpha20: rgba(23, 162, 184, 0.2);
  --color-info-border-alpha30: rgba(23, 162, 184, 0.3);
  --color-info-overlay-alpha50: rgba(23, 162, 184, 0.5);
  --gradient-card: linear-gradient(135deg, #ffffff 0%, #f5f5f5 100%);
  --gradient-primary: linear-gradient(
    135deg,
    var(--color-primary) 0%,
    var(--color-primary-hover) 100%
  );
  --gradient-accent: linear-gradient(135deg, #0cabf5 0%, #1565c0 100%);
  --gradient-success: linear-gradient(135deg, #28a745 0%, #16a34a 100%);
  --gradient-error: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
  --gradient-warning: linear-gradient(135deg, #ffc107 0%, #ff9800 100%);
  --gradient-info: linear-gradient(135deg, #17a2b8 0%, #00bcd4 100%);
  --gradient-overlay: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%);
  --gradient-shimmer: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.2) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  --color-copilot-accent: #7c3aed;
  --color-copilot-accent-hover: #6d28d9;
  --color-copilot-accent-bg: #ede9fe;
  --color-copilot-accent-bg-hover: #ddd6fe;
  --color-copilot-accent-text: #6d28d9;
  --color-copilot-risk-critical-bg: rgba(239, 68, 68, 0.2);
  --color-copilot-risk-critical-text: #dc3545;
  --color-copilot-risk-critical-border: rgba(239, 68, 68, 0.4);
  --color-copilot-risk-high-bg: rgba(251, 146, 60, 0.2);
  --color-copilot-risk-high-text: #ff9800;
  --color-copilot-risk-high-border: rgba(251, 146, 60, 0.4);
  --color-copilot-risk-medium-bg: rgba(250, 204, 21, 0.2);
  --color-copilot-risk-medium-text: #f57c00;
  --color-copilot-risk-medium-border: rgba(250, 204, 21, 0.4);
  --color-copilot-risk-low-bg: rgba(34, 197, 94, 0.2);
  --color-copilot-risk-low-text: #28a745;
  --color-copilot-risk-low-border: rgba(34, 197, 94, 0.4);
  --color-copilot-risk-unknown-bg: rgba(100, 116, 139, 0.2);
  --color-copilot-risk-unknown-text: #6c757d;
  --color-copilot-risk-unknown-border: rgba(100, 116, 139, 0.4);
  --spacing-spacing-xs: 4px;
  --spacing-spacing-sm: 8px;
  --spacing-spacing-md: 12px;
  --spacing-spacing-lg: 16px;
  --spacing-spacing-xl: 24px;
  --spacing-spacing-xxl: 30px;
  --spacing-card-padding: 24px;
  --spacing-card-gap: 16px;
  --spacing-button-padding-vertical: 8px;
  --spacing-button-padding-horizontal: 12px;
  --spacing-button-gap: 8px;
  --spacing-input-padding-vertical: 8px;
  --spacing-input-padding-horizontal: 12px;
  --spacing-form-row-gap: 16px;
  --spacing-form-label-margin: 4px;
  --spacing-section-margin-bottom: 24px;
  --spacing-page-margin-bottom: 30px;
  --spacing-page-margin: 30px;
  --spacing-container-padding: 24px;
  --spacing-grid-gap: 16px;
  --typography-font-family-base:
    "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --typography-font-family-mono:
    "JetBrains Mono", ui-monospace, "Cascadia Code", Menlo, Consolas, monospace;
  --typography-font-size-page-title: 32px;
  --typography-font-weight-page-title: 700;
  --typography-line-height-page-title: 1.2;
  --typography-font-size-h1: 32px;
  --typography-font-weight-h1: 700;
  --typography-line-height-h1: 1.2;
  --typography-font-size-h2: 24px;
  --typography-font-weight-h2: 600;
  --typography-line-height-h2: 1.2;
  --typography-font-size-h3: 20px;
  --typography-font-weight-h3: 600;
  --typography-line-height-h3: 1.2;
  --typography-font-size-h4: 18px;
  --typography-font-weight-h4: 600;
  --typography-line-height-h4: 1.5;
  --typography-font-size-body: 14px;
  --typography-font-weight-body: 400;
  --typography-line-height-body: 1.5;
  --typography-font-size-body-lg: 16px;
  --typography-font-weight-body-lg: 400;
  --typography-line-height-body-lg: 1.5;
  --typography-font-size-body-sm: 13px;
  --typography-font-weight-body-sm: 400;
  --typography-line-height-body-sm: 1.5;
  --typography-font-size-caption: 12px;
  --typography-font-weight-caption: 400;
  --typography-line-height-caption: 1.5;
  --typography-font-size-label: 13px;
  --typography-font-weight-label: 500;
  --typography-line-height-label: 1.5;
  --typography-font-size-button: 14px;
  --typography-font-weight-button: 500;
  --typography-line-height-button: 1.5;
  --typography-font-size-badge: 11px;
  --typography-font-weight-badge: 600;
  --typography-line-height-badge: 1.2;
  --typography-font-size-code: 13px;
  --typography-font-weight-code: 400;
  --typography-line-height-code: 1.5;
  --layout-radius-none: 0px;
  --layout-radius-sm: 4px;
  --layout-radius-base: 6px;
  --layout-radius-lg: 8px;
  --layout-radius-xl: 12px;
  --layout-radius-full: 9999px;
  --layout-control-height-sm: 32px;
  --layout-control-height-base: 36px;
  --layout-control-height-lg: 40px;
  --layout-shadow-none: none;
  --layout-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04);
  --layout-shadow-base: 0 2px 8px rgba(15, 23, 42, 0.06);
  --layout-shadow-md: 0 2px 8px rgba(15, 23, 42, 0.06);
  --layout-shadow-lg: 0 8px 24px rgba(15, 23, 42, 0.1);
  --layout-shadow-xl: 0 8px 24px rgba(15, 23, 42, 0.1);
  --layout-card-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
  --layout-modal-shadow: 0 8px 24px rgba(15, 23, 42, 0.1);
  --layout-dropdown-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
  --layout-button-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.eng-theme--dark {
  --color-brand: #0cabf5;
  --color-primary: #2aa5e8;
  --color-primary-hover: #4fc3f7;
  --color-primary-contrast: #ffffff;
  --color-text-primary: #e6edf8;
  --color-text-secondary: #aabad4;
  --color-text-muted: #6d8bb3;
  --color-text-inverse: #0f172a;
  --color-mute: #4a6690;
  --color-bg-primary: #0a1527;
  --color-bg-secondary: #0e1b31;
  --color-bg-tertiary: #10233f;
  --color-surface: #10233f;
  --color-surface2: #15294a;
  --color-surface3: #1a3358;
  --color-surface-external: #2a1a1f;
  --color-border: #1e3a67;
  --color-border2: #294b80;
  --color-border-subtle: #1e3a67;
  --color-border-strong: #294b80;
  --color-line: #22406f;
  --color-accent: #2aa5e8;
  --color-accent2: #1d7fb8;
  --color-accent3: #4fc3f7;
  --color-accent-text: #2aa5e8;
  --color-focus: #2aa5e8;
  --color-success: #22c55e;
  --color-success-hover: #16a34a;
  --color-error: #ef4444;
  --color-error-hover: #dc2626;
  --color-warning: #f59e0b;
  --color-warning-hover: #d97706;
  --color-info: #2aa5e8;
  --color-info-hover: #4fc3f7;
  --color-status-good: #22c55e;
  --color-status-good-text: #4ade80;
  --color-status-good-bg: rgba(34, 197, 94, 0.14);
  --color-status-warn: #f59e0b;
  --color-status-bad: #ef4444;
  --color-rule-allow: #22c55e;
  --color-rule-deny: #ef4444;
  --color-protocol-tcp: #4fc3f7;
  --color-protocol-udp: #a78bfa;
  --color-protocol-other: #f59e0b;
  --color-protocol-external: #f97316;
  --color-trust-verified: #16a34a;
  --color-trust-verified-text: #4ade80;
  --color-trust-verified-bg: rgba(34, 197, 94, 0.12);
  --color-trust-unverified: #dc2626;
  --color-trust-unverified-text: #fca5a5;
  --color-trust-unverified-bg: rgba(239, 68, 68, 0.12);
  --color-card-bg: #10233f;
  --color-card-border: #1e3a67;
  --color-card-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
  --color-toolbar-button-bg: #ffffff;
  --color-toolbar-button-text: #2c3e50;
  --color-toolbar-button-hover-bg: #f5f5f5;
  --color-button-primary-bg: #2aa5e8;
  --color-button-primary-text: #ffffff;
  --color-button-primary-hover-bg: #4fc3f7;
  --color-button-secondary-bg: #15294a;
  --color-button-secondary-text: #e6edf8;
  --color-button-secondary-border: #294b80;
  --color-button-secondary-hover-bg: #1a3358;
  --color-button-success-bg: #22c55e;
  --color-button-success-text: #ffffff;
  --color-button-success-hover-bg: #16a34a;
  --color-button-error-bg: #ef4444;
  --color-button-error-text: #ffffff;
  --color-button-error-hover-bg: #dc2626;
  --color-severity-critical: #ef4444;
  --color-severity-critical-text: #fca5a5;
  --color-severity-critical-bg: rgba(239, 68, 68, 0.14);
  --color-severity-critical-border: #ef4444;
  --color-severity-high: #f59e0b;
  --color-severity-high-text: #fcd34d;
  --color-severity-high-bg: rgba(245, 158, 11, 0.14);
  --color-severity-high-border: #f59e0b;
  --color-severity-medium: #f97316;
  --color-severity-medium-text: #fdba74;
  --color-severity-medium-bg: rgba(249, 115, 22, 0.14);
  --color-severity-medium-border: #f97316;
  --color-severity-low: #2aa5e8;
  --color-severity-low-text: #4fc3f7;
  --color-severity-low-bg: rgba(42, 165, 232, 0.14);
  --color-severity-low-border: #2aa5e8;
  --color-severity-info: #a78bfa;
  --color-severity-info-text: #c4b5fd;
  --color-severity-info-bg: rgba(167, 139, 250, 0.14);
  --color-severity-info-border: #a78bfa;
  --color-status-active-bg: rgba(34, 197, 94, 0.12);
  --color-status-active-text: #4ade80;
  --color-status-active-border: #16a34a;
  --color-status-inactive-bg: rgba(109, 139, 179, 0.12);
  --color-status-inactive-text: #6d8bb3;
  --color-status-inactive-border: #6d8bb3;
  --color-status-pending-bg: rgba(245, 158, 11, 0.12);
  --color-status-pending-text: #fcd34d;
  --color-status-pending-border: #f59e0b;
  --color-status-approved-bg: rgba(34, 197, 94, 0.12);
  --color-status-approved-text: #4ade80;
  --color-status-approved-border: #16a34a;
  --color-filter-bg: #0e1b31;
  --color-filter-border: #1e3a67;
  --color-filter-selected-bg: #2aa5e8;
  --color-filter-selected-text: #ffffff;
  --color-dropdown-bg: #10233f;
  --color-dropdown-border: #294b80;
  --color-hover-bg: #15294a;
  --color-button-hover-bg: #15294a;
  --color-focus-ring: #2aa5e8;
  --color-highlight: rgba(42, 165, 232, 0.18);
  --color-text-highlight: rgba(42, 165, 232, 0.18);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.2);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.3);
  --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.4);
  --color-primary-background-alpha10: rgba(25, 118, 210, 0.1);
  --color-primary-background-alpha20: rgba(25, 118, 210, 0.2);
  --color-primary-border-alpha30: rgba(25, 118, 210, 0.3);
  --color-primary-overlay-alpha50: rgba(25, 118, 210, 0.5);
  --color-success-background-alpha10: rgba(40, 167, 69, 0.1);
  --color-success-background-alpha20: rgba(40, 167, 69, 0.2);
  --color-success-border-alpha30: rgba(40, 167, 69, 0.3);
  --color-success-overlay-alpha50: rgba(40, 167, 69, 0.5);
  --color-warning-background-alpha10: rgba(255, 193, 7, 0.1);
  --color-warning-background-alpha20: rgba(255, 193, 7, 0.2);
  --color-warning-border-alpha30: rgba(255, 193, 7, 0.3);
  --color-warning-overlay-alpha50: rgba(255, 193, 7, 0.5);
  --color-error-background-alpha10: rgba(220, 53, 69, 0.1);
  --color-error-background-alpha20: rgba(220, 53, 69, 0.2);
  --color-error-border-alpha30: rgba(220, 53, 69, 0.3);
  --color-error-overlay-alpha50: rgba(220, 53, 69, 0.5);
  --color-info-background-alpha10: rgba(23, 162, 184, 0.1);
  --color-info-background-alpha20: rgba(23, 162, 184, 0.2);
  --color-info-border-alpha30: rgba(23, 162, 184, 0.3);
  --color-info-overlay-alpha50: rgba(23, 162, 184, 0.5);
  --gradient-card: linear-gradient(135deg, #243447 0%, #1f2b3b 100%);
  --gradient-primary: linear-gradient(
    135deg,
    var(--color-primary) 0%,
    var(--color-primary-hover) 100%
  );
  --gradient-accent: linear-gradient(135deg, #0cabf5 0%, #1565c0 100%);
  --gradient-success: linear-gradient(135deg, #28a745 0%, #16a34a 100%);
  --gradient-error: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
  --gradient-warning: linear-gradient(135deg, #ffc107 0%, #ff9800 100%);
  --gradient-info: linear-gradient(135deg, #17a2b8 0%, #00bcd4 100%);
  --gradient-overlay: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%);
  --gradient-shimmer: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.2) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  --color-copilot-accent: #7c3aed;
  --color-copilot-accent-hover: #6d28d9;
  --color-copilot-accent-bg: #ede9fe;
  --color-copilot-accent-bg-hover: #ddd6fe;
  --color-copilot-accent-text: #6d28d9;
  --color-copilot-risk-critical-bg: rgba(239, 68, 68, 0.2);
  --color-copilot-risk-critical-text: rgba(248, 113, 113, 1);
  --color-copilot-risk-critical-border: rgba(239, 68, 68, 0.4);
  --color-copilot-risk-high-bg: rgba(251, 146, 60, 0.2);
  --color-copilot-risk-high-text: rgba(251, 146, 60, 1);
  --color-copilot-risk-high-border: rgba(251, 146, 60, 0.4);
  --color-copilot-risk-medium-bg: rgba(250, 204, 21, 0.2);
  --color-copilot-risk-medium-text: rgba(253, 224, 71, 1);
  --color-copilot-risk-medium-border: rgba(250, 204, 21, 0.4);
  --color-copilot-risk-low-bg: rgba(34, 197, 94, 0.2);
  --color-copilot-risk-low-text: rgba(74, 222, 128, 1);
  --color-copilot-risk-low-border: rgba(34, 197, 94, 0.4);
  --color-copilot-risk-unknown-bg: rgba(100, 116, 139, 0.2);
  --color-copilot-risk-unknown-text: rgba(148, 163, 184, 1);
  --color-copilot-risk-unknown-border: rgba(100, 116, 139, 0.4);
}

:root {
  --color-background-gray: var(--color-bg-secondary);
  --color-white: var(--color-bg-primary);
  --color-card-background: var(--color-card-bg);
  --color-filter-background: var(--color-filter-bg);
  --color-filter-selected: var(--color-filter-selected-bg);
  --color-dropdown-background: var(--color-dropdown-bg);
  --font-size-sm: var(--typography-font-size-body-sm);
  --font-size-base: var(--typography-font-size-body);
  --font-size-lg: var(--typography-font-size-h2);
  --font-weight-normal: var(--typography-font-weight-body);
  --font-weight-medium: var(--typography-font-weight-label);
  --font-weight-bold: var(--typography-font-weight-h1);
  --line-height-base: var(--typography-line-height-body);
  --line-height-tight: var(--typography-line-height-h1);
  --control-height: var(--layout-control-height-base);
  --radius-base: var(--layout-radius-base);
  --radius-lg: var(--layout-radius-lg);
  --spacing-xs: var(--spacing-spacing-xs);
  --spacing-sm: var(--spacing-spacing-sm);
  --spacing-md: var(--spacing-spacing-md);
  --spacing-lg: var(--spacing-spacing-lg);
  --spacing-xl: var(--spacing-spacing-xl);
  --spacing-xxl: var(--spacing-spacing-xxl);
}

.eng-theme--dark {
  --color-border-accent: var(--color-border-strong);
  --color-hover-background: var(--color-hover-bg);
  --color-button-hover: var(--color-button-hover-bg);
}

.eng-eyebrow {
  font-family: var(--typography-font-family-base);
  font-size: 10px;
  font-weight: var(--typography-font-weight-label);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-text-muted);
  line-height: 1.2;
}

.eng-numeric {
  font-family: var(--typography-font-family-base);
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}

.eng-mono {
  font-family: var(--typography-font-family-mono);
  font-size: var(--typography-font-size-code);
  line-height: var(--typography-line-height-code);
}

/**
 * Design System — Surfaces
 *
 * Composable classes for the panel / card / grid-background patterns
 * extracted from segmentation-v2. Read tokens only; no hardcoded values.
 *
 * Usage:
 *   <div class="eng-panel">...</div>
 *   <div class="eng-panel eng-panel--inset">...</div>
 *   <div class="eng-grid-bg">...</div>
 */
/**
 * Design System Tokens (Generated)
 *
 * ⚠️ DO NOT EDIT THIS FILE MANUALLY ⚠️
 * This file is auto-generated from TypeScript token definitions.
 * Run 'npm run generate:tokens' to regenerate.
 *
 * Source: src/app/core/design-system/tokens/
 */
:root {
  --color-brand: #0cabf5;
  --color-primary: #2aa5e8;
  --color-primary-hover: #1d7fb8;
  --color-primary-contrast: #ffffff;
  --color-text-primary: #0f172a;
  --color-text-secondary: #475569;
  --color-text-muted: #64748b;
  --color-text-inverse: #e6edf8;
  --color-mute: #94a3b8;
  --color-bg-primary: #f1f5f9;
  --color-bg-secondary: #f8fafc;
  --color-bg-tertiary: #f1f5f9;
  --color-surface: #ffffff;
  --color-surface2: #f8fafc;
  --color-surface3: #f1f5f9;
  --color-surface-external: #fef9e7;
  --color-border: #cbd5e1;
  --color-border2: #cbd5e1;
  --color-border-subtle: #e2e8f0;
  --color-border-strong: #94a3b8;
  --color-line: #e2e8f0;
  --color-accent: #2aa5e8;
  --color-accent2: #1d7fb8;
  --color-accent3: #4fc3f7;
  --color-accent-text: #0d7ab8;
  --color-focus: #2aa5e8;
  --color-success: #16a34a;
  --color-success-hover: #22c55e;
  --color-error: #dc2626;
  --color-error-hover: #ef4444;
  --color-warning: #d97706;
  --color-warning-hover: #f59e0b;
  --color-info: #0d7ab8;
  --color-info-hover: #1d7fb8;
  --color-status-good: #16a34a;
  --color-status-good-text: #15803d;
  --color-status-good-bg: rgba(34, 197, 94, 0.1);
  --color-status-warn: #d97706;
  --color-status-bad: #dc2626;
  --color-rule-allow: #16a34a;
  --color-rule-deny: #dc2626;
  --color-protocol-tcp: #0d7ab8;
  --color-protocol-udp: #7c3aed;
  --color-protocol-other: #d97706;
  --color-protocol-external: #ea580c;
  --color-trust-verified: #16a34a;
  --color-trust-verified-text: #15803d;
  --color-trust-verified-bg: rgba(34, 197, 94, 0.1);
  --color-trust-unverified: #dc2626;
  --color-trust-unverified-text: #b91c1c;
  --color-trust-unverified-bg: rgba(239, 68, 68, 0.08);
  --color-card-bg: #ffffff;
  --color-card-border: #cbd5e1;
  --color-card-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
  --color-toolbar-button-bg: #ffffff;
  --color-toolbar-button-text: #0f172a;
  --color-toolbar-button-hover-bg: #f8fafc;
  --color-button-primary-bg: #2aa5e8;
  --color-button-primary-text: #ffffff;
  --color-button-primary-hover-bg: #1d7fb8;
  --color-button-secondary-bg: #ffffff;
  --color-button-secondary-text: #0f172a;
  --color-button-secondary-border: #e2e8f0;
  --color-button-secondary-hover-bg: #f8fafc;
  --color-button-success-bg: #16a34a;
  --color-button-success-text: #ffffff;
  --color-button-success-hover-bg: #22c55e;
  --color-button-error-bg: #dc2626;
  --color-button-error-text: #ffffff;
  --color-button-error-hover-bg: #ef4444;
  --color-severity-critical: #ef4444;
  --color-severity-critical-text: #b91c1c;
  --color-severity-critical-bg: rgba(239, 68, 68, 0.08);
  --color-severity-critical-border: #ef4444;
  --color-severity-high: #f59e0b;
  --color-severity-high-text: #b45309;
  --color-severity-high-bg: rgba(245, 158, 11, 0.1);
  --color-severity-high-border: #f59e0b;
  --color-severity-medium: #f97316;
  --color-severity-medium-text: #c2410c;
  --color-severity-medium-bg: rgba(249, 115, 22, 0.1);
  --color-severity-medium-border: #f97316;
  --color-severity-low: #2aa5e8;
  --color-severity-low-text: #0d7ab8;
  --color-severity-low-bg: rgba(42, 165, 232, 0.1);
  --color-severity-low-border: #2aa5e8;
  --color-severity-info: #a78bfa;
  --color-severity-info-text: #6d28d9;
  --color-severity-info-bg: rgba(167, 139, 250, 0.1);
  --color-severity-info-border: #a78bfa;
  --color-status-active-bg: rgba(34, 197, 94, 0.1);
  --color-status-active-text: #15803d;
  --color-status-active-border: #16a34a;
  --color-status-inactive-bg: rgba(100, 116, 139, 0.1);
  --color-status-inactive-text: #64748b;
  --color-status-inactive-border: #64748b;
  --color-status-pending-bg: rgba(217, 119, 6, 0.1);
  --color-status-pending-text: #d97706;
  --color-status-pending-border: #d97706;
  --color-status-approved-bg: rgba(34, 197, 94, 0.1);
  --color-status-approved-text: #15803d;
  --color-status-approved-border: #16a34a;
  --color-filter-bg: #f8fafc;
  --color-filter-border: #cbd5e1;
  --color-filter-selected-bg: #2aa5e8;
  --color-filter-selected-text: #ffffff;
  --color-dropdown-bg: #ffffff;
  --color-dropdown-border: #cbd5e1;
  --color-hover-bg: #f8fafc;
  --color-button-hover-bg: #f8fafc;
  --color-focus-ring: #2aa5e8;
  --color-highlight: rgba(42, 165, 232, 0.1);
  --color-text-highlight: rgba(42, 165, 232, 0.1);
  --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04);
  --shadow-md: 0 2px 8px rgba(15, 23, 42, 0.06);
  --shadow-lg: 0 8px 24px rgba(15, 23, 42, 0.1);
  --color-primary-background-alpha10: rgba(25, 118, 210, 0.1);
  --color-primary-background-alpha20: rgba(25, 118, 210, 0.2);
  --color-primary-border-alpha30: rgba(25, 118, 210, 0.3);
  --color-primary-overlay-alpha50: rgba(25, 118, 210, 0.5);
  --color-success-background-alpha10: rgba(40, 167, 69, 0.1);
  --color-success-background-alpha20: rgba(40, 167, 69, 0.2);
  --color-success-border-alpha30: rgba(40, 167, 69, 0.3);
  --color-success-overlay-alpha50: rgba(40, 167, 69, 0.5);
  --color-warning-background-alpha10: rgba(255, 193, 7, 0.1);
  --color-warning-background-alpha20: rgba(255, 193, 7, 0.2);
  --color-warning-border-alpha30: rgba(255, 193, 7, 0.3);
  --color-warning-overlay-alpha50: rgba(255, 193, 7, 0.5);
  --color-error-background-alpha10: rgba(220, 53, 69, 0.1);
  --color-error-background-alpha20: rgba(220, 53, 69, 0.2);
  --color-error-border-alpha30: rgba(220, 53, 69, 0.3);
  --color-error-overlay-alpha50: rgba(220, 53, 69, 0.5);
  --color-info-background-alpha10: rgba(23, 162, 184, 0.1);
  --color-info-background-alpha20: rgba(23, 162, 184, 0.2);
  --color-info-border-alpha30: rgba(23, 162, 184, 0.3);
  --color-info-overlay-alpha50: rgba(23, 162, 184, 0.5);
  --gradient-card: linear-gradient(135deg, #ffffff 0%, #f5f5f5 100%);
  --gradient-primary: linear-gradient(
    135deg,
    var(--color-primary) 0%,
    var(--color-primary-hover) 100%
  );
  --gradient-accent: linear-gradient(135deg, #0cabf5 0%, #1565c0 100%);
  --gradient-success: linear-gradient(135deg, #28a745 0%, #16a34a 100%);
  --gradient-error: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
  --gradient-warning: linear-gradient(135deg, #ffc107 0%, #ff9800 100%);
  --gradient-info: linear-gradient(135deg, #17a2b8 0%, #00bcd4 100%);
  --gradient-overlay: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%);
  --gradient-shimmer: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.2) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  --color-copilot-accent: #7c3aed;
  --color-copilot-accent-hover: #6d28d9;
  --color-copilot-accent-bg: #ede9fe;
  --color-copilot-accent-bg-hover: #ddd6fe;
  --color-copilot-accent-text: #6d28d9;
  --color-copilot-risk-critical-bg: rgba(239, 68, 68, 0.2);
  --color-copilot-risk-critical-text: #dc3545;
  --color-copilot-risk-critical-border: rgba(239, 68, 68, 0.4);
  --color-copilot-risk-high-bg: rgba(251, 146, 60, 0.2);
  --color-copilot-risk-high-text: #ff9800;
  --color-copilot-risk-high-border: rgba(251, 146, 60, 0.4);
  --color-copilot-risk-medium-bg: rgba(250, 204, 21, 0.2);
  --color-copilot-risk-medium-text: #f57c00;
  --color-copilot-risk-medium-border: rgba(250, 204, 21, 0.4);
  --color-copilot-risk-low-bg: rgba(34, 197, 94, 0.2);
  --color-copilot-risk-low-text: #28a745;
  --color-copilot-risk-low-border: rgba(34, 197, 94, 0.4);
  --color-copilot-risk-unknown-bg: rgba(100, 116, 139, 0.2);
  --color-copilot-risk-unknown-text: #6c757d;
  --color-copilot-risk-unknown-border: rgba(100, 116, 139, 0.4);
  --spacing-spacing-xs: 4px;
  --spacing-spacing-sm: 8px;
  --spacing-spacing-md: 12px;
  --spacing-spacing-lg: 16px;
  --spacing-spacing-xl: 24px;
  --spacing-spacing-xxl: 30px;
  --spacing-card-padding: 24px;
  --spacing-card-gap: 16px;
  --spacing-button-padding-vertical: 8px;
  --spacing-button-padding-horizontal: 12px;
  --spacing-button-gap: 8px;
  --spacing-input-padding-vertical: 8px;
  --spacing-input-padding-horizontal: 12px;
  --spacing-form-row-gap: 16px;
  --spacing-form-label-margin: 4px;
  --spacing-section-margin-bottom: 24px;
  --spacing-page-margin-bottom: 30px;
  --spacing-page-margin: 30px;
  --spacing-container-padding: 24px;
  --spacing-grid-gap: 16px;
  --typography-font-family-base:
    "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --typography-font-family-mono:
    "JetBrains Mono", ui-monospace, "Cascadia Code", Menlo, Consolas, monospace;
  --typography-font-size-page-title: 32px;
  --typography-font-weight-page-title: 700;
  --typography-line-height-page-title: 1.2;
  --typography-font-size-h1: 32px;
  --typography-font-weight-h1: 700;
  --typography-line-height-h1: 1.2;
  --typography-font-size-h2: 24px;
  --typography-font-weight-h2: 600;
  --typography-line-height-h2: 1.2;
  --typography-font-size-h3: 20px;
  --typography-font-weight-h3: 600;
  --typography-line-height-h3: 1.2;
  --typography-font-size-h4: 18px;
  --typography-font-weight-h4: 600;
  --typography-line-height-h4: 1.5;
  --typography-font-size-body: 14px;
  --typography-font-weight-body: 400;
  --typography-line-height-body: 1.5;
  --typography-font-size-body-lg: 16px;
  --typography-font-weight-body-lg: 400;
  --typography-line-height-body-lg: 1.5;
  --typography-font-size-body-sm: 13px;
  --typography-font-weight-body-sm: 400;
  --typography-line-height-body-sm: 1.5;
  --typography-font-size-caption: 12px;
  --typography-font-weight-caption: 400;
  --typography-line-height-caption: 1.5;
  --typography-font-size-label: 13px;
  --typography-font-weight-label: 500;
  --typography-line-height-label: 1.5;
  --typography-font-size-button: 14px;
  --typography-font-weight-button: 500;
  --typography-line-height-button: 1.5;
  --typography-font-size-badge: 11px;
  --typography-font-weight-badge: 600;
  --typography-line-height-badge: 1.2;
  --typography-font-size-code: 13px;
  --typography-font-weight-code: 400;
  --typography-line-height-code: 1.5;
  --layout-radius-none: 0px;
  --layout-radius-sm: 4px;
  --layout-radius-base: 6px;
  --layout-radius-lg: 8px;
  --layout-radius-xl: 12px;
  --layout-radius-full: 9999px;
  --layout-control-height-sm: 32px;
  --layout-control-height-base: 36px;
  --layout-control-height-lg: 40px;
  --layout-shadow-none: none;
  --layout-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04);
  --layout-shadow-base: 0 2px 8px rgba(15, 23, 42, 0.06);
  --layout-shadow-md: 0 2px 8px rgba(15, 23, 42, 0.06);
  --layout-shadow-lg: 0 8px 24px rgba(15, 23, 42, 0.1);
  --layout-shadow-xl: 0 8px 24px rgba(15, 23, 42, 0.1);
  --layout-card-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
  --layout-modal-shadow: 0 8px 24px rgba(15, 23, 42, 0.1);
  --layout-dropdown-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
  --layout-button-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.eng-theme--dark {
  --color-brand: #0cabf5;
  --color-primary: #2aa5e8;
  --color-primary-hover: #4fc3f7;
  --color-primary-contrast: #ffffff;
  --color-text-primary: #e6edf8;
  --color-text-secondary: #aabad4;
  --color-text-muted: #6d8bb3;
  --color-text-inverse: #0f172a;
  --color-mute: #4a6690;
  --color-bg-primary: #0a1527;
  --color-bg-secondary: #0e1b31;
  --color-bg-tertiary: #10233f;
  --color-surface: #10233f;
  --color-surface2: #15294a;
  --color-surface3: #1a3358;
  --color-surface-external: #2a1a1f;
  --color-border: #1e3a67;
  --color-border2: #294b80;
  --color-border-subtle: #1e3a67;
  --color-border-strong: #294b80;
  --color-line: #22406f;
  --color-accent: #2aa5e8;
  --color-accent2: #1d7fb8;
  --color-accent3: #4fc3f7;
  --color-accent-text: #2aa5e8;
  --color-focus: #2aa5e8;
  --color-success: #22c55e;
  --color-success-hover: #16a34a;
  --color-error: #ef4444;
  --color-error-hover: #dc2626;
  --color-warning: #f59e0b;
  --color-warning-hover: #d97706;
  --color-info: #2aa5e8;
  --color-info-hover: #4fc3f7;
  --color-status-good: #22c55e;
  --color-status-good-text: #4ade80;
  --color-status-good-bg: rgba(34, 197, 94, 0.14);
  --color-status-warn: #f59e0b;
  --color-status-bad: #ef4444;
  --color-rule-allow: #22c55e;
  --color-rule-deny: #ef4444;
  --color-protocol-tcp: #4fc3f7;
  --color-protocol-udp: #a78bfa;
  --color-protocol-other: #f59e0b;
  --color-protocol-external: #f97316;
  --color-trust-verified: #16a34a;
  --color-trust-verified-text: #4ade80;
  --color-trust-verified-bg: rgba(34, 197, 94, 0.12);
  --color-trust-unverified: #dc2626;
  --color-trust-unverified-text: #fca5a5;
  --color-trust-unverified-bg: rgba(239, 68, 68, 0.12);
  --color-card-bg: #10233f;
  --color-card-border: #1e3a67;
  --color-card-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
  --color-toolbar-button-bg: #ffffff;
  --color-toolbar-button-text: #2c3e50;
  --color-toolbar-button-hover-bg: #f5f5f5;
  --color-button-primary-bg: #2aa5e8;
  --color-button-primary-text: #ffffff;
  --color-button-primary-hover-bg: #4fc3f7;
  --color-button-secondary-bg: #15294a;
  --color-button-secondary-text: #e6edf8;
  --color-button-secondary-border: #294b80;
  --color-button-secondary-hover-bg: #1a3358;
  --color-button-success-bg: #22c55e;
  --color-button-success-text: #ffffff;
  --color-button-success-hover-bg: #16a34a;
  --color-button-error-bg: #ef4444;
  --color-button-error-text: #ffffff;
  --color-button-error-hover-bg: #dc2626;
  --color-severity-critical: #ef4444;
  --color-severity-critical-text: #fca5a5;
  --color-severity-critical-bg: rgba(239, 68, 68, 0.14);
  --color-severity-critical-border: #ef4444;
  --color-severity-high: #f59e0b;
  --color-severity-high-text: #fcd34d;
  --color-severity-high-bg: rgba(245, 158, 11, 0.14);
  --color-severity-high-border: #f59e0b;
  --color-severity-medium: #f97316;
  --color-severity-medium-text: #fdba74;
  --color-severity-medium-bg: rgba(249, 115, 22, 0.14);
  --color-severity-medium-border: #f97316;
  --color-severity-low: #2aa5e8;
  --color-severity-low-text: #4fc3f7;
  --color-severity-low-bg: rgba(42, 165, 232, 0.14);
  --color-severity-low-border: #2aa5e8;
  --color-severity-info: #a78bfa;
  --color-severity-info-text: #c4b5fd;
  --color-severity-info-bg: rgba(167, 139, 250, 0.14);
  --color-severity-info-border: #a78bfa;
  --color-status-active-bg: rgba(34, 197, 94, 0.12);
  --color-status-active-text: #4ade80;
  --color-status-active-border: #16a34a;
  --color-status-inactive-bg: rgba(109, 139, 179, 0.12);
  --color-status-inactive-text: #6d8bb3;
  --color-status-inactive-border: #6d8bb3;
  --color-status-pending-bg: rgba(245, 158, 11, 0.12);
  --color-status-pending-text: #fcd34d;
  --color-status-pending-border: #f59e0b;
  --color-status-approved-bg: rgba(34, 197, 94, 0.12);
  --color-status-approved-text: #4ade80;
  --color-status-approved-border: #16a34a;
  --color-filter-bg: #0e1b31;
  --color-filter-border: #1e3a67;
  --color-filter-selected-bg: #2aa5e8;
  --color-filter-selected-text: #ffffff;
  --color-dropdown-bg: #10233f;
  --color-dropdown-border: #294b80;
  --color-hover-bg: #15294a;
  --color-button-hover-bg: #15294a;
  --color-focus-ring: #2aa5e8;
  --color-highlight: rgba(42, 165, 232, 0.18);
  --color-text-highlight: rgba(42, 165, 232, 0.18);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.2);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.3);
  --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.4);
  --color-primary-background-alpha10: rgba(25, 118, 210, 0.1);
  --color-primary-background-alpha20: rgba(25, 118, 210, 0.2);
  --color-primary-border-alpha30: rgba(25, 118, 210, 0.3);
  --color-primary-overlay-alpha50: rgba(25, 118, 210, 0.5);
  --color-success-background-alpha10: rgba(40, 167, 69, 0.1);
  --color-success-background-alpha20: rgba(40, 167, 69, 0.2);
  --color-success-border-alpha30: rgba(40, 167, 69, 0.3);
  --color-success-overlay-alpha50: rgba(40, 167, 69, 0.5);
  --color-warning-background-alpha10: rgba(255, 193, 7, 0.1);
  --color-warning-background-alpha20: rgba(255, 193, 7, 0.2);
  --color-warning-border-alpha30: rgba(255, 193, 7, 0.3);
  --color-warning-overlay-alpha50: rgba(255, 193, 7, 0.5);
  --color-error-background-alpha10: rgba(220, 53, 69, 0.1);
  --color-error-background-alpha20: rgba(220, 53, 69, 0.2);
  --color-error-border-alpha30: rgba(220, 53, 69, 0.3);
  --color-error-overlay-alpha50: rgba(220, 53, 69, 0.5);
  --color-info-background-alpha10: rgba(23, 162, 184, 0.1);
  --color-info-background-alpha20: rgba(23, 162, 184, 0.2);
  --color-info-border-alpha30: rgba(23, 162, 184, 0.3);
  --color-info-overlay-alpha50: rgba(23, 162, 184, 0.5);
  --gradient-card: linear-gradient(135deg, #243447 0%, #1f2b3b 100%);
  --gradient-primary: linear-gradient(
    135deg,
    var(--color-primary) 0%,
    var(--color-primary-hover) 100%
  );
  --gradient-accent: linear-gradient(135deg, #0cabf5 0%, #1565c0 100%);
  --gradient-success: linear-gradient(135deg, #28a745 0%, #16a34a 100%);
  --gradient-error: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
  --gradient-warning: linear-gradient(135deg, #ffc107 0%, #ff9800 100%);
  --gradient-info: linear-gradient(135deg, #17a2b8 0%, #00bcd4 100%);
  --gradient-overlay: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%);
  --gradient-shimmer: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.2) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  --color-copilot-accent: #7c3aed;
  --color-copilot-accent-hover: #6d28d9;
  --color-copilot-accent-bg: #ede9fe;
  --color-copilot-accent-bg-hover: #ddd6fe;
  --color-copilot-accent-text: #6d28d9;
  --color-copilot-risk-critical-bg: rgba(239, 68, 68, 0.2);
  --color-copilot-risk-critical-text: rgba(248, 113, 113, 1);
  --color-copilot-risk-critical-border: rgba(239, 68, 68, 0.4);
  --color-copilot-risk-high-bg: rgba(251, 146, 60, 0.2);
  --color-copilot-risk-high-text: rgba(251, 146, 60, 1);
  --color-copilot-risk-high-border: rgba(251, 146, 60, 0.4);
  --color-copilot-risk-medium-bg: rgba(250, 204, 21, 0.2);
  --color-copilot-risk-medium-text: rgba(253, 224, 71, 1);
  --color-copilot-risk-medium-border: rgba(250, 204, 21, 0.4);
  --color-copilot-risk-low-bg: rgba(34, 197, 94, 0.2);
  --color-copilot-risk-low-text: rgba(74, 222, 128, 1);
  --color-copilot-risk-low-border: rgba(34, 197, 94, 0.4);
  --color-copilot-risk-unknown-bg: rgba(100, 116, 139, 0.2);
  --color-copilot-risk-unknown-text: rgba(148, 163, 184, 1);
  --color-copilot-risk-unknown-border: rgba(100, 116, 139, 0.4);
}

:root {
  --color-background-gray: var(--color-bg-secondary);
  --color-white: var(--color-bg-primary);
  --color-card-background: var(--color-card-bg);
  --color-filter-background: var(--color-filter-bg);
  --color-filter-selected: var(--color-filter-selected-bg);
  --color-dropdown-background: var(--color-dropdown-bg);
  --font-size-sm: var(--typography-font-size-body-sm);
  --font-size-base: var(--typography-font-size-body);
  --font-size-lg: var(--typography-font-size-h2);
  --font-weight-normal: var(--typography-font-weight-body);
  --font-weight-medium: var(--typography-font-weight-label);
  --font-weight-bold: var(--typography-font-weight-h1);
  --line-height-base: var(--typography-line-height-body);
  --line-height-tight: var(--typography-line-height-h1);
  --control-height: var(--layout-control-height-base);
  --radius-base: var(--layout-radius-base);
  --radius-lg: var(--layout-radius-lg);
  --spacing-xs: var(--spacing-spacing-xs);
  --spacing-sm: var(--spacing-spacing-sm);
  --spacing-md: var(--spacing-spacing-md);
  --spacing-lg: var(--spacing-spacing-lg);
  --spacing-xl: var(--spacing-spacing-xl);
  --spacing-xxl: var(--spacing-spacing-xxl);
}

.eng-theme--dark {
  --color-border-accent: var(--color-border-strong);
  --color-hover-background: var(--color-hover-bg);
  --color-button-hover: var(--color-button-hover-bg);
}

.eng-panel {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--layout-radius-sm);
  box-shadow: var(--shadow-sm);
  color: var(--color-text-primary);
}
.eng-panel--inset {
  background: var(--color-surface2);
  box-shadow: none;
}
.eng-panel--deep-inset {
  background: var(--color-surface3);
  box-shadow: none;
}
.eng-panel--external {
  background: var(--color-surface-external);
  border-color: var(--color-border);
}
.eng-panel--elevated {
  box-shadow: var(--shadow-md);
}
.eng-panel--floating {
  box-shadow: var(--shadow-lg);
}

.eng-panel__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-md);
  padding: var(--spacing-md) var(--spacing-lg);
  border-bottom: 1px solid var(--color-border);
}

.eng-panel__title {
  font-family: var(--typography-font-family-base);
  font-size: var(--typography-font-size-body-lg);
  font-weight: var(--typography-font-weight-h4);
  color: var(--color-text-primary);
  margin: 0;
}

.eng-panel__body {
  padding: var(--spacing-lg);
}

.eng-grid-bg {
  background-image: linear-gradient(rgba(15, 23, 42, 0.04) 1px, transparent 1px), linear-gradient(90deg, rgba(15, 23, 42, 0.04) 1px, transparent 1px);
  background-size: 32px 32px;
}
.eng-theme--dark .eng-grid-bg {
  background-image: linear-gradient(rgba(255, 255, 255, 0.025) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.025) 1px, transparent 1px);
}

/**
 * Design System — Pills
 *
 * Status / trust / protocol / severity pills. Replaces ad-hoc
 * .cat-pill, .trust-pill, .severity-pill clones scattered across views.
 *
 * Usage:
 *   <span class="eng-pill eng-pill--verified">Verified</span>
 *   <span class="eng-pill eng-pill--severity-high">High</span>
 *   <span class="eng-pill eng-pill--protocol-tcp">TCP</span>
 */
/**
 * Design System Tokens (Generated)
 *
 * ⚠️ DO NOT EDIT THIS FILE MANUALLY ⚠️
 * This file is auto-generated from TypeScript token definitions.
 * Run 'npm run generate:tokens' to regenerate.
 *
 * Source: src/app/core/design-system/tokens/
 */
:root {
  --color-brand: #0cabf5;
  --color-primary: #2aa5e8;
  --color-primary-hover: #1d7fb8;
  --color-primary-contrast: #ffffff;
  --color-text-primary: #0f172a;
  --color-text-secondary: #475569;
  --color-text-muted: #64748b;
  --color-text-inverse: #e6edf8;
  --color-mute: #94a3b8;
  --color-bg-primary: #f1f5f9;
  --color-bg-secondary: #f8fafc;
  --color-bg-tertiary: #f1f5f9;
  --color-surface: #ffffff;
  --color-surface2: #f8fafc;
  --color-surface3: #f1f5f9;
  --color-surface-external: #fef9e7;
  --color-border: #cbd5e1;
  --color-border2: #cbd5e1;
  --color-border-subtle: #e2e8f0;
  --color-border-strong: #94a3b8;
  --color-line: #e2e8f0;
  --color-accent: #2aa5e8;
  --color-accent2: #1d7fb8;
  --color-accent3: #4fc3f7;
  --color-accent-text: #0d7ab8;
  --color-focus: #2aa5e8;
  --color-success: #16a34a;
  --color-success-hover: #22c55e;
  --color-error: #dc2626;
  --color-error-hover: #ef4444;
  --color-warning: #d97706;
  --color-warning-hover: #f59e0b;
  --color-info: #0d7ab8;
  --color-info-hover: #1d7fb8;
  --color-status-good: #16a34a;
  --color-status-good-text: #15803d;
  --color-status-good-bg: rgba(34, 197, 94, 0.1);
  --color-status-warn: #d97706;
  --color-status-bad: #dc2626;
  --color-rule-allow: #16a34a;
  --color-rule-deny: #dc2626;
  --color-protocol-tcp: #0d7ab8;
  --color-protocol-udp: #7c3aed;
  --color-protocol-other: #d97706;
  --color-protocol-external: #ea580c;
  --color-trust-verified: #16a34a;
  --color-trust-verified-text: #15803d;
  --color-trust-verified-bg: rgba(34, 197, 94, 0.1);
  --color-trust-unverified: #dc2626;
  --color-trust-unverified-text: #b91c1c;
  --color-trust-unverified-bg: rgba(239, 68, 68, 0.08);
  --color-card-bg: #ffffff;
  --color-card-border: #cbd5e1;
  --color-card-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
  --color-toolbar-button-bg: #ffffff;
  --color-toolbar-button-text: #0f172a;
  --color-toolbar-button-hover-bg: #f8fafc;
  --color-button-primary-bg: #2aa5e8;
  --color-button-primary-text: #ffffff;
  --color-button-primary-hover-bg: #1d7fb8;
  --color-button-secondary-bg: #ffffff;
  --color-button-secondary-text: #0f172a;
  --color-button-secondary-border: #e2e8f0;
  --color-button-secondary-hover-bg: #f8fafc;
  --color-button-success-bg: #16a34a;
  --color-button-success-text: #ffffff;
  --color-button-success-hover-bg: #22c55e;
  --color-button-error-bg: #dc2626;
  --color-button-error-text: #ffffff;
  --color-button-error-hover-bg: #ef4444;
  --color-severity-critical: #ef4444;
  --color-severity-critical-text: #b91c1c;
  --color-severity-critical-bg: rgba(239, 68, 68, 0.08);
  --color-severity-critical-border: #ef4444;
  --color-severity-high: #f59e0b;
  --color-severity-high-text: #b45309;
  --color-severity-high-bg: rgba(245, 158, 11, 0.1);
  --color-severity-high-border: #f59e0b;
  --color-severity-medium: #f97316;
  --color-severity-medium-text: #c2410c;
  --color-severity-medium-bg: rgba(249, 115, 22, 0.1);
  --color-severity-medium-border: #f97316;
  --color-severity-low: #2aa5e8;
  --color-severity-low-text: #0d7ab8;
  --color-severity-low-bg: rgba(42, 165, 232, 0.1);
  --color-severity-low-border: #2aa5e8;
  --color-severity-info: #a78bfa;
  --color-severity-info-text: #6d28d9;
  --color-severity-info-bg: rgba(167, 139, 250, 0.1);
  --color-severity-info-border: #a78bfa;
  --color-status-active-bg: rgba(34, 197, 94, 0.1);
  --color-status-active-text: #15803d;
  --color-status-active-border: #16a34a;
  --color-status-inactive-bg: rgba(100, 116, 139, 0.1);
  --color-status-inactive-text: #64748b;
  --color-status-inactive-border: #64748b;
  --color-status-pending-bg: rgba(217, 119, 6, 0.1);
  --color-status-pending-text: #d97706;
  --color-status-pending-border: #d97706;
  --color-status-approved-bg: rgba(34, 197, 94, 0.1);
  --color-status-approved-text: #15803d;
  --color-status-approved-border: #16a34a;
  --color-filter-bg: #f8fafc;
  --color-filter-border: #cbd5e1;
  --color-filter-selected-bg: #2aa5e8;
  --color-filter-selected-text: #ffffff;
  --color-dropdown-bg: #ffffff;
  --color-dropdown-border: #cbd5e1;
  --color-hover-bg: #f8fafc;
  --color-button-hover-bg: #f8fafc;
  --color-focus-ring: #2aa5e8;
  --color-highlight: rgba(42, 165, 232, 0.1);
  --color-text-highlight: rgba(42, 165, 232, 0.1);
  --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04);
  --shadow-md: 0 2px 8px rgba(15, 23, 42, 0.06);
  --shadow-lg: 0 8px 24px rgba(15, 23, 42, 0.1);
  --color-primary-background-alpha10: rgba(25, 118, 210, 0.1);
  --color-primary-background-alpha20: rgba(25, 118, 210, 0.2);
  --color-primary-border-alpha30: rgba(25, 118, 210, 0.3);
  --color-primary-overlay-alpha50: rgba(25, 118, 210, 0.5);
  --color-success-background-alpha10: rgba(40, 167, 69, 0.1);
  --color-success-background-alpha20: rgba(40, 167, 69, 0.2);
  --color-success-border-alpha30: rgba(40, 167, 69, 0.3);
  --color-success-overlay-alpha50: rgba(40, 167, 69, 0.5);
  --color-warning-background-alpha10: rgba(255, 193, 7, 0.1);
  --color-warning-background-alpha20: rgba(255, 193, 7, 0.2);
  --color-warning-border-alpha30: rgba(255, 193, 7, 0.3);
  --color-warning-overlay-alpha50: rgba(255, 193, 7, 0.5);
  --color-error-background-alpha10: rgba(220, 53, 69, 0.1);
  --color-error-background-alpha20: rgba(220, 53, 69, 0.2);
  --color-error-border-alpha30: rgba(220, 53, 69, 0.3);
  --color-error-overlay-alpha50: rgba(220, 53, 69, 0.5);
  --color-info-background-alpha10: rgba(23, 162, 184, 0.1);
  --color-info-background-alpha20: rgba(23, 162, 184, 0.2);
  --color-info-border-alpha30: rgba(23, 162, 184, 0.3);
  --color-info-overlay-alpha50: rgba(23, 162, 184, 0.5);
  --gradient-card: linear-gradient(135deg, #ffffff 0%, #f5f5f5 100%);
  --gradient-primary: linear-gradient(
    135deg,
    var(--color-primary) 0%,
    var(--color-primary-hover) 100%
  );
  --gradient-accent: linear-gradient(135deg, #0cabf5 0%, #1565c0 100%);
  --gradient-success: linear-gradient(135deg, #28a745 0%, #16a34a 100%);
  --gradient-error: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
  --gradient-warning: linear-gradient(135deg, #ffc107 0%, #ff9800 100%);
  --gradient-info: linear-gradient(135deg, #17a2b8 0%, #00bcd4 100%);
  --gradient-overlay: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%);
  --gradient-shimmer: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.2) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  --color-copilot-accent: #7c3aed;
  --color-copilot-accent-hover: #6d28d9;
  --color-copilot-accent-bg: #ede9fe;
  --color-copilot-accent-bg-hover: #ddd6fe;
  --color-copilot-accent-text: #6d28d9;
  --color-copilot-risk-critical-bg: rgba(239, 68, 68, 0.2);
  --color-copilot-risk-critical-text: #dc3545;
  --color-copilot-risk-critical-border: rgba(239, 68, 68, 0.4);
  --color-copilot-risk-high-bg: rgba(251, 146, 60, 0.2);
  --color-copilot-risk-high-text: #ff9800;
  --color-copilot-risk-high-border: rgba(251, 146, 60, 0.4);
  --color-copilot-risk-medium-bg: rgba(250, 204, 21, 0.2);
  --color-copilot-risk-medium-text: #f57c00;
  --color-copilot-risk-medium-border: rgba(250, 204, 21, 0.4);
  --color-copilot-risk-low-bg: rgba(34, 197, 94, 0.2);
  --color-copilot-risk-low-text: #28a745;
  --color-copilot-risk-low-border: rgba(34, 197, 94, 0.4);
  --color-copilot-risk-unknown-bg: rgba(100, 116, 139, 0.2);
  --color-copilot-risk-unknown-text: #6c757d;
  --color-copilot-risk-unknown-border: rgba(100, 116, 139, 0.4);
  --spacing-spacing-xs: 4px;
  --spacing-spacing-sm: 8px;
  --spacing-spacing-md: 12px;
  --spacing-spacing-lg: 16px;
  --spacing-spacing-xl: 24px;
  --spacing-spacing-xxl: 30px;
  --spacing-card-padding: 24px;
  --spacing-card-gap: 16px;
  --spacing-button-padding-vertical: 8px;
  --spacing-button-padding-horizontal: 12px;
  --spacing-button-gap: 8px;
  --spacing-input-padding-vertical: 8px;
  --spacing-input-padding-horizontal: 12px;
  --spacing-form-row-gap: 16px;
  --spacing-form-label-margin: 4px;
  --spacing-section-margin-bottom: 24px;
  --spacing-page-margin-bottom: 30px;
  --spacing-page-margin: 30px;
  --spacing-container-padding: 24px;
  --spacing-grid-gap: 16px;
  --typography-font-family-base:
    "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --typography-font-family-mono:
    "JetBrains Mono", ui-monospace, "Cascadia Code", Menlo, Consolas, monospace;
  --typography-font-size-page-title: 32px;
  --typography-font-weight-page-title: 700;
  --typography-line-height-page-title: 1.2;
  --typography-font-size-h1: 32px;
  --typography-font-weight-h1: 700;
  --typography-line-height-h1: 1.2;
  --typography-font-size-h2: 24px;
  --typography-font-weight-h2: 600;
  --typography-line-height-h2: 1.2;
  --typography-font-size-h3: 20px;
  --typography-font-weight-h3: 600;
  --typography-line-height-h3: 1.2;
  --typography-font-size-h4: 18px;
  --typography-font-weight-h4: 600;
  --typography-line-height-h4: 1.5;
  --typography-font-size-body: 14px;
  --typography-font-weight-body: 400;
  --typography-line-height-body: 1.5;
  --typography-font-size-body-lg: 16px;
  --typography-font-weight-body-lg: 400;
  --typography-line-height-body-lg: 1.5;
  --typography-font-size-body-sm: 13px;
  --typography-font-weight-body-sm: 400;
  --typography-line-height-body-sm: 1.5;
  --typography-font-size-caption: 12px;
  --typography-font-weight-caption: 400;
  --typography-line-height-caption: 1.5;
  --typography-font-size-label: 13px;
  --typography-font-weight-label: 500;
  --typography-line-height-label: 1.5;
  --typography-font-size-button: 14px;
  --typography-font-weight-button: 500;
  --typography-line-height-button: 1.5;
  --typography-font-size-badge: 11px;
  --typography-font-weight-badge: 600;
  --typography-line-height-badge: 1.2;
  --typography-font-size-code: 13px;
  --typography-font-weight-code: 400;
  --typography-line-height-code: 1.5;
  --layout-radius-none: 0px;
  --layout-radius-sm: 4px;
  --layout-radius-base: 6px;
  --layout-radius-lg: 8px;
  --layout-radius-xl: 12px;
  --layout-radius-full: 9999px;
  --layout-control-height-sm: 32px;
  --layout-control-height-base: 36px;
  --layout-control-height-lg: 40px;
  --layout-shadow-none: none;
  --layout-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04);
  --layout-shadow-base: 0 2px 8px rgba(15, 23, 42, 0.06);
  --layout-shadow-md: 0 2px 8px rgba(15, 23, 42, 0.06);
  --layout-shadow-lg: 0 8px 24px rgba(15, 23, 42, 0.1);
  --layout-shadow-xl: 0 8px 24px rgba(15, 23, 42, 0.1);
  --layout-card-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
  --layout-modal-shadow: 0 8px 24px rgba(15, 23, 42, 0.1);
  --layout-dropdown-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
  --layout-button-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.eng-theme--dark {
  --color-brand: #0cabf5;
  --color-primary: #2aa5e8;
  --color-primary-hover: #4fc3f7;
  --color-primary-contrast: #ffffff;
  --color-text-primary: #e6edf8;
  --color-text-secondary: #aabad4;
  --color-text-muted: #6d8bb3;
  --color-text-inverse: #0f172a;
  --color-mute: #4a6690;
  --color-bg-primary: #0a1527;
  --color-bg-secondary: #0e1b31;
  --color-bg-tertiary: #10233f;
  --color-surface: #10233f;
  --color-surface2: #15294a;
  --color-surface3: #1a3358;
  --color-surface-external: #2a1a1f;
  --color-border: #1e3a67;
  --color-border2: #294b80;
  --color-border-subtle: #1e3a67;
  --color-border-strong: #294b80;
  --color-line: #22406f;
  --color-accent: #2aa5e8;
  --color-accent2: #1d7fb8;
  --color-accent3: #4fc3f7;
  --color-accent-text: #2aa5e8;
  --color-focus: #2aa5e8;
  --color-success: #22c55e;
  --color-success-hover: #16a34a;
  --color-error: #ef4444;
  --color-error-hover: #dc2626;
  --color-warning: #f59e0b;
  --color-warning-hover: #d97706;
  --color-info: #2aa5e8;
  --color-info-hover: #4fc3f7;
  --color-status-good: #22c55e;
  --color-status-good-text: #4ade80;
  --color-status-good-bg: rgba(34, 197, 94, 0.14);
  --color-status-warn: #f59e0b;
  --color-status-bad: #ef4444;
  --color-rule-allow: #22c55e;
  --color-rule-deny: #ef4444;
  --color-protocol-tcp: #4fc3f7;
  --color-protocol-udp: #a78bfa;
  --color-protocol-other: #f59e0b;
  --color-protocol-external: #f97316;
  --color-trust-verified: #16a34a;
  --color-trust-verified-text: #4ade80;
  --color-trust-verified-bg: rgba(34, 197, 94, 0.12);
  --color-trust-unverified: #dc2626;
  --color-trust-unverified-text: #fca5a5;
  --color-trust-unverified-bg: rgba(239, 68, 68, 0.12);
  --color-card-bg: #10233f;
  --color-card-border: #1e3a67;
  --color-card-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
  --color-toolbar-button-bg: #ffffff;
  --color-toolbar-button-text: #2c3e50;
  --color-toolbar-button-hover-bg: #f5f5f5;
  --color-button-primary-bg: #2aa5e8;
  --color-button-primary-text: #ffffff;
  --color-button-primary-hover-bg: #4fc3f7;
  --color-button-secondary-bg: #15294a;
  --color-button-secondary-text: #e6edf8;
  --color-button-secondary-border: #294b80;
  --color-button-secondary-hover-bg: #1a3358;
  --color-button-success-bg: #22c55e;
  --color-button-success-text: #ffffff;
  --color-button-success-hover-bg: #16a34a;
  --color-button-error-bg: #ef4444;
  --color-button-error-text: #ffffff;
  --color-button-error-hover-bg: #dc2626;
  --color-severity-critical: #ef4444;
  --color-severity-critical-text: #fca5a5;
  --color-severity-critical-bg: rgba(239, 68, 68, 0.14);
  --color-severity-critical-border: #ef4444;
  --color-severity-high: #f59e0b;
  --color-severity-high-text: #fcd34d;
  --color-severity-high-bg: rgba(245, 158, 11, 0.14);
  --color-severity-high-border: #f59e0b;
  --color-severity-medium: #f97316;
  --color-severity-medium-text: #fdba74;
  --color-severity-medium-bg: rgba(249, 115, 22, 0.14);
  --color-severity-medium-border: #f97316;
  --color-severity-low: #2aa5e8;
  --color-severity-low-text: #4fc3f7;
  --color-severity-low-bg: rgba(42, 165, 232, 0.14);
  --color-severity-low-border: #2aa5e8;
  --color-severity-info: #a78bfa;
  --color-severity-info-text: #c4b5fd;
  --color-severity-info-bg: rgba(167, 139, 250, 0.14);
  --color-severity-info-border: #a78bfa;
  --color-status-active-bg: rgba(34, 197, 94, 0.12);
  --color-status-active-text: #4ade80;
  --color-status-active-border: #16a34a;
  --color-status-inactive-bg: rgba(109, 139, 179, 0.12);
  --color-status-inactive-text: #6d8bb3;
  --color-status-inactive-border: #6d8bb3;
  --color-status-pending-bg: rgba(245, 158, 11, 0.12);
  --color-status-pending-text: #fcd34d;
  --color-status-pending-border: #f59e0b;
  --color-status-approved-bg: rgba(34, 197, 94, 0.12);
  --color-status-approved-text: #4ade80;
  --color-status-approved-border: #16a34a;
  --color-filter-bg: #0e1b31;
  --color-filter-border: #1e3a67;
  --color-filter-selected-bg: #2aa5e8;
  --color-filter-selected-text: #ffffff;
  --color-dropdown-bg: #10233f;
  --color-dropdown-border: #294b80;
  --color-hover-bg: #15294a;
  --color-button-hover-bg: #15294a;
  --color-focus-ring: #2aa5e8;
  --color-highlight: rgba(42, 165, 232, 0.18);
  --color-text-highlight: rgba(42, 165, 232, 0.18);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.2);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.3);
  --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.4);
  --color-primary-background-alpha10: rgba(25, 118, 210, 0.1);
  --color-primary-background-alpha20: rgba(25, 118, 210, 0.2);
  --color-primary-border-alpha30: rgba(25, 118, 210, 0.3);
  --color-primary-overlay-alpha50: rgba(25, 118, 210, 0.5);
  --color-success-background-alpha10: rgba(40, 167, 69, 0.1);
  --color-success-background-alpha20: rgba(40, 167, 69, 0.2);
  --color-success-border-alpha30: rgba(40, 167, 69, 0.3);
  --color-success-overlay-alpha50: rgba(40, 167, 69, 0.5);
  --color-warning-background-alpha10: rgba(255, 193, 7, 0.1);
  --color-warning-background-alpha20: rgba(255, 193, 7, 0.2);
  --color-warning-border-alpha30: rgba(255, 193, 7, 0.3);
  --color-warning-overlay-alpha50: rgba(255, 193, 7, 0.5);
  --color-error-background-alpha10: rgba(220, 53, 69, 0.1);
  --color-error-background-alpha20: rgba(220, 53, 69, 0.2);
  --color-error-border-alpha30: rgba(220, 53, 69, 0.3);
  --color-error-overlay-alpha50: rgba(220, 53, 69, 0.5);
  --color-info-background-alpha10: rgba(23, 162, 184, 0.1);
  --color-info-background-alpha20: rgba(23, 162, 184, 0.2);
  --color-info-border-alpha30: rgba(23, 162, 184, 0.3);
  --color-info-overlay-alpha50: rgba(23, 162, 184, 0.5);
  --gradient-card: linear-gradient(135deg, #243447 0%, #1f2b3b 100%);
  --gradient-primary: linear-gradient(
    135deg,
    var(--color-primary) 0%,
    var(--color-primary-hover) 100%
  );
  --gradient-accent: linear-gradient(135deg, #0cabf5 0%, #1565c0 100%);
  --gradient-success: linear-gradient(135deg, #28a745 0%, #16a34a 100%);
  --gradient-error: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
  --gradient-warning: linear-gradient(135deg, #ffc107 0%, #ff9800 100%);
  --gradient-info: linear-gradient(135deg, #17a2b8 0%, #00bcd4 100%);
  --gradient-overlay: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%);
  --gradient-shimmer: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.2) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  --color-copilot-accent: #7c3aed;
  --color-copilot-accent-hover: #6d28d9;
  --color-copilot-accent-bg: #ede9fe;
  --color-copilot-accent-bg-hover: #ddd6fe;
  --color-copilot-accent-text: #6d28d9;
  --color-copilot-risk-critical-bg: rgba(239, 68, 68, 0.2);
  --color-copilot-risk-critical-text: rgba(248, 113, 113, 1);
  --color-copilot-risk-critical-border: rgba(239, 68, 68, 0.4);
  --color-copilot-risk-high-bg: rgba(251, 146, 60, 0.2);
  --color-copilot-risk-high-text: rgba(251, 146, 60, 1);
  --color-copilot-risk-high-border: rgba(251, 146, 60, 0.4);
  --color-copilot-risk-medium-bg: rgba(250, 204, 21, 0.2);
  --color-copilot-risk-medium-text: rgba(253, 224, 71, 1);
  --color-copilot-risk-medium-border: rgba(250, 204, 21, 0.4);
  --color-copilot-risk-low-bg: rgba(34, 197, 94, 0.2);
  --color-copilot-risk-low-text: rgba(74, 222, 128, 1);
  --color-copilot-risk-low-border: rgba(34, 197, 94, 0.4);
  --color-copilot-risk-unknown-bg: rgba(100, 116, 139, 0.2);
  --color-copilot-risk-unknown-text: rgba(148, 163, 184, 1);
  --color-copilot-risk-unknown-border: rgba(100, 116, 139, 0.4);
}

:root {
  --color-background-gray: var(--color-bg-secondary);
  --color-white: var(--color-bg-primary);
  --color-card-background: var(--color-card-bg);
  --color-filter-background: var(--color-filter-bg);
  --color-filter-selected: var(--color-filter-selected-bg);
  --color-dropdown-background: var(--color-dropdown-bg);
  --font-size-sm: var(--typography-font-size-body-sm);
  --font-size-base: var(--typography-font-size-body);
  --font-size-lg: var(--typography-font-size-h2);
  --font-weight-normal: var(--typography-font-weight-body);
  --font-weight-medium: var(--typography-font-weight-label);
  --font-weight-bold: var(--typography-font-weight-h1);
  --line-height-base: var(--typography-line-height-body);
  --line-height-tight: var(--typography-line-height-h1);
  --control-height: var(--layout-control-height-base);
  --radius-base: var(--layout-radius-base);
  --radius-lg: var(--layout-radius-lg);
  --spacing-xs: var(--spacing-spacing-xs);
  --spacing-sm: var(--spacing-spacing-sm);
  --spacing-md: var(--spacing-spacing-md);
  --spacing-lg: var(--spacing-spacing-lg);
  --spacing-xl: var(--spacing-spacing-xl);
  --spacing-xxl: var(--spacing-spacing-xxl);
}

.eng-theme--dark {
  --color-border-accent: var(--color-border-strong);
  --color-hover-background: var(--color-hover-bg);
  --color-button-hover: var(--color-button-hover-bg);
}

.eng-pill {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-xs);
  padding: 2px var(--spacing-sm);
  font-family: var(--typography-font-family-base);
  font-size: var(--typography-font-size-badge);
  font-weight: var(--typography-font-weight-badge);
  line-height: var(--typography-line-height-badge);
  border-radius: var(--layout-radius-sm);
  border: 1px solid transparent;
  white-space: nowrap;
}
.eng-pill--rounded {
  border-radius: var(--layout-radius-full);
}
.eng-pill--verified {
  color: var(--color-trust-verified-text);
  background: var(--color-trust-verified-bg);
  border-color: var(--color-trust-verified);
}
.eng-pill--unverified {
  color: var(--color-trust-unverified-text);
  background: var(--color-trust-unverified-bg);
  border-color: var(--color-trust-unverified);
}
.eng-pill--severity-critical {
  color: var(--color-severity-critical-text);
  background: var(--color-severity-critical-bg);
  border-color: var(--color-severity-critical-border);
}
.eng-pill--severity-high {
  color: var(--color-severity-high-text);
  background: var(--color-severity-high-bg);
  border-color: var(--color-severity-high-border);
}
.eng-pill--severity-medium {
  color: var(--color-severity-medium-text);
  background: var(--color-severity-medium-bg);
  border-color: var(--color-severity-medium-border);
}
.eng-pill--severity-low {
  color: var(--color-severity-low-text);
  background: var(--color-severity-low-bg);
  border-color: var(--color-severity-low-border);
}
.eng-pill--status-active {
  color: var(--color-status-active-text);
  background: var(--color-status-active-bg);
  border-color: var(--color-status-active-border);
}
.eng-pill--status-inactive {
  color: var(--color-status-inactive-text);
  background: var(--color-status-inactive-bg);
  border-color: var(--color-status-inactive-border);
}
.eng-pill--status-pending {
  color: var(--color-status-pending-text);
  background: var(--color-status-pending-bg);
  border-color: var(--color-status-pending-border);
}
.eng-pill--protocol-tcp {
  color: var(--color-protocol-tcp);
  background: color-mix(in srgb, var(--color-protocol-tcp) 12%, transparent);
  border-color: color-mix(in srgb, var(--color-protocol-tcp) 40%, transparent);
}
.eng-pill--protocol-udp {
  color: var(--color-protocol-udp);
  background: color-mix(in srgb, var(--color-protocol-udp) 12%, transparent);
  border-color: color-mix(in srgb, var(--color-protocol-udp) 40%, transparent);
}
.eng-pill--protocol-other {
  color: var(--color-protocol-other);
  background: color-mix(in srgb, var(--color-protocol-other) 12%, transparent);
  border-color: color-mix(in srgb, var(--color-protocol-other) 40%, transparent);
}
.eng-pill--protocol-external {
  color: var(--color-protocol-external);
  background: color-mix(in srgb, var(--color-protocol-external) 12%, transparent);
  border-color: color-mix(in srgb, var(--color-protocol-external) 40%, transparent);
}
.eng-pill--neutral {
  color: var(--color-text-secondary);
  background: var(--color-surface2);
  border-color: var(--color-border);
}
.eng-pill--accent {
  color: var(--color-accent-text);
  background: color-mix(in srgb, var(--color-accent) 10%, transparent);
  border-color: var(--color-accent);
}

/**
 * Design System — Page-level tab navigation (button-based)
 *
 * Modeled on the working pattern in views/traffic-flows. Uses plain
 * <button> elements + class="active" toggling + *ngIf content switching
 * — completely sidesteps <mat-tab-group> and Material's specificity /
 * encapsulation battles that plagued the earlier .eng-page-tabs class.
 *
 * Usage:
 *   <div class="eng-tab-nav">
 *     <div class="eng-tab-nav__tabs">
 *       <button class="eng-tab-button"
 *               [class.active]="activeTab === 'foo'"
 *               (click)="switchTab('foo')">
 *         Foo
 *       </button>
 *       <button class="eng-tab-button"
 *               [class.active]="activeTab === 'bar'"
 *               (click)="switchTab('bar')">
 *         Bar
 *         <span class="eng-tab-button__count" *ngIf="barCount > 0">{{ barCount }}</span>
 *       </button>
 *     </div>
 *     <div class="eng-tab-nav__actions">...optional...</div>
 *   </div>
 *
 *   <ng-container *ngIf="activeTab === 'foo'">...</ng-container>
 *   <ng-container *ngIf="activeTab === 'bar'">...</ng-container>
 *
 * The optional <span class="eng-tab-button__count"> renders a pill-shaped
 * badge to the right of the label. Render conditionally — the design system
 * doesn't dictate a "0 means hide" rule; consumers wrap the span with their
 * own *ngIf where appropriate.
 *
 * The <div class="eng-tab-nav__tabs"> wrapper exists so consumers can target
 * just the tabs group (e.g. for tutorial step anchors, e2e selectors)
 * without also matching the right-aligned actions slot.
 */
/**
 * Design System Tokens (Generated)
 *
 * ⚠️ DO NOT EDIT THIS FILE MANUALLY ⚠️
 * This file is auto-generated from TypeScript token definitions.
 * Run 'npm run generate:tokens' to regenerate.
 *
 * Source: src/app/core/design-system/tokens/
 */
:root {
  --color-brand: #0cabf5;
  --color-primary: #2aa5e8;
  --color-primary-hover: #1d7fb8;
  --color-primary-contrast: #ffffff;
  --color-text-primary: #0f172a;
  --color-text-secondary: #475569;
  --color-text-muted: #64748b;
  --color-text-inverse: #e6edf8;
  --color-mute: #94a3b8;
  --color-bg-primary: #f1f5f9;
  --color-bg-secondary: #f8fafc;
  --color-bg-tertiary: #f1f5f9;
  --color-surface: #ffffff;
  --color-surface2: #f8fafc;
  --color-surface3: #f1f5f9;
  --color-surface-external: #fef9e7;
  --color-border: #cbd5e1;
  --color-border2: #cbd5e1;
  --color-border-subtle: #e2e8f0;
  --color-border-strong: #94a3b8;
  --color-line: #e2e8f0;
  --color-accent: #2aa5e8;
  --color-accent2: #1d7fb8;
  --color-accent3: #4fc3f7;
  --color-accent-text: #0d7ab8;
  --color-focus: #2aa5e8;
  --color-success: #16a34a;
  --color-success-hover: #22c55e;
  --color-error: #dc2626;
  --color-error-hover: #ef4444;
  --color-warning: #d97706;
  --color-warning-hover: #f59e0b;
  --color-info: #0d7ab8;
  --color-info-hover: #1d7fb8;
  --color-status-good: #16a34a;
  --color-status-good-text: #15803d;
  --color-status-good-bg: rgba(34, 197, 94, 0.1);
  --color-status-warn: #d97706;
  --color-status-bad: #dc2626;
  --color-rule-allow: #16a34a;
  --color-rule-deny: #dc2626;
  --color-protocol-tcp: #0d7ab8;
  --color-protocol-udp: #7c3aed;
  --color-protocol-other: #d97706;
  --color-protocol-external: #ea580c;
  --color-trust-verified: #16a34a;
  --color-trust-verified-text: #15803d;
  --color-trust-verified-bg: rgba(34, 197, 94, 0.1);
  --color-trust-unverified: #dc2626;
  --color-trust-unverified-text: #b91c1c;
  --color-trust-unverified-bg: rgba(239, 68, 68, 0.08);
  --color-card-bg: #ffffff;
  --color-card-border: #cbd5e1;
  --color-card-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
  --color-toolbar-button-bg: #ffffff;
  --color-toolbar-button-text: #0f172a;
  --color-toolbar-button-hover-bg: #f8fafc;
  --color-button-primary-bg: #2aa5e8;
  --color-button-primary-text: #ffffff;
  --color-button-primary-hover-bg: #1d7fb8;
  --color-button-secondary-bg: #ffffff;
  --color-button-secondary-text: #0f172a;
  --color-button-secondary-border: #e2e8f0;
  --color-button-secondary-hover-bg: #f8fafc;
  --color-button-success-bg: #16a34a;
  --color-button-success-text: #ffffff;
  --color-button-success-hover-bg: #22c55e;
  --color-button-error-bg: #dc2626;
  --color-button-error-text: #ffffff;
  --color-button-error-hover-bg: #ef4444;
  --color-severity-critical: #ef4444;
  --color-severity-critical-text: #b91c1c;
  --color-severity-critical-bg: rgba(239, 68, 68, 0.08);
  --color-severity-critical-border: #ef4444;
  --color-severity-high: #f59e0b;
  --color-severity-high-text: #b45309;
  --color-severity-high-bg: rgba(245, 158, 11, 0.1);
  --color-severity-high-border: #f59e0b;
  --color-severity-medium: #f97316;
  --color-severity-medium-text: #c2410c;
  --color-severity-medium-bg: rgba(249, 115, 22, 0.1);
  --color-severity-medium-border: #f97316;
  --color-severity-low: #2aa5e8;
  --color-severity-low-text: #0d7ab8;
  --color-severity-low-bg: rgba(42, 165, 232, 0.1);
  --color-severity-low-border: #2aa5e8;
  --color-severity-info: #a78bfa;
  --color-severity-info-text: #6d28d9;
  --color-severity-info-bg: rgba(167, 139, 250, 0.1);
  --color-severity-info-border: #a78bfa;
  --color-status-active-bg: rgba(34, 197, 94, 0.1);
  --color-status-active-text: #15803d;
  --color-status-active-border: #16a34a;
  --color-status-inactive-bg: rgba(100, 116, 139, 0.1);
  --color-status-inactive-text: #64748b;
  --color-status-inactive-border: #64748b;
  --color-status-pending-bg: rgba(217, 119, 6, 0.1);
  --color-status-pending-text: #d97706;
  --color-status-pending-border: #d97706;
  --color-status-approved-bg: rgba(34, 197, 94, 0.1);
  --color-status-approved-text: #15803d;
  --color-status-approved-border: #16a34a;
  --color-filter-bg: #f8fafc;
  --color-filter-border: #cbd5e1;
  --color-filter-selected-bg: #2aa5e8;
  --color-filter-selected-text: #ffffff;
  --color-dropdown-bg: #ffffff;
  --color-dropdown-border: #cbd5e1;
  --color-hover-bg: #f8fafc;
  --color-button-hover-bg: #f8fafc;
  --color-focus-ring: #2aa5e8;
  --color-highlight: rgba(42, 165, 232, 0.1);
  --color-text-highlight: rgba(42, 165, 232, 0.1);
  --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04);
  --shadow-md: 0 2px 8px rgba(15, 23, 42, 0.06);
  --shadow-lg: 0 8px 24px rgba(15, 23, 42, 0.1);
  --color-primary-background-alpha10: rgba(25, 118, 210, 0.1);
  --color-primary-background-alpha20: rgba(25, 118, 210, 0.2);
  --color-primary-border-alpha30: rgba(25, 118, 210, 0.3);
  --color-primary-overlay-alpha50: rgba(25, 118, 210, 0.5);
  --color-success-background-alpha10: rgba(40, 167, 69, 0.1);
  --color-success-background-alpha20: rgba(40, 167, 69, 0.2);
  --color-success-border-alpha30: rgba(40, 167, 69, 0.3);
  --color-success-overlay-alpha50: rgba(40, 167, 69, 0.5);
  --color-warning-background-alpha10: rgba(255, 193, 7, 0.1);
  --color-warning-background-alpha20: rgba(255, 193, 7, 0.2);
  --color-warning-border-alpha30: rgba(255, 193, 7, 0.3);
  --color-warning-overlay-alpha50: rgba(255, 193, 7, 0.5);
  --color-error-background-alpha10: rgba(220, 53, 69, 0.1);
  --color-error-background-alpha20: rgba(220, 53, 69, 0.2);
  --color-error-border-alpha30: rgba(220, 53, 69, 0.3);
  --color-error-overlay-alpha50: rgba(220, 53, 69, 0.5);
  --color-info-background-alpha10: rgba(23, 162, 184, 0.1);
  --color-info-background-alpha20: rgba(23, 162, 184, 0.2);
  --color-info-border-alpha30: rgba(23, 162, 184, 0.3);
  --color-info-overlay-alpha50: rgba(23, 162, 184, 0.5);
  --gradient-card: linear-gradient(135deg, #ffffff 0%, #f5f5f5 100%);
  --gradient-primary: linear-gradient(
    135deg,
    var(--color-primary) 0%,
    var(--color-primary-hover) 100%
  );
  --gradient-accent: linear-gradient(135deg, #0cabf5 0%, #1565c0 100%);
  --gradient-success: linear-gradient(135deg, #28a745 0%, #16a34a 100%);
  --gradient-error: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
  --gradient-warning: linear-gradient(135deg, #ffc107 0%, #ff9800 100%);
  --gradient-info: linear-gradient(135deg, #17a2b8 0%, #00bcd4 100%);
  --gradient-overlay: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%);
  --gradient-shimmer: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.2) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  --color-copilot-accent: #7c3aed;
  --color-copilot-accent-hover: #6d28d9;
  --color-copilot-accent-bg: #ede9fe;
  --color-copilot-accent-bg-hover: #ddd6fe;
  --color-copilot-accent-text: #6d28d9;
  --color-copilot-risk-critical-bg: rgba(239, 68, 68, 0.2);
  --color-copilot-risk-critical-text: #dc3545;
  --color-copilot-risk-critical-border: rgba(239, 68, 68, 0.4);
  --color-copilot-risk-high-bg: rgba(251, 146, 60, 0.2);
  --color-copilot-risk-high-text: #ff9800;
  --color-copilot-risk-high-border: rgba(251, 146, 60, 0.4);
  --color-copilot-risk-medium-bg: rgba(250, 204, 21, 0.2);
  --color-copilot-risk-medium-text: #f57c00;
  --color-copilot-risk-medium-border: rgba(250, 204, 21, 0.4);
  --color-copilot-risk-low-bg: rgba(34, 197, 94, 0.2);
  --color-copilot-risk-low-text: #28a745;
  --color-copilot-risk-low-border: rgba(34, 197, 94, 0.4);
  --color-copilot-risk-unknown-bg: rgba(100, 116, 139, 0.2);
  --color-copilot-risk-unknown-text: #6c757d;
  --color-copilot-risk-unknown-border: rgba(100, 116, 139, 0.4);
  --spacing-spacing-xs: 4px;
  --spacing-spacing-sm: 8px;
  --spacing-spacing-md: 12px;
  --spacing-spacing-lg: 16px;
  --spacing-spacing-xl: 24px;
  --spacing-spacing-xxl: 30px;
  --spacing-card-padding: 24px;
  --spacing-card-gap: 16px;
  --spacing-button-padding-vertical: 8px;
  --spacing-button-padding-horizontal: 12px;
  --spacing-button-gap: 8px;
  --spacing-input-padding-vertical: 8px;
  --spacing-input-padding-horizontal: 12px;
  --spacing-form-row-gap: 16px;
  --spacing-form-label-margin: 4px;
  --spacing-section-margin-bottom: 24px;
  --spacing-page-margin-bottom: 30px;
  --spacing-page-margin: 30px;
  --spacing-container-padding: 24px;
  --spacing-grid-gap: 16px;
  --typography-font-family-base:
    "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --typography-font-family-mono:
    "JetBrains Mono", ui-monospace, "Cascadia Code", Menlo, Consolas, monospace;
  --typography-font-size-page-title: 32px;
  --typography-font-weight-page-title: 700;
  --typography-line-height-page-title: 1.2;
  --typography-font-size-h1: 32px;
  --typography-font-weight-h1: 700;
  --typography-line-height-h1: 1.2;
  --typography-font-size-h2: 24px;
  --typography-font-weight-h2: 600;
  --typography-line-height-h2: 1.2;
  --typography-font-size-h3: 20px;
  --typography-font-weight-h3: 600;
  --typography-line-height-h3: 1.2;
  --typography-font-size-h4: 18px;
  --typography-font-weight-h4: 600;
  --typography-line-height-h4: 1.5;
  --typography-font-size-body: 14px;
  --typography-font-weight-body: 400;
  --typography-line-height-body: 1.5;
  --typography-font-size-body-lg: 16px;
  --typography-font-weight-body-lg: 400;
  --typography-line-height-body-lg: 1.5;
  --typography-font-size-body-sm: 13px;
  --typography-font-weight-body-sm: 400;
  --typography-line-height-body-sm: 1.5;
  --typography-font-size-caption: 12px;
  --typography-font-weight-caption: 400;
  --typography-line-height-caption: 1.5;
  --typography-font-size-label: 13px;
  --typography-font-weight-label: 500;
  --typography-line-height-label: 1.5;
  --typography-font-size-button: 14px;
  --typography-font-weight-button: 500;
  --typography-line-height-button: 1.5;
  --typography-font-size-badge: 11px;
  --typography-font-weight-badge: 600;
  --typography-line-height-badge: 1.2;
  --typography-font-size-code: 13px;
  --typography-font-weight-code: 400;
  --typography-line-height-code: 1.5;
  --layout-radius-none: 0px;
  --layout-radius-sm: 4px;
  --layout-radius-base: 6px;
  --layout-radius-lg: 8px;
  --layout-radius-xl: 12px;
  --layout-radius-full: 9999px;
  --layout-control-height-sm: 32px;
  --layout-control-height-base: 36px;
  --layout-control-height-lg: 40px;
  --layout-shadow-none: none;
  --layout-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04);
  --layout-shadow-base: 0 2px 8px rgba(15, 23, 42, 0.06);
  --layout-shadow-md: 0 2px 8px rgba(15, 23, 42, 0.06);
  --layout-shadow-lg: 0 8px 24px rgba(15, 23, 42, 0.1);
  --layout-shadow-xl: 0 8px 24px rgba(15, 23, 42, 0.1);
  --layout-card-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
  --layout-modal-shadow: 0 8px 24px rgba(15, 23, 42, 0.1);
  --layout-dropdown-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
  --layout-button-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.eng-theme--dark {
  --color-brand: #0cabf5;
  --color-primary: #2aa5e8;
  --color-primary-hover: #4fc3f7;
  --color-primary-contrast: #ffffff;
  --color-text-primary: #e6edf8;
  --color-text-secondary: #aabad4;
  --color-text-muted: #6d8bb3;
  --color-text-inverse: #0f172a;
  --color-mute: #4a6690;
  --color-bg-primary: #0a1527;
  --color-bg-secondary: #0e1b31;
  --color-bg-tertiary: #10233f;
  --color-surface: #10233f;
  --color-surface2: #15294a;
  --color-surface3: #1a3358;
  --color-surface-external: #2a1a1f;
  --color-border: #1e3a67;
  --color-border2: #294b80;
  --color-border-subtle: #1e3a67;
  --color-border-strong: #294b80;
  --color-line: #22406f;
  --color-accent: #2aa5e8;
  --color-accent2: #1d7fb8;
  --color-accent3: #4fc3f7;
  --color-accent-text: #2aa5e8;
  --color-focus: #2aa5e8;
  --color-success: #22c55e;
  --color-success-hover: #16a34a;
  --color-error: #ef4444;
  --color-error-hover: #dc2626;
  --color-warning: #f59e0b;
  --color-warning-hover: #d97706;
  --color-info: #2aa5e8;
  --color-info-hover: #4fc3f7;
  --color-status-good: #22c55e;
  --color-status-good-text: #4ade80;
  --color-status-good-bg: rgba(34, 197, 94, 0.14);
  --color-status-warn: #f59e0b;
  --color-status-bad: #ef4444;
  --color-rule-allow: #22c55e;
  --color-rule-deny: #ef4444;
  --color-protocol-tcp: #4fc3f7;
  --color-protocol-udp: #a78bfa;
  --color-protocol-other: #f59e0b;
  --color-protocol-external: #f97316;
  --color-trust-verified: #16a34a;
  --color-trust-verified-text: #4ade80;
  --color-trust-verified-bg: rgba(34, 197, 94, 0.12);
  --color-trust-unverified: #dc2626;
  --color-trust-unverified-text: #fca5a5;
  --color-trust-unverified-bg: rgba(239, 68, 68, 0.12);
  --color-card-bg: #10233f;
  --color-card-border: #1e3a67;
  --color-card-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
  --color-toolbar-button-bg: #ffffff;
  --color-toolbar-button-text: #2c3e50;
  --color-toolbar-button-hover-bg: #f5f5f5;
  --color-button-primary-bg: #2aa5e8;
  --color-button-primary-text: #ffffff;
  --color-button-primary-hover-bg: #4fc3f7;
  --color-button-secondary-bg: #15294a;
  --color-button-secondary-text: #e6edf8;
  --color-button-secondary-border: #294b80;
  --color-button-secondary-hover-bg: #1a3358;
  --color-button-success-bg: #22c55e;
  --color-button-success-text: #ffffff;
  --color-button-success-hover-bg: #16a34a;
  --color-button-error-bg: #ef4444;
  --color-button-error-text: #ffffff;
  --color-button-error-hover-bg: #dc2626;
  --color-severity-critical: #ef4444;
  --color-severity-critical-text: #fca5a5;
  --color-severity-critical-bg: rgba(239, 68, 68, 0.14);
  --color-severity-critical-border: #ef4444;
  --color-severity-high: #f59e0b;
  --color-severity-high-text: #fcd34d;
  --color-severity-high-bg: rgba(245, 158, 11, 0.14);
  --color-severity-high-border: #f59e0b;
  --color-severity-medium: #f97316;
  --color-severity-medium-text: #fdba74;
  --color-severity-medium-bg: rgba(249, 115, 22, 0.14);
  --color-severity-medium-border: #f97316;
  --color-severity-low: #2aa5e8;
  --color-severity-low-text: #4fc3f7;
  --color-severity-low-bg: rgba(42, 165, 232, 0.14);
  --color-severity-low-border: #2aa5e8;
  --color-severity-info: #a78bfa;
  --color-severity-info-text: #c4b5fd;
  --color-severity-info-bg: rgba(167, 139, 250, 0.14);
  --color-severity-info-border: #a78bfa;
  --color-status-active-bg: rgba(34, 197, 94, 0.12);
  --color-status-active-text: #4ade80;
  --color-status-active-border: #16a34a;
  --color-status-inactive-bg: rgba(109, 139, 179, 0.12);
  --color-status-inactive-text: #6d8bb3;
  --color-status-inactive-border: #6d8bb3;
  --color-status-pending-bg: rgba(245, 158, 11, 0.12);
  --color-status-pending-text: #fcd34d;
  --color-status-pending-border: #f59e0b;
  --color-status-approved-bg: rgba(34, 197, 94, 0.12);
  --color-status-approved-text: #4ade80;
  --color-status-approved-border: #16a34a;
  --color-filter-bg: #0e1b31;
  --color-filter-border: #1e3a67;
  --color-filter-selected-bg: #2aa5e8;
  --color-filter-selected-text: #ffffff;
  --color-dropdown-bg: #10233f;
  --color-dropdown-border: #294b80;
  --color-hover-bg: #15294a;
  --color-button-hover-bg: #15294a;
  --color-focus-ring: #2aa5e8;
  --color-highlight: rgba(42, 165, 232, 0.18);
  --color-text-highlight: rgba(42, 165, 232, 0.18);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.2);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.3);
  --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.4);
  --color-primary-background-alpha10: rgba(25, 118, 210, 0.1);
  --color-primary-background-alpha20: rgba(25, 118, 210, 0.2);
  --color-primary-border-alpha30: rgba(25, 118, 210, 0.3);
  --color-primary-overlay-alpha50: rgba(25, 118, 210, 0.5);
  --color-success-background-alpha10: rgba(40, 167, 69, 0.1);
  --color-success-background-alpha20: rgba(40, 167, 69, 0.2);
  --color-success-border-alpha30: rgba(40, 167, 69, 0.3);
  --color-success-overlay-alpha50: rgba(40, 167, 69, 0.5);
  --color-warning-background-alpha10: rgba(255, 193, 7, 0.1);
  --color-warning-background-alpha20: rgba(255, 193, 7, 0.2);
  --color-warning-border-alpha30: rgba(255, 193, 7, 0.3);
  --color-warning-overlay-alpha50: rgba(255, 193, 7, 0.5);
  --color-error-background-alpha10: rgba(220, 53, 69, 0.1);
  --color-error-background-alpha20: rgba(220, 53, 69, 0.2);
  --color-error-border-alpha30: rgba(220, 53, 69, 0.3);
  --color-error-overlay-alpha50: rgba(220, 53, 69, 0.5);
  --color-info-background-alpha10: rgba(23, 162, 184, 0.1);
  --color-info-background-alpha20: rgba(23, 162, 184, 0.2);
  --color-info-border-alpha30: rgba(23, 162, 184, 0.3);
  --color-info-overlay-alpha50: rgba(23, 162, 184, 0.5);
  --gradient-card: linear-gradient(135deg, #243447 0%, #1f2b3b 100%);
  --gradient-primary: linear-gradient(
    135deg,
    var(--color-primary) 0%,
    var(--color-primary-hover) 100%
  );
  --gradient-accent: linear-gradient(135deg, #0cabf5 0%, #1565c0 100%);
  --gradient-success: linear-gradient(135deg, #28a745 0%, #16a34a 100%);
  --gradient-error: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
  --gradient-warning: linear-gradient(135deg, #ffc107 0%, #ff9800 100%);
  --gradient-info: linear-gradient(135deg, #17a2b8 0%, #00bcd4 100%);
  --gradient-overlay: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%);
  --gradient-shimmer: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.2) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  --color-copilot-accent: #7c3aed;
  --color-copilot-accent-hover: #6d28d9;
  --color-copilot-accent-bg: #ede9fe;
  --color-copilot-accent-bg-hover: #ddd6fe;
  --color-copilot-accent-text: #6d28d9;
  --color-copilot-risk-critical-bg: rgba(239, 68, 68, 0.2);
  --color-copilot-risk-critical-text: rgba(248, 113, 113, 1);
  --color-copilot-risk-critical-border: rgba(239, 68, 68, 0.4);
  --color-copilot-risk-high-bg: rgba(251, 146, 60, 0.2);
  --color-copilot-risk-high-text: rgba(251, 146, 60, 1);
  --color-copilot-risk-high-border: rgba(251, 146, 60, 0.4);
  --color-copilot-risk-medium-bg: rgba(250, 204, 21, 0.2);
  --color-copilot-risk-medium-text: rgba(253, 224, 71, 1);
  --color-copilot-risk-medium-border: rgba(250, 204, 21, 0.4);
  --color-copilot-risk-low-bg: rgba(34, 197, 94, 0.2);
  --color-copilot-risk-low-text: rgba(74, 222, 128, 1);
  --color-copilot-risk-low-border: rgba(34, 197, 94, 0.4);
  --color-copilot-risk-unknown-bg: rgba(100, 116, 139, 0.2);
  --color-copilot-risk-unknown-text: rgba(148, 163, 184, 1);
  --color-copilot-risk-unknown-border: rgba(100, 116, 139, 0.4);
}

:root {
  --color-background-gray: var(--color-bg-secondary);
  --color-white: var(--color-bg-primary);
  --color-card-background: var(--color-card-bg);
  --color-filter-background: var(--color-filter-bg);
  --color-filter-selected: var(--color-filter-selected-bg);
  --color-dropdown-background: var(--color-dropdown-bg);
  --font-size-sm: var(--typography-font-size-body-sm);
  --font-size-base: var(--typography-font-size-body);
  --font-size-lg: var(--typography-font-size-h2);
  --font-weight-normal: var(--typography-font-weight-body);
  --font-weight-medium: var(--typography-font-weight-label);
  --font-weight-bold: var(--typography-font-weight-h1);
  --line-height-base: var(--typography-line-height-body);
  --line-height-tight: var(--typography-line-height-h1);
  --control-height: var(--layout-control-height-base);
  --radius-base: var(--layout-radius-base);
  --radius-lg: var(--layout-radius-lg);
  --spacing-xs: var(--spacing-spacing-xs);
  --spacing-sm: var(--spacing-spacing-sm);
  --spacing-md: var(--spacing-spacing-md);
  --spacing-lg: var(--spacing-spacing-lg);
  --spacing-xl: var(--spacing-spacing-xl);
  --spacing-xxl: var(--spacing-spacing-xxl);
}

.eng-theme--dark {
  --color-border-accent: var(--color-border-strong);
  --color-hover-background: var(--color-hover-bg);
  --color-button-hover: var(--color-button-hover-bg);
}

.eng-tab-nav {
  display: flex;
  align-items: flex-end;
  border-bottom: 1px solid var(--color-border);
  margin-bottom: var(--spacing-lg);
}

.eng-tab-nav__tabs {
  display: flex;
  align-items: flex-end;
  gap: var(--spacing-xs);
}

.eng-tab-nav__actions {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: var(--spacing-md);
  padding-bottom: var(--spacing-xs);
}

.eng-tab-button {
  background: transparent;
  border: none;
  padding: var(--spacing-sm) var(--spacing-lg);
  font-family: var(--typography-font-family-base);
  font-size: var(--typography-font-size-body-lg);
  font-weight: var(--typography-font-weight-label);
  color: var(--color-text-muted);
  cursor: pointer;
  position: relative;
  transition: color 120ms ease, background 120ms ease;
  border-radius: var(--layout-radius-sm) var(--layout-radius-sm) 0 0;
}
.eng-tab-button::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -1px;
  width: 100%;
  height: 3px;
  background: var(--color-accent);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 160ms ease;
}
.eng-tab-button:hover:not(.active) {
  color: var(--color-text-primary);
  background: color-mix(in srgb, var(--color-accent) 8%, transparent);
}
.eng-tab-button:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-focus) 35%, transparent);
}
.eng-tab-button.active {
  color: var(--color-text-primary);
  font-weight: var(--typography-font-weight-h4);
}
.eng-tab-button.active::after {
  transform: scaleX(1);
}
.eng-tab-button.active .eng-tab-button__count {
  background: var(--color-accent);
  color: var(--color-button-primary-text);
}
.eng-tab-button__count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: var(--spacing-sm);
  min-width: 22px;
  height: 20px;
  padding: 0 var(--spacing-sm);
  background: color-mix(in srgb, var(--color-text-muted) 22%, transparent);
  border-radius: 10px;
  font-size: var(--typography-font-size-body-sm);
  font-weight: var(--typography-font-weight-medium);
  line-height: 1;
  color: var(--color-text-muted);
  transition: background 160ms ease, color 160ms ease;
}

/**
 * Design System Components
 *
 * Reusable component styles that use design tokens.
 * Import this file to get access to all base component styles.
 */
/**
 * Design System Tokens (Generated)
 *
 * ⚠️ DO NOT EDIT THIS FILE MANUALLY ⚠️
 * This file is auto-generated from TypeScript token definitions.
 * Run 'npm run generate:tokens' to regenerate.
 *
 * Source: src/app/core/design-system/tokens/
 */
:root {
  --color-brand: #0cabf5;
  --color-primary: #2aa5e8;
  --color-primary-hover: #1d7fb8;
  --color-primary-contrast: #ffffff;
  --color-text-primary: #0f172a;
  --color-text-secondary: #475569;
  --color-text-muted: #64748b;
  --color-text-inverse: #e6edf8;
  --color-mute: #94a3b8;
  --color-bg-primary: #f1f5f9;
  --color-bg-secondary: #f8fafc;
  --color-bg-tertiary: #f1f5f9;
  --color-surface: #ffffff;
  --color-surface2: #f8fafc;
  --color-surface3: #f1f5f9;
  --color-surface-external: #fef9e7;
  --color-border: #cbd5e1;
  --color-border2: #cbd5e1;
  --color-border-subtle: #e2e8f0;
  --color-border-strong: #94a3b8;
  --color-line: #e2e8f0;
  --color-accent: #2aa5e8;
  --color-accent2: #1d7fb8;
  --color-accent3: #4fc3f7;
  --color-accent-text: #0d7ab8;
  --color-focus: #2aa5e8;
  --color-success: #16a34a;
  --color-success-hover: #22c55e;
  --color-error: #dc2626;
  --color-error-hover: #ef4444;
  --color-warning: #d97706;
  --color-warning-hover: #f59e0b;
  --color-info: #0d7ab8;
  --color-info-hover: #1d7fb8;
  --color-status-good: #16a34a;
  --color-status-good-text: #15803d;
  --color-status-good-bg: rgba(34, 197, 94, 0.1);
  --color-status-warn: #d97706;
  --color-status-bad: #dc2626;
  --color-rule-allow: #16a34a;
  --color-rule-deny: #dc2626;
  --color-protocol-tcp: #0d7ab8;
  --color-protocol-udp: #7c3aed;
  --color-protocol-other: #d97706;
  --color-protocol-external: #ea580c;
  --color-trust-verified: #16a34a;
  --color-trust-verified-text: #15803d;
  --color-trust-verified-bg: rgba(34, 197, 94, 0.1);
  --color-trust-unverified: #dc2626;
  --color-trust-unverified-text: #b91c1c;
  --color-trust-unverified-bg: rgba(239, 68, 68, 0.08);
  --color-card-bg: #ffffff;
  --color-card-border: #cbd5e1;
  --color-card-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
  --color-toolbar-button-bg: #ffffff;
  --color-toolbar-button-text: #0f172a;
  --color-toolbar-button-hover-bg: #f8fafc;
  --color-button-primary-bg: #2aa5e8;
  --color-button-primary-text: #ffffff;
  --color-button-primary-hover-bg: #1d7fb8;
  --color-button-secondary-bg: #ffffff;
  --color-button-secondary-text: #0f172a;
  --color-button-secondary-border: #e2e8f0;
  --color-button-secondary-hover-bg: #f8fafc;
  --color-button-success-bg: #16a34a;
  --color-button-success-text: #ffffff;
  --color-button-success-hover-bg: #22c55e;
  --color-button-error-bg: #dc2626;
  --color-button-error-text: #ffffff;
  --color-button-error-hover-bg: #ef4444;
  --color-severity-critical: #ef4444;
  --color-severity-critical-text: #b91c1c;
  --color-severity-critical-bg: rgba(239, 68, 68, 0.08);
  --color-severity-critical-border: #ef4444;
  --color-severity-high: #f59e0b;
  --color-severity-high-text: #b45309;
  --color-severity-high-bg: rgba(245, 158, 11, 0.1);
  --color-severity-high-border: #f59e0b;
  --color-severity-medium: #f97316;
  --color-severity-medium-text: #c2410c;
  --color-severity-medium-bg: rgba(249, 115, 22, 0.1);
  --color-severity-medium-border: #f97316;
  --color-severity-low: #2aa5e8;
  --color-severity-low-text: #0d7ab8;
  --color-severity-low-bg: rgba(42, 165, 232, 0.1);
  --color-severity-low-border: #2aa5e8;
  --color-severity-info: #a78bfa;
  --color-severity-info-text: #6d28d9;
  --color-severity-info-bg: rgba(167, 139, 250, 0.1);
  --color-severity-info-border: #a78bfa;
  --color-status-active-bg: rgba(34, 197, 94, 0.1);
  --color-status-active-text: #15803d;
  --color-status-active-border: #16a34a;
  --color-status-inactive-bg: rgba(100, 116, 139, 0.1);
  --color-status-inactive-text: #64748b;
  --color-status-inactive-border: #64748b;
  --color-status-pending-bg: rgba(217, 119, 6, 0.1);
  --color-status-pending-text: #d97706;
  --color-status-pending-border: #d97706;
  --color-status-approved-bg: rgba(34, 197, 94, 0.1);
  --color-status-approved-text: #15803d;
  --color-status-approved-border: #16a34a;
  --color-filter-bg: #f8fafc;
  --color-filter-border: #cbd5e1;
  --color-filter-selected-bg: #2aa5e8;
  --color-filter-selected-text: #ffffff;
  --color-dropdown-bg: #ffffff;
  --color-dropdown-border: #cbd5e1;
  --color-hover-bg: #f8fafc;
  --color-button-hover-bg: #f8fafc;
  --color-focus-ring: #2aa5e8;
  --color-highlight: rgba(42, 165, 232, 0.1);
  --color-text-highlight: rgba(42, 165, 232, 0.1);
  --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04);
  --shadow-md: 0 2px 8px rgba(15, 23, 42, 0.06);
  --shadow-lg: 0 8px 24px rgba(15, 23, 42, 0.1);
  --color-primary-background-alpha10: rgba(25, 118, 210, 0.1);
  --color-primary-background-alpha20: rgba(25, 118, 210, 0.2);
  --color-primary-border-alpha30: rgba(25, 118, 210, 0.3);
  --color-primary-overlay-alpha50: rgba(25, 118, 210, 0.5);
  --color-success-background-alpha10: rgba(40, 167, 69, 0.1);
  --color-success-background-alpha20: rgba(40, 167, 69, 0.2);
  --color-success-border-alpha30: rgba(40, 167, 69, 0.3);
  --color-success-overlay-alpha50: rgba(40, 167, 69, 0.5);
  --color-warning-background-alpha10: rgba(255, 193, 7, 0.1);
  --color-warning-background-alpha20: rgba(255, 193, 7, 0.2);
  --color-warning-border-alpha30: rgba(255, 193, 7, 0.3);
  --color-warning-overlay-alpha50: rgba(255, 193, 7, 0.5);
  --color-error-background-alpha10: rgba(220, 53, 69, 0.1);
  --color-error-background-alpha20: rgba(220, 53, 69, 0.2);
  --color-error-border-alpha30: rgba(220, 53, 69, 0.3);
  --color-error-overlay-alpha50: rgba(220, 53, 69, 0.5);
  --color-info-background-alpha10: rgba(23, 162, 184, 0.1);
  --color-info-background-alpha20: rgba(23, 162, 184, 0.2);
  --color-info-border-alpha30: rgba(23, 162, 184, 0.3);
  --color-info-overlay-alpha50: rgba(23, 162, 184, 0.5);
  --gradient-card: linear-gradient(135deg, #ffffff 0%, #f5f5f5 100%);
  --gradient-primary: linear-gradient(
    135deg,
    var(--color-primary) 0%,
    var(--color-primary-hover) 100%
  );
  --gradient-accent: linear-gradient(135deg, #0cabf5 0%, #1565c0 100%);
  --gradient-success: linear-gradient(135deg, #28a745 0%, #16a34a 100%);
  --gradient-error: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
  --gradient-warning: linear-gradient(135deg, #ffc107 0%, #ff9800 100%);
  --gradient-info: linear-gradient(135deg, #17a2b8 0%, #00bcd4 100%);
  --gradient-overlay: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%);
  --gradient-shimmer: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.2) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  --color-copilot-accent: #7c3aed;
  --color-copilot-accent-hover: #6d28d9;
  --color-copilot-accent-bg: #ede9fe;
  --color-copilot-accent-bg-hover: #ddd6fe;
  --color-copilot-accent-text: #6d28d9;
  --color-copilot-risk-critical-bg: rgba(239, 68, 68, 0.2);
  --color-copilot-risk-critical-text: #dc3545;
  --color-copilot-risk-critical-border: rgba(239, 68, 68, 0.4);
  --color-copilot-risk-high-bg: rgba(251, 146, 60, 0.2);
  --color-copilot-risk-high-text: #ff9800;
  --color-copilot-risk-high-border: rgba(251, 146, 60, 0.4);
  --color-copilot-risk-medium-bg: rgba(250, 204, 21, 0.2);
  --color-copilot-risk-medium-text: #f57c00;
  --color-copilot-risk-medium-border: rgba(250, 204, 21, 0.4);
  --color-copilot-risk-low-bg: rgba(34, 197, 94, 0.2);
  --color-copilot-risk-low-text: #28a745;
  --color-copilot-risk-low-border: rgba(34, 197, 94, 0.4);
  --color-copilot-risk-unknown-bg: rgba(100, 116, 139, 0.2);
  --color-copilot-risk-unknown-text: #6c757d;
  --color-copilot-risk-unknown-border: rgba(100, 116, 139, 0.4);
  --spacing-spacing-xs: 4px;
  --spacing-spacing-sm: 8px;
  --spacing-spacing-md: 12px;
  --spacing-spacing-lg: 16px;
  --spacing-spacing-xl: 24px;
  --spacing-spacing-xxl: 30px;
  --spacing-card-padding: 24px;
  --spacing-card-gap: 16px;
  --spacing-button-padding-vertical: 8px;
  --spacing-button-padding-horizontal: 12px;
  --spacing-button-gap: 8px;
  --spacing-input-padding-vertical: 8px;
  --spacing-input-padding-horizontal: 12px;
  --spacing-form-row-gap: 16px;
  --spacing-form-label-margin: 4px;
  --spacing-section-margin-bottom: 24px;
  --spacing-page-margin-bottom: 30px;
  --spacing-page-margin: 30px;
  --spacing-container-padding: 24px;
  --spacing-grid-gap: 16px;
  --typography-font-family-base:
    "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --typography-font-family-mono:
    "JetBrains Mono", ui-monospace, "Cascadia Code", Menlo, Consolas, monospace;
  --typography-font-size-page-title: 32px;
  --typography-font-weight-page-title: 700;
  --typography-line-height-page-title: 1.2;
  --typography-font-size-h1: 32px;
  --typography-font-weight-h1: 700;
  --typography-line-height-h1: 1.2;
  --typography-font-size-h2: 24px;
  --typography-font-weight-h2: 600;
  --typography-line-height-h2: 1.2;
  --typography-font-size-h3: 20px;
  --typography-font-weight-h3: 600;
  --typography-line-height-h3: 1.2;
  --typography-font-size-h4: 18px;
  --typography-font-weight-h4: 600;
  --typography-line-height-h4: 1.5;
  --typography-font-size-body: 14px;
  --typography-font-weight-body: 400;
  --typography-line-height-body: 1.5;
  --typography-font-size-body-lg: 16px;
  --typography-font-weight-body-lg: 400;
  --typography-line-height-body-lg: 1.5;
  --typography-font-size-body-sm: 13px;
  --typography-font-weight-body-sm: 400;
  --typography-line-height-body-sm: 1.5;
  --typography-font-size-caption: 12px;
  --typography-font-weight-caption: 400;
  --typography-line-height-caption: 1.5;
  --typography-font-size-label: 13px;
  --typography-font-weight-label: 500;
  --typography-line-height-label: 1.5;
  --typography-font-size-button: 14px;
  --typography-font-weight-button: 500;
  --typography-line-height-button: 1.5;
  --typography-font-size-badge: 11px;
  --typography-font-weight-badge: 600;
  --typography-line-height-badge: 1.2;
  --typography-font-size-code: 13px;
  --typography-font-weight-code: 400;
  --typography-line-height-code: 1.5;
  --layout-radius-none: 0px;
  --layout-radius-sm: 4px;
  --layout-radius-base: 6px;
  --layout-radius-lg: 8px;
  --layout-radius-xl: 12px;
  --layout-radius-full: 9999px;
  --layout-control-height-sm: 32px;
  --layout-control-height-base: 36px;
  --layout-control-height-lg: 40px;
  --layout-shadow-none: none;
  --layout-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04);
  --layout-shadow-base: 0 2px 8px rgba(15, 23, 42, 0.06);
  --layout-shadow-md: 0 2px 8px rgba(15, 23, 42, 0.06);
  --layout-shadow-lg: 0 8px 24px rgba(15, 23, 42, 0.1);
  --layout-shadow-xl: 0 8px 24px rgba(15, 23, 42, 0.1);
  --layout-card-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
  --layout-modal-shadow: 0 8px 24px rgba(15, 23, 42, 0.1);
  --layout-dropdown-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
  --layout-button-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.eng-theme--dark {
  --color-brand: #0cabf5;
  --color-primary: #2aa5e8;
  --color-primary-hover: #4fc3f7;
  --color-primary-contrast: #ffffff;
  --color-text-primary: #e6edf8;
  --color-text-secondary: #aabad4;
  --color-text-muted: #6d8bb3;
  --color-text-inverse: #0f172a;
  --color-mute: #4a6690;
  --color-bg-primary: #0a1527;
  --color-bg-secondary: #0e1b31;
  --color-bg-tertiary: #10233f;
  --color-surface: #10233f;
  --color-surface2: #15294a;
  --color-surface3: #1a3358;
  --color-surface-external: #2a1a1f;
  --color-border: #1e3a67;
  --color-border2: #294b80;
  --color-border-subtle: #1e3a67;
  --color-border-strong: #294b80;
  --color-line: #22406f;
  --color-accent: #2aa5e8;
  --color-accent2: #1d7fb8;
  --color-accent3: #4fc3f7;
  --color-accent-text: #2aa5e8;
  --color-focus: #2aa5e8;
  --color-success: #22c55e;
  --color-success-hover: #16a34a;
  --color-error: #ef4444;
  --color-error-hover: #dc2626;
  --color-warning: #f59e0b;
  --color-warning-hover: #d97706;
  --color-info: #2aa5e8;
  --color-info-hover: #4fc3f7;
  --color-status-good: #22c55e;
  --color-status-good-text: #4ade80;
  --color-status-good-bg: rgba(34, 197, 94, 0.14);
  --color-status-warn: #f59e0b;
  --color-status-bad: #ef4444;
  --color-rule-allow: #22c55e;
  --color-rule-deny: #ef4444;
  --color-protocol-tcp: #4fc3f7;
  --color-protocol-udp: #a78bfa;
  --color-protocol-other: #f59e0b;
  --color-protocol-external: #f97316;
  --color-trust-verified: #16a34a;
  --color-trust-verified-text: #4ade80;
  --color-trust-verified-bg: rgba(34, 197, 94, 0.12);
  --color-trust-unverified: #dc2626;
  --color-trust-unverified-text: #fca5a5;
  --color-trust-unverified-bg: rgba(239, 68, 68, 0.12);
  --color-card-bg: #10233f;
  --color-card-border: #1e3a67;
  --color-card-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
  --color-toolbar-button-bg: #ffffff;
  --color-toolbar-button-text: #2c3e50;
  --color-toolbar-button-hover-bg: #f5f5f5;
  --color-button-primary-bg: #2aa5e8;
  --color-button-primary-text: #ffffff;
  --color-button-primary-hover-bg: #4fc3f7;
  --color-button-secondary-bg: #15294a;
  --color-button-secondary-text: #e6edf8;
  --color-button-secondary-border: #294b80;
  --color-button-secondary-hover-bg: #1a3358;
  --color-button-success-bg: #22c55e;
  --color-button-success-text: #ffffff;
  --color-button-success-hover-bg: #16a34a;
  --color-button-error-bg: #ef4444;
  --color-button-error-text: #ffffff;
  --color-button-error-hover-bg: #dc2626;
  --color-severity-critical: #ef4444;
  --color-severity-critical-text: #fca5a5;
  --color-severity-critical-bg: rgba(239, 68, 68, 0.14);
  --color-severity-critical-border: #ef4444;
  --color-severity-high: #f59e0b;
  --color-severity-high-text: #fcd34d;
  --color-severity-high-bg: rgba(245, 158, 11, 0.14);
  --color-severity-high-border: #f59e0b;
  --color-severity-medium: #f97316;
  --color-severity-medium-text: #fdba74;
  --color-severity-medium-bg: rgba(249, 115, 22, 0.14);
  --color-severity-medium-border: #f97316;
  --color-severity-low: #2aa5e8;
  --color-severity-low-text: #4fc3f7;
  --color-severity-low-bg: rgba(42, 165, 232, 0.14);
  --color-severity-low-border: #2aa5e8;
  --color-severity-info: #a78bfa;
  --color-severity-info-text: #c4b5fd;
  --color-severity-info-bg: rgba(167, 139, 250, 0.14);
  --color-severity-info-border: #a78bfa;
  --color-status-active-bg: rgba(34, 197, 94, 0.12);
  --color-status-active-text: #4ade80;
  --color-status-active-border: #16a34a;
  --color-status-inactive-bg: rgba(109, 139, 179, 0.12);
  --color-status-inactive-text: #6d8bb3;
  --color-status-inactive-border: #6d8bb3;
  --color-status-pending-bg: rgba(245, 158, 11, 0.12);
  --color-status-pending-text: #fcd34d;
  --color-status-pending-border: #f59e0b;
  --color-status-approved-bg: rgba(34, 197, 94, 0.12);
  --color-status-approved-text: #4ade80;
  --color-status-approved-border: #16a34a;
  --color-filter-bg: #0e1b31;
  --color-filter-border: #1e3a67;
  --color-filter-selected-bg: #2aa5e8;
  --color-filter-selected-text: #ffffff;
  --color-dropdown-bg: #10233f;
  --color-dropdown-border: #294b80;
  --color-hover-bg: #15294a;
  --color-button-hover-bg: #15294a;
  --color-focus-ring: #2aa5e8;
  --color-highlight: rgba(42, 165, 232, 0.18);
  --color-text-highlight: rgba(42, 165, 232, 0.18);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.2);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.3);
  --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.4);
  --color-primary-background-alpha10: rgba(25, 118, 210, 0.1);
  --color-primary-background-alpha20: rgba(25, 118, 210, 0.2);
  --color-primary-border-alpha30: rgba(25, 118, 210, 0.3);
  --color-primary-overlay-alpha50: rgba(25, 118, 210, 0.5);
  --color-success-background-alpha10: rgba(40, 167, 69, 0.1);
  --color-success-background-alpha20: rgba(40, 167, 69, 0.2);
  --color-success-border-alpha30: rgba(40, 167, 69, 0.3);
  --color-success-overlay-alpha50: rgba(40, 167, 69, 0.5);
  --color-warning-background-alpha10: rgba(255, 193, 7, 0.1);
  --color-warning-background-alpha20: rgba(255, 193, 7, 0.2);
  --color-warning-border-alpha30: rgba(255, 193, 7, 0.3);
  --color-warning-overlay-alpha50: rgba(255, 193, 7, 0.5);
  --color-error-background-alpha10: rgba(220, 53, 69, 0.1);
  --color-error-background-alpha20: rgba(220, 53, 69, 0.2);
  --color-error-border-alpha30: rgba(220, 53, 69, 0.3);
  --color-error-overlay-alpha50: rgba(220, 53, 69, 0.5);
  --color-info-background-alpha10: rgba(23, 162, 184, 0.1);
  --color-info-background-alpha20: rgba(23, 162, 184, 0.2);
  --color-info-border-alpha30: rgba(23, 162, 184, 0.3);
  --color-info-overlay-alpha50: rgba(23, 162, 184, 0.5);
  --gradient-card: linear-gradient(135deg, #243447 0%, #1f2b3b 100%);
  --gradient-primary: linear-gradient(
    135deg,
    var(--color-primary) 0%,
    var(--color-primary-hover) 100%
  );
  --gradient-accent: linear-gradient(135deg, #0cabf5 0%, #1565c0 100%);
  --gradient-success: linear-gradient(135deg, #28a745 0%, #16a34a 100%);
  --gradient-error: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
  --gradient-warning: linear-gradient(135deg, #ffc107 0%, #ff9800 100%);
  --gradient-info: linear-gradient(135deg, #17a2b8 0%, #00bcd4 100%);
  --gradient-overlay: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%);
  --gradient-shimmer: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.2) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  --color-copilot-accent: #7c3aed;
  --color-copilot-accent-hover: #6d28d9;
  --color-copilot-accent-bg: #ede9fe;
  --color-copilot-accent-bg-hover: #ddd6fe;
  --color-copilot-accent-text: #6d28d9;
  --color-copilot-risk-critical-bg: rgba(239, 68, 68, 0.2);
  --color-copilot-risk-critical-text: rgba(248, 113, 113, 1);
  --color-copilot-risk-critical-border: rgba(239, 68, 68, 0.4);
  --color-copilot-risk-high-bg: rgba(251, 146, 60, 0.2);
  --color-copilot-risk-high-text: rgba(251, 146, 60, 1);
  --color-copilot-risk-high-border: rgba(251, 146, 60, 0.4);
  --color-copilot-risk-medium-bg: rgba(250, 204, 21, 0.2);
  --color-copilot-risk-medium-text: rgba(253, 224, 71, 1);
  --color-copilot-risk-medium-border: rgba(250, 204, 21, 0.4);
  --color-copilot-risk-low-bg: rgba(34, 197, 94, 0.2);
  --color-copilot-risk-low-text: rgba(74, 222, 128, 1);
  --color-copilot-risk-low-border: rgba(34, 197, 94, 0.4);
  --color-copilot-risk-unknown-bg: rgba(100, 116, 139, 0.2);
  --color-copilot-risk-unknown-text: rgba(148, 163, 184, 1);
  --color-copilot-risk-unknown-border: rgba(100, 116, 139, 0.4);
}

:root {
  --color-background-gray: var(--color-bg-secondary);
  --color-white: var(--color-bg-primary);
  --color-card-background: var(--color-card-bg);
  --color-filter-background: var(--color-filter-bg);
  --color-filter-selected: var(--color-filter-selected-bg);
  --color-dropdown-background: var(--color-dropdown-bg);
  --font-size-sm: var(--typography-font-size-body-sm);
  --font-size-base: var(--typography-font-size-body);
  --font-size-lg: var(--typography-font-size-h2);
  --font-weight-normal: var(--typography-font-weight-body);
  --font-weight-medium: var(--typography-font-weight-label);
  --font-weight-bold: var(--typography-font-weight-h1);
  --line-height-base: var(--typography-line-height-body);
  --line-height-tight: var(--typography-line-height-h1);
  --control-height: var(--layout-control-height-base);
  --radius-base: var(--layout-radius-base);
  --radius-lg: var(--layout-radius-lg);
  --spacing-xs: var(--spacing-spacing-xs);
  --spacing-sm: var(--spacing-spacing-sm);
  --spacing-md: var(--spacing-spacing-md);
  --spacing-lg: var(--spacing-spacing-lg);
  --spacing-xl: var(--spacing-spacing-xl);
  --spacing-xxl: var(--spacing-spacing-xxl);
}

.eng-theme--dark {
  --color-border-accent: var(--color-border-strong);
  --color-hover-background: var(--color-hover-bg);
  --color-button-hover: var(--color-button-hover-bg);
}

.main-view__wrapper {
  padding: var(--spacing-lg) var(--spacing-xl);
  display: flex;
  flex-direction: column;
  background-color: var(--color-bg-secondary);
  min-height: 100%;
  box-sizing: border-box;
}

.eng-color-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 1px;
  flex-shrink: 0;
}

.component-card {
  background: var(--color-card-bg);
  border: 1px solid var(--color-card-border);
  border-radius: var(--radius-lg);
  padding: var(--spacing-xl);
  box-shadow: var(--shadow-sm);
}
.eng-theme--dark .component-card {
  box-shadow: var(--shadow-md);
}

.main-title {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-primary);
  margin-bottom: var(--spacing-sm);
  line-height: var(--line-height-tight);
}

.subtitle {
  font-size: var(--font-size-base);
  color: var(--color-text-secondary);
  line-height: var(--line-height-base);
}

.section-title {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-primary);
}

.form-row {
  display: flex;
  gap: var(--spacing-lg);
  align-items: flex-end;
  flex-wrap: wrap;
}

.form-group {
  display: flex;
  flex-direction: column;
  min-width: 150px;
  flex: 1;
}

.form-group label {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-primary);
  margin-bottom: var(--spacing-xs);
  display: block;
}

.form-select {
  height: var(--control-height);
  padding: var(--spacing-sm) var(--spacing-md);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-base);
  background-color: var(--color-bg-primary);
  color: var(--color-text-primary);
  font-size: var(--font-size-base);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.form-select:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 2px var(--color-primary-background-alpha20);
}
.form-select:hover {
  border-color: var(--color-primary);
}
.form-select:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.eng-theme--dark .form-select {
  background-color: var(--color-filter-bg);
  border-color: var(--color-border);
}

.form-input {
  height: var(--control-height);
  padding: var(--spacing-sm) var(--spacing-md);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-base);
  background-color: var(--color-bg-primary);
  color: var(--color-text-primary);
  font-size: var(--font-size-base);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.form-input::placeholder {
  color: var(--color-text-muted);
}
.form-input:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 2px var(--color-primary-background-alpha20);
}
.form-input:hover:not(:disabled) {
  border-color: var(--color-primary);
}
.form-input:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.eng-theme--dark .form-input {
  background-color: var(--color-filter-bg);
  border-color: var(--color-border);
}

.eng-dialog {
  padding: 0;
  display: flex;
  flex-direction: column;
  max-height: 90vh;
  min-height: 0;
}
.eng-dialog__header {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-md);
  padding: var(--spacing-lg) var(--spacing-xl);
  background: var(--gradient-accent);
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
}
.eng-dialog__header h2,
.eng-dialog__header h3 {
  margin: 0;
  color: var(--color-primary-contrast);
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-bold);
}
.eng-dialog__header button {
  background: transparent;
  border: none;
  color: var(--color-primary-contrast);
  cursor: pointer;
  padding: var(--spacing-xs);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background-color 120ms ease, opacity 120ms ease;
  opacity: 0.85;
}
.eng-dialog__header button:hover:not(:disabled) {
  background-color: rgba(255, 255, 255, 0.15);
  opacity: 1;
}
.eng-dialog__header button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.eng-dialog__header button mat-icon {
  font-size: 20px;
  width: 20px;
  height: 20px;
}
.eng-dialog__header-title {
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
}
.eng-dialog__header-actions {
  display: flex;
  align-items: center;
  gap: var(--spacing-xs);
  margin-left: auto;
}
.eng-dialog__header-flat {
  padding: var(--spacing-xl) var(--spacing-xl) var(--spacing-md);
  background-color: var(--color-card-bg);
}
.eng-dialog__content {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding: var(--spacing-xl);
  background-color: var(--color-card-bg);
}
.eng-dialog__description {
  margin: 0 0 var(--spacing-xl) 0;
  color: var(--color-text-secondary);
  font-size: var(--font-size-base);
  line-height: var(--line-height-base);
}
.eng-dialog__section {
  margin-bottom: var(--spacing-xl);
}
.eng-dialog__section-label {
  display: block;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-primary);
  margin-bottom: var(--spacing-xs);
}
.eng-dialog__actions {
  flex-shrink: 0;
  margin: 0;
  padding: var(--spacing-lg) var(--spacing-xl);
  background-color: var(--color-card-bg);
  border-radius: 0 0 var(--radius-lg) var(--radius-lg);
  display: flex;
  justify-content: flex-end;
  gap: var(--spacing-md);
  border-top: 1px solid var(--color-border-subtle);
}
.eng-dialog__close-btn {
  height: var(--control-height);
  min-width: 120px;
  padding: var(--spacing-sm) var(--spacing-lg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-base);
  background-color: var(--color-card-bg);
  color: var(--color-text-secondary);
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-medium);
  cursor: pointer;
  transition: all 0.2s ease;
  display: flex;
  align-items: center;
  justify-content: center;
}
.eng-dialog__close-btn:hover {
  background-color: var(--color-bg-secondary);
  border-color: var(--color-primary);
  color: var(--color-text-primary);
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}
.eng-dialog__close-btn:active {
  transform: translateY(0);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
}
.eng-dialog__saving-indicator {
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
  margin-top: var(--spacing-xs);
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
}

.eng-btn, .eng-btn--icon-only, .eng-btn-icon, .eng-btn-sm, .eng-btn-control, .btn, .eng-btn-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-sm);
  border: none;
  border-radius: var(--radius-base);
  font-family: inherit;
  font-weight: var(--font-weight-medium);
  cursor: pointer;
  transition: all 0.2s ease;
  line-height: 1;
}
.eng-btn:disabled, .eng-btn--icon-only:disabled, .eng-btn-icon:disabled, .eng-btn-sm:disabled, .eng-btn-control:disabled, .btn:disabled, .eng-btn-action:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.eng-btn:hover:not(:disabled), .eng-btn--icon-only:hover:not(:disabled), .eng-btn-icon:hover:not(:disabled), .eng-btn-sm:hover:not(:disabled), .eng-btn-control:hover:not(:disabled), .btn:hover:not(:disabled), .eng-btn-action:hover:not(:disabled) {
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}
.eng-btn:active:not(:disabled), .eng-btn--icon-only:active:not(:disabled), .eng-btn-icon:active:not(:disabled), .eng-btn-sm:active:not(:disabled), .eng-btn-control:active:not(:disabled), .btn:active:not(:disabled), .eng-btn-action:active:not(:disabled) {
  transform: translateY(0);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
}
.eng-btn mat-icon, .eng-btn--icon-only mat-icon, .eng-btn-icon mat-icon, .eng-btn-sm mat-icon, .eng-btn-control mat-icon, .btn mat-icon, .eng-btn-action mat-icon {
  font-size: 20px;
  width: 20px;
  height: 20px;
}

.eng-btn-action {
  height: 36px;
  padding: 0 20px;
  font-size: var(--font-size-base);
  box-shadow: 0 1px 2px rgba(25, 118, 210, 0.04);
}
.eng-btn-action .button-content,
.eng-btn-action .button-loading {
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
  width: 100%;
}

.eng-btn-control, .btn {
  height: var(--control-height);
  padding: 0 var(--spacing-md);
  font-size: var(--font-size-base);
  border: 1px solid var(--color-border);
  background-color: var(--color-bg-primary);
  color: var(--color-text-primary);
  min-width: fit-content;
}

.eng-btn-sm {
  height: 28px;
  padding: 0 12px;
  font-size: var(--spacing-md);
  min-width: 80px;
}
.eng-btn-sm mat-icon {
  font-size: var(--spacing-lg);
  width: var(--spacing-lg);
  height: var(--spacing-lg);
}

.eng-btn-icon {
  height: 32px;
  width: 32px;
  padding: 0;
  border-radius: 50%;
  background: none;
  color: var(--color-text-primary);
}
.eng-btn-icon:hover {
  color: var(--color-primary);
  background: var(--color-primary-background-alpha10);
}
.eng-btn-icon mat-icon {
  font-size: var(--spacing-xl);
  width: var(--spacing-xl);
  height: var(--spacing-xl);
}

.eng-btn-icon--danger:hover {
  color: var(--color-error);
  background: color-mix(in srgb, var(--color-error) 12%, transparent);
}

.eng-btn--primary, .btn-primary {
  background-color: var(--color-primary);
  color: white;
}
.eng-btn--primary:hover:not(:disabled), .btn-primary:hover:not(:disabled) {
  background-color: var(--color-primary-hover);
}
.eng-theme--dark .eng-btn--primary, .eng-theme--dark .btn-primary {
  background: var(--gradient-primary);
  border: 1px solid rgba(12, 171, 245, 0.3);
}
.eng-theme--dark .eng-btn--primary:hover:not(:disabled), .eng-theme--dark .btn-primary:hover:not(:disabled) {
  background: var(--gradient-accent);
  box-shadow: 0 4px 12px rgba(12, 171, 245, 0.4);
}

.eng-btn--success, .btn-success {
  background-color: var(--color-success);
  color: white;
  box-shadow: 0 1px 2px rgba(16, 185, 129, 0.04);
}
.eng-btn--success:hover:not(:disabled), .btn-success:hover:not(:disabled) {
  background-color: #10b981;
}
.eng-theme--dark .eng-btn--success, .eng-theme--dark .btn-success {
  background: var(--gradient-success);
  border: 1px solid var(--color-success-border-alpha30);
}
.eng-theme--dark .eng-btn--success:hover:not(:disabled), .eng-theme--dark .btn-success:hover:not(:disabled) {
  box-shadow: 0 4px 12px rgba(16, 185, 129, 0.4);
}

.eng-btn--danger, .btn-error {
  background-color: var(--color-error);
  color: white;
}
.eng-btn--danger:hover:not(:disabled), .btn-error:hover:not(:disabled) {
  background-color: #dc2626;
}

.eng-btn--secondary {
  background-color: var(--color-white);
  color: var(--color-text-primary);
  border: 1px solid var(--color-border);
}
.eng-btn--secondary:hover:not(:disabled) {
  background-color: var(--color-background-gray);
}
.eng-theme--dark .eng-btn--secondary {
  background: linear-gradient(135deg, rgb(45, 63, 82) 0%, var(--color-bg-primary) 100%);
  color: var(--color-text-primary);
  border: 1px solid var(--color-border-accent);
}
.eng-theme--dark .eng-btn--secondary:hover:not(:disabled) {
  background: linear-gradient(135deg, var(--color-button-hover) 0%, rgb(45, 63, 82) 100%);
  border-color: var(--color-primary);
  color: var(--color-primary);
}

.eng-btn--purple {
  background-color: rgb(139, 92, 246);
  color: white;
}
.eng-btn--purple:hover:not(:disabled) {
  background-color: rgb(124, 58, 237);
}
.eng-theme--dark .eng-btn--purple {
  background: linear-gradient(135deg, rgb(139, 92, 246) 0%, rgb(124, 58, 237) 100%);
  border: 1px solid rgba(139, 92, 246, 0.3);
}
.eng-theme--dark .eng-btn--purple:hover:not(:disabled) {
  background: linear-gradient(135deg, rgb(124, 58, 237) 0%, rgb(109, 40, 217) 100%);
  box-shadow: 0 4px 12px rgba(139, 92, 246, 0.4);
}

.eng-btn--approved {
  background-color: var(--color-success-background-alpha10);
  color: rgb(6, 95, 70);
  border: 1px solid var(--color-success-border-alpha30);
}
.eng-btn--approved:hover:not(:disabled) {
  background-color: var(--color-success-background-alpha20);
}

.eng-btn--ghost {
  background: transparent;
  color: var(--color-text-secondary);
  border: 1px solid var(--color-border2);
  border-radius: var(--layout-radius-sm);
  padding: var(--spacing-xs) var(--spacing-md);
  font-size: var(--typography-font-size-caption);
}
.eng-btn--ghost:hover:not(:disabled) {
  background: color-mix(in srgb, var(--color-accent) 8%, transparent);
  color: var(--color-text-primary);
  border-color: var(--color-accent);
}
.eng-btn--ghost:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-focus) 35%, transparent);
}

.eng-btn--icon-only {
  height: 32px;
  width: 32px;
  padding: 0;
  background: transparent;
  border: 1px solid transparent;
  border-radius: var(--layout-radius-sm);
  color: var(--color-text-secondary);
}
.eng-btn--icon-only:hover:not(:disabled) {
  background: var(--color-surface2);
  color: var(--color-text-primary);
}
.eng-btn--icon-only mat-icon {
  font-size: 18px;
  width: 18px;
  height: 18px;
}

.badge, .severity-badge, .status-badge {
  display: inline-block;
  padding: 4px 8px;
  border-radius: 12px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  line-height: 1.2;
  border: 1px solid transparent;
}

.status-badge.active {
  background-color: var(--color-status-active-bg);
  color: var(--color-status-active-text);
  border: 1px solid var(--color-status-active-border);
}
.status-badge.inactive {
  background-color: var(--color-status-inactive-bg);
  color: var(--color-status-inactive-text);
  border: 1px solid var(--color-status-inactive-border);
}
.status-badge.approved {
  background-color: var(--color-status-approved-bg);
  color: var(--color-status-approved-text);
  border: 1px solid var(--color-status-approved-border);
}
.status-badge.pending {
  background-color: var(--color-status-pending-bg);
  color: var(--color-status-pending-text);
  border: 1px solid var(--color-status-pending-border);
}
.status-badge.reverted {
  background-color: var(--color-error-background-alpha10);
  color: var(--color-error);
  border: 1px solid var(--color-error-border-alpha30);
}

.severity-badge.severity-critical {
  background-color: var(--color-severity-critical-bg);
  color: var(--color-severity-critical-text);
  border: 1px solid var(--color-severity-critical-border);
}
.severity-badge.severity-high {
  background-color: var(--color-severity-high-bg);
  color: var(--color-severity-high-text);
  border: 1px solid var(--color-severity-high-border);
}
.severity-badge.severity-medium {
  background-color: var(--color-severity-medium-bg);
  color: var(--color-severity-medium-text);
  border: 1px solid var(--color-severity-medium-border);
}
.severity-badge.severity-low {
  background-color: var(--color-severity-low-bg);
  color: var(--color-severity-low-text);
  border: 1px solid var(--color-severity-low-border);
}
.severity-badge.severity-informational {
  background-color: var(--color-info-background-alpha10);
  color: var(--color-info);
  border: 1px solid var(--color-info-border-alpha30);
}

.message {
  margin-top: var(--spacing-lg);
  padding: var(--spacing-md);
  border-radius: var(--radius-base);
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-medium);
}
.message.success {
  background-color: var(--color-success-background-alpha10);
  color: var(--color-success);
  border: 1px solid var(--color-success-border-alpha30);
}
.message.error {
  background-color: var(--color-error-background-alpha10);
  color: var(--color-error);
  border: 1px solid var(--color-error-border-alpha30);
}

.flex {
  display: flex;
}

.flex-center {
  display: flex;
  justify-content: center;
  align-items: center;
}

.flex-column {
  display: flex;
  flex-direction: column;
}

.flex-between {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.flex-start {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.flex-end {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

.w-full {
  width: 100%;
}

.h-full {
  height: 100%;
}

.cursor-pointer {
  cursor: pointer;
}

.cursor-not-allowed {
  cursor: not-allowed;
}

@media (max-width: 768px) {
  .main-view__wrapper {
    padding: var(--spacing-lg) var(--spacing-md);
  }
  .form-row {
    flex-direction: column;
    gap: var(--spacing-md);
  }
  .form-group {
    min-width: auto;
  }
}
/**
 * Design System - Table Styles
 *
 * Reusable table component styles that deduplicate ~800 lines of similar patterns
 * across components like segmentation, assets-v2, alerts, policies, etc.
 *
 * Usage:
 *   1. Apply base class to container: <div class="eng-table-container">
 *   2. Apply base class to table: <table class="eng-table">
 *   3. Add modifiers as needed: eng-table--striped, eng-table--hover, etc.
 *
 * Structure:
 *   - Base table styles (container, table, thead, tbody, th, td)
 *   - Row state modifiers (hover, selected, expanded, highlighted)
 *   - Table variants (striped, dense, selectable, expandable)
 *   - Cell types (checkbox, expand, action, ip, monospace)
 *   - Responsive helpers
 *   - Dark mode overrides
 */
/**
 * Design System Tokens (Generated)
 *
 * ⚠️ DO NOT EDIT THIS FILE MANUALLY ⚠️
 * This file is auto-generated from TypeScript token definitions.
 * Run 'npm run generate:tokens' to regenerate.
 *
 * Source: src/app/core/design-system/tokens/
 */
:root {
  --color-brand: #0cabf5;
  --color-primary: #2aa5e8;
  --color-primary-hover: #1d7fb8;
  --color-primary-contrast: #ffffff;
  --color-text-primary: #0f172a;
  --color-text-secondary: #475569;
  --color-text-muted: #64748b;
  --color-text-inverse: #e6edf8;
  --color-mute: #94a3b8;
  --color-bg-primary: #f1f5f9;
  --color-bg-secondary: #f8fafc;
  --color-bg-tertiary: #f1f5f9;
  --color-surface: #ffffff;
  --color-surface2: #f8fafc;
  --color-surface3: #f1f5f9;
  --color-surface-external: #fef9e7;
  --color-border: #cbd5e1;
  --color-border2: #cbd5e1;
  --color-border-subtle: #e2e8f0;
  --color-border-strong: #94a3b8;
  --color-line: #e2e8f0;
  --color-accent: #2aa5e8;
  --color-accent2: #1d7fb8;
  --color-accent3: #4fc3f7;
  --color-accent-text: #0d7ab8;
  --color-focus: #2aa5e8;
  --color-success: #16a34a;
  --color-success-hover: #22c55e;
  --color-error: #dc2626;
  --color-error-hover: #ef4444;
  --color-warning: #d97706;
  --color-warning-hover: #f59e0b;
  --color-info: #0d7ab8;
  --color-info-hover: #1d7fb8;
  --color-status-good: #16a34a;
  --color-status-good-text: #15803d;
  --color-status-good-bg: rgba(34, 197, 94, 0.1);
  --color-status-warn: #d97706;
  --color-status-bad: #dc2626;
  --color-rule-allow: #16a34a;
  --color-rule-deny: #dc2626;
  --color-protocol-tcp: #0d7ab8;
  --color-protocol-udp: #7c3aed;
  --color-protocol-other: #d97706;
  --color-protocol-external: #ea580c;
  --color-trust-verified: #16a34a;
  --color-trust-verified-text: #15803d;
  --color-trust-verified-bg: rgba(34, 197, 94, 0.1);
  --color-trust-unverified: #dc2626;
  --color-trust-unverified-text: #b91c1c;
  --color-trust-unverified-bg: rgba(239, 68, 68, 0.08);
  --color-card-bg: #ffffff;
  --color-card-border: #cbd5e1;
  --color-card-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
  --color-toolbar-button-bg: #ffffff;
  --color-toolbar-button-text: #0f172a;
  --color-toolbar-button-hover-bg: #f8fafc;
  --color-button-primary-bg: #2aa5e8;
  --color-button-primary-text: #ffffff;
  --color-button-primary-hover-bg: #1d7fb8;
  --color-button-secondary-bg: #ffffff;
  --color-button-secondary-text: #0f172a;
  --color-button-secondary-border: #e2e8f0;
  --color-button-secondary-hover-bg: #f8fafc;
  --color-button-success-bg: #16a34a;
  --color-button-success-text: #ffffff;
  --color-button-success-hover-bg: #22c55e;
  --color-button-error-bg: #dc2626;
  --color-button-error-text: #ffffff;
  --color-button-error-hover-bg: #ef4444;
  --color-severity-critical: #ef4444;
  --color-severity-critical-text: #b91c1c;
  --color-severity-critical-bg: rgba(239, 68, 68, 0.08);
  --color-severity-critical-border: #ef4444;
  --color-severity-high: #f59e0b;
  --color-severity-high-text: #b45309;
  --color-severity-high-bg: rgba(245, 158, 11, 0.1);
  --color-severity-high-border: #f59e0b;
  --color-severity-medium: #f97316;
  --color-severity-medium-text: #c2410c;
  --color-severity-medium-bg: rgba(249, 115, 22, 0.1);
  --color-severity-medium-border: #f97316;
  --color-severity-low: #2aa5e8;
  --color-severity-low-text: #0d7ab8;
  --color-severity-low-bg: rgba(42, 165, 232, 0.1);
  --color-severity-low-border: #2aa5e8;
  --color-severity-info: #a78bfa;
  --color-severity-info-text: #6d28d9;
  --color-severity-info-bg: rgba(167, 139, 250, 0.1);
  --color-severity-info-border: #a78bfa;
  --color-status-active-bg: rgba(34, 197, 94, 0.1);
  --color-status-active-text: #15803d;
  --color-status-active-border: #16a34a;
  --color-status-inactive-bg: rgba(100, 116, 139, 0.1);
  --color-status-inactive-text: #64748b;
  --color-status-inactive-border: #64748b;
  --color-status-pending-bg: rgba(217, 119, 6, 0.1);
  --color-status-pending-text: #d97706;
  --color-status-pending-border: #d97706;
  --color-status-approved-bg: rgba(34, 197, 94, 0.1);
  --color-status-approved-text: #15803d;
  --color-status-approved-border: #16a34a;
  --color-filter-bg: #f8fafc;
  --color-filter-border: #cbd5e1;
  --color-filter-selected-bg: #2aa5e8;
  --color-filter-selected-text: #ffffff;
  --color-dropdown-bg: #ffffff;
  --color-dropdown-border: #cbd5e1;
  --color-hover-bg: #f8fafc;
  --color-button-hover-bg: #f8fafc;
  --color-focus-ring: #2aa5e8;
  --color-highlight: rgba(42, 165, 232, 0.1);
  --color-text-highlight: rgba(42, 165, 232, 0.1);
  --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04);
  --shadow-md: 0 2px 8px rgba(15, 23, 42, 0.06);
  --shadow-lg: 0 8px 24px rgba(15, 23, 42, 0.1);
  --color-primary-background-alpha10: rgba(25, 118, 210, 0.1);
  --color-primary-background-alpha20: rgba(25, 118, 210, 0.2);
  --color-primary-border-alpha30: rgba(25, 118, 210, 0.3);
  --color-primary-overlay-alpha50: rgba(25, 118, 210, 0.5);
  --color-success-background-alpha10: rgba(40, 167, 69, 0.1);
  --color-success-background-alpha20: rgba(40, 167, 69, 0.2);
  --color-success-border-alpha30: rgba(40, 167, 69, 0.3);
  --color-success-overlay-alpha50: rgba(40, 167, 69, 0.5);
  --color-warning-background-alpha10: rgba(255, 193, 7, 0.1);
  --color-warning-background-alpha20: rgba(255, 193, 7, 0.2);
  --color-warning-border-alpha30: rgba(255, 193, 7, 0.3);
  --color-warning-overlay-alpha50: rgba(255, 193, 7, 0.5);
  --color-error-background-alpha10: rgba(220, 53, 69, 0.1);
  --color-error-background-alpha20: rgba(220, 53, 69, 0.2);
  --color-error-border-alpha30: rgba(220, 53, 69, 0.3);
  --color-error-overlay-alpha50: rgba(220, 53, 69, 0.5);
  --color-info-background-alpha10: rgba(23, 162, 184, 0.1);
  --color-info-background-alpha20: rgba(23, 162, 184, 0.2);
  --color-info-border-alpha30: rgba(23, 162, 184, 0.3);
  --color-info-overlay-alpha50: rgba(23, 162, 184, 0.5);
  --gradient-card: linear-gradient(135deg, #ffffff 0%, #f5f5f5 100%);
  --gradient-primary: linear-gradient(
    135deg,
    var(--color-primary) 0%,
    var(--color-primary-hover) 100%
  );
  --gradient-accent: linear-gradient(135deg, #0cabf5 0%, #1565c0 100%);
  --gradient-success: linear-gradient(135deg, #28a745 0%, #16a34a 100%);
  --gradient-error: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
  --gradient-warning: linear-gradient(135deg, #ffc107 0%, #ff9800 100%);
  --gradient-info: linear-gradient(135deg, #17a2b8 0%, #00bcd4 100%);
  --gradient-overlay: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%);
  --gradient-shimmer: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.2) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  --color-copilot-accent: #7c3aed;
  --color-copilot-accent-hover: #6d28d9;
  --color-copilot-accent-bg: #ede9fe;
  --color-copilot-accent-bg-hover: #ddd6fe;
  --color-copilot-accent-text: #6d28d9;
  --color-copilot-risk-critical-bg: rgba(239, 68, 68, 0.2);
  --color-copilot-risk-critical-text: #dc3545;
  --color-copilot-risk-critical-border: rgba(239, 68, 68, 0.4);
  --color-copilot-risk-high-bg: rgba(251, 146, 60, 0.2);
  --color-copilot-risk-high-text: #ff9800;
  --color-copilot-risk-high-border: rgba(251, 146, 60, 0.4);
  --color-copilot-risk-medium-bg: rgba(250, 204, 21, 0.2);
  --color-copilot-risk-medium-text: #f57c00;
  --color-copilot-risk-medium-border: rgba(250, 204, 21, 0.4);
  --color-copilot-risk-low-bg: rgba(34, 197, 94, 0.2);
  --color-copilot-risk-low-text: #28a745;
  --color-copilot-risk-low-border: rgba(34, 197, 94, 0.4);
  --color-copilot-risk-unknown-bg: rgba(100, 116, 139, 0.2);
  --color-copilot-risk-unknown-text: #6c757d;
  --color-copilot-risk-unknown-border: rgba(100, 116, 139, 0.4);
  --spacing-spacing-xs: 4px;
  --spacing-spacing-sm: 8px;
  --spacing-spacing-md: 12px;
  --spacing-spacing-lg: 16px;
  --spacing-spacing-xl: 24px;
  --spacing-spacing-xxl: 30px;
  --spacing-card-padding: 24px;
  --spacing-card-gap: 16px;
  --spacing-button-padding-vertical: 8px;
  --spacing-button-padding-horizontal: 12px;
  --spacing-button-gap: 8px;
  --spacing-input-padding-vertical: 8px;
  --spacing-input-padding-horizontal: 12px;
  --spacing-form-row-gap: 16px;
  --spacing-form-label-margin: 4px;
  --spacing-section-margin-bottom: 24px;
  --spacing-page-margin-bottom: 30px;
  --spacing-page-margin: 30px;
  --spacing-container-padding: 24px;
  --spacing-grid-gap: 16px;
  --typography-font-family-base:
    "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --typography-font-family-mono:
    "JetBrains Mono", ui-monospace, "Cascadia Code", Menlo, Consolas, monospace;
  --typography-font-size-page-title: 32px;
  --typography-font-weight-page-title: 700;
  --typography-line-height-page-title: 1.2;
  --typography-font-size-h1: 32px;
  --typography-font-weight-h1: 700;
  --typography-line-height-h1: 1.2;
  --typography-font-size-h2: 24px;
  --typography-font-weight-h2: 600;
  --typography-line-height-h2: 1.2;
  --typography-font-size-h3: 20px;
  --typography-font-weight-h3: 600;
  --typography-line-height-h3: 1.2;
  --typography-font-size-h4: 18px;
  --typography-font-weight-h4: 600;
  --typography-line-height-h4: 1.5;
  --typography-font-size-body: 14px;
  --typography-font-weight-body: 400;
  --typography-line-height-body: 1.5;
  --typography-font-size-body-lg: 16px;
  --typography-font-weight-body-lg: 400;
  --typography-line-height-body-lg: 1.5;
  --typography-font-size-body-sm: 13px;
  --typography-font-weight-body-sm: 400;
  --typography-line-height-body-sm: 1.5;
  --typography-font-size-caption: 12px;
  --typography-font-weight-caption: 400;
  --typography-line-height-caption: 1.5;
  --typography-font-size-label: 13px;
  --typography-font-weight-label: 500;
  --typography-line-height-label: 1.5;
  --typography-font-size-button: 14px;
  --typography-font-weight-button: 500;
  --typography-line-height-button: 1.5;
  --typography-font-size-badge: 11px;
  --typography-font-weight-badge: 600;
  --typography-line-height-badge: 1.2;
  --typography-font-size-code: 13px;
  --typography-font-weight-code: 400;
  --typography-line-height-code: 1.5;
  --layout-radius-none: 0px;
  --layout-radius-sm: 4px;
  --layout-radius-base: 6px;
  --layout-radius-lg: 8px;
  --layout-radius-xl: 12px;
  --layout-radius-full: 9999px;
  --layout-control-height-sm: 32px;
  --layout-control-height-base: 36px;
  --layout-control-height-lg: 40px;
  --layout-shadow-none: none;
  --layout-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04);
  --layout-shadow-base: 0 2px 8px rgba(15, 23, 42, 0.06);
  --layout-shadow-md: 0 2px 8px rgba(15, 23, 42, 0.06);
  --layout-shadow-lg: 0 8px 24px rgba(15, 23, 42, 0.1);
  --layout-shadow-xl: 0 8px 24px rgba(15, 23, 42, 0.1);
  --layout-card-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
  --layout-modal-shadow: 0 8px 24px rgba(15, 23, 42, 0.1);
  --layout-dropdown-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
  --layout-button-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.eng-theme--dark {
  --color-brand: #0cabf5;
  --color-primary: #2aa5e8;
  --color-primary-hover: #4fc3f7;
  --color-primary-contrast: #ffffff;
  --color-text-primary: #e6edf8;
  --color-text-secondary: #aabad4;
  --color-text-muted: #6d8bb3;
  --color-text-inverse: #0f172a;
  --color-mute: #4a6690;
  --color-bg-primary: #0a1527;
  --color-bg-secondary: #0e1b31;
  --color-bg-tertiary: #10233f;
  --color-surface: #10233f;
  --color-surface2: #15294a;
  --color-surface3: #1a3358;
  --color-surface-external: #2a1a1f;
  --color-border: #1e3a67;
  --color-border2: #294b80;
  --color-border-subtle: #1e3a67;
  --color-border-strong: #294b80;
  --color-line: #22406f;
  --color-accent: #2aa5e8;
  --color-accent2: #1d7fb8;
  --color-accent3: #4fc3f7;
  --color-accent-text: #2aa5e8;
  --color-focus: #2aa5e8;
  --color-success: #22c55e;
  --color-success-hover: #16a34a;
  --color-error: #ef4444;
  --color-error-hover: #dc2626;
  --color-warning: #f59e0b;
  --color-warning-hover: #d97706;
  --color-info: #2aa5e8;
  --color-info-hover: #4fc3f7;
  --color-status-good: #22c55e;
  --color-status-good-text: #4ade80;
  --color-status-good-bg: rgba(34, 197, 94, 0.14);
  --color-status-warn: #f59e0b;
  --color-status-bad: #ef4444;
  --color-rule-allow: #22c55e;
  --color-rule-deny: #ef4444;
  --color-protocol-tcp: #4fc3f7;
  --color-protocol-udp: #a78bfa;
  --color-protocol-other: #f59e0b;
  --color-protocol-external: #f97316;
  --color-trust-verified: #16a34a;
  --color-trust-verified-text: #4ade80;
  --color-trust-verified-bg: rgba(34, 197, 94, 0.12);
  --color-trust-unverified: #dc2626;
  --color-trust-unverified-text: #fca5a5;
  --color-trust-unverified-bg: rgba(239, 68, 68, 0.12);
  --color-card-bg: #10233f;
  --color-card-border: #1e3a67;
  --color-card-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
  --color-toolbar-button-bg: #ffffff;
  --color-toolbar-button-text: #2c3e50;
  --color-toolbar-button-hover-bg: #f5f5f5;
  --color-button-primary-bg: #2aa5e8;
  --color-button-primary-text: #ffffff;
  --color-button-primary-hover-bg: #4fc3f7;
  --color-button-secondary-bg: #15294a;
  --color-button-secondary-text: #e6edf8;
  --color-button-secondary-border: #294b80;
  --color-button-secondary-hover-bg: #1a3358;
  --color-button-success-bg: #22c55e;
  --color-button-success-text: #ffffff;
  --color-button-success-hover-bg: #16a34a;
  --color-button-error-bg: #ef4444;
  --color-button-error-text: #ffffff;
  --color-button-error-hover-bg: #dc2626;
  --color-severity-critical: #ef4444;
  --color-severity-critical-text: #fca5a5;
  --color-severity-critical-bg: rgba(239, 68, 68, 0.14);
  --color-severity-critical-border: #ef4444;
  --color-severity-high: #f59e0b;
  --color-severity-high-text: #fcd34d;
  --color-severity-high-bg: rgba(245, 158, 11, 0.14);
  --color-severity-high-border: #f59e0b;
  --color-severity-medium: #f97316;
  --color-severity-medium-text: #fdba74;
  --color-severity-medium-bg: rgba(249, 115, 22, 0.14);
  --color-severity-medium-border: #f97316;
  --color-severity-low: #2aa5e8;
  --color-severity-low-text: #4fc3f7;
  --color-severity-low-bg: rgba(42, 165, 232, 0.14);
  --color-severity-low-border: #2aa5e8;
  --color-severity-info: #a78bfa;
  --color-severity-info-text: #c4b5fd;
  --color-severity-info-bg: rgba(167, 139, 250, 0.14);
  --color-severity-info-border: #a78bfa;
  --color-status-active-bg: rgba(34, 197, 94, 0.12);
  --color-status-active-text: #4ade80;
  --color-status-active-border: #16a34a;
  --color-status-inactive-bg: rgba(109, 139, 179, 0.12);
  --color-status-inactive-text: #6d8bb3;
  --color-status-inactive-border: #6d8bb3;
  --color-status-pending-bg: rgba(245, 158, 11, 0.12);
  --color-status-pending-text: #fcd34d;
  --color-status-pending-border: #f59e0b;
  --color-status-approved-bg: rgba(34, 197, 94, 0.12);
  --color-status-approved-text: #4ade80;
  --color-status-approved-border: #16a34a;
  --color-filter-bg: #0e1b31;
  --color-filter-border: #1e3a67;
  --color-filter-selected-bg: #2aa5e8;
  --color-filter-selected-text: #ffffff;
  --color-dropdown-bg: #10233f;
  --color-dropdown-border: #294b80;
  --color-hover-bg: #15294a;
  --color-button-hover-bg: #15294a;
  --color-focus-ring: #2aa5e8;
  --color-highlight: rgba(42, 165, 232, 0.18);
  --color-text-highlight: rgba(42, 165, 232, 0.18);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.2);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.3);
  --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.4);
  --color-primary-background-alpha10: rgba(25, 118, 210, 0.1);
  --color-primary-background-alpha20: rgba(25, 118, 210, 0.2);
  --color-primary-border-alpha30: rgba(25, 118, 210, 0.3);
  --color-primary-overlay-alpha50: rgba(25, 118, 210, 0.5);
  --color-success-background-alpha10: rgba(40, 167, 69, 0.1);
  --color-success-background-alpha20: rgba(40, 167, 69, 0.2);
  --color-success-border-alpha30: rgba(40, 167, 69, 0.3);
  --color-success-overlay-alpha50: rgba(40, 167, 69, 0.5);
  --color-warning-background-alpha10: rgba(255, 193, 7, 0.1);
  --color-warning-background-alpha20: rgba(255, 193, 7, 0.2);
  --color-warning-border-alpha30: rgba(255, 193, 7, 0.3);
  --color-warning-overlay-alpha50: rgba(255, 193, 7, 0.5);
  --color-error-background-alpha10: rgba(220, 53, 69, 0.1);
  --color-error-background-alpha20: rgba(220, 53, 69, 0.2);
  --color-error-border-alpha30: rgba(220, 53, 69, 0.3);
  --color-error-overlay-alpha50: rgba(220, 53, 69, 0.5);
  --color-info-background-alpha10: rgba(23, 162, 184, 0.1);
  --color-info-background-alpha20: rgba(23, 162, 184, 0.2);
  --color-info-border-alpha30: rgba(23, 162, 184, 0.3);
  --color-info-overlay-alpha50: rgba(23, 162, 184, 0.5);
  --gradient-card: linear-gradient(135deg, #243447 0%, #1f2b3b 100%);
  --gradient-primary: linear-gradient(
    135deg,
    var(--color-primary) 0%,
    var(--color-primary-hover) 100%
  );
  --gradient-accent: linear-gradient(135deg, #0cabf5 0%, #1565c0 100%);
  --gradient-success: linear-gradient(135deg, #28a745 0%, #16a34a 100%);
  --gradient-error: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
  --gradient-warning: linear-gradient(135deg, #ffc107 0%, #ff9800 100%);
  --gradient-info: linear-gradient(135deg, #17a2b8 0%, #00bcd4 100%);
  --gradient-overlay: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%);
  --gradient-shimmer: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.2) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  --color-copilot-accent: #7c3aed;
  --color-copilot-accent-hover: #6d28d9;
  --color-copilot-accent-bg: #ede9fe;
  --color-copilot-accent-bg-hover: #ddd6fe;
  --color-copilot-accent-text: #6d28d9;
  --color-copilot-risk-critical-bg: rgba(239, 68, 68, 0.2);
  --color-copilot-risk-critical-text: rgba(248, 113, 113, 1);
  --color-copilot-risk-critical-border: rgba(239, 68, 68, 0.4);
  --color-copilot-risk-high-bg: rgba(251, 146, 60, 0.2);
  --color-copilot-risk-high-text: rgba(251, 146, 60, 1);
  --color-copilot-risk-high-border: rgba(251, 146, 60, 0.4);
  --color-copilot-risk-medium-bg: rgba(250, 204, 21, 0.2);
  --color-copilot-risk-medium-text: rgba(253, 224, 71, 1);
  --color-copilot-risk-medium-border: rgba(250, 204, 21, 0.4);
  --color-copilot-risk-low-bg: rgba(34, 197, 94, 0.2);
  --color-copilot-risk-low-text: rgba(74, 222, 128, 1);
  --color-copilot-risk-low-border: rgba(34, 197, 94, 0.4);
  --color-copilot-risk-unknown-bg: rgba(100, 116, 139, 0.2);
  --color-copilot-risk-unknown-text: rgba(148, 163, 184, 1);
  --color-copilot-risk-unknown-border: rgba(100, 116, 139, 0.4);
}

:root {
  --color-background-gray: var(--color-bg-secondary);
  --color-white: var(--color-bg-primary);
  --color-card-background: var(--color-card-bg);
  --color-filter-background: var(--color-filter-bg);
  --color-filter-selected: var(--color-filter-selected-bg);
  --color-dropdown-background: var(--color-dropdown-bg);
  --font-size-sm: var(--typography-font-size-body-sm);
  --font-size-base: var(--typography-font-size-body);
  --font-size-lg: var(--typography-font-size-h2);
  --font-weight-normal: var(--typography-font-weight-body);
  --font-weight-medium: var(--typography-font-weight-label);
  --font-weight-bold: var(--typography-font-weight-h1);
  --line-height-base: var(--typography-line-height-body);
  --line-height-tight: var(--typography-line-height-h1);
  --control-height: var(--layout-control-height-base);
  --radius-base: var(--layout-radius-base);
  --radius-lg: var(--layout-radius-lg);
  --spacing-xs: var(--spacing-spacing-xs);
  --spacing-sm: var(--spacing-spacing-sm);
  --spacing-md: var(--spacing-spacing-md);
  --spacing-lg: var(--spacing-spacing-lg);
  --spacing-xl: var(--spacing-spacing-xl);
  --spacing-xxl: var(--spacing-spacing-xxl);
}

.eng-theme--dark {
  --color-border-accent: var(--color-border-strong);
  --color-hover-background: var(--color-hover-bg);
  --color-button-hover: var(--color-button-hover-bg);
}

/**
 * Table Container
 * Provides horizontal scrolling and custom scrollbar styling
 */
.eng-table-container {
  overflow-x: auto;
  overflow-y: visible;
  border-radius: var(--radius-lg);
  background-color: var(--color-card-background);
  scrollbar-width: thin;
  scrollbar-color: var(--color-border) transparent;
}
.eng-table-container::-webkit-scrollbar {
  height: 6px;
}
.eng-table-container::-webkit-scrollbar-track {
  background: transparent;
}
.eng-table-container::-webkit-scrollbar-thumb {
  background-color: var(--color-border);
  border-radius: 3px;
}
.eng-table-container::-webkit-scrollbar-thumb:hover {
  background-color: var(--color-text-secondary);
}
.eng-table-container::-webkit-scrollbar-button {
  background-color: var(--color-card-background);
  border: 1px solid var(--color-border);
  border-radius: 3px;
  width: var(--spacing-lg);
  height: 6px;
}
.eng-table-container::-webkit-scrollbar-button:hover {
  background-color: var(--color-border-subtle);
}
.eng-table-container::-webkit-scrollbar-button:single-button:horizontal:decrement {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='8' height='8' fill='%23666'><path d='M5 1L2 4l3 3'/></svg>");
  background-repeat: no-repeat;
  background-position: center;
}
.eng-table-container::-webkit-scrollbar-button:single-button:horizontal:increment {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='8' height='8' fill='%23666'><path d='M3 1l3 3-3 3'/></svg>");
  background-repeat: no-repeat;
  background-position: center;
}
.eng-theme--dark .eng-table-container::-webkit-scrollbar-thumb {
  background-color: var(--color-border-accent);
}
.eng-theme--dark .eng-table-container::-webkit-scrollbar-thumb:hover {
  background-color: var(--color-primary);
}

/**
 * Base Table Element
 * Core table structure with collapse borders
 */
.eng-table {
  width: 100%;
  min-width: 1200px;
  border-collapse: collapse;
  background-color: var(--color-card-background);
}
.eng-theme--dark .eng-table {
  background-color: transparent;
}

/**
 * Table Header
 * Standard header row styling with semantic tokens
 */
.eng-table-header,
.eng-table thead {
  background-color: var(--color-background-gray);
  border-bottom: 2px solid var(--color-border);
}
.eng-theme--dark .eng-table-header,
.eng-theme--dark .eng-table thead {
  background: var(--gradient-card);
  border-bottom: 2px solid var(--color-border-accent);
}

.eng-table-header-cell,
.eng-table th {
  padding: var(--spacing-md) var(--spacing-lg);
  text-align: left;
  font-weight: var(--font-weight-medium);
  color: var(--color-text-secondary);
  font-size: var(--font-size-sm);
  white-space: nowrap;
  line-height: 1.3;
  letter-spacing: 0.3px;
  box-sizing: border-box;
}
.eng-theme--dark .eng-table-header-cell,
.eng-theme--dark .eng-table th {
  color: var(--color-text-highlight);
  font-weight: var(--font-weight-semibold);
}

/**
 * Table Body
 */
.eng-table tbody {
  background-color: var(--color-card-background);
}
.eng-theme--dark .eng-table tbody {
  background-color: transparent;
}

/**
 * Table Row
 * Base row styling with smooth transitions
 */
.eng-table-row,
.eng-table tbody tr {
  border-bottom: 1px solid var(--color-border-subtle);
  background-color: transparent;
  transition: background-color 0.2s ease;
}
.eng-table-row:last-child,
.eng-table tbody tr:last-child {
  border-bottom: none;
}
.eng-theme--dark .eng-table-row,
.eng-theme--dark .eng-table tbody tr {
  border-bottom: 1px solid var(--color-border-accent);
}
.eng-theme--dark .eng-table-row:last-child,
.eng-theme--dark .eng-table tbody tr:last-child {
  border-bottom: none;
}

/**
 * Table Cell
 * Standard data cell styling
 */
.eng-table-cell,
.eng-table td {
  padding: var(--spacing-sm) var(--spacing-lg);
  color: var(--color-text-primary);
  font-size: var(--font-size-sm);
  vertical-align: middle;
  line-height: 1.3;
  box-sizing: border-box;
}
.eng-table-cell:first-child,
.eng-table td:first-child {
  padding-left: var(--spacing-xl);
}
.eng-table-cell:last-child,
.eng-table td:last-child {
  padding-right: var(--spacing-xl);
}
.eng-theme--dark .eng-table-cell,
.eng-theme--dark .eng-table td {
  color: var(--color-text-primary);
}

/**
 * Hover State
 * Applied automatically on row hover when --hover modifier is present
 */
.eng-table--hover .eng-table-row:hover,
.eng-table--hover tbody tr:hover {
  background-color: var(--color-background-gray);
}
.eng-theme--dark .eng-table--hover .eng-table-row:hover,
.eng-theme--dark .eng-table--hover tbody tr:hover {
  background: var(--gradient-card);
}

/**
 * Selected State
 * For rows that are actively selected (checkboxes)
 */
.eng-table-row--selected,
.eng-table tbody tr.selected {
  background-color: var(--color-primary-background-alpha10);
  border-left: 3px solid var(--color-primary);
}
.eng-theme--dark .eng-table-row--selected,
.eng-theme--dark .eng-table tbody tr.selected {
  background-color: rgba(12, 171, 245, 0.1);
  border-left-color: var(--color-primary);
}

/**
 * Expanded State
 * For expandable rows that are currently open
 */
.eng-table-row--expanded,
.eng-table tbody tr.expanded {
  background-color: var(--color-background-gray);
  border-left: 3px solid var(--color-primary);
}
body:not(.eng-theme--dark) .eng-table-row--expanded,
body:not(.eng-theme--dark) .eng-table tbody tr.expanded {
  background-color: var(--color-primary-light);
}
.eng-theme--dark .eng-table-row--expanded,
.eng-theme--dark .eng-table tbody tr.expanded {
  background: var(--gradient-card);
  border-left-color: var(--color-primary);
}

/**
 * Highlighted State
 * For rows with pending changes or special attention
 */
.eng-table-row--highlighted,
.eng-table tbody tr.highlighted {
  background-color: var(--color-warning-background-alpha10);
  border-left: 3px solid var(--color-warning);
  transition: background-color 0.2s ease;
}
.eng-theme--dark .eng-table-row--highlighted,
.eng-theme--dark .eng-table tbody tr.highlighted {
  background-color: var(--color-warning-background-alpha10);
  border-left-color: var(--color-warning);
}

/**
 * Disabled/Blocked State
 * For rows that are inactive or blocked
 */
.eng-table-row--disabled,
.eng-table tbody tr.disabled {
  opacity: 0.6;
  pointer-events: none;
}

.eng-table-row--blocked,
.eng-table tbody tr.blocked {
  border-left: 2px solid var(--color-error);
  padding-left: calc(var(--spacing-lg) - 2px);
}

/**
 * Striped Variant
 * Alternating row colors for better readability
 */
.eng-table--striped tbody tr:nth-child(even) {
  background-color: rgba(0, 0, 0, 0.02);
}
.eng-theme--dark .eng-table--striped tbody tr:nth-child(even) {
  background-color: rgba(255, 255, 255, 0.02);
}
.eng-table--striped tbody tr:nth-child(even):hover {
  background-color: var(--color-background-gray);
}
.eng-theme--dark .eng-table--striped tbody tr:nth-child(even):hover {
  background: var(--gradient-card);
}

/**
 * Dense Variant
 * Compact padding for data-heavy tables
 */
.eng-table--dense th,
.eng-table--dense td {
  padding: var(--spacing-xs) var(--spacing-md);
  font-size: var(--font-size-sm);
}

/**
 * Bordered Variant
 * Adds visible borders around table and cells
 */
.eng-table--bordered {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.eng-table--bordered th,
.eng-table--bordered td {
  border-right: 1px solid var(--color-border-subtle);
}
.eng-table--bordered th:last-child,
.eng-table--bordered td:last-child {
  border-right: none;
}
.eng-theme--dark .eng-table--bordered {
  border-color: var(--color-border-accent);
}
.eng-theme--dark .eng-table--bordered th,
.eng-theme--dark .eng-table--bordered td {
  border-right-color: var(--color-border-accent);
}

/**
 * Card Wrapper Variant
 * Wraps table in a card with shadow and border
 */
.eng-table--card {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  overflow: hidden;
}
.eng-theme--dark .eng-table--card {
  border-color: var(--color-border-accent);
  box-shadow: 0 4px 12px var(--color-card-shadow);
}

/**
 * Checkbox Column/Cell
 * For selection checkboxes
 */
.eng-table-cell--checkbox,
.eng-table th.checkbox-column,
.eng-table td.checkbox-column,
.eng-table td.checkbox-cell {
  width: 48px;
  min-width: 48px;
  max-width: 48px;
  text-align: center;
  padding: var(--spacing-sm) var(--spacing-xs);
  visibility: visible !important;
  display: table-cell !important;
  overflow: visible !important;
}

/**
 * Expand Column/Cell
 * For expand/collapse buttons
 */
.eng-table-cell--expand,
.eng-table th.expand-column,
.eng-table td.expand-column,
.eng-table td.expand-cell {
  width: 48px;
  min-width: 48px;
  text-align: center;
  padding: var(--spacing-sm) var(--spacing-xs);
  cursor: pointer;
}

/**
 * Action Cell
 * For buttons and action controls
 */
.eng-table-cell--action,
.eng-table td.action-cell {
  text-align: center;
  white-space: nowrap;
}
.eng-table-cell--action .action-buttons,
.eng-table td.action-cell .action-buttons {
  display: flex;
  gap: var(--spacing-sm);
  align-items: center;
  justify-content: center;
}

/**
 * IP Address Cell
 * Monospace font for IP addresses
 */
.eng-table-cell--ip,
.eng-table td.ip-cell {
  font-family: "Courier New", monospace;
  font-weight: var(--font-weight-semibold);
  color: var(--color-primary);
}
.eng-theme--dark .eng-table-cell--ip,
.eng-theme--dark .eng-table td.ip-cell {
  color: var(--color-info);
  text-shadow: 0 0 1px rgba(0, 188, 212, 0.3);
}

/**
 * Monospace Cell
 * For code, IDs, or technical data
 */
.eng-table-cell--monospace {
  font-family: "Courier New", monospace;
  font-weight: 600;
}

/**
 * Numeric Cell
 * Right-aligned for numbers
 */
.eng-table-cell--numeric {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

/**
 * Status Cell
 * For status badges and indicators
 */
.eng-table-cell--status {
  white-space: nowrap;
}

/**
 * Details Row
 * Expanded content row below main row
 */
.eng-table-row--details,
.eng-table tbody tr.details-row {
  background-color: var(--color-background-gray);
}
.eng-theme--dark .eng-table-row--details,
.eng-theme--dark .eng-table tbody tr.details-row {
  background: var(--gradient-card);
  border-top: 1px solid var(--color-border-accent);
}

/**
 * Details Cell
 * Full-width cell for expanded content
 */
.eng-table-cell--details,
.eng-table td.details-cell {
  padding: 0;
  border-top: none;
}

/**
 * Details Content
 * Inner container for expanded content with proper padding
 */
.eng-table-details-content,
.details-content {
  padding: var(--spacing-xl);
  display: flex;
  gap: var(--spacing-xl);
  flex-wrap: wrap;
}

/**
 * Sortable Header
 * Interactive column headers with sort indicators
 */
.eng-table-header--sortable,
.sortable-header {
  cursor: pointer;
  -webkit-user-select: none;
          user-select: none;
  position: relative;
  transition: background-color 0.2s ease;
}
.eng-table-header--sortable:hover,
.sortable-header:hover {
  background-color: var(--color-primary-background-alpha10);
}
.eng-table-header--sortable .sort-icon,
.sortable-header .sort-icon {
  font-size: 18px;
  width: 18px;
  height: 18px;
  margin-left: var(--spacing-sm);
  vertical-align: middle;
  color: var(--color-primary);
}
.eng-table-header--sortable.sorted-asc, .eng-table-header--sortable.sorted-desc, .eng-table-header--sortable.eng-table-header--sorted,
.sortable-header.sorted-asc,
.sortable-header.sorted-desc,
.sortable-header.eng-table-header--sorted {
  background-color: rgba(25, 118, 210, 0.15);
  color: var(--color-primary);
  font-weight: var(--font-weight-semibold);
}
.eng-theme--dark .eng-table-header--sortable:hover,
.eng-theme--dark .sortable-header:hover {
  background-color: rgba(0, 188, 212, 0.1);
}
.eng-theme--dark .eng-table-header--sortable.sorted-asc, .eng-theme--dark .eng-table-header--sortable.sorted-desc, .eng-theme--dark .eng-table-header--sortable.eng-table-header--sorted,
.eng-theme--dark .sortable-header.sorted-asc,
.eng-theme--dark .sortable-header.sorted-desc,
.eng-theme--dark .sortable-header.eng-table-header--sorted {
  background-color: rgba(0, 188, 212, 0.15);
  color: var(--color-info);
}
.eng-theme--dark .eng-table-header--sortable .sort-icon,
.eng-theme--dark .sortable-header .sort-icon {
  color: var(--color-info);
}

/**
 * No Data Message
 * Centered empty state for tables with no data
 */
.eng-table-empty,
.no-data-message {
  padding: var(--spacing-xxl);
  text-align: center;
  color: var(--color-text-secondary);
}
.eng-table-empty mat-icon,
.eng-table-empty .empty-icon,
.no-data-message mat-icon,
.no-data-message .empty-icon {
  color: var(--color-text-muted);
  font-size: 48px;
  width: 48px;
  height: 48px;
  margin: 0 auto var(--spacing-lg) auto;
  display: block;
}
.eng-table-empty p,
.eng-table-empty .empty-text,
.no-data-message p,
.no-data-message .empty-text {
  margin: 0;
  font-size: var(--font-size-base);
}

/**
 * Responsive Table
 * Adjustments for smaller screens
 */
@media (max-width: 768px) {
  .eng-table--responsive {
    min-width: auto;
  }
  .eng-table--responsive th,
  .eng-table--responsive td {
    padding: var(--spacing-sm) var(--spacing-md);
    font-size: var(--font-size-sm);
  }
  .eng-table--responsive .eng-table-cell--hide-mobile,
  .eng-table--responsive th.hide-mobile,
  .eng-table--responsive td.hide-mobile {
    display: none;
  }
}
/**
 * Material Design Table Compatibility
 * Overrides for mat-table components using eng-table classes
 */
.eng-table tr.mat-mdc-row:hover,
.eng-table tr.mat-row:hover {
  background-color: var(--color-background-gray);
}
.eng-theme--dark .eng-table tr.mat-mdc-row:hover,
.eng-theme--dark .eng-table tr.mat-row:hover {
  background: var(--gradient-card);
}
.eng-table tr.mat-mdc-row:last-child td,
.eng-table tr.mat-row:last-child td {
  border-bottom: none;
}
.eng-table td.mat-mdc-cell,
.eng-table td.mat-cell {
  border-bottom: 1px solid var(--color-border-subtle);
}
.eng-table td.mat-mdc-cell:hover,
.eng-table td.mat-cell:hover {
  background-color: rgba(12, 171, 245, 0.05);
}
.eng-theme--dark .eng-table td.mat-mdc-cell,
.eng-theme--dark .eng-table td.mat-cell {
  border-bottom: 1px solid var(--color-border-accent);
}
.eng-theme--dark .eng-table td.mat-mdc-cell:hover,
.eng-theme--dark .eng-table td.mat-cell:hover {
  background-color: rgba(12, 171, 245, 0.05);
}
.eng-table th.mat-mdc-header-cell,
.eng-table th.mat-header-cell {
  background-color: var(--color-background-gray);
  border-bottom: 2px solid var(--color-border);
}
.eng-theme--dark .eng-table th.mat-mdc-header-cell,
.eng-theme--dark .eng-table th.mat-header-cell {
  background: var(--gradient-card);
  border-bottom: 2px solid var(--color-border-accent);
}

/**
 * Table Utilities
 * Helper classes for common table patterns
 */
.eng-table-wrapper {
  position: relative;
  overflow: hidden;
}

.eng-table-scroll-indicator {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  width: 40px;
  background: linear-gradient(to left, var(--color-card-background), transparent);
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.2s ease;
}
.eng-table-scroll-indicator.visible {
  opacity: 1;
}

.eng-table-loading {
  position: relative;
  opacity: 0.6;
  pointer-events: none;
}
.eng-table-loading::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(255, 255, 255, 0.8);
  display: flex;
  align-items: center;
  justify-content: center;
}
.eng-theme--dark .eng-table-loading::after {
  background-color: rgba(0, 0, 0, 0.6);
}

/**
 * Pagination Styles
 *
 * Shared pagination component styles used across the application.
 * Provides a consistent layout for custom pagination implementations.
 *
 * Structure:
 * - .pagination-container: Main container with border and background
 * - .custom-paginator: Flex layout with 3 sections (items per page, page info, navigation)
 * - .items-per-page: Items per page dropdown selector
 * - .page-info: Current page range display
 * - .navigation-buttons: Previous/Next navigation controls
 */
.pagination-container {
  padding: var(--spacing-lg) var(--spacing-xl);
  background: var(--color-pagination-background);
  border-top: 1px solid var(--color-pagination-border);
}
.pagination-container.with-margin {
  margin-top: var(--spacing-lg);
}

.custom-paginator {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

.items-per-page {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
}
.items-per-page .items-label {
  font-size: var(--font-size-base);
  color: var(--color-text-secondary);
  line-height: 1;
}
.items-per-page .page-size-select {
  width: 80px;
  height: 32px;
  padding: 0 var(--spacing-sm);
  background-color: var(--color-dropdown-background);
  border: 2px solid var(--color-dropdown-border);
  border-radius: var(--radius-base);
  font-size: var(--font-size-base);
  color: var(--color-text-primary);
  cursor: pointer;
  outline: none;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%23666'><path d='M6 9L1 4h10z'/></svg>");
  background-repeat: no-repeat;
  background-position: right 8px center;
  background-size: var(--spacing-md);
  padding-right: var(--spacing-xl);
  font-weight: var(--font-weight-medium);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}
.items-per-page .page-size-select:focus {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 2px var(--color-primary-background-alpha20);
}
.items-per-page .page-size-select:hover {
  border-color: var(--color-primary);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
}
.items-per-page .page-size-select option {
  background-color: var(--color-dropdown-background);
  color: var(--color-text-primary);
  padding: var(--spacing-sm);
  font-weight: var(--font-weight-medium);
}
.items-per-page .page-size-select--single-border {
  border-width: 1px;
}

.page-info {
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center;
}
.page-info .page-range {
  font-size: var(--font-size-base);
  color: var(--color-text-secondary);
}

.navigation-buttons {
  flex: 0 0 auto;
  display: flex;
  gap: var(--spacing-xs);
}
.navigation-buttons .nav-button {
  background-color: var(--color-button-background);
  border: 1px solid var(--color-button-border);
  border-radius: var(--radius-base);
  padding: var(--spacing-sm) var(--spacing-md);
  min-width: 80px;
  height: 32px;
  font-size: var(--font-size-base);
  color: var(--color-button-text);
  transition: all 0.2s ease;
  cursor: pointer;
}
.navigation-buttons .nav-button:hover:not(:disabled) {
  background-color: var(--color-button-hover);
  border-color: var(--color-primary);
  color: var(--color-primary);
}
.navigation-buttons .nav-button:disabled {
  background-color: var(--color-background-gray);
  border-color: var(--color-border-subtle);
  color: var(--color-text-muted);
  cursor: not-allowed;
}

.eng-search-container {
  display: flex;
  align-items: center;
  background-color: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-base);
  padding: 0 var(--spacing-md);
  height: var(--control-height);
  transition: all 0.2s ease;
  position: relative;
}
.eng-search-container:focus-within {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 2px var(--color-primary-background-alpha20);
}
.eng-search-container.search-active {
  border-color: var(--color-primary);
  background-color: rgba(25, 118, 210, 0.05);
}
:host-context(.eng-theme--dark) .eng-search-container {
  background: var(--gradient-card);
  border: 1px solid var(--color-border-accent);
  box-shadow: 0 2px 8px var(--color-card-shadow);
}
:host-context(.eng-theme--dark) .eng-search-container:focus-within {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 2px rgba(12, 171, 245, 0.3);
  background: var(--gradient-card);
}
:host-context(.eng-theme--dark) .eng-search-container.search-active {
  border-color: var(--color-primary);
  background: var(--gradient-card);
  box-shadow: 0 0 0 2px rgba(12, 171, 245, 0.2);
}

.eng-search-icon {
  color: var(--color-text-muted);
  margin-right: var(--spacing-sm);
  font-size: 20px;
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}

.eng-search-input {
  flex: 1;
  border: none;
  background: transparent;
  outline: none;
  color: var(--color-text-primary);
  font-size: var(--font-size-base);
  height: 100%;
  min-width: 0;
}
.eng-search-input::placeholder {
  color: var(--color-text-muted);
}
:host-context(.eng-theme--dark) .eng-search-input {
  color: var(--color-text-highlight);
}
:host-context(.eng-theme--dark) .eng-search-input::placeholder {
  color: var(--color-text-muted);
}

.eng-search-clear {
  background: none;
  border: none;
  color: var(--color-text-muted);
  cursor: pointer;
  padding: var(--spacing-xs);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease;
  margin-left: var(--spacing-sm);
  flex-shrink: 0;
}
.eng-search-clear:hover {
  background-color: var(--color-background-gray);
  color: var(--color-text-primary);
}
.eng-search-clear mat-icon {
  font-size: 18px;
  width: 18px;
  height: 18px;
}
:host-context(.eng-theme--dark) .eng-search-clear {
  color: var(--color-text-muted);
}
:host-context(.eng-theme--dark) .eng-search-clear:hover {
  background-color: rgba(12, 171, 245, 0.2);
  color: var(--color-primary);
}

.eng-search-results-indicator {
  position: absolute;
  top: 100%;
  left: 0;
  margin-top: var(--spacing-xs);
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
  font-weight: var(--font-weight-medium);
}

.eng-filter-bar {
  background: var(--color-card-background);
  border-bottom: 1px solid var(--color-border);
  padding: var(--spacing-md) var(--spacing-xl);
  display: flex;
  gap: var(--spacing-md);
  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;
  scrollbar-width: thin;
  scrollbar-color: var(--color-border) transparent;
}
.eng-filter-bar::-webkit-scrollbar {
  height: 6px;
}
.eng-filter-bar::-webkit-scrollbar-track {
  background: transparent;
}
.eng-filter-bar::-webkit-scrollbar-thumb {
  background-color: var(--color-border);
  border-radius: 3px;
}
.eng-filter-bar::-webkit-scrollbar-thumb:hover {
  background-color: var(--color-text-secondary);
}
:host-context(.eng-theme--dark) .eng-filter-bar {
  background: var(--gradient-card);
  border-bottom: 2px solid var(--color-border-accent);
  box-shadow: 0 2px 8px var(--color-card-shadow);
}

.eng-filter-tab {
  background: transparent;
  border: none;
  padding: var(--spacing-sm) 0;
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-secondary);
  cursor: pointer;
  position: relative;
  transition: color 0.3s ease;
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
  white-space: nowrap;
  flex-shrink: 0;
}
.eng-filter-tab .filter-name {
  white-space: nowrap;
}
.eng-filter-tab .filter-count-bubble {
  font-size: var(--spacing-md);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-secondary);
  background-color: var(--color-border);
  border-radius: 10px;
  padding: 2px 8px;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 20px;
  height: 20px;
}
.eng-filter-tab .filter-count-bubble .custom-spinner {
  width: var(--spacing-md);
  height: var(--spacing-md);
  border: 2px solid transparent;
  border-top: 2px solid var(--color-text-secondary);
  border-radius: 50%;
  animation: spin 1s linear infinite;
}
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.eng-filter-tab::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: var(--color-primary);
  transform: scaleX(0);
  transition: transform 0.3s ease;
}
.eng-filter-tab:hover {
  color: var(--color-text-primary);
}
.eng-filter-tab.active {
  color: var(--color-filter-selected);
  background-color: var(--color-white);
  padding: var(--spacing-sm) var(--spacing-md);
  border-radius: var(--radius-base);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.eng-filter-tab.active .filter-count-bubble {
  background-color: var(--color-filter-selected);
  color: var(--color-filter-selected-text);
}
.eng-filter-tab.active .filter-count-bubble .custom-spinner {
  border-top: 2px solid var(--color-filter-selected-text);
}
.eng-filter-tab.active::after {
  transform: scaleX(1);
}
:host-context(.eng-theme--dark) .eng-filter-tab {
  color: var(--color-text-secondary);
}
:host-context(.eng-theme--dark) .eng-filter-tab:hover {
  color: var(--color-text-highlight);
  transform: translateY(-1px);
}
:host-context(.eng-theme--dark) .eng-filter-tab.active {
  background: var(--gradient-primary);
  color: var(--color-white);
  box-shadow: 0 4px 12px rgba(12, 171, 245, 0.3);
  border: 1px solid rgba(12, 171, 245, 0.5);
}
:host-context(.eng-theme--dark) .eng-filter-tab.active .filter-count-bubble {
  background-color: rgba(255, 255, 255, 0.2);
  color: var(--color-white);
  border: 1px solid rgba(255, 255, 255, 0.3);
}

.eng-search-wrapper {
  flex: 1;
  max-width: 400px;
  position: relative;
}

.eng-search-bar {
  display: flex;
  align-items: center;
  background-color: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-base);
  padding: 0 var(--spacing-md);
  height: var(--control-height);
  transition: all 0.2s ease;
}
.eng-search-bar:focus-within {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 2px var(--color-primary-background-alpha20);
}
.eng-search-bar.search-active {
  border-color: var(--color-primary);
  background-color: rgba(25, 118, 210, 0.05);
}
.eng-search-bar mat-icon {
  color: var(--color-text-muted);
  margin-right: var(--spacing-sm);
  font-size: 20px;
}
.eng-search-bar .search-input {
  flex: 1;
  border: none;
  background: transparent;
  outline: none;
  color: var(--color-text-primary);
  font-size: var(--font-size-base);
}
.eng-search-bar .search-input::placeholder {
  color: var(--color-text-muted);
}
.eng-search-bar .clear-search-btn {
  background: none;
  border: none;
  color: var(--color-text-muted);
  cursor: pointer;
  padding: var(--spacing-xs);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease;
  margin-left: var(--spacing-sm);
}
.eng-search-bar .clear-search-btn:hover {
  background-color: var(--color-background-gray);
  color: var(--color-text-primary);
}
.eng-search-bar .clear-search-btn mat-icon {
  font-size: 18px;
  width: 18px;
  height: 18px;
}
:host-context(.eng-theme--dark) .eng-search-bar {
  background: var(--gradient-card);
  border: 1px solid var(--color-border-accent);
  box-shadow: 0 2px 8px var(--color-card-shadow);
}
:host-context(.eng-theme--dark) .eng-search-bar:focus-within {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 2px rgba(12, 171, 245, 0.3);
  background: var(--gradient-card);
}
:host-context(.eng-theme--dark) .eng-search-bar.search-active {
  border-color: var(--color-primary);
  background: var(--gradient-card);
  box-shadow: 0 0 0 2px rgba(12, 171, 245, 0.2);
}
:host-context(.eng-theme--dark) .eng-search-bar .search-input {
  color: var(--color-text-highlight);
}
:host-context(.eng-theme--dark) .eng-search-bar .search-input::placeholder {
  color: var(--color-text-muted);
}
:host-context(.eng-theme--dark) .eng-search-bar .clear-search-btn {
  color: var(--color-text-muted);
}
:host-context(.eng-theme--dark) .eng-search-bar .clear-search-btn:hover {
  background-color: rgba(12, 171, 245, 0.2);
  color: var(--color-primary);
}

/**
 * Menu Component Styles
 *
 * Reusable context menus, dropdown menus, and action menus
 * Consolidates duplicated menu patterns across components
 *
 * Classes:
 * - .eng-menu - Base menu container (context menus, dropdowns)
 * - .eng-menu-backdrop - Overlay backdrop for closing menu on outside click
 * - .eng-menu-header - Optional header section with title/context
 * - .eng-menu-item - Individual menu item/option
 * - .eng-menu-divider - Visual separator between menu sections
 * - .eng-menu-icon - Icon within menu item
 * - .eng-menu-label - Text label within menu item
 *
 * Modifiers:
 * - .eng-menu--compact - Reduced padding/spacing
 * - .eng-menu--wide - Wider minimum width
 * - .eng-menu-item--destructive - Red styling for delete actions
 * - .eng-menu-item--disabled - Disabled state
 *
 * Usage:
 * <div class="eng-menu-backdrop" (click)="closeMenu()"></div>
 * <div class="eng-menu">
 *   <div class="eng-menu-header">
 *     <div class="eng-menu-title">192.168.1.1</div>
 *   </div>
 *   <button class="eng-menu-item">
 *     <mat-icon class="eng-menu-icon">search</mat-icon>
 *     <span class="eng-menu-label">View Details</span>
 *   </button>
 *   <div class="eng-menu-divider"></div>
 *   <button class="eng-menu-item eng-menu-item--destructive">
 *     <mat-icon class="eng-menu-icon">delete</mat-icon>
 *     <span class="eng-menu-label">Delete</span>
 *   </button>
 * </div>
 */
.eng-menu-backdrop,
.context-menu-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 999;
  background: transparent;
}
:host-context(.eng-theme--dark) .eng-menu-backdrop,
:host-context(.eng-theme--dark) .context-menu-backdrop {
  background: rgba(0, 0, 0, 0.5);
}

.context-menu-backdrop {
  background: rgba(0, 0, 0, 0.3);
  backdrop-filter: blur(2px);
}
:host-context(.eng-theme--dark) .context-menu-backdrop {
  background: rgba(0, 0, 0, 0.5);
}

.eng-menu,
.ip-context-menu,
.classification-context-menu {
  position: fixed;
  z-index: 1000;
  background: var(--color-white);
  border-radius: var(--radius-sm);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
  min-width: 240px;
  overflow: hidden;
  border: 1px solid rgba(0, 0, 0, 0.1);
  animation: menuFadeIn 0.15s ease-out;
}
:host-context(.eng-theme--dark) .eng-menu,
:host-context(.eng-theme--dark) .ip-context-menu,
:host-context(.eng-theme--dark) .classification-context-menu {
  background: var(--color-bg-secondary);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.6);
}

.eng-menu--compact {
  min-width: 180px;
  padding: var(--spacing-xs) 0;
}

.eng-menu--wide {
  min-width: 320px;
}

.eng-menu-header,
.context-menu-header {
  padding: var(--spacing-md) var(--spacing-lg);
  border-bottom: 1px solid var(--color-border);
  background: var(--color-bg-secondary);
}
:host-context(.eng-theme--dark) .eng-menu-header,
:host-context(.eng-theme--dark) .context-menu-header {
  background: var(--color-bg-secondary);
  border-bottom: 1px solid var(--color-border-dark);
}

.eng-menu-title,
.context-menu-ip,
.context-menu-classification {
  font-family: "Courier New", monospace;
  font-weight: 600;
  color: var(--color-text-primary);
  font-size: 14px;
}
:host-context(.eng-theme--dark) .eng-menu-title,
:host-context(.eng-theme--dark) .context-menu-ip,
:host-context(.eng-theme--dark) .context-menu-classification {
  color: var(--color-border);
}

.eng-menu-item,
.context-menu-item {
  display: flex;
  align-items: center;
  gap: var(--spacing-md);
  width: 100%;
  padding: var(--spacing-md) var(--spacing-lg);
  border: none;
  background: transparent;
  color: var(--color-text-primary);
  cursor: pointer;
  transition: all 0.15s ease;
  font-size: 14px;
  text-align: left;
}
.eng-menu-item mat-icon,
.eng-menu-item .eng-menu-icon,
.context-menu-item mat-icon,
.context-menu-item .eng-menu-icon {
  font-size: 20px;
  width: 20px;
  height: 20px;
  color: var(--color-text-secondary);
  flex-shrink: 0;
}
.eng-menu-item .eng-menu-label,
.context-menu-item .eng-menu-label {
  flex: 1;
}
.eng-menu-item:hover,
.context-menu-item:hover {
  background: var(--color-bg-secondary);
}
.eng-menu-item:hover mat-icon,
.eng-menu-item:hover .eng-menu-icon,
.context-menu-item:hover mat-icon,
.context-menu-item:hover .eng-menu-icon {
  color: var(--color-primary);
}
.eng-menu-item:active,
.context-menu-item:active {
  transform: scale(0.98);
}
:host-context(.eng-theme--dark) .eng-menu-item,
:host-context(.eng-theme--dark) .context-menu-item {
  color: var(--color-border);
}
:host-context(.eng-theme--dark) .eng-menu-item mat-icon,
:host-context(.eng-theme--dark) .eng-menu-item .eng-menu-icon,
:host-context(.eng-theme--dark) .context-menu-item mat-icon,
:host-context(.eng-theme--dark) .context-menu-item .eng-menu-icon {
  color: var(--color-text-muted);
}
:host-context(.eng-theme--dark) .eng-menu-item:hover,
:host-context(.eng-theme--dark) .context-menu-item:hover {
  background: var(--color-bg-primary);
}

.eng-menu-item--destructive {
  color: var(--color-error);
}
.eng-menu-item--destructive mat-icon,
.eng-menu-item--destructive .eng-menu-icon {
  color: var(--color-error);
}
.eng-menu-item--destructive:hover {
  background: rgba(211, 47, 47, 0.1);
  color: var(--color-error);
}
.eng-menu-item--destructive:hover mat-icon,
.eng-menu-item--destructive:hover .eng-menu-icon {
  color: var(--color-error);
}
:host-context(.eng-theme--dark) .eng-menu-item--destructive {
  color: #ef5350;
}
:host-context(.eng-theme--dark) .eng-menu-item--destructive mat-icon,
:host-context(.eng-theme--dark) .eng-menu-item--destructive .eng-menu-icon {
  color: #ef5350;
}
:host-context(.eng-theme--dark) .eng-menu-item--destructive:hover {
  background: rgba(211, 47, 47, 0.2);
}

.eng-menu-item--disabled {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

.eng-menu-divider {
  height: 1px;
  background: var(--color-border);
  margin: var(--spacing-xs) 0;
}
:host-context(.eng-theme--dark) .eng-menu-divider {
  background: var(--color-border-dark);
}

.ip-address-with-menu,
.classification-with-menu {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-xs);
  cursor: pointer;
  color: var(--color-primary);
  padding: var(--spacing-xs) 8px;
  border-radius: var(--spacing-xs);
  transition: all 0.2s ease;
  font-family: "Courier New", monospace;
}
.ip-address-with-menu:hover,
.classification-with-menu:hover {
  background-color: rgba(25, 118, 210, 0.08);
}
.ip-address-with-menu:active,
.classification-with-menu:active {
  transform: scale(0.98);
}
:host-context(.eng-theme--dark) .ip-address-with-menu,
:host-context(.eng-theme--dark) .classification-with-menu {
  color: var(--color-primary);
}
:host-context(.eng-theme--dark) .ip-address-with-menu:hover,
:host-context(.eng-theme--dark) .classification-with-menu:hover {
  background-color: rgba(12, 171, 245, 0.1);
}

.classification-with-menu {
  font-family: inherit;
  font-weight: 500;
}

.user-input-dropdown-menu {
  position: fixed;
  background-color: var(--color-dropdown-background);
  border: 1px solid var(--color-dropdown-border);
  border-radius: var(--radius-base);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.15);
  z-index: 9999;
  max-height: 200px;
  overflow-y: auto;
  padding: var(--spacing-xs) 0;
  min-width: 160px;
  max-width: 200px;
}
.user-input-dropdown-menu .user-input-option {
  padding: var(--spacing-sm) var(--spacing-md);
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
  color: var(--color-text-primary);
  transition: all 0.2s ease;
  font-size: var(--spacing-md);
  line-height: 1.4;
  min-height: 32px;
}
.user-input-dropdown-menu .user-input-option:hover {
  background-color: var(--color-background-gray);
}
.user-input-dropdown-menu .user-input-option.selected {
  background-color: var(--color-primary);
  color: var(--color-primary-contrast);
}
.user-input-dropdown-menu .user-input-option.selected .checkmark-icon {
  color: var(--color-primary-contrast);
}
.user-input-dropdown-menu .user-input-option .checkmark-icon {
  font-size: 14px;
  color: var(--color-text-primary);
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}
.user-input-dropdown-menu .user-input-option span {
  flex: 1;
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

@keyframes menuFadeIn {
  from {
    opacity: 0;
    transform: translateY(-8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes menuSlideIn {
  from {
    opacity: 0;
    transform: translateX(-8px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}
:root {
  --mat-menu-container-color: var(--color-surface);
  --mat-menu-container-shape: var(--layout-radius-sm);
  --mat-menu-item-label-text-color: var(--color-text-primary);
  --mat-menu-item-icon-color: var(--color-text-secondary);
  --mat-menu-item-hover-state-layer-color: color-mix(
    in srgb,
    var(--color-text-primary) 8%,
    transparent
  );
  --mat-menu-item-focus-state-layer-color: color-mix(
    in srgb,
    var(--color-text-primary) 8%,
    transparent
  );
  --mat-menu-divider-color: var(--color-border);
  --mdc-list-list-item-label-text-color: var(--color-text-primary);
  --mdc-list-list-item-hover-label-text-color: var(--color-text-primary);
  --mdc-list-list-item-focus-label-text-color: var(--color-text-primary);
  --mdc-list-list-item-disabled-label-text-color: var(--color-text-muted);
  --mdc-list-list-item-leading-icon-color: var(--color-text-secondary);
  --mdc-list-list-item-hover-leading-icon-color: var(--color-text-secondary);
  --mat-select-panel-background-color: var(--color-surface);
  --mat-select-enabled-trigger-text-color: var(--color-text-primary);
  --mat-select-placeholder-text-color: var(--color-text-muted);
  --mat-select-disabled-trigger-text-color: var(--color-text-muted);
  --mat-select-enabled-arrow-color: var(--color-text-secondary);
  --mat-select-focused-arrow-color: var(--color-accent);
  --mat-option-label-text-color: var(--color-text-primary);
  --mat-option-selected-state-label-text-color: var(--color-accent-text);
  --mat-option-hover-state-layer-color: color-mix(
    in srgb,
    var(--color-text-primary) 8%,
    transparent
  );
  --mat-option-focus-state-layer-color: color-mix(
    in srgb,
    var(--color-text-primary) 8%,
    transparent
  );
  --mat-option-selected-state-layer-color: color-mix(in srgb, var(--color-accent) 14%, transparent);
  --mat-autocomplete-background-color: var(--color-surface);
  --mat-autocomplete-container-shape: var(--layout-radius-sm);
  --mat-dialog-container-color: var(--color-surface);
  --mat-dialog-container-shape: var(--layout-radius-sm);
  --mat-dialog-headline-color: var(--color-text-primary);
  --mat-dialog-supporting-text-color: var(--color-text-secondary);
  --mat-snack-bar-button-color: var(--color-accent);
  --mdc-snackbar-container-color: var(--color-surface);
  --mdc-snackbar-supporting-text-color: var(--color-text-primary);
  --mdc-plain-tooltip-container-color: var(--color-surface2);
  --mdc-plain-tooltip-supporting-text-color: var(--color-text-primary);
  --mat-datepicker-calendar-container-background-color: var(--color-surface);
  --mat-datepicker-calendar-container-text-color: var(--color-text-primary);
  --mat-datepicker-calendar-date-text-color: var(--color-text-primary);
  --mat-datepicker-calendar-date-selected-state-text-color: var(--color-button-primary-text);
  --mat-datepicker-calendar-date-selected-state-background-color: var(--color-accent);
  --mat-datepicker-calendar-date-today-outline-color: var(--color-accent);
  --mat-datepicker-calendar-date-hover-state-background-color: var(--color-hover-bg);
  --mat-datepicker-calendar-header-text-color: var(--color-text-primary);
  --mat-datepicker-calendar-period-button-text-color: var(--color-text-primary);
  --mdc-outlined-text-field-outline-color: var(--color-border);
  --mdc-outlined-text-field-hover-outline-color: var(--color-border-strong);
  --mdc-outlined-text-field-focus-outline-color: var(--color-accent);
  --mdc-outlined-text-field-input-text-color: var(--color-text-primary);
  --mdc-outlined-text-field-label-text-color: var(--color-text-secondary);
  --mdc-outlined-text-field-focus-label-text-color: var(--color-accent);
  --mdc-outlined-text-field-input-text-placeholder-color: var(--color-text-muted);
  --mdc-outlined-text-field-disabled-outline-color: var(--color-border);
  --mdc-outlined-text-field-disabled-input-text-color: var(--color-text-muted);
  --mdc-filled-text-field-container-color: var(--color-surface2);
  --mdc-filled-text-field-input-text-color: var(--color-text-primary);
  --mdc-filled-text-field-label-text-color: var(--color-text-secondary);
  --mdc-filled-button-container-color: var(--color-accent);
  --mdc-filled-button-label-text-color: var(--color-button-primary-text);
  --mdc-outlined-button-outline-color: var(--color-border);
  --mdc-outlined-button-label-text-color: var(--color-text-primary);
  --mdc-text-button-label-text-color: var(--color-text-primary);
  --mat-icon-button-state-layer-color: var(--color-text-secondary);
  --mat-icon-button-ripple-color: color-mix(in srgb, var(--color-accent) 20%, transparent);
}

.driver-popover {
  background-color: var(--color-card-bg) !important;
  color: var(--color-text-primary) !important;
  border: 1px solid var(--color-border) !important;
  box-shadow: var(--layout-modal-shadow) !important;
}
.driver-popover .driver-popover-title {
  color: var(--color-text-primary) !important;
  font-weight: var(--typography-font-weight-bold) !important;
}
.driver-popover .driver-popover-description {
  color: var(--color-text-secondary) !important;
}
.driver-popover .driver-popover-progress-text {
  color: var(--color-text-muted) !important;
}
.driver-popover .driver-popover-close-btn {
  color: var(--color-text-primary) !important;
  background-color: transparent !important;
  border: none !important;
  font-size: 20px !important;
  font-weight: bold !important;
  opacity: 0.8 !important;
  transition: opacity 0.2s ease !important;
}
.driver-popover .driver-popover-close-btn:hover {
  opacity: 1 !important;
  background-color: var(--color-bg-secondary) !important;
}
.driver-popover .driver-popover-footer button {
  background-color: var(--color-primary) !important;
  color: white !important;
  border: none !important;
  padding: var(--spacing-sm) var(--spacing-lg) !important;
  border-radius: var(--radius-base) !important;
  font-weight: var(--typography-font-weight-medium) !important;
  cursor: pointer !important;
  transition: background-color 0.2s ease !important;
  text-shadow: none !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
}
.driver-popover .driver-popover-footer button:hover {
  background-color: var(--color-primary-hover) !important;
}
.driver-popover .driver-popover-footer button.driver-popover-prev-btn {
  background-color: transparent !important;
  color: var(--color-text-secondary) !important;
  border: 1px solid var(--color-border) !important;
}
.driver-popover .driver-popover-footer button.driver-popover-prev-btn:hover {
  background-color: var(--color-bg-secondary) !important;
  color: var(--color-text-primary) !important;
}

.driver-highlighted-element {
  border-color: var(--color-primary) !important;
}

.driver-overlay {
  z-index: 10000 !important;
}

.driver-popover {
  z-index: 10003 !important;
}

.subnet-management-dialog.cdk-overlay-pane {
  z-index: 10001 !important;
}
.subnet-management-dialog .mat-mdc-dialog-container {
  z-index: 10001 !important;
  position: relative;
}

.subnet-management-modal .driver-active-element {
  z-index: 10002 !important;
  position: relative !important;
}
.subnet-management-modal .controls-row:has(.driver-active-element),
.subnet-management-modal .filters-row:has(.driver-active-element),
.subnet-management-modal .modal-content:has(.driver-active-element) {
  overflow: visible !important;
}

html {
  --mat-ripple-color: rgba(0, 0, 0, 0.1);
}

html {
  --mat-option-selected-state-label-text-color: #0cabf5;
  --mat-option-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-option-hover-state-layer-color: rgba(0, 0, 0, 0.04);
  --mat-option-focus-state-layer-color: rgba(0, 0, 0, 0.04);
  --mat-option-selected-state-layer-color: rgba(0, 0, 0, 0.04);
}

.mat-accent {
  --mat-option-selected-state-label-text-color: #0cabf5;
  --mat-option-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-option-hover-state-layer-color: rgba(0, 0, 0, 0.04);
  --mat-option-focus-state-layer-color: rgba(0, 0, 0, 0.04);
  --mat-option-selected-state-layer-color: rgba(0, 0, 0, 0.04);
}

.mat-warn {
  --mat-option-selected-state-label-text-color: #f44336;
  --mat-option-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-option-hover-state-layer-color: rgba(0, 0, 0, 0.04);
  --mat-option-focus-state-layer-color: rgba(0, 0, 0, 0.04);
  --mat-option-selected-state-layer-color: rgba(0, 0, 0, 0.04);
}

html {
  --mat-optgroup-label-text-color: rgba(0, 0, 0, 0.87);
}

html {
  --mat-full-pseudo-checkbox-selected-icon-color: #0cabf5;
  --mat-full-pseudo-checkbox-selected-checkmark-color: #fafafa;
  --mat-full-pseudo-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mat-full-pseudo-checkbox-disabled-selected-checkmark-color: #fafafa;
  --mat-full-pseudo-checkbox-disabled-unselected-icon-color: #b0b0b0;
  --mat-full-pseudo-checkbox-disabled-selected-icon-color: #b0b0b0;
}
html {
  --mat-minimal-pseudo-checkbox-selected-checkmark-color: #0cabf5;
  --mat-minimal-pseudo-checkbox-disabled-selected-checkmark-color: #b0b0b0;
}

.mat-primary {
  --mat-full-pseudo-checkbox-selected-icon-color: #0cabf5;
  --mat-full-pseudo-checkbox-selected-checkmark-color: #fafafa;
  --mat-full-pseudo-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mat-full-pseudo-checkbox-disabled-selected-checkmark-color: #fafafa;
  --mat-full-pseudo-checkbox-disabled-unselected-icon-color: #b0b0b0;
  --mat-full-pseudo-checkbox-disabled-selected-icon-color: #b0b0b0;
}
.mat-primary {
  --mat-minimal-pseudo-checkbox-selected-checkmark-color: #0cabf5;
  --mat-minimal-pseudo-checkbox-disabled-selected-checkmark-color: #b0b0b0;
}

.mat-accent {
  --mat-full-pseudo-checkbox-selected-icon-color: #0cabf5;
  --mat-full-pseudo-checkbox-selected-checkmark-color: #fafafa;
  --mat-full-pseudo-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mat-full-pseudo-checkbox-disabled-selected-checkmark-color: #fafafa;
  --mat-full-pseudo-checkbox-disabled-unselected-icon-color: #b0b0b0;
  --mat-full-pseudo-checkbox-disabled-selected-icon-color: #b0b0b0;
}
.mat-accent {
  --mat-minimal-pseudo-checkbox-selected-checkmark-color: #0cabf5;
  --mat-minimal-pseudo-checkbox-disabled-selected-checkmark-color: #b0b0b0;
}

.mat-warn {
  --mat-full-pseudo-checkbox-selected-icon-color: #f44336;
  --mat-full-pseudo-checkbox-selected-checkmark-color: #fafafa;
  --mat-full-pseudo-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mat-full-pseudo-checkbox-disabled-selected-checkmark-color: #fafafa;
  --mat-full-pseudo-checkbox-disabled-unselected-icon-color: #b0b0b0;
  --mat-full-pseudo-checkbox-disabled-selected-icon-color: #b0b0b0;
}
.mat-warn {
  --mat-minimal-pseudo-checkbox-selected-checkmark-color: #f44336;
  --mat-minimal-pseudo-checkbox-disabled-selected-checkmark-color: #b0b0b0;
}

html {
  --mat-app-background-color: #fafafa;
  --mat-app-text-color: rgba(0, 0, 0, 0.87);
  --mat-app-elevation-shadow-level-0: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-1: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-2: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-3: 0px 3px 3px -2px rgba(0, 0, 0, 0.2), 0px 3px 4px 0px rgba(0, 0, 0, 0.14), 0px 1px 8px 0px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-4: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-5: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 5px 8px 0px rgba(0, 0, 0, 0.14), 0px 1px 14px 0px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-6: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-7: 0px 4px 5px -2px rgba(0, 0, 0, 0.2), 0px 7px 10px 1px rgba(0, 0, 0, 0.14), 0px 2px 16px 1px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-8: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-9: 0px 5px 6px -3px rgba(0, 0, 0, 0.2), 0px 9px 12px 1px rgba(0, 0, 0, 0.14), 0px 3px 16px 2px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-10: 0px 6px 6px -3px rgba(0, 0, 0, 0.2), 0px 10px 14px 1px rgba(0, 0, 0, 0.14), 0px 4px 18px 3px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-11: 0px 6px 7px -4px rgba(0, 0, 0, 0.2), 0px 11px 15px 1px rgba(0, 0, 0, 0.14), 0px 4px 20px 3px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-12: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-13: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 13px 19px 2px rgba(0, 0, 0, 0.14), 0px 5px 24px 4px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-14: 0px 7px 9px -4px rgba(0, 0, 0, 0.2), 0px 14px 21px 2px rgba(0, 0, 0, 0.14), 0px 5px 26px 4px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-15: 0px 8px 9px -5px rgba(0, 0, 0, 0.2), 0px 15px 22px 2px rgba(0, 0, 0, 0.14), 0px 6px 28px 5px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-16: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-17: 0px 8px 11px -5px rgba(0, 0, 0, 0.2), 0px 17px 26px 2px rgba(0, 0, 0, 0.14), 0px 6px 32px 5px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-18: 0px 9px 11px -5px rgba(0, 0, 0, 0.2), 0px 18px 28px 2px rgba(0, 0, 0, 0.14), 0px 7px 34px 6px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-19: 0px 9px 12px -6px rgba(0, 0, 0, 0.2), 0px 19px 29px 2px rgba(0, 0, 0, 0.14), 0px 7px 36px 6px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-20: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 20px 31px 3px rgba(0, 0, 0, 0.14), 0px 8px 38px 7px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-21: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 21px 33px 3px rgba(0, 0, 0, 0.14), 0px 8px 40px 7px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-22: 0px 10px 14px -6px rgba(0, 0, 0, 0.2), 0px 22px 35px 3px rgba(0, 0, 0, 0.14), 0px 8px 42px 7px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-23: 0px 11px 14px -7px rgba(0, 0, 0, 0.2), 0px 23px 36px 3px rgba(0, 0, 0, 0.14), 0px 9px 44px 8px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-24: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
}

html {
  --mat-option-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-option-label-text-line-height: 24px;
  --mat-option-label-text-size: 16px;
  --mat-option-label-text-tracking: 0.03125em;
  --mat-option-label-text-weight: 400;
}

html {
  --mat-optgroup-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-optgroup-label-text-line-height: 24px;
  --mat-optgroup-label-text-size: 16px;
  --mat-optgroup-label-text-tracking: 0.03125em;
  --mat-optgroup-label-text-weight: 400;
}

html {
  --mdc-elevated-card-container-shape: 4px;
}
html {
  --mdc-outlined-card-container-shape: 4px;
  --mdc-outlined-card-outline-width: 1px;
}
html {
  --mdc-elevated-card-container-color: white;
  --mdc-elevated-card-container-elevation: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);
}
html {
  --mdc-outlined-card-container-color: white;
  --mdc-outlined-card-outline-color: rgba(0, 0, 0, 0.12);
  --mdc-outlined-card-container-elevation: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);
}
html {
  --mat-card-subtitle-text-color: rgba(0, 0, 0, 0.54);
}

html {
  --mat-card-title-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-card-title-text-line-height: 32px;
  --mat-card-title-text-size: 20px;
  --mat-card-title-text-tracking: 0.0125em;
  --mat-card-title-text-weight: 500;
  --mat-card-subtitle-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-card-subtitle-text-line-height: 22px;
  --mat-card-subtitle-text-size: 14px;
  --mat-card-subtitle-text-tracking: 0.0071428571em;
  --mat-card-subtitle-text-weight: 500;
}

html {
  --mdc-linear-progress-active-indicator-height: 4px;
  --mdc-linear-progress-track-height: 4px;
  --mdc-linear-progress-track-shape: 0;
}

.mat-mdc-progress-bar {
  --mdc-linear-progress-active-indicator-color: #0cabf5;
  --mdc-linear-progress-track-color: rgba(12, 171, 245, 0.25);
}
.mat-mdc-progress-bar.mat-accent {
  --mdc-linear-progress-active-indicator-color: #0cabf5;
  --mdc-linear-progress-track-color: rgba(12, 171, 245, 0.25);
}
.mat-mdc-progress-bar.mat-warn {
  --mdc-linear-progress-active-indicator-color: #f44336;
  --mdc-linear-progress-track-color: rgba(244, 67, 54, 0.25);
}

html {
  --mdc-plain-tooltip-container-shape: 4px;
  --mdc-plain-tooltip-supporting-text-line-height: 16px;
}

html {
  --mdc-plain-tooltip-container-color: #616161;
  --mdc-plain-tooltip-supporting-text-color: #fff;
}

html {
  --mdc-plain-tooltip-supporting-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-plain-tooltip-supporting-text-size: 12px;
  --mdc-plain-tooltip-supporting-text-weight: 400;
  --mdc-plain-tooltip-supporting-text-tracking: 0.0333333333em;
}

html {
  --mdc-filled-text-field-active-indicator-height: 1px;
  --mdc-filled-text-field-focus-active-indicator-height: 2px;
  --mdc-filled-text-field-container-shape: 4px;
}
html {
  --mdc-outlined-text-field-outline-width: 1px;
  --mdc-outlined-text-field-focus-outline-width: 2px;
  --mdc-outlined-text-field-container-shape: 4px;
}
html {
  --mdc-filled-text-field-caret-color: #0cabf5;
  --mdc-filled-text-field-focus-active-indicator-color: #0cabf5;
  --mdc-filled-text-field-focus-label-text-color: rgba(12, 171, 245, 0.87);
  --mdc-filled-text-field-container-color: rgb(244.8, 244.8, 244.8);
  --mdc-filled-text-field-disabled-container-color: rgb(249.9, 249.9, 249.9);
  --mdc-filled-text-field-label-text-color: rgba(0, 0, 0, 0.6);
  --mdc-filled-text-field-hover-label-text-color: rgba(0, 0, 0, 0.6);
  --mdc-filled-text-field-disabled-label-text-color: rgba(0, 0, 0, 0.38);
  --mdc-filled-text-field-input-text-color: rgba(0, 0, 0, 0.87);
  --mdc-filled-text-field-disabled-input-text-color: rgba(0, 0, 0, 0.38);
  --mdc-filled-text-field-input-text-placeholder-color: rgba(0, 0, 0, 0.6);
  --mdc-filled-text-field-error-hover-label-text-color: #f44336;
  --mdc-filled-text-field-error-focus-label-text-color: #f44336;
  --mdc-filled-text-field-error-label-text-color: #f44336;
  --mdc-filled-text-field-error-caret-color: #f44336;
  --mdc-filled-text-field-active-indicator-color: rgba(0, 0, 0, 0.42);
  --mdc-filled-text-field-disabled-active-indicator-color: rgba(0, 0, 0, 0.06);
  --mdc-filled-text-field-hover-active-indicator-color: rgba(0, 0, 0, 0.87);
  --mdc-filled-text-field-error-active-indicator-color: #f44336;
  --mdc-filled-text-field-error-focus-active-indicator-color: #f44336;
  --mdc-filled-text-field-error-hover-active-indicator-color: #f44336;
}
html {
  --mdc-outlined-text-field-caret-color: #0cabf5;
  --mdc-outlined-text-field-focus-outline-color: #0cabf5;
  --mdc-outlined-text-field-focus-label-text-color: rgba(12, 171, 245, 0.87);
  --mdc-outlined-text-field-label-text-color: rgba(0, 0, 0, 0.6);
  --mdc-outlined-text-field-hover-label-text-color: rgba(0, 0, 0, 0.6);
  --mdc-outlined-text-field-disabled-label-text-color: rgba(0, 0, 0, 0.38);
  --mdc-outlined-text-field-input-text-color: rgba(0, 0, 0, 0.87);
  --mdc-outlined-text-field-disabled-input-text-color: rgba(0, 0, 0, 0.38);
  --mdc-outlined-text-field-input-text-placeholder-color: rgba(0, 0, 0, 0.6);
  --mdc-outlined-text-field-error-caret-color: #f44336;
  --mdc-outlined-text-field-error-focus-label-text-color: #f44336;
  --mdc-outlined-text-field-error-label-text-color: #f44336;
  --mdc-outlined-text-field-error-hover-label-text-color: #f44336;
  --mdc-outlined-text-field-outline-color: rgba(0, 0, 0, 0.38);
  --mdc-outlined-text-field-disabled-outline-color: rgba(0, 0, 0, 0.06);
  --mdc-outlined-text-field-hover-outline-color: rgba(0, 0, 0, 0.87);
  --mdc-outlined-text-field-error-focus-outline-color: #f44336;
  --mdc-outlined-text-field-error-hover-outline-color: #f44336;
  --mdc-outlined-text-field-error-outline-color: #f44336;
}
html {
  --mat-form-field-focus-select-arrow-color: rgba(12, 171, 245, 0.87);
  --mat-form-field-disabled-input-text-placeholder-color: rgba(0, 0, 0, 0.38);
  --mat-form-field-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-form-field-error-text-color: #f44336;
  --mat-form-field-select-option-text-color: inherit;
  --mat-form-field-select-disabled-option-text-color: GrayText;
  --mat-form-field-leading-icon-color: unset;
  --mat-form-field-disabled-leading-icon-color: unset;
  --mat-form-field-trailing-icon-color: unset;
  --mat-form-field-disabled-trailing-icon-color: unset;
  --mat-form-field-error-focus-trailing-icon-color: unset;
  --mat-form-field-error-hover-trailing-icon-color: unset;
  --mat-form-field-error-trailing-icon-color: unset;
  --mat-form-field-enabled-select-arrow-color: rgba(0, 0, 0, 0.54);
  --mat-form-field-disabled-select-arrow-color: rgba(0, 0, 0, 0.38);
  --mat-form-field-hover-state-layer-opacity: 0.04;
  --mat-form-field-focus-state-layer-opacity: 0.08;
}

.mat-mdc-form-field.mat-accent {
  --mdc-filled-text-field-caret-color: #0cabf5;
  --mdc-filled-text-field-focus-active-indicator-color: #0cabf5;
  --mdc-filled-text-field-focus-label-text-color: rgba(12, 171, 245, 0.87);
}
.mat-mdc-form-field.mat-accent {
  --mdc-outlined-text-field-caret-color: #0cabf5;
  --mdc-outlined-text-field-focus-outline-color: #0cabf5;
  --mdc-outlined-text-field-focus-label-text-color: rgba(12, 171, 245, 0.87);
}
.mat-mdc-form-field.mat-accent {
  --mat-form-field-focus-select-arrow-color: rgba(12, 171, 245, 0.87);
}

.mat-mdc-form-field.mat-warn {
  --mdc-filled-text-field-caret-color: #f44336;
  --mdc-filled-text-field-focus-active-indicator-color: #f44336;
  --mdc-filled-text-field-focus-label-text-color: rgba(244, 67, 54, 0.87);
}
.mat-mdc-form-field.mat-warn {
  --mdc-outlined-text-field-caret-color: #f44336;
  --mdc-outlined-text-field-focus-outline-color: #f44336;
  --mdc-outlined-text-field-focus-label-text-color: rgba(244, 67, 54, 0.87);
}
.mat-mdc-form-field.mat-warn {
  --mat-form-field-focus-select-arrow-color: rgba(244, 67, 54, 0.87);
}

html {
  --mat-form-field-container-height: 56px;
  --mat-form-field-filled-label-display: block;
  --mat-form-field-container-vertical-padding: 16px;
  --mat-form-field-filled-with-label-container-padding-top: 24px;
  --mat-form-field-filled-with-label-container-padding-bottom: 8px;
}

html {
  --mdc-filled-text-field-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-filled-text-field-label-text-size: 16px;
  --mdc-filled-text-field-label-text-tracking: 0.03125em;
  --mdc-filled-text-field-label-text-weight: 400;
}
html {
  --mdc-outlined-text-field-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-outlined-text-field-label-text-size: 16px;
  --mdc-outlined-text-field-label-text-tracking: 0.03125em;
  --mdc-outlined-text-field-label-text-weight: 400;
}
html {
  --mat-form-field-container-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-form-field-container-text-line-height: 24px;
  --mat-form-field-container-text-size: 16px;
  --mat-form-field-container-text-tracking: 0.03125em;
  --mat-form-field-container-text-weight: 400;
  --mat-form-field-outlined-label-text-populated-size: 16px;
  --mat-form-field-subscript-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-form-field-subscript-text-line-height: 20px;
  --mat-form-field-subscript-text-size: 12px;
  --mat-form-field-subscript-text-tracking: 0.0333333333em;
  --mat-form-field-subscript-text-weight: 400;
}

html {
  --mat-select-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
}

html {
  --mat-select-panel-background-color: white;
  --mat-select-enabled-trigger-text-color: rgba(0, 0, 0, 0.87);
  --mat-select-disabled-trigger-text-color: rgba(0, 0, 0, 0.38);
  --mat-select-placeholder-text-color: rgba(0, 0, 0, 0.6);
  --mat-select-enabled-arrow-color: rgba(0, 0, 0, 0.54);
  --mat-select-disabled-arrow-color: rgba(0, 0, 0, 0.38);
  --mat-select-focused-arrow-color: rgba(12, 171, 245, 0.87);
  --mat-select-invalid-arrow-color: rgba(244, 67, 54, 0.87);
}
html .mat-mdc-form-field.mat-accent {
  --mat-select-panel-background-color: white;
  --mat-select-enabled-trigger-text-color: rgba(0, 0, 0, 0.87);
  --mat-select-disabled-trigger-text-color: rgba(0, 0, 0, 0.38);
  --mat-select-placeholder-text-color: rgba(0, 0, 0, 0.6);
  --mat-select-enabled-arrow-color: rgba(0, 0, 0, 0.54);
  --mat-select-disabled-arrow-color: rgba(0, 0, 0, 0.38);
  --mat-select-focused-arrow-color: rgba(12, 171, 245, 0.87);
  --mat-select-invalid-arrow-color: rgba(244, 67, 54, 0.87);
}
html .mat-mdc-form-field.mat-warn {
  --mat-select-panel-background-color: white;
  --mat-select-enabled-trigger-text-color: rgba(0, 0, 0, 0.87);
  --mat-select-disabled-trigger-text-color: rgba(0, 0, 0, 0.38);
  --mat-select-placeholder-text-color: rgba(0, 0, 0, 0.6);
  --mat-select-enabled-arrow-color: rgba(0, 0, 0, 0.54);
  --mat-select-disabled-arrow-color: rgba(0, 0, 0, 0.38);
  --mat-select-focused-arrow-color: rgba(244, 67, 54, 0.87);
  --mat-select-invalid-arrow-color: rgba(244, 67, 54, 0.87);
}

html {
  --mat-select-arrow-transform: translateY(-8px);
}

html {
  --mat-select-trigger-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-select-trigger-text-line-height: 24px;
  --mat-select-trigger-text-size: 16px;
  --mat-select-trigger-text-tracking: 0.03125em;
  --mat-select-trigger-text-weight: 400;
}

html {
  --mat-autocomplete-container-shape: 4px;
  --mat-autocomplete-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
}

html {
  --mat-autocomplete-background-color: white;
}

html {
  --mdc-dialog-container-shape: 4px;
}
html {
  --mat-dialog-container-elevation-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
  --mat-dialog-container-max-width: 80vw;
  --mat-dialog-container-small-max-width: 80vw;
  --mat-dialog-container-min-width: 0;
  --mat-dialog-actions-alignment: start;
  --mat-dialog-actions-padding: 8px;
  --mat-dialog-content-padding: 20px 24px;
  --mat-dialog-with-actions-content-padding: 20px 24px;
  --mat-dialog-headline-padding: 0 24px 9px;
}

html {
  --mdc-dialog-container-color: white;
  --mdc-dialog-subhead-color: rgba(0, 0, 0, 0.87);
  --mdc-dialog-supporting-text-color: rgba(0, 0, 0, 0.6);
}
html {
  --mdc-dialog-subhead-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-dialog-subhead-line-height: 32px;
  --mdc-dialog-subhead-size: 20px;
  --mdc-dialog-subhead-weight: 500;
  --mdc-dialog-subhead-tracking: 0.0125em;
  --mdc-dialog-supporting-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-dialog-supporting-text-line-height: 24px;
  --mdc-dialog-supporting-text-size: 16px;
  --mdc-dialog-supporting-text-weight: 400;
  --mdc-dialog-supporting-text-tracking: 0.03125em;
}
.mat-mdc-standard-chip {
  --mdc-chip-container-shape-radius: 16px;
  --mdc-chip-with-avatar-avatar-shape-radius: 14px;
  --mdc-chip-with-avatar-avatar-size: 28px;
  --mdc-chip-with-icon-icon-size: 18px;
  --mdc-chip-outline-width: 0;
  --mdc-chip-outline-color: transparent;
  --mdc-chip-disabled-outline-color: transparent;
  --mdc-chip-focus-outline-color: transparent;
  --mdc-chip-hover-state-layer-opacity: 0.04;
  --mdc-chip-with-avatar-disabled-avatar-opacity: 1;
  --mdc-chip-flat-selected-outline-width: 0;
  --mdc-chip-selected-hover-state-layer-opacity: 0.04;
  --mdc-chip-with-trailing-icon-disabled-trailing-icon-opacity: 1;
  --mdc-chip-with-icon-disabled-icon-opacity: 1;
}
.mat-mdc-standard-chip {
  --mat-chip-disabled-container-opacity: 0.4;
  --mat-chip-trailing-action-opacity: 0.54;
  --mat-chip-trailing-action-focus-opacity: 1;
  --mat-chip-trailing-action-state-layer-color: transparent;
  --mat-chip-selected-trailing-action-state-layer-color: transparent;
  --mat-chip-trailing-action-hover-state-layer-opacity: 0;
  --mat-chip-trailing-action-focus-state-layer-opacity: 0;
}

.mat-mdc-standard-chip {
  --mdc-chip-disabled-label-text-color: #212121;
  --mdc-chip-elevated-container-color: rgb(224.4, 224.4, 224.4);
  --mdc-chip-elevated-selected-container-color: rgb(224.4, 224.4, 224.4);
  --mdc-chip-elevated-disabled-container-color: rgb(224.4, 224.4, 224.4);
  --mdc-chip-flat-disabled-selected-container-color: rgb(224.4, 224.4, 224.4);
  --mdc-chip-focus-state-layer-color: black;
  --mdc-chip-hover-state-layer-color: black;
  --mdc-chip-selected-hover-state-layer-color: black;
  --mdc-chip-focus-state-layer-opacity: 0.12;
  --mdc-chip-selected-focus-state-layer-color: black;
  --mdc-chip-selected-focus-state-layer-opacity: 0.12;
  --mdc-chip-label-text-color: #212121;
  --mdc-chip-selected-label-text-color: #212121;
  --mdc-chip-with-icon-icon-color: #212121;
  --mdc-chip-with-icon-disabled-icon-color: #212121;
  --mdc-chip-with-icon-selected-icon-color: #212121;
  --mdc-chip-with-trailing-icon-disabled-trailing-icon-color: #212121;
  --mdc-chip-with-trailing-icon-trailing-icon-color: #212121;
}
.mat-mdc-standard-chip {
  --mat-chip-selected-disabled-trailing-icon-color: #212121;
  --mat-chip-selected-trailing-icon-color: #212121;
}
.mat-mdc-standard-chip.mat-mdc-chip-selected.mat-primary, .mat-mdc-standard-chip.mat-mdc-chip-highlighted.mat-primary {
  --mdc-chip-disabled-label-text-color: rgba(0, 0, 0, 0.87);
  --mdc-chip-elevated-container-color: #0cabf5;
  --mdc-chip-elevated-selected-container-color: #0cabf5;
  --mdc-chip-elevated-disabled-container-color: #0cabf5;
  --mdc-chip-flat-disabled-selected-container-color: #0cabf5;
  --mdc-chip-focus-state-layer-color: black;
  --mdc-chip-hover-state-layer-color: black;
  --mdc-chip-selected-hover-state-layer-color: black;
  --mdc-chip-focus-state-layer-opacity: 0.12;
  --mdc-chip-selected-focus-state-layer-color: black;
  --mdc-chip-selected-focus-state-layer-opacity: 0.12;
  --mdc-chip-label-text-color: rgba(0, 0, 0, 0.87);
  --mdc-chip-selected-label-text-color: rgba(0, 0, 0, 0.87);
  --mdc-chip-with-icon-icon-color: rgba(0, 0, 0, 0.87);
  --mdc-chip-with-icon-disabled-icon-color: rgba(0, 0, 0, 0.87);
  --mdc-chip-with-icon-selected-icon-color: rgba(0, 0, 0, 0.87);
  --mdc-chip-with-trailing-icon-disabled-trailing-icon-color: rgba(0, 0, 0, 0.87);
  --mdc-chip-with-trailing-icon-trailing-icon-color: rgba(0, 0, 0, 0.87);
}
.mat-mdc-standard-chip.mat-mdc-chip-selected.mat-primary, .mat-mdc-standard-chip.mat-mdc-chip-highlighted.mat-primary {
  --mat-chip-selected-disabled-trailing-icon-color: rgba(0, 0, 0, 0.87);
  --mat-chip-selected-trailing-icon-color: rgba(0, 0, 0, 0.87);
}
.mat-mdc-standard-chip.mat-mdc-chip-selected.mat-accent, .mat-mdc-standard-chip.mat-mdc-chip-highlighted.mat-accent {
  --mdc-chip-disabled-label-text-color: white;
  --mdc-chip-elevated-container-color: #0cabf5;
  --mdc-chip-elevated-selected-container-color: #0cabf5;
  --mdc-chip-elevated-disabled-container-color: #0cabf5;
  --mdc-chip-flat-disabled-selected-container-color: #0cabf5;
  --mdc-chip-focus-state-layer-color: black;
  --mdc-chip-hover-state-layer-color: black;
  --mdc-chip-selected-hover-state-layer-color: black;
  --mdc-chip-focus-state-layer-opacity: 0.12;
  --mdc-chip-selected-focus-state-layer-color: black;
  --mdc-chip-selected-focus-state-layer-opacity: 0.12;
  --mdc-chip-label-text-color: white;
  --mdc-chip-selected-label-text-color: white;
  --mdc-chip-with-icon-icon-color: white;
  --mdc-chip-with-icon-disabled-icon-color: white;
  --mdc-chip-with-icon-selected-icon-color: white;
  --mdc-chip-with-trailing-icon-disabled-trailing-icon-color: white;
  --mdc-chip-with-trailing-icon-trailing-icon-color: white;
}
.mat-mdc-standard-chip.mat-mdc-chip-selected.mat-accent, .mat-mdc-standard-chip.mat-mdc-chip-highlighted.mat-accent {
  --mat-chip-selected-disabled-trailing-icon-color: white;
  --mat-chip-selected-trailing-icon-color: white;
}
.mat-mdc-standard-chip.mat-mdc-chip-selected.mat-warn, .mat-mdc-standard-chip.mat-mdc-chip-highlighted.mat-warn {
  --mdc-chip-disabled-label-text-color: white;
  --mdc-chip-elevated-container-color: #f44336;
  --mdc-chip-elevated-selected-container-color: #f44336;
  --mdc-chip-elevated-disabled-container-color: #f44336;
  --mdc-chip-flat-disabled-selected-container-color: #f44336;
  --mdc-chip-focus-state-layer-color: black;
  --mdc-chip-hover-state-layer-color: black;
  --mdc-chip-selected-hover-state-layer-color: black;
  --mdc-chip-focus-state-layer-opacity: 0.12;
  --mdc-chip-selected-focus-state-layer-color: black;
  --mdc-chip-selected-focus-state-layer-opacity: 0.12;
  --mdc-chip-label-text-color: white;
  --mdc-chip-selected-label-text-color: white;
  --mdc-chip-with-icon-icon-color: white;
  --mdc-chip-with-icon-disabled-icon-color: white;
  --mdc-chip-with-icon-selected-icon-color: white;
  --mdc-chip-with-trailing-icon-disabled-trailing-icon-color: white;
  --mdc-chip-with-trailing-icon-trailing-icon-color: white;
}
.mat-mdc-standard-chip.mat-mdc-chip-selected.mat-warn, .mat-mdc-standard-chip.mat-mdc-chip-highlighted.mat-warn {
  --mat-chip-selected-disabled-trailing-icon-color: white;
  --mat-chip-selected-trailing-icon-color: white;
}

.mat-mdc-chip.mat-mdc-standard-chip {
  --mdc-chip-container-height: 32px;
}
.mat-mdc-standard-chip {
  --mdc-chip-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-chip-label-text-line-height: 20px;
  --mdc-chip-label-text-size: 14px;
  --mdc-chip-label-text-tracking: 0.0178571429em;
  --mdc-chip-label-text-weight: 400;
}
html {
  --mdc-switch-disabled-selected-icon-opacity: 0.38;
  --mdc-switch-disabled-track-opacity: 0.12;
  --mdc-switch-disabled-unselected-icon-opacity: 0.38;
  --mdc-switch-handle-height: 20px;
  --mdc-switch-handle-shape: 10px;
  --mdc-switch-handle-width: 20px;
  --mdc-switch-selected-icon-size: 18px;
  --mdc-switch-track-height: 14px;
  --mdc-switch-track-shape: 7px;
  --mdc-switch-track-width: 36px;
  --mdc-switch-unselected-icon-size: 18px;
  --mdc-switch-selected-focus-state-layer-opacity: 0.12;
  --mdc-switch-selected-hover-state-layer-opacity: 0.04;
  --mdc-switch-selected-pressed-state-layer-opacity: 0.1;
  --mdc-switch-unselected-focus-state-layer-opacity: 0.12;
  --mdc-switch-unselected-hover-state-layer-opacity: 0.04;
  --mdc-switch-unselected-pressed-state-layer-opacity: 0.1;
}
html .mat-mdc-slide-toggle {
  --mat-switch-disabled-selected-handle-opacity: 0.38;
  --mat-switch-disabled-unselected-handle-opacity: 0.38;
  --mat-switch-unselected-handle-size: 20px;
  --mat-switch-selected-handle-size: 20px;
  --mat-switch-pressed-handle-size: 20px;
  --mat-switch-with-icon-handle-size: 20px;
  --mat-switch-selected-handle-horizontal-margin: 0;
  --mat-switch-selected-with-icon-handle-horizontal-margin: 0;
  --mat-switch-selected-pressed-handle-horizontal-margin: 0;
  --mat-switch-unselected-handle-horizontal-margin: 0;
  --mat-switch-unselected-with-icon-handle-horizontal-margin: 0;
  --mat-switch-unselected-pressed-handle-horizontal-margin: 0;
  --mat-switch-visible-track-opacity: 1;
  --mat-switch-hidden-track-opacity: 1;
  --mat-switch-visible-track-transition: transform 75ms 0ms cubic-bezier(0, 0, 0.2, 1);
  --mat-switch-hidden-track-transition: transform 75ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
  --mat-switch-track-outline-width: 1px;
  --mat-switch-track-outline-color: transparent;
  --mat-switch-selected-track-outline-width: 1px;
  --mat-switch-selected-track-outline-color: transparent;
  --mat-switch-disabled-unselected-track-outline-width: 1px;
  --mat-switch-disabled-unselected-track-outline-color: transparent;
}

html {
  --mdc-switch-selected-focus-state-layer-color: #a8c84d;
  --mdc-switch-selected-handle-color: #a8c84d;
  --mdc-switch-selected-hover-state-layer-color: #a8c84d;
  --mdc-switch-selected-pressed-state-layer-color: #a8c84d;
  --mdc-switch-selected-focus-handle-color: #729233;
  --mdc-switch-selected-hover-handle-color: #729233;
  --mdc-switch-selected-pressed-handle-color: #729233;
  --mdc-switch-selected-focus-track-color: #81c784;
  --mdc-switch-selected-hover-track-color: #81c784;
  --mdc-switch-selected-pressed-track-color: #81c784;
  --mdc-switch-selected-track-color: #81c784;
  --mdc-switch-disabled-selected-handle-color: #424242;
  --mdc-switch-disabled-selected-icon-color: #fff;
  --mdc-switch-disabled-selected-track-color: #424242;
  --mdc-switch-disabled-unselected-handle-color: #424242;
  --mdc-switch-disabled-unselected-icon-color: #fff;
  --mdc-switch-disabled-unselected-track-color: #424242;
  --mdc-switch-handle-surface-color: #fff;
  --mdc-switch-selected-icon-color: #fff;
  --mdc-switch-unselected-focus-handle-color: #212121;
  --mdc-switch-unselected-focus-state-layer-color: #424242;
  --mdc-switch-unselected-focus-track-color: #e0e0e0;
  --mdc-switch-unselected-handle-color: #616161;
  --mdc-switch-unselected-hover-handle-color: #212121;
  --mdc-switch-unselected-hover-state-layer-color: #424242;
  --mdc-switch-unselected-hover-track-color: #e0e0e0;
  --mdc-switch-unselected-icon-color: #fff;
  --mdc-switch-unselected-pressed-handle-color: #212121;
  --mdc-switch-unselected-pressed-state-layer-color: #424242;
  --mdc-switch-unselected-pressed-track-color: #e0e0e0;
  --mdc-switch-unselected-track-color: #e0e0e0;
  --mdc-switch-handle-elevation-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);
  --mdc-switch-disabled-handle-elevation-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);
}
html {
  --mdc-switch-disabled-label-text-color: rgba(0, 0, 0, 0.38);
}
html .mat-mdc-slide-toggle {
  --mat-switch-label-text-color: rgba(0, 0, 0, 0.87);
}
html .mat-mdc-slide-toggle.mat-accent {
  --mdc-switch-selected-focus-state-layer-color: #546e7a;
  --mdc-switch-selected-handle-color: #546e7a;
  --mdc-switch-selected-hover-state-layer-color: #546e7a;
  --mdc-switch-selected-pressed-state-layer-color: #546e7a;
  --mdc-switch-selected-focus-handle-color: #263238;
  --mdc-switch-selected-hover-handle-color: #263238;
  --mdc-switch-selected-pressed-handle-color: #263238;
  --mdc-switch-selected-focus-track-color: #90a4ae;
  --mdc-switch-selected-hover-track-color: #90a4ae;
  --mdc-switch-selected-pressed-track-color: #90a4ae;
  --mdc-switch-selected-track-color: #90a4ae;
}
html .mat-mdc-slide-toggle.mat-warn {
  --mdc-switch-selected-focus-state-layer-color: #e53935;
  --mdc-switch-selected-handle-color: #e53935;
  --mdc-switch-selected-hover-state-layer-color: #e53935;
  --mdc-switch-selected-pressed-state-layer-color: #e53935;
  --mdc-switch-selected-focus-handle-color: #b71c1c;
  --mdc-switch-selected-hover-handle-color: #b71c1c;
  --mdc-switch-selected-pressed-handle-color: #b71c1c;
  --mdc-switch-selected-focus-track-color: #e57373;
  --mdc-switch-selected-hover-track-color: #e57373;
  --mdc-switch-selected-pressed-track-color: #e57373;
  --mdc-switch-selected-track-color: #e57373;
}

html {
  --mdc-switch-state-layer-size: 40px;
}
html .mat-mdc-slide-toggle {
  --mat-switch-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-switch-label-text-line-height: 20px;
  --mat-switch-label-text-size: 14px;
  --mat-switch-label-text-tracking: 0.0178571429em;
  --mat-switch-label-text-weight: 400;
}

html {
  --mdc-radio-disabled-selected-icon-opacity: 0.38;
  --mdc-radio-disabled-unselected-icon-opacity: 0.38;
  --mdc-radio-state-layer-size: 40px;
}
.mat-mdc-radio-button.mat-primary {
  --mdc-radio-disabled-selected-icon-color: black;
  --mdc-radio-disabled-unselected-icon-color: black;
  --mdc-radio-unselected-hover-icon-color: #212121;
  --mdc-radio-unselected-focus-icon-color: #212121;
  --mdc-radio-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-unselected-pressed-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-selected-focus-icon-color: #0cabf5;
  --mdc-radio-selected-hover-icon-color: #0cabf5;
  --mdc-radio-selected-icon-color: #0cabf5;
  --mdc-radio-selected-pressed-icon-color: #0cabf5;
}
.mat-mdc-radio-button.mat-primary {
  --mat-radio-ripple-color: black;
  --mat-radio-checked-ripple-color: #0cabf5;
  --mat-radio-disabled-label-color: rgba(0, 0, 0, 0.38);
  --mat-radio-label-text-color: rgba(0, 0, 0, 0.87);
}
.mat-mdc-radio-button.mat-accent {
  --mdc-radio-disabled-selected-icon-color: black;
  --mdc-radio-disabled-unselected-icon-color: black;
  --mdc-radio-unselected-hover-icon-color: #212121;
  --mdc-radio-unselected-focus-icon-color: #212121;
  --mdc-radio-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-unselected-pressed-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-selected-focus-icon-color: #0cabf5;
  --mdc-radio-selected-hover-icon-color: #0cabf5;
  --mdc-radio-selected-icon-color: #0cabf5;
  --mdc-radio-selected-pressed-icon-color: #0cabf5;
}
.mat-mdc-radio-button.mat-accent {
  --mat-radio-ripple-color: black;
  --mat-radio-checked-ripple-color: #0cabf5;
  --mat-radio-disabled-label-color: rgba(0, 0, 0, 0.38);
  --mat-radio-label-text-color: rgba(0, 0, 0, 0.87);
}
.mat-mdc-radio-button.mat-warn {
  --mdc-radio-disabled-selected-icon-color: black;
  --mdc-radio-disabled-unselected-icon-color: black;
  --mdc-radio-unselected-hover-icon-color: #212121;
  --mdc-radio-unselected-focus-icon-color: #212121;
  --mdc-radio-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-unselected-pressed-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-selected-focus-icon-color: #f44336;
  --mdc-radio-selected-hover-icon-color: #f44336;
  --mdc-radio-selected-icon-color: #f44336;
  --mdc-radio-selected-pressed-icon-color: #f44336;
}
.mat-mdc-radio-button.mat-warn {
  --mat-radio-ripple-color: black;
  --mat-radio-checked-ripple-color: #f44336;
  --mat-radio-disabled-label-color: rgba(0, 0, 0, 0.38);
  --mat-radio-label-text-color: rgba(0, 0, 0, 0.87);
}

html {
  --mdc-radio-state-layer-size: 40px;
}
html {
  --mat-radio-touch-target-display: block;
}

html {
  --mat-radio-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-radio-label-text-line-height: 20px;
  --mat-radio-label-text-size: 14px;
  --mat-radio-label-text-tracking: 0.0178571429em;
  --mat-radio-label-text-weight: 400;
}

html {
  --mdc-slider-active-track-height: 6px;
  --mdc-slider-active-track-shape: 9999px;
  --mdc-slider-handle-height: 20px;
  --mdc-slider-handle-shape: 50%;
  --mdc-slider-handle-width: 20px;
  --mdc-slider-inactive-track-height: 4px;
  --mdc-slider-inactive-track-shape: 9999px;
  --mdc-slider-with-overlap-handle-outline-width: 1px;
  --mdc-slider-with-tick-marks-active-container-opacity: 0.6;
  --mdc-slider-with-tick-marks-container-shape: 50%;
  --mdc-slider-with-tick-marks-container-size: 2px;
  --mdc-slider-with-tick-marks-inactive-container-opacity: 0.6;
  --mdc-slider-handle-elevation: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);
}
html {
  --mat-slider-value-indicator-width: auto;
  --mat-slider-value-indicator-height: 32px;
  --mat-slider-value-indicator-caret-display: block;
  --mat-slider-value-indicator-border-radius: 4px;
  --mat-slider-value-indicator-padding: 0 12px;
  --mat-slider-value-indicator-text-transform: none;
  --mat-slider-value-indicator-container-transform: translateX(-50%);
}

html {
  --mdc-slider-handle-color: #0cabf5;
  --mdc-slider-focus-handle-color: #0cabf5;
  --mdc-slider-hover-handle-color: #0cabf5;
  --mdc-slider-active-track-color: #0cabf5;
  --mdc-slider-inactive-track-color: #0cabf5;
  --mdc-slider-with-tick-marks-inactive-container-color: #0cabf5;
  --mdc-slider-with-tick-marks-active-container-color: rgba(0, 0, 0, 0.87);
  --mdc-slider-disabled-active-track-color: #000;
  --mdc-slider-disabled-handle-color: #000;
  --mdc-slider-disabled-inactive-track-color: #000;
  --mdc-slider-label-container-color: #000;
  --mdc-slider-label-label-text-color: #fff;
  --mdc-slider-with-overlap-handle-outline-color: #fff;
  --mdc-slider-with-tick-marks-disabled-container-color: #000;
}
html {
  --mat-slider-ripple-color: #0cabf5;
  --mat-slider-hover-state-layer-color: rgba(12, 171, 245, 0.05);
  --mat-slider-focus-state-layer-color: rgba(12, 171, 245, 0.2);
  --mat-slider-value-indicator-opacity: 0.6;
}
html .mat-accent {
  --mdc-slider-handle-color: #0cabf5;
  --mdc-slider-focus-handle-color: #0cabf5;
  --mdc-slider-hover-handle-color: #0cabf5;
  --mdc-slider-active-track-color: #0cabf5;
  --mdc-slider-inactive-track-color: #0cabf5;
  --mdc-slider-with-tick-marks-inactive-container-color: #0cabf5;
  --mdc-slider-with-tick-marks-active-container-color: white;
}
html .mat-accent {
  --mat-slider-ripple-color: #0cabf5;
  --mat-slider-hover-state-layer-color: rgba(12, 171, 245, 0.05);
  --mat-slider-focus-state-layer-color: rgba(12, 171, 245, 0.2);
}
html .mat-warn {
  --mdc-slider-handle-color: #f44336;
  --mdc-slider-focus-handle-color: #f44336;
  --mdc-slider-hover-handle-color: #f44336;
  --mdc-slider-active-track-color: #f44336;
  --mdc-slider-inactive-track-color: #f44336;
  --mdc-slider-with-tick-marks-inactive-container-color: #f44336;
  --mdc-slider-with-tick-marks-active-container-color: white;
}
html .mat-warn {
  --mat-slider-ripple-color: #f44336;
  --mat-slider-hover-state-layer-color: rgba(244, 67, 54, 0.05);
  --mat-slider-focus-state-layer-color: rgba(244, 67, 54, 0.2);
}

html {
  --mdc-slider-label-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-slider-label-label-text-size: 14px;
  --mdc-slider-label-label-text-line-height: 22px;
  --mdc-slider-label-label-text-tracking: 0.0071428571em;
  --mdc-slider-label-label-text-weight: 500;
}

html {
  --mat-menu-container-shape: 4px;
  --mat-menu-divider-bottom-spacing: 0;
  --mat-menu-divider-top-spacing: 0;
  --mat-menu-item-spacing: 16px;
  --mat-menu-item-icon-size: 24px;
  --mat-menu-item-leading-spacing: 16px;
  --mat-menu-item-trailing-spacing: 16px;
  --mat-menu-item-with-icon-leading-spacing: 16px;
  --mat-menu-item-with-icon-trailing-spacing: 16px;
  --mat-menu-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
}

html {
  --mat-menu-item-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-menu-item-icon-color: rgba(0, 0, 0, 0.87);
  --mat-menu-item-hover-state-layer-color: rgba(0, 0, 0, 0.04);
  --mat-menu-item-focus-state-layer-color: rgba(0, 0, 0, 0.04);
  --mat-menu-container-color: white;
  --mat-menu-divider-color: rgba(0, 0, 0, 0.12);
}

html {
  --mat-menu-item-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-menu-item-label-text-size: 16px;
  --mat-menu-item-label-text-tracking: 0.03125em;
  --mat-menu-item-label-text-line-height: 24px;
  --mat-menu-item-label-text-weight: 400;
}

html {
  --mdc-list-list-item-container-shape: 0;
  --mdc-list-list-item-leading-avatar-shape: 50%;
  --mdc-list-list-item-container-color: transparent;
  --mdc-list-list-item-selected-container-color: transparent;
  --mdc-list-list-item-leading-avatar-color: transparent;
  --mdc-list-list-item-leading-icon-size: 24px;
  --mdc-list-list-item-leading-avatar-size: 40px;
  --mdc-list-list-item-trailing-icon-size: 24px;
  --mdc-list-list-item-disabled-state-layer-color: transparent;
  --mdc-list-list-item-disabled-state-layer-opacity: 0;
  --mdc-list-list-item-disabled-label-text-opacity: 0.38;
  --mdc-list-list-item-disabled-leading-icon-opacity: 0.38;
  --mdc-list-list-item-disabled-trailing-icon-opacity: 0.38;
}
html {
  --mat-list-active-indicator-color: transparent;
  --mat-list-active-indicator-shape: 4px;
}

html {
  --mdc-list-list-item-label-text-color: rgba(0, 0, 0, 0.87);
  --mdc-list-list-item-supporting-text-color: rgba(0, 0, 0, 0.54);
  --mdc-list-list-item-leading-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-list-list-item-trailing-supporting-text-color: rgba(0, 0, 0, 0.38);
  --mdc-list-list-item-trailing-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-list-list-item-selected-trailing-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-list-list-item-disabled-label-text-color: black;
  --mdc-list-list-item-disabled-leading-icon-color: black;
  --mdc-list-list-item-disabled-trailing-icon-color: black;
  --mdc-list-list-item-hover-label-text-color: rgba(0, 0, 0, 0.87);
  --mdc-list-list-item-hover-leading-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-list-list-item-hover-trailing-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-list-list-item-focus-label-text-color: rgba(0, 0, 0, 0.87);
  --mdc-list-list-item-hover-state-layer-color: black;
  --mdc-list-list-item-hover-state-layer-opacity: 0.04;
  --mdc-list-list-item-focus-state-layer-color: black;
  --mdc-list-list-item-focus-state-layer-opacity: 0.12;
}
.mdc-list-item__start,
.mdc-list-item__end {
  --mdc-radio-disabled-selected-icon-color: black;
  --mdc-radio-disabled-unselected-icon-color: black;
  --mdc-radio-unselected-hover-icon-color: #212121;
  --mdc-radio-unselected-focus-icon-color: #212121;
  --mdc-radio-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-unselected-pressed-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-selected-focus-icon-color: #0cabf5;
  --mdc-radio-selected-hover-icon-color: #0cabf5;
  --mdc-radio-selected-icon-color: #0cabf5;
  --mdc-radio-selected-pressed-icon-color: #0cabf5;
}

.mat-accent .mdc-list-item__start,
.mat-accent .mdc-list-item__end {
  --mdc-radio-disabled-selected-icon-color: black;
  --mdc-radio-disabled-unselected-icon-color: black;
  --mdc-radio-unselected-hover-icon-color: #212121;
  --mdc-radio-unselected-focus-icon-color: #212121;
  --mdc-radio-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-unselected-pressed-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-selected-focus-icon-color: #0cabf5;
  --mdc-radio-selected-hover-icon-color: #0cabf5;
  --mdc-radio-selected-icon-color: #0cabf5;
  --mdc-radio-selected-pressed-icon-color: #0cabf5;
}

.mat-warn .mdc-list-item__start,
.mat-warn .mdc-list-item__end {
  --mdc-radio-disabled-selected-icon-color: black;
  --mdc-radio-disabled-unselected-icon-color: black;
  --mdc-radio-unselected-hover-icon-color: #212121;
  --mdc-radio-unselected-focus-icon-color: #212121;
  --mdc-radio-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-unselected-pressed-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-selected-focus-icon-color: #f44336;
  --mdc-radio-selected-hover-icon-color: #f44336;
  --mdc-radio-selected-icon-color: #f44336;
  --mdc-radio-selected-pressed-icon-color: #f44336;
}

.mat-mdc-list-option {
  --mdc-checkbox-disabled-selected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-disabled-unselected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-selected-checkmark-color: black;
  --mdc-checkbox-selected-focus-icon-color: #0cabf5;
  --mdc-checkbox-selected-hover-icon-color: #0cabf5;
  --mdc-checkbox-selected-icon-color: #0cabf5;
  --mdc-checkbox-selected-pressed-icon-color: #0cabf5;
  --mdc-checkbox-unselected-focus-icon-color: #212121;
  --mdc-checkbox-unselected-hover-icon-color: #212121;
  --mdc-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-checkbox-selected-focus-state-layer-color: #0cabf5;
  --mdc-checkbox-selected-hover-state-layer-color: #0cabf5;
  --mdc-checkbox-selected-pressed-state-layer-color: #0cabf5;
  --mdc-checkbox-unselected-focus-state-layer-color: black;
  --mdc-checkbox-unselected-hover-state-layer-color: black;
  --mdc-checkbox-unselected-pressed-state-layer-color: black;
}

.mat-mdc-list-option.mat-accent {
  --mdc-checkbox-disabled-selected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-disabled-unselected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-selected-checkmark-color: white;
  --mdc-checkbox-selected-focus-icon-color: #0cabf5;
  --mdc-checkbox-selected-hover-icon-color: #0cabf5;
  --mdc-checkbox-selected-icon-color: #0cabf5;
  --mdc-checkbox-selected-pressed-icon-color: #0cabf5;
  --mdc-checkbox-unselected-focus-icon-color: #212121;
  --mdc-checkbox-unselected-hover-icon-color: #212121;
  --mdc-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-checkbox-selected-focus-state-layer-color: #0cabf5;
  --mdc-checkbox-selected-hover-state-layer-color: #0cabf5;
  --mdc-checkbox-selected-pressed-state-layer-color: #0cabf5;
  --mdc-checkbox-unselected-focus-state-layer-color: black;
  --mdc-checkbox-unselected-hover-state-layer-color: black;
  --mdc-checkbox-unselected-pressed-state-layer-color: black;
}

.mat-mdc-list-option.mat-warn {
  --mdc-checkbox-disabled-selected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-disabled-unselected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-selected-checkmark-color: white;
  --mdc-checkbox-selected-focus-icon-color: #f44336;
  --mdc-checkbox-selected-hover-icon-color: #f44336;
  --mdc-checkbox-selected-icon-color: #f44336;
  --mdc-checkbox-selected-pressed-icon-color: #f44336;
  --mdc-checkbox-unselected-focus-icon-color: #212121;
  --mdc-checkbox-unselected-hover-icon-color: #212121;
  --mdc-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-checkbox-selected-focus-state-layer-color: #f44336;
  --mdc-checkbox-selected-hover-state-layer-color: #f44336;
  --mdc-checkbox-selected-pressed-state-layer-color: #f44336;
  --mdc-checkbox-unselected-focus-state-layer-color: black;
  --mdc-checkbox-unselected-hover-state-layer-color: black;
  --mdc-checkbox-unselected-pressed-state-layer-color: black;
}

.mat-mdc-list-base.mat-mdc-list-base .mdc-list-item--selected .mdc-list-item__primary-text,
.mat-mdc-list-base.mat-mdc-list-base .mdc-list-item--selected .mdc-list-item__start,
.mat-mdc-list-base.mat-mdc-list-base .mdc-list-item--activated .mdc-list-item__primary-text,
.mat-mdc-list-base.mat-mdc-list-base .mdc-list-item--activated .mdc-list-item__start {
  color: #0cabf5;
}

.mat-mdc-list-base .mdc-list-item--disabled .mdc-list-item__start,
.mat-mdc-list-base .mdc-list-item--disabled .mdc-list-item__content,
.mat-mdc-list-base .mdc-list-item--disabled .mdc-list-item__end {
  opacity: 1;
}

html {
  --mdc-list-list-item-one-line-container-height: 48px;
  --mdc-list-list-item-two-line-container-height: 64px;
  --mdc-list-list-item-three-line-container-height: 88px;
}
html {
  --mat-list-list-item-leading-icon-start-space: 16px;
  --mat-list-list-item-leading-icon-end-space: 32px;
}

.mdc-list-item__start,
.mdc-list-item__end {
  --mdc-radio-state-layer-size: 40px;
}

.mat-mdc-list-item.mdc-list-item--with-leading-avatar.mdc-list-item--with-one-line, .mat-mdc-list-item.mdc-list-item--with-leading-checkbox.mdc-list-item--with-one-line, .mat-mdc-list-item.mdc-list-item--with-leading-icon.mdc-list-item--with-one-line {
  height: 56px;
}
.mat-mdc-list-item.mdc-list-item--with-leading-avatar.mdc-list-item--with-two-lines, .mat-mdc-list-item.mdc-list-item--with-leading-checkbox.mdc-list-item--with-two-lines, .mat-mdc-list-item.mdc-list-item--with-leading-icon.mdc-list-item--with-two-lines {
  height: 72px;
}

html {
  --mdc-list-list-item-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-list-list-item-label-text-line-height: 24px;
  --mdc-list-list-item-label-text-size: 16px;
  --mdc-list-list-item-label-text-tracking: 0.03125em;
  --mdc-list-list-item-label-text-weight: 400;
  --mdc-list-list-item-supporting-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-list-list-item-supporting-text-line-height: 20px;
  --mdc-list-list-item-supporting-text-size: 14px;
  --mdc-list-list-item-supporting-text-tracking: 0.0178571429em;
  --mdc-list-list-item-supporting-text-weight: 400;
  --mdc-list-list-item-trailing-supporting-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-list-list-item-trailing-supporting-text-line-height: 20px;
  --mdc-list-list-item-trailing-supporting-text-size: 12px;
  --mdc-list-list-item-trailing-supporting-text-tracking: 0.0333333333em;
  --mdc-list-list-item-trailing-supporting-text-weight: 400;
}
.mdc-list-group__subheader {
  font: 400 16px / 28px 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  letter-spacing: 0.009375em;
}

html {
  --mat-paginator-container-text-color: rgba(0, 0, 0, 0.87);
  --mat-paginator-container-background-color: white;
  --mat-paginator-enabled-icon-color: rgba(0, 0, 0, 0.54);
  --mat-paginator-disabled-icon-color: rgba(0, 0, 0, 0.12);
}

html {
  --mat-paginator-container-size: 56px;
  --mat-paginator-form-field-container-height: 40px;
  --mat-paginator-form-field-container-vertical-padding: 8px;
  --mat-paginator-touch-target-display: block;
}

html {
  --mat-paginator-container-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-paginator-container-text-line-height: 20px;
  --mat-paginator-container-text-size: 12px;
  --mat-paginator-container-text-tracking: 0.0333333333em;
  --mat-paginator-container-text-weight: 400;
  --mat-paginator-select-trigger-text-size: 12px;
}

html {
  --mdc-secondary-navigation-tab-container-height: 48px;
}
html {
  --mdc-tab-indicator-active-indicator-height: 2px;
  --mdc-tab-indicator-active-indicator-shape: 0;
}
html {
  --mat-tab-header-divider-color: transparent;
  --mat-tab-header-divider-height: 0;
}
.mat-mdc-tab-group,
.mat-mdc-tab-nav-bar {
  --mdc-tab-indicator-active-indicator-color: #0cabf5;
}
.mat-mdc-tab-group,
.mat-mdc-tab-nav-bar {
  --mat-tab-header-disabled-ripple-color: rgba(0, 0, 0, 0.38);
  --mat-tab-header-pagination-icon-color: black;
  --mat-tab-header-inactive-label-text-color: rgba(0, 0, 0, 0.6);
  --mat-tab-header-active-label-text-color: #0cabf5;
  --mat-tab-header-active-ripple-color: #0cabf5;
  --mat-tab-header-inactive-ripple-color: #0cabf5;
  --mat-tab-header-inactive-focus-label-text-color: rgba(0, 0, 0, 0.6);
  --mat-tab-header-inactive-hover-label-text-color: rgba(0, 0, 0, 0.6);
  --mat-tab-header-active-focus-label-text-color: #0cabf5;
  --mat-tab-header-active-hover-label-text-color: #0cabf5;
  --mat-tab-header-active-focus-indicator-color: #0cabf5;
  --mat-tab-header-active-hover-indicator-color: #0cabf5;
}
.mat-mdc-tab-group.mat-accent,
.mat-mdc-tab-nav-bar.mat-accent {
  --mdc-tab-indicator-active-indicator-color: #0cabf5;
}
.mat-mdc-tab-group.mat-accent,
.mat-mdc-tab-nav-bar.mat-accent {
  --mat-tab-header-disabled-ripple-color: rgba(0, 0, 0, 0.38);
  --mat-tab-header-pagination-icon-color: black;
  --mat-tab-header-inactive-label-text-color: rgba(0, 0, 0, 0.6);
  --mat-tab-header-active-label-text-color: #0cabf5;
  --mat-tab-header-active-ripple-color: #0cabf5;
  --mat-tab-header-inactive-ripple-color: #0cabf5;
  --mat-tab-header-inactive-focus-label-text-color: rgba(0, 0, 0, 0.6);
  --mat-tab-header-inactive-hover-label-text-color: rgba(0, 0, 0, 0.6);
  --mat-tab-header-active-focus-label-text-color: #0cabf5;
  --mat-tab-header-active-hover-label-text-color: #0cabf5;
  --mat-tab-header-active-focus-indicator-color: #0cabf5;
  --mat-tab-header-active-hover-indicator-color: #0cabf5;
}
.mat-mdc-tab-group.mat-warn,
.mat-mdc-tab-nav-bar.mat-warn {
  --mdc-tab-indicator-active-indicator-color: #f44336;
}
.mat-mdc-tab-group.mat-warn,
.mat-mdc-tab-nav-bar.mat-warn {
  --mat-tab-header-disabled-ripple-color: rgba(0, 0, 0, 0.38);
  --mat-tab-header-pagination-icon-color: black;
  --mat-tab-header-inactive-label-text-color: rgba(0, 0, 0, 0.6);
  --mat-tab-header-active-label-text-color: #f44336;
  --mat-tab-header-active-ripple-color: #f44336;
  --mat-tab-header-inactive-ripple-color: #f44336;
  --mat-tab-header-inactive-focus-label-text-color: rgba(0, 0, 0, 0.6);
  --mat-tab-header-inactive-hover-label-text-color: rgba(0, 0, 0, 0.6);
  --mat-tab-header-active-focus-label-text-color: #f44336;
  --mat-tab-header-active-hover-label-text-color: #f44336;
  --mat-tab-header-active-focus-indicator-color: #f44336;
  --mat-tab-header-active-hover-indicator-color: #f44336;
}
.mat-mdc-tab-group.mat-background-primary,
.mat-mdc-tab-nav-bar.mat-background-primary {
  --mat-tab-header-with-background-background-color: #0cabf5;
  --mat-tab-header-with-background-foreground-color: rgba(0, 0, 0, 0.87);
}
.mat-mdc-tab-group.mat-background-accent,
.mat-mdc-tab-nav-bar.mat-background-accent {
  --mat-tab-header-with-background-background-color: #0cabf5;
  --mat-tab-header-with-background-foreground-color: white;
}
.mat-mdc-tab-group.mat-background-warn,
.mat-mdc-tab-nav-bar.mat-background-warn {
  --mat-tab-header-with-background-background-color: #f44336;
  --mat-tab-header-with-background-foreground-color: white;
}

.mat-mdc-tab-header {
  --mdc-secondary-navigation-tab-container-height: 48px;
}
.mat-mdc-tab-header {
  --mat-tab-header-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-tab-header-label-text-size: 14px;
  --mat-tab-header-label-text-tracking: 0.0892857143em;
  --mat-tab-header-label-text-line-height: 36px;
  --mat-tab-header-label-text-weight: 500;
}
html {
  --mdc-checkbox-disabled-selected-checkmark-color: #fff;
  --mdc-checkbox-selected-focus-state-layer-opacity: 0.16;
  --mdc-checkbox-selected-hover-state-layer-opacity: 0.04;
  --mdc-checkbox-selected-pressed-state-layer-opacity: 0.16;
  --mdc-checkbox-unselected-focus-state-layer-opacity: 0.16;
  --mdc-checkbox-unselected-hover-state-layer-opacity: 0.04;
  --mdc-checkbox-unselected-pressed-state-layer-opacity: 0.16;
}
html {
  --mdc-checkbox-disabled-selected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-disabled-unselected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-selected-checkmark-color: white;
  --mdc-checkbox-selected-focus-icon-color: #0cabf5;
  --mdc-checkbox-selected-hover-icon-color: #0cabf5;
  --mdc-checkbox-selected-icon-color: #0cabf5;
  --mdc-checkbox-selected-pressed-icon-color: #0cabf5;
  --mdc-checkbox-unselected-focus-icon-color: #212121;
  --mdc-checkbox-unselected-hover-icon-color: #212121;
  --mdc-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-checkbox-selected-focus-state-layer-color: #0cabf5;
  --mdc-checkbox-selected-hover-state-layer-color: #0cabf5;
  --mdc-checkbox-selected-pressed-state-layer-color: #0cabf5;
  --mdc-checkbox-unselected-focus-state-layer-color: black;
  --mdc-checkbox-unselected-hover-state-layer-color: black;
  --mdc-checkbox-unselected-pressed-state-layer-color: black;
}
html {
  --mat-checkbox-disabled-label-color: rgba(0, 0, 0, 0.38);
  --mat-checkbox-label-text-color: rgba(0, 0, 0, 0.87);
}

.mat-mdc-checkbox.mat-primary {
  --mdc-checkbox-disabled-selected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-disabled-unselected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-selected-checkmark-color: black;
  --mdc-checkbox-selected-focus-icon-color: #0cabf5;
  --mdc-checkbox-selected-hover-icon-color: #0cabf5;
  --mdc-checkbox-selected-icon-color: #0cabf5;
  --mdc-checkbox-selected-pressed-icon-color: #0cabf5;
  --mdc-checkbox-unselected-focus-icon-color: #212121;
  --mdc-checkbox-unselected-hover-icon-color: #212121;
  --mdc-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-checkbox-selected-focus-state-layer-color: #0cabf5;
  --mdc-checkbox-selected-hover-state-layer-color: #0cabf5;
  --mdc-checkbox-selected-pressed-state-layer-color: #0cabf5;
  --mdc-checkbox-unselected-focus-state-layer-color: black;
  --mdc-checkbox-unselected-hover-state-layer-color: black;
  --mdc-checkbox-unselected-pressed-state-layer-color: black;
}
.mat-mdc-checkbox.mat-warn {
  --mdc-checkbox-disabled-selected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-disabled-unselected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-selected-checkmark-color: white;
  --mdc-checkbox-selected-focus-icon-color: #f44336;
  --mdc-checkbox-selected-hover-icon-color: #f44336;
  --mdc-checkbox-selected-icon-color: #f44336;
  --mdc-checkbox-selected-pressed-icon-color: #f44336;
  --mdc-checkbox-unselected-focus-icon-color: #212121;
  --mdc-checkbox-unselected-hover-icon-color: #212121;
  --mdc-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-checkbox-selected-focus-state-layer-color: #f44336;
  --mdc-checkbox-selected-hover-state-layer-color: #f44336;
  --mdc-checkbox-selected-pressed-state-layer-color: #f44336;
  --mdc-checkbox-unselected-focus-state-layer-color: black;
  --mdc-checkbox-unselected-hover-state-layer-color: black;
  --mdc-checkbox-unselected-pressed-state-layer-color: black;
}

html {
  --mdc-checkbox-state-layer-size: 40px;
}
html {
  --mat-checkbox-touch-target-display: block;
}

html {
  --mat-checkbox-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-checkbox-label-text-line-height: 20px;
  --mat-checkbox-label-text-size: 14px;
  --mat-checkbox-label-text-tracking: 0.0178571429em;
  --mat-checkbox-label-text-weight: 400;
}

html {
  --mdc-text-button-container-shape: 4px;
  --mdc-text-button-keep-touch-target: false;
}
html {
  --mdc-filled-button-container-shape: 4px;
  --mdc-filled-button-keep-touch-target: false;
}
html {
  --mdc-protected-button-container-shape: 4px;
  --mdc-protected-button-container-elevation-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
  --mdc-protected-button-disabled-container-elevation-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);
  --mdc-protected-button-focus-container-elevation-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);
  --mdc-protected-button-hover-container-elevation-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);
  --mdc-protected-button-pressed-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
}
html {
  --mdc-outlined-button-keep-touch-target: false;
  --mdc-outlined-button-outline-width: 1px;
  --mdc-outlined-button-container-shape: 4px;
}
html {
  --mat-text-button-horizontal-padding: 8px;
  --mat-text-button-with-icon-horizontal-padding: 8px;
  --mat-text-button-icon-spacing: 8px;
  --mat-text-button-icon-offset: 0;
}
html {
  --mat-filled-button-horizontal-padding: 16px;
  --mat-filled-button-icon-spacing: 8px;
  --mat-filled-button-icon-offset: -4px;
}
html {
  --mat-protected-button-horizontal-padding: 16px;
  --mat-protected-button-icon-spacing: 8px;
  --mat-protected-button-icon-offset: -4px;
}
html {
  --mat-outlined-button-horizontal-padding: 15px;
  --mat-outlined-button-icon-spacing: 8px;
  --mat-outlined-button-icon-offset: -4px;
}

html {
  --mdc-text-button-label-text-color: black;
  --mdc-text-button-disabled-label-text-color: rgba(0, 0, 0, 0.38);
}
html {
  --mat-text-button-state-layer-color: black;
  --mat-text-button-disabled-state-layer-color: black;
  --mat-text-button-ripple-color: rgba(0, 0, 0, 0.1);
  --mat-text-button-hover-state-layer-opacity: 0.04;
  --mat-text-button-focus-state-layer-opacity: 0.12;
  --mat-text-button-pressed-state-layer-opacity: 0.12;
}
html {
  --mdc-filled-button-container-color: white;
  --mdc-filled-button-label-text-color: black;
  --mdc-filled-button-disabled-container-color: rgba(0, 0, 0, 0.12);
  --mdc-filled-button-disabled-label-text-color: rgba(0, 0, 0, 0.38);
}
html {
  --mat-filled-button-state-layer-color: black;
  --mat-filled-button-disabled-state-layer-color: black;
  --mat-filled-button-ripple-color: rgba(0, 0, 0, 0.1);
  --mat-filled-button-hover-state-layer-opacity: 0.04;
  --mat-filled-button-focus-state-layer-opacity: 0.12;
  --mat-filled-button-pressed-state-layer-opacity: 0.12;
}
html {
  --mdc-protected-button-container-color: white;
  --mdc-protected-button-label-text-color: black;
  --mdc-protected-button-disabled-container-color: rgba(0, 0, 0, 0.12);
  --mdc-protected-button-disabled-label-text-color: rgba(0, 0, 0, 0.38);
}
html {
  --mat-protected-button-state-layer-color: black;
  --mat-protected-button-disabled-state-layer-color: black;
  --mat-protected-button-ripple-color: rgba(0, 0, 0, 0.1);
  --mat-protected-button-hover-state-layer-opacity: 0.04;
  --mat-protected-button-focus-state-layer-opacity: 0.12;
  --mat-protected-button-pressed-state-layer-opacity: 0.12;
}
html {
  --mdc-outlined-button-disabled-outline-color: rgba(0, 0, 0, 0.12);
  --mdc-outlined-button-disabled-label-text-color: rgba(0, 0, 0, 0.38);
  --mdc-outlined-button-label-text-color: black;
  --mdc-outlined-button-outline-color: rgba(0, 0, 0, 0.12);
}
html {
  --mat-outlined-button-state-layer-color: black;
  --mat-outlined-button-disabled-state-layer-color: black;
  --mat-outlined-button-ripple-color: rgba(0, 0, 0, 0.1);
  --mat-outlined-button-hover-state-layer-opacity: 0.04;
  --mat-outlined-button-focus-state-layer-opacity: 0.12;
  --mat-outlined-button-pressed-state-layer-opacity: 0.12;
}

.mat-mdc-button.mat-primary {
  --mdc-text-button-label-text-color: #0cabf5;
}
.mat-mdc-button.mat-primary {
  --mat-text-button-state-layer-color: #0cabf5;
  --mat-text-button-ripple-color: rgba(12, 171, 245, 0.1);
}
.mat-mdc-button.mat-accent {
  --mdc-text-button-label-text-color: #0cabf5;
}
.mat-mdc-button.mat-accent {
  --mat-text-button-state-layer-color: #0cabf5;
  --mat-text-button-ripple-color: rgba(12, 171, 245, 0.1);
}
.mat-mdc-button.mat-warn {
  --mdc-text-button-label-text-color: #f44336;
}
.mat-mdc-button.mat-warn {
  --mat-text-button-state-layer-color: #f44336;
  --mat-text-button-ripple-color: rgba(244, 67, 54, 0.1);
}

.mat-mdc-unelevated-button.mat-primary {
  --mdc-filled-button-container-color: #0cabf5;
  --mdc-filled-button-label-text-color: black;
}
.mat-mdc-unelevated-button.mat-primary {
  --mat-filled-button-state-layer-color: black;
  --mat-filled-button-ripple-color: rgba(0, 0, 0, 0.1);
}
.mat-mdc-unelevated-button.mat-accent {
  --mdc-filled-button-container-color: #0cabf5;
  --mdc-filled-button-label-text-color: white;
}
.mat-mdc-unelevated-button.mat-accent {
  --mat-filled-button-state-layer-color: white;
  --mat-filled-button-ripple-color: rgba(255, 255, 255, 0.1);
}
.mat-mdc-unelevated-button.mat-warn {
  --mdc-filled-button-container-color: #f44336;
  --mdc-filled-button-label-text-color: white;
}
.mat-mdc-unelevated-button.mat-warn {
  --mat-filled-button-state-layer-color: white;
  --mat-filled-button-ripple-color: rgba(255, 255, 255, 0.1);
}

.mat-mdc-raised-button.mat-primary {
  --mdc-protected-button-container-color: #0cabf5;
  --mdc-protected-button-label-text-color: black;
}
.mat-mdc-raised-button.mat-primary {
  --mat-protected-button-state-layer-color: black;
  --mat-protected-button-ripple-color: rgba(0, 0, 0, 0.1);
}
.mat-mdc-raised-button.mat-accent {
  --mdc-protected-button-container-color: #0cabf5;
  --mdc-protected-button-label-text-color: white;
}
.mat-mdc-raised-button.mat-accent {
  --mat-protected-button-state-layer-color: white;
  --mat-protected-button-ripple-color: rgba(255, 255, 255, 0.1);
}
.mat-mdc-raised-button.mat-warn {
  --mdc-protected-button-container-color: #f44336;
  --mdc-protected-button-label-text-color: white;
}
.mat-mdc-raised-button.mat-warn {
  --mat-protected-button-state-layer-color: white;
  --mat-protected-button-ripple-color: rgba(255, 255, 255, 0.1);
}

.mat-mdc-outlined-button.mat-primary {
  --mdc-outlined-button-label-text-color: #0cabf5;
  --mdc-outlined-button-outline-color: rgba(0, 0, 0, 0.12);
}
.mat-mdc-outlined-button.mat-primary {
  --mat-outlined-button-state-layer-color: #0cabf5;
  --mat-outlined-button-ripple-color: rgba(12, 171, 245, 0.1);
}
.mat-mdc-outlined-button.mat-accent {
  --mdc-outlined-button-label-text-color: #0cabf5;
  --mdc-outlined-button-outline-color: rgba(0, 0, 0, 0.12);
}
.mat-mdc-outlined-button.mat-accent {
  --mat-outlined-button-state-layer-color: #0cabf5;
  --mat-outlined-button-ripple-color: rgba(12, 171, 245, 0.1);
}
.mat-mdc-outlined-button.mat-warn {
  --mdc-outlined-button-label-text-color: #f44336;
  --mdc-outlined-button-outline-color: rgba(0, 0, 0, 0.12);
}
.mat-mdc-outlined-button.mat-warn {
  --mat-outlined-button-state-layer-color: #f44336;
  --mat-outlined-button-ripple-color: rgba(244, 67, 54, 0.1);
}

html {
  --mdc-text-button-container-height: 36px;
}
html {
  --mdc-filled-button-container-height: 36px;
}
html {
  --mdc-protected-button-container-height: 36px;
}
html {
  --mdc-outlined-button-container-height: 36px;
}
html {
  --mat-text-button-touch-target-display: block;
}
html {
  --mat-filled-button-touch-target-display: block;
}
html {
  --mat-protected-button-touch-target-display: block;
}
html {
  --mat-outlined-button-touch-target-display: block;
}

html {
  --mdc-text-button-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-text-button-label-text-size: 14px;
  --mdc-text-button-label-text-tracking: 0.0892857143em;
  --mdc-text-button-label-text-weight: 500;
  --mdc-text-button-label-text-transform: none;
}
html {
  --mdc-filled-button-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-filled-button-label-text-size: 14px;
  --mdc-filled-button-label-text-tracking: 0.0892857143em;
  --mdc-filled-button-label-text-weight: 500;
  --mdc-filled-button-label-text-transform: none;
}
html {
  --mdc-protected-button-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-protected-button-label-text-size: 14px;
  --mdc-protected-button-label-text-tracking: 0.0892857143em;
  --mdc-protected-button-label-text-weight: 500;
  --mdc-protected-button-label-text-transform: none;
}
html {
  --mdc-outlined-button-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-outlined-button-label-text-size: 14px;
  --mdc-outlined-button-label-text-tracking: 0.0892857143em;
  --mdc-outlined-button-label-text-weight: 500;
  --mdc-outlined-button-label-text-transform: none;
}
html {
  --mdc-icon-button-icon-size: 24px;
}

html {
  --mdc-icon-button-icon-color: inherit;
  --mdc-icon-button-disabled-icon-color: rgba(0, 0, 0, 0.38);
}
html {
  --mat-icon-button-state-layer-color: black;
  --mat-icon-button-disabled-state-layer-color: black;
  --mat-icon-button-ripple-color: rgba(0, 0, 0, 0.1);
  --mat-icon-button-hover-state-layer-opacity: 0.04;
  --mat-icon-button-focus-state-layer-opacity: 0.12;
  --mat-icon-button-pressed-state-layer-opacity: 0.12;
}
html .mat-mdc-icon-button.mat-primary {
  --mdc-icon-button-icon-color: #0cabf5;
}
html .mat-mdc-icon-button.mat-primary {
  --mat-icon-button-state-layer-color: #0cabf5;
  --mat-icon-button-ripple-color: rgba(12, 171, 245, 0.1);
}
html .mat-mdc-icon-button.mat-accent {
  --mdc-icon-button-icon-color: #0cabf5;
}
html .mat-mdc-icon-button.mat-accent {
  --mat-icon-button-state-layer-color: #0cabf5;
  --mat-icon-button-ripple-color: rgba(12, 171, 245, 0.1);
}
html .mat-mdc-icon-button.mat-warn {
  --mdc-icon-button-icon-color: #f44336;
}
html .mat-mdc-icon-button.mat-warn {
  --mat-icon-button-state-layer-color: #f44336;
  --mat-icon-button-ripple-color: rgba(244, 67, 54, 0.1);
}

html {
  --mat-icon-button-touch-target-display: block;
}

.mat-mdc-icon-button.mat-mdc-button-base {
  --mdc-icon-button-state-layer-size: 48px;
  width: var(--mdc-icon-button-state-layer-size);
  height: var(--mdc-icon-button-state-layer-size);
  padding: 12px;
}

html {
  --mdc-fab-container-shape: 50%;
  --mdc-fab-container-elevation-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
  --mdc-fab-focus-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
  --mdc-fab-hover-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
  --mdc-fab-pressed-container-elevation-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12);
}
html {
  --mdc-fab-small-container-shape: 50%;
  --mdc-fab-small-container-elevation-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
  --mdc-fab-small-focus-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
  --mdc-fab-small-hover-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
  --mdc-fab-small-pressed-container-elevation-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12);
}
html {
  --mdc-extended-fab-container-height: 48px;
  --mdc-extended-fab-container-shape: 24px;
  --mdc-extended-fab-container-elevation-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
  --mdc-extended-fab-focus-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
  --mdc-extended-fab-hover-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
  --mdc-extended-fab-pressed-container-elevation-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12);
}

html {
  --mdc-fab-container-color: white;
}
html {
  --mat-fab-foreground-color: black;
  --mat-fab-state-layer-color: black;
  --mat-fab-disabled-state-layer-color: black;
  --mat-fab-ripple-color: rgba(0, 0, 0, 0.1);
  --mat-fab-hover-state-layer-opacity: 0.04;
  --mat-fab-focus-state-layer-opacity: 0.12;
  --mat-fab-pressed-state-layer-opacity: 0.12;
  --mat-fab-disabled-state-container-color: rgba(0, 0, 0, 0.12);
  --mat-fab-disabled-state-foreground-color: rgba(0, 0, 0, 0.38);
}
html {
  --mdc-fab-small-container-color: white;
}
html {
  --mat-fab-small-foreground-color: black;
  --mat-fab-small-state-layer-color: black;
  --mat-fab-small-disabled-state-layer-color: black;
  --mat-fab-small-ripple-color: rgba(0, 0, 0, 0.1);
  --mat-fab-small-hover-state-layer-opacity: 0.04;
  --mat-fab-small-focus-state-layer-opacity: 0.12;
  --mat-fab-small-pressed-state-layer-opacity: 0.12;
  --mat-fab-small-disabled-state-container-color: rgba(0, 0, 0, 0.12);
  --mat-fab-small-disabled-state-foreground-color: rgba(0, 0, 0, 0.38);
}
html .mat-mdc-fab.mat-primary {
  --mdc-fab-container-color: #0cabf5;
}
html .mat-mdc-fab.mat-primary {
  --mat-fab-foreground-color: black;
  --mat-fab-state-layer-color: black;
  --mat-fab-ripple-color: rgba(0, 0, 0, 0.1);
}
html .mat-mdc-fab.mat-accent {
  --mdc-fab-container-color: #0cabf5;
}
html .mat-mdc-fab.mat-accent {
  --mat-fab-foreground-color: white;
  --mat-fab-state-layer-color: white;
  --mat-fab-ripple-color: rgba(255, 255, 255, 0.1);
}
html .mat-mdc-fab.mat-warn {
  --mdc-fab-container-color: #f44336;
}
html .mat-mdc-fab.mat-warn {
  --mat-fab-foreground-color: white;
  --mat-fab-state-layer-color: white;
  --mat-fab-ripple-color: rgba(255, 255, 255, 0.1);
}
html .mat-mdc-mini-fab.mat-primary {
  --mdc-fab-small-container-color: #0cabf5;
}
html .mat-mdc-mini-fab.mat-primary {
  --mat-fab-small-foreground-color: black;
  --mat-fab-small-state-layer-color: black;
  --mat-fab-small-ripple-color: rgba(0, 0, 0, 0.1);
}
html .mat-mdc-mini-fab.mat-accent {
  --mdc-fab-small-container-color: #0cabf5;
}
html .mat-mdc-mini-fab.mat-accent {
  --mat-fab-small-foreground-color: white;
  --mat-fab-small-state-layer-color: white;
  --mat-fab-small-ripple-color: rgba(255, 255, 255, 0.1);
}
html .mat-mdc-mini-fab.mat-warn {
  --mdc-fab-small-container-color: #f44336;
}
html .mat-mdc-mini-fab.mat-warn {
  --mat-fab-small-foreground-color: white;
  --mat-fab-small-state-layer-color: white;
  --mat-fab-small-ripple-color: rgba(255, 255, 255, 0.1);
}

html {
  --mat-fab-touch-target-display: block;
}
html {
  --mat-fab-small-touch-target-display: block;
}

html {
  --mdc-extended-fab-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-extended-fab-label-text-size: 14px;
  --mdc-extended-fab-label-text-tracking: 0.0892857143em;
  --mdc-extended-fab-label-text-weight: 500;
}
html {
  --mdc-snackbar-container-shape: 4px;
}

html {
  --mdc-snackbar-container-color: #333333;
  --mdc-snackbar-supporting-text-color: rgba(255, 255, 255, 0.87);
}
html {
  --mat-snack-bar-button-color: #c8e6c9;
}

html {
  --mdc-snackbar-supporting-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-snackbar-supporting-text-line-height: 20px;
  --mdc-snackbar-supporting-text-size: 14px;
  --mdc-snackbar-supporting-text-weight: 400;
}

html {
  --mat-table-row-item-outline-width: 1px;
}

html {
  --mat-table-background-color: white;
  --mat-table-header-headline-color: rgba(0, 0, 0, 0.87);
  --mat-table-row-item-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-table-row-item-outline-color: rgba(0, 0, 0, 0.12);
}

html {
  --mat-table-header-container-height: 56px;
  --mat-table-footer-container-height: 52px;
  --mat-table-row-item-container-height: 52px;
}

html {
  --mat-table-header-headline-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-table-header-headline-line-height: 22px;
  --mat-table-header-headline-size: 14px;
  --mat-table-header-headline-weight: 500;
  --mat-table-header-headline-tracking: 0.0071428571em;
  --mat-table-row-item-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-table-row-item-label-text-line-height: 20px;
  --mat-table-row-item-label-text-size: 14px;
  --mat-table-row-item-label-text-weight: 400;
  --mat-table-row-item-label-text-tracking: 0.0178571429em;
  --mat-table-footer-supporting-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-table-footer-supporting-text-line-height: 20px;
  --mat-table-footer-supporting-text-size: 14px;
  --mat-table-footer-supporting-text-weight: 400;
  --mat-table-footer-supporting-text-tracking: 0.0178571429em;
}

html {
  --mdc-circular-progress-active-indicator-width: 4px;
  --mdc-circular-progress-size: 48px;
}

html {
  --mdc-circular-progress-active-indicator-color: #0cabf5;
}
html .mat-accent {
  --mdc-circular-progress-active-indicator-color: #0cabf5;
}
html .mat-warn {
  --mdc-circular-progress-active-indicator-color: #f44336;
}

html {
  --mat-badge-container-shape: 50%;
  --mat-badge-container-size: unset;
  --mat-badge-small-size-container-size: unset;
  --mat-badge-large-size-container-size: unset;
  --mat-badge-legacy-container-size: 22px;
  --mat-badge-legacy-small-size-container-size: 16px;
  --mat-badge-legacy-large-size-container-size: 28px;
  --mat-badge-container-offset: -11px 0;
  --mat-badge-small-size-container-offset: -8px 0;
  --mat-badge-large-size-container-offset: -14px 0;
  --mat-badge-container-overlap-offset: -11px;
  --mat-badge-small-size-container-overlap-offset: -8px;
  --mat-badge-large-size-container-overlap-offset: -14px;
  --mat-badge-container-padding: 0;
  --mat-badge-small-size-container-padding: 0;
  --mat-badge-large-size-container-padding: 0;
}

html {
  --mat-badge-background-color: #0cabf5;
  --mat-badge-text-color: rgba(0, 0, 0, 0.87);
  --mat-badge-disabled-state-background-color: #b9b9b9;
  --mat-badge-disabled-state-text-color: rgba(0, 0, 0, 0.38);
}

.mat-badge-accent {
  --mat-badge-background-color: #0cabf5;
  --mat-badge-text-color: white;
}

.mat-badge-warn {
  --mat-badge-background-color: #f44336;
  --mat-badge-text-color: white;
}

html {
  --mat-badge-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-badge-line-height: 22px;
  --mat-badge-text-size: 12px;
  --mat-badge-text-weight: 600;
  --mat-badge-small-size-text-size: 9px;
  --mat-badge-small-size-line-height: 16px;
  --mat-badge-large-size-text-size: 24px;
  --mat-badge-large-size-line-height: 28px;
}

html {
  --mat-bottom-sheet-container-shape: 4px;
}

html {
  --mat-bottom-sheet-container-text-color: rgba(0, 0, 0, 0.87);
  --mat-bottom-sheet-container-background-color: white;
}

html {
  --mat-bottom-sheet-container-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-bottom-sheet-container-text-line-height: 20px;
  --mat-bottom-sheet-container-text-size: 14px;
  --mat-bottom-sheet-container-text-tracking: 0.0178571429em;
  --mat-bottom-sheet-container-text-weight: 400;
}

html {
  --mat-legacy-button-toggle-height: 36px;
  --mat-legacy-button-toggle-shape: 2px;
  --mat-legacy-button-toggle-focus-state-layer-opacity: 1;
}
html {
  --mat-standard-button-toggle-shape: 4px;
  --mat-standard-button-toggle-hover-state-layer-opacity: 0.04;
  --mat-standard-button-toggle-focus-state-layer-opacity: 0.12;
}

html {
  --mat-legacy-button-toggle-text-color: rgba(0, 0, 0, 0.38);
  --mat-legacy-button-toggle-state-layer-color: rgba(0, 0, 0, 0.12);
  --mat-legacy-button-toggle-selected-state-text-color: rgba(0, 0, 0, 0.54);
  --mat-legacy-button-toggle-selected-state-background-color: #e0e0e0;
  --mat-legacy-button-toggle-disabled-state-text-color: rgba(0, 0, 0, 0.26);
  --mat-legacy-button-toggle-disabled-state-background-color: #eeeeee;
  --mat-legacy-button-toggle-disabled-selected-state-background-color: #bdbdbd;
}
html {
  --mat-standard-button-toggle-text-color: rgba(0, 0, 0, 0.87);
  --mat-standard-button-toggle-background-color: white;
  --mat-standard-button-toggle-state-layer-color: black;
  --mat-standard-button-toggle-selected-state-background-color: #e0e0e0;
  --mat-standard-button-toggle-selected-state-text-color: rgba(0, 0, 0, 0.87);
  --mat-standard-button-toggle-disabled-state-text-color: rgba(0, 0, 0, 0.26);
  --mat-standard-button-toggle-disabled-state-background-color: white;
  --mat-standard-button-toggle-disabled-selected-state-text-color: rgba(0, 0, 0, 0.87);
  --mat-standard-button-toggle-disabled-selected-state-background-color: #bdbdbd;
  --mat-standard-button-toggle-divider-color: rgb(224.4, 224.4, 224.4);
}

html {
  --mat-standard-button-toggle-height: 48px;
}

html {
  --mat-legacy-button-toggle-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-legacy-button-toggle-label-text-line-height: 24px;
  --mat-legacy-button-toggle-label-text-size: 16px;
  --mat-legacy-button-toggle-label-text-tracking: 0.03125em;
  --mat-legacy-button-toggle-label-text-weight: 400;
}
html {
  --mat-standard-button-toggle-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-standard-button-toggle-label-text-line-height: 24px;
  --mat-standard-button-toggle-label-text-size: 16px;
  --mat-standard-button-toggle-label-text-tracking: 0.03125em;
  --mat-standard-button-toggle-label-text-weight: 400;
}

html {
  --mat-datepicker-calendar-container-shape: 4px;
  --mat-datepicker-calendar-container-touch-shape: 4px;
  --mat-datepicker-calendar-container-elevation-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);
  --mat-datepicker-calendar-container-touch-elevation-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
}

html {
  --mat-datepicker-calendar-date-selected-state-text-color: rgba(0, 0, 0, 0.87);
  --mat-datepicker-calendar-date-selected-state-background-color: #0cabf5;
  --mat-datepicker-calendar-date-selected-disabled-state-background-color: rgba(12, 171, 245, 0.4);
  --mat-datepicker-calendar-date-today-selected-state-outline-color: rgba(0, 0, 0, 0.87);
  --mat-datepicker-calendar-date-focus-state-background-color: rgba(12, 171, 245, 0.3);
  --mat-datepicker-calendar-date-hover-state-background-color: rgba(12, 171, 245, 0.3);
  --mat-datepicker-toggle-active-state-icon-color: #0cabf5;
  --mat-datepicker-calendar-date-in-range-state-background-color: rgba(12, 171, 245, 0.2);
  --mat-datepicker-calendar-date-in-comparison-range-state-background-color: rgba(249, 171, 0, 0.2);
  --mat-datepicker-calendar-date-in-overlap-range-state-background-color: #a8dab5;
  --mat-datepicker-calendar-date-in-overlap-range-selected-state-background-color: rgb(69.5241935484, 163.4758064516, 93.9516129032);
  --mat-datepicker-toggle-icon-color: rgba(0, 0, 0, 0.54);
  --mat-datepicker-calendar-body-label-text-color: rgba(0, 0, 0, 0.54);
  --mat-datepicker-calendar-period-button-text-color: black;
  --mat-datepicker-calendar-period-button-icon-color: rgba(0, 0, 0, 0.54);
  --mat-datepicker-calendar-navigation-button-icon-color: rgba(0, 0, 0, 0.54);
  --mat-datepicker-calendar-header-divider-color: rgba(0, 0, 0, 0.12);
  --mat-datepicker-calendar-header-text-color: rgba(0, 0, 0, 0.54);
  --mat-datepicker-calendar-date-today-outline-color: rgba(0, 0, 0, 0.38);
  --mat-datepicker-calendar-date-today-disabled-state-outline-color: rgba(0, 0, 0, 0.18);
  --mat-datepicker-calendar-date-text-color: rgba(0, 0, 0, 0.87);
  --mat-datepicker-calendar-date-outline-color: transparent;
  --mat-datepicker-calendar-date-disabled-state-text-color: rgba(0, 0, 0, 0.38);
  --mat-datepicker-calendar-date-preview-state-outline-color: rgba(0, 0, 0, 0.24);
  --mat-datepicker-range-input-separator-color: rgba(0, 0, 0, 0.87);
  --mat-datepicker-range-input-disabled-state-separator-color: rgba(0, 0, 0, 0.38);
  --mat-datepicker-range-input-disabled-state-text-color: rgba(0, 0, 0, 0.38);
  --mat-datepicker-calendar-container-background-color: white;
  --mat-datepicker-calendar-container-text-color: rgba(0, 0, 0, 0.87);
}

.mat-datepicker-content.mat-accent {
  --mat-datepicker-calendar-date-selected-state-text-color: white;
  --mat-datepicker-calendar-date-selected-state-background-color: #0cabf5;
  --mat-datepicker-calendar-date-selected-disabled-state-background-color: rgba(12, 171, 245, 0.4);
  --mat-datepicker-calendar-date-today-selected-state-outline-color: white;
  --mat-datepicker-calendar-date-focus-state-background-color: rgba(12, 171, 245, 0.3);
  --mat-datepicker-calendar-date-hover-state-background-color: rgba(12, 171, 245, 0.3);
  --mat-datepicker-calendar-date-in-range-state-background-color: rgba(12, 171, 245, 0.2);
  --mat-datepicker-calendar-date-in-comparison-range-state-background-color: rgba(249, 171, 0, 0.2);
  --mat-datepicker-calendar-date-in-overlap-range-state-background-color: #a8dab5;
  --mat-datepicker-calendar-date-in-overlap-range-selected-state-background-color: rgb(69.5241935484, 163.4758064516, 93.9516129032);
}
.mat-datepicker-content.mat-warn {
  --mat-datepicker-calendar-date-selected-state-text-color: white;
  --mat-datepicker-calendar-date-selected-state-background-color: #f44336;
  --mat-datepicker-calendar-date-selected-disabled-state-background-color: rgba(244, 67, 54, 0.4);
  --mat-datepicker-calendar-date-today-selected-state-outline-color: white;
  --mat-datepicker-calendar-date-focus-state-background-color: rgba(244, 67, 54, 0.3);
  --mat-datepicker-calendar-date-hover-state-background-color: rgba(244, 67, 54, 0.3);
  --mat-datepicker-calendar-date-in-range-state-background-color: rgba(244, 67, 54, 0.2);
  --mat-datepicker-calendar-date-in-comparison-range-state-background-color: rgba(249, 171, 0, 0.2);
  --mat-datepicker-calendar-date-in-overlap-range-state-background-color: #a8dab5;
  --mat-datepicker-calendar-date-in-overlap-range-selected-state-background-color: rgb(69.5241935484, 163.4758064516, 93.9516129032);
}

.mat-datepicker-toggle-active.mat-accent {
  --mat-datepicker-toggle-active-state-icon-color: #0cabf5;
}
.mat-datepicker-toggle-active.mat-warn {
  --mat-datepicker-toggle-active-state-icon-color: #f44336;
}

.mat-calendar-controls {
  --mat-icon-button-touch-target-display: none;
}
.mat-calendar-controls .mat-mdc-icon-button.mat-mdc-button-base {
  --mdc-icon-button-state-layer-size: 40px;
  width: var(--mdc-icon-button-state-layer-size);
  height: var(--mdc-icon-button-state-layer-size);
  padding: 8px;
}

html {
  --mat-datepicker-calendar-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-datepicker-calendar-text-size: 13px;
  --mat-datepicker-calendar-body-label-text-size: 14px;
  --mat-datepicker-calendar-body-label-text-weight: 500;
  --mat-datepicker-calendar-period-button-text-size: 14px;
  --mat-datepicker-calendar-period-button-text-weight: 500;
  --mat-datepicker-calendar-header-text-size: 11px;
  --mat-datepicker-calendar-header-text-weight: 400;
}

html {
  --mat-divider-width: 1px;
}

html {
  --mat-divider-color: rgba(0, 0, 0, 0.12);
}

html {
  --mat-expansion-container-shape: 4px;
  --mat-expansion-legacy-header-indicator-display: inline-block;
  --mat-expansion-header-indicator-display: none;
}

html {
  --mat-expansion-container-background-color: white;
  --mat-expansion-container-text-color: rgba(0, 0, 0, 0.87);
  --mat-expansion-actions-divider-color: rgba(0, 0, 0, 0.12);
  --mat-expansion-header-hover-state-layer-color: rgba(0, 0, 0, 0.04);
  --mat-expansion-header-focus-state-layer-color: rgba(0, 0, 0, 0.04);
  --mat-expansion-header-disabled-state-text-color: rgba(0, 0, 0, 0.26);
  --mat-expansion-header-text-color: rgba(0, 0, 0, 0.87);
  --mat-expansion-header-description-color: rgba(0, 0, 0, 0.54);
  --mat-expansion-header-indicator-color: rgba(0, 0, 0, 0.54);
}

html {
  --mat-expansion-header-collapsed-state-height: 48px;
  --mat-expansion-header-expanded-state-height: 64px;
}

html {
  --mat-expansion-header-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-expansion-header-text-size: 14px;
  --mat-expansion-header-text-weight: 500;
  --mat-expansion-header-text-line-height: inherit;
  --mat-expansion-header-text-tracking: inherit;
  --mat-expansion-container-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-expansion-container-text-line-height: 20px;
  --mat-expansion-container-text-size: 14px;
  --mat-expansion-container-text-tracking: 0.0178571429em;
  --mat-expansion-container-text-weight: 400;
}

html {
  --mat-grid-list-tile-header-primary-text-size: 14px;
  --mat-grid-list-tile-header-secondary-text-size: 12px;
  --mat-grid-list-tile-footer-primary-text-size: 14px;
  --mat-grid-list-tile-footer-secondary-text-size: 12px;
}

html {
  --mat-icon-color: inherit;
}

.mat-icon.mat-primary {
  --mat-icon-color: #0cabf5;
}
.mat-icon.mat-accent {
  --mat-icon-color: #0cabf5;
}
.mat-icon.mat-warn {
  --mat-icon-color: #f44336;
}

html {
  --mat-sidenav-container-shape: 0;
  --mat-sidenav-container-elevation-shadow: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12);
  --mat-sidenav-container-width: auto;
}

html {
  --mat-sidenav-container-divider-color: rgba(0, 0, 0, 0.12);
  --mat-sidenav-container-background-color: white;
  --mat-sidenav-container-text-color: rgba(0, 0, 0, 0.87);
  --mat-sidenav-content-background-color: #fafafa;
  --mat-sidenav-content-text-color: rgba(0, 0, 0, 0.87);
  --mat-sidenav-scrim-color: rgba(0, 0, 0, 0.6);
}

html {
  --mat-stepper-header-icon-foreground-color: rgba(0, 0, 0, 0.87);
  --mat-stepper-header-selected-state-icon-background-color: #0cabf5;
  --mat-stepper-header-selected-state-icon-foreground-color: rgba(0, 0, 0, 0.87);
  --mat-stepper-header-done-state-icon-background-color: #0cabf5;
  --mat-stepper-header-done-state-icon-foreground-color: rgba(0, 0, 0, 0.87);
  --mat-stepper-header-edit-state-icon-background-color: #0cabf5;
  --mat-stepper-header-edit-state-icon-foreground-color: rgba(0, 0, 0, 0.87);
  --mat-stepper-container-color: white;
  --mat-stepper-line-color: rgba(0, 0, 0, 0.12);
  --mat-stepper-header-hover-state-layer-color: rgba(0, 0, 0, 0.04);
  --mat-stepper-header-focus-state-layer-color: rgba(0, 0, 0, 0.04);
  --mat-stepper-header-label-text-color: rgba(0, 0, 0, 0.54);
  --mat-stepper-header-optional-label-text-color: rgba(0, 0, 0, 0.54);
  --mat-stepper-header-selected-state-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-stepper-header-error-state-label-text-color: #f44336;
  --mat-stepper-header-icon-background-color: rgba(0, 0, 0, 0.54);
  --mat-stepper-header-error-state-icon-foreground-color: #f44336;
  --mat-stepper-header-error-state-icon-background-color: transparent;
}
html .mat-step-header.mat-accent {
  --mat-stepper-header-icon-foreground-color: white;
  --mat-stepper-header-selected-state-icon-background-color: #0cabf5;
  --mat-stepper-header-selected-state-icon-foreground-color: white;
  --mat-stepper-header-done-state-icon-background-color: #0cabf5;
  --mat-stepper-header-done-state-icon-foreground-color: white;
  --mat-stepper-header-edit-state-icon-background-color: #0cabf5;
  --mat-stepper-header-edit-state-icon-foreground-color: white;
}
html .mat-step-header.mat-warn {
  --mat-stepper-header-icon-foreground-color: white;
  --mat-stepper-header-selected-state-icon-background-color: #f44336;
  --mat-stepper-header-selected-state-icon-foreground-color: white;
  --mat-stepper-header-done-state-icon-background-color: #f44336;
  --mat-stepper-header-done-state-icon-foreground-color: white;
  --mat-stepper-header-edit-state-icon-background-color: #f44336;
  --mat-stepper-header-edit-state-icon-foreground-color: white;
}

html {
  --mat-stepper-header-height: 72px;
}

html {
  --mat-stepper-container-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-stepper-header-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-stepper-header-label-text-size: 14px;
  --mat-stepper-header-label-text-weight: 400;
  --mat-stepper-header-error-state-label-text-size: 16px;
  --mat-stepper-header-selected-state-label-text-size: 16px;
  --mat-stepper-header-selected-state-label-text-weight: 400;
}

html {
  --mat-sort-arrow-color: rgb(117.3, 117.3, 117.3);
}

html {
  --mat-toolbar-container-background-color: whitesmoke;
  --mat-toolbar-container-text-color: rgba(0, 0, 0, 0.87);
}

.mat-toolbar.mat-primary {
  --mat-toolbar-container-background-color: #0cabf5;
  --mat-toolbar-container-text-color: rgba(0, 0, 0, 0.87);
}
.mat-toolbar.mat-accent {
  --mat-toolbar-container-background-color: #0cabf5;
  --mat-toolbar-container-text-color: white;
}
.mat-toolbar.mat-warn {
  --mat-toolbar-container-background-color: #f44336;
  --mat-toolbar-container-text-color: white;
}

html {
  --mat-toolbar-standard-height: 64px;
  --mat-toolbar-mobile-height: 56px;
}

html {
  --mat-toolbar-title-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-toolbar-title-text-line-height: 32px;
  --mat-toolbar-title-text-size: 20px;
  --mat-toolbar-title-text-tracking: 0.0125em;
  --mat-toolbar-title-text-weight: 500;
}

html {
  --mat-tree-container-background-color: white;
  --mat-tree-node-text-color: rgba(0, 0, 0, 0.87);
}

html {
  --mat-tree-node-min-height: 48px;
}

html {
  --mat-tree-node-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-tree-node-text-size: 14px;
  --mat-tree-node-text-weight: 400;
}

html {
  --mat-timepicker-container-shape: 4px;
  --mat-timepicker-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
}

html {
  --mat-timepicker-container-background-color: white;
}

html {
  --mat-badge-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-badge-line-height: 22px;
  --mat-badge-text-size: 12px;
  --mat-badge-text-weight: 600;
  --mat-badge-small-size-text-size: 9px;
  --mat-badge-small-size-line-height: 16px;
  --mat-badge-large-size-text-size: 24px;
  --mat-badge-large-size-line-height: 28px;
}

.mat-h1,
.mat-headline-5,
.mat-typography .mat-h1,
.mat-typography .mat-headline-5,
.mat-typography h1 {
  font: 400 24px / 32px 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  letter-spacing: normal;
  margin: 0 0 16px;
}

.mat-h2,
.mat-headline-6,
.mat-typography .mat-h2,
.mat-typography .mat-headline-6,
.mat-typography h2 {
  font: 500 20px / 32px 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  letter-spacing: 0.0125em;
  margin: 0 0 16px;
}

.mat-h3,
.mat-subtitle-1,
.mat-typography .mat-h3,
.mat-typography .mat-subtitle-1,
.mat-typography h3 {
  font: 400 16px / 28px 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  letter-spacing: 0.009375em;
  margin: 0 0 16px;
}

.mat-h4,
.mat-body-1,
.mat-typography .mat-h4,
.mat-typography .mat-body-1,
.mat-typography h4 {
  font: 400 16px / 24px 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  letter-spacing: 0.03125em;
  margin: 0 0 16px;
}

.mat-h5,
.mat-typography .mat-h5,
.mat-typography h5 {
  font: 400 calc(14px * 0.83) / 20px 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  margin: 0 0 12px;
}

.mat-h6,
.mat-typography .mat-h6,
.mat-typography h6 {
  font: 400 calc(14px * 0.67) / 20px 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  margin: 0 0 12px;
}

.mat-body-strong,
.mat-subtitle-2,
.mat-typography .mat-body-strong,
.mat-typography .mat-subtitle-2 {
  font: 500 14px / 22px 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  letter-spacing: 0.0071428571em;
}

.mat-body,
.mat-body-2,
.mat-typography .mat-body,
.mat-typography .mat-body-2,
.mat-typography {
  font: 400 14px / 20px 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  letter-spacing: 0.0178571429em;
}
.mat-body p,
.mat-body-2 p,
.mat-typography .mat-body p,
.mat-typography .mat-body-2 p,
.mat-typography p {
  margin: 0 0 12px;
}

.mat-small,
.mat-caption,
.mat-typography .mat-small,
.mat-typography .mat-caption {
  font: 400 12px / 20px 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  letter-spacing: 0.0333333333em;
}

.mat-headline-1,
.mat-typography .mat-headline-1 {
  font: 300 96px / 96px 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  letter-spacing: -0.015625em;
  margin: 0 0 56px;
}

.mat-headline-2,
.mat-typography .mat-headline-2 {
  font: 300 60px / 60px 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  letter-spacing: -0.0083333333em;
  margin: 0 0 64px;
}

.mat-headline-3,
.mat-typography .mat-headline-3 {
  font: 400 48px / 50px 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  letter-spacing: normal;
  margin: 0 0 64px;
}

.mat-headline-4,
.mat-typography .mat-headline-4 {
  font: 400 34px / 40px 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  letter-spacing: 0.0073529412em;
  margin: 0 0 64px;
}

html {
  --mat-bottom-sheet-container-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-bottom-sheet-container-text-line-height: 20px;
  --mat-bottom-sheet-container-text-size: 14px;
  --mat-bottom-sheet-container-text-tracking: 0.0178571429em;
  --mat-bottom-sheet-container-text-weight: 400;
}

html {
  --mat-legacy-button-toggle-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-legacy-button-toggle-label-text-line-height: 24px;
  --mat-legacy-button-toggle-label-text-size: 16px;
  --mat-legacy-button-toggle-label-text-tracking: 0.03125em;
  --mat-legacy-button-toggle-label-text-weight: 400;
}
html {
  --mat-standard-button-toggle-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-standard-button-toggle-label-text-line-height: 24px;
  --mat-standard-button-toggle-label-text-size: 16px;
  --mat-standard-button-toggle-label-text-tracking: 0.03125em;
  --mat-standard-button-toggle-label-text-weight: 400;
}

html {
  --mat-datepicker-calendar-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-datepicker-calendar-text-size: 13px;
  --mat-datepicker-calendar-body-label-text-size: 14px;
  --mat-datepicker-calendar-body-label-text-weight: 500;
  --mat-datepicker-calendar-period-button-text-size: 14px;
  --mat-datepicker-calendar-period-button-text-weight: 500;
  --mat-datepicker-calendar-header-text-size: 11px;
  --mat-datepicker-calendar-header-text-weight: 400;
}

html {
  --mat-expansion-header-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-expansion-header-text-size: 14px;
  --mat-expansion-header-text-weight: 500;
  --mat-expansion-header-text-line-height: inherit;
  --mat-expansion-header-text-tracking: inherit;
  --mat-expansion-container-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-expansion-container-text-line-height: 20px;
  --mat-expansion-container-text-size: 14px;
  --mat-expansion-container-text-tracking: 0.0178571429em;
  --mat-expansion-container-text-weight: 400;
}

html {
  --mat-grid-list-tile-header-primary-text-size: 14px;
  --mat-grid-list-tile-header-secondary-text-size: 12px;
  --mat-grid-list-tile-footer-primary-text-size: 14px;
  --mat-grid-list-tile-footer-secondary-text-size: 12px;
}

html {
  --mat-stepper-container-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-stepper-header-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-stepper-header-label-text-size: 14px;
  --mat-stepper-header-label-text-weight: 400;
  --mat-stepper-header-error-state-label-text-size: 16px;
  --mat-stepper-header-selected-state-label-text-size: 16px;
  --mat-stepper-header-selected-state-label-text-weight: 400;
}

html {
  --mat-toolbar-title-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-toolbar-title-text-line-height: 32px;
  --mat-toolbar-title-text-size: 20px;
  --mat-toolbar-title-text-tracking: 0.0125em;
  --mat-toolbar-title-text-weight: 500;
}

html {
  --mat-tree-node-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-tree-node-text-size: 14px;
  --mat-tree-node-text-weight: 400;
}

html {
  --mat-option-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-option-label-text-line-height: 24px;
  --mat-option-label-text-size: 16px;
  --mat-option-label-text-tracking: 0.03125em;
  --mat-option-label-text-weight: 400;
}

html {
  --mat-optgroup-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-optgroup-label-text-line-height: 24px;
  --mat-optgroup-label-text-size: 16px;
  --mat-optgroup-label-text-tracking: 0.03125em;
  --mat-optgroup-label-text-weight: 400;
}

html {
  --mat-card-title-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-card-title-text-line-height: 32px;
  --mat-card-title-text-size: 20px;
  --mat-card-title-text-tracking: 0.0125em;
  --mat-card-title-text-weight: 500;
  --mat-card-subtitle-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-card-subtitle-text-line-height: 22px;
  --mat-card-subtitle-text-size: 14px;
  --mat-card-subtitle-text-tracking: 0.0071428571em;
  --mat-card-subtitle-text-weight: 500;
}

html {
  --mdc-plain-tooltip-supporting-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-plain-tooltip-supporting-text-size: 12px;
  --mdc-plain-tooltip-supporting-text-weight: 400;
  --mdc-plain-tooltip-supporting-text-tracking: 0.0333333333em;
}

html {
  --mdc-filled-text-field-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-filled-text-field-label-text-size: 16px;
  --mdc-filled-text-field-label-text-tracking: 0.03125em;
  --mdc-filled-text-field-label-text-weight: 400;
}
html {
  --mdc-outlined-text-field-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-outlined-text-field-label-text-size: 16px;
  --mdc-outlined-text-field-label-text-tracking: 0.03125em;
  --mdc-outlined-text-field-label-text-weight: 400;
}
html {
  --mat-form-field-container-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-form-field-container-text-line-height: 24px;
  --mat-form-field-container-text-size: 16px;
  --mat-form-field-container-text-tracking: 0.03125em;
  --mat-form-field-container-text-weight: 400;
  --mat-form-field-outlined-label-text-populated-size: 16px;
  --mat-form-field-subscript-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-form-field-subscript-text-line-height: 20px;
  --mat-form-field-subscript-text-size: 12px;
  --mat-form-field-subscript-text-tracking: 0.0333333333em;
  --mat-form-field-subscript-text-weight: 400;
}

html {
  --mat-select-trigger-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-select-trigger-text-line-height: 24px;
  --mat-select-trigger-text-size: 16px;
  --mat-select-trigger-text-tracking: 0.03125em;
  --mat-select-trigger-text-weight: 400;
}

html {
  --mdc-dialog-subhead-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-dialog-subhead-line-height: 32px;
  --mdc-dialog-subhead-size: 20px;
  --mdc-dialog-subhead-weight: 500;
  --mdc-dialog-subhead-tracking: 0.0125em;
  --mdc-dialog-supporting-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-dialog-supporting-text-line-height: 24px;
  --mdc-dialog-supporting-text-size: 16px;
  --mdc-dialog-supporting-text-weight: 400;
  --mdc-dialog-supporting-text-tracking: 0.03125em;
}
.mat-mdc-standard-chip {
  --mdc-chip-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-chip-label-text-line-height: 20px;
  --mdc-chip-label-text-size: 14px;
  --mdc-chip-label-text-tracking: 0.0178571429em;
  --mdc-chip-label-text-weight: 400;
}
html .mat-mdc-slide-toggle {
  --mat-switch-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-switch-label-text-line-height: 20px;
  --mat-switch-label-text-size: 14px;
  --mat-switch-label-text-tracking: 0.0178571429em;
  --mat-switch-label-text-weight: 400;
}

html {
  --mat-radio-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-radio-label-text-line-height: 20px;
  --mat-radio-label-text-size: 14px;
  --mat-radio-label-text-tracking: 0.0178571429em;
  --mat-radio-label-text-weight: 400;
}

html {
  --mdc-slider-label-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-slider-label-label-text-size: 14px;
  --mdc-slider-label-label-text-line-height: 22px;
  --mdc-slider-label-label-text-tracking: 0.0071428571em;
  --mdc-slider-label-label-text-weight: 500;
}

html {
  --mat-menu-item-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-menu-item-label-text-size: 16px;
  --mat-menu-item-label-text-tracking: 0.03125em;
  --mat-menu-item-label-text-line-height: 24px;
  --mat-menu-item-label-text-weight: 400;
}

html {
  --mdc-list-list-item-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-list-list-item-label-text-line-height: 24px;
  --mdc-list-list-item-label-text-size: 16px;
  --mdc-list-list-item-label-text-tracking: 0.03125em;
  --mdc-list-list-item-label-text-weight: 400;
  --mdc-list-list-item-supporting-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-list-list-item-supporting-text-line-height: 20px;
  --mdc-list-list-item-supporting-text-size: 14px;
  --mdc-list-list-item-supporting-text-tracking: 0.0178571429em;
  --mdc-list-list-item-supporting-text-weight: 400;
  --mdc-list-list-item-trailing-supporting-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-list-list-item-trailing-supporting-text-line-height: 20px;
  --mdc-list-list-item-trailing-supporting-text-size: 12px;
  --mdc-list-list-item-trailing-supporting-text-tracking: 0.0333333333em;
  --mdc-list-list-item-trailing-supporting-text-weight: 400;
}
.mdc-list-group__subheader {
  font: 400 16px / 28px 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  letter-spacing: 0.009375em;
}

html {
  --mat-paginator-container-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-paginator-container-text-line-height: 20px;
  --mat-paginator-container-text-size: 12px;
  --mat-paginator-container-text-tracking: 0.0333333333em;
  --mat-paginator-container-text-weight: 400;
  --mat-paginator-select-trigger-text-size: 12px;
}

.mat-mdc-tab-header {
  --mat-tab-header-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-tab-header-label-text-size: 14px;
  --mat-tab-header-label-text-tracking: 0.0892857143em;
  --mat-tab-header-label-text-line-height: 36px;
  --mat-tab-header-label-text-weight: 500;
}
html {
  --mat-checkbox-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-checkbox-label-text-line-height: 20px;
  --mat-checkbox-label-text-size: 14px;
  --mat-checkbox-label-text-tracking: 0.0178571429em;
  --mat-checkbox-label-text-weight: 400;
}

html {
  --mdc-text-button-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-text-button-label-text-size: 14px;
  --mdc-text-button-label-text-tracking: 0.0892857143em;
  --mdc-text-button-label-text-weight: 500;
  --mdc-text-button-label-text-transform: none;
}
html {
  --mdc-filled-button-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-filled-button-label-text-size: 14px;
  --mdc-filled-button-label-text-tracking: 0.0892857143em;
  --mdc-filled-button-label-text-weight: 500;
  --mdc-filled-button-label-text-transform: none;
}
html {
  --mdc-protected-button-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-protected-button-label-text-size: 14px;
  --mdc-protected-button-label-text-tracking: 0.0892857143em;
  --mdc-protected-button-label-text-weight: 500;
  --mdc-protected-button-label-text-transform: none;
}
html {
  --mdc-outlined-button-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-outlined-button-label-text-size: 14px;
  --mdc-outlined-button-label-text-tracking: 0.0892857143em;
  --mdc-outlined-button-label-text-weight: 500;
  --mdc-outlined-button-label-text-transform: none;
}
html {
  --mdc-extended-fab-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-extended-fab-label-text-size: 14px;
  --mdc-extended-fab-label-text-tracking: 0.0892857143em;
  --mdc-extended-fab-label-text-weight: 500;
}
html {
  --mdc-snackbar-supporting-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-snackbar-supporting-text-line-height: 20px;
  --mdc-snackbar-supporting-text-size: 14px;
  --mdc-snackbar-supporting-text-weight: 400;
}

html {
  --mat-table-header-headline-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-table-header-headline-line-height: 22px;
  --mat-table-header-headline-size: 14px;
  --mat-table-header-headline-weight: 500;
  --mat-table-header-headline-tracking: 0.0071428571em;
  --mat-table-row-item-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-table-row-item-label-text-line-height: 20px;
  --mat-table-row-item-label-text-size: 14px;
  --mat-table-row-item-label-text-weight: 400;
  --mat-table-row-item-label-text-tracking: 0.0178571429em;
  --mat-table-footer-supporting-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-table-footer-supporting-text-line-height: 20px;
  --mat-table-footer-supporting-text-size: 14px;
  --mat-table-footer-supporting-text-weight: 400;
  --mat-table-footer-supporting-text-tracking: 0.0178571429em;
}

.mat-icon {
  color: inherit !important;
}

.eng-theme--light {
  background-color: #ffffff;
  color: rgba(0, 0, 0, 0.87);
  --text-color: rgba(0, 0, 0, 0.87);
}
.eng-theme--light {
  --mat-ripple-color: rgba(0, 0, 0, 0.1);
}
.eng-theme--light {
  --mat-option-selected-state-label-text-color: #0cabf5;
  --mat-option-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-option-hover-state-layer-color: rgba(0, 0, 0, 0.04);
  --mat-option-focus-state-layer-color: rgba(0, 0, 0, 0.04);
  --mat-option-selected-state-layer-color: rgba(0, 0, 0, 0.04);
}
.eng-theme--light .mat-accent {
  --mat-option-selected-state-label-text-color: #0cabf5;
  --mat-option-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-option-hover-state-layer-color: rgba(0, 0, 0, 0.04);
  --mat-option-focus-state-layer-color: rgba(0, 0, 0, 0.04);
  --mat-option-selected-state-layer-color: rgba(0, 0, 0, 0.04);
}
.eng-theme--light .mat-warn {
  --mat-option-selected-state-label-text-color: #f44336;
  --mat-option-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-option-hover-state-layer-color: rgba(0, 0, 0, 0.04);
  --mat-option-focus-state-layer-color: rgba(0, 0, 0, 0.04);
  --mat-option-selected-state-layer-color: rgba(0, 0, 0, 0.04);
}
.eng-theme--light {
  --mat-optgroup-label-text-color: rgba(0, 0, 0, 0.87);
}
.eng-theme--light {
  --mat-full-pseudo-checkbox-selected-icon-color: #0cabf5;
  --mat-full-pseudo-checkbox-selected-checkmark-color: #fafafa;
  --mat-full-pseudo-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mat-full-pseudo-checkbox-disabled-selected-checkmark-color: #fafafa;
  --mat-full-pseudo-checkbox-disabled-unselected-icon-color: #b0b0b0;
  --mat-full-pseudo-checkbox-disabled-selected-icon-color: #b0b0b0;
}
.eng-theme--light {
  --mat-minimal-pseudo-checkbox-selected-checkmark-color: #0cabf5;
  --mat-minimal-pseudo-checkbox-disabled-selected-checkmark-color: #b0b0b0;
}
.eng-theme--light .mat-primary {
  --mat-full-pseudo-checkbox-selected-icon-color: #0cabf5;
  --mat-full-pseudo-checkbox-selected-checkmark-color: #fafafa;
  --mat-full-pseudo-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mat-full-pseudo-checkbox-disabled-selected-checkmark-color: #fafafa;
  --mat-full-pseudo-checkbox-disabled-unselected-icon-color: #b0b0b0;
  --mat-full-pseudo-checkbox-disabled-selected-icon-color: #b0b0b0;
}
.eng-theme--light .mat-primary {
  --mat-minimal-pseudo-checkbox-selected-checkmark-color: #0cabf5;
  --mat-minimal-pseudo-checkbox-disabled-selected-checkmark-color: #b0b0b0;
}
.eng-theme--light .mat-accent {
  --mat-full-pseudo-checkbox-selected-icon-color: #0cabf5;
  --mat-full-pseudo-checkbox-selected-checkmark-color: #fafafa;
  --mat-full-pseudo-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mat-full-pseudo-checkbox-disabled-selected-checkmark-color: #fafafa;
  --mat-full-pseudo-checkbox-disabled-unselected-icon-color: #b0b0b0;
  --mat-full-pseudo-checkbox-disabled-selected-icon-color: #b0b0b0;
}
.eng-theme--light .mat-accent {
  --mat-minimal-pseudo-checkbox-selected-checkmark-color: #0cabf5;
  --mat-minimal-pseudo-checkbox-disabled-selected-checkmark-color: #b0b0b0;
}
.eng-theme--light .mat-warn {
  --mat-full-pseudo-checkbox-selected-icon-color: #f44336;
  --mat-full-pseudo-checkbox-selected-checkmark-color: #fafafa;
  --mat-full-pseudo-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mat-full-pseudo-checkbox-disabled-selected-checkmark-color: #fafafa;
  --mat-full-pseudo-checkbox-disabled-unselected-icon-color: #b0b0b0;
  --mat-full-pseudo-checkbox-disabled-selected-icon-color: #b0b0b0;
}
.eng-theme--light .mat-warn {
  --mat-minimal-pseudo-checkbox-selected-checkmark-color: #f44336;
  --mat-minimal-pseudo-checkbox-disabled-selected-checkmark-color: #b0b0b0;
}
.eng-theme--light {
  --mat-app-background-color: #fafafa;
  --mat-app-text-color: rgba(0, 0, 0, 0.87);
  --mat-app-elevation-shadow-level-0: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-1: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-2: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-3: 0px 3px 3px -2px rgba(0, 0, 0, 0.2), 0px 3px 4px 0px rgba(0, 0, 0, 0.14), 0px 1px 8px 0px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-4: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-5: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 5px 8px 0px rgba(0, 0, 0, 0.14), 0px 1px 14px 0px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-6: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-7: 0px 4px 5px -2px rgba(0, 0, 0, 0.2), 0px 7px 10px 1px rgba(0, 0, 0, 0.14), 0px 2px 16px 1px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-8: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-9: 0px 5px 6px -3px rgba(0, 0, 0, 0.2), 0px 9px 12px 1px rgba(0, 0, 0, 0.14), 0px 3px 16px 2px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-10: 0px 6px 6px -3px rgba(0, 0, 0, 0.2), 0px 10px 14px 1px rgba(0, 0, 0, 0.14), 0px 4px 18px 3px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-11: 0px 6px 7px -4px rgba(0, 0, 0, 0.2), 0px 11px 15px 1px rgba(0, 0, 0, 0.14), 0px 4px 20px 3px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-12: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-13: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 13px 19px 2px rgba(0, 0, 0, 0.14), 0px 5px 24px 4px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-14: 0px 7px 9px -4px rgba(0, 0, 0, 0.2), 0px 14px 21px 2px rgba(0, 0, 0, 0.14), 0px 5px 26px 4px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-15: 0px 8px 9px -5px rgba(0, 0, 0, 0.2), 0px 15px 22px 2px rgba(0, 0, 0, 0.14), 0px 6px 28px 5px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-16: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-17: 0px 8px 11px -5px rgba(0, 0, 0, 0.2), 0px 17px 26px 2px rgba(0, 0, 0, 0.14), 0px 6px 32px 5px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-18: 0px 9px 11px -5px rgba(0, 0, 0, 0.2), 0px 18px 28px 2px rgba(0, 0, 0, 0.14), 0px 7px 34px 6px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-19: 0px 9px 12px -6px rgba(0, 0, 0, 0.2), 0px 19px 29px 2px rgba(0, 0, 0, 0.14), 0px 7px 36px 6px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-20: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 20px 31px 3px rgba(0, 0, 0, 0.14), 0px 8px 38px 7px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-21: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 21px 33px 3px rgba(0, 0, 0, 0.14), 0px 8px 40px 7px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-22: 0px 10px 14px -6px rgba(0, 0, 0, 0.2), 0px 22px 35px 3px rgba(0, 0, 0, 0.14), 0px 8px 42px 7px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-23: 0px 11px 14px -7px rgba(0, 0, 0, 0.2), 0px 23px 36px 3px rgba(0, 0, 0, 0.14), 0px 9px 44px 8px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-24: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
}
.eng-theme--light {
  --mat-option-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-option-label-text-line-height: 24px;
  --mat-option-label-text-size: 16px;
  --mat-option-label-text-tracking: 0.03125em;
  --mat-option-label-text-weight: 400;
}
.eng-theme--light {
  --mat-optgroup-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-optgroup-label-text-line-height: 24px;
  --mat-optgroup-label-text-size: 16px;
  --mat-optgroup-label-text-tracking: 0.03125em;
  --mat-optgroup-label-text-weight: 400;
}
.eng-theme--light {
  --mdc-elevated-card-container-shape: 4px;
}
.eng-theme--light {
  --mdc-outlined-card-container-shape: 4px;
  --mdc-outlined-card-outline-width: 1px;
}
.eng-theme--light {
  --mdc-elevated-card-container-color: white;
  --mdc-elevated-card-container-elevation: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);
}
.eng-theme--light {
  --mdc-outlined-card-container-color: white;
  --mdc-outlined-card-outline-color: rgba(0, 0, 0, 0.12);
  --mdc-outlined-card-container-elevation: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);
}
.eng-theme--light {
  --mat-card-subtitle-text-color: rgba(0, 0, 0, 0.54);
}
.eng-theme--light {
  --mat-card-title-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-card-title-text-line-height: 32px;
  --mat-card-title-text-size: 20px;
  --mat-card-title-text-tracking: 0.0125em;
  --mat-card-title-text-weight: 500;
  --mat-card-subtitle-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-card-subtitle-text-line-height: 22px;
  --mat-card-subtitle-text-size: 14px;
  --mat-card-subtitle-text-tracking: 0.0071428571em;
  --mat-card-subtitle-text-weight: 500;
}
.eng-theme--light {
  --mdc-linear-progress-active-indicator-height: 4px;
  --mdc-linear-progress-track-height: 4px;
  --mdc-linear-progress-track-shape: 0;
}
.eng-theme--light .mat-mdc-progress-bar {
  --mdc-linear-progress-active-indicator-color: #0cabf5;
  --mdc-linear-progress-track-color: rgba(12, 171, 245, 0.25);
}
.eng-theme--light .mat-mdc-progress-bar.mat-accent {
  --mdc-linear-progress-active-indicator-color: #0cabf5;
  --mdc-linear-progress-track-color: rgba(12, 171, 245, 0.25);
}
.eng-theme--light .mat-mdc-progress-bar.mat-warn {
  --mdc-linear-progress-active-indicator-color: #f44336;
  --mdc-linear-progress-track-color: rgba(244, 67, 54, 0.25);
}
.eng-theme--light {
  --mdc-plain-tooltip-container-shape: 4px;
  --mdc-plain-tooltip-supporting-text-line-height: 16px;
}
.eng-theme--light {
  --mdc-plain-tooltip-container-color: #616161;
  --mdc-plain-tooltip-supporting-text-color: #fff;
}
.eng-theme--light {
  --mdc-plain-tooltip-supporting-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-plain-tooltip-supporting-text-size: 12px;
  --mdc-plain-tooltip-supporting-text-weight: 400;
  --mdc-plain-tooltip-supporting-text-tracking: 0.0333333333em;
}
.eng-theme--light {
  --mdc-filled-text-field-active-indicator-height: 1px;
  --mdc-filled-text-field-focus-active-indicator-height: 2px;
  --mdc-filled-text-field-container-shape: 4px;
}
.eng-theme--light {
  --mdc-outlined-text-field-outline-width: 1px;
  --mdc-outlined-text-field-focus-outline-width: 2px;
  --mdc-outlined-text-field-container-shape: 4px;
}
.eng-theme--light {
  --mdc-filled-text-field-caret-color: #0cabf5;
  --mdc-filled-text-field-focus-active-indicator-color: #0cabf5;
  --mdc-filled-text-field-focus-label-text-color: rgba(12, 171, 245, 0.87);
  --mdc-filled-text-field-container-color: rgb(244.8, 244.8, 244.8);
  --mdc-filled-text-field-disabled-container-color: rgb(249.9, 249.9, 249.9);
  --mdc-filled-text-field-label-text-color: rgba(0, 0, 0, 0.6);
  --mdc-filled-text-field-hover-label-text-color: rgba(0, 0, 0, 0.6);
  --mdc-filled-text-field-disabled-label-text-color: rgba(0, 0, 0, 0.38);
  --mdc-filled-text-field-input-text-color: rgba(0, 0, 0, 0.87);
  --mdc-filled-text-field-disabled-input-text-color: rgba(0, 0, 0, 0.38);
  --mdc-filled-text-field-input-text-placeholder-color: rgba(0, 0, 0, 0.6);
  --mdc-filled-text-field-error-hover-label-text-color: #f44336;
  --mdc-filled-text-field-error-focus-label-text-color: #f44336;
  --mdc-filled-text-field-error-label-text-color: #f44336;
  --mdc-filled-text-field-error-caret-color: #f44336;
  --mdc-filled-text-field-active-indicator-color: rgba(0, 0, 0, 0.42);
  --mdc-filled-text-field-disabled-active-indicator-color: rgba(0, 0, 0, 0.06);
  --mdc-filled-text-field-hover-active-indicator-color: rgba(0, 0, 0, 0.87);
  --mdc-filled-text-field-error-active-indicator-color: #f44336;
  --mdc-filled-text-field-error-focus-active-indicator-color: #f44336;
  --mdc-filled-text-field-error-hover-active-indicator-color: #f44336;
}
.eng-theme--light {
  --mdc-outlined-text-field-caret-color: #0cabf5;
  --mdc-outlined-text-field-focus-outline-color: #0cabf5;
  --mdc-outlined-text-field-focus-label-text-color: rgba(12, 171, 245, 0.87);
  --mdc-outlined-text-field-label-text-color: rgba(0, 0, 0, 0.6);
  --mdc-outlined-text-field-hover-label-text-color: rgba(0, 0, 0, 0.6);
  --mdc-outlined-text-field-disabled-label-text-color: rgba(0, 0, 0, 0.38);
  --mdc-outlined-text-field-input-text-color: rgba(0, 0, 0, 0.87);
  --mdc-outlined-text-field-disabled-input-text-color: rgba(0, 0, 0, 0.38);
  --mdc-outlined-text-field-input-text-placeholder-color: rgba(0, 0, 0, 0.6);
  --mdc-outlined-text-field-error-caret-color: #f44336;
  --mdc-outlined-text-field-error-focus-label-text-color: #f44336;
  --mdc-outlined-text-field-error-label-text-color: #f44336;
  --mdc-outlined-text-field-error-hover-label-text-color: #f44336;
  --mdc-outlined-text-field-outline-color: rgba(0, 0, 0, 0.38);
  --mdc-outlined-text-field-disabled-outline-color: rgba(0, 0, 0, 0.06);
  --mdc-outlined-text-field-hover-outline-color: rgba(0, 0, 0, 0.87);
  --mdc-outlined-text-field-error-focus-outline-color: #f44336;
  --mdc-outlined-text-field-error-hover-outline-color: #f44336;
  --mdc-outlined-text-field-error-outline-color: #f44336;
}
.eng-theme--light {
  --mat-form-field-focus-select-arrow-color: rgba(12, 171, 245, 0.87);
  --mat-form-field-disabled-input-text-placeholder-color: rgba(0, 0, 0, 0.38);
  --mat-form-field-state-layer-color: rgba(0, 0, 0, 0.87);
  --mat-form-field-error-text-color: #f44336;
  --mat-form-field-select-option-text-color: inherit;
  --mat-form-field-select-disabled-option-text-color: GrayText;
  --mat-form-field-leading-icon-color: unset;
  --mat-form-field-disabled-leading-icon-color: unset;
  --mat-form-field-trailing-icon-color: unset;
  --mat-form-field-disabled-trailing-icon-color: unset;
  --mat-form-field-error-focus-trailing-icon-color: unset;
  --mat-form-field-error-hover-trailing-icon-color: unset;
  --mat-form-field-error-trailing-icon-color: unset;
  --mat-form-field-enabled-select-arrow-color: rgba(0, 0, 0, 0.54);
  --mat-form-field-disabled-select-arrow-color: rgba(0, 0, 0, 0.38);
  --mat-form-field-hover-state-layer-opacity: 0.04;
  --mat-form-field-focus-state-layer-opacity: 0.08;
}
.eng-theme--light .mat-mdc-form-field.mat-accent {
  --mdc-filled-text-field-caret-color: #0cabf5;
  --mdc-filled-text-field-focus-active-indicator-color: #0cabf5;
  --mdc-filled-text-field-focus-label-text-color: rgba(12, 171, 245, 0.87);
}
.eng-theme--light .mat-mdc-form-field.mat-accent {
  --mdc-outlined-text-field-caret-color: #0cabf5;
  --mdc-outlined-text-field-focus-outline-color: #0cabf5;
  --mdc-outlined-text-field-focus-label-text-color: rgba(12, 171, 245, 0.87);
}
.eng-theme--light .mat-mdc-form-field.mat-accent {
  --mat-form-field-focus-select-arrow-color: rgba(12, 171, 245, 0.87);
}
.eng-theme--light .mat-mdc-form-field.mat-warn {
  --mdc-filled-text-field-caret-color: #f44336;
  --mdc-filled-text-field-focus-active-indicator-color: #f44336;
  --mdc-filled-text-field-focus-label-text-color: rgba(244, 67, 54, 0.87);
}
.eng-theme--light .mat-mdc-form-field.mat-warn {
  --mdc-outlined-text-field-caret-color: #f44336;
  --mdc-outlined-text-field-focus-outline-color: #f44336;
  --mdc-outlined-text-field-focus-label-text-color: rgba(244, 67, 54, 0.87);
}
.eng-theme--light .mat-mdc-form-field.mat-warn {
  --mat-form-field-focus-select-arrow-color: rgba(244, 67, 54, 0.87);
}
.eng-theme--light {
  --mat-form-field-container-height: 56px;
  --mat-form-field-filled-label-display: block;
  --mat-form-field-container-vertical-padding: 16px;
  --mat-form-field-filled-with-label-container-padding-top: 24px;
  --mat-form-field-filled-with-label-container-padding-bottom: 8px;
}
.eng-theme--light {
  --mdc-filled-text-field-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-filled-text-field-label-text-size: 16px;
  --mdc-filled-text-field-label-text-tracking: 0.03125em;
  --mdc-filled-text-field-label-text-weight: 400;
}
.eng-theme--light {
  --mdc-outlined-text-field-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-outlined-text-field-label-text-size: 16px;
  --mdc-outlined-text-field-label-text-tracking: 0.03125em;
  --mdc-outlined-text-field-label-text-weight: 400;
}
.eng-theme--light {
  --mat-form-field-container-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-form-field-container-text-line-height: 24px;
  --mat-form-field-container-text-size: 16px;
  --mat-form-field-container-text-tracking: 0.03125em;
  --mat-form-field-container-text-weight: 400;
  --mat-form-field-outlined-label-text-populated-size: 16px;
  --mat-form-field-subscript-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-form-field-subscript-text-line-height: 20px;
  --mat-form-field-subscript-text-size: 12px;
  --mat-form-field-subscript-text-tracking: 0.0333333333em;
  --mat-form-field-subscript-text-weight: 400;
}
.eng-theme--light {
  --mat-select-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
}
.eng-theme--light {
  --mat-select-panel-background-color: white;
  --mat-select-enabled-trigger-text-color: rgba(0, 0, 0, 0.87);
  --mat-select-disabled-trigger-text-color: rgba(0, 0, 0, 0.38);
  --mat-select-placeholder-text-color: rgba(0, 0, 0, 0.6);
  --mat-select-enabled-arrow-color: rgba(0, 0, 0, 0.54);
  --mat-select-disabled-arrow-color: rgba(0, 0, 0, 0.38);
  --mat-select-focused-arrow-color: rgba(12, 171, 245, 0.87);
  --mat-select-invalid-arrow-color: rgba(244, 67, 54, 0.87);
}
.eng-theme--light .mat-mdc-form-field.mat-accent {
  --mat-select-panel-background-color: white;
  --mat-select-enabled-trigger-text-color: rgba(0, 0, 0, 0.87);
  --mat-select-disabled-trigger-text-color: rgba(0, 0, 0, 0.38);
  --mat-select-placeholder-text-color: rgba(0, 0, 0, 0.6);
  --mat-select-enabled-arrow-color: rgba(0, 0, 0, 0.54);
  --mat-select-disabled-arrow-color: rgba(0, 0, 0, 0.38);
  --mat-select-focused-arrow-color: rgba(12, 171, 245, 0.87);
  --mat-select-invalid-arrow-color: rgba(244, 67, 54, 0.87);
}
.eng-theme--light .mat-mdc-form-field.mat-warn {
  --mat-select-panel-background-color: white;
  --mat-select-enabled-trigger-text-color: rgba(0, 0, 0, 0.87);
  --mat-select-disabled-trigger-text-color: rgba(0, 0, 0, 0.38);
  --mat-select-placeholder-text-color: rgba(0, 0, 0, 0.6);
  --mat-select-enabled-arrow-color: rgba(0, 0, 0, 0.54);
  --mat-select-disabled-arrow-color: rgba(0, 0, 0, 0.38);
  --mat-select-focused-arrow-color: rgba(244, 67, 54, 0.87);
  --mat-select-invalid-arrow-color: rgba(244, 67, 54, 0.87);
}
.eng-theme--light {
  --mat-select-arrow-transform: translateY(-8px);
}
.eng-theme--light {
  --mat-select-trigger-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-select-trigger-text-line-height: 24px;
  --mat-select-trigger-text-size: 16px;
  --mat-select-trigger-text-tracking: 0.03125em;
  --mat-select-trigger-text-weight: 400;
}
.eng-theme--light {
  --mat-autocomplete-container-shape: 4px;
  --mat-autocomplete-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
}
.eng-theme--light {
  --mat-autocomplete-background-color: white;
}
.eng-theme--light {
  --mdc-dialog-container-shape: 4px;
}
.eng-theme--light {
  --mat-dialog-container-elevation-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
  --mat-dialog-container-max-width: 80vw;
  --mat-dialog-container-small-max-width: 80vw;
  --mat-dialog-container-min-width: 0;
  --mat-dialog-actions-alignment: start;
  --mat-dialog-actions-padding: 8px;
  --mat-dialog-content-padding: 20px 24px;
  --mat-dialog-with-actions-content-padding: 20px 24px;
  --mat-dialog-headline-padding: 0 24px 9px;
}
.eng-theme--light {
  --mdc-dialog-container-color: white;
  --mdc-dialog-subhead-color: rgba(0, 0, 0, 0.87);
  --mdc-dialog-supporting-text-color: rgba(0, 0, 0, 0.6);
}
.eng-theme--light {
  --mdc-dialog-subhead-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-dialog-subhead-line-height: 32px;
  --mdc-dialog-subhead-size: 20px;
  --mdc-dialog-subhead-weight: 500;
  --mdc-dialog-subhead-tracking: 0.0125em;
  --mdc-dialog-supporting-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-dialog-supporting-text-line-height: 24px;
  --mdc-dialog-supporting-text-size: 16px;
  --mdc-dialog-supporting-text-weight: 400;
  --mdc-dialog-supporting-text-tracking: 0.03125em;
}
.eng-theme--light .mat-mdc-standard-chip {
  --mdc-chip-container-shape-radius: 16px;
  --mdc-chip-with-avatar-avatar-shape-radius: 14px;
  --mdc-chip-with-avatar-avatar-size: 28px;
  --mdc-chip-with-icon-icon-size: 18px;
  --mdc-chip-outline-width: 0;
  --mdc-chip-outline-color: transparent;
  --mdc-chip-disabled-outline-color: transparent;
  --mdc-chip-focus-outline-color: transparent;
  --mdc-chip-hover-state-layer-opacity: 0.04;
  --mdc-chip-with-avatar-disabled-avatar-opacity: 1;
  --mdc-chip-flat-selected-outline-width: 0;
  --mdc-chip-selected-hover-state-layer-opacity: 0.04;
  --mdc-chip-with-trailing-icon-disabled-trailing-icon-opacity: 1;
  --mdc-chip-with-icon-disabled-icon-opacity: 1;
}
.eng-theme--light .mat-mdc-standard-chip {
  --mat-chip-disabled-container-opacity: 0.4;
  --mat-chip-trailing-action-opacity: 0.54;
  --mat-chip-trailing-action-focus-opacity: 1;
  --mat-chip-trailing-action-state-layer-color: transparent;
  --mat-chip-selected-trailing-action-state-layer-color: transparent;
  --mat-chip-trailing-action-hover-state-layer-opacity: 0;
  --mat-chip-trailing-action-focus-state-layer-opacity: 0;
}
.eng-theme--light .mat-mdc-standard-chip {
  --mdc-chip-disabled-label-text-color: #212121;
  --mdc-chip-elevated-container-color: rgb(224.4, 224.4, 224.4);
  --mdc-chip-elevated-selected-container-color: rgb(224.4, 224.4, 224.4);
  --mdc-chip-elevated-disabled-container-color: rgb(224.4, 224.4, 224.4);
  --mdc-chip-flat-disabled-selected-container-color: rgb(224.4, 224.4, 224.4);
  --mdc-chip-focus-state-layer-color: black;
  --mdc-chip-hover-state-layer-color: black;
  --mdc-chip-selected-hover-state-layer-color: black;
  --mdc-chip-focus-state-layer-opacity: 0.12;
  --mdc-chip-selected-focus-state-layer-color: black;
  --mdc-chip-selected-focus-state-layer-opacity: 0.12;
  --mdc-chip-label-text-color: #212121;
  --mdc-chip-selected-label-text-color: #212121;
  --mdc-chip-with-icon-icon-color: #212121;
  --mdc-chip-with-icon-disabled-icon-color: #212121;
  --mdc-chip-with-icon-selected-icon-color: #212121;
  --mdc-chip-with-trailing-icon-disabled-trailing-icon-color: #212121;
  --mdc-chip-with-trailing-icon-trailing-icon-color: #212121;
}
.eng-theme--light .mat-mdc-standard-chip {
  --mat-chip-selected-disabled-trailing-icon-color: #212121;
  --mat-chip-selected-trailing-icon-color: #212121;
}
.eng-theme--light .mat-mdc-standard-chip.mat-mdc-chip-selected.mat-primary, .eng-theme--light .mat-mdc-standard-chip.mat-mdc-chip-highlighted.mat-primary {
  --mdc-chip-disabled-label-text-color: rgba(0, 0, 0, 0.87);
  --mdc-chip-elevated-container-color: #0cabf5;
  --mdc-chip-elevated-selected-container-color: #0cabf5;
  --mdc-chip-elevated-disabled-container-color: #0cabf5;
  --mdc-chip-flat-disabled-selected-container-color: #0cabf5;
  --mdc-chip-focus-state-layer-color: black;
  --mdc-chip-hover-state-layer-color: black;
  --mdc-chip-selected-hover-state-layer-color: black;
  --mdc-chip-focus-state-layer-opacity: 0.12;
  --mdc-chip-selected-focus-state-layer-color: black;
  --mdc-chip-selected-focus-state-layer-opacity: 0.12;
  --mdc-chip-label-text-color: rgba(0, 0, 0, 0.87);
  --mdc-chip-selected-label-text-color: rgba(0, 0, 0, 0.87);
  --mdc-chip-with-icon-icon-color: rgba(0, 0, 0, 0.87);
  --mdc-chip-with-icon-disabled-icon-color: rgba(0, 0, 0, 0.87);
  --mdc-chip-with-icon-selected-icon-color: rgba(0, 0, 0, 0.87);
  --mdc-chip-with-trailing-icon-disabled-trailing-icon-color: rgba(0, 0, 0, 0.87);
  --mdc-chip-with-trailing-icon-trailing-icon-color: rgba(0, 0, 0, 0.87);
}
.eng-theme--light .mat-mdc-standard-chip.mat-mdc-chip-selected.mat-primary, .eng-theme--light .mat-mdc-standard-chip.mat-mdc-chip-highlighted.mat-primary {
  --mat-chip-selected-disabled-trailing-icon-color: rgba(0, 0, 0, 0.87);
  --mat-chip-selected-trailing-icon-color: rgba(0, 0, 0, 0.87);
}
.eng-theme--light .mat-mdc-standard-chip.mat-mdc-chip-selected.mat-accent, .eng-theme--light .mat-mdc-standard-chip.mat-mdc-chip-highlighted.mat-accent {
  --mdc-chip-disabled-label-text-color: white;
  --mdc-chip-elevated-container-color: #0cabf5;
  --mdc-chip-elevated-selected-container-color: #0cabf5;
  --mdc-chip-elevated-disabled-container-color: #0cabf5;
  --mdc-chip-flat-disabled-selected-container-color: #0cabf5;
  --mdc-chip-focus-state-layer-color: black;
  --mdc-chip-hover-state-layer-color: black;
  --mdc-chip-selected-hover-state-layer-color: black;
  --mdc-chip-focus-state-layer-opacity: 0.12;
  --mdc-chip-selected-focus-state-layer-color: black;
  --mdc-chip-selected-focus-state-layer-opacity: 0.12;
  --mdc-chip-label-text-color: white;
  --mdc-chip-selected-label-text-color: white;
  --mdc-chip-with-icon-icon-color: white;
  --mdc-chip-with-icon-disabled-icon-color: white;
  --mdc-chip-with-icon-selected-icon-color: white;
  --mdc-chip-with-trailing-icon-disabled-trailing-icon-color: white;
  --mdc-chip-with-trailing-icon-trailing-icon-color: white;
}
.eng-theme--light .mat-mdc-standard-chip.mat-mdc-chip-selected.mat-accent, .eng-theme--light .mat-mdc-standard-chip.mat-mdc-chip-highlighted.mat-accent {
  --mat-chip-selected-disabled-trailing-icon-color: white;
  --mat-chip-selected-trailing-icon-color: white;
}
.eng-theme--light .mat-mdc-standard-chip.mat-mdc-chip-selected.mat-warn, .eng-theme--light .mat-mdc-standard-chip.mat-mdc-chip-highlighted.mat-warn {
  --mdc-chip-disabled-label-text-color: white;
  --mdc-chip-elevated-container-color: #f44336;
  --mdc-chip-elevated-selected-container-color: #f44336;
  --mdc-chip-elevated-disabled-container-color: #f44336;
  --mdc-chip-flat-disabled-selected-container-color: #f44336;
  --mdc-chip-focus-state-layer-color: black;
  --mdc-chip-hover-state-layer-color: black;
  --mdc-chip-selected-hover-state-layer-color: black;
  --mdc-chip-focus-state-layer-opacity: 0.12;
  --mdc-chip-selected-focus-state-layer-color: black;
  --mdc-chip-selected-focus-state-layer-opacity: 0.12;
  --mdc-chip-label-text-color: white;
  --mdc-chip-selected-label-text-color: white;
  --mdc-chip-with-icon-icon-color: white;
  --mdc-chip-with-icon-disabled-icon-color: white;
  --mdc-chip-with-icon-selected-icon-color: white;
  --mdc-chip-with-trailing-icon-disabled-trailing-icon-color: white;
  --mdc-chip-with-trailing-icon-trailing-icon-color: white;
}
.eng-theme--light .mat-mdc-standard-chip.mat-mdc-chip-selected.mat-warn, .eng-theme--light .mat-mdc-standard-chip.mat-mdc-chip-highlighted.mat-warn {
  --mat-chip-selected-disabled-trailing-icon-color: white;
  --mat-chip-selected-trailing-icon-color: white;
}
.eng-theme--light .mat-mdc-chip.mat-mdc-standard-chip {
  --mdc-chip-container-height: 32px;
}
.eng-theme--light .mat-mdc-standard-chip {
  --mdc-chip-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-chip-label-text-line-height: 20px;
  --mdc-chip-label-text-size: 14px;
  --mdc-chip-label-text-tracking: 0.0178571429em;
  --mdc-chip-label-text-weight: 400;
}
.eng-theme--light {
  --mdc-switch-disabled-selected-icon-opacity: 0.38;
  --mdc-switch-disabled-track-opacity: 0.12;
  --mdc-switch-disabled-unselected-icon-opacity: 0.38;
  --mdc-switch-handle-height: 20px;
  --mdc-switch-handle-shape: 10px;
  --mdc-switch-handle-width: 20px;
  --mdc-switch-selected-icon-size: 18px;
  --mdc-switch-track-height: 14px;
  --mdc-switch-track-shape: 7px;
  --mdc-switch-track-width: 36px;
  --mdc-switch-unselected-icon-size: 18px;
  --mdc-switch-selected-focus-state-layer-opacity: 0.12;
  --mdc-switch-selected-hover-state-layer-opacity: 0.04;
  --mdc-switch-selected-pressed-state-layer-opacity: 0.1;
  --mdc-switch-unselected-focus-state-layer-opacity: 0.12;
  --mdc-switch-unselected-hover-state-layer-opacity: 0.04;
  --mdc-switch-unselected-pressed-state-layer-opacity: 0.1;
}
.eng-theme--light .mat-mdc-slide-toggle {
  --mat-switch-disabled-selected-handle-opacity: 0.38;
  --mat-switch-disabled-unselected-handle-opacity: 0.38;
  --mat-switch-unselected-handle-size: 20px;
  --mat-switch-selected-handle-size: 20px;
  --mat-switch-pressed-handle-size: 20px;
  --mat-switch-with-icon-handle-size: 20px;
  --mat-switch-selected-handle-horizontal-margin: 0;
  --mat-switch-selected-with-icon-handle-horizontal-margin: 0;
  --mat-switch-selected-pressed-handle-horizontal-margin: 0;
  --mat-switch-unselected-handle-horizontal-margin: 0;
  --mat-switch-unselected-with-icon-handle-horizontal-margin: 0;
  --mat-switch-unselected-pressed-handle-horizontal-margin: 0;
  --mat-switch-visible-track-opacity: 1;
  --mat-switch-hidden-track-opacity: 1;
  --mat-switch-visible-track-transition: transform 75ms 0ms cubic-bezier(0, 0, 0.2, 1);
  --mat-switch-hidden-track-transition: transform 75ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
  --mat-switch-track-outline-width: 1px;
  --mat-switch-track-outline-color: transparent;
  --mat-switch-selected-track-outline-width: 1px;
  --mat-switch-selected-track-outline-color: transparent;
  --mat-switch-disabled-unselected-track-outline-width: 1px;
  --mat-switch-disabled-unselected-track-outline-color: transparent;
}
.eng-theme--light {
  --mdc-switch-selected-focus-state-layer-color: #a8c84d;
  --mdc-switch-selected-handle-color: #a8c84d;
  --mdc-switch-selected-hover-state-layer-color: #a8c84d;
  --mdc-switch-selected-pressed-state-layer-color: #a8c84d;
  --mdc-switch-selected-focus-handle-color: #729233;
  --mdc-switch-selected-hover-handle-color: #729233;
  --mdc-switch-selected-pressed-handle-color: #729233;
  --mdc-switch-selected-focus-track-color: #81c784;
  --mdc-switch-selected-hover-track-color: #81c784;
  --mdc-switch-selected-pressed-track-color: #81c784;
  --mdc-switch-selected-track-color: #81c784;
  --mdc-switch-disabled-selected-handle-color: #424242;
  --mdc-switch-disabled-selected-icon-color: #fff;
  --mdc-switch-disabled-selected-track-color: #424242;
  --mdc-switch-disabled-unselected-handle-color: #424242;
  --mdc-switch-disabled-unselected-icon-color: #fff;
  --mdc-switch-disabled-unselected-track-color: #424242;
  --mdc-switch-handle-surface-color: #fff;
  --mdc-switch-selected-icon-color: #fff;
  --mdc-switch-unselected-focus-handle-color: #212121;
  --mdc-switch-unselected-focus-state-layer-color: #424242;
  --mdc-switch-unselected-focus-track-color: #e0e0e0;
  --mdc-switch-unselected-handle-color: #616161;
  --mdc-switch-unselected-hover-handle-color: #212121;
  --mdc-switch-unselected-hover-state-layer-color: #424242;
  --mdc-switch-unselected-hover-track-color: #e0e0e0;
  --mdc-switch-unselected-icon-color: #fff;
  --mdc-switch-unselected-pressed-handle-color: #212121;
  --mdc-switch-unselected-pressed-state-layer-color: #424242;
  --mdc-switch-unselected-pressed-track-color: #e0e0e0;
  --mdc-switch-unselected-track-color: #e0e0e0;
  --mdc-switch-handle-elevation-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);
  --mdc-switch-disabled-handle-elevation-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);
}
.eng-theme--light {
  --mdc-switch-disabled-label-text-color: rgba(0, 0, 0, 0.38);
}
.eng-theme--light .mat-mdc-slide-toggle {
  --mat-switch-label-text-color: rgba(0, 0, 0, 0.87);
}
.eng-theme--light .mat-mdc-slide-toggle.mat-accent {
  --mdc-switch-selected-focus-state-layer-color: #546e7a;
  --mdc-switch-selected-handle-color: #546e7a;
  --mdc-switch-selected-hover-state-layer-color: #546e7a;
  --mdc-switch-selected-pressed-state-layer-color: #546e7a;
  --mdc-switch-selected-focus-handle-color: #263238;
  --mdc-switch-selected-hover-handle-color: #263238;
  --mdc-switch-selected-pressed-handle-color: #263238;
  --mdc-switch-selected-focus-track-color: #90a4ae;
  --mdc-switch-selected-hover-track-color: #90a4ae;
  --mdc-switch-selected-pressed-track-color: #90a4ae;
  --mdc-switch-selected-track-color: #90a4ae;
}
.eng-theme--light .mat-mdc-slide-toggle.mat-warn {
  --mdc-switch-selected-focus-state-layer-color: #e53935;
  --mdc-switch-selected-handle-color: #e53935;
  --mdc-switch-selected-hover-state-layer-color: #e53935;
  --mdc-switch-selected-pressed-state-layer-color: #e53935;
  --mdc-switch-selected-focus-handle-color: #b71c1c;
  --mdc-switch-selected-hover-handle-color: #b71c1c;
  --mdc-switch-selected-pressed-handle-color: #b71c1c;
  --mdc-switch-selected-focus-track-color: #e57373;
  --mdc-switch-selected-hover-track-color: #e57373;
  --mdc-switch-selected-pressed-track-color: #e57373;
  --mdc-switch-selected-track-color: #e57373;
}
.eng-theme--light {
  --mdc-switch-state-layer-size: 40px;
}
.eng-theme--light .mat-mdc-slide-toggle {
  --mat-switch-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-switch-label-text-line-height: 20px;
  --mat-switch-label-text-size: 14px;
  --mat-switch-label-text-tracking: 0.0178571429em;
  --mat-switch-label-text-weight: 400;
}
.eng-theme--light {
  --mdc-radio-disabled-selected-icon-opacity: 0.38;
  --mdc-radio-disabled-unselected-icon-opacity: 0.38;
  --mdc-radio-state-layer-size: 40px;
}
.eng-theme--light .mat-mdc-radio-button.mat-primary {
  --mdc-radio-disabled-selected-icon-color: black;
  --mdc-radio-disabled-unselected-icon-color: black;
  --mdc-radio-unselected-hover-icon-color: #212121;
  --mdc-radio-unselected-focus-icon-color: #212121;
  --mdc-radio-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-unselected-pressed-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-selected-focus-icon-color: #0cabf5;
  --mdc-radio-selected-hover-icon-color: #0cabf5;
  --mdc-radio-selected-icon-color: #0cabf5;
  --mdc-radio-selected-pressed-icon-color: #0cabf5;
}
.eng-theme--light .mat-mdc-radio-button.mat-primary {
  --mat-radio-ripple-color: black;
  --mat-radio-checked-ripple-color: #0cabf5;
  --mat-radio-disabled-label-color: rgba(0, 0, 0, 0.38);
  --mat-radio-label-text-color: rgba(0, 0, 0, 0.87);
}
.eng-theme--light .mat-mdc-radio-button.mat-accent {
  --mdc-radio-disabled-selected-icon-color: black;
  --mdc-radio-disabled-unselected-icon-color: black;
  --mdc-radio-unselected-hover-icon-color: #212121;
  --mdc-radio-unselected-focus-icon-color: #212121;
  --mdc-radio-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-unselected-pressed-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-selected-focus-icon-color: #0cabf5;
  --mdc-radio-selected-hover-icon-color: #0cabf5;
  --mdc-radio-selected-icon-color: #0cabf5;
  --mdc-radio-selected-pressed-icon-color: #0cabf5;
}
.eng-theme--light .mat-mdc-radio-button.mat-accent {
  --mat-radio-ripple-color: black;
  --mat-radio-checked-ripple-color: #0cabf5;
  --mat-radio-disabled-label-color: rgba(0, 0, 0, 0.38);
  --mat-radio-label-text-color: rgba(0, 0, 0, 0.87);
}
.eng-theme--light .mat-mdc-radio-button.mat-warn {
  --mdc-radio-disabled-selected-icon-color: black;
  --mdc-radio-disabled-unselected-icon-color: black;
  --mdc-radio-unselected-hover-icon-color: #212121;
  --mdc-radio-unselected-focus-icon-color: #212121;
  --mdc-radio-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-unselected-pressed-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-selected-focus-icon-color: #f44336;
  --mdc-radio-selected-hover-icon-color: #f44336;
  --mdc-radio-selected-icon-color: #f44336;
  --mdc-radio-selected-pressed-icon-color: #f44336;
}
.eng-theme--light .mat-mdc-radio-button.mat-warn {
  --mat-radio-ripple-color: black;
  --mat-radio-checked-ripple-color: #f44336;
  --mat-radio-disabled-label-color: rgba(0, 0, 0, 0.38);
  --mat-radio-label-text-color: rgba(0, 0, 0, 0.87);
}
.eng-theme--light {
  --mdc-radio-state-layer-size: 40px;
}
.eng-theme--light {
  --mat-radio-touch-target-display: block;
}
.eng-theme--light {
  --mat-radio-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-radio-label-text-line-height: 20px;
  --mat-radio-label-text-size: 14px;
  --mat-radio-label-text-tracking: 0.0178571429em;
  --mat-radio-label-text-weight: 400;
}
.eng-theme--light {
  --mdc-slider-active-track-height: 6px;
  --mdc-slider-active-track-shape: 9999px;
  --mdc-slider-handle-height: 20px;
  --mdc-slider-handle-shape: 50%;
  --mdc-slider-handle-width: 20px;
  --mdc-slider-inactive-track-height: 4px;
  --mdc-slider-inactive-track-shape: 9999px;
  --mdc-slider-with-overlap-handle-outline-width: 1px;
  --mdc-slider-with-tick-marks-active-container-opacity: 0.6;
  --mdc-slider-with-tick-marks-container-shape: 50%;
  --mdc-slider-with-tick-marks-container-size: 2px;
  --mdc-slider-with-tick-marks-inactive-container-opacity: 0.6;
  --mdc-slider-handle-elevation: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);
}
.eng-theme--light {
  --mat-slider-value-indicator-width: auto;
  --mat-slider-value-indicator-height: 32px;
  --mat-slider-value-indicator-caret-display: block;
  --mat-slider-value-indicator-border-radius: 4px;
  --mat-slider-value-indicator-padding: 0 12px;
  --mat-slider-value-indicator-text-transform: none;
  --mat-slider-value-indicator-container-transform: translateX(-50%);
}
.eng-theme--light {
  --mdc-slider-handle-color: #0cabf5;
  --mdc-slider-focus-handle-color: #0cabf5;
  --mdc-slider-hover-handle-color: #0cabf5;
  --mdc-slider-active-track-color: #0cabf5;
  --mdc-slider-inactive-track-color: #0cabf5;
  --mdc-slider-with-tick-marks-inactive-container-color: #0cabf5;
  --mdc-slider-with-tick-marks-active-container-color: rgba(0, 0, 0, 0.87);
  --mdc-slider-disabled-active-track-color: #000;
  --mdc-slider-disabled-handle-color: #000;
  --mdc-slider-disabled-inactive-track-color: #000;
  --mdc-slider-label-container-color: #000;
  --mdc-slider-label-label-text-color: #fff;
  --mdc-slider-with-overlap-handle-outline-color: #fff;
  --mdc-slider-with-tick-marks-disabled-container-color: #000;
}
.eng-theme--light {
  --mat-slider-ripple-color: #0cabf5;
  --mat-slider-hover-state-layer-color: rgba(12, 171, 245, 0.05);
  --mat-slider-focus-state-layer-color: rgba(12, 171, 245, 0.2);
  --mat-slider-value-indicator-opacity: 0.6;
}
.eng-theme--light .mat-accent {
  --mdc-slider-handle-color: #0cabf5;
  --mdc-slider-focus-handle-color: #0cabf5;
  --mdc-slider-hover-handle-color: #0cabf5;
  --mdc-slider-active-track-color: #0cabf5;
  --mdc-slider-inactive-track-color: #0cabf5;
  --mdc-slider-with-tick-marks-inactive-container-color: #0cabf5;
  --mdc-slider-with-tick-marks-active-container-color: white;
}
.eng-theme--light .mat-accent {
  --mat-slider-ripple-color: #0cabf5;
  --mat-slider-hover-state-layer-color: rgba(12, 171, 245, 0.05);
  --mat-slider-focus-state-layer-color: rgba(12, 171, 245, 0.2);
}
.eng-theme--light .mat-warn {
  --mdc-slider-handle-color: #f44336;
  --mdc-slider-focus-handle-color: #f44336;
  --mdc-slider-hover-handle-color: #f44336;
  --mdc-slider-active-track-color: #f44336;
  --mdc-slider-inactive-track-color: #f44336;
  --mdc-slider-with-tick-marks-inactive-container-color: #f44336;
  --mdc-slider-with-tick-marks-active-container-color: white;
}
.eng-theme--light .mat-warn {
  --mat-slider-ripple-color: #f44336;
  --mat-slider-hover-state-layer-color: rgba(244, 67, 54, 0.05);
  --mat-slider-focus-state-layer-color: rgba(244, 67, 54, 0.2);
}
.eng-theme--light {
  --mdc-slider-label-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-slider-label-label-text-size: 14px;
  --mdc-slider-label-label-text-line-height: 22px;
  --mdc-slider-label-label-text-tracking: 0.0071428571em;
  --mdc-slider-label-label-text-weight: 500;
}
.eng-theme--light {
  --mat-menu-container-shape: 4px;
  --mat-menu-divider-bottom-spacing: 0;
  --mat-menu-divider-top-spacing: 0;
  --mat-menu-item-spacing: 16px;
  --mat-menu-item-icon-size: 24px;
  --mat-menu-item-leading-spacing: 16px;
  --mat-menu-item-trailing-spacing: 16px;
  --mat-menu-item-with-icon-leading-spacing: 16px;
  --mat-menu-item-with-icon-trailing-spacing: 16px;
  --mat-menu-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
}
.eng-theme--light {
  --mat-menu-item-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-menu-item-icon-color: rgba(0, 0, 0, 0.87);
  --mat-menu-item-hover-state-layer-color: rgba(0, 0, 0, 0.04);
  --mat-menu-item-focus-state-layer-color: rgba(0, 0, 0, 0.04);
  --mat-menu-container-color: white;
  --mat-menu-divider-color: rgba(0, 0, 0, 0.12);
}
.eng-theme--light {
  --mat-menu-item-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-menu-item-label-text-size: 16px;
  --mat-menu-item-label-text-tracking: 0.03125em;
  --mat-menu-item-label-text-line-height: 24px;
  --mat-menu-item-label-text-weight: 400;
}
.eng-theme--light {
  --mdc-list-list-item-container-shape: 0;
  --mdc-list-list-item-leading-avatar-shape: 50%;
  --mdc-list-list-item-container-color: transparent;
  --mdc-list-list-item-selected-container-color: transparent;
  --mdc-list-list-item-leading-avatar-color: transparent;
  --mdc-list-list-item-leading-icon-size: 24px;
  --mdc-list-list-item-leading-avatar-size: 40px;
  --mdc-list-list-item-trailing-icon-size: 24px;
  --mdc-list-list-item-disabled-state-layer-color: transparent;
  --mdc-list-list-item-disabled-state-layer-opacity: 0;
  --mdc-list-list-item-disabled-label-text-opacity: 0.38;
  --mdc-list-list-item-disabled-leading-icon-opacity: 0.38;
  --mdc-list-list-item-disabled-trailing-icon-opacity: 0.38;
}
.eng-theme--light {
  --mat-list-active-indicator-color: transparent;
  --mat-list-active-indicator-shape: 4px;
}
.eng-theme--light {
  --mdc-list-list-item-label-text-color: rgba(0, 0, 0, 0.87);
  --mdc-list-list-item-supporting-text-color: rgba(0, 0, 0, 0.54);
  --mdc-list-list-item-leading-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-list-list-item-trailing-supporting-text-color: rgba(0, 0, 0, 0.38);
  --mdc-list-list-item-trailing-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-list-list-item-selected-trailing-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-list-list-item-disabled-label-text-color: black;
  --mdc-list-list-item-disabled-leading-icon-color: black;
  --mdc-list-list-item-disabled-trailing-icon-color: black;
  --mdc-list-list-item-hover-label-text-color: rgba(0, 0, 0, 0.87);
  --mdc-list-list-item-hover-leading-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-list-list-item-hover-trailing-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-list-list-item-focus-label-text-color: rgba(0, 0, 0, 0.87);
  --mdc-list-list-item-hover-state-layer-color: black;
  --mdc-list-list-item-hover-state-layer-opacity: 0.04;
  --mdc-list-list-item-focus-state-layer-color: black;
  --mdc-list-list-item-focus-state-layer-opacity: 0.12;
}
.eng-theme--light .mdc-list-item__start,
.eng-theme--light .mdc-list-item__end {
  --mdc-radio-disabled-selected-icon-color: black;
  --mdc-radio-disabled-unselected-icon-color: black;
  --mdc-radio-unselected-hover-icon-color: #212121;
  --mdc-radio-unselected-focus-icon-color: #212121;
  --mdc-radio-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-unselected-pressed-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-selected-focus-icon-color: #0cabf5;
  --mdc-radio-selected-hover-icon-color: #0cabf5;
  --mdc-radio-selected-icon-color: #0cabf5;
  --mdc-radio-selected-pressed-icon-color: #0cabf5;
}
.eng-theme--light .mat-accent .mdc-list-item__start,
.eng-theme--light .mat-accent .mdc-list-item__end {
  --mdc-radio-disabled-selected-icon-color: black;
  --mdc-radio-disabled-unselected-icon-color: black;
  --mdc-radio-unselected-hover-icon-color: #212121;
  --mdc-radio-unselected-focus-icon-color: #212121;
  --mdc-radio-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-unselected-pressed-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-selected-focus-icon-color: #0cabf5;
  --mdc-radio-selected-hover-icon-color: #0cabf5;
  --mdc-radio-selected-icon-color: #0cabf5;
  --mdc-radio-selected-pressed-icon-color: #0cabf5;
}
.eng-theme--light .mat-warn .mdc-list-item__start,
.eng-theme--light .mat-warn .mdc-list-item__end {
  --mdc-radio-disabled-selected-icon-color: black;
  --mdc-radio-disabled-unselected-icon-color: black;
  --mdc-radio-unselected-hover-icon-color: #212121;
  --mdc-radio-unselected-focus-icon-color: #212121;
  --mdc-radio-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-unselected-pressed-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-radio-selected-focus-icon-color: #f44336;
  --mdc-radio-selected-hover-icon-color: #f44336;
  --mdc-radio-selected-icon-color: #f44336;
  --mdc-radio-selected-pressed-icon-color: #f44336;
}
.eng-theme--light .mat-mdc-list-option {
  --mdc-checkbox-disabled-selected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-disabled-unselected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-selected-checkmark-color: black;
  --mdc-checkbox-selected-focus-icon-color: #0cabf5;
  --mdc-checkbox-selected-hover-icon-color: #0cabf5;
  --mdc-checkbox-selected-icon-color: #0cabf5;
  --mdc-checkbox-selected-pressed-icon-color: #0cabf5;
  --mdc-checkbox-unselected-focus-icon-color: #212121;
  --mdc-checkbox-unselected-hover-icon-color: #212121;
  --mdc-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-checkbox-selected-focus-state-layer-color: #0cabf5;
  --mdc-checkbox-selected-hover-state-layer-color: #0cabf5;
  --mdc-checkbox-selected-pressed-state-layer-color: #0cabf5;
  --mdc-checkbox-unselected-focus-state-layer-color: black;
  --mdc-checkbox-unselected-hover-state-layer-color: black;
  --mdc-checkbox-unselected-pressed-state-layer-color: black;
}
.eng-theme--light .mat-mdc-list-option.mat-accent {
  --mdc-checkbox-disabled-selected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-disabled-unselected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-selected-checkmark-color: white;
  --mdc-checkbox-selected-focus-icon-color: #0cabf5;
  --mdc-checkbox-selected-hover-icon-color: #0cabf5;
  --mdc-checkbox-selected-icon-color: #0cabf5;
  --mdc-checkbox-selected-pressed-icon-color: #0cabf5;
  --mdc-checkbox-unselected-focus-icon-color: #212121;
  --mdc-checkbox-unselected-hover-icon-color: #212121;
  --mdc-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-checkbox-selected-focus-state-layer-color: #0cabf5;
  --mdc-checkbox-selected-hover-state-layer-color: #0cabf5;
  --mdc-checkbox-selected-pressed-state-layer-color: #0cabf5;
  --mdc-checkbox-unselected-focus-state-layer-color: black;
  --mdc-checkbox-unselected-hover-state-layer-color: black;
  --mdc-checkbox-unselected-pressed-state-layer-color: black;
}
.eng-theme--light .mat-mdc-list-option.mat-warn {
  --mdc-checkbox-disabled-selected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-disabled-unselected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-selected-checkmark-color: white;
  --mdc-checkbox-selected-focus-icon-color: #f44336;
  --mdc-checkbox-selected-hover-icon-color: #f44336;
  --mdc-checkbox-selected-icon-color: #f44336;
  --mdc-checkbox-selected-pressed-icon-color: #f44336;
  --mdc-checkbox-unselected-focus-icon-color: #212121;
  --mdc-checkbox-unselected-hover-icon-color: #212121;
  --mdc-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-checkbox-selected-focus-state-layer-color: #f44336;
  --mdc-checkbox-selected-hover-state-layer-color: #f44336;
  --mdc-checkbox-selected-pressed-state-layer-color: #f44336;
  --mdc-checkbox-unselected-focus-state-layer-color: black;
  --mdc-checkbox-unselected-hover-state-layer-color: black;
  --mdc-checkbox-unselected-pressed-state-layer-color: black;
}
.eng-theme--light .mat-mdc-list-base.mat-mdc-list-base .mdc-list-item--selected .mdc-list-item__primary-text,
.eng-theme--light .mat-mdc-list-base.mat-mdc-list-base .mdc-list-item--selected .mdc-list-item__start,
.eng-theme--light .mat-mdc-list-base.mat-mdc-list-base .mdc-list-item--activated .mdc-list-item__primary-text,
.eng-theme--light .mat-mdc-list-base.mat-mdc-list-base .mdc-list-item--activated .mdc-list-item__start {
  color: #0cabf5;
}
.eng-theme--light .mat-mdc-list-base .mdc-list-item--disabled .mdc-list-item__start,
.eng-theme--light .mat-mdc-list-base .mdc-list-item--disabled .mdc-list-item__content,
.eng-theme--light .mat-mdc-list-base .mdc-list-item--disabled .mdc-list-item__end {
  opacity: 1;
}
.eng-theme--light {
  --mdc-list-list-item-one-line-container-height: 48px;
  --mdc-list-list-item-two-line-container-height: 64px;
  --mdc-list-list-item-three-line-container-height: 88px;
}
.eng-theme--light {
  --mat-list-list-item-leading-icon-start-space: 16px;
  --mat-list-list-item-leading-icon-end-space: 32px;
}
.eng-theme--light .mdc-list-item__start,
.eng-theme--light .mdc-list-item__end {
  --mdc-radio-state-layer-size: 40px;
}
.eng-theme--light .mat-mdc-list-item.mdc-list-item--with-leading-avatar.mdc-list-item--with-one-line, .eng-theme--light .mat-mdc-list-item.mdc-list-item--with-leading-checkbox.mdc-list-item--with-one-line, .eng-theme--light .mat-mdc-list-item.mdc-list-item--with-leading-icon.mdc-list-item--with-one-line {
  height: 56px;
}
.eng-theme--light .mat-mdc-list-item.mdc-list-item--with-leading-avatar.mdc-list-item--with-two-lines, .eng-theme--light .mat-mdc-list-item.mdc-list-item--with-leading-checkbox.mdc-list-item--with-two-lines, .eng-theme--light .mat-mdc-list-item.mdc-list-item--with-leading-icon.mdc-list-item--with-two-lines {
  height: 72px;
}
.eng-theme--light {
  --mdc-list-list-item-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-list-list-item-label-text-line-height: 24px;
  --mdc-list-list-item-label-text-size: 16px;
  --mdc-list-list-item-label-text-tracking: 0.03125em;
  --mdc-list-list-item-label-text-weight: 400;
  --mdc-list-list-item-supporting-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-list-list-item-supporting-text-line-height: 20px;
  --mdc-list-list-item-supporting-text-size: 14px;
  --mdc-list-list-item-supporting-text-tracking: 0.0178571429em;
  --mdc-list-list-item-supporting-text-weight: 400;
  --mdc-list-list-item-trailing-supporting-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-list-list-item-trailing-supporting-text-line-height: 20px;
  --mdc-list-list-item-trailing-supporting-text-size: 12px;
  --mdc-list-list-item-trailing-supporting-text-tracking: 0.0333333333em;
  --mdc-list-list-item-trailing-supporting-text-weight: 400;
}
.eng-theme--light .mdc-list-group__subheader {
  font: 400 16px / 28px 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  letter-spacing: 0.009375em;
}
.eng-theme--light {
  --mat-paginator-container-text-color: rgba(0, 0, 0, 0.87);
  --mat-paginator-container-background-color: white;
  --mat-paginator-enabled-icon-color: rgba(0, 0, 0, 0.54);
  --mat-paginator-disabled-icon-color: rgba(0, 0, 0, 0.12);
}
.eng-theme--light {
  --mat-paginator-container-size: 56px;
  --mat-paginator-form-field-container-height: 40px;
  --mat-paginator-form-field-container-vertical-padding: 8px;
  --mat-paginator-touch-target-display: block;
}
.eng-theme--light {
  --mat-paginator-container-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-paginator-container-text-line-height: 20px;
  --mat-paginator-container-text-size: 12px;
  --mat-paginator-container-text-tracking: 0.0333333333em;
  --mat-paginator-container-text-weight: 400;
  --mat-paginator-select-trigger-text-size: 12px;
}
.eng-theme--light {
  --mdc-secondary-navigation-tab-container-height: 48px;
}
.eng-theme--light {
  --mdc-tab-indicator-active-indicator-height: 2px;
  --mdc-tab-indicator-active-indicator-shape: 0;
}
.eng-theme--light {
  --mat-tab-header-divider-color: transparent;
  --mat-tab-header-divider-height: 0;
}
.eng-theme--light .mat-mdc-tab-group,
.eng-theme--light .mat-mdc-tab-nav-bar {
  --mdc-tab-indicator-active-indicator-color: #0cabf5;
}
.eng-theme--light .mat-mdc-tab-group,
.eng-theme--light .mat-mdc-tab-nav-bar {
  --mat-tab-header-disabled-ripple-color: rgba(0, 0, 0, 0.38);
  --mat-tab-header-pagination-icon-color: black;
  --mat-tab-header-inactive-label-text-color: rgba(0, 0, 0, 0.6);
  --mat-tab-header-active-label-text-color: #0cabf5;
  --mat-tab-header-active-ripple-color: #0cabf5;
  --mat-tab-header-inactive-ripple-color: #0cabf5;
  --mat-tab-header-inactive-focus-label-text-color: rgba(0, 0, 0, 0.6);
  --mat-tab-header-inactive-hover-label-text-color: rgba(0, 0, 0, 0.6);
  --mat-tab-header-active-focus-label-text-color: #0cabf5;
  --mat-tab-header-active-hover-label-text-color: #0cabf5;
  --mat-tab-header-active-focus-indicator-color: #0cabf5;
  --mat-tab-header-active-hover-indicator-color: #0cabf5;
}
.eng-theme--light .mat-mdc-tab-group.mat-accent,
.eng-theme--light .mat-mdc-tab-nav-bar.mat-accent {
  --mdc-tab-indicator-active-indicator-color: #0cabf5;
}
.eng-theme--light .mat-mdc-tab-group.mat-accent,
.eng-theme--light .mat-mdc-tab-nav-bar.mat-accent {
  --mat-tab-header-disabled-ripple-color: rgba(0, 0, 0, 0.38);
  --mat-tab-header-pagination-icon-color: black;
  --mat-tab-header-inactive-label-text-color: rgba(0, 0, 0, 0.6);
  --mat-tab-header-active-label-text-color: #0cabf5;
  --mat-tab-header-active-ripple-color: #0cabf5;
  --mat-tab-header-inactive-ripple-color: #0cabf5;
  --mat-tab-header-inactive-focus-label-text-color: rgba(0, 0, 0, 0.6);
  --mat-tab-header-inactive-hover-label-text-color: rgba(0, 0, 0, 0.6);
  --mat-tab-header-active-focus-label-text-color: #0cabf5;
  --mat-tab-header-active-hover-label-text-color: #0cabf5;
  --mat-tab-header-active-focus-indicator-color: #0cabf5;
  --mat-tab-header-active-hover-indicator-color: #0cabf5;
}
.eng-theme--light .mat-mdc-tab-group.mat-warn,
.eng-theme--light .mat-mdc-tab-nav-bar.mat-warn {
  --mdc-tab-indicator-active-indicator-color: #f44336;
}
.eng-theme--light .mat-mdc-tab-group.mat-warn,
.eng-theme--light .mat-mdc-tab-nav-bar.mat-warn {
  --mat-tab-header-disabled-ripple-color: rgba(0, 0, 0, 0.38);
  --mat-tab-header-pagination-icon-color: black;
  --mat-tab-header-inactive-label-text-color: rgba(0, 0, 0, 0.6);
  --mat-tab-header-active-label-text-color: #f44336;
  --mat-tab-header-active-ripple-color: #f44336;
  --mat-tab-header-inactive-ripple-color: #f44336;
  --mat-tab-header-inactive-focus-label-text-color: rgba(0, 0, 0, 0.6);
  --mat-tab-header-inactive-hover-label-text-color: rgba(0, 0, 0, 0.6);
  --mat-tab-header-active-focus-label-text-color: #f44336;
  --mat-tab-header-active-hover-label-text-color: #f44336;
  --mat-tab-header-active-focus-indicator-color: #f44336;
  --mat-tab-header-active-hover-indicator-color: #f44336;
}
.eng-theme--light .mat-mdc-tab-group.mat-background-primary,
.eng-theme--light .mat-mdc-tab-nav-bar.mat-background-primary {
  --mat-tab-header-with-background-background-color: #0cabf5;
  --mat-tab-header-with-background-foreground-color: rgba(0, 0, 0, 0.87);
}
.eng-theme--light .mat-mdc-tab-group.mat-background-accent,
.eng-theme--light .mat-mdc-tab-nav-bar.mat-background-accent {
  --mat-tab-header-with-background-background-color: #0cabf5;
  --mat-tab-header-with-background-foreground-color: white;
}
.eng-theme--light .mat-mdc-tab-group.mat-background-warn,
.eng-theme--light .mat-mdc-tab-nav-bar.mat-background-warn {
  --mat-tab-header-with-background-background-color: #f44336;
  --mat-tab-header-with-background-foreground-color: white;
}
.eng-theme--light .mat-mdc-tab-header {
  --mdc-secondary-navigation-tab-container-height: 48px;
}
.eng-theme--light .mat-mdc-tab-header {
  --mat-tab-header-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-tab-header-label-text-size: 14px;
  --mat-tab-header-label-text-tracking: 0.0892857143em;
  --mat-tab-header-label-text-line-height: 36px;
  --mat-tab-header-label-text-weight: 500;
}
.eng-theme--light {
  --mdc-checkbox-disabled-selected-checkmark-color: #fff;
  --mdc-checkbox-selected-focus-state-layer-opacity: 0.16;
  --mdc-checkbox-selected-hover-state-layer-opacity: 0.04;
  --mdc-checkbox-selected-pressed-state-layer-opacity: 0.16;
  --mdc-checkbox-unselected-focus-state-layer-opacity: 0.16;
  --mdc-checkbox-unselected-hover-state-layer-opacity: 0.04;
  --mdc-checkbox-unselected-pressed-state-layer-opacity: 0.16;
}
.eng-theme--light {
  --mdc-checkbox-disabled-selected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-disabled-unselected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-selected-checkmark-color: white;
  --mdc-checkbox-selected-focus-icon-color: #0cabf5;
  --mdc-checkbox-selected-hover-icon-color: #0cabf5;
  --mdc-checkbox-selected-icon-color: #0cabf5;
  --mdc-checkbox-selected-pressed-icon-color: #0cabf5;
  --mdc-checkbox-unselected-focus-icon-color: #212121;
  --mdc-checkbox-unselected-hover-icon-color: #212121;
  --mdc-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-checkbox-selected-focus-state-layer-color: #0cabf5;
  --mdc-checkbox-selected-hover-state-layer-color: #0cabf5;
  --mdc-checkbox-selected-pressed-state-layer-color: #0cabf5;
  --mdc-checkbox-unselected-focus-state-layer-color: black;
  --mdc-checkbox-unselected-hover-state-layer-color: black;
  --mdc-checkbox-unselected-pressed-state-layer-color: black;
}
.eng-theme--light {
  --mat-checkbox-disabled-label-color: rgba(0, 0, 0, 0.38);
  --mat-checkbox-label-text-color: rgba(0, 0, 0, 0.87);
}
.eng-theme--light .mat-mdc-checkbox.mat-primary {
  --mdc-checkbox-disabled-selected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-disabled-unselected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-selected-checkmark-color: black;
  --mdc-checkbox-selected-focus-icon-color: #0cabf5;
  --mdc-checkbox-selected-hover-icon-color: #0cabf5;
  --mdc-checkbox-selected-icon-color: #0cabf5;
  --mdc-checkbox-selected-pressed-icon-color: #0cabf5;
  --mdc-checkbox-unselected-focus-icon-color: #212121;
  --mdc-checkbox-unselected-hover-icon-color: #212121;
  --mdc-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-checkbox-selected-focus-state-layer-color: #0cabf5;
  --mdc-checkbox-selected-hover-state-layer-color: #0cabf5;
  --mdc-checkbox-selected-pressed-state-layer-color: #0cabf5;
  --mdc-checkbox-unselected-focus-state-layer-color: black;
  --mdc-checkbox-unselected-hover-state-layer-color: black;
  --mdc-checkbox-unselected-pressed-state-layer-color: black;
}
.eng-theme--light .mat-mdc-checkbox.mat-warn {
  --mdc-checkbox-disabled-selected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-disabled-unselected-icon-color: rgba(0, 0, 0, 0.38);
  --mdc-checkbox-selected-checkmark-color: white;
  --mdc-checkbox-selected-focus-icon-color: #f44336;
  --mdc-checkbox-selected-hover-icon-color: #f44336;
  --mdc-checkbox-selected-icon-color: #f44336;
  --mdc-checkbox-selected-pressed-icon-color: #f44336;
  --mdc-checkbox-unselected-focus-icon-color: #212121;
  --mdc-checkbox-unselected-hover-icon-color: #212121;
  --mdc-checkbox-unselected-icon-color: rgba(0, 0, 0, 0.54);
  --mdc-checkbox-selected-focus-state-layer-color: #f44336;
  --mdc-checkbox-selected-hover-state-layer-color: #f44336;
  --mdc-checkbox-selected-pressed-state-layer-color: #f44336;
  --mdc-checkbox-unselected-focus-state-layer-color: black;
  --mdc-checkbox-unselected-hover-state-layer-color: black;
  --mdc-checkbox-unselected-pressed-state-layer-color: black;
}
.eng-theme--light {
  --mdc-checkbox-state-layer-size: 40px;
}
.eng-theme--light {
  --mat-checkbox-touch-target-display: block;
}
.eng-theme--light {
  --mat-checkbox-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-checkbox-label-text-line-height: 20px;
  --mat-checkbox-label-text-size: 14px;
  --mat-checkbox-label-text-tracking: 0.0178571429em;
  --mat-checkbox-label-text-weight: 400;
}
.eng-theme--light {
  --mdc-text-button-container-shape: 4px;
  --mdc-text-button-keep-touch-target: false;
}
.eng-theme--light {
  --mdc-filled-button-container-shape: 4px;
  --mdc-filled-button-keep-touch-target: false;
}
.eng-theme--light {
  --mdc-protected-button-container-shape: 4px;
  --mdc-protected-button-container-elevation-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
  --mdc-protected-button-disabled-container-elevation-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);
  --mdc-protected-button-focus-container-elevation-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);
  --mdc-protected-button-hover-container-elevation-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);
  --mdc-protected-button-pressed-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
}
.eng-theme--light {
  --mdc-outlined-button-keep-touch-target: false;
  --mdc-outlined-button-outline-width: 1px;
  --mdc-outlined-button-container-shape: 4px;
}
.eng-theme--light {
  --mat-text-button-horizontal-padding: 8px;
  --mat-text-button-with-icon-horizontal-padding: 8px;
  --mat-text-button-icon-spacing: 8px;
  --mat-text-button-icon-offset: 0;
}
.eng-theme--light {
  --mat-filled-button-horizontal-padding: 16px;
  --mat-filled-button-icon-spacing: 8px;
  --mat-filled-button-icon-offset: -4px;
}
.eng-theme--light {
  --mat-protected-button-horizontal-padding: 16px;
  --mat-protected-button-icon-spacing: 8px;
  --mat-protected-button-icon-offset: -4px;
}
.eng-theme--light {
  --mat-outlined-button-horizontal-padding: 15px;
  --mat-outlined-button-icon-spacing: 8px;
  --mat-outlined-button-icon-offset: -4px;
}
.eng-theme--light {
  --mdc-text-button-label-text-color: black;
  --mdc-text-button-disabled-label-text-color: rgba(0, 0, 0, 0.38);
}
.eng-theme--light {
  --mat-text-button-state-layer-color: black;
  --mat-text-button-disabled-state-layer-color: black;
  --mat-text-button-ripple-color: rgba(0, 0, 0, 0.1);
  --mat-text-button-hover-state-layer-opacity: 0.04;
  --mat-text-button-focus-state-layer-opacity: 0.12;
  --mat-text-button-pressed-state-layer-opacity: 0.12;
}
.eng-theme--light {
  --mdc-filled-button-container-color: white;
  --mdc-filled-button-label-text-color: black;
  --mdc-filled-button-disabled-container-color: rgba(0, 0, 0, 0.12);
  --mdc-filled-button-disabled-label-text-color: rgba(0, 0, 0, 0.38);
}
.eng-theme--light {
  --mat-filled-button-state-layer-color: black;
  --mat-filled-button-disabled-state-layer-color: black;
  --mat-filled-button-ripple-color: rgba(0, 0, 0, 0.1);
  --mat-filled-button-hover-state-layer-opacity: 0.04;
  --mat-filled-button-focus-state-layer-opacity: 0.12;
  --mat-filled-button-pressed-state-layer-opacity: 0.12;
}
.eng-theme--light {
  --mdc-protected-button-container-color: white;
  --mdc-protected-button-label-text-color: black;
  --mdc-protected-button-disabled-container-color: rgba(0, 0, 0, 0.12);
  --mdc-protected-button-disabled-label-text-color: rgba(0, 0, 0, 0.38);
}
.eng-theme--light {
  --mat-protected-button-state-layer-color: black;
  --mat-protected-button-disabled-state-layer-color: black;
  --mat-protected-button-ripple-color: rgba(0, 0, 0, 0.1);
  --mat-protected-button-hover-state-layer-opacity: 0.04;
  --mat-protected-button-focus-state-layer-opacity: 0.12;
  --mat-protected-button-pressed-state-layer-opacity: 0.12;
}
.eng-theme--light {
  --mdc-outlined-button-disabled-outline-color: rgba(0, 0, 0, 0.12);
  --mdc-outlined-button-disabled-label-text-color: rgba(0, 0, 0, 0.38);
  --mdc-outlined-button-label-text-color: black;
  --mdc-outlined-button-outline-color: rgba(0, 0, 0, 0.12);
}
.eng-theme--light {
  --mat-outlined-button-state-layer-color: black;
  --mat-outlined-button-disabled-state-layer-color: black;
  --mat-outlined-button-ripple-color: rgba(0, 0, 0, 0.1);
  --mat-outlined-button-hover-state-layer-opacity: 0.04;
  --mat-outlined-button-focus-state-layer-opacity: 0.12;
  --mat-outlined-button-pressed-state-layer-opacity: 0.12;
}
.eng-theme--light .mat-mdc-button.mat-primary {
  --mdc-text-button-label-text-color: #0cabf5;
}
.eng-theme--light .mat-mdc-button.mat-primary {
  --mat-text-button-state-layer-color: #0cabf5;
  --mat-text-button-ripple-color: rgba(12, 171, 245, 0.1);
}
.eng-theme--light .mat-mdc-button.mat-accent {
  --mdc-text-button-label-text-color: #0cabf5;
}
.eng-theme--light .mat-mdc-button.mat-accent {
  --mat-text-button-state-layer-color: #0cabf5;
  --mat-text-button-ripple-color: rgba(12, 171, 245, 0.1);
}
.eng-theme--light .mat-mdc-button.mat-warn {
  --mdc-text-button-label-text-color: #f44336;
}
.eng-theme--light .mat-mdc-button.mat-warn {
  --mat-text-button-state-layer-color: #f44336;
  --mat-text-button-ripple-color: rgba(244, 67, 54, 0.1);
}
.eng-theme--light .mat-mdc-unelevated-button.mat-primary {
  --mdc-filled-button-container-color: #0cabf5;
  --mdc-filled-button-label-text-color: black;
}
.eng-theme--light .mat-mdc-unelevated-button.mat-primary {
  --mat-filled-button-state-layer-color: black;
  --mat-filled-button-ripple-color: rgba(0, 0, 0, 0.1);
}
.eng-theme--light .mat-mdc-unelevated-button.mat-accent {
  --mdc-filled-button-container-color: #0cabf5;
  --mdc-filled-button-label-text-color: white;
}
.eng-theme--light .mat-mdc-unelevated-button.mat-accent {
  --mat-filled-button-state-layer-color: white;
  --mat-filled-button-ripple-color: rgba(255, 255, 255, 0.1);
}
.eng-theme--light .mat-mdc-unelevated-button.mat-warn {
  --mdc-filled-button-container-color: #f44336;
  --mdc-filled-button-label-text-color: white;
}
.eng-theme--light .mat-mdc-unelevated-button.mat-warn {
  --mat-filled-button-state-layer-color: white;
  --mat-filled-button-ripple-color: rgba(255, 255, 255, 0.1);
}
.eng-theme--light .mat-mdc-raised-button.mat-primary {
  --mdc-protected-button-container-color: #0cabf5;
  --mdc-protected-button-label-text-color: black;
}
.eng-theme--light .mat-mdc-raised-button.mat-primary {
  --mat-protected-button-state-layer-color: black;
  --mat-protected-button-ripple-color: rgba(0, 0, 0, 0.1);
}
.eng-theme--light .mat-mdc-raised-button.mat-accent {
  --mdc-protected-button-container-color: #0cabf5;
  --mdc-protected-button-label-text-color: white;
}
.eng-theme--light .mat-mdc-raised-button.mat-accent {
  --mat-protected-button-state-layer-color: white;
  --mat-protected-button-ripple-color: rgba(255, 255, 255, 0.1);
}
.eng-theme--light .mat-mdc-raised-button.mat-warn {
  --mdc-protected-button-container-color: #f44336;
  --mdc-protected-button-label-text-color: white;
}
.eng-theme--light .mat-mdc-raised-button.mat-warn {
  --mat-protected-button-state-layer-color: white;
  --mat-protected-button-ripple-color: rgba(255, 255, 255, 0.1);
}
.eng-theme--light .mat-mdc-outlined-button.mat-primary {
  --mdc-outlined-button-label-text-color: #0cabf5;
  --mdc-outlined-button-outline-color: rgba(0, 0, 0, 0.12);
}
.eng-theme--light .mat-mdc-outlined-button.mat-primary {
  --mat-outlined-button-state-layer-color: #0cabf5;
  --mat-outlined-button-ripple-color: rgba(12, 171, 245, 0.1);
}
.eng-theme--light .mat-mdc-outlined-button.mat-accent {
  --mdc-outlined-button-label-text-color: #0cabf5;
  --mdc-outlined-button-outline-color: rgba(0, 0, 0, 0.12);
}
.eng-theme--light .mat-mdc-outlined-button.mat-accent {
  --mat-outlined-button-state-layer-color: #0cabf5;
  --mat-outlined-button-ripple-color: rgba(12, 171, 245, 0.1);
}
.eng-theme--light .mat-mdc-outlined-button.mat-warn {
  --mdc-outlined-button-label-text-color: #f44336;
  --mdc-outlined-button-outline-color: rgba(0, 0, 0, 0.12);
}
.eng-theme--light .mat-mdc-outlined-button.mat-warn {
  --mat-outlined-button-state-layer-color: #f44336;
  --mat-outlined-button-ripple-color: rgba(244, 67, 54, 0.1);
}
.eng-theme--light {
  --mdc-text-button-container-height: 36px;
}
.eng-theme--light {
  --mdc-filled-button-container-height: 36px;
}
.eng-theme--light {
  --mdc-protected-button-container-height: 36px;
}
.eng-theme--light {
  --mdc-outlined-button-container-height: 36px;
}
.eng-theme--light {
  --mat-text-button-touch-target-display: block;
}
.eng-theme--light {
  --mat-filled-button-touch-target-display: block;
}
.eng-theme--light {
  --mat-protected-button-touch-target-display: block;
}
.eng-theme--light {
  --mat-outlined-button-touch-target-display: block;
}
.eng-theme--light {
  --mdc-text-button-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-text-button-label-text-size: 14px;
  --mdc-text-button-label-text-tracking: 0.0892857143em;
  --mdc-text-button-label-text-weight: 500;
  --mdc-text-button-label-text-transform: none;
}
.eng-theme--light {
  --mdc-filled-button-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-filled-button-label-text-size: 14px;
  --mdc-filled-button-label-text-tracking: 0.0892857143em;
  --mdc-filled-button-label-text-weight: 500;
  --mdc-filled-button-label-text-transform: none;
}
.eng-theme--light {
  --mdc-protected-button-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-protected-button-label-text-size: 14px;
  --mdc-protected-button-label-text-tracking: 0.0892857143em;
  --mdc-protected-button-label-text-weight: 500;
  --mdc-protected-button-label-text-transform: none;
}
.eng-theme--light {
  --mdc-outlined-button-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-outlined-button-label-text-size: 14px;
  --mdc-outlined-button-label-text-tracking: 0.0892857143em;
  --mdc-outlined-button-label-text-weight: 500;
  --mdc-outlined-button-label-text-transform: none;
}
.eng-theme--light {
  --mdc-icon-button-icon-size: 24px;
}
.eng-theme--light {
  --mdc-icon-button-icon-color: inherit;
  --mdc-icon-button-disabled-icon-color: rgba(0, 0, 0, 0.38);
}
.eng-theme--light {
  --mat-icon-button-state-layer-color: black;
  --mat-icon-button-disabled-state-layer-color: black;
  --mat-icon-button-ripple-color: rgba(0, 0, 0, 0.1);
  --mat-icon-button-hover-state-layer-opacity: 0.04;
  --mat-icon-button-focus-state-layer-opacity: 0.12;
  --mat-icon-button-pressed-state-layer-opacity: 0.12;
}
.eng-theme--light .mat-mdc-icon-button.mat-primary {
  --mdc-icon-button-icon-color: #0cabf5;
}
.eng-theme--light .mat-mdc-icon-button.mat-primary {
  --mat-icon-button-state-layer-color: #0cabf5;
  --mat-icon-button-ripple-color: rgba(12, 171, 245, 0.1);
}
.eng-theme--light .mat-mdc-icon-button.mat-accent {
  --mdc-icon-button-icon-color: #0cabf5;
}
.eng-theme--light .mat-mdc-icon-button.mat-accent {
  --mat-icon-button-state-layer-color: #0cabf5;
  --mat-icon-button-ripple-color: rgba(12, 171, 245, 0.1);
}
.eng-theme--light .mat-mdc-icon-button.mat-warn {
  --mdc-icon-button-icon-color: #f44336;
}
.eng-theme--light .mat-mdc-icon-button.mat-warn {
  --mat-icon-button-state-layer-color: #f44336;
  --mat-icon-button-ripple-color: rgba(244, 67, 54, 0.1);
}
.eng-theme--light {
  --mat-icon-button-touch-target-display: block;
}
.eng-theme--light .mat-mdc-icon-button.mat-mdc-button-base {
  --mdc-icon-button-state-layer-size: 48px;
  width: var(--mdc-icon-button-state-layer-size);
  height: var(--mdc-icon-button-state-layer-size);
  padding: 12px;
}
.eng-theme--light {
  --mdc-fab-container-shape: 50%;
  --mdc-fab-container-elevation-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
  --mdc-fab-focus-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
  --mdc-fab-hover-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
  --mdc-fab-pressed-container-elevation-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12);
}
.eng-theme--light {
  --mdc-fab-small-container-shape: 50%;
  --mdc-fab-small-container-elevation-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
  --mdc-fab-small-focus-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
  --mdc-fab-small-hover-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
  --mdc-fab-small-pressed-container-elevation-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12);
}
.eng-theme--light {
  --mdc-extended-fab-container-height: 48px;
  --mdc-extended-fab-container-shape: 24px;
  --mdc-extended-fab-container-elevation-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
  --mdc-extended-fab-focus-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
  --mdc-extended-fab-hover-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
  --mdc-extended-fab-pressed-container-elevation-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12);
}
.eng-theme--light {
  --mdc-fab-container-color: white;
}
.eng-theme--light {
  --mat-fab-foreground-color: black;
  --mat-fab-state-layer-color: black;
  --mat-fab-disabled-state-layer-color: black;
  --mat-fab-ripple-color: rgba(0, 0, 0, 0.1);
  --mat-fab-hover-state-layer-opacity: 0.04;
  --mat-fab-focus-state-layer-opacity: 0.12;
  --mat-fab-pressed-state-layer-opacity: 0.12;
  --mat-fab-disabled-state-container-color: rgba(0, 0, 0, 0.12);
  --mat-fab-disabled-state-foreground-color: rgba(0, 0, 0, 0.38);
}
.eng-theme--light {
  --mdc-fab-small-container-color: white;
}
.eng-theme--light {
  --mat-fab-small-foreground-color: black;
  --mat-fab-small-state-layer-color: black;
  --mat-fab-small-disabled-state-layer-color: black;
  --mat-fab-small-ripple-color: rgba(0, 0, 0, 0.1);
  --mat-fab-small-hover-state-layer-opacity: 0.04;
  --mat-fab-small-focus-state-layer-opacity: 0.12;
  --mat-fab-small-pressed-state-layer-opacity: 0.12;
  --mat-fab-small-disabled-state-container-color: rgba(0, 0, 0, 0.12);
  --mat-fab-small-disabled-state-foreground-color: rgba(0, 0, 0, 0.38);
}
.eng-theme--light .mat-mdc-fab.mat-primary {
  --mdc-fab-container-color: #0cabf5;
}
.eng-theme--light .mat-mdc-fab.mat-primary {
  --mat-fab-foreground-color: black;
  --mat-fab-state-layer-color: black;
  --mat-fab-ripple-color: rgba(0, 0, 0, 0.1);
}
.eng-theme--light .mat-mdc-fab.mat-accent {
  --mdc-fab-container-color: #0cabf5;
}
.eng-theme--light .mat-mdc-fab.mat-accent {
  --mat-fab-foreground-color: white;
  --mat-fab-state-layer-color: white;
  --mat-fab-ripple-color: rgba(255, 255, 255, 0.1);
}
.eng-theme--light .mat-mdc-fab.mat-warn {
  --mdc-fab-container-color: #f44336;
}
.eng-theme--light .mat-mdc-fab.mat-warn {
  --mat-fab-foreground-color: white;
  --mat-fab-state-layer-color: white;
  --mat-fab-ripple-color: rgba(255, 255, 255, 0.1);
}
.eng-theme--light .mat-mdc-mini-fab.mat-primary {
  --mdc-fab-small-container-color: #0cabf5;
}
.eng-theme--light .mat-mdc-mini-fab.mat-primary {
  --mat-fab-small-foreground-color: black;
  --mat-fab-small-state-layer-color: black;
  --mat-fab-small-ripple-color: rgba(0, 0, 0, 0.1);
}
.eng-theme--light .mat-mdc-mini-fab.mat-accent {
  --mdc-fab-small-container-color: #0cabf5;
}
.eng-theme--light .mat-mdc-mini-fab.mat-accent {
  --mat-fab-small-foreground-color: white;
  --mat-fab-small-state-layer-color: white;
  --mat-fab-small-ripple-color: rgba(255, 255, 255, 0.1);
}
.eng-theme--light .mat-mdc-mini-fab.mat-warn {
  --mdc-fab-small-container-color: #f44336;
}
.eng-theme--light .mat-mdc-mini-fab.mat-warn {
  --mat-fab-small-foreground-color: white;
  --mat-fab-small-state-layer-color: white;
  --mat-fab-small-ripple-color: rgba(255, 255, 255, 0.1);
}
.eng-theme--light {
  --mat-fab-touch-target-display: block;
}
.eng-theme--light {
  --mat-fab-small-touch-target-display: block;
}
.eng-theme--light {
  --mdc-extended-fab-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-extended-fab-label-text-size: 14px;
  --mdc-extended-fab-label-text-tracking: 0.0892857143em;
  --mdc-extended-fab-label-text-weight: 500;
}
.eng-theme--light {
  --mdc-snackbar-container-shape: 4px;
}
.eng-theme--light {
  --mdc-snackbar-container-color: #333333;
  --mdc-snackbar-supporting-text-color: rgba(255, 255, 255, 0.87);
}
.eng-theme--light {
  --mat-snack-bar-button-color: #c8e6c9;
}
.eng-theme--light {
  --mdc-snackbar-supporting-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-snackbar-supporting-text-line-height: 20px;
  --mdc-snackbar-supporting-text-size: 14px;
  --mdc-snackbar-supporting-text-weight: 400;
}
.eng-theme--light {
  --mat-table-row-item-outline-width: 1px;
}
.eng-theme--light {
  --mat-table-background-color: white;
  --mat-table-header-headline-color: rgba(0, 0, 0, 0.87);
  --mat-table-row-item-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-table-row-item-outline-color: rgba(0, 0, 0, 0.12);
}
.eng-theme--light {
  --mat-table-header-container-height: 56px;
  --mat-table-footer-container-height: 52px;
  --mat-table-row-item-container-height: 52px;
}
.eng-theme--light {
  --mat-table-header-headline-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-table-header-headline-line-height: 22px;
  --mat-table-header-headline-size: 14px;
  --mat-table-header-headline-weight: 500;
  --mat-table-header-headline-tracking: 0.0071428571em;
  --mat-table-row-item-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-table-row-item-label-text-line-height: 20px;
  --mat-table-row-item-label-text-size: 14px;
  --mat-table-row-item-label-text-weight: 400;
  --mat-table-row-item-label-text-tracking: 0.0178571429em;
  --mat-table-footer-supporting-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-table-footer-supporting-text-line-height: 20px;
  --mat-table-footer-supporting-text-size: 14px;
  --mat-table-footer-supporting-text-weight: 400;
  --mat-table-footer-supporting-text-tracking: 0.0178571429em;
}
.eng-theme--light {
  --mdc-circular-progress-active-indicator-width: 4px;
  --mdc-circular-progress-size: 48px;
}
.eng-theme--light {
  --mdc-circular-progress-active-indicator-color: #0cabf5;
}
.eng-theme--light .mat-accent {
  --mdc-circular-progress-active-indicator-color: #0cabf5;
}
.eng-theme--light .mat-warn {
  --mdc-circular-progress-active-indicator-color: #f44336;
}
.eng-theme--light {
  --mat-badge-container-shape: 50%;
  --mat-badge-container-size: unset;
  --mat-badge-small-size-container-size: unset;
  --mat-badge-large-size-container-size: unset;
  --mat-badge-legacy-container-size: 22px;
  --mat-badge-legacy-small-size-container-size: 16px;
  --mat-badge-legacy-large-size-container-size: 28px;
  --mat-badge-container-offset: -11px 0;
  --mat-badge-small-size-container-offset: -8px 0;
  --mat-badge-large-size-container-offset: -14px 0;
  --mat-badge-container-overlap-offset: -11px;
  --mat-badge-small-size-container-overlap-offset: -8px;
  --mat-badge-large-size-container-overlap-offset: -14px;
  --mat-badge-container-padding: 0;
  --mat-badge-small-size-container-padding: 0;
  --mat-badge-large-size-container-padding: 0;
}
.eng-theme--light {
  --mat-badge-background-color: #0cabf5;
  --mat-badge-text-color: rgba(0, 0, 0, 0.87);
  --mat-badge-disabled-state-background-color: #b9b9b9;
  --mat-badge-disabled-state-text-color: rgba(0, 0, 0, 0.38);
}
.eng-theme--light .mat-badge-accent {
  --mat-badge-background-color: #0cabf5;
  --mat-badge-text-color: white;
}
.eng-theme--light .mat-badge-warn {
  --mat-badge-background-color: #f44336;
  --mat-badge-text-color: white;
}
.eng-theme--light {
  --mat-badge-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-badge-line-height: 22px;
  --mat-badge-text-size: 12px;
  --mat-badge-text-weight: 600;
  --mat-badge-small-size-text-size: 9px;
  --mat-badge-small-size-line-height: 16px;
  --mat-badge-large-size-text-size: 24px;
  --mat-badge-large-size-line-height: 28px;
}
.eng-theme--light {
  --mat-bottom-sheet-container-shape: 4px;
}
.eng-theme--light {
  --mat-bottom-sheet-container-text-color: rgba(0, 0, 0, 0.87);
  --mat-bottom-sheet-container-background-color: white;
}
.eng-theme--light {
  --mat-bottom-sheet-container-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-bottom-sheet-container-text-line-height: 20px;
  --mat-bottom-sheet-container-text-size: 14px;
  --mat-bottom-sheet-container-text-tracking: 0.0178571429em;
  --mat-bottom-sheet-container-text-weight: 400;
}
.eng-theme--light {
  --mat-legacy-button-toggle-height: 36px;
  --mat-legacy-button-toggle-shape: 2px;
  --mat-legacy-button-toggle-focus-state-layer-opacity: 1;
}
.eng-theme--light {
  --mat-standard-button-toggle-shape: 4px;
  --mat-standard-button-toggle-hover-state-layer-opacity: 0.04;
  --mat-standard-button-toggle-focus-state-layer-opacity: 0.12;
}
.eng-theme--light {
  --mat-legacy-button-toggle-text-color: rgba(0, 0, 0, 0.38);
  --mat-legacy-button-toggle-state-layer-color: rgba(0, 0, 0, 0.12);
  --mat-legacy-button-toggle-selected-state-text-color: rgba(0, 0, 0, 0.54);
  --mat-legacy-button-toggle-selected-state-background-color: #e0e0e0;
  --mat-legacy-button-toggle-disabled-state-text-color: rgba(0, 0, 0, 0.26);
  --mat-legacy-button-toggle-disabled-state-background-color: #eeeeee;
  --mat-legacy-button-toggle-disabled-selected-state-background-color: #bdbdbd;
}
.eng-theme--light {
  --mat-standard-button-toggle-text-color: rgba(0, 0, 0, 0.87);
  --mat-standard-button-toggle-background-color: white;
  --mat-standard-button-toggle-state-layer-color: black;
  --mat-standard-button-toggle-selected-state-background-color: #e0e0e0;
  --mat-standard-button-toggle-selected-state-text-color: rgba(0, 0, 0, 0.87);
  --mat-standard-button-toggle-disabled-state-text-color: rgba(0, 0, 0, 0.26);
  --mat-standard-button-toggle-disabled-state-background-color: white;
  --mat-standard-button-toggle-disabled-selected-state-text-color: rgba(0, 0, 0, 0.87);
  --mat-standard-button-toggle-disabled-selected-state-background-color: #bdbdbd;
  --mat-standard-button-toggle-divider-color: rgb(224.4, 224.4, 224.4);
}
.eng-theme--light {
  --mat-standard-button-toggle-height: 48px;
}
.eng-theme--light {
  --mat-legacy-button-toggle-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-legacy-button-toggle-label-text-line-height: 24px;
  --mat-legacy-button-toggle-label-text-size: 16px;
  --mat-legacy-button-toggle-label-text-tracking: 0.03125em;
  --mat-legacy-button-toggle-label-text-weight: 400;
}
.eng-theme--light {
  --mat-standard-button-toggle-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-standard-button-toggle-label-text-line-height: 24px;
  --mat-standard-button-toggle-label-text-size: 16px;
  --mat-standard-button-toggle-label-text-tracking: 0.03125em;
  --mat-standard-button-toggle-label-text-weight: 400;
}
.eng-theme--light {
  --mat-datepicker-calendar-container-shape: 4px;
  --mat-datepicker-calendar-container-touch-shape: 4px;
  --mat-datepicker-calendar-container-elevation-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);
  --mat-datepicker-calendar-container-touch-elevation-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
}
.eng-theme--light {
  --mat-datepicker-calendar-date-selected-state-text-color: rgba(0, 0, 0, 0.87);
  --mat-datepicker-calendar-date-selected-state-background-color: #0cabf5;
  --mat-datepicker-calendar-date-selected-disabled-state-background-color: rgba(12, 171, 245, 0.4);
  --mat-datepicker-calendar-date-today-selected-state-outline-color: rgba(0, 0, 0, 0.87);
  --mat-datepicker-calendar-date-focus-state-background-color: rgba(12, 171, 245, 0.3);
  --mat-datepicker-calendar-date-hover-state-background-color: rgba(12, 171, 245, 0.3);
  --mat-datepicker-toggle-active-state-icon-color: #0cabf5;
  --mat-datepicker-calendar-date-in-range-state-background-color: rgba(12, 171, 245, 0.2);
  --mat-datepicker-calendar-date-in-comparison-range-state-background-color: rgba(249, 171, 0, 0.2);
  --mat-datepicker-calendar-date-in-overlap-range-state-background-color: #a8dab5;
  --mat-datepicker-calendar-date-in-overlap-range-selected-state-background-color: rgb(69.5241935484, 163.4758064516, 93.9516129032);
  --mat-datepicker-toggle-icon-color: rgba(0, 0, 0, 0.54);
  --mat-datepicker-calendar-body-label-text-color: rgba(0, 0, 0, 0.54);
  --mat-datepicker-calendar-period-button-text-color: black;
  --mat-datepicker-calendar-period-button-icon-color: rgba(0, 0, 0, 0.54);
  --mat-datepicker-calendar-navigation-button-icon-color: rgba(0, 0, 0, 0.54);
  --mat-datepicker-calendar-header-divider-color: rgba(0, 0, 0, 0.12);
  --mat-datepicker-calendar-header-text-color: rgba(0, 0, 0, 0.54);
  --mat-datepicker-calendar-date-today-outline-color: rgba(0, 0, 0, 0.38);
  --mat-datepicker-calendar-date-today-disabled-state-outline-color: rgba(0, 0, 0, 0.18);
  --mat-datepicker-calendar-date-text-color: rgba(0, 0, 0, 0.87);
  --mat-datepicker-calendar-date-outline-color: transparent;
  --mat-datepicker-calendar-date-disabled-state-text-color: rgba(0, 0, 0, 0.38);
  --mat-datepicker-calendar-date-preview-state-outline-color: rgba(0, 0, 0, 0.24);
  --mat-datepicker-range-input-separator-color: rgba(0, 0, 0, 0.87);
  --mat-datepicker-range-input-disabled-state-separator-color: rgba(0, 0, 0, 0.38);
  --mat-datepicker-range-input-disabled-state-text-color: rgba(0, 0, 0, 0.38);
  --mat-datepicker-calendar-container-background-color: white;
  --mat-datepicker-calendar-container-text-color: rgba(0, 0, 0, 0.87);
}
.eng-theme--light .mat-datepicker-content.mat-accent {
  --mat-datepicker-calendar-date-selected-state-text-color: white;
  --mat-datepicker-calendar-date-selected-state-background-color: #0cabf5;
  --mat-datepicker-calendar-date-selected-disabled-state-background-color: rgba(12, 171, 245, 0.4);
  --mat-datepicker-calendar-date-today-selected-state-outline-color: white;
  --mat-datepicker-calendar-date-focus-state-background-color: rgba(12, 171, 245, 0.3);
  --mat-datepicker-calendar-date-hover-state-background-color: rgba(12, 171, 245, 0.3);
  --mat-datepicker-calendar-date-in-range-state-background-color: rgba(12, 171, 245, 0.2);
  --mat-datepicker-calendar-date-in-comparison-range-state-background-color: rgba(249, 171, 0, 0.2);
  --mat-datepicker-calendar-date-in-overlap-range-state-background-color: #a8dab5;
  --mat-datepicker-calendar-date-in-overlap-range-selected-state-background-color: rgb(69.5241935484, 163.4758064516, 93.9516129032);
}
.eng-theme--light .mat-datepicker-content.mat-warn {
  --mat-datepicker-calendar-date-selected-state-text-color: white;
  --mat-datepicker-calendar-date-selected-state-background-color: #f44336;
  --mat-datepicker-calendar-date-selected-disabled-state-background-color: rgba(244, 67, 54, 0.4);
  --mat-datepicker-calendar-date-today-selected-state-outline-color: white;
  --mat-datepicker-calendar-date-focus-state-background-color: rgba(244, 67, 54, 0.3);
  --mat-datepicker-calendar-date-hover-state-background-color: rgba(244, 67, 54, 0.3);
  --mat-datepicker-calendar-date-in-range-state-background-color: rgba(244, 67, 54, 0.2);
  --mat-datepicker-calendar-date-in-comparison-range-state-background-color: rgba(249, 171, 0, 0.2);
  --mat-datepicker-calendar-date-in-overlap-range-state-background-color: #a8dab5;
  --mat-datepicker-calendar-date-in-overlap-range-selected-state-background-color: rgb(69.5241935484, 163.4758064516, 93.9516129032);
}
.eng-theme--light .mat-datepicker-toggle-active.mat-accent {
  --mat-datepicker-toggle-active-state-icon-color: #0cabf5;
}
.eng-theme--light .mat-datepicker-toggle-active.mat-warn {
  --mat-datepicker-toggle-active-state-icon-color: #f44336;
}
.eng-theme--light .mat-calendar-controls {
  --mat-icon-button-touch-target-display: none;
}
.eng-theme--light .mat-calendar-controls .mat-mdc-icon-button.mat-mdc-button-base {
  --mdc-icon-button-state-layer-size: 40px;
  width: var(--mdc-icon-button-state-layer-size);
  height: var(--mdc-icon-button-state-layer-size);
  padding: 8px;
}
.eng-theme--light {
  --mat-datepicker-calendar-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-datepicker-calendar-text-size: 13px;
  --mat-datepicker-calendar-body-label-text-size: 14px;
  --mat-datepicker-calendar-body-label-text-weight: 500;
  --mat-datepicker-calendar-period-button-text-size: 14px;
  --mat-datepicker-calendar-period-button-text-weight: 500;
  --mat-datepicker-calendar-header-text-size: 11px;
  --mat-datepicker-calendar-header-text-weight: 400;
}
.eng-theme--light {
  --mat-divider-width: 1px;
}
.eng-theme--light {
  --mat-divider-color: rgba(0, 0, 0, 0.12);
}
.eng-theme--light {
  --mat-expansion-container-shape: 4px;
  --mat-expansion-legacy-header-indicator-display: inline-block;
  --mat-expansion-header-indicator-display: none;
}
.eng-theme--light {
  --mat-expansion-container-background-color: white;
  --mat-expansion-container-text-color: rgba(0, 0, 0, 0.87);
  --mat-expansion-actions-divider-color: rgba(0, 0, 0, 0.12);
  --mat-expansion-header-hover-state-layer-color: rgba(0, 0, 0, 0.04);
  --mat-expansion-header-focus-state-layer-color: rgba(0, 0, 0, 0.04);
  --mat-expansion-header-disabled-state-text-color: rgba(0, 0, 0, 0.26);
  --mat-expansion-header-text-color: rgba(0, 0, 0, 0.87);
  --mat-expansion-header-description-color: rgba(0, 0, 0, 0.54);
  --mat-expansion-header-indicator-color: rgba(0, 0, 0, 0.54);
}
.eng-theme--light {
  --mat-expansion-header-collapsed-state-height: 48px;
  --mat-expansion-header-expanded-state-height: 64px;
}
.eng-theme--light {
  --mat-expansion-header-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-expansion-header-text-size: 14px;
  --mat-expansion-header-text-weight: 500;
  --mat-expansion-header-text-line-height: inherit;
  --mat-expansion-header-text-tracking: inherit;
  --mat-expansion-container-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-expansion-container-text-line-height: 20px;
  --mat-expansion-container-text-size: 14px;
  --mat-expansion-container-text-tracking: 0.0178571429em;
  --mat-expansion-container-text-weight: 400;
}
.eng-theme--light {
  --mat-grid-list-tile-header-primary-text-size: 14px;
  --mat-grid-list-tile-header-secondary-text-size: 12px;
  --mat-grid-list-tile-footer-primary-text-size: 14px;
  --mat-grid-list-tile-footer-secondary-text-size: 12px;
}
.eng-theme--light {
  --mat-icon-color: inherit;
}
.eng-theme--light .mat-icon.mat-primary {
  --mat-icon-color: #0cabf5;
}
.eng-theme--light .mat-icon.mat-accent {
  --mat-icon-color: #0cabf5;
}
.eng-theme--light .mat-icon.mat-warn {
  --mat-icon-color: #f44336;
}
.eng-theme--light {
  --mat-sidenav-container-shape: 0;
  --mat-sidenav-container-elevation-shadow: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12);
  --mat-sidenav-container-width: auto;
}
.eng-theme--light {
  --mat-sidenav-container-divider-color: rgba(0, 0, 0, 0.12);
  --mat-sidenav-container-background-color: white;
  --mat-sidenav-container-text-color: rgba(0, 0, 0, 0.87);
  --mat-sidenav-content-background-color: #fafafa;
  --mat-sidenav-content-text-color: rgba(0, 0, 0, 0.87);
  --mat-sidenav-scrim-color: rgba(0, 0, 0, 0.6);
}
.eng-theme--light {
  --mat-stepper-header-icon-foreground-color: rgba(0, 0, 0, 0.87);
  --mat-stepper-header-selected-state-icon-background-color: #0cabf5;
  --mat-stepper-header-selected-state-icon-foreground-color: rgba(0, 0, 0, 0.87);
  --mat-stepper-header-done-state-icon-background-color: #0cabf5;
  --mat-stepper-header-done-state-icon-foreground-color: rgba(0, 0, 0, 0.87);
  --mat-stepper-header-edit-state-icon-background-color: #0cabf5;
  --mat-stepper-header-edit-state-icon-foreground-color: rgba(0, 0, 0, 0.87);
  --mat-stepper-container-color: white;
  --mat-stepper-line-color: rgba(0, 0, 0, 0.12);
  --mat-stepper-header-hover-state-layer-color: rgba(0, 0, 0, 0.04);
  --mat-stepper-header-focus-state-layer-color: rgba(0, 0, 0, 0.04);
  --mat-stepper-header-label-text-color: rgba(0, 0, 0, 0.54);
  --mat-stepper-header-optional-label-text-color: rgba(0, 0, 0, 0.54);
  --mat-stepper-header-selected-state-label-text-color: rgba(0, 0, 0, 0.87);
  --mat-stepper-header-error-state-label-text-color: #f44336;
  --mat-stepper-header-icon-background-color: rgba(0, 0, 0, 0.54);
  --mat-stepper-header-error-state-icon-foreground-color: #f44336;
  --mat-stepper-header-error-state-icon-background-color: transparent;
}
.eng-theme--light .mat-step-header.mat-accent {
  --mat-stepper-header-icon-foreground-color: white;
  --mat-stepper-header-selected-state-icon-background-color: #0cabf5;
  --mat-stepper-header-selected-state-icon-foreground-color: white;
  --mat-stepper-header-done-state-icon-background-color: #0cabf5;
  --mat-stepper-header-done-state-icon-foreground-color: white;
  --mat-stepper-header-edit-state-icon-background-color: #0cabf5;
  --mat-stepper-header-edit-state-icon-foreground-color: white;
}
.eng-theme--light .mat-step-header.mat-warn {
  --mat-stepper-header-icon-foreground-color: white;
  --mat-stepper-header-selected-state-icon-background-color: #f44336;
  --mat-stepper-header-selected-state-icon-foreground-color: white;
  --mat-stepper-header-done-state-icon-background-color: #f44336;
  --mat-stepper-header-done-state-icon-foreground-color: white;
  --mat-stepper-header-edit-state-icon-background-color: #f44336;
  --mat-stepper-header-edit-state-icon-foreground-color: white;
}
.eng-theme--light {
  --mat-stepper-header-height: 72px;
}
.eng-theme--light {
  --mat-stepper-container-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-stepper-header-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-stepper-header-label-text-size: 14px;
  --mat-stepper-header-label-text-weight: 400;
  --mat-stepper-header-error-state-label-text-size: 16px;
  --mat-stepper-header-selected-state-label-text-size: 16px;
  --mat-stepper-header-selected-state-label-text-weight: 400;
}
.eng-theme--light {
  --mat-sort-arrow-color: rgb(117.3, 117.3, 117.3);
}
.eng-theme--light {
  --mat-toolbar-container-background-color: whitesmoke;
  --mat-toolbar-container-text-color: rgba(0, 0, 0, 0.87);
}
.eng-theme--light .mat-toolbar.mat-primary {
  --mat-toolbar-container-background-color: #0cabf5;
  --mat-toolbar-container-text-color: rgba(0, 0, 0, 0.87);
}
.eng-theme--light .mat-toolbar.mat-accent {
  --mat-toolbar-container-background-color: #0cabf5;
  --mat-toolbar-container-text-color: white;
}
.eng-theme--light .mat-toolbar.mat-warn {
  --mat-toolbar-container-background-color: #f44336;
  --mat-toolbar-container-text-color: white;
}
.eng-theme--light {
  --mat-toolbar-standard-height: 64px;
  --mat-toolbar-mobile-height: 56px;
}
.eng-theme--light {
  --mat-toolbar-title-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-toolbar-title-text-line-height: 32px;
  --mat-toolbar-title-text-size: 20px;
  --mat-toolbar-title-text-tracking: 0.0125em;
  --mat-toolbar-title-text-weight: 500;
}
.eng-theme--light {
  --mat-tree-container-background-color: white;
  --mat-tree-node-text-color: rgba(0, 0, 0, 0.87);
}
.eng-theme--light {
  --mat-tree-node-min-height: 48px;
}
.eng-theme--light {
  --mat-tree-node-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-tree-node-text-size: 14px;
  --mat-tree-node-text-weight: 400;
}
.eng-theme--light {
  --mat-timepicker-container-shape: 4px;
  --mat-timepicker-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
}
.eng-theme--light {
  --mat-timepicker-container-background-color: white;
}
.eng-theme--light .mat-mdc-mini-fab.mat-accent {
  background-color: var(--color-toolbar-button-bg);
  color: var(--color-toolbar-button-text);
}
.eng-theme--light .popup-container {
  background-color: #ffffff;
}
.eng-theme--light .api-key-display {
  background-color: rgba(250, 250, 255, 0.8);
}
.eng-theme--light .inner-card {
  background-color: var(--color-surface2) !important;
}
.eng-theme--light .mat-toolbar-row {
  background-color: var(--color-brand);
}

.eng-theme--dark {
  background-color: var(--color-bg-secondary);
  color: var(--color-text-primary);
  --text-color: var(--color-text-primary);
}
.eng-theme--dark {
  --mat-ripple-color: rgba(255, 255, 255, 0.1);
}
.eng-theme--dark {
  --mat-option-selected-state-label-text-color: #0cabf5;
  --mat-option-label-text-color: white;
  --mat-option-hover-state-layer-color: rgba(255, 255, 255, 0.08);
  --mat-option-focus-state-layer-color: rgba(255, 255, 255, 0.08);
  --mat-option-selected-state-layer-color: rgba(255, 255, 255, 0.08);
}
.eng-theme--dark .mat-accent {
  --mat-option-selected-state-label-text-color: #424242;
  --mat-option-label-text-color: white;
  --mat-option-hover-state-layer-color: rgba(255, 255, 255, 0.08);
  --mat-option-focus-state-layer-color: rgba(255, 255, 255, 0.08);
  --mat-option-selected-state-layer-color: rgba(255, 255, 255, 0.08);
}
.eng-theme--dark .mat-warn {
  --mat-option-selected-state-label-text-color: #f44336;
  --mat-option-label-text-color: white;
  --mat-option-hover-state-layer-color: rgba(255, 255, 255, 0.08);
  --mat-option-focus-state-layer-color: rgba(255, 255, 255, 0.08);
  --mat-option-selected-state-layer-color: rgba(255, 255, 255, 0.08);
}
.eng-theme--dark {
  --mat-optgroup-label-text-color: white;
}
.eng-theme--dark {
  --mat-full-pseudo-checkbox-selected-icon-color: #424242;
  --mat-full-pseudo-checkbox-selected-checkmark-color: #303030;
  --mat-full-pseudo-checkbox-unselected-icon-color: rgba(255, 255, 255, 0.7);
  --mat-full-pseudo-checkbox-disabled-selected-checkmark-color: #303030;
  --mat-full-pseudo-checkbox-disabled-unselected-icon-color: #686868;
  --mat-full-pseudo-checkbox-disabled-selected-icon-color: #686868;
}
.eng-theme--dark {
  --mat-minimal-pseudo-checkbox-selected-checkmark-color: #424242;
  --mat-minimal-pseudo-checkbox-disabled-selected-checkmark-color: #686868;
}
.eng-theme--dark .mat-primary {
  --mat-full-pseudo-checkbox-selected-icon-color: #0cabf5;
  --mat-full-pseudo-checkbox-selected-checkmark-color: #303030;
  --mat-full-pseudo-checkbox-unselected-icon-color: rgba(255, 255, 255, 0.7);
  --mat-full-pseudo-checkbox-disabled-selected-checkmark-color: #303030;
  --mat-full-pseudo-checkbox-disabled-unselected-icon-color: #686868;
  --mat-full-pseudo-checkbox-disabled-selected-icon-color: #686868;
}
.eng-theme--dark .mat-primary {
  --mat-minimal-pseudo-checkbox-selected-checkmark-color: #0cabf5;
  --mat-minimal-pseudo-checkbox-disabled-selected-checkmark-color: #686868;
}
.eng-theme--dark .mat-accent {
  --mat-full-pseudo-checkbox-selected-icon-color: #424242;
  --mat-full-pseudo-checkbox-selected-checkmark-color: #303030;
  --mat-full-pseudo-checkbox-unselected-icon-color: rgba(255, 255, 255, 0.7);
  --mat-full-pseudo-checkbox-disabled-selected-checkmark-color: #303030;
  --mat-full-pseudo-checkbox-disabled-unselected-icon-color: #686868;
  --mat-full-pseudo-checkbox-disabled-selected-icon-color: #686868;
}
.eng-theme--dark .mat-accent {
  --mat-minimal-pseudo-checkbox-selected-checkmark-color: #424242;
  --mat-minimal-pseudo-checkbox-disabled-selected-checkmark-color: #686868;
}
.eng-theme--dark .mat-warn {
  --mat-full-pseudo-checkbox-selected-icon-color: #f44336;
  --mat-full-pseudo-checkbox-selected-checkmark-color: #303030;
  --mat-full-pseudo-checkbox-unselected-icon-color: rgba(255, 255, 255, 0.7);
  --mat-full-pseudo-checkbox-disabled-selected-checkmark-color: #303030;
  --mat-full-pseudo-checkbox-disabled-unselected-icon-color: #686868;
  --mat-full-pseudo-checkbox-disabled-selected-icon-color: #686868;
}
.eng-theme--dark .mat-warn {
  --mat-minimal-pseudo-checkbox-selected-checkmark-color: #f44336;
  --mat-minimal-pseudo-checkbox-disabled-selected-checkmark-color: #686868;
}
.eng-theme--dark {
  --mat-app-background-color: #303030;
  --mat-app-text-color: white;
  --mat-app-elevation-shadow-level-0: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-1: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-2: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-3: 0px 3px 3px -2px rgba(0, 0, 0, 0.2), 0px 3px 4px 0px rgba(0, 0, 0, 0.14), 0px 1px 8px 0px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-4: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-5: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 5px 8px 0px rgba(0, 0, 0, 0.14), 0px 1px 14px 0px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-6: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-7: 0px 4px 5px -2px rgba(0, 0, 0, 0.2), 0px 7px 10px 1px rgba(0, 0, 0, 0.14), 0px 2px 16px 1px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-8: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-9: 0px 5px 6px -3px rgba(0, 0, 0, 0.2), 0px 9px 12px 1px rgba(0, 0, 0, 0.14), 0px 3px 16px 2px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-10: 0px 6px 6px -3px rgba(0, 0, 0, 0.2), 0px 10px 14px 1px rgba(0, 0, 0, 0.14), 0px 4px 18px 3px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-11: 0px 6px 7px -4px rgba(0, 0, 0, 0.2), 0px 11px 15px 1px rgba(0, 0, 0, 0.14), 0px 4px 20px 3px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-12: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-13: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 13px 19px 2px rgba(0, 0, 0, 0.14), 0px 5px 24px 4px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-14: 0px 7px 9px -4px rgba(0, 0, 0, 0.2), 0px 14px 21px 2px rgba(0, 0, 0, 0.14), 0px 5px 26px 4px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-15: 0px 8px 9px -5px rgba(0, 0, 0, 0.2), 0px 15px 22px 2px rgba(0, 0, 0, 0.14), 0px 6px 28px 5px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-16: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-17: 0px 8px 11px -5px rgba(0, 0, 0, 0.2), 0px 17px 26px 2px rgba(0, 0, 0, 0.14), 0px 6px 32px 5px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-18: 0px 9px 11px -5px rgba(0, 0, 0, 0.2), 0px 18px 28px 2px rgba(0, 0, 0, 0.14), 0px 7px 34px 6px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-19: 0px 9px 12px -6px rgba(0, 0, 0, 0.2), 0px 19px 29px 2px rgba(0, 0, 0, 0.14), 0px 7px 36px 6px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-20: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 20px 31px 3px rgba(0, 0, 0, 0.14), 0px 8px 38px 7px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-21: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 21px 33px 3px rgba(0, 0, 0, 0.14), 0px 8px 40px 7px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-22: 0px 10px 14px -6px rgba(0, 0, 0, 0.2), 0px 22px 35px 3px rgba(0, 0, 0, 0.14), 0px 8px 42px 7px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-23: 0px 11px 14px -7px rgba(0, 0, 0, 0.2), 0px 23px 36px 3px rgba(0, 0, 0, 0.14), 0px 9px 44px 8px rgba(0, 0, 0, 0.12);
  --mat-app-elevation-shadow-level-24: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
}
.eng-theme--dark {
  --mat-option-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-option-label-text-line-height: 24px;
  --mat-option-label-text-size: 16px;
  --mat-option-label-text-tracking: 0.03125em;
  --mat-option-label-text-weight: 400;
}
.eng-theme--dark {
  --mat-optgroup-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-optgroup-label-text-line-height: 24px;
  --mat-optgroup-label-text-size: 16px;
  --mat-optgroup-label-text-tracking: 0.03125em;
  --mat-optgroup-label-text-weight: 400;
}
.eng-theme--dark {
  --mdc-elevated-card-container-shape: 4px;
}
.eng-theme--dark {
  --mdc-outlined-card-container-shape: 4px;
  --mdc-outlined-card-outline-width: 1px;
}
.eng-theme--dark {
  --mdc-elevated-card-container-color: #424242;
  --mdc-elevated-card-container-elevation: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);
}
.eng-theme--dark {
  --mdc-outlined-card-container-color: #424242;
  --mdc-outlined-card-outline-color: rgba(255, 255, 255, 0.12);
  --mdc-outlined-card-container-elevation: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);
}
.eng-theme--dark {
  --mat-card-subtitle-text-color: rgba(255, 255, 255, 0.7);
}
.eng-theme--dark {
  --mat-card-title-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-card-title-text-line-height: 32px;
  --mat-card-title-text-size: 20px;
  --mat-card-title-text-tracking: 0.0125em;
  --mat-card-title-text-weight: 500;
  --mat-card-subtitle-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-card-subtitle-text-line-height: 22px;
  --mat-card-subtitle-text-size: 14px;
  --mat-card-subtitle-text-tracking: 0.0071428571em;
  --mat-card-subtitle-text-weight: 500;
}
.eng-theme--dark {
  --mdc-linear-progress-active-indicator-height: 4px;
  --mdc-linear-progress-track-height: 4px;
  --mdc-linear-progress-track-shape: 0;
}
.eng-theme--dark .mat-mdc-progress-bar {
  --mdc-linear-progress-active-indicator-color: #0cabf5;
  --mdc-linear-progress-track-color: rgba(12, 171, 245, 0.25);
}
.eng-theme--dark .mat-mdc-progress-bar.mat-accent {
  --mdc-linear-progress-active-indicator-color: #424242;
  --mdc-linear-progress-track-color: rgba(66, 66, 66, 0.25);
}
.eng-theme--dark .mat-mdc-progress-bar.mat-warn {
  --mdc-linear-progress-active-indicator-color: #f44336;
  --mdc-linear-progress-track-color: rgba(244, 67, 54, 0.25);
}
.eng-theme--dark {
  --mdc-plain-tooltip-container-shape: 4px;
  --mdc-plain-tooltip-supporting-text-line-height: 16px;
}
.eng-theme--dark {
  --mdc-plain-tooltip-container-color: #616161;
  --mdc-plain-tooltip-supporting-text-color: #fff;
}
.eng-theme--dark {
  --mdc-plain-tooltip-supporting-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-plain-tooltip-supporting-text-size: 12px;
  --mdc-plain-tooltip-supporting-text-weight: 400;
  --mdc-plain-tooltip-supporting-text-tracking: 0.0333333333em;
}
.eng-theme--dark {
  --mdc-filled-text-field-active-indicator-height: 1px;
  --mdc-filled-text-field-focus-active-indicator-height: 2px;
  --mdc-filled-text-field-container-shape: 4px;
}
.eng-theme--dark {
  --mdc-outlined-text-field-outline-width: 1px;
  --mdc-outlined-text-field-focus-outline-width: 2px;
  --mdc-outlined-text-field-container-shape: 4px;
}
.eng-theme--dark {
  --mdc-filled-text-field-caret-color: #0cabf5;
  --mdc-filled-text-field-focus-active-indicator-color: #0cabf5;
  --mdc-filled-text-field-focus-label-text-color: rgba(12, 171, 245, 0.87);
  --mdc-filled-text-field-container-color: rgb(73.56, 73.56, 73.56);
  --mdc-filled-text-field-disabled-container-color: rgb(69.78, 69.78, 69.78);
  --mdc-filled-text-field-label-text-color: rgba(255, 255, 255, 0.6);
  --mdc-filled-text-field-hover-label-text-color: rgba(255, 255, 255, 0.6);
  --mdc-filled-text-field-disabled-label-text-color: rgba(255, 255, 255, 0.38);
  --mdc-filled-text-field-input-text-color: rgba(255, 255, 255, 0.87);
  --mdc-filled-text-field-disabled-input-text-color: rgba(255, 255, 255, 0.38);
  --mdc-filled-text-field-input-text-placeholder-color: rgba(255, 255, 255, 0.6);
  --mdc-filled-text-field-error-hover-label-text-color: #f44336;
  --mdc-filled-text-field-error-focus-label-text-color: #f44336;
  --mdc-filled-text-field-error-label-text-color: #f44336;
  --mdc-filled-text-field-error-caret-color: #f44336;
  --mdc-filled-text-field-active-indicator-color: rgba(255, 255, 255, 0.42);
  --mdc-filled-text-field-disabled-active-indicator-color: rgba(255, 255, 255, 0.06);
  --mdc-filled-text-field-hover-active-indicator-color: rgba(255, 255, 255, 0.87);
  --mdc-filled-text-field-error-active-indicator-color: #f44336;
  --mdc-filled-text-field-error-focus-active-indicator-color: #f44336;
  --mdc-filled-text-field-error-hover-active-indicator-color: #f44336;
}
.eng-theme--dark {
  --mdc-outlined-text-field-caret-color: #0cabf5;
  --mdc-outlined-text-field-focus-outline-color: #0cabf5;
  --mdc-outlined-text-field-focus-label-text-color: rgba(12, 171, 245, 0.87);
  --mdc-outlined-text-field-label-text-color: rgba(255, 255, 255, 0.6);
  --mdc-outlined-text-field-hover-label-text-color: rgba(255, 255, 255, 0.6);
  --mdc-outlined-text-field-disabled-label-text-color: rgba(255, 255, 255, 0.38);
  --mdc-outlined-text-field-input-text-color: rgba(255, 255, 255, 0.87);
  --mdc-outlined-text-field-disabled-input-text-color: rgba(255, 255, 255, 0.38);
  --mdc-outlined-text-field-input-text-placeholder-color: rgba(255, 255, 255, 0.6);
  --mdc-outlined-text-field-error-caret-color: #f44336;
  --mdc-outlined-text-field-error-focus-label-text-color: #f44336;
  --mdc-outlined-text-field-error-label-text-color: #f44336;
  --mdc-outlined-text-field-error-hover-label-text-color: #f44336;
  --mdc-outlined-text-field-outline-color: rgba(255, 255, 255, 0.38);
  --mdc-outlined-text-field-disabled-outline-color: rgba(255, 255, 255, 0.06);
  --mdc-outlined-text-field-hover-outline-color: rgba(255, 255, 255, 0.87);
  --mdc-outlined-text-field-error-focus-outline-color: #f44336;
  --mdc-outlined-text-field-error-hover-outline-color: #f44336;
  --mdc-outlined-text-field-error-outline-color: #f44336;
}
.eng-theme--dark {
  --mat-form-field-focus-select-arrow-color: rgba(12, 171, 245, 0.87);
  --mat-form-field-disabled-input-text-placeholder-color: rgba(255, 255, 255, 0.38);
  --mat-form-field-state-layer-color: rgba(255, 255, 255, 0.87);
  --mat-form-field-error-text-color: #f44336;
  --mat-form-field-select-option-text-color: rgba(0, 0, 0, 0.87);
  --mat-form-field-select-disabled-option-text-color: rgba(0, 0, 0, 0.38);
  --mat-form-field-leading-icon-color: unset;
  --mat-form-field-disabled-leading-icon-color: unset;
  --mat-form-field-trailing-icon-color: unset;
  --mat-form-field-disabled-trailing-icon-color: unset;
  --mat-form-field-error-focus-trailing-icon-color: unset;
  --mat-form-field-error-hover-trailing-icon-color: unset;
  --mat-form-field-error-trailing-icon-color: unset;
  --mat-form-field-enabled-select-arrow-color: rgba(255, 255, 255, 0.54);
  --mat-form-field-disabled-select-arrow-color: rgba(255, 255, 255, 0.38);
  --mat-form-field-hover-state-layer-opacity: 0.08;
  --mat-form-field-focus-state-layer-opacity: 0.24;
}
.eng-theme--dark .mat-mdc-form-field.mat-accent {
  --mdc-filled-text-field-caret-color: #424242;
  --mdc-filled-text-field-focus-active-indicator-color: #424242;
  --mdc-filled-text-field-focus-label-text-color: rgba(66, 66, 66, 0.87);
}
.eng-theme--dark .mat-mdc-form-field.mat-accent {
  --mdc-outlined-text-field-caret-color: #424242;
  --mdc-outlined-text-field-focus-outline-color: #424242;
  --mdc-outlined-text-field-focus-label-text-color: rgba(66, 66, 66, 0.87);
}
.eng-theme--dark .mat-mdc-form-field.mat-accent {
  --mat-form-field-focus-select-arrow-color: rgba(66, 66, 66, 0.87);
}
.eng-theme--dark .mat-mdc-form-field.mat-warn {
  --mdc-filled-text-field-caret-color: #f44336;
  --mdc-filled-text-field-focus-active-indicator-color: #f44336;
  --mdc-filled-text-field-focus-label-text-color: rgba(244, 67, 54, 0.87);
}
.eng-theme--dark .mat-mdc-form-field.mat-warn {
  --mdc-outlined-text-field-caret-color: #f44336;
  --mdc-outlined-text-field-focus-outline-color: #f44336;
  --mdc-outlined-text-field-focus-label-text-color: rgba(244, 67, 54, 0.87);
}
.eng-theme--dark .mat-mdc-form-field.mat-warn {
  --mat-form-field-focus-select-arrow-color: rgba(244, 67, 54, 0.87);
}
.eng-theme--dark {
  --mat-form-field-container-height: 56px;
  --mat-form-field-filled-label-display: block;
  --mat-form-field-container-vertical-padding: 16px;
  --mat-form-field-filled-with-label-container-padding-top: 24px;
  --mat-form-field-filled-with-label-container-padding-bottom: 8px;
}
.eng-theme--dark {
  --mdc-filled-text-field-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-filled-text-field-label-text-size: 16px;
  --mdc-filled-text-field-label-text-tracking: 0.03125em;
  --mdc-filled-text-field-label-text-weight: 400;
}
.eng-theme--dark {
  --mdc-outlined-text-field-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-outlined-text-field-label-text-size: 16px;
  --mdc-outlined-text-field-label-text-tracking: 0.03125em;
  --mdc-outlined-text-field-label-text-weight: 400;
}
.eng-theme--dark {
  --mat-form-field-container-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-form-field-container-text-line-height: 24px;
  --mat-form-field-container-text-size: 16px;
  --mat-form-field-container-text-tracking: 0.03125em;
  --mat-form-field-container-text-weight: 400;
  --mat-form-field-outlined-label-text-populated-size: 16px;
  --mat-form-field-subscript-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-form-field-subscript-text-line-height: 20px;
  --mat-form-field-subscript-text-size: 12px;
  --mat-form-field-subscript-text-tracking: 0.0333333333em;
  --mat-form-field-subscript-text-weight: 400;
}
.eng-theme--dark {
  --mat-select-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
}
.eng-theme--dark {
  --mat-select-panel-background-color: #424242;
  --mat-select-enabled-trigger-text-color: rgba(255, 255, 255, 0.87);
  --mat-select-disabled-trigger-text-color: rgba(255, 255, 255, 0.38);
  --mat-select-placeholder-text-color: rgba(255, 255, 255, 0.6);
  --mat-select-enabled-arrow-color: rgba(255, 255, 255, 0.54);
  --mat-select-disabled-arrow-color: rgba(255, 255, 255, 0.38);
  --mat-select-focused-arrow-color: rgba(12, 171, 245, 0.87);
  --mat-select-invalid-arrow-color: rgba(244, 67, 54, 0.87);
}
.eng-theme--dark .mat-mdc-form-field.mat-accent {
  --mat-select-panel-background-color: #424242;
  --mat-select-enabled-trigger-text-color: rgba(255, 255, 255, 0.87);
  --mat-select-disabled-trigger-text-color: rgba(255, 255, 255, 0.38);
  --mat-select-placeholder-text-color: rgba(255, 255, 255, 0.6);
  --mat-select-enabled-arrow-color: rgba(255, 255, 255, 0.54);
  --mat-select-disabled-arrow-color: rgba(255, 255, 255, 0.38);
  --mat-select-focused-arrow-color: rgba(66, 66, 66, 0.87);
  --mat-select-invalid-arrow-color: rgba(244, 67, 54, 0.87);
}
.eng-theme--dark .mat-mdc-form-field.mat-warn {
  --mat-select-panel-background-color: #424242;
  --mat-select-enabled-trigger-text-color: rgba(255, 255, 255, 0.87);
  --mat-select-disabled-trigger-text-color: rgba(255, 255, 255, 0.38);
  --mat-select-placeholder-text-color: rgba(255, 255, 255, 0.6);
  --mat-select-enabled-arrow-color: rgba(255, 255, 255, 0.54);
  --mat-select-disabled-arrow-color: rgba(255, 255, 255, 0.38);
  --mat-select-focused-arrow-color: rgba(244, 67, 54, 0.87);
  --mat-select-invalid-arrow-color: rgba(244, 67, 54, 0.87);
}
.eng-theme--dark {
  --mat-select-arrow-transform: translateY(-8px);
}
.eng-theme--dark {
  --mat-select-trigger-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-select-trigger-text-line-height: 24px;
  --mat-select-trigger-text-size: 16px;
  --mat-select-trigger-text-tracking: 0.03125em;
  --mat-select-trigger-text-weight: 400;
}
.eng-theme--dark {
  --mat-autocomplete-container-shape: 4px;
  --mat-autocomplete-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
}
.eng-theme--dark {
  --mat-autocomplete-background-color: #424242;
}
.eng-theme--dark {
  --mdc-dialog-container-shape: 4px;
}
.eng-theme--dark {
  --mat-dialog-container-elevation-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
  --mat-dialog-container-max-width: 80vw;
  --mat-dialog-container-small-max-width: 80vw;
  --mat-dialog-container-min-width: 0;
  --mat-dialog-actions-alignment: start;
  --mat-dialog-actions-padding: 8px;
  --mat-dialog-content-padding: 20px 24px;
  --mat-dialog-with-actions-content-padding: 20px 24px;
  --mat-dialog-headline-padding: 0 24px 9px;
}
.eng-theme--dark {
  --mdc-dialog-container-color: #424242;
  --mdc-dialog-subhead-color: rgba(255, 255, 255, 0.87);
  --mdc-dialog-supporting-text-color: rgba(255, 255, 255, 0.6);
}
.eng-theme--dark {
  --mdc-dialog-subhead-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-dialog-subhead-line-height: 32px;
  --mdc-dialog-subhead-size: 20px;
  --mdc-dialog-subhead-weight: 500;
  --mdc-dialog-subhead-tracking: 0.0125em;
  --mdc-dialog-supporting-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-dialog-supporting-text-line-height: 24px;
  --mdc-dialog-supporting-text-size: 16px;
  --mdc-dialog-supporting-text-weight: 400;
  --mdc-dialog-supporting-text-tracking: 0.03125em;
}
.eng-theme--dark .mat-mdc-standard-chip {
  --mdc-chip-container-shape-radius: 16px;
  --mdc-chip-with-avatar-avatar-shape-radius: 14px;
  --mdc-chip-with-avatar-avatar-size: 28px;
  --mdc-chip-with-icon-icon-size: 18px;
  --mdc-chip-outline-width: 0;
  --mdc-chip-outline-color: transparent;
  --mdc-chip-disabled-outline-color: transparent;
  --mdc-chip-focus-outline-color: transparent;
  --mdc-chip-hover-state-layer-opacity: 0.04;
  --mdc-chip-with-avatar-disabled-avatar-opacity: 1;
  --mdc-chip-flat-selected-outline-width: 0;
  --mdc-chip-selected-hover-state-layer-opacity: 0.04;
  --mdc-chip-with-trailing-icon-disabled-trailing-icon-opacity: 1;
  --mdc-chip-with-icon-disabled-icon-opacity: 1;
}
.eng-theme--dark .mat-mdc-standard-chip {
  --mat-chip-disabled-container-opacity: 0.4;
  --mat-chip-trailing-action-opacity: 0.54;
  --mat-chip-trailing-action-focus-opacity: 1;
  --mat-chip-trailing-action-state-layer-color: transparent;
  --mat-chip-selected-trailing-action-state-layer-color: transparent;
  --mat-chip-trailing-action-hover-state-layer-opacity: 0;
  --mat-chip-trailing-action-focus-state-layer-opacity: 0;
}
.eng-theme--dark .mat-mdc-standard-chip {
  --mdc-chip-disabled-label-text-color: #fafafa;
  --mdc-chip-elevated-container-color: rgb(88.68, 88.68, 88.68);
  --mdc-chip-elevated-selected-container-color: rgb(88.68, 88.68, 88.68);
  --mdc-chip-elevated-disabled-container-color: rgb(88.68, 88.68, 88.68);
  --mdc-chip-flat-disabled-selected-container-color: rgb(88.68, 88.68, 88.68);
  --mdc-chip-focus-state-layer-color: white;
  --mdc-chip-hover-state-layer-color: white;
  --mdc-chip-selected-hover-state-layer-color: white;
  --mdc-chip-focus-state-layer-opacity: 0.12;
  --mdc-chip-selected-focus-state-layer-color: white;
  --mdc-chip-selected-focus-state-layer-opacity: 0.12;
  --mdc-chip-label-text-color: #fafafa;
  --mdc-chip-selected-label-text-color: #fafafa;
  --mdc-chip-with-icon-icon-color: #fafafa;
  --mdc-chip-with-icon-disabled-icon-color: #fafafa;
  --mdc-chip-with-icon-selected-icon-color: #fafafa;
  --mdc-chip-with-trailing-icon-disabled-trailing-icon-color: #fafafa;
  --mdc-chip-with-trailing-icon-trailing-icon-color: #fafafa;
}
.eng-theme--dark .mat-mdc-standard-chip {
  --mat-chip-selected-disabled-trailing-icon-color: #fafafa;
  --mat-chip-selected-trailing-icon-color: #fafafa;
}
.eng-theme--dark .mat-mdc-standard-chip.mat-mdc-chip-selected.mat-primary, .eng-theme--dark .mat-mdc-standard-chip.mat-mdc-chip-highlighted.mat-primary {
  --mdc-chip-disabled-label-text-color: rgba(0, 0, 0, 0.87);
  --mdc-chip-elevated-container-color: #0cabf5;
  --mdc-chip-elevated-selected-container-color: #0cabf5;
  --mdc-chip-elevated-disabled-container-color: #0cabf5;
  --mdc-chip-flat-disabled-selected-container-color: #0cabf5;
  --mdc-chip-focus-state-layer-color: white;
  --mdc-chip-hover-state-layer-color: white;
  --mdc-chip-selected-hover-state-layer-color: white;
  --mdc-chip-focus-state-layer-opacity: 0.12;
  --mdc-chip-selected-focus-state-layer-color: white;
  --mdc-chip-selected-focus-state-layer-opacity: 0.12;
  --mdc-chip-label-text-color: rgba(0, 0, 0, 0.87);
  --mdc-chip-selected-label-text-color: rgba(0, 0, 0, 0.87);
  --mdc-chip-with-icon-icon-color: rgba(0, 0, 0, 0.87);
  --mdc-chip-with-icon-disabled-icon-color: rgba(0, 0, 0, 0.87);
  --mdc-chip-with-icon-selected-icon-color: rgba(0, 0, 0, 0.87);
  --mdc-chip-with-trailing-icon-disabled-trailing-icon-color: rgba(0, 0, 0, 0.87);
  --mdc-chip-with-trailing-icon-trailing-icon-color: rgba(0, 0, 0, 0.87);
}
.eng-theme--dark .mat-mdc-standard-chip.mat-mdc-chip-selected.mat-primary, .eng-theme--dark .mat-mdc-standard-chip.mat-mdc-chip-highlighted.mat-primary {
  --mat-chip-selected-disabled-trailing-icon-color: rgba(0, 0, 0, 0.87);
  --mat-chip-selected-trailing-icon-color: rgba(0, 0, 0, 0.87);
}
.eng-theme--dark .mat-mdc-standard-chip.mat-mdc-chip-selected.mat-accent, .eng-theme--dark .mat-mdc-standard-chip.mat-mdc-chip-highlighted.mat-accent {
  --mdc-chip-disabled-label-text-color: white;
  --mdc-chip-elevated-container-color: #424242;
  --mdc-chip-elevated-selected-container-color: #424242;
  --mdc-chip-elevated-disabled-container-color: #424242;
  --mdc-chip-flat-disabled-selected-container-color: #424242;
  --mdc-chip-focus-state-layer-color: white;
  --mdc-chip-hover-state-layer-color: white;
  --mdc-chip-selected-hover-state-layer-color: white;
  --mdc-chip-focus-state-layer-opacity: 0.12;
  --mdc-chip-selected-focus-state-layer-color: white;
  --mdc-chip-selected-focus-state-layer-opacity: 0.12;
  --mdc-chip-label-text-color: white;
  --mdc-chip-selected-label-text-color: white;
  --mdc-chip-with-icon-icon-color: white;
  --mdc-chip-with-icon-disabled-icon-color: white;
  --mdc-chip-with-icon-selected-icon-color: white;
  --mdc-chip-with-trailing-icon-disabled-trailing-icon-color: white;
  --mdc-chip-with-trailing-icon-trailing-icon-color: white;
}
.eng-theme--dark .mat-mdc-standard-chip.mat-mdc-chip-selected.mat-accent, .eng-theme--dark .mat-mdc-standard-chip.mat-mdc-chip-highlighted.mat-accent {
  --mat-chip-selected-disabled-trailing-icon-color: white;
  --mat-chip-selected-trailing-icon-color: white;
}
.eng-theme--dark .mat-mdc-standard-chip.mat-mdc-chip-selected.mat-warn, .eng-theme--dark .mat-mdc-standard-chip.mat-mdc-chip-highlighted.mat-warn {
  --mdc-chip-disabled-label-text-color: white;
  --mdc-chip-elevated-container-color: #f44336;
  --mdc-chip-elevated-selected-container-color: #f44336;
  --mdc-chip-elevated-disabled-container-color: #f44336;
  --mdc-chip-flat-disabled-selected-container-color: #f44336;
  --mdc-chip-focus-state-layer-color: white;
  --mdc-chip-hover-state-layer-color: white;
  --mdc-chip-selected-hover-state-layer-color: white;
  --mdc-chip-focus-state-layer-opacity: 0.12;
  --mdc-chip-selected-focus-state-layer-color: white;
  --mdc-chip-selected-focus-state-layer-opacity: 0.12;
  --mdc-chip-label-text-color: white;
  --mdc-chip-selected-label-text-color: white;
  --mdc-chip-with-icon-icon-color: white;
  --mdc-chip-with-icon-disabled-icon-color: white;
  --mdc-chip-with-icon-selected-icon-color: white;
  --mdc-chip-with-trailing-icon-disabled-trailing-icon-color: white;
  --mdc-chip-with-trailing-icon-trailing-icon-color: white;
}
.eng-theme--dark .mat-mdc-standard-chip.mat-mdc-chip-selected.mat-warn, .eng-theme--dark .mat-mdc-standard-chip.mat-mdc-chip-highlighted.mat-warn {
  --mat-chip-selected-disabled-trailing-icon-color: white;
  --mat-chip-selected-trailing-icon-color: white;
}
.eng-theme--dark .mat-mdc-chip.mat-mdc-standard-chip {
  --mdc-chip-container-height: 32px;
}
.eng-theme--dark .mat-mdc-standard-chip {
  --mdc-chip-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-chip-label-text-line-height: 20px;
  --mdc-chip-label-text-size: 14px;
  --mdc-chip-label-text-tracking: 0.0178571429em;
  --mdc-chip-label-text-weight: 400;
}
.eng-theme--dark {
  --mdc-switch-disabled-selected-icon-opacity: 0.38;
  --mdc-switch-disabled-track-opacity: 0.12;
  --mdc-switch-disabled-unselected-icon-opacity: 0.38;
  --mdc-switch-handle-height: 20px;
  --mdc-switch-handle-shape: 10px;
  --mdc-switch-handle-width: 20px;
  --mdc-switch-selected-icon-size: 18px;
  --mdc-switch-track-height: 14px;
  --mdc-switch-track-shape: 7px;
  --mdc-switch-track-width: 36px;
  --mdc-switch-unselected-icon-size: 18px;
  --mdc-switch-selected-focus-state-layer-opacity: 0.12;
  --mdc-switch-selected-hover-state-layer-opacity: 0.04;
  --mdc-switch-selected-pressed-state-layer-opacity: 0.1;
  --mdc-switch-unselected-focus-state-layer-opacity: 0.12;
  --mdc-switch-unselected-hover-state-layer-opacity: 0.04;
  --mdc-switch-unselected-pressed-state-layer-opacity: 0.1;
}
.eng-theme--dark .mat-mdc-slide-toggle {
  --mat-switch-disabled-selected-handle-opacity: 0.38;
  --mat-switch-disabled-unselected-handle-opacity: 0.38;
  --mat-switch-unselected-handle-size: 20px;
  --mat-switch-selected-handle-size: 20px;
  --mat-switch-pressed-handle-size: 20px;
  --mat-switch-with-icon-handle-size: 20px;
  --mat-switch-selected-handle-horizontal-margin: 0;
  --mat-switch-selected-with-icon-handle-horizontal-margin: 0;
  --mat-switch-selected-pressed-handle-horizontal-margin: 0;
  --mat-switch-unselected-handle-horizontal-margin: 0;
  --mat-switch-unselected-with-icon-handle-horizontal-margin: 0;
  --mat-switch-unselected-pressed-handle-horizontal-margin: 0;
  --mat-switch-visible-track-opacity: 1;
  --mat-switch-hidden-track-opacity: 1;
  --mat-switch-visible-track-transition: transform 75ms 0ms cubic-bezier(0, 0, 0.2, 1);
  --mat-switch-hidden-track-transition: transform 75ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
  --mat-switch-track-outline-width: 1px;
  --mat-switch-track-outline-color: transparent;
  --mat-switch-selected-track-outline-width: 1px;
  --mat-switch-selected-track-outline-color: transparent;
  --mat-switch-disabled-unselected-track-outline-width: 1px;
  --mat-switch-disabled-unselected-track-outline-color: transparent;
}
.eng-theme--dark {
  --mdc-switch-selected-focus-state-layer-color: #81c784;
  --mdc-switch-selected-handle-color: #81c784;
  --mdc-switch-selected-hover-state-layer-color: #81c784;
  --mdc-switch-selected-pressed-state-layer-color: #81c784;
  --mdc-switch-selected-focus-handle-color: #a5d6a7;
  --mdc-switch-selected-hover-handle-color: #a5d6a7;
  --mdc-switch-selected-pressed-handle-color: #a5d6a7;
  --mdc-switch-selected-focus-track-color: #a8c84d;
  --mdc-switch-selected-hover-track-color: #a8c84d;
  --mdc-switch-selected-pressed-track-color: #a8c84d;
  --mdc-switch-selected-track-color: #a8c84d;
  --mdc-switch-disabled-selected-handle-color: #000;
  --mdc-switch-disabled-selected-icon-color: #212121;
  --mdc-switch-disabled-selected-track-color: #f5f5f5;
  --mdc-switch-disabled-unselected-handle-color: #000;
  --mdc-switch-disabled-unselected-icon-color: #212121;
  --mdc-switch-disabled-unselected-track-color: #f5f5f5;
  --mdc-switch-handle-surface-color: #fff;
  --mdc-switch-selected-icon-color: #212121;
  --mdc-switch-unselected-focus-handle-color: #fafafa;
  --mdc-switch-unselected-focus-state-layer-color: #f5f5f5;
  --mdc-switch-unselected-focus-track-color: #616161;
  --mdc-switch-unselected-handle-color: #9e9e9e;
  --mdc-switch-unselected-hover-handle-color: #fafafa;
  --mdc-switch-unselected-hover-state-layer-color: #f5f5f5;
  --mdc-switch-unselected-hover-track-color: #616161;
  --mdc-switch-unselected-icon-color: #212121;
  --mdc-switch-unselected-pressed-handle-color: #fafafa;
  --mdc-switch-unselected-pressed-state-layer-color: #f5f5f5;
  --mdc-switch-unselected-pressed-track-color: #616161;
  --mdc-switch-unselected-track-color: #616161;
  --mdc-switch-handle-elevation-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);
  --mdc-switch-disabled-handle-elevation-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);
}
.eng-theme--dark {
  --mdc-switch-disabled-label-text-color: rgba(255, 255, 255, 0.5);
}
.eng-theme--dark .mat-mdc-slide-toggle {
  --mat-switch-label-text-color: white;
}
.eng-theme--dark .mat-mdc-slide-toggle.mat-accent {
  --mdc-switch-selected-focus-state-layer-color: #757575;
  --mdc-switch-selected-handle-color: #757575;
  --mdc-switch-selected-hover-state-layer-color: #757575;
  --mdc-switch-selected-pressed-state-layer-color: #757575;
  --mdc-switch-selected-focus-handle-color: #9e9e9e;
  --mdc-switch-selected-hover-handle-color: #9e9e9e;
  --mdc-switch-selected-pressed-handle-color: #9e9e9e;
  --mdc-switch-selected-focus-track-color: #303030;
  --mdc-switch-selected-hover-track-color: #303030;
  --mdc-switch-selected-pressed-track-color: #303030;
  --mdc-switch-selected-track-color: #303030;
}
.eng-theme--dark .mat-mdc-slide-toggle.mat-warn {
  --mdc-switch-selected-focus-state-layer-color: #e57373;
  --mdc-switch-selected-handle-color: #e57373;
  --mdc-switch-selected-hover-state-layer-color: #e57373;
  --mdc-switch-selected-pressed-state-layer-color: #e57373;
  --mdc-switch-selected-focus-handle-color: #ef9a9a;
  --mdc-switch-selected-hover-handle-color: #ef9a9a;
  --mdc-switch-selected-pressed-handle-color: #ef9a9a;
  --mdc-switch-selected-focus-track-color: #e53935;
  --mdc-switch-selected-hover-track-color: #e53935;
  --mdc-switch-selected-pressed-track-color: #e53935;
  --mdc-switch-selected-track-color: #e53935;
}
.eng-theme--dark {
  --mdc-switch-state-layer-size: 40px;
}
.eng-theme--dark .mat-mdc-slide-toggle {
  --mat-switch-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-switch-label-text-line-height: 20px;
  --mat-switch-label-text-size: 14px;
  --mat-switch-label-text-tracking: 0.0178571429em;
  --mat-switch-label-text-weight: 400;
}
.eng-theme--dark {
  --mdc-radio-disabled-selected-icon-opacity: 0.38;
  --mdc-radio-disabled-unselected-icon-opacity: 0.38;
  --mdc-radio-state-layer-size: 40px;
}
.eng-theme--dark .mat-mdc-radio-button.mat-primary {
  --mdc-radio-disabled-selected-icon-color: white;
  --mdc-radio-disabled-unselected-icon-color: white;
  --mdc-radio-unselected-hover-icon-color: #eeeeee;
  --mdc-radio-unselected-focus-icon-color: #eeeeee;
  --mdc-radio-unselected-icon-color: rgba(255, 255, 255, 0.54);
  --mdc-radio-unselected-pressed-icon-color: rgba(255, 255, 255, 0.54);
  --mdc-radio-selected-focus-icon-color: #0cabf5;
  --mdc-radio-selected-hover-icon-color: #0cabf5;
  --mdc-radio-selected-icon-color: #0cabf5;
  --mdc-radio-selected-pressed-icon-color: #0cabf5;
}
.eng-theme--dark .mat-mdc-radio-button.mat-primary {
  --mat-radio-ripple-color: white;
  --mat-radio-checked-ripple-color: #0cabf5;
  --mat-radio-disabled-label-color: rgba(255, 255, 255, 0.5);
  --mat-radio-label-text-color: white;
}
.eng-theme--dark .mat-mdc-radio-button.mat-accent {
  --mdc-radio-disabled-selected-icon-color: white;
  --mdc-radio-disabled-unselected-icon-color: white;
  --mdc-radio-unselected-hover-icon-color: #eeeeee;
  --mdc-radio-unselected-focus-icon-color: #eeeeee;
  --mdc-radio-unselected-icon-color: rgba(255, 255, 255, 0.54);
  --mdc-radio-unselected-pressed-icon-color: rgba(255, 255, 255, 0.54);
  --mdc-radio-selected-focus-icon-color: #424242;
  --mdc-radio-selected-hover-icon-color: #424242;
  --mdc-radio-selected-icon-color: #424242;
  --mdc-radio-selected-pressed-icon-color: #424242;
}
.eng-theme--dark .mat-mdc-radio-button.mat-accent {
  --mat-radio-ripple-color: white;
  --mat-radio-checked-ripple-color: #424242;
  --mat-radio-disabled-label-color: rgba(255, 255, 255, 0.5);
  --mat-radio-label-text-color: white;
}
.eng-theme--dark .mat-mdc-radio-button.mat-warn {
  --mdc-radio-disabled-selected-icon-color: white;
  --mdc-radio-disabled-unselected-icon-color: white;
  --mdc-radio-unselected-hover-icon-color: #eeeeee;
  --mdc-radio-unselected-focus-icon-color: #eeeeee;
  --mdc-radio-unselected-icon-color: rgba(255, 255, 255, 0.54);
  --mdc-radio-unselected-pressed-icon-color: rgba(255, 255, 255, 0.54);
  --mdc-radio-selected-focus-icon-color: #f44336;
  --mdc-radio-selected-hover-icon-color: #f44336;
  --mdc-radio-selected-icon-color: #f44336;
  --mdc-radio-selected-pressed-icon-color: #f44336;
}
.eng-theme--dark .mat-mdc-radio-button.mat-warn {
  --mat-radio-ripple-color: white;
  --mat-radio-checked-ripple-color: #f44336;
  --mat-radio-disabled-label-color: rgba(255, 255, 255, 0.5);
  --mat-radio-label-text-color: white;
}
.eng-theme--dark {
  --mdc-radio-state-layer-size: 40px;
}
.eng-theme--dark {
  --mat-radio-touch-target-display: block;
}
.eng-theme--dark {
  --mat-radio-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-radio-label-text-line-height: 20px;
  --mat-radio-label-text-size: 14px;
  --mat-radio-label-text-tracking: 0.0178571429em;
  --mat-radio-label-text-weight: 400;
}
.eng-theme--dark {
  --mdc-slider-active-track-height: 6px;
  --mdc-slider-active-track-shape: 9999px;
  --mdc-slider-handle-height: 20px;
  --mdc-slider-handle-shape: 50%;
  --mdc-slider-handle-width: 20px;
  --mdc-slider-inactive-track-height: 4px;
  --mdc-slider-inactive-track-shape: 9999px;
  --mdc-slider-with-overlap-handle-outline-width: 1px;
  --mdc-slider-with-tick-marks-active-container-opacity: 0.6;
  --mdc-slider-with-tick-marks-container-shape: 50%;
  --mdc-slider-with-tick-marks-container-size: 2px;
  --mdc-slider-with-tick-marks-inactive-container-opacity: 0.6;
  --mdc-slider-handle-elevation: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12);
}
.eng-theme--dark {
  --mat-slider-value-indicator-width: auto;
  --mat-slider-value-indicator-height: 32px;
  --mat-slider-value-indicator-caret-display: block;
  --mat-slider-value-indicator-border-radius: 4px;
  --mat-slider-value-indicator-padding: 0 12px;
  --mat-slider-value-indicator-text-transform: none;
  --mat-slider-value-indicator-container-transform: translateX(-50%);
}
.eng-theme--dark {
  --mdc-slider-handle-color: #0cabf5;
  --mdc-slider-focus-handle-color: #0cabf5;
  --mdc-slider-hover-handle-color: #0cabf5;
  --mdc-slider-active-track-color: #0cabf5;
  --mdc-slider-inactive-track-color: #0cabf5;
  --mdc-slider-with-tick-marks-inactive-container-color: #0cabf5;
  --mdc-slider-with-tick-marks-active-container-color: rgba(0, 0, 0, 0.87);
  --mdc-slider-disabled-active-track-color: #fff;
  --mdc-slider-disabled-handle-color: #fff;
  --mdc-slider-disabled-inactive-track-color: #fff;
  --mdc-slider-label-container-color: #fff;
  --mdc-slider-label-label-text-color: #000;
  --mdc-slider-with-overlap-handle-outline-color: #fff;
  --mdc-slider-with-tick-marks-disabled-container-color: #fff;
}
.eng-theme--dark {
  --mat-slider-ripple-color: #0cabf5;
  --mat-slider-hover-state-layer-color: rgba(12, 171, 245, 0.05);
  --mat-slider-focus-state-layer-color: rgba(12, 171, 245, 0.2);
  --mat-slider-value-indicator-opacity: 0.9;
}
.eng-theme--dark .mat-accent {
  --mdc-slider-handle-color: #424242;
  --mdc-slider-focus-handle-color: #424242;
  --mdc-slider-hover-handle-color: #424242;
  --mdc-slider-active-track-color: #424242;
  --mdc-slider-inactive-track-color: #424242;
  --mdc-slider-with-tick-marks-inactive-container-color: #424242;
  --mdc-slider-with-tick-marks-active-container-color: white;
}
.eng-theme--dark .mat-accent {
  --mat-slider-ripple-color: #424242;
  --mat-slider-hover-state-layer-color: rgba(66, 66, 66, 0.05);
  --mat-slider-focus-state-layer-color: rgba(66, 66, 66, 0.2);
}
.eng-theme--dark .mat-warn {
  --mdc-slider-handle-color: #f44336;
  --mdc-slider-focus-handle-color: #f44336;
  --mdc-slider-hover-handle-color: #f44336;
  --mdc-slider-active-track-color: #f44336;
  --mdc-slider-inactive-track-color: #f44336;
  --mdc-slider-with-tick-marks-inactive-container-color: #f44336;
  --mdc-slider-with-tick-marks-active-container-color: white;
}
.eng-theme--dark .mat-warn {
  --mat-slider-ripple-color: #f44336;
  --mat-slider-hover-state-layer-color: rgba(244, 67, 54, 0.05);
  --mat-slider-focus-state-layer-color: rgba(244, 67, 54, 0.2);
}
.eng-theme--dark {
  --mdc-slider-label-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-slider-label-label-text-size: 14px;
  --mdc-slider-label-label-text-line-height: 22px;
  --mdc-slider-label-label-text-tracking: 0.0071428571em;
  --mdc-slider-label-label-text-weight: 500;
}
.eng-theme--dark {
  --mat-menu-container-shape: 4px;
  --mat-menu-divider-bottom-spacing: 0;
  --mat-menu-divider-top-spacing: 0;
  --mat-menu-item-spacing: 16px;
  --mat-menu-item-icon-size: 24px;
  --mat-menu-item-leading-spacing: 16px;
  --mat-menu-item-trailing-spacing: 16px;
  --mat-menu-item-with-icon-leading-spacing: 16px;
  --mat-menu-item-with-icon-trailing-spacing: 16px;
  --mat-menu-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
}
.eng-theme--dark {
  --mat-menu-item-label-text-color: white;
  --mat-menu-item-icon-color: white;
  --mat-menu-item-hover-state-layer-color: rgba(255, 255, 255, 0.08);
  --mat-menu-item-focus-state-layer-color: rgba(255, 255, 255, 0.08);
  --mat-menu-container-color: #424242;
  --mat-menu-divider-color: rgba(255, 255, 255, 0.12);
}
.eng-theme--dark {
  --mat-menu-item-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-menu-item-label-text-size: 16px;
  --mat-menu-item-label-text-tracking: 0.03125em;
  --mat-menu-item-label-text-line-height: 24px;
  --mat-menu-item-label-text-weight: 400;
}
.eng-theme--dark {
  --mdc-list-list-item-container-shape: 0;
  --mdc-list-list-item-leading-avatar-shape: 50%;
  --mdc-list-list-item-container-color: transparent;
  --mdc-list-list-item-selected-container-color: transparent;
  --mdc-list-list-item-leading-avatar-color: transparent;
  --mdc-list-list-item-leading-icon-size: 24px;
  --mdc-list-list-item-leading-avatar-size: 40px;
  --mdc-list-list-item-trailing-icon-size: 24px;
  --mdc-list-list-item-disabled-state-layer-color: transparent;
  --mdc-list-list-item-disabled-state-layer-opacity: 0;
  --mdc-list-list-item-disabled-label-text-opacity: 0.38;
  --mdc-list-list-item-disabled-leading-icon-opacity: 0.38;
  --mdc-list-list-item-disabled-trailing-icon-opacity: 0.38;
}
.eng-theme--dark {
  --mat-list-active-indicator-color: transparent;
  --mat-list-active-indicator-shape: 4px;
}
.eng-theme--dark {
  --mdc-list-list-item-label-text-color: white;
  --mdc-list-list-item-supporting-text-color: rgba(255, 255, 255, 0.7);
  --mdc-list-list-item-leading-icon-color: rgba(255, 255, 255, 0.5);
  --mdc-list-list-item-trailing-supporting-text-color: rgba(255, 255, 255, 0.5);
  --mdc-list-list-item-trailing-icon-color: rgba(255, 255, 255, 0.5);
  --mdc-list-list-item-selected-trailing-icon-color: rgba(255, 255, 255, 0.5);
  --mdc-list-list-item-disabled-label-text-color: white;
  --mdc-list-list-item-disabled-leading-icon-color: white;
  --mdc-list-list-item-disabled-trailing-icon-color: white;
  --mdc-list-list-item-hover-label-text-color: white;
  --mdc-list-list-item-hover-leading-icon-color: rgba(255, 255, 255, 0.5);
  --mdc-list-list-item-hover-trailing-icon-color: rgba(255, 255, 255, 0.5);
  --mdc-list-list-item-focus-label-text-color: white;
  --mdc-list-list-item-hover-state-layer-color: white;
  --mdc-list-list-item-hover-state-layer-opacity: 0.08;
  --mdc-list-list-item-focus-state-layer-color: white;
  --mdc-list-list-item-focus-state-layer-opacity: 0.24;
}
.eng-theme--dark .mdc-list-item__start,
.eng-theme--dark .mdc-list-item__end {
  --mdc-radio-disabled-selected-icon-color: white;
  --mdc-radio-disabled-unselected-icon-color: white;
  --mdc-radio-unselected-hover-icon-color: #eeeeee;
  --mdc-radio-unselected-focus-icon-color: #eeeeee;
  --mdc-radio-unselected-icon-color: rgba(255, 255, 255, 0.54);
  --mdc-radio-unselected-pressed-icon-color: rgba(255, 255, 255, 0.54);
  --mdc-radio-selected-focus-icon-color: #0cabf5;
  --mdc-radio-selected-hover-icon-color: #0cabf5;
  --mdc-radio-selected-icon-color: #0cabf5;
  --mdc-radio-selected-pressed-icon-color: #0cabf5;
}
.eng-theme--dark .mat-accent .mdc-list-item__start,
.eng-theme--dark .mat-accent .mdc-list-item__end {
  --mdc-radio-disabled-selected-icon-color: white;
  --mdc-radio-disabled-unselected-icon-color: white;
  --mdc-radio-unselected-hover-icon-color: #eeeeee;
  --mdc-radio-unselected-focus-icon-color: #eeeeee;
  --mdc-radio-unselected-icon-color: rgba(255, 255, 255, 0.54);
  --mdc-radio-unselected-pressed-icon-color: rgba(255, 255, 255, 0.54);
  --mdc-radio-selected-focus-icon-color: #424242;
  --mdc-radio-selected-hover-icon-color: #424242;
  --mdc-radio-selected-icon-color: #424242;
  --mdc-radio-selected-pressed-icon-color: #424242;
}
.eng-theme--dark .mat-warn .mdc-list-item__start,
.eng-theme--dark .mat-warn .mdc-list-item__end {
  --mdc-radio-disabled-selected-icon-color: white;
  --mdc-radio-disabled-unselected-icon-color: white;
  --mdc-radio-unselected-hover-icon-color: #eeeeee;
  --mdc-radio-unselected-focus-icon-color: #eeeeee;
  --mdc-radio-unselected-icon-color: rgba(255, 255, 255, 0.54);
  --mdc-radio-unselected-pressed-icon-color: rgba(255, 255, 255, 0.54);
  --mdc-radio-selected-focus-icon-color: #f44336;
  --mdc-radio-selected-hover-icon-color: #f44336;
  --mdc-radio-selected-icon-color: #f44336;
  --mdc-radio-selected-pressed-icon-color: #f44336;
}
.eng-theme--dark .mat-mdc-list-option {
  --mdc-checkbox-disabled-selected-icon-color: rgba(255, 255, 255, 0.38);
  --mdc-checkbox-disabled-unselected-icon-color: rgba(255, 255, 255, 0.38);
  --mdc-checkbox-selected-checkmark-color: black;
  --mdc-checkbox-selected-focus-icon-color: #0cabf5;
  --mdc-checkbox-selected-hover-icon-color: #0cabf5;
  --mdc-checkbox-selected-icon-color: #0cabf5;
  --mdc-checkbox-selected-pressed-icon-color: #0cabf5;
  --mdc-checkbox-unselected-focus-icon-color: #eeeeee;
  --mdc-checkbox-unselected-hover-icon-color: #eeeeee;
  --mdc-checkbox-unselected-icon-color: rgba(255, 255, 255, 0.54);
  --mdc-checkbox-selected-focus-state-layer-color: #0cabf5;
  --mdc-checkbox-selected-hover-state-layer-color: #0cabf5;
  --mdc-checkbox-selected-pressed-state-layer-color: #0cabf5;
  --mdc-checkbox-unselected-focus-state-layer-color: white;
  --mdc-checkbox-unselected-hover-state-layer-color: white;
  --mdc-checkbox-unselected-pressed-state-layer-color: white;
}
.eng-theme--dark .mat-mdc-list-option.mat-accent {
  --mdc-checkbox-disabled-selected-icon-color: rgba(255, 255, 255, 0.38);
  --mdc-checkbox-disabled-unselected-icon-color: rgba(255, 255, 255, 0.38);
  --mdc-checkbox-selected-checkmark-color: white;
  --mdc-checkbox-selected-focus-icon-color: #424242;
  --mdc-checkbox-selected-hover-icon-color: #424242;
  --mdc-checkbox-selected-icon-color: #424242;
  --mdc-checkbox-selected-pressed-icon-color: #424242;
  --mdc-checkbox-unselected-focus-icon-color: #eeeeee;
  --mdc-checkbox-unselected-hover-icon-color: #eeeeee;
  --mdc-checkbox-unselected-icon-color: rgba(255, 255, 255, 0.54);
  --mdc-checkbox-selected-focus-state-layer-color: #424242;
  --mdc-checkbox-selected-hover-state-layer-color: #424242;
  --mdc-checkbox-selected-pressed-state-layer-color: #424242;
  --mdc-checkbox-unselected-focus-state-layer-color: white;
  --mdc-checkbox-unselected-hover-state-layer-color: white;
  --mdc-checkbox-unselected-pressed-state-layer-color: white;
}
.eng-theme--dark .mat-mdc-list-option.mat-warn {
  --mdc-checkbox-disabled-selected-icon-color: rgba(255, 255, 255, 0.38);
  --mdc-checkbox-disabled-unselected-icon-color: rgba(255, 255, 255, 0.38);
  --mdc-checkbox-selected-checkmark-color: white;
  --mdc-checkbox-selected-focus-icon-color: #f44336;
  --mdc-checkbox-selected-hover-icon-color: #f44336;
  --mdc-checkbox-selected-icon-color: #f44336;
  --mdc-checkbox-selected-pressed-icon-color: #f44336;
  --mdc-checkbox-unselected-focus-icon-color: #eeeeee;
  --mdc-checkbox-unselected-hover-icon-color: #eeeeee;
  --mdc-checkbox-unselected-icon-color: rgba(255, 255, 255, 0.54);
  --mdc-checkbox-selected-focus-state-layer-color: #f44336;
  --mdc-checkbox-selected-hover-state-layer-color: #f44336;
  --mdc-checkbox-selected-pressed-state-layer-color: #f44336;
  --mdc-checkbox-unselected-focus-state-layer-color: white;
  --mdc-checkbox-unselected-hover-state-layer-color: white;
  --mdc-checkbox-unselected-pressed-state-layer-color: white;
}
.eng-theme--dark .mat-mdc-list-base.mat-mdc-list-base .mdc-list-item--selected .mdc-list-item__primary-text,
.eng-theme--dark .mat-mdc-list-base.mat-mdc-list-base .mdc-list-item--selected .mdc-list-item__start,
.eng-theme--dark .mat-mdc-list-base.mat-mdc-list-base .mdc-list-item--activated .mdc-list-item__primary-text,
.eng-theme--dark .mat-mdc-list-base.mat-mdc-list-base .mdc-list-item--activated .mdc-list-item__start {
  color: #0cabf5;
}
.eng-theme--dark .mat-mdc-list-base .mdc-list-item--disabled .mdc-list-item__start,
.eng-theme--dark .mat-mdc-list-base .mdc-list-item--disabled .mdc-list-item__content,
.eng-theme--dark .mat-mdc-list-base .mdc-list-item--disabled .mdc-list-item__end {
  opacity: 1;
}
.eng-theme--dark {
  --mdc-list-list-item-one-line-container-height: 48px;
  --mdc-list-list-item-two-line-container-height: 64px;
  --mdc-list-list-item-three-line-container-height: 88px;
}
.eng-theme--dark {
  --mat-list-list-item-leading-icon-start-space: 16px;
  --mat-list-list-item-leading-icon-end-space: 32px;
}
.eng-theme--dark .mdc-list-item__start,
.eng-theme--dark .mdc-list-item__end {
  --mdc-radio-state-layer-size: 40px;
}
.eng-theme--dark .mat-mdc-list-item.mdc-list-item--with-leading-avatar.mdc-list-item--with-one-line, .eng-theme--dark .mat-mdc-list-item.mdc-list-item--with-leading-checkbox.mdc-list-item--with-one-line, .eng-theme--dark .mat-mdc-list-item.mdc-list-item--with-leading-icon.mdc-list-item--with-one-line {
  height: 56px;
}
.eng-theme--dark .mat-mdc-list-item.mdc-list-item--with-leading-avatar.mdc-list-item--with-two-lines, .eng-theme--dark .mat-mdc-list-item.mdc-list-item--with-leading-checkbox.mdc-list-item--with-two-lines, .eng-theme--dark .mat-mdc-list-item.mdc-list-item--with-leading-icon.mdc-list-item--with-two-lines {
  height: 72px;
}
.eng-theme--dark {
  --mdc-list-list-item-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-list-list-item-label-text-line-height: 24px;
  --mdc-list-list-item-label-text-size: 16px;
  --mdc-list-list-item-label-text-tracking: 0.03125em;
  --mdc-list-list-item-label-text-weight: 400;
  --mdc-list-list-item-supporting-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-list-list-item-supporting-text-line-height: 20px;
  --mdc-list-list-item-supporting-text-size: 14px;
  --mdc-list-list-item-supporting-text-tracking: 0.0178571429em;
  --mdc-list-list-item-supporting-text-weight: 400;
  --mdc-list-list-item-trailing-supporting-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-list-list-item-trailing-supporting-text-line-height: 20px;
  --mdc-list-list-item-trailing-supporting-text-size: 12px;
  --mdc-list-list-item-trailing-supporting-text-tracking: 0.0333333333em;
  --mdc-list-list-item-trailing-supporting-text-weight: 400;
}
.eng-theme--dark .mdc-list-group__subheader {
  font: 400 16px / 28px 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  letter-spacing: 0.009375em;
}
.eng-theme--dark {
  --mat-paginator-container-text-color: rgba(255, 255, 255, 0.87);
  --mat-paginator-container-background-color: #424242;
  --mat-paginator-enabled-icon-color: rgba(255, 255, 255, 0.54);
  --mat-paginator-disabled-icon-color: rgba(255, 255, 255, 0.12);
}
.eng-theme--dark {
  --mat-paginator-container-size: 56px;
  --mat-paginator-form-field-container-height: 40px;
  --mat-paginator-form-field-container-vertical-padding: 8px;
  --mat-paginator-touch-target-display: block;
}
.eng-theme--dark {
  --mat-paginator-container-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-paginator-container-text-line-height: 20px;
  --mat-paginator-container-text-size: 12px;
  --mat-paginator-container-text-tracking: 0.0333333333em;
  --mat-paginator-container-text-weight: 400;
  --mat-paginator-select-trigger-text-size: 12px;
}
.eng-theme--dark {
  --mdc-secondary-navigation-tab-container-height: 48px;
}
.eng-theme--dark {
  --mdc-tab-indicator-active-indicator-height: 2px;
  --mdc-tab-indicator-active-indicator-shape: 0;
}
.eng-theme--dark {
  --mat-tab-header-divider-color: transparent;
  --mat-tab-header-divider-height: 0;
}
.eng-theme--dark .mat-mdc-tab-group,
.eng-theme--dark .mat-mdc-tab-nav-bar {
  --mdc-tab-indicator-active-indicator-color: #0cabf5;
}
.eng-theme--dark .mat-mdc-tab-group,
.eng-theme--dark .mat-mdc-tab-nav-bar {
  --mat-tab-header-disabled-ripple-color: rgba(255, 255, 255, 0.5);
  --mat-tab-header-pagination-icon-color: white;
  --mat-tab-header-inactive-label-text-color: rgba(255, 255, 255, 0.6);
  --mat-tab-header-active-label-text-color: #0cabf5;
  --mat-tab-header-active-ripple-color: #0cabf5;
  --mat-tab-header-inactive-ripple-color: #0cabf5;
  --mat-tab-header-inactive-focus-label-text-color: rgba(255, 255, 255, 0.6);
  --mat-tab-header-inactive-hover-label-text-color: rgba(255, 255, 255, 0.6);
  --mat-tab-header-active-focus-label-text-color: #0cabf5;
  --mat-tab-header-active-hover-label-text-color: #0cabf5;
  --mat-tab-header-active-focus-indicator-color: #0cabf5;
  --mat-tab-header-active-hover-indicator-color: #0cabf5;
}
.eng-theme--dark .mat-mdc-tab-group.mat-accent,
.eng-theme--dark .mat-mdc-tab-nav-bar.mat-accent {
  --mdc-tab-indicator-active-indicator-color: #424242;
}
.eng-theme--dark .mat-mdc-tab-group.mat-accent,
.eng-theme--dark .mat-mdc-tab-nav-bar.mat-accent {
  --mat-tab-header-disabled-ripple-color: rgba(255, 255, 255, 0.5);
  --mat-tab-header-pagination-icon-color: white;
  --mat-tab-header-inactive-label-text-color: rgba(255, 255, 255, 0.6);
  --mat-tab-header-active-label-text-color: #424242;
  --mat-tab-header-active-ripple-color: #424242;
  --mat-tab-header-inactive-ripple-color: #424242;
  --mat-tab-header-inactive-focus-label-text-color: rgba(255, 255, 255, 0.6);
  --mat-tab-header-inactive-hover-label-text-color: rgba(255, 255, 255, 0.6);
  --mat-tab-header-active-focus-label-text-color: #424242;
  --mat-tab-header-active-hover-label-text-color: #424242;
  --mat-tab-header-active-focus-indicator-color: #424242;
  --mat-tab-header-active-hover-indicator-color: #424242;
}
.eng-theme--dark .mat-mdc-tab-group.mat-warn,
.eng-theme--dark .mat-mdc-tab-nav-bar.mat-warn {
  --mdc-tab-indicator-active-indicator-color: #f44336;
}
.eng-theme--dark .mat-mdc-tab-group.mat-warn,
.eng-theme--dark .mat-mdc-tab-nav-bar.mat-warn {
  --mat-tab-header-disabled-ripple-color: rgba(255, 255, 255, 0.5);
  --mat-tab-header-pagination-icon-color: white;
  --mat-tab-header-inactive-label-text-color: rgba(255, 255, 255, 0.6);
  --mat-tab-header-active-label-text-color: #f44336;
  --mat-tab-header-active-ripple-color: #f44336;
  --mat-tab-header-inactive-ripple-color: #f44336;
  --mat-tab-header-inactive-focus-label-text-color: rgba(255, 255, 255, 0.6);
  --mat-tab-header-inactive-hover-label-text-color: rgba(255, 255, 255, 0.6);
  --mat-tab-header-active-focus-label-text-color: #f44336;
  --mat-tab-header-active-hover-label-text-color: #f44336;
  --mat-tab-header-active-focus-indicator-color: #f44336;
  --mat-tab-header-active-hover-indicator-color: #f44336;
}
.eng-theme--dark .mat-mdc-tab-group.mat-background-primary,
.eng-theme--dark .mat-mdc-tab-nav-bar.mat-background-primary {
  --mat-tab-header-with-background-background-color: #0cabf5;
  --mat-tab-header-with-background-foreground-color: rgba(0, 0, 0, 0.87);
}
.eng-theme--dark .mat-mdc-tab-group.mat-background-accent,
.eng-theme--dark .mat-mdc-tab-nav-bar.mat-background-accent {
  --mat-tab-header-with-background-background-color: #424242;
  --mat-tab-header-with-background-foreground-color: white;
}
.eng-theme--dark .mat-mdc-tab-group.mat-background-warn,
.eng-theme--dark .mat-mdc-tab-nav-bar.mat-background-warn {
  --mat-tab-header-with-background-background-color: #f44336;
  --mat-tab-header-with-background-foreground-color: white;
}
.eng-theme--dark .mat-mdc-tab-header {
  --mdc-secondary-navigation-tab-container-height: 48px;
}
.eng-theme--dark .mat-mdc-tab-header {
  --mat-tab-header-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-tab-header-label-text-size: 14px;
  --mat-tab-header-label-text-tracking: 0.0892857143em;
  --mat-tab-header-label-text-line-height: 36px;
  --mat-tab-header-label-text-weight: 500;
}
.eng-theme--dark {
  --mdc-checkbox-disabled-selected-checkmark-color: #fff;
  --mdc-checkbox-selected-focus-state-layer-opacity: 0.16;
  --mdc-checkbox-selected-hover-state-layer-opacity: 0.04;
  --mdc-checkbox-selected-pressed-state-layer-opacity: 0.16;
  --mdc-checkbox-unselected-focus-state-layer-opacity: 0.16;
  --mdc-checkbox-unselected-hover-state-layer-opacity: 0.04;
  --mdc-checkbox-unselected-pressed-state-layer-opacity: 0.16;
}
.eng-theme--dark {
  --mdc-checkbox-disabled-selected-icon-color: rgba(255, 255, 255, 0.38);
  --mdc-checkbox-disabled-unselected-icon-color: rgba(255, 255, 255, 0.38);
  --mdc-checkbox-selected-checkmark-color: white;
  --mdc-checkbox-selected-focus-icon-color: #424242;
  --mdc-checkbox-selected-hover-icon-color: #424242;
  --mdc-checkbox-selected-icon-color: #424242;
  --mdc-checkbox-selected-pressed-icon-color: #424242;
  --mdc-checkbox-unselected-focus-icon-color: #eeeeee;
  --mdc-checkbox-unselected-hover-icon-color: #eeeeee;
  --mdc-checkbox-unselected-icon-color: rgba(255, 255, 255, 0.54);
  --mdc-checkbox-selected-focus-state-layer-color: #424242;
  --mdc-checkbox-selected-hover-state-layer-color: #424242;
  --mdc-checkbox-selected-pressed-state-layer-color: #424242;
  --mdc-checkbox-unselected-focus-state-layer-color: white;
  --mdc-checkbox-unselected-hover-state-layer-color: white;
  --mdc-checkbox-unselected-pressed-state-layer-color: white;
}
.eng-theme--dark {
  --mat-checkbox-disabled-label-color: rgba(255, 255, 255, 0.5);
  --mat-checkbox-label-text-color: white;
}
.eng-theme--dark .mat-mdc-checkbox.mat-primary {
  --mdc-checkbox-disabled-selected-icon-color: rgba(255, 255, 255, 0.38);
  --mdc-checkbox-disabled-unselected-icon-color: rgba(255, 255, 255, 0.38);
  --mdc-checkbox-selected-checkmark-color: black;
  --mdc-checkbox-selected-focus-icon-color: #0cabf5;
  --mdc-checkbox-selected-hover-icon-color: #0cabf5;
  --mdc-checkbox-selected-icon-color: #0cabf5;
  --mdc-checkbox-selected-pressed-icon-color: #0cabf5;
  --mdc-checkbox-unselected-focus-icon-color: #eeeeee;
  --mdc-checkbox-unselected-hover-icon-color: #eeeeee;
  --mdc-checkbox-unselected-icon-color: rgba(255, 255, 255, 0.54);
  --mdc-checkbox-selected-focus-state-layer-color: #0cabf5;
  --mdc-checkbox-selected-hover-state-layer-color: #0cabf5;
  --mdc-checkbox-selected-pressed-state-layer-color: #0cabf5;
  --mdc-checkbox-unselected-focus-state-layer-color: white;
  --mdc-checkbox-unselected-hover-state-layer-color: white;
  --mdc-checkbox-unselected-pressed-state-layer-color: white;
}
.eng-theme--dark .mat-mdc-checkbox.mat-warn {
  --mdc-checkbox-disabled-selected-icon-color: rgba(255, 255, 255, 0.38);
  --mdc-checkbox-disabled-unselected-icon-color: rgba(255, 255, 255, 0.38);
  --mdc-checkbox-selected-checkmark-color: white;
  --mdc-checkbox-selected-focus-icon-color: #f44336;
  --mdc-checkbox-selected-hover-icon-color: #f44336;
  --mdc-checkbox-selected-icon-color: #f44336;
  --mdc-checkbox-selected-pressed-icon-color: #f44336;
  --mdc-checkbox-unselected-focus-icon-color: #eeeeee;
  --mdc-checkbox-unselected-hover-icon-color: #eeeeee;
  --mdc-checkbox-unselected-icon-color: rgba(255, 255, 255, 0.54);
  --mdc-checkbox-selected-focus-state-layer-color: #f44336;
  --mdc-checkbox-selected-hover-state-layer-color: #f44336;
  --mdc-checkbox-selected-pressed-state-layer-color: #f44336;
  --mdc-checkbox-unselected-focus-state-layer-color: white;
  --mdc-checkbox-unselected-hover-state-layer-color: white;
  --mdc-checkbox-unselected-pressed-state-layer-color: white;
}
.eng-theme--dark {
  --mdc-checkbox-state-layer-size: 40px;
}
.eng-theme--dark {
  --mat-checkbox-touch-target-display: block;
}
.eng-theme--dark {
  --mat-checkbox-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-checkbox-label-text-line-height: 20px;
  --mat-checkbox-label-text-size: 14px;
  --mat-checkbox-label-text-tracking: 0.0178571429em;
  --mat-checkbox-label-text-weight: 400;
}
.eng-theme--dark {
  --mdc-text-button-container-shape: 4px;
  --mdc-text-button-keep-touch-target: false;
}
.eng-theme--dark {
  --mdc-filled-button-container-shape: 4px;
  --mdc-filled-button-keep-touch-target: false;
}
.eng-theme--dark {
  --mdc-protected-button-container-shape: 4px;
  --mdc-protected-button-container-elevation-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
  --mdc-protected-button-disabled-container-elevation-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12);
  --mdc-protected-button-focus-container-elevation-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);
  --mdc-protected-button-hover-container-elevation-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);
  --mdc-protected-button-pressed-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
}
.eng-theme--dark {
  --mdc-outlined-button-keep-touch-target: false;
  --mdc-outlined-button-outline-width: 1px;
  --mdc-outlined-button-container-shape: 4px;
}
.eng-theme--dark {
  --mat-text-button-horizontal-padding: 8px;
  --mat-text-button-with-icon-horizontal-padding: 8px;
  --mat-text-button-icon-spacing: 8px;
  --mat-text-button-icon-offset: 0;
}
.eng-theme--dark {
  --mat-filled-button-horizontal-padding: 16px;
  --mat-filled-button-icon-spacing: 8px;
  --mat-filled-button-icon-offset: -4px;
}
.eng-theme--dark {
  --mat-protected-button-horizontal-padding: 16px;
  --mat-protected-button-icon-spacing: 8px;
  --mat-protected-button-icon-offset: -4px;
}
.eng-theme--dark {
  --mat-outlined-button-horizontal-padding: 15px;
  --mat-outlined-button-icon-spacing: 8px;
  --mat-outlined-button-icon-offset: -4px;
}
.eng-theme--dark {
  --mdc-text-button-label-text-color: white;
  --mdc-text-button-disabled-label-text-color: rgba(255, 255, 255, 0.5);
}
.eng-theme--dark {
  --mat-text-button-state-layer-color: white;
  --mat-text-button-disabled-state-layer-color: white;
  --mat-text-button-ripple-color: rgba(255, 255, 255, 0.1);
  --mat-text-button-hover-state-layer-opacity: 0.08;
  --mat-text-button-focus-state-layer-opacity: 0.24;
  --mat-text-button-pressed-state-layer-opacity: 0.24;
}
.eng-theme--dark {
  --mdc-filled-button-container-color: #424242;
  --mdc-filled-button-label-text-color: white;
  --mdc-filled-button-disabled-container-color: rgba(255, 255, 255, 0.12);
  --mdc-filled-button-disabled-label-text-color: rgba(255, 255, 255, 0.5);
}
.eng-theme--dark {
  --mat-filled-button-state-layer-color: white;
  --mat-filled-button-disabled-state-layer-color: white;
  --mat-filled-button-ripple-color: rgba(255, 255, 255, 0.1);
  --mat-filled-button-hover-state-layer-opacity: 0.08;
  --mat-filled-button-focus-state-layer-opacity: 0.24;
  --mat-filled-button-pressed-state-layer-opacity: 0.24;
}
.eng-theme--dark {
  --mdc-protected-button-container-color: #424242;
  --mdc-protected-button-label-text-color: white;
  --mdc-protected-button-disabled-container-color: rgba(255, 255, 255, 0.12);
  --mdc-protected-button-disabled-label-text-color: rgba(255, 255, 255, 0.5);
}
.eng-theme--dark {
  --mat-protected-button-state-layer-color: white;
  --mat-protected-button-disabled-state-layer-color: white;
  --mat-protected-button-ripple-color: rgba(255, 255, 255, 0.1);
  --mat-protected-button-hover-state-layer-opacity: 0.08;
  --mat-protected-button-focus-state-layer-opacity: 0.24;
  --mat-protected-button-pressed-state-layer-opacity: 0.24;
}
.eng-theme--dark {
  --mdc-outlined-button-disabled-outline-color: rgba(255, 255, 255, 0.12);
  --mdc-outlined-button-disabled-label-text-color: rgba(255, 255, 255, 0.5);
  --mdc-outlined-button-label-text-color: white;
  --mdc-outlined-button-outline-color: rgba(255, 255, 255, 0.12);
}
.eng-theme--dark {
  --mat-outlined-button-state-layer-color: white;
  --mat-outlined-button-disabled-state-layer-color: white;
  --mat-outlined-button-ripple-color: rgba(255, 255, 255, 0.1);
  --mat-outlined-button-hover-state-layer-opacity: 0.08;
  --mat-outlined-button-focus-state-layer-opacity: 0.24;
  --mat-outlined-button-pressed-state-layer-opacity: 0.24;
}
.eng-theme--dark .mat-mdc-button.mat-primary {
  --mdc-text-button-label-text-color: #0cabf5;
}
.eng-theme--dark .mat-mdc-button.mat-primary {
  --mat-text-button-state-layer-color: #0cabf5;
  --mat-text-button-ripple-color: rgba(12, 171, 245, 0.1);
}
.eng-theme--dark .mat-mdc-button.mat-accent {
  --mdc-text-button-label-text-color: #424242;
}
.eng-theme--dark .mat-mdc-button.mat-accent {
  --mat-text-button-state-layer-color: #424242;
  --mat-text-button-ripple-color: rgba(66, 66, 66, 0.1);
}
.eng-theme--dark .mat-mdc-button.mat-warn {
  --mdc-text-button-label-text-color: #f44336;
}
.eng-theme--dark .mat-mdc-button.mat-warn {
  --mat-text-button-state-layer-color: #f44336;
  --mat-text-button-ripple-color: rgba(244, 67, 54, 0.1);
}
.eng-theme--dark .mat-mdc-unelevated-button.mat-primary {
  --mdc-filled-button-container-color: #0cabf5;
  --mdc-filled-button-label-text-color: black;
}
.eng-theme--dark .mat-mdc-unelevated-button.mat-primary {
  --mat-filled-button-state-layer-color: black;
  --mat-filled-button-ripple-color: rgba(0, 0, 0, 0.1);
}
.eng-theme--dark .mat-mdc-unelevated-button.mat-accent {
  --mdc-filled-button-container-color: #424242;
  --mdc-filled-button-label-text-color: white;
}
.eng-theme--dark .mat-mdc-unelevated-button.mat-accent {
  --mat-filled-button-state-layer-color: white;
  --mat-filled-button-ripple-color: rgba(255, 255, 255, 0.1);
}
.eng-theme--dark .mat-mdc-unelevated-button.mat-warn {
  --mdc-filled-button-container-color: #f44336;
  --mdc-filled-button-label-text-color: white;
}
.eng-theme--dark .mat-mdc-unelevated-button.mat-warn {
  --mat-filled-button-state-layer-color: white;
  --mat-filled-button-ripple-color: rgba(255, 255, 255, 0.1);
}
.eng-theme--dark .mat-mdc-raised-button.mat-primary {
  --mdc-protected-button-container-color: #0cabf5;
  --mdc-protected-button-label-text-color: black;
}
.eng-theme--dark .mat-mdc-raised-button.mat-primary {
  --mat-protected-button-state-layer-color: black;
  --mat-protected-button-ripple-color: rgba(0, 0, 0, 0.1);
}
.eng-theme--dark .mat-mdc-raised-button.mat-accent {
  --mdc-protected-button-container-color: #424242;
  --mdc-protected-button-label-text-color: white;
}
.eng-theme--dark .mat-mdc-raised-button.mat-accent {
  --mat-protected-button-state-layer-color: white;
  --mat-protected-button-ripple-color: rgba(255, 255, 255, 0.1);
}
.eng-theme--dark .mat-mdc-raised-button.mat-warn {
  --mdc-protected-button-container-color: #f44336;
  --mdc-protected-button-label-text-color: white;
}
.eng-theme--dark .mat-mdc-raised-button.mat-warn {
  --mat-protected-button-state-layer-color: white;
  --mat-protected-button-ripple-color: rgba(255, 255, 255, 0.1);
}
.eng-theme--dark .mat-mdc-outlined-button.mat-primary {
  --mdc-outlined-button-label-text-color: #0cabf5;
  --mdc-outlined-button-outline-color: rgba(255, 255, 255, 0.12);
}
.eng-theme--dark .mat-mdc-outlined-button.mat-primary {
  --mat-outlined-button-state-layer-color: #0cabf5;
  --mat-outlined-button-ripple-color: rgba(12, 171, 245, 0.1);
}
.eng-theme--dark .mat-mdc-outlined-button.mat-accent {
  --mdc-outlined-button-label-text-color: #424242;
  --mdc-outlined-button-outline-color: rgba(255, 255, 255, 0.12);
}
.eng-theme--dark .mat-mdc-outlined-button.mat-accent {
  --mat-outlined-button-state-layer-color: #424242;
  --mat-outlined-button-ripple-color: rgba(66, 66, 66, 0.1);
}
.eng-theme--dark .mat-mdc-outlined-button.mat-warn {
  --mdc-outlined-button-label-text-color: #f44336;
  --mdc-outlined-button-outline-color: rgba(255, 255, 255, 0.12);
}
.eng-theme--dark .mat-mdc-outlined-button.mat-warn {
  --mat-outlined-button-state-layer-color: #f44336;
  --mat-outlined-button-ripple-color: rgba(244, 67, 54, 0.1);
}
.eng-theme--dark {
  --mdc-text-button-container-height: 36px;
}
.eng-theme--dark {
  --mdc-filled-button-container-height: 36px;
}
.eng-theme--dark {
  --mdc-protected-button-container-height: 36px;
}
.eng-theme--dark {
  --mdc-outlined-button-container-height: 36px;
}
.eng-theme--dark {
  --mat-text-button-touch-target-display: block;
}
.eng-theme--dark {
  --mat-filled-button-touch-target-display: block;
}
.eng-theme--dark {
  --mat-protected-button-touch-target-display: block;
}
.eng-theme--dark {
  --mat-outlined-button-touch-target-display: block;
}
.eng-theme--dark {
  --mdc-text-button-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-text-button-label-text-size: 14px;
  --mdc-text-button-label-text-tracking: 0.0892857143em;
  --mdc-text-button-label-text-weight: 500;
  --mdc-text-button-label-text-transform: none;
}
.eng-theme--dark {
  --mdc-filled-button-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-filled-button-label-text-size: 14px;
  --mdc-filled-button-label-text-tracking: 0.0892857143em;
  --mdc-filled-button-label-text-weight: 500;
  --mdc-filled-button-label-text-transform: none;
}
.eng-theme--dark {
  --mdc-protected-button-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-protected-button-label-text-size: 14px;
  --mdc-protected-button-label-text-tracking: 0.0892857143em;
  --mdc-protected-button-label-text-weight: 500;
  --mdc-protected-button-label-text-transform: none;
}
.eng-theme--dark {
  --mdc-outlined-button-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-outlined-button-label-text-size: 14px;
  --mdc-outlined-button-label-text-tracking: 0.0892857143em;
  --mdc-outlined-button-label-text-weight: 500;
  --mdc-outlined-button-label-text-transform: none;
}
.eng-theme--dark {
  --mdc-icon-button-icon-size: 24px;
}
.eng-theme--dark {
  --mdc-icon-button-icon-color: inherit;
  --mdc-icon-button-disabled-icon-color: rgba(255, 255, 255, 0.5);
}
.eng-theme--dark {
  --mat-icon-button-state-layer-color: white;
  --mat-icon-button-disabled-state-layer-color: white;
  --mat-icon-button-ripple-color: rgba(255, 255, 255, 0.1);
  --mat-icon-button-hover-state-layer-opacity: 0.08;
  --mat-icon-button-focus-state-layer-opacity: 0.24;
  --mat-icon-button-pressed-state-layer-opacity: 0.24;
}
.eng-theme--dark .mat-mdc-icon-button.mat-primary {
  --mdc-icon-button-icon-color: #0cabf5;
}
.eng-theme--dark .mat-mdc-icon-button.mat-primary {
  --mat-icon-button-state-layer-color: #0cabf5;
  --mat-icon-button-ripple-color: rgba(12, 171, 245, 0.1);
}
.eng-theme--dark .mat-mdc-icon-button.mat-accent {
  --mdc-icon-button-icon-color: #424242;
}
.eng-theme--dark .mat-mdc-icon-button.mat-accent {
  --mat-icon-button-state-layer-color: #424242;
  --mat-icon-button-ripple-color: rgba(66, 66, 66, 0.1);
}
.eng-theme--dark .mat-mdc-icon-button.mat-warn {
  --mdc-icon-button-icon-color: #f44336;
}
.eng-theme--dark .mat-mdc-icon-button.mat-warn {
  --mat-icon-button-state-layer-color: #f44336;
  --mat-icon-button-ripple-color: rgba(244, 67, 54, 0.1);
}
.eng-theme--dark {
  --mat-icon-button-touch-target-display: block;
}
.eng-theme--dark .mat-mdc-icon-button.mat-mdc-button-base {
  --mdc-icon-button-state-layer-size: 48px;
  width: var(--mdc-icon-button-state-layer-size);
  height: var(--mdc-icon-button-state-layer-size);
  padding: 12px;
}
.eng-theme--dark {
  --mdc-fab-container-shape: 50%;
  --mdc-fab-container-elevation-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
  --mdc-fab-focus-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
  --mdc-fab-hover-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
  --mdc-fab-pressed-container-elevation-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12);
}
.eng-theme--dark {
  --mdc-fab-small-container-shape: 50%;
  --mdc-fab-small-container-elevation-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
  --mdc-fab-small-focus-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
  --mdc-fab-small-hover-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
  --mdc-fab-small-pressed-container-elevation-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12);
}
.eng-theme--dark {
  --mdc-extended-fab-container-height: 48px;
  --mdc-extended-fab-container-shape: 24px;
  --mdc-extended-fab-container-elevation-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
  --mdc-extended-fab-focus-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
  --mdc-extended-fab-hover-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
  --mdc-extended-fab-pressed-container-elevation-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12);
}
.eng-theme--dark {
  --mdc-fab-container-color: #424242;
}
.eng-theme--dark {
  --mat-fab-foreground-color: white;
  --mat-fab-state-layer-color: white;
  --mat-fab-disabled-state-layer-color: white;
  --mat-fab-ripple-color: rgba(255, 255, 255, 0.1);
  --mat-fab-hover-state-layer-opacity: 0.08;
  --mat-fab-focus-state-layer-opacity: 0.24;
  --mat-fab-pressed-state-layer-opacity: 0.24;
  --mat-fab-disabled-state-container-color: rgba(255, 255, 255, 0.12);
  --mat-fab-disabled-state-foreground-color: rgba(255, 255, 255, 0.5);
}
.eng-theme--dark {
  --mdc-fab-small-container-color: #424242;
}
.eng-theme--dark {
  --mat-fab-small-foreground-color: white;
  --mat-fab-small-state-layer-color: white;
  --mat-fab-small-disabled-state-layer-color: white;
  --mat-fab-small-ripple-color: rgba(255, 255, 255, 0.1);
  --mat-fab-small-hover-state-layer-opacity: 0.08;
  --mat-fab-small-focus-state-layer-opacity: 0.24;
  --mat-fab-small-pressed-state-layer-opacity: 0.24;
  --mat-fab-small-disabled-state-container-color: rgba(255, 255, 255, 0.12);
  --mat-fab-small-disabled-state-foreground-color: rgba(255, 255, 255, 0.5);
}
.eng-theme--dark .mat-mdc-fab.mat-primary {
  --mdc-fab-container-color: #0cabf5;
}
.eng-theme--dark .mat-mdc-fab.mat-primary {
  --mat-fab-foreground-color: black;
  --mat-fab-state-layer-color: black;
  --mat-fab-ripple-color: rgba(0, 0, 0, 0.1);
}
.eng-theme--dark .mat-mdc-fab.mat-accent {
  --mdc-fab-container-color: #424242;
}
.eng-theme--dark .mat-mdc-fab.mat-accent {
  --mat-fab-foreground-color: white;
  --mat-fab-state-layer-color: white;
  --mat-fab-ripple-color: rgba(255, 255, 255, 0.1);
}
.eng-theme--dark .mat-mdc-fab.mat-warn {
  --mdc-fab-container-color: #f44336;
}
.eng-theme--dark .mat-mdc-fab.mat-warn {
  --mat-fab-foreground-color: white;
  --mat-fab-state-layer-color: white;
  --mat-fab-ripple-color: rgba(255, 255, 255, 0.1);
}
.eng-theme--dark .mat-mdc-mini-fab.mat-primary {
  --mdc-fab-small-container-color: #0cabf5;
}
.eng-theme--dark .mat-mdc-mini-fab.mat-primary {
  --mat-fab-small-foreground-color: black;
  --mat-fab-small-state-layer-color: black;
  --mat-fab-small-ripple-color: rgba(0, 0, 0, 0.1);
}
.eng-theme--dark .mat-mdc-mini-fab.mat-accent {
  --mdc-fab-small-container-color: #424242;
}
.eng-theme--dark .mat-mdc-mini-fab.mat-accent {
  --mat-fab-small-foreground-color: white;
  --mat-fab-small-state-layer-color: white;
  --mat-fab-small-ripple-color: rgba(255, 255, 255, 0.1);
}
.eng-theme--dark .mat-mdc-mini-fab.mat-warn {
  --mdc-fab-small-container-color: #f44336;
}
.eng-theme--dark .mat-mdc-mini-fab.mat-warn {
  --mat-fab-small-foreground-color: white;
  --mat-fab-small-state-layer-color: white;
  --mat-fab-small-ripple-color: rgba(255, 255, 255, 0.1);
}
.eng-theme--dark {
  --mat-fab-touch-target-display: block;
}
.eng-theme--dark {
  --mat-fab-small-touch-target-display: block;
}
.eng-theme--dark {
  --mdc-extended-fab-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-extended-fab-label-text-size: 14px;
  --mdc-extended-fab-label-text-tracking: 0.0892857143em;
  --mdc-extended-fab-label-text-weight: 500;
}
.eng-theme--dark {
  --mdc-snackbar-container-shape: 4px;
}
.eng-theme--dark {
  --mdc-snackbar-container-color: rgb(217.2, 217.2, 217.2);
  --mdc-snackbar-supporting-text-color: rgba(66, 66, 66, 0.87);
}
.eng-theme--dark {
  --mat-snack-bar-button-color: #0cabf5;
}
.eng-theme--dark {
  --mdc-snackbar-supporting-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mdc-snackbar-supporting-text-line-height: 20px;
  --mdc-snackbar-supporting-text-size: 14px;
  --mdc-snackbar-supporting-text-weight: 400;
}
.eng-theme--dark {
  --mat-table-row-item-outline-width: 1px;
}
.eng-theme--dark {
  --mat-table-background-color: #424242;
  --mat-table-header-headline-color: white;
  --mat-table-row-item-label-text-color: white;
  --mat-table-row-item-outline-color: rgba(255, 255, 255, 0.12);
}
.eng-theme--dark {
  --mat-table-header-container-height: 56px;
  --mat-table-footer-container-height: 52px;
  --mat-table-row-item-container-height: 52px;
}
.eng-theme--dark {
  --mat-table-header-headline-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-table-header-headline-line-height: 22px;
  --mat-table-header-headline-size: 14px;
  --mat-table-header-headline-weight: 500;
  --mat-table-header-headline-tracking: 0.0071428571em;
  --mat-table-row-item-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-table-row-item-label-text-line-height: 20px;
  --mat-table-row-item-label-text-size: 14px;
  --mat-table-row-item-label-text-weight: 400;
  --mat-table-row-item-label-text-tracking: 0.0178571429em;
  --mat-table-footer-supporting-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-table-footer-supporting-text-line-height: 20px;
  --mat-table-footer-supporting-text-size: 14px;
  --mat-table-footer-supporting-text-weight: 400;
  --mat-table-footer-supporting-text-tracking: 0.0178571429em;
}
.eng-theme--dark {
  --mdc-circular-progress-active-indicator-width: 4px;
  --mdc-circular-progress-size: 48px;
}
.eng-theme--dark {
  --mdc-circular-progress-active-indicator-color: #0cabf5;
}
.eng-theme--dark .mat-accent {
  --mdc-circular-progress-active-indicator-color: #424242;
}
.eng-theme--dark .mat-warn {
  --mdc-circular-progress-active-indicator-color: #f44336;
}
.eng-theme--dark {
  --mat-badge-container-shape: 50%;
  --mat-badge-container-size: unset;
  --mat-badge-small-size-container-size: unset;
  --mat-badge-large-size-container-size: unset;
  --mat-badge-legacy-container-size: 22px;
  --mat-badge-legacy-small-size-container-size: 16px;
  --mat-badge-legacy-large-size-container-size: 28px;
  --mat-badge-container-offset: -11px 0;
  --mat-badge-small-size-container-offset: -8px 0;
  --mat-badge-large-size-container-offset: -14px 0;
  --mat-badge-container-overlap-offset: -11px;
  --mat-badge-small-size-container-overlap-offset: -8px;
  --mat-badge-large-size-container-overlap-offset: -14px;
  --mat-badge-container-padding: 0;
  --mat-badge-small-size-container-padding: 0;
  --mat-badge-large-size-container-padding: 0;
}
.eng-theme--dark {
  --mat-badge-background-color: #0cabf5;
  --mat-badge-text-color: rgba(0, 0, 0, 0.87);
  --mat-badge-disabled-state-background-color: rgb(110.1, 110.1, 110.1);
  --mat-badge-disabled-state-text-color: rgba(255, 255, 255, 0.5);
}
.eng-theme--dark .mat-badge-accent {
  --mat-badge-background-color: #424242;
  --mat-badge-text-color: white;
}
.eng-theme--dark .mat-badge-warn {
  --mat-badge-background-color: #f44336;
  --mat-badge-text-color: white;
}
.eng-theme--dark {
  --mat-badge-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-badge-line-height: 22px;
  --mat-badge-text-size: 12px;
  --mat-badge-text-weight: 600;
  --mat-badge-small-size-text-size: 9px;
  --mat-badge-small-size-line-height: 16px;
  --mat-badge-large-size-text-size: 24px;
  --mat-badge-large-size-line-height: 28px;
}
.eng-theme--dark {
  --mat-bottom-sheet-container-shape: 4px;
}
.eng-theme--dark {
  --mat-bottom-sheet-container-text-color: white;
  --mat-bottom-sheet-container-background-color: #424242;
}
.eng-theme--dark {
  --mat-bottom-sheet-container-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-bottom-sheet-container-text-line-height: 20px;
  --mat-bottom-sheet-container-text-size: 14px;
  --mat-bottom-sheet-container-text-tracking: 0.0178571429em;
  --mat-bottom-sheet-container-text-weight: 400;
}
.eng-theme--dark {
  --mat-legacy-button-toggle-height: 36px;
  --mat-legacy-button-toggle-shape: 2px;
  --mat-legacy-button-toggle-focus-state-layer-opacity: 1;
}
.eng-theme--dark {
  --mat-standard-button-toggle-shape: 4px;
  --mat-standard-button-toggle-hover-state-layer-opacity: 0.04;
  --mat-standard-button-toggle-focus-state-layer-opacity: 0.12;
}
.eng-theme--dark {
  --mat-legacy-button-toggle-text-color: rgba(255, 255, 255, 0.5);
  --mat-legacy-button-toggle-state-layer-color: rgba(255, 255, 255, 0.12);
  --mat-legacy-button-toggle-selected-state-text-color: rgba(255, 255, 255, 0.7);
  --mat-legacy-button-toggle-selected-state-background-color: #212121;
  --mat-legacy-button-toggle-disabled-state-text-color: rgba(255, 255, 255, 0.3);
  --mat-legacy-button-toggle-disabled-state-background-color: black;
  --mat-legacy-button-toggle-disabled-selected-state-background-color: #424242;
}
.eng-theme--dark {
  --mat-standard-button-toggle-text-color: white;
  --mat-standard-button-toggle-background-color: #424242;
  --mat-standard-button-toggle-state-layer-color: white;
  --mat-standard-button-toggle-selected-state-background-color: #212121;
  --mat-standard-button-toggle-selected-state-text-color: white;
  --mat-standard-button-toggle-disabled-state-text-color: rgba(255, 255, 255, 0.3);
  --mat-standard-button-toggle-disabled-state-background-color: #424242;
  --mat-standard-button-toggle-disabled-selected-state-text-color: white;
  --mat-standard-button-toggle-disabled-selected-state-background-color: #424242;
  --mat-standard-button-toggle-divider-color: rgb(88.68, 88.68, 88.68);
}
.eng-theme--dark {
  --mat-standard-button-toggle-height: 48px;
}
.eng-theme--dark {
  --mat-legacy-button-toggle-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-legacy-button-toggle-label-text-line-height: 24px;
  --mat-legacy-button-toggle-label-text-size: 16px;
  --mat-legacy-button-toggle-label-text-tracking: 0.03125em;
  --mat-legacy-button-toggle-label-text-weight: 400;
}
.eng-theme--dark {
  --mat-standard-button-toggle-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-standard-button-toggle-label-text-line-height: 24px;
  --mat-standard-button-toggle-label-text-size: 16px;
  --mat-standard-button-toggle-label-text-tracking: 0.03125em;
  --mat-standard-button-toggle-label-text-weight: 400;
}
.eng-theme--dark {
  --mat-datepicker-calendar-container-shape: 4px;
  --mat-datepicker-calendar-container-touch-shape: 4px;
  --mat-datepicker-calendar-container-elevation-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12);
  --mat-datepicker-calendar-container-touch-elevation-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
}
.eng-theme--dark {
  --mat-datepicker-calendar-date-selected-state-text-color: rgba(0, 0, 0, 0.87);
  --mat-datepicker-calendar-date-selected-state-background-color: #0cabf5;
  --mat-datepicker-calendar-date-selected-disabled-state-background-color: rgba(12, 171, 245, 0.4);
  --mat-datepicker-calendar-date-today-selected-state-outline-color: rgba(0, 0, 0, 0.87);
  --mat-datepicker-calendar-date-focus-state-background-color: rgba(12, 171, 245, 0.3);
  --mat-datepicker-calendar-date-hover-state-background-color: rgba(12, 171, 245, 0.3);
  --mat-datepicker-toggle-active-state-icon-color: #0cabf5;
  --mat-datepicker-calendar-date-in-range-state-background-color: rgba(12, 171, 245, 0.2);
  --mat-datepicker-calendar-date-in-comparison-range-state-background-color: rgba(249, 171, 0, 0.2);
  --mat-datepicker-calendar-date-in-overlap-range-state-background-color: #a8dab5;
  --mat-datepicker-calendar-date-in-overlap-range-selected-state-background-color: rgb(69.5241935484, 163.4758064516, 93.9516129032);
  --mat-datepicker-toggle-icon-color: white;
  --mat-datepicker-calendar-body-label-text-color: rgba(255, 255, 255, 0.7);
  --mat-datepicker-calendar-period-button-text-color: white;
  --mat-datepicker-calendar-period-button-icon-color: white;
  --mat-datepicker-calendar-navigation-button-icon-color: white;
  --mat-datepicker-calendar-header-divider-color: rgba(255, 255, 255, 0.12);
  --mat-datepicker-calendar-header-text-color: rgba(255, 255, 255, 0.7);
  --mat-datepicker-calendar-date-today-outline-color: rgba(255, 255, 255, 0.5);
  --mat-datepicker-calendar-date-today-disabled-state-outline-color: rgba(255, 255, 255, 0.3);
  --mat-datepicker-calendar-date-text-color: white;
  --mat-datepicker-calendar-date-outline-color: transparent;
  --mat-datepicker-calendar-date-disabled-state-text-color: rgba(255, 255, 255, 0.5);
  --mat-datepicker-calendar-date-preview-state-outline-color: rgba(255, 255, 255, 0.24);
  --mat-datepicker-range-input-separator-color: white;
  --mat-datepicker-range-input-disabled-state-separator-color: rgba(255, 255, 255, 0.5);
  --mat-datepicker-range-input-disabled-state-text-color: rgba(255, 255, 255, 0.5);
  --mat-datepicker-calendar-container-background-color: #424242;
  --mat-datepicker-calendar-container-text-color: white;
}
.eng-theme--dark .mat-datepicker-content.mat-accent {
  --mat-datepicker-calendar-date-selected-state-text-color: white;
  --mat-datepicker-calendar-date-selected-state-background-color: #424242;
  --mat-datepicker-calendar-date-selected-disabled-state-background-color: rgba(66, 66, 66, 0.4);
  --mat-datepicker-calendar-date-today-selected-state-outline-color: white;
  --mat-datepicker-calendar-date-focus-state-background-color: rgba(66, 66, 66, 0.3);
  --mat-datepicker-calendar-date-hover-state-background-color: rgba(66, 66, 66, 0.3);
  --mat-datepicker-calendar-date-in-range-state-background-color: rgba(66, 66, 66, 0.2);
  --mat-datepicker-calendar-date-in-comparison-range-state-background-color: rgba(249, 171, 0, 0.2);
  --mat-datepicker-calendar-date-in-overlap-range-state-background-color: #a8dab5;
  --mat-datepicker-calendar-date-in-overlap-range-selected-state-background-color: rgb(69.5241935484, 163.4758064516, 93.9516129032);
}
.eng-theme--dark .mat-datepicker-content.mat-warn {
  --mat-datepicker-calendar-date-selected-state-text-color: white;
  --mat-datepicker-calendar-date-selected-state-background-color: #f44336;
  --mat-datepicker-calendar-date-selected-disabled-state-background-color: rgba(244, 67, 54, 0.4);
  --mat-datepicker-calendar-date-today-selected-state-outline-color: white;
  --mat-datepicker-calendar-date-focus-state-background-color: rgba(244, 67, 54, 0.3);
  --mat-datepicker-calendar-date-hover-state-background-color: rgba(244, 67, 54, 0.3);
  --mat-datepicker-calendar-date-in-range-state-background-color: rgba(244, 67, 54, 0.2);
  --mat-datepicker-calendar-date-in-comparison-range-state-background-color: rgba(249, 171, 0, 0.2);
  --mat-datepicker-calendar-date-in-overlap-range-state-background-color: #a8dab5;
  --mat-datepicker-calendar-date-in-overlap-range-selected-state-background-color: rgb(69.5241935484, 163.4758064516, 93.9516129032);
}
.eng-theme--dark .mat-datepicker-toggle-active.mat-accent {
  --mat-datepicker-toggle-active-state-icon-color: #424242;
}
.eng-theme--dark .mat-datepicker-toggle-active.mat-warn {
  --mat-datepicker-toggle-active-state-icon-color: #f44336;
}
.eng-theme--dark .mat-calendar-controls {
  --mat-icon-button-touch-target-display: none;
}
.eng-theme--dark .mat-calendar-controls .mat-mdc-icon-button.mat-mdc-button-base {
  --mdc-icon-button-state-layer-size: 40px;
  width: var(--mdc-icon-button-state-layer-size);
  height: var(--mdc-icon-button-state-layer-size);
  padding: 8px;
}
.eng-theme--dark {
  --mat-datepicker-calendar-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-datepicker-calendar-text-size: 13px;
  --mat-datepicker-calendar-body-label-text-size: 14px;
  --mat-datepicker-calendar-body-label-text-weight: 500;
  --mat-datepicker-calendar-period-button-text-size: 14px;
  --mat-datepicker-calendar-period-button-text-weight: 500;
  --mat-datepicker-calendar-header-text-size: 11px;
  --mat-datepicker-calendar-header-text-weight: 400;
}
.eng-theme--dark {
  --mat-divider-width: 1px;
}
.eng-theme--dark {
  --mat-divider-color: rgba(255, 255, 255, 0.12);
}
.eng-theme--dark {
  --mat-expansion-container-shape: 4px;
  --mat-expansion-legacy-header-indicator-display: inline-block;
  --mat-expansion-header-indicator-display: none;
}
.eng-theme--dark {
  --mat-expansion-container-background-color: #424242;
  --mat-expansion-container-text-color: white;
  --mat-expansion-actions-divider-color: rgba(255, 255, 255, 0.12);
  --mat-expansion-header-hover-state-layer-color: rgba(255, 255, 255, 0.04);
  --mat-expansion-header-focus-state-layer-color: rgba(255, 255, 255, 0.04);
  --mat-expansion-header-disabled-state-text-color: rgba(255, 255, 255, 0.3);
  --mat-expansion-header-text-color: white;
  --mat-expansion-header-description-color: rgba(255, 255, 255, 0.7);
  --mat-expansion-header-indicator-color: rgba(255, 255, 255, 0.7);
}
.eng-theme--dark {
  --mat-expansion-header-collapsed-state-height: 48px;
  --mat-expansion-header-expanded-state-height: 64px;
}
.eng-theme--dark {
  --mat-expansion-header-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-expansion-header-text-size: 14px;
  --mat-expansion-header-text-weight: 500;
  --mat-expansion-header-text-line-height: inherit;
  --mat-expansion-header-text-tracking: inherit;
  --mat-expansion-container-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-expansion-container-text-line-height: 20px;
  --mat-expansion-container-text-size: 14px;
  --mat-expansion-container-text-tracking: 0.0178571429em;
  --mat-expansion-container-text-weight: 400;
}
.eng-theme--dark {
  --mat-grid-list-tile-header-primary-text-size: 14px;
  --mat-grid-list-tile-header-secondary-text-size: 12px;
  --mat-grid-list-tile-footer-primary-text-size: 14px;
  --mat-grid-list-tile-footer-secondary-text-size: 12px;
}
.eng-theme--dark {
  --mat-icon-color: inherit;
}
.eng-theme--dark .mat-icon.mat-primary {
  --mat-icon-color: #0cabf5;
}
.eng-theme--dark .mat-icon.mat-accent {
  --mat-icon-color: #424242;
}
.eng-theme--dark .mat-icon.mat-warn {
  --mat-icon-color: #f44336;
}
.eng-theme--dark {
  --mat-sidenav-container-shape: 0;
  --mat-sidenav-container-elevation-shadow: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12);
  --mat-sidenav-container-width: auto;
}
.eng-theme--dark {
  --mat-sidenav-container-divider-color: rgba(255, 255, 255, 0.12);
  --mat-sidenav-container-background-color: #424242;
  --mat-sidenav-container-text-color: white;
  --mat-sidenav-content-background-color: #303030;
  --mat-sidenav-content-text-color: white;
  --mat-sidenav-scrim-color: rgba(189, 189, 189, 0.6);
}
.eng-theme--dark {
  --mat-stepper-header-icon-foreground-color: rgba(0, 0, 0, 0.87);
  --mat-stepper-header-selected-state-icon-background-color: #0cabf5;
  --mat-stepper-header-selected-state-icon-foreground-color: rgba(0, 0, 0, 0.87);
  --mat-stepper-header-done-state-icon-background-color: #0cabf5;
  --mat-stepper-header-done-state-icon-foreground-color: rgba(0, 0, 0, 0.87);
  --mat-stepper-header-edit-state-icon-background-color: #0cabf5;
  --mat-stepper-header-edit-state-icon-foreground-color: rgba(0, 0, 0, 0.87);
  --mat-stepper-container-color: #424242;
  --mat-stepper-line-color: rgba(255, 255, 255, 0.12);
  --mat-stepper-header-hover-state-layer-color: rgba(255, 255, 255, 0.04);
  --mat-stepper-header-focus-state-layer-color: rgba(255, 255, 255, 0.04);
  --mat-stepper-header-label-text-color: rgba(255, 255, 255, 0.7);
  --mat-stepper-header-optional-label-text-color: rgba(255, 255, 255, 0.7);
  --mat-stepper-header-selected-state-label-text-color: white;
  --mat-stepper-header-error-state-label-text-color: #f44336;
  --mat-stepper-header-icon-background-color: rgba(255, 255, 255, 0.7);
  --mat-stepper-header-error-state-icon-foreground-color: #f44336;
  --mat-stepper-header-error-state-icon-background-color: transparent;
}
.eng-theme--dark .mat-step-header.mat-accent {
  --mat-stepper-header-icon-foreground-color: white;
  --mat-stepper-header-selected-state-icon-background-color: #424242;
  --mat-stepper-header-selected-state-icon-foreground-color: white;
  --mat-stepper-header-done-state-icon-background-color: #424242;
  --mat-stepper-header-done-state-icon-foreground-color: white;
  --mat-stepper-header-edit-state-icon-background-color: #424242;
  --mat-stepper-header-edit-state-icon-foreground-color: white;
}
.eng-theme--dark .mat-step-header.mat-warn {
  --mat-stepper-header-icon-foreground-color: white;
  --mat-stepper-header-selected-state-icon-background-color: #f44336;
  --mat-stepper-header-selected-state-icon-foreground-color: white;
  --mat-stepper-header-done-state-icon-background-color: #f44336;
  --mat-stepper-header-done-state-icon-foreground-color: white;
  --mat-stepper-header-edit-state-icon-background-color: #f44336;
  --mat-stepper-header-edit-state-icon-foreground-color: white;
}
.eng-theme--dark {
  --mat-stepper-header-height: 72px;
}
.eng-theme--dark {
  --mat-stepper-container-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-stepper-header-label-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-stepper-header-label-text-size: 14px;
  --mat-stepper-header-label-text-weight: 400;
  --mat-stepper-header-error-state-label-text-size: 16px;
  --mat-stepper-header-selected-state-label-text-size: 16px;
  --mat-stepper-header-selected-state-label-text-weight: 400;
}
.eng-theme--dark {
  --mat-sort-arrow-color: rgb(198.3, 198.3, 198.3);
}
.eng-theme--dark {
  --mat-toolbar-container-background-color: #212121;
  --mat-toolbar-container-text-color: white;
}
.eng-theme--dark .mat-toolbar.mat-primary {
  --mat-toolbar-container-background-color: #0cabf5;
  --mat-toolbar-container-text-color: rgba(0, 0, 0, 0.87);
}
.eng-theme--dark .mat-toolbar.mat-accent {
  --mat-toolbar-container-background-color: #424242;
  --mat-toolbar-container-text-color: white;
}
.eng-theme--dark .mat-toolbar.mat-warn {
  --mat-toolbar-container-background-color: #f44336;
  --mat-toolbar-container-text-color: white;
}
.eng-theme--dark {
  --mat-toolbar-standard-height: 64px;
  --mat-toolbar-mobile-height: 56px;
}
.eng-theme--dark {
  --mat-toolbar-title-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-toolbar-title-text-line-height: 32px;
  --mat-toolbar-title-text-size: 20px;
  --mat-toolbar-title-text-tracking: 0.0125em;
  --mat-toolbar-title-text-weight: 500;
}
.eng-theme--dark {
  --mat-tree-container-background-color: #424242;
  --mat-tree-node-text-color: white;
}
.eng-theme--dark {
  --mat-tree-node-min-height: 48px;
}
.eng-theme--dark {
  --mat-tree-node-text-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mat-tree-node-text-size: 14px;
  --mat-tree-node-text-weight: 400;
}
.eng-theme--dark {
  --mat-timepicker-container-shape: 4px;
  --mat-timepicker-container-elevation-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
}
.eng-theme--dark {
  --mat-timepicker-container-background-color: #424242;
}
.eng-theme--dark .mat-mdc-mini-fab.mat-accent {
  background-color: var(--color-toolbar-button-bg);
  color: var(--color-toolbar-button-text);
}
.eng-theme--dark .tile__wrapper {
  background-color: var(--color-card-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-base);
  color: var(--color-text-primary);
}
.eng-theme--dark .mat-toolbar-row {
  background-color: var(--color-brand);
}
.eng-theme--dark .mat-primary:not(.mdc-text-field):not(.mdc-switch):not(.mat-mdc-form-field):not(.mat-mdc-slide-toggle):not(.mdc-switch__track):not(.mdc-switch__handle):not(.mdc-switch__handle-track) {
  color: var(--color-text-primary);
}
.eng-theme--dark .mat-mdc-form-field-focus-overlay {
  background-color: var(--color-card-bg);
}
.eng-theme--dark .mat-mdc-form-field.mat-focused .mat-mdc-form-field-focus-overlay {
  opacity: 1;
}
.eng-theme--dark .mat-drawer-content {
  background-color: var(--color-bg-secondary);
}
.eng-theme--dark .cart {
  background-color: var(--color-card-bg);
  color: var(--color-text-primary);
  border: 1px solid var(--color-border);
}
.eng-theme--dark .cart .inner-card {
  background-color: var(--color-surface2);
}
.eng-theme--dark .chart-area {
  background-color: var(--color-card-bg);
  border-radius: var(--radius-base);
  border: 1px solid var(--color-border);
}
.eng-theme--dark .mat-drawer-container {
  background-color: var(--color-bg-secondary);
  fill: var(--color-text-primary);
}
.eng-theme--dark .mat-mdc-table {
  background-color: var(--color-card-bg);
}
.eng-theme--dark .mat-mdc-paginator {
  background-color: var(--color-card-bg);
  color: var(--color-text-primary);
  border-radius: var(--radius-base);
  border: 1px solid var(--color-border);
}
.eng-theme--dark .mat-accent {
  color: var(--color-text-primary);
}
.eng-theme--dark .report {
  background-color: var(--color-card-bg);
  border-radius: var(--radius-base);
  border: 1px solid var(--color-border);
}
.eng-theme--dark .sub-report {
  background-color: var(--color-card-bg);
  border-radius: var(--radius-base);
  border: 1px solid var(--color-border);
}
.eng-theme--dark .mat-mdc-card {
  background-color: var(--color-card-bg);
  color: var(--color-text-primary);
}
.eng-theme--dark .container {
  background-color: var(--color-card-bg);
}
.eng-theme--dark .mat-drawer:not(.mat-drawer-side) {
  background-color: var(--color-card-bg);
}
.eng-theme--dark .mat-expansion-panel-body {
  background-color: var(--color-surface2);
  border-radius: var(--radius-base);
  border: 1px solid var(--color-border);
}
.eng-theme--dark .mat-expansion-panel-header:not([aria-disabled=true]) {
  background-color: var(--color-card-bg);
  border: none;
}
.eng-theme--dark .mat-expansion-panel-header:not([aria-disabled=true]):hover {
  background-color: var(--color-hover-bg);
}
.eng-theme--dark .mat-expansion-panel-header.mat-expanded {
  background-color: var(--color-surface2);
  border-radius: var(--radius-base);
  border: 1px solid var(--color-border);
}
.eng-theme--dark .mat-expansion-panel-header.mat-expanded:hover {
  background-color: var(--color-hover-bg);
}
.eng-theme--dark .popup-container {
  background-color: var(--color-card-bg);
  border-radius: var(--radius-base);
  border: 1px solid var(--color-border);
}
.eng-theme--dark .sub-title-light {
  color: var(--color-text-primary);
}
.eng-theme--dark ::ng-deep .ngx-charts text {
  fill: var(--color-text-primary) !important;
  color: var(--color-text-primary) !important;
}
.eng-theme--dark .apexcharts-menu {
  background-color: var(--color-card-bg);
}
.eng-theme--dark .mat-mdc-form-field:not(.login-field) .mdc-text-field {
  background-color: var(--color-bg-secondary);
  border-radius: var(--radius-base);
  border: 1px solid var(--color-border);
  color: var(--color-text-primary);
}
.eng-theme--dark .mat-mdc-form-field:not(.login-field) .mdc-text-field:hover {
  background-color: var(--color-hover-bg);
}
.eng-theme--dark .mat-mdc-form-field:not(.login-field) .mdc-text-field .mdc-text-field__input {
  color: var(--color-text-primary);
}
.eng-theme--dark .mat-mdc-form-field:not(.login-field) .mdc-text-field .mdc-floating-label {
  color: var(--color-text-secondary);
}
.eng-theme--dark .mat-mdc-form-field:not(.login-field) .mdc-text-field--filled {
  background-color: var(--color-bg-secondary);
}
.eng-theme--dark .mat-mdc-form-field:not(.login-field) .mdc-text-field--filled:hover {
  background-color: var(--color-card-bg);
}
.eng-theme--dark .mat-mdc-form-field:not(.login-field) .mdc-text-field--focused .mdc-line-ripple {
  background-color: var(--color-primary);
}
.eng-theme--dark .mat-mdc-form-field:not(.login-field) .mdc-text-field--focused .mdc-floating-label {
  color: var(--color-primary);
}
.eng-theme--dark .mat-datepicker-content {
  background-color: var(--color-card-bg);
}
.eng-theme--dark .mat-datepicker-content .mat-calendar {
  background-color: var(--color-card-bg);
}
.eng-theme--dark .mdc-menu-surface {
  background-color: var(--color-card-bg);
}
.eng-theme--dark .mat-dialog-container {
  background: var(--color-card-bg);
}

.host-comparison-dialog.eng-theme--dark [mat-dialog-title],
.host-comparison-dialog.eng-theme--dark [mat-dialog-content],
.host-comparison-dialog.eng-theme--dark [mat-dialog-actions] {
  background-color: var(--color-card-bg);
  border-radius: var(--radius-base);
  color: var(--color-text-primary);
}
.host-comparison-dialog.eng-theme--dark .mat-mdc-dialog-title,
.host-comparison-dialog.eng-theme--dark .mat-dialog-title,
.host-comparison-dialog.eng-theme--dark h1,
.host-comparison-dialog.eng-theme--dark h2,
.host-comparison-dialog.eng-theme--dark h3,
.host-comparison-dialog.eng-theme--dark h4,
.host-comparison-dialog.eng-theme--dark h5,
.host-comparison-dialog.eng-theme--dark h6 {
  color: var(--color-text-primary) !important;
}
.host-comparison-dialog.eng-theme--dark .comparison-table {
  box-shadow: none;
  color: var(--color-text-primary);
  border-color: var(--color-border);
}
.host-comparison-dialog.eng-theme--dark .comparison-table th,
.host-comparison-dialog.eng-theme--dark .comparison-table .mat-header-cell,
.host-comparison-dialog.eng-theme--dark .comparison-table .mat-mdc-header-cell {
  color: var(--color-text-primary) !important;
  border-color: var(--color-border);
}
.host-comparison-dialog.eng-theme--dark .comparison-table tr:hover,
.host-comparison-dialog.eng-theme--dark .comparison-table .mat-row:hover,
.host-comparison-dialog.eng-theme--dark .comparison-table .mat-mdc-row:hover {
  background-color: var(--color-hover-bg) !important;
}
.host-comparison-dialog.eng-theme--dark .close-button {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
.host-comparison-dialog.eng-theme--dark .close-button:hover {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
.host-comparison-dialog.eng-theme--dark .close-button:focus {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
.host-comparison-dialog.eng-theme--dark .close-button:active {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.host-comparison-dialog .close-button {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
.host-comparison-dialog .close-button:hover {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
.host-comparison-dialog .close-button:focus {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
.host-comparison-dialog .close-button:active {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
.host-comparison-dialog.eng-theme--dark .close-icon {
  fill: #ffffff;
}

eng-root {
  background: inherit;
}

body {
  margin: 0;
  overflow: hidden;
  font-family: var(--typography-font-family-base);
  font-size: 18px;
  font-weight: 400;
  line-height: 1.5em;
}

.page-header {
  text-align: left;
  font-size: 24px;
  width: 100%;
}

eng-sidenav .mat-expansion-panel-body {
  padding-bottom: 0 !important;
}

/* Change Autocomplete styles in Chrome*/
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus input:-webkit-autofill,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  -webkit-text-fill-color: inherit;
  -webkit-transition: background-color 5000s ease-in-out 0s;
  transition: background-color 5000s ease-in-out 0s;
}

.submit-button.mat-mdc-button-base,
button.submit-button {
  background-color: #0cabf5 !important;
  color: white !important;
}

.loading-container,
.loading-state,
.error-container,
.no-data-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: var(--spacing-xxl);
  text-align: center;
  min-height: 250px;
}
.loading-container mat-spinner,
.loading-state mat-spinner,
.error-container mat-spinner,
.no-data-container mat-spinner {
  margin-bottom: var(--spacing-lg);
}
.loading-container .loading-spinner,
.loading-state .loading-spinner,
.error-container .loading-spinner,
.no-data-container .loading-spinner {
  width: 32px;
  height: 32px;
  border: 3px solid var(--color-border);
  border-top: 3px solid var(--color-primary);
  border-radius: 50%;
  animation: spin 1s linear infinite;
  margin-bottom: var(--spacing-md);
}
.loading-container mat-icon,
.loading-container .empty-icon,
.loading-container .error-icon,
.loading-state mat-icon,
.loading-state .empty-icon,
.loading-state .error-icon,
.error-container mat-icon,
.error-container .empty-icon,
.error-container .error-icon,
.no-data-container mat-icon,
.no-data-container .empty-icon,
.no-data-container .error-icon {
  font-size: 48px;
  width: 48px;
  height: 48px;
  margin-bottom: var(--spacing-lg);
  color: var(--color-text-muted);
}
.loading-container h3,
.loading-container h4,
.loading-state h3,
.loading-state h4,
.error-container h3,
.error-container h4,
.no-data-container h3,
.no-data-container h4 {
  color: var(--color-text-primary);
  margin: 0 0 var(--spacing-sm) 0;
  font-weight: var(--font-weight-medium);
}
.loading-container p,
.loading-state p,
.error-container p,
.no-data-container p {
  color: var(--color-text-secondary);
  margin: var(--spacing-sm) 0;
  max-width: 400px;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.mdc-tooltip .mdc-tooltip__surface,
.mat-mdc-tooltip .mdc-tooltip__surface {
  background-color: var(--color-card-bg) !important;
  color: var(--color-text-primary) !important;
  border: 1px solid var(--color-border) !important;
  box-shadow: var(--layout-modal-shadow) !important;
  font-size: var(--typography-font-size-body-sm) !important;
  padding: var(--spacing-sm) var(--spacing-md) !important;
  border-radius: var(--layout-radius-base) !important;
}
/*!******************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[5].rules[0].oneOf[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[5].rules[0].oneOf[0].use[2]!./node_modules/ngx-toastr/toastr.css?ngGlobalStyle ***!
  \******************************************************************************************************************************************************************************************************************************************/
/* based on angular-toastr css https://github.com/Foxandxss/angular-toastr/blob/cb508fe6801d6b288d3afc525bb40fee1b101650/dist/angular-toastr.css */

/* position */
.toast-center-center {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.toast-top-center {
  top: 0;
  right: 0;
  width: 100%;
}
.toast-bottom-center {
  bottom: 0;
  right: 0;
  width: 100%;
}
.toast-top-full-width {
  top: 0;
  right: 0;
  width: 100%;
}
.toast-bottom-full-width {
  bottom: 0;
  right: 0;
  width: 100%;
}
.toast-top-left {
  top: 12px;
  left: 12px;
}
.toast-top-right {
  top: 12px;
  right: 12px;
}
.toast-bottom-right {
  right: 12px;
  bottom: 12px;
}
.toast-bottom-left {
  bottom: 12px;
  left: 12px;
}

/* toast styles */
.toast-title {
  font-weight: bold;
}
.toast-message {
  word-wrap: break-word;
}
.toast-message a,
.toast-message label {
  color: #FFFFFF;
}
.toast-message a:hover {
  color: #CCCCCC;
  text-decoration: none;
}
.toast-close-button {
  position: relative;
  right: -0.3em;
  top: -0.3em;
  float: right;
  font-size: 20px;
  font-weight: bold;
  color: #FFFFFF;
  text-shadow: 0 1px 0 #ffffff;
  /* opacity: 0.8; */
}
.toast-close-button:hover,
.toast-close-button:focus {
  color: #000000;
  text-decoration: none;
  cursor: pointer;
  opacity: 0.4;
}
/*Additional properties for button version
 iOS requires the button element instead of an anchor tag.
 If you want the anchor version, it requires `href="#"`.*/
button.toast-close-button {
  padding: 0;
  cursor: pointer;
  background: transparent;
  border: 0;
}
.toast-container {
  pointer-events: none;
  position: fixed;
  z-index: 999999;
}
.toast-container * {
  box-sizing: border-box;
}
.toast-container .ngx-toastr {
  position: relative;
  overflow: hidden;
  margin: 0 0 6px;
  padding: 15px 15px 15px 50px;
  width: 300px;
  border-radius: 3px 3px 3px 3px;
  background-position: 15px center;
  background-repeat: no-repeat;
  background-size: 24px;
  box-shadow: 0 0 12px #999999;
  color: #FFFFFF;
}
.toast-container .ngx-toastr:hover {
  box-shadow: 0 0 12px #000000;
  opacity: 1;
  cursor: pointer;
}
/* https://github.com/FortAwesome/Font-Awesome-Pro/blob/master/advanced-options/raw-svg/regular/info-circle.svg */
.toast-info {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCA1MTIgNTEyJyB3aWR0aD0nNTEyJyBoZWlnaHQ9JzUxMic+PHBhdGggZmlsbD0ncmdiKDI1NSwyNTUsMjU1KScgZD0nTTI1NiA4QzExOS4wNDMgOCA4IDExOS4wODMgOCAyNTZjMCAxMzYuOTk3IDExMS4wNDMgMjQ4IDI0OCAyNDhzMjQ4LTExMS4wMDMgMjQ4LTI0OEM1MDQgMTE5LjA4MyAzOTIuOTU3IDggMjU2IDh6bTAgMTEwYzIzLjE5NiAwIDQyIDE4LjgwNCA0MiA0MnMtMTguODA0IDQyLTQyIDQyLTQyLTE4LjgwNC00Mi00MiAxOC44MDQtNDIgNDItNDJ6bTU2IDI1NGMwIDYuNjI3LTUuMzczIDEyLTEyIDEyaC04OGMtNi42MjcgMC0xMi01LjM3My0xMi0xMnYtMjRjMC02LjYyNyA1LjM3My0xMiAxMi0xMmgxMnYtNjRoLTEyYy02LjYyNyAwLTEyLTUuMzczLTEyLTEydi0yNGMwLTYuNjI3IDUuMzczLTEyIDEyLTEyaDY0YzYuNjI3IDAgMTIgNS4zNzMgMTIgMTJ2MTAwaDEyYzYuNjI3IDAgMTIgNS4zNzMgMTIgMTJ2MjR6Jy8+PC9zdmc+");
}
/* https://github.com/FortAwesome/Font-Awesome-Pro/blob/master/advanced-options/raw-svg/regular/times-circle.svg */
.toast-error {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCA1MTIgNTEyJyB3aWR0aD0nNTEyJyBoZWlnaHQ9JzUxMic+PHBhdGggZmlsbD0ncmdiKDI1NSwyNTUsMjU1KScgZD0nTTI1NiA4QzExOSA4IDggMTE5IDggMjU2czExMSAyNDggMjQ4IDI0OCAyNDgtMTExIDI0OC0yNDhTMzkzIDggMjU2IDh6bTEyMS42IDMxMy4xYzQuNyA0LjcgNC43IDEyLjMgMCAxN0wzMzggMzc3LjZjLTQuNyA0LjctMTIuMyA0LjctMTcgMEwyNTYgMzEybC02NS4xIDY1LjZjLTQuNyA0LjctMTIuMyA0LjctMTcgMEwxMzQuNCAzMzhjLTQuNy00LjctNC43LTEyLjMgMC0xN2w2NS42LTY1LTY1LjYtNjUuMWMtNC43LTQuNy00LjctMTIuMyAwLTE3bDM5LjYtMzkuNmM0LjctNC43IDEyLjMtNC43IDE3IDBsNjUgNjUuNyA2NS4xLTY1LjZjNC43LTQuNyAxMi4zLTQuNyAxNyAwbDM5LjYgMzkuNmM0LjcgNC43IDQuNyAxMi4zIDAgMTdMMzEyIDI1Nmw2NS42IDY1LjF6Jy8+PC9zdmc+");
}
/* https://github.com/FortAwesome/Font-Awesome-Pro/blob/master/advanced-options/raw-svg/regular/check.svg */
.toast-success {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCA1MTIgNTEyJyB3aWR0aD0nNTEyJyBoZWlnaHQ9JzUxMic+PHBhdGggZmlsbD0ncmdiKDI1NSwyNTUsMjU1KScgZD0nTTE3My44OTggNDM5LjQwNGwtMTY2LjQtMTY2LjRjLTkuOTk3LTkuOTk3LTkuOTk3LTI2LjIwNiAwLTM2LjIwNGwzNi4yMDMtMzYuMjA0YzkuOTk3LTkuOTk4IDI2LjIwNy05Ljk5OCAzNi4yMDQgMEwxOTIgMzEyLjY5IDQzMi4wOTUgNzIuNTk2YzkuOTk3LTkuOTk3IDI2LjIwNy05Ljk5NyAzNi4yMDQgMGwzNi4yMDMgMzYuMjA0YzkuOTk3IDkuOTk3IDkuOTk3IDI2LjIwNiAwIDM2LjIwNGwtMjk0LjQgMjk0LjQwMWMtOS45OTggOS45OTctMjYuMjA3IDkuOTk3LTM2LjIwNC0uMDAxeicvPjwvc3ZnPg==");
}
/* https://github.com/FortAwesome/Font-Awesome-Pro/blob/master/advanced-options/raw-svg/regular/exclamation-triangle.svg */
.toast-warning {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCA1NzYgNTEyJyB3aWR0aD0nNTc2JyBoZWlnaHQ9JzUxMic+PHBhdGggZmlsbD0ncmdiKDI1NSwyNTUsMjU1KScgZD0nTTU2OS41MTcgNDQwLjAxM0M1ODcuOTc1IDQ3Mi4wMDcgNTY0LjgwNiA1MTIgNTI3Ljk0IDUxMkg0OC4wNTRjLTM2LjkzNyAwLTU5Ljk5OS00MC4wNTUtNDEuNTc3LTcxLjk4N0wyNDYuNDIzIDIzLjk4NWMxOC40NjctMzIuMDA5IDY0LjcyLTMxLjk1MSA4My4xNTQgMGwyMzkuOTQgNDE2LjAyOHpNMjg4IDM1NGMtMjUuNDA1IDAtNDYgMjAuNTk1LTQ2IDQ2czIwLjU5NSA0NiA0NiA0NiA0Ni0yMC41OTUgNDYtNDYtMjAuNTk1LTQ2LTQ2LTQ2em0tNDMuNjczLTE2NS4zNDZsNy40MTggMTM2Yy4zNDcgNi4zNjQgNS42MDkgMTEuMzQ2IDExLjk4MiAxMS4zNDZoNDguNTQ2YzYuMzczIDAgMTEuNjM1LTQuOTgyIDExLjk4Mi0xMS4zNDZsNy40MTgtMTM2Yy4zNzUtNi44NzQtNS4wOTgtMTIuNjU0LTExLjk4Mi0xMi42NTRoLTYzLjM4M2MtNi44ODQgMC0xMi4zNTYgNS43OC0xMS45ODEgMTIuNjU0eicvPjwvc3ZnPg==");
}
.toast-container.toast-top-center .ngx-toastr,
.toast-container.toast-bottom-center .ngx-toastr {
  width: 300px;
  margin-left: auto;
  margin-right: auto;
}
.toast-container.toast-top-full-width .ngx-toastr,
.toast-container.toast-bottom-full-width .ngx-toastr {
  width: 96%;
  margin-left: auto;
  margin-right: auto;
}
.ngx-toastr {
  background-color: #030303;
  pointer-events: auto;
}
.toast-success {
  background-color: #51A351;
}
.toast-error {
  background-color: #BD362F;
}
.toast-info {
  background-color: #2F96B4;
}
.toast-warning {
  background-color: #F89406;
}
.toast-progress {
  position: absolute;
  left: 0;
  bottom: 0;
  height: 4px;
  background-color: #000000;
  opacity: 0.4;
}
/* Responsive Design */
@media all and (max-width: 240px) {
  .toast-container .ngx-toastr.div {
    padding: 8px 8px 8px 50px;
    width: 11em;
  }
  .toast-container .toast-close-button {
    right: -0.2em;
    top: -0.2em;
  }
}
@media all and (min-width: 241px) and (max-width: 480px) {
  .toast-container .ngx-toastr.div {
    padding: 8px 8px 8px 50px;
    width: 18em;
  }
  .toast-container .toast-close-button {
    right: -0.2em;
    top: -0.2em;
  }
}
@media all and (min-width: 481px) and (max-width: 768px) {
  .toast-container .ngx-toastr.div {
    padding: 15px 15px 15px 50px;
    width: 25em;
  }
}


/*# sourceMappingURL=styles.53b2b7f2dd2e8e06.css.map*/