/* ===================================================================== Liga DS — generated token layer. DO NOT EDIT BY HAND. Source: Figma "❖ UI LIBRARY" (fileKey fOisEfYBh4z6VbkY6sOmSn) Regenerate: figma_export_tokens (css-vars) -> transform-tokens.mjs Brand axis: Liga360 (:root default) / United ([data-brand="united"]). ===================================================================== */ :root { --color-primary-100: #F3F2FF; --color-primary-200: #E5E2FF; --color-primary-300: #AEB1FF; --color-primary-400: #9486FF; --color-primary-500: #7267E6; --color-primary-600: #5048A1; --color-primary-800: #27234F; --color-primary-1000: #080620; --color-primary-700: #383271; --color-primary-900: #1B1937; --color-neutral-solid-100: #FFFFFF; --color-neutral-solid-200: #FAFAFC; --color-neutral-solid-300: #EFEFF5; --color-neutral-solid-400: #E7E7EC; --color-neutral-solid-500: #D6D6DE; --color-neutral-solid-600: #9898A3; --color-neutral-solid-700: #636373; --color-neutral-solid-800: #4B4B55; --color-neutral-solid-900: #25252A; --color-neutral-solid-1000: #151517; --color-dark-neutral-solid-100: #B6BDCF; --color-dark-neutral-solid-200: #9FA4BC; --color-dark-neutral-solid-300: #8C93AB; --color-dark-neutral-solid-400: #77809C; --color-dark-neutral-solid-500: #626C8B; --color-dark-neutral-solid-600: #515C81; --color-dark-neutral-solid-700: #3E4A71; --color-dark-neutral-solid-800: #2A365B; --color-dark-neutral-solid-900: #202A4C; --color-dark-neutral-solid-1000: #121B39; --color-neutral-alpha-100: #FBFBFF1A; --color-neutral-alpha-200: #FBFBFF33; --color-neutral-alpha-300: #FBFBFF4D; --color-neutral-alpha-400: #FBFBFF66; --color-neutral-alpha-500: #FBFBFF80; --color-neutral-alpha-600: #FBFBFF99; --color-neutral-alpha-700: #FBFBFFB2; --color-neutral-alpha-800: #FBFBFFCC; --color-neutral-alpha-850: #FBFBFFD9; --color-neutral-alpha-900: #FBFBFFE5; --color-dark-neutral-alpha-100: #121B391A; --color-dark-neutral-alpha-200: #121B3933; --color-dark-neutral-alpha-300: #121B394D; --color-dark-neutral-alpha-400: #121B3966; --color-dark-neutral-alpha-500: #121B3980; --color-dark-neutral-alpha-600: #121B3999; --color-dark-neutral-alpha-700: #121B39B2; --color-dark-neutral-alpha-800: #121B39CC; --color-dark-neutral-alpha-850: #121B39D9; --color-dark-neutral-alpha-900: #121B39E5; --spacings-0: 0px; --spacings-2: 2px; --spacings-4: 4px; --spacings-6: 6px; --spacings-8: 8px; --spacings-12: 12px; --spacings-16: 16px; --spacings-24: 24px; --spacings-32: 32px; --spacings-40: 40px; --spacings-48: 48px; --spacings-64: 64px; --spacings-80: 80px; --spacings-100: 100px; --spacings-20: 20px; --color-other-colors-red-700: #D00F3C; --color-other-colors-red-500: #E25C7B; --color-other-colors-red-900: #6E0920; --brand-colors-brand-primary: #7267E6; --color-other-colors-orange-red-500: #FE7D34; --color-other-colors-orange-red-300: #FFBE99; --color-other-colors-orange-red-700: #CB4A01; --color-other-colors-blue-300: #85B8FF; --color-other-colors-blue-500: #3388FF; --color-other-colors-blue-700: #0055CC; --color-other-colors-cool-green-500: #5DBC94; --color-other-colors-cool-green-700: #216E4E; --color-other-colors-cool-green-900: #04311F; --spacings-36: 36px; --color-other-colors-warm-yellow-300: #F9E199; --color-other-colors-warm-yellow-500: #F5CA4C; --color-other-colors-warm-yellow-700: #D6A000; --color-other-colors-warm-green-600: #66A726; --color-other-colors-warm-green-700: #51851F; --color-other-colors-warm-green-800: #306821; --color-other-colors-orange-500: #FFAB33; --color-other-colors-orange-700: #CC7700; --color-other-colors-orange-900: #5C3A0A; --color-other-colors-red-400: #EB8EA3; --color-other-colors-red-300: #F6CBD5; --color-other-colors-red-200: #F9DCE3; --color-other-colors-warm-green-500: #87C747; --color-other-colors-red-100: #FCF2F4; --color-other-colors-red-600: #D93E62; --color-other-colors-cool-green-300: #AAE5CC; --color-other-colors-cool-green-200: #D4F2E6; --color-other-colors-cool-green-100: #E2F8EF; --color-other-colors-cool-green-400: #7CD8B0; --color-other-colors-cool-green-600: #589E80; --color-other-colors-cool-green-800: #315A49; --color-other-colors-warm-green-400: #A3DD6B; --color-other-colors-warm-green-300: #B8E58C; --color-other-colors-warm-green-200: #DCF2C7; --color-other-colors-warm-green-100: #F5FBEF; --color-other-colors-warm-green-900: #375B14; --color-other-colors-orange-600: #FF9400; --color-other-colors-orange-400: #FFBE66; --color-other-colors-orange-300: #FFD9A3; --color-other-colors-orange-200: #FFEACD; --color-other-colors-orange-100: #FFF8F0; --color-other-colors-orange-800: #875612; --color-other-colors-red-1000: #470615; --color-other-colors-red-800: #AB0C31; --color-other-colors-cool-green-1000: #02180F; --color-other-colors-warm-green-1000: #192A09; --color-other-colors-blue-100: #E5F0FF; --color-other-colors-blue-200: #D1E4FF; --color-other-colors-blue-400: #66A6FF; --color-other-colors-blue-600: #006AFF; --color-other-colors-blue-800: #004099; --color-other-colors-blue-900: #002A66; --color-other-colors-blue-1000: #001533; --color-other-colors-orange-red-100: #FCE6DA; --color-other-colors-orange-red-200: #F9D3BD; --color-other-colors-orange-red-400: #FE9D67; --color-other-colors-orange-red-600: #FA5B01; --color-other-colors-orange-red-800: #983701; --color-other-colors-orange-red-900: #652601; --color-other-colors-orange-red-1000: #4B1C01; --color-other-colors-orange-1000: #372306; --color-other-colors-warm-yellow-100: #FDF7E5; --color-other-colors-warm-yellow-200: #FCF0CC; --color-other-colors-warm-yellow-400: #F8D97F; --color-other-colors-warm-yellow-600: #F2BB19; --color-other-colors-warm-yellow-800: #A37A00; --color-other-colors-warm-yellow-900: #6B5106; --color-other-colors-warm-yellow-1000: #3A2C03; --corner-radius-24: 24px; --corner-radius-12: 12px; --corner-radius-4: 4px; --corner-radius-8: 8px; --corner-radius-2: 2px; --corner-radius-infinity: 10000px; --corner-radius-16: 16px; --corner-radius-0: 0px; --shadow-z-index-eleveation-1-color: #A8A8A80D; --shadow-z-index-eleveation-1-blur: 25px; --shadow-z-index-eleveation-1-spread: 5px; --shadow-z-index-eleveation-2-color: #A8A8A826; --shadow-z-index-eleveation-2-blur: 50px; --shadow-z-index-eleveation-2-spread: 10px; --shadow-z-index-eleveation-3-color: #A8A8A840; --shadow-z-index-eleveation-3-blur: 64px; --shadow-z-index-eleveation-3-spread: 15px; --color-neutral-solid-150: #FCFCFD; --color-neutral-solid-125: #FBFBFC; --color-neutral-alpha-0: #FBFBFF00; --brand-colors-brand-secondary: #61B1CA; --color-neutral-solid-350: #EAEAF0; --color-neutral-solid-450: #E3E3E8; --space-0: var(--spacings-0); --space-025: var(--spacings-2); --space-050: var(--spacings-4); --space-075: var(--spacings-6); --space-100: var(--spacings-8); --space-150: var(--spacings-12); --space-200: var(--spacings-16); --space-250: var(--spacings-20); --space-300: var(--spacings-24); --space-400: var(--spacings-32); --space-500: var(--spacings-40); --space-600: var(--spacings-48); --space-800: var(--spacings-64); --space-1000: var(--spacings-80); --space-1200: var(--spacings-100); --text-default: var(--color-neutral-solid-900); --text-subtle: var(--color-neutral-solid-800); --text-subtlest: var(--color-neutral-solid-600); --text-disabled: var(--color-neutral-solid-500); --text-hover: var(--color-primary-400); --text-danger: var(--color-other-colors-red-700); --text-warning: var(--color-other-colors-orange-red-700); --text-success: var(--color-other-colors-cool-green-700); --text-information: var(--color-other-colors-blue-500); --link-default: var(--color-primary-500); --link-click: var(--color-primary-300); --link-visited: var(--color-primary-600); --icon-default: var(--color-neutral-solid-900); --icon-subtle: var(--color-neutral-solid-800); --icon-disabled: var(--color-neutral-solid-500); --icon-hover: var(--color-primary-400); --icon-brand: var(--brand-colors-brand-primary); --text-brand-liga: var(--brand-colors-brand-primary); --icon-danger: var(--color-other-colors-red-700); --icon-warning: var(--color-other-colors-orange-red-500); --icon-success: var(--color-other-colors-cool-green-700); --icon-info: var(--color-other-colors-blue-500); --cntnr-border-default: var(--color-primary-200); --cntnr-border-hover: var(--color-primary-300); --cntnr-border-disabled: var(--color-neutral-solid-400); --cntnr-border-selected: var(--color-primary-400); --cntnr-border-error: var(--color-other-colors-red-700); --cntnr-border-warning: var(--color-other-colors-orange-red-500); --cntnr-border-success: var(--color-other-colors-cool-green-700); --cntnr-border-info: var(--color-other-colors-blue-500); --blanket-popup-background: var(--color-dark-neutral-alpha-200); --skeleton-default: var(--color-neutral-alpha-300); --skeleton-shimmer: var(--color-neutral-solid-500); --cntnr-bg-primary-default: var(--color-neutral-solid-100); --cntnr-bg-primary-hover: var(--color-primary-100); --text-active: var(--color-primary-500); --text-click: var(--color-primary-600); --icon-active: var(--color-primary-500); --icon-click: var(--color-primary-600); --icon-alternative-active: var(--color-neutral-solid-100); --btn-bg-primary-default: var(--color-neutral-solid-1000); --btn-bg-primary-active: var(--color-primary-500); --text-alternative: var(--color-neutral-solid-100); --cntnr-border-alternative: var(--color-neutral-solid-900); --btn-bg-primary-disable: var(--color-neutral-solid-300); --cntnr-bg-secondary-default: var(--color-neutral-solid-200); --btn-bg-primary-disable-alternative: var(--color-neutral-solid-200); --cntnr-bg-other-page-background: var(--color-neutral-solid-300); --btn-bg-primary-hover: var(--color-primary-500); --btn-bg-primary-click-pressed: var(--color-primary-300); --cntnr-bg-primary-click: var(--color-primary-200); --icon-subtlest: var(--color-neutral-solid-600); --divider-divider: var(--color-primary-200); --status-filled-positive: var(--color-other-colors-cool-green-700); --status-filled-negative: var(--color-other-colors-red-700); --status-filled-warning: var(--color-other-colors-orange-red-500); --status-filled-blue: var(--color-other-colors-blue-600); --status-filled-passive: var(--color-dark-neutral-solid-500); --cntnr-bg-primary-active: var(--color-primary-200); --text-accent: var(--color-primary-600); --icon-accent: var(--color-primary-600); --cntnr-bg-other-readonly-elements: var(--color-neutral-solid-400); --btn-bg-primary-hover-for-active: var(--color-primary-600); --cntnr-bg-other-3-rd-level-list-element: var(--color-neutral-solid-300); --space-450: var(--spacings-36); --cntnr-border-subtlest: var(--color-neutral-solid-400); --highlight-bg: var(--color-primary-200); --cntnr-corner-biggest: var(--corner-radius-24); --cntnr-bg-transperent-default: var(--color-neutral-alpha-500); --cntnr-bg-none-default: #FFFFFF00; --cntnr-corner-large: var(--corner-radius-16); --cntnr-corner-big: var(--corner-radius-12); --cntnr-corner-normal: var(--corner-radius-8); --cntnr-corner-small: var(--corner-radius-4); --cntnr-corner-nano: var(--corner-radius-2); --cntnr-corner-none: var(--corner-radius-0); --cntnr-bg-transperent-hover: var(--color-neutral-alpha-600); --cntnr-bg-transperent-selected: var(--color-neutral-alpha-700); --cntnr-bg-secondary-hover: var(--color-primary-100); --cntnr-bg-secondary-active: var(--color-primary-200); --cntnr-corner-infinity: var(--corner-radius-infinity); --btn-bg-secondary-default: var(--color-neutral-solid-100); --btn-bg-secondary-active: var(--color-primary-200); --btn-bg-secondary-disable: var(--color-neutral-solid-300); --btn-bg-secondary-disable-alternative: var(--color-neutral-solid-200); --btn-bg-secondary-hover: var(--color-primary-500); --btn-bg-secondary-hover-for-active: var(--color-primary-300); --btn-bg-secondary-click-pressed: var(--color-primary-300); --btn-bg-secondary-border-default: var(--color-primary-200); --btn-bg-secondary-border-active: var(--color-primary-500); --cntnr-bg-primary-disabled: var(--color-neutral-solid-300); --btn-bg-danger-default: var(--color-other-colors-red-700); --btn-bg-danger-hover: var(--color-other-colors-red-500); --btn-bg-danger-active: var(--color-other-colors-red-800); --btn-bg-danger-disable: var(--color-neutral-solid-300); --btn-bg-danger-disable-alternative: var(--color-neutral-solid-200); --btn-bg-danger-hover-for-active: var(--color-other-colors-red-600); --btn-bg-danger-click-pressed: var(--color-other-colors-red-900); --btn-bg-danger-border-default: var(--color-other-colors-red-700); --btn-bg-danger-border-active: var(--color-other-colors-red-800); --btn-corner-corner: var(--corner-radius-infinity); --dropdown-stroke-default: var(--color-primary-200); --unique-colors-blue: var(--color-other-colors-blue-700); --unique-colors-green: var(--color-other-colors-warm-green-600); --unique-colors-yellow: var(--color-other-colors-warm-yellow-600); --unique-colors-marine: var(--color-other-colors-blue-400); --unique-colors-purple: var(--color-primary-600); --unique-colors-cyan: var(--color-other-colors-cool-green-500); --unique-colors-brown: var(--color-other-colors-orange-red-700); --unique-colors-lime: var(--color-other-colors-warm-green-500); --unique-colors-grey: var(--color-dark-neutral-solid-400); --unique-colors-red: var(--color-other-colors-red-500); --table-bg-defaulttable: var(--cntnr-bg-primary-default); --table-bg-zebra: var(--color-neutral-solid-125); --table-bg-secondarytable: var(--color-neutral-solid-300); --dropdown-bg-default: var(--color-neutral-solid-200); --field-corner-field-corner: var(--corner-radius-infinity); --tabs-corner-tabs-corner: var(--corner-radius-infinity); --dropdown-corner-dropdown-corner: var(--corner-radius-infinity); --cntnr-bg-other-danger-danger: var(--color-other-colors-red-100); --cntnr-bg-other-success: var(--color-other-colors-cool-green-100); --cntnr-bg-other-warning: var(--color-other-colors-orange-100); --cntnr-bg-other-blue: var(--color-other-colors-blue-100); --cntnr-bg-other-neutral: var(--color-neutral-solid-150); --btn-bg-transperent-hover: var(--color-neutral-alpha-0); --btn-bg-transperent-active: var(--color-neutral-alpha-0); --btn-bg-transperent-disable: var(--color-neutral-solid-300); --btn-bg-transperent-disable-alternative: var(--color-neutral-solid-200); --btn-bg-transperent-hover-for-active: var(--color-neutral-alpha-0); --btn-bg-transperent-click-pressed: var(--color-neutral-alpha-0); --cntnr-border-white: var(--color-neutral-solid-100); --checkbox-corner-checkbox-corner: var(--corner-radius-4); --chips-corner-chips-corner: var(--corner-radius-infinity); --tag-corner-tag-corner: var(--corner-radius-infinity); --table-bg-thirdtable: var(--color-neutral-solid-400); --cntnr-bg-other-danger-dangerhover: var(--color-other-colors-red-200); --table-bg-hovertable: var(--color-primary-100); --node-property: #0AD8B6; --node-business-group: #C3CF14; --node-central-node: #121B39; --node-sanction: #D00F3C; --node-phone: #24D366; --node-court: #ED7B58; --node-group-list-element: #B6BDCF; --node-email: #D007F3; --node-unknown: #E4E2FF; --node-person: #015CE5; --node-location: #6C2AB9; --node-company: #F4D20A; --checkbox-color-default-checkbox: var(--color-primary-500); --checkbox-color-hover-checkbox: var(--color-primary-400); --checkbox-color-selected-checkbox: var(--color-primary-600); --cntnr-border-active: var(--color-primary-500); --cntnr-bg-third-default: var(--color-neutral-solid-125); --cntnr-bg-third-hover: var(--color-neutral-solid-200); --cntnr-bg-third-selected: var(--color-neutral-solid-300); --status-trasperent-positive: var(--color-other-colors-cool-green-200); --status-trasperent-negative: var(--color-other-colors-red-200); --status-trasperent-passive: var(--color-neutral-solid-400); --status-trasperent-warning: var(--color-other-colors-orange-red-100); --status-trasperent-blue: var(--color-other-colors-blue-100); --status-trasperent-primary: var(--color-primary-200); --status-filled-primary: var(--color-primary-500); --btn-bg-danger-secondary-default: var(--color-neutral-solid-100); --btn-bg-danger-secondary-active: var(--color-other-colors-red-200); --btn-bg-danger-secondary-hover: var(--color-other-colors-red-500); --btn-bg-danger-secondary-hover-for-active: var(--color-other-colors-red-300); --btn-bg-danger-secondary-click-pressed: var(--color-other-colors-red-300); --btn-bg-danger-secondary-disable: var(--color-neutral-solid-300); --btn-bg-danger-secondary-disable-alternative: var(--color-neutral-solid-200); --btn-bg-transperent-danger-hover: var(--color-neutral-alpha-0); --btn-bg-transperent-danger-active: var(--color-neutral-alpha-0); --btn-bg-transperent-danger-hover-for-active: var(--color-neutral-alpha-0); --btn-bg-transperent-danger-click-pressed: var(--color-neutral-alpha-0); --btn-bg-transperent-danger-disable: var(--color-neutral-solid-300); --btn-bg-transperent-danger-disable-alternative: var(--color-neutral-solid-200); --colors-color-1: #A685E2; --colors-color-2: #22C0F1; --colors-color-3: #55E18D; --colors-color-4: #E8E86C; --colors-color-5: #FF9E58; --colors-color-6: #E2406A; --colors-color-7: #EF7BE3; --colors-color-8: #9360A9; --colors-color-9: #52ACFF; --colors-color-10: #58D764; --colors-color-11: #FBE947; --colors-color-12: #FF903E; --colors-color-13: #FF5A5A; --colors-color-14: #EF7BE3; --colors-color-15: #5A78F0; --colors-color-16: #72D572; --colors-color-17: #F5E476; --colors-color-18: #FF9E58; --colors-color-19: #F05A5A; --colors-color-20: #D3689A; --monochrome-color-21: #8E65DA; --monochrome-color-22: #622EC1; --monochrome-color-23: #421F81; --monochrome-color-24: #311761; --monochrome-color-25: #BAA0E8; --monochrome-color-26: #C4AEEC; --monochrome-color-27: #D7C9F2; --monochrome-color-28: #EBE4F9; --colors-color-21: #AEADAD; /* screen sizes + responsive heading sizes (desktop defaults) */ --screen-size-1440-desktop: 1440px; --screen-size-1024: 1024px; --screen-size-1648: 1648px; --screen-size-768-tablet: 768px; --screen-size-375-mobile: 375px; --screen-size-1920: 1920px; --screen-size-2460-2k: 2460px; --screen-size-1280: 1280px; --typo-sizes-h450: 18px; --typo-sizes-h500: 20px; --typo-sizes-h600: 24px; --typo-sizes-h700: 29px; --typo-sizes-h800: 35px; --typo-sizes-h400: 16px; --typo-sizes-h300: 14px; --typo-sizes-h200: 12px; --typo-sizes-h100: 11px; --screen-size-auto-screen-size: 1440px; /* brand font family (Liga360 = Lato) */ --liga-font-family: 'Lato', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; --liga-font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; } /* ---- United brand: primitive/value overrides only (semantics follow automatically) ---- */ [data-brand="united"] { --color-primary-100: #DBE8FF; --color-primary-200: #B7D1FF; --color-primary-300: #6EA2FF; --color-primary-400: #025CFF; --color-primary-500: #003594; --color-primary-600: #003085; --color-primary-800: #001B4A; --color-primary-1000: #00050F; --color-primary-700: #002568; --color-primary-900: #00102C; --color-neutral-solid-200: #EEF1F8; --color-neutral-solid-300: #E7ECF5; --color-neutral-solid-400: #E0E6F2; --color-neutral-solid-500: #D1D6E2; --color-neutral-solid-600: #9398A1; --color-neutral-solid-700: #747981; --color-neutral-solid-800: #454A50; --color-neutral-solid-900: #303438; --color-neutral-solid-1000: #1C1E20; --color-dark-neutral-solid-100: #B3BCCF; --color-dark-neutral-solid-200: #96A1BD; --color-dark-neutral-solid-300: #7887AA; --color-dark-neutral-solid-400: #6C7DA3; --color-dark-neutral-solid-500: #5D6E94; --color-dark-neutral-solid-600: #536284; --color-dark-neutral-solid-700: #4B5877; --color-dark-neutral-solid-800: #384259; --color-dark-neutral-solid-900: #252C3B; --color-dark-neutral-solid-1000: #13161E; --color-other-colors-red-700: #D60000; --color-other-colors-red-500: #FF585D; --color-other-colors-red-900: #810000; --brand-colors-brand-primary: #003594; --color-other-colors-orange-red-500: #FF9E1B; --color-other-colors-orange-red-300: #FFC79F; --color-other-colors-orange-red-700: #D65900; --color-other-colors-blue-300: #9FBEFF; --color-other-colors-blue-500: #588EFF; --color-other-colors-blue-700: #0045D6; --color-other-colors-cool-green-500: #42EA60; --color-other-colors-cool-green-700: #0D741F; --color-other-colors-cool-green-900: #042F0C; --color-other-colors-orange-500: #F49B35; --color-other-colors-orange-700: #CA710B; --color-other-colors-orange-900: #512D04; --color-other-colors-red-400: #FF8383; --color-other-colors-red-300: #FFACAC; --color-other-colors-red-200: #FFD6D6; --color-other-colors-red-100: #FFF1F1; --color-other-colors-red-600: #FF2D2D; --color-other-colors-cool-green-300: #9CF4AC; --color-other-colors-cool-green-200: #C1F8CB; --color-other-colors-cool-green-100: #E6FCEA; --color-other-colors-cool-green-400: #8FF3A1; --color-other-colors-cool-green-600: #15C134; --color-other-colors-cool-green-800: #094D15; --color-other-colors-orange-600: #F2870D; --color-other-colors-orange-400: #F9C386; --color-other-colors-orange-300: #FAD1A1; --color-other-colors-orange-200: #FCE4C9; --color-other-colors-orange-100: #FEF8F2; --color-other-colors-orange-800: #794406; --color-other-colors-red-1000: #2B0015; --color-other-colors-red-800: #AC1100; --color-other-colors-cool-green-1000: #04270A; --color-other-colors-blue-100: #E3ECFF; --color-other-colors-blue-200: #D6E3FF; --color-other-colors-blue-400: #83ABFF; --color-other-colors-blue-600: #2D71FF; --color-other-colors-blue-800: #0037AC; --color-other-colors-blue-900: #002981; --color-other-colors-blue-1000: #000E2B; --color-other-colors-orange-red-100: #FFE7D6; --color-other-colors-orange-red-200: #FFD7BA; --color-other-colors-orange-red-400: #FFB783; --color-other-colors-orange-red-600: #FF6C02; --color-other-colors-orange-red-800: #AC4700; --color-other-colors-orange-red-900: #813600; --color-other-colors-orange-red-1000: #562400; --color-other-colors-orange-1000: #281702; --shadow-z-index-eleveation-1-color: #9E9E9E0D; --shadow-z-index-eleveation-2-color: #9E9E9E26; --shadow-z-index-eleveation-3-color: #9E9E9E40; --color-neutral-solid-150: #F4F6FA; --brand-colors-brand-secondary: #00A3E1; --color-neutral-solid-350: #E2E7F0; --color-neutral-solid-450: #DCE1ED; --text-subtlest: var(--color-neutral-solid-700); --link-default: var(--color-primary-400); --link-visited: var(--color-primary-700); --cntnr-border-default: var(--color-neutral-solid-300); --btn-bg-primary-default: var(--color-primary-500); --btn-bg-primary-active: var(--color-primary-600); --cntnr-bg-other-page-background: #E8EAED; --btn-bg-primary-hover: var(--color-primary-400); --divider-divider: var(--color-neutral-solid-200); --cntnr-corner-biggest: var(--corner-radius-0); --cntnr-bg-transperent-default: var(--color-neutral-solid-125); --cntnr-corner-large: var(--corner-radius-0); --cntnr-corner-big: var(--corner-radius-0); --cntnr-bg-transperent-hover: var(--color-neutral-solid-200); --cntnr-bg-transperent-selected: var(--color-neutral-solid-300); --btn-bg-secondary-disable: var(--color-neutral-alpha-300); --btn-bg-secondary-hover: var(--color-primary-400); --btn-bg-secondary-border-default: var(--color-neutral-solid-900); --btn-corner-corner: var(--corner-radius-0); --unique-colors-blue: #015CE5; --unique-colors-green: #4CA334; --unique-colors-yellow: #EBCC44; --unique-colors-marine: #0F8BD0; --unique-colors-purple: #640FD0; --unique-colors-cyan: #0FD08B; --unique-colors-brown: #D0600F; --unique-colors-lime: #9ED00F; --unique-colors-grey: #626C8B; --unique-colors-red: #E25C7B; --table-bg-secondarytable: var(--color-neutral-solid-200); --dropdown-bg-default: var(--color-neutral-solid-125); --field-corner-field-corner: var(--corner-radius-0); --tabs-corner-tabs-corner: var(--corner-radius-0); --dropdown-corner-dropdown-corner: var(--corner-radius-0); --btn-bg-transperent-hover: var(--color-primary-100); --btn-bg-transperent-active: var(--color-primary-200); --btn-bg-transperent-hover-for-active: var(--color-primary-300); --btn-bg-transperent-click-pressed: var(--color-primary-300); --checkbox-corner-checkbox-corner: var(--corner-radius-0); --chips-corner-chips-corner: var(--corner-radius-2); --tag-corner-tag-corner: var(--corner-radius-0); --table-bg-thirdtable: var(--color-neutral-solid-300); --btn-bg-danger-secondary-hover: var(--color-other-colors-red-400); --btn-bg-danger-secondary-disable: var(--color-neutral-alpha-300); --btn-bg-transperent-danger-hover: var(--color-other-colors-red-100); --btn-bg-transperent-danger-active: var(--color-other-colors-red-200); --btn-bg-transperent-danger-hover-for-active: var(--color-other-colors-red-300); --btn-bg-transperent-danger-click-pressed: var(--color-other-colors-red-300); --colors-color-1: #5A78F0; --colors-color-2: #72D572; --colors-color-3: #F5E476; --colors-color-4: #FF9E58; --colors-color-5: #F05A5A; --colors-color-6: #D3689A; --colors-color-7: #A685E2; --colors-color-8: #22C0F1; --colors-color-9: #55E18D; --colors-color-10: #E8E86C; --colors-color-11: #FF9E58; --colors-color-12: #E2406A; --colors-color-13: #EF7BE3; --colors-color-14: #9360A9; --colors-color-15: #52ACFF; --colors-color-16: #58D764; --colors-color-17: #FBE947; --colors-color-18: #FF903E; --colors-color-19: #FF5A5A; --colors-color-20: #EF7BE3; --monochrome-color-21: #2D53EC; --monochrome-color-22: #1339D2; --monochrome-color-23: #0F2DA4; --monochrome-color-24: #0B2075; --monochrome-color-25: #7F96F3; --monochrome-color-26: #A3B4F7; --monochrome-color-27: #C8D2FA; --monochrome-color-28: #EDF0FD; /* brand font family (United = E-Ukraine) */ --liga-font-family: 'e-Ukraine', 'E-Ukraine', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; } /* ---- Responsive headings: tablet & mobile shrink H450–H800 ---- */ @media (max-width: 1023.98px) { :root { --typo-sizes-h450: 16px; --typo-sizes-h500: 18px; --typo-sizes-h600: 20px; --typo-sizes-h700: 24px; --typo-sizes-h800: 29px; --screen-size-auto-screen-size: 768px; } }