:root {
	/* LWC Design Token Overrides */
	--lwc-brandTextLink: var(--accessible-text-link);

	/* SLDS Styling Hook Overrides */
	--slds-c-backdrop-color-background: rgba(8, 7, 7, 0.6);

	/* nCino Design Tokens */
	--brand-accessible: var(--slds-g-color-brand-base-50, #0176d3);
	--brand-accessible-active: var(--slds-g-color-brand-base-30, #014486);
	--color-text-default: var(--slds-g-color-neutral-base-10, #181818);
	--accessible-input-border-color: var(--slds-g-color-neutral-base-50, #747474);
	--accessible-text-link: #006dcc;
	--inset-focus: var(--_slds-g-shadow-inset-focus, 0 0 0 2px var(--slds-g-color-neutral-base-100, #ffffff) inset, 0 0 0 4px var(--slds-g-color-brand-base-40, #0B5CAB) inset);
	--outset-focus: var(--_slds-g-shadow-outset-focus, 0 0 0 2px var(--slds-g-color-neutral-base-100, #FFFFFF), 0 0 0 4px var(--slds-g-color-brand-base-40, #0B5CAB));
	--outline-focus: var(--_slds-g-shadow-outline-focus, 0 0 0 2px var(--slds-g-color-brand-base-40, #0B5CAB))
}

/* Follow Salesforce's font size for desktop screens. */
@media only screen and (min-width: 1024px) {
	html {
		font-size: 16px;
	}
}

/* Follow Salesforce's font size for smaller screens (mobile devices). */
@media only screen and (max-width: 1024px) {
	html {
		font-size: 14px;
	}
}

/* Button Brand Focus Contrast Ratio */
.slds .slds-button.slds-button--brand:focus,
.force .btn-primary:focus,
.force .btn-primary:hover:not([disabled]) {
	box-shadow: var(--outset-focus);
}
.slds a.slds-button[role]:focus,
.slds button.slds-button:focus {
	box-shadow: var(--outline-focus);
}

/* Button Neutral Contrast Ratio */
.slds a.slds-button.slds-button--neutral,
.slds button.slds-button.slds-button--neutral {
	border-color: var(--accessible-input-border-color);
}

.slds a.slds-button.slds-button--neutral:focus,
.slds button.slds-button.slds-button--neutral:focus,
.slds a.slds-button.slds-button--neutral:hover:not([disabled]),
.slds button.slds-button.slds-button--neutral:hover:not([disabled]) {
	box-shadow: var(--outline-focus);
}

.force .btn-secondary {
	border: 1px solid var(--accessible-input-border-color);
}

/* Inverse Button Contrast Ratio */
/* Updated SLDS styling for old syntax */
.slds .slds-button.slds-button--icon-inverse:focus {
	outline: none;
	color: #f3f3f3;
	-webkit-box-shadow: 0 0 3px #f3f3f3;
	box-shadow: 0 0 3px #f3f3f3;
	border: 1px solid #f3f3f3;
}

/* Datepicker Contrast Ratio between "today" & date number */
/* Prior to NDS version 1.12.25 */
td[role='gridcell'] > span.slds-day.selectable,
/* NDS version 1.12.25 and later */
td[aria-disabled='false'] > span.slds-day {
	color: var(--color-text-default);
}

/* Datepicker underline "today" */
div.slds-datepicker > button.slds-button.slds-align_absolute-center.slds-text-link:hover,
div.slds-datepicker > button.slds-button.slds-align_absolute-center.slds-text-link:focus {
	text-decoration: underline;
}

/* Datepicker Non-Text Contrast for today's date state */
/* More information can be found in DGT-2392 */
nds-calendar .slds-datepicker tbody > tr > td.slds-is-today:not(.slds-is-selected) > .slds-day {
	background-color: transparent;
	color: var(--brand-accessible, #0176d3);
}

nds-calendar
	.slds-datepicker
	tbody
	> tr
	> td.slds-is-today:not(.slds-is-selected)
	> .slds-day::after {
	background-color: var(--brand-accessible, #0176d3);
	border-radius: 50%;
	bottom: 0.3rem;
	content: '';
	display: block;
	height: 0.25rem;
	left: 50%;
	position: absolute;
	transform: translateX(-50%);
	width: 0.25rem;
}

/* Input fields Contrast Ratio */
.slds input.slds-input,
.slds textarea.slds-textarea,
.slds select.slds-select,
.force .content-body input,
.force .content-body select,
.force .content-body textarea {
	border-color: var(--accessible-input-border-color);
}

/* Input fields focus/hover state Contrast Ratio */
.slds input.slds-input:focus,
.slds input.slds-input:not([disabled]):hover,
.slds textarea.slds-textarea:focus,
.slds textarea.slds-textarea:not([disabled]):hover,
.slds select.slds-select:focus,
.slds select.slds-select:not([disabled]):hover,
.force .content-body input:focus,
.force .content-body input:hover:not([disabled]),
.force .content-body select:focus,
.force .content-body select:hover:not([disabled]),
.force .content-body textarea:focus,
.force .content-body textarea:hover:not([disabled]) {
	box-shadow: var(--outline-focus);
}

/* Checkboxes Contrast Ratio */
.slds .slds-checkbox span.slds-checkbox--faux,
.slds-scope .slds-checkbox span.slds-checkbox_faux {
	border-color: var(--accessible-input-border-color);
}

.slds .slds-checkbox input[type='checkbox']:focus + .slds-checkbox--faux,
.slds .slds-checkbox input[type='checkbox']:focus ~ .slds-checkbox--faux,
.slds .slds-checkbox input[type='checkbox']:focus + .slds-checkbox_faux,
.slds .slds-checkbox input[type='checkbox']:focus ~ .slds-checkbox_faux,
.slds .slds-checkbox--toggle input[type='checkbox']:focus + span.slds-checkbox--faux,
.slds .slds-checkbox--toggle input[type='checkbox']:focus ~ span.slds-checkbox--faux,
.slds-scope .slds-checkbox input[type='checkbox']:focus + .slds-checkbox__label .slds-checkbox_faux, /* SSFB */
.slds-checkbox input[type='checkbox']:focus ~ .slds-checkbox_faux  /* inputForm */ {
	outline: none;
	box-shadow: var(--slds-c-checkbox-shadow, var(--outset-focus));
}

.slds .slds-checkbox--toggle input[type='checkbox']:focus:checked + span.slds-checkbox--faux,
.slds .slds-checkbox--toggle input[type='checkbox']:focus:checked ~ span.slds-checkbox--faux {
	background-color: var(--brand-accessible-active);
}

/* Disabled Checkboxes Contrast Ratio */
.slds .slds-checkbox [type='checkbox'][disabled] + .slds-checkbox--faux:after,
.slds .slds-checkbox [type='checkbox'][disabled] ~ .slds-checkbox--faux:after,
.slds .slds-checkbox [type='checkbox'][disabled] + .slds-checkbox_faux:after,
.slds .slds-checkbox [type='checkbox'][disabled] ~ .slds-checkbox_faux:after {
	border-color: var(--accessible-input-border-color);
}

/* Radio Buttons Contrast */
.slds .slds-radio--button-group,
.slds .slds-radio--button + .slds-radio--button {
	border-color: var(--accessible-input-border-color);
}

.slds .slds-radio--button input[type='radio']:not([disabled]) ~ .slds-radio--faux:hover,
.slds .slds-radio--button input[type='radio']:focus ~ .slds-radio--faux {
	box-shadow: var(--inset-focus);
}

/* Dropdown elements Contrast Ratio */
.slds li.slds-dropdown__item > a:focus,
li.slds-dropdown__item > a:focus,
li.slds-listbox__item > .slds-listbox__option:focus,
.force .sub-navigation-overflow .dropdown-menu > li > a:focus {
	box-shadow: var(--inset-focus);
}

/* Lookup elements Contrast Ratio */
.slds li.slds-lookup__item > a[aria-selected='true'],
.slds li.slds-lookup__item > a:hover,
.slds li.slds-lookup__item > a:focus {
	box-shadow: var(--inset-focus);
}

/* Lookup dropdown container */
.slds-scope div.slds-dropdown {
	border-color: var(--accessible-input-border-color);
}

/* Any element that needs 3:1 contrast on focus and hover */
.force .sub-navigation a.item:hover,
.force .sub-navigation a.item:focus,
.force button.btn:not([disabled]):hover,
.slds
	button.slds-button:not(.slds-radio--button, [disabled], .slds-button--icon-inverse, .slds-button_icon-inverse):hover {
	box-shadow: var(--outline-focus);
}

/* Modals rendered in nCino UI */
.slds nds-modal .slds-backdrop,
nforce-modal .slds-backdrop[nFORCE-modal_modal] {
	background: var(--slds-c-backdrop-color-background);
}

/* Links that only use color to distinguish against surrounding text need 3:1 contrast with the color of the surrounding text. */
.slds .slds-table td.slds-cell-wrap,
.slds .slds-table th.slds-cell-wrap {
	color: var(--color-text-default);
}

/* Visible focus for horizontal navigation tabs */
.slds-tabs_default .slds-tabs_default__nav .slds-tabs_default__item .slds-tabs_default__link:focus {
	text-decoration: underline;
}

/* Accessibility help instructions for rich text editor */
.slds .slds-form-element__help {
	color: var(--color-text-default);
}

/* Dual Listbox options container */
.slds div.slds-dueling-list__options,
.slds-scope div.slds-dueling-list__options {
	border-color: var(--accessible-input-border-color);
}

/* Bootstrap styled links need an accessible color and more accessible visible focus state */
.force .content-body a {
	color: var(--brand-accessible)
}

.force .content-body a:focus {
	outline-offset: 1px;
	margin-left: 2px;
}

ul.message-list{
	list-style-type: disc;
	padding-left: 1rem;
}