html {
	font-family: 'Open Sans', sans-serif;
	height: 100%;
}

body {
	font-family: 'Open Sans', sans-serif;
	height: 100%;
	overflow: auto;
	background-color: #f7f7f7;
}

a,
.btn-link {
	color: #006bb7;
}

.btn-primary {
	color: #fff;
	background-color: #1b6ec2;
	border-color: #1861ac;
}

.btn:focus,
.btn:active:focus,
.btn-link.nav-link:focus,
.form-control:focus,
.form-check-input:focus {
	box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

.content {
	padding-top: 0;
}

/*.content > *:first-child {
	margin-top: 1.1rem;
}*/

h1:focus {
	outline: none;
}

.valid.modified:not([type=checkbox]) {
	outline: 1px solid #26b050;
}

.invalid {
	outline: 1px solid #e50000;
}

.validation-message {
	color: #e50000;
}

.blazor-error-boundary {
	background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
	padding: 1rem 1rem 1rem 3.7rem;
	color: white;
}

.blazor-error-boundary::after {
	content: "An error has occurred."
}

.darker-border-checkbox.form-check-input {
	border-color: #929292;
}

.b-layout-sider {
	padding: 1rem;
	background: var(--st-background);
}

.fui-DialogSurface .fui-DialogBody .fui-DialogActions {
	justify-content: center;
}

.fui-CloseButton {
	border: 1px solid #EAEAEA;
	border-radius: 16px;
	padding: 4px;
}

.fui-Checkbox {
	color: #000000;
}

.fui-Checkbox__indicator {
	border-width: var(--strokeWidthThick) !important;
}

.fui-Button.fui-Button-primary.primary:not(.fui-Button-sm) {
	border-radius: var(--borderRadiusCircular);
	padding: 10px 10px;
	min-height: 42px;
	min-width: 42px;
}

.fui-Button.fui-Button-secondary.secondary {
	border-radius: var(--borderRadiusCircular);
	background: white;
	border-color: #EAEAEA
}

.fui-Button.fui-Button-secondary.secondary:not(.fui-Button-sm) {
	padding: 0.625rem;
}

.fui-Select__select {
	border-radius: 1000px;
	height: 2rem;
	border: 1px solid #EAEAEA;
	font-weight: 600;
}

.fui-Select__select[disabled] {
	outline: none;
	border-color: #EAEAEA;
	color: var(--colorNeutralForegroundDisabled);
}

.fui-Select__select + .fui-Select__icon {
	color: #000000;
}

.fui-Select__select[disabled] + .fui-Select__icon {
	opacity: 0.5;
}

.fui-Select:focus-within::after {
	transform: scale(0);
}

.fui-CloseButton .fui-CloseButton__icon {
	display: none;
}

/*Resets*/
.fs-border-unset {
	border: unset !important;
}

.fs-p-unset {
	padding: unset !important;
}

.fs-height-unset {
	height: unset !important;
	min-height: unset !important;
}

/*Text Utitilies*/
.fs-text-nowrap {
	white-space: nowrap;
	text-transform:capitalize;
}

/*Flex Utitilies*/
.fs-flex {
	display: flex;
}

.fs-flex-row {
	flex-direction: row
}

.fs-flex-column {
	flex-direction: column
}

.fs-justify-content-center {
	justify-content: center
}

.fs-justify-content-end {
	justify-content: end
}

.fs-justify-content-between {
	justify-content: space-between
}

.fs-align-items-center {
	align-items: center
}

/*Margin Utitilies*/
.fs-mr-10 {
	margin-right: 10px
}

.fs-ml-10 {
	margin-left: 10px
}

.fs-mt-10 {
	margin-top: 10px
}

.fs-mb-10 {
	margin-bottom: 10px
}

/*Position Utitilies*/
.fs-relative {
	position: relative;
}

.fs-absolute {
	position: absolute;
}

.fs-nav-menu {
	margin-right: 0.5rem;
	margin-bottom: 0.15rem;
}

.fs-framework-button {
	border-radius: var(--borderRadiusCircular);
	padding: 10px 10px;
	font-size: 12px;
	white-space: nowrap;
	margin-right: 1rem;
	display: flex;
	height: 2rem;
	background: #FAFAFA;
	border-color: #EAEAEA;
	font-family: 'Open Sans', sans-serif;
	font-weight: 600;
	color: #000000;
}

.fs-framework-button-icon {
	margin-right: 0.6rem;
	margin-bottom: 0.06rem;
}

.fs-row-button-container {
	display: flex;
	align-items: center;
	float: right;
}

.fs-row-button-container-img {
	margin-right: 1rem;
}

.fs-datagrid-header-font {
	font-family: 'Open Sans', sans-serif;
	font-weight: 600;
	color: #555555;
}

.fs-datagrid-row-font {
	font-family: 'Open Sans', sans-serif;
	font-weight: 600;
	color: #14131D;
	white-space: pre-wrap;
}

.fs-multiline-text {
	white-space: pre-wrap;
	word-wrap: break-word;
	overflow-wrap: break-word;
	max-height: 200px;
	overflow-y: auto;
}

.fui-Input:has(#assessmentNumber) {
	border: none;
	padding: 0;
	justify-content: center;
	background-color: transparent;
}

.fui-Input {
	border-radius: 100rem;
}

/* Style the scrollbar track */
::-webkit-scrollbar {
	width: 0.5rem;
	right: -0.5rem;
	height: 0.5rem;
}

/* Style the scrollbar thumb */
::-webkit-scrollbar-thumb {
	background-color: #142834;
	border-radius: 0.625rem;
	border: 0.125rem solid #fff;
}

/* Style the scrollbar thumb on hover */
::-webkit-scrollbar-thumb:hover {
	background-color: #555;
}

/* Style the scrollbar track */
::-webkit-scrollbar-track {
	background: #E9EAF0;
	border-radius: 0.625rem;
}

.close-button-body {
	text-align: center;
}

.modal-button-secondary#CustomButton {
	width: 100%;
	border-color: #142834;
	color: #142834;
}

.modal-button-secondary {
	width: 100%;
}

.table-row-selected {
	color: white;
	background-color: #142834;
}

.fs-width-fit-content {
	width: fit-content;
}

.fs-min-width-max-content {
	min-width: max-content;
}

.fs-overflow-y-auto {
	overflow-y: auto;
}

.fs-overflow-x-auto {
	overflow-x: auto;
}

.fs-font-size-10 {
	font-size: 10px;
}

.fs-ml-8 {
	margin-left: 0.5rem;
}

.fs-min-h-zero#BarHeader {
	min-height: 0;
}

.fs-max-width {
	width: 100%;
}

.fs-max-height {
	height: 100%;
}

/* Global text wrap rule */
.text-wrap-ellipsis {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: normal;
	position: relative;
	word-break: auto-phrase
}

.splitter-horizontal {
	display: flex;
	flex-direction: row;
}

.splitter-gutter {
	background-color: #eee;
	background-repeat: no-repeat;
	background-position: 50%;
}

.splitter-gutter.splitter-gutter-horizontal {
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAeCAYAAADkftS9AAAAIklEQVQoU2M4c+bMfxAGAgYYmwGrIIiDjrELjpo5aiZeMwF+yNnOs5KSvgAAAABJRU5ErkJggg==);
	cursor: col-resize;
}

.fs-mouse-click-cursor {
	cursor: pointer;
}

.text-wrap-ellipsis:hover::after {
	opacity: 1;
}

.fs-max-left {
	margin-left: auto;
}

.fs-disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

.fs-overflow-x-auto {
	overflow-x: auto;
}

.fs-display-none {
	display: none;
}

.widget-panel-container {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
}

/* Global outer scroll fix */

/* Base layout structure */
html,
body {
	height: 100%;
	margin: 0;
	padding: 0;
	overflow: auto;
	box-sizing: border-box;
}

/* Main layout container */
.b-layout {
	display: flex;
	flex-direction: column;
	height: 100vh;
	width: 100%;
	overflow: auto;
}

/* Content area with proper scrolling */
.b-layout-content {
	display: flex;
	flex-direction: column;
	/*	-ms-overflow-style: none;*/
	/* IE and Edge */
	/*	scrollbar-width: none;*/
	/* Firefox */
	height: var(--st-layout-content-height);
	overflow-y: scroll;
}

.b-layout.b-layout-has-sider>section.b-layout {
	overflow-y: hidden;
}

/*.b-layout-content::-webkit-scrollbar {
	display: none;
}*/

/* Main scrollable area - adjust padding bottom to make room for pagination */
.b-layout-content>div:not(.layout-header) {
	flex: 1;
	overflow: auto;
	position: relative;
	padding-bottom: 60px;
}

/* Custom pagination container - fix positioning */
.custom-pagination-container {
	position: sticky;
	bottom: 0;
	left: 0;
	width: 100%;
	background-color: #f7f7f7;
	/* Match your page background */
	z-index: 10;
	padding: 10px 0;
	margin-top: 10px;
	box-shadow: 0 -4px 6px -2px rgba(0, 0, 0, 0.05);
	/* Optional: subtle shadow */
}

/* Target any element that contains pagination elements to ensure visibility */
div[class*="pagination"],
div[id*="pagination"],
.b-layout-content>div>div:last-child {
	position: sticky;
	bottom: 0;
	background-color: #f7f7f7;
	z-index: 10;
	margin-top: auto;
}

/* Styling for ValidationError when used with Blazorise MemoEdit component */
.fui-Textarea.fui-Textarea-error + .fui-Field__validationMessage {
	color: var(--colorPaletteRedForeground1);
	margin-top: var(--spacingVerticalXXS);
	font-family: var(--fontFamilyBase);
	font-size: var(--fontSizeBase200);
	font-weight: var(--fontWeightRegular);
	line-height: var(--lineHeightBase200);
	padding-left: calc(12px + var(--spacingHorizontalXS));
}

.fui-Textarea.fui-Textarea-error + .fui-Field__validationMessage .fui-Field__validationMessageIcon {
	display: inline-block;
	font-size: 12px;
	margin-left: calc(-12px - var(--spacingHorizontalXS));
	margin-right: var(--spacingHorizontalXS);
	line-height: 0;
	vertical-align: -1px;
}

/* Allows Blazorise.Tooltip elements to appear next to labels instead of below */
.fui-Label > .fui-Tooltip {
	display: inline;
	vertical-align: middle;
}

.modal-top-spaced {
	padding-top: 4rem;
}

.modal-dialog-top-spaced {
	margin-top: 2rem;
}

.fui-DialogSurface .fui-DialogBody .fui-DialogActions {
	margin-top: 1rem;
	flex-direction: row;
	flex-wrap: nowrap;
}

.fui-DialogSurface .fui-DialogBody.fui-DialogBody-sm .fui-DialogActions {
	flex-direction: column;
}

.fui-DialogBody .fui-DialogActions > .fui-Button,
.fui-DialogBody .fui-DialogActions > .stream-button__container,
.fui-DialogBody .fui-DialogActions > .stream-button__container > .fui-Button {
	width: 100%;
}

button.fui-Button.fui-Button-disabled,
button.fui-Button-primary.fui-Button-disabled,
button.fui-Button-secondary.fui-Button-disabled,
button[disabled].fui-Button,
button[disabled].fui-Button-primary,
.fui-Button-disabled {
	background-color: var(--colorNeutralBackgroundDisabled) !important;
	color: var(--colorNeutralForegroundDisabled) !important;
	border-color: var(--colorNeutralStrokeDisabled) !important;
	pointer-events: none !important;
	opacity: 0.5 !important;
	cursor: not-allowed !important;
}

button[disabled],
button.disabled,
.btn[disabled],
.btn.disabled {
	pointer-events: none !important;
	opacity: 0.5 !important;
	cursor: not-allowed !important;
}