:root { --white: #FFFFFF; --black: #000000; --red-20: #FAD4D4; --red-30: #F99797; --red-50: #F55353; --red-60: #DE1B1B; --red-90: #661414; --neutral-10: #FAFAFA; --neutral-20: #F4F4F4; --neutral-30: #D8D8D8; --neutral-40: #BDBDBD; --neutral-50: #A1A1A1; --neutral-60: #767676; --neutral-70: #5E5E5E; --neutral-80: #515151; --neutral-90: #323232; --neutral-100: #161616; --seq-1: #AE74E8; --seq-2: #9659D6; --seq-3: #7D3CBD; --seq-4: #642B9E; --seq-5: #4B2175; --seq-6: #371C52; --div-1: #642B9E; --div-2: #7D3CBD; --div-3: #9656D6; --div-4: #AE74E8; --div-5: #C79BF2; --div-6: #DABCF7; --div-7: #EAD9FA; --div-8: #F5F0FA; --div-9: #D7FAF8; --div-10: #83F2EB; --div-11: #43DED3; --div-12: #21C2B7; --div-13: #0EA197; --div-14: #08827A; --div-15: #086962; --div-16: #09524D; --qual-1: #7D3CBD; --qual-2: #229AD6; --qual-3: #086962; --qual-4: #B01355; --qual-5: var(--red-50); --qual-6: var(--red-90); --qual-7: #038537; --qual-8: #114599; --qual-9: #ED5393; --qual-10: #CF7911; --containerRoot: var(--neutral-10); --container: var(--neutral-20); --containerNested: var(--neutral-30); --input: var(--white); --input--disabled: var(--neutral-40); --icon: var(--neutral-70); --icon--hover: var(--neutral-60); --icon--disabled: var(--neutral-40); --icon--selected: var(--neutral-10); --label: var(--neutral-90); --label--disabled: var(--neutral-60); --border: var(--neutral-50); --border--disabled: var(--neutral-50); --containerBorder: 1px solid var(--border); --boxShadow1: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); --boxShadow2: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23); --boxShadow3: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); --boxShadow4: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22); --boxShadow5: 0 19px 38px rgba(0, 0, 0, 0.30), 0 15px 12px rgba(0, 0, 0, 0.22); --boxShadow--inset: inset 0 0 4px 2px rgba(34, 34, 34, 0.4); --callToAction: #0C7BB3; --callToActionHighlight: #E8F4FA; --callToAction--hover: #229AD6; --callToAction--active: #066391; --callToAction--activeAlt: #BBE5FA; --callToAction--activeAltInvis: #0B7BB2; --callToAction--disabled: var(--neutral-50); --error: var(--red-60); --info: #3272D9; --infoSecondary: #ACCBFC; --warning: #AD5F00; --warningSecondary: #F5BC76; --success: #038537; --borderRadius: 4px; --borderRadiusInput: 2px; --opacity-25: rgba(0, 0, 0, 0.25); --opacity-50: rgba(0, 0, 0, 0.50); --opacity-85: rgba(0, 0, 0, 0.85); --font-NotoSans: 'Noto Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif; --indicator: #1EC963; --indicatorOff: #0A2E18; --checkbox--checked: var(--callToAction); --checkbox--unchecked: var(--border); --checkbox--indeterminate: var(--callToAction); --checkbox--disabled: var(--input--disabled); --progressLinearTrack--determinate: var(--neutral-10); --progressLinearTrack--indeterminate: var(--neutral-10); --progressLinearBar--determinate: var(--infoSecondary); --progressLinearBar--indeterminate: var(--border); --toggleSwitch--selected: var(--callToAction); --toggleSwitch--unselected: var(--neutral-10); --radio--selected: var(--callToAction); --radio--unselected: var(--border); --radio--disabled: var(--input--disabled); --pipePrimaryFill: var(--neutral-20); --pipeSecondaryFill: #cccccc; --pipeStroke: var(--neutral-70); --pipeSelectStroke: var(--callToAction); --contextBackground: var(--white); --symbolFill--default: var(--neutral-20); --symbolFillAnimation--default: var(--neutral-50); --symbolStroke--default: var(--neutral-70); --symbolFill--running: var(--white); --symbolFillAnimation--running: var(--neutral-50); --symbolStroke--running: var(--neutral-70); --symbolFill--stopped: var(--neutral-40); --symbolStroke--stopped: var(--neutral-70); --symbolFill--faulted: #FAB6B6; --symbolStroke--faulted: #B80D0D; } @font-face { font-family: "Noto Sans"; font-style: normal; font-weight: 400; src: local('Noto Sans'), local('NotoSans'), url('/data/perspective/fonts/noto-sans-v8-latin-regular.ttf') format('truetype'); } @font-face { font-family: "Noto Sans"; font-style: normal; font-weight: 500; src: local('Noto Sans Medium'), local('NotoSans-Medium'), url('/data/perspective/fonts/noto-sans-v8-latin-medium.ttf') format('truetype'); } @font-face { font-family: "Noto Sans"; font-style: normal; font-weight: 700; src: local('Noto Sans Bold'), local('NotoSans-Bold'), url('/data/perspective/fonts/noto-sans-v8-latin-700.ttf') format('truetype'); } @font-face { font-family: "Roboto"; src: url("/data/perspective/fonts/Roboto-Regular.woff"); } @font-face { font-family: "Roboto"; font-weight: 500; src: url("/data/perspective/fonts/Roboto-Medium.woff"); } @font-face { font-family: "Roboto"; font-weight: 300; src: url("/data/perspective/fonts/Roboto-Light.woff"); } @font-face { font-family: "Roboto"; font-weight: 700; src: url("/data/perspective/fonts/Roboto-Bold.woff"); } @font-face { font-family: "Roboto-italic"; font-style: italic; src: url("/data/perspective/fonts/Roboto-Italic.woff"); } @font-face { font-family: "Roboto-mono"; src: url("/data/perspective/fonts/RobotoMono-Regular.woff"); } @font-face { font-family: "Roboto-condensed"; src: url("/data/perspective/fonts/RobotoCondensed-Regular.woff"); } body { font-family: var(--font-NotoSans); font-weight: 400; font-size: 1rem; color: var(--label); background-color: var(--containerRoot); font-size: 100%; } input, textarea, keygen, select, button { font-family: var(--font-NotoSans); font-weight: 400; } :focus { outline: 1px solid var(--callToAction--hover); } ::selection { background: var(--callToActionHighlight); color: var(--label); } .ia_dockedView__handle { color: var(--neutral-10); background-color: var(--neutral-90); } .ia_popup { background-color: var(--container); box-shadow: var(--boxShadow5); border: var(--containerBorder); } .ia_popup__header { background-color: var(--containerNested); color: var(--neutral-90); border-bottom: var(--containerBorder); font-size: 0.875rem; } .ia_qualityOverlay { border-width: 1.5px; } .ia_qualityOverlay--error { border-color: var(--error); border-style: solid; border-bottom: none; } .ia_qualityOverlay--error.micro { border-bottom: 1.5px solid var(--error); } .ia_qualityOverlay--unknown { border-color: var(--neutral-100); border-style: dotted; border-bottom: none; } .ia_qualityOverlay--unknown.micro { border-bottom: 1.5px dotted var(--neutral-100); } .ia_qualityOverlay--pending { border-color: var(--indicator); border-style: dashed; border-bottom: none; } .ia_qualityOverlay--pending.micro { border-bottom: 1.5px dashed var(--indicator); } .ia_qualityOverlay__footer { color: var(--neutral-10); } .ia_qualityOverlay__footer--error { background-color: var(--error); } .ia_qualityOverlay__footer--unknown { background-color: var(--neutral-100); color: var(--neutral-10); } .ia_qualityOverlay__footer--pending { background-color: var(--indicator); } .ia_qualityOverlay__icon__outline { fill: var(--containerRoot); } .ia_qualityOverlay__icon--error { color: var(--neutral-10); fill: var(--error); } .ia_qualityOverlay__icon--pending { color: var(--neutral-10); fill: var(--indicator); } .ia_qualityOverlay__icon--unknown { color: var(--neutral-10); fill: var(--neutral-100); } .ia_qualityOverlay__icon--micro--error, .ia_qualityOverlay__icon--micro--pending, .ia_qualityOverlay__icon--micro--unknown { border: white solid 1px; } .ia_qualityOverlay__icon--micro--error { background-color: var(--error); } .ia_qualityOverlay__icon--micro--pending { background-color: var(--indicator); } .ia_qualityOverlay__icon--micro--unknown { background-color: var(--neutral-100); } .ia_alarmTableComponent__toolbar { background-color: var(--containerNested); border-bottom: var(--containerBorder); } .ia_alarmTableComponent__toolbar__tab { color: var(--neutral-50); font-weight: 400; font-size: 0.875rem; line-height: 1.125rem; border-bottom: 3px solid transparent; } .ia_alarmTableComponent__toolbar__tab:hover:not(.ia_alarmTableComponent__toolbar__tab--active), .ia_alarmTableComponent__toolbar__tab:hover:not(.ia_alarmTableComponent__toolbar__tab--active) .ia_alarmTableComponent__toolbar__tab__icon { color: var(--neutral-60); } .ia_alarmTableComponent__toolbar__tab--active { color: var(--neutral-90); font-weight: 500; border-bottom: 3px solid var(--neutral-50); } .ia_alarmTableComponent__toolbar__tab__icon { color: var(--neutral-50); } .ia_alarmTableComponent__toolbar__controlIcon, .ia_alarmTableComponent__toolbar__tab__icon--active { color: var(--neutral-70); } .ia_alarmTableComponent__toolbar__controlIcon--active { color: var(--callToAction); } .ia_alarmTableComponent__toolbar__filter__preFilterButton { outline: none; border-top-right-radius: 0; border-bottom-right-radius: 0; } .ia_alarmTableComponent__toolbar__filter__preFilterButton--active { background-color: var(--callToActionHighlight); } .ia_alarmTableComponent__toolbar__activeFilterInput { background-color: var(--input); border-left: none; height: 2rem; outline: none; } .ia_alarmTableComponent__toolbar__filterResults { font-size: 0.75rem; background-color: var(--container); border-top: 1px solid var(--border); } .ia_alarmTableComponent__toolbar__preFilterCount { font-size: 0.625rem; color: var(--neutral-90); background-color: var(--containerNested); } .ia_alarmTableComponent__toolbar__preFilter__removeAll { border-left: var(--containerBorder); background-color: var(--containerNested); } .ia_alarmTableComponent__toolbar__filter__preFilterContainer { background-color: var(--container); border-top: var(--containerBorder); } .ia_alarmTableComponent__preFilterPill { border: var(--containerBorder); background-color: var(--neutral-20); } .ia_alarmTableComponent__preFilterPill__title { color: var(--neutral-90); font-size: 0.75rem; line-height: 0.875rem; } .ia_alarmTableComponent__preFilters__filter__pager { background-color: var(--neutral-50); color: var(--white); border-left: var(--containerBorder); } .ia_alarmTableComponent__preFilters__filter__pager:hover { background-color: var(--neutral-40); } .ia_alarmTableComponent__preFilters__filter__pager:active { background-color: var(--neutral-60); } .ia_alarmTableComponent__preFilters__filter__pager--disabled { background-color: var(--neutral-60); box-shadow: none; } .ia_alarmTableComponent__preFilters__filter__pager--left { box-shadow: 5px 0px 10px 0px rgba(0, 0, 0, 0.2); border-left: var(--containerBorder); } .ia_alarmTableComponent__preFilters__filter__pager--right { box-shadow: -5px 0px 10px 0px rgba(0, 0, 0, 0.2); } .ia_alarmTableComponent__filter__searchPlaceholder, .ia_alarmTableComponent__filter__closeToggle { background-color: var(--input); border: var(--containerBorder); } .ia_alarmTableComponent__modalMenuHeader { font-size: 0.875rem; font-weight: 500; color: var(--neutral-90); background-color: var(--containerNested); } .ia_alarmTableComponent__modalMenuTitle { font-size: 0.75rem; border-bottom: var(--containerBorder); color: var(--neutral-90); } .ia_alarmTableComponent__modalMenuItem { color: var(--neutral-90); line-height: 2rem; font-size: 0.875rem; } .ia_alarmTableComponent__modalMenuItem:hover { color: var(--neutral-90); background-color: var(--callToActionHighlight); } .ia_alarmTableComponent__modalMenuCategory { background-color: var(--container); font-weight: 500; font-size: 0.75rem; color: var(--neutral-60); border-top: var(--containerBorder); border-bottom: var(--containerBorder); } .ia_alarmTableComponent__body__row { color: var(--neutral-90); border-bottom: var(--containerBorder); } .ia_alarmTableComponent__foot { border: 0px solid var(--border); background-color: var(--containerNested); color: var(--neutral-90); } .ia_alarmTableComponent__foot--show { border: var(--containerBorder); } .ia_alarmTableComponent__alarmDetails__titleBar { background-color: var(--neutral-30); font-size: 0.875rem; line-height: 1rem; color: var(--neutral-90); box-shadow: 0px 13px 15px -1px rgba(0, 0, 0, 0.15); border-bottom: var(--containerBorder); } .ia_alarmTableComponent__alarmDetails__category { background-color: var(--neutral-10); } .ia_alarmTableComponent__alarmDetails__category__item { color: var(--neutral-90); font-size: 0.875rem; line-height: 1rem; border-top: var(--containerBorder); } .ia_alarmTableComponent__alarmDetails__category__item__label { border-right: var(--containerBorder); } .ia_alarmTableComponent__alarmDetails__category__titleBar { background-color: var(--neutral-10); border-top: var(--containerBorder); color: var(--neutral-90); font-weight: 600; font-size: 0.75rem; line-height: 0.875rem; } .ia_alarmTableComponent__alarmDetails__notesContainer { background-color: var(--neutral-10); } .ia_alarmTableComponent__alarmNotesModal__titleBar { background-color: var(--neutral-30); box-shadow: 0px 13px 15px -1px rgba(0, 0, 0, 0.15); font-size: 0.875rem; line-height: 1rem; color: var(--neutral-90); } .ia_alarmPropertiesTable { border-bottom: var(--containerBorder); background-color: var(--container); } .ia_alarmPropertiesTable__category__titleBar { border-top: var(--containerBorder); background-color: var(--neutral-10); color: var(--border); font-weight: 600; font-size: 0.75rem; line-height: 0.875em; } .ia_alarmPropertiesTable__categoryTable__row { color: var(--neutral-90); border-top: var(--containerBorder); font-size: 0.75rem; line-height: 0.875em; } .ia_alarmPropertiesTable__categoryTable__row__label { border-right: var(--containerBorder); } .ia_button--primary, .ia_button--secondary { font-size: 0.875rem; font-weight: 700; border-radius: var(--borderRadius); -webkit-border-radius: var(--borderRadius); cursor: pointer; -webkit-transition-duration: 0.1s; transition-duration: 0.1s; transition-property: box-shadow, background-color; } .ia_button--primary:enabled:hover, .ia_button--secondary:enabled:hover { box-shadow: var(--boxShadow2); } .ia_button--primary { background-color: var(--callToAction); border: var(--containerBorder); color: var(--neutral-10); } .ia_button--primary svg, .ia_button--secondary svg { fill: currentColor; } .ia_button--primary:enabled:active { box-shadow: var(--boxShadow--inset); border: none; } .ia_button--primary--disabled { background-color: var(--callToAction--disabled); border: var(--border--disabled); color: var(--neutral-30); cursor: not-allowed; } .ia_button--secondary { background-color: var(--neutral-10); border: var(--containerBorder); color: var(--neutral-90); } .ia_button--secondary:enabled:active { box-shadow: var(--boxShadow--inset); } .ia_button--secondary--disabled { background-color: var(--border--disabled); border: 1px solid var(--border--disabled); color: var(--neutral-30); cursor: not-allowed; } .ia_checkbox__checkedIcon, .ia_checkbox__uncheckedIcon, .ia_checkbox__indeterminateIcon { transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; } .ia_checkbox__icon--useColor { fill: currentColor; } .ia_checkbox .ia_checkbox__checkedIcon, .ia_checkbox .ia_checkbox__indeterminateIcon { color: var(--checkbox--checked); } .ia_checkbox .ia_checkbox__uncheckedIcon { color: var(--checkbox--unchecked); } .ia_checkbox .ia_checkbox__checkedIcon--disabled, .ia_checkbox .ia_checkbox__uncheckedIcon--disabled, .ia_checkbox .ia_checkbox__indeterminateIcon--disabled { color: var(--checkbox--disabled); } .ia_checkbox:hover input:enabled~.ia_checkbox__checkedIcon, .ia_checkbox:hover input:enabled~.ia_checkbox__indeterminateIcon { filter: brightness(1.2); } .ia_checkbox:hover input:enabled~.ia_checkbox__uncheckedIcon { filter: brightness(0.5); } .ia_checkbox input:enabled:active~.ia_checkbox__checkedIcon, .ia_checkbox input:enabled:active~.ia_checkbox__uncheckedIcon, .ia_checkbox input:enabled:active~.ia_checkbox__indeterminateIcon { filter: brightness(0.7); } .ia_componentModal { color: var(--containerRoot); background-color: var(--containerRoot); border: var(--containerBorder); } .ia_componentModal--fullViewOverlay { background-color: var(--opacity-85); } .ia_container--root { background-color: var(--containerRoot); } .ia_container--secondary { background-color: var(--container); } .ia_contextMenu { background: var(--container); color: var(--neutral-90); } .ia_dateRangePicker { color: var(--label); } .ia_dateRangePicker--disabled { color: var(--label--disabled); } .ia_dateRangePicker__calendarBar__dayOfWeekTile { color: var(--neutral-90); font-size: 0.875rem; line-height: 1rem; font-weight: 500; } .ia_dateRangePicker__calendar__dayTile { font-size: 0.875rem; line-height: 1rem; color: inherit; border: 2px solid transparent; } .ia_dateRangePicker__calendar__dayTile--fillerTile { color: var(--neutral-40); } .ia_dateRangePicker__calendar__dayTile--node { border: 2px solid var(--callToAction); font-weight: 500; border-radius: var(--borderRadius); } .ia_dateRangePicker__calendar__dayTile--node--disabled { border-color: var(--callToAction--disabled); } .ia_dateRangePicker__calendar__dayTile--rangeNode { background-color: var(--callToAction); color: var(--neutral-90); font-weight: 500; border-radius: var(--borderRadius); } .ia_dateRangePicker__calendar__dayTile--range { background-color: var(--callToActionHighlight); border-radius: 0; } .ia_dateRangePicker__calendar__dayTile--outOfRange { color: var(--neutral-40); } .ia_dateRangePicker__calendar__dayTile:hover:not(.ia_dateRangePicker__calendar__dayTile--fillerTile):not(.ia_dateRangePicker__calendar__dayTile--node):not(.ia_dateRangePicker__calendar__dayTile--rangeNode):not(.ia_dateRangePicker__calendar__dayTile--outOfRange):not(.hasTouch) { background-color: rgba(71, 169, 229, 0.3); } .ia_dateRangePicker__pagerArrow--disabled { color: var(--label--disabled); } .ia_dateRangeTimePicker { color: var(--neutral-90); } .ia_dateRangeTimePicker__rangeInfo { line-height: 1.125rem; font-size: 0.875rem; } .ia_dateRangeTimePicker__clearRange { color: var(--callToAction); font-weight: 500; font-size: 0.75rem; text-decoration: underline; } .ia_dateRangeTimePicker__clearRange--disabled { color: var(--label--disabled); } .ia_dateRangeTimePicker__timeInfo { font-weight: 500; line-height: 1.125rem; font-size: 0.875rem; } .ia_dataTypeFilter { color: var(--label); } .ia_dataTypeFilter__actionsContainer__removeAction { color: var(--callToAction); } .ia_dropdown { background-color: var(--input); border: var(--containerBorder); border-radius: var(--borderRadiusInput); color: var(--neutral-80); font-size: 0.875rem; fill: var(--icon); } .ia_dropdown__placeholder { color: var(--label--disabled); } .ia_dropdown__valuePill { border-radius: var(--borderRadius); background-color: var(--containerNested); overflow: hidden; } .ia_dropdown__removeValueIcon { fill: currentColor; } .ia_dropdown__removeValue--focused, .ia_dropdown__removeValue:hover { background-color: var(--red-30); } .ia_dropdown__removeValue:hover > svg { fill: var(--red-60); } .ia_dropdown__search { color: inherit; font-size: 0.875rem; } .ia_dropdown--active, .ia_dropdown--focused { outline: 1px solid var(--callToAction--hover); } .ia_dropdown--disabled { color: var(--label--disabled); background-color: var(--input--disabled); cursor: not-allowed; fill: var(--label--disabled); } .ia_dropdown--disabled:focus, .ia_dropdown__search:focus { outline: none; } .ia_dropdown--error:not(.ia_dropdown--disabled) { color: var(--error); } .ia_dropdown__optionsModal { background-color: var(--input); border-radius: var(--borderRadiusInput); font-size: 0.875rem; } .ia_dropdown__option { color: var(--label); } .ia_dropdown__option--focused:not(.ia_dropdown__option--selected), .ia_dropdown__option--focused:not(.ia_dropdown__option--disabled) { background-color: var(--callToAction--activeAlt); color: var(--label); } .ia_dropdown__option.ia_dropdown__option--selected { background-color: var(--callToAction--hover); } .ia_dropdown__option.ia_dropdown__option--disabled { color: var(--label--disabled); cursor: not-allowed; } .ia_dropdown__option__noResults { color: var(--input--disabled); pointer-events: none; } .ia_dropdown__clearValueIcon:hover { fill: var(--icon--disabled); } .ia_inputField { font-size: 0.875rem; color: var(--neutral-90); border: var(--containerBorder); background-color: var(--input); padding: 0px 0.5rem; border-radius: var(--borderRadiusInput); } .ia_inputField::placeholder { color: var(--neutral-50); } .ia_inputField:disabled { color: var(--label--disabled); border: 1px solid var(--border--disabled); background-color: var(--input--disabled); cursor: not-allowed; } .ia_pager { background-color: var(--neutral-30); color: var(--neutral-90); box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.1); line-height: 0.875rem; font-size: 0.75rem; } .ia_pager__jumpFirstLast { line-height: 0.875rem; font-size: 1rem; color: var(--neutral-90); } .ia_pager__jumpFirstLast--disabled { color: var(--label--disabled); } .ia_pager__prevNext { color: var(--neutral-90); } .ia_pager__prevNext--disabled { color: var(--neutral-70); } .ia_pager__page { border-radius: 50%; width: 1.25rem; height: 1.25rem; color: var(--neutral-90); } .ia_pager__page--active { background: var(--callToAction); color: var(--neutral-10); } .ia_pager__jump { width: 3.125rem; text-align: center; border-radius: var(--borderRadius); } .ia_pager__jump:focus { outline: none; } .ia_progressBar__track { border: var(--containerBorder); border-radius: 24px; } .ia_progressBar__track--determinate { background-color: var(--progressLinearTrack--determinate); } .ia_progressBar__track--indeterminate { background-color: var(--progressLinearTrack--indeterminate); } .ia_progressBar__bar { background-color: var(--progressLinearBar--determinate); transition: transform 0.2s linear; } .ia_progressBar__bar--determinate { transition: transform 0.2s linear; } .ia_progressBar__bar--indeterminate { animation: ia_progressBar_bar--indeterminateAnimation 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite; animation-name: ia_progressBar_bar--indeterminateAnimation; } .ia_progressBar__displayValue { color: var(--neutral-90); } @keyframes ia_progressBar_bar--indeterminateAnimation { 0% { left: -35%; right: 100%; } 100% { left: 100%; right: -90%; } } .ia_radio__selectedIcon, .ia_radio__unselectedIcon { transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; height: 21.65px; width: 21.65px; } .ia_radio__icon--useColor { fill: currentColor; } .ia_radio .ia_radio__selectedIcon { color: var(--radio--selected); } .ia_radio .ia_radio__unselectedIcon { color: var(--radio--unselected); } .ia_radio .ia_radio__unselectedIcon--disabled, .ia_radio .ia_radio__selectedIcon--disabled { color: var(--radio--disabled); } .ia_radio:hover input:enabled~.ia_radio__selectedIcon { filter: brightness(1.2); } .ia_radio:hover input:enabled~.ia_radio__unselectedIcon { filter: brightness(0.5); } .ia_radio input:enabled:active~.ia_radio__selectedIcon, .ia_radio input:enabled:active~.ia_radio__unselectedIcon { filter: brightness(0.7); } .ia_realtimeOrHistoricalRange { background-color: var(--containerRoot); } .ia_realtimeOrHistoricalRangeSelector__calendarIcon { color: var(--neutral-70); } .ia_realtimeOrHistoricalRangeSelector__calendarIcon--active { color: var(--callToAction); } .ia_realtimeOrHistoricalRangeSelector__message { color: var(--neutral-90); font-size: 0.675rem; font-weight: 700; } .ia_realtimeOrHistoricalRangeSelector__modal { background-color: var(--container); } .ia_realtimeOrHistoricalRangeSelector__modal__header { color: var(--neutral-80); background-color: var(--containerNested); border-bottom: var(--containerBorder); font-weight: 500; } .ia_realtimeOrHistoricalRange__tabContainer__tab { font-size: 0.875rem; line-height: 1.125rem; font-weight: 400; border-bottom: 3px solid transparent; color: var(--neutral-60); background-color: var(--container); } .ia_realtimeOrHistoricalRange__tabContainer__tab:hover:not(.ia_realtimeOrHistoricalRange__tabContainer__tab--active) { color: var(--neutral-70); } .ia_realtimeOrHistoricalRange__tabContainer__tab--active { color: var(--neutral-90); font-weight: 500; border-bottom: 3px solid var(--callToAction); } .ia_realtimeOrHistoricalRange__footer { border-top: var(--containerBorder); background-color: var(--container); } .ia_realtimeOrHistoricalRange__realtimeContent { color: var(--neutral-90); font-size: 0.875rem; } .ia_select { border-radius: var(--borderRadius); border: var(--containerBorder); background-color: var(--input); font-size: 0.875rem; color: var(--label); cursor: pointer; } .ia_select--disabled { background-color: var(--input--disabled); border: 1px solid var(--border--disabled); color: var(--label--disabled); cursor: not-allowed; } .ia_select__select { background-color: var(--input); font-size: inherit; color: inherit; } .ia_select__select:disabled { background-color: var(--input--disabled); } .ia_slider { border-radius: 6px; } .ia_slider__rail { background-color: var(--neutral-40); } .ia_slider__track { border-radius: var(--borderRadius); background-color: var(--callToAction); } .ia_slider__track--disabled { background-color: var(--border--disabled); } .ia_slider__step__dot { border: 2px solid var(--border); background-color: var(--container); border-radius: 50%; } .ia_slider__step__dot--active { border-color: var(--callToAction); } .ia_slider__handle { border-radius: 50%; border: solid 1px var(--border); background-color: var(--container); } .ia_slider__handle:hover { background-color: var(--containerRoot); border-color: var(--callToAction); } .ia_slider__handle:active { border-color: var(--callToAction); background-color: var(--callToActionHighlight); box-shadow: 0 0 5px rgba(78, 188, 252, 0.2); } .ia_slider__handle:focus { border-color: var(--callToAction--active); box-shadow: 0 0 0 5px rgba(78, 188, 252, 0.5); } .ia_slider__handle--disabled { border-color: var(--border--disabled); background-color: var(--border--disabled); } .ia_slider__mark__text { color: var(--neutral-60); } .ia_slider__mark__text--active { color: var(--neutral-90); } .ia_slider__mark__text--disabled { color: var(--label--disabled); } .ia_table { color: var(--neutral-90); } .ia_table__headContainer, .ia_table__footContainer { background-color: var(--container); box-shadow: 0 2px 15px 0 rgba(0, 0, 0, 0.3); } .ia_table__foot, .ia_table__head { font-weight: 500; font-size: 0.875rem; } .ia_table__head__header__sort { color: var(--neutral-50); } .ia_table__head__header__sort--active { color: var(--callToAction--active); } .ia_table__head__header__filter { color: var(--neutral-70); } .ia_table__head__header__filter--active { color: var(--callToAction--active); } .ia_table__body { background-color: var(--container); font-size: 0.875rem; } .ia_table__body__row--even { background-color: var(--neutral-10); } .ia_table__body__row--odd { background-color: var(--neutral-20); } .ia_table__body__emptyMessage { color: var(--neutral-60); } .ia_table__resizeGuide { background-color: var(--callToAction); opacity: 0.5; } .ia_table__activeColumnOverlay { background-color: currentColor; opacity: 0.4; } .ia_table__draggingColumnPlaceholderOverlay { background-color: currentColor; opacity: 0.2; } .ia_table__positionGuide { background-color: currentColor; opacity: 0.6; } .ia_tagBrowser__noResultsDisplay, .ia_tagBrowser__loadingDisplay { background: var(--neutral-10); border: 1px solid var(--border); } .ia_tagBrowser__noResultsDisplay__message { color: var(--input--disabled); } .ia_textArea { font-size: 0.875rem; color: var(--neutral-90); border: var(--containerBorder); background-color: var(--input); padding: 0.5rem; } .ia_textArea::placeholder { color: var(--neutral-50); } .ia_textArea:disabled { color: var(--label--disabled); border: 1px solid var(--border--disabled); background-color: var(--input--disabled); cursor: not-allowed; } .ia_timeInput__separator { background-color: var(--input); border-top: var(--containerBorder); border-bottom: var(--containerBorder); } .ia_timeInput__separator--disabled { color: var(--label--disabled); background-color: var(--input--disabled); } .ia_timeInput--buttonMode { color: var(--label); } .ia_timeInput--buttonMode--disabled { color: var(--label--disabled); } .ia_toggleSwitch__track { background-color: var(--toggleSwitch--unselected); filter: invert(25%); border-radius: 8px; transition: opacity 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; } .ia_toggleSwitch__track--selected { background-color: var(--toggleSwitch--selected); opacity: 0.25; filter: none; } .ia_toggleSwitch__track--disabled { background-color: var(--input--disabled) !important; opacity: 0.5; } .ia_toggleSwitch__thumb { border-radius: 50%; background-color: var(--toggleSwitch--unselected); border: var(--containerBorder); box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 2px 1px -1px rgba(0, 0, 0, 0.12); transition: left 200ms cubic-bezier(0.4, 0, 0.2, 1), left 150ms cubic-bezier(0.4, 0, 0.2, 1); } .ia_toggleSwitch__thumb--selected { background-color: var(--toggleSwitch--selected); border: none; } .ia_toggleSwitch__thumb:hover { border: 1px solid var(--callToAction); } .ia_toggleSwitch__thumb--selected:hover { filter: brightness(1.2); } .ia_toggleSwitch__thumb--disabled { background-color: var(--input--disabled) !important; border: none; } .ia_toggleSwitch__thumb--disabled:hover { filter: none; border: none; } .ia_viewStateDisplay { border: dashed 1px var(--border--disabled); } .ia_viewStateDisplay__icon { color: var(--neutral-70); } .ia_viewStateDisplay__primaryMessage { color: var(--neutral-90); } .ia_viewStateDisplay__secondaryMessage { color: var(--neutral-70); } .ia_designing__container__addChild { color: var(--neutral-70); } .ia_accordionComponent { border: var(--containerBorder); background-color: var(--container); } .ia_accordionComponent--disabled { color: var(--label--disabled); background-color: var(--input--disabled); cursor: not-allowed; } .ia_accordionComponent__body { border-bottom: var(--containerBorder); } .ia_accordionComponent__header { background-color: var(--container); cursor: pointer; } .ia_accordionComponent__header:hover { filter: brightness(0.9); } .ia_accordionComponent__header__text { font-size: 14px; } .ia_accordionComponent__header__text--expanded { font-weight: 500; } .ia_accordionComponent__emptyRow { background-color: var(--containerNested); }.ia_alarmJournalTableComponent { border: var(--containerBorder); } .ia_alarmJournalTableComponent__selection { background-color: rgba(12, 123, 179, 0.2); } .ia_alarmJournalTableComponent__alarmDetails__tabContainer { background-color: var(--neutral-30); color: var(--neutral-70); font-size: 0.875rem; } .ia_alarmJournalTableComponent__alarmDetails__tabContainer__tab__propertiesTab { border-bottom: var(--containerBorder); } .ia_alarmJournalTableComponent__alarmDetails__tabContainer__tab__notesTab { border-left: var(--containerBorder); border-right: var(--containerBorder); } .ia_alarmJournalTableComponent__alarmDetails__tabContainer__tab--active { background-color: var(--neutral-10); font-weight: 700; border-bottom: none; color: var(--neutral-90); } .ia_alarmJournalTableComponent__alarmDetails__tabContainer__remainingSpace { border-bottom: var(--containerBorder); } .ia_alarmStatusTableComponent { border: var(--containerBorder); } .ia_alarmStatusTableComponent__selection { background-color: rgba(12, 123, 179, 0.2); } .ia_alarmStatusTableComponent__foot__message { color: var(--neutral-90); line-height: 1rem; font-weight: 400; font-size: 0.875rem; } .ia_alarmStatusTableComponent__foot__message--success { color: var(--success); } .ia_alarmStatusTableComponent__foot__message--error { color: var(--error); } .ia_alarmStatusTableComponent__alarmNotesRequiredModal__foot { background-color: var(--neutral-30); border: var(--containerBorder); } .ia_checkboxComponent { color: var(--neutral-90); } .ia_checkboxComponent--disabled { color: var(--label--disabled); } .ia_columnContainerComponent--designing__columnGuide { background-color: var(--containerNested); } .ia_columnContainerComponent--designing__row { outline: dashed var(--border) 1px; } .ia_componentContextMenu { border-color: var(--border); background-color: var(--contextBackground); color: var(--label); } .ia_componentContextMenu__item:hover, .ia_componentContextMenu__submenu--active { background-color: var(--callToActionHighlight); } .ia_componentContextMenu__icon { fill: var(--icon); } .ia_cylindricalTankComponent__tank { stroke: var(--border); fill: var(--containerRoot); stroke-width: 2px; } .ia_cylindricalTankComponent__tank--warning { fill: var(--error); fill-opacity: 0.2; } .ia_cylindricalTankComponent__liquid { fill: var(--info); fill-opacity: 0.7; stroke: var(--border); stroke-width: 2px; } .ia_cylindricalTankComponent__liquid--warning { fill: var(--error); } .ia_cylindricalTankComponent__valueDisplay { font-size: 2rem; font-weight: 500; } .ia_grid__cell { background-color: var(--container); } .ia_dashboardComponent { background-color: var(--containerRoot); border: var(--containerBorder); } .ia_dashboardComponent__control { background-color: var(--opacity-25); color: var(--neutral-20); } .ia_dashboardComponent__control:hover { background-color: var(--opacity-50); color: var(--neutral-10); } .ia_dashboardComponent__cell__addWidget { color: var(--callToAction); } .ia_dashboardComponent__cell__addWidget:hover { color: var(--callToAction--hover); } .ia_dashboardComponent__addWidgetOverlay { background-color: var(--neutral-90); opacity: 0.2; } .ia_dashboardComponent__cell { background-color: var(--containerNested); } .ia_dashboardComponent__cell--active { background-color: var(--neutral-40); } .ia_dashboardComponent__movingWidgetPlaceholder { border: 2px dashed var(--border); border-radius: var(--borderRadius); } .ia_dashboardComponent__widget { border: var(--containerBorder); border-radius: var(--borderRadius); } .ia_dashboardComponent__widget--editing { border: 2px dashed var(--callToAction); } .ia_dashboardComponent__widget--configuring { border: 2px dashed var(--warning); } .ia_dashboardComponent__widget--moving { box-shadow: var(--boxShadow5); } .ia_dashboardComponent__widget__resizeHandle__handle { border-radius: 50%; border: 2px solid var(--callToAction); background-color: var(--neutral-10); } .ia_dashboardComponent__widget__resizeHandle__handle--configuring { border: 2px solid var(--warning); } .ia_dashboardComponent__widget__controlBar { color: var(--icon); } .ia_dashboardComponent__widget__controlBar__control--active { color: var(--warning); } .ia_dashboardComponent__widget__controlBar__control:hover { color: var(--icon--hover); } .ia_dashboardComponent__widget__head { background-color: var(--containerNested); border-bottom: var(--containerBorder); font-size: 0.875rem; } .ia_dashboardComponent__widget__head__title { text-align: left; padding: 0px 0.625rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .ia_dashboardComponent__widget__body { background-color: var(--container); } .ia_dashboardComponent__addWidgetModal__head, .ia_dashboardComponent__removeWidgetModal__head { font-size: 1.125rem; font-weight: 400; line-height: 0.875rem; background-color: var(--neutral-30); border-bottom: var(--containerBorder); color: var(--neutral-90); } .ia_dashboardComponent__addWidgetModal__searchContainer { background-color: var(--neutral-10); border-bottom: var(--containerBorder); } .ia_dashboardComponent__addWidgetModal__menu__category__titleBar { background-color: var(--neutral-30); border-bottom: var(--containerBorder); color: var(--neutral-90); font-size: 0.75rem; } .ia_dashboardComponent__addWidgetModal__body, .ia_dashboardComponent__removeWidgetModal__body { background-color: var(--neutral-10); color: var(--neutral-90); font-size: 0.875rem; line-height: 0.875rem; font-weight: 400; } .ia_dashboardComponent__addWidgetModal__menu__category__item { color: var(--neutral-90); border-bottom: var(--containerBorder); font-size: 0.875rem; line-height: 1rem; font-weight: 400; } .ia_dashboardComponent__addWidgetModal__menu__category__item:hover:not(.ia_dashboardComponent__addWidgetModal__menu__category__item--selected) { background-color: var(--callToActionHighlight); } .ia_dashboardComponent__addWidgetModal__menu__category__item--selected { background-color: var(--callToAction--active); color: var(--neutral-10); } .ia_dashboardComponent__addWidgetModal__foot { background-color: var(--neutral-30); border-top: var(--containerBorder); } .ia_dateTimePickerComponent { border: var(--containerBorder); } .ia_dateTimePickerComponent--disabled { color: var(--label--disabled); border-color: var(--border--disabled); background-color: var(--input--disabled); } .ia_dateTimeInputComponent { color: var(--label); } .ia_dateTimeInputComponent--disabled { color: var(--label--disabled); } .ia_equipmentScheduleComponent { border: var(--containerBorder); font-size: 0.75rem; color: var(--neutral-90); } .ia_equipmentScheduleComponent__actionBar, .ia_equipmentScheduleComponent__spacer, .ia_equipmentScheduleComponent__groupingCell__backdrop, .ia_equipmentScheduleComponent__headerCell__backdrop, .ia_equipmentScheduleComponent__itemList, .ia_equipmentScheduleComponent__itemList__item, .ia_equipmentScheduleComponent__groupingHeader { background: var(--neutral-30); } .ia_equipmentScheduleComponent__actionBar, .ia_equipmentScheduleComponent__spacer, .ia_equipmentScheduleComponent__headerCell, .ia_equipmentScheduleComponent__groupingCell, .ia_equipmentScheduleComponent__itemList__item, .ia_equipmentScheduleComponent__itemList__item, .ia_equipmentScheduleComponent__gridSpace__gridCell, .ia_equipmentScheduleComponent__gridSpace__gridCell--hover { border-bottom: var(--containerBorder); } .ia_equipmentScheduleComponent__spacer, .ia_equipmentScheduleComponent__groupingCell, .ia_equipmentScheduleComponent__headerCell, .ia_equipmentScheduleComponent__itemList, .ia_equipmentScheduleComponent__gridSpace__gridCell, .ia_equipmentScheduleComponent__gridSpace__gridCell--hover { border-right: var(--containerBorder); } .ia_equipmentScheduleComponent__gridSpace__gridCell { background: var(--container); } .ia_equipmentScheduleComponent__gridSpace__gridCell--hover { background: var(--neutral-30); } .ia_equipmentScheduleComponent__actionBar, .ia_equipmentScheduleComponent__groupingCell, .ia_equipmentScheduleComponent__itemList__item { font-weight: 700; } .ia_equipmentScheduleComponent__headerCell:hover, .ia_equipmentScheduleComponent__actionButton { background: var(--neutral-10); } .ia_equipmentScheduleComponent__actionButton { border: var(--neutral-50); border-radius: var(--borderRadius); } .ia_equipmentScheduleComponent__actionBar__dropdown { font-size: 0.75rem; width: 7rem; } .ia_equipmentScheduleComponent__actionButton__icon { fill: var(--neutral-90); } .ia_equipmentScheduleComponent__add__icon { fill: var(--qual-2); } .ia_equipmentScheduleComponent__overlappingEvent__backdrop { background: var(--neutral-40); opacity: 0.5; } .ia_equipmentScheduleComponent__overlappingEvent__dropdown { color: var(--white); background: var(--black); font-size: 0.625rem; font-weight: 700; } .ia_equipmentScheduleComponent__overlappingEvent__dropdown__icon { fill: var(--white); } .ia_equipmentScheduleComponent__scheduleEvent__progressBar__bar__color { background-color: #0C7BB3; } .ia_equipmentScheduleComponent__scheduleEvent__progressBar__track__color { background-color: #FFFFFF; } .ia_equipmentScheduleComponent__tooltip { background-color: #000000; font-size: 0.625rem; color: #FFFFFF; } .ia_equipmentScheduleComponent__scheduleEvent { background: #7D3CBD; color: #FFFFFF; font-size: 0.75rem; font-weight: normal; border-radius: var(--borderRadius); } .ia_equipmentScheduleComponent__scheduleEvent__leadTime { background-color: #FAD8AF; } .ia_equipmentScheduleComponent__resizePlaceHolder, .ia_equipmentScheduleComponent__movePlaceHolder, .ia_equipmentScheduleComponent__selectedPlaceHolder { border-radius: var(--borderRadius); } .ia_equipmentScheduleComponent__resizePlaceHolder { border: 2px solid var(--black); } .ia_equipmentScheduleComponent__movePlaceHolder { border: 2px dashed rgba(0,0,0,0.4); } .ia_equipmentScheduleComponent__selectedPlaceHolder { border: 2px solid #47A9E5; } .ia_equipmentScheduleComponent__downtimeEvent { background-color: rgba(222,27,27,0.3); } .ia_equipmentScheduleComponent__breakEvent { background-color: rgba(10,166,72,0.3); } .ia_fileUploadComponent { border: 1px dashed var(--border); border-radius: var(--borderRadius); font-size: 0.875rem; color: var(--neutral-70); } .ia_fileUploadComponent--uploading, .ia_fileUploadComponent--error, .ia_fileUploadComponent--dragTarget { border: var(--containerBorder); background-color: var(--callToActionHighlight); } .ia_fileUploadComponent__displayMessage { color: var(--neutral-70); } .ia_fileUploadComponent--error__displayMessage { color: var(--error); } .ia_fileUploadComponent__supportedFileTypes { font-size: 0.75rem; color: var(--neutral-70); } .ia_fileUploadComponent__supportedFileTypes--error { color: var(--error); } .ia_fileUploadComponent__supportedFileTypes__primaryMessage { font-weight: 700; } .ia_fileUploadComponent__supportedFileTypes__icon { fill: var(--icon); } .ia_fileUploadComponent__filesList { border-top: var(--containerBorder); } .ia_fileUploadComponent__filesList__file { color: var(--neutral-70); } .ia_fileUploadComponent__filesList__fileName { color: var(--info); } .ia_fileUploadComponent__filesList__okayIcon { fill: var(--success); } .ia_fileUploadComponent__filesList__loadingIcon { fill: var(--neutral-70); } .ia_fileUploadComponent__filesList--error__loadingIcon { fill: var(--error); } .ia_fileUploadComponent__fileSummary__completeIcon { fill: var(--success); } .ia_fileUploadComponent__fileSummary__clearIcon { fill: var(--icon); cursor: pointer; } .ia_fileUploadComponent__fileSummary__clearIcon__message { font-size: 0.75rem; } .ia_fileUploadComponent__fileSummary__message--success { font-size: 0.875rem; } .ia_fileUploadComponent__pagination { background-color: var(--container); border-top: 1px solid var(--border); } .ia_fileUploadComponent__pagination__fileCount { font-size: 0.75rem; color: var(--neutral-70); } .ia_fileUploadComponent__pagination__nextPrevIcon { fill: var(--neutral-90); } .ia_fileUploadComponent__pagination__nextPrevIcon--disabled { fill: var(--neutral-50); } .ia_fileUploadComponent__pagination_callToAction:hover:not(.disabled) .ia_fileUploadComponent__pagination__nextPrevIcon { fill: var(--callToAction); } .ia_fileUploadComponent--tablet { border: 1px dashed var(--border); border-radius: var(--borderRadius); font-size: 0.75rem; color: var(--neutral-70); } .ia_fileUploadComponent--tablet__fileSummary__message--success { font-size: 0.75rem; } .ia_fileUploadComponent--tablet__progress__uploadProgressAnimation { border: var(--containerBorder); background: var(--neutral-10); } .ia_fileUploadComponent--tablet__progress__uploadProgressAnimation__innerPath { fill: var(--callToAction); } .ia_fileUploadComponent--mobile { border: 1px dashed var(--neutral-40); border-radius: var(--borderRadius); font-size: 0.75rem; color: var(--neutral-70); } .ia_fileUploadComponent--mobile--invalid { border-color: var(--callToAction); } .ia_fileUploadComponent--mobile--popupDisplayed { border-color: var(--callToAction); } .ia_fileUploadComponent--mobile--uploading, .ia_fileUploadComponent--mobile--error, .ia_fileUploadComponent--mobile--complete { border: 1px solid var(--callToAction); } .ia_fileUploadComponent--mobile--complete__icon { fill: var(--success); } .ia_fileUploadComponent--mobile--error__icon { fill: var(--error); } .ia_fileUploadComponent--mobile__popup { color: var(--neutral-70); } .ia_fileUploadComponent--mobile__filesList { border-top: var(--containerBorder); } .ia_fileUploadComponent--mobile__uploadIcon { fill: var(--callToAction); } .ia_fileUploadComponent__supportedFileTypes__icon { fill: var(--icon); } .ia_fileUploadComponent--mobile__progress__activeFileText { fill: var(--neutral-90); } .ia_fileUploadComponent--mobile__progress__uploadProgressAnimation { border: var(--containerBorder); background: var(--neutral-10); } .ia_fileUploadComponent--mobile__progress__uploadProgressAnimation__innerPath { fill: var(--callToAction); } .ia_horizontalMenuComponent { border-top: var(--containerBorder); border-bottom: var(--containerBorder); } .ia_horizontalMenuComponent__item { color: var(--neutral-70); background-color: var(--container); } .ia_horizontalMenuComponent__item__icon { fill: currentColor; } .ia_horizontalMenuComponent__item--disabled { color: var(--neutral-50); } .ia_horizontalMenuComponent__item__expandIcon { fill: var(--neutral-70); } .ia_horizontalMenuComponent__item:not(.ia_horizontalMenuComponent__item--active):not(.ia_horizontalMenuComponent__item--disabled):hover { filter: brightness(0.9); } .ia_horizontalMenuComponent__item--active { color: var(--neutral-90); } .ia_horizontalMenuComponent__sideNav__iconContainer { background-color: var(--neutral-50); } .ia_horizontalMenuComponent__modal { border: none; border-top: var(--containerBorder); box-shadow: none; background-color: transparent; } .ia_horizontalMenuComponent__modal .ia_horizontalMenuComponent__item { border-bottom: var(--containerBorder); } .ia_horizontalMenuComponent__item__leftItem { border-left: 3px solid transparent; } .ia_horizontalMenuComponent__item__leftItem--active { border-left: 3px solid var(--callToAction); } .ia_horizontalMenuComponent__item__rightItem { border-right: 3px solid transparent; } .ia_horizontalMenuComponent__item__rightItem--active { border-right: 3px solid var(--callToAction); } .ia_horizontalMenuComponent__sideNavContainerLeft { background: linear-gradient(to right, var(--container), 50%, transparent 100%); } .ia_horizontalMenuComponent__sideNavContainerRight { background: linear-gradient(to right, transparent, var(--container) 50%, var(--container) 100%); } .ia_ledComponent__diode--on { fill: var(--indicator); } .ia_ledComponent__diode--off { fill: var(--indicatorOff); } .ia_ledComponent__background { fill: var(--neutral-100); } .ia_linearScaleComponent__majorTick, .ia_linearScaleComponent__minorTick, .ia_linearScaleComponent__fineTick { stroke: var(--neutral-60); } .ia_linearScaleComponent__tick__label, .ia_linearScaleComponent__indicator__label { fill: var(--neutral-90); } .ia_linearScaleComponent__lineIndicator { stroke: var(--seq-2); } .ia_linearScaleComponent__wedgeIndicator { opacity: 1; fill: var(--indicator); } .ia_linearScaleComponent__rangeIndicator { fill: var(--seq-5); fill-opacity: 0.4; } .ia_menuTreeComponent__item { border-bottom: solid var(--border) 1px; background-color: inherit; color: var(--neutral-90); } .ia_menuTreeComponent__item:not(.ia_menuTreeComponent__header):hover { filter: brightness(0.9); } .ia_menuTreeComponent__item__icon, .ia_menuTreeComponent__header__icon { fill: var(--icon); } .ia_menuTreeComponent__item__navIcon { fill: var(--icon); } .ia_menuTreeComponent__backAction { background-color: var(--neutral-30); color: var(--icon); border-bottom: solid var(--border) 1px; text-transform: uppercase; font-size: 0.875rem; line-height: 2rem; font-weight: 500; } .ia_menuTreeComponent__backAction:hover { background-color: var(--neutral-20); } .ia_menuTreeComponent__backAction:active { background-color: var(--neutral-40); } .ia_movingAnalogIndicatorComponent { font-size: 1rem; } .ia_movingAnalogIndicatorComponent__scale { fill: var(--container); stroke: var(--border); } .ia_movingAnalogIndicatorComponent__desiredRange { fill: var(--infoSecondary); stroke: var(--border); } .ia_movingAnalogIndicatorComponent__interlockRange { fill: var(--neutral-100); stroke: var(--border); } .ia_movingAnalogIndicatorComponent__level1AlarmRange, .ia_movingAnalogIndicatorComponent__level2AlarmRange { fill: var(--neutral-60); stroke: var(--border); } .ia_movingAnalogIndicatorComponent__level1AlarmRange--active { fill: var(--error); stroke: var(--border); } .ia_movingAnalogIndicatorComponent__level2AlarmRange--active { fill: var(--warningSecondary); stroke: var(--border); } .ia_movingAnalogIndicatorComponent__wedgeIndicator { fill: var(--neutral-60); } .ia_movingAnalogIndicatorComponent__setpointIndicator { fill: var(--neutral-10); stroke: var(--info); } .ia_multiStateButton__button--primary--selected, .ia_multiStateButton__button--secondary--selected { font-weight: 500; } .ia_multiStateButton__button--primary--unselected, .ia_multiStateButton__button--secondary--unselected { font-weight: 400; } .ia_numericEntryFieldComponent__modal { border: var(--containerBorder); } .ia_numericEntryFieldComponent__editIcon { fill: var(--callToAction); } .ia_numericEntryFieldComponent__editLink:hover .ia_numericEntryFieldComponent__editIcon { filter: brightness(1.2); } .ia_numericEntryFieldComponent__editLink--active:hover .ia_numericEntryFieldComponent__editIcon, .ia_numericEntryFieldComponent__editLink--disabled:hover .ia_numericEntryFieldComponent__editIcon { filter: none; } .ia_numericEntryFieldComponent__editIcon--active { fill: var(--callToAction--active); } .ia_numericEntryFieldComponent__editIcon--disabled { fill: var(--callToAction--disabled); } .ia_oneShotButtonComponent__confirmModal__message { color: var(--neutral-90); margin: 0.5rem 0; font-size: 0.875rem; line-height: 1rem; } .ia_passwordFieldComponent__visibilityIcon { fill: var(--callToAction); } .ia_passwordFieldComponent__visibilityLink:hover .ia_passwordFieldComponent__visibilityIcon { filter: brightness(1.2); } .ia_passwordFieldComponent__visibilityLink--disabled:hover .ia_passwordFieldComponent__visibilityIcon, .ia_passwordFieldComponent__visibilityLink--active:hover .ia_passwordFieldComponent__visibilityIcon { filter: none; } .ia_passwordFieldComponent__visibilityIcon--disabled { fill: var(--callToAction--disabled); } .ia_powerChartComponent { font-size: 12px; color: var(--neutral-100); border: 1px solid var(--border); } .ia_powerChartComponent__title, .ia_powerChartComponent__tagBrowserContainer__title { font-weight: bold; } .ia_powerChartComponent__eventMarker__box__timeLabel, .ia_powerChartComponent__labelText { font-size: 11px; text-anchor: start; fill: var(--neutral-50); pointer-events: none; } .ia_powerChartComponent__labelText--centered { font-size: 11px; text-anchor: middle; fill: var(--neutral-50); pointer-events: none; } .ia_powerChartComponent__tagBrowserContainer { border-right: 1px solid var(--border); background-color: var(--neutral-20); } .ia_powerChartComponent__tagBrowserContainer__tree { background-color: var(--neutral-10); border: 1px solid var(--border); } .ia_powerChartComponent__xTrace__line { stroke: var(--neutral-60); stroke-width: 1; stroke-opacity: 0.5; stroke-dasharray: 0; cursor: crosshair; pointer-events: none; } .ia_powerChartComponent__xTrace__box { width: 100px; fill: var(--neutral-10); opacity: 0.9; stroke: var(--neutral-60); stroke-width: 1; stroke-opacity: 0.5; stroke-dasharray: 0; pointer-events: none; } .ia_powerChartComponent__xTrace__box__timeMarker { text-anchor: start; fill: var(--neutral-40); } .ia_powerChartComponent__xTrace__dot { fill: var(--neutral-60); } .ia_powerChartComponent__baseline__line { stroke: var(--neutral-60); stroke-width: 1; stroke-opacity: 0.5; stroke-dasharray: 0; pointer-events: none; } .ia_powerChartComponent__baseline__label { fill: var(--neutral-50); font-size: 10px; font-weight: 100; pointerEvents: none; } .ia_powerChartComponent__band__body { fill: var(--neutral-60); fill-opacity: 0.5; stroke-width: 0; stroke-dasharray: 0; pointer-events: none; } .ia_powerChartComponent__band__label { fill: var(--neutral-50); font-size: 10px; font-weight: 100; pointerEvents: none; } .ia_powerChartComponent__timeAxis__values, .ia_powerChartComponent__yAxis__label, .ia_powerChartComponent__yAxis__values { stroke: none; fill: var(--neutral-50); font-size: 10px; font-weight: 100; } .ia_powerChartComponent__timeAxis__ticks, .ia_powerChartComponent__yAxis__ticks { fill: none; stroke: var(--neutral-50); } .ia_powerChartComponent__timeAxis__axis, .ia_powerChartComponent__yAxis__axis { fill: none; stroke: var(--neutral-50); } .ia_powerChartComponent__dateTimeSelection { color: var(--callToAction); font-weight: bold; } .ia_powerChartComponent__noDataDisplay { background-color: var(--neutral-20); border-top: 1px solid var(--border); } .ia_powerChartComponent__chart__popupMenu { font-size: 12px; color: var(--neutral-100); background-color: var(--neutral-20); } .ia_powerChartComponent__chart__popupMenu button { font-size: 14px; } .ia_powerChartComponent__chart__rangeSelector > svg { border: 1px solid var(--border); } .ia_powerChartComponent__chart__rangeSelector__popupMenu { font-size: 12px; color: var(--neutral-100); background-color: var(--neutral-10); } .ia_powerChartComponent__chart__rangeSelector__popupMenu__menuItem {} .ia_powerChartComponent__chart__rangeSelector__popupMenu__menuItem--hover { color: var(--neutral-10); font-weight: bold; background-color: var(--callToAction); } .ia_powerChartComponent__dateTimeSelection__popupMenu__header { font-size: 14px; background-color: var(--neutral-60); border-bottom: 1px solid var(--border); } .ia_powerChartComponent__dateTimeSelection__popupMenu__header__icon { color: var(--neutral-70); } .ia_powerChartComponent__icon { color: var(--neutral-70); border: 1px solid var(--border); } .ia_powerChartComponent__icon--active { background-color: var(--neutral-40); } .ia_powerChartComponent__chartOptionBar--mobile { border-top: 1px solid var(--border); } .ia_powerChartComponent__chartOptionBar__popupMenu { font-size: 12px; color: var(--neutral-100); background-color: var(--neutral-10); } .ia_powerChartComponent__chartOptionBar__popupMenu__menuItem {} .ia_powerChartComponent__chartOptionBar__popupMenu__menuItem--hover { color: var(--neutral-10); font-weight: bold; background-color: var(--callToAction); } .ia_powerChartComponent__settings { background-color: var(--neutral-20); border-left: 1px solid var(--border); } .ia_powerChartComponent__settings__header { background-color: var(--neutral-10); font-weight: bold; } .ia_powerChartComponent__settings__iconHeader { background-color: var(--neutral-10); border: 1px solid var(--border); font-weight: bold; } .ia_powerChartComponent__settings__header__link { font-weight: normal; color: var(--callToAction); } .ia_powerChartComponent__settings__tab { border-color: var(--border); background-color: var(--neutral-20); } .ia_powerChartComponent__settings__tab--active { background-color: var(--neutral-10); } .ia_powerChartComponent__settings__tab__content, .ia_powerChartComponent__settings__tab__content .ia_table__headContainer { background-color: var(--neutral-10); } .ia_powerChartComponent__settings__tab__addLink { font-weight: bold; text-decoration: underline; color: var(--callToAction); } .ia_powerChartComponent__settings__tab__content__table__headerCell {} .ia_powerChartComponent__penDataDisplay__table__headerCell { background-color: var(--neutral-30); } .ia_powerChartComponent__penDataDisplay__brushRangeGroupLabel { background-color: var(--div-9); } .ia_powerChartComponent__penDataDisplay__table__headerCell, .ia_powerChartComponent__penDataDisplay__table__bodyCell, .ia_powerChartComponent__penDataDisplay--mobile__pagination, .ia_powerChartComponent__penDataDisplay--mobile__penTable, .ia_powerChartComponent__penDataDisplay__brushRangeGroupLabel { border-top: 1px solid var(--border); } .ia_powerChartComponent__penDataDisplay__table__separatorCell { border-right: 1px solid var(--border); } .ia_powerChartComponent__settings__tab__content__table__bodyRowOdd, .ia_powerChartComponent__penDataDisplay__table__bodyRowOdd { background-color: var(--neutral-20); } .ia_powerChartComponent__settings__tab__content__table__bodyRowEven, .ia_powerChartComponent__penDataDisplay__table__bodyRowEven { background-color: var(--neutral-10); } .ia_powerChartComponent__penDataDisplay__table__bodyRowOdd.overlay-shown, .ia_powerChartComponent__penDataDisplay__table__bodyRowEven.overlay-shown, .ia_powerChartComponent__penDataDisplay__table__rowOverlay { background-color: var(--red-20) !important; } .ia_powerChartComponent__penDataDisplay__table__rowOverlay__icon { color: var(--red-60) !important; } .ia_powerChartComponent__settings__tab__content__table__bodyCell, .ia_powerChartComponent__penDataDisplay__table__bodyCell {} .ia_powerChartComponent__settings__tab__content__table__bodyCell__icon, .ia_powerChartComponent__penDataDisplay__table__bodyCell__icon, .ia_powerChartComponent__penDataDisplay__table__icon, .ia_powerChartComponent__penDataDisplay--mobile__icon, .ia_powerChartComponent__tagBrowserContainer__icon { color: var(--neutral-70); } .ia_powerChartComponent__settings__tab__content__table__emptyMessage { color: var(--neutral-70); } .ia_powerChartComponent__settings__tab__content__popupMenu { font-size: 12px; color: var(--neutral-100); } .ia_powerChartComponent__settings__tab__content__buttonContainer { border: 1px solid var(--border); background-color: var(--neutral-10); } .ia_powerChartComponent__settings__tab__content__chartExample { border: 1px solid var(--border); } .ia_powerChartComponent__penLegend { border: 1px solid var(--border); } .ia_powerChartComponent__penLegend__navArrow { background-color: var(--neutral-30); } .ia_powerChartComponent__resize-handle.dragging::after { border: 2px solid var(--border); } .ia_piping { fill: var(--pipePrimaryFill); stroke: var(--pipeStroke); } .pipe_point__handle--selected { border-color: var(--callToAction); } .ia_pipe--pid { fill: var(--pipeStroke); } .ia_pipeSegment { pointer-events: fill; } .ia_pipeSegment--selected { stroke: var(--pipeSelectStroke); } .ia_pipeSegmentNode--pid { stroke: none; } .ia_pipeSegmentNode--pid--selected { fill: var(--pipeSelectStroke); } .ia_pipeSegmentOverlay { stroke: none; } .ia_pipeSegmentNode--selected { stroke: var(--pipeSelectStroke); stroke-dasharray: 5, 1; } .ia_pipeSegmentPrimaryStopColor { stop-color: var(--pipePrimaryFill); } .ia_pipeSegmentSecondaryStopColor { stop-color: var(--pipeSecondaryFill); } .ia_radioGroupComponent--disabled { color: var(--label--disabled); } .ia_reportViewerComponent { background-color: var(--neutral-30); border: var(--containerBorder); font-size: 0.875rem; color: var(--neutral-90); } .ia_reportViewerComponent__pdfDocument { border: var(--containerBorder); box-shadow: 5px 5px 0px var(--neutral-90); } .ia_reportViewerComponent__actionBar { border-top: var(--containerBorder); background-color: var(--container); } .ia_signaturePadComponent { background-color: var(--input); border: var(--containerBorder); } .ia_signaturePadComponent__actionBar { background-color: var(--containerNested); } .ia_sparklineComponent__line { stroke: var(--neutral-90); stroke-width: 0.75; } .ia_sparklineComponent__desiredHigh, .ia_sparklineComponent__desiredLow { stroke: var(--error); stroke-dasharray: 4; stroke-width: 0.5; } .ia_sparklineComponent__desiredFill { fill: var(--error); fill-opacity: 0.2; } .ia_sparklineComponent__firstMarker, .ia_sparklineComponent__lowMarker, .ia_sparklineComponent__highMarker, .ia_sparklineComponent__lastMarker { stroke-width: 0.5; } .ia_sparklineComponent__firstMarker { fill: var(--success); } .ia_sparklineComponent__lastMarker { fill: var(--error); } .ia_sparklineComponent__lowMarker { fill: var(--seq-2); } .ia_sparklineComponent__highMarker { fill: var(--seq-5); } .ia_splitContainerComponent--split__handle { border: 1px var(--neutral-50) solid; background-color: var(--neutral-10); } .ia_splitContainerComponent--split__handle__designer { border: 1px var(--neutral-50) solid; background-color: var(--neutral-10); } .ia_splitContainerComponent--split__handle__draggable:active { background-color: var(--callToAction--activeAlt); } .split-handle-invis:hover { background-color: var(--callToAction--hover); } .split-handle-invis:active { background-color: var(--callToAction--activeAltInvis); } .ia_splitContainerComponent--split__handle .ia_splitContainerComponent--handle__icon { fill: var(--neutral-70); } .ia_splitContainerComponent--split__handle:hover .ia_splitContainerComponent--handle__icon { fill: var(--callToAction--hover); } .ia_symbolComponent__liquid { fill: var(--info); fill-opacity: 0.7; stroke-width: 2px; } .ia_symbolComponent__liquid--warning { fill: var(--error); } @keyframes ia_symbolComponent__animate--alternateFill { 0% { fill: var(--symbolFill--default); } 50% { fill: var(--symbolFillAnimation--default); } 100% { fill: var(--symbolFill--default); } } @keyframes ia_symbolComponent__animate--alternateFillAlt { 0% { fill: var(--symbolFillAnimation--default); } 50% { fill: var(--symbolFill--default); } 100% { fill: var(--symbolFillAnimation--default); } } @keyframes ia_symbolComponent__animate--alternateFill--running { 0% { fill: var(--symbolFill--running); } 50% { fill: var(--symbolFillAnimation--running); } 100% { fill: var(--symbolFill--running); } } @keyframes ia_symbolComponent__animate--alternateFillAlt--running { 0% { fill: var(--symbolFillAnimation--running); } 50% { fill: var(--symbolFill--running); } 100% { fill: var(--symbolFillAnimation--running); } } @keyframes ia_symbolComponent__animate--rotate { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } @keyframes ia_symbolComponent__animate--rotate3dYAxis { 0% { transform: rotate3d(0, 1, 0, 0deg); } 100% { transform: rotate3d(0, 1, 0, 360deg); } } @keyframes ia_symbolComponent__animate--faulted { 0% { fill: var(--symbolFill--running); } 50% { fill: var(--symbolFill--faulted); } 100% { fill: var(--symbolFill--running); } } @keyframes ia_symbolComponent__animate--failedToOpen { 0% { fill: var(--symbolFill--running); } 50% { fill: var(--symbolFill--faulted); } 100% { fill: var(--symbolFill--running); } } @keyframes ia_symbolComponent__animate--failedToClose { 0% { fill: var(--symbolFill--stopped); } 50% { fill: var(--symbolFill--faulted); } 100% { fill: var(--symbolFill--stopped); } } .ia_symbolComponent { fill: var(--symbolFill--default); stroke: var(--symbolStroke--default); } .ia_symbolComponent__altFill { fill: var(--symbolStroke--default); } .ia_symbolComponent__inside { fill: var(--symbolFill--stopped); } .ia_symbolComponent__animate--alternateFill { animation: none; } .ia_symbolComponent__animate--alternateFillAlt { animation: none } .ia_symbolComponent__animate--rotate { animation: none; } .ia_symbolComponent__animate--rotate3dYAxis { animation: none; } .ia_symbolComponent--running { fill: var(--symbolFill--running); stroke: var(--symbolStroke--running); } .ia_symbolComponent__altFill--running { fill: var(--symbolStroke--running); } .ia_symbolComponent__animate--alternateFill--running { animation: ia_symbolComponent__animate--alternateFill--running linear infinite; } .ia_symbolComponent__animate--alternateFillAlt--running { animation: ia_symbolComponent__animate--alternateFillAlt--running linear infinite; } .ia_symbolComponent__animate--rotate--running { animation: ia_symbolComponent__animate--rotate linear infinite; } .ia_symbolComponent__animate--rotate3dYAxis--running { animation: ia_symbolComponent__animate--rotate3dYAxis linear infinite; } .ia_symbolComponent--stopped { fill: var(--symbolFill--stopped); stroke: var(--symbolStroke--stopped); animation: ia_symbolComponent__animate--stopped linear infinite; } .ia_symbolComponent__altFill--stopped { fill: var(--symbolStroke--stopped); } .ia_symbolComponent--faulted { fill: var(--symbolFill--faulted); stroke: var(--symbolStroke--faulted); animation: ia_symbolComponent__animate--faulted linear infinite; } .ia_symbolComponent__altFill--faulted { fill: var(--symbolStroke--faulted); } .ia_symbolComponent--open { fill: var(--symbolFill--running); stroke: var(--symbolStroke--running); } .ia_symbolComponent__altFill--open { fill: var(--symbolStroke--running); } .ia_symbolComponent--failedToOpen { fill: var(--symbolFill--default); stroke: var(--symbolStroke--faulted); animation: ia_symbolComponent__animate--failedToOpen linear infinite; } .ia_symbolComponent__altFill--failedToOpen { fill: var(--symbolStroke--faulted); } .ia_symbolComponent--partiallyClosed { fill: var(--symbolFill--stopped); stroke: var(--symbolStroke--running); } .ia_symbolComponent__altFill--partiallyClosed { fill: var(--symbolStroke--running); } .ia_symbolComponent__defaultFill--partiallyClosed { fill: var(--symbolFill--running); } .ia_symbolComponent__defaultFill--reverseFlow--partiallyClosed { fill: var(--symbolFill--stopped); } .ia_symbolComponent__defaultFillAlt--partiallyClosed { fill: var(--symbolFill--stopped); } .ia_symbolComponent__defaultFillAlt--reverseFlow--partiallyClosed { fill: var(--symbolFill--running); } .ia_symbolComponent--closed { fill: var(--symbolFill--stopped); stroke: var(--symbolStroke--stopped); } .ia_symbolComponent__altFill--closed { fill: var(--symbolStroke--stopped); } .ia_symbolComponent--failedToClose { fill: var(--symbolFill--stopped); stroke: var(--symbolStroke--faulted); animation: ia_symbolComponent__animate--failedToClose linear infinite; } .ia_symbolComponent__altFill--failedToClose { fill: var(--symbolStroke--faulted); } .ia_tabContainerComponent__content { border-left: var(--containerBorder); border-right: var(--containerBorder); border-bottom: var(--containerBorder); } .ia_tabContainerComponent__tab--classic { color: var(--neutral-60); border-top: var(--containerBorder); border-right: var(--containerBorder); border-bottom: var(--containerBorder); font-size: 0.875rem; } .ia_tabContainerComponent__tabMenuRight--classic { border-bottom: var(--containerBorder); } .ia_tabContainerComponent__tab--classic:first-child { border-left: var(--containerBorder); } .ia_tabContainerComponent__tab--classic:not(.ia_tabContainerComponent__tab--classic--active, .ia_tabContainerComponent__tab--classic--disabled):hover { filter: brightness(0.9); } .ia_tabContainerComponent__tab--classic--active { background-color: var(--container); font-weight: 500; color: var(--neutral-90); border-top: var(--containerBorder); border-bottom: none; } .ia_tabContainerComponent__tab--classic--disabled { background-color: var(--neutral-40); color: var(--neutral-60); opacity: 0.6 } .ia_tabContainerComponent__tab--modern { color: var(--neutral-70); border-bottom: var(--containerBorder); box-shadow: none; transition: box-shadow 0.2s linear; font-size: 0.875rem; } .ia_tabContainerComponent__tabMenuRight--modern { border-bottom: var(--containerBorder); } .ia_tabContainerComponent__tab--modern--active { font-weight: 500; color: var(--neutral-90); box-shadow: inset 0 -3px var(--border); } .ia_tabContainerComponent__tab--modern--disabled { color: var(--neutral-60); opacity: 0.6 } .ia_tabContainerComponent__tab--modern:not(.ia_tabContainerComponent__tab--modern--active, .ia_tabContainerComponent__tab--modern--disabled):hover { filter: brightness(0.8); } .ia_tabContainerComponent--designing__deleteConfirmation { color: var(--label); background-color: var(--containerNested); border: var(--containerBorder); } .ia_tabContainerComponent--designing__deleteConfirmation__delete { font-size: 0.75rem; background-color: var(--error); } .ia_tabContainerComponent--designing__deleteConfirmation__cancel { font-size: 0.75rem; } .ia_tabContainerComponent--designing__tab--pendingDelete { border: var(--containerBorder); border-color: var(--error); } .ia_tableComponent { border: var(--containerBorder); } .ia_tableComponent__filterContainer { background-color: var(--neutral-30); } .ia_tableComponent__body__row--hovered { color: var(--neutral-90); background-color: rgba(12, 123, 179, 0.10); } .ia_tableComponent__selection { background-color: rgba(12, 123, 179, 0.25); } .ia_tableComponent__selection--root { border: 1px var(--callToAction) solid; } .ia_tableComponent__editableCell { border: 1px var(--callToAction) solid; box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.3); background-color: var(--container); } .ia_tagBrowseTreeComponent { font-size: 0.75rem; color: var(--neutral-100); border: 1px solid var(--border); background-color: var(--neutral-20); } .ia_tagBrowseTreeComponent__title { font-weight: bold; } .ia_tagBrowseTreeComponent__icon { color: var(--neutral-70); cursor: pointer; } .ia_tagBrowseTreeComponent__tree { background-color: var(--neutral-10); border: 1px solid var(--border); } .ia_tagBrowseTreeComponent.mobile { font-size: 1.5rem; } .ia_thermometerComponent__glass, .ia_thermometerComponent__tick, .ia_thermometerComponent__meniscus { stroke: var(--neutral-90); } .ia_thermometerComponent__unit, .ia_thermometerComponent__tickLabel, .ia_thermometerComponent__valueDisplay { font-size: 1.5rem; fill: var(--neutral-90); } .ia_thermometerComponent__liquid { fill: var(--seq-2); } .ia_toggleSwitchComponent { color: var(--label); } .ia_toggleSwitchComponent--disabled { color: var(--label--disabled); } .ia_componentTooltip { background-color: var(--neutral-100); color: var(--neutral-10); } .ia_treeComponent__node { font-size: 0.75rem; line-height: 1rem; } .ia_treeComponent__node:hover:not(.ia_treeComponent__node--selected) { background-color: var(--callToActionHighlight); } .ia_treeComponent__node--selected { background-color: var(--callToAction); color: var(--neutral-10); font-weight: 700; } .ia_treeComponent__node__icon { fill: var(--icon); } .ia_treeComponent__expandIcon, .ia_treeComponent__terminalExpandIcon, .ia_treeComponent__node__icon--expanded { fill: var(--icon); } .ia_treeComponent__node__icon--selected, .ia_treeComponent__expandIcon--selected { fill: var(--icon--selected); } .ia_treeComponent__alignmentGuide { color: var(--border); } .ia_treeComponent__alignmentGuide--selected { color: var(--neutral-10); } .ia_treeComponent__node.mobile { font-size: 1.5rem; } .ia_videoPlayerComponent { background-color: var(--container); } .ia_videoPlayerComponent__controlContainer { background-color: var(--container); border: var(--containerBorder); color: var(--neutral-70); } .ia_videoPlayerComponent__controlContainer__playControl, .ia_videoPlayerComponent__controlContainer__volumeControl, .ia_videoPlayerComponent__controlContainer__playRateControl, .ia_videoPlayerComponent__controlContainer__fullscreenControl { fill: currentColor; } .ia_videoPlayerComponent__controlContainer__playControl:hover:not(.disabled), .ia_videoPlayerComponent__controlContainer__volumeControl:hover:not(.disabled), .ia_videoPlayerComponent__controlContainer__playRateControl:hover:not(.disabled), .ia_videoPlayerComponent__controlContainer__fullscreenControl:hover:not(.disabled) { color: var(--icon--hover); } .ia_videoPlayerComponent__controlContainer__timeDurationDisplay { color: var(--label); } .ia_videoPlayerComponent__controlPopupContainer, .ia_videoPlayerComponent__contextMenuPopupContainer { background-color: rgba(0, 0, 0, 1); color: var(--callToAction); } .ia_videoPlayerComponent__videoOverlay { background-color: transparent; color: var(--white); } .ia_videoPlayerComponent__videoOverlay--paused { background-color: var(--opacity-50); } .ia_videoPlayerComponent__videoOverlay_centralContainer { background-color: var(--opacity-85); } @font-face { font-family: "Vazir"; font-weight: normal; src: url("/data/perspective/fonts/Vazir-Medium-FD-WOL.woff2"); } @font-face { font-family: "Vazir"; font-weight: bold; src: url("/data/perspective/fonts/Vazir-Bold-FD-WOL.woff2"); } @font-face { font-family: "Noto"; font-weight: 100; src: url("/data/perspective/fonts/NotoSans-Light.woff2"); } @font-face { font-family: "Noto"; font-weight: normal; src: url("/data/perspective/fonts/NotoSansArabic-Medium.woff2"); } @font-face { font-family: "Noto"; font-weight: 500; src: url("/data/perspective/fonts/NotoSans-Medium.woff2"); } @font-face { font-family: "Noto"; font-weight: bold; src: url("/data/perspective/fonts/NotoSansArabic-Bold.woff2"); } @font-face { font-family: "Noto"; font-weight: 900; src: url("/data/perspective/fonts/NotoSans-Black.woff2"); } @font-face { font-family: "Noto"; font-weight: 100; src: url("/data/perspective/fonts/NotoSans-Light.woff2"); } @font-face { font-family: "Noto"; font-weight: normal; src: url("/data/perspective/fonts/NotoSans-Regular.woff2"); } @font-face { font-family: "Noto"; font-weight: 500; src: url("/data/perspective/fonts/NotoSans-Medium.woff2"); } @font-face { font-family: "Noto"; font-weight: bold; src: url("/data/perspective/fonts/NotoSans-Bold.woff2"); } @font-face { font-family: "Noto"; font-weight: 900; src: url("/data/perspective/fonts/NotoSans-Black.woff2"); } @font-face { font-family: "Inter"; font-weight: normal; src: url("/data/perspective/fonts/Inter-Regular.woff2"); } @font-face { font-family: "Inter"; font-weight: bold; src: url("/data/perspective/fonts/Inter-Medium.woff"); } @font-face { font-family: "Sofia Pro"; font-weight: 100; src: url("/data/perspective/fonts/Sofia-Pro-Light.woff");} @font-face { font-family: "Sofia Pro"; font-weight: normal; src: url("/data/perspective/fonts/Sofia-Pro-Medium.woff");} @font-face { font-family: "Sofia Pro"; font-weight: bold; src: url("/data/perspective/fonts/Sofia-Pro-Bold.woff");} @font-face { font-family: "Sofia Pro"; font-weight: 900; src: url("/data/perspective/fonts/Sofia-Pro-Black.woff");} @font-face { font-family: "D-DIN"; src: url("/data/perspective/fonts/D-DIN.woff2"); } @font-face { font-family: "D-DIN"; font-weight: bold; src: url("/data/perspective/fonts/D-DIN-Bold.woff2"); } @font-face { font-family: "Seven"; src: url("/data/perspective/fonts/Seven-regular.woff2"); } :root { --color-dashboard: white; --color-header: #57697E; --color-read-bk: #BEC1C0; --neutral-12: #ececec; --neutral-14: #e3f0f8; --color-base: #F2F4F7; --color-bk-4: #CCD2D8; --color-bk-3: #E9ECEF; --color-bk-2: #f6f6f8; --color-bk-1: #f6f6f6; --color-bk-0: #f9fbfc; --color-bk-input: #f9fbfc70; --color-tr-4: #a8b2b646; --color-tr-3: #becacf48; --color-tr-2: #d6e0e455; --color-tr-1: #e2edf242; --color-tr-0: #eef3f63e; --color-grid: lightgray; --color-label-0: #555555; --color-label-1: #797979; --color-label-2: #919caa; --color-icon-0: #555; --color-icon-1: #555; --color-icon-disable:lightgray; --label--disabled: var(--color-tr-4); --color-hover: #FF9200; --color-blue: #799FC4; --color-green: #0ED662; --color-trans: #5A5B5E; --color-menu-icon: var(--color-blue); --table-even: #EDF0F1; --table-odd: #384349; --color-select: #00aaff; --color-select-shadow: #7ab5e2; --color-shadow: rgb(216, 216, 216); --label: #555; --input: var(--color-bk-0); --color-energize: rgb(255, 196, 0); --color-de-energize: #555555; --color-hi-gas: #ff3c00d7; --color-in-gas: #ffa600da; --color-lo-gas: #ffae00dc; --color-header-1: #EEF3F5; --color-header-2: #DCE4E8; --containerBorder: 1px solid white; --sparkline: #555555; --color-pid-bk: #E7E7E7; --color-pid-menu: #E8E8E8; --color-pid-header: #95C5E9; --color-pid-select: #1E8ADB; --color-pid-on: #BBFFA6; --color-pid-off: #AAAAAA; --header: #4A555D; --color-pid-oil: #555; --color-pid-gas: #C79A5C; --color-pid-water: #6C90B9; --color-pid-helium: #D31784; --tab-bk-active: #E7E7E7; --tab-bk-inactive: #EFEFEF; --tab-font: #555555; --tab-border: #DDDDDD; --popup-title-bk: #BBCDDB; --popup-title-label: #555555; --popup-icon: #555555; --strip-01: #D5DBDE; --strip-02: #DCDFE2; --strip-03: #FCFCFC; --strip-04: #E8E9E9; --color-border: lightgray; --color-map-bk: #ffffffa3; --color-map-icon: #555; --color-map-disable: #D5D5D5; --color-en: orange; --color-de: #555555; --color-bk-en: rgba(255, 166, 0, 0.842); --color-bk-de: #555555bd; --color-hi-gas: #ff3c00d7; --color-in-gas: #ffa600da; --color-lo-gas: #ffae00dc; --color-header-1: #EEF3F5; --color-header-2: #DCE4E8; --color-slider-bk: #d9dce66e; --color-disable: #a3b4bb55; }body { font-family: D-DIN; color: var(--color-label-0); user-select: none; } *,*:focus{ outline: none !important; scrollbar-color: rgb(241, 0, 0); } .ia_inputField { background-color: transparent; font-family: D-DIN; } .ia_inputField::placeholder { color: var(--color-label-2) !important; font-family: D-DIN; } .ia_dropdown__valuePill{ background-color: orange; font-family: D-DIN; } .ia_dropdown__placeholder { color: var(--label--disabled) !important; padding: 2px 0 0 1px; font-size: 14; } .iaDropdownCommon > div > *:last-child { margin-right: 0px !important; } ::-webkit-scrollbar { width: 5px !important; height: 0 !important; background: transparent; cursor: pointer !important; } ::-webkit-scrollbar-track { border-radius: 10px !important; } ::-webkit-scrollbar-thumb { background: lightgrey !important; border-radius: 10px !important; } ::-webkit-scrollbar-thumb:hover { background: var(--callToAction) !important; } .scroller { scrollbar-width: thin !important; } .leaflet-pane .view-marker.hide { opacity: 1; visibility: visible; } .leaflet-container { background-color: transparent !important; } .file-upload { background-color: transparent !important; border: unset !important; } .ia_tableComponent { border: none; } .pager-container .pager { background-color: var(--color-bk-0); box-shadow: none !important; border: none; height: 36px !important; } .iaSelectCommon.ia_pager__pageSizeChooser.ia_select.popup-not-draggable{ border: none; } .ia_table__body { background-color: var(--color-bk-0); font-size: 0.875rem; } .psc-subview-table-body .ReactVirtualized__Grid{ height: auto !important; } .psc-subview-root{ min-height: auto !important; } .ia_brush > rect:last-of-type { transform: translateY(1px); } .psc-slider-noborder .ia_slider__handle{ border-radius: 3px; border: solid 3px var(--color-label-0); background-color: var(--container); transform: scale(0.75); } .psc-slider-modern .ia_slider__handle{ border-radius: 50%; border: solid 3px var(--border); background-color: var(--color-tr-0); } .psc-slider-range .ia_slider__handle { border: none; border-radius: 0 !important; background-color: var(--callToAction); width: 5px !important; height: 18px !important; margin-left: -3px !important; margin-top: -7px !important; } .psc-slider-range .ia_slider__track { border-radius: var(--borderRadius); background-color: var(--callToAction); height: 10px !important; margin-top: -3px !important; } .psc-slider-range .ia_slider__rail { border-radius: var(--borderRadius); background-color: var(--color-bk-1); height: 10px !important; margin-top: -3px !important; } .psc-slider-modern { background-color: var(--color-slider-bk); border-radius: 7px; } .psc-slider-modern .ia_slider__handle{ border-radius: 50%; border: solid 3px var(--color-label-0); background-color: var(--color-slider-bk); } .psc-slider-modern .ia_slider__handle:hover { border-color: var(--callToAction); } .psc-slider-modern .ia_slider__rail { background-color: transparent; } .psc-slider-modern .ia_slider__track { background-color: transparent; } .ia_inputField:disabled { font-family: D-DIN; color: var(--label--disabled); border: solid 2px #5a5d5f !important; background-color: transparent; cursor: not-allowed; opacity: 0.5; border-radius: 4px; } .ia_inputField::placeholder { color: var(--color-tr-4); font-weight: normal; font-size: 14px; } .ia_tabContainerComponent__tabMenuRight--modern { border-bottom: rgb(166, 227, 255); } .ia_tabContainerComponent__tab--modern { color: var(--neutral-70); border-bottom: rgb(166, 227, 255); box-shadow: none; transition: box-shadow 0.2s linear; font-size: 0.875rem; } .ia_tabContainerComponent__tab--modern--active { font-weight: 500; color: var(--neutral-90); box-shadow: inset 0 -4px rgb(166, 227, 255); border-bottom: none; } .ia_popup { background-color: rgba(255, 255, 255, 0.9); box-shadow: var(--boxShadow5); border: none; border-radius: 3px; backdrop-filter: blur(3px); } .ia_popup__header { background-color: var(--color-bk-3) !important; color: var(--color-label-0); border-bottom: none; font-size: 0.875rem; border-radius: 3px 3px 0 0; font-weight: bold; } .ia_popup:focus { box-shadow: 0px 0px 8px gray; border-radius: 3px; } .psc-popup-noBorder .ia_popup:focus { border: none; border-radius: 3px; } .popup-drag { border-radius: 3px; } .docked-view.docked-view-right{ box-shadow: 0px 5px 5px var(--color-shadow); } .docked-view.docked-view-bottom{ box-shadow: 0px 5px 5px var(--color-shadow); } .ia_equipmentScheduleComponent__actionBar, .ia_equipmentScheduleComponent__spacer, .ia_equipmentScheduleComponent__groupingCell__backdrop, .ia_equipmentScheduleComponent__headerCell__backdrop, .ia_equipmentScheduleComponent__itemList, .ia_equipmentScheduleComponent__itemList__item, .ia_equipmentScheduleComponent__groupingHeader { background: var(--color-bk-1); } .ia_equipmentScheduleComponent__gridSpace__gridCell{ background: var(--color-bk-0); } .ia_componentTooltip { background-color: rgba(0, 0, 0, 0.815); font-size: 12px; font-family: D-DIN; backdrop-filter: blur(2px); z-index: 9999999999999999999999999999999999999999999999999999999; white-space: pre-wrap; } .ia_menuTreeComponent__item__icon{ transform: scale(1.2); } .ia_tagBrowser .tree-container .tree{ border: none; background-color: transparent; font-size: 20; } .ia_powerChartComponent__tagBrowserContainer{ background-color: var(--color-bk-2); } .ia_powerChartComponent__tagBrowserContainer.expanded{ background-color: var(--color-bk-4); } .ia_powerChartComponent__chart .main-chart-container .no-data-message{ background-color: transparent; border: none; } .ia_reportViewerComponent__actionBar { border: none; } .tree .node-icon { width: 1.125rem; height: 1rem; pointer-events: unset; margin-left: 7px; } .tree .node-icon:hover { color: orange; fill: orange; } .tree .tree-item-label:hover{ color: var(--callToAction); font-weight: bold; background-color: none !important; } .ia_button--primary { font-weight: 500; border: none; font-family: Noto; color: white; } .ia_button--secondary { font-weight: 500; border: solid 2px var(--callToAction); font-family: Noto; background-color: var(--color-bk-0); } .ia_button--primary--disabled { background-color: var(--color-tr-3); } .ia_tagBrowser__noResultsDisplay, .ia_tagBrowser__loadingDisplay { background: transparent ; border: none ; } .tree.ia_tagBrowseTreeComponent__tree{ border: none; background-color: transparent; } .datTile.ia_dateRangePicker__calender__dayTile.active.node.ia_dateRangePicker{ margin: 10px; } .dayTile.ia_dateRangePicker__calender__dayTile { margin: 10px; } .dayTile .ia_dateRangePicker__calendar__dayTile{ margin: 20px; } .ia_table__headContainer, .ia_table_footContainer { width: 100% !important; box-shadow: none !important; } .ia_table__body { background-color: transparent !important; } .t.ia_table.ia_container--secondary{ background-color: transparent !important; } .empty-data-source{ background-color: transparent !important; } .psc-subview-table-body .ReactVirtualized__Grid{ height: auto !important; } .psc-subview-root{ min-height: auto !important; } .psc-power-line .ia_pipe { filter: drop-shadow(0 0 6px orange); } .ia_textArea::placeholder { color: #A8B2B655 !important; } .ia_inputField::placeholder { color: #A8B2B655 !important; } .content-frame.ia_container--secondary.ia_tabContainerComponent__content{ background-color: transparent; border: none; } .tree .tree-alignment.terminal-alignment .cross-alignment { position: absolute; top: 0; left: 0; width: 100%; height: 50%; border-bottom: none !important; } .tree .tree-alignment { position: absolute; border-left: none !important; } .ia_horizontalMenuComponent__item__icon{ min-height: 22px; min-width: 22px; } .ia_horizontalMenuComponent__item:not(.ia_horizontalMenuComponent__item--active):not(.ia_horizontalMenuComponent__item--disabled):hover { filter: brightness(0.9); color: orange; } .alarmTable .alarmTableToolbar .alarmPreFiltersFilter .alarmPreFiltersPillsCCC { background-color: var(--color-bk-1); } .ia_alarmTableComponent__toolbar__preFilterCount{ background-color: var(--color-bk-1); } .ia_alarmTableComponent__toolbar__preFilter__removeAll { background-color: var(--color-bk-1); } .ia_splitContainerComponent--split__handle { border: none; background-color: var(--color-tr-3); } @keyframes Hi-Gas{ from{ background-color: #FFF6D8; } to{ background-color: #FFE888; } } @keyframes blade-rotate{ from{ transform: rotateX(0deg); } to{ transform: rotateX(359deg); } } @keyframes blower-rotation{ from{ transform: rotateY(0deg); } to{ transform: rotateY(359deg); } } @keyframes fan-rotation{ from{ transform: rotateZ(0deg); } to{ transform: rotateZ(359deg); } } @keyframes heart-beat{ from{ transform: scale(0.95); } to{ transform: scale(1); } } @keyframes mixer-rotation{ from{ transform: scaleX(0); } to{ transform: scaleX(1); } } @keyframes mixer-rotation-h{ from{ transform: scaleY(0); } to{ transform: scaleY(1); } } @keyframes pump-blade{ from{ transform: rotateX(0deg); } to{ transform: rotateX(360deg); } } @keyframes pump-blade2{ 0%{ transform: rotateX(45deg); } 100%{ transform: rotateX(225deg); } } @keyframes coriolis{ 0%{ transform: scaleX(1.2); } 100%{ transform: scaleX(0.9); } } @keyframes wave-fill{ 0%{ background-position-x: 0vw; } 100%{ background-position-x: 100vw; } } .psc-view-load { animation: view-load 3s ease-out 1 forwards; user-select: none; } @keyframes view-load { 0% { opacity: 0; } 100% { opacity: 1; } } .psc-logo { fill: var(--color-label-0); padding: 5px; filter: drop-shadow(0px 0px 3px gray); } .psc-menu-item{ color: var(--on-surface); font-weight: 400; font-family: Noto; border-radius: 4px; cursor: pointer; } .psc-menu-item-active{ color: var(--on-primary); fill: var(--on-primary); background-color: var(--primary); border-radius: 4px; } .psc-menu-item:hover{ font-weight: 500; color: white; background-color: var(--div-11); padding: 0 0 0 15px; transition: 200ms; } @keyframes glow3 { 0% { transform: scale(1.0); } 100% { transform: scale(1.2); } } .psc-glow-effect:hover { animation: glow3 0.5s ease-out 1 forwards; transform: scale(1.2); z-index: 111111111111111111111111111 !important; overflow: visible !important; } .psc-icon-button{ margin-right: 5px; color: var(--color-label-0); cursor: pointer; fill: var(--color-label-0); } .psc-icon-button:hover{ transform: scale(1.1); color: var(--color-select); filter: drop-shadow(0 0 3px var(--color-shadow) ); fill: var(--color-select); } .psc-fade-effect-bottom { position: relative; } .psc-fade-effect-bottom:after { position:absolute; top: 0px; background: linear-gradient(transparent, transparent 85%, var(--containerRoot) 100%); left: 0px; content: ""; width: 100%; height: 100%; overflow: hidden; pointer-events: none; } .psc-fade-effect-top { position: relative; } .psc-fade-effect-top:after { position:absolute; top: 0px; background: linear-gradient(red, transparent 0.1%, transparent 100%); left: 0px; content: ""; width: 100%; height: 100%; overflow: hidden; pointer-events: none; } .psc-disable-component { opacity: 0.5; pointer-events: none; } .psc-header { background-color: #0B649C; color: white; font-family: Noto; text-indent: 8px; } .psc-card-item { transition: 500ms; cursor: pointer; } .psc-card-item:hover { transform: scale(1.2); } .psc-card-item-select { background-color: #0C7BB355 !important; } .psc-map-marker-label{ font-size: 8px; white-space: pre-wrap; line-height: 1; text-align: center; color: var(--color-label-0); } .psc-map-menu-bk{ background-color: var(--color-map-bk); backdrop-filter: blur(2px); } .psc-map-layer-item__select{ color: var(--color-label-0); font-size: 15px; font-family: D-DIN; font-weight: bold; } .psc-map-layer-item__unselect{ color: var(--color-map-disable); font-size: 14px; font-family: D-DIN; font-weight: normal; transition: 300ms; } .psc-map-layer-box{ background: transparent; transition: 500ms; cursor: pointer; padding: 5px 15px 5px 15px; overflow: hidden; user-select: none; fill: var(--color-label-0); } .psc-map-layer-box:hover{ background: #B3E1FF; color: var(--color-hover); fill: var(--color-hover); padding: 5px 10px 5px 45px; } .psc-map .ia_dropdown__expandIcon { transform: scale(0); transition: 300ms; } .psc-map:hover .ia_dropdown__expandIcon { transform: scale(1); } .psc-map .iaDropdownCommon_value.ia_dropdown__valuePill__value { color: var(--color-label-0); } .psc-map .ia_dropdown__valuePill { border-radius: var(--borderRadius); background-color: #77c9ff; overflow: hidden; color: var(--color-label-0); } .psc-map .iaDropdownCommon .ia_dropdown__valuePill { padding: 4px 4px; margin: 0 5px; } .psc-map-marker-alart { animation: map-wave-alert 2s ease-in infinite; } @keyframes map-wave-alert{ 0%{ transform: scale(0); opacity: 1; transform-origin: 50% 50%; } 100%{ transform: scale(1); opacity: 0; transform-origin: 50% 50%; } } input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } .leaflet-popup-content-wrapper{ white-space: pre-line; } .view-marker{ pointer-events: none; } .psc-map-slider .ia_slider__handle{ border-radius: 0%; border: solid 2px var(--color-label-0); background-color: var(--color-label-0); transform: scaleY(0.8) scale(0.8); border-radius: 2px; box-shadow: 0 0 5px var(--color-label-0); } .view-marker{ pointer-events: none; } .psc-map-badge_active { color: #555; background-color: #CBE8FF; border-radius: 10px; padding: 0 10px; height: 24px; font-size: 14px; } .psc-map-badge_deactive { color: none; background-color: none; border-radius: 10px; padding: 0 10px; height: 24px; font-size: 16px; }.ia_table__body { background-color: transparent; } .ReactVirtualized__Grid{ background-color: transparent; } .tr .header .ia_table__head__header{ background-color: transparent; } .th.ia_table__head{ background-color: transparent; font-family: Noto; color: var(--color-label-1); font-weight: bold; } .ia_table__headContainer, .ia_table_footContainer { width: 100% !important; box-shadow: none; text-transform: capitalize; background-color: transparent; } .ia_inputField{ border: none; } .ia_tableComponent__selection { background-color: rgba(0, 174, 255, 0.35); } .ia_tableComponent__selection--root { border: none; margin-right: -4; } .psc-modern-table .ia_table__row:hover { color: orange; background-color: red; } .psc-modern-table .ia_pager__page--active { background-color: rgb(82,177,252); border: 1px solid var(--neutral-30); border-radius: 0; color: #555; } .psc-modern-table .tr.ia_table__row.ia_table__body__row.ia_tableComponent__body__row--hovered{ background-color: transparent !important; } .psc-modern-table .tr.ia_table__row.ia_table__body__row{ background-color: transparent !important; } .psc-modern-table empty-data-source{ background-color: transparent; } .psc-modern-table .tableFilter.ia_tableComponent__filterContainer{ background-color: var(--color-bk-2); max-height: 42px; } .psc-dashboard-card { background-color: var(--color-bk-0); box-shadow: 0 0 5px var(--color-shadow) !important; border-radius: 4px; } .psc-dashboard-header { font-family: sofia pro; font-size: 20px; }.psc-double-slider .ia_slider__rail { visibility: hidden; } .psc-double-slider .ia_slider__handle { border: none; border-radius: 0 !important; background-color: var(--callToAction); width: 5px !important; height: 18px !important; margin-left: -3px !important; margin-top: -7px !important; pointer-events: auto; } .psc-double-slider .ia_slider__track { border-radius: var(--borderRadius); background-color: var(--callToAction); height: 10px !important; margin-top: -3px !important; } .psc-double-slider .ia_slider__rail { border-radius: var(--borderRadius); background-color: var(--neutral-40); height: 10px !important; margin-top: -3px !important; } .psc-double-slider .ia_slider__handle--disabled { border-color: var(--border--disabled); background-color: var(--border--disabled); } .psc-widget-bk{ overflow: hidden; background-color: var(--color-bk-2); border-radius: 5px; box-shadow: 2px 2px 8px var(--color-bk-4); color: var(--color-label-0); font-weight: 400; font-family: D-DIN; font-size: 20px; text-align: center; } .psc-label{ color: var(--color-label-1); font-family: roboto; font-size: 12px; font-weight: 400; text-align: left; } .psc-title{ color: var(--color-label-1); font-family: roboto; font-size: 14px; font-weight: bold; text-align: left; } .psc-title-modern{ color: var(--color-label-0); font-family: Economica; font-size: 18px; font-weight: 100; text-align: left; text-indent: 10px; } .psc-readonly-input-field{ border-radius: 3px; background-color: var(--color-bk-1); font-size: 15px; } .psc-number{ color: var(--color-label-0); font-family: Economica; font-size: 20px; font-weight: 400; text-align: center; } .psc-led7seg-green{ color: var(--color-green); font-weight: 100; font-family: seven; font-size: 16; text-shadow: 0px 0px 4px var(--color-green); } .psc-led7seg-red{ color: red; font-weight: 100; font-family: seven; font-size: 16; text-shadow: 0px 0px 2px red; animation: led-blink 1s ease-in alternate infinite; } @keyframes led-blink{ from{ color: red; text-shadow: 0px 0px 4px red; } to{ color: #1C1C1C; text-shadow: 0px 0px 0px var(--color-bk-4); } } .psc-led7seg-off{ color: #1C1C1C; font-weight: bold; font-family: seven; font-size: 16; } .psc-icon-button{ cursor: pointer; fill: var(--color-icon-0); } .psc-icon-button-disable{ cursor: not-allowed; fill: var(--color-icon-disable); color: var(--color-icon-disable); filter: none; } .psc-icon-button:hover{ fill: #FFAE00; color: #FFAE00; transform: scale(1.15); } .psc-button-down:hover{ background-color: var(--color-hover); box-shadow: 2px 2px 8px inset var(--color-bk-4); } .psc-button-focus:focus{ outline: 1px solid #FFA109 !important; color: #FFA109 !important; } .psc-button-focus:focus{ outline: 2px solid #FFA109 !important; } .psc-hot-gradient{ background: repeating-linear-gradient(to right, #ff0000c4 0%, #fff0 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; color: rgba(255, 0, 0, 0.24); } .psc-cold-gradient{ background: repeating-linear-gradient(to right, #67B7DC 0%, #fff0 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; color:rgba(64, 169, 255, 0.349) } @keyframes return-air { 0% { offset-distance: 0%; offset-rotate: reverse; } 45% { offset-rotate: reverse; } 100% { offset-distance: 100%; offset-rotate: auto; } } @keyframes outside-air { 0% { offset-distance: 0%; } 100% { offset-distance: 100%; } } .psc-HVAC-device-tag { font-family: D-DIN-Condensed; font-size: 17px; text-align: center; color: var(--color-label-0); } .psc-HVAC-sensor-value { font-family: D-DIN-Condensed; font-size: 32px; font-weight: bold; text-align: center; color: var(--color-blue); } .psc-HVAC-sensor-unit { font-family: D-DIN-Condensed; font-size: 24px; margin: 5px 0 0 5px; text-align: left; color: var(--color-label-1); } .psc-HVAC-slider .ia_slider__handle{ border-radius: 5px; background-color: var(--color-blue); transform: scale(1.2, 1); border: solid 3px; } .psc-HVAC-slider .ia_slider__step__dot { border: 0px solid var(--border); background-color: transparent; } .psc-HVAC-slider-V .ia_slider__handle{ border-radius: 5px; background-color: var(--color-bk-0); transform: scale(1.5, 1.5); border: solid 4px; } .psc-HVAC-card{ overflow: hidden; background-color: #32373ed5; border-radius: 3px; box-shadow: 2px 2px 7px var(--color-bk-3); } .psc-HVAC-button { cursor: pointer; filter: drop-shadow(1px 1px 2px black); transform: scale(1) rotate(0deg); transition: 1s; } .psc-HVAC-button:hover { transform: scale(1.2) rotate(180deg); filter: drop-shadow(1px 1px 5px black); }.psc-pipe-grow { stroke-dasharray: 100%; stroke-dashoffset: 100%; animation: pipe-grow 7s linear forwards 1s; cursor: pointer; } @keyframes pipe-grow { 100% {stroke-dashoffset: 0%; } } @keyframes glow { 0% { transform: scale(1.0); } 40% { transform: scale(1.2); } 60% { transform: scale(1.2); } 100% { transform: scale(1.0); } } @keyframes glow2 { 0% { transform: scale(1.0); } 40% { transform: scale(1.2); } 60% { transform: scale(1.2); } 100% { transform: scale(1.0); } } .psc-card-root{ background-color: transparent; overflow: visible !important; transform: scale(1.0); transition: all 0.8s; transform-origin: 50% 50%; z-index: 0 !important; } .psc-card-3d{ transform-style: preserve-3d; transition: transform 0.1s; overflow: visible !important; } .psc-card-side{ -webkit-backface-visibility: hidden; backface-visibility: hidden; border-radius: 5px; overflow: visible !important; } .psc-card-root2{ background-color: transparent; overflow: visible !important; transform: scale(1.0); transition: all 0.8s; transform-origin: 50% 50%; z-index: 0 !important; } .psc-card-root2:hover { animation: glow 0.8s ease-out 1 forwards; z-index: 111111111111111111111199999999999999999999999999999 !important; overflow: visible !important; -webkit-font-smoothing: subpixel-antialiased; } .psc-card-3d2{ transform-style: preserve-3d; transition: transform 0.8s; overflow: visible !important; } .psc-card-3d2:hover{ transform: rotateY(180deg) !important; transition-delay: 0.6s; overflow: visible !important; }.psc-sld-grid-en { stroke: var(--color-en); width: 2; filter: drop-shadow(0 0 6px orange); transition: 0.1s linear; } .psc-sld-grid-de { stroke: var(--color-de); width: 3; filter: none; transition: 0.1s linear; } .psc-sld-cb_on_en{ border: solid 3px var(--color-en); background-color: var(--color-bk-en); box-shadow: 0 0 8px var(--color-en); transition: 0.5s linear; } .psc-sld-cb_on_de{ border: solid 3px var(--color-de); background-color: var(--color-bk-de); transition: 0.5s linear; } .psc-sld-cb_off_en{ border: solid 3px var(--color-en); box-shadow: 0 0 8px var(--color-en); transition: 0.5s linear; } .psc-sld-cb_off_de{ border: solid 3px var(--color-de); transition: 1s; } .psc-sld-flt{ border: solid 2px rgb(187, 0, 0); box-shadow: 0 0 5px red; animation: flt 0.7s linear alternate infinite; } @keyframes flt{ 0% { background-color: rgba(207, 0, 0, 0.795); } 100% { } } .psc-sld-cb__trl{ border: solid 2px var(--color-en); box-shadow: 0 0 5px var(--color-en); animation: trl 0.7s linear alternate infinite; } @keyframes trl{ 0% { background-color: var(--color-bk-en); } 100% { } } .psc-sld-value { font-family: D-DIN; font-weight: 400; font-size: 13px; cursor: pointer; overflow: visible; } .psc-sld-info { font-family: D-DIN; font-weight: bold; font-size: 10px; overflow: visible; color: var(--color-label-2) } .psc-load_on{ fill: var(--color-en); filter: drop-shadow(0 0 5px var(--color-en)); } .psc-load_off{ fill: var(--color-de); } .psc-icon-normal{ cursor: pointer; filter: drop-shadow(0 0 5px #FFFFFFA0); transition: 0.5s; } .psc-icon-normal:hover{ transform: scale(1.3); } .psc-icon-alarm{ cursor: pointer; animation: alarming 0.7s linear alternate infinite; } .psc-pid-input{ font-family: D-DIN; color: var(--color-label-0); font-size: 16px; border: solid 2px #779BB9; background-color: transparent; border-radius: 4px; } .psc-pid-input:hover{ font-family: D-DIN; color: var(--color-label-0); font-size: 16px; background-color: #9bd2ff; font-weight: bold; } .psc-pid-number{ color: var(--color-label-0); font-family: D-DIN; font-size: 14px; text-align: center; font-weight: 500; white-space: pre-wrap; } .psc-pid-unit{ color: var(--color-label-1); font-family: D-DIN; font-size: 11px; text-align: center; white-space: pre-wrap; } .psc-pid-number2{ color: var(--color-label-0); font-family: sofia pro; font-size: 16px; text-align: center; } .psc-pid-number-gauge{ color: var(--color-blue); font-family: D-DIN; font-size: 17px; text-align: center; font-weight: bold; white-space: pre-wrap; } .psc-pid-unit{ color: var(--color-label-1); font-family: D-DIN; font-size: 8px; text-align: center; white-space: pre-wrap; } .psc-pid-icon{ color: var(--color-label-0); cursor: pointer; fill: var(--color-label-0); transition: transform 0.5s; pointer-events: auto; } .psc-pid-icon:hover{ transform: scale(1.1); color: var(--callToAction); filter: drop-shadow(0 0 3px var(--color-shadow) ); fill: var(--color-select); transform: rotate(360deg) !important; } .psc-pid-icon_ver{ margin-bottom: 5px; } .psc-pid-icon_hor{ margin-right: 5px; } .psc-pid-icon-alarm-ack{ color: #D90000; fill: #D90000; } .psc-pid-icon-alarm-unack{ color: var(--color-label-1); fill: var(--color-label-1); animation: alarming 1s ease infinite alternate; } @keyframes alarming { 100% { fill: #D90000; color: #D90000;} } @keyframes belt { 0% { stroke-dashoffset: 0; } 100% { stroke-dashoffset: -168; } } .psc-pid-nav_right{ background-color: #747C81; border: none; border-bottom-right-radius: 20px; border-top-right-radius: 20px; color: white; font-size: 11px; font-family: D-DIN; font-weight: normal; } .psc-pid-nav_left{ background-color: #747C81; border: none; border-bottom-left-radius: 20px; border-top-left-radius: 20px; color: white; font-size: 11px; font-family: D-DIN; font-weight: normal; } .psc-pid-nav_left:hover{ background-color: #FFA109; } .psc-pid-nav_right:hover{ background-color: #FFA109; } .psc-button-focus:focus{ outline: 1px solid #FFA109 !important; color: #FFA109 !important; } .psc-pid-bk{ background: var(--color-pid-bk); animation: view-load 1.5s ease-out 1 forwards; } .psc-pid-tag{ color: var(--color-label-0); font-family: Roboto; font-size: 12px; font-weight: bold; text-align: center; white-space: pre-wrap; } .psc-pid-label{ color: var(--color-label-0); font-family: Roboto; font-size: 12px; text-align: center; white-space: pre-wrap; } .psc-pid-label_active{ cursor: pointer; } .psc-pid-label_disable{ color: #D5D5D5; cursor: pointer; } .psc-pid-label-button{ color: var(--color-label-0); font-family: Roboto; font-size: 12px; text-align: center; white-space: pre-wrap; cursor: pointer; } .psc-pid-label-button:hover{ color: var(--color-select); font-family: Roboto; font-weight: bold; font-size: 12px; text-align: center; white-space: pre-wrap; } .psc-pid-label-button__deactive{ color: var(--color-tr-4); font-family: Roboto; font-size: 12px; text-align: center; white-space: pre-wrap; cursor: pointer; } .psc-pid-page-title{ color: var(--color-label-0); font-family: Oswald; font-size: 16px; font-weight: 500; text-align: center; } .psc-pid-title{ color: var(--color-label-0); font-family: "Noto Sans"; font-size: 14px; font-weight: bold; text-align: left; } .psc-pid-liner{ border-bottom: solid 2px var(--color-tr-3); max-height: 10px; } .psc-pid-7seg{ color: var(--color-label-0); font-family: seven, Roboto; font-size: 13px; text-align: center; border-style: solid; border-radius: 10px; border-width: 1px; } .psc-pid-tab-active{ color: var(--color-label-0); font-family: Roboto; font-weight: bold; font-size: 12px; min-width: 100px; background-color: #F4F4F4; } .psc-pid-AI-number{ border-radius: 12px; font-family: Roboto; color: #555555; background-color: var(--color-tr-2); font-size: 12px; text-align: center; cursor: pointer; } .psc-pid-AI-sensor{ border-radius: 50%; font-family: Roboto; color: var(--color-label-0); background-color: var(--color-pid-bk); border-style: solid; font-size: 10px; font-weight: bold; border-color: var(--color-pid-oil); border-width: 1.5px; text-align: center; cursor: pointer; } .psc-pid-DI-sensor{ border-radius: 50%; font-family: Roboto; color: #555555; background-color: #D5D5D5; border-style: solid; font-size: 8px; font-weight: bold; border-color: #555555; border-width: 1.5px; text-align: center; cursor: pointer; } .psc-pid-air-vessel{ border-style: solid; background-image: linear-gradient(0deg, #E3EDED 0%, #F1F1F1 100%); border-radius: 70px; border-width: 2px; background-color: #F1F1F1; border-color: #555555; } .psc-pid-slider .ia_slider__handle{ border-radius: 3px; border: solid 4px var(--color-pid-popup); background-color: var(--color-label-1); } .psc-pid-slider .ia_slider__handle:hover{ background-color: var(--color-blue); transform: scale(1.2); transition: 300ms; }.psc-solar-panel{ overflow: visible !important; transform: scale(1.0); transition: all 0.5s; transform-origin: 50% 50%; z-index: 0 !important; cursor: pointer; stroke: white; stroke-dasharray: 900; transform: translateZ(0); } .psc-solar-panel > text { pointer-events: none; text-anchor: middle; fill: white; font-family: D-DIN; stroke-width: 0; } .psc-solar-panel:hover { transform: scale(1.15); z-index: 99999999999999999999999999999999999 !important; overflow: visible !important; -webkit-font-smoothing: subpixel-antialiased; fill: red !important; stroke: orange !important; stroke-dashoffset: 1800; transform: translate(50); } .psc-cal-item { font-size: 13px; text-align: center; border-radius: 50%; cursor: pointer; height: 36px; } .psc-cal-item--selected { color: white; background-color: var(--callToAction); } .psc-cal-item--unselected { color: #555; background-color: var(--color-tr-1); }:root { --color-base: #F2F4F7; --color-bk-4: #CCD2D8; --color-bk-3: #E9ECEF; --color-bk-2: #F0F0F0; --color-bk-1: #f6f6f6; --color-bk-0: #f9fbf8; --color-bk-input: #f9fbfc70; --color-tr-4: #a8b2b655; --color-tr-3: #becacf55; --color-tr-2: #d6e0e455; --color-tr-1: #E2EDF255; --color-tr-0: #EEF3F655; --color-grid: lightgray; --color-label-0: #555555; --color-label-1: #797979; --color-label-2: #919caa; --color-icon-0: #555; --color-icon-1: #555; --color-icon-disable:lightgray; --color-hover: #FF9200; --color-select: #00aaff; --color-select-shadow: #7ab5e2; --color-shadow: rgb(216, 216, 216); --color-hi-gas: #ff3c00d7; --color-in-gas: #ffa600da; --color-lo-gas: #ffae00dc; --color-header-1: #EEF3F5; --color-header-2: #DCE4E8; --color-border: lightgray; --color-slider-bk: #d9dce66e; --color-disable: #a3b4bb55; }@font-face { font-family: "Arimo"; src: url("/data/perspective/fonts/Arimo.woff2"); } @font-face { font-family: "Economica"; src: url("/data/perspective/fonts/Economica-Regular-OTF.woff"); } @font-face { font-family: "Rye"; src: url("/data/perspective/fonts/Rye-Regular.woff2"); } @font-face { font-family: "Wallpoet"; src: url("/data/perspective/fonts/wallpoet-regular.woff"); }