.slds-badge { color: var(--slds-c-badge-text-color,var(--sds-c-badge-text-color,var(--dxp-g-neutral-contrast,#181818))); border-color: var(--slds-c-badge-color-border,var(--sds-c-badge-color-border,var(--dxp-g-neutral-1,transparent))); background-color: var(--slds-c-badge-color-background,var(--sds-c-badge-color-background,var(--dxp-g-neutral,#f3f3f3))); } .slds-badge__icon { color: var(--slds-c-badge-icon-color-foreground,var(--sds-c-badge-icon-color-foreground,var(--dxp-g-neutral-contrast,#747474))); } .slds-badge__icon.slds-badge__icon_inverse { --slds-c-badge-icon-color-foreground: var(--slds-c-badge-icon-inverse-color-foreground, var(--dxp-g-neutral-contrast-3, currentColor)); } .slds-button__icon { fill: var(--slds-c-icon-color-foreground,var(--dxp-g-neutral-3,currentColor)); } .slds-icon { fill: var(--slds-c-icon-color-foreground,var(--sds-c-icon-color-foreground,var(--dxp-g-neutral-3,#fff))); } .slds-icon-text-default { --slds-c-icon-color-foreground: var(--slds-c-icon-color-foreground-default, var(--sds-c-icon-color-foreground-default, var(--dxp-g-neutral-3, #747474))); } .slds-accordion__list-item { border-top-color: var(--slds-c-accordion-color-border,var(--sds-c-accordion-color-border,var(--dxp-g-neutral-1,#e5e5e5))); } .slds-accordion__summary { background-color: var(--slds-c-accordion-summary-color-background,var(--sds-c-accordion-summary-color-background,var(--dxp-g-root,transparent))); } .slds-accordion__summary-heading { color: var(--slds-c-accordion-heading-text-color,var(--sds-c-accordion-heading-text-color,var(--dxp-g-root-contrast,#181818))); } .slds-card { background: var(--slds-c-card-color-background,var(--sds-c-card-color-background,var(--dxp-g-root,#fff))); border-color: var(--slds-c-card-color-border,var(--sds-c-card-color-border,var(--dxp-g-neutral-1,#c9c9c9))); color: var(--slds-c-card-text-color,var(--dxp-g-root-contrast,--sds-c-card-text-color)); } .slds-card__footer { border-top-color: var(--slds-c-card-footer-color-border,var(--sds-c-card-footer-color-border,var(--dxp-g-neutral-1,#c9c9c9))); } .slds-card-wrapper { background: var(--slds-c-card-color-background,var(--sds-c-card-color-background,var(--dxp-g-root,#fff))); border-color: var(--slds-c-card-color-border,var(--sds-c-card-color-border,var(--dxp-g-neutral-1,#c9c9c9))); } .slds-card .slds-card_boundary, .slds-modal .slds-card_boundary, .slds-tabs--default .slds-card_boundary, .slds-tabs_default .slds-card_boundary { border-color: var(--slds-c-card-color-border,var(--sds-c-card-color-border,var(--dxp-g-neutral-1,#c9c9c9))); } .slds-tabs_card, .slds-tabs_card.slds-tabs_card { background: var(--slds-c-card-color-background,var(--sds-c-card-color-background,var(--dxp-g-root,#fff))); border-color: var(--slds-c-card-color-border,var(--sds-c-card-color-border,var(--dxp-g-neutral-1,#c9c9c9))); } .slds-card-wrapper .slds-card_boundary, .slds-tabs_card .slds-card_boundary, .slds-tabs_card.slds-tabs_card .slds-card_boundary { border-color: var(--slds-c-card-color-border,var(--sds-c-card-color-border,var(--dxp-g-neutral-1,#c9c9c9))); } .slds-input { background-color: var(--slds-c-input-color-background,var(--sds-c-input-color-background,var(--dxp-g-root,#fff))); } .slds-input:active, .slds-input:focus { --slds-c-input-background-color: var(--slds-c-input-color-background-focus, var(--sds-c-input-color-background-focus, var(--dxp-g-root, white))); --slds-c-input-shadow: var(--slds-c-input-shadow-focus, 0 0 3px var(--dxp-g-brand-1, --sds-c-input-shadow-focus)); } .slds-input_faux { background-color: var(--slds-c-input-color-background,var(--sds-c-input-color-background,var(--dxp-g-root,#fff))); } .slds-textarea { background-color: var(--slds-c-textarea-color-background,var(--sds-c-textarea-color-background,var(--dxp-g-root,#fff))); } .slds-textarea:active, .slds-textarea:focus { background-color: var(--slds-c-textarea-color-background-focus,var(--sds-c-textarea-color-background-focus,var(--dxp-g-root,#fff))); -webkit-box-shadow: var(--slds-c-textarea-shadow-focus,0 0 3px var(--dxp-g-brand-1,--sds-c-textarea-shadow-focus)); box-shadow: var(--slds-c-textarea-shadow-focus,0 0 3px var(--dxp-g-brand-1,--sds-c-textarea-shadow-focus)); } .slds-radio [type=radio]:checked + .slds-radio--faux:after, .slds-radio [type=radio]:checked + .slds-radio__label .slds-radio--faux:after, .slds-radio [type=radio]:checked + .slds-radio__label .slds-radio_faux:after, .slds-radio [type=radio]:checked + .slds-radio_faux:after, .slds-radio [type=radio]:checked ~ .slds-radio--faux:after, .slds-radio [type=radio]:checked ~ .slds-radio_faux:after { background-color: var(--slds-c-radio-mark-color-foreground,var(--sds-c-radio-mark-color-foreground,var(--dxp-g-brand,#0176d3))); } .slds-radio [type=radio]:focus + .slds-radio--faux, .slds-radio [type=radio]:focus + .slds-radio__label .slds-radio--faux, .slds-radio [type=radio]:focus + .slds-radio__label .slds-radio_faux, .slds-radio [type=radio]:focus + .slds-radio_faux, .slds-radio [type=radio]:focus ~ .slds-radio--faux, .slds-radio [type=radio]:focus ~ .slds-radio_faux { -webkit-box-shadow: var(--slds-c-radio-shadow-focus,0 0 3px var(--dxp-g-brand-1,--sds-c-radio-shadow-focus)); box-shadow: var(--slds-c-radio-shadow-focus,0 0 3px var(--dxp-g-brand-1,--sds-c-radio-shadow-focus)); } .slds-checkbox [type=checkbox]:checked + .slds-checkbox--faux:after, .slds-checkbox [type=checkbox]:checked + .slds-checkbox__label .slds-checkbox--faux:after, .slds-checkbox [type=checkbox]:checked + .slds-checkbox__label .slds-checkbox_faux:after, .slds-checkbox [type=checkbox]:checked + .slds-checkbox_faux:after, .slds-checkbox [type=checkbox]:checked ~ .slds-checkbox--faux:after, .slds-checkbox [type=checkbox]:checked ~ .slds-checkbox_faux:after { border-bottom-color: var(--slds-c-checkbox-mark-color-foreground,var(--sds-c-checkbox-mark-color-foreground,var(--dxp-g-brand,#0176d3))); border-left-color: var(--slds-c-checkbox-mark-color-foreground,var(--sds-c-checkbox-mark-color-foreground,var(--dxp-g-brand,#0176d3))); } .slds-checkbox [type=checkbox]:focus + .slds-checkbox--faux, .slds-checkbox [type=checkbox]:focus + .slds-checkbox__label .slds-checkbox--faux, .slds-checkbox [type=checkbox]:focus + .slds-checkbox__label .slds-checkbox_faux, .slds-checkbox [type=checkbox]:focus + .slds-checkbox_faux, .slds-checkbox [type=checkbox]:focus ~ .slds-checkbox--faux, .slds-checkbox [type=checkbox]:focus ~ .slds-checkbox_faux { --slds-c-checkbox-shadow: var(--slds-c-checkbox-shadow-focus, 0 0 3px var(--dxp-g-brand-1, --sds-c-checkbox-shadow-focus)); } .slds-checkbox [type=checkbox]:indeterminate + .slds-checkbox--faux:after, .slds-checkbox [type=checkbox]:indeterminate + .slds-checkbox__label .slds-checkbox--faux:after, .slds-checkbox [type=checkbox]:indeterminate + .slds-checkbox__label .slds-checkbox_faux:after, .slds-checkbox [type=checkbox]:indeterminate + .slds-checkbox_faux:after, .slds-checkbox [type=checkbox]:indeterminate ~ .slds-checkbox--faux:after, .slds-checkbox [type=checkbox]:indeterminate ~ .slds-checkbox_faux:after { background: var(--slds-c-checkbox-mark-color-foreground,var(--sds-c-checkbox-mark-color-foreground,var(--dxp-g-brand,#0176d3))); } .slds-checkbox--toggle .slds-checkbox--faux, .slds-checkbox--toggle .slds-checkbox_faux, .slds-checkbox_toggle .slds-checkbox--faux, .slds-checkbox_toggle .slds-checkbox_faux { border-color: var(--slds-c-checkbox-toggle-color-border,var(--sds-c-checkbox-toggle-color-border,var(--dxp-g-neutral-1,#aeaeae))); background-color: var(--slds-c-checkbox-toggle-color-background,var(--sds-c-checkbox-toggle-color-background,var(--dxp-g-neutral-1,#aeaeae))); } .slds-checkbox--toggle .slds-checkbox--faux:focus, .slds-checkbox--toggle .slds-checkbox--faux:hover, .slds-checkbox--toggle .slds-checkbox_faux:focus, .slds-checkbox--toggle .slds-checkbox_faux:hover, .slds-checkbox_toggle .slds-checkbox--faux:focus, .slds-checkbox_toggle .slds-checkbox--faux:hover, .slds-checkbox_toggle .slds-checkbox_faux:focus, .slds-checkbox_toggle .slds-checkbox_faux:hover { --slds-c-checkbox-toggle-color-background: var(--slds-c-checkbox-toggle-color-background-hover, var(--sds-c-checkbox-toggle-color-background-hover, var(--dxp-g-neutral-2, #939393))); --slds-c-checkbox-toggle-color-border: var(--dxp-g-neutral-2, --slds-c-checkbox-toggle-color-border-hover); } .slds-checkbox--toggle .slds-checkbox--faux:after, .slds-checkbox--toggle .slds-checkbox_faux:after, .slds-checkbox_toggle .slds-checkbox--faux:after, .slds-checkbox_toggle .slds-checkbox_faux:after { background-color: var(--slds-c-checkbox-toggle-switch-color-background,var(--sds-c-checkbox-toggle-switch-color-background,var(--dxp-g-neutral-contrast-3,#fff))); } .slds-checkbox--toggle [type=checkbox]:checked + .slds-checkbox--faux:before, .slds-checkbox--toggle [type=checkbox]:checked + .slds-checkbox--faux_container .slds-checkbox--faux:before, .slds-checkbox--toggle [type=checkbox]:checked + .slds-checkbox_faux:before, .slds-checkbox--toggle [type=checkbox]:checked + .slds-checkbox_faux_container .slds-checkbox_faux:before, .slds-checkbox--toggle [type=checkbox]:checked ~ .slds-checkbox--faux:before, .slds-checkbox--toggle [type=checkbox]:checked ~ .slds-checkbox_faux:before, .slds-checkbox_toggle [type=checkbox]:checked + .slds-checkbox--faux:before, .slds-checkbox_toggle [type=checkbox]:checked + .slds-checkbox--faux_container .slds-checkbox--faux:before, .slds-checkbox_toggle [type=checkbox]:checked + .slds-checkbox_faux:before, .slds-checkbox_toggle [type=checkbox]:checked + .slds-checkbox_faux_container .slds-checkbox_faux:before, .slds-checkbox_toggle [type=checkbox]:checked ~ .slds-checkbox--faux:before, .slds-checkbox_toggle [type=checkbox]:checked ~ .slds-checkbox_faux:before { background-color: var(--slds-c-checkbox-toggle-switch-color-background-checked,var(--sds-c-checkbox-toggle-switch-color-background-checked,var(--slds-c-checkbox-toggle-switch-color-background,var(--sds-c-checkbox-toggle-switch-color-background,var(--dxp-g-brand-contrast,#fff))))); } .slds-checkbox--toggle [type=checkbox]:checked + .slds-checkbox--faux:after, .slds-checkbox--toggle [type=checkbox]:checked + .slds-checkbox--faux_container .slds-checkbox--faux:after, .slds-checkbox--toggle [type=checkbox]:checked + .slds-checkbox_faux:after, .slds-checkbox--toggle [type=checkbox]:checked + .slds-checkbox_faux_container .slds-checkbox_faux:after, .slds-checkbox--toggle [type=checkbox]:checked ~ .slds-checkbox--faux:after, .slds-checkbox--toggle [type=checkbox]:checked ~ .slds-checkbox_faux:after, .slds-checkbox_toggle [type=checkbox]:checked + .slds-checkbox--faux:after, .slds-checkbox_toggle [type=checkbox]:checked + .slds-checkbox--faux_container .slds-checkbox--faux:after, .slds-checkbox_toggle [type=checkbox]:checked + .slds-checkbox_faux:after, .slds-checkbox_toggle [type=checkbox]:checked + .slds-checkbox_faux_container .slds-checkbox_faux:after, .slds-checkbox_toggle [type=checkbox]:checked ~ .slds-checkbox--faux:after, .slds-checkbox_toggle [type=checkbox]:checked ~ .slds-checkbox_faux:after { border-bottom-color: var(--slds-c-checkbox-toggle-mark-color-foreground,var(--sds-c-checkbox-toggle-mark-color-foreground,var(--dxp-g-brand-contrast,#fff))); border-right-color: var(--slds-c-checkbox-toggle-mark-color-foreground,var(--sds-c-checkbox-toggle-mark-color-foreground,var(--dxp-g-brand-contrast,#fff))); } .slds-checkbox--toggle [type=checkbox]:checked:focus + .slds-checkbox--faux, .slds-checkbox--toggle [type=checkbox]:checked:focus + .slds-checkbox--faux_container .slds-checkbox--faux, .slds-checkbox--toggle [type=checkbox]:checked:focus + .slds-checkbox_faux, .slds-checkbox--toggle [type=checkbox]:checked:focus + .slds-checkbox_faux_container .slds-checkbox_faux, .slds-checkbox--toggle [type=checkbox]:checked:focus ~ .slds-checkbox--faux, .slds-checkbox--toggle [type=checkbox]:checked:focus ~ .slds-checkbox_faux, .slds-checkbox_toggle [type=checkbox]:checked:focus + .slds-checkbox--faux, .slds-checkbox_toggle [type=checkbox]:checked:focus + .slds-checkbox--faux_container .slds-checkbox--faux, .slds-checkbox_toggle [type=checkbox]:checked:focus + .slds-checkbox_faux, .slds-checkbox_toggle [type=checkbox]:checked:focus + .slds-checkbox_faux_container .slds-checkbox_faux, .slds-checkbox_toggle [type=checkbox]:checked:focus ~ .slds-checkbox--faux, .slds-checkbox_toggle [type=checkbox]:checked:focus ~ .slds-checkbox_faux { --slds-c-checkbox-toggle-color-background: var(--slds-c-checkbox-toggle-color-background-checked-focus, var(--sds-c-checkbox-toggle-color-background-checked-focus, var(--dxp-g-brand-1, #014486))); } .slds-select { border-color: var(--slds-c-select-color-border,var(--sds-c-select-color-border,var({exclude},#c9c9c9))); background-color: var(--slds-c-select-color-background,var(--sds-c-select-color-background,var({exclude},#fff))); color: var(--slds-c-select-text-color,var({exclude},--sds-c-select-text-color)); } .slds-select:active, .slds-select:focus { border-color: var(--slds-c-select-color-border-focus,var(--sds-c-select-color-border-focus,var({exclude},#1b96ff))); background-color: var(--slds-c-select-color-background-focus,var(--sds-c-select-color-background-focus,var({exclude},#fff))); color: var(--slds-c-select-text-color-focus,var({exclude},--sds-c-select-text-color-focus)); -webkit-box-shadow: var(--slds-c-select-shadow-focus,0 0 3px var(--dxp-g-brand-1,--sds-c-select-shadow-focus)); box-shadow: var(--slds-c-select-shadow-focus,0 0 3px var(--dxp-g-brand-1,--sds-c-select-shadow-focus)); } .slds-slider__range::-webkit-slider-thumb { background-color: var(--slds-c-slider-thumb-color-foreground,var(--sds-c-slider-thumb-color-foreground,var(--dxp-g-brand,#0176d3))); } .slds-slider__range::-webkit-slider-thumb:hover { background-color: var(--slds-c-slider-thumb-color-foreground-hover,var(--sds-c-slider-thumb-color-foreground-hover,var(--dxp-g-brand-1,#014486))); } .slds-slider__range::-webkit-slider-runnable-track { background-color: var(--slds-c-slider-track-color-background,var(--sds-c-slider-track-color-background,var(--dxp-g-neutral,#f3f3f3))); } .slds-slider__range::-moz-range-thumb { background-color: var(--slds-c-slider-thumb-color-foreground,var(--sds-c-slider-thumb-color-foreground,var(--dxp-g-brand,#0176d3))); } .slds-slider__range::-moz-range-thumb:hover { background-color: var(--slds-c-slider-thumb-color-foreground-hover,var(--sds-c-slider-thumb-color-foreground-hover,var(--dxp-g-brand-1,#014486))); } .slds-slider__range::-moz-range-track { background-color: var(--slds-c-slider-track-color-background,var(--sds-c-slider-track-color-background,var(--dxp-g-neutral,#f3f3f3))); } .slds-slider__range::-ms-track { background-color: var(--slds-c-slider-track-color-background,var(--sds-c-slider-track-color-background,var(--dxp-g-neutral,#f3f3f3))); } .slds-slider__range::-ms-thumb { background-color: var(--slds-c-slider-thumb-color-foreground,var(--sds-c-slider-thumb-color-foreground,var(--dxp-g-brand,#0176d3))); } .slds-slider__range::-ms-thumb:hover { background-color: var(--slds-c-slider-thumb-color-foreground-hover,var(--sds-c-slider-thumb-color-foreground-hover,var(--dxp-g-brand-1,#014486))); } .slds-slider__range:focus::-webkit-slider-thumb { background-color: var(--slds-c-slider-thumb-color-foreground-focus,var(--sds-c-slider-thumb-color-foreground-focus,var(--dxp-g-brand-1,#014486))); -webkit-box-shadow: var(--slds-c-slider-thumb-shadow-focus,0 0 3px var(--dxp-g-brand-1,--sds-c-slider-thumb-shadow-focus)); box-shadow: var(--slds-c-slider-thumb-shadow-focus,0 0 3px var(--dxp-g-brand-1,--sds-c-slider-thumb-shadow-focus)); } .slds-slider__range:active::-webkit-slider-thumb { background-color: var(--slds-c-slider-thumb-color-foreground-active,var(--sds-c-slider-thumb-color-foreground-active,var(--dxp-g-brand-1,#014486))); } .slds-slider__range:focus::-moz-range-thumb { background-color: var(--slds-c-slider-thumb-color-foreground-focus,var(--sds-c-slider-thumb-color-foreground-focus,var(--dxp-g-brand-1,#014486))); box-shadow: var(--slds-c-slider-thumb-shadow-focus,0 0 3px var(--dxp-g-brand-1,--sds-c-slider-thumb-shadow-focus)); } .slds-slider__range:active::-moz-range-thumb { background-color: var(--slds-c-slider-thumb-color-foreground-active,var(--sds-c-slider-thumb-color-foreground-active,var(--dxp-g-brand-1,#014486))); } .slds-popover--tooltip, .slds-popover_tooltip { background-color: var(--slds-c-tooltip-color-background,var(--sds-c-tooltip-color-background,var(--dxp-g-info,#032d60))); } .slds-popover--tooltip .slds-popover__body, .slds-popover_tooltip .slds-popover__body { color: var(--slds-c-tooltip-text-color,var(--sds-c-tooltip-text-color,var(--dxp-g-info-contrast,#fff))); } .slds-modal__header { border-bottom-color: var(--slds-c-modal-color-border,var(--sds-c-modal-color-border,var(--dxp-g-neutral-1,#e5e5e5))); background-color: var(--slds-c-modal-header-color-background,var(--sds-c-modal-header-color-background,var(--slds-c-modal-color-background,var(--sds-c-modal-color-background,var(--dxp-g-root,#fff))))); color: var(--slds-c-modal-header-text-color,var(--sds-c-modal-header-text-color,var(--dxp-g-root-contrast,--sds-c-modal-text-color))); } .slds-modal__content { background-color: var(--slds-c-modal-content-color-background,var(--sds-c-modal-content-color-background,var(--slds-c-modal-color-background,var(--sds-c-modal-color-background,var(--dxp-g-root,#fff))))); color: var(--slds-c-modal-content-text-color,var(--sds-c-modal-content-text-color,var(--slds-c-modal-text-color,var(--dxp-g-root-contrast,--sds-c-modal-text-color)))); } .slds-modal__footer { border-top-color: var(--slds-c-modal-color-border,var(--sds-c-modal-color-border,var(--dxp-g-neutral-1,#e5e5e5))); background-color: var(--slds-c-modal-footer-color-background,var(--sds-c-modal-footer-color-background,var(--slds-c-modal-color-background,var(--sds-c-modal-color-background,var(--dxp-g-root,#f3f3f3))))); color: var(--slds-c-modal-footer-text-color,var(--sds-c-modal-footer-text-color,var(--slds-c-modal-text-color,var(--dxp-g-root-contrast,--sds-c-modal-text-color)))); } .slds-pill { border-color: var(--slds-c-pill-color-border,var(--sds-c-pill-color-border,var(--dxp-g-neutral-1,#e5e5e5))); background-color: var(--slds-c-pill-color-background,var(--sds-c-pill-color-background,var(--dxp-g-root,#fff))); -webkit-box-shadow: var(undefined,0 0 3px var(--dxp-g-brand)); box-shadow: var(undefined,0 0 3px var(--dxp-g-brand)); } .slds-pill_container { border-color: var(--slds-c-pill-color-border,var(--sds-c-pill-color-border,var(--dxp-g-neutral-1,#e5e5e5))); background-color: var(--slds-c-pill-container-color-background,var(--sds-c-pill-container-color-background,var(--dxp-g-root,#fff))); } .slds-pill__label:focus { -webkit-box-shadow: var(--slds-c-pill-label-shadow-focus,0 0 3px var(--dxp-g-brand-1,--sds-c-pill-label-shadow-focus)); box-shadow: var(--slds-c-pill-label-shadow-focus,0 0 3px var(--dxp-g-brand-1,--sds-c-pill-label-shadow-focus)); } .slds-pill__action { border-color: var(--slds-c-pill-color-border,var(--sds-c-pill-color-border,var(--dxp-g-neutral-1,#e5e5e5))); } .slds-pill__action:focus { -webkit-box-shadow: var(--slds-c-pill-action-shadow,0 0 3px var(--dxp-g-brand,--sds-c-pill-action-shadow)); box-shadow: var(--slds-c-pill-action-shadow,0 0 3px var(--dxp-g-brand,--sds-c-pill-action-shadow)); } .slds-has-error:active { border-color: var(--slds-c-pill-error-color-border-active,var(--sds-c-pill-error-color-border-active,var(--dxp-g-destructive-1,#ea001e))); } .slds-has-error .slds-pill__label { color: var(--slds-c-pill-error-text-color,var(--sds-c-pill-error-text-color,var(--dxp-g-destructive,#ea001e))); } .slds-tabs--default__nav, .slds-tabs_default__nav { border-bottom-color: var(--slds-c-tabs-list-color-border,var(--sds-c-tabs-list-color-border,var(--dxp-g-brand,#e5e5e5))); } .slds-tabs--default__item, .slds-tabs_default__item { color: var(--slds-c-tabs-item-text-color,var(--sds-c-tabs-item-text-color,var(--dxp-g-root-contrast,#444))); } .slds-tabs--default__item.slds-active, .slds-tabs--default__item.slds-is-active, .slds-tabs_default__item.slds-active, .slds-tabs_default__item.slds-is-active { --slds-c-tabs-item-text-color: var(--slds-c-tabs-item-text-color-active, var(--sds-c-tabs-item-text-color-active, var(--dxp-g-root-contrast-1, #181818))); } .slds-tabs--default__item.slds-active:after, .slds-tabs--default__item.slds-is-active:after, .slds-tabs_default__item.slds-active:after, .slds-tabs_default__item.slds-is-active:after { background-color: var(--slds-c-tabs-item-color-border-active,var(--sds-c-tabs-item-color-border-active,var(--dxp-g-brand-1,#1b96ff))); } .slds-tabs--default__item:hover:after, .slds-tabs_default__item:hover:after { background-color: var(--slds-c-tabs-item-color-border-hover,var(--sds-c-tabs-item-color-border-hover,var(--dxp-g-brand-1,#0176d3))); } .slds-tabs--default__item.slds-has-focus:after, .slds-tabs--default__item:focus:after, .slds-tabs_default__item.slds-has-focus:after, .slds-tabs_default__item:focus:after { background-color: var(--slds-c-tabs-item-color-border-active,var(--sds-c-tabs-item-color-border-active,var(--dxp-g-brand-1,#1b96ff))); } .slds-tabs_default__overflow-button .slds-button { color: var(--slds-c-tabs-item-text-color,var(--sds-c-tabs-item-text-color,var(--dxp-g-root-contrast,#444))); } .slds-tabs--default .slds-has-overflow .slds-tabs__nav-scroller--inner, .slds-tabs--default .slds-has-overflow .slds-tabs__nav-scroller_inner, .slds-tabs--default .slds-tab__scroll-controls, .slds-tabs_default .slds-has-overflow .slds-tabs__nav-scroller--inner, .slds-tabs_default .slds-has-overflow .slds-tabs__nav-scroller_inner, .slds-tabs_default .slds-tab__scroll-controls { border-bottom-color: var(--slds-c-tabs-list-color-border,var(--sds-c-tabs-list-color-border,var(--dxp-g-brand,#e5e5e5))); } .slds-notify--alert, .slds-notify_alert { color: var(--slds-c-alert-text-color,var(--sds-c-alert-text-color,var(--dxp-g-neutral-contrast,#fff))); background-color: var(--slds-c-alert-color-background,var(--sds-c-alert-color-background,var(--dxp-g-neutral,#747474))); } .slds-notify--alert a:focus, .slds-notify_alert a:focus { border-color: var(--slds-c-alert-color-border,var(--dxp-g-neutral-1,#f3f3f3)); } .slds-notify--alert a:active, .slds-notify_alert a:active { color: var(--slds-c-alert-text-color-active,var(--sds-c-alert-text-color-active,var(--dxp-g-neutral-contrast-1,rgba(255,255,255,.5)))); } .slds-notify--toast, .slds-notify_toast { background-color: var(--slds-c-toast-color-background,var(--sds-c-toast-color-background,var(--dxp-g-neutral,#747474))); color: var(--slds-c-toast-text-color,var(--dxp-g-neutral-contrast,--sds-c-toast-text-color)); } :root { --dxp-c-monospace-font-family: consolas, menlo, monaco, courier, monospace; --dxp-c-title-line-height: 1.25; --dxp-c-title-caps-line-height: 1.25; --dxp-c-title-caps-font-weight: 400; --dxp-c-title-caps-letter-spacing: 0.0625rem; --dxp-c-title-caps-text-transform: uppercase; --dxp-c-button-neutral-transition: border 0.15s linear; --dxp-c-button-brand-transition: border 0.15s linear; --dxp-c-button-outline-brand-transition: border 0.15s linear; --dxp-c-button-destructive-transition: border 0.15s linear; --dxp-c-button-text-destructive-transition: border 0.15s linear; --dxp-c-button-success-transition: border 0.15s linear; --dxp-c-spinner-color-background: inherit; --dxp-c-link-transition: color 0.1s linear; --dxp-c-strong-text-weight: 700; --dxp-c-selection-text-shadow: none; --dxp-c-placeholder-font-weight: 400; --dxp-c-placeholder-opacity: 1; --dxp-c-html-line-height: 1.5; --dxp-c-hr-margin-block-start: 2rem; --dxp-c-hr-margin-block-end: 2rem; } .slds-button.slds-accordion__summary-action { color: var(--sds-c-accordion-heading-text-color,var(--dxp-g-root-contrast)); } .slds-notify { background-color: var(--dxp-g-neutral); color: var(--dxp-g-neutral-contrast); } .slds-notify a:link:not(.slds-button), .slds-notify a:not(.slds-button), .slds-notify a:visited:not(.slds-button) { color: var(--dxp-c-alert-link-text-color,var(--dxp-g-neutral-contrast)); text-decoration: underline; } .slds-notify a:hover:not(.slds-button) { color: var(--dxp-c-alert-link-text-color-hover,var(--dxp-g-neutral-contrast-1)); text-decoration: underline; } .slds-notify a:active:not(.slds-button) { color: var(--dxp-c-alert-link-text-color-active,var(--dxp-g-neutral-contrast-1)); text-decoration: underline; } .slds-notify a:focus:not(.slds-button) { color: var(--dxp-c-alert-link-text-color-focus,var(--dxp-g-neutral-contrast-1)); text-decoration: underline; } .slds-theme--success, .slds-theme_success { color: var(--dxp-g-success-contrast); background-color: var(--dxp-g-success); border-color: var(--dxp-g-success); } .slds-theme--warning, .slds-theme_warning { color: var(--dxp-g-warning-contrast); background-color: var(--dxp-g-warning); border-color: var(--dxp-g-warning); } .slds-theme--error, .slds-theme_error { color: var(--dxp-g-destructive-contrast); background-color: var(--dxp-g-destructive); border-color: var(--dxp-g-destructive); } .slds-theme--info, .slds-theme_info { color: var(--dxp-g-neutral-contrast); background-color: var(--dxp-g-neutral); border-color: var(--dxp-g-neutral); } .slds-theme--offline, .slds-theme_offline { color: var(--dxp-g-offline-contrast); background-color: var(--dxp-g-offline); border-color: var(--dxp-g-offline); } .slds-notify .slds-button--icon-border-inverse, .slds-notify .slds-button--icon-border-inverse:focus, .slds-notify .slds-button--icon-border-inverse:hover, .slds-notify .slds-button--icon-inverse, .slds-notify .slds-button--icon-inverse:focus, .slds-notify .slds-button--icon-inverse:hover, .slds-notify .slds-button_icon-border-inverse, .slds-notify .slds-button_icon-border-inverse:focus, .slds-notify .slds-button_icon-border-inverse:hover, .slds-notify .slds-button_icon-inverse, .slds-notify .slds-button_icon-inverse:focus, .slds-notify .slds-button_icon-inverse:hover { color: var(--dxp-c-link-text-color); } .slds-notify .slds-icon__container, .slds-notify .slds-icon_container { background-color: transparent; } .slds-notify .slds-button { background-color: transparent; border-color: transparent; } .slds-notify .slds-icon { fill: var(--dxp-g-neutral-contrast); } .slds-alert_warning { background-color: var(--dxp-g-warning); color: var(--dxp-g-warning-contrast); } .slds-alert_warning a:link:not(.slds-button), .slds-alert_warning a:not(.slds-button), .slds-alert_warning a:visited:not(.slds-button) { color: var(--dxp-c-alert-link-text-color-warning,var(--dxp-g-warning-contrast)); } .slds-alert_warning a:hover:not(.slds-button) { color: var(--dxp-c-alert-link-text-color-warning-hover,var(--dxp-g-warning-contrast-1)); } .slds-alert_warning a:active:not(.slds-button) { color: var(--dxp-c-alert-link-text-color-warning-active,var(--dxp-g-warning-contrast-1)); } .slds-alert_warning a:focus:not(.slds-button) { color: var(--dxp-c-alert-link-text-color-warning-focus,var(--dxp-g-warning-contrast-1)); } .slds-alert_warning .slds-button__icon, .slds-alert_warning .slds-icon { fill: var(--dxp-g-warning-contrast); } .slds-alert_error { background-color: var(--dxp-g-destructive); color: var(--dxp-g-destructive-contrast); } .slds-alert_error a:link:not(.slds-button), .slds-alert_error a:not(.slds-button), .slds-alert_error a:visited:not(.slds-button) { color: var(--dxp-c-alert-link-text-color-error,var(--dxp-g-destructive-contrast)); } .slds-alert_error a:hover:not(.slds-button) { color: var(--dxp-c-alert-link-text-color-error-hover,var(--dxp-g-destructive-contrast-1)); } .slds-alert_error a:active:not(.slds-button) { color: var(--dxp-c-alert-link-text-color-error-active,var(--dxp-g-destructive-contrast-1)); } .slds-alert_error a:focus:not(.slds-button) { color: var(--dxp-c-alert-link-text-color-error-focus,var(--dxp-g-destructive-contrast-1)); } .slds-alert_error .slds-button__icon, .slds-alert_error .slds-icon { fill: var(--dxp-g-destructive-contrast); } .slds-alert_offline { background-color: var(--dxp-g-offline); color: var(--dxp-g-offline-contrast); } .slds-alert_offline a:link:not(.slds-button), .slds-alert_offline a:not(.slds-button), .slds-alert_offline a:visited:not(.slds-button) { color: var(--dxp-c-alert-link-text-color-offline,var(--dxp-g-offline-contrast)); } .slds-alert_offline a:hover:not(.slds-button) { color: var(--dxp-c-alert-link-text-color-offline-hover,var(--dxp-g-offline-contrast-1)); } .slds-alert_offline a:active:not(.slds-button) { color: var(--dxp-c-alert-link-text-color-offline-active,var(--dxp-g-offline-contrast-1)); } .slds-alert_offline a:focus:not(.slds-button) { color: var(--dxp-c-alert-link-text-color-offline-focus,var(--dxp-g-offline-contrast-1)); } .slds-alert_offline .slds-button__icon, .slds-alert_offline .slds-icon { fill: var(--dxp-g-offline-contrast); } .slds-theme--warning a:link:not(.slds-button), .slds-theme--warning a:visited:not(.slds-button), .slds-theme_warning a:link:not(.slds-button), .slds-theme_warning a:visited:not(.slds-button) { color: var(--dxp-g-warning-contrast); } .slds-theme--warning a:focus, .slds-theme_warning a:focus { box-shadow: 0 0 3px var(--dxp-g-neutral); border: 1px solid var(--dxp-g-neutral); } .slds-theme--error a:not(.slds-button--neutral), .slds-theme_error a:not(.slds-button--neutral) { color: var(--dxp-g-destructive-contrast); text-decoration: underline; } .slds-theme--success a:not(.slds-button--neutral), .slds-theme_success a:not(.slds-button--neutral) { color: var(--dxp-g-success-contrast); text-decoration: underline; } .slds-theme--info a:not(.slds-button--neutral), .slds-theme_info a:not(.slds-button--neutral) { color: var(--dxp-g-neutral-contrast); text-decoration: underline; } .slds-theme--error a:not(.slds-button--neutral):link, .slds-theme--error a:not(.slds-button--neutral):visited, .slds-theme_error a:not(.slds-button--neutral):link, .slds-theme_error a:not(.slds-button--neutral):visited { color: var(--dxp-g-destructive-contrast); text-decoration: underline; } .slds-theme--success a:not(.slds-button--neutral):link, .slds-theme--success a:not(.slds-button--neutral):visited, .slds-theme_success a:not(.slds-button--neutral):link, .slds-theme_success a:not(.slds-button--neutral):visited { color: var(--dxp-g-success-contrast); text-decoration: underline; } .slds-theme--info a:not(.slds-button--neutral):link, .slds-theme--info a:not(.slds-button--neutral):visited, .slds-theme_info a:not(.slds-button--neutral):link, .slds-theme_info a:not(.slds-button--neutral):visited { color: var(--dxp-g-neutral-contrast); text-decoration: underline; } .slds-notify a:focus, .slds-notify_toast a:focus { box-shadow: 0 0 3px var(--dxp-g-neutral-contrast); border: 1px solid var(--dxp-g-neutral-contrast); } .slds-theme--success.slds-notify .slds-icon, .slds-theme_success.slds-notify .slds-icon { fill: var(--dxp-g-success-contrast); } .slds-notify.slds-theme_success a:focus { box-shadow: 0 0 3px var(--dxp-g-success-contrast); border: 1px solid var(--dxp-g-success-contrast); } .slds-notify.slds-alert_warning a:focus, .slds-notify.slds-theme_warning a:focus { box-shadow: 0 0 3px var(--dxp-g-warning-contrast); border: 1px solid var(--dxp-g-warning-contrast); } .slds-theme--warning .slds-button__icon, .slds-theme--warning .slds-icon, .slds-theme--warning.slds-notify .slds-icon, .slds-theme_warning .slds-button__icon, .slds-theme_warning .slds-icon, .slds-theme_warning.slds-notify .slds-icon { fill: var(--dxp-g-warning-contrast); } .slds-notify.slds-alert_error a:focus, .slds-notify.slds-theme_error a:focus { box-shadow: 0 0 3px var(--dxp-g-destructive-contrast); border: 1px solid var(--dxp-g-destructive-contrast); } .slds-theme--error.slds-notify .slds-icon, .slds-theme_error.slds-notify .slds-icon { fill: var(--dxp-g-destructive-contrast); } .slds-notify.slds-alert_offline a:focus { box-shadow: 0 0 3px var(--dxp-g-offline-contrast); border: 1px solid var(--dxp-g-offline-contrast); } .slds-notify .slds-text-heading_small { font-size: var(--dxp-s-body-font-size); font-style: var(--dxp-s-body-font-style); font-family: var(--dxp-s-body-font-family,var(--dxp-g-heading-font-family)); font-weight: var(--dxp-s-body-font-weight); text-decoration: var(--dxp-s-body-text-decoration); text-transform: var(--dxp-s-body-text-transform); line-height: var(--dxp-s-body-line-height); letter-spacing: var(--dxp-s-body-letter-spacing); text-shadow: var(--dxp-s-body-text-shadow); color: inherit; } a, a:link:not(.slds-button,.slds-dropdown__item>a), a:visited:not(.slds-button,.slds-dropdown__item>a) { color: var(--dxp-c-link-text-color,var(--dxp-s-link-text-color,var(--dxp-g-brand))); background-color: var(--dxp-c-link-color-background); text-decoration: var(--dxp-c-link-text-decoration,var(--dxp-s-link-text-decoration,underline)); text-shadow: var(--dxp-c-link-text-shadow); transition: var(--dxp-c-link-transition); } a:hover:not(.slds-button,.slds-dropdown__item>a) { color: var(--dxp-c-link-text-color-hover,var(--dxp-s-link-text-color-hover,var(--dxp-g-brand-1))); background-color: var(--dxp-c-link-color-background-hover); text-decoration: var(--dxp-s-link-text-decoration-hover); text-shadow: var(--dxp-c-link-text-shadow-hover); } a:active:not(.slds-button,.slds-dropdown__item>a) { color: var(--dxp-c-link-text-color-active,var(--dxp-s-link-text-color-hover,var(--dxp-g-brand-1))); background-color: var(--dxp-c-link-color-background-active); text-decoration: var(--dxp-s-link-text-decoration-hover); text-shadow: var(--dxp-c-link-text-shadow-active); } a:focus:not(.slds-button,.slds-dropdown__item>a) { color: var(--dxp-c-link-text-color-focus,var(--dxp-s-link-text-color-hover,var(--dxp-g-brand-1))); background-color: var(--dxp-c-link-color-background-focus); text-decoration: var(--dxp-s-link-text-decoration-focus); text-shadow: var(--dxp-c-link-text-shadow-focus); outline-color: var(--dxp-c-link-color-outline-focus); } .slds-avatar .slds-icon_container svg { fill: var(--sds-c-avatar-color-foreground,var(--dxp-g-brand-contrast)); background-color: var(--sds-c-avatar-color-background,var(--dxp-g-brand)); } .slds-avatar .slds-avatar__initials, .slds-avatar .slds-avatar__initials_inverse { background-color: var(--sds-c-avatar-initials-color-background,var(--dxp-g-brand)); color: var(--sds-c-avatar-initials-text-color,var(--dxp-g-brand-contrast)); } .slds-avatar__initials, .slds-avatar__initials:hover { text-shadow: none; } .slds-badge .slds-icon__container, .slds-badge .slds-icon_container { background-color: transparent; } .slds-badge.slds-theme_success, .slds-badge.slds-theme_success .slds-badge__icon { color: var(--sds-c-badge-icon-color-foreground,var(--sds-c-badge-icon-color-foreground-success,var(--dxp-g-success-contrast))); } .slds-badge.slds-theme_warning, .slds-badge.slds-theme_warning .slds-badge__icon { color: var(--sds-c-badge-icon-color-foreground,var(--sds-c-badge-icon-color-foreground-warning,var(--dxp-g-warning-contrast))); } .slds-badge.slds-theme_error, .slds-badge.slds-theme_error .slds-badge__icon { color: var(--sds-c-badge-icon-color-foreground,var(--sds-c-badge-icon-color-foreground-error,var(--dxp-g-destructive-contrast))); } .slds-badge.slds-badge_lightest { color: var(--dxp-g-root-contrast); } .slds-badge { font-size: var(--dxp-s-body-small-font-size,var(--sds-c-badge-font-size,.75rem)); font-style: var(--dxp-s-body-small-font-style); font-family: var(--dxp-s-body-small-font-family); font-weight: var(--dxp-s-body-small-font-weight); text-decoration: var(--dxp-s-body-small-text-decoration); text-transform: var(--dxp-s-body-small-text-transform); line-height: var(--dxp-s-body-small-line-height,var(--sds-c-badge-line-height,normal)); letter-spacing: var(--dxp-s-body-small-letter-spacing); text-shadow: var(--dxp-s-body-small-text-shadow); } .slds-badge .slds-icon--xx-small, .slds-badge .slds-icon_xx-small { width: calc(1.125 * var(--dxp-s-body-small-font-size,var(--sds-c-badge-font-size,.75rem))); height: calc(1.125 * var(--dxp-s-body-small-font-size,var(--sds-c-badge-font-size,.75rem))); } .slds-badge_inverse { --slds-c-badge-color-background: var(--slds-c-badge-inverse-color-background, var(--sds-c-badge-inverse-color-background, var(--dxp-g-neutral-3, #747474))); --slds-c-badge-text-color: var(--slds-c-badge-inverse-text-color, var(--sds-c-badge-inverse-text-color, var(--dxp-g-neutral-contrast-3, white))); background-color: var(--slds-c-badge-inverse-color-background,var(--sds-c-badge-inverse-color-background,var(--dxp-g-neutral-3))); color: var(--slds-c-badge-inverse-text-color,var(--sds-c-badge-inverse-text-color,var(--dxp-g-neutral-contrast-3))); border-color: var(--slds-c-badge-color-border,var(--sds-c-badge-color-border,var(--dxp-g-neutral-3))); } .slds-badge_lightest { --slds-c-badge-color-background: var(--slds-c-badge-lightest-color-background, var(--sds-c-badge-lightest-color-background, var(--dxp-g-root, white))); --slds-c-badge-color-border: var(--slds-c-badge-lightest-color-border, var(--sds-c-badge-lightest-color-border, var(--dxp-g-root-contrast, #e5e5e5))); background-color: var(--slds-c-badge-lightest-color-background,var(--sds-c-badge-lightest-color-background,var(--dxp-g-root))); color: var(--slds-c-badge-text-color,var(--sds-c-badge-text-color,var(--dxp-g-root-contrast))); border-color: var(--slds-c-badge-lightest-color-border,var(--sds-c-badge-lightest-color-border,var(--dxp-g-root-contrast))); } html { font-family: var(--dxp-c-html-font-family,var(--dxp-g-root-font-family)); font-size: var(--dxp-s-html-font-size,16px); line-height: var(--dxp-c-html-line-height); background: var(--dxp-g-root); color: var(--dxp-g-root-contrast); } @media (max-width: 48em) { html { font-size: var(--dxp-s-html-font-size-mobile,var(--dxp-s-html-font-size,16px)); } } body { font-family: var(--dxp-s-body-font-family); font-size: var(--dxp-s-body-font-size,var(--dxp-g-font-size-3)); font-style: var(--dxp-s-body-font-style); font-weight: var(--dxp-s-body-font-weight); text-decoration: var(--dxp-s-body-text-decoration); text-transform: var(--dxp-s-body-text-transform); line-height: var(--dxp-s-body-line-height); letter-spacing: var(--dxp-s-body-letter-spacing); background: var(--dxp-g-root); } hr { margin-top: var(--dxp-c-hr-margin-block-start); margin-bottom: var(--dxp-c-hr-margin-block-end); border-color: var(--dxp-c-hr-color-border,var(--dxp-g-neutral-1)); } .slds-button { color: var(--sds-c-button-text-color,var(--dxp-s-button-color,var(--dxp-g-default,#0176d3))); font-family: var(--dxp-s-button-font-family); font-size: var(--dxp-s-button-font-size); font-style: var(--dxp-s-button-font-style); font-weight: var(--dxp-s-button-font-weight); text-decoration: var(--dxp-s-button-text-decoration-active); text-transform: var(--dxp-s-button-text-transform); line-height: var(--dxp-s-button-line-height); letter-spacing: var(--dxp-s-button-letter-spacing); border-radius: var(--sds-c-button-radius-border,var(--dxp-s-button-radius-border,.25em)); --sds-c-button-brand-spacing-inline-start: var(--dxp-s-button-padding, 1em); --sds-c-button-brand-spacing-inline-end: var(--dxp-s-button-padding, 1em); --sds-c-button-outline-brand-spacing-inline-start: var(--dxp-s-button-padding, 1em); --sds-c-button-outline-brand-spacing-inline-end: var(--dxp-s-button-padding, 1em); --sds-c-button-destructive-spacing-inline-start: var(--dxp-s-button-padding, 1em); --sds-c-button-destructive-spacing-inline-end: var(--dxp-s-button-padding, 1em); --sds-c-button-text-destructive-spacing-inline-start: var(--dxp-s-button-padding, 1em); --sds-c-button-text-destructive-spacing-inline-end: var(--dxp-s-button-padding, 1em); --sds-c-button-success-spacing-inline-start: var(--dxp-s-button-padding, 1em); --sds-c-button-success-spacing-inline-end: var(--dxp-s-button-padding, 1em); } .slds-button:focus, .slds-button:hover { color: var(--sds-c-button-text-color-hover,var(--dxp-s-button-color-hover,var(--dxp-g-brand-1,#014486))); } .slds-button:focus { box-shadow: var(--sds-c-button-shadow-focus,0 0 3px var(--dxp-s-button-color-focus,var(--dxp-g-brand-1,#0176d3))); } .slds-button:active { color: var(--sds-c-button-text-color-active,var(--dxp-s-button-color-active,var(--dxp-g-brand-1,#014486))); } a.slds-button:focus { box-shadow: var(--sds-c-button-shadow-focus,0 0 3px var(--dxp-s-button-color-focus,var(--dxp-g-brand-1,#0176d3))); } a.slds-button--inverse:focus, a.slds-button_inverse:focus { box-shadow: var(--sds-c-button-inverse-shadow-focus,0 0 3px var(--dxp-s-button-color-focus,var(--dxp-g-brand-1,#c9c9c9))); border-color: var(--sds-c-button-inverse-color-border-focus,var(--dxp-g-neutral-2,#c9c9c9)); } .slds-button--neutral, .slds-button_neutral { background-color: var(--sds-c-button-neutral-color-background,var(--dxp-g-root,#fff)); border-color: var(--sds-c-button-neutral-color-border,var(--dxp-g-neutral-1,#aeaeae)); transition: var(--dxp-c-button-neutral-transition); } .slds-button--neutral:focus, .slds-button--neutral:hover, .slds-button_neutral:focus, .slds-button_neutral:hover { background-color: var(--sds-c-button-neutral-color-background-hover,var(--dxp-g-root-1,#f3f3f3)); border-color: var(--sds-c-button-neutral-color-border-hover,var(--dxp-g-neutral-2,#aeaeae)); } .slds-button--neutral:active, .slds-button_neutral:active { background-color: var(--sds-c-button-neutral-color-background-active,var(--dxp-g-root-1,#e5e5e5)); border-color: var(--sds-c-button-neutral-color-border-active,var(--dxp-g-neutral-2,#aeaeae)); } .slds-button--brand, .slds-button_brand { background-color: var(--sds-c-button-brand-color-background,var(--dxp-s-button-color,var(--dxp-g-brand,#0176d3))); border-color: var(--sds-c-button-brand-color-border,var(--dxp-s-button-color,var(--dxp-g-brand,#0176d3))); color: var(--sds-c-button-brand-text-color,var(--dxp-s-button-color-contrast,var(--dxp-g-brand-contrast,#fff))); transition: var(--dxp-c-button-brand-transition); } .slds-button--brand:focus, .slds-button--brand:hover, .slds-button_brand:focus, .slds-button_brand:hover { background-color: var(--sds-c-button-brand-color-background-hover,var(--dxp-s-button-color-hover,var(--dxp-g-brand-1,#014486))); border-color: var(--sds-c-button-brand-color-border-hover,var(--dxp-s-button-color-hover,var(--dxp-g-brand-1,#014486))); color: var(--sds-c-button-brand-text-color-hover,var(--dxp-s-button-color-hover-contrast,var(--dxp-g-brand-contrast-1,#fff))); } .slds-button--brand:active, .slds-button_brand:active { background-color: var(--sds-c-button-brand-color-background-active,var(--dxp-s-button-color-active,var(--dxp-g-brand-1,#014486))); border-color: var(--sds-c-button-brand-color-border-active,var(--dxp-s-button-color-active,var(--dxp-g-brand-1,#014486))); color: var(--sds-c-button-brand-text-color-active,var(--dxp-s-button-color-active-contrast,var(--dxp-g-brand-contrast-1,#fff))); } .slds-button_outline-brand { background-color: var(--sds-c-button-outline-brand-color-background,var(--dxp-g-root,#fff)); border-color: var(--sds-c-button-outline-brand-color-border,var(--dxp-s-button-color,var(--dxp-g-brand,#0176d3))); transition: var(--dxp-c-button-outline-brand-transition); } .slds-button_outline-brand:focus, .slds-button_outline-brand:hover { background-color: var(--sds-c-button-outline-brand-color-background-hover,var(--dxp-g-root-1,#f3f3f3)); border-color: var(--sds-c-button-outline-brand-color-border-hover,var(--dxp-s-button-color-hover,var(--dxp-g-brand-1,#0176d3))); } .slds-button_outline-brand:active { background-color: var(--sds-c-button-outline-brand-color-background-active,var(--dxp-g-root-1,#e5e5e5)); border-color: var(--sds-c-button-outline-brand-color-border-active,var(--dxp-s-button-color-active,var(--dxp-g-brand-1,#0176d3))); } .slds-button--inverse, .slds-button_inverse { background-color: var(--sds-c-button-inverse-color-background,var(--dxp-g-root-contrast,rgba(0,0,0,0))); border-color: var(--sds-c-button-inverse-color-border,var(--dxp-g-neutral-1,#aeaeae)); } .slds-button--inverse:focus, .slds-button--inverse:hover, .slds-button_inverse:focus, .slds-button_inverse:hover { background-color: var(--sds-c-button-inverse-color-background-hover,var(--dxp-g-root-contrast-1,#f3f3f3)); border-color: var(--sds-c-button-inverse-color-border-hover,var(--dxp-g-neutral-2,#aeaeae)); } .slds-button--inverse:active, .slds-button_inverse:active { background-color: var(--sds-c-button-inverse-color-background-active,var(--dxp-g-root-contrast-1,#f3f3f3)); border-color: var(--sds-c-button-inverse-color-border-active,var(--dxp-g-neutral-2,#aeaeae)); } .slds-button--icon-border-inverse, .slds-button--icon-border-inverse:link, .slds-button--icon-border-inverse:visited, .slds-button--inverse, .slds-button--inverse:link, .slds-button--inverse:visited, .slds-button_icon-border-inverse, .slds-button_icon-border-inverse:link, .slds-button_icon-border-inverse:visited, .slds-button_inverse, .slds-button_inverse:link, .slds-button_inverse:visited { color: var(--sds-c-button-inverse-text-color,var(--dxp-g-root,#c9c9c9)); } .slds-button--icon-border-inverse:active, .slds-button--icon-border-inverse:focus, .slds-button--icon-border-inverse:hover, .slds-button--inverse:active, .slds-button--inverse:focus, .slds-button--inverse:hover, .slds-button_icon-border-inverse:active, .slds-button_icon-border-inverse:focus, .slds-button_icon-border-inverse:hover, .slds-button_inverse:active, .slds-button_inverse:focus, .slds-button_inverse:hover { color: var(--sds-c-button-inverse-text-color-active,var(--dxp-g-root-1,#0176d3)); } .slds-button--icon-border-inverse:focus, .slds-button--inverse:focus, .slds-button_icon-border-inverse:focus, .slds-button_inverse:focus { box-shadow: var(--sds-c-button-inverse-shadow-focus,0 0 3px var(--dxp-s-button-color-focus,var(--dxp-g-brand-1,#c9c9c9))); box-shadow: var(--sds-c-button-inverse-shadow-focus,0 0 3px var(--dxp-g-root-1,#c9c9c9)); } .slds-button--destructive, .slds-button_destructive { background-color: var(--sds-c-button-destructive-color-background,var(--dxp-g-destructive,#ba0517)); border-color: var(--sds-c-button-destructive-color-border,var(--dxp-g-destructive,#ba0517)); color: var(--sds-c-button-destructive-text-color,var(--dxp-g-destructive-contrast,#fff)); transition: var(--dxp-c-button-destructive-transition); } .slds-button--destructive:focus, .slds-button--destructive:hover, .slds-button_destructive:focus, .slds-button_destructive:hover { background-color: var(--sds-c-button-destructive-color-background-hover,var(--dxp-g-destructive-1,#ba0517)); border-color: var(--sds-c-button-destructive-color-border-hover,var(--dxp-g-destructive-1,#ba0517)); color: var(--sds-c-button-destructive-text-color-hover,var(--dxp-g-destructive-contrast-1,#fff)); } .slds-button--destructive:active, .slds-button_destructive:active { background-color: var(--sds-c-button-destructive-color-background-active,var(--dxp-g-destructive-1,#8e030f)); border-color: var(--sds-c-button-destructive-color-border-active,var(--dxp-g-destructive-1,#8e030f)); color: var(--sds-c-button-destructive-text-color-active,var(--dxp-g-destructive-contrast-1,#fff)); } .slds-button_text-destructive { background-color: var(--sds-c-button-text-destructive-color-background,var(--dxp-g-root,#fff)); border-color: var(--sds-c-button-text-destructive-color-border,var(--dxp-g-neutral-1,#aeaeae)); color: var(--sds-c-button-text-destructive-text-color,var(--dxp-g-destructive,#ea001e)); transition: var(--dxp-c-button-text-destructive-transition); } .slds-button_text-destructive:focus, .slds-button_text-destructive:hover { background-color: var(--sds-c-button-text-destructive-color-background-hover,var(--dxp-g-root-1,#f3f3f3)); border-color: var(--sds-c-button-text-destructive-color-border-hover,var(--dxp-g-neutral-2,#aeaeae)); color: var(--sds-c-button-text-destructive-text-color-hover,var(--dxp-g-destructive-1,#ba0517)); } .slds-button_text-destructive:active { background-color: var(--sds-c-button-text-destructive-color-background-active,var(--dxp-g-root-1,#e5e5e5)); border-color: var(--sds-c-button-text-destructive-color-border-active,var(--dxp-g-neutral-2,#aeaeae)); color: var(--sds-c-button-text-destructive-text-color-active,var(--dxp-g-destructive-1,#ba0517)); } .slds-button--success, .slds-button_success { background-color: var(--sds-c-button-success-color-background,var(--dxp-g-success,#45c65a)); border-color: var(--sds-c-button-success-color-border,var(--dxp-g-success,#91db8b)); color: var(--sds-c-button-success-text-color,var(--dxp-g-success-contrast,#181818)); transition: var(--dxp-c-button-success-transition); } .slds-button--success:focus, .slds-button--success:hover, .slds-button_success:focus, .slds-button_success:hover { background-color: var(--sds-c-button-success-color-background-hover,var(--dxp-g-success-1,#2e844a)); border-color: var(--sds-c-button-success-color-border-hover,var(--dxp-g-success-1,#2e844a)); color: var(--sds-c-button-success-text-color-hover,var(--dxp-g-success-contrast-1,#fff)); } .slds-button--success:active, .slds-button_success:active { background-color: var(--sds-c-button-success-color-background-active,var(--dxp-g-success-1,#2e844a)); border-color: var(--sds-c-button-success-color-border-active,var(--dxp-g-success-1,#2e844a)); color: var(--sds-c-button-success-text-color-active,var(--dxp-g-success-contrast-1,#fff)); } .slds-button--neutral.slds-is-selected:focus:not([disabled]), .slds-button--neutral.slds-is-selected:hover:not([disabled]), .slds-button_neutral.slds-is-selected:focus:not([disabled]), .slds-button_neutral.slds-is-selected:hover:not([disabled]) { background-color: var(--sds-c-button-neutral-color-background,var(--dxp-g-root,#f3f3f3)); border-color: var(--sds-c-button-neutral-color-border-hover,var(--dxp-g-neutral-2,#aeaeae)); } .slds-button--neutral.slds-is-selected:active:not([disabled]), .slds-button_neutral.slds-is-selected:active:not([disabled]) { background-color: var(--sds-c-button-neutral-color-background-active,var(--dxp-g-root-1,#e5e5e5)); } .slds-button_dual-stateful.slds-is-pressed { background-color: var(--sds-c-button-brand-color-background,var(--dxp-s-button-color,var(--dxp-g-brand,#0176d3))); border-color: var(--sds-c-button-brand-color-border,var(--dxp-s-button-color,var(--dxp-g-brand,#0176d3))); color: var(--sds-c-button-brand-text-color,var(--dxp-s-button-color-contrast,var(--dxp-g-brand-contrast,#fff))); } .slds-button_dual-stateful.slds-is-pressed:focus, .slds-button_dual-stateful.slds-is-pressed:hover { background-color: var(--sds-c-button-brand-color-background-hover,var(--dxp-s-button-color-hover,var(--dxp-g-brand-1,#014486))); border-color: var(--sds-c-button-brand-color-border-hover,var(--dxp-s-button-color-hover,var(--dxp-g-brand-1,#014486))); color: var(--sds-c-button-brand-text-color-hover,var(--dxp-s-button-color-hover-contrast,var(--dxp-g-brand-contrast-1,#fff))); } .slds-button:focus { color: var(--sds-c-button-text-color-hover,var(--dxp-s-button-color-focus,var(--dxp-g-brand-1,#014486))); } .slds-button--brand:focus, .slds-button_brand:focus { background-color: var(--sds-c-button-brand-color-background-hover,var(--dxp-s-button-color-focus,var(--dxp-g-brand-1,#014486))); border-color: var(--sds-c-button-brand-color-border-hover,var(--dxp-s-button-color-focus,var(--dxp-g-brand-1,#014486))); color: var(--sds-c-button-text-color-hover,var(--dxp-s-button-color-focus-contrast,var(--dxp-g-brand-contrast-1,#014486))); } .slds-button_outline-brand:focus { border-color: var(--sds-c-button-outline-brand-color-border-hover,var(--dxp-s-button-color-focus,var(--dxp-g-brand-1,#0176d3))); } .slds-button--destructive:focus, .slds-button_destructive:focus { color: var(--sds-c-button-destructive-text-color-hover,var(--dxp-g-destructive-contrast-1,#fff)); } .slds-button_text-destructive:focus { color: var(--sds-c-button-text-destructive-text-color-hover,var(--dxp-g-destructive-1,#ba0517)); } .slds-button--success:focus, .slds-button_success:focus { color: var(--sds-c-button-success-text-color-hover,var(--dxp-g-success-contrast-1,#fff)); } .dxp-button-small > .slds-button, .slds-button.dxp-button-small { --sds-c-button-neutral-spacing-inline-start: var(--dxp-s-button-small-padding, 1em); --sds-c-button-neutral-spacing-inline-end: var(--dxp-s-button-small-padding,1em); --sds-c-button-brand-spacing-inline-start: var(--dxp-s-button-small-padding, 1em); --sds-c-button-brand-spacing-inline-end: var(--dxp-s-button-small-padding, 1em); --sds-c-button-outline-brand-spacing-inline-start: var(--dxp-s-button-small-padding, 1em); --sds-c-button-outline-brand-spacing-inline-end: var(--dxp-s-button-small-padding, 1em); --sds-c-button-destructive-spacing-inline-start: var(--dxp-s-button-small-padding, 1em); --sds-c-button-destructive-spacing-inline-end: var(--dxp-s-button-small-padding, 1em); --sds-c-button-text-destructive-spacing-inline-start: var(--dxp-s-button-small-padding, 1em); --sds-c-button-text-destructive-spacing-inline-end: var(--dxp-s-button-small-padding, 1em); --sds-c-button-success-spacing-inline-start: var(--dxp-s-button-small-padding, 1em); --sds-c-button-success-spacing-inline-end: var(--dxp-s-button-small-padding, 1em); border-radius: var(--sds-c-button-radius-border,var(--dxp-s-button-small-radius-border,.25em)); font-size: var(--dxp-s-button-small-font-size); } .dxp-button-small .slds-button__icon { width: calc(.875 * var(--dxp-s-button-small-font-size,var(--dxp-g-font-size-3))); height: calc(.875 * var(--dxp-s-button-small-font-size,var(--dxp-g-font-size-3))); } .dxp-button-small .slds-button__icon--x-small, .dxp-button-small .slds-button__icon_x-small { width: calc(.5 * var(--dxp-s-button-small-font-size,var(--dxp-g-font-size-3))); height: calc(.5 * var(--dxp-s-button-small-font-size,var(--dxp-g-font-size-3))); } .dxp-button-small .slds-button__icon--small, .dxp-button-small .slds-button__icon_small { width: calc(.75 * var(--dxp-s-button-small-font-size,var(--dxp-g-font-size-3))); height: calc(.75 * var(--dxp-s-button-small-font-size,var(--dxp-g-font-size-3))); } .dxp-button-small .slds-button__icon--large, .dxp-button-small .slds-button__icon_large { width: calc(1.5 * var(--dxp-s-button-small-font-size,var(--dxp-g-font-size-3))); height: calc(1.5 * var(--dxp-s-button-small-font-size,var(--dxp-g-font-size-3))); } .dxp-button-large > .slds-button, .slds-button.dxp-button-large { --sds-c-button-neutral-spacing-inline-start: var(--dxp-s-button-large-padding, 1em); --sds-c-button-neutral-spacing-inline-end: var(--dxp-s-button-large-padding,1em); --sds-c-button-brand-spacing-inline-start: var(--dxp-s-button-large-padding, 1em); --sds-c-button-brand-spacing-inline-end: var(--dxp-s-button-large-padding, 1em); --sds-c-button-outline-brand-spacing-inline-start: var(--dxp-s-button-large-padding, 1em); --sds-c-button-outline-brand-spacing-inline-end: var(--dxp-s-button-large-padding, 1em); --sds-c-button-destructive-spacing-inline-start: var(--dxp-s-button-large-padding, 1em); --sds-c-button-destructive-spacing-inline-end: var(--dxp-s-button-large-padding, 1em); --sds-c-button-text-destructive-spacing-inline-start: var(--dxp-s-button-large-padding, 1em); --sds-c-button-text-destructive-spacing-inline-end: var(--dxp-s-button-large-padding, 1em); --sds-c-button-success-spacing-inline-start: var(--dxp-s-button-large-padding, 1em); --sds-c-button-success-spacing-inline-end: var(--dxp-s-button-large-padding, 1em); border-radius: var(--sds-c-button-radius-border,var(--dxp-s-button-large-radius-border,.25em)); font-size: var(--dxp-s-button-large-font-size); } .dxp-button-large .slds-button__icon { width: calc(.875 * var(--dxp-s-button-large-font-size,var(--dxp-g-font-size-3))); height: calc(.875 * var(--dxp-s-button-large-font-size,var(--dxp-g-font-size-3))); } .dxp-button-large .slds-button__icon--x-small, .dxp-button-large .slds-button__icon_x-small { width: calc(.5 * var(--dxp-s-button-large-font-size,var(--dxp-g-font-size-3))); height: calc(.5 * var(--dxp-s-button-large-font-size,var(--dxp-g-font-size-3))); } .dxp-button-large .slds-button__icon--small, .dxp-button-large .slds-button__icon_small { width: calc(.75 * var(--dxp-s-button-large-font-size,var(--dxp-g-font-size-3))); height: calc(.75 * var(--dxp-s-button-large-font-size,var(--dxp-g-font-size-3))); } .dxp-button-large .slds-button__icon--large, .dxp-button-large .slds-button__icon_large { width: calc(1.5 * var(--dxp-s-button-large-font-size,var(--dxp-g-font-size-3))); height: calc(1.5 * var(--dxp-s-button-large-font-size,var(--dxp-g-font-size-3))); } .slds-button_inverse:active, .slds-button_inverse:focus, .slds-button_inverse:hover { background-color: var(--dxp-g-root); color: var(--dxp-s-button-color-hover,var(--dxp-g-brand-1)); } .slds-button:hover { text-decoration: var(--dxp-s-button-text-decoration-hover); } .slds-button--neutral, .slds-button_neutral { transition: var(--dxp-c-button-neutral-transition); } .slds-button--brand, .slds-button_brand { transition: var(--dxp-c-button-brand-transition); } .slds-button_outline-brand { transition: var(--dxp-c-button-outline-brand-transition); } .slds-button--destructive, .slds-button_destructive { transition: var(--dxp-c-button-destructive-transition); } .slds-button_text-destructive { transition: var(--dxp-c-button-text-destructive-transition); } .slds-button--success, .slds-button_success { transition: var(--dxp-c-button-success-transition); } .slds-button:disabled, .slds-button[disabled] { background-color: transparent; border-color: transparent; color: var(--dxp-g-neutral-1); cursor: default; } .slds-button--icon-border-filled:disabled, .slds-button--icon-border-filled[disabled], .slds-button--neutral:disabled, .slds-button--neutral[disabled], .slds-button_icon-border-filled:disabled, .slds-button_icon-border-filled[disabled], .slds-button_neutral:disabled, .slds-button_neutral[disabled], .slds-button_outline-brand:disabled, .slds-button_outline-brand[disabled] { border-color: var(--dxp-g-neutral-1); } .slds-button--inverse:disabled, .slds-button--inverse[disabled], .slds-button_inverse:disabled, .slds-button_inverse[disabled] { background-color: rgba(0,0,0,0); border-color: rgba(255,255,255,.15); } .slds-button--icon-border-inverse:disabled, .slds-button--icon-border-inverse[disabled], .slds-button--inverse:disabled, .slds-button--inverse[disabled], .slds-button_icon-border-inverse:disabled, .slds-button_icon-border-inverse[disabled], .slds-button_inverse:disabled, .slds-button_inverse[disabled] { color: rgba(255,255,255,.5); } .slds-button_text-destructive:disabled, .slds-button_text-destructive[disabled] { border-color: var(--dxp-g-neutral-1); } .slds-button--brand:disabled, .slds-button--brand[disabled], .slds-button--destructive:disabled, .slds-button--destructive[disabled], .slds-button--success:disabled, .slds-button--success[disabled], .slds-button_brand:disabled, .slds-button_brand[disabled], .slds-button_destructive:disabled, .slds-button_destructive[disabled], .slds-button_success:disabled, .slds-button_success[disabled] { background-color: var(--dxp-g-neutral-1); border-color: var(--dxp-g-neutral-1); color: #fff; } .slds-button_icon-border-inverse { background-color: transparent; } .slds-button--icon-border-inverse, .slds-button--icon-inverse, .slds-button_icon-border-inverse, .slds-button_icon-inverse { color: var(--dxp-g-root); fill: var(--dxp-g-root); } .slds-button__icon { width: calc(.875 * var(--dxp-s-button-font-size,var(--dxp-g-font-size-3))); height: calc(.875 * var(--dxp-s-button-font-size,var(--dxp-g-font-size-3))); fill: var(--slds-c-icon-color-foreground,currentColor); width: calc(.875 * var(--dxp-s-button-font-size,var(--dxp-g-font-size-3))); height: calc(.875 * var(--dxp-s-button-font-size,var(--dxp-g-font-size-3))); } .slds-button__icon--x-small, .slds-button__icon_x-small { width: calc(.5 * var(--dxp-s-button-font-size,var(--dxp-g-font-size-3))); height: calc(.5 * var(--dxp-s-button-font-size,var(--dxp-g-font-size-3))); } .slds-button__icon--small, .slds-button__icon_small { width: calc(.75 * var(--dxp-s-button-font-size,var(--dxp-g-font-size-3))); height: calc(.75 * var(--dxp-s-button-font-size,var(--dxp-g-font-size-3))); } .slds-button__icon--large, .slds-button__icon_large { width: calc(1.5 * var(--dxp-s-button-font-size,var(--dxp-g-font-size-3))); height: calc(1.5 * var(--dxp-s-button-font-size,var(--dxp-g-font-size-3))); } .slds-button_icon { font-size: initial; line-height: initial; } .slds-button_icon-inverse.slds-button { background-color: transparent; border-color: transparent; } .slds-button-group .slds-button, .slds-button-group-list .slds-button { height: 100%; } .slds-button--icon-border, .slds-button--icon-border-filled, .slds-button_icon-border, .slds-button_icon-border-filled { color: var(--dxp-g-neutral-3); border-color: var(--dxp-g-neutral-1); background-color: transparent; } .slds-button--icon-border-inverse, .slds-button_icon-border-inverse { border-color: var(--dxp-g-neutral-1); } .slds-checkbox--toggle [type=checkbox] + .slds-checkbox--faux_container, .slds-checkbox--toggle [type=checkbox] + .slds-checkbox_faux_container, .slds-checkbox_toggle [type=checkbox] + .slds-checkbox--faux_container, .slds-checkbox_toggle [type=checkbox] + .slds-checkbox_faux_container { color: var(--dxp-g-root-contrast); } .slds-checkbox--toggle [type=checkbox][disabled] + .slds-checkbox--faux, .slds-checkbox--toggle [type=checkbox][disabled] + .slds-checkbox--faux_container .slds-checkbox--faux, .slds-checkbox--toggle [type=checkbox][disabled] + .slds-checkbox_faux, .slds-checkbox--toggle [type=checkbox][disabled] + .slds-checkbox_faux_container .slds-checkbox_faux, .slds-checkbox--toggle [type=checkbox][disabled] ~ .slds-checkbox--faux, .slds-checkbox--toggle [type=checkbox][disabled] ~ .slds-checkbox_faux, .slds-checkbox_toggle [type=checkbox][disabled] + .slds-checkbox--faux, .slds-checkbox_toggle [type=checkbox][disabled] + .slds-checkbox--faux_container .slds-checkbox--faux, .slds-checkbox_toggle [type=checkbox][disabled] + .slds-checkbox_faux, .slds-checkbox_toggle [type=checkbox][disabled] + .slds-checkbox_faux_container .slds-checkbox_faux, .slds-checkbox_toggle [type=checkbox][disabled] ~ .slds-checkbox--faux, .slds-checkbox_toggle [type=checkbox][disabled] ~ .slds-checkbox_faux { background-color: var(--dxp-g-neutral-3); border-color: var(--dxp-g-neutral-3); } .slds-checkbox--toggle [type=checkbox][disabled] + .slds-checkbox--faux:after, .slds-checkbox--toggle [type=checkbox][disabled] + .slds-checkbox--faux_container .slds-checkbox--faux:after, .slds-checkbox--toggle [type=checkbox][disabled] + .slds-checkbox_faux:after, .slds-checkbox--toggle [type=checkbox][disabled] + .slds-checkbox_faux_container .slds-checkbox_faux:after, .slds-checkbox--toggle [type=checkbox][disabled] ~ .slds-checkbox--faux:after, .slds-checkbox--toggle [type=checkbox][disabled] ~ .slds-checkbox_faux:after, .slds-checkbox_toggle [type=checkbox][disabled] + .slds-checkbox--faux:after, .slds-checkbox_toggle [type=checkbox][disabled] + .slds-checkbox--faux_container .slds-checkbox--faux:after, .slds-checkbox_toggle [type=checkbox][disabled] + .slds-checkbox_faux:after, .slds-checkbox_toggle [type=checkbox][disabled] + .slds-checkbox_faux_container .slds-checkbox_faux:after, .slds-checkbox_toggle [type=checkbox][disabled] ~ .slds-checkbox--faux:after, .slds-checkbox_toggle [type=checkbox][disabled] ~ .slds-checkbox_faux:after { background-color: var(--dxp-g-neutral-2); } .slds-checkbox { --checkbox-color-background: var(--sds-c-checkbox-color-background, var(--dxp-s-form-element-color-background, var(--dxp-g-root))); --checkbox-color-background-checked: var(--sds-c-checkbox-color-background-checked, var(--dxp-s-form-element-color-background-active, var(--dxp-s-form-element-color-background, var(--dxp-g-root)))); } .slds-checkbox .slds-checkbox__label .slds-form-element__label { font-size: var(--dxp-s-form-element-label-font-size,var(--dxp-s-body-font-size)); } .slds-checkbox [type=checkbox] + .slds-checkbox--faux, .slds-checkbox [type=checkbox] + .slds-checkbox__label .slds-checkbox--faux, .slds-checkbox [type=checkbox] + .slds-checkbox__label .slds-checkbox_faux, .slds-checkbox [type=checkbox] + .slds-checkbox_faux, .slds-checkbox [type=checkbox] ~ .slds-checkbox--faux, .slds-checkbox [type=checkbox] ~ .slds-checkbox_faux { background-color: var(--checkbox-color-background); border-color: var(--sds-c-checkbox-color-border,var(--dxp-s-form-element-color-border,var(--dxp-g-neutral-3))); border-radius: var(--sds-c-checkbox-radius-border,var(--dxp-s-form-element-radius-border,4px)); border-width: var(--dxp-c-checkbox-width-border,var(--dxp-s-form-element-width-border,1px)); border-style: solid; } .slds-checkbox [type=checkbox]:focus + .slds-checkbox--faux, .slds-checkbox [type=checkbox]:focus + .slds-checkbox__label .slds-checkbox--faux, .slds-checkbox [type=checkbox]:focus + .slds-checkbox__label .slds-checkbox_faux, .slds-checkbox [type=checkbox]:focus + .slds-checkbox_faux, .slds-checkbox [type=checkbox]:focus:checked + .slds-checkbox--faux, .slds-checkbox [type=checkbox]:focus:checked + .slds-checkbox__label .slds-checkbox--faux, .slds-checkbox [type=checkbox]:focus:checked + .slds-checkbox__label .slds-checkbox_faux, .slds-checkbox [type=checkbox]:focus:checked + .slds-checkbox_faux, .slds-checkbox [type=checkbox]:focus:checked ~ .slds-checkbox--faux, .slds-checkbox [type=checkbox]:focus:checked ~ .slds-checkbox_faux, .slds-checkbox [type=checkbox]:focus ~ .slds-checkbox--faux, .slds-checkbox [type=checkbox]:focus ~ .slds-checkbox_faux { border-color: var(--sds-c-checkbox-color-border-focus,var(--dxp-s-form-element-color-border-focus,var(--dxp-g-brand))); } .slds-checkbox [type=checkbox]:checked + .slds-checkbox--faux:after, .slds-checkbox [type=checkbox]:checked + .slds-checkbox__label .slds-checkbox--faux:after, .slds-checkbox [type=checkbox]:checked + .slds-checkbox__label .slds-checkbox_faux:after, .slds-checkbox [type=checkbox]:checked + .slds-checkbox_faux:after, .slds-checkbox [type=checkbox]:checked ~ .slds-checkbox--faux:after, .slds-checkbox [type=checkbox]:checked ~ .slds-checkbox_faux:after { border-color: var(--sds-c-checkbox-mark-color-foreground,var(--dxp-s-form-element-color-foreground,var(--dxp-g-brand-1))); } .slds-checkbox [type=checkbox]:checked + .slds-checkbox--faux, .slds-checkbox [type=checkbox]:checked + .slds-checkbox__label .slds-checkbox--faux, .slds-checkbox [type=checkbox]:checked + .slds-checkbox__label .slds-checkbox_faux, .slds-checkbox [type=checkbox]:checked + .slds-checkbox_faux, .slds-checkbox [type=checkbox]:checked ~ .slds-checkbox--faux, .slds-checkbox [type=checkbox]:checked ~ .slds-checkbox_faux { background-color: var(--checkbox-color-background-checked); border-color: var(--sds-c-checkbox-color-border-checked,var(--dxp-s-form-element-color-border-checked,var(--dxp-s-form-element-color-border,var(--dxp-g-neutral-3)))); } .slds-has-error .slds-checkbox [type=checkbox] + .slds-checkbox--faux, .slds-has-error .slds-checkbox [type=checkbox] + .slds-checkbox__label .slds-checkbox--faux, .slds-has-error .slds-checkbox [type=checkbox] + .slds-checkbox__label .slds-checkbox_faux, .slds-has-error .slds-checkbox [type=checkbox] + .slds-checkbox_faux, .slds-has-error .slds-checkbox [type=checkbox] ~ .slds-checkbox--faux, .slds-has-error .slds-checkbox [type=checkbox] ~ .slds-checkbox_faux { background-color: var(--checkbox-color-background); border-color: var(--dxp-g-destructive); } .slds-has-error .slds-checkbox [type=checkbox]:checked + .slds-checkbox--faux, .slds-has-error .slds-checkbox [type=checkbox]:checked + .slds-checkbox__label .slds-checkbox--faux, .slds-has-error .slds-checkbox [type=checkbox]:checked + .slds-checkbox__label .slds-checkbox_faux, .slds-has-error .slds-checkbox [type=checkbox]:checked + .slds-checkbox_faux, .slds-has-error .slds-checkbox [type=checkbox]:checked ~ .slds-checkbox--faux, .slds-has-error .slds-checkbox [type=checkbox]:checked ~ .slds-checkbox_faux { background-color: var(--checkbox-color-background-checked); border-color: var(--dxp-g-destructive); } .slds-has-error .slds-checkbox [type=checkbox]:checked + .slds-checkbox--faux:after, .slds-has-error .slds-checkbox [type=checkbox]:checked + .slds-checkbox__label .slds-checkbox--faux:after, .slds-has-error .slds-checkbox [type=checkbox]:checked + .slds-checkbox__label .slds-checkbox_faux:after, .slds-has-error .slds-checkbox [type=checkbox]:checked + .slds-checkbox_faux:after, .slds-has-error .slds-checkbox [type=checkbox]:checked ~ .slds-checkbox--faux:after, .slds-has-error .slds-checkbox [type=checkbox]:checked ~ .slds-checkbox_faux:after { border-color: var(--dxp-g-destructive); } .slds-dropdown { background-color: var(--dxp-g-root); color: var(--dxp-g-root-contrast); border-color: var(--dxp-g-neutral); } .slds-dropdown__item > a:focus, .slds-dropdown__item > a:hover { background-color: var(--dxp-g-neutral); color: var(--dxp-s-dropdown-text-color-hover,var(--dxp-g-neutral-contrast)); background-color: var(--dxp-s-dropdown-color-background-hover,var(--dxp-g-neutral)); } @font-face { font-family: "Salesforce Sans"; src: url(../fonts/webfonts/SalesforceSans-Light.woff2?orgId=00D10000000KEF8) format("woff2"), url(../fonts/webfonts/SalesforceSans-Light.woff?orgId=00D10000000KEF8) format("woff"); font-weight: 300; font-display: swap; } @font-face { font-family: "Salesforce Sans"; src: url(../fonts/webfonts/SalesforceSans-LightItalic.woff2?orgId=00D10000000KEF8) format("woff2"), url(../fonts/webfonts/SalesforceSans-LightItalic.woff?orgId=00D10000000KEF8) format("woff"); font-style: italic; font-weight: 300; font-display: swap; } @font-face { font-family: "Salesforce Sans"; src: url(../fonts/webfonts/SalesforceSans-Regular.woff2?orgId=00D10000000KEF8) format("woff2"), url(../fonts/webfonts/SalesforceSans-Regular.woff?orgId=00D10000000KEF8) format("woff"); font-weight: 400; font-display: swap; } @font-face { font-family: "Salesforce Sans"; src: url(../fonts/webfonts/SalesforceSans-Italic.woff2?orgId=00D10000000KEF8) format("woff2"), url(../fonts/webfonts/SalesforceSans-Italic.woff?orgId=00D10000000KEF8) format("woff"); font-style: italic; font-weight: 400; font-display: swap; } @font-face { font-family: "Salesforce Sans"; src: url(../fonts/webfonts/SalesforceSans-Bold.woff2?orgId=00D10000000KEF8) format("woff2"), url(../fonts/webfonts/SalesforceSans-Bold.woff?orgId=00D10000000KEF8) format("woff"); font-weight: 700; font-display: swap; } @font-face { font-family: "Salesforce Sans"; src: url(../fonts/webfonts/SalesforceSans-BoldItalic.woff2?orgId=00D10000000KEF8) format("woff2"), url(../fonts/webfonts/SalesforceSans-BoldItalic.woff?orgId=00D10000000KEF8) format("woff"); font-style: italic; font-weight: 700; font-display: swap; } .slds-has-error .slds-form-element__help, .slds-required { color: var(--dxp-g-destructive); } .slds-form-element { margin-bottom: var(--dxp-g-spacing-medium); } .slds-form-element__label { color: var(--dxp-s-form-element-label-color,var(--dxp-g-root-contrast)); font-size: var(--dxp-s-form-element-label-font-size,var(--dxp-s-body-font-size)); padding-top: 0; } .slds-form-element__legend { margin-bottom: var(--dxp-g-spacing-medium); } .slds-form-element__help, .slds-form-element__helper { font-size: var(--dxp-s-body-small-font-size); } ::-webkit-input-placeholder { color: var(--dxp-c-placeholder-text-color,var(--dxp-g-neutral-3)); font-weight: var(--dxp-c-placeholder-font-weight); opacity: var(--dxp-c-placeholder-opacity); } ::-moz-placeholder { color: var(--dxp-c-placeholder-text-color,var(--dxp-g-neutral-3)); font-weight: var(--dxp-c-placeholder-font-weight); opacity: var(--dxp-c-placeholder-opacity); } ::placeholder { color: var(--dxp-c-placeholder-text-color,var(--dxp-g-neutral-3)); font-weight: var(--dxp-c-placeholder-font-weight); opacity: var(--dxp-c-placeholder-opacity); } [class*=slds-icon-action-] .slds-icon, [class*=slds-icon-action-].slds-icon, [class*=slds-icon-custom-] .slds-icon, [class*=slds-icon-custom-].slds-icon, [class*=slds-icon-standard-] .slds-icon, [class*=slds-icon-standard-].slds-icon { fill: #fff; } .slds-input { --input-color-background: var(--sds-c-input-color-background, var(--dxp-s-form-element-color-background, var(--dxp-g-root))); --input-color-background-focus: var(--sds-c-input-color-background-focus, var(--dxp-s-form-element-color-background-active, var(--dxp-s-form-element-color-background, var(--dxp-g-root)))); background-color: var(--input-color-background); font-size: var(--dxp-c-input-text-font-size,var(--dxp-s-form-element-text-font-size,var(--dxp-s-body-font-size))); color: var(--sds-c-input-text-color,var(--dxp-s-form-element-text-color,var(--dxp-g-root-contrast))); --border-color: var(--sds-c-input-color-border, var(--dxp-s-form-element-color-border, var(--dxp-g-neutral-3))); --border-width: var(--dxp-c-input-width-border, var(--dxp-s-form-element-width-border, 1px)); border-color: var(--border-color); border-width: var(--border-width); border-style: solid; border-inline-start: var(--dxp-c-input-border-inline-start,var(--dxp-s-form-element-border-inline-start,var(--border-width) solid var(--border-color))); border-inline-end: var(--dxp-c-input-border-inline-end,var(--dxp-s-form-element-border-inline-end,var(--border-width) solid var(--border-color))); border-block-start: var(--dxp-c-input-border-block-start,var(--dxp-s-form-element-border-block-start,var(--border-width) solid var(--border-color))); border-block-end: var(--dxp-c-input-border-block-end,var(--dxp-s-form-element-border-block-end,var(--border-width) solid var(--border-color))); border-radius: var(--sds-c-input-radius-border,var(--dxp-s-form-element-radius-border,4px)); } .slds-input:focus { background-color: var(--input-color-background-focus); color: var(--sds-c-input-text-color-focus,var(--dxp-s-form-element-text-color-focus,var(--dxp-s-form-element-text-color,var(--dxp-g-root-contrast)))); border-color: var(--sds-c-input-color-border-focus,var(--dxp-s-form-element-color-border-focus,var(--dxp-g-brand))); } .slds-input.slds-is-disabled, .slds-input[disabled] { background-color: var(--dxp-c-input-color-background-disabled,var(--dxp-g-neutral)); border-color: var(--dxp-c-input-color-border-disabled,var(--dxp-g-neutral-1)); } .slds-input.slds-is-disabled::placeholder, .slds-input[disabled]::placeholder { color: var(--dxp-c-input-text-color-disabled,var(--dxp-g-neutral-contrast)); } .slds-input.slds-is-disabled::-webkit-input-placeholder, .slds-input[disabled]::-webkit-input-placeholder { color: var(--dxp-c-input-text-color-disabled,var(--dxp-g-neutral-contrast)); } .slds-input.slds-is-disabled::-moz-placeholder, .slds-input[disabled]::-moz-placeholder { color: var(--dxp-c-input-text-color-disabled,var(--dxp-g-neutral-contrast)); } .slds-has-error .slds-input { background-color: var(--input-color-background); border-color: var(--dxp-g-destructive); box-shadow: var(--dxp-g-destructive) 0 0 0 1px inset; } .slds-has-error .slds-input:active, .slds-has-error .slds-input:focus { background-color: var(--input-color-background-focus); border-color: var(--dxp-g-destructive); box-shadow: var(--dxp-g-destructive) 0 0 0 1px inset, 0 0 3px var(--dxp-g-brand); } .slds-input[readonly] { border: 1px solid var(--slds-c-input-color-border,var(--sds-c-input-color-border,var(--dxp-g-root))); background-color: var(--slds-c-input-color-background,var(--sds-c-input-color-background,var(--dxp-g-root))); } .slds-dropdown { border-color: var(--dxp-s-dropdown-color-border,var(--dxp-g-neutral)); color: var(--dxp-s-dropdown-text-color,var(--dxp-g-root-contrast)); background-color: var(--dxp-s-dropdown-color-background,var(--dxp-g-root)); } .slds-dropdown__item > a { color: var(--dxp-s-dropdown-text-color,var(--dxp-g-root-contrast)); } .slds-has-divider--top-space, .slds-has-divider_top-space { border-color: var(--dxp-s-dropdown-color-border,var(--dxp-g-neutral)); } .slds-dropdown__item > a .slds-icon-text-default { fill: var(--slds-c-icon-color-foreground-default,var(--sds-c-icon-color-foreground-default,var(--dxp-s-dropdown-text-color,var(--dxp-g-root-contrast)))); } .slds-dropdown__item > a:focus .slds-icon-text-default, .slds-dropdown__item > a:hover .slds-icon-text-default { fill: var(--slds-c-icon-color-foreground-default,var(--sds-c-icon-color-foreground-default,var(--dxp-s-dropdown-text-color-hover,var(--dxp-g-neutral-contrast)))); } .slds-dropdown__item > a.slds-has-success { background-color: var(--dxp-g-success); color: var(--dxp-g-success-contrast); } .slds-dropdown__item > a.slds-has-success .slds-icon { fill: var(--dxp-g-success-contrast); } .slds-dropdown__item > a.slds-has-warning { background-color: var(--dxp-g-warning); color: var(--dxp-g-warning-contrast); } .slds-dropdown__item > a.slds-has-warning .slds-icon { fill: var(--dxp-g-warning-contrast); } .slds-dropdown__item > a.slds-has-error { background-color: var(--dxp-g-destructive); color: var(--dxp-g-destructive-contrast); } .slds-dropdown__item > a.slds-has-error .slds-icon { fill: var(--dxp-g-destructive-contrast); } .slds-modal .slds-modal__close.slds-button { color: #fff; } .slds-pill .slds-button { background: 0 0; border-color: transparent; color: var(--dxp-g-neutral-3); } .slds-pill .slds-button:hover { color: var(--sds-c-button-text-color-hover,var(--dxp-g-brand-1,#005fb2)); } .slds-pill.slds-has-error .slds-icon__container, .slds-pill.slds-has-error .slds-icon_container { background-color: transparent; } .slds-pill.slds-has-error .slds-icon-text-error { fill: var(--dxp-g-destructive); } .slds-pill.slds-has-error a { text-decoration-color: var(--dxp-g-destructive); } .slds-progress-bar__value { background: var(--dxp-c-progress-bar-color-background,var(--dxp-g-brand)); } .slds-progress__marker { background-color: var(--dxp-g-neutral-1); border-color: var(--dxp-g-root); } .slds-progress__item.slds-is-completed .slds-progress__marker--icon, .slds-progress__item.slds-is-completed .slds-progress__marker_icon { color: var(--dxp-c-progress-icon-color,var(--dxp-g-brand)); border-color: var(--dxp-g-root); background-color: var(--dxp-g-root); } .slds-progress__item.slds-has-error .slds-progress__marker, .slds-progress__item.slds-has-error .slds-progress__marker:focus, .slds-progress__item.slds-has-error .slds-progress__marker:hover { color: var(--dxp-g-destructive); border-color: var(--dxp-g-root); background-color: var(--dxp-g-root); } .slds-progress-ring__path { fill: var(--dxp-c-progress-ring-color-fill,var(--dxp-g-success)); } .slds-progress-ring .slds-icon_container { background-color: transparent; } .slds-progress-ring svg { vertical-align: unset; } .slds-progress-ring_expired .slds-icon, .slds-progress-ring_expired .slds-progress-ring__path { fill: var(--dxp-g-destructive); } .slds-progress-ring_warning .slds-icon, .slds-progress-ring_warning .slds-progress-ring__path { fill: var(--dxp-g-warning); } .slds-progress-bar, .slds-progress-ring { background-color: var(--dxp-g-neutral-1); } .slds-progress-ring__content { background-color: var(--dxp-g-root); } .slds-progress-ring_complete .slds-progress-ring__content { background: var(--dxp-g-success,#2e844a); } .slds-progress-ring_complete .slds-progress-ring__path { fill: var(--dxp-g-success,#2e844a); } .slds-radio { --radio-color-background: var(--sds-c-radio-color-background, var(--dxp-s-form-element-color-background, var(--dxp-g-root))); --radio-color-background-checked: var(--sds-c-radio-color-background-checked, var(--sds-c-radio-color-background, var(--dxp-s-form-element-color-background-active, var(--dxp-s-form-element-color-background, var(--dxp-g-root))))); } .slds-radio .slds-form-element__label { font-size: var(--dxp-s-form-element-label-font-size,var(--dxp-s-body-font-size)); } .slds-radio [type=radio] + .slds-radio--faux, .slds-radio [type=radio] + .slds-radio__label .slds-radio--faux, .slds-radio [type=radio] + .slds-radio__label .slds-radio_faux, .slds-radio [type=radio] + .slds-radio_faux, .slds-radio [type=radio] ~ .slds-radio--faux, .slds-radio [type=radio] ~ .slds-radio_faux { background-color: var(--radio-color-background); border-color: var(--sds-c-radio-color-border,var(--dxp-s-form-element-color-border,var(--dxp-g-neutral-3))); border-width: var(--dxp-c-radio-width-border,var(--dxp-s-form-element-width-border,1px)); } .slds-radio [type=radio]:focus + .slds-radio--faux, .slds-radio [type=radio]:focus + .slds-radio__label .slds-radio--faux, .slds-radio [type=radio]:focus + .slds-radio__label .slds-radio_faux, .slds-radio [type=radio]:focus + .slds-radio_faux, .slds-radio [type=radio]:focus:checked + .slds-radio--faux, .slds-radio [type=radio]:focus:checked + .slds-radio__label .slds-radio--faux, .slds-radio [type=radio]:focus:checked + .slds-radio__label .slds-radio_faux, .slds-radio [type=radio]:focus:checked + .slds-radio_faux, .slds-radio [type=radio]:focus:checked ~ .slds-radio--faux, .slds-radio [type=radio]:focus:checked ~ .slds-radio_faux, .slds-radio [type=radio]:focus ~ .slds-radio--faux, .slds-radio [type=radio]:focus ~ .slds-radio_faux { border-color: var(--sds-c-radio-color-border-focus,var(--dxp-s-form-element-color-border-focus,var(--dxp-g-brand))); } .slds-radio [type=radio]:checked + .slds-radio--faux:after, .slds-radio [type=radio]:checked + .slds-radio__label .slds-radio--faux:after, .slds-radio [type=radio]:checked + .slds-radio__label .slds-radio_faux:after, .slds-radio [type=radio]:checked + .slds-radio_faux:after, .slds-radio [type=radio]:checked ~ .slds-radio--faux:after, .slds-radio [type=radio]:checked ~ .slds-radio_faux:after { background-color: var(--sds-c-radio-mark-color-foreground,var(--dxp-s-form-element-color-foreground,var(--dxp-g-brand-1))); } .slds-radio [type=radio]:checked + .slds-radio--faux, .slds-radio [type=radio]:checked + .slds-radio__label .slds-radio--faux, .slds-radio [type=radio]:checked + .slds-radio__label .slds-radio_faux, .slds-radio [type=radio]:checked + .slds-radio_faux, .slds-radio [type=radio]:checked ~ .slds-radio--faux, .slds-radio [type=radio]:checked ~ .slds-radio_faux { background-color: var(--radio-color-background-checked); border-color: var(--sds-c-radio-color-border-checked,var(--dxp-s-form-element-color-border-checked,var(--dxp-s-form-element-color-border,var(--dxp-g-neutral-3)))); } .slds-has-error .slds-radio [type=radio] + .slds-radio--faux, .slds-has-error .slds-radio [type=radio] + .slds-radio__label .slds-radio--faux, .slds-has-error .slds-radio [type=radio] + .slds-radio__label .slds-radio_faux, .slds-has-error .slds-radio [type=radio] + .slds-radio_faux, .slds-has-error .slds-radio [type=radio] ~ .slds-radio--faux, .slds-has-error .slds-radio [type=radio] ~ .slds-radio_faux { border-color: var(--dxp-g-destructive); } .slds-has-error .slds-radio [type=radio]:checked + .slds-radio--faux, .slds-has-error .slds-radio [type=radio]:checked + .slds-radio__label .slds-radio--faux, .slds-has-error .slds-radio [type=radio]:checked + .slds-radio__label .slds-radio_faux, .slds-has-error .slds-radio [type=radio]:checked + .slds-radio_faux, .slds-has-error .slds-radio [type=radio]:checked ~ .slds-radio--faux, .slds-has-error .slds-radio [type=radio]:checked ~ .slds-radio_faux { background-color: var(--radio-color-background-checked); } .slds-has-error .slds-radio [type=radio]:checked + .slds-radio--faux:after, .slds-has-error .slds-radio [type=radio]:checked + .slds-radio__label .slds-radio--faux:after, .slds-has-error .slds-radio [type=radio]:checked + .slds-radio__label .slds-radio_faux:after, .slds-has-error .slds-radio [type=radio]:checked + .slds-radio_faux:after, .slds-has-error .slds-radio [type=radio]:checked ~ .slds-radio--faux:after, .slds-has-error .slds-radio [type=radio]:checked ~ .slds-radio_faux:after { background: var(--dxp-g-destructive); } .slds-select { --select-text-font-size: var(--sds-c-select-color-background, var(--dxp-s-form-element-color-background, var(--dxp-g-root))); --select-color-background-focus: var(--sds-c-select-color-background-focus, var(--dxp-s-form-element-color-background-active, var(--dxp-s-form-element-color-background, var(--dxp-g-root)))); background-color: var(--select-text-font-size); font-size: var(--dxp-c-select-text-font-size,var(--dxp-s-form-element-text-font-size,var(--dxp-s-body-font-size))); color: var(--sds-c-select-text-color,var(--dxp-s-form-element-text-color,var(--dxp-g-root-contrast))); border-color: var(--sds-c-select-color-border,var(--dxp-s-form-element-color-border,var(--dxp-g-neutral-3))); border-radius: var(--sds-c-select-radius-border,var(--dxp-s-form-element-radius-border,4px)); border-width: var(--dxp-c-select-width-border,var(--dxp-s-form-element-width-border,1px)); } .slds-select:focus { background-color: var(--select-color-background-focus); color: var(--sds-c-select-text-color-focus,var(--dxp-s-form-element-text-color-focus,var(--dxp-s-form-element-text-color,var(--dxp-g-root-contrast)))); border-color: var(--sds-c-select-color-border-focus,var(--dxp-s-form-element-color-border-focus,var(--dxp-g-brand))); } .slds-has-error .slds-select { background-color: var(--select-text-font-size); border-color: var(--dxp-g-destructive); box-shadow: var(--dxp-g-destructive) 0 0 0 1px inset; } .slds-has-error .slds-select:active, .slds-has-error .slds-select:focus { background-color: var(--select-color-background-focus); box-shadow: var(--dxp-g-destructive) 0 0 0 1px inset, 0 0 3px var(--dxp-g-brand); } .slds-select.slds-is-disabled, .slds-select[disabled] { background-color: var(--dxp-g-neutral); color: var(--dxp-g-neutral-contrast); } .slds-m-top--none, .slds-m-top_none { margin-top: var(--dxp-g-spacing-none); } .slds-m-top--xxx-small, .slds-m-top_xxx-small { margin-top: var(--dxp-g-spacing-xxxsmall); } .slds-m-top--xx-small, .slds-m-top_xx-small { margin-top: var(--dxp-g-spacing-xxsmall); } .slds-m-top--x-small, .slds-m-top_x-small { margin-top: var(--dxp-g-spacing-xsmall); } .slds-m-top--small, .slds-m-top_small { margin-top: var(--dxp-g-spacing-small); } .slds-m-top--medium, .slds-m-top_medium { margin-top: var(--dxp-g-spacing-medium); } .slds-m-top--large, .slds-m-top_large { margin-top: var(--dxp-g-spacing-large); } .slds-m-top--x-large, .slds-m-top_x-large { margin-top: var(--dxp-g-spacing-xlarge); } .slds-m-top--xx-large, .slds-m-top_xx-large { margin-top: var(--dxp-g-spacing-xxlarge); } .slds-m-left--none, .slds-m-left_none { margin-left: var(--dxp-g-spacing-none); } .slds-m-left--xxx-small, .slds-m-left_xxx-small { margin-left: var(--dxp-g-spacing-xxxsmall); } .slds-m-left--xx-small, .slds-m-left_xx-small { margin-left: var(--dxp-g-spacing-xxsmall); } .slds-m-left--x-small, .slds-m-left_x-small { margin-left: var(--dxp-g-spacing-xsmall); } .slds-m-left--small, .slds-m-left_small { margin-left: var(--dxp-g-spacing-small); } .slds-m-left--medium, .slds-m-left_medium { margin-left: var(--dxp-g-spacing-medium); } .slds-m-left--large, .slds-m-left_large { margin-left: var(--dxp-g-spacing-large); } .slds-m-left--x-large, .slds-m-left_x-large { margin-left: var(--dxp-g-spacing-xlarge); } .slds-m-left--xx-large, .slds-m-left_xx-large { margin-left: var(--dxp-g-spacing-xxlarge); } .slds-m-bottom--none, .slds-m-bottom_none { margin-bottom: var(--dxp-g-spacing-none); } .slds-m-bottom--xxx-small, .slds-m-bottom_xxx-small { margin-bottom: var(--dxp-g-spacing-xxxsmall); } .slds-m-bottom--xx-small, .slds-m-bottom_xx-small { margin-bottom: var(--dxp-g-spacing-xxsmall); } .slds-m-bottom--x-small, .slds-m-bottom_x-small { margin-bottom: var(--dxp-g-spacing-xsmall); } .slds-m-bottom--small, .slds-m-bottom_small { margin-bottom: var(--dxp-g-spacing-small); } .slds-m-bottom--medium, .slds-m-bottom_medium { margin-bottom: var(--dxp-g-spacing-medium); } .slds-m-bottom--large, .slds-m-bottom_large { margin-bottom: var(--dxp-g-spacing-large); } .slds-m-bottom--x-large, .slds-m-bottom_x-large { margin-bottom: var(--dxp-g-spacing-xlarge); } .slds-m-bottom--xx-large, .slds-m-bottom_xx-large { margin-bottom: var(--dxp-g-spacing-xxlarge); } .slds-m-right--none, .slds-m-right_none { margin-right: var(--dxp-g-spacing-none); } .slds-m-right--xxx-small, .slds-m-right_xxx-small { margin-right: var(--dxp-g-spacing-xxxsmall); } .slds-m-right--xx-small, .slds-m-right_xx-small { margin-right: var(--dxp-g-spacing-xxsmall); } .slds-m-right--x-small, .slds-m-right_x-small { margin-right: var(--dxp-g-spacing-xsmall); } .slds-m-right--small, .slds-m-right_small { margin-right: var(--dxp-g-spacing-small); } .slds-m-right--medium, .slds-m-right_medium { margin-right: var(--dxp-g-spacing-medium); } .slds-m-right--large, .slds-m-right_large { margin-right: var(--dxp-g-spacing-large); } .slds-m-right--x-large, .slds-m-right_x-large { margin-right: var(--dxp-g-spacing-xlarge); } .slds-m-right--xx-large, .slds-m-right_xx-large { margin-right: var(--dxp-g-spacing-xxlarge); } .slds-p-top--none, .slds-p-top_none { padding-top: var(--dxp-g-spacing-none); } .slds-p-top--xxx-small, .slds-p-top_xxx-small { padding-top: var(--dxp-g-spacing-xxxsmall); } .slds-p-top--xx-small, .slds-p-top_xx-small { padding-top: var(--dxp-g-spacing-xxsmall); } .slds-p-top--x-small, .slds-p-top_x-small { padding-top: var(--dxp-g-spacing-xsmall); } .slds-p-top--small, .slds-p-top_small { padding-top: var(--dxp-g-spacing-small); } .slds-p-top--medium, .slds-p-top_medium { padding-top: var(--dxp-g-spacing-medium); } .slds-p-top--large, .slds-p-top_large { padding-top: var(--dxp-g-spacing-large); } .slds-p-top--x-large, .slds-p-top_x-large { padding-top: var(--dxp-g-spacing-xlarge); } .slds-p-top--xx-large, .slds-p-top_xx-large { padding-top: var(--dxp-g-spacing-xxlarge); } .slds-p-left--none, .slds-p-left_none { padding-left: var(--dxp-g-spacing-none); } .slds-p-left--xxx-small, .slds-p-left_xxx-small { padding-left: var(--dxp-g-spacing-xxxsmall); } .slds-p-left--xx-small, .slds-p-left_xx-small { padding-left: var(--dxp-g-spacing-xxsmall); } .slds-p-left--x-small, .slds-p-left_x-small { padding-left: var(--dxp-g-spacing-xsmall); } .slds-p-left--small, .slds-p-left_small { padding-left: var(--dxp-g-spacing-small); } .slds-p-left--medium, .slds-p-left_medium { padding-left: var(--dxp-g-spacing-medium); } .slds-p-left--large, .slds-p-left_large { padding-left: var(--dxp-g-spacing-large); } .slds-p-left--x-large, .slds-p-left_x-large { padding-left: var(--dxp-g-spacing-xlarge); } .slds-p-left--xx-large, .slds-p-left_xx-large { padding-left: var(--dxp-g-spacing-xxlarge); } .slds-p-bottom--none, .slds-p-bottom_none { padding-bottom: var(--dxp-g-spacing-none); } .slds-p-bottom--xxx-small, .slds-p-bottom_xxx-small { padding-bottom: var(--dxp-g-spacing-xxxsmall); } .slds-p-bottom--xx-small, .slds-p-bottom_xx-small { padding-bottom: var(--dxp-g-spacing-xxsmall); } .slds-p-bottom--x-small, .slds-p-bottom_x-small { padding-bottom: var(--dxp-g-spacing-xsmall); } .slds-p-bottom--small, .slds-p-bottom_small { padding-bottom: var(--dxp-g-spacing-small); } .slds-p-bottom--medium, .slds-p-bottom_medium { padding-bottom: var(--dxp-g-spacing-medium); } .slds-p-bottom--large, .slds-p-bottom_large { padding-bottom: var(--dxp-g-spacing-large); } .slds-p-bottom--x-large, .slds-p-bottom_x-large { padding-bottom: var(--dxp-g-spacing-xlarge); } .slds-p-bottom--xx-large, .slds-p-bottom_xx-large { padding-bottom: var(--dxp-g-spacing-xxlarge); } .slds-p-right--none, .slds-p-right_none { padding-right: var(--dxp-g-spacing-none); } .slds-p-right--xxx-small, .slds-p-right_xxx-small { padding-right: var(--dxp-g-spacing-xxxsmall); } .slds-p-right--xx-small, .slds-p-right_xx-small { padding-right: var(--dxp-g-spacing-xxsmall); } .slds-p-right--x-small, .slds-p-right_x-small { padding-right: var(--dxp-g-spacing-xsmall); } .slds-p-right--small, .slds-p-right_small { padding-right: var(--dxp-g-spacing-small); } .slds-p-right--medium, .slds-p-right_medium { padding-right: var(--dxp-g-spacing-medium); } .slds-p-right--large, .slds-p-right_large { padding-right: var(--dxp-g-spacing-large); } .slds-p-right--x-large, .slds-p-right_x-large { padding-right: var(--dxp-g-spacing-xlarge); } .slds-p-right--xx-large, .slds-p-right_xx-large { padding-right: var(--dxp-g-spacing-xxlarge); } .slds-p-vertical--none, .slds-p-vertical_none { padding-top: var(--dxp-g-spacing-none); padding-bottom: var(--dxp-g-spacing-none); } .slds-p-vertical--xxx-small, .slds-p-vertical_xxx-small { padding-top: var(--dxp-g-spacing-xxxsmall); padding-bottom: var(--dxp-g-spacing-xxxsmall); } .slds-p-vertical--xx-small, .slds-p-vertical_xx-small { padding-top: var(--dxp-g-spacing-xxsmall); padding-bottom: var(--dxp-g-spacing-xxsmall); } .slds-p-vertical--x-small, .slds-p-vertical_x-small { padding-top: var(--dxp-g-spacing-xsmall); padding-bottom: var(--dxp-g-spacing-xsmall); } .slds-p-vertical--small, .slds-p-vertical_small { padding-top: var(--dxp-g-spacing-small); padding-bottom: var(--dxp-g-spacing-small); } .slds-p-vertical--medium, .slds-p-vertical_medium { padding-top: var(--dxp-g-spacing-medium); padding-bottom: var(--dxp-g-spacing-medium); } .slds-p-vertical--large, .slds-p-vertical_large { padding-top: var(--dxp-g-spacing-large); padding-bottom: var(--dxp-g-spacing-large); } .slds-p-vertical--x-large, .slds-p-vertical_x-large { padding-top: var(--dxp-g-spacing-xlarge); padding-bottom: var(--dxp-g-spacing-xlarge); } .slds-p-vertical--xx-large, .slds-p-vertical_xx-large { padding-top: var(--dxp-g-spacing-xxlarge); padding-bottom: var(--dxp-g-spacing-xxlarge); } .slds-p-horizontal--none, .slds-p-horizontal_none { padding-left: var(--dxp-g-spacing-none); padding-right: var(--dxp-g-spacing-none); } .slds-p-horizontal--xxx-small, .slds-p-horizontal_xxx-small { padding-left: var(--dxp-g-spacing-xxxsmall); padding-right: var(--dxp-g-spacing-xxxsmall); } .slds-p-horizontal--xx-small, .slds-p-horizontal_xx-small { padding-left: var(--dxp-g-spacing-xxsmall); padding-right: var(--dxp-g-spacing-xxsmall); } .slds-p-horizontal--x-small, .slds-p-horizontal_x-small { padding-left: var(--dxp-g-spacing-xsmall); padding-right: var(--dxp-g-spacing-xsmall); } .slds-p-horizontal--small, .slds-p-horizontal_small { padding-left: var(--dxp-g-spacing-small); padding-right: var(--dxp-g-spacing-small); } .slds-p-horizontal--medium, .slds-p-horizontal_medium { padding-left: var(--dxp-g-spacing-medium); padding-right: var(--dxp-g-spacing-medium); } .slds-p-horizontal--large, .slds-p-horizontal_large { padding-left: var(--dxp-g-spacing-large); padding-right: var(--dxp-g-spacing-large); } .slds-p-horizontal--x-large, .slds-p-horizontal_x-large { padding-left: var(--dxp-g-spacing-xlarge); padding-right: var(--dxp-g-spacing-xlarge); } .slds-p-horizontal--xx-large, .slds-p-horizontal_xx-large { padding-left: var(--dxp-g-spacing-xxlarge); padding-right: var(--dxp-g-spacing-xxlarge); } .slds-p-around--none, .slds-p-around_none { padding-top: var(--dxp-g-spacing-none); padding-left: var(--dxp-g-spacing-none); padding-bottom: var(--dxp-g-spacing-none); padding-right: var(--dxp-g-spacing-none); } .slds-p-around--xxx-small, .slds-p-around_xxx-small { padding-top: var(--dxp-g-spacing-xxxsmall); padding-left: var(--dxp-g-spacing-xxxsmall); padding-bottom: var(--dxp-g-spacing-xxxsmall); padding-right: var(--dxp-g-spacing-xxxsmall); } .slds-p-around--xx-small, .slds-p-around_xx-small { padding-top: var(--dxp-g-spacing-xxsmall); padding-left: var(--dxp-g-spacing-xxsmall); padding-bottom: var(--dxp-g-spacing-xxsmall); padding-right: var(--dxp-g-spacing-xxsmall); } .slds-p-around--x-small, .slds-p-around_x-small { padding-top: var(--dxp-g-spacing-xsmall); padding-left: var(--dxp-g-spacing-xsmall); padding-bottom: var(--dxp-g-spacing-xsmall); padding-right: var(--dxp-g-spacing-xsmall); } .slds-p-around--small, .slds-p-around_small { padding-top: var(--dxp-g-spacing-small); padding-left: var(--dxp-g-spacing-small); padding-bottom: var(--dxp-g-spacing-small); padding-right: var(--dxp-g-spacing-small); } .slds-p-around--medium, .slds-p-around_medium { padding-top: var(--dxp-g-spacing-medium); padding-left: var(--dxp-g-spacing-medium); padding-bottom: var(--dxp-g-spacing-medium); padding-right: var(--dxp-g-spacing-medium); } .slds-p-around--large, .slds-p-around_large { padding-top: var(--dxp-g-spacing-large); padding-left: var(--dxp-g-spacing-large); padding-bottom: var(--dxp-g-spacing-large); padding-right: var(--dxp-g-spacing-large); } .slds-p-around--x-large, .slds-p-around_x-large { padding-top: var(--dxp-g-spacing-xlarge); padding-left: var(--dxp-g-spacing-xlarge); padding-bottom: var(--dxp-g-spacing-xlarge); padding-right: var(--dxp-g-spacing-xlarge); } .slds-p-around--xx-large, .slds-p-around_xx-large { padding-top: var(--dxp-g-spacing-xxlarge); padding-left: var(--dxp-g-spacing-xxlarge); padding-bottom: var(--dxp-g-spacing-xxlarge); padding-right: var(--dxp-g-spacing-xxlarge); } .slds-m-vertical--none, .slds-m-vertical_none { margin-top: var(--dxp-g-spacing-none); margin-bottom: var(--dxp-g-spacing-none); } .slds-m-vertical--xxx-small, .slds-m-vertical_xxx-small { margin-top: var(--dxp-g-spacing-xxxsmall); margin-bottom: var(--dxp-g-spacing-xxxsmall); } .slds-m-vertical--xx-small, .slds-m-vertical_xx-small { margin-top: var(--dxp-g-spacing-xxsmall); margin-bottom: var(--dxp-g-spacing-xxsmall); } .slds-m-vertical--x-small, .slds-m-vertical_x-small { margin-top: var(--dxp-g-spacing-xsmall); margin-bottom: var(--dxp-g-spacing-xsmall); } .slds-m-vertical--small, .slds-m-vertical_small { margin-top: var(--dxp-g-spacing-small); margin-bottom: var(--dxp-g-spacing-small); } .slds-m-vertical--medium, .slds-m-vertical_medium { margin-top: var(--dxp-g-spacing-medium); margin-bottom: var(--dxp-g-spacing-medium); } .slds-m-vertical--large, .slds-m-vertical_large { margin-top: var(--dxp-g-spacing-large); margin-bottom: var(--dxp-g-spacing-large); } .slds-m-vertical--x-large, .slds-m-vertical_x-large { margin-top: var(--dxp-g-spacing-xlarge); margin-bottom: var(--dxp-g-spacing-xlarge); } .slds-m-vertical--xx-large, .slds-m-vertical_xx-large { margin-top: var(--dxp-g-spacing-xxlarge); margin-bottom: var(--dxp-g-spacing-xxlarge); } .slds-m-horizontal--none, .slds-m-horizontal_none { margin-left: var(--dxp-g-spacing-none); margin-right: var(--dxp-g-spacing-none); } .slds-m-horizontal--xxx-small, .slds-m-horizontal_xxx-small { margin-left: var(--dxp-g-spacing-xxxsmall); margin-right: var(--dxp-g-spacing-xxxsmall); } .slds-m-horizontal--xx-small, .slds-m-horizontal_xx-small { margin-left: var(--dxp-g-spacing-xxsmall); margin-right: var(--dxp-g-spacing-xxsmall); } .slds-m-horizontal--x-small, .slds-m-horizontal_x-small { margin-left: var(--dxp-g-spacing-xsmall); margin-right: var(--dxp-g-spacing-xsmall); } .slds-m-horizontal--small, .slds-m-horizontal_small { margin-left: var(--dxp-g-spacing-small); margin-right: var(--dxp-g-spacing-small); } .slds-m-horizontal--medium, .slds-m-horizontal_medium { margin-left: var(--dxp-g-spacing-medium); margin-right: var(--dxp-g-spacing-medium); } .slds-m-horizontal--large, .slds-m-horizontal_large { margin-left: var(--dxp-g-spacing-large); margin-right: var(--dxp-g-spacing-large); } .slds-m-horizontal--x-large, .slds-m-horizontal_x-large { margin-left: var(--dxp-g-spacing-xlarge); margin-right: var(--dxp-g-spacing-xlarge); } .slds-m-horizontal--xx-large, .slds-m-horizontal_xx-large { margin-left: var(--dxp-g-spacing-xxlarge); margin-right: var(--dxp-g-spacing-xxlarge); } .slds-m-around--none, .slds-m-around_none { margin-top: var(--dxp-g-spacing-none); margin-left: var(--dxp-g-spacing-none); margin-bottom: var(--dxp-g-spacing-none); margin-right: var(--dxp-g-spacing-none); } .slds-m-around--xxx-small, .slds-m-around_xxx-small { margin-top: var(--dxp-g-spacing-xxxsmall); margin-left: var(--dxp-g-spacing-xxxsmall); margin-bottom: var(--dxp-g-spacing-xxxsmall); margin-right: var(--dxp-g-spacing-xxxsmall); } .slds-m-around--xx-small, .slds-m-around_xx-small { margin-top: var(--dxp-g-spacing-xxsmall); margin-left: var(--dxp-g-spacing-xxsmall); margin-bottom: var(--dxp-g-spacing-xxsmall); margin-right: var(--dxp-g-spacing-xxsmall); } .slds-m-around--x-small, .slds-m-around_x-small { margin-top: var(--dxp-g-spacing-xsmall); margin-left: var(--dxp-g-spacing-xsmall); margin-bottom: var(--dxp-g-spacing-xsmall); margin-right: var(--dxp-g-spacing-xsmall); } .slds-m-around--small, .slds-m-around_small { margin-top: var(--dxp-g-spacing-small); margin-left: var(--dxp-g-spacing-small); margin-bottom: var(--dxp-g-spacing-small); margin-right: var(--dxp-g-spacing-small); } .slds-m-around--medium, .slds-m-around_medium { margin-top: var(--dxp-g-spacing-medium); margin-left: var(--dxp-g-spacing-medium); margin-bottom: var(--dxp-g-spacing-medium); margin-right: var(--dxp-g-spacing-medium); } .slds-m-around--large, .slds-m-around_large { margin-top: var(--dxp-g-spacing-large); margin-left: var(--dxp-g-spacing-large); margin-bottom: var(--dxp-g-spacing-large); margin-right: var(--dxp-g-spacing-large); } .slds-m-around--x-large, .slds-m-around_x-large { margin-top: var(--dxp-g-spacing-xlarge); margin-left: var(--dxp-g-spacing-xlarge); margin-bottom: var(--dxp-g-spacing-xlarge); margin-right: var(--dxp-g-spacing-xlarge); } .slds-m-around--xx-large, .slds-m-around_xx-large { margin-top: var(--dxp-g-spacing-xxlarge); margin-left: var(--dxp-g-spacing-xxlarge); margin-bottom: var(--dxp-g-spacing-xxlarge); margin-right: var(--dxp-g-spacing-xxlarge); } .slds-spinner:after, .slds-spinner:before, .slds-spinner__dot-a:after, .slds-spinner__dot-a:before, .slds-spinner__dot-b:after, .slds-spinner__dot-b:before { background: var(--dxp-c-spinner-color-foreground,var(--dxp-g-neutral-1)); } .slds-spinner--inverse .slds-spinner__dot-a:after, .slds-spinner--inverse .slds-spinner__dot-a:before, .slds-spinner--inverse .slds-spinner__dot-b:after, .slds-spinner--inverse .slds-spinner__dot-b:before, .slds-spinner--inverse.slds-spinner:after, .slds-spinner--inverse.slds-spinner:before, .slds-spinner_inverse .slds-spinner__dot-a:after, .slds-spinner_inverse .slds-spinner__dot-a:before, .slds-spinner_inverse .slds-spinner__dot-b:after, .slds-spinner_inverse .slds-spinner__dot-b:before, .slds-spinner_inverse.slds-spinner:after, .slds-spinner_inverse.slds-spinner:before { background: var(--dxp-c-spinner-color-foreground-inverse,var(--dxp-g-root-1)); } .slds-spinner_container { background-color: var(--dxp-c-spinner-color-background); } .slds-tabs_default__overflow-button .slds-button { height: 38px; font-size: inherit; } .slds-tabs--default__link, .slds-tabs_default__link { color: var(--sds-c-tabs-item-text-color,var(--dxp-g-root-contrast,#3e3e3c)); } .slds-textarea { --textarea-color-background: var(--sds-c-textarea-color-background, var(--dxp-s-form-element-color-background, var(--dxp-g-root))); --textarea-color-background-focus: var(--sds-c-textarea-color-background-focus, var(--dxp-s-form-element-color-background-active, var(--dxp-s-form-element-color-background, var(--dxp-g-root)))); background-color: var(--textarea-color-background); font-size: var(--dxp-c-textarea-text-font-size,var(--dxp-s-form-element-text-font-size,var(--dxp-s-body-font-size))); color: var(--sds-c-textarea-text-color,var(--dxp-s-form-element-text-color,var(--dxp-g-root-contrast))); --border-color: var(--sds-c-textarea-color-border, var(--dxp-s-form-element-color-border, var(--dxp-g-neutral-3))); --border-width: var(--dxp-c-textarea-width-border, var(--dxp-s-form-element-width-border, 1px)); border-color: var(--border-color); border-width: var(--border-width); border-style: solid; border-inline-start: var(--dxp-c-textarea-border-inline-start,var(--dxp-s-form-element-border-inline-start,var(--border-width) solid var(--border-color))); border-inline-end: var(--dxp-c-textarea-border-inline-end,var(--dxp-s-form-element-border-inline-end,var(--border-width) solid var(--border-color))); border-block-start: var(--dxp-c-textarea-border-block-start,var(--dxp-s-form-element-border-block-start,var(--border-width) solid var(--border-color))); border-block-end: var(--dxp-c-textarea-border-block-end,var(--dxp-s-form-element-border-block-end,var(--border-width) solid var(--border-color))); border-radius: var(--sds-c-textarea-radius-border,var(--dxp-s-form-element-radius-border,4px)); } .slds-textarea:focus { background-color: var(--textarea-color-background-focus); color: var(--sds-c-textarea-text-color-focus,var(--dxp-s-form-element-text-color-focus,var(--dxp-s-form-element-text-color,var(--dxp-g-root-contrast)))); border-color: var(--sds-c-textarea-color-border-focus,var(--dxp-s-form-element-color-border-focus,var(--dxp-g-brand))); } .slds-has-error .slds-textarea { background-color: var(--textarea-color-background); border-color: var(--dxp-g-destructive); box-shadow: var(--dxp-g-destructive) 0 0 0 1px inset; } .slds-has-error .slds-textarea:active, .slds-has-error .slds-textarea:focus { --slds-c-textarea-color-background-focus: var(--slds-c-textarea-color-background-error-focus, var(--dxp-g-root, white)); background-color: var(--textarea-color-background-focus); box-shadow: var(--dxp-g-destructive) 0 0 0 1px inset, 0 0 3px var(--dxp-g-brand); } .slds-textarea.slds-is-disabled, .slds-textarea[disabled] { background-color: var(--dxp-g-neutral); } .slds-textarea.slds-is-disabled::-webkit-input-placeholder, .slds-textarea[disabled]::-webkit-input-placeholder { color: var(--dxp-g-neutral-contrast); } .slds-textarea.slds-is-disabled::-moz-placeholder, .slds-textarea[disabled]::-moz-placeholder { color: var(--dxp-g-neutral-contrast); } .slds-textarea.slds-is-disabled::placeholder, .slds-textarea[disabled]::placeholder { color: var(--dxp-g-neutral-contrast); } .slds-popover--tooltip .slds-popover__body, .slds-popover_tooltip .slds-popover__body { font-size: var(--dxp-s-body-small-font-size,var(--sds-c-tooltip-font-size,.75rem)); font-style: var(--dxp-s-body-small-font-style); font-family: var(--dxp-s-body-small-font-family); font-weight: var(--dxp-s-body-small-font-weight); text-decoration: var(--dxp-s-body-small-text-decoration); text-transform: var(--dxp-s-body-small-text-transform); line-height: var(--dxp-s-body-small-line-height); letter-spacing: var(--dxp-s-body-small-letter-spacing); text-shadow: var(--dxp-s-body-small-text-shadow); } .slds-text-font_monospace { font-family: var(--dxp-c-monospace-font-family); } .dxp-text-body, .slds-text-body--regular, .slds-text-body_regular { font-size: var(--dxp-s-body-font-size,var(--dxp-g-font-size-3)); font-style: var(--dxp-s-body-font-style); font-family: var(--dxp-s-body-font-family); font-weight: var(--dxp-s-body-font-weight); text-decoration: var(--dxp-s-body-text-decoration); text-transform: var(--dxp-s-body-text-transform); line-height: var(--dxp-s-body-line-height); letter-spacing: var(--dxp-s-body-letter-spacing); text-shadow: var(--dxp-s-body-text-shadow); color: var(--dxp-s-body-text-color,var(--dxp-g-root-contrast)); } .dxp-text-body-small, .slds-text-body--small, .slds-text-body_small { font-size: var(--dxp-s-body-small-font-size,var(--dxp-g-font-size-2)); font-style: var(--dxp-s-body-small-font-style); font-family: var(--dxp-s-body-small-font-family); font-weight: var(--dxp-s-body-small-font-weight); text-decoration: var(--dxp-s-body-small-text-decoration); text-transform: var(--dxp-s-body-small-text-transform); line-height: var(--dxp-s-body-small-line-height); letter-spacing: var(--dxp-s-body-small-letter-spacing); text-shadow: var(--dxp-s-body-small-text-shadow); color: var(--dxp-s-body-small-text-color,var(--dxp-g-root-contrast)); } .dxp-text-heading-xlarge { font-size: var(--dxp-s-text-heading-extra-large-font-size,var(--dxp-g-font-size-9)); font-style: var(--dxp-s-text-heading-extra-large-font-style); font-family: var(--dxp-s-text-heading-extra-large-font-family,var(--dxp-g-heading-font-family)); font-weight: var(--dxp-s-text-heading-extra-large-font-weight); text-decoration: var(--dxp-s-text-heading-extra-large-text-decoration); text-transform: var(--dxp-s-text-heading-extra-large-text-transform); line-height: var(--dxp-s-text-heading-extra-large-line-height); letter-spacing: var(--dxp-s-text-heading-extra-large-letter-spacing); text-shadow: var(--dxp-s-text-heading-extra-large-text-shadow); color: var(--dxp-s-text-heading-extra-large-color,var(--dxp-g-root-contrast)); } .dxp-text-heading-large, .slds-text-heading--large, .slds-text-heading_large { font-size: var(--dxp-s-text-heading-large-font-size,var(--dxp-g-font-size-9)); font-style: var(--dxp-s-text-heading-large-font-style); font-family: var(--dxp-s-text-heading-large-font-family,var(--dxp-g-heading-font-family)); font-weight: var(--dxp-s-text-heading-large-font-weight); text-decoration: var(--dxp-s-text-heading-large-text-decoration); text-transform: var(--dxp-s-text-heading-large-text-transform); line-height: var(--dxp-s-text-heading-large-line-height); letter-spacing: var(--dxp-s-text-heading-large-letter-spacing); text-shadow: var(--dxp-s-text-heading-large-text-shadow); color: var(--dxp-s-text-heading-large-color,var(--dxp-g-root-contrast)); } .dxp-text-heading-medium, .slds-text-heading--medium, .slds-text-heading_medium { font-size: var(--dxp-s-text-heading-medium-font-size,var(--dxp-g-font-size-7)); font-style: var(--dxp-s-text-heading-medium-font-style); font-family: var(--dxp-s-text-heading-medium-font-family,var(--dxp-g-heading-font-family)); font-weight: var(--dxp-s-text-heading-medium-font-weight); text-decoration: var(--dxp-s-text-heading-medium-text-decoration); text-transform: var(--dxp-s-text-heading-medium-text-transform); line-height: var(--dxp-s-text-heading-medium-line-height); letter-spacing: var(--dxp-s-text-heading-medium-letter-spacing); text-shadow: var(--dxp-s-text-heading-medium-text-shadow); color: var(--dxp-s-text-heading-medium-color,var(--dxp-g-root-contrast)); } .dxp-text-heading-small, .slds-text-heading--small, .slds-text-heading_small { font-size: var(--dxp-s-text-heading-small-font-size,var(--dxp-g-font-size-5)); font-style: var(--dxp-s-text-heading-small-font-style); font-family: var(--dxp-s-text-heading-small-font-family,var(--dxp-g-heading-font-family)); font-weight: var(--dxp-s-text-heading-small-font-weight); text-decoration: var(--dxp-s-text-heading-small-text-decoration); text-transform: var(--dxp-s-text-heading-small-text-transform); line-height: var(--dxp-s-text-heading-small-line-height); letter-spacing: var(--dxp-s-text-heading-small-letter-spacing); text-shadow: var(--dxp-s-text-heading-small-text-shadow); color: var(--dxp-s-text-heading-small-color,var(--dxp-g-root-contrast)); } .slds-text-title { font-size: var(--dxp-c-title-font-size,var(--dxp-g-font-size-2)); color: var(--dxp-c-title-text-color,var(--dxp-g-root-contrast)); font-style: var(--dxp-c-title-font-style); text-shadow: var(--dxp-c-title-text-shadow); line-height: var(--dxp-c-title-line-height); font-weight: var(--dxp-c-title-font-weight); letter-spacing: var(--dxp-c-title-letter-spacing); } .slds-text-title--caps, .slds-text-title_caps { font-size: var(--dxp-c-title-caps-font-size,var(--dxp-g-font-size-2)); color: var(--dxp-c-title-caps-text-color,var(--dxp-g-root-contrast)); font-style: var(--dxp-c-title-caps-font-style); text-shadow: var(--dxp-c-title-caps-text-shadow); line-height: var(--dxp-c-title-caps-line-height); font-weight: var(--dxp-c-title-caps-font-weight); letter-spacing: var(--dxp-c-title-caps-letter-spacing); text-transform: var(--dxp-c-title-caps-text-transform); } .slds-text-color--default, .slds-text-color_default { color: var(--dxp-g-root-contrast); } .slds-text-color_success { color: var(--dxp-g-success-2); } .slds-text-color--weak, .slds-text-color_weak { color: var(--dxp-g-neutral-2); } .slds-text-color--error, .slds-text-color_destructive, .slds-text-color_error { color: var(--dxp-g-destructive); } .slds-text-color_inverse { color: var(--dxp-g-root); } .slds-text-color_inverse-weak { color: var(--dxp-g-neutral-2); } b, dfn, strong { font-weight: var(--dxp-c-strong-text-weight); } mark { background: var(--dxp-c-mark-color-background,var(--dxp-g-warning)); color: var(--dxp-c-mark-text-color,var(--dxp-g-warning-contrast)); } ::selection { background: var(--dxp-c-selection-color-background,var(--dxp-g-neutral)); text-shadow: var(--dxp-c-selection-text-shadow); color: var(--dxp-c-selection-text-color,var(--dxp-g-neutral-contrast)); } ::-moz-selection { background: var(--dxp-c-selection-color-background,var(--dxp-g-neutral)); text-shadow: var(--dxp-c-selection-text-shadow); color: var(--dxp-c-selection-text-color,var(--dxp-g-neutral-contrast)); }