Universal Theme 2 Core Variables

Universal Theme 2 Core Variables

Total variables detected in Core.css: 1068


This document outlines a list of CSS variables detected in various Universal Theme production files, and their values across various selectors. Each variable is labeled with a prefix, followed by the component name, and the corresponding CSS property for the variable:

--{prefix}-{component-name}-{css-property}

The following variable prefixes are interpreted as follows:

Variable Prefix Description
--ut, --u Variables used across Universal Theme 2 components.
--a Variables imported from App UI.
--oj Variables used in Oracle JavaScript Extension Toolkit components (JET).
--jui Variables used in jQuery components.
--fc, --fc3 Variables used in Full Calendar components (v3 & v5).
--rw Variables used in Redwood components.

--js-mq-xs

Selector Value Color
:root 480px

--js-mq-sm

Selector Value Color
:root 640px

--js-mq-md

Selector Value Color
:root 768px

--js-mq-lg

Selector Value Color
:root 992px

--js-mq-xl

Selector Value Color
:root 1200px

--js-mq-xxl

Selector Value Color
:root 1400px

--js-sticky-top

Selector Value Color
:root 0px
.t-Body-title 0px
.t-Body-actions 0px
.t-TreeNav 0px

--js-page-title-height

Selector Value Color
:root 0px
.t-Body-side 0px

--ut-color-scheme

Selector Value Color
:root normal

--a-base-font-family

Selector Value Color
:root system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif

--a-base-font-family-serif

Selector Value Color
:root "Iowan Old Style", "Apple Garamond", Baskerville, "Times New Roman", "Droid Serif", Times, "Source Serif Pro", serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"

--a-base-font-family-mono

Selector Value Color
:root ui-monospace, 'Menlo', 'Consolas', mono-space, monospace
code, pre monospace
.t-Alert--page .htmldbOraErr monospace

--a-base-link-text-color

Selector Value Color
:root var(--ut-link-text-color)

--a-palette-primary

Selector Value Color
:root var(--ut-palette-primary)

--a-palette-primary-contrast

Selector Value Color
:root var(--ut-palette-primary-contrast)

--a-palette-primary-shade

Selector Value Color
:root var(--ut-palette-primary-shade)

--a-palette-danger

Selector Value Color
:root var(--ut-palette-danger)

--a-palette-danger-contrast

Selector Value Color
:root var(--ut-palette-danger-contrast)

--a-palette-danger-shade

Selector Value Color
:root var(--ut-palette-danger-shade)

--a-palette-warning

Selector Value Color
:root var(--ut-palette-warning)

--a-palette-warning-contrast

Selector Value Color
:root var(--ut-palette-warning-contrast)

--a-palette-warning-shade

Selector Value Color
:root var(--ut-palette-warning-shade)

--a-palette-success

Selector Value Color
:root var(--ut-palette-success)

--a-palette-success-contrast

Selector Value Color
:root var(--ut-palette-success-contrast)

--a-palette-success-shade

Selector Value Color
:root var(--ut-palette-success-shade)

--a-palette-info

Selector Value Color
:root var(--ut-palette-info)

--a-palette-info-contrast

Selector Value Color
:root var(--ut-palette-info-contrast)

--a-palette-info-shade

Selector Value Color
:root var(--ut-palette-info-shade)

--a-popuplov-dialog-background-color

Selector Value Color
:root var(--jui-dialog-background-color)

--a-iconlist-item-hover-text-color

Selector Value Color
:root var(--a-menu-focused-text-color)

--a-iconlist-item-hover-background-color

Selector Value Color
:root var(--a-menu-focused-background-color)

--jui-dialog-border-width

Selector Value Color
:root 0px

--jui-dialog-title-close-border-radius

Selector Value Color
:root var(--a-button-border-radius, 2px)

--jui-dialog-content-padding-y

Selector Value Color
:root 0px
.t-Dialog-page--wizard 0px
.ui-dialog--markdown 12px
.ui-dialog--inline 0px
.a-IRR-dialogBody 12px

--jui-dialog-content-padding-x

Selector Value Color
:root 0px
.t-Dialog-page--wizard 0px
.ui-dialog--markdown 16px
.ui-dialog--inline 0px
.a-IRR-dialogBody 12px

--ut-base-font-family

Selector Value Color
body sans-serif

--ut-base-font-size

Selector Value Color
body 14px

--ut-focus-outline-color

Selector Value Color
* -webkit-focus-ring-color

--ut-focus-outline

Selector Value Color
*:focus -webkit-focus-ring-color
button:-moz-focusring, button::-moz-focus-inner, .a-Button:-moz-focusring, .a-Button::-moz-focus-inner, .a-Toolbar-selectList:-moz-focusring, .a-Toolbar-selectList::-moz-focus-inner, .a-IRR-selectList:-moz-focusring, .a-IRR-selectList::-moz-focus-inner -webkit-focus-ring-color
.a-Toolbar-radioGroup input:focus + .a-Button, .a-Toolbar-toggleButton input:focus + .a-Button -webkit-focus-ring-color
.a-IRR-controlsCheckbox:focus + .a-IRR-controlsCheckboxLabel:before, .a-IG-controlsCheckbox:focus + .a-IG-controlsCheckboxLabel:before -webkit-focus-ring-color
.a-IRR-headerLink:focus -webkit-focus-ring-color
.a-CardView-fullLink:focus -webkit-focus-ring-color
.apex-item-text:focus, .apex-item-text:focus-within, .apex-item-select:focus, .apex-item-select:focus-within, .apex-item-textarea:focus, .apex-item-textarea:focus-within, .u-TF-item--text:focus, .u-TF-item--text:focus-within, .u-TF-item--select:focus, .u-TF-item--select:focus-within, select.listmanager:focus, select.listmanager:focus-within, select.group_selectlist:focus, select.group_selectlist:focus-within, .apex-item-multi:focus, .apex-item-multi:focus-within, .datetimepicker_newMonth:focus, .datetimepicker_newMonth:focus-within -webkit-focus-ring-color
.apex-item-file:focus + .apex-item-filedrop -webkit-focus-ring-color
.apex-item-wrapper--color-picker:focus-within .apex-item-group--color-picker -webkit-focus-ring-color
.apex-item-group--popup-lov:focus-within -webkit-focus-ring-color
.apex-item-multi-item.is-active > span -webkit-focus-ring-color
.apex-item-multi .apex-item-popup-lov none
.a-Switch input[type=checkbox]:focus + .a-Switch-toggle -webkit-focus-ring-color
.a-StarRating-stars.is-focused -webkit-focus-ring-color
.apex-item-wrapper--date-picker-jet .oj-text-field.oj-focus .oj-text-field-container -webkit-focus-ring-color
.apex-item-wrapper--date-picker-jet .oj-datepicker-inline + .oj-inputdatetime-time-only .oj-text-field-input.oj-inputdatetime-input:focus -webkit-focus-ring-color
body .ck.ck-editor__editable:not(.ck-editor__nested-editable).ck-focused -webkit-focus-ring-color

--ut-overlay-background-color

Selector Value Color
.apex_wait_overlay rgba(255, 255, 255, 0.5)

--ut-nodata-padding

Selector Value Color
.nodatafound 12px

--ut-nodata-font-size

Selector Value Color
.nodatafound 11px

--a-base-font-weight-semibold

Selector Value Color
h1, h2, h3, h4, h5, h6 500
.t-Login-title 500
.t-NavTabs-label 500
.t-Timeline-title 500
.t-Region-header 500
.t-ClassicCalendar-title 500
.t-ClassicCalendar--weekly .t-ClassicCalendar-timeCol, .t-ClassicCalendar--daily .t-ClassicCalendar-timeCol 500
.fc-toolbar h2 500
.ui-datepicker .ui-datepicker-title 500

--ut-grid-gutter-width

Selector Value Color
.no-gutters 0px
.col 8px
.col 8px
.row .col.col-start 8px
.row .col.col-start 8px
.row .col.col-end 8px
.row .col.col-end 8px
.t-Login-container 8px
.t-Login-container 8px
.t-Form--noPadding, .t-Form-fieldContainer--noPadding 0px
.t-Form--slimPadding, .t-Form-fieldContainer--slimPadding 4px

--ut-layout-transition

Selector Value Color
:root .1s
.t-Header, .t-Header-branding, .t-Body-main, .t-Body-title, .t-Body-actions, .t-Body-nav, .t-Body-side, .t-Body-content, .t-Button.t-Button--header 0.1s
.no-anim .t-Header, .no-anim .t-Header-branding, .no-anim .t-Body-main, .no-anim .t-Body-title, .no-anim .t-Body-actions, .no-anim .t-Body-nav, .no-anim .t-Body-side, .no-anim .t-Body-content, .no-anim .t-Button.t-Button--header none
.t-TreeNav .a-TreeView-toggle:before 0.1s eas
.t-TreeNav .a-TreeView-badge 0.1s eas

--ut-header-item-spacing

Selector Value Color
#t_Body_skipToContent:focus 8px
.t-Header-branding 8px
.t-MegaMenu--fullWidth:not(.js-menu-callout) 8px

--a-button-padding-y

Selector Value Color
#t_Body_skipToContent:focus 8p
.t-Login-buttons 16px
.t-Button--inlineLink 0px
.t-Button--tiny, .t-Button--xsmall 4px
.t-Button--small 4px
.t-Button--large 12px
.t-Button--xlarge 16px
.t-Button--xlarge.t-Button--withIcon 12px
.t-Button--hideShow 4px
.t-Button--headerTree 8px
.t-Dialog-page--wizard .ui-dialog-buttonpane 10px
.t-Button--closeAlert 4px
.a-IG-recordView .u-Form-fieldContainer .t-Button--helpButton, .a-IG-recordView .u-Form-fieldContainer .a-Button--helpButton 4px
.a-FS-search, .a-FS-filter 8px
.t-Form-fieldContainer--floatingLabel .a-Button 8px
.t-Form-itemWrapper .a-Button, .t-Form-itemWrapper .oj-inputdatetime-input-trigger 4px
.apex-item-file--native::-webkit-file-upload-button 4px

--a-button-border-radius

Selector Value Color
#t_Body_skipToContent:focus 2px
.t-Button, .t-Form-helpButton, .apex-item-file--native::-webkit-file-upload-button 2px
.t-Button--pill 0
.u-RTL .t-Button--pillStart 2px
.u-RTL .t-Button--pillStart 2px
.u-RTL .t-Button--pillEnd 2px
.u-RTL .t-Button--pillEnd 2px
.t-Button--header.t-Button--headerRight 0
.apex-button-group label, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc label 2px
.apex-button-group .apex-item-option:not(:last-of-type):not(:first-of-type) label, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc .apex-item-option:not(:last-of-type):not(:first-of-type) label 0
.u-RTL .t-Form-fieldContainer--radioButtonGroup .apex-item-grid .apex-item-grid-row:only-child .apex-item-option:first-of-type label 2px
.u-RTL .t-Form-fieldContainer--radioButtonGroup .apex-item-grid .apex-item-grid-row:only-child .apex-item-option:first-of-type label 2px
.u-RTL .t-Form-fieldContainer--radioButtonGroup .apex-item-grid .apex-item-grid-row:only-child .apex-item-option:last-of-type label 2px
.u-RTL .t-Form-fieldContainer--radioButtonGroup .apex-item-grid .apex-item-grid-row:only-child .apex-item-option:last-of-type label 2px
.t-Body-actionsToggle 2px
.u-RTL .t-Body-actionsToggle 2px
.u-RTL .t-Body-actionsToggle 2px
.apex-rds-hover a 2px
.t-Alert--page .t-Button.t-Button--closeAlert 24px
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor) 2px
.u-RTL .apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor) 2px
.u-RTL .apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor) 2px
.ui-datepicker .ui-datepicker-current, .ui-datepicker .ui-datepicker-close 2px
.apex-fullcalendar-5 .fc-button 2px

--a-button-font-weight

Selector Value Color
#t_Body_skipToContent:focus 400
.t-Button, .t-Form-helpButton, .apex-item-file--native::-webkit-file-upload-button 400
.t-Button--hot var(--a-base-font-weight-bold, 700)
.t-Body-actionsToggle 400
.apex-fullcalendar-5 .fc-button 400

--a-button-font-size

Selector Value Color
#t_Body_skipToContent:focus 12px
.t-Login-buttons 16px
.t-Button, .t-Form-helpButton, .apex-item-file--native::-webkit-file-upload-button 12px
.t-Button--tiny, .t-Button--xsmall 10px
.t-Button--small 11px
.t-Button--large 14px
.t-Button--xlarge 16px
.t-Button--hideShow 11px
.t-Body-actionsToggle 12px
.t-Dialog-page--wizard .ui-dialog-buttonpane 14px
.t-Report-paginationLink 12px
.apex-fullcalendar-5 .fc-button 12px

--a-button-line-height

Selector Value Color
#t_Body_skipToContent:focus 16px
.t-Login-buttons 16px
.t-Button, .t-Form-helpButton, .apex-item-file--native::-webkit-file-upload-button 16px
.t-Button--tiny, .t-Button--xsmall 12px
.t-Button--small 16px
.t-Button--large 16px
.t-Button--xlarge 16px
.t-Button--hideShow 14px
.t-Body-actionsToggle 16px
.t-Dialog-page--wizard .ui-dialog-buttonpane 16px
.t-Report-paginationLink 16px

--ut-nav-collapsed-width

Selector Value Color
.t-Body auto 1fr aut
.apex-side-nav.js-navCollapsed 0px
.apex-side-nav.js-navCollapsed.js-navCollapsed--hidden 0px
.apex-side-nav.js-navCollapsed .t-Body-nav 48px
.apex-side-nav.js-navCollapsed--icons auto

--ut-nav-initial-width

Selector Value Color
.t-Body-nav 0
.js-navExpanded var(--ut-nav-width, 240px)

--ut-body-title-border-width

Selector Value Color
.t-Body-title 1px
.t-Body-title:empty 0px

--ut-body-sidebar-width

Selector Value Color
.t-Body-side 240px
.t-PageBody--hideLeft 0px

--ut-body-info-background-color

Selector Value Color
.t-Body-info var(--ut-body-title-background-color)
.t-PageBody--masterDetail .apex-rds-container var(--ut-body-title-background-color)

--ut-body-info-text-color

Selector Value Color
.t-Body-info var(--ut-body-title-text-color)

--ut-body-content-padding-y

Selector Value Color
.t-Body-contentInner 16px
.t-Body-contentInner 16px
.t-Body-contentInner var(--ut-xs-body-content-padding-y, 8px)
.t-PageBody--noContentPadding 0

--ut-body-content-padding-x

Selector Value Color
.t-Body-contentInner 16px
.t-Body-contentInner 16px
.t-Body-contentInner var(--ut-xs-body-content-padding-x, 8px)
.t-PageBody--noContentPadding 0

--ut-body-content-width

Selector Value Color
.t-Body-contentInner 100%

--ut-body-actions-width

Selector Value Color
.t-Body-actions 200px
.js-rightCollapsed .t-Body-actions 0px
.t-PageBody--hideActions 0px

--ut-button-region-padding

Selector Value Color
.js-rightCollapsed .t-Body-actions .t-ButtonRegion 0px
.t-ButtonRegion-col--left .t-ButtonRegion-buttons 16px
.t-ButtonRegion-col--content 16px
.t-ButtonRegion-col--right .t-ButtonRegion-buttons 16px
.t-ButtonRegion--slimPadding 8px
.t-ButtonRegion--noPadding 0px
.t-Body-actions .t-ButtonRegion 6px
.t-Body-actions .t-ButtonRegion .t-ButtonRegion-wrap 6px
.t-Body-actions .t-ButtonRegion .t-ButtonRegion-col 6px

--ut-nav-width

Selector Value Color
.t-PageBody--noNav 0px
.t-MegaMenu--layout2Cols .t-MegaMenu-item--top, .t-MegaMenu--layout3Cols .t-MegaMenu-item--top, .t-MegaMenu--layout4Cols .t-MegaMenu-item--top, .t-MegaMenu--layout5Cols .t-MegaMenu-item--top 240px

--ut-body-title-box-shadow

Selector Value Color
.t-PageBody--masterDetail .t-Body-title none

--ut-xs-body-content-padding-y

Selector Value Color
.t-PageBody--noContentPadding 0

--ut-xs-body-content-padding-x

Selector Value Color
.t-PageBody--noContentPadding 0

--ut-body-background-color

Selector Value Color
.t-PageBody--login var(--ut-login-page-background-color)
.t-LoginPage--bg1, .t-LoginPage--bg2, .t-LoginPage--bg3 var(--ut-palette-primary)

--ut-login-region-max-width

Selector Value Color
.t-PageBody--login .t-Body-alert 460px
.t-Login-region 460px
.t-LoginPage--split .t-Login-container 460px

--ut-login-container-item-spacing

Selector Value Color
.t-Login-container 16px

--ut-field-padding-x

Selector Value Color
.t-Login-region 0px
.t-Form-labelContainer 8px
.t-Form-labelContainer 8px
.t-Form-inputContainer 8px
.t-Form-inputContainer 8px
.t-Form--noPadding, .t-Form-fieldContainer--noPadding 0px
.t-Form--slimPadding, .t-Form-fieldContainer--slimPadding 4px
.t-Form-labelContainer--hiddenLabel.col-0, .t-Form-labelContainer--hiddenLabel.col-null 0
.t-Form-fieldContainer--floatingLabel.t-Form-fieldContainer 8px
.t-Form-fieldContainer--floatingLabel.t-Form-fieldContainer 8px

--ut-field-padding-y

Selector Value Color
.t-Login-region 16px
.t-Form-labelContainer 8px
.t-Form-labelContainer 8px
.t-Form-inputContainer 8px
.t-Form-inputContainer 8px
.t-Form--noPadding, .t-Form-fieldContainer--noPadding 0px
.t-Form--slimPadding, .t-Form-fieldContainer--slimPadding 4px
.t-Form-labelContainer--hiddenLabel.col-0, .t-Form-labelContainer--hiddenLabel.col-null 0
.container > .row > .col:first-child > .t-Form-fieldContainer--hiddenLabel 8px
.t-Form-fieldContainer--floatingLabel.t-Form-fieldContainer 8px
.t-Form-fieldContainer--floatingLabel.t-Form-fieldContainer 8px

--ut-field-input-icon-padding-y

Selector Value Color
.t-Login-region 12px
.a-FS-search, .a-FS-filter 8px
.a-FS-search span.apex-item-icon, .a-FS-filter span.apex-item-icon 4p
.apex-item-icon 4p

--ut-field-input-icon-padding-x

Selector Value Color
.t-Login-region 12px
.a-FS-search, .a-FS-filter 8px
.t-Form-fieldContainer--floatingLabel 8px
.apex-item-color-picker-preview 4px

--ut-login-region-padding

Selector Value Color
.t-Login-region 32px

--ut-login-region-background-color

Selector Value Color
.t-Login-region var(--ut-component-background-color)
.t-LoginPage--split .t-Login-container var(--ut-component-background-color)

--ut-login-region-border-width

Selector Value Color
.t-Login-region 1px

--ut-login-region-border-color

Selector Value Color
.t-Login-region var(--ut-component-border-color)

--ut-login-region-border-radius

Selector Value Color
.t-Login-region 8px

--ut-login-region-box-shadow

Selector Value Color
.t-Login-region var(--ut-component-box-shadow)

--ut-login-logo-size

Selector Value Color
.t-Login-logo 64px
.t-Login-logo 64px
.t-Login-logo 64px

--ut-login-logo-font-size

Selector Value Color
.t-Login-logo 32px
.apex-icons-fontawesome .t-Login-logo 28px

--ut-login-logo-border-radius

Selector Value Color
.t-Login-logo 4px

--ut-app-icon-background-color

Selector Value Color
.t-Login-logo var(--ut-component-icon-background-color)

--ut-app-icon-color

Selector Value Color
.t-Login-logo var(--ut-component-icon-color)

--a-button-padding-x

Selector Value Color
.t-Login-buttons 24px
.t-Button--icon.t-Button--slim 8px
.t-Button--inlineLink 0px
.t-Button--tiny, .t-Button--xsmall 6px
.t-Button--small 8px
.t-Button--large 16px
.t-Button--xlarge 20px
.t-Button--xlarge.t-Button--withIcon 14px
.t-Button--hideShow 4px
.t-Button--header 8px
.t-Button--headerTree 8px
.t-Dialog-page--wizard .ui-dialog-buttonpane 8px
.t-Button--closeAlert 4px
.a-IG-recordView .u-Form-fieldContainer .t-Button--helpButton, .a-IG-recordView .u-Form-fieldContainer .a-Button--helpButton 4px
.a-FS-search, .a-FS-filter 12px
.t-ConfigPanel-actions .t-Button 16px
.t-Form-fieldContainer--floatingLabel .a-Button 12px
.t-Form-itemWrapper .a-Button, .t-Form-itemWrapper .oj-inputdatetime-input-trigger 8px
.apex-item-file--native::-webkit-file-upload-button 8px
.apex-button-group 12px

--ut-component-border-color) 0 0 0 var(--ut-component-border-width)

Selector Value Color
.t-LoginPage--split .t-Login-container var(--ut-component-box-shadow

--a-icon-padding

Selector Value Color
.t-Login-body 12px
.t-Login-body .apex-item-icon 12px
.t-Form-fieldContainer--floatingLabel.apex-item-wrapper--color-picker 8px
.u-RTL .apex-item-color-picker-preview 4px

--a-icon-size

Selector Value Color
.t-Login-body 16px
.t-Button .a-Icon var(--a-button-icon-size)
.t-Footer-topButton 16px
.a-Region-carouselControl .a-Tabs-button var(--ut-carousel-button-icon-size, 20px)
.t-ConfigPanel-icon 48px
.t-ConfigPanel-icon:before 32px
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor) 16px
.t-Validation-icon .a-Icon var(--ut-valiation-icon-size, 24px)
.t-Validation-icon .a-Icon:before 16px

--a-field-input-font-size

Selector Value Color
.t-Login-body 16px
.t-Form-fieldContainer--floatingLabel .apex-item-display-only 12px
.apex-item-display-only inherit
.apex-item-text, .apex-item-select, .apex-item-textarea, .u-TF-item--text, .u-TF-item--select, select.listmanager, select.group_selectlist, .apex-item-multi, .datetimepicker_newMonth 12px
.apex-item-file--native 12px
.apex-item-wrapper--date-picker-jet .oj-text-field, .apex-item-wrapper--date-picker-jet .oj-inputdatetime, .apex-item-wrapper--date-picker-jet .oj-inputdatetime-date-only, .apex-item-wrapper--date-picker-jet .oj-inputdatetime-date-time, .apex-item-wrapper--date-picker-jet .oj-inputdatetime-time-only 12px
.apex-item-wrapper--date-picker-jet .oj-text-field-input 12px
.ui-datepicker .datetimepicker_newMonth 12px

--a-field-input-padding-x

Selector Value Color
.t-Login-body 8px
.t-Form-fieldContainer--floatingLabel 8px
.t-Form-fieldContainer--floatingLabel .t-Form-label 4px
.u-RTL .t-Form-fieldContainer--floatingLabel .t-Form-label 4px
.apex-item-file--native::-webkit-file-upload-button 4px
.apex-item-file--native::-webkit-file-upload-button 4px
.apex-item-multi .apex-item-popup-lov 0px

--a-button-border-width

Selector Value Color
.t-Button, .t-Form-helpButton, .apex-item-file--native::-webkit-file-upload-button 1px
.t-Button--inlineLink 0px
.apex-button-group label, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc label 1px
.apex-button-group input:focus + label, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input:focus + label 1px
.u-RTL .t-Body-actionsToggle 1px
.t-Button--headerTree 1px
.apex-rds-hover a 1px
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor) 1px
.u-RTL .apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor) 1px
.ui-datepicker .ui-datepicker-current, .ui-datepicker .ui-datepicker-close 1px
.apex-fullcalendar-5 .fc-button 1px

--a-button-cursor

Selector Value Color
.t-Button, .t-Form-helpButton, .apex-item-file--native::-webkit-file-upload-button pointer
.apex-button-group label, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc label pointer
.t-Body-actionsToggle pointer
.apex-rds-hover a pointer
.apex-fullcalendar-5 .fc-button pointer

--a-button-text-shadow

Selector Value Color
.t-Button, .t-Form-helpButton, .apex-item-file--native::-webkit-file-upload-button none
.apex-button-group label, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc label none
.t-Body-actionsToggle none
.apex-fullcalendar-5 .fc-button none

--a-button-state-background-color

Selector Value Color
.t-Button, .a-Button, .ui-button, .a-CardView-button, .apex-button-group label, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label, .t-Form-helpButton transparent
.t-Button:hover, .a-Button:hover, .ui-button:hover, .a-CardView-button:hover, .apex-button-group label:hover, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:hover, .t-Form-helpButton:hover var(--a-button-hover-background-color)
.t-Button.is-active, .t-Button.ui-state-active, .t-Button:active, .t-Button:active:focus, .a-Button.is-active, .a-Button.ui-state-active, .a-Button:active, .a-Button:active:focus, .ui-button.is-active, .ui-button.ui-state-active, .ui-button:active, .ui-button:active:focus, .a-CardView-button.is-active, .a-CardView-button.ui-state-active, .a-CardView-button:active, .a-CardView-button:active:focus, .apex-button-group label.is-active, .apex-button-group label.ui-state-active, .apex-button-group label:active, .apex-button-group label:active:focus, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label.is-active, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label.ui-state-active, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:active, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:active:focus, .t-Form-helpButton.is-active, .t-Form-helpButton.ui-state-active, .t-Form-helpButton:active, .t-Form-helpButton:active:focus var(--a-button-active-background-color, var(--a-button-hover-background-color))
.t-Button:focus, .a-Button:focus, .ui-button:focus, .a-CardView-button:focus, .apex-button-group label:focus, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:focus, .t-Form-helpButton:focus var(--a-button-focus-background-color)
.apex-item-file--native::-webkit-file-upload-button transparent
.apex-item-file--native::-webkit-file-upload-button:hover var(--a-button-hover-background-color)
.apex-item-file--native::-webkit-file-upload-button.is-active, .apex-item-file--native::-webkit-file-upload-button.ui-state-active, .apex-item-file--native::-webkit-file-upload-button:active, .apex-item-file--native::-webkit-file-upload-button:active:focus var(--a-button-active-background-color, var(--a-button-hover-background-color))
.apex-item-file--native::-webkit-file-upload-button:focus var(--a-button-focus-background-color)
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor) transparent
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-disabled):hover var(--a-button-hover-background-color)
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-disabled):active var(--a-button-active-background-color, var(--a-button-hover-background-color))
.apex-fullcalendar-5 .fc-button-primary.fc-button-active, .apex-fullcalendar-5 .fc-button-primary.fc-button-active:disabled transparent
.apex-fullcalendar-5 .fc-button-primary.fc-button-active, .apex-fullcalendar-5 .fc-button-primary.fc-button-active:disabled var(--a-button-active-background-color, var(--a-button-hover-background-color))

--a-button-state-text-color

Selector Value Color
.t-Button, .a-Button, .ui-button, .a-CardView-button, .apex-button-group label, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label, .t-Form-helpButton inherit
.t-Button:hover, .a-Button:hover, .ui-button:hover, .a-CardView-button:hover, .apex-button-group label:hover, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:hover, .t-Form-helpButton:hover var(--a-button-hover-text-color)
.t-Button.is-active, .t-Button.ui-state-active, .t-Button:active, .t-Button:active:focus, .a-Button.is-active, .a-Button.ui-state-active, .a-Button:active, .a-Button:active:focus, .ui-button.is-active, .ui-button.ui-state-active, .ui-button:active, .ui-button:active:focus, .a-CardView-button.is-active, .a-CardView-button.ui-state-active, .a-CardView-button:active, .a-CardView-button:active:focus, .apex-button-group label.is-active, .apex-button-group label.ui-state-active, .apex-button-group label:active, .apex-button-group label:active:focus, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label.is-active, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label.ui-state-active, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:active, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:active:focus, .t-Form-helpButton.is-active, .t-Form-helpButton.ui-state-active, .t-Form-helpButton:active, .t-Form-helpButton:active:focus var(--a-button-active-text-color, var(--a-button-hover-text-color))
.t-Button:focus, .a-Button:focus, .ui-button:focus, .a-CardView-button:focus, .apex-button-group label:focus, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:focus, .t-Form-helpButton:focus var(--a-button-focus-text-color)
.apex-item-file--native::-webkit-file-upload-button inherit
.apex-item-file--native::-webkit-file-upload-button:hover var(--a-button-hover-text-color)
.apex-item-file--native::-webkit-file-upload-button.is-active, .apex-item-file--native::-webkit-file-upload-button.ui-state-active, .apex-item-file--native::-webkit-file-upload-button:active, .apex-item-file--native::-webkit-file-upload-button:active:focus var(--a-button-active-text-color, var(--a-button-hover-text-color))
.apex-item-file--native::-webkit-file-upload-button:focus var(--a-button-focus-text-color)
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor) inherit
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-disabled):hover var(--a-button-hover-text-color)
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-disabled):active var(--a-button-active-text-color, var(--a-button-hover-text-color))
.apex-fullcalendar-5 .fc-button-primary.fc-button-active, .apex-fullcalendar-5 .fc-button-primary.fc-button-active:disabled inherit
.apex-fullcalendar-5 .fc-button-primary.fc-button-active, .apex-fullcalendar-5 .fc-button-primary.fc-button-active:disabled var(--a-button-active-text-color, var(--a-button-hover-text-color))

--a-button-state-border-color

Selector Value Color
.t-Button, .a-Button, .ui-button, .a-CardView-button, .apex-button-group label, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label, .t-Form-helpButton var(--a-button-border-color)
.t-Button:hover, .a-Button:hover, .ui-button:hover, .a-CardView-button:hover, .apex-button-group label:hover, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:hover, .t-Form-helpButton:hover var(--a-button-hover-border-color)
.t-Button.is-active, .t-Button.ui-state-active, .t-Button:active, .t-Button:active:focus, .a-Button.is-active, .a-Button.ui-state-active, .a-Button:active, .a-Button:active:focus, .ui-button.is-active, .ui-button.ui-state-active, .ui-button:active, .ui-button:active:focus, .a-CardView-button.is-active, .a-CardView-button.ui-state-active, .a-CardView-button:active, .a-CardView-button:active:focus, .apex-button-group label.is-active, .apex-button-group label.ui-state-active, .apex-button-group label:active, .apex-button-group label:active:focus, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label.is-active, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label.ui-state-active, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:active, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:active:focus, .t-Form-helpButton.is-active, .t-Form-helpButton.ui-state-active, .t-Form-helpButton:active, .t-Form-helpButton:active:focus var(--a-button-active-border-color, var(--a-button-hover-border-color))
.t-Button:focus, .a-Button:focus, .ui-button:focus, .a-CardView-button:focus, .apex-button-group label:focus, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:focus, .t-Form-helpButton:focus var(--a-button-focus-border-color)
.apex-item-file--native::-webkit-file-upload-button var(--a-button-border-color)
.apex-item-file--native::-webkit-file-upload-button:hover var(--a-button-hover-border-color)
.apex-item-file--native::-webkit-file-upload-button.is-active, .apex-item-file--native::-webkit-file-upload-button.ui-state-active, .apex-item-file--native::-webkit-file-upload-button:active, .apex-item-file--native::-webkit-file-upload-button:active:focus var(--a-button-active-border-color, var(--a-button-hover-border-color))
.apex-item-file--native::-webkit-file-upload-button:focus var(--a-button-focus-border-color)
.apex-item-text.apex-page-item-error + .a-Button, .apex-item-select.apex-page-item-error + .a-Button, .apex-item-textarea.apex-page-item-error + .a-Button, .u-TF-item--text.apex-page-item-error + .a-Button, .u-TF-item--select.apex-page-item-error + .a-Button, select.listmanager.apex-page-item-error + .a-Button, select.group_selectlist.apex-page-item-error + .a-Button, .apex-item-multi.apex-page-item-error + .a-Button, .datetimepicker_newMonth.apex-page-item-error + .a-Button var(--ut-palette-danger)
.apex-item-text.apex-page-item-error:required:valid + .a-Button, .apex-item-select.apex-page-item-error:required:valid + .a-Button, .apex-item-textarea.apex-page-item-error:required:valid + .a-Button, .u-TF-item--text.apex-page-item-error:required:valid + .a-Button, .u-TF-item--select.apex-page-item-error:required:valid + .a-Button, select.listmanager.apex-page-item-error:required:valid + .a-Button, select.group_selectlist.apex-page-item-error:required:valid + .a-Button, .apex-item-multi.apex-page-item-error:required:valid + .a-Button, .datetimepicker_newMonth.apex-page-item-error:required:valid + .a-Button var(--a-button-border-color)
.apex-item-wrapper--color-picker:focus-within .apex-item-group--color-picker var(--a-field-input-focus-border-color)
.apex-item-group--popup-lov:focus-within var(--a-field-input-focus-border-color)
.apex-item-wrapper--date-picker-jet .oj-text-field.oj-focus .oj-text-field-container var(--a-field-input-focus-border-color)
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor) var(--a-button-border-color)
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-disabled):hover var(--a-button-hover-border-color)
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-disabled):active var(--a-button-active-border-color, var(--a-button-hover-border-color))
.apex-fullcalendar-5 .fc-button-primary.fc-button-active, .apex-fullcalendar-5 .fc-button-primary.fc-button-active:disabled var(--a-button-border-color)
.apex-fullcalendar-5 .fc-button-primary.fc-button-active, .apex-fullcalendar-5 .fc-button-primary.fc-button-active:disabled var(--a-button-active-border-color, var(--a-button-hover-border-color))

--a-button-state-shadow

Selector Value Color
.t-Button, .a-Button, .ui-button, .a-CardView-button, .apex-button-group label, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label, .t-Form-helpButton none
.t-Button:hover, .a-Button:hover, .ui-button:hover, .a-CardView-button:hover, .apex-button-group label:hover, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:hover, .t-Form-helpButton:hover var(--a-button-hover-shadow)
.t-Button.is-active, .t-Button.ui-state-active, .t-Button:active, .t-Button:active:focus, .a-Button.is-active, .a-Button.ui-state-active, .a-Button:active, .a-Button:active:focus, .ui-button.is-active, .ui-button.ui-state-active, .ui-button:active, .ui-button:active:focus, .a-CardView-button.is-active, .a-CardView-button.ui-state-active, .a-CardView-button:active, .a-CardView-button:active:focus, .apex-button-group label.is-active, .apex-button-group label.ui-state-active, .apex-button-group label:active, .apex-button-group label:active:focus, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label.is-active, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label.ui-state-active, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:active, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:active:focus, .t-Form-helpButton.is-active, .t-Form-helpButton.ui-state-active, .t-Form-helpButton:active, .t-Form-helpButton:active:focus var(--a-button-active-shadow, var(--a-button-hover-shadow))
.t-Button:focus, .a-Button:focus, .ui-button:focus, .a-CardView-button:focus, .apex-button-group label:focus, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:focus, .t-Form-helpButton:focus var(--a-button-focus-shadow)
.apex-item-file--native::-webkit-file-upload-button none
.apex-item-file--native::-webkit-file-upload-button:hover var(--a-button-hover-shadow)
.apex-item-file--native::-webkit-file-upload-button.is-active, .apex-item-file--native::-webkit-file-upload-button.ui-state-active, .apex-item-file--native::-webkit-file-upload-button:active, .apex-item-file--native::-webkit-file-upload-button:active:focus var(--a-button-active-shadow, var(--a-button-hover-shadow))
.apex-item-file--native::-webkit-file-upload-button:focus var(--a-button-focus-shadow)
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor) none
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-disabled):hover var(--a-button-hover-shadow)
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-disabled):active var(--a-button-active-shadow, var(--a-button-hover-shadow))
.apex-fullcalendar-5 .fc-button-primary.fc-button-active, .apex-fullcalendar-5 .fc-button-primary.fc-button-active:disabled none
.apex-fullcalendar-5 .fc-button-primary.fc-button-active, .apex-fullcalendar-5 .fc-button-primary.fc-button-active:disabled var(--a-button-active-shadow, var(--a-button-hover-shadow))

--a-button-zindex

Selector Value Color
.t-Button:hover, .a-Button:hover, .ui-button:hover, .a-CardView-button:hover, .apex-button-group label:hover, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:hover, .t-Form-helpButton:hover 100
.t-Button.is-active, .t-Button.ui-state-active, .t-Button:active, .t-Button:active:focus, .a-Button.is-active, .a-Button.ui-state-active, .a-Button:active, .a-Button:active:focus, .ui-button.is-active, .ui-button.ui-state-active, .ui-button:active, .ui-button:active:focus, .a-CardView-button.is-active, .a-CardView-button.ui-state-active, .a-CardView-button:active, .a-CardView-button:active:focus, .apex-button-group label.is-active, .apex-button-group label.ui-state-active, .apex-button-group label:active, .apex-button-group label:active:focus, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label.is-active, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label.ui-state-active, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:active, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:active:focus, .t-Form-helpButton.is-active, .t-Form-helpButton.ui-state-active, .t-Form-helpButton:active, .t-Form-helpButton:active:focus 100
.t-Button:focus, .a-Button:focus, .ui-button:focus, .a-CardView-button:focus, .apex-button-group label:focus, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:focus, .t-Form-helpButton:focus 110
.apex-item-file--native::-webkit-file-upload-button:hover 100
.apex-item-file--native::-webkit-file-upload-button.is-active, .apex-item-file--native::-webkit-file-upload-button.ui-state-active, .apex-item-file--native::-webkit-file-upload-button:active, .apex-item-file--native::-webkit-file-upload-button:active:focus 100
.apex-item-file--native::-webkit-file-upload-button:focus 110

--a-button-disabled-cursor

Selector Value Color
.t-Button.is-disabled, .t-Button[disabled], .a-Button.is-disabled, .a-Button[disabled], .ui-button.is-disabled, .ui-button[disabled], .a-CardView-button.is-disabled, .a-CardView-button[disabled], .apex-button-group label.is-disabled, .apex-button-group label[disabled], .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label.is-disabled, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label[disabled], .t-Form-helpButton.is-disabled, .t-Form-helpButton[disabled] default
.apex-item-file--native::-webkit-file-upload-button.is-disabled, .apex-item-file--native::-webkit-file-upload-button[disabled] default

--a-button-disabled-opacity

Selector Value Color
.t-Button.is-disabled, .t-Button[disabled], .a-Button.is-disabled, .a-Button[disabled], .ui-button.is-disabled, .ui-button[disabled], .a-CardView-button.is-disabled, .a-CardView-button[disabled], .apex-button-group label.is-disabled, .apex-button-group label[disabled], .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label.is-disabled, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label[disabled], .t-Form-helpButton.is-disabled, .t-Form-helpButton[disabled] 0.5
.apex-item-file--native::-webkit-file-upload-button.is-disabled, .apex-item-file--native::-webkit-file-upload-button[disabled] 0.5

--a-button-icon-size

Selector Value Color
.t-Button .t-Icon, .t-Button .a-Icon, .t-Button-icon, .a-CardView-buttonIcon 16px
.t-Button--tiny, .t-Button--xsmall 12px
.t-Button--small 12px
.t-Button--headerTree.t-Button:before 16px
.t-Button--headerTree.t-Button:before 16px
.t-Button--headerTree:hover .t-Header-controlsIcon, .t-Button--headerTree:hover .t-Header-controlsIcon:after, .t-Button--headerTree:hover .t-Header-controlsIcon:before 16px
.t-Button--headerTree.is-active:hover .t-Header-controlsIcon:before, .t-Button--headerTree.is-active:focus .t-Header-controlsIcon:before 16px
.t-Button--headerTree.is-active:hover .t-Header-controlsIcon:after, .t-Button--headerTree.is-active:focus .t-Header-controlsIcon:after 16px
.t-Button--headerTree.is-active .t-Header-controlsIcon:after 16px

--a-button-icon-spacing

Selector Value Color
.t-Button-badge 4px
.u-RTL .t-Button-badge 4px
.t-Button--noLabel 0px
.t-Button--iconLeft .t-Icon 4px
.u-RTL .t-Button--iconLeft .t-Icon 4px
.t-Button--iconRight .t-Icon 4px
.u-RTL .t-Button--iconRight .t-Icon 4px
.t-Button--navBar .t-Icon 4px
.u-RTL .t-Button--navBar .t-Icon 4px
.t-NavigationBar-item.icon-only .t-Icon 0px

--jui-icon-size

Selector Value Color
.ui-button var(--a-button-icon-size)

--a-button-text-color

Selector Value Color
.t-Button--link var(--ut-link-text-color)

--ut-link-text-decoration

Selector Value Color
.t-Button--link:hover underline
.t-Button--link:hover underline
.t-Footer-apex a:hover underline
.t-Footer-apex a:hover underline
.t-Alert--page .a-Notification-link:hover underline
.t-Alert--page .a-Notification-link:hover underline
.t-Alert--page a underline
.t-Alert--page a underline
.t-ContentRow-title a:not([class]):hover underline
.t-ContentRow-title a:not([class]):hover underline
.t-Comments-info a:not(.t-Button):hover underline
.t-Comments-info a:not(.t-Button):hover underline
.t-Breadcrumb-item a:hover underline
.t-Breadcrumb-item a:hover underline
.t-MegaMenu-itemBody.is-focused .t-MegaMenu-label, .t-MegaMenu-itemBody:hover .t-MegaMenu-label underline
.t-MegaMenu-itemBody.is-focused .t-MegaMenu-label, .t-MegaMenu-itemBody:hover .t-MegaMenu-label underline
.apex-quick-picks a:hover underline
.apex-quick-picks a:hover underline

--a-button-gap-x

Selector Value Color
.t-Button + .t-Button 8px
.u-RTL .t-Button + .t-Button 8px
.t-Button--header + .t-Button--header 0
.t-BreadcrumbRegion calc(var(--a-button-gap-x, 8px) / 2)
.t-Region-headerItems--buttons .t-Button--icon + .t-Button--icon 0
.t-Validation-actions 8px

--a-button-shadow

Selector Value Color
.t-Button--header none

--a-field-input-flex-grow

Selector Value Color
.t-Form--stretchInputs .apex-button-group, .t-Form--stretchInputs.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc, .t-Form-fieldContainer--stretchInputs .apex-button-group, .t-Form-fieldContainer--stretchInputs.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc 1
.apex-button-group, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc 0
.t-Form--stretchInputs .t-Form-fieldContainer, .t-Form-fieldContainer--stretchInputs 1
.t-Form-fieldContainer--floatingLabel 1
.apex-item-text, .apex-item-select, .apex-item-textarea, .u-TF-item--text, .u-TF-item--select, select.listmanager, select.group_selectlist, .apex-item-multi, .datetimepicker_newMonth 1

--ut-pillbutton-font-size

Selector Value Color
.apex-button-group label, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc label 12px

--ut-pillbutton-line-height

Selector Value Color
.apex-button-group label, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc label 16px

--ut-pillbutton-checkbox-line-height

Selector Value Color
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc.apex-item-checkbox input + label 16px

--ut-body-actions-border-width

Selector Value Color
.t-Body-actionsToggle 1px

--ut-body-actions-border-color

Selector Value Color
.t-Body-actionsToggle var(--ut-component-border-color)

--ut-body-actionstoggle-background-color

Selector Value Color
.t-Body-actionsToggle var(--ut-body-actions-background-color)
.t-Body-actionsToggle:active var(--ut-body-actionstoggle-hover-background-color)

--ut-body-actionstoggle-text-color

Selector Value Color
.t-Body-actionsToggle var(--ut-body-actions-text-color)

--ut-body-actions-toggle-offset

Selector Value Color
.t-Body-actionsToggle 0

--ut-body-actionstoggle-padding-x

Selector Value Color
.t-Body-actionsToggle.is-active, .t-Body-actionsToggle:hover, .t-Body-actionsToggle:focus 10px

--a-icon-font-family

Selector Value Color
.t-Body-actionsControlsIcon:before "apex-5-icon-font"
.ui-dialog--apex.t-Dialog-page--wizard .ui-dialog-content:after, .ui-dialog--apex.t-Dialog-page--standard .ui-dialog-content:after "apex-5-icon-font"
.t-LinksList-link:before "apex-5-icon-font"
.t-WizardSteps-step.is-complete .t-WizardSteps-marker:before "apex-5-icon-font"
.t-BreadcrumbRegion .t-Breadcrumb-item:nth-last-child(2) .t-Breadcrumb-label:before "apex-5-icon-font"
.apex-item-wrapper--date-picker-jet .oj-fwk-icon-calendar:before, .apex-item-wrapper--date-picker-jet .oj-inputdatetime-calendar-icon:before "apex-5-icon-font"
.apex-item-wrapper--date-picker-jet .oj-fwk-icon-calendar-clock:before, .apex-item-wrapper--date-picker-jet .oj-inputdatetime-calendar-clock-icon:before "apex-5-icon-font"

--ut-header-padding-y

Selector Value Color
.t-Header-branding 8px
.t-Header-branding 8px

--ut-header-padding-x

Selector Value Color
.t-Header-branding 8px
.t-Header-branding 8px

--ut-header-controls-icon-middle-width

Selector Value Color
.t-Header-controlsIcon, .t-Header-controlsIcon:after, .t-Header-controlsIcon:before 16px

--ut-header-controls-icon-height

Selector Value Color
.t-Header-controlsIcon, .t-Header-controlsIcon:after, .t-Header-controlsIcon:before 2px

--ut-header-controls-icon-transition

Selector Value Color
.t-Header-controlsIcon, .t-Header-controlsIcon:after, .t-Header-controlsIcon:before transform 0.12s ease
.t-Header-controlsIcon:before top 75ms ease 0.12s, opacity 75ms ease, width 75ms ease
.t-Header-controlsIcon:after bottom 75ms ease 0.12s, transform 75ms cubic-bezier(0.55, 0.055, 0.675, 0.19), width 75ms ease
.t-Button--headerTree.is-active:hover .t-Header-controlsIcon:before, .t-Button--headerTree.is-active:focus .t-Header-controlsIcon:before top 75ms ease, opacity 75ms ease 0.12s
.t-Button--headerTree.is-active:hover .t-Header-controlsIcon:after, .t-Button--headerTree.is-active:focus .t-Header-controlsIcon:after bottom 75ms ease, transform 75ms cubic-bezier(0.215, 0.61, 0.355, 1) 0.12s, width 75ms ease
.t-Button--headerTree.is-active .t-Header-controlsIcon:before top 75ms ease, opacity 75ms ease 0.12s
.t-Button--headerTree.is-active .t-Header-controlsIcon:after bottom 75ms ease, transform 75ms cubic-bezier(0.215, 0.61, 0.355, 1) 0.12s

--ut-header-controls-icon-border-radius

Selector Value Color
.t-Header-controlsIcon, .t-Header-controlsIcon:after, .t-Header-controlsIcon:before 4px

--ut-header-controls-icon-top-width

Selector Value Color
.t-Header-controlsIcon:before 12px

--ut-header-controls-icon-bottom-width

Selector Value Color
.t-Header-controlsIcon:after 8px

--ut-logo-font-size

Selector Value Color
.t-Header-logo 18px

--ut-logo-line-height

Selector Value Color
.t-Header-logo 24px

--ut-logo-font-weight

Selector Value Color
.t-Header-logo 500

--ut-logo-text-color

Selector Value Color
.t-Header-logo-link inherit

--ut-header-logo-height

Selector Value Color
.t-Header-logo-link img 8

--ut-logo-img-spacing

Selector Value Color
.t-Header-logo-link .apex-logo-img + .apex-logo-text 4px
.u-RTL .t-Header-logo-link .apex-logo-img + .apex-logo-text 4px

--ut-header-navbar-item-spacing

Selector Value Color
.t-Header-navBar 8px

--a-menubar-background-color

Selector Value Color
.t-Header-nav var(--ut-header-menubar-background-color)

--a-menubar-item-text-color

Selector Value Color
.t-Header-nav var(--ut-header-menubar-item-text-color)

--a-menubar-item-current-background-color

Selector Value Color
.t-Header-nav var(--ut-header-menubar-item-current-background-color)

--a-menubar-item-current-text-color

Selector Value Color
.t-Header-nav var(--ut-header-menubar-item-current-text-color)

--a-menubar-item-focused-background-color

Selector Value Color
.t-Header-nav var(--ut-header-menubar-item-hover-background-color)

--a-menubar-item-focused-text-color

Selector Value Color
.t-Header-nav var(--ut-header-menubar-item-hover-text-color)

--a-menubar-item-border-color

Selector Value Color
.t-Header-nav var(--ut-header-menubar-item-border-color)

--a-menubar-item-border-width

Selector Value Color
.t-Header-nav var(--ut-header-menubar-item-border-width)

--a-menubar-item-padding-y

Selector Value Color
.t-Header-nav 14px

--a-menubar-item-padding-x

Selector Value Color
.t-Header-nav 20px

--a-menubar-item-font-size

Selector Value Color
.t-Header-nav 14px

--a-menubar-item-line-height

Selector Value Color
.t-Header-nav 20px

--a-menubar-item-split-icon-color

Selector Value Color
.t-Header-nav var(--ut-header-menubar-item-split-icon-color)

--a-menubar-item-split-border-color

Selector Value Color
.t-Header-nav var(--ut-header-menubar-item-split-border-color)

--a-menubar-item-split-border-width

Selector Value Color
.t-Header-nav var(--ut-header-menubar-item-split-border-width, 0px)

--ut-header-menubar-badge-background-color

Selector Value Color
.t-Header-nav .t-Menu-badge var(--ut-treeview-badge-background-color)
.t-Header-nav .t-Menu-badge var(--ut-treeview-badge-text-color)

--ut-footer-top-text-color

Selector Value Color
.t-Footer-topButton var(--a-button-text-color)

--a-menu-min-width

Selector Value Color
.t-NavigationBar-menu 160px

--ut-navtabs-item-border-width

Selector Value Color
.t-NavTabs var(--ut-xs-navtabs-item-border-width, 0px)
.t-NavTabs-item 1px) solid var(--ut-navtabs-item-border-color
.u-RTL .t-NavTabs-item 1px) solid var(--ut-navtabs-item-border-color

--ut-navtabs-item-background-color

Selector Value Color
.t-NavTabs-item.is-active .t-NavTabs-link var(--ut-navtabs-item-active-background-color)
.t-NavTabs-link:hover var(--ut-navtabs-item-hover-background-color)

--ut-navtabs-item-text-color

Selector Value Color
.t-NavTabs-item.is-active .t-NavTabs-link var(--ut-navtabs-item-active-text-color)
.t-NavTabs-link currentColor
.t-NavTabs-link:hover var(--ut-navtabs-item-hover-text-color)

--ut-navtabs-item-highlight-color

Selector Value Color
.t-NavTabs-item.is-active .t-NavTabs-link var(--ut-navtabs-item-active-highlight-color)
.t-NavTabs-link:hover var(--ut-navtabs-item-hover-highlight-color)

--ut-navtabs-item-font-weight

Selector Value Color
.t-NavTabs-item.is-active .t-NavTabs-link var(--ut-navtabs-item-active-font-weight, var(--a-base-font-weight-semibold, 500))

--ut-navtabs-item-padding-y

Selector Value Color
.t-NavTabs-link 8px
.t-NavTabs-link 8px
.t-NavTabs-link var(--ut-xs-navtabs-item-padding-y)

--ut-navtabs-item-padding-x

Selector Value Color
.t-NavTabs-link 4px
.t-NavTabs-link 4px
.t-NavTabs-link var(--ut-xs-navtabs-item-padding-x)
.t-NavTabs-link 12px

--ut-navtabs-icon-padding

Selector Value Color
.t-NavTabs-link var(--ut-xs-navtabs-icon-padding)
.t-NavTabs-item .t-Icon 4px

--ut-xs-navtabs-icon-spacing

Selector Value Color
.t-NavTabs-item .t-Icon 4px aut

--ut-navtabs-icon-spacing

Selector Value Color
.t-NavTabs-item .t-Icon 4px
.u-RTL .t-NavTabs-item .t-Icon 4px
.t-NavTabs-badge 4px
.u-RTL .t-NavTabs-badge 4px

--ut-xs-navtabs-item-font-size

Selector Value Color
.t-NavTabs-label 9px

--ut-xs-navtabs-item-line-height

Selector Value Color
.t-NavTabs-label 12px

--ut-navtabs-item-font-size

Selector Value Color
.t-NavTabs-label 14px

--ut-navtabs-item-line-height

Selector Value Color
.t-NavTabs-label 24px

--ut-navtabs-badge-border-radius

Selector Value Color
.t-NavTabs-badge 8px

--ut-navtabs-badge-font-size

Selector Value Color
.t-NavTabs-badge 8px

--ut-navtabs-badge-line-height

Selector Value Color
.t-NavTabs-badge 16px
.t-NavTabs-badge 16px
.t-NavTabs-badge 16px

--ut-navtabs-badge-padding

Selector Value Color
.t-NavTabs-badge 0 4px

--a-treeview-toggle-size

Selector Value Color
.t-TreeNav 16px

--a-treeview-node-indent

Selector Value Color
.t-TreeNav 0px
.t-TreeNav .a-TreeView-node--topLevel > ul var(--ut-treeview-node-indent, 16px)
.t-TreeNav .a-TreeView-node--topLevel > ul ul calc(var(--ut-treeview-leaf-node-indent, var(--ut-treeview-node-indent-placeholder)) * 2)

--a-treeview-node-padding-y

Selector Value Color
.t-TreeNav 8px

--a-treeview-node-padding-x

Selector Value Color
.t-TreeNav 8px

--a-treeview-node-cursor

Selector Value Color
.t-TreeNav pointer

--ut-treeview-icon-size

Selector Value Color
.t-TreeNav .a-TreeView-content .fa 16px
.t-TreeNav .a-TreeView-node--topLevel > ul var(--ut-treeview-node-icon-size)

--ut-treeview-toggle-width

Selector Value Color
.t-TreeNav .a-TreeView-toggle 32px

--ut-treeview-badge-padding-x

Selector Value Color
.t-TreeNav .a-TreeView-badge 6px
.t-TreeNav .a-TreeView-badge 6px
.apex-side-nav.js-navCollapsed .t-TreeNav .a-TreeView-badge var(--ut-treeview-collapsed-badge-padding-x, 4px)

--ut-treeview-badge-padding-y

Selector Value Color
.t-TreeNav .a-TreeView-badge 0
.t-TreeNav .a-TreeView-badge 0

--ut-treeview-badge-font-size

Selector Value Color
.t-TreeNav .a-TreeView-badge 11px
.apex-side-nav.js-navCollapsed .t-TreeNav .a-TreeView-badge var(--ut-treeview-collapsed-badge-font-size, 9px)

--ut-treeview-badge-line-height

Selector Value Color
.t-TreeNav .a-TreeView-badge 20px
.apex-side-nav.js-navCollapsed .t-TreeNav .a-TreeView-badge var(--ut-treeview-collapsed-badge-line-height, 14px)

--ut-treeview-badge-border-radius

Selector Value Color
.t-TreeNav .a-TreeView-badge 4px
.apex-side-nav.js-navCollapsed .t-TreeNav .a-TreeView-badge var(--ut-treeview-collapsed-badge-border-radius, 20px)

--ut-treeview-badge-background-color

Selector Value Color
.t-TreeNav .a-TreeView-badge var(--ut-component-icon-background-color)

--ut-treeview-badge-text-color

Selector Value Color
.t-TreeNav .a-TreeView-badge var(--ut-component-icon-color)

--ut-treeview-icon-container-width

Selector Value Color
.t-TreeNav .a-TreeView-node .a-TreeView-content auto 1f
.t-TreeNav .a-TreeView-node--topLevel var(--ut-treeview-toplevel-icon-container-width, 24px)
.t-TreeNav .a-TreeView-node--topLevel > ul var(--ut-treeview-node-icon-container-width, auto)

--a-treeview-node-font-size

Selector Value Color
.t-TreeNav .a-TreeView-node--topLevel > .a-TreeView-content var(--ut-treeview-toplevel-node-font-size, 14px)

--ut-treeview-icon-container-height

Selector Value Color
.t-TreeNav .a-TreeView-node--topLevel > .a-TreeView-content var(--ut-treeview-toplevel-icon-container-height, 24px)
.t-TreeNav .a-TreeView-node--topLevel > ul var(--ut-treeview-node-icon-container-height)

--ut-treeview-node-indent-placeholder

Selector Value Color
.t-TreeNav .a-TreeView-node--topLevel > ul var(--a-treeview-node-indent)

--ut-treeview-toplevel-leaf-padding-y

Selector Value Color
.t-TreeNav .a-TreeView-node--topLevel > ul 8px
.t-TreeNav .a-TreeView-node--topLevel > ul 8px

--a-treeview-node-font-weight

Selector Value Color
.t-TreeNav .is-current, .t-TreeNav .is-current--top var(--a-base-font-weight-semibold, 500)

--ut-nav-collapsed-icon-width

Selector Value Color
.apex-side-nav.js-navCollapsed--icons .t-TreeNav 52px

--ut-dialog-padding-y

Selector Value Color
.t-Dialog-body 16px
.t-Dialog-body 16px
.t-Dialog--noPadding 0

--ut-dialog-padding-x

Selector Value Color
.t-Dialog-body 16px
.t-Dialog-body 16px
.t-Dialog--noPadding 0

--jui-dialog-titlebar-border-width

Selector Value Color
.t-Dialog-page--wizard 0px

--jui-dialog-titlebar-background-color

Selector Value Color
.t-Dialog-page--wizard transparent

--jui-dialog-title-font-weight

Selector Value Color
.t-Dialog-page--wizard var(--a-base-font-weight-semibold, 500)

--jui-dialog-title-font-size

Selector Value Color
.t-Dialog-page--wizard 20px

--jui-dialog-title-line-height

Selector Value Color
.t-Dialog-page--wizard 32px

--jui-dialog-titlebar-padding-y

Selector Value Color
.t-Dialog-page--wizard 12px

--jui-dialog-titlebar-padding-x

Selector Value Color
.t-Dialog-page--wizard 16px

--jui-dialog-buttonpane-border-width

Selector Value Color
.t-Dialog-page--wizard 0px

--jui-dialog-buttonpane-content-padding-y

Selector Value Color
.t-Dialog-page--wizard 16px

--jui-dialog-buttonpane-content-padding-x

Selector Value Color
.t-Dialog-page--wizard 16px

--ut-dialog-content-font-size

Selector Value Color
.t-Dialog-page--wizard 14px

--ut-dialog-pullout-max-width

Selector Value Color
.ui-dialog.t-Dialog--pullOutRight, .ui-dialog.t-Dialog--pullOutLeft, .ui-dialog.js-dialog-pullout-left, .ui-dialog.js-dialog-pullout-right 97vw

--ut-component-border-width

Selector Value Color
.t-DialogRegion-buttons var(--jui-dialog-buttonpane-border-width)

--ut-component-border-color

Selector Value Color
.t-DialogRegion-buttons var(--jui-dialog-buttonpane-border-color)

--ut-file-icon-padding

Selector Value Color
.u-file-icon 4px 8px

--ut-file-icon-text-color

Selector Value Color
.u-file-icon #fff

--ut-file-icon-border-radius

Selector Value Color
.u-file-icon 2px

--ut-file-icon-background-color

Selector Value Color
.u-file-icon.fa-file-powerpoint-o #D24726
.u-file-icon.fa-file-excel-o #217345
.u-file-icon.fa-file-word-o #2A579A
.u-file-icon.fa-file-pdf-o #F40700
.u-file-icon.fa-file-image-o #C88821
.u-file-icon.fa-file-o #6A788A

--ut-badgelist-text-color

Selector Value Color
.t-BadgeList var(--ut-component-text-default-color)

--ut-badgelist-item-padding-x

Selector Value Color
.t-BadgeList-item 12px
.t-BadgeList-item 12px

--ut-badgelist-item-padding-y

Selector Value Color
.t-BadgeList-item 12px
.t-BadgeList-item 12px

--ut-badgelist-label-line-height

Selector Value Color
.t-BadgeList-label 1.5
.t-BadgeList--dash 20px

--ut-badgelist-value-font-weight

Selector Value Color
.t-BadgeList-value 500

--ut-badgelist-label-margin-y

Selector Value Color
.t-BadgeList--circular .t-BadgeList-label 8px

--ut-badgelist-label-text-color

Selector Value Color
.t-BadgeList--circular .t-BadgeList-label var(--ut-component-text-title-color)

--u-color

Selector Value Color
.t-BadgeList--circular .t-BadgeList-value var(--ut-component-background-color)
.t-MediaList-icon var(--ut-component-icon-background-color)
.t-Card-icon var(--ut-component-icon-background-color)
.t-Cards--animColorFill .t-Card-icon:before inherit
.t-Cards--animColorFill .t-Card:hover .t-Card-colorFill:before, .t-Cards--animColorFill .t-Card-wrap:focus .t-Card-colorFill:before var(--ut-component-icon-background-color)
.u-color-1 var(--u-color-1)
.u-color-2 var(--u-color-2)
.u-color-3 var(--u-color-3)
.u-color-4 var(--u-color-4)
.u-color-5 var(--u-color-5)
.u-color-6 var(--u-color-6)
.u-color-7 var(--u-color-7)
.u-color-8 var(--u-color-8)
.u-color-9 var(--u-color-9)
.u-color-10 var(--u-color-10)
.u-color-11 var(--u-color-11)
.u-color-12 var(--u-color-12)
.u-color-13 var(--u-color-13)
.u-color-14 var(--u-color-14)
.u-color-15 var(--u-color-15)
.u-color-16 var(--u-color-16)
.u-color-17 var(--u-color-17)
.u-color-18 var(--u-color-18)
.u-color-19 var(--u-color-19)
.u-color-20 var(--u-color-20)
.u-color-21 var(--u-color-21)
.u-color-22 var(--u-color-22)
.u-color-23 var(--u-color-23)
.u-color-24 var(--u-color-24)
.u-color-25 var(--u-color-25)
.u-color-26 var(--u-color-26)
.u-color-27 var(--u-color-27)
.u-color-28 var(--u-color-28)
.u-color-29 var(--u-color-29)
.u-color-30 var(--u-color-30)
.u-color-31 var(--u-color-31)
.u-color-32 var(--u-color-32)
.u-color-33 var(--u-color-33)
.u-color-34 var(--u-color-34)
.u-color-35 var(--u-color-35)
.u-color-36 var(--u-color-36)
.u-color-37 var(--u-color-37)
.u-color-38 var(--u-color-38)
.u-color-39 var(--u-color-39)
.u-color-40 var(--u-color-40)
.u-color-41 var(--u-color-41)
.u-color-42 var(--u-color-42)
.u-color-43 var(--u-color-43)
.u-color-44 var(--u-color-44)
.u-color-45 var(--u-color-45)
.u-colors > :nth-child(45n+1) .u-color, .u-colors .a-CardView-items > :nth-child(45n+1) .u-color var(--u-color-1)
.u-colors > :nth-child(45n+1) .u-color-bg, .u-colors > :nth-child(45n+1) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+1) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+1) .u-color-background var(--u-color-1)
.u-colors > :nth-child(45n+1) .u-color-bd, .u-colors > :nth-child(45n+1) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+1) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+1) .u-color-border var(--u-color-1)
.u-colors > :nth-child(45n+2) .u-color, .u-colors .a-CardView-items > :nth-child(45n+2) .u-color var(--u-color-2)
.u-colors > :nth-child(45n+2) .u-color-bg, .u-colors > :nth-child(45n+2) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+2) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+2) .u-color-background var(--u-color-2)
.u-colors > :nth-child(45n+2) .u-color-bd, .u-colors > :nth-child(45n+2) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+2) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+2) .u-color-border var(--u-color-2)
.u-colors > :nth-child(45n+3) .u-color, .u-colors .a-CardView-items > :nth-child(45n+3) .u-color var(--u-color-3)
.u-colors > :nth-child(45n+3) .u-color-bg, .u-colors > :nth-child(45n+3) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+3) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+3) .u-color-background var(--u-color-3)
.u-colors > :nth-child(45n+3) .u-color-bd, .u-colors > :nth-child(45n+3) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+3) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+3) .u-color-border var(--u-color-3)
.u-colors > :nth-child(45n+4) .u-color, .u-colors .a-CardView-items > :nth-child(45n+4) .u-color var(--u-color-4)
.u-colors > :nth-child(45n+4) .u-color-bg, .u-colors > :nth-child(45n+4) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+4) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+4) .u-color-background var(--u-color-4)
.u-colors > :nth-child(45n+4) .u-color-bd, .u-colors > :nth-child(45n+4) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+4) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+4) .u-color-border var(--u-color-4)
.u-colors > :nth-child(45n+5) .u-color, .u-colors .a-CardView-items > :nth-child(45n+5) .u-color var(--u-color-5)
.u-colors > :nth-child(45n+5) .u-color-bg, .u-colors > :nth-child(45n+5) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+5) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+5) .u-color-background var(--u-color-5)
.u-colors > :nth-child(45n+5) .u-color-bd, .u-colors > :nth-child(45n+5) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+5) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+5) .u-color-border var(--u-color-5)
.u-colors > :nth-child(45n+6) .u-color, .u-colors .a-CardView-items > :nth-child(45n+6) .u-color var(--u-color-6)
.u-colors > :nth-child(45n+6) .u-color-bg, .u-colors > :nth-child(45n+6) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+6) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+6) .u-color-background var(--u-color-6)
.u-colors > :nth-child(45n+6) .u-color-bd, .u-colors > :nth-child(45n+6) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+6) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+6) .u-color-border var(--u-color-6)
.u-colors > :nth-child(45n+7) .u-color, .u-colors .a-CardView-items > :nth-child(45n+7) .u-color var(--u-color-7)
.u-colors > :nth-child(45n+7) .u-color-bg, .u-colors > :nth-child(45n+7) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+7) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+7) .u-color-background var(--u-color-7)
.u-colors > :nth-child(45n+7) .u-color-bd, .u-colors > :nth-child(45n+7) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+7) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+7) .u-color-border var(--u-color-7)
.u-colors > :nth-child(45n+8) .u-color, .u-colors .a-CardView-items > :nth-child(45n+8) .u-color var(--u-color-8)
.u-colors > :nth-child(45n+8) .u-color-bg, .u-colors > :nth-child(45n+8) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+8) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+8) .u-color-background var(--u-color-8)
.u-colors > :nth-child(45n+8) .u-color-bd, .u-colors > :nth-child(45n+8) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+8) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+8) .u-color-border var(--u-color-8)
.u-colors > :nth-child(45n+9) .u-color, .u-colors .a-CardView-items > :nth-child(45n+9) .u-color var(--u-color-9)
.u-colors > :nth-child(45n+9) .u-color-bg, .u-colors > :nth-child(45n+9) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+9) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+9) .u-color-background var(--u-color-9)
.u-colors > :nth-child(45n+9) .u-color-bd, .u-colors > :nth-child(45n+9) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+9) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+9) .u-color-border var(--u-color-9)
.u-colors > :nth-child(45n+10) .u-color, .u-colors .a-CardView-items > :nth-child(45n+10) .u-color var(--u-color-10)
.u-colors > :nth-child(45n+10) .u-color-bg, .u-colors > :nth-child(45n+10) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+10) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+10) .u-color-background var(--u-color-10)
.u-colors > :nth-child(45n+10) .u-color-bd, .u-colors > :nth-child(45n+10) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+10) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+10) .u-color-border var(--u-color-10)
.u-colors > :nth-child(45n+11) .u-color, .u-colors .a-CardView-items > :nth-child(45n+11) .u-color var(--u-color-11)
.u-colors > :nth-child(45n+11) .u-color-bg, .u-colors > :nth-child(45n+11) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+11) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+11) .u-color-background var(--u-color-11)
.u-colors > :nth-child(45n+11) .u-color-bd, .u-colors > :nth-child(45n+11) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+11) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+11) .u-color-border var(--u-color-11)
.u-colors > :nth-child(45n+12) .u-color, .u-colors .a-CardView-items > :nth-child(45n+12) .u-color var(--u-color-12)
.u-colors > :nth-child(45n+12) .u-color-bg, .u-colors > :nth-child(45n+12) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+12) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+12) .u-color-background var(--u-color-12)
.u-colors > :nth-child(45n+12) .u-color-bd, .u-colors > :nth-child(45n+12) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+12) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+12) .u-color-border var(--u-color-12)
.u-colors > :nth-child(45n+13) .u-color, .u-colors .a-CardView-items > :nth-child(45n+13) .u-color var(--u-color-13)
.u-colors > :nth-child(45n+13) .u-color-bg, .u-colors > :nth-child(45n+13) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+13) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+13) .u-color-background var(--u-color-13)
.u-colors > :nth-child(45n+13) .u-color-bd, .u-colors > :nth-child(45n+13) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+13) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+13) .u-color-border var(--u-color-13)
.u-colors > :nth-child(45n+14) .u-color, .u-colors .a-CardView-items > :nth-child(45n+14) .u-color var(--u-color-14)
.u-colors > :nth-child(45n+14) .u-color-bg, .u-colors > :nth-child(45n+14) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+14) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+14) .u-color-background var(--u-color-14)
.u-colors > :nth-child(45n+14) .u-color-bd, .u-colors > :nth-child(45n+14) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+14) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+14) .u-color-border var(--u-color-14)
.u-colors > :nth-child(45n+15) .u-color, .u-colors .a-CardView-items > :nth-child(45n+15) .u-color var(--u-color-15)
.u-colors > :nth-child(45n+15) .u-color-bg, .u-colors > :nth-child(45n+15) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+15) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+15) .u-color-background var(--u-color-15)
.u-colors > :nth-child(45n+15) .u-color-bd, .u-colors > :nth-child(45n+15) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+15) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+15) .u-color-border var(--u-color-15)
.u-colors > :nth-child(45n+16) .u-color, .u-colors .a-CardView-items > :nth-child(45n+16) .u-color var(--u-color-16)
.u-colors > :nth-child(45n+16) .u-color-bg, .u-colors > :nth-child(45n+16) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+16) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+16) .u-color-background var(--u-color-16)
.u-colors > :nth-child(45n+16) .u-color-bd, .u-colors > :nth-child(45n+16) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+16) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+16) .u-color-border var(--u-color-16)
.u-colors > :nth-child(45n+17) .u-color, .u-colors .a-CardView-items > :nth-child(45n+17) .u-color var(--u-color-17)
.u-colors > :nth-child(45n+17) .u-color-bg, .u-colors > :nth-child(45n+17) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+17) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+17) .u-color-background var(--u-color-17)
.u-colors > :nth-child(45n+17) .u-color-bd, .u-colors > :nth-child(45n+17) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+17) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+17) .u-color-border var(--u-color-17)
.u-colors > :nth-child(45n+18) .u-color, .u-colors .a-CardView-items > :nth-child(45n+18) .u-color var(--u-color-18)
.u-colors > :nth-child(45n+18) .u-color-bg, .u-colors > :nth-child(45n+18) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+18) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+18) .u-color-background var(--u-color-18)
.u-colors > :nth-child(45n+18) .u-color-bd, .u-colors > :nth-child(45n+18) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+18) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+18) .u-color-border var(--u-color-18)
.u-colors > :nth-child(45n+19) .u-color, .u-colors .a-CardView-items > :nth-child(45n+19) .u-color var(--u-color-19)
.u-colors > :nth-child(45n+19) .u-color-bg, .u-colors > :nth-child(45n+19) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+19) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+19) .u-color-background var(--u-color-19)
.u-colors > :nth-child(45n+19) .u-color-bd, .u-colors > :nth-child(45n+19) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+19) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+19) .u-color-border var(--u-color-19)
.u-colors > :nth-child(45n+20) .u-color, .u-colors .a-CardView-items > :nth-child(45n+20) .u-color var(--u-color-20)
.u-colors > :nth-child(45n+20) .u-color-bg, .u-colors > :nth-child(45n+20) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+20) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+20) .u-color-background var(--u-color-20)
.u-colors > :nth-child(45n+20) .u-color-bd, .u-colors > :nth-child(45n+20) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+20) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+20) .u-color-border var(--u-color-20)
.u-colors > :nth-child(45n+21) .u-color, .u-colors .a-CardView-items > :nth-child(45n+21) .u-color var(--u-color-21)
.u-colors > :nth-child(45n+21) .u-color-bg, .u-colors > :nth-child(45n+21) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+21) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+21) .u-color-background var(--u-color-21)
.u-colors > :nth-child(45n+21) .u-color-bd, .u-colors > :nth-child(45n+21) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+21) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+21) .u-color-border var(--u-color-21)
.u-colors > :nth-child(45n+22) .u-color, .u-colors .a-CardView-items > :nth-child(45n+22) .u-color var(--u-color-22)
.u-colors > :nth-child(45n+22) .u-color-bg, .u-colors > :nth-child(45n+22) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+22) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+22) .u-color-background var(--u-color-22)
.u-colors > :nth-child(45n+22) .u-color-bd, .u-colors > :nth-child(45n+22) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+22) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+22) .u-color-border var(--u-color-22)
.u-colors > :nth-child(45n+23) .u-color, .u-colors .a-CardView-items > :nth-child(45n+23) .u-color var(--u-color-23)
.u-colors > :nth-child(45n+23) .u-color-bg, .u-colors > :nth-child(45n+23) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+23) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+23) .u-color-background var(--u-color-23)
.u-colors > :nth-child(45n+23) .u-color-bd, .u-colors > :nth-child(45n+23) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+23) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+23) .u-color-border var(--u-color-23)
.u-colors > :nth-child(45n+24) .u-color, .u-colors .a-CardView-items > :nth-child(45n+24) .u-color var(--u-color-24)
.u-colors > :nth-child(45n+24) .u-color-bg, .u-colors > :nth-child(45n+24) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+24) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+24) .u-color-background var(--u-color-24)
.u-colors > :nth-child(45n+24) .u-color-bd, .u-colors > :nth-child(45n+24) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+24) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+24) .u-color-border var(--u-color-24)
.u-colors > :nth-child(45n+25) .u-color, .u-colors .a-CardView-items > :nth-child(45n+25) .u-color var(--u-color-25)
.u-colors > :nth-child(45n+25) .u-color-bg, .u-colors > :nth-child(45n+25) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+25) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+25) .u-color-background var(--u-color-25)
.u-colors > :nth-child(45n+25) .u-color-bd, .u-colors > :nth-child(45n+25) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+25) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+25) .u-color-border var(--u-color-25)
.u-colors > :nth-child(45n+26) .u-color, .u-colors .a-CardView-items > :nth-child(45n+26) .u-color var(--u-color-26)
.u-colors > :nth-child(45n+26) .u-color-bg, .u-colors > :nth-child(45n+26) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+26) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+26) .u-color-background var(--u-color-26)
.u-colors > :nth-child(45n+26) .u-color-bd, .u-colors > :nth-child(45n+26) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+26) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+26) .u-color-border var(--u-color-26)
.u-colors > :nth-child(45n+27) .u-color, .u-colors .a-CardView-items > :nth-child(45n+27) .u-color var(--u-color-27)
.u-colors > :nth-child(45n+27) .u-color-bg, .u-colors > :nth-child(45n+27) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+27) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+27) .u-color-background var(--u-color-27)
.u-colors > :nth-child(45n+27) .u-color-bd, .u-colors > :nth-child(45n+27) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+27) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+27) .u-color-border var(--u-color-27)
.u-colors > :nth-child(45n+28) .u-color, .u-colors .a-CardView-items > :nth-child(45n+28) .u-color var(--u-color-28)
.u-colors > :nth-child(45n+28) .u-color-bg, .u-colors > :nth-child(45n+28) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+28) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+28) .u-color-background var(--u-color-28)
.u-colors > :nth-child(45n+28) .u-color-bd, .u-colors > :nth-child(45n+28) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+28) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+28) .u-color-border var(--u-color-28)
.u-colors > :nth-child(45n+29) .u-color, .u-colors .a-CardView-items > :nth-child(45n+29) .u-color var(--u-color-29)
.u-colors > :nth-child(45n+29) .u-color-bg, .u-colors > :nth-child(45n+29) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+29) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+29) .u-color-background var(--u-color-29)
.u-colors > :nth-child(45n+29) .u-color-bd, .u-colors > :nth-child(45n+29) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+29) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+29) .u-color-border var(--u-color-29)
.u-colors > :nth-child(45n+30) .u-color, .u-colors .a-CardView-items > :nth-child(45n+30) .u-color var(--u-color-30)
.u-colors > :nth-child(45n+30) .u-color-bg, .u-colors > :nth-child(45n+30) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+30) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+30) .u-color-background var(--u-color-30)
.u-colors > :nth-child(45n+30) .u-color-bd, .u-colors > :nth-child(45n+30) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+30) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+30) .u-color-border var(--u-color-30)
.u-colors > :nth-child(45n+31) .u-color, .u-colors .a-CardView-items > :nth-child(45n+31) .u-color var(--u-color-31)
.u-colors > :nth-child(45n+31) .u-color-bg, .u-colors > :nth-child(45n+31) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+31) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+31) .u-color-background var(--u-color-31)
.u-colors > :nth-child(45n+31) .u-color-bd, .u-colors > :nth-child(45n+31) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+31) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+31) .u-color-border var(--u-color-31)
.u-colors > :nth-child(45n+32) .u-color, .u-colors .a-CardView-items > :nth-child(45n+32) .u-color var(--u-color-32)
.u-colors > :nth-child(45n+32) .u-color-bg, .u-colors > :nth-child(45n+32) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+32) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+32) .u-color-background var(--u-color-32)
.u-colors > :nth-child(45n+32) .u-color-bd, .u-colors > :nth-child(45n+32) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+32) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+32) .u-color-border var(--u-color-32)
.u-colors > :nth-child(45n+33) .u-color, .u-colors .a-CardView-items > :nth-child(45n+33) .u-color var(--u-color-33)
.u-colors > :nth-child(45n+33) .u-color-bg, .u-colors > :nth-child(45n+33) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+33) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+33) .u-color-background var(--u-color-33)
.u-colors > :nth-child(45n+33) .u-color-bd, .u-colors > :nth-child(45n+33) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+33) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+33) .u-color-border var(--u-color-33)
.u-colors > :nth-child(45n+34) .u-color, .u-colors .a-CardView-items > :nth-child(45n+34) .u-color var(--u-color-34)
.u-colors > :nth-child(45n+34) .u-color-bg, .u-colors > :nth-child(45n+34) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+34) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+34) .u-color-background var(--u-color-34)
.u-colors > :nth-child(45n+34) .u-color-bd, .u-colors > :nth-child(45n+34) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+34) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+34) .u-color-border var(--u-color-34)
.u-colors > :nth-child(45n+35) .u-color, .u-colors .a-CardView-items > :nth-child(45n+35) .u-color var(--u-color-35)
.u-colors > :nth-child(45n+35) .u-color-bg, .u-colors > :nth-child(45n+35) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+35) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+35) .u-color-background var(--u-color-35)
.u-colors > :nth-child(45n+35) .u-color-bd, .u-colors > :nth-child(45n+35) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+35) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+35) .u-color-border var(--u-color-35)
.u-colors > :nth-child(45n+36) .u-color, .u-colors .a-CardView-items > :nth-child(45n+36) .u-color var(--u-color-36)
.u-colors > :nth-child(45n+36) .u-color-bg, .u-colors > :nth-child(45n+36) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+36) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+36) .u-color-background var(--u-color-36)
.u-colors > :nth-child(45n+36) .u-color-bd, .u-colors > :nth-child(45n+36) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+36) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+36) .u-color-border var(--u-color-36)
.u-colors > :nth-child(45n+37) .u-color, .u-colors .a-CardView-items > :nth-child(45n+37) .u-color var(--u-color-37)
.u-colors > :nth-child(45n+37) .u-color-bg, .u-colors > :nth-child(45n+37) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+37) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+37) .u-color-background var(--u-color-37)
.u-colors > :nth-child(45n+37) .u-color-bd, .u-colors > :nth-child(45n+37) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+37) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+37) .u-color-border var(--u-color-37)
.u-colors > :nth-child(45n+38) .u-color, .u-colors .a-CardView-items > :nth-child(45n+38) .u-color var(--u-color-38)
.u-colors > :nth-child(45n+38) .u-color-bg, .u-colors > :nth-child(45n+38) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+38) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+38) .u-color-background var(--u-color-38)
.u-colors > :nth-child(45n+38) .u-color-bd, .u-colors > :nth-child(45n+38) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+38) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+38) .u-color-border var(--u-color-38)
.u-colors > :nth-child(45n+39) .u-color, .u-colors .a-CardView-items > :nth-child(45n+39) .u-color var(--u-color-39)
.u-colors > :nth-child(45n+39) .u-color-bg, .u-colors > :nth-child(45n+39) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+39) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+39) .u-color-background var(--u-color-39)
.u-colors > :nth-child(45n+39) .u-color-bd, .u-colors > :nth-child(45n+39) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+39) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+39) .u-color-border var(--u-color-39)
.u-colors > :nth-child(45n+40) .u-color, .u-colors .a-CardView-items > :nth-child(45n+40) .u-color var(--u-color-40)
.u-colors > :nth-child(45n+40) .u-color-bg, .u-colors > :nth-child(45n+40) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+40) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+40) .u-color-background var(--u-color-40)
.u-colors > :nth-child(45n+40) .u-color-bd, .u-colors > :nth-child(45n+40) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+40) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+40) .u-color-border var(--u-color-40)
.u-colors > :nth-child(45n+41) .u-color, .u-colors .a-CardView-items > :nth-child(45n+41) .u-color var(--u-color-41)
.u-colors > :nth-child(45n+41) .u-color-bg, .u-colors > :nth-child(45n+41) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+41) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+41) .u-color-background var(--u-color-41)
.u-colors > :nth-child(45n+41) .u-color-bd, .u-colors > :nth-child(45n+41) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+41) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+41) .u-color-border var(--u-color-41)
.u-colors > :nth-child(45n+42) .u-color, .u-colors .a-CardView-items > :nth-child(45n+42) .u-color var(--u-color-42)
.u-colors > :nth-child(45n+42) .u-color-bg, .u-colors > :nth-child(45n+42) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+42) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+42) .u-color-background var(--u-color-42)
.u-colors > :nth-child(45n+42) .u-color-bd, .u-colors > :nth-child(45n+42) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+42) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+42) .u-color-border var(--u-color-42)
.u-colors > :nth-child(45n+43) .u-color, .u-colors .a-CardView-items > :nth-child(45n+43) .u-color var(--u-color-43)
.u-colors > :nth-child(45n+43) .u-color-bg, .u-colors > :nth-child(45n+43) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+43) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+43) .u-color-background var(--u-color-43)
.u-colors > :nth-child(45n+43) .u-color-bd, .u-colors > :nth-child(45n+43) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+43) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+43) .u-color-border var(--u-color-43)
.u-colors > :nth-child(45n+44) .u-color, .u-colors .a-CardView-items > :nth-child(45n+44) .u-color var(--u-color-44)
.u-colors > :nth-child(45n+44) .u-color-bg, .u-colors > :nth-child(45n+44) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+44) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+44) .u-color-background var(--u-color-44)
.u-colors > :nth-child(45n+44) .u-color-bd, .u-colors > :nth-child(45n+44) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+44) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+44) .u-color-border var(--u-color-44)
.u-colors > :nth-child(45n+45) .u-color, .u-colors .a-CardView-items > :nth-child(45n+45) .u-color var(--u-color-45)
.u-colors > :nth-child(45n+45) .u-color-bg, .u-colors > :nth-child(45n+45) .u-color-background, .u-colors .a-CardView-items > :nth-child(45n+45) .u-color-bg, .u-colors .a-CardView-items > :nth-child(45n+45) .u-color-background var(--u-color-45)
.u-colors > :nth-child(45n+45) .u-color-bd, .u-colors > :nth-child(45n+45) .u-color-border, .u-colors .a-CardView-items > :nth-child(45n+45) .u-color-bd, .u-colors .a-CardView-items > :nth-child(45n+45) .u-color-border var(--u-color-45)
.u-color-transparent transparent
.u-color-transparent-bg transparent
.u-color-transparent-bd, .u-color-transparent-border transparent

--u-color-contrast

Selector Value Color
.t-BadgeList--circular .t-BadgeList-value var(--ut-badgelist-value-text-color)
.t-BadgeList--dash .t-BadgeList-label var(--ut-component-text-default-color)
.u-color-1 var(--u-color-1-contrast)
.u-color-2 var(--u-color-2-contrast)
.u-color-3 var(--u-color-3-contrast)
.u-color-4 var(--u-color-4-contrast)
.u-color-5 var(--u-color-5-contrast)
.u-color-6 var(--u-color-6-contrast)
.u-color-7 var(--u-color-7-contrast)
.u-color-8 var(--u-color-8-contrast)
.u-color-9 var(--u-color-9-contrast)
.u-color-10 var(--u-color-10-contrast)
.u-color-11 var(--u-color-11-contrast)
.u-color-12 var(--u-color-12-contrast)
.u-color-13 var(--u-color-13-contrast)
.u-color-14 var(--u-color-14-contrast)
.u-color-15 var(--u-color-15-contrast)
.u-color-16 var(--u-color-16-contrast)
.u-color-17 var(--u-color-17-contrast)
.u-color-18 var(--u-color-18-contrast)
.u-color-19 var(--u-color-19-contrast)
.u-color-20 var(--u-color-20-contrast)
.u-color-21 var(--u-color-21-contrast)
.u-color-22 var(--u-color-22-contrast)
.u-color-23 var(--u-color-23-contrast)
.u-color-24 var(--u-color-24-contrast)
.u-color-25 var(--u-color-25-contrast)
.u-color-26 var(--u-color-26-contrast)
.u-color-27 var(--u-color-27-contrast)
.u-color-28 var(--u-color-28-contrast)
.u-color-29 var(--u-color-29-contrast)
.u-color-30 var(--u-color-30-contrast)
.u-color-31 var(--u-color-31-contrast)
.u-color-32 var(--u-color-32-contrast)
.u-color-33 var(--u-color-33-contrast)
.u-color-34 var(--u-color-34-contrast)
.u-color-35 var(--u-color-35-contrast)
.u-color-36 var(--u-color-36-contrast)
.u-color-37 var(--u-color-37-contrast)
.u-color-38 var(--u-color-38-contrast)
.u-color-39 var(--u-color-39-contrast)
.u-color-40 var(--u-color-40-contrast)
.u-color-41 var(--u-color-41-contrast)
.u-color-42 var(--u-color-42-contrast)
.u-color-43 var(--u-color-43-contrast)
.u-color-44 var(--u-color-44-contrast)
.u-color-45 var(--u-color-45-contrast)
.u-colors > :nth-child(45n+1) .u-color, .u-colors .a-CardView-items > :nth-child(45n+1) .u-color var(--u-color-1-contrast)
.u-colors > :nth-child(45n+1) .u-color-txt, .u-colors > :nth-child(45n+1) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+1) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+1) .u-color-text var(--u-color-1)
.u-colors > :nth-child(45n+2) .u-color, .u-colors .a-CardView-items > :nth-child(45n+2) .u-color var(--u-color-2-contrast)
.u-colors > :nth-child(45n+2) .u-color-txt, .u-colors > :nth-child(45n+2) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+2) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+2) .u-color-text var(--u-color-2)
.u-colors > :nth-child(45n+3) .u-color, .u-colors .a-CardView-items > :nth-child(45n+3) .u-color var(--u-color-3-contrast)
.u-colors > :nth-child(45n+3) .u-color-txt, .u-colors > :nth-child(45n+3) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+3) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+3) .u-color-text var(--u-color-3)
.u-colors > :nth-child(45n+4) .u-color, .u-colors .a-CardView-items > :nth-child(45n+4) .u-color var(--u-color-4-contrast)
.u-colors > :nth-child(45n+4) .u-color-txt, .u-colors > :nth-child(45n+4) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+4) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+4) .u-color-text var(--u-color-4)
.u-colors > :nth-child(45n+5) .u-color, .u-colors .a-CardView-items > :nth-child(45n+5) .u-color var(--u-color-5-contrast)
.u-colors > :nth-child(45n+5) .u-color-txt, .u-colors > :nth-child(45n+5) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+5) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+5) .u-color-text var(--u-color-5)
.u-colors > :nth-child(45n+6) .u-color, .u-colors .a-CardView-items > :nth-child(45n+6) .u-color var(--u-color-6-contrast)
.u-colors > :nth-child(45n+6) .u-color-txt, .u-colors > :nth-child(45n+6) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+6) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+6) .u-color-text var(--u-color-6)
.u-colors > :nth-child(45n+7) .u-color, .u-colors .a-CardView-items > :nth-child(45n+7) .u-color var(--u-color-7-contrast)
.u-colors > :nth-child(45n+7) .u-color-txt, .u-colors > :nth-child(45n+7) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+7) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+7) .u-color-text var(--u-color-7)
.u-colors > :nth-child(45n+8) .u-color, .u-colors .a-CardView-items > :nth-child(45n+8) .u-color var(--u-color-8-contrast)
.u-colors > :nth-child(45n+8) .u-color-txt, .u-colors > :nth-child(45n+8) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+8) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+8) .u-color-text var(--u-color-8)
.u-colors > :nth-child(45n+9) .u-color, .u-colors .a-CardView-items > :nth-child(45n+9) .u-color var(--u-color-9-contrast)
.u-colors > :nth-child(45n+9) .u-color-txt, .u-colors > :nth-child(45n+9) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+9) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+9) .u-color-text var(--u-color-9)
.u-colors > :nth-child(45n+10) .u-color, .u-colors .a-CardView-items > :nth-child(45n+10) .u-color var(--u-color-10-contrast)
.u-colors > :nth-child(45n+10) .u-color-txt, .u-colors > :nth-child(45n+10) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+10) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+10) .u-color-text var(--u-color-10)
.u-colors > :nth-child(45n+11) .u-color, .u-colors .a-CardView-items > :nth-child(45n+11) .u-color var(--u-color-11-contrast)
.u-colors > :nth-child(45n+11) .u-color-txt, .u-colors > :nth-child(45n+11) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+11) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+11) .u-color-text var(--u-color-11)
.u-colors > :nth-child(45n+12) .u-color, .u-colors .a-CardView-items > :nth-child(45n+12) .u-color var(--u-color-12-contrast)
.u-colors > :nth-child(45n+12) .u-color-txt, .u-colors > :nth-child(45n+12) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+12) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+12) .u-color-text var(--u-color-12)
.u-colors > :nth-child(45n+13) .u-color, .u-colors .a-CardView-items > :nth-child(45n+13) .u-color var(--u-color-13-contrast)
.u-colors > :nth-child(45n+13) .u-color-txt, .u-colors > :nth-child(45n+13) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+13) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+13) .u-color-text var(--u-color-13)
.u-colors > :nth-child(45n+14) .u-color, .u-colors .a-CardView-items > :nth-child(45n+14) .u-color var(--u-color-14-contrast)
.u-colors > :nth-child(45n+14) .u-color-txt, .u-colors > :nth-child(45n+14) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+14) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+14) .u-color-text var(--u-color-14)
.u-colors > :nth-child(45n+15) .u-color, .u-colors .a-CardView-items > :nth-child(45n+15) .u-color var(--u-color-15-contrast)
.u-colors > :nth-child(45n+15) .u-color-txt, .u-colors > :nth-child(45n+15) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+15) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+15) .u-color-text var(--u-color-15)
.u-colors > :nth-child(45n+16) .u-color, .u-colors .a-CardView-items > :nth-child(45n+16) .u-color var(--u-color-16-contrast)
.u-colors > :nth-child(45n+16) .u-color-txt, .u-colors > :nth-child(45n+16) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+16) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+16) .u-color-text var(--u-color-16)
.u-colors > :nth-child(45n+17) .u-color, .u-colors .a-CardView-items > :nth-child(45n+17) .u-color var(--u-color-17-contrast)
.u-colors > :nth-child(45n+17) .u-color-txt, .u-colors > :nth-child(45n+17) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+17) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+17) .u-color-text var(--u-color-17)
.u-colors > :nth-child(45n+18) .u-color, .u-colors .a-CardView-items > :nth-child(45n+18) .u-color var(--u-color-18-contrast)
.u-colors > :nth-child(45n+18) .u-color-txt, .u-colors > :nth-child(45n+18) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+18) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+18) .u-color-text var(--u-color-18)
.u-colors > :nth-child(45n+19) .u-color, .u-colors .a-CardView-items > :nth-child(45n+19) .u-color var(--u-color-19-contrast)
.u-colors > :nth-child(45n+19) .u-color-txt, .u-colors > :nth-child(45n+19) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+19) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+19) .u-color-text var(--u-color-19)
.u-colors > :nth-child(45n+20) .u-color, .u-colors .a-CardView-items > :nth-child(45n+20) .u-color var(--u-color-20-contrast)
.u-colors > :nth-child(45n+20) .u-color-txt, .u-colors > :nth-child(45n+20) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+20) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+20) .u-color-text var(--u-color-20)
.u-colors > :nth-child(45n+21) .u-color, .u-colors .a-CardView-items > :nth-child(45n+21) .u-color var(--u-color-21-contrast)
.u-colors > :nth-child(45n+21) .u-color-txt, .u-colors > :nth-child(45n+21) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+21) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+21) .u-color-text var(--u-color-21)
.u-colors > :nth-child(45n+22) .u-color, .u-colors .a-CardView-items > :nth-child(45n+22) .u-color var(--u-color-22-contrast)
.u-colors > :nth-child(45n+22) .u-color-txt, .u-colors > :nth-child(45n+22) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+22) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+22) .u-color-text var(--u-color-22)
.u-colors > :nth-child(45n+23) .u-color, .u-colors .a-CardView-items > :nth-child(45n+23) .u-color var(--u-color-23-contrast)
.u-colors > :nth-child(45n+23) .u-color-txt, .u-colors > :nth-child(45n+23) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+23) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+23) .u-color-text var(--u-color-23)
.u-colors > :nth-child(45n+24) .u-color, .u-colors .a-CardView-items > :nth-child(45n+24) .u-color var(--u-color-24-contrast)
.u-colors > :nth-child(45n+24) .u-color-txt, .u-colors > :nth-child(45n+24) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+24) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+24) .u-color-text var(--u-color-24)
.u-colors > :nth-child(45n+25) .u-color, .u-colors .a-CardView-items > :nth-child(45n+25) .u-color var(--u-color-25-contrast)
.u-colors > :nth-child(45n+25) .u-color-txt, .u-colors > :nth-child(45n+25) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+25) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+25) .u-color-text var(--u-color-25)
.u-colors > :nth-child(45n+26) .u-color, .u-colors .a-CardView-items > :nth-child(45n+26) .u-color var(--u-color-26-contrast)
.u-colors > :nth-child(45n+26) .u-color-txt, .u-colors > :nth-child(45n+26) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+26) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+26) .u-color-text var(--u-color-26)
.u-colors > :nth-child(45n+27) .u-color, .u-colors .a-CardView-items > :nth-child(45n+27) .u-color var(--u-color-27-contrast)
.u-colors > :nth-child(45n+27) .u-color-txt, .u-colors > :nth-child(45n+27) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+27) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+27) .u-color-text var(--u-color-27)
.u-colors > :nth-child(45n+28) .u-color, .u-colors .a-CardView-items > :nth-child(45n+28) .u-color var(--u-color-28-contrast)
.u-colors > :nth-child(45n+28) .u-color-txt, .u-colors > :nth-child(45n+28) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+28) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+28) .u-color-text var(--u-color-28)
.u-colors > :nth-child(45n+29) .u-color, .u-colors .a-CardView-items > :nth-child(45n+29) .u-color var(--u-color-29-contrast)
.u-colors > :nth-child(45n+29) .u-color-txt, .u-colors > :nth-child(45n+29) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+29) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+29) .u-color-text var(--u-color-29)
.u-colors > :nth-child(45n+30) .u-color, .u-colors .a-CardView-items > :nth-child(45n+30) .u-color var(--u-color-30-contrast)
.u-colors > :nth-child(45n+30) .u-color-txt, .u-colors > :nth-child(45n+30) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+30) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+30) .u-color-text var(--u-color-30)
.u-colors > :nth-child(45n+31) .u-color, .u-colors .a-CardView-items > :nth-child(45n+31) .u-color var(--u-color-31-contrast)
.u-colors > :nth-child(45n+31) .u-color-txt, .u-colors > :nth-child(45n+31) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+31) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+31) .u-color-text var(--u-color-31)
.u-colors > :nth-child(45n+32) .u-color, .u-colors .a-CardView-items > :nth-child(45n+32) .u-color var(--u-color-32-contrast)
.u-colors > :nth-child(45n+32) .u-color-txt, .u-colors > :nth-child(45n+32) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+32) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+32) .u-color-text var(--u-color-32)
.u-colors > :nth-child(45n+33) .u-color, .u-colors .a-CardView-items > :nth-child(45n+33) .u-color var(--u-color-33-contrast)
.u-colors > :nth-child(45n+33) .u-color-txt, .u-colors > :nth-child(45n+33) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+33) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+33) .u-color-text var(--u-color-33)
.u-colors > :nth-child(45n+34) .u-color, .u-colors .a-CardView-items > :nth-child(45n+34) .u-color var(--u-color-34-contrast)
.u-colors > :nth-child(45n+34) .u-color-txt, .u-colors > :nth-child(45n+34) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+34) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+34) .u-color-text var(--u-color-34)
.u-colors > :nth-child(45n+35) .u-color, .u-colors .a-CardView-items > :nth-child(45n+35) .u-color var(--u-color-35-contrast)
.u-colors > :nth-child(45n+35) .u-color-txt, .u-colors > :nth-child(45n+35) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+35) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+35) .u-color-text var(--u-color-35)
.u-colors > :nth-child(45n+36) .u-color, .u-colors .a-CardView-items > :nth-child(45n+36) .u-color var(--u-color-36-contrast)
.u-colors > :nth-child(45n+36) .u-color-txt, .u-colors > :nth-child(45n+36) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+36) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+36) .u-color-text var(--u-color-36)
.u-colors > :nth-child(45n+37) .u-color, .u-colors .a-CardView-items > :nth-child(45n+37) .u-color var(--u-color-37-contrast)
.u-colors > :nth-child(45n+37) .u-color-txt, .u-colors > :nth-child(45n+37) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+37) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+37) .u-color-text var(--u-color-37)
.u-colors > :nth-child(45n+38) .u-color, .u-colors .a-CardView-items > :nth-child(45n+38) .u-color var(--u-color-38-contrast)
.u-colors > :nth-child(45n+38) .u-color-txt, .u-colors > :nth-child(45n+38) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+38) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+38) .u-color-text var(--u-color-38)
.u-colors > :nth-child(45n+39) .u-color, .u-colors .a-CardView-items > :nth-child(45n+39) .u-color var(--u-color-39-contrast)
.u-colors > :nth-child(45n+39) .u-color-txt, .u-colors > :nth-child(45n+39) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+39) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+39) .u-color-text var(--u-color-39)
.u-colors > :nth-child(45n+40) .u-color, .u-colors .a-CardView-items > :nth-child(45n+40) .u-color var(--u-color-40-contrast)
.u-colors > :nth-child(45n+40) .u-color-txt, .u-colors > :nth-child(45n+40) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+40) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+40) .u-color-text var(--u-color-40)
.u-colors > :nth-child(45n+41) .u-color, .u-colors .a-CardView-items > :nth-child(45n+41) .u-color var(--u-color-41-contrast)
.u-colors > :nth-child(45n+41) .u-color-txt, .u-colors > :nth-child(45n+41) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+41) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+41) .u-color-text var(--u-color-41)
.u-colors > :nth-child(45n+42) .u-color, .u-colors .a-CardView-items > :nth-child(45n+42) .u-color var(--u-color-42-contrast)
.u-colors > :nth-child(45n+42) .u-color-txt, .u-colors > :nth-child(45n+42) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+42) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+42) .u-color-text var(--u-color-42)
.u-colors > :nth-child(45n+43) .u-color, .u-colors .a-CardView-items > :nth-child(45n+43) .u-color var(--u-color-43-contrast)
.u-colors > :nth-child(45n+43) .u-color-txt, .u-colors > :nth-child(45n+43) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+43) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+43) .u-color-text var(--u-color-43)
.u-colors > :nth-child(45n+44) .u-color, .u-colors .a-CardView-items > :nth-child(45n+44) .u-color var(--u-color-44-contrast)
.u-colors > :nth-child(45n+44) .u-color-txt, .u-colors > :nth-child(45n+44) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+44) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+44) .u-color-text var(--u-color-44)
.u-colors > :nth-child(45n+45) .u-color, .u-colors .a-CardView-items > :nth-child(45n+45) .u-color var(--u-color-45-contrast)
.u-colors > :nth-child(45n+45) .u-color-txt, .u-colors > :nth-child(45n+45) .u-color-text, .u-colors .a-CardView-items > :nth-child(45n+45) .u-color-txt, .u-colors .a-CardView-items > :nth-child(45n+45) .u-color-text var(--u-color-45)
.u-color-transparent transparent
.u-color-transparent-txt, .u-color-transparent-text transparent

--ut-badgelist-value-border-radius

Selector Value Color
.t-BadgeList--circular .t-BadgeList-value 128px
.t-BadgeList--circular .t-BadgeList-value a:before 128px

--ut-badgelist-value-border-width

Selector Value Color
.t-BadgeList--circular .t-BadgeList-value 1px

--ut-badgelist-value-border-color

Selector Value Color
.t-BadgeList--circular .t-BadgeList-value var(--ut-component-border-color)
.t-BadgeList--circular a.t-BadgeList-wrap:hover transparent

--ut-badgelist-value-background-color

Selector Value Color
.t-BadgeList--circular a.t-BadgeList-wrap:hover var(--ut-component-icon-background-color)
.t-BadgeList--circular a.t-BadgeList-wrap:hover .t-BadgeList-value var(--ut-component-background-color)

--ut-badgelist-value-text-color

Selector Value Color
.t-BadgeList--circular a.t-BadgeList-wrap:hover var(--ut-component-icon-color)

--ut-badgelist-value-size

Selector Value Color
.t-BadgeList--dash auto
.t-BadgeList--circular.t-BadgeList--small var(--ut-badgelist-value-size-small, 32px)
.t-BadgeList--circular.t-BadgeList--medium var(--ut-badgelist-value-size-medium, 48px)
.t-BadgeList--circular.t-BadgeList--large var(--ut-badgelist-value-size-large, 64px)
.t-BadgeList--circular.t-BadgeList--xlarge var(--ut-badgelist-value-size-xlarge, 96px)
.t-BadgeList--circular.t-BadgeList--xxlarge var(--ut-badgelist-value-size-xxlarge, 128px)

--ut-badgelist-value-font-size

Selector Value Color
.t-BadgeList--dash 32px
.t-BadgeList--circular.t-BadgeList--small var(--ut-badgelist-value-font-size-small, 12px)
.t-BadgeList--dash.t-BadgeList--small 16px
.t-BadgeList--circular.t-BadgeList--medium var(--ut-badgelist-value-font-size-medium, 16px)
.t-BadgeList--dash.t-BadgeList--medium 24px
.t-BadgeList--circular.t-BadgeList--large var(--ut-badgelist-value-font-size-large, 20px)
.t-BadgeList--dash.t-BadgeList--large 32px
.t-BadgeList--circular.t-BadgeList--xlarge var(--ut-badgelist-value-font-size-xlarge, 24px)
.t-BadgeList--dash.t-BadgeList--xlarge 48px
.t-BadgeList--circular.t-BadgeList--xxlarge var(--ut-badgelist-value-font-size-xxlarge, 32px)
.t-BadgeList--dash.t-BadgeList--xxlarge 64px

--ut-badgelist-value-line-height

Selector Value Color
.t-BadgeList--dash 1.5
.t-BadgeList--dash.t-BadgeList--small 1.5
.t-BadgeList--dash.t-BadgeList--medium 1.5
.t-BadgeList--dash.t-BadgeList--large 1.5
.t-BadgeList--dash.t-BadgeList--xlarge 1.5
.t-BadgeList--dash.t-BadgeList--xxlarge 1.5

--ut-badgelist-label-font-size

Selector Value Color
.t-BadgeList--dash 14px
.t-BadgeList--circular.t-BadgeList--small var(--ut-badgelist-label-font-size-small, 10px)
.t-BadgeList--dash.t-BadgeList--small var(--ut-badgelist-label-font-size-small, 10px)
.t-BadgeList--circular.t-BadgeList--medium var(--ut-badgelist-label-font-size-medium, 12px)
.t-BadgeList--dash.t-BadgeList--medium var(--ut-badgelist-label-font-size-medium, 12px)
.t-BadgeList--circular.t-BadgeList--large var(--ut-badgelist-label-font-size-large, 14px)
.t-BadgeList--dash.t-BadgeList--large var(--ut-badgelist-label-font-size-large, 14px)
.t-BadgeList--circular.t-BadgeList--xlarge var(--ut-badgelist-label-font-size-xlarge, 16px)
.t-BadgeList--dash.t-BadgeList--xlarge var(--ut-badgelist-label-font-size-xlarge, 16px)
.t-BadgeList--circular.t-BadgeList--xxlarge var(--ut-badgelist-label-font-size-xxlarge, 20px)
.t-BadgeList--dash.t-BadgeList--xxlarge var(--ut-badgelist-label-font-size-xxlarge, 20px)

--ut-badgelist-wrap-padding

Selector Value Color
.t-BadgeList--dash .t-BadgeList-wrap 12px
.t-BadgeList--dash .t-BadgeList-wrap:before 12px

--ut-badgelist-wrap-border-radius

Selector Value Color
.t-BadgeList--dash .t-BadgeList-wrap 4px
.t-BadgeList--dash .t-BadgeList-wrap:before 4px

--ut-badgelist-wrap-hover-background-color

Selector Value Color
.t-BadgeList--dash .t-BadgeList-wrap:before var(--ut-component-border-color)

--ut-badgelist-item-border-color

Selector Value Color
.t-BadgeList-item:before, .t-BadgeList-item:after var(--ut-component-border-color)

--ut-badgelist-item-border-width

Selector Value Color
.t-BadgeList-item:before 1px
.t-BadgeList-item:after 1px

--ut-linkslist-text-color

Selector Value Color
.t-LinksList-link var(--ut-link-text-color)

--ut-medialist-item-border-width

Selector Value Color
.t-MediaList-item var(--ut-component-inner-border-width)
.t-MediaList--horizontal .t-MediaList-item var(--ut-component-inner-border-width)
.t-MediaList--horizontal .t-MediaList-item .u-RTL var(--ut-component-inner-border-width)
.t-MediaList--cols var(--ut-component-inner-border-width)

--ut-medialist-item-border-color

Selector Value Color
.t-MediaList-item var(--ut-component-inner-border-color)
.t-MediaList--horizontal .t-MediaList-item var(--ut-component-inner-border-color)
.t-MediaList--horizontal .t-MediaList-item .u-RTL var(--ut-component-inner-border-color)

--ut-medialist-item-grid-gap

Selector Value Color
.t-MediaList-itemWrap 8px
.t-MediaList-itemWrap 8px
.t-MediaList-itemWrap 16px

--ut-medialist-title-text-color

Selector Value Color
a.t-MediaList-itemWrap var(--ut-link-text-color)
.t-MediaList-title var(--ut-component-text-title-color)

--ut-medialist-item-background-color

Selector Value Color
a.t-MediaList-itemWrap:hover var(--ut-medialist-item-hover-background-color, var(--ut-component-highlight-background-color))

--ut-medialist-icon-border-radius

Selector Value Color
.t-MediaList-icon 100%
.t-MediaList--iconsSquare 0
.t-MediaList--iconsRounded 12.5%

--ut-medialist-icon-color

Selector Value Color
.t-MediaList-icon var(--ut-component-icon-color)

--ut-medialist-icon-container-size

Selector Value Color
.t-MediaList-icon 32px
.t-MediaList-icon 32px
.t-MediaList--large 64px

--ut-medialist-icon-size

Selector Value Color
.t-MediaList-icon .t-Icon 16px
.t-MediaList--large 32px

--ut-medialist-body-padding-y

Selector Value Color
.t-MediaList-body 16px

--ut-medialist-body-padding-x

Selector Value Color
.t-MediaList-body 16px

--ut-medialist-title-font-size

Selector Value Color
.t-MediaList-title 14px
.t-MediaList--large 16px

--ut-medialist-title-font-weight

Selector Value Color
.t-MediaList-title 500

--ut-medialist-title-line-height

Selector Value Color
.t-MediaList-title 20px
.t-MediaList--large 24px

--ut-medialist-desc-font-size

Selector Value Color
.t-MediaList-desc 12px
.t-MediaList--large 14px

--ut-medialist-desc-line-height

Selector Value Color
.t-MediaList-desc 16px
.t-MediaList--large 20px

--ut-medialist-desc-text-color

Selector Value Color
.t-MediaList-desc var(--ut-component-text-muted-color)

--ut-medialist-badge-padding-x

Selector Value Color
.t-MediaList-badge 8px
.t-MediaList-badge 8px

--ut-medialist-badge-padding-y

Selector Value Color
.t-MediaList-badge 2px
.t-MediaList-badge 2px

--ut-medialist-badge-background-color

Selector Value Color
.t-MediaList-badge var(--ut-component-badge-background-color)

--ut-medialist-badge-color

Selector Value Color
.t-MediaList-badge var(--ut-component-badge-text-color)

--ut-medialist-badge-font-size

Selector Value Color
.t-MediaList-badge 12px

--ut-medialist-badge-line-height

Selector Value Color
.t-MediaList-badge 20px

--ut-medialist-badge-border-radius

Selector Value Color
.t-MediaList-badge var(--ut-component-badge-border-radius)

--ut-cardlist-color

Selector Value Color
.t-Card-wrap var(--ut-component-text-default-color)

--ut-cardlist-background-color

Selector Value Color
.t-Card-wrap var(--ut-component-background-color)
.t-Cards--sampleAppsFooter transparent

--ut-cardlist-wrap-border-width

Selector Value Color
.t-Card-wrap 1px

--ut-cardlist-wrap-border-color

Selector Value Color
.t-Card-wrap var(--ut-component-border-color)
.t-Cards--sampleAppsFooter transparent

--ut-cardlist-border-radius

Selector Value Color
.t-Card-wrap 3px

--ut-cardlist-box-shadow

Selector Value Color
.t-Card-wrap var(--ut-component-box-shadow)
.t-Cards--sampleAppsFooter none

--ut-cardlist-icon-border-radius

Selector Value Color
.t-Card-icon 100%
.t-Cards--block .t-Icon 100%
.t-Cards--iconsSquare, .t-Cards.Square 0
.t-Cards--iconsRounded 12.5%

--ut-cardlist-icon-color

Selector Value Color
.t-Card-icon var(--ut-component-icon-color)

--ut-cardlist-initials-font-size

Selector Value Color
.t-Card-initials 20px
.t-Cards--basic 12px
.t-Cards--compact 12px
.t-Cards--featured 20px

--ut-cardlist-initials-border-radius

Selector Value Color
.t-Card-initials img 100%

--ut-cardlist-title-text-color

Selector Value Color
.t-Card-title var(--ut-component-text-title-color)

--ut-cardlist-subtitle-text-color

Selector Value Color
.t-Card-subtitle var(--ut-component-text-subtitle-color)

--ut-cardlist-body-border-border-width

Selector Value Color
.t-Card-body var(--ut-component-inner-border-width)

--ut-cardlist-body-border-border-color

Selector Value Color
.t-Card-body var(--ut-component-inner-border-color)

--ut-cardlist-desc-color

Selector Value Color
.t-Card-desc var(--ut-component-text-default-color)

--ut-cardlist-info-margin-y

Selector Value Color
.t-Card-desc:empty + .t-Card-info 0
.t-Card-info 12px

--ut-cardlist-info-color

Selector Value Color
.t-Card-info var(--ut-component-text-muted-color)

--ut-cardlist-info-font-size

Selector Value Color
.t-Card-info 11px

--ut-cardlist-info-line-height

Selector Value Color
.t-Card-info 16px

--ut-cardlist-icon-container-size

Selector Value Color
.t-Cards--basic 32px
.t-Cards--compact 32px
.t-Cards--featured 64px

--ut-cardlist-icon-size

Selector Value Color
.t-Cards--basic 16px
.t-Cards--compact 16px
.t-Cards--featured 32px

--ut-cardlist-initials-font-weight

Selector Value Color
.t-Cards--basic var(--a-base-font-weight-semibold, 500)
.t-Cards--compact var(--a-base-font-weight-semibold, 500)
.t-Cards--featured normal

--ut-cardlist-titlewrap-padding-x

Selector Value Color
.t-Cards--basic 16px
.t-Cards--compact 8px
.t-Cards--featured 16px

--ut-cardlist-titlewrap-padding-y

Selector Value Color
.t-Cards--basic 12px
.t-Cards--compact 8px
.t-Cards--featured 24px

--ut-cardlist-title-font-size

Selector Value Color
.t-Cards--basic 16px
.t-Cards--compact 14px
.t-Cards--featured 16px
.t-Cards--sampleAppsFooter 12px

--ut-cardlist-title-font-weight

Selector Value Color
.t-Cards--basic var(--a-base-font-weight-semibold, 500)
.t-Cards--compact normal
.t-Cards--featured var(--a-base-font-weight-semibold, 500)

--ut-cardlist-title-line-height

Selector Value Color
.t-Cards--basic 20px
.t-Cards--compact 16px
.t-Cards--featured 1.5
.t-Cards--sampleAppsFooter 1.5

--ut-cardlist-subtitle-font-size

Selector Value Color
.t-Cards--basic 12px
.t-Cards--compact 11px
.t-Cards--featured 12px

--ut-cardlist-subtitle-font-weight

Selector Value Color
.t-Cards--basic normal
.t-Cards--compact normal
.t-Cards--featured normal

--ut-cardlist-subtitle-line-height

Selector Value Color
.t-Cards--basic 16px
.t-Cards--compact 12px
.t-Cards--featured 16px

--ut-cardlist-subtitle-margin-y

Selector Value Color
.t-Cards--basic 4px
.t-Cards--compact 4px
.t-Cards--featured 4px

--ut-cardlist-body-padding-x

Selector Value Color
.t-Cards--basic 16px
.t-Cards--compact 8px
.t-Cards--featured 16px

--ut-cardlist-body-padding-y

Selector Value Color
.t-Cards--basic 16px
.t-Cards--compact 8px
.t-Cards--featured 16px

--ut-cardlist-desc-font-size

Selector Value Color
.t-Cards--basic 14px
.t-Cards--compact 12px
.t-Cards--featured 14px

--ut-cardlist-desc-line-height

Selector Value Color
.t-Cards--basic 20px
.t-Cards--compact 16px
.t-Cards--featured 20px

--ut-cardlist-icon-overlay-background-color

Selector Value Color
.t-Cards--block .t-Icon var(--ut-component-border-color)

--ut-cardlist-desc-lines

Selector Value Color
.t-Cards--desc-2ln 2
.t-Cards--desc-3ln 3
.t-Cards--desc-4ln 4

--ut-cardlist-item-max-width

Selector Value Color
.t-Cards--float 320px

--ut-cardlist-grid-gap

Selector Value Color
.t-Cards--float .t-Cards-item 16px
.t-Cards--float .t-Cards-item 16px
.u-RTL .t-Cards--float .t-Cards-item 16px
.t-Cards--stacked, .t-Cards--cols, .t-Cards--2cols, .t-Cards--3cols, .t-Cards--4cols, .t-Cards--5cols 16px

--ut-cardlist-colorfill-size

Selector Value Color
.t-Card-colorFill:after 2px

--ut-cardlist-colorfill-offset

Selector Value Color
.t-Card-colorFill:after 2px

--ut-tabs-border-width

Selector Value Color
.t-Tabs 0
.t-Tabs--pill var(--ut-component-border-width)
.t-Tabs--pill .t-Tabs-item 1px
.u-RTL .t-Tabs--pill .t-Tabs-item 1px

--ut-tabs-item-font-size

Selector Value Color
.t-Tabs-item 14px
.t-Tabs--large 14px
.t-Tabs--small 11px
.apex-rds-item 14px

--ut-tabs-item-line-height

Selector Value Color
.t-Tabs-item 16px
.apex-rds-item 16px

--ut-tabs-item-icon-spacing

Selector Value Color
.t-Tabs-item .t-Icon 6px
.t-Tabs--iconsAbove .t-Icon 6px

--ut-tabs-item-background-color

Selector Value Color
.t-Tabs-item:hover var(--ut-tabs-item-hover-background-color, var(--ut-component-highlight-background-color))
.t-Tabs-item.is-active var(--ut-tabs-item-active-background-color)
.apex-rds-selected var(--ut-tabs-item-active-background-color)

--ut-tabs-item-text-color

Selector Value Color
.t-Tabs-item.is-active var(--ut-tabs-item-active-text-color)
.t-Tabs-link var(--ut-link-text-color)
.apex-rds-item a var(--ut-link-text-color)
.apex-rds-selected var(--ut-tabs-item-active-text-color)

--ut-tabs-item-highlight-color

Selector Value Color
.t-Tabs-item.is-active var(--ut-tabs-item-active-highlight-color)
.apex-rds-selected var(--ut-tabs-item-active-highlight-color)

--ut-tabs-item-padding-y

Selector Value Color
.t-Tabs-link 12p
.t-Tabs--large 16px
.t-Tabs--small 8px
.apex-rds 12px
.apex-rds-item span 12px
.apex-rds-item span 12px
.vertical-rds .apex-rds, .t-Body-side .apex-rds 8px

--ut-tabs-border-radius

Selector Value Color
.t-Tabs--pill var(--ut-component-border-radius, 2px)
.t-Tabs--pill .t-Tabs-item:first-child .t-Tabs-link 2px
.t-Tabs--pill .t-Tabs-item:first-child .t-Tabs-link 2px
.u-RTL .t-Tabs--pill .t-Tabs-item:first-child .t-Tabs-link 2px
.u-RTL .t-Tabs--pill .t-Tabs-item:first-child .t-Tabs-link 2px
.t-Tabs--pill .t-Tabs-item:last-child .t-Tabs-link 2px
.t-Tabs--pill .t-Tabs-item:last-child .t-Tabs-link 2px
.u-RTL .t-Tabs--pill .t-Tabs-item:last-child .t-Tabs-link 2px
.u-RTL .t-Tabs--pill .t-Tabs-item:last-child .t-Tabs-link 2px

--ut-tabs-border-color

Selector Value Color
.t-Tabs--pill var(--ut-component-border-color)
.t-Tabs--pill .t-Tabs-item rgba(0, 0, 0, 0.1)
.u-RTL .t-Tabs--pill .t-Tabs-item rgba(0, 0, 0, 0.1)

--ut-tabs-box-shadow

Selector Value Color
.t-Tabs--pill var(--ut-shadow-sm)

--ut-tabs-item-width

Selector Value Color
.t-Tabs--fixedLabels .t-Tabs-item 120px

--ut-tabs-item-padding-x

Selector Value Color
.t-Tabs--large 24px
.t-Tabs--small 8px
.apex-rds 8px
.apex-rds-item a 8px
.apex-rds-item a 8px
.vertical-rds .apex-rds, .t-Body-side .apex-rds 12px
.vertical-rds .apex-rds span, .t-Body-side .apex-rds span 12px
.vertical-rds .apex-rds span, .t-Body-side .apex-rds span 12px
.t-Body-info .apex-rds 8px
.t-Body-info .apex-rds 8px
.t-Body-info .apex-rds 8px
.t-Body-info .apex-rds a 8px

--ut-tabs-item-active-highlight-width

Selector Value Color
.vertical-rds .apex-rds, .t-Body-side .apex-rds 4px
.vertical-rds .apex-rds-selected span, .t-Body-side .apex-rds-selected span currentColor ins

--ut-hero-region-padding-y

Selector Value Color
.t-HeroRegion var(--ut-xs-hero-region-padding-y, 8px)
.t-HeroRegion-wrap 16p
.t-HeroRegion--noPadding 0px

--ut-hero-region-padding-x

Selector Value Color
.t-HeroRegion var(--ut-xs-hero-region-padding-x, 8px)
.t-HeroRegion--noPadding 0px

--ut-hero-region-font-size

Selector Value Color
.t-HeroRegion-col--content 16px
.t-HeroRegion-col--content var(--ut-xs-hero-region-font-size, 12px)

--ut-hero-region-line-height

Selector Value Color
.t-HeroRegion-col--content 24px
.t-HeroRegion-col--content var(--ut-xs-hero-region-line-height, 16px)

--ut-hero-region-content-text-color

Selector Value Color
.t-HeroRegion-col--content var(--ut-component-text-muted-color)
.t-Body-title .t-HeroRegion-col--content var(--ut-hero-region-title-text-color, var(--ut-component-text-title-color))

--ut-hero-region-column-spacing

Selector Value Color
.t-HeroRegion-form 16px
.u-RTL .t-HeroRegion-form 16px
.t-HeroRegion--featured.t-HeroRegion--centered .t-HeroRegion-col--left 16px
.t-HeroRegion--featured.t-HeroRegion--centered .t-HeroRegion-col--right 16px

--ut-hero-region-icon-container-size

Selector Value Color
.t-HeroRegion-icon 64px
.t-HeroRegion-icon 64px
.t-HeroRegion-icon 64px
.t-HeroRegion-icon var(--ut-xs-hero-region-icon-container-size, 32px)
.t-HeroRegion--featured 128px
.t-HeroRegion--featured 96px

--ut-hero-region-icon-border-radius

Selector Value Color
.t-HeroRegion-icon 12.5%
.t-HeroRegion--iconsSquare 0
.t-HeroRegion--iconsRounded 12.5%
.t-HeroRegion--iconsCircle 100%

--ut-hero-region-icon-spacing

Selector Value Color
.t-HeroRegion-icon 16px
.u-RTL .t-HeroRegion-icon 16px
.t-HeroRegion-icon var(--ut-xs-hero-region-icon-spacing, 8px)

--ut-hero-region-icon-background-color

Selector Value Color
.t-HeroRegion-icon var(--ut-component-icon-background-color)

--ut-hero-region-icon-text-color

Selector Value Color
.t-HeroRegion-icon var(--ut-component-icon-color)

--ut-hero-region-icon-size

Selector Value Color
.t-HeroRegion-icon, .t-HeroRegion-icon.fa-lg 32px
.t-HeroRegion-icon var(--ut-xs-hero-region-icon-size, 16px)
.t-HeroRegion--featured 64px
.t-HeroRegion--featured 48px

--ut-xs-hero-region-title-font-size

Selector Value Color
.t-HeroRegion-title 16px

--ut-xs-hero-region-title-line-height

Selector Value Color
.t-HeroRegion-title 24px

--ut-hero-region-title-font-weight

Selector Value Color
.t-HeroRegion-title 500
.t-HeroRegion--headingFontAlt var(--ut-alternate-heading-font-weight)

--ut-hero-region-title-text-color

Selector Value Color
.t-HeroRegion-title var(--ut-component-text-title-color)

--ut-hero-region-title-font-size

Selector Value Color
.t-HeroRegion-title 32px

--ut-hero-region-title-line-height

Selector Value Color
.t-HeroRegion-title 40px

--ut-hero-region-title-font-family

Selector Value Color
.t-HeroRegion--headingFontAlt var(--ut-alternate-heading-font-family)

--ut-carousel-button-text-color

Selector Value Color
.a-Region-carouselControl .a-Tabs-button #fff

--ut-alert-type-border-width

Selector Value Color
.t-Alert var(--ut-component-border-width)

--ut-alert-type-border-color

Selector Value Color
.t-Alert var(--ut-component-border-color)

--ut-alert-type-box-shadow

Selector Value Color
.t-Alert none

--ut-alert-type-border-radius

Selector Value Color
.t-Alert var(--ut-component-border-radius)
.t-Alert--wizard .t-Alert-icon, .t-Alert--horizontal .t-Alert-icon var(--ut-component-border-radius)
.t-Alert--wizard .t-Alert-icon, .t-Alert--horizontal .t-Alert-icon var(--ut-component-border-radius)
.u-RTL .t-Alert--wizard .t-Alert-icon, .u-RTL .t-Alert--horizontal .t-Alert-icon var(--ut-component-border-radius)
.u-RTL .t-Alert--wizard .t-Alert-icon, .u-RTL .t-Alert--horizontal .t-Alert-icon var(--ut-component-border-radius)

--ut-alert-type-background-color

Selector Value Color
.t-Alert var(--ut-component-background-color)
.t-Alert--colorBG.t-Alert--warning, .t-Alert--colorBG.t-Alert--yellow var(--ut-palette-warning-shade)
.t-Alert--colorBG.t-Alert--success var(--ut-palette-success-shade)
.t-Alert--colorBG.t-Alert--danger, .t-Alert--colorBG.t-Alert--red var(--ut-palette-danger-shade)
.t-Alert--colorBG.t-Alert--info var(--ut-palette-info-shade)
.t-Alert--page.t-Alert--success var(--ut-palette-success)
.t-Alert--page.t-Alert--warning var(--ut-palette-warning)

--ut-alert-type-text-color

Selector Value Color
.t-Alert var(--ut-component-text-default-color)
.t-Alert--page.t-Alert--success var(--ut-palette-success-contrast)
.t-Alert--page.t-Alert--warning var(--ut-palette-warning-contrast)

--ut-alert-icon-size

Selector Value Color
.t-Alert--horizontal 32px
.t-Alert--wizard 64px
.t-Alert--page 24px

--ut-alert-icon-padding

Selector Value Color
.t-Alert--horizontal 16px
.t-Alert--page 16px

--ut-alert-border-radius

Selector Value Color
.t-Alert--horizontal 2px
.t-Alert--wizard 2px
.t-Alert--page 4px

--ut-alert-margin

Selector Value Color
.t-Alert--horizontal 16px
.t-Alert--wizard 16px aut

--ut-alert-title-font-size

Selector Value Color
.t-Alert--horizontal .t-Alert-title 18px
.t-Alert--horizontal .t-Alert-title 20px
.t-Alert--wizard .t-Alert-title 24px
.t-Alert--page .t-Alert-title 18px

--ut-alert-title-line-height

Selector Value Color
.t-Alert--horizontal .t-Alert-title 22px
.t-Alert--horizontal .t-Alert-title 24px
.t-Alert--wizard .t-Alert-title 36px

--ut-alert-border-width

Selector Value Color
.t-Alert--page 0px

--ut-alert-box-shadow

Selector Value Color
.t-Alert--page 0 0 0 var(--ut-component-border-width) var(--ut-component-border-color) inset, var(--ut-shadow-md)

--ut-alert-icon-background-color

Selector Value Color
.t-Alert--page transparent
.t-Alert--warning.t-Alert--horizontal, .t-Alert--yellow.t-Alert--horizontal var(--ut-palette-warning-shade)
.t-Alert--success.t-Alert--horizontal var(--ut-palette-success-shade)
.t-Alert--info.t-Alert--horizontal var(--ut-palette-info-shade)
.t-Alert--danger.t-Alert--horizontal, .t-Alert--red.t-Alert--horizontal var(--ut-palette-danger-shade)
.t-Alert--page.t-Alert--success transparent
.t-Alert--page.t-Alert--warning transparent

--ut-alert-offset

Selector Value Color
.t-Alert--page 16px
.t-Alert--page 16px
.t-Alert--page 16px
.u-RTL .t-Alert--page 16px
.u-RTL .t-Alert--page 16px

--ut-notification-title-font-size

Selector Value Color
.t-Alert--page.t-Alert--warning .a-Notification-title 14px

--ut-notification-title-line-height

Selector Value Color
.t-Alert--page.t-Alert--warning .a-Notification-title 20px

--ut-notification-title-font-weight

Selector Value Color
.t-Alert--page.t-Alert--warning .a-Notification-title 700

--ut-notification-title-margin

Selector Value Color
.t-Alert--page.t-Alert--warning .a-Notification-title 0

--a-base-font-weight-bold

Selector Value Color
.t-Alert--page .t-Alert-title 700
.t-Comments-text--newValue 700
.t-ConfigPanel-status 700
.t-StatusList-attrLabel 700
.apex-item-display-only 700
.apex-item-group--rc input:checked + label, .apex-item-single-checkbox input:checked + label 700
.oj-datetimepicker-switcher-buttons [data-handler='switchDone'] 700
.ui-datepicker .ui-state-highlight, .ui-datepicker .ui-state-active 700

--ut-notification-item-font-size

Selector Value Color
.t-Alert--page .a-Notification-item 14px
.t-Alert--page .a-Notification-item var(--ut-xs-notification-item-font-size, 12px)

--ut-notification-item-line-height

Selector Value Color
.t-Alert--page .a-Notification-item 20px

--ut-button-region-margin

Selector Value Color
.t-Alert .t-ButtonRegion 0px
.t-ButtonRegion 12px
.col .t-ButtonRegion:only-child 8px
.t-Dialog .col .t-ButtonRegion:only-child 0px
.t-ButtonRegion--noUI 0px
.t-ButtonRegion--stickToBottom 0px
.t-Body-actions .t-ButtonRegion 0px
.t-DialogRegion-buttons .t-ButtonRegion, .t-Wizard-footer .t-ButtonRegion, .t-Dialog-footer .t-ButtonRegion, .t-ButtonRegion--dialogRegion 0px

--ut-alert-icon-text-color

Selector Value Color
.t-Alert--warning, .t-Alert--yellow var(--ut-palette-warning)
.t-Alert--success var(--ut-palette-success)
.t-Alert--info var(--ut-palette-info)
.t-Alert--danger, .t-Alert--red var(--ut-palette-danger)
.t-Alert--page.t-Alert--success inherit
.t-Alert--page.t-Alert--warning inherit

--ut-button-region-border-width

Selector Value Color
.t-ButtonRegion 1px
.t-ButtonRegion--noUI 0px
.t-ButtonRegion--noBorder 0px
.t-ButtonRegion--stickToBottom 1px
.t-Body-actions .t-ButtonRegion 0px
.t-Dialog-footer .t-ButtonRegion 1px

--ut-button-region-border-color

Selector Value Color
.t-ButtonRegion var(--ut-component-border-color)

--ut-button-region-box-shadow

Selector Value Color
.t-ButtonRegion var(--ut-component-box-shadow)
.t-ButtonRegion--noUI none
.t-ButtonRegion--stickToBottom none
.t-Body-actions .t-ButtonRegion none
.t-DialogRegion-buttons .t-ButtonRegion, .t-Wizard-footer .t-ButtonRegion, .t-Dialog-footer .t-ButtonRegion, .t-ButtonRegion--dialogRegion none

--ut-button-region-background-color

Selector Value Color
.t-ButtonRegion var(--ut-component-background-color)
.t-ButtonRegion--noUI transparent
.t-Body-actions .t-ButtonRegion transparent

--ut-button-region-text-color

Selector Value Color
.t-ButtonRegion var(--ut-component-text-default-color)
.t-ButtonRegion--noUI currentColor

--ut-button-region-border-radius

Selector Value Color
.t-ButtonRegion--stickToBottom 0
.t-Body-actions .t-ButtonRegion 0

--ut-button-region-title-font-size

Selector Value Color
.t-ButtonRegion--showTitle .t-ButtonRegion-title 20px

--ut-button-region-title-line-height

Selector Value Color
.t-ButtonRegion--showTitle .t-ButtonRegion-title 1

--ut-button-region-title-font-weight

Selector Value Color
.t-ButtonRegion--showTitle .t-ButtonRegion-title normal

--ut-timeline-border-width

Selector Value Color
.t-Timeline-item var(--ut-component-inner-border-width)
.t-Timeline-item:last-child 0
.t-Timeline + .t-Report-pagination 1px

--ut-timeline-border-color

Selector Value Color
.t-Timeline-item var(--ut-component-inner-border-color)
.t-Timeline + .t-Report-pagination var(--ut-component-border-color)

--ut-timeline-grid-gap

Selector Value Color
.t-Timeline-wrap 8px
.t-Timeline-wrap 8px
.t-Timeline-wrap 12px
.t-Timeline-avatar 8px
.u-RTL .t-Timeline-avatar 8px
.t-Timeline-typeWrap 8px
.u-RTL .t-Timeline-typeWrap 8px
.t-Timeline--compact 8px
.t-Timeline--compact .t-Timeline-typeWrap 0

--ut-timeline-background-color

Selector Value Color
a.t-Timeline-wrap:hover, a.t-Timeline-wrap:focus var(--ut-timeline-hover-background-color, rgba(0, 0, 0, .025))

--ut-timeline-box-shadow

Selector Value Color
a.t-Timeline-wrap:hover, a.t-Timeline-wrap:focus var(--ut-timeline-hover-box-shadow)

--ut-timeline-z-index

Selector Value Color
a.t-Timeline-wrap:hover, a.t-Timeline-wrap:focus var(--ut-timeline-hover-z-index, 10)

--ut-timeline-avatar-size

Selector Value Color
.t-Timeline-avatar 40px
.t-Timeline-avatar 40px
.t-Timeline-avatar 40px
.t-Timeline-avatar 24px

--ut-timeline-avatar-border-radius

Selector Value Color
.t-Timeline-avatar 100%

--ut-timeline-avatar-font-size

Selector Value Color
.t-Timeline-avatar 14px
.t-Timeline-avatar 11px

--ut-timeline-icon-background-color

Selector Value Color
.t-Timeline-avatar var(--ut-component-icon-background-color)

--ut-timeline-icon-color

Selector Value Color
.t-Timeline-avatar var(--ut-component-icon-color)

--ut-timeline-user-info-padding-y

Selector Value Color
.t-Timeline-userinfo 4px
.t-Timeline-userinfo 4px

--ut-timeline-username-text-color

Selector Value Color
.t-Timeline-username var(--ut-component-text-default-color)

--ut-timeline-username-font-size

Selector Value Color
.t-Timeline-username 12px

--ut-timeline-username-line-height

Selector Value Color
.t-Timeline-username 16px

--ut-timeline-date-text-color

Selector Value Color
.t-Timeline-date var(--ut-component-text-muted-color)

--ut-timeline-date-font-size

Selector Value Color
.t-Timeline-date 11px

--ut-timeline-date-line-height

Selector Value Color
.t-Timeline-date 16px

--ut-timeline-typewrap-width

Selector Value Color
.t-Timeline-typeWrap 35%

--ut-timeline-type-padding-y

Selector Value Color
.t-Timeline-type 2px
.t-Timeline-type 2px
.t-Timeline-type 12px
.t-Timeline--compact .t-Timeline-type 2px

--ut-timeline-type-padding-x

Selector Value Color
.t-Timeline-type 8px
.t-Timeline-type 8px
.t-Timeline-type 6px
.t-Timeline-type 12px
.t-Timeline--compact .t-Timeline-type 6px

--ut-timeline-type-border-radius

Selector Value Color
.t-Timeline-type 2px

--ut-timeline-type-min-height

Selector Value Color
.t-Timeline-type 0
.t-Timeline-type 40px
.t-Timeline--compact .t-Timeline-type 0

--ut-timeline-type-text-color

Selector Value Color
.t-Timeline-type var(--ut-palette-generic-contrast)
.t-Timeline-type.is-updated var(--ut-timeline-type-updated-text-color, var(--ut-palette-info-contrast))
.t-Timeline-type.is-removed var(--ut-timeline-type-removed-text-color, var(--ut-palette-danger-contrast))
.t-Timeline-type.is-new var(--ut-timeline-type-is-new-text-color, var(--ut-palette-success-contrast))

--ut-timeline-type-background-color

Selector Value Color
.t-Timeline-type var(--ut-palette-generic)
.t-Timeline-type.is-updated var(--ut-timeline-type-updated-background-color, var(--ut-palette-info))
.t-Timeline-type.is-removed var(--ut-timeline-type-removed-background-color, var(--ut-palette-danger))
.t-Timeline-type.is-new var(--ut-timeline-type-is-new-background-color, var(--ut-palette-success))

--ut-timeline-icon-size

Selector Value Color
.t-Timeline .t-Icon 16px
.t-Timeline .t-Icon 16px

--ut-timeline-icon-spacing

Selector Value Color
.t-Timeline .t-Icon 6px
.u-RTL .t-Timeline .t-Icon 6px

--ut-timeline-type-font-size

Selector Value Color
.t-Timeline-typename 10px
.t-Timeline-typename 11px
.t-Timeline-typename 12px
.t-Timeline--compact .t-Timeline-typename 11px

--ut-timeline-type-line-height

Selector Value Color
.t-Timeline-typename 16px

--ut-timeline-type-font-weight

Selector Value Color
.t-Timeline-typename normal
.t-Timeline-typename var(--a-base-font-weight-bold, 700)
.t-Timeline--compact .t-Timeline-typename normal

--ut-timeline-title-font-size

Selector Value Color
.t-Timeline-title 16px

--ut-timeline-title-line-height

Selector Value Color
.t-Timeline-title 20px

--ut-timeline-title-margin

Selector Value Color
.t-Timeline-title 2px 0 0
.t-Timeline--compact 4px 0 0

--ut-timeline-title-text-color

Selector Value Color
.t-Timeline-title var(--ut-component-text-title-color)

--ut-timeline-desc-font-size

Selector Value Color
.t-Timeline-desc 11px

--ut-timeline-desc-line-height

Selector Value Color
.t-Timeline-desc 16px

--ut-timeline-desc-margin

Selector Value Color
.t-Timeline-desc 0 0 2px
.t-Timeline-desc:last-child 0

--ut-timeline-desc-text-color

Selector Value Color
.t-Timeline-desc var(--ut-component-text-muted-color)

--ut-avp-border-color

Selector Value Color
.t-AVPList-item var(--ut-component-inner-border-color)
.t-AVPList-label, .t-AVPList-value var(--ut-component-inner-border-color)
.t-AVPList + .t-Report-pagination var(--ut-component-border-color)

--ut-avp-border-width

Selector Value Color
.t-AVPList-item var(--ut-component-inner-border-width)
.t-AVPList-item:last-of-type, .t-AVPList-item .t-AVPList-label, .t-AVPList-item .t-AVPList-value 0
.t-AVPList-label, .t-AVPList-value var(--ut-component-inner-border-width)
.t-AVPList-label:last-of-type, .t-AVPList-value:last-of-type 0
.t-AVPList + .t-Report-pagination 1px

--ut-avp-label-text-color

Selector Value Color
.t-AVPList-label var(--ut-component-text-title-color)

--ut-avp-value-text-color

Selector Value Color
.t-AVPList-value var(--ut-component-text-subtitle-color)

--ut-avp-font-size

Selector Value Color
.t-AVPList-label, .t-AVPList-value 14px

--ut-avp-line-height

Selector Value Color
.t-AVPList-label, .t-AVPList-value 20px

--ut-avp-padding-y

Selector Value Color
.t-AVPList-label, .t-AVPList-value 8px
.t-AVPList-label, .t-AVPList-value 8px

--ut-avp-padding-x

Selector Value Color
.t-AVPList-label, .t-AVPList-value 12px
.t-AVPList-label, .t-AVPList-value 12px
.t-Body-info .t-AVPList-label, .t-Body-info .t-AVPList-value 16px

--ut-avp-label-width

Selector Value Color
.t-AVPList--leftAligned .t-AVPList-label 30%
.t-AVPList--rightAligned .t-AVPList-value 30%
.t-AVPList--fixedLabelSmall 160px
.t-AVPList--fixedLabelMedium 220px
.t-AVPList--fixedLabelLarge 260px
.t-AVPList--variableLabelSmall 20%
.t-AVPList--variableLabelMedium 30%
.t-AVPList--variableLabelLarge 40%

--ut-wizard-title-text-color

Selector Value Color
.t-Wizard-header var(--ut-component-text-title-color)
.t-Wizard .t-Wizard-title var(--ut-component-text-title-color)

--ut-wizard-max-width

Selector Value Color
.t-Wizard 1260px

--ut-wizard-margin-x

Selector Value Color
.t-Wizard auto
.t-Wizard auto

--ut-wizard-margin-y

Selector Value Color
.t-Wizard 16px

--ut-wizard-border-width

Selector Value Color
.t-Wizard 1px

--ut-wizard-border-color

Selector Value Color
.t-Wizard var(--ut-component-border-color)

--ut-wizard-background-color

Selector Value Color
.t-Wizard var(--ut-region-background-color)

--ut-wizard-box-shadow

Selector Value Color
.t-Wizard var(--ut-shadow-sm)

--ut-wizard-controls-padding-x

Selector Value Color
.t-Wizard .t-Wizard-controls 16px
.t-Wizard .t-Wizard-controls 16px
.t-Wizard .t-Wizard-controls 16px
.t-Wizard .t-Wizard-controls 16px

--ut-wizard-controls-padding-y

Selector Value Color
.t-Wizard .t-Wizard-controls 16px
.t-Wizard .t-Wizard-controls 16px
.t-Wizard .t-Wizard-controls 24px
.t-Wizard .t-Wizard-controls 24px

--ut-wizard-title-font-size

Selector Value Color
.t-Wizard .t-Wizard-title 24px

--ut-wizard-title-line-height

Selector Value Color
.t-Wizard .t-Wizard-title 1

--ut-wizard-title-padding-x

Selector Value Color
.t-Wizard .t-Wizard-title 0
.t-Wizard .t-Wizard-title 0

--ut-wizard-title-padding-y

Selector Value Color
.t-Wizard .t-Wizard-title 24px
.t-Wizard .t-Wizard-title 24px

--ut-wizard-body-padding-x

Selector Value Color
.t-Wizard .t-Wizard-body 16px
.t-Wizard .t-Wizard-body 16px

--ut-wizard-body-padding-y

Selector Value Color
.t-Wizard .t-Wizard-body 24px
.t-Wizard .t-Wizard-body 24px

--ut-wp-min-height

Selector Value Color
.t-WizardSteps-wrap 32px

--ut-wp-step-track-size

Selector Value Color
.t-WizardSteps-wrap:after 2px
.t-WizardSteps--vertical .t-WizardSteps-wrap:after 2px
.t-WizardSteps--vertical .t-WizardSteps-step:first-child .t-WizardSteps-wrap:after, .t-WizardSteps--vertical .t-WizardSteps-step:last-child .t-WizardSteps-wrap:after 2px

--ut-wp-track-color

Selector Value Color
.t-WizardSteps-wrap:after var(--ut-component-border-color)

--ut-wp-marker-size

Selector Value Color
.t-WizardSteps-marker 12px
.t-WizardSteps-marker 12px
.t-WizardSteps-step.is-active .t-WizardSteps-marker, .t-WizardSteps-step.is-complete .t-WizardSteps-marker 20px

--ut-wp-marker-color

Selector Value Color
.t-WizardSteps-marker var(--ut-component-border-color)

--ut-wp-marker-border-radius

Selector Value Color
.t-WizardSteps-marker 100%

--ut-wp-marker-padding

Selector Value Color
.t-WizardSteps-step.is-active .t-WizardSteps-marker, .t-WizardSteps-step.is-complete .t-WizardSteps-marker 2px

--ut-wp-completed-marker-icon

Selector Value Color
.t-WizardSteps-step.is-complete .t-WizardSteps-marker:before ""

--ut-wp-completed-marker-font-size

Selector Value Color
.t-WizardSteps-step.is-complete .t-WizardSteps-marker:before 16px

--ut-wp-checkmark-color

Selector Value Color
.t-WizardSteps-step.is-complete .t-WizardSteps-marker:before #fff
.t-WizardSteps-step.is-complete .t-WizardSteps-marker #fff

--ut-wp-complete-background-color

Selector Value Color
.t-WizardSteps-step.is-complete .t-WizardSteps-marker var(--ut-palette-success)

--ut-wp-active-background-color

Selector Value Color
.t-WizardSteps-step.is-active .t-WizardSteps-marker var(--ut-palette-primary)

--ut-wp-active-text-color

Selector Value Color
.t-WizardSteps-step.is-active .t-WizardSteps-marker #fff

--ut-wp-label-active-font-weight

Selector Value Color
.t-WizardSteps-step.is-active .t-WizardSteps-label 700

--ut-wp-vertical-marker-size

Selector Value Color
.t-WizardSteps--vertical .t-WizardSteps-step .t-WizardSteps-marker 20px
.t-WizardSteps--vertical .t-WizardSteps-step .t-WizardSteps-marker 20px

--ut-wp-label-padding-y

Selector Value Color
.t-WizardSteps-label 4px

--ut-wp-label-line-height

Selector Value Color
.t-WizardSteps-label 18px

--ut-wp-label-font-size

Selector Value Color
.t-WizardSteps-label 12px

--ut-wp-label-color

Selector Value Color
.t-WizardSteps-label var(--ut-component-text-default-color)

--ut-wp-vertical-marker-margin-y

Selector Value Color
.t-WizardSteps--vertical .t-WizardSteps-label 8px
.t-WizardSteps--vertical .t-WizardSteps-label 8px

--ut-wp-vertical-marker-margin-x

Selector Value Color
.t-WizardSteps--vertical .t-WizardSteps-label 8px
.u-RTL .t-WizardSteps--vertical .t-WizardSteps-label 8px

--ut-cr-border-width

Selector Value Color
.t-ContentRow 0
.t-ContentRow-item + .t-Report-pagination var(--ut-component-border-width)

--ut-cr-item-border-color

Selector Value Color
.t-ContentRow-item:not(:only-child):not(:last-child) var(--ut-component-inner-border-color)

--ut-cr-item-border-width

Selector Value Color
.t-ContentRow-item:not(:only-child):not(:last-child) var(--ut-component-inner-border-width)
.t-ContentRow--hideBorders 0px

--ut-cr-border-color

Selector Value Color
.t-ContentRow-item + .t-Report-pagination var(--ut-component-border-color)

--ut-cr-wrap-padding-x

Selector Value Color
.t-ContentRow-wrap 16px
.t-ContentRow-wrap 16px
.t-ContentRow-wrap var(--ut-xs-cr-wrap-padding-x, 12px)
.t-ContentRow-misc 12px
.u-RTL .t-ContentRow-misc 12px
.t-ContentRow-actions 12px
.u-RTL .t-ContentRow-actions 12px
.t-ContentRow--styleCompact 12px

--ut-cr-wrap-padding-y

Selector Value Color
.t-ContentRow-wrap 16px
.t-ContentRow-wrap 16px
.t-ContentRow-wrap var(--ut-xs-cr-wrap-padding-y, 12px)
.t-ContentRow--styleCompact 12px
.t-ContentRow--removePadding .t-ContentRow-wrap 8px

--ut-cr-selection-spacing

Selector Value Color
.t-ContentRow-selection 16px
.u-RTL .t-ContentRow-selection 16px
.t-ContentRow--styleCompact 10px

--ut-cr-selection-font-size

Selector Value Color
.t-ContentRow-selection 16px
.t-ContentRow-selection input 16px

--ut-cr-icon-spacing

Selector Value Color
.t-ContentRow-iconWrap 12px
.u-RTL .t-ContentRow-iconWrap 12px
.t-ContentRow--styleCompact 10px

--ut-cr-icon-text-color

Selector Value Color
.t-ContentRow-iconWrap var(--ut-component-text-muted-color)

--ut-cr-img-max-width

Selector Value Color
.t-ContentRow .t-ContentRow-iconWrap img 40px
.t-ContentRow--styleCompact 24px

--ut-cr-title-font-size

Selector Value Color
.t-ContentRow-title 16px
.t-ContentRow--styleCompact 15px

--ut-cr-title-line-height

Selector Value Color
.t-ContentRow-title 20px

--ut-cr-title-font-weight

Selector Value Color
.t-ContentRow-title 700

--ut-cr-title-margin-x

Selector Value Color
.t-ContentRow-title 8px
.u-RTL .t-ContentRow-title 8px

--ut-cr-title-text-color

Selector Value Color
.t-ContentRow-title var(--ut-component-text-title-color)

--ut-cr-desc-margin-y

Selector Value Color
.t-ContentRow-description 4px
.t-ContentRow--hideTitle 0

--ut-cr-desc-font-size

Selector Value Color
.t-ContentRow-description 12px

--ut-cr-desc-line-height

Selector Value Color
.t-ContentRow-description 20px

--ut-cr-desc-text-color

Selector Value Color
.t-ContentRow-description var(--ut-component-text-muted-color)

--ut-cr-misc-margin-y

Selector Value Color
.t-ContentRow-misc 4px

--ut-cr-misc-font-size

Selector Value Color
.t-ContentRow-misc 12px

--ut-cr-desc-misc-text-color

Selector Value Color
.t-ContentRow-misc var(--ut-component-text-muted-color)

--ut-cr-actions-margin-y

Selector Value Color
.t-ContentRow-actions 4px

--ut-cr-actions-font-size

Selector Value Color
.t-ContentRow-actions 12px

--ut-cr-desc-actions-text-color

Selector Value Color
.t-ContentRow-actions var(--ut-component-text-muted-color)

--ut-comment-item-margin-bottom

Selector Value Color
.t-Comments-item 16px
.t-Comments-item:last-child 0

--ut-comment-icon-margin-x

Selector Value Color
.t-Comments-icon 12px
.u-RTL .t-Comments-icon 12px

--ut-comment-icon-border-radius

Selector Value Color
.t-Comments-userIcon, .t-Comments-userImg 100%
.t-Comments--iconsSquare 0

--ut-comment-icon-size

Selector Value Color
.t-Comments-userIcon, .t-Comments-userImg 32px
.t-Comments-userIcon, .t-Comments-userImg 32px
.t-Comments-userIcon 32px

--ut-comment-icon-background-color

Selector Value Color
.t-Comments-userIcon, .t-Comments-userImg var(--ut-component-icon-background-color)

--ut-comment-icon-color

Selector Value Color
.t-Comments-userIcon, .t-Comments-userImg var(--ut-component-icon-color)

--ut-comment-icon-font-size

Selector Value Color
.t-Comments-userIcon 12px

--ut-comment-icon-font-weight

Selector Value Color
.t-Comments-userIcon 500

--ut-comment-icon-rounded-border-radius

Selector Value Color
.t-Comments--iconsRounded 4px

--ut-comment-info-color

Selector Value Color
.t-Comments-info var(--ut-component-text-muted-color)

--ut-comment-info-font-size

Selector Value Color
.t-Comments-info 12px

--ut-comment-info-margin-x

Selector Value Color
.t-Comments-date 8px
.t-Comments-date:last-child 0

--ut-comment-info-sep-opacity

Selector Value Color
.t-Comments-date:before 0.5

--ut-comment-font-size

Selector Value Color
.t-Comments-comment 14px

--ut-comment-line-height

Selector Value Color
.t-Comments-comment 20px

--ut-comment-chat-padding-x

Selector Value Color
.t-Comments--chat 8px

--ut-comment-chat-padding-y

Selector Value Color
.t-Comments--chat 6px

--ut-comment-chat-border-radius

Selector Value Color
.t-Comments--chat 4px

--ut-comment-info-margin-y

Selector Value Color
.t-Comments--chat .t-Comments-info 4px

--ut-comment-chat-text-color

Selector Value Color
.t-Comments--chat .t-Comments-comment var(--ut-component-text-default-color)
.t-Comments--chat .t-Comments-item.is-active var(--ut-comment-chat-active-text-color)

--ut-comment-chat-top

Selector Value Color
.t-Comments--chat .t-Comments-comment:after 16px

--ut-comment-caret-border-width

Selector Value Color
.t-Comments--chat .t-Comments-comment:after 6px

--ut-comment-chat-background-color

Selector Value Color
.t-Comments--chat .t-Comments-item.is-active var(--ut-comment-chat-active-background-color)

--ut-breadcrumb-padding-y

Selector Value Color
.t-BreadcrumbRegion 16p
.t-BreadcrumbRegion var(--ut-xs-breadcrumb-padding-y, 16px)
.t-BreadcrumbRegion 8px
.t-BreadcrumbRegion-body 8px
.t-BreadcrumbRegion-body 8px
.t-BreadcrumbRegion + div > .apex-rds-container 8px
.t-Body-title-shrink .t-BreadcrumbRegion 8px
.t-Body-title-shrink .t-BreadcrumbRegion-body 8px
.t-Body-title-shrink .t-BreadcrumbRegion-body 8px

--ut-breadcrumb-padding-x

Selector Value Color
.t-BreadcrumbRegion var(--ut-xs-breadcrumb-padding-x, 16px)

--ut-breadcrumb-item-active-font-weight

Selector Value Color
.t-BreadcrumbRegion--useBreadcrumbTitle .t-Breadcrumb-item.is-active, .t-BreadcrumbRegion-titleText 500

--ut-breadcrumb-item-active-text-color

Selector Value Color
.t-BreadcrumbRegion--useBreadcrumbTitle .t-Breadcrumb-item.is-active, .t-BreadcrumbRegion-titleText var(--ut-component-text-title-color)

--ut-breadcrumb-item-font-size

Selector Value Color
.t-BreadcrumbRegion--useRegionTitle .t-BreadcrumbRegion-titleText 14px
.t-Body-title-shrink .t-BreadcrumbRegion--useRegionTitle .t-BreadcrumbRegion-titleText 14px
.t-BreadcrumbRegion--compactTitle .t-BreadcrumbRegion-titleText 14px
.t-Breadcrumb-item 14px

--ut-breadcrumb-item-line-height

Selector Value Color
.t-BreadcrumbRegion--useRegionTitle .t-BreadcrumbRegion-titleText 16px
.t-Body-title-shrink .t-BreadcrumbRegion--useRegionTitle .t-BreadcrumbRegion-titleText 16px
.t-BreadcrumbRegion--compactTitle .t-BreadcrumbRegion-titleText 16px
.t-Breadcrumb-item 16px

--ut-breadcrumb-title-font-size

Selector Value Color
.t-Body-title:not(.t-Body-title-shrink) .t-BreadcrumbRegion--useBreadcrumbTitle:not(.t-BreadcrumbRegion--compactTitle) .t-Breadcrumb-item:last-child, .t-BreadcrumbRegion-titleText 32px

--ut-breadcrumb-title-line-height

Selector Value Color
.t-Body-title:not(.t-Body-title-shrink) .t-BreadcrumbRegion--useBreadcrumbTitle:not(.t-BreadcrumbRegion--compactTitle) .t-Breadcrumb-item:last-child, .t-BreadcrumbRegion-titleText 48px

--ut-breadcrumb-title-font-weight

Selector Value Color
.t-Body-title:not(.t-Body-title-shrink) .t-BreadcrumbRegion--useBreadcrumbTitle:not(.t-BreadcrumbRegion--compactTitle) .t-Breadcrumb-item:last-child, .t-BreadcrumbRegion-titleText 500

--ut-breadcrumb-item-font-weight

Selector Value Color
.t-Breadcrumb-item 400

--ut-breadcrumb-item-text-color

Selector Value Color
.t-Breadcrumb-item var(--ut-component-text-muted-color)

--ut-breadcrumb-item-sep-opacity

Selector Value Color
.t-Breadcrumb-item:after 0.5

--ut-breadcrumb-item-sep-spacing

Selector Value Color
.t-Breadcrumb-item:after 8px
.t-Breadcrumb-item:after 8px

--ut-lv-line-height

Selector Value Color
.a-ListView-item 20px
.a-ListView-item .ui-li-count 20px

--ut-lv-item-padding-y

Selector Value Color
.a-ListView-item .ui-btn 8px
.a-ListView-item .ui-btn 8px
.a-ListView-divider, .a-ListView-item 8px
.a-ListView-divider, .a-ListView-item 8px

--ut-lv-item-padding-x

Selector Value Color
.a-ListView-item .ui-btn 12px
.a-ListView-item .ui-btn 12px
.a-ListView-divider, .a-ListView-item 12px
.a-ListView-divider, .a-ListView-item 12px

--ut-lv-item-font-size

Selector Value Color
.a-ListView-divider, .a-ListView-item 14px

--ut-lv-count-position-x

Selector Value Color
.a-ListView-item .ui-li-count 8px
.u-RTL .a-ListView-item .ui-li-count 8px

--ut-lv-count-position-y

Selector Value Color
.a-ListView-item .ui-li-count 12px

--ut-lv-count-font-size

Selector Value Color
.a-ListView-item .ui-li-count 11px

--ut-lv-count-padding-y

Selector Value Color
.a-ListView-item .ui-li-count 0
.a-ListView-item .ui-li-count 0

--ut-lv-count-padding-x

Selector Value Color
.a-ListView-item .ui-li-count 4px
.a-ListView-item .ui-li-count 4px

--ut-lv-count-border-radius

Selector Value Color
.a-ListView-item .ui-li-count 2px

--ut-lv-divider-font-weight

Selector Value Color
.a-ListView-divider 700

--ut-lv-divider-line-height

Selector Value Color
.a-ListView-divider 1.5

--ut-lv-divider-background-color

Selector Value Color
.a-ListView-divider var(--ut-component-toolbar-background-color)

--ut-region-border-width

Selector Value Color
.t-Region 1px
.t-Body-side .t-Region, .t-Body-actions .t-Region 1px 0
.t-Body-side .t-Region:first-child, .t-Body-actions .t-Region:first-child 0px
.t-Region--noBorder 0px
.t-Region--stacked 1px
.t-Region--textContent 0px

--ut-region-border-color

Selector Value Color
.t-Region var(--ut-component-border-color)

--ut-region-border-radius

Selector Value Color
.t-Region var(--ut-component-border-radius)
.t-Region-header var(--ut-component-border-radius)
.t-Region-header var(--ut-component-border-radius)
.t-Region--hideShow.is-collapsed > .t-Region-header var(--ut-component-border-radius)
.t-Region--hideShow.is-collapsed > .t-Region-header var(--ut-component-border-radius)
.t-Body-side .t-Region, .t-Body-actions .t-Region 0
.t-Region.is-maximized 0

--ut-region-box-shadow

Selector Value Color
.t-Region var(--ut-component-box-shadow)
.t-Body-side .t-Region, .t-Body-actions .t-Region none
.t-Region--noBorder none
.t-Region--stacked none
.t-Region--textContent none
.t-Region.is-maximized none

--ut-region-margin

Selector Value Color
.t-Region 16px
.t-Body-side .t-Region, .t-Body-actions .t-Region 0px
.t-Region--stacked 0px
.t-Region--textContent 0px

--ut-region-background-color

Selector Value Color
.t-Region var(--ut-component-background-color)
.t-Body-side .t-Region, .t-Body-actions .t-Region transparent
.t-Body-actions .t-Region transparent
.t-Region--noBG transparent
.t-Region--textContent transparent

--ut-region-text-color

Selector Value Color
.t-Region var(--ut-component-text-default-color)

--ut-region-font-size

Selector Value Color
.t-Region 14px

--ut-region-line-height

Selector Value Color
.t-Region 20px

--ut-region-header-border-width

Selector Value Color
.t-Region-header 1px
.t-Region--hideShow.is-collapsed 0px
.t-Region--stacked 1px

--ut-region-header-border-color

Selector Value Color
.t-Region-header rgba(0, 0, 0, 0.075)

--ut-region-header-background-color

Selector Value Color
.t-Region-header var(--ut-component-background-color)
.t-Body-side .t-Region, .t-Body-actions .t-Region transparent
.t-Region--accent1 > .t-Region-header var(--u-color-1)
.t-Region--accent2 > .t-Region-header var(--u-color-2)
.t-Region--accent3 > .t-Region-header var(--u-color-3)
.t-Region--accent4 > .t-Region-header var(--u-color-4)
.t-Region--accent5 > .t-Region-header var(--u-color-5)
.t-Region--accent6 > .t-Region-header var(--u-color-6)
.t-Region--accent7 > .t-Region-header var(--u-color-7)
.t-Region--accent8 > .t-Region-header var(--u-color-8)
.t-Region--accent9 > .t-Region-header var(--u-color-9)
.t-Region--accent10 > .t-Region-header var(--u-color-10)
.t-Region--accent11 > .t-Region-header var(--u-color-11)
.t-Region--accent12 > .t-Region-header var(--u-color-12)
.t-Region--accent13 > .t-Region-header var(--u-color-13)
.t-Region--accent14 > .t-Region-header var(--u-color-14)
.t-Region--accent15 > .t-Region-header var(--u-color-15)

--ut-region-header-text-color

Selector Value Color
.t-Region-header var(--ut-component-text-default-color)
.t-Region--accent1 > .t-Region-header var(--u-color-1-contrast)
.t-Region--accent2 > .t-Region-header var(--u-color-2-contrast)
.t-Region--accent3 > .t-Region-header var(--u-color-3-contrast)
.t-Region--accent4 > .t-Region-header var(--u-color-4-contrast)
.t-Region--accent5 > .t-Region-header var(--u-color-5-contrast)
.t-Region--accent6 > .t-Region-header var(--u-color-6-contrast)
.t-Region--accent7 > .t-Region-header var(--u-color-7-contrast)
.t-Region--accent8 > .t-Region-header var(--u-color-8-contrast)
.t-Region--accent9 > .t-Region-header var(--u-color-9-contrast)
.t-Region--accent10 > .t-Region-header var(--u-color-10-contrast)
.t-Region--accent11 > .t-Region-header var(--u-color-11-contrast)
.t-Region--accent12 > .t-Region-header var(--u-color-12-contrast)
.t-Region--accent13 > .t-Region-header var(--u-color-13-contrast)
.t-Region--accent14 > .t-Region-header var(--u-color-14-contrast)
.t-Region--accent15 > .t-Region-header var(--u-color-15-contrast)

--ut-region-header-font-size

Selector Value Color
.t-Region-header 16px
.t-Body-actions .t-Region 14px

--ut-region-header-line-height

Selector Value Color
.t-Region-header 24px
.t-Body-actions .t-Region 16px

--ut-region-header-icon-spacing

Selector Value Color
.t-Region-headerIcon 4px
.u-RTL .t-Region-headerIcon 4px

--ut-region-header-icon-padding

Selector Value Color
.t-Region-headerIcon .t-Icon 4px

--ut-region-header-icon-border-radius

Selector Value Color
.t-Region-headerIcon .t-Icon 2px

--ut-region-header-item-spacing

Selector Value Color
.t-Region-headerItems--controls 8px
.u-RTL .t-Region-headerItems--controls 8px
.t-Region-headerItems--buttons 8px
.u-RTL .t-Region-headerItems--buttons 8px
.t-Region--controlsPosEnd .t-Region-headerItems--controls 8px
.u-RTL .t-Region--controlsPosEnd .t-Region-headerItems--controls 8px

--ut-region-header-padding-y

Selector Value Color
.t-Region-headerItems--title 12px
.t-Region-headerItems--title 12px

--ut-region-header-padding-x

Selector Value Color
.t-Region-headerItems--title 12px
.t-Region-headerItems--title 12px
.t-Region--noUI > .t-Region-header 0px
.t-Region-headerItems--buttons .t-Button + .js-maximizeButtonContainer 12px
.u-RTL .t-Region-headerItems--buttons .t-Button + .js-maximizeButtonContainer 12px

--ut-region-body-padding-y

Selector Value Color
.t-Region-body 16px
.t-Region-body 16px
.t-Body-actions .t-Region 12px

--ut-region-body-padding-x

Selector Value Color
.t-Region-body 16px
.t-Region-body 16px
.t-Body-actions .t-Region 12px

--ut-region-buttons-padding-y

Selector Value Color
.t-Region-buttons-left, .t-Region-buttons-right 8px
.t-Region-buttons-left, .t-Region-buttons-right 8px
.t-Region-buttons-left:empty, .t-Region-buttons-right:empty 0px

--ut-region-buttons-padding-x

Selector Value Color
.t-Region-buttons-left, .t-Region-buttons-right 12px
.t-Region-buttons-left, .t-Region-buttons-right 12px
.t-Region-buttons-left:empty, .t-Region-buttons-right:empty 0px

--ut-region-hideshow-header-padding-x

Selector Value Color
.t-Region--hideShow > .t-Region-header .t-Region-headerItems--title 8px
.t-Region--hideShow > .t-Region-header .t-Region-headerItems--title 8px
.t-Region--controlsPosEnd .t-Region-headerItems--title var(--ut-region-header-padding-x, 12px)

--ut-border-radius

Selector Value Color
.t-Region--stacked 0
.rounded, .rounded-md 4px
.rounded-sm var(--ut-border-radius-sm, 2px)
.rounded-lg var(--ut-border-radius-lg, 8px)
.rounded-top, .rounded-top-md 4px
.rounded-top, .rounded-top-md 4px
.rounded-top-sm var(--ut-border-radius-sm, 2px)
.rounded-top-lg var(--ut-border-radius-lg, 8px)
.rounded-right, .rounded-right-md 4px
.rounded-right, .rounded-right-md 4px
.rounded-right-sm var(--ut-border-radius-sm, 2px)
.rounded-right-lg var(--ut-border-radius-lg, 8px)
.rounded-bottom, .rounded-bottom-md 4px
.rounded-bottom, .rounded-bottom-md 4px
.rounded-bottom-sm var(--ut-border-radius-sm, 2px)
.rounded-bottom-lg var(--ut-border-radius-lg, 8px)
.rounded-left, .rounded-left-md 4px
.rounded-left, .rounded-left-md 4px
.rounded-left-sm var(--ut-border-radius-sm, 2px)
.rounded-left-lg var(--ut-border-radius-lg, 8px)

--ut-ccalendar-title-padding

Selector Value Color
.t-ClassicCalendar-title 16px

--ut-ccalendar-title-font-size

Selector Value Color
.t-ClassicCalendar-title 24px

--ut-ccalendar-title-line-height

Selector Value Color
.t-ClassicCalendar-title 32px

--ut-ccalendar-heading-padding

Selector Value Color
.t-ClassicCalendar-dayColumn 4px 8px
.t-ClassicCalendar--weekly .t-ClassicCalendar-timeCol, .t-ClassicCalendar--daily .t-ClassicCalendar-timeCol 4px 8px

--ut-ccalendar-heading-font-size

Selector Value Color
.t-ClassicCalendar-dayColumn 12px

--ut-ccalendar-heading-line-height

Selector Value Color
.t-ClassicCalendar-dayColumn 16px

--ut-ccalendar-border-width

Selector Value Color
.t-ClassicCalendar-dayColumn 1px
.t-ClassicCalendar-day 1px
.t-ClassicCalendar-list 1px
.t-ClassicCalendar-listTitle, .t-ClassicCalendar-listEvent 1px
.t-ClassicCalendar-listTitle:first-child 0px

--ut-ccalendar-day-height

Selector Value Color
.t-ClassicCalendar-day 72px
.t-ClassicCalendar 48px
.t-ClassicCalendar--weekly, .t-ClassicCalendar--daily auto

--ut-ccalendar-day-font-size

Selector Value Color
.t-ClassicCalendar-day 12px
.t-ClassicCalendar 11px

--ut-ccalendar-day-line-height

Selector Value Color
.t-ClassicCalendar-day 16px

--ut-ccalendar-date-text-color

Selector Value Color
.t-ClassicCalendar-day.is-today var(--ut-ccalendar-date-today-text-color)

--ut-ccalendar-date-background-color

Selector Value Color
.t-ClassicCalendar-day.is-today var(--ut-ccalendar-date-today-background-color)

--ut-ccalendar-date-font-weight

Selector Value Color
.t-ClassicCalendar-day.is-today var(--ut-ccalendar-date-today-font-weight, 700)

--ut-ccalendar-date-margin

Selector Value Color
.t-ClassicCalendar-date 4px
.t-ClassicCalendar 2px

--ut-ccalendar-date-font-size

Selector Value Color
.t-ClassicCalendar-date 11px
.t-ClassicCalendar 10px

--ut-ccalendar-date-width

Selector Value Color
.t-ClassicCalendar-date 20px
.t-ClassicCalendar 16px

--ut-ccalendar-date-height

Selector Value Color
.t-ClassicCalendar-date 20px
.t-ClassicCalendar-date 20px
.t-ClassicCalendar 16px

--ut-ccalendar-date-border-radius

Selector Value Color
.t-ClassicCalendar-date 100%

--ut-ccalendar-event-margin

Selector Value Color
.t-ClassicCalendar-event 4px
.t-ClassicCalendar 2px
.t-ClassicCalendar--weekly .t-ClassicCalendar-dayEvents a, .t-ClassicCalendar--daily .t-ClassicCalendar-dayEvents a 4px

--ut-ccalendar-event-padding

Selector Value Color
.t-ClassicCalendar-event a 2px 8px
.t-ClassicCalendar 2px 4px
.t-ClassicCalendar--weekly .t-ClassicCalendar-dayEvents a, .t-ClassicCalendar--daily .t-ClassicCalendar-dayEvents a 2px 8px

--ut-ccalendar-event-border-radius

Selector Value Color
.t-ClassicCalendar-event a 2px
.t-ClassicCalendar--weekly .t-ClassicCalendar-dayEvents a, .t-ClassicCalendar--daily .t-ClassicCalendar-dayEvents a 2px

--ut-ccalendar-day-background-color

Selector Value Color
.t-ClassicCalendar--weekly .t-ClassicCalendar-day.is-today, .t-ClassicCalendar--daily .t-ClassicCalendar-day.is-today var(--ut-ccalendar-day-today-background-color)

--ut-ccalendar-day-text-color

Selector Value Color
.t-ClassicCalendar--weekly .t-ClassicCalendar-day.is-today, .t-ClassicCalendar--daily .t-ClassicCalendar-day.is-today var(--ut-ccalendar-day-today-text-color)

--ut-ccalendar-list-title-padding

Selector Value Color
.t-ClassicCalendar-listTitle 4px 8px

--ut-ccalendar-list-title-font-size

Selector Value Color
.t-ClassicCalendar-listTitle 16px

--ut-ccalendar-list-title-line-height

Selector Value Color
.t-ClassicCalendar-listTitle 24px

--ut-ccalendar-list-date-font-weight

Selector Value Color
.t-ClassicCalendar-listTitle.is-today var(--ut-ccalendar-date-today-font-weight, 700)

--ut-ccalendar-list-event-padding

Selector Value Color
.t-ClassicCalendar-listEvent 4px 8px

--ut-ccalendar-list-event-font-size

Selector Value Color
.t-ClassicCalendar-listEvent 14px

--ut-ccalendar-list-event-line-height

Selector Value Color
.t-ClassicCalendar-listEvent 20px

--ut-ccalendar-list-date-font-size

Selector Value Color
.t-ClassicCalendar-listDayDate 12px

--ut-badge-background-color

Selector Value Color
.t-Badge transparent
.t-Badge--orb:before transparent
.t-Badge--orb.is-primary #AAC7DA
.t-Badge--basic.is-primary #fcfdfe
.t-Badge--orb.is-info #8ABCEB
.t-Badge--basic.is-info #eef5fc
.t-Badge--orb.is-warning #FFBE2A
.t-Badge--basic.is-warning #fff4dd
.t-Badge--orb.is-success #2ECC71
.t-Badge--basic.is-success #d1f5e0
.t-Badge--orb.is-danger #F54B21
.t-Badge--basic.is-danger #fdd5cc
.t-Badge--orb.is-complete #E0E0E0
.t-Badge--basic.is-complete #E0E0E0

--ut-badge-text-color

Selector Value Color
.t-Badge inherit
.t-Badge--basic.is-primary #404040
.t-Badge--basic.is-info #404040
.t-Badge--basic.is-warning #775200
.t-Badge--basic.is-success #0d3a20
.t-Badge--basic.is-danger #5f1604
.t-Badge--basic.is-complete #404040
.t-Badge--orb.is-null, .t-Badge--basic.is-null #707070

--ut-badge-font-size

Selector Value Color
.t-Badge 12px
.t-Badge--large 14px
.t-Badge--small 11px
.t-Badge--xsmall 11px

--ut-badge-line-height

Selector Value Color
.t-Badge 16px

--ut-badge-icon-gap

Selector Value Color
.t-Badge .t-Icon 4px
.u-RTL .t-Badge .t-Icon 4px
.t-Badge--orb:before 4px
.u-RTL .t-Badge--orb:before 4px

--ut-badge-border-radius

Selector Value Color
.t-Badge--basic 2px
.t-Badge--orb 100%

--ut-badge-border-width

Selector Value Color
.t-Badge--basic 1px
.t-Badge--orb 1px

--ut-badge-border-color

Selector Value Color
.t-Badge--basic rgba(0, 0, 0, .025)
.t-Badge--orb rgba(0, 0, 0, .025)

--ut-badge-padding-y

Selector Value Color
.t-Badge--basic 8px
.t-Badge--large.t-Badge--basic 16px
.t-Badge--small.t-Badge--basic 4px
.t-Badge--xsmall.t-Badge--basic 0px

--ut-badge-padding-x

Selector Value Color
.t-Badge--basic 12px
.t-Badge--large.t-Badge--basic 16px
.t-Badge--small.t-Badge--basic 8px
.t-Badge--xsmall.t-Badge--basic 8px

--ut-badge-orb-size

Selector Value Color
.t-Badge--orb:before 10px
.t-Badge--orb:before 10px
.t-Badge--large.t-Badge--orb 12px
.t-Badge--xsmall.t-Badge--orb 8px

--ut-badge-icon-size

Selector Value Color
.t-Badge--xsmall 14px

--ut-completeness-background-color

Selector Value Color
.t-Completeness #fff

--ut-completeness-border-radius

Selector Value Color
.t-Completeness 2px

--ut-completeness-fill-background-color

Selector Value Color
.t-Completeness.is-danger #ff3b30
.t-Completeness.is-warning #ffcc00
.t-Completeness.is-success #4cd964
.t-Completeness-fill rgba(0, 0, 0, 0.2)

--ut-completeness-labelwrap-background-color

Selector Value Color
a.t-Completeness:hover .t-Completeness-labelWrap rgba(0, 0, 0, .25)

--ut-completeness-label-background-color

Selector Value Color
a.t-Completeness:hover .t-Completeness-label #fff
.t-Completeness-label rgba(255, 255, 255, 0.75)

--ut-completeness-fill-height

Selector Value Color
.t-Completeness-fill 48px

--ut-completeness-label-font-size

Selector Value Color
.t-Completeness-label 14px

--ut-completeness-label-line-height

Selector Value Color
.t-Completeness-label 24px

--ut-completeness-label-padding

Selector Value Color
.t-Completeness-label 4px 12px

--ut-completeness-label-margin

Selector Value Color
.t-Completeness-label 8px

--ut-completeness-label-border-radius

Selector Value Color
.t-Completeness-label 2px

--ut-completeness-label-text-color

Selector Value Color
.t-Completeness-label rgba(0, 0, 0, 0.75)

--ut-content-block-margin

Selector Value Color
.t-ContentBlock 32px
.t-ContentBlock 16px

--ut-content-block-header-item-spacing

Selector Value Color
.t-ContentBlock-headerItems--buttons 12px
.u-RTL .t-ContentBlock-headerItems--buttons 12px
.t-ContentBlock--showIcon > .t-ContentBlock-header .t-ContentBlock-headerIcon 12px
.u-RTL .t-ContentBlock--showIcon > .t-ContentBlock-header .t-ContentBlock-headerIcon 12px
.t-ContentBlock-title 12px
.u-RTL .t-ContentBlock-title 12px
.t-ContentBlock-title:last-child 0

--ut-content-block-header-font-weight

Selector Value Color
.t-ContentBlock-title 500

--ut-content-block-header-line-height

Selector Value Color
.t-ContentBlock-title 1.5

--ut-content-block-border-width

Selector Value Color
.t-ContentBlock-body 0
.t-ContentBlock--shadowBG 1px
.t-ContentBlock--lightBG 1px

--ut-content-block-border-color

Selector Value Color
.t-ContentBlock-body var(--ut-component-border-color)

--ut-content-block-border-radius

Selector Value Color
.t-ContentBlock-body var(--ut-region-border-radius)

--ut-content-block-font-size

Selector Value Color
.t-ContentBlock-body 14px

--ut-content-block-line-height

Selector Value Color
.t-ContentBlock-body 20px

--ut-content-block-padding-y

Selector Value Color
.t-ContentBlock--padded 16px

--ut-content-block-padding-x

Selector Value Color
.t-ContentBlock--padded 16px

--ut-content-block-background-color

Selector Value Color
.t-ContentBlock--shadowBG var(--ut-content-block-shadow-background-color, var(--ut-component-badge-background-color))
.t-ContentBlock--lightBG var(--ut-content-block-light-background-color, var(--ut-component-background-color))

--ut-content-block-header-margin

Selector Value Color
.t-ContentBlock--h1 16px
.t-ContentBlock--h1 8px
.t-ContentBlock--h2 12px
.t-ContentBlock--h2 4px
.t-ContentBlock--h3 12px
.t-ContentBlock--h3 4px

--ut-content-block-header-font-size

Selector Value Color
.t-ContentBlock--h1 32px
.t-ContentBlock--h1 24px
.t-ContentBlock--h2 24px
.t-ContentBlock--h2 20px
.t-ContentBlock--h3 20px
.t-ContentBlock--h3 16px

--a-gv-background-color

Selector Value Color
.a-GV-row.is-hover var(--a-gv-row-hover-background-color)

--ut-field-input-padding-x-offset

Selector Value Color
.a-GV-cell .a-GV-columnItem input:not([type="radio"]):not([type="checkbox"]) 1px
.u-UTR .a-GV-cell .a-GV-columnItem input:not([type="radio"]):not([type="checkbox"]) 1px
.a-FS-search, .a-FS-filter calc(var(--a-icon-size, 16px) + var(--ut-field-input-icon-padding-x, 4px) + calc(var(--a-field-input-padding-x, 4px) - var(--a-field-input-border-width, 1px)))
.a-FS-search .apex-item-text, .a-FS-filter .apex-item-text 1px
.u-RTL .a-FS-search .apex-item-text, .u-RTL .a-FS-filter .apex-item-text 1px
.t-Form-fieldContainer--floatingLabel.apex-item-wrapper--has-icon calc(var(--ut-field-input-icon-offset, 24px) + var(--a-field-input-padding-x, 4px) - var(--a-field-input-border-width, 1px))
.t-Form-fieldContainer--floatingLabel.apex-item-wrapper--color-picker calc(var(--ut-field-input-icon-offset, 24px) - var(--a-field-input-border-width, 1px))
.t-Form-fieldContainer--floatingLabel .apex-item-display-only 1px
.u-RTL .t-Form-fieldContainer--floatingLabel .apex-item-display-only 1px
.apex-item-wrapper--has-icon, .apex-item-wrapper--color-picker calc(var(--ut-field-input-icon-offset, 24px) - var(--a-field-input-border-width, 1px))
.apex-item-text, .apex-item-select, .apex-item-textarea, .u-TF-item--text, .u-TF-item--select, select.listmanager, select.group_selectlist, .apex-item-multi, .datetimepicker_newMonth 1px
.u-RTL .apex-item-text, .u-RTL .apex-item-select, .u-RTL .apex-item-textarea, .u-RTL .u-TF-item--text, .u-RTL .u-TF-item--select, .u-RTL select.listmanager, .u-RTL select.group_selectlist, .u-RTL .apex-item-multi, .u-RTL .datetimepicker_newMonth 1px
.apex-item-select, .u-TF-item--select, select.group_selectlist, .datetimepicker_newMonth 1px
.u-RTL .apex-item-select, .u-RTL .u-TF-item--select, .u-RTL select.group_selectlist, .u-RTL .datetimepicker_newMonth 1px
.apex-item-text.apex-item-popup-lov 1px
.u-RTL .apex-item-text.apex-item-popup-lov 1px
.apex-item-wrapper--date-picker-jet .oj-text-field-container:not(.oj-text-field-has-start-slot) .oj-text-field-input 1px
.apex-item-wrapper--date-picker-jet .oj-datepicker-inline .oj-datepicker-content 1px

--a-gv-border-radius

Selector Value Color
.a-IRR 2px
.t-IRR-region--noBorders 0
.is-maximized.t-IRR-region .a-IRR 0

--a-gv-cell-padding-y

Selector Value Color
.a-IRR 8px

--a-gv-cell-padding-x

Selector Value Color
.a-IRR 12px

--ut-irr-region-margin

Selector Value Color
.t-IRR-region 16px
.t-Region .t-IRR-region 0

--ut-irr-region-box-shadow

Selector Value Color
.t-Region .t-IRR-region none

--a-gv-border-width

Selector Value Color
.t-IRR-region--noBorders 0

--a-toolbar-sep-border-width

Selector Value Color
.a-IRR-controlGroup 1px

--a-toolbar-sep-spacing

Selector Value Color
.a-IRR-controlGroup 8px

--ut-fs-total-font-size

Selector Value Color
.a-FS inherit
.a-FS-totalArea 18px

--ut-field-input-icon-offset

Selector Value Color
.a-FS-search, .a-FS-filter calc(var(--a-icon-size, 16px) + var(--ut-field-input-icon-padding-x, 4px) + var(--ut-field-input-icon-padding-x, 4px))
.u-RTL .a-FS-search span.apex-item-icon, .u-RTL .a-FS-filter span.apex-item-icon 24px
.apex-item-wrapper--has-icon, .apex-item-wrapper--color-picker calc(var(--ut-field-input-icon-size, var(--a-icon-size, 16px)) + var(--ut-field-input-icon-padding-x, 4px) + var(--ut-field-input-icon-padding-x, 4px))
.apex-item-icon 24px
.u-RTL .apex-item-icon 24px
.apex-item-display-only 0
.u-RTL .apex-item-display-only 0

--ut-field-fl-label-offset

Selector Value Color
.a-FS-search .apex-item-text, .a-FS-filter .apex-item-text 1px
.t-Form-fieldContainer--floatingLabel calc(var(--ut-field-fl-label-line-height, 20px) + var(--a-field-input-padding-y, 4px) - var(--a-field-input-border-width, 1px))
.t-Form-fieldContainer--floatingLabel .apex-item-group--popup-lov .apex-item-multi .apex-item-popup-lov calc(var(--a-field-input-padding-y, 4px) - var(--a-field-input-border-width, 1px))
.apex-item-text, .apex-item-select, .apex-item-textarea, .u-TF-item--text, .u-TF-item--select, select.listmanager, select.group_selectlist, .apex-item-multi, .datetimepicker_newMonth 1px
.apex-item-text.apex-item-popup-lov, .apex-item-multi 1px
.apex-item-wrapper--date-picker-jet .oj-text-field-container:not(.oj-text-field-has-start-slot) .oj-text-field-input 1px
.apex-item-wrapper--date-picker-jet .oj-datepicker-inline .oj-datepicker-content 1px

--ut-fs-total-margin

Selector Value Color
.a-FS-currentList .a-FS-currentItems:not(:empty) + .a-FS-totalArea, .a-FS-currentList .a-FS-totalArea + .a-FS-currentItems:not(:empty) 8px

--ut-fs-total-font-weight

Selector Value Color
.a-FS-totalArea 500

--a-fs-toggle-background-color

Selector Value Color
.a-FS-toggle:hover var(--a-button-hover-background-color)
.a-FS-toggle:active var(--a-button-active-background-color)
.a-FS-toggle:focus var(--a-button-focus-background-color)

--a-fs-toggle-text-color

Selector Value Color
.a-FS-toggle:hover var(--a-button-hover-text-color)
.a-FS-toggle:active var(--a-button-active-text-color)
.a-FS-toggle:focus var(--a-button-focus-text-color)

--a-fs-toggle-border-color

Selector Value Color
.a-FS-toggle:hover var(--a-button-hover-border-color)
.a-FS-toggle:active var(--a-button-active-border-color)
.a-FS-toggle:focus var(--a-button-focus-border-color)

--a-fs-toggle-shadow

Selector Value Color
.a-FS-toggle:hover var(--a-button-hover-shadow)
.a-FS-toggle:active var(--a-button-active-shadow)
.a-FS-toggle:focus var(--a-button-focus-shadow)

--ut-cv-subtitle-margin

Selector Value Color
.a-CardView-subTitle:not(first-child) 4px 0 0

--ut-cv-subcontent-margin

Selector Value Color
.a-CardView-subContent 12px 0 0

--ut-searchresults-item-margin

Selector Value Color
.t-SearchResults-item 24px
.t-SearchResults-item:last-child 12px

--ut-searchresults-item-title-font-weight

Selector Value Color
.t-SearchResults-title 500

--ut-searchresults-item-title-font-size

Selector Value Color
.t-SearchResults-title 16px

--ut-searchresults-item-title-line-height

Selector Value Color
.t-SearchResults-title 20px

--ut-searchresults-item-info-margin

Selector Value Color
.t-SearchResults-info 4px
.t-SearchResults-desc 4px
.t-SearchResults-misc 4px

--ut-searchresults-item-info-font-size

Selector Value Color
.t-SearchResults-info 14px

--ut-searchresults-item-info-line-height

Selector Value Color
.t-SearchResults-info 20px

--ut-searchresults-item-desc-text-color

Selector Value Color
.t-SearchResults-desc var(--ut-component-text-default-color)

--ut-searchresults-item-date-text-color

Selector Value Color
.t-SearchResults-date var(--ut-component-text-muted-color)

--ut-searchresults-item-misc-text-color

Selector Value Color
.t-SearchResults-misc var(--ut-component-text-muted-color)

--ut-searchresults-item-misc-font-size

Selector Value Color
.t-SearchResults-misc 12px

--ut-searchresults-item-misc-line-height

Selector Value Color
.t-SearchResults-misc 16px

--a-menu-padding-y

Selector Value Color
.t-MegaMenu 0
body .ck.ck-dropdown__panel .ck-list

--a-menu-padding-x

Selector Value Color
.t-MegaMenu 0

--ut-megamenu-item-top-padding-y

Selector Value Color
.t-MegaMenu-item--top 16px
.t-MegaMenu-item--top 16px

--ut-megamenu-item-top-padding-x

Selector Value Color
.t-MegaMenu-item--top 16px
.t-MegaMenu-item--top 16px

--ut-megamenu-item-padding-y

Selector Value Color
.t-MegaMenu-itemBody 0
.t-MegaMenu-itemBody 0
.t-MegaMenu-list--sub 6px

--ut-megamenu-item-padding-x

Selector Value Color
.t-MegaMenu-itemBody 0
.t-MegaMenu-itemBody 0

--a-menu-cursor

Selector Value Color
.t-MegaMenu-itemBody.is-focused, .t-MegaMenu-itemBody:hover pointer

--a-menu-icon-size

Selector Value Color
.t-MegaMenu-item var(--ut-megamenu-icon-size, 16px)
.t-MegaMenu-itemBody .t-Icon 16px
.t-MegaMenu-list--top > .t-MegaMenu-item > .t-MegaMenu-itemBody .t-Icon:not(.fa-lg) 20px
.t-MegaMenu-list--sub .t-Icon 16px

--ut-megamenu-icon-offset

Selector Value Color
.t-MegaMenu-item calc(var(--ut-megamenu-icon-size, 16px) + var(--a-menu-icon-spacing-x, 8px))
.t-MegaMenu-itemBody .t-Icon 24px
.t-MegaMenu-itemBody .t-Icon 24px
.t-MegaMenu-list--top > .t-MegaMenu-item > .t-MegaMenu-itemBody .t-Icon:not(.fa-lg) 28px
.t-MegaMenu-item--noIcons .t-MegaMenu-item .t-MegaMenu-item 8px

--a-menu-icon-spacing-x

Selector Value Color
.t-MegaMenu-itemBody .t-Icon 8px
.u-RTL .t-MegaMenu-itemBody .t-Icon 8px
.a-Menu-label + .t-MegaMenu-badge:not(:empty) 8px
.u-RTL .a-Menu-label + .t-MegaMenu-badge:not(:empty) 8px

--ut-megamenu-icon-border-radius

Selector Value Color
.t-MegaMenu-itemBody .t-Icon 2px

--ut-megamenu-icon-size

Selector Value Color
.t-MegaMenu-list--top > .t-MegaMenu-item > .t-MegaMenu-itemBody 20px

--ut-megamenu-icon-opacity

Selector Value Color
.t-MegaMenu-list--sub .t-Icon .55

--ut-megamenu-badge-font-size

Selector Value Color
.t-MegaMenu-badge 11px

--ut-megamenu-badge-line-height

Selector Value Color
.t-MegaMenu-badge 16px

--ut-megamenu-badge-border-radius

Selector Value Color
.t-MegaMenu-badge 2px

--ut-megamenu-badge-padding

Selector Value Color
.t-MegaMenu-badge 0 4px

--ut-megamenu-badge-background-color

Selector Value Color
.t-MegaMenu-badge var(--ut-component-badge-background-color)

--ut-megamenu-badge-text-color

Selector Value Color
.t-MegaMenu-badge var(--ut-component-badge-text-color)

--ut-megamenu-label-font-size

Selector Value Color
.t-MegaMenu-label 14px
.t-MegaMenu-list--sub 12px

--ut-megamenu-label-line-height

Selector Value Color
.t-MegaMenu-label 20px

--ut-megamenu-label-font-weight

Selector Value Color
.t-MegaMenu-label 400
.t-MegaMenu-item--top > .t-MegaMenu-itemBody .t-MegaMenu-label var(--a-base-font-weight-bold, 700)
.t-MegaMenu-item--top.is-active > .t-MegaMenu-itemBody .t-MegaMenu-label var(--a-base-font-weight-heavy, 900)
.t-MegaMenu-list--sub .t-MegaMenu-item.is-active > .t-MegaMenu-itemBody .t-MegaMenu-label 700

--ut-megamenu-desc-font-size

Selector Value Color
.t-MegaMenu-desc 12px

--ut-megamenu-desc-line-height

Selector Value Color
.t-MegaMenu-desc 16px

--ut-megamenu-desc-font-weight

Selector Value Color
.t-MegaMenu-desc normal

--ut-megamenu-desc-margin

Selector Value Color
.t-MegaMenu-desc 0
.t-MegaMenu-list--sub 2px

--ut-megamenu-desc-opacity

Selector Value Color
.t-MegaMenu-desc 0.65

--a-menu-sep-border-width

Selector Value Color
.t-MegaMenu--layoutStacked.a-Menu .t-MegaMenu-item--top + .t-MegaMenu-item--top 1px
.t-MegaMenu-item--top + .t-MegaMenu-item--top 1px

--a-menu-border-radius

Selector Value Color
.t-MegaMenu--fullWidth 0
body .ck.ck-dropdown__panel 4px

--ut-report-pagination-padding-y

Selector Value Color
.t-Report-pagination .pagination 8px
.t-Report-pagination .pagination 8px

--ut-report-pagination-padding-x

Selector Value Color
.t-Report-pagination .pagination 4px
.t-Report-pagination .pagination 4px

--ut-report-pagination-font-size

Selector Value Color
.t-Report-paginationText 12px

--ut-report-pagination-line-height

Selector Value Color
.t-Report-paginationText 16px

--ut-report-pagination-text-padding-y

Selector Value Color
.t-Report-paginationText 4px
.t-Report-paginationText 4px

--ut-report-pagination-text-padding-x

Selector Value Color
.t-Report-paginationText 8px
.t-Report-paginationText 8px

--ut-report-pagination-link-text-color

Selector Value Color
.t-Report-paginationText b, .t-Report-paginationText a:hover var(--ut-report-pagination-link-hover-text-color, var(--ut-palette-primary-contrast))

--ut-report-border-style

Selector Value Color
.t-Report-report solid
.t-Region--noPadding .t-Report--horizontalBorders, .t-Report--inline hidden

--ut-report-border-color

Selector Value Color
.t-Report-report var(--ut-component-inner-border-color)

--ut-report-border-width

Selector Value Color
.t-Report-report 1px
.t-Report--noBorders 0
.t-Region--noPadding .t-Report--horizontalBorders, .t-Report--inline 0

--ut-report-header-cell-font-size

Selector Value Color
.t-Report-colHead 12px

--ut-report-header-cell-line-height

Selector Value Color
.t-Report-colHead 16px

--ut-report-header-cell-padding-y

Selector Value Color
.t-Report-colHead 12px
.t-Report-colHead 12px

--ut-report-header-cell-padding-x

Selector Value Color
.t-Report-colHead 12px
.t-Report-colHead 12px

--ut-report-header-cell-font-weight

Selector Value Color
.t-Report-colHead 700

--ut-report-header-cell-background-color

Selector Value Color
.t-Report-colHead var(--a-gv-header-background-color)

--ut-report-header-cell-border-width

Selector Value Color
.t-Report-colHead 1px
.t-Report--noBorders 0

--ut-report-header-cell-border-color

Selector Value Color
.t-Report-colHead var(--ut-component-inner-border-color)

--ut-report-cell-font-size

Selector Value Color
.t-Report-cell 12px

--ut-report-cell-line-height

Selector Value Color
.t-Report-cell 16px

--ut-report-cell-padding-y

Selector Value Color
.t-Report-cell 8px
.t-Report-cell 8px

--ut-report-cell-padding-x

Selector Value Color
.t-Report-cell 12px
.t-Report-cell 12px

--ut-report-cell-border-width

Selector Value Color
.t-Report-cell 1px
.t-Report--noBorders 0
.t-Region--noPadding .t-Report--horizontalBorders .t-Report-links, .t-Report--inline .t-Report-links 1px

--ut-report-cell-border-color

Selector Value Color
.t-Report-cell var(--ut-component-inner-border-color)

--ut-report-cell-background-color

Selector Value Color
.t-Report-cell transparent
.t-Report--staticRowColors .t-Report-report tr:nth-child(odd) transparent
.t-Report--altRowsDefault .t-Report-report tr:nth-child(odd) var(--ut-report-cell-alt-background-color)
.t-Report--rowHighlight .t-Report-report tr:hover var(--ut-report-cell-hover-background-color)
.u-Report td var(--ut-component-background-color)

--ut-report-header-background-color

Selector Value Color
.u-Report .u-Report-header, .u-Report th var(--a-gv-header-background-color)

--ut-report-header-text-color

Selector Value Color
.u-Report .u-Report-header, .u-Report th var(--a-gv-header-text-color)

--ut-report-cell-text-color

Selector Value Color
.u-Report td var(--a-gv-text-color)

--ut-report-cell-stripe-background-color

Selector Value Color
.a-Table.u-Report.table-stripe tr:nth-child(even) td, .a-Table.u-Report.table-stripe tr:nth-child(even) th[scope="row"] var(--ut-component-highlight-background-color)

--ut-configpanel-font-size

Selector Value Color
.t-ConfigPanel 14px

--ut-configpanel-line-height

Selector Value Color
.t-ConfigPanel 20px

--ut-configpanel-border-width

Selector Value Color
.t-ConfigPanel 1px
.t-ConfigPanel-about 1px
.t-ConfigPanel-main 1px
.t-ConfigPanel-main 1px
.u-RTL .t-ConfigPanel-main 1px

--ut-configpanel-border-color

Selector Value Color
.t-ConfigPanel rgba(0, 0, 0, 0.1)
.t-ConfigPanel-about rgba(0, 0, 0, 0.1)
.t-ConfigPanel-main rgba(0, 0, 0, 0.1)

--ut-configpanel-padding

Selector Value Color
.t-ConfigPanel-about 12px
.t-ConfigPanel-main, .t-ConfigPanel-list 12px
.t-ConfigPanel-icon 12px
.t-ConfigPanel-actions 12px
.t-ConfigPanel-attrLabel 12px
.u-RTL .t-ConfigPanel-attrLabel 12px

--ut-configpanel-icon-border-radius

Selector Value Color
.t-ConfigPanel-icon 100%

--ut-configpanel-icon-background-color

Selector Value Color
.t-ConfigPanel-icon.is-enabled var(--ut-palette-success)
.t-ConfigPanel-icon.is-disabled var(--ut-palette-danger)

--ut-configpanel-icon-text-color

Selector Value Color
.t-ConfigPanel-icon.is-enabled var(--ut-palette-success-contrast)
.t-ConfigPanel-icon.is-disabled var(--ut-palette-danger-contrast)

--ut-configpanel-attr-border-width

Selector Value Color
.t-ConfigPanel-attr 1px
.t-ConfigPanel-attr:last-child 0

--ut-configpanel-attr-border-color

Selector Value Color
.t-ConfigPanel-attr rgba(0, 0, 0, 0.05)

--ut-configpanel-attr-padding

Selector Value Color
.t-ConfigPanel-attrLink 14px 12px

--ut-configpanel-attr-background-color

Selector Value Color
.t-ConfigPanel-attrLink:hover var(--ut-configpanel-attr-hover-background-color, rgba(0, 0, 0, 0.05))

--ut-configpanel-attr-value-text-color

Selector Value Color
.t-ConfigPanel-attrValue var(--ut-link-text-color)

--ut-statuslist-block-header-font-size

Selector Value Color
.t-StatusList-blockHeader 16px

--ut-statuslist-block-header-line-height

Selector Value Color
.t-StatusList-blockHeader 18px

--ut-statuslist-block-header-font-weight

Selector Value Color
.t-StatusList-blockHeader 400

--ut-statuslist-block-header-padding

Selector Value Color
.t-StatusList-blockHeader 12px
.t-StatusList-headerTextAlt 12px
.u-RTL .t-StatusList-headerTextAlt 12px

--ut-statuslist-border-width

Selector Value Color
.t-StatusList-blockHeader var(--ut-component-border-width)
.t-StatusList-blockHeader var(--ut-component-border-width)

--ut-statuslist-border-color

Selector Value Color
.t-StatusList-blockHeader var(--ut-component-border-color)

--ut-statuslist-block-header-background-color

Selector Value Color
.t-StatusList-blockHeader var(--ut-component-background-color)

--ut-statuslist-item-padding

Selector Value Color
.t-StatusList-item 8px

--ut-statuslist-item-marker-margin-x

Selector Value Color
.t-StatusList-itemMarker 4px
.u-RTL .t-StatusList-itemMarker 4px

--ut-statuslist-marker-text-color

Selector Value Color
.t-StatusList-marker var(--ut-component-text-muted-color)

--ut-statuslist-item-title-margin-y

Selector Value Color
.t-StatusList-itemTitle 4px
.t-StatusList-itemTitle 4px

--ut-statuslist-item-title-font-size

Selector Value Color
.t-StatusList-itemTitle 16px

--ut-statuslist-item-title-line-height

Selector Value Color
.t-StatusList-itemTitle 24px

--ut-statuslist-item-title-text-color

Selector Value Color
.t-StatusList-itemTitle var(--ut-component-text-title-color)

--ut-statuslist-item-icon-size

Selector Value Color
.t-StatusList-itemIcon 24px
.t-StatusList-itemIcon 24px

--ut-statuslist-item-icon-padding

Selector Value Color
.t-StatusList-itemIcon 4px

--ut-statuslist-item-icon-border-radius

Selector Value Color
.t-StatusList-itemIcon 24px

--ut-statuslist-item-icon-margin-x

Selector Value Color
.t-StatusList-itemIcon 8px

--ut-statuslist-item-icon-color

Selector Value Color
.t-StatusList-itemIcon rgba(0, 0, 0, 0.4)

--ut-statuslist-item-icon-box-shadow

Selector Value Color
.t-StatusList-itemIcon 0 0 0 1px rgba(0, 0, 0, 0.2) inset

--ut-statuslist-item-icon-background-color

Selector Value Color
.t-StatusList-itemIcon #FFF

--ut-statuslist-item-attr-font-size

Selector Value Color
.t-StatusList-attr 11px

--ut-statuslist-item-attr-line-height

Selector Value Color
.t-StatusList-attr 14px

--ut-statuslist-item-attr-margin-x

Selector Value Color
.t-StatusList-attr 16px
.u-RTL .t-StatusList-attr 16px

--ut-statuslist-item-desc-font-size

Selector Value Color
.t-StatusList-textDesc, p.t-StatusList-textDesc 14px

--ut-statuslist-item-desc-line-height

Selector Value Color
.t-StatusList-textDesc, p.t-StatusList-textDesc 20px

--ut-statuslist-item-desc-margin-y

Selector Value Color
.t-StatusList-textDesc, p.t-StatusList-textDesc 8px

--ut-statuslist-item-desc-text-color

Selector Value Color
.t-StatusList-textDesc, p.t-StatusList-textDesc var(--ut-component-text-muted-color)

--ut-statuslist-marker-size

Selector Value Color
.t-StatusList--dates 24px
.t-StatusList--bullets 16px

--ut-statuslist-marker-font-size

Selector Value Color
.t-StatusList--dates 12px
.t-StatusList--bullets 0

--ut-statuslist-marker-border-radius

Selector Value Color
.t-StatusList--dates 2px
.t-StatusList--dates .t-StatusList-marker:after 2px
.t-StatusList--dates .t-StatusList-marker:after 2px
.t-StatusList--bullets 16px

--ut-statuslist-marker-margin-y

Selector Value Color
.t-StatusList--dates 4px
.t-StatusList--bullets 8px

--ut-statuslist-marker-margin-x

Selector Value Color
.t-StatusList--dates 4px
.t-StatusList--bullets 8px

--ut-statuslist-marker-cal-height

Selector Value Color
.t-StatusList--dates .t-StatusList-marker 4px
.t-StatusList--dates .t-StatusList-marker:after 4px

--ut-statuslist-marker-cal-background-color

Selector Value Color
.t-StatusList--dates .t-StatusList-marker:after rgba(0, 0, 0, 0.2)

--ut-statuslist-marker-line-height

Selector Value Color
.t-StatusList--bullets 16px

--ut-statuslist-marker-border-width

Selector Value Color
.t-StatusList--bullets .t-StatusList-item.is-complete, .t-StatusList--bullets .t-StatusList-item.is-danger, .t-StatusList--bullets .t-StatusList-item.is-open, .t-StatusList--bullets .t-StatusList-item.is-warning, .t-StatusList--bullets .t-StatusList-item.is-null 0

--a-iconlist-item-border-radius

Selector Value Color
.a-PopupLOV-results 0px

--a-iconlist-item-padding-y

Selector Value Color
.a-PopupLOV-results var(--a-menu-item-generic-padding-y, 8px)

--a-iconlist-item-padding-x

Selector Value Color
.a-PopupLOV-results var(--a-menu-item-generic-padding-x, 8px)

--a-menu-font-size

Selector Value Color
.a-PopupLOV-results .a-IconList-item 12px

--a-menu-line-height

Selector Value Color
.a-PopupLOV-results .a-IconList-item 16px

--a-menu-font-weight

Selector Value Color
.a-PopupLOV-results .a-IconList-item 400

--ut-popuplov-background-color

Selector Value Color
.t-Page--popupLOV #fff

--ut-popuplov-actions-padding-y

Selector Value Color
.t-PopupLOV-actions 8

--ut-popuplov-actions-background-color

Selector Value Color
.t-PopupLOV-actions var(--a-toolbar-background-color)

--ut-popuplov-actions-border-width

Selector Value Color
.t-PopupLOV-actions 1px

--ut-popuplov-actions-border-color

Selector Value Color
.t-PopupLOV-actions var(--a-toolbar-border-color)

--ut-popuplov-actions-padding-x

Selector Value Color
.t-PopupLOV-actions .u-pullRight 8px
.u-RTL .t-PopupLOV-actions .u-pullRight 8px

--ut-popuplov-item-padding-y

Selector Value Color
.t-PopupLOV-links a 8p

--ut-popuplov-item-border-width

Selector Value Color
.t-PopupLOV-links a 1px
.t-PopupLOV-links a:last-child 0

--ut-popuplov-item-border-color

Selector Value Color
.t-PopupLOV-links a var(--ut-component-inner-border-color)

--ut-popuplov-item-font-size

Selector Value Color
.t-PopupLOV-links a 12px

--ut-popuplov-item-line-height

Selector Value Color
.t-PopupLOV-links a 16px

--ut-popuplov-item-background-color

Selector Value Color
.t-PopupLOV-links a:hover var(--a-menu-focused-background-color)

--ut-popuplov-item-text-color

Selector Value Color
.t-PopupLOV-links a:hover var(--a-menu-focused-text-color)

--ut-contextualinfo-margin-x

Selector Value Color
.t-ContextualInfo-item 16px
.u-RTL .t-ContextualInfo-item 16px
.t-ContextualInfo-label--stacked var(--ut-contextualinfo-item-label-stacked-margin-x)

--ut-contextualinfo-margin-y

Selector Value Color
.t-ContextualInfo-item 16px
.t-ContextualInfo-label--stacked var(--ut-contextualinfo-item-label-stacked-margin-y)

--ut-contextualinfo-label-font-size

Selector Value Color
.t-ContextualInfo-label 14px
.t-ContextualInfo-label--stacked var(--ut-contextualinfo-item-label-stacked-font-size)

--ut-contextualinfo-label-line-height

Selector Value Color
.t-ContextualInfo-label 16px
.t-ContextualInfo-label--stacked var(--ut-contextualinfo-item-label-stacked-line-height)

--ut-contextualinfo-label-text-color

Selector Value Color
.t-ContextualInfo-label var(--ut-component-text-muted-color)

--ut-contextualinfo-value-font-size

Selector Value Color
.t-ContextualInfo-value 14px
.t-ContextualInfo-label--stacked var(--ut-contextualinfo-item-value-stacked-font-size)

--ut-contextualinfo-value-line-height

Selector Value Color
.t-ContextualInfo-value 16px
.t-ContextualInfo-label--stacked var(--ut-contextualinfo-item-value-stacked-line-height)

--ut-contextualinfo-value-text-color

Selector Value Color
.t-ContextualInfo-value var(--ut-component-text-default-color)

--ut-contextualinfo-label-margin-x

Selector Value Color
.t-ContextualInfo-label--stacked .t-ContextualInfo-label 4px

--ut-contextualinfo-border-color

Selector Value Color
.t-ContextualInfo + .t-Report-pagination var(--ut-component-border-color)

--ut-contextualinfo-border-width

Selector Value Color
.t-ContextualInfo + .t-Report-pagination 1px

--ut-field-label-padding-y

Selector Value Color
.t-Form-label 4px
.t-Form-label 4px

--ut-field-label-line-height

Selector Value Color
.t-Form-label 16px
.t-Form-fieldContainer--floatingLabel var(--ut-field-fl-label-line-height, 20px)

--ut-field-label-font-size

Selector Value Color
.t-Form-label 12px
.t-Form-fieldContainer--floatingLabel 14px

--a-form-required-asterisk-text-color

Selector Value Color
.t-Form-fieldContainer.is-required .t-Form-label:before, .t-Form-fieldContainer.is-required .t-Form-label:after red
.t-Form-fieldContainer--floatingLabel.is-required .t-Form-inputContainer:before re
.u-RTL .t-Form-fieldContainer--floatingLabel.is-required .t-Form-inputContainer:before red transparent transpare
.apex-item-wrapper--single-checkbox.is-required .apex-item-single-checkbox:after red

--ut-field-item-min-height

Selector Value Color
.t-Form-itemWrapper 4px * 2

--ut-field-inline-help-line-height

Selector Value Color
.t-Form-inlineHelp 16px
.apex-item-wrapper--date-picker-jet .oj-helphints-inline-container, .apex-item-wrapper--date-picker-jet .oj-user-assistance-inline-container, .apex-item-wrapper--date-picker-jet .oj-user-assistance-inline-container .oj-message-detail 16px

--ut-field-inline-help-font-size

Selector Value Color
.t-Form-inlineHelp 11px

--ut-field-inline-help-spacing

Selector Value Color
.t-Form-inlineHelp 4px
.apex-item-wrapper--date-picker-jet .oj-helphints-inline-container, .apex-item-wrapper--date-picker-jet .oj-user-assistance-inline-container, .apex-item-wrapper--date-picker-jet .oj-user-assistance-inline-container .oj-message-detail 4px

--ut-prepost-border-radius

Selector Value Color
.t-Form-fieldContainer--preTextBlock var(--a-field-input-border-radius)
.t-Form-fieldContainer--postTextBlock var(--a-field-input-border-radius)

--ut-prepost-background-color

Selector Value Color
.t-Form-fieldContainer--preTextBlock .t-Form-itemText--pre var(--a-field-input-background-color)
.t-Form-fieldContainer--postTextBlock .t-Form-itemText--post var(--a-field-input-background-color)
.apex-item-wrapper--checkbox, .apex-item-wrapper--radiogroup, .apex-item-wrapper--single-checkbox, .apex-item-wrapper--yes-no, .apex-item-wrapper--display-only, .apex-item-wrapper--shuttle, .apex-item-wrapper--list-manager, .apex-item-wrapper--geocoded-address transparent

--a-field-input-border-width

Selector Value Color
.t-Form-fieldContainer--preTextBlock .t-Form-itemText--pre var(--a-field-input-border-color
.u-RTL .t-Form-fieldContainer--preTextBlock .t-Form-itemText--pre 1px
.t-Form-fieldContainer--postTextBlock .t-Form-itemText--post var(--a-field-input-border-color
.u-RTL .t-Form-fieldContainer--postTextBlock .t-Form-itemText--post 1px
.t-Form-fieldContainer--floatingLabel .apex-item-display-only 1px
.apex-item-text, .apex-item-select, .apex-item-textarea, .u-TF-item--text, .u-TF-item--select, select.listmanager, select.group_selectlist, .apex-item-multi, .datetimepicker_newMonth 1px

--a-field-input-border-radius

Selector Value Color
.t-Form-fieldContainer--preTextBlock .t-Form-inputContainer 0 var(--ut-prepost-border-radius) var(--ut-prepost-border-radius) 0
.u-RTL .t-Form-fieldContainer--preTextBlock .t-Form-inputContainer var(--ut-prepost-border-radius) 0 0 var(--ut-prepost-border-radius)
.t-Form-fieldContainer--postTextBlock .t-Form-inputContainer var(--ut-prepost-border-radius) 0 0 var(--ut-prepost-border-radius)
.u-RTL .t-Form-fieldContainer--postTextBlock .t-Form-inputContainer 0 var(--ut-prepost-border-radius) var(--ut-prepost-border-radius) 0
.t-Form-fieldContainer--preTextBlock.t-Form-fieldContainer--postTextBlock .t-Form-inputContainer 0
.t-Form-fieldContainer--floatingLabel.is-required .t-Form-inputContainer:before 2px
.u-RTL .t-Form-fieldContainer--floatingLabel.is-required .t-Form-inputContainer:before 2px
.t-Form-fieldContainer--floatingLabel.apex-item-wrapper--has-icon .apex-item-icon 2p
.t-Form-fieldContainer--floatingLabel .apex-item-display-only 2px
.t-Form-fieldContainer--floatingLabel.apex-item-wrapper--textarea.js-show-label .t-Form-label:before, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--textarea.is-active .t-Form-label:before 2px
.apex-item-text, .apex-item-select, .apex-item-textarea, .u-TF-item--text, .u-TF-item--select, select.listmanager, select.group_selectlist, .apex-item-multi, .datetimepicker_newMonth 2px
.apex-item-wrapper--rich-text-editor .cke_chrome var(--ut-component-border-radius)

--ut-prepost-border-color

Selector Value Color
.apex-item-wrapper--checkbox, .apex-item-wrapper--radiogroup, .apex-item-wrapper--single-checkbox, .apex-item-wrapper--yes-no, .apex-item-wrapper--display-only, .apex-item-wrapper--shuttle, .apex-item-wrapper--list-manager, .apex-item-wrapper--geocoded-address transparent

--ut-field-error-font-size

Selector Value Color
.a-Form-error, .t-Form-error 11px

--ut-field-error-line-height

Selector Value Color
.a-Form-error, .t-Form-error 16px

--ut-field-error-margin-y

Selector Value Color
.a-Form-error, .t-Form-error 4px

--ut-field-required-margin-y

Selector Value Color
.t-Form-itemRequired 4px

--ut-field-required-font-size

Selector Value Color
.t-Form-itemRequired 11px

--ut-field-required-line-height

Selector Value Color
.t-Form-itemRequired 16px

--ut-field-required-text-color

Selector Value Color
.t-Form-itemRequired var(--ut-component-text-muted-color)

--ut-field-fixed-min-width

Selector Value Color
.t-Form--fixedLabels .t-Form-labelContainer 160px

--a-field-input-padding-y

Selector Value Color
.t-Form-fieldContainer--floatingLabel 6px
.t-Form-fieldContainer--floatingLabel .t-Form-label 4px
.apex-item-multi .apex-item-popup-lov 0px
.apex-item-wrapper--date-picker-jet .oj-datepicker-inline + .oj-inputdatetime-time-only 4px

--a-field-input-width

Selector Value Color
.t-Form-fieldContainer--floatingLabel 100%
.apex-item-wrapper--date-picker-jet .oj-text-field auto

--ut-field-fl-label-line-height

Selector Value Color
.t-Form-fieldContainer--floatingLabel 20px

--ut-field-fl-label-font-size

Selector Value Color
.t-Form-fieldContainer--floatingLabel 11px
.t-Form-fieldContainer--floatingLabel.is-active .t-Form-label, .t-Form-fieldContainer--floatingLabel.js-show-label .t-Form-label, .t-Form-fieldContainer--floatingLabel:focus-within .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--display-only .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--baseline .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--yes-no .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--checkbox .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--radiogroup .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--shuttle .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--file .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--rich-text-editor .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--star-rating .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--geocoded-address .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--mdeditor .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--markdown-editor .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--pct-graph .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--color-picker .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--date-picker-html5 .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--date-picker-jet .t-Form-label 14px

--ut-field-label-offset

Selector Value Color
.t-Form-fieldContainer--floatingLabel calc(var(--a-field-input-line-height, 16px) + var(--a-field-input-padding-y, 4px) + var(--a-field-input-padding-y, 4px) + var(--ut-field-fl-label-line-height, 20px))

--ut-field-label-cursor

Selector Value Color
.t-Form-fieldContainer--floatingLabel .t-Form-label pointer

--ut-field-label-padding-x-offset

Selector Value Color
.t-Form-fieldContainer--floatingLabel .t-Form-label 4px
.u-RTL .t-Form-fieldContainer--floatingLabel .t-Form-label 4px
.t-Form-fieldContainer--floatingLabel.apex-item-wrapper--has-icon calc(var(--ut-field-input-icon-offset, 24px) + var(--a-field-input-padding-x, 4px))
.t-Form-fieldContainer--floatingLabel.apex-item-wrapper--color-picker var(--ut-field-input-icon-offset, 24px)
.t-Form-fieldContainer--floatingLabel.apex-item-wrapper--select-list .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--popup-lov .t-Form-label 4px
.u-RTL .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--select-list .t-Form-label, .u-RTL .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--popup-lov .t-Form-label 4px

--a-field-input-state-background-color

Selector Value Color
.t-Form-fieldContainer--floatingLabel.is-active, .t-Form-fieldContainer--floatingLabel:focus-within var(--a-field-input-focus-background-color)
.t-Form-fieldContainer--floatingLabel.apex-item-wrapper--textarea.js-show-label .t-Form-label:before, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--textarea.is-active .t-Form-label:before var(--a-field-input-background-color)
.t-Form-fieldContainer--floatingLabel.apex-item-wrapper--textarea:hover .t-Form-label:before var(--a-field-input-hover-background-color)
.t-Form-fieldContainer--floatingLabel.apex-item-wrapper--textarea:focus-within .t-Form-label:before var(--a-field-input-focus-background-color)
.apex-item-text, .apex-item-select, .apex-item-textarea, .u-TF-item--text, .u-TF-item--select, select.listmanager, select.group_selectlist, .apex-item-multi, .datetimepicker_newMonth var(--a-field-input-background-color)
.apex-item-text:hover, .apex-item-select:hover, .apex-item-textarea:hover, .u-TF-item--text:hover, .u-TF-item--select:hover, select.listmanager:hover, select.group_selectlist:hover, .apex-item-multi:hover, .datetimepicker_newMonth:hover var(--a-field-input-hover-background-color)
.apex-item-text:focus, .apex-item-text:focus-within, .apex-item-select:focus, .apex-item-select:focus-within, .apex-item-textarea:focus, .apex-item-textarea:focus-within, .u-TF-item--text:focus, .u-TF-item--text:focus-within, .u-TF-item--select:focus, .u-TF-item--select:focus-within, select.listmanager:focus, select.listmanager:focus-within, select.group_selectlist:focus, select.group_selectlist:focus-within, .apex-item-multi:focus, .apex-item-multi:focus-within, .datetimepicker_newMonth:focus, .datetimepicker_newMonth:focus-within var(--a-field-input-focus-background-color)
.apex-item-wrapper--date-picker-jet .oj-text-field:hover .oj-text-field-container var(--a-field-input-hover-background-color)
.apex-item-wrapper--date-picker-jet .oj-text-field.oj-focus .oj-text-field-container var(--a-field-input-focus-background-color)
body .ck.ck-input-text, body .ck.ck-editor__main > .ck-editor__editable var(--a-field-input-background-color)

--a-field-input-state-border-color

Selector Value Color
.t-Form-fieldContainer--floatingLabel.is-active, .t-Form-fieldContainer--floatingLabel:focus-within var(--a-field-input-focus-border-color)
.apex-item-text, .apex-item-select, .apex-item-textarea, .u-TF-item--text, .u-TF-item--select, select.listmanager, select.group_selectlist, .apex-item-multi, .datetimepicker_newMonth var(--a-field-input-border-color)
.apex-item-text:hover, .apex-item-select:hover, .apex-item-textarea:hover, .u-TF-item--text:hover, .u-TF-item--select:hover, select.listmanager:hover, select.group_selectlist:hover, .apex-item-multi:hover, .datetimepicker_newMonth:hover var(--a-field-input-hover-border-color)
.apex-item-text:focus, .apex-item-text:focus-within, .apex-item-select:focus, .apex-item-select:focus-within, .apex-item-textarea:focus, .apex-item-textarea:focus-within, .u-TF-item--text:focus, .u-TF-item--text:focus-within, .u-TF-item--select:focus, .u-TF-item--select:focus-within, select.listmanager:focus, select.listmanager:focus-within, select.group_selectlist:focus, select.group_selectlist:focus-within, .apex-item-multi:focus, .apex-item-multi:focus-within, .datetimepicker_newMonth:focus, .datetimepicker_newMonth:focus-within var(--a-field-input-focus-border-color)
.apex-item-text.apex-page-item-error, .apex-item-select.apex-page-item-error, .apex-item-textarea.apex-page-item-error, .u-TF-item--text.apex-page-item-error, .u-TF-item--select.apex-page-item-error, select.listmanager.apex-page-item-error, select.group_selectlist.apex-page-item-error, .apex-item-multi.apex-page-item-error, .datetimepicker_newMonth.apex-page-item-error var(--ut-palette-danger)
.apex-item-text.apex-page-item-error:required:valid, .apex-item-select.apex-page-item-error:required:valid, .apex-item-textarea.apex-page-item-error:required:valid, .u-TF-item--text.apex-page-item-error:required:valid, .u-TF-item--select.apex-page-item-error:required:valid, select.listmanager.apex-page-item-error:required:valid, select.group_selectlist.apex-page-item-error:required:valid, .apex-item-multi.apex-page-item-error:required:valid, .datetimepicker_newMonth.apex-page-item-error:required:valid var(--a-field-input-border-color)
.apex-item-wrapper--date-picker-jet .oj-text-field:hover .oj-text-field-container var(--a-field-input-hover-border-color)
.apex-item-wrapper--date-picker-jet .oj-text-field.oj-focus .oj-text-field-container var(--a-field-input-focus-border-color)
.apex-item-wrapper--date-picker-jet .oj-text-field.oj-invalid .oj-text-field-container var(--ut-palette-danger)
body .ck.ck-editor__main > .ck-editor__editable:not(.ck-focused) var(--a-field-input-border-color)
body .ck.ck-editor__editable:not(.ck-editor__nested-editable).ck-focused var(--a-field-input-focus-border-color)
body .ck.ck-editor__editable:not(.ck-editor__nested-editable).ck-focused var(--a-field-input-border-color)

--a-field-input-state-text-color

Selector Value Color
.t-Form-fieldContainer--floatingLabel.is-active, .t-Form-fieldContainer--floatingLabel:focus-within var(--a-field-input-focus-text-color)
.apex-item-text, .apex-item-select, .apex-item-textarea, .u-TF-item--text, .u-TF-item--select, select.listmanager, select.group_selectlist, .apex-item-multi, .datetimepicker_newMonth var(--a-field-input-text-color)
.apex-item-text:hover, .apex-item-select:hover, .apex-item-textarea:hover, .u-TF-item--text:hover, .u-TF-item--select:hover, select.listmanager:hover, select.group_selectlist:hover, .apex-item-multi:hover, .datetimepicker_newMonth:hover var(--a-field-input-hover-text-color)
.apex-item-text:focus, .apex-item-text:focus-within, .apex-item-select:focus, .apex-item-select:focus-within, .apex-item-textarea:focus, .apex-item-textarea:focus-within, .u-TF-item--text:focus, .u-TF-item--text:focus-within, .u-TF-item--select:focus, .u-TF-item--select:focus-within, select.listmanager:focus, select.listmanager:focus-within, select.group_selectlist:focus, select.group_selectlist:focus-within, .apex-item-multi:focus, .apex-item-multi:focus-within, .datetimepicker_newMonth:focus, .datetimepicker_newMonth:focus-within var(--a-field-input-focus-text-color)
.apex-item-file--native var(--a-field-input-text-color)
.apex-item-wrapper--date-picker-jet .oj-text-field:hover .oj-text-field-container var(--a-field-input-hover-text-color)
.apex-item-wrapper--date-picker-jet .oj-text-field.oj-focus .oj-text-field-container var(--a-field-input-focus-text-color)
body .ck.ck-input-text, body .ck.ck-editor__main > .ck-editor__editable var(--a-field-input-text-color)

--ut-field-input-icon-background-color

Selector Value Color
.t-Form-fieldContainer--floatingLabel.is-active, .t-Form-fieldContainer--floatingLabel:focus-within var(--ut-field-fl-input-focus-icon-background-color)
.apex-item-wrapper--date-picker-jet .oj-text-field:hover .oj-text-field-container var(--ut-field-input-hover-icon-background-color)
.apex-item-wrapper--date-picker-jet .oj-text-field.oj-focus .oj-text-field-container var(--ut-field-input-focus-icon-background-color)

--ut-field-input-icon-color

Selector Value Color
.t-Form-fieldContainer--floatingLabel.is-active, .t-Form-fieldContainer--floatingLabel:focus-within var(--ut-field-fl-input-focus-icon-color)
.apex-item-text:hover + .apex-item-icon, .apex-item-select:hover + .apex-item-icon, .apex-item-textarea:hover + .apex-item-icon, .u-TF-item--text:hover + .apex-item-icon, .u-TF-item--select:hover + .apex-item-icon, select.listmanager:hover + .apex-item-icon, select.group_selectlist:hover + .apex-item-icon, .apex-item-multi:hover + .apex-item-icon, .datetimepicker_newMonth:hover + .apex-item-icon var(--a-field-input-hover-text-color)
.apex-item-text:focus + .apex-item-icon, .apex-item-select:focus + .apex-item-icon, .apex-item-textarea:focus + .apex-item-icon, .u-TF-item--text:focus + .apex-item-icon, .u-TF-item--select:focus + .apex-item-icon, select.listmanager:focus + .apex-item-icon, select.group_selectlist:focus + .apex-item-icon, .apex-item-multi:focus + .apex-item-icon, .datetimepicker_newMonth:focus + .apex-item-icon var(--ut-field-input-focus-icon-color, var(--a-field-input-focus-text-color))
.apex-item-wrapper--date-picker-jet .oj-text-field:hover .oj-text-field-container var(--ut-field-input-hover-icon-color)
.apex-item-wrapper--date-picker-jet .oj-text-field.oj-focus .oj-text-field-container var(--ut-field-input-focus-icon-color)

--ut-field-input-focus-icon-color

Selector Value Color
.t-Form-fieldContainer--floatingLabel.is-active, .t-Form-fieldContainer--floatingLabel:focus-within var(--ut-field-input-icon-color)

--ut-field-input-icon-border

Selector Value Color
.t-Form-fieldContainer--floatingLabel.apex-item-wrapper--has-icon .apex-item-icon 1px) * -1) 0 0 0 var(--a-field-input-border-color
.u-RTL .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--has-icon .apex-item-icon 1px) 0 0 0 var(--a-field-input-border-color
.t-Form-fieldContainer--floatingLabel.apex-item-wrapper--display-only none

--a-field-input-line-height

Selector Value Color
.t-Form-fieldContainer--floatingLabel .apex-item-display-only 16px
.apex-item-text, .apex-item-select, .apex-item-textarea, .u-TF-item--text, .u-TF-item--select, select.listmanager, select.group_selectlist, .apex-item-multi, .datetimepicker_newMonth 16px
.apex-item-file--native 16px
.apex-item-wrapper--date-picker-jet .oj-text-field-input 16px

--a-field-input-font-weight

Selector Value Color
.t-Form-fieldContainer--floatingLabel .apex-item-display-only 400
.apex-item-text, .apex-item-select, .apex-item-textarea, .u-TF-item--text, .u-TF-item--select, select.listmanager, select.group_selectlist, .apex-item-multi, .datetimepicker_newMonth 400
.apex-item-file--native 400
.apex-item-wrapper--date-picker-jet .oj-text-field-input 400

--a-field-select-arrow-padding

Selector Value Color
.t-Form-fieldContainer--floatingLabel.apex-item-wrapper--select-list .t-Form-label, .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--popup-lov .t-Form-label 32px
.u-RTL .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--select-list .t-Form-label, .u-RTL .t-Form-fieldContainer--floatingLabel.apex-item-wrapper--popup-lov .t-Form-label 32px
.apex-item-select, .u-TF-item--select, select.group_selectlist, .datetimepicker_newMonth 32px
.u-RTL .apex-item-select, .u-RTL .u-TF-item--select, .u-RTL select.group_selectlist, .u-RTL .datetimepicker_newMonth 32px

--ut-field-input-min-height

Selector Value Color
.apex-item-wrapper--has-icon, .apex-item-wrapper--color-picker calc(var(--ut-field-input-icon-size, var(--a-icon-size, 16px)) + var(--ut-field-input-icon-padding-y, 4px) + var(--ut-field-input-icon-padding-y, 4px))
.apex-item-text, .apex-item-select, .apex-item-textarea, .u-TF-item--text, .u-TF-item--select, select.listmanager, select.group_selectlist, .apex-item-multi, .datetimepicker_newMonth 0
.apex-item-file--native 0
.apex-item-group--popup-lov calc(var(--a-field-input-padding-y, 4px) + var(--a-field-input-padding-y, 4px) + var(--a-field-input-line-height, 16px))
.apex-item-multi 0

--ut-field-input-icon-size

Selector Value Color
.apex-item-icon 16px
.a-Button--colorPicker.apex-item-color-picker-preview 16px
.a-Button--colorPicker.apex-item-color-picker-preview 16px
.apex-item-color-picker-preview 16px
.apex-item-color-picker-preview 16px
.apex-item-wrapper--date-picker-jet .oj-text-field:not(.oj-text-field-label-inside) .oj-text-field-container .oj-clickable-icon-nocontext.oj-menucheckbox-icon:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor), .apex-item-wrapper--date-picker-jet .oj-text-field:not(.oj-text-field-label-inside) .oj-text-field-container .oj-clickable-icon-nocontext.oj-radiocheckbox-icon:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor), .apex-item-wrapper--date-picker-jet .oj-text-field:not(.oj-text-field-label-inside) .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor) 16px

--a-field-input-state-shadow

Selector Value Color
.apex-item-text, .apex-item-select, .apex-item-textarea, .u-TF-item--text, .u-TF-item--select, select.listmanager, select.group_selectlist, .apex-item-multi, .datetimepicker_newMonth var(--a-field-input-shadow)
body .ck.ck-input-text, body .ck.ck-editor__main > .ck-editor__editable var(--a-field-input-shadow)
body .ck.ck-editor__editable:not(.ck-editor__nested-editable).ck-focused var(--a-field-input-shadow)

--a-field-placeholder-text-color

Selector Value Color
.apex-item-text::-moz-placeholder, .apex-item-select::-moz-placeholder, .apex-item-textarea::-moz-placeholder, .u-TF-item--text::-moz-placeholder, .u-TF-item--select::-moz-placeholder, select.listmanager::-moz-placeholder, select.group_selectlist::-moz-placeholder, .apex-item-multi::-moz-placeholder, .datetimepicker_newMonth::-moz-placeholder currentColor
.apex-item-text:-ms-input-placeholder, .apex-item-select:-ms-input-placeholder, .apex-item-textarea:-ms-input-placeholder, .u-TF-item--text:-ms-input-placeholder, .u-TF-item--select:-ms-input-placeholder, select.listmanager:-ms-input-placeholder, select.group_selectlist:-ms-input-placeholder, .apex-item-multi:-ms-input-placeholder, .datetimepicker_newMonth:-ms-input-placeholder currentColor
.apex-item-text::placeholder, .apex-item-select::placeholder, .apex-item-textarea::placeholder, .u-TF-item--text::placeholder, .u-TF-item--select::placeholder, select.listmanager::placeholder, select.group_selectlist::placeholder, .apex-item-multi::placeholder, .datetimepicker_newMonth::placeholder currentColor
.apex-item-group--auto-complete .apex-item-auto-complete::-moz-placeholder #000
.apex-item-group--auto-complete .apex-item-auto-complete:-ms-input-placeholder #000
.apex-item-group--auto-complete .apex-item-auto-complete::placeholder #000

--a-field-placeholder-opacity

Selector Value Color
.apex-item-text::-moz-placeholder, .apex-item-select::-moz-placeholder, .apex-item-textarea::-moz-placeholder, .u-TF-item--text::-moz-placeholder, .u-TF-item--select::-moz-placeholder, select.listmanager::-moz-placeholder, select.group_selectlist::-moz-placeholder, .apex-item-multi::-moz-placeholder, .datetimepicker_newMonth::-moz-placeholder 0.6
.apex-item-text:-ms-input-placeholder, .apex-item-select:-ms-input-placeholder, .apex-item-textarea:-ms-input-placeholder, .u-TF-item--text:-ms-input-placeholder, .u-TF-item--select:-ms-input-placeholder, select.listmanager:-ms-input-placeholder, select.group_selectlist:-ms-input-placeholder, .apex-item-multi:-ms-input-placeholder, .datetimepicker_newMonth:-ms-input-placeholder 0.6
.apex-item-text::placeholder, .apex-item-select::placeholder, .apex-item-textarea::placeholder, .u-TF-item--text::placeholder, .u-TF-item--select::placeholder, select.listmanager::placeholder, select.group_selectlist::placeholder, .apex-item-multi::placeholder, .datetimepicker_newMonth::placeholder 0.6
.apex-item-group--auto-complete .apex-item-auto-complete::-moz-placeholder 0.5
.apex-item-group--auto-complete .apex-item-auto-complete:-ms-input-placeholder 0.5
.apex-item-group--auto-complete .apex-item-auto-complete::placeholder 0.5

--a-field-input-border-color

Selector Value Color
.apex-item-text:focus + .apex-item-icon, .apex-item-select:focus + .apex-item-icon, .apex-item-textarea:focus + .apex-item-icon, .u-TF-item--text:focus + .apex-item-icon, .u-TF-item--select:focus + .apex-item-icon, select.listmanager:focus + .apex-item-icon, select.group_selectlist:focus + .apex-item-icon, .apex-item-multi:focus + .apex-item-icon, .datetimepicker_newMonth:focus + .apex-item-icon var(--a-field-input-state-border-color)
.apex-item-group--popup-lov:focus-within var(--a-field-input-focus-border-color)
.apex-item-wrapper--date-picker-jet .oj-text-field.oj-focus .oj-text-field-container var(--a-field-input-focus-border-color)

--ut-field-disabled-opacity

Selector Value Color
.apex-item-text:disabled, .apex-item-select:disabled, .apex-item-textarea:disabled, .u-TF-item--text:disabled, .u-TF-item--select:disabled, select.listmanager:disabled, select.group_selectlist:disabled, .apex-item-multi:disabled, .datetimepicker_newMonth:disabled 0.5

--a-field-select-background-size

Selector Value Color
.apex-item-select, .u-TF-item--select, select.group_selectlist, .datetimepicker_newMonth 32px 16px

--a-checkbox-label-font-size

Selector Value Color
.apex-item-wrapper--single-checkbox.is-required .apex-item-single-checkbox:after 12px

--a-checkbox-size

Selector Value Color
.apex-item-wrapper--single-checkbox.is-required .apex-item-single-checkbox:after 16px
.apex-item-group--rc input + label 16px

--a-color-picker-color-only-height

Selector Value Color
.apex-item-group--color-picker .a-Button--colorPickerOnly 16px

--a-color-picker-color-only-width

Selector Value Color
.apex-item-group--color-picker .a-Button--colorPickerOnly 24px

--a-button-padding

Selector Value Color
.apex-item-group--color-picker .a-Button--colorPickerOnly 4px

--ck-z-modal

Selector Value Color
.ck-editor 700

--a-item-icon-offset

Selector Value Color
.apex-item-group--popup-lov var(--ut-field-input-icon-offset, 0px)
.apex-item-group--popup-lov .apex-item-popup-lov:not(.apex-item-has-icon) 0px

--a-popuplov-chip-margin-x

Selector Value Color
.u-RTL .apex-item-multi-item 1px

--a-checkbox-label-spacing-x

Selector Value Color
.apex-item-group--rc label 8px
.u-RTL .apex-item-group--rc label 8px

--oj-text-field-height

Selector Value Color
.apex-item-wrapper--date-picker-jet .oj-text-field auto

--oj-text-field-border-width

Selector Value Color
.apex-item-wrapper--date-picker-jet .oj-text-field .oj-text-field-container var(--a-field-input-border-width, 1px)
.a-GV-columnItem .oj-inputdatetime var(--a-field-input-border-width, 1px)

--oj-text-field-border-color

Selector Value Color
.apex-item-wrapper--date-picker-jet .oj-text-field .oj-text-field-container var(--a-field-input-state-border-color, var(--a-field-input-border-color))
.apex-item-wrapper--date-picker-jet .oj-inputdatetime-input-trigger var(--a-field-input-state-border-color, var(--a-field-input-border-color))
.a-GV-columnItem .oj-inputdatetime var(--a-field-input-state-border-color, var(--a-field-input-border-color))

--oj-text-field-border-radius

Selector Value Color
.apex-item-wrapper--date-picker-jet .oj-text-field .oj-text-field-container var(--a-field-input-border-radius, 2px)
.a-GV-columnItem .oj-inputdatetime 0

--oj-text-field-bg-color

Selector Value Color
.apex-item-wrapper--date-picker-jet .oj-text-field .oj-text-field-container var(--a-field-input-state-background-color, var(--a-field-input-background-color))
.a-GV-columnItem .oj-inputdatetime var(--a-field-input-state-background-color, var(--a-field-input-background-color))

--oj-text-field-border-color-focus

Selector Value Color
.apex-item-wrapper--date-picker-jet .oj-text-field .oj-text-field-container var(--a-field-input-focus-border-color)
.a-GV-columnItem .oj-inputdatetime var(--a-field-input-focus-border-color)

--oj-text-field-text-color

Selector Value Color
.apex-item-wrapper--date-picker-jet .oj-inputdatetime-input var(--a-field-input-state-text-color, var(--a-field-input-text-color))

--oj-button-sm-height

Selector Value Color
.apex-item-wrapper--date-picker-jet .oj-text-field:not(.oj-text-field-label-inside) .oj-text-field-container .oj-clickable-icon-nocontext.oj-menucheckbox-icon:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor), .apex-item-wrapper--date-picker-jet .oj-text-field:not(.oj-text-field-label-inside) .oj-text-field-container .oj-clickable-icon-nocontext.oj-radiocheckbox-icon:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor), .apex-item-wrapper--date-picker-jet .oj-text-field:not(.oj-text-field-label-inside) .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor) auto

--oj-private-icon-color-default

Selector Value Color
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-label-help-icon-anchor) var(--a-button-state-text-color, var(--a-button-type-text-color, var(--a-button-text-color, inherit)))

--oj-private-icon-color-hover

Selector Value Color
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-disabled):hover var(--a-button-hover-text-color)

--oj-private-icon-bg-color-hover

Selector Value Color
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-disabled):hover var(--a-button-state-background-color)

--oj-private-icon-border-color-hover

Selector Value Color
.apex-item-wrapper--date-picker-jet .oj-text-field-container .oj-component-icon.oj-clickable-icon-nocontext:not(.oj-select-clear-entry-icon):not(.oj-combobox-clear-entry-icon):not(.oj-disabled):hover var(--a-button-state-border-color)

--oj-user-assistance-inline-text-color

Selector Value Color
.apex-item-wrapper--date-picker-jet .oj-helphints-inline-container, .apex-item-wrapper--date-picker-jet .oj-user-assistance-inline-container, .apex-item-wrapper--date-picker-jet .oj-user-assistance-inline-container .oj-message-detail var(--ut-component-text-muted-color)

--oj-user-assistance-inline-font-size

Selector Value Color
.apex-item-wrapper--date-picker-jet .oj-helphints-inline-container, .apex-item-wrapper--date-picker-jet .oj-user-assistance-inline-container, .apex-item-wrapper--date-picker-jet .oj-user-assistance-inline-container .oj-message-detail var(--ut-field-inline-help-font-size, 11px)

--oj-core-bg-color-selected

Selector Value Color
.a-GV-columnItem .oj-inputdatetime Highlight

--oj-button-height

Selector Value Color
.oj-datepicker-header 36px

--oj-core-icon-size-lg

Selector Value Color
.oj-datepicker-header 20px

--oj-heading-text-color

Selector Value Color
.oj-datepicker-header var(--ut-component-text-title-color)

--oj-typography-body-lg-font-size

Selector Value Color
.oj-datepicker-title 14px

--oj-typography-body-2xs-font-size

Selector Value Color
.oj-datepicker-calendar th 11px

--oj-date-picker-cell-font-size

Selector Value Color
.oj-datepicker-calendar td 12px

--ut-palette-primary

Selector Value Color
.oj-datepicker-calendar td a.oj-selected, .oj-datepicker-calendar td.oj-datepicker-today a.oj-selected var(--a-palette-primary)

--ut-palette-primary-contrast

Selector Value Color
.oj-datepicker-calendar td a.oj-selected, .oj-datepicker-calendar td.oj-datepicker-today a.oj-selected var(--a-palette-primary-contrast)

--a-bar-chart-item-padding

Selector Value Color
.a-BarChart-item 12px

--a-bar-chart-item-border-width

Selector Value Color
.a-BarChart-item var(--ut-component-inner-border-width)

--a-bar-chart-item-border-color

Selector Value Color
.a-BarChart-item var(--ut-component-inner-border-color)

--a-bar-chart-img-border-radius

Selector Value Color
.a-BarChart-image, .a-BarChart-item img 2px

--a-bar-chart-bar-height

Selector Value Color
.a-BarChart-bar 8px
.a-BarChart-filled 8px
.a-BarChart--classic 12px
.a-BarChart--modern 8px

--a-bar-chart-bar-border-radius

Selector Value Color
.a-BarChart--classic 1px
.a-BarChart--modern 1px

--a-bar-chart-bar-margin

Selector Value Color
.a-BarChart--classic 4px 0
.a-BarChart--modern 2px 0

--a-bar-chart-bar-opacity

Selector Value Color
.a-BarChart--classic .75
.a-BarChart--modern .75

--ut-fc4-event-font-size

Selector Value Color
.fc .fc-event 11px

--ut-fc4-event-line-height

Selector Value Color
.fc .fc-event 12px

--ut-fc4-event-padding

Selector Value Color
.fc .fc-event 2px 4px

--ut-fc4-basic-number-font-size

Selector Value Color
.fc .fc-basic-view .fc-week-number, .fc .fc-basic-view .fc-day-number 14px

--ut-fc4-basic-number-padding

Selector Value Color
.fc .fc-basic-view .fc-week-number, .fc .fc-basic-view .fc-day-number 4px

--ut-minical-border-width

Selector Value Color
.a-MiniCal 0

--ut-minical-title-padding

Selector Value Color
.a-MiniCal-title 12px

--ut-minical-title-font-size

Selector Value Color
.a-MiniCal-title 16px

--ut-minical-title-line-height

Selector Value Color
.a-MiniCal-title 24px

--ut-minical-month-font-size

Selector Value Color
.a-MiniCal-month 12px

--ut-minical-heading-font-size

Selector Value Color
.a-MiniCal-dayOfWeek 11px

--ut-minical-heading-line-height

Selector Value Color
.a-MiniCal-dayOfWeek 20px

--ut-minical-date-font-size

Selector Value Color
.a-MiniCal-date 11px

--ut-minical-date-width

Selector Value Color
.a-MiniCal-date 20px

--ut-minical-date-height

Selector Value Color
.a-MiniCal-date 20px
.a-MiniCal-date 20px

--ut-minical-day-padding

Selector Value Color
.a-MiniCal-day 6px 0

--ut-minical-date-border-radius

Selector Value Color
.a-MiniCal-day.is-today, .a-MiniCal-day.is-active 100%

--ut-minical-date-font-weight

Selector Value Color
.a-MiniCal-day.is-today, .a-MiniCal-day.is-active var(--a-base-font-weight-bold, 700)

--ut-minical-date-opacity

Selector Value Color
.a-MiniCal-day.is-today, .a-MiniCal-day.is-active 1
.a-MiniCal-day.is-weekend, .a-MiniCal-day.is-null .5

--ut-tagcloud-item-border-width

Selector Value Color
.a-TagCloud-link 1px

--ut-tagcloud-item-text-color

Selector Value Color
.a-TagCloud-link initial

--ut-tagcloud-item-gap

Selector Value Color
.a-TagCloud-link 4px
.a-TagCloud-count 4px
.u-RTL .a-TagCloud-count 4px

--ut-tagcloud-item-padding

Selector Value Color
.a-TagCloud-link 4px 12px

--ut-tagcloud-item-font-size

Selector Value Color
.a-TagCloud-link inherit
.a-TagCloud-link--size1 12px
.a-TagCloud-link--size2 14px
.a-TagCloud-link--size3 16px
.a-TagCloud-link--size4 18px
.a-TagCloud-link--size5 20px
.a-TagCloud-link--size6 22px

--ut-tagcloud-item-line-height

Selector Value Color
.a-TagCloud-link 32px

--ut-tagcloud-item-count-font-weight

Selector Value Color
.a-TagCloud-count 500

--ut-valiation-icon-background-color

Selector Value Color
.t-Validation.is-invalid var(--ut-palette-danger)
.t-Validation.is-warning var(--ut-palette-warning)
.t-Validation.is-valid var(--ut-palette-success)

--ut-validaiton-icon-margin

Selector Value Color
.t-Validation-icon 12px

--ut-valiation-icon-text-color

Selector Value Color
.t-Validation-icon .a-Icon #FFF

--ut-valiation-icon-border-radius

Selector Value Color
.t-Validation-icon .a-Icon 100%

--ut-valiation-icon-padding

Selector Value Color
.t-Validation-icon .a-Icon 4px

--ut-validaiton-date-font-size

Selector Value Color
.t-Validation-date 16px

--ut-validation-date-line-height

Selector Value Color
.t-Validation-date 24px

--ut-validaiton-date-text-color

Selector Value Color
.t-Validation-date #404040

--ut-validaiton-user-font-size

Selector Value Color
.t-Validation-user 12px

--ut-validation-user-line-height

Selector Value Color
.t-Validation-user 16px

--ut-validaiton-user-text-color

Selector Value Color
.t-Validation-user #707070

--ut-table-border-width

Selector Value Color
.u-Table--withBorder > .u-Table-fit, .u-Table--withBorder > .u-Table-fill 1px
.u-Table--withBorder > .u-Table-fit:first-child, .u-Table--withBorder > .u-Table-fill:first-child 0px

--ut-table-border-color

Selector Value Color
.u-Table--withBorder > .u-Table-fit, .u-Table--withBorder > .u-Table-fill #f0f0f0

--jui-datepicker-font-size

Selector Value Color
.ui-datepicker 11px

--jui-datepicker-header

Selector Value Color
.ui-datepicker th var(--ut-component-text-muted-color)

--jui-datepicker-border-width

Selector Value Color
.ui-datepicker th 1px

--ut-datepicker-border-color

Selector Value Color
.ui-datepicker th var(--ut-component-border-color)

--jui-datepicker-padding-y

Selector Value Color
.ui-datepicker th 8px
.ui-datepicker th 8px

--jui-datepicker-padding-x

Selector Value Color
.ui-datepicker th 8px
.ui-datepicker th 8px

--jui-datepicker-title-font-size

Selector Value Color
.ui-datepicker .ui-datepicker-title 16px

--jui-datepicker-date-size

Selector Value Color
.ui-datepicker .ui-state-default 32px
.ui-datepicker .ui-state-default 32px
.ui-datepicker .ui-state-default 32px
.ui-datepicker .ui-datepicker-current, .ui-datepicker .ui-datepicker-close auto
.ui-datepicker .ui-datepicker-current, .ui-datepicker .ui-datepicker-close 20px

--jui-datepicker-date-margin

Selector Value Color
.ui-datepicker .ui-state-default 2px
.ui-datepicker .ui-datepicker-current, .ui-datepicker .ui-datepicker-close 2px

--jui-datepicker-date-border-radius

Selector Value Color
.ui-datepicker .ui-state-default 24px
.ui-datepicker .ui-datepicker-current, .ui-datepicker .ui-datepicker-close var(--a-button-border-radius)

--jui-datepicker-date-background-color

Selector Value Color
.ui-datepicker .ui-state-default transparent
.ui-datepicker .ui-state-hover var(--ut-component-inner-border-color, #f2f2f2)
.ui-datepicker .ui-state-highlight var(--ut-component-border-color, #ebebeb)
.ui-datepicker .ui-state-active, .ui-datepicker .ui-state-active.ui.state-hover var(--ut-palette-primary, var(--a-palette-primary))

--jui-datepicker-date-color

Selector Value Color
.ui-datepicker .ui-state-default inherit
.ui-datepicker .ui-state-hover var(--ut-component-text-default-color, #262626)
.ui-datepicker .ui-state-highlight var(--ut-component-text-default-color, #262626)
.ui-datepicker .ui-state-active, .ui-datepicker .ui-state-active.ui.state-hover var(--ut-palette-primary-contrast, var(--a-palette-primary-contrast))

--jui-datepicker-date-transition

Selector Value Color
.ui-datepicker .ui-state-default background-color 0.1s, color 0.1s

--jui-datepicker-date-focus-box-shadow

Selector Value Color
.ui-datepicker .ui-state-default:focus 35 0 0 1px #0076df inset, 0 0 1px 2px rgba(0, 118, 223, 0.25)

--jui-datepicker-active-font-size

Selector Value Color
.ui-datepicker .ui-state-active, .ui-datepicker .ui-state-active.ui.state-hover 14px

--ut-ojet-font-size

Selector Value Color
.oj-html 14px
.oj-chart-pie-center-label, .oj-chart-xaxis-title, .oj-chart-yaxis-title, .oj-chart-y2axis-title 14px
.oj-dvt-tooltip 14px
.oj-timeline-major-axis-label 14px
.oj-treemap-attribute-type-text 14px
.oj-treemap-attribute-value-text 14px
.oj-treemap-current-text 14px
.oj-sunburst-attribute-type-text 14px
.oj-sunburst-attribute-value-text 14px
.oj-sunburst-current-text 14px
.oj-diagram-link-label 14px
.oj-diagram-node-label 14px
.oj-gantt-row-label 14px
.oj-gantt-major-axis-label 14px

--ut-ojet-small-font-size

Selector Value Color
.oj-chart-data-label 12px
.oj-chart-footnote 12px
.oj-chart-stack-label 12px
.oj-chart-xaxis-tick-label, .oj-chart-yaxis-tick-label, .oj-chart-y2axis-tick-label 12px
.oj-dvt-datatip 12px
.oj-legend 12px
.oj-legend-section-title 12px
.oj-legend-title 12px
.oj-timeline-minor-axis-label 12px
.oj-treemap 12px
.oj-treemap-node 12px
.oj-treemap-node-header 12px
.oj-sunburst 12px
.oj-sunburst-node 12px
.oj-gantt-no-data-message 12px
.oj-gantt-task-label 12px
.oj-gantt-minor-axis-label 12px
.oj-gantt-tooltip-label 12px

--ut-ojet-medium-font-size

Selector Value Color
.oj-chart-subtitle 16px
.oj-chart-title 16px

--ck-color-base-text

Selector Value Color
body var(--ut-body-text-color)

--ck-color-text

Selector Value Color
body var(--ck-color-base-text)

--ck-color-toolbar-border

Selector Value Color
body var(--a-toolbar-border-color)

--ck-color-toolbar-background

Selector Value Color
body var(--a-toolbar-background-color)

--ck-color-button-save

Selector Value Color
body var(--a-palette-success)

--ck-color-button-cancel

Selector Value Color
body var(--a-palette-danger)

--ck-color-base-focus

Selector Value Color
body var(--a-field-input-focus-border-color)

--ck-color-panel-background

Selector Value Color
body var(--a-toolbar-background-color)

--ck-color-panel-border

Selector Value Color
body var(--a-toolbar-border-color)

--ck-color-labeled-field-label-background

Selector Value Color
body var(--a-toolbar-background-color)

--ck-color-button-default-background

Selector Value Color
body transparent

--ck-color-button-default-hover-background

Selector Value Color
body var(--a-button-hover-background-color)

--ck-color-button-default-active-background

Selector Value Color
body var(--a-button-active-background-color)

--ck-color-button-default-active-shadow

Selector Value Color
body var(--a-button-active-shadow)

--ck-color-button-default-disabled-background

Selector Value Color
body transparent

--ck-color-button-on-background

Selector Value Color
body var(--a-button-hover-background-color)

--ck-color-button-on-hover-background

Selector Value Color
body var(--a-button-hover-background-color)

--ck-color-button-on-active-background

Selector Value Color
body var(--a-button-active-background-color)

--ck-color-button-on-active-shadow

Selector Value Color
body var(--a-button-active-shadow)

--ck-color-button-on-disabled-background

Selector Value Color
body transparent

--ck-color-list-background

Selector Value Color
body var(--a-menu-background-color)

--ck-color-dropdown-panel-background

Selector Value Color
body var(--a-menu-background-color)

--ck-color-dropdown-panel-border

Selector Value Color
body var(--a-menu-border-color)

--ck-drop-shadow

Selector Value Color
body var(--a-menu-shadow)

--ck-color-list-button-hover-background

Selector Value Color
body var(--a-menu-focused-background-color)

--ck-color-list-button-on-background

Selector Value Color
body var(--a-menu-focused-background-color)

--ck-color-list-button-on-text

Selector Value Color
body var(--a-menu-focused-text-color)

--a-menu-border-width

Selector Value Color
body .ck.ck-dropdown__panel 1px

--ck-border-radius

Selector Value Color
body .ck.ck-dropdown__panel .ck-list 0

--fc3-toolbar-border-color

Selector Value Color
.apex-fullcalendar-3 .fc-toolbar rgba(0, 0, 0, 0.1)

--fc3-toolbar-background-color

Selector Value Color
.apex-fullcalendar-3 .fc-toolbar #fff

--fc3-toolbar-border-radius

Selector Value Color
.apex-fullcalendar-3 .fc-toolbar var(--ut-component-border-radius)) 0

--fc3-toolbar-title-text-color

Selector Value Color
.apex-fullcalendar-3 .fc-toolbar var(--ut-component-text-title-color)
.apex-fullcalendar-3 .fc-toolbar h2 var(--ut-component-text-title-color)

--a-button-border-color

Selector Value Color
.apex-fullcalendar-3.fc .ui-button transparent

--fc3-day-number-text-color

Selector Value Color
.apex-fullcalendar-3.fc .fc-basic-view td.fc-day-number, .apex-fullcalendar-3.fc .fc-day-number var(--ut-component-text-default-color)

--fc3-header-background-color

Selector Value Color
.apex-fullcalendar-3 .fc-day-header.ui-widget-header, .apex-fullcalendar-3 .fc-view .ui-widget-header var(--ut-component-toolbar-background-color)

--fc3-header-text-color

Selector Value Color
.apex-fullcalendar-3 .fc-day-header.ui-widget-header, .apex-fullcalendar-3 .fc-view .ui-widget-header var(--ut-component-text-default-color)

--fc3-header-border-color

Selector Value Color
.apex-fullcalendar-3 .fc-day-header.ui-widget-header, .apex-fullcalendar-3 .fc-view .ui-widget-header var(--ut-component-border-color)

--fc3-today-border-color

Selector Value Color
.apex-fullcalendar-3.fc td.fc-today, .apex-fullcalendar-3.fc .ui-widget-content var(--ut-component-border-color)

--fc3-today-text-color

Selector Value Color
.apex-fullcalendar-3.fc td.fc-today, .apex-fullcalendar-3.fc .ui-widget-content var(--ut-component-text-default-color)

--fc3-today-highlight-background-color

Selector Value Color
.apex-fullcalendar-3.fc .fc-today.ui-state-highlight var(--ut-component-toolbar-background-color)

--fc3-highlight-background-color

Selector Value Color
.apex-fullcalendar-3.fc .fc-highlight var(--ut-palette-primary-shade)

--fc-small-font-size

Selector Value Color
.apex-fullcalendar-5 0.85em

--fc-page-bg-color

Selector Value Color
.apex-fullcalendar-5 var(--ut-component-background-color)

--fc-neutral-bg-color

Selector Value Color
.apex-fullcalendar-5 rgba(208, 208, 208, 0.3)

--fc-neutral-text-color

Selector Value Color
.apex-fullcalendar-5 var(--u-color-29)

--fc-border-color

Selector Value Color
.apex-fullcalendar-5 var(--ut-component-border-color)

--fc-button-text-color

Selector Value Color
.apex-fullcalendar-5 var(--a-button-text-color)

--fc-button-bg-color

Selector Value Color
.apex-fullcalendar-5 var(--a-button-background-color)

--fc-button-border-color

Selector Value Color
.apex-fullcalendar-5 var(--a-button-border-color)

--fc-button-hover-bg-color

Selector Value Color
.apex-fullcalendar-5 var(--a-button-hover-background-color)

--fc-button-hover-border-color

Selector Value Color
.apex-fullcalendar-5 var(--a-button-hover-border-color)

--fc-button-active-bg-color

Selector Value Color
.apex-fullcalendar-5 var(--a-button-active-background-color)

--fc-button-active-border-color

Selector Value Color
.apex-fullcalendar-5 var(--a-button-active-border-color)

--fc-event-bg-color

Selector Value Color
.apex-fullcalendar-5 var(--ut-palette-primary)

--fc-event-border-color

Selector Value Color
.apex-fullcalendar-5 var(--ut-palette-primary)

--fc-event-text-color

Selector Value Color
.apex-fullcalendar-5 var(--ut-palette-primary-contrast)

--fc-event-selected-overlay-color

Selector Value Color
.apex-fullcalendar-5 rgba(0, 0, 0, 0.25)

--fc-event-resizer-thickness

Selector Value Color
.apex-fullcalendar-5 8px

--fc-event-resizer-dot-total-width

Selector Value Color
.apex-fullcalendar-5 8px

--fc-event-resizer-dot-border-width

Selector Value Color
.apex-fullcalendar-5 1px

--fc-non-business-color

Selector Value Color
.apex-fullcalendar-5 rgba(215, 215, 215, 0.3)

--fc-bg-event-color

Selector Value Color
.apex-fullcalendar-5 var(--u-color-20)

--fc-bg-event-opacity

Selector Value Color
.apex-fullcalendar-5 0.3

--fc-highlight-color

Selector Value Color
.apex-fullcalendar-5 rgba(188, 232, 241, 0.3)

--fc-today-bg-color

Selector Value Color
.apex-fullcalendar-5 rgba(255, 220, 40, 0.15)

--fc-now-indicator-color

Selector Value Color
.apex-fullcalendar-5 var(--ut-palette-danger)

--fc-daygrid-event-dot-width

Selector Value Color
.apex-fullcalendar-5 8px

--fc-list-event-dot-width

Selector Value Color
.apex-fullcalendar-5 10px

--fc-list-event-hover-bg-color

Selector Value Color
.apex-fullcalendar-5 var(--ut-component-highlight-background-color)

--fc5-toolbar-padding-y

Selector Value Color
.apex-fullcalendar-5 .fc-toolbar-chunk 12p