﻿@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');

/**===== .net5 =====*/
@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');



:root {
		--dxbl-toolbar-color: var(--sbs-hover-background-color) !important;
		--fd-blue: #00456f;
		--fd-blue-hover: #003b5e;
		--verification-z-index: 999;
		--popup-duration: 0.3s;
		--transition-duration: 0.4s;
		--sbs-button-bar-height: 34.5px;
		--sbs-button-bar-icon-size: 16px;
		--sbs-title-element-height: 32px;
		--bs-primary: var(--fd-blue);
}

.efg-fullscreen.efg-fullscreen {
	position: fixed;
	width: auto;
	height: auto;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 999;
}

	.efg-titlebar-hamburger-icon {
		background-color: transparent;
		color: white;
	}

	.efg-pointer:hover {
		cursor: pointer;
		background-color: color(from currentcolor srgb r g b / 0.1);
	}

	.efg-disabled {
		opacity: 0.5;
	}

	.efg-no-padding {
		padding: 0 !important;
	}

	.efg-no-border {
		border: 0 !important;
	}

	.efg-no-background {
		background-color: transparent !important;
		background: none !important;
	}

	.efg-svg-style {
		fill: var(--fd-blue);
		stroke: var(--fd-blue);
	}

	.efg-cust-cal-month-dropdown {
		max-height: 320px !important;
	}

		.efg-cust-cal-month-dropdown .dxbl-listbox {
			max-height: 320px !important;
		}

	.efg-combobox-dropdown, .efg-combobox-dropdown .dxbl-list-box-render-container {
		max-height: 295px !important;
	}

	.cabinets-combobox-dropdown table thead, .efg-operators-dropdown table thead {
		display: none;
	}

	.no-table-head thead {
		display: none;
	}

	.cabinets-combobox-dropdown td:last-child {
		text-align: right;
	}

	button-bar svg.iconic.iconic-sm:not(.iconic-size-md):not(.iconic-size-lg),
	button-bar svg.iconic.iconic-size-sm, button-bar img {
		width: var(--sbs-button-bar-icon-size);
		height: var(--sbs-button-bar-icon-size);
	}

	.efg-operators-dropdown td:first-child {
		text-align: center;
	}

	.efg-context-menu-icon {
		width: 1.2rem;
		height: 1.2rem;
	}

	.context-menu-item:active,
	.context-menu-item:focus {
		background-color: #e8e9e9 !important;
		color: black !important;
		outline: none !important;
		box-shadow: none !important;
	}

	.dxbl-btn-toolbar {
		bottom: 0 !important;
	}

	.dxbl-btn-primary {
		background-color: var(--fd-blue) !important;
		border-color: var(--fd-blue) !important;
		background-image: none !important;
		box-shadow: none !important;
	}

		.dxbl-btn-primary:hover {
			background-color: var(--fd-blue-hover) !important;
			border-color: var(--fd-blue-hover) !important;
		}

	.dxbl-btn-outline-primary {
		color: var(--fd-blue);
		background-color: transparent;
		border-color: var(--fd-blue);
	}

		.dxbl-btn-outline-primary:hover {
			background-color: var(--fd-blue-hover) !important;
			border-color: var(--fd-blue-hover) !important;
		}

	.dxbl-btn-text-primary {
		color: var(--fd-blue);
		background-color: unset;
	}

		.dxbl-btn-text-primary:hover {
			background-color: var(--fd-blue-hover) !important;
			border-color: var(--fd-blue-hover) !important;
		}

	.efg-search-profiles-list {
		height: auto;
	}

	efg-search-pofile, efg-binder {
		display: flex;
		gap: 10px;
		width: 200px;
	}

	.efg-display-none {
		display: none !important;
	}

	.efg-hidden {
		visibility: hidden;
	}

	.efg-rotate-left {
		transform: rotate(-90deg);
	}
	/* Scrollbar style (same as PDF Tron)*/
	* {
		scrollbar-width: thin;
	}

	::-webkit-scrollbar {
		width: 7px;
		height: 7px;
	}

	::-webkit-scrollbar-thumb {
		border-radius: 10px;
		background-color: #adb5bd;
		border-top: 2px solid transparent;
	}

	::-webkit-scrollbar-track {
		width: 10px;
		border-radius: 10px;
		background: none;
	}
	/* END Scrollbar style*/
	/*MS: avoids button toolbar height moving when rendered, e.g. when selecting New Document */
	.dxbs-toolbar-adaptive {
		height: 34px;
		transition: none;
	}

	.sbs-2fa-ok-button {
		margin: 1rem;
	}

	@keyframes cabinets-dropdown {
		from {
			opacity: 0;
		}

		99% {
			opacity: 0;
		}

		to {
			opacity: 1;
		}
	}
	/* MS: avoids popups aligning left instead of centering on small devices */
	@media (max-width: 576px) {
		.dxbs-modal > .dxbs-popup.dxbs-popup-adaptivity {
			justify-self: unset;
		}
	}

	div.k-pane > p:first-child {
		display: none;
	}

	.dxbl-toolbar {
		--dxbl-toolbar-btn-hover-bg: var(--sbs-hover-background-color) !important;
	}

	.dxbs-context-menu-item.dropdown-item .dxbs-context-menu-item-icon {
		width: 18px;
		height: 18px;
	}

	html, body {
		font-family: Arial, Helvetica, sans-serif;
		margin: 0px;
		overflow: hidden;
		font-size: 16px;
	}

	@media (max-width: 500px), (max-height: 500px) {
		html, body {
			font-size: 14px;
		}
	}

	.sbs-display-none {
		display: none;
	}

	.sbs-round-border {
		border: 1px solid dimgray;
		border-radius: 50%;
	}

	.sbs-inlay-icon-container {
		position: relative;
	}

	.sbs-inlay-icon {
		position: absolute;
		right: -2px;
		bottom: -1px;
		width: calc(0.9*var(--sbs-button-bar-icon-size)) !important;
		height: calc(0.9*var(--sbs-button-bar-icon-size)) !important;
		border-radius: 50%;
		background-color: white;
		padding: 1px;
	}

	.btn, .form-control, .col-form-label-sm, .table-sm, .table-sm td, .table-sm th, .dropdown-menu {
		font-size: 1rem;
	}

	.dx-tabs-content-panel {
		flex: 1 1;
		height: 0;
		/*box-shadow: 0px -5px 10px -5px lightgrey;*/
	}

	input[list]::-webkit-calendar-picker-indicator {
		display: none !important;
	}
	/*Style sheet for PDFTron WebViewer*/
	div.App button:not(.OverlayButton) div.Icon {
		color: var(--fd-blue) !important;
		height: 20px;
		width: 20px;
	}

	.k-splitter {
		border-width: 0;
	}

	.revisions-dropdown td, .revisions-dropdown th {
		padding: 0 10px;
		user-select: none;
	}

		.revisions-dropdown td:nth-child(2), .revisions-dropdown td:nth-child(3) {
			text-align: end;
		}

	dialog-buttons {
		display: flex;
		justify-content: end;
		padding: 7px 0;
	}

		dialog-buttons button {
			border: none;
			color: var(--sbs-button-color);
			background-color: transparent;
			margin: 0 5px;
			user-select: none;
		}

	.navigation-bar .nav {
		flex-wrap: unset;
	}

	.btn.disabled, .btn:disabled {
		opacity: .4;
	}

	spinning-wheel {
		display: block;
		width: 25px;
		height: 25px;
		border: 3px solid;
		border-color: var(--sbs-icon-fd-blue);
		border-top-color: transparent;
		border-radius: 50%;
		animation: spin 1s linear infinite;
	}

	@keyframes spin {
		100% {
			transform: rotate(360deg);
		}
	}

	.dxbs-toolbar-group:nth-child(n+1)::before {
		content: '';
		/*border-left: 1px solid lightgray;*/
	}

	.dxbs-toolbar-group:nth-child(n+2)::before {
		transform: translateX(-10px);
	}

	button {
		background-color: var(--sbs-button-background-color);
		border-radius: 0px;
	}

		button:focus {
			outline: 2px auto lightblue;
		}

	button-bar button:focus, button-bar button:focus-visible {
		outline: none !important;
		-webkit-box-shadow: none !important;
		box-shadow: none !important;
	}
	/**===== pages button toolbar =====*/
	button-bar {
		display: flex;
		justify-content: space-between;
		align-items: center;
		height: var(--sbs-button-bar-height);
		flex: 0 0 var(--sbs-button-bar-height);
		gap: 5px;
	}

		button-bar > *:not(label) {
			height: 28px !important;
		}

	dxbl-window {
		translate: 0 30px;
	}
	/**===== pages button toolbar =====*/

	.docstate-new-glyph::before {
		display: block;
		content: '*';
		font-size: 30px;
		height: 10px;
		color: var(--sbs-docstate-new-color);
		transform: translateY(-11px);
	}
	/* Disable text selection*/
	.disableTextSelection {
		-webkit-user-select: none; /* Chrome all / Safari all */
		-moz-user-select: none; /* Firefox all */
		-ms-user-select: none; /* IE 10+ */
		user-select: none;
	}

	a, .btn-link {
		color: #0366d6;
	}

	.btn-primary {
		color: #fff;
		background-color: #1b6ec2;
		border-color: #1861ac;
	}

	.content {
		padding-top: 1.1rem;
	}

	.valid.modified:not([type=checkbox]) {
		outline: 1px solid #26b050;
	}

	.invalid {
		outline: 1px solid red;
	}

	.validation-message {
		color: red;
	}

	#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;
	}

		#blazor-error-ui .dismiss {
			cursor: pointer;
			position: absolute;
			right: 0.75rem;
			top: 0.5rem;
		}
	/**===== log-out =====*/
	.log-out-transform {
		transform: scale(-1.25,1.25) translateY(-2px);
	}
	/**===== rectangle-bounce =====*/

	.loading-screen span img {
		width: 100px;
		height: 100px;
		margin-bottom: 10px;
	}

	.rectangle-bounce {
		text-align: center;
		height: 0;
		flex: 0 0 40px;
		margin: 20px 0px 12px 0px;
	}

		.rectangle-bounce div {
			height: 100%;
			width: 7px;
			margin: 0 3px 0 0;
			background-color: #fff;
			display: inline-block;
			-webkit-animation: stretchdelay 1.2s infinite ease-in-out;
			animation: stretchdelay 1.2s infinite ease-in-out
		}

		.rectangle-bounce .rect2 {
			-webkit-animation-delay: -1.1s;
			animation-delay: -1.1s
		}

		.rectangle-bounce .rect3 {
			-webkit-animation-delay: -1.0s;
			animation-delay: -1.0s
		}

		.rectangle-bounce .rect4 {
			-webkit-animation-delay: -0.9s;
			animation-delay: -0.9s
		}

		.rectangle-bounce .rect5 {
			-webkit-animation-delay: -0.8s;
			animation-delay: -0.8s
		}

	@-webkit-keyframes stretchdelay {
		0%, 40%, 100% {
			-webkit-transform: scaleY(0.4)
		}

		20% {
			-webkit-transform: scaleY(1)
		}
	}

	@keyframes stretchdelay {
		0%, 40%, 100% {
			transform: scaleY(0.4);
			-webkit-transform: scaleY(0.4)
		}

		20% {
			transform: scaleY(1);
			-webkit-transform: scaleY(1)
		}
	}
	/**===== rectangle-bounce =====*/

	.dxbl-fl.dxbl-fl-loading {
		opacity: 1 !important;
	}

	.loading-screen {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		width: 100%;
		height: 100%;
		text-align: center;
		color: #fff;
		background-color: var(--fd-blue);
	}

	.login-screen {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		width: 100vw;
		height: 100vh;
		color: black;
		background-color: var(--fd-blue);
	}

	.btnTest {
		width: 16px;
		height: 16px;
		background-image: url('https://api.iconify.design/oi-home.svg');
		margin: 0 8px 0 0;
	}

	.login-header-logo {
		height: 64px;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 0.5em
	}
	/* MainLayout (header,footer,main,aside) */
	#container {
		height: 100vh;
		width: 100vw;
		display: flex;
		flex-direction: column;
	}

	#main {
		padding: 0px;
		display: -webkit-flex;
		display: flex;
		-webkit-flex-flow: row;
		flex-flow: row;
		flex: 1;
		height: 0px;
	}

		#main article {
			order: 2;
			height: 100%;
			position: relative;
		}


	header, footer {
		flex: 0 1 0;
	}

	header {
		background: var(--fd-blue);
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		padding: 5px;
		z-index: 20;
		box-shadow: 0 0 10px 0 rgb(0 0 0);
	}

		header.sMAIL-header {
			background: #3e3e3d;
		}

	#header-logo {
		/* explicit width and height needed for transition to work */
		width: 130px;
		height: 40px;
		margin: 0 8px;
		object-fit: contain;
		object-position: center;
		transition: width 0.3s;
	}

	header .btn-primary {
		color: black;
		background-color: white;
	}

		header .btn-primary:hover {
			background-color: white;
		}

		header .btn-primary svg:hover {
			background-color: var(--sbs-hover-background-color);
		}

	@media all and (max-width: 501px) {
		header {
			gap: 10px;
			padding: 10px;
		}

		#header-logo {
			display: none;
		}

		titlebar-buttons {
			margin-left: auto;
			margin-right: auto;
		}
	}
	/* Too narrow to support three columns */
	@media all and (max-width: 640px) {

		#main, #page {
			-webkit-flex-flow: column;
			flex-direction: column;
		}

			#main > article {
				/*			Return to document order */
				order: 0;
				width: 100%;
			}

		.main-splitter > efg-splitter-pane {
			height: unset;
		}

		header {
			flex-wrap: wrap;
		}
	}

	@media all and (max-width: 750px) {

		#header-logo {
			width: 0;
			margin: 0 5px;
		}
	}


	#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;
	}

		#blazor-error-ui .dismiss {
			cursor: pointer;
			position: absolute;
			right: 0.75rem;
			top: 0.5rem;
		}

	@media (min-width: 768px) {
		app {
			flex-direction: row;
		}

		.sidebar {
			width: 250px;
			height: 100vh;
			position: sticky;
			top: 0;
		}

		.main > div {
			padding-left: 2rem !important;
			padding-right: 1.5rem !important;
		}

		.navbar-toggler {
			display: none;
		}

		.sidebar .collapse {
			/* Never collapse the sidebar for wide screens */
			display: block;
		}
	}
