@import '_content/Microsoft.FluentUI.AspNetCore.Components/css/reboot.css';

:root {
	--text-white: #fff;
	--background-gray: #dedede;
	--background-main1: #90243b;
	--background-main2: #610c1f;
	--text-gray: #686666;
	--text-brown-light: #be8d97;
	--text-brown-dark: #8f233a;
	--background-light-gray: #ebebeb;
	--brown-dark-2: #E0AFAF;
	--brown-deepdark: #7D2235;
	--brown-light-2: #EDDDDD;
	--main-font: "Times New Roman", sans-serif;
	--error-background: #FFDBDB;
}
::selection {
	background-color: var(--background-main1);
	color: var(--text-white);}

/*          Quill           */

.ql-font-times-new-roman {
	font-family: 'Times New Roman';
}

.ql-font-arial {
	font-family: Arial;
}

.ql-font-verdana {
	font-family: Verdana;
}

.ql-font-georgia {
	font-family: Georgia;
}

.ql-font-courier-new {
	font-family: 'Courier New';
}


.ql-size-12 {
	font-size: 12px;
}

.ql-size-14 {
	font-size: 14px;
}

.ql-size-16 {
	font-size: 16px;
}

.ql-size-18 {
	font-size: 18px;
}

.ql-size-20 {
	font-size: 20px;
}

.ql-size-24 {
	font-size: 24px;
}

.ql-picker {
	height: max-content !important;
}

.ql-align-center {
	text-align: center;
}

.ql-align-right {
	text-align: right;
}

.ql-align-justify {
	text-align: justify;
}

li[data-list="bullet"] {
	list-style-type: disc;
}

/*        Quill end           */


.mw-50 {
	min-width: 50px;
}

.mw-70 {
	min-width: 70px;
}

.mw-100 {
	min-width: 100px;
}

.mw-120 {
	min-width: 120px;
}

.mw-130 {
	min-width: 130px;
}

.mw-140 {
	min-width: 140px;
}

.mw-160 {
	min-width: 160px;
}

.mw-200 {
	min-width: 200px;
}

.mw-275 {
	min-width: 275px;
}

.mw-340 {
	min-width: 340px;
}

.mw-400 {
	min-width: 400px;
}

.mw-500 {
	min-width: 500px;
}


body {
	--fill-color:#efefef;
	--body-font: "Segoe UI Variable", "Segoe UI", sans-serif;
	--accent-fill-rest: #000;
	--neutral-fill-stealth-rest: #e8e8e8;


	font-family: var(--body-font);
	font-size: var(--type-ramp-base-font-size);
	line-height: var(--type-ramp-base-line-height);
	margin: 0;
}

.navmenu-icon {
	display: none;
}

#appHeader {
	background:var(--background-main1);
	color: var(--text-white);
	cursor: default;
	height: 60px !important;
}

#appHeader a {
	color: var(--text-white);
	text-decoration: none;
	font-weight: normal;
}

#appHeader a:hover {
	color: var(--text-brown-light);
}

#app-header-stack {
	align-items: center !important;
}

.app-link:not(:last-of-type)::after {
	margin-left: 5px;
	margin-right: 5px;
	content: " | ";
	color: var(--text-white);
}

#appTitle {
	color: #ffffff;
	font-size: 1.4rem;
	font-weight: normal;
	margin-left: 20px;
}

#appDesc {
	color: var(--brown-light-2);
	font-weight: normal;
}

.page-header {
	padding-right: 15px;
	padding-left: 15px;
	margin-right: auto;
	margin-left: auto;
	max-width: 1000px;
	margin-top: 1em;
	margin-bottom: 1.5em;
	font-size: 28px;
	font-weight: bold;
}

.page-center {
	padding-right: 15px;
	padding-left: 15px;
	margin-right: auto;
	margin-left: auto;
	max-width: 1000px;
	margin-top: 30px;
}

.empty-content-cell {
	border: 0 !important;
}

.error {
	color: red;
}

.main {
	min-height: calc(100dvh - 96px);
	color: var(--neutral-foreground-rest);
	align-items: stretch !important;
}

.body-content {
	align-self: stretch;
	height: calc(100dvh - 96px) !important;
	display: flex;
	padding: 0.5rem 1.5rem;
}

.content {
	align-self: stretch !important;
	width: 100%;
}

.manage {
	width: 100dvw;
}

footer {
	background: var(--neutral-layer-4);
	color: var(--neutral-foreground-rest);
	align-items: center;
	padding: 10px 10px;
}

footer a {
	color: var(--neutral-foreground-rest);
	text-decoration: none;
}

footer a:focus {
	outline: 1px dashed;
	outline-offset: 3px;
}

footer a:hover {
	text-decoration: underline;
}

.fluent-dialog-header {
	padding:0 0 1em!important 0;
}

#blazor-error-ui {
	background: lightyellow;
	bottom: 0;
	box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
	display: none;
	left: 0;
	padding: 0.6rem 1.25rem 0.7rem 1.25rem;
	position: fixed;
	width: 100%;
	z-index: 1000;
	margin: 20px 0;
}

#blazor-error-ui .dismiss {
	cursor: pointer;
	position: absolute;
	right: 0.75rem;
	top: 0.5rem;
}

.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::before {
	content: "An error has occurred. "
}

.navmenu {
	/*background-color: var(--brown-light-2);*/

	padding: 3px 5px;
}

.expander {
	/*background-color: var(--brown-light-2);*/
}

.expander > .positioning-region {
	/*background: var(--brown-light-2) !important;*/
}

.expander > .positioning-region:hover {
	background: var(--text-brown-light) !important;
}

.expander .positioning-region svg {
	fill: var(--background-main1) !important;
}

.profile-menu {
	background-color: #f0f1f3 !important;
}

.profile-item > .positioning-region {
	background-color: #f0f1f3 !important;
}

.form-label {
	padding-left: 1em;
	padding-top: 7px;
	display: inline-block;
	font-size: 14px;
}

.form-button {
	box-shadow: rgba(45, 35, 66, 0.2) 0 2px 4px, rgba(45, 35, 66, 0.15) 0 7px 13px -3px, var(--brown-dark-2) 0 -3px 0 inset !important;
}

.form-button:hover {
	box-shadow: rgba(45, 35, 66, 0.3) 0 4px 8px, rgba(45, 35, 66, 0.2) 0 7px 13px -3px, var(--brown-dark-2) 0 -3px 0 inset !important;
}

.form-profile-toolbar {
	text-align: right;
}

.btn_main {
	box-shadow: rgba(45, 35, 66, 0.3) 0 4px 8px, rgba(45, 35, 66, 0.2) 0 7px 13px -3px, var(--text-brown-dark) 0 -3px 0 inset !important;
}

.nav-menu {
	background-color: var(--brown-light-2) !important;
	padding: 3px 5px;
}

.fluent-nav-link > .positioning-region {
	color: var(--background-main1);
	background-color: transparent !important;
	border-radius: 3px !important;
}

.fluent-nav-link > .positioning-region::before {
	 background: var(--text-white) !important;
}

.fluent-nav-link .fluent-nav-icon {
	fill: var(--background-main1) !important;
}

.fluent-nav-link > .positioning-region:hover {
	background-color: var(--text-brown-light) !important;
}

.fluent-nav-link.active > .positioning-region {
	background-color: var(--background-main1) !important;
}

.fluent-nav-expand-icon {
	fill: var(--background-main1) !important;
}

.loading-progress {
	position: relative;
	display: block;
	width: 8rem;
	height: 8rem;
	margin: 20vh auto 1rem auto;
}

.loading-progress circle {
	fill: none;
	stroke: #e0e0e0;
	stroke-width: 0.6rem;
	transform-origin: 50% 50%;
	transform: rotate(-90deg);
}

.loading-progress circle:last-child {
	stroke: #1b6ec2;
	stroke-dasharray: calc(3.141 * var(--blazor-load-percentage, 0%) * 0.8), 500%;
	transition: stroke-dasharray 0.05s ease-in-out;
}

.loading-progress-text {
	position: absolute;
	text-align: center;
	font-weight: bold;
	inset: calc(20vh + 3.25rem) 0 auto 0.2rem;
}

.loading-progress-text:after {
	content: var(--blazor-load-percentage-text, "Loading");
}

code {
	color: #c02d76;
}

.lang-list {
	display: inline-block;
	min-width: 120px;
}

.lang-link, .link-top {
	text-decoration: none !important;
	font-size: 0.8rem;
	color: #e1defa;
	cursor: pointer;
	text-transform: uppercase;
	margin-left: 8px !important;
	margin-right: 8px !important;
	font-weight: bold;
}

.lang-active {
	color: #ffffff !important;
	text-decoration: none !important;
	font-size: 0.8rem;
	cursor: default;
	font-weight: bold;
	border-bottom: solid 2px #ffffff;
	text-transform: uppercase;
	margin-left: 8px !important;
	margin-right: 8px !important;
}


.mpass-button {
  border: 2px solid #099cc1;
  background-color: #1aa2c2;
  border-radius: 5px;
  cursor: pointer;
  padding: 0.8em 1.2em 0.8em 1em;
  transition: all ease-in-out 0.2s;
  color: #fff;
  font-weight: 600;
	font-size: 16px;
	margin-top:1em;
	width:320px;
}

.mpass-button:hover {
  background-color: #027590;
	border-color: #027590;
}

.mpass-logo {
	background-image: url(images/mpass-logo64.png);
	height: 64px;
	width: 208px;
	display: inline-block;
	margin-bottom:10px
}


.ico {
	display: inline-block;
	position: relative;
	width: 1.25rem;
	height: 1.25rem;
	margin-right: 0.75rem;
	background-size: cover;
}

.ico-person {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' viewBox='0 0 16 16'%3E%3Cpath d='M8 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6Zm2-3a2 2 0 1 1-4 0 2 2 0 0 1 4 0Zm4 8c0 1-1 1-1 1H3s-1 0-1-1 1-4 6-4 6 3 6 4Zm-1-.004c-.001-.246-.154-.986-.832-1.664C11.516 10.68 10.289 10 8 10c-2.29 0-3.516.68-4.168 1.332-.678.678-.83 1.418-.832 1.664h10Z'/%3E%3C/svg%3E");
}

.ico-Status-1 {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%2300FF00' viewBox='0 0 16 16'%3E%3Cpath d='M8 0a8 8 0 1 0 0 16A8 8 0 0 0 8 0Zm1.5 11.5H6.5v-1h3v1Zm0-2.5H6.5V4h3v5Z'/%3E%3C/svg%3E");
}

.fluent-data-grid {
	border: 1px solid var(--brown-light-2) !important;
}

.fluent-data-grid th, .fluent-data-grid .col-sort-button::part(control) {
	/*background-color: var(--brown-light-2) !important;*/
	/*color: var(--background-main1);*/
}

.fluent-data-grid th {
	border-bottom: 1px solid var(--text-brown-light) !important;
}

.fluent-data-grid tr {
	/*color: var(--background-main1);*/
}

.fluent-data-grid .fluent-selected {
	/*background-color: var(--brown-light-2) !important;*/
	background-color: #f0f0f0;
	/*color: var(--background-main1) !important;*/
	color: #000000 !important;
}

.grid-toolbar {
	display: flex;
	align-items: flex-end !important;
	flex-wrap: wrap;
}

.grid-toolbar > .form-cell {
	margin-bottom: 0;
}

.grid-toolbar fluent-button::part(control), .form-action.btn-action::part(control) {
	background: var(--text-brown-dark);
	color: var(--text-white);
}

.form-action {
	margin: 10px;
}

.grid-quicksearchpanel fluent-button::part(control) {
	background: var(--text-brown-dark);
	color: var(--text-white);
}

.grid-quicksearchpanel fluent-button svg {
	fill: #fff !important;
}

.grid-quicksearchpanel fluent-text-field::part(root) {
	border: 1px solid var(--background-main1);
	border-radius: 3px;
}

.grid-quicksearchpanel fluent-text-field::part(control) {
	color: var(--brown-deepdark);
}

.grid-quicksearchpanel fluent-text-field::part(control)::placeholder {
	color: var(--text-brown-light);
}

.fluent-dialog-header .fluent-typography {
	color: var(--background-main1) !important;
}

#dialog_close::part(control) {
	background: none;
}

.fluent-dialog-header svg {
	fill: var(--brown-deepdark) !important;
}

.form-label {
	color: var(--background-main2);
}

.btn_save, .btn_save_and_close, .btn_close {
	background-color: var(--brown-light-2);
	color: var(--brown-deepdark);
}

.form-section, .cc-block, .cc-important-warning {
	/*width: 100%;*/
	padding: 10px 10px 20px 10px;
	margin: 10px;
	border-radius: 10px;
	/*background: var(--brown-light-2);*/
	background: #EBEBEB;
}

.form-section-label, .main-logs-title {
	background-color: transparent !important;
	color: var(--background-main1) !important;
	border-bottom: 2px solid var(--background-main1);
	margin-bottom: 10px;
}

.header-gutters {
	margin: 0 !important;
}

.approve-reminder {
	color: #0d47a1;
	background: #e3f2fd;
	border: 1px solid #90caf9;
	padding: 10px;
}

.cc-form-row {
	display: flex;
	gap: 2rem;
	width: 100%;
}

.cc-form-row:not(:last-of-type) {
	margin-bottom: 20px;
}

.cc-form-row > * {
	flex: 1;
}

.cc-form-comp {
	display: flex;
	flex-direction: column;
}

.cc-form-comp > .fluent-input-label, .form-label-top {
	color: var(--background-main1) !important;
	font-weight: 600 !important;
}

.req::after {
	content: "*";
	color: red;
	margin-left:5px;
}

.cc-form-comp > fluent-text-field {
	min-width: 300px;
	width: 100%;
}

.cc-doc-status > p {
	text-align: center;
}

.cc-doc-status > p:first-of-type {
	color: var(--background-main1) !important;
	font-weight: 600 !important;
	margin-bottom: 5px !important;
}

.cc-doc-status {
	display: flex;
	flex-direction: column;
	justify-content: center;
	width: 200px;
}

.cc-select-multiple {
	max-height: 300px;
}

.cc-selected-block {
	display: flex;
	flex-wrap:wrap;
	gap: 10px;
}

.cc-selected-value {
	padding: 5px 10px;
	background-color: var(--background-main1);
	color: var(--text-white);
	border-radius: 15px;
}

fluent-option.selected {
	background-color: var(--background-main1);
	color: var(--text-white);
}

fluent-option.selected::before {
	background: var(--text-white) !important;
}

fluent-option:active, fluent-option:not(.selected):hover {
	background: var(--brown-light-2);
}

fluent-option.selected:hover {
	opacity: 0.8;
}

fluent-option:active::before {
	background: var(--background-main1);
}


.cc-doc-status-draft {
	border-radius: 10px;
	background-color: #FFD1AD;
	color: #FF7100 !important;
	font-weight: 600 !important;
	padding: 3px 7px;
	text-align: center;
}

fluent-radio.checked::part(control) {
	background: var(--background-main1);
}

.cc-form, .main-block {
	padding-bottom: 10px;
}

.inputfile-content {
	padding: 10px 0;
}

.cc-label-brown {
	color: var(--background-main1) !important;
	font-weight: 600 !important;
}

.cc-icon {
	fill: var(--background-main1) !important;
}

.cc-label-small {
	font-size: 0.75rem !important;
}

.fluent-inputfile-container {
	border: 2px dashed var(--background-main1) !important;
}

.inputfile-progress {
	color: var(--background-main1);
}

fluent-progress::part(progress), fluent-progress::part(determinate) {
	background-color: var(--background-main1) !important;
}

.cc-btn-save::part(control), .cc-btn-update::part(control) {
	background: #1BD10A !important;
	color: var(--text-white);
}

.cc-btn-save::part(control):hover, .cc-btn-update::part(control):hover {
	background: #18B309 !important;
	transition: all 300ms ease-in;
}

.cc-btn-cancel::part(control) {
	background: #BF2424 !important;
	color: var(--text-white);
}

.cc-btn-cancel::part(control):hover {
	background: #991818 !important;
	transition: all 300ms ease-in;
}

.cc-form-footer {
	padding-top: 15px;
	border-top: 1px solid var(--brown-light-2);
	margin: 20px 10px 10px 10px;
	display: flex;
	justify-content: flex-end;
	gap: 15px;
}

.cc-file-list {
	display: flex;
	flex-direction: column;
	padding: 20px 0;
	gap: 10px;
}

.cc-file-uploaded {
	display: flex;
	gap: 10px;
}

.cc-file-uploaded:not(:last-of-type) {
	border-bottom: 1px solid var(--background-main1);
}

.cc-filename {
	color: var(--background-main1);
	font-weight: 600;
}

.cc-listbox {
	background-color: #fbfbfb;
}

fluent-checkbox::part(control) {
	background: #fff;
}

.nest-item-checkbox::part(content-region) {
	margin-inline-start: 6px;
}

.nest-item-checkbox::part(positioning-region), .nest-item-checkbox::part(content-region) {
	min-height: max-content;
}

.all-checkbox {
	margin-inline-start: 6px;
	min-height: max-content;
	margin-top: 5px;
}

/*.all-checkbox > span {*/
.all-checkbox-text {
	font-weight: 600;
	text-decoration: underline;
}

.cc-listbox fluent-tree-item.selected::part(positioning-region), .cc-listbox fluent-tree-item::part(positioning-region):hover {
	background: #fbfbfb;
}

.cc-listbox fluent-tree-item.selected:not(.nested)::part(positioning-region)::before, .cc-listbox fluent-tree-item.selected::after {
	content: none !important;
}

.cc-listbox {
	max-height: 300px;
	max-width: 100%;
	min-width: 0;
	overflow-y: auto;
	border-radius: 4px;
}

.fluent-input-label {
	color: var(--background-main1) !important;
	font-weight: 600 !important;
}

fluent-checkbox.checked::part(control) {
	background: var(--background-main1); 
}

.cc-listbox-row {
	display: flex;
	flex-direction: row;
	background: white;
	justify-content: space-between;
	flex-wrap: wrap;
}

.loading-content {
	position: absolute;
	left:0;
	top: 0;
	z-index: 1000;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 100vw;
	height: 100vh;
	background-color: rgba(255, 255, 255, 0.5);
	backdrop-filter: blur(5px);
	-webkit-backdrop-filter: blur(5px);
}


.form-layout-5 {
	grid-template-columns: repeat(5, 1fr);
}

.form-cell {
	align-content: start;
}

.cc-btn::part(control) {
	background: var(--text-brown-dark);
	color: var(--text-white);
}

.cc-btn::part(control):hover {
  background: var(--brown-deepdark);
  transition: all 500ms ease-in;
}

.two-action-btns {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
	/*justify-content: space-between;*/
}



.btn-action svg {
	fill: var(--text-white) !important;
}


.cc-page-form, .form {
	position: relative;
	left: 0;
	right: 0;
	bottom: 0;
	top: 0;
}

.validation-message {
	color: red;
	font-weight: 600;
}

fluent-text-field.invalid::part(root) {
	outline: 1px solid red !important;
}

.footer-copyright {
	display: flex;
	align-items: center;
	gap: 10px;
	height: 30px;
	background: var(--background-main1);
	width: 100%;
	height: 40px;
	padding: 10px;
}

.copyright-text {
	margin: 0;
	height: 100%;
	align-content: center;
	color: var(--text-brown-light);
	font-size: 13px;
}

.footer {
	padding: 0;
}

.validation-errors, .cc-form-errors {
	/*background-color: #FFDBDB;*/
	margin: 0 10px;
	border-radius: 10px;
	border: 1px solid red;
	/*background-color: #fff;*/
}

.cc-error-li {
	color: red;
}

#DenominationLength {
	margin-top: 10px;
}

.doc-subtitle {
	display: flex;
	flex-wrap: wrap;
	line-height: 11px;
	gap: 5px;
}

.doc-subtitle-text {
	display: inline-block;
	font-size: 0.7rem;
	white-space: nowrap;
}

.main-grid, .cc-grid-container {
	overflow-x: auto;
	display: flex;
	flex-direction: column;
}

.cc-data-grid td {
	height: 100% !important;
/*	overflow-x: auto !important;*/
/*	scrollbar-width: thin;*/
/*	--webkit-scrollbar-width: thin;*/
	text-overflow: unset !important;
	white-space: wrap !important;
}

.doc-subtitle-text:not(:last-of-type)::after {
	content: "|";
	margin-left: 5px;
}

.doc-title {
	font-weight: 600 !important;
	/*color: var(--background-main1) !important;*/
}

.doc-title:hover {
	cursor: pointer;
	color: var(--background-main1) !important;
}

.cc-status {
	text-align: center;
	border-radius: 10px;
	padding: 2px 10px;
	width: max-content;
}

.cc-status-1 {
	background-color: #FFF3DB;
}

.cc-status-2 {
	background-color: #FFD896;
}

.cc-status-3 {
	background-color: #60E354;
	color: #ffffff !important;
}

.cc-status-4 {
	background-color: #FF7575;
	color: #ffffff !important;
}

.cc-status-5 {
	background-color: #9FBA52;
	color: #ffffff !important;
}

.actions-column:not(th) {
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
	line-height: 5px;
}

.actions-column svg {
	border-radius: 3px;
}

.cc-form-footer > fluent-button::part(content) {
	display: flex;
	align-items: center;
	padding: 0 5px;
	gap: 5px;
}

.cc-form-footer svg {
	fill: #ffffff !important;
}

.action-edit::part(control) {
	background: #FFD28C;
}

.action-edit svg {
	fill: #E38A00 !important;
}

.action-send::part(control) {
	background: #FFE780;
}

.action-send svg {
	fill: #FF9D14 !important;
}


.action-approve::part(control) {
	background: #ABFFC0;
}

.action-approve svg {
	fill: #05B02F !important;
}


.action-reject::part(control) {
	background: #FFABAB;
}

.action-reject svg {
	fill: #D91616 !important;
}


.action-preview::part(control) {
	background: #348AD1;
}

.action-preview svg {
	fill: #fff !important;
}

.action-preview-history::part(control) {
	background: #53BCED;
}

.action-preview-history svg {
	fill: #fff !important;
}

.action-delete::part(control) {
	background: red;
}

.action-delete svg {
	fill: #fff !important;
}

.btn-doc-action:hover, .change-resp-btn:hover {
	opacity: 0.8;
}

.change-resp-btn::part(control) {
	background: #FFD28C;
}

.change-resp-btn {
	height: 20px;
}

.statistics-stack {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	margin: 20px 0;
	gap: 40px;
}

.statistics-card {
	display: flex;
	gap: 10px;
	background-color: #fff;
	border-radius: 5px;
}

.statistics-line {
	width: 5px;
	/*background-color: var(--background-main1);*/
}

.statistics-header svg {
	/*fill: var(--background-main1) !important;*/
}

.statistics-header-text {
	/*color: var(--background-main1);*/
	font-weight: 600;
	font-size: 1rem;
}

.statistics-content {
	display: flex;
	flex-direction: column;
	padding: 25px 0;
}

.statistics-header {
	display: flex;
	gap: 7px;
}

.statistics-body {
	display: flex;
	flex-direction: column;
}

.statistics-direction {
	display: flex;
}

.statistics-number {
	height: 28px;
	font-size: 2.2rem;
	margin: 15px 0;
	color: var(--background-main1);
	font-weight: 600;
}

.statistics-name {
	color: #696868;
}

.statistics-grow {
	font-size: 1rem;
	color: #219C21;
}

.statistics-neutral {
	font-size: 1rem;
	color: #348AD1;
}

.statistics-fall {
	font-size: 1rem;
	color: red;
}

.body-content {
	background-color: #f5f5f5;
}

.dialog-success::part(control) {
	border: 3px solid #0BB30B;
}

.dialog-failure::part(control) {
	border: 3px solid red;
}

.oper-result-d-body {
	display: flex;
	flex-direction:column;
	justify-content: center;
	align-items: center;
	gap: 10px;
}

.oper-result-d-footer {
	grid-area: dialog-footer;
	background: none;
	justify-content: flex-end;
}

#choice-dialog::part(control) {
	border: 3px solid red;
}

#choice-dialog-header-info {
	color: var(--background-main1);
	font-size: 24px;
}

#choice-dialog-body, .change-person-body {
	min-height: max-content;
	display: flex;
	gap: 10px;
}

#choice-dialog-body > .form-cell {
	margin: 0;
}

#choice-dialog-body-info {
	margin: 0;
}

#choice-dialog-footer, .change-person-footer {
	justify-content: end !important;
}

.reject-document-body .form-cell {
	width: 100%;
}

.critical-btn::part(control) {
	color: #fff;
	background: red;
}

.warning-btn::part(control) {
	color: #fff;
	background: orange;
}

.case-info-body {
  background-color: #fff;
  padding: 7px;
}

.case-info-header {
	text-align: center;
	font-size: 1.2rem;
	margin: 10px 0;
	padding-bottom: 10px;
	border-bottom: 2px solid var(--background-main1);
}

.case-date {
	font-weight: 600;
}

.case-nr {
	background-color: var(--background-main1);
	color: var(--text-white);
	padding: 0 5px;
	font-weight: 600;
}

.case-descr {
	  font-size: 1rem;
   line-height: 22px;
	  margin-bottom: 10px;
}

.case-author {
	font-size: 0.8rem;
	margin-bottom: 10px;
	padding-bottom: 10px;
	border-bottom: 2px solid var(--background-main1);
}

.main-doc, .related-docs {
	display: flex;
	flex-direction: column;
	padding-bottom: 10px;
	border-bottom: 2px solid var(--background-main1);
}

.main-doc > ol, .related-docs > ol {
  margin: 0;
}

.doc-filename, .doc-link {
	color: var(--background-main1);
	text-decoration: none;
}

.doc-filename:hover, .doc-link:hover {
	color:var(--background-main1);
	cursor: pointer;
	text-decoration: underline;
}

.main-doc-type, .related-doc-type {
	font-weight: 600;
 font-size: 0.8rem
}

.doc-text {
  margin-top: 10px;
}

.doc-text p {
  margin: 0;
}

.doc-not-found  {
	text-align: center;
	font-size: 2rem;
	margin-top: 20px;
	color: var(--background-main1);
	font-weight: 600;
}

.preview_iframe {
	width: 100%;
	height: calc(100% - 15px);
	-webkit-overflow-scrolling:touch;
}

.dialog-select {
	width: 100%;
}

.dialog-primary-action::part(control) {
	background: var(--background-main1) !important;
	color: var(--text-white);
}

.cc-btn-send-approval::part(control), .cc-btn-urgent-publish::part(control) {
	background: #E69717;
	color: white;
}

.cc-btn-send-approval::part(control):hover, .cc-btn-urgent-publish::part(control):hover {
	background: #D1840D;
	transition: all 300ms ease-in;
}

.cc-btn-preview::part(control) {
	background: #348AD1;
	color: #fff;
}

.cc-btn-preview::part(control):hover {
	background: #2A7CBF;
	transition: all 300ms ease-in;
}




.cc-file-actions {
	display: flex;
	gap: 10px;
}

.cc-file-list {
	margin-left: 20px;
}

.cc-file-title {
	font-weight: 600;
	color: var(--background-main1);
	font-size: 1.2rem;
	text-decoration: underline;
	line-height: 23px;
}

.cc-error {
	width: 100%;
	height: max-content;
	padding: 5px;
	border: 2px solid red;
	text-align: center;
	font-weight: 500;
	color: red;
	background-color: var(--error-background);
}

.cc-success {
	color: #4CAF50;
	font-weight: 500;
	font-size: 1rem;
}

.cc-error-form {
	color: red;
}

.cc-listbox {
	display: flex;
	gap: 10px;
} 

.relevant-docs-grid {
	display: flex;
	flex-direction: column;
	gap: 10px;
	max-width: 100%;
	overflow: hidden;
}

.cc-access-denied, .items-not-found {
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 1.5rem;
	font-weight: 500;
	color: var(--background-main1);
}

.cc-multiple-select {
	background: white;
	height: 32px;
	padding: 5px;
	width: 200px;
	border-bottom: 1px solid #929292;
	border-radius: 3px;
	overflow: hidden;
	position: relative;
}

.cc-multiple-select:hover {
	cursor: pointer;
}

.cc-multiple-select .form-lookup-btn {
	right: unset;
	position: relative;
}

.cc-ms-selected {
	display: flex;
	justify-content: space-between;
}

.cc-ms-options {
	position: relative;
}

.cc-ms-options > .cc-listbox {
	position: absolute;
	display: flex;
	flex-direction: column;
	gap: 5px;
	margin-top: 5px;
	width: 200px;
	/*transform: translateX(-5px);*/
	border-radius: 5px;
	z-index: 10;
	max-height: 200px;
	border: 1px solid #929292;
}

.cc-ms-selected-value {
	max-height: 22px;
	max-width: 160px;
	overflow: hidden;
}

.cc-wrong-message {
	color: red;
	font-size: 1.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
}

.nest-item-checkbox, .nested-checkbox {
	max-width: 100%;
	min-width:0;
	text-wrap: wrap;
}

.report-stack {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 30px;
}

.report-item {
	display: flex;
	flex-direction: column;
	/*max-width: 300px;*/
	border-left-style: solid;
	border-left-width: 3px;
	padding:15px;
	border-radius: 3px;
}

.report-item-header {
	display: flex;
	gap: 10px;
	font-weight: 600;
	font-size: 1.2rem;
}

.report-description {
	margin-top: 10px;
}

.report-footer {
	display: flex;
	gap: 20px;
	margin-top: auto;
	padding-top: 10px;
}

.btn-report-generate::part(control) {
	background: #02A12A;
	color: #fff;
	font-weight: 600;
}

.btn-report-generate::part(control):hover {
	background: #008A23;
	transition:all 200ms ease-in;
}

.btn-report-generate svg {
	fill: #fff !important;
}

.btn-report-export::part(control) {
	background: #C7C7C7;
	font-weight: 600;
}

.btn-report-export::part(control):hover {
	background: #BABABA;
	transition: all 200ms ease-in;
}

.cc-page-header {
	margin: 10px 0 30px 0;
	color: var(--background-main1);
	text-align: center;
}

.report-table, .report-td, .report-th {
	border: 1px solid black;
	padding: 5px 10px;
	text-align: center;
}

.report-table {
	width: 100%;
	margin-top: 30px;
}

.report-total-tr, .report-th {
	background-color: #C9C9C9;
	font-weight: 700;
}

.report-dialog-header {
	font-weight: 600;
	font-size: 1.4rem;
	color: var(--background-main1) !important;
	text-align: center;
}

.report-dialog-footer {
	justify-content: end !important;
}

#notifications-by-role-body {
	display: flex;
	flex-wrap: wrap;
}

.case-history-block {
	display: flex;
	flex-direction: column;
	gap: 15px;
	padding: 10px 0;
}

.case-history-item {
	display: flex;
	gap: 20px;
	padding: 10px;
	border: 1px solid var(--background-main1);
	border-radius: 5px;
}

.case-history-username {
	font-weight: 600;
}

.case-history-date {
	font-size: 0.75rem;
}


.report-dialog::part(control) {
	width: 90% !important;
}

.report-content {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px;
}


.report-param-dialog-body {
	display: flex;
	flex-direction:column;
}

.cc-important-warning {
	background-color: #fff;
	border: 1px solid red;
	padding: 10px;
	color: red;
	font-weight: 600;
	text-align: center;
	position: sticky;
	z-index: 15;
	top: 10px;
}

.case-not-visible-block {
	display: flex;
	flex-direction: column;
}

.case-not-visible-text {
	margin: 5px 0;
	background-color: var(--error-background);
	color:red;
	text-align: center;
	font-weight: 600;
}

.case-not-visible-btn::part(control) {
	background: #52BA69;
	color: #fff;
	height: 25px;
}

.case-not-visible-btn::part(control):hover {
	opacity: 0.8;
}

.case-not-visible-btn svg {
	fill: #fff !important;
}

.close-ico-btn, #form-message-btn {
	width: 30px !important;
	height: 30px;
	fill: #fff !important;
	border-radius: 3px;
}

.close-ico-btn {
	background-color: var(--background-main1);
}

#form-message-btn {
	background-color: #FFAD3B;
}

#form-help-btns {
	position: sticky;
	top:0;
	margin-right: 10px;
	z-index:20;
	display: flex;
	justify-content: flex-end;
	gap: 10px;
}

#denomination-editor .blazored-editor {
	min-height: 200px; /* 8 rows */
	max-height: 500px;
}

#denomination-editor .ql-editor {
	max-height: 500px;
}

#title-editor .blazored-editor {
	min-height: 50px;
	max-height: 200px;
}

#title-editor .ql-editor {
	max-height: 200px;
}

#denomination-editor, #title-editor {
	height: max-content;
}

.ql-toolbar, .blazored-editor {
	background-color: #fff;
}

.ql-toolbar {
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
}

.blazored-editor {
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
}

.form-field, .picklist-container {
	border-radius: 4px;
}

#appHeaderStack {
	align-items: center !important;
}

.notification-badge-icon {
	fill: var(--background-main1) !important;
}

.notification-badge {
	background-color: var(--brown-light-2) !important;
	border: 1px solid var(--brown-light-2) !important;
	color: #000 !important;
}

.main-logs-block {
	margin: 10px 0;
	padding: 10px;
	background-color: #fff;
	border-radius: 5px;
	box-shadow: 0 0 10px 0 #cccccc;
}

.main-logs-title {
	display: block;
	font-size: 1.2rem;
	font-weight: 600;
	padding-bottom: 5px;
	margin-bottom: 15px;
}

.main-logs-list {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.main-logs-item {
	display: flex;
	gap: 15px;
}

.main-logs-info {
	display: flex;
	flex-direction: column;
}

.main-logs-username {
	font-weight: 600;
}

.main-logs-date {
	font-size: 0.75rem;
}

.main-filters, .doc-btns, .filter-btns {
	display: flex;
}


.doc-btns, .filter-btns {
	margin-bottom: 5px;
	gap: 10px;
}

.cc-data-grid td {
	background-color: #fff;
}

#file-input-div:hover, #file-input:hover, .cc-file-title:hover {
	cursor: pointer;
}

.search-relevant-btns {
	align-content: end;
}

fluent-tree-item > fluent-tree-item {
	margin-left: 34px;
}

#tree-solution-types .nest-tree-item::part(content-region) {
	/*margin-inline-start: 6px;*/
}


.case-not-published-info {
	font-weight: 600;
	color: red;
	text-decoration: underline;
}

.cc-danger-header {
	color: red;
	font-size: 1.4rem;
}

.cc-danger-text {
	color: red;
	font-size: 1rem;
	font-weight: 500;
}

.cc-danger-btn::part(control) {
	background: red;
	color: #fff;
	border: 1px solid #fff;
}

.cc-close-btn::part(control) {
	border: 1px solid #000;
}

.cc-danger-btn::part(control):hover {
	background: #c40000;
	transition: all 250ms ease-in;
}

#change-person-title {
	color: var(--background-main1);
	font-size: 24px;
	line-height:32px;
	font-weight: 400;
}

.change-person-header {
	padding: 0 !important;
}

#returned-doc-block {
	display: flex;
	flex-direction: column;
	margin: 10px;
	padding: 10px;
	border: 2px solid red;
	border-radius: 10px;
}

#returned-doc-title {
	font-weight: 600;
	color:red;
}

.doc-title > p {
	font-weight: 600;
	margin: 0;
}

.case-descr > p, .relevant-doc-title > p {
	margin: 0;
}

.doc-link p {
	margin: 0;
}

#title-editor .ql-formats {
	width: 100%;
	margin:0;
}

#title-editor .ql-script {
	width: 100%;
	display: flex;
	justify-content: center;
}

#file-section-content {
	display: grid;
	grid-template-columns: 2fr 4fr;
}

#file-table {
	grid-template-columns: 2fr 1fr 0.7fr !important;
	border-radius: 4px;
}

td.file-table-actions {
	display: flex;
	justify-content: space-around;
}

th.file-table-actions {
	display: flex;
	justify-content: center;
	width: 100%;
}

th.file-table-actions > div {
	width: 100%;
	justify-content: center !important;
}

th.file-table-actions .col-title {
	text-align: center !important;
}

.col-sort-button {
	height: max-content;
}

.col-sort-button::part(control){
	background: none;
}

.cc-grid-column {
	text-overflow: unset !important;
	word-wrap: anywhere !important;
	overflow: auto !important;
}

.cc-grid-column .col-title-text {
	overflow: visible !important;
	white-space: wrap !important;
}

#file-table td, #file-table tr {
	height: max-content !important;
}

#file-table td {
	height: 100% !important;
	scrollbar-width: thin;
	--webkit-scrollbar-width: thin;
}

.change-person-body {
	flex-direction: column;
}

#file-frame {
	height: calc(100% - 112px);
}

.download-file-btn::part(control) {
	color: #fff;
	background: var(--background-main1);
}

#pagination {
	display: flex;
	justify-content: space-between;
	margin-top: 10px;
	margin: 10px 1em;
}

#pag-pages, #pag-pages-info {
	display: flex;
	align-items: center;
	gap: 8px;
}

#pag-summary {
	display: flex;
	flex-direction: column;
	gap: 7px;
}

#pag-items-per-page {
	display: flex;
	align-items: center;
}

#add-file-btn {
	width: max-content;
}

#add-file-btn::part(control) {
	background: var(--background-main1);
	color: #fff;
}

#add-file-btn::part(control):hover {
	opacity: 0.8;
}

.cc-grid-container:not(.users-container) .column-header, .main-grid .column-header {
	text-overflow: unset !important;
	word-wrap: anywhere !important;
	overflow: auto !important;
	white-space: normal !important;
}


.grid thead th .col-title-text {
	white-space: normal !important;
	overflow: visible !important;
	text-overflow: unset !important;
}

.grid thead th > div {
	flex-wrap: wrap !important;
}

.grid-paginator {
	margin: 0.5rem 0 !important;
}

.search-dictionary-values {
	display: flex;
	align-items: center;
	gap: 7px;
	width: 100%;
	margin-bottom: 10px;
}

.search-dictionary-values-label {
	font-weight: 600;
	color: var(--background-main1);
}

.cc-primary-btn::part(control) {
	background: var(--background-main1);
	color: #fff;
}

.search-dictionary-values-input {
	width: 250px;
}

.form-lookup { 
	display: flex;
	flex-wrap: nowrap;
	min-height:32px;
}

.form-lookup-item {
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
	max-width: calc(100% - 20px);
}

.fluent-dialog-header-text {
	font-size: 24px;
	font-weight: 400;
	font-family: var(--body-font);
	color: var(--background-main1);
}

.cc-input-label {
	display: block;
	margin-bottom: 3px;
	color: var(--background-main1);
	font-weight: 600;
}

.cc-textarea {
	width: 100%;
}

.fluent-dialog-footer {
	display: flex;
	justify-content: flex-end !important;
}

.fluentui-counterbadge {
  background-color: var(--background-main1) !important;
  border: 1px solid #fff !important;
}

#notifications-btn::part(control) {
  background: var(--background-main1) !important;
  border: 1px solid #fff;
}

#environment-label {
  background-color: red;
  padding: 5px;
  border-radius: 8px;
}






/*            media             */

@media(max-width: 1499px){
	#appHeader {
		height: 70px !important;
	}

	.body-content {
		height: calc(100dvh - 106px) !important;
	}

	.main {
		min-height: calc(100dvh - 106px);
	}

	nav.sitenav {
		width: 100%;
		height: 100%;
	}

	#main-menu {
		width: 100% !important;
	}

	#main-menu > div:first-child:is(.expander) {
		display: none;
	}

	/*.navmenu {
		width: 100%;
	}*/

	#navmenu-toggle {
		appearance: none;
	}

	#navmenu-toggle ~ nav {
		display: none;
	}

	#navmenu-toggle:checked ~ nav {
		display: block;
	}

	.navmenu-icon {
		cursor: pointer;
		z-index: 10;
		display: block;
		position: absolute;
		top: 50px;
		left: 20px;
		/*right: 20px;*/
		width: 20px;
		height: 20px;
		border: none;
	}

	[dir="rtl"] .navmenu-icon {
		left: 20px;
		right: unset;
	}

	.report-stack {
		grid-template-columns: 1fr 1fr;
	}
}

@media(max-width: 1285px) {
	.grid-toolbar, .grid-quicksearchpanel {
		margin-top: 20px;
	}
}

@media(max-width: 1060px) {
	#appHeader {
		height: 90px !important;
	}

	.body-content {
		height: calc(100dvh - 126px) !important;
	}

	.main {
		min-height: calc(100dvh - 126px);
	}

	#appDesc {
		margin-left: 20px;
	}

	.link-top, #appMenu {
		margin: auto;
	}

	.navmenu-icon {
		top: 70px;
	}
}

@media(max-width: 999px){
	.report-stack {
		grid-template-columns: 1fr;
	}
}


@media (max-width: 600px) {
	[dir="rtl"] .header-gutters {
		margin: 0.5rem 1.5rem 0.5rem 3rem !important;
	}

	.main {
		flex-direction: column !important;
		row-gap: 0 !important;
	}
}