:root {
	--main-color: #446CB3;
	--additional-color: #385ea0;
	--main-color-rgb: 68, 108, 179; /* Только RGB значения */
}

html {
	position: relative;
	min-height: 100%;
}

.container-fluid {
	min-height: calc(100lvh - 65px);
}
/*Максимальнавя ширина select в таблице jqgrid*/
.ui-jqgrid-bdiv table select[role="select"]{
	max-width: 90%;
}

/*исправление черты у popover при масштабировании*/
.popover.right>.arrow {
	border-right: none;
}
.popover.right>.arrow:after {
	left: 1.5px !important;
}

.popover.left>.arrow {
	border-left: none;
}
.popover.left>.arrow:after {
	right: 1.5px !important;
}

.popover.bottom>.arrow {
	border-top: none;
}
.popover.bottom>.arrow:after {
	top: 1.5px !important;
}

.popover.top>.arrow {
	border-bottom: none;
}
.popover.top>.arrow:after {
	bottom: 1.5px !important;
}
/* Custom page CSS
-------------------------------------------------- */
/* Not required for template or sticky footer method. */

body > .container {
	padding: 15px 15px 0;
	margin-right: 15px;
	margin-left: 15px;
}
.container {
	width: 95%;
}
.footer > .container {
	padding-right: 15px;
	padding-left: 15px;
}

code {
	font-size: 80%;
}

h2 { color: var(--main-color); }

/* Sticky footer styles
-------------------------------------------------- */
.footer {
	position: absolute;
	bottom: 0;
	width: 100%;
	/* Set the fixed height of the footer here */
	height: 60px;
	background-color: #f5f5f5;
}

.row {
	margin: 0;
}
.input-group-btn button:not(:last-child){
	border: 1px solid #cccccc !important;
	border-left: none !important;
}

.btn-primary:not(.dropdown-toggle):focus,
.btn-primary {
	transition: 300ms;
	color: #fff;
	background-color: var(--main-color);
	border-color: var(--additional-color);
}

.btn-primary:hover {
	box-shadow: inset 0 0 1000px 0 rgb(0, 0, 0, 0.3);
	background-color: var(--main-color);
	border-color: var(--additional-color);
}

.btn-primary:active:hover,
.btn-primary:active {
	box-shadow: inset 0 0 1000px 0 rgb(0, 0, 0, 0.45);
	background-color: var(--main-color);
	border-color: var(--additional-color);
}
pre {
	white-space: pre-wrap !important;
	word-break: break-word !important;
}
/* BREADCRUMBS start
-------------------------------------------------- */

.breadcrumb-box {
	background: var(--main-color);
	width: 100%;
	height: 50px;
	position: fixed;
	z-index: 1199;
	top: 0px;
}
.breadcrumb {
	top: 0;
	position: fixed;
	z-index: 1200;
	box-shadow: inset 0px 50px 0 0px var(--main-color);
	height: 50px;
	width: calc(100% - 120px);
	background: var(--main-color);
	overflow: hidden;
	display: flex;
	align-items: center;
	border-radius: 0;
	padding: 5px 0 5px 15px;
	margin-bottom: 20px;
}

.breadcrumb .item {
	padding-right: 12px;
	padding-left: 12px;
	font-size: 16px;
	color: white;
	white-space: nowrap;
	position: relative;
	text-decoration: none;
	z-index: 100;
}

.breadcrumb .main { max-width: 250px !important;}
.breadcrumb .active { cursor: default;}

/* Косая черта */
.breadcrumb .item::after {
	color: #d0d0d0;
	font-weight: bold;
	content: "/\00a0";
	position: absolute;
	left: 0px;
	top: 50%;
	transform: translateY(-50%);
	z-index: 102;
}

.breadcrumb .item:first-child::after {display: none;}

@media (min-width: 1000px) {
	.is-overflow {
		text-overflow: ellipsis;
		overflow: hidden;
	}
}

.back-icon {
	display: none ;
}

@media (max-width: 1000px) {

	.breadcrumb .item:not(:last-child)::after,
	.breadcrumb .item:not(.back-icon) {
		display: none !important;
	}

	.back-icon,
	.breadcrumb .item:last-child {
		display: block !important;
	}

	.breadcrumb {
		padding-left: 50px !important;
		width: 100% !important;
	}

	.breadcrumb .item:not(.back-icon) {
		text-overflow: ellipsis;
		overflow: hidden;
	}
}
/* BREADCRUMBS end
-------------------------------------------------- */


/* MAIN MENU start
-------------------------------------------------- */

body:is(.menu-is-pin) {
	margin-left: 250px;
	width: calc(100% - 250px);
}
body {
	overflow-y: scroll;
	overflow-x: hidden;
	width: calc(100% - 60px);
	margin-top: 65px;
	margin-left: 60px;
}

#burger-checkbox{
	position: fixed;
	visibility: hidden;
}

.burger {
	top: 0;
	margin: 15px;
	cursor: pointer;
	display: none;
	position: absolute;
	border: none;
	background: transparent;
	z-index: 1420;
	width: 25px;
	height: 21px;
}

.burger::before,
.burger::after {
	content: '';
	left: 0;
	position: absolute;
	display: block;
	width: 100%;
	height: 3px;
	border-radius: 2px;
	background: white;
}

.burger::before {
	top: 0;
	box-shadow: 0 9px 0 white;
	transition: box-shadow .3s .15s, top .3s .15s, transform .3s;
}

.burger::after {
	bottom: 0;
	transition: bottom .3s .15s, transform .3s;
}

#burger-checkbox:checked + .burger::before {
	top: 9px;
	transform: rotate(45deg);
	box-shadow: 0 4.5px 0 rgba(0,0,0,0);
	background: white;
	transition: box-shadow .3s .15s, top .3s, transform .3s .15s, background .15s;
}

#burger-checkbox:checked + .burger::after {
	bottom: 9px;
	transform: rotate(-45deg);
	transition: bottom .3s, transform .3s .15s, background .15s;
	background: white;
}

#main-menu {
	width: 60px;
	height: 100lvh;
	max-height: 100lvh;
	position: fixed;
	top:0;
	left: 0;
	font-size: 14px;
	box-shadow: 0 0 8px 5px rgba(0, 0, 0, .25);
	background-color: var(--main-color);
	z-index: 1250;
	transition: 300ms ease-in-out;
	overflow: auto;
	overflow-x: hidden;
	scrollbar-width: none;
	-webkit-scrollbar-width: 0;
	-ms-overflow-style: none;
}

#main-menu .logo {
	height: 50px !important;
	width: 60px;
	z-index: 1002;
	position: fixed !important;
	margin: 0 !important;
}
#main-menu .logo .menu-label { left: 70px !important;}
#pin-menu-checkbox:checked ~ #main-menu .logo .menu-label { transition-delay: 50ms;}

#main-menu .logo .menu-text {
	font-weight: bold;
	font-size: 18px;
}

#main-menu .logo { user-select: none;}
#main-menu .logo a { height: 50%;}
#main-menu .logo img { height: 100%;}

#main-menu .line {
	z-index: 1001;
	width: 250px;
	position: fixed;
	background: linear-gradient(to bottom, rgba(var(--main-color-rgb), 1) 0%, rgba(var(--main-color-rgb), 0) 100%);
	box-shadow: -50px -60px 0px 50px var(--main-color);
	border-top: 1px solid rgb(200, 200, 200);
	margin: 50px 0 0 0;
	padding: 10px 0;
	left: -190px;
	transition: 300ms ease-in-out;
}

#main-menu .menu-list { 
	height: calc(100lvh - 140px);
	margin: 70px 10px;
}

.user-item,
#main-menu .menu-item {
	height: 40px;
	position: relative;
	list-style-type: none;
	margin: 0 0 5px 0;
	transition: 400ms;
}
.user-item .menu-icon {
	right: 15px !important;
	left: auto !important;
}
.user-item {
	position: fixed;
	z-index: 1420;
	top: 0;
	right: 0;
	width: 70px;
	height: 50px;
}
.user-avatar {
	width: 75%;
	height: 75%;
	border-radius: 50%;
}

.user-item .menu-icon,
#main-menu .menu-icon {
	width: 40px;
	height: 40px;
	position: absolute;
	left: 0;
	color:white;
}

#main-menu .menu-item,
#main-menu .menu-icon {
	border-radius: 5px;
}

#main-menu .logo,
#main-menu .menu-icon::before,
#main-menu .menu-item,
#main-menu .menu-icon,
.user-item .menu-icon,
.user-item,
.pin-menu {
	display: flex;
	align-items: center;
	justify-content: center;
}

#main-menu .menu-label{
	opacity: 0;
	width: 0;
	height: 100%;
	position: absolute;
	display: flex !important;
	align-items: center;
	transition: width 300ms linear, margin-left 300ms, opacity 100ms linear;
	margin-left: -20px;
	left: 50px;
	right: 0;
}

#main-menu .menu-label span {
	white-space: nowrap;
	pointer-events: none;
}

#main-menu .menu-text{
	margin: 0 10px 0 0;
	color: white;
}

#main-menu .badge{
	transition: 400ms !important;
	top: 25px;
	right: 0px;
	position: absolute;
	transition-delay: 800ms;
	animation-delay: 800ms;
	animation: fadeIn 800ms ease forwards !important;
}

#pin-menu-checkbox:checked ~ #main-menu .badge {
	top: auto !important;
	right: 8px !important;
	left: auto;
}

@keyframes fadeIn {
	0% {
			opacity: 0;
		}
	100% {
			opacity: 1;
		}
}

#main-menu .open-dropdown{
	opacity: 0;
	position: absolute;
	transform: none !important;
	margin: 0 !important;
	width: 100%;
	height: 40px;
	z-index: 1003;
}
#main-menu .blueelement {color: white !important;}
#main-menu .redelement {color: #ff7566 !important;}

.pin-menu {
	transition: transform 500ms !important;
	transform: rotate(270deg) !important;
	border-width: 5px 5px 0 5px !important;
	opacity: 1 !important;
	cursor: pointer;
	position: fixed;
	left: 15px !important;
	color: white;
	font-weight: 400;
	transition:  left 100ms, opacity 200ms;
	z-index: 1008;

	width: 36px;
	height: 36px;

}

.wrap-text {
	display: flex;
	height: 20px;
	align-items: center;
	position: absolute;
	left: 60px;
	bottom: 16px;
}

.wrap-item {
	left: 10px;
	bottom: 0;
	border-radius: 0 !important;
	width: 40px;
	margin-bottom: 0 !important;
	z-index: 1004;
	position: fixed !important;
	background: var(--main-color);
}
#pin-menu-checkbox:checked ~ #main-menu .pin-menu {
	transform: rotate(90deg) !important;
}

#pin-menu-checkbox:checked ~ #main-menu .wrap-item {
	transition: 500ms !important;
	width: 230px;
}

#pin-menu-checkbox {
	opacity: 0;
	position: absolute;
}

#main-menu .opened {
	box-shadow: inset 0 0 100px 0 rgba(255, 255, 255, 0.3);
}

#main-menu .user-fio {
	opacity: 0;
	width: 0;
	white-space: nowrap;
	transition-delay: 100ms;
	transition: 200ms;
	color:white;
}

#main-menu .user-line{
	transform: rotate(180deg);
	box-shadow: 50px -60px 0px 50px var(--main-color) !important;
	bottom: 40px;
}

#main-menu .logout{
	width: 15px;
	height: 15px;
	right: 0;
	display: none;
	position: absolute;
	color:white;
	z-index: 1007;
}

#main-menu .dropdown-menus {
	scrollbar-width: none;
	overflow: auto;
	background: none;
	border: none;
	box-shadow: none;
	max-height: 0;
}

#main-menu .drop-arrow {
	opacity: 0;
	width: 0;
	height: 0;
	right: 15px;
	position: absolute;
	display: inline-block;
	border-style: solid;
	border-width: 4px 4px 0 4px;
	border-color: white transparent transparent transparent;
	transform: rotate(90deg);
	transition: transform 200ms;

}

#burger-checkbox:checked ~ #main-menu .drop-arrow,
#pin-menu-checkbox:checked ~ #main-menu .drop-arrow {
	transition: opasity 300ms, transform 200ms !important;
	opacity: 1 !important;
}

#pin-menu-checkbox:checked ~ #main-menu  .menu-label { width: 180px !important;}

#pin-menu-checkbox:checked ~ #main-menu  .menu-label,
#burger-checkbox:checked ~ #main-menu .menu-label {
	margin-left: 0 !important;
	opacity: 1 !important;
}

#main-menu .dropdown .open-dropdown:checked ~ .menu-item .drop-arrow {
	transform: rotateX(0);
}

#pin-menu-checkbox:checked ~ #main-menu  .user-fio {
	width: calc(100% - 65px - 15px);
	opacity: 1 !important;
}

#pin-menu-checkbox:checked ~ #main-menu  .logout { display: block;}

#pin-menu-checkbox:checked ~ #main-menu { width: 250px !important;}


#pin-menu-checkbox:checked ~ #main-menu .line { left: 0;}

#pin-menu-checkbox:checked ~ #main-menu  .dropdown .open-dropdown:checked ~ .menu-item {
	box-shadow: inset 0 0 100px 0 rgb(0, 0, 0, 0.3);
}

/*mobile*/
@media (max-width: 1000px) {

	@media (max-width: 450px) {
		#burger-checkbox:checked ~ #main-menu {width: 100% !important;}
	}
	@media (min-width: 450px) {
		#burger-checkbox:checked ~ #main-menu { width: 350px !important;}
		.user-item { left: 290px;}
	}

	#main-menu .user-line,
	.pin-menu,
	#main-menu .wrap-item,
	#main-menu .logo {
		display: none !important;
	}
	#main-menu { transform: translateX(calc(-100% - 10px));}
	#burger-checkbox { transform: translateX(0) !important;}

	.burger {
		display: block !important;
		position: fixed;
	}
	#burger-checkbox:checked ~ .burger {position: fixed !important;}
	#burger-checkbox:checked ~ #main-menu .logout { display: block;}

	#burger-checkbox:checked ~ #main-menu .dropdown .open-dropdown:checked ~ .dropdown-menus{
		padding: 0 0 0 20px !important;
	}
	#burger-checkbox:checked ~ #main-menu .user-fio{
		width: calc(100% - 65px - 15px);
		opacity: 1 !important;
	}

	#burger-checkbox:checked ~ #main-menu .menu-label { width: 180px !important;}
	#burger-checkbox:checked ~ #main-menu .line { left: 0;}
	#burger-checkbox:checked ~ #main-menu {transform: translateX(0) !important;}

	#burger-checkbox:checked ~ #main-menu .dropdown .open-dropdown:checked ~ .menu-item {
		box-shadow: inset 0 0 100px 0 rgb(0, 0, 0, 0.3);
	}

	#burger-checkbox:checked ~ #main-menu .dropdown .open-dropdown:checked ~ .dropdown-menus {
		padding: 0 0 0 20px !important;
	}

	#burger-checkbox:checked ~ #main-menu .badge {
		top: auto !important;
		left: auto !important;
		right: 10px !important;
	}

	.menu-list {
		margin: 70px 10px !important;
		overflow: auto;
		overflow-x: hidden;
		scrollbar-width: none;
		-ms-overflow-style: none;
		max-height: calc(100lvh - 180px);
	}

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

	.user-item {
		width: 0 !important;
		transition: none;
		opacity: 0;
		right: 0 !important;
	}
	.user-item .menu-icon {
		width: 0 !important;
	}
	#burger-checkbox:checked ~ .user-item .menu-icon {
		width: 40px !important;
	}
	#burger-checkbox:checked ~ .user-item {
		width: 60px !important;
		opacity: 1 !important;
		transition: 150ms 300ms;
		position: fixed;
	}
}

/*no mobile*/
@media (min-width: 1001px) {

	.burger { display: none !important;}
	
	#main-menu .menu-item:not(.wrap-item):not(.user-item):not(.logo):hover,
	#main-menu .dropdown .open-dropdown:hover ~ .menu-item {
		box-shadow: inset 0 0 100px 0 rgba(0, 0, 0, 0.3);
	}
}

#main-menu .dropdown-menus .menu-label { width: 160px;}

#pin-menu-checkbox:checked ~ #main-menu .dropdown .open-dropdown:checked ~ .dropdown-menus {
	padding: 0 0 0 20px !important;
}

/* MAIN MENU end
-------------------------------------------------- */

/* Custom active tab background color #4FC1E9 */
.nav-tabs.nav-justified > .active > a, .nav-tabs.nav-justified > .active > a:focus, .nav-tabs.nav-justified > .active > a:hover {
	color: #FFF;
	background-color: var(--main-color);
	border: 1px solid var(--main-color);
}
.nav-tabs.nav-justified > li > a {
	border-right: 1px solid white;
	background-color: #EEE;
}
.navbar-inverse {
	background-color: var(--main-color);
	border-color: transparent;
}
.navbar-inverse .navbar-nav>li>a {
	color: #DDD;
}
.navbar-inverse .navbar-brand {
	color: white;
}

.navbar-brand > img {
	max-height: 100%;
	width: auto;
}

/* Style for busket icon in actchargeon positions table */
td.del-top {
	vertical-align: top;
	padding: 5px;
}

.redelement {
	color: #E74C3C!important;
}
.blueelement {
	color: #337ab7!important;
}
.greenelement {
	color: #28a745!important;
}
.orangeelement {
	color: #e66f00!important;
}
.greylement {
	color: grey!important;
}
.whiteelement {
	color: #fff!important;
}
.blackelement {
	color: #212529!important;
}
.del {
	text-decoration: line-through!important;
}

.plupload_logo {
	background: none
}
.plupload_header_content {
	padding: 0 10px 0 10px;
	height: auto;
}
.modal-content {
	width: auto;
}

.fm-button {height: 28px;}

.ui-jqdialog .ui-jqdialog-titlebar {
	height: 25px;
}
.select2-container {
	font-size: 14px;
}
/* тэги в одну строку */
#select2-tags-results > li[role=group] > ul{
	display: flex;
}
#select2-tags-results > li[role=group] > ul > li[role=option]{
	margin-left: 1px;
	margin-right: 1px;
}

.suggestions-mobile {
	left: 0 !important;
	width: 100% !important;
}
.suggestions-addon{
	left: auto !important;
	right: 0 !important;
}
/* placeholder во всю ширину */
.select2-search__field {
	width: 100%!important;
}
/* ресайз select2 при ресайзе окна */
.select2-container {
	width: -webkit-fill-available !important;
}

/* Зачем так? Отключил пока не найдётся причина. */
/* select:required:invalid { opacity: .6; } */

.alert-ok { background-color: #fff; color: #555 }

.ui-autocomplete { font-size: 0.75em; z-index:1000; }

/* Сдвиг значка фидбэка для форм 
.form-control ~ .form-control-feedback {
	left: -15px!important;
}
*/
.form-group .form-control-feedback {
/*	left: -15px!important; */
	pointer-events: initial;
}
/*.form-horizontal ~ */
.has-feedback .form-control-feedback {
	left: -15px!important;
	line-height: 34px;
	position: absolute;
}
.input-group > .input-group-btn + .form-control-feedback, .input-group > .form-control + .form-control-feedback {
	left: -30px!important;
}
.has-feedback label~.form-control-feedback {
	top: 0px;
	left: 100%!important;
}
.has-feedback .form-control {
	padding-right: 6px;
}

.form-control {
	padding: 6px 6px;
}

[data-action="del_phone"] span {right: 30px;}

.text-muted {color: #ccc;}

/* Убираем рамку фокуса */
a:focus, .btn:focus, .btn:active:focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn.active.focus {
	outline:0;
}

/* Исправление танцующих кнопок пагинатора jqGrid */
.ui-jqgrid .ui-pg-button:hover{
	padding: 1px;
}
.ui-jqgrid .ui-pg-button{
	padding: 1px;
	border: 1px solid transparent;
}
.ui-pg-button.ui-state-disabled > .ui-separator{
	margin-left: 3px;
	margin-right: 3px;
}
.ui-jqgrid-disablePointerEvents {
	pointer-events: none;
}
#jqContextMenu i {
	width: 20px; /* Фиксированная ширина для значков */
	margin-right: 10px;
	color: #007bff;
	font-size: 16px;
	text-align: center;
}
#jqContextMenu ul {width: 100%!important;}

.ui-jqgrid .ui-icon-desc {
	margin-left: initial;
}

/* бледный элемент */
.pale { opacity: .4; }

.disabled {
	opacity: 0.7;
}

/* Прячем заголовки таблиц */
.ui-jqgrid-titlebar { display:none }

.jqgrow { background-image: none; }

.ui-jqgrid tr.ui-search-toolbar td > input,
.ui-jqgrid tr.ui-search-toolbar td > select {width: 100%;}
.ui-jqgrid .ui-search-table td.ui-search-clear {width: 1px;}
.ui-jqgrid .ui-search-table .ui-search-oper {width: 1px;}

/* Убираем вертикальную сетку */
.ui-jqgrid tr.ui-row-ltr td { border-right-color: transparent; }
/* Убираем горизонтальную сетку */
.ui-jqgrid tr.ui-row-ltr td { border-bottom-color: transparent; }
/* Убираем сетку в заголовке */
.ui-jqgrid-labels .ui-th-column { border-right-color: transparent }

/* отключение скрола в таблице */
.ui-jqgrid-bdiv { overflow: hidden!important; }

.top_profile_img {
	width: 45px;
	height: 45px;
	border-radius: 50%;
	margin: 0px 0;
}

.label { font-weight: 700 !important; }
.label-warning { color: #212529 !important; }

.ratio-1-1 {aspect-ratio: 1 / 1;}

.font-18 { font-size: 18px !important;}
.font-16 { font-size: 16px !important;}
.font-14 { font-size: 14px !important;}

.w-100 { width: 100% !important; }
.w-95 { width: 95% !important; }
.w-90 { width: 90% !important; }
.w-85 { width: 85% !important; }
.w-80 { width: 80% !important; }
.w-75 { width: 75% !important; }
.w-70 { width: 70% !important; }
.w-65 { width: 65% !important; }
.w-60 { width: 60% !important; }
.w-55 { width: 55% !important; }
.w-50 { width: 50% !important; }
.w-45 { width: 45% !important; }
.w-40 { width: 40% !important; }
.w-35 { width: 35% !important; }
.w-30 { width: 30% !important; }
.w-25 { width: 25% !important; }
.w-20 { width: 20% !important; }
.w-15 { width: 15% !important; }
.w-10 { width: 10% !important; }
.w-5 { width: 5% !important; }

.h-fit {height: fit-content !important;} 
.h-100 { height: 100% !important; }

.h-25px {height: 25px;}
.h-40px {height: 40px;}
.h-50px {height: 50px;}

.min-w-120 { min-width: 120px !important;}
.min-w-135 { min-width: 135px !important;}
.min-w-150 { min-width: 150px !important;}
.min-w-175 { min-width: 175px !important;}
.min-w-185 { min-width: 185px !important;}
.min-w-200 { min-width: 200px !important;}
.min-w-250 { min-width: 250px !important;}
.min-w-300 { min-width: 300px !important;}

.max-w-350 { max-width: 350px !important;}

.mg-0-auto{ margin: 0 auto;}

.nopadding {
   padding: 0 !important;
   margin: 0 !important;
}

.no-events {
	pointer-events: none !important;
}
.select2-container .select2-selection--single .select2-selection__rendered {
	height: -webkit-fill-available;
}

.popover {
	z-index: 1600;
	position: fixed;
}

.border-0 {
	border-bottom-width: 0 !important;
	border-top-width: 0 !important;
	border-left-width: 0 !important;
	border-right-width: 0 !important;
	border: none !important;
}

.top_notify_count{display:none;padding:1px 4px;border:2px solid var(--main-color);border-radius:12px;color:#fff;font-size:9px;height:17px;line-height:11px;min-width:5px;top:30px;left:30px;background-color:#E74C3C;text-align:center;position:absolute}

/* Отступы */
.mt-1 {margin-top: .25rem!important;}
.mt-2 {margin-top: .5rem!important;}
.mt-3 {margin-top: 1rem!important;}
.mt-4 {margin-top: 1.5rem!important;}
.mt-5 {margin-top: 3rem!important;}

.mb-0 {margin-bottom: 0!important;}
.mb-1 {margin-bottom: .25rem!important;}
.mb-2 {margin-bottom: .5rem!important;}
.mb-3 {margin-bottom: 1rem!important;}
.mb-4 {margin-bottom: 1.5rem!important;}
.mb-5 {margin-bottom: 3rem!important;}

.ml-0 {margin-left: 0!important;}
.ml-1 {margin-left: .25rem!important;}
.ml-2 {margin-left: .5rem!important;}
.ml-3 {margin-left: 1rem!important;}
.ml-4 {margin-left: 1.5rem!important;}
.ml-5 {margin-left: 3rem!important;}

.mr-1 {margin-right: .25rem!important;}
.mr-2 {margin-right: .5rem!important;}
.mr-3 {margin-right: 1rem!important;}
.mr-4 {margin-right: 1.5rem!important;}
.mr-5 {margin-right: 3rem!important;}

.pt-0 {padding-top: 0rem!important;}
.pt-1 {padding-top: .25rem!important;}
.pt-2 {padding-top: .5rem!important;}
.pt-3 {padding-top: 1rem!important;}
.pt-4 {padding-top: 1.5rem!important;}
.pt-5 {padding-top: 3rem!important;}

.pr-0 {padding-right: 0rem!important;}
.pr-1 {padding-right: .25rem!important;}
.pr-2 {padding-right: .5rem!important;}
.pr-3 {padding-right: 1rem!important;}
.pr-4 {padding-right: 1.5rem!important;}
.pr-5 {padding-right: 3rem!important;}

.pl-0 {padding-left: 0rem!important;}
.pl-1 {padding-left: .25rem!important;}
.pl-2 {padding-left: .5rem!important;}
.pl-3 {padding-left: 1rem!important;}
.pl-4 {padding-left: 1.5rem!important;}
.pl-5 {padding-left: 3rem!important;}
.pl-20 {padding-left: 20px!important;}

.daterangepicker td {padding: 1px!important;}

.daterangepicker.show-calendar{
	box-shadow: 0px 7px 10px 3px rgba(0,0,0,0.7);
	-webkit-box-shadow: 0px 7px 10px 3px rgba(0,0,0,0.7);
	-moz-box-shadow: 0px 7px 10px 3px rgba(0,0,0,0.7);
}

.underline-dotted { border-bottom: 2px dotted;}
.nowrap {white-space: nowrap;}

/* big Checkboxes */
input[type=checkbox]
{
    width: 18px;
    height: 18px;
    margin: 0;
}

a:hover, input[type=checkbox]:hover {cursor: pointer;}
.checkbox:hover {
	color: #262626;
	text-decoration: none;
}

.dropdown-menu>li>div.checkbox { padding: 3px 20px; }

.pell-content input[type=checkbox], td[aria-describedby="notes_text"] input[type=checkbox] {
	margin-left: 5px;
	margin-right: 5px;
}

div.radio {
	padding: 7px;
}

div.radio:hover {
	background-color: #c9c9c9;
}

.list-group{ display:inline-block; }

textarea:focus::placeholder, input:focus::placeholder {
	color: transparent;
}

.form-control-limited {
	width:unset!important;
	min-width: 0;
}
.form-control-limited + .input-group-btn {
	width: unset!important;
	min-width: 0;
}

input[readonly].plaintext {
  background-color:transparent;
  border: 0;
  box-shadow: none;
}

.badge-primary {
	color: #fff;
	background-color: #007bff;
}
.badge-secondary {
	color: #fff;
	background-color: #6c757d;
}
.badge-success {
	color: #fff;
	background-color: #28a745;
}
.badge-danger {
	color: #fff;
	background-color: #dc3545;
}
.badge-warning {
	color: #212529;
	background-color: #ffc107;
}
.badge-info {
	color: #fff;
	background-color: #17a2b8;
}
.badge-light {
	color: #212529;
	background-color: #f8f9fa;
}
.badge-dark {
	color: #fff;
	background-color: #343a40;
}

.glyphicon.spinning {
	animation: spin 1s infinite linear;
	-webkit-animation: spin2 1s infinite linear;
}

.glyphicon.rotate-90 {
  transform: rotate(90deg);
}
.glyphicon.rotate-180 {
  transform: rotate(180deg);
}

.loadingoverlay {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 100;
	width: 100%;
	height: 100%;
	display: none;
	background: rgba(0,0,0,0.1);
}
.cv-loadingoverlay {
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}

.loading-spinner {
	width: 60px;
	height: 60px;
	border: 5px #ddd solid;
	border-top: 5px #2e93e6 solid;
	border-radius: 50%;
	animation: spin 1s infinite linear;
	-webkit-animation: spin2 1s infinite linear;
}

@keyframes spin {
	from { transform: scale(1) rotate(0deg); }
	to { transform: scale(1) rotate(360deg); }
}

@-webkit-keyframes spin2 {
	from { -webkit-transform: rotate(0deg); }
	to { -webkit-transform: rotate(360deg); }
}

.dark {
	--app-background: #090e11;
	--app-background-rgb: 9.3,13.74,16.7;
	--app-background-deeper: #090e11;
	--app-background-deeper-rgb: 9.3,13.74,16.7;
}

.jconfirm-buttons button, .jconfirm.jconfirm-light .jconfirm-box .jconfirm-buttons button {
	text-transform: none !important;
	font-weight: normal !important;
}

.jqgrow > td > hr {
	border-top: 1px dotted #337ab7;
	overflow: visible;
	text-align: left;
	margin-top: 3px;
	margin-bottom: 3px;
}

.jqgrow > td > hr:after {
	font-family: 'Glyphicons Halflings';
	content:'\e094';
	top: -8px;
	color: #337ab7;
	padding: 0 4px;
	position: relative;
}
.rowEven { background: #eaeaea; }
.rowGroup { background: #dfeffc; }

tr.jqgrow td[aria-describedby="contragents_name"], tr.jqgrow td[aria-describedby="comments_text"], tr.jqgrow td[aria-describedby="comments_added"] {
	white-space: normal;
}
tr.jqgrow td[aria-describedby="changes_param"], tr.jqgrow td[aria-describedby="changes_org_name"], tr.jqgrow td[aria-describedby="changes_result"] {
	white-space: normal;
}
tr.jqgrow td[aria-describedby="payments_name"], tr.jqgrow td[aria-describedby="payments_purpose"] {
	white-space: normal;
}
tr.jqgrow td[aria-describedby="docs_name"], tr.jqgrow td[aria-describedby="docs_filename"] {
	white-space: normal;
}
tr.jqgrow td[aria-describedby="notes_text"] {
	white-space: pre-wrap;
}
tr.jqgrow td[aria-describedby="contacts_position"], tr.jqgrow td[aria-describedby="contacts_fio"] {
	white-space: normal;
}
tr.jqgrow td[aria-describedby="sms_history_text"], tr.jqgrow td[aria-describedby="sms_history_status"] {
	white-space: normal;
}

.chart-container {
	position: relative;
	margin: auto;
	height: 75vh;
	width: 75vw;
}

/* Вертикальные разделители между ячейками таблицы */
table.vert-cross {
	border-style: hidden;
}

ol, ul {
	margin-top: 0;
	margin-bottom: 0;
}

.pell {
  border: 1px solid #c5dbec;
  border-radius: 4px;
  box-sizing: border-box; }

.pell-content {
  border: 0px!important;
  box-sizing: border-box;
  min-height: 52px;
  max-height: 92px;
  height: initial;
  outline: 0;
  overflow-y: auto;
  padding: 6px; }

.pell-content:empty:before {
  content: attr(data-placeholder);
  opacity: .4; }

.pell-content:empty:focus:before {
  content: ""; }

.pell-actionbar {
  background: #dfeffc url(images/ui-bg_glass_85_dfeffc_1x400.png) 50% 50% repeat-x;
  color: #2e6e9e;
  border-bottom: 1px solid rgba(10, 10, 10, 0.1); }

.pell-button {
  background-color: transparent;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  height: 28px;
  outline: 0;
  min-width: 28px;
  vertical-align: bottom; }

.pell-button[disabled] {
	opacity: .65; }

.pell-button:hover {
  background: #d0e5f5 url(images/ui-bg_glass_75_d0e5f5_1x400.png) 50% 50% repeat-x; }

.pell-button-selected {
  background: #d0e5f5 url(images/ui-bg_glass_75_d0e5f5_1x400.png) 50% 50% repeat-x; }

button, svg {
  display: inline-block;
  vertical-align: middle;
}

.btn-group, .btn-group-vertical {
	vertical-align: bottom;
}

.filter-height { height: 34px;}

/* Bootstrap button outline override */
.btn-outline {
	background-color: transparent;
	color: inherit;
	transition: all .5s;
}

.btn-primary.btn-outline {
	color: #428bca;
}

.btn-success.btn-outline {
	color: #5cb85c;
}

.btn-info.btn-outline {
	color: #5bc0de;
}

.btn-warning.btn-outline {
	color: #f0ad4e;
}

.btn-danger.btn-outline {
	color: #d9534f;
}

.btn-primary.btn-outline:hover,
.btn-success.btn-outline:hover,
.btn-info.btn-outline:hover,
.btn-warning.btn-outline:hover,
.btn-danger.btn-outline:hover {
	color: #fff;
}
.avatar {
	width: 40px;
	height: 40px;
}
.avatar-sm {
	width: 30px;
	height: 30px;
}
.avatar-s {
	height: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border-radius: 50%;
}
.overflow-elipsis {
	text-overflow: ellipsis;
}

li>.avatar, div>.avatar {
	margin-top: 5px;
}

.button-no-rounded {
	border-radius: 0;
}

.suggestions-suggestion{padding-left: 15px !important;}

@media (max-width: 1000px) {
	body {
		width: 100%;
		margin-left: 0;
	}
}

@media screen and (max-width: 768px) {
	body {
		font-size:1.2em;
	}
	.container-fluid {
		padding-right: 5px;
		padding-left: 5px;
	}
	#jqContextMenu span {
		font-size: 14px;
	}
	h2 {
		font-size:1.5em;
	}
	.clamp-two-lines {
		padding: 0; /* Минимизируйте отступы */
		margin: 0; /* Уберите внешний отступ */
	}
	.clamp-two-lines div {
		display: inline-block;
		display: -webkit-inline-box;
		vertical-align: middle;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: normal!important; /* Разрешить перенос строк */
		line-height: 1.0; /* Контролируйте высоту строки */
	}
	.clamp-two-lines:after {
		content: "";
		height: 100%;
		display: inline-block;
		vertical-align: middle;
	}
	.list li {
		display: none; /* скрыть все элементы li после ширины экрана 768px */
	}
	.toggle-navigation {
		position: relative;
	}
	#avatar {
		margin-top: 5px;
		width: 40px;
		height: 40px;
	}
	.topmenu {
		color: #eaeaea;
		margin-top: 12px;
		margin-left: 5px;
		margin-bottom: 5px;
	}
	.form-control-limit {
		width:unset!important;
		min-width: 0;
	}
	.form-control-limit + .input-group-btn {
		width: unset!important;
	}
	.dropdown-menu > li > a {
		padding: 3px 10px;
	}
	.form-control-static {
		padding-top: 1px;
	}
	.col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 {
		padding-top: 5px;
	}
	.col-xs-1, .col-xs-2, .col-xs-3 {
		padding-top: 10px;
		top: 50%;
	}
	.form-control {
		padding-right: 0px!important;
		padding-left: 4px!important;
	}
	.createleadmob {
		margin-left:-20px;
		margin-right:16px;
	}
	.managerleadmob {
		margin-right:3px;
	}

	.headermob {
		padding-bottom: 0px;
	}
	.paymentsumm {
		margin-left:-20px;
		margin-right:16px;
	}

	/* Стиль для расширенного поля поиска */
	input#gs_phone:focus {
		width: 130px;
		margin-left: -75px;
		margin-top: -13px;
		position: fixed;
	}

}

@media only screen and (max-width: 1000px) {
	.button-text, .ui-paging-info{
		display: none !important;
	}
	.pr-0-mob {padding-right: 0 !important;}
	.pb-15-mob{padding-bottom: 15px !important;}
	.w-100-mob{width: 100% !important;}
	.w-50-mob{width: 50% !important;}
	.dis-block-mob {display: block !important;}
	.list li:nth-child(3) {
		display: none; /* скрыть второй элемент li после ширины экрана 1020px */
	}
	.dis-flex {display: block !important;}
	.w-45 {width: 100% !important;}

	.pl-15-nomob {padding-left: 0 !important;}
	.pr-15-nomob {padding-right: 0 !important;}
	.w-100-mob {width: 100% !important;}
	.pl-0-mob {padding-left: 0 !important;}

	.dis-none-mob {display: none !important;}

	.mb-5-mob {margin-bottom: 5px !important;}
	.mb-15-mob {margin-bottom: 15px !important;}
	.mr-15-mob {margin-right: 15px !important;}
	.ml-15-mob {margin-left: 15px !important;}
	.mt-15-mob {margin-top: 15px !important;}

	.flex-hor-center-mob {
		justify-content: center;
	}
	.flex-right-mob{ justify-content: right !important;}
	.flex-left-mob{ justify-content: left !important;}

	.checkboxDropmenu .checkbox { padding-left: 10px !important;}
	.checkboxDropmenu .checkbox label { padding-left: 30px;}
	.checkboxDropmenu .checkbox input[type=checkbox] {margin-left: -30px;}
	.checkboxDropmenu .dropdown-menu .glyphicon {padding-right: 15px;}

	/*label в модальной форме*/
	.modal-body label {
		height: auto !important;
		width: 100% !important;
		justify-content: left !important;
	}
	.modal-body .form-control-feedback {
		padding-left: 10px;
		top: 0 !important;
		position: relative !important;
	}


}
@media (min-width: 767px) {
	.topmenu {
		display: none;
	}
}
/* Изменяем цвета доп.меню navbar-toggle */
.navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .open > a:focus, .navbar-inverse .navbar-nav > .open > a:hover{
	color: #DDD;
	background-color: var(--main-color);
}
.navbar-inverse .navbar-nav .open .dropdown-menu > li > a {
	color: #000000;
}
.navbar-inverse .navbar-toggle:focus, .navbar-inverse .navbar-toggle:hover {
	background-color: #ffffff
}
.navbar-inverse .navbar-toggle {
	border-color: #DDD;
}
.navbar-inverse .navbar-toggle .icon-bar {
	background-color: #bdbdbd;
}
/* Редактируем элемент бутстрапа navbar-toggle убран float:right, изменены padding */
.navbar-toggle {
	float: none;
	padding: 9px 10px;
	margin-right: 15px;
	margin-top: 10px;
	margin-bottom: 5px;
}
/* Изменили отступы справа и слева в шапке */
.container-fluid>.navbar-collapse, .container-fluid>.navbar-header, .container>.navbar-collapse, .container>.navbar-header {
	margin-right: -25px;
	margin-left: -20px;
}
.navbar-brand {
	margin-right: 20px;
}
.modal-body {
	background-color: #f6f6f6
}
.modal {
	z-index: 1450 !important;
}
.modal-backdrop {
	z-index: 1420 !important;
}
.jconfirm {
    z-index: 2000 !important;
}
.daterangepicker .ranges li.active {
	background-color: var(--main-color);
	color: #ffffff;
}

.jqGridGroup {
	background: #e3f1fd;
}
.jqGridGroup .ui-icon{
	margin-top: -1px;
}

.subGroup {
	padding-left: 30px !important;
}

.bold {
	font-weight: bold !important;
}

.mr-15 {margin-right: 15px !important;}
.ml-15 {margin-left: 15px !important;}
.mt-15 {margin-top: 15px !important;}
.mb-15 {margin-bottom: 15px !important;}

.mt-0 {margin-top: 0 !important;}
.fl-left {float: left;}
.fl-right {float: right;}

.fl-none {float: none;}
.pos-rel {position: relative !important;}
.pos-abs {position: absolute !important;}
.pd-8 {padding: 8px;}
.pd-0 {padding: 0 !important;}
.pr-15 {padding-right: 15px !important;}
.pl-15 {padding-left: 15px !important;}
.pr-15-nomob  {padding-right: 15px;}
.pl-15-nomob  {padding-left: 15px;}
.pr-30 {padding-right: 30px !important;}
.pb-15 {padding-bottom: 15px;}
.pb-0 {padding-bottom: 0; margin-bottom: 0;}

.pt-15 {padding-top: 15px;}

.dis-none {display: none;}
.dis-none-imp {display: none !important;}
.dis-grid {display: grid;}
.dis-block {display: block;}
.dis-block-imp {display: block !important;}
.dis-flex {display: flex;}
.dis-flex-mob {display: flex;}
.dis-cont {display: contents;}
.dis-inline-flex {display: inline-flex;}
.dis-ruby {display: ruby;}
.dis-ruby div {float: none;}

.w-fit { width: fit-content !important;}
.w-auto-imp {width: auto !important;}
	
.flex-wrap {	
	flex-wrap: wrap;
	justify-content: flex-start;
}
label {
	margin: 0;
    padding-right: 15px !important;
}

/*label в модальной форме*/
.modal-body label {
	display: flex;
	justify-content: right;
	align-items: center;
	height: 34px;
	position: relative;
	padding-right: 25px !important;
}
.modal-body .form-control-feedback {
	top: 10px;
    right: 6px;
	position: absolute;
	width: auto;
	height: auto;
	line-height: normal;
}

@media (min-width: 1000px) {
.modal-body .checkbox-label {
	padding-right: 45px !important;
}
.modal-body input[type=checkbox] {
	position: absolute;
    right: 0;
}
.modal-body .checkbox-label .form-control-feedback {
    right: 25px !important;
}
}

.flex-right{ justify-content: right;}
.flex-left{ justify-content: left;}

.flex-top-right { 
	justify-content: right !important;
	align-items: baseline !important;
}

.flex-top-right,
.flex-center,
.flex-left,
.flex-right,
.flex-ver-center,
.flex-hor-center {
	display: flex;
}
.flex-center,
.flex-ver-center {
	align-items: center;
}
.flex-center,
.flex-hor-center {
	justify-content: center;
}

.br-4 {border-radius: 4px !important;}

#planList {
	direction: ltr;
	height: 97px;
	max-height: 97px;
	overflow-y: auto;
	padding: 5px;
}
#subTaskButtons {
	display: flex;
}
#planList_add {background: #dadada;}
#planList_delete {background: white;}
#planList_add,
#planList_delete {border-radius: 0 !important;}
#planList .fa-xmark,
#planList_delete .glyphicon-remove-circle {
	color: #dc8383;
	cursor: pointer;
}
#planList .fa-arrows {
	color: #909090;
	cursor: grab;
	padding-right: 10px;
}
#planList .subname {
	border: none; 
	width: 90%;
	height: 24px;
	padding: 5px 10px;
	font-size: 14px;
}
#planList .subname:focus {
	border-radius: 4px; 
	border: 1px solid #66afe9; 
	outline: 0; 
	box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);
}
#planList .taskLine {
	padding-right: 10px;
	display: flex;
	padding-bottom: 3px;
}
#planList .subTask_val {
	height: 22px;
	margin: 2px 5px !important;
}
#planList .planButtons {
	height: 20px;
	display: flex;
	padding: 5px;
}
@media only screen and (max-width: 1020px) {
	#planList {
		height: auto;
		max-height: none;
		overflow-y: visible;
	}
	#planList_add,
	#planList_delete {
		width: 50% !important;
	}
}

.select2-results__option--highlighted[aria-selected] .redelement {color: #fff !important;}
.select2-results__option--highlighted .redelement,
.select2-results__option--highlighted .alert-warning {
	background-color: transparent !important;
	color: white !important;
}
.select2-dropdown,
.daterangepicker {z-index: 1250;}

#task #comments .isSystemMessage {background: #e9e9e9;}
#task #comments .isSystemMessage .avatar-sm { width: 20px; height: 20px; display: flex; margin:0 auto;}
#task #comments .isSystemMessage td { height: 18px !important;}
#task #comments .isSystemMessage label { font-size: 9px !important;}
#task #comments .managerMessage {background: #cbddfb;}
#task #comments .message .messageText {font-size: 12px; padding: 5px 0 5px 0 !important;}
#task #comments .messageText a {color:#337ab7}

#task  #sendMessage { transition: 900ms;}
#task .commentAlert { background: #f36a6a; color: rgb(155, 0, 0);}

#task #comments tr.jqgrow td[aria-describedby="comments_message"],
#task #comments tr.jqgrow td[aria-describedby="comments_time"],
#task #comments tr.jqgrow td[aria-describedby="comments_worker"] {
	white-space: normal;
}
#task #comments tr.jqgrow td[aria-describedby="comments_time"] {
	text-align: end;
	padding-right: 10px;
}

tr.jqgrow td .label.boxed {padding: .4em .6em .4em;}
tr.jqgrow td input[type=checkbox] {margin-top: .4em}

.tree-wrap { width: 18px !important; }
.tree-wrap .ui-icon { margin-top: -1px; }
.tree-wrap .tree-leaf { visibility: hidden; }

.default-option-label {
	background-color: #eaeaea;
	color:#222 !important;
	font-weight: 700 !important;
}

.collapser {
	color: inherit !important;
	text-decoration: none !important;
	font-weight: 700;
}
.collapser:before {
	font-family: "Glyphicons Halflings";
	content: "\e114";
	float: left;
	margin-right: 10px;
	color: var(--main-color);
}
.collapser.collapsed:before {
	content: "\e080";
}