html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	background: transparent;
}
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
strong {
	font-weight: 600;
}

*, *:after, *:before {
	box-sizing: border-box;
	padding: 0;
	margin: 0;
}

:root {
	--blue1: #0288D1;
	--blue2: #0383C9;
	--text-secondary: #94A3B8;
	--br8: 8px;
	--br10: 10px;
	--text-primary: #101F2C;
	--border-regular: #CBD5E1;
	--table-border: #CBD5E1;
	--table-background-head: #E7EDF5;
	--text-tertiary: #94A3B8;
	--text-warning: #DE576F;
	--green: #64B170;

	--text-font-size-base: 16px;
	--text-font-size-sm: 14px;

	--space-5: 20px;
	--space-6: 24px;


	--slate-900: #0F172A;
	--slate-700: #334155;
	--slate-500: #64748B;
	--slate-400: #94A3B8;
	--slate-300: #CBD5E1;
	--slate-200: #E2E8F0;
	--slate-100: #F1F5F9;

	--red-500: #DE576F;
	--red-600: #ce3752;
	--red-400: #F87171;

	--sky-600: #0284C7;
	--brand: #0284C7;
	--sky-700: #0369A1;

	--emerald-600: #059669;
	--orange-400: #FB923C;
	--yellow-400: #FACC15;
	--black: #000;
	--white: #FFFFFF;
	--overlay: #64748B20;

	--gap-16: 16px;
	--gap-8: 8px;
}

::selection {
	background: var(--brand);
	color: var(--white);
	text-shadow: 0px 1px 3px rgba(0, 0, 0, 0.2);
}

::-moz-selection {
	background: var(--brand);
	color: var(--white);
	text-shadow: 0px 1px 3px rgba(0, 0, 0, 0.2);
}

::-webkit-scrollbar {
	width: 14px;
	height: 14px;
	background: var(--white);
}

::-webkit-scrollbar-thumb {
	border: 4px solid rgba(0, 0, 0, 0);
	background-clip: padding-box;
	border-radius: 9999px;
	background-color: var(--brand);
}

::-webkit-scrollbar-track-piece {
	background: transparent;
}


html, body {
	width: 100%;
	min-height: 100%;
	background: var(--slate-100, #F1F5F9);
	-webkit-text-size-adjust: none;
}

html, body, textarea, input, button, select {
	font-size: 14px;
	font-family: 'Inter', sans-serif;
	color: var(--text-primary);
	outline: 0px;
}

input[type=text], input[type=email], input[type=search], input[type=submit], textarea{
	-webkit-appearance: none;
}

body {
	-webkit-overflow-scrolling: touch;
	min-height: 100vh;
	overflow: overlay;
}

ul {
	padding-left: 40px;
	list-style: disc outside;
	margin-top: 1em;
	margin-bottom: 1em;
}

ol {
	padding-left: 40px;
	list-style: decimal outside;
	margin-top: 1em;
	margin-bottom: 1em;
}

img {
	max-width: 100%;
	height: auto;
	border: 0px;
	vertical-align: bottom;
}

img:not([width]) {
	width: initial;
}

a {
	color: var(--sky-600, #0284C7);
	text-decoration: none;
}

@media(hover) {
	a:hover, .link:hover {
		color: var(--slate-900, #0F172A);
	}
}

ul.noli, ul.noli ul, ul.noli li {
	display: block;
	margin: 0px;
	padding: 0px;
	list-style: none;
}

p {
	display: block;
	position: relative;
	margin: 0 0 var(--gap-8);
}

p:last-child {
	margin: 0;
}


h1, h2, h3, h4 {
	display: block;
	font-weight: normal;
	margin: 0px 0px 30px 0px;
}

h1 {
	font-size: 24px;
}

h2 {
	font-size: 20px;
}

h3 {
	font-size: 18px;
}

h4 {
	font-size: 16px;
}

.max {
	display: block;
	position: relative;
	margin: 0px auto;
	/* max-width: 1920px; */
	width: calc(100% - 48px);
}

.d-flex:not([style="display: none;"]) {
	display: flex !important;
}

.f-grow {
	flex-grow: 1 !important;
}

.ai-right {
	align-items: end !important;
}

.ai-left {
	align-items: start !important;
}


.f-row {
	flex-direction: row !important;
}

.f-column {
	flex-direction: column !important;
}


.f-gap-8 {
	gap: 8px !important;
}

.f-gap-16 {
	gap: 16px !important;
}

.f-gap-18 {
	gap: 18px !important;
}


.jc-right {
	justify-content: end !important;
}

.jc-center {
	justify-content: center !important;
}


.text-right {
	text-align: right !important;
}

.scroll-border-left::-webkit-scrollbar {
	border-left: 1px solid #cbd5e1;
}

.mb-8 {
	margin-bottom: 8px !important;
}

.mb-12 {
	margin-bottom: 12px !important;
}

.mb-16 {
	margin-bottom: 16px !important;
}

.mt-20 {
	margin-top: 20px !important;
}

.f-item {
	display: flex;
	position: relative;
}

.text-tertiary {
	color: var(--text-tertiary) !important;
}

.jc-beetween {
	justify-content: space-between !important;
}

.flex-1 {
	flex: 1 !important;
}

.air-datepicker {
	--adp-z-index: 9999999 !important;
}
/********************************************** END Общий стиль ***************************************************/














/********************************************** Default кнопки и формы ***************************************************/
.cui:not([type="checkbox"]):not([type="radio"]) {
	font-size: 14px;
	font-weight: 400;
	line-height: 24px;
	height: 48px;
	padding: 16px;
	border-radius: 8px;
	border: 1px solid var(--border-regular);
	background: var(--white, #FFF);
	color: var(--slate-900, #0F172A);
	font-style: normal;
	width: 100%;
}

.cui:not([type="checkbox"]):not([type="radio"]):focus {
	border-color: var(--blue1);
}

select.cui {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}

.cui.cui40:not([type="checkbox"]):not([type="radio"]) {
	height: 40px;
}

.cui:not([type="checkbox"]):not([type="radio"]).error {
	border: 1px solid var(--red-600, #DC2626);
}

.cui:not([type="checkbox"]):not([type="radio"])::placeholder {
	color: var(--text-secondary);
	/* font-style: italic; */
}

/*.cui:not([type="checkbox"]):not([type="radio"])[readonly]:not(.airpicker) {*/
/*	filter: opacity(0.5);*/
/*	cursor: default;*/
/*	pointer-events: none;*/
/*}*/

.formItem {
	display: flex;
	position: relative;
	flex-wrap: wrap;
	flex-direction: column;
}

.formItem> label {
	display: flex;
	align-items: center;
	margin: 0 8px 0 0;
	justify-content: space-between;
	font-size: 14px;
	font-style: normal;
	font-weight: 500;
	line-height: 20px;
	height: 40px;
	color: var(--input-text-title, #101F2C);
}

.formItem> label> a {
	font-weight: 400;
}

.formItem> .cui:not([type="checkbox"]):not([type="radio"]), .formItem> .cui:not([type="checkbox"]):not([type="radio"]), .formItem> .inputHiddenText {
	width: calc(100% - 96px);
	position: relative;
}

.formItem> .cui:not([type="checkbox"]):not([type="radio"]).w100, .formItem> .cui:not([type="checkbox"]):not([type="radio"]).w100, .formItem> .inputHiddenText.w100 {
	width: 100%;
}

.inputHiddenText> .cui {
	width: 100%;
	padding-right: 36px;
}

.inputHiddenText> span[data-enity="inputHiddenText"], .inputHiddenText> span[data-enity="inputSuccessText"] {
	display: flex;
	align-items: center;
	justify-content: center;
	position: absolute;
	top: 0;
	right: 0;
	height: 100%;
	width: 40px;
	cursor: pointer;
}

.inputHiddenText> span[data-enity="inputHiddenText"]> i, .inputHiddenText> span[data-enity="inputSuccessText"]> i {
	position: absolute;
	display: none;
	align-items: center;
	justify-content: center;
}

.inputHiddenText> span[data-enity="inputHiddenText"]:not(.active)> i:first-child {
	display: flex;
}

.inputHiddenText> span[data-enity="inputHiddenText"].active> i:last-child {
	display: flex;
}

.inputHiddenText> span[data-enity="inputSuccessText"]> i {
	display: flex;
}

.inputHiddenText> span[data-enity="inputSuccessText"] {
	pointer-events: none;
	transition: all 0.15s;
	filter: opacity(0);
}

.inputHiddenText.success> span[data-enity="inputSuccessText"] {
	filter: opacity(1);
}


.formItem.a-right {
	justify-content: flex-end;
}

.formItem.a-center {
	justify-content: center;
}

.formItem a[data-enity="lostpassword"] {
	color: var(--sky-600, #0284C7);
	font-size: 16px;
	font-style: normal;
}

.formItem a[data-enity="lostpassword"].disabled {
	filter: opacity(0.5);
	cursor: default;
}

.formItem a[data-enity="lostpassword"]:hover {
	color: var(--slate-900);
}

.formItem.submit {
	justify-content: center;
	gap: var(--gap-8);
}

.formItem:last-child {
	margin: 0;
}

.formItem .formItemError {
	display: block;
	margin: 6px 0 0;
	color: var(--red-600, #DC2626);
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: 20px; /* 142.857% */
}

.formItem> .cui:not([type="checkbox"]):not([type="radio"]) + .formItemError, .formItem> .cui:not([type="radio"]):not([type="checkbox"]) + .formItemError, .formItem> .inputHiddenText + .formItemError {
	width: calc(100% - 96px);
	margin-left: 96px;
}

.formItem .formItemError.aleft {
	margin-left: 0;
	width: 100%;
}

.formHr {
	display: flex;
	width: 100%;
	height: 1px;
	background: #E2E8F0;
	margin: 0px 0px 18px;
}

form.form {
	display: flex !important;
	flex-direction: column;
	position: relative;
	gap: 24px;
}

.formItems {
	display: flex;
	flex-direction: column;
	gap: 18px;
}

.formItems> .fi-Two {
	display: flex;
	gap: 24px;
	position: relative;
}

.formItems> .fi-Two> .formItem {
	flex: 1;
}

.formItemButtons {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 24px;
}








.btn, a.btn {
	display: inline-flex;
	align-items: center;
	position: relative;
	padding: 8px 18px;
	border: 0;
	cursor: pointer;
	gap: var(--gap-8);
	border-radius: var(--br8);
	background: var(--blue1);
	height: 40px;
	color: var(--white, #FFF);
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: 24px;
	transition: all 0.1s;
}

.btn:hover, a.btn:hover {
	background: var(--blue2);
}

.btn.red, a.btn.red {
	background: var(--red-500);
}

.btn.red:hover, a.btn.red:hover {
	background: var(--red-600);
}

.btn.gray, a.btn.gray {
	background: var(--border-regular);
	color: var(--slate-900, #0F172A);
}

.btn.gray:hover, a.btn.gray:hover {
	background: var(--border-regular);
}

.btn.light, a.btn.light {
	background: #E8F4FF;
	border: 1px solid var(--border-regular);
	color: var(--text-primary);
}

.btn.light:hover, a.btn.light:hover {
	background: #DCECFA;
}


.btn.ghost, a.btn.ghost {
	background: transparent;
	color: var(--slate-900, #0F172A);
}

.btn.ghost:hover, a.btn.ghost:hover {
	background: #fff;
}



.btn.white, a.btn.white {
	background: var(--white);
	color: var(--slate-900);
}

.btn.white:hover, a.btn.white:hover {
	color: var(--sky-600);
}

.btn.white.ghost, a.btn.white.ghost {
	background: transparent;
	color: #fff;
	border: 1px solid #fff;
}

.btn.white.ghost:hover, a.btn.white.ghost:hover {
	border-color: transparent;
	background: #fff;
	color: var(--slate-900);
}


.btn.gray_dark, a.btn.gray_dark {
	background: var(--slate-700);
}

.btn.gray_dark:hover, a.btn.gray_dark:hover {
	background: var(--slate-900);
}

.btn.dark, a.btn.dark {
	background: var(--slate-900);
}

.btn.dark:hover, a.btn.dark:hover {
	background: var(--slate-700);
}

.btn.loading, a.btn.loading {
	background: rgba(15, 23, 42, 0.50);
	cursor: default;
}

.btn:disabled, a.btn:disabled {
	cursor: no-drop;
	filter: opacity(0.5);
	pointer-events: none;
}

.btn.ico {
	min-width: 40px;
	padding: 0;
	align-items: CENTER;

	justify-content: center;
}

.btn.ico2 {
	padding: 0;
	align-items: CENTER;
	justify-content: center;
	filter: opacity(0.5);
	background: transparent;
}

@media(hover) {
	.btn.ico2:hover {
		filter: opacity(1);
	}
}

.btn.hidden {
	display: none;
}

.btn.mini, a.btn.mini {
	font-size: 14px;
	padding: 0 12px;
	height: 32px;
}

span.btn.info {
	cursor: default;
}

.btn.info, a.btn.info, .btn.info:hover, a.btn.info:hover {
	background: #fff;
	font-size: 14px;
	color: var(--text-primary);
	border: 1px solid #CBD5E1;
	padding: 8px 12px;
}

.btn.file, a.btn.file {
	padding: 0;
	height: initial;
	background: transparent;
	color: var(--blue1);
	gap: 6px;
}

.btn.file:hover, a.btn.file:hover {
	color: var(--text-primary);
}

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

.btn.badge, a.btn.badge {
	background: transparent;
	border: 1px solid var(--blue1);
	color: var(--blue1);
	cursor: default;
	pointer-events: none;
}

.btn.badge.green, a.btn.badge.green {
	border: 1px solid var(--green);
	color: var(--green);
}

.btn.badge.red, a.btn.badge.red {
	border: 1px solid var(--red-500);
	color: var(--red-500);
}

.notificationsSettings form.content {
	color: var(--slate-900, #0F172A);
}

.notificationsSettings .formItemInfo {
	color: var(--slate-900, #0F172A);
}

.inputCheckbox {
	display: BLOCK;
	position: relative;
}

.inputCheckbox> label {
	display: block;
	position: relative;
	cursor: pointer;
}

.inputCheckbox> label> input {
	display: none;
}

.inputCheckbox> label> span {
	display: block;
	position: relative;
	font-size: 14px;
	padding: 0 0 0 28px;
}

.inputCheckbox> label:not(.slide)> span::before,
.inputCheckbox> label:not(.slide)> span::after {
	content: '';
	display: block;
	width: 20px;
	height: 20px;
	border: 1px solid var(--border-regular);
	border-radius: 3px;
	position: absolute;
	top: 0;
	left: 0;
	transition: all 0.15s;
	background: #fff;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 18px;
}

.inputCheckbox> label:hover:not(.slide)> span::before {
	border: 1px solid var(--text-secondary);
}

.inputCheckbox> label:not(.slide)> span::after {
	border: 0;
	filter: opacity(0);
	background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMTgiIHZpZXdCb3g9IjAgMCAxOCAxOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE1IDQuNUw2Ljc1IDEyLjc1TDMgOSIgc3Ryb2tlPSIjMDI4OEQxIiBzdHJva2Utd2lkdGg9IjEuNjY2NiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cjwvc3ZnPgo=);
	width: 18px;
	height: 18px;
	top: 1px;
	left: 1px;
}

.inputCheckbox> label:not(.slide)> input:checked + span::before {
	border: 1px solid var(--blue2);
}

.inputCheckbox> label:not(.slide)> input:checked + span::after {
	filter: opacity(1);
}

.inputCheckbox> label.slide {
	min-height: 24px;
	display: flex;
	align-items: center;
	padding: 0 0 1px;
}

.inputCheckbox> label.slide> span {
	padding: 0 0 0 66px;
}

.inputCheckbox> label.slide> i {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 48px;
	height: 24px;
	background: #fff;
	border-radius: 100px;
	transition: all 0.3s;
	border: 1px solid #CBD5E1;
	box-shadow: inset 0px 0px 0px 0.5px #CBD5E1;
}

.inputCheckbox> label.slide> i::before {
	content: '';
	display: block;
	position: absolute;
	top: 3px;
	left: 3px;
	width: 16px;
	height: 16px;
	background: #fff;
	border-radius: 100%;
	transition: all 0.3s cubic-bezier(0.67, 0.03, 0.04, 1);
	will-change: transform;
	background: var(--text-secondary, #62748E);
}

.inputCheckbox> label.slide> input:checked + i {
	background: var(--blue1);
	border-color: transparent;
	box-shadow: none;
}

.inputCheckbox> label.slide.dark> input:checked + i {
	background: var(--slate-900);
}

.inputCheckbox> label.slide> input:checked + i::before {
	transform: translate(24px, 0);
	background: #fff;
}

.inputCheckbox> label> input:disabled + span::before, .inputCheckbox> label> input:disabled + span::after {
	background-color: #E2E8F0;
}

.inputCheckbox> label> input:disabled + span::after {
	filter: opacity(0.5) !important;
}

.inputCheckbox> label> input:disabled + span {
	cursor: default;
}

textarea.cui {
	min-height: 80px;
}

label.input-file {
	display: flex;
	gap: 10px;
	align-items: CENTER;
	color: var(--slate-900);
	font-size: 13px;
	font-weight: 500;
}

label.input-file> input {
	display: none;
}

.cuiconfirm {
	display: flex;
	flex-direction: column;
	position: relative;
	margin: 16px 0 0;
}

.cuiconfirm textarea.cui {
	font-size: 14px !important;
	padding: 12px !important;
}
/********************************************** END Default кнопки и формы ***************************************************/













/************************************************** START modals ************************************************/
#modal {
	display: none;
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	backdrop-filter: blur(3px);
	background: rgb(0 0 0 / 32%);
	z-index: 9999998;
}

.modal {
	display: flex;
	position: absolute;
	width: 100%;
	height: 100%;
	padding: 50px 0;
	max-height: 100vh;
	overflow-y: overlay;
	align-items: baseline;
	justify-content: center;
	-webkit-overflow-scrolling: touch;
}

.modalContent {
	display: flex;
	width: calc(100% - 40px);
	max-width: 640px;
	background: #fff;
	margin: auto;
	flex-direction: column;
	position: relative;
	padding: 24px 32px;
	box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.10);
	border-radius: 12px;
}

.modalContent> a.modalClose, .modalRightContent> a.modalRightClose {
	display: flex;
	align-items: center;
	justify-content: CENTER;
	position: absolute;
	top: 18px;
	right: 18px;
	width: 40px;
	height: 40px;
	transition: all 0.1s;
	z-index: 1;
}

@media(hover) {
	.modalContent> a.modalClose:hover, .modalRightContent> a.modalRightClose:hover {
		filter: opacity(0.5);
	}
}

.modalContent> .title, .modalRightContent> .title {
	position: relative;
	display: flex;
	align-items: CENTER;
	border-bottom: 1px solid var(--border-subtle, #EAEEF2);
	background: var(--panel-background, #F8FAFC);
	margin: -24px -24px 24px;
	padding: 26px 80px 24px 16px;
	justify-content: space-between;
}

.modalContent> .title {
	margin: -24px -32px 24px;
	border-top-left-radius: 12px;
	border-top-right-radius: 12px;
}

.modalContent> .title> h3, .modalRightContent> .title> h3 {
	color: var(--slate-900, #0F172A);
	font-size: 18px;
	font-style: normal;
	font-weight: 500;
	margin: 0;
	max-height: 46px;
	overflow: hidden;
}

.modalContent> .content, .modalRightContent> .content {
	display: block;
	position: relative;
	margin: 0 0 18px;
}

.modalContent> .content:last-child, .modalRightContent> .content:last-child {
	margin: 0;
}

.modalRightContent> .content {
	padding: 0 12px;
	margin: 0 -12px !important;
	max-height: calc(100vh - 72px - 66px - 24px);
	overflow-y: overlay;
}

.modalContent> .content> .modalInfo, .modalRightContent> .content> .modalInfo {
	display: block;
	position: relative;
	color: var(--slate-900, #0F172A);
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 24px; /* 150% */
}

.modalContent> .m_buttons, .modalRightContent> .m_buttons {
	display: flex;
	position: RELATIVE;
}

.jc-center {
	justify-content: center !important;
}

.jc-end {
	justify-content: flex-end !important;
}

.jc-start {
	justify-content: flex-start !important;
}

.ai-center {
	align-items: center !important;
}

.changePassword .formItemInfo {
	color: var(--slate-900, #0F172A);
	margin: 0 0 8px;
}
/************************************************** END modals ************************************************/


/************************************************** START modals right ************************************************/
#modalRight {
	display: none;
	position: fixed;
	left: 0;
	top: 66px;
	width: 100%;
	height: calc(100% - 66px);
	backdrop-filter: blur(3px);
	background: rgb(0 0 0 / 32%);
	z-index: 99999;
	background: var(--overlay, rgba(100, 116, 139, 0.20));
}

.modalRight {
	display: flex;
	position: absolute;
	width: 100%;
	height: 100%;
	max-height: 100vh;
	overflow-y: overlay;
	align-items: baseline;
	justify-content: flex-end;
	-webkit-overflow-scrolling: touch;
	overflow: hidden;
}

.modalRightContent {
	display: flex;
	width: calc(100% - 40px);
	max-width: 540px;
	flex-direction: column;
	position: relative;
	padding: 24px;
	border-radius: 0;
	height: 100%;
	will-change: transform;
	transform: translate(100%, 0px);
	transition: transform 0.3s;
	border-left: 1px solid var(--border-regular, #CBD5E1);
	background: var(--background-surface, #FFF);
	box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.10);
}

.modalRight.active .modalRightContent {
	transform: translate(0);
}
/************************************************** END modals right ************************************************/














/********************************************** START dropdown ***************************************************/
.dropdown {
	display: none;
	position: absolute;
	top: calc(100% + -8px);
	right: 0;
	z-index: 100;
	width: max-content;
	max-width: 360px;
}

.dropdown.dd-4 {
	top: calc(100% + 4px);
}

.dropdown[data-dropdown="userprofile"] {
	width: 360px;
}

.dropdown> .content {
	border-radius: 10px;
	background: #FFF;
	box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.10);
	padding: var(--gap-16);
	display: flex;
	flex-direction: COLUMN;
	border: 1px solid var(--slate-300);
}



/*** dropdown select ***/
/* Часть стилей используется выше в стилях форм */
.dropdown> .content.dropdownSelect {
	padding: 7px 0;
}

.dropdown> .content.dropdownSelect> .inputCheckbox> label {
	padding: 9px 8px;
}


/*** dropdown sorting ***/
.dropdown> .content.dropdownSorting {
	padding: 6px 0;
	min-width: 300px;
}

.dropdown> .content> .title {
	display: block;
	color: var(--text-secondary);
	padding: 12px 0;
}

.dropdown> .content.dropdownSorting> .title {
	padding: 12px;
}

.dropdown> .content.dropdownSorting> .item:last-child {
	display: block;
	padding: 12px;
}


.inputSorting {
	display: block;
	position: relative;
}

.inputSorting> label {
	display: flex;
	position: relative;
	cursor: pointer;
	height: 36px;
	padding: 0 48px 0 0;
}

.inputSorting> label> input {
	display: none;
}

.inputSorting> label> span {
	display: flex;
	align-items: center;
	padding: 0 0 0 12px;
}

.inputSorting> label> .ico {
	display: flex;
	width: 24px;
	height: 24px;
	align-items: center;
	justify-content: center;
	transition: transform 0.3s, filter 0.1s;
	filter: opacity(0);
	position: absolute;
	top: calc(50% - 12px);
	right: 12px;
}

.inputSorting> label> .ico svg {
	height: auto;
	width: 18px;
}

.inputSorting> label> .ico svg path {
	fill: var(--text-primary);
}

.inputSorting> label> input:checked ~ .ico {
	filter: opacity(1);
}

.inputSorting> label> input + input:checked ~ .ico {
	transform: scale(1, -1);
}

.inputSorting> label> input:checked ~ span {
	font-weight: 500;
}

.inputSorting> label> span::before {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 6px;
	height: 100%;
	background: var(--text-primary);
	transition: filter 0.3s;
	filter: opacity(0);
	border-radius: 0 6px 6px 0;
}

.inputSorting> label> input:checked ~ span::before {
	filter: opacity(1);
}

nav.dropNav {
	display: flex;
	flex-direction: column;
	position: relative;
	min-width: 200px;
	margin: calc(var(--gap-16) * -1);
}

nav.dropNav> a {
	display: flex;
	position: relative;
	padding: 8px 12px;
	border-bottom: 1px solid var(--border-regular);
	line-height: 24px;
	color: var(--text-primary);
}

nav.dropNav> a:last-child {
	border: 0;
}

nav.dropNav> a:hover {
	color: var(--sky-600);
}

nav.dropNav> a.red {
	color: var(--text-warning);
}

nav.dropNav> a.red:hover {
	color: var(--red-600);
}
/********************************************** END dropdown ***************************************************/


















/********************************************** START Header ***************************************************/
header#header {
	display: block;
	position: relative;
	height: 66px;
	z-index: 1001;
	background: var(--blue1);
}

header#header .max {
	height: 100%;
}

header#header .header {
	display: flex;
	align-items: center;
	height: 100%;
	gap: 24px;
}

header#header .header> a.logo {
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	margin: 0;
	gap: var(--gap-8);
	font-size: 20px;
	font-style: normal;
	font-weight: 500;
	color: #fff;
	margin: 0 26px 0 0;
}

header#header .header> a.logo> span {
	padding: 2px 0 0;
}

header#header .header> nav.links {
	display: flex;
	gap: var(--gap-16);
}

.sunMoon {
	display: flex;
	position: relative;
	margin: 0 26px 0 0;
	gap: 10px;
	height: 24px;
	cursor: pointer;
}

.sunMoon> .ico {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
}

.sunMoon> .ico> svg {
	filter: opacity(0);
	transition: all 0.3s;
	position: absolute;
}

.sunMoon> .ico> svg:last-child {
	filter: opacity(1);
}

.sunMoon.active> .ico> svg:last-child {
	filter: opacity(0);
}

.sunMoon.active> .ico> svg:first-child {
	filter: opacity(1);
}

.sunMoon> .smToggle {
	display: flex;
	position: relative;
	width: 48px;
	height: 24px;
	transition: all 0.3s;
	background: #EEF7FF;
	border-radius: 19px;
	border: 1px solid #ffffff;
}

.sunMoon> .smToggle> i {
	display: block;
	position: absolute;
	top: 3px;
	left: 3px;
	width: 16px;
	height: 16px;
	border-radius: 100%;
	background: var(--text-secondary);
	will-change: transform;
	transition: all 0.3s;
}

.sunMoon.active> .smToggle {
	background: #293D50;
	border-color: #465A6E;
}

.sunMoon.active> .smToggle> i {
	background: #0288D1;
	transform: translateX(24px);
}

header#header .header> nav.notifications {
	display: flex;
	position: relative;
	margin: 0 18px 0 0;
	height: 100%;
	align-items: center;
	justify-content: center;
}

header#header .header> nav.notifications> a {
	display: flex;
	position: relative;
	align-items: center;
	justify-content: center;
}

header#header .header> nav.notifications> a> i.noti {
	display: block;
	position: absolute;
	width: 6px;
	height: 6px;
	background: var(--red-600);
	border-radius: 100%;
	margin: -14px -14px 0 0;
	box-shadow: 0px 0px 0px 1px #fff;
}

header#header .header> nav.userdrop {
	display: flex;
	position: relative;
	height: 100%;
	align-items: center;
	justify-content: center;
}

header#header .header> nav.userdrop> a {
	color: #fff;
	display: flex;
	align-items: center;
	height: 48px;
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	gap: var(--gap-8);
}

header#header .header> nav.userdrop> a> .ico {
	display: flex;
	width: 30px;
	height: 30px;
	align-items: center;
	justify-content: center;
	border-radius: 15px;
	border: 1px solid var(--border-regular);
	background: #F1F5F9;
	color: var(--slate-900);
	font-size: 12px;
}

.userDropProfile {
	display: flex;
	flex-direction: column;
	position: relative;
	margin: -18px;
}

.userDropProfile> .info {
	display: flex;
	align-items: center;
	position: relative;
	padding: 12px 18px;
	border-bottom: 1px solid var(--slate-300);
	gap: var(--gap-8);
}

.userImg {
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	border-radius: 100%;
	background: var(--slate-300);
	overflow: hidden;
	width: 40px;
	height: 40px;
}

.userImg> img {
	width: 40px;
	height: auto;
	position: absolute;
}

.userDropProfile> .info> .name {
	display: flex;
	flex-direction: column;
	position: RELATIVE;
	color: var(--text-secondary);
	font-size: 14px;
	gap: 2px;
	flex-grow: 1;
}

.userDropProfile> .info> .name> b {
	color: var(--slate-900);
	font-size: 16px;
	font-weight: 600;
}

.userDropProfile> .jobType {
	position: relative;
	padding: 12px 18px;
	font-size: 14px;
	display: flex;
	gap: var(--gap-8);
	color: var(--slate-900);
}

.userDropProfile> .jobType> b {
	font-weight: 400;
	color: var(--text-secondary);
}

.userDropProfile> .exit {
	display: flex;
	position: relative;
	padding: 0 18px 12px;
}
/********************************************** END Header ***************************************************/














/************************************************** START wrapper construction ************************************************/
section.wrapper {
	display: flex;
	flex-wrap: wrap;
	position: relative;
}

section.sidebar {
	display: block;
	position: relative;
	width: 260px;
	max-height: calc(100vh - 66px);
	height: calc(100vh - 66px);
	overflow-x: hidden;
	overflow-y: overlay;
	background: #F8FAFC;
	border-right: 1px solid var(--border-regular);
	padding: 0 0 64px 0;
}

main.content {
	display: block;
	position: relative;
	width: 100%;
}

section.sidebar + main.content {
	width: calc(100% - 260px);
}

section.sidebar.hide + main.content {
	width: calc(100% - 60px);
}
/************************************************** END wrapper construction ************************************************/


















/************************************************** START sidebar ************************************************/
.hiddenSide {
	position: fixed;
	bottom: 18px;
	left: 186px;
	z-index: 3;
	min-width: 36px !important;
	height: 36px !important;
}

section.sidebar> nav {
	display: block;
	position: relative;
}

section.sidebar> nav> ul {
	display: flex;
	flex-direction: column;
	position: relative;
}

section.sidebar> nav> ul> li {
    border: 1px solid black;
    border-radius: 5px;
    margin: 5px;
	display: block;
	position: relative;
}

section.sidebar> nav> ul> li> ul {
	display: none;
	flex-direction: column;
	position: relative;
}

section.sidebar> nav> ul> li> a {
	display: flex;
	position: relative;
	min-height: 60px;
	align-items: center;
	padding: 12px;
	gap: var(--gap-8);
	color: var(--text-secondary);
	font-size: 15px;
	font-weight: 500;
	line-height: 24px;
}

section.sidebar> nav> ul> li> a:hover {
	color: var(--slate-900);
}

section.sidebar> nav> ul> li> a> .item {
	display: flex;
	width: 100%;
	gap: 6px;
	padding: 6px;
	position: relative;
	transition: all 0.1s;
	border-radius: 8px;
    flex-direction: column;
}

section.sidebar> nav> ul> li> a> .item> svg {
	min-width: 24px;
}

section.sidebar> nav> ul> li> a> .item> span {
    width: 100%;
    height: 100%;
    display: flex;
    font-size: 20px;
    font-weight: 600;
    color: black;
    padding: 1px 0 0;
    align-content: center;
    align-items: center;
}

section.sidebar> nav> ul> li> a> .item.disabled> span {
    color: darkred;
}

section.sidebar> nav> ul> li> a> .item> small {
    display: flex;
}

section.sidebar> nav> ul> li> a> .item> .ico {
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 16px;
	height: 16px;
	top: calc(50% - 8px);
	right: 6px;
	transition: filter 0.2s;
	/* filter: opacity(0); */
}

section.sidebar> nav> ul> li.active> a> .item> .ico {
	transform: scale(1, -1);
}

section.sidebar> nav> ul> li.active> a> .item {
	background: #E2E8F0;
}

section.sidebar> nav> ul> li.active> a {
	color: var(--slate-900);
}

/*section.sidebar> nav> ul> li> a svg path,*/
/*section.sidebar> nav> ul> li> a svg rect {*/
/*	transition: fill 0.1s;*/
/*}*/

section.sidebar> nav> ul> li> a:hover svg path,
section.sidebar> nav> ul> li> a:hover svg rect {
	fill: var(--slate-900);
}

section.sidebar> nav> ul> li.active> a svg path,
section.sidebar> nav> ul> li.active> a svg rect {
	fill: var(--slate-900);
}


section.sidebar> nav> ul> li> a:hover .ico svg path,
section.sidebar> nav> ul> li> a:hover .ico svg rect {
	fill: #94A3B8;
}

section.sidebar> nav> ul> li.active> a .ico svg path,
section.sidebar> nav> ul> li.active> a .ico svg rect {
	fill: #94A3B8;
}


section.sidebar> nav> ul> li> ul> li {
	display: block;
	position: relative;
}

section.sidebar> nav> ul> li> ul> li> a {
	display: block;
	position: relative;
	padding: 6px 12px;
	color: var(--slate-900);
	line-height: 18px;
}

section.sidebar> nav> ul> li> ul> li> a> span {
	display: flex;
	width: 100%;
	gap: 6px;
	padding: 6px;
	position: relative;
	border-radius: 8px;
	padding-left: 36px;
}




section.sidebar.hide {
	width: 60px;
}

section.sidebar.hide .hiddenSide {
	left: 12px;
}

section.sidebar.hide> nav> ul> li> ul {
	display: none !important;
}

section.sidebar.hide> nav> ul> li> a {
	padding: 0;
	justify-content: center;
}

section.sidebar.hide> nav> ul> li> a {
	padding: 12px;
}

section.sidebar.hide> nav> ul> li> a> .item> span,
section.sidebar.hide> nav> ul> li> a> .item> .ico {
	display: none;
}

section.sidebar.hide .hiddenSide svg {
	transform: scale(-1, 1);
}

section.sidebar> nav> ul> li> ul> li:hover> a> span {
	background: #E2E8F0;
}

section.sidebar> nav> ul> li> ul> li> a> span::before {
	content: '';
	display: block;
	width: 6px;
	height: 6px;
	position: absolute;
	top: 12px;
	left: 15px;
	background: var(--text-primary);
	border-radius: 100%;
	filter: opacity(0);
}

section.sidebar> nav> ul> li> ul> li.active> a> span::before {
	filter: opacity(1);
}

section.sidebar.hide> nav> ul> li> a> .item {
	min-width: max-content;
}
.__nitifications.active {
    font-weight: 600;
    color:black;
}
/************************************************** END sidebar ************************************************/
















/************************************************** START panel ************************************************/
section.panel {
	display: flex;
	position: relative;
	width: 100%;
	background: #F8FAFC;
	border-bottom: 1px solid var(--border-regular);
	padding: 0 24px;
	gap: var(--gap-16);
	height: 80px;
	z-index: 1000;
}

.guest {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.guest .card {
    display: flex;
    flex-direction: column;
}
.guest .card .title {
    display: flex;
    flex-direction: column;
    font-size: 20px;
    font-weight: 600;
    color: black;
    padding: 12px;
    align-content: center;
    align-items: center;
}

.guest .card .inputs {
    display: flex;
    flex-direction: column;
    color: black;
    padding: 8px 12px;
    align-content: center;
    align-items: center;
}

.guest .card .inputs label {
    width: 100%;
    padding: 12px;
    font-size: 12px;
    color: var(--text-primary);
}

.guest .card .inputs input {
    width: 100%;
    padding: 12px;
    font-size: 16px;
    border: 1px solid var(--border-regular);
    border-radius: 4px;
    outline: none;
    color: var(--text-primary);
}

.hubForm {
    min-width: 40%;
    border: 1px solid var(--border-regular);
    border-radius: 4px;
    padding: 12px;
    display: flex;
    flex-direction: column;
    background: #FFFFFF;
}

section.panel> .linkTitle {
	display: flex;
	gap: var(--gap-8);
	position: relative;
}

section.panel> .linkTitle> .title {
	display: flex;
	position: relative;
	gap: var(--gap-16);
	justify-content: center;
	align-items: center;
}

section.panel> .linkTitle> .title> a.back {
	display: flex;
	align-items: center;
	justify-content: center;
}

section.panel> .linkTitle> .title> a.back:hover svg path {
	fill: var(--text-primary);
}

section.panel> .linkTitle> .title> .titleDescription {
	display: flex;
	flex-direction: column;
	position: relative;
	color: var(--text-secondary, #62748E);
	font-size: var(--text-font-size-sm, 14px);
	font-style: normal;
	font-weight: 400;
	line-height: var(--space-5, 20px);
	gap: 6px;
}

section.panel> .linkTitle> .title> .titleDescription> .description {
	display: flex;
	gap: 16px;
	position: relative;
	flex-wrap: wrap;
}

section.panel> .linkTitle> .title h1 {
	display: block;
	position: relative;
	margin: 0;
	color: var(--text-primary, #101F2C);
	font-size: 21px;
	font-weight: 600;
}

section.panel> .actions {
	display: flex;
	position: relative;
	gap: var(--gap-16);
}

section.panel> .actions> .item {
	display: flex;
	position: RELATIVE;
	align-items: center;
}

section.panel> .actions> .item[data-state="isChange"] {
	display: none;
}

section.panel> .actions> .item> .status {
	display: flex;
	gap: var(--gap-8);
}

section.panel> .actions> .item> .status> b {
	font-weight: 500;
	color: var(--text-secondary);
}

section.panel> .actions> .item> .hrline {
	display: BLOCK;
	width: 1px;
	height: 40px;
	background: #CBD5E1;
}

section.panel> .actions> .item> form.search {
	display: block;
	position: relative;
	width: 210px;
	height: 40px;
}

section.panel> .actions> .item> form.search.search740 {
	width: 740px;
}

section.panel> .actions> .item> form.search> input.cui {
	padding-right: 40px;
	height: 40px;
	padding: 0 12px;
}

section.panel> .actions> .item> form.search> button {
	position: absolute;
	right: 0;
	background: transparent !important;
}

input.placeLight::placeholder {
	color: var(--border-regular) !important;
	font-size: 14px;
	font-style: italic;
	font-weight: 400;
	line-height: 18px; /* 128.571% */
}

section.panel> .actions> .item> form.search> button svg path {
	fill: var(--slate-300);
}

section.panel> .actions> .item> form.search> button:hover svg path {
	fill: var(--text-secondary);
}

button.buttonSelect {
	display: flex;
	position: relative;
	width: 240px;
	height: 40px;
	border: 1px solid var(--slate-300);
	background: var(--white, #FFF);
	color: var(--slate-900, #0F172A);
	border-radius: 10px;
	align-items: center;
	padding: 0 12px;
	justify-content: space-between;
	cursor: pointer;
}

button.buttonSelect> span {
	display: block;
	overflow: hidden;
	width: calc(100% - 40px);
	text-align: left;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

button.buttonSelect> .ico {
	margin: 0 -12px 0 0;
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-left: 1px solid var(--slate-300);
}

button.buttonSelect> .ico svg {
	height: auto;
	width: 18px;
	transition: transform 0.15s;
}

button.buttonSelect.open> .ico svg {
	transform: scale(1, -1);
}
/************************************************** END panel ************************************************/
















/************************************************** START context ************************************************/
/*** START cards (EXT context) ***/
/*** END cards (EXT context) ***/

section.context {
	display: block;
	position: relative;
	max-height: calc(100vh - 66px - 80px);
	height: calc(100vh - 66px - 80px);
	overflow-x: hidden;
	overflow-y: overlay;
	background: #E2E9F0;
	padding: 24px;
}
/************************************************** END context ************************************************/

















/************************************************** START catds ************************************************/
.cards {
	display: flex;
	flex-direction: column;
	position: relative;
	gap: var(--gap-8);
}

.cards> .item {
	display: flex;
	flex-direction: column;
	position: relative;
	background: #fff;
	border-radius: 12px;
	border: 1px solid var(--border-regular);
}

.cards> .item> .panel {
	display: flex;
	flex-wrap: wrap;
	position: relative;
	padding: 16px;
	gap: var(--gap-16);
}

.cards> .item> .panel> a.toggle {
	display: flex;
	align-items: center;
	justify-content: center;
}

.cards> .item> .panel> a.toggle:hover svg path {
	fill: #7d8fa7;
}

.cards> .item> .panel> a.toggle> svg {
	transition: transform 0.3s;
}

.cards> .item> .panel> a.toggle.active> svg {
	transform: scale(1, -1);
}

.cards> .item> .panel> .title {
	display: flex;
	flex-direction: column;
	gap: var(--gap-8);
	justify-content: center;
}

.cards> .item> .panel> .title> h3 {
	color: var(--text-primary);
	font-size: 18px;
	font-style: normal;
	font-weight: 600;
	margin: 0;
}

.cards> .item> .panel> .title> span {
	display: block;
	color: var(--text-secondary);
	font-size: 16px;
	font-weight: 400;
}

.cards> .item> .panel> .orderInfo {
	display: flex;
	gap: var(--gap-16);
}

.cards> .item> .panel> .orderInfo> .info {
	display: flex;
	flex-direction: column;
	position: RELATIVE;
	text-align: right;
	color: var(--text-secondary);
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	gap: var(--gap-8);
	justify-content: center;
}

.cards> .item> .panel> .orderInfo> .info> b {
	display: block;
	color: var(--text-primary);
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
}

.cards> .item> .panel> .orderInfo> .status {
    display: flex;
    align-items: center;
    border-left: 1px solid var(--border-regular);
    padding: 0 0 0 12px;
    color: var(--text-primary, #101F2C);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    width: 120px;
}

.cards> .item> .title,
.conTitle {
	display: flex;
	justify-content: space-between;
	align-items: center;
	position: relative;
	padding: var(--gap-16) var(--gap-16) 0;
}

.cards> .item> .title:last-child,
.conTitle:last-child {
	padding: var(--gap-16);
}

.cards> .item> .title> h3,
.conTitle> h3 {
	color: var(--text-primary, #101F2C);
	font-size: 16px;
	font-style: normal;
	font-weight: 600;
	margin: 0;
}

.cards> .item> .content {
	display: flex;
	flex-direction: column;
	position: relative;
	padding: var(--gap-16);
	gap: var(--gap-8);
	row-gap: var(--gap-16);
}

.cards> .item> .title.hidding,
.conTitle.hidding {
	display: none;
}

.cards> .item> .title.hidding.show,
.conTitle.hidding.show {
	display: flex;
}

.cards> .item> .content.hidding {
	display: none;
}

.cards> .item> .content.hidding.show {
	display: flex;
}

.cards> .item> .content> .item {
	display: flex;
	flex-direction: column;
	position: relative;
}

.cards .blocks {
	display: flex;
	flex-wrap: wrap;
	position: relative;
	column-gap: 44px;
	row-gap: var(--gap-16);
	color: var(--text-tertiary);
	font-weight: 400;
}

.cards .blocks b {
	font-weight: 400;
	color: var(--text-primary);
}

.cards .blocks> .item {
	display: flex;
	gap: var(--gap-8);
	align-items: center;
	min-height: 40px;
	flex-wrap: wrap;
	padding-right: 32px;
}

.cards .blocks> .item:last-child {
	padding-right: 0;
}

a[data-enity="reUploadFile"] {
	filter: opacity(0);
}

.btn:hover a[data-enity="reUploadFile"] {
	filter: opacity(1);
}

a.fileico {
	display: flex;
	align-items: center;
	justify-content: center;
}

a.fileico svg path {
	fill: var(--text-secondary);
}

a.fileico:hover svg path {
	fill: var(--text-primary);
}

a.fileico svg rect {
	fill: var(--text-secondary);
}

a.fileico:hover svg rect {
	fill: var(--text-primary);
}

.cards .blocks.medium {
	font-weight: 400;
}

.cards .blocks.medium span b {
	font-weight: 500;
	color: var(--text-secondary);
}

.cards .blocks.medium> .item {
	column-gap: 24px;
}

.flexForm {
	display: flex;
	position: relative;
	padding: 8px 0 8px;
	gap: var(--gap-16);
}

.addRequirement td> b {
	padding: 8px 0 0;
	display: block;
	font-weight: 500;
}

.flexForm input.cui:not([type="checkbox"]):not([type="radio"]) {
	font-size: 14px;
	height: 40px;
}

.cards .blocks {
	column-gap: var(--gap-16);
}

.cards .blocks.inputs> .item {
	flex-direction: column;
	align-items: flex-start;
	gap: var(--gap-8);
	padding-right: 0;
}

.cards .blocks.inputs> .item b {
	font-weight: 500;
}

.inputBefore {
	display: block;
	position: relative;
	width: 100%;
}

.inputBefore.w150 {
	max-width: 150px;
}

.inputBefore.changeModal> input.cui {
	padding-right: 50px;
}

.inputBefore.changeModal> a, .inputBefore.changeModal> span {
	display: flex;
	width: 24px;
	height: 24px;
	position: absolute;
	top: calc(50% - 12px);
	right: 12px;
}

.inputBefore.changeModal> span {
	pointer-events: none;
}



.selectBefore {
	display: block;
	position: relative;
	width: 100%;
}

.selectBefore.w150 {
	max-width: 150px;
}

.selectBefore> select.cui {
	padding-right: 50px;
	-webkit-appearance: none;
}

.selectBefore> a, .selectBefore> span {
	display: flex;
	width: 24px;
	height: 24px;
	position: absolute;
	top: calc(50% - 12px);
	right: 12px;
}

.selectBefore> span {
	pointer-events: none;
}



.hiddenText.shower> .text {
	max-height: initial;
	display: block;
}

.hiddenText {
	position: relative;
	width: 710px;
	overflow: hidden;
	color: var(--text-primary, #101F2C);
}

.hiddenText> .text {
	text-overflow: ellipsis;
	display: -webkit-box;
	max-height: 40px;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	align-self: stretch;
	overflow: hidden;
	line-height: var(--space-5, 20px);
}

button.toggleHiddenText {
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	cursor: pointer;
	border: 0;
	background: transparent;
	width: 24px;
	height: 24px;
	margin: 10px auto 0;
}

button.toggleHiddenText svg {
	will-change: transform;
	transition: transform 0.2s;
}

.shower button.toggleHiddenText svg {
	transform: scale(1, -1);
}
/************************************************** END cards ************************************************/



















/************************************************** START table ************************************************/
.table {
	display: block;
	position: relative;
	/*overflow: hidden;*/
	border-radius: 12px;
	border: 1px solid var(--border-regular);
	background: #fff;
}

.table> table {
	min-width: 100%;
	/*margin-bottom: -1px;*/
}

.table> table tr> th {
	padding: 0 12px;
	vertical-align: middle;
	background: var(--table-background-head);
	height: 48px;
	border: 1px solid var(--table-border);
	border-width: 0 1px 1px 0;
	text-align: left;
	white-space: nowrap;
	color: var(--text-primary);
	font-size: 14px;
	font-style: normal;
	font-weight: 500;
}

.table> table tr:first-child> th:first-child {
	border-top-left-radius: 12px;
}

.table> table tr:first-child> th:last-child {
	border-top-right-radius: 12px;
}

.table> table tr:last-child> td:first-child, .table> table tr:has(+ tr.hidding:not(.show):last-child)> td:first-child {
	border-bottom-left-radius: 12px;
}

.table> table tr:last-child> td:last-child, .table> table tr:has(+ tr.hidding:not(.show):last-child)> td:last-child {
	border-bottom-right-radius: 12px;
}

.table> table tr:has(+ tr.hidding:not(.show):last-child)> td {
	border-bottom: 0;
}

.table> table tr:has(+ tr.hidding:not(.show):last-child) {
	border-bottom-left-radius: 12px;
	border-bottom-right-radius: 12px;
}

.table> table tr> th.tableName {
	padding-left: 42px;
}

.table> table tr> th.tableName.nodrag {
	padding-left: 24px;
}

.table> table tr> th:last-child {
	border-right: 0;
}

.table > table:not(:has(> tbody > tr:not(.hidding))) > thead > tr > th:first-child {
	border-bottom-left-radius: 12px;
}

.table > table:not(:has(> tbody > tr:not(.hidding))) > thead > tr > th:last-child {
	border-bottom-right-radius: 12px;
}

.table > table:not(:has(> tbody > tr:not(.hidding))) > thead > tr > th {
	border-bottom: 0;
}

.table> table tr> td {
	padding: 6px 12px;
	min-height: 44px;
	border: 1px solid #cfd0db;
	border-width: 0 1px 1px 0;
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	color: var(--text-primary);
	line-height: 18px;
	position: relative;
}

.table> table tr.red> td {
	background: var(--highlighted-cell, rgba(222, 87, 111, 0.15)) !important;
	text-decoration: line-through;
}

.table> table tr.red.nothrough> td {
	text-decoration: none;
}

.table> table tr> td.red {
	background: var(--highlighted-cell, rgba(222, 87, 111, 0.15)) !important;
}

.table> table tr> td> .nameMove {
	display: flex;
	gap: 2px;
	align-items: center;
}

.table> table tr> td> .nameMove> button.badge {
	position: absolute;
	right: 10px;
}

.table> table tr> td> .nameMove> a.toggle {
	display: flex;
	align-items: center;
	justify-content: center;
	filter: opacity(0);
	transition: filter 0.2s, transform 0.3s;
	margin: 0 1px 0 6px;
}

.table> table tr> td> .nameMove> .move + a.toggle {
	margin: 0 1px 0 -2px;
}

.table> table tr> td> .nameMove> .name {
	display: block;
	width: calc(100% - 54px);
}

.table> table tr> td> .nameMove> button.badge + .name {
	padding-right: 94px;
}

.table> table tr.addRequirement> td> .nameMove> a.toggle {
	pointer-events: none;
	filter: opacity(0) !important;
}

.table> table tr> td> .nameMove> a.toggle svg path {
	transition: all 0.1s;
}

.table> table tr> td> .nameMove> a.toggle:hover svg rect {
	fill: var(--text-primary);
}

.table> table tr:hover> td> .nameMove> a.toggle,
.table> table tr.active> td> .nameMove> a.toggle {
	filter: opacity(1);
}

.table> table tr.active> td> .nameMove> a.toggle {
	transform: scale(1, -1);
}

.table> table tr> td:last-child {
	border-right: 0;
}

.table> table tr:last-child> td {
	border-bottom: 0;
}

.table> table tr> td.nopadding {
	padding: 0;
}

.table> table tr> td.min {
	width: 1%;
	white-space: nowrap;
}

.table> table tr> td.max180 {
	width: 180px;
}

.table> table tr> td.max210 {
	width: 210px;
}

.table> table tr> td.min90 {
	min-width: 90px;
}

.table> table tr> td.min120 {
	min-width: 120px;
}

.table> table tr> td> .nameMove> span.move {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 48px;
	cursor: grab;
}

.table> table tr> td> .nameMove> span.move.disable {
	filter: opacity(0.5);
	cursor: no-drop;
}

.table> table tr:hover> td {
	background: #F8FAFC;
}

.ui-state-highlight-table {
	background: #ffffea;
	border: 0;
}

.table> table tr.ui-sortable-helper {
	z-index: 10;
	position: relative;
	box-shadow: 0px 0px 10px rgb(0 0 0 / 20%);
}

.table> table tr.ui-sortable-helper td {
	border-bottom-color: transparent;
}

.table> table tr.hidding> td[colspan="7"] {
	padding: var(--gap-16);
}

.table> table tr:not(.show).hidding {
	display: none;
}

input.tdInput, textarea.tdInput {
	margin: -5px -5px;
	min-height: 42px;
	border: 0;
	padding: 0 5px;
	border-bottom: 1px solid #CBD5E1;
	width: calc(100% + 10px);
	min-width: calc(100% + 10px);
	background: transparent;
}

input.tdInput:not([readonly]):focus, textarea.tdInput:not([readonly]):focus {
	border-color: var(--blue1);
}

input.tdInput.error, textarea.tdInput.error {
	border-color: var(--red-400);
}

.text-right input.tdInput,
.text-right textarea.tdInput {
	text-align: right;
}

.changeDateTime {
	display: flex;
	align-items: center;
	gap: var(--gap-8);
	position: RELATIVE;
}

textarea.tdInput {
	vertical-align: middle;
	padding-top: 12px;
	height: 0;
	max-width: calc(100% + 10px);
	resize: vertical;
}

.beforeSelect {
	display: block;
	position: relative;
	margin: -6px -12px;
	height: 48px;
	width: calc(100% + 24px);
}

.beforeSelect> select {
	width: 100%;
	height: 100%;
	background: transparent;
	border: 0;
	cursor: pointer;
	-webkit-appearance: none;
	padding: 0 32px 0 12px;
	min-width: 120px;
}

.beforeSelect> svg {
	position: absolute;
	right: 12px;
	top: calc(50% - 6px);
	transition: all 0.1s;
	filter: opacity(1);
	pointer-events: none;
}

.table> table tr.addRequirement:not(.show) {
	display: none;
}

.table .hiddenInput {
	display: none;
}

.correctComment {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: var(--gap-16);
}

.correctComment> .commentArea {
	flex-grow: 1;
	max-width: 720px;
	display: flex;
	flex-direction: column;
	position: relative;
	gap: var(--gap-8);
}

.correctComment> .commentArea> b {
	display: block;
	color: var(--input-text-title, #101F2C);
	font-weight: 500;
}
/************************************************** END table ************************************************/













/************************************************** START add order form ************************************************/
.addOrderForm {
	display: flex;
	position: relative;
	flex-wrap: wrap;
}

.addOrderForm> .addOrderLeft {
	display: FLEX;
	flex-direction: column;
	position: relative;
	width: 740px;
	margin: 0 var(--gap-16) 0 0;
	gap: var(--gap-8);
}

.addOrderForm> .addOrderRight {
	display: flex;
	flex-direction: column;
	position: relative;
	width: calc(100% - 740px - var(--gap-16));
	gap: var(--gap-8);
}

.addOrderForm> .addOrderLeft> .title {
	display: flex;
	justify-content: space-between;
}

.addOrderForm> .addOrderLeft> .title> b {
	font-weight: 500;
}

.addOrderForm> .addOrderLeft> .title> span {
	font-size: 12px;
	font-style: italic;
	color: var(--text-secondary);
}

.addOrderForm> .addOrderLeft textarea.cui {
	height: 170px;
	max-width: 100%;
	min-width: 180px;
	font-size: 14px;
	line-height: 18px;
	resize: vertical;
	max-height: 300px;
}

.addOrderForm> .addOrderRight> h3 {
	display: block;
	margin: 0;
	font-size: 14px;
	font-weight: 500;
	padding: 8px 0 0;
}

.addOrderForm> .addOrderRight> span {
	display: block;
	color: var(--text-secondary);
}

.dopFilesArea {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 80px;
	font-size: 12px;
	color: var(--text-secondary);
	position: relative;
	border-radius: 6px;
	border: 2px dashed var(--border-regular, #CBD5E1);
	background: var(--panel-background, #F8FAFC);
}

.dopFilesArea> input {
	position: absolute;
	width: 100%;
	height: 100%;
	display: block;
	opacity: 0;
	top: 0;
	left: 0;
	z-index: 1;
	cursor: pointer;
}


.dopFilesArea> .info {
	display: flex;
	align-items: center;
	gap: var(--gap-8);
}

.addOrderForm> .addOrderRight> .dopFilesArea {
	max-width: 430px;
}

.filesList {
	display: flex;
	flex-wrap: wrap;
	position: relative;
	gap: var(--gap-8);
}

.filesList .file input {
	display: none;
}
/************************************************** END add order form ************************************************/













/************************************************** START Order History ************************************************/
.orderHistoryList {
	display: flex;
	flex-direction: column;
	position: relative;
}

.orderHistoryList::before {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 2px;
	bottom: 0;
	background: #E5EAF0;
}

.orderHistoryList> .item {
	display: flex;
	flex-direction: column;
	position: relative;
	padding: 20px 0 24px 20px;
	gap: 14px;
}

.orderHistoryList> .item> .date {
	display: block;
	position: relative;
	color: var(--text-secondary, #62748E);
	font-size: 14px;
	line-height: var(--space-5, 20px);
}

.orderHistoryList> .item> .date::before {
	content: '';
	width: 8px;
	height: 8px;
	position: absolute;
	top: calc(50% - 4px);
	left: -23px;
	background: #CBD5E1;
	border-radius: 100%;
	transform: scale(1);
	will-change: transform;
	transition: transform 0.2s;
}

.orderHistoryList> .item:hover> .date::before {
	transform: scale(1.3);
}

.orderHistoryList> .item> .title {
	display: block;
	position: relative;
	color: var(--text-primary, #101F2C);
	font-size: var(--text-font-size-base, 16px);
	font-style: normal;
	font-weight: 600;
	line-height: var(--space-6, 24px);
}

.orderHistoryList> .item>  .info {
	display: flex;
	gap: 12px;
	position: RELATIVE;
	color: var(--text-tertiary, #94A3B8);
	font-size: var(--text-font-size-sm, 14px);
	font-style: normal;
	font-weight: 400;
	line-height: var(--space-5, 20px);
}

.orderHistoryList> .item> .info b {
	color: var(--text-primary, #101F2C);
	font-weight: 400;
}

.orderHistoryList> .item.active> .date {
	color: var(--text-primary, #101F2C);
}

.orderHistoryList> .item.active> .date::before {
	background: #101F2C;
	box-shadow: 0px 0px 0px 1px #fff, 0px 0px 0px 2px #101F2C;
}
/************************************************** END Order History ************************************************/














/************************************************** SRART scrolling table AND Requirements ************************************************/
.table.tableScrolling> table tr> td {
	padding-top: 14px;
	padding-bottom: 14px;
}

.table.tableScrolling> table tr> th:first-child {
	padding-left: 26px;
}

.table.tableScrolling> table> thead> tr> th {
	border-bottom: 3px;
	background: #fff;
	padding-top: 18px;
	padding-bottom: 18px;
	height: initial;
	font-weight: 600;
}

.table.tableScrolling {
	overflow-y: auto;
	max-height: calc(100vh - 194px);
}

.table.tableScrolling::-webkit-scrollbar {
	display: none;
}

.table.tableScrolling> table> thead {
	z-index: 999;
	position: relative;
	background: #fff;
	position: sticky;
	top: 0;
	box-shadow: 0px 3px 0px #94A3B8;
}

.requirementInfo.cards {
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	gap: 74px;
}

.requirementInfoRight {
	padding: 10px 0 0;
}

.requirementInfoLeft {
	display: flex;
	flex-direction: column;
	position: relative;
	gap: 18px;
	align-items: baseline;
}

.rezervTitle {
	display: block;
	position: relative;
	color: var(--text-primary, #101F2C);

	/* heading/base */
	font-size: var(--text-font-size-base, 16px);
	font-style: normal;
	font-weight: 600;
	line-height: var(--space-6, 24px); /* 150% */
	margin: 0 0 20px;
}

.rezervBlock {
	display: flex;
	position: relative;
	gap: 12px;
	/* justify-content: space-between; */
}

.rezervBlock> .rezervIco {
	display: flex;
	position: relative;
	border-radius: 6px;
	border: 1px solid var(--border-regular, #CBD5E1);
	background: var(--background-surface, #FFF);
	width: 300px;
	padding: 3px;
	height: 38px;
	gap: 1px;
}

.rezervBlock> .rezervIco> span {
	display: block;
	position: relative;
	background: var(--green, #64B170);
}

.rezervBlock> .rezervIco> span:first-child {
	border-radius: 6px 0 0 6px;
}

.rezervBlock> .rezervIco> span:last-child {
	border-radius: 0 6px 6px 0;
	background: #0288D1;
}

.rezervBlock>  .rezervInfo {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	font-size: 13px;
	font-weight: 400;
}

span.tdPadding {
	display: block;
	padding: 8px 0;
}
/************************************************** END scrolling table AND Requirements ************************************************/















/************************************************** START Supplies ************************************************/
.cards.suppliesList> .item {
	overflow: hidden;
}

.cards.suppliesList> .item> .header {
	display: flex;
	position: relative;
	background: var(--background-hover-surface, #F8FAFC);
	padding: 16px;
	gap: 16px;
}

.cards.suppliesList> .item> .header> .ico {
	display: flex;
	align-items: center;
	justify-content: center;
}

.cards.suppliesList> .item> .header> .ico> a {
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	transition: all 0.2s;
}

.cards.suppliesList> .item.show> .header> .ico> a {
	transform: scale(1, -1);
}

.cards.suppliesList> .item> .header> .name {
	display: flex;
	flex-direction: column;
	position: relative;
	gap: 8px;
	color: var(--text-secondary, #62748E);
	font-size: var(--text-font-size-base, 16px);
	font-style: normal;
	font-weight: 400;
	line-height: var(--space-6, 24px);
	flex-grow: 1;
}

.cards.suppliesList> .item> .header> .name> h3 {
	display: block;
	color: var(--text-primary, #101F2C);
	font-size: var(--text-font-size-lg, 18px);
	font-style: normal;
	font-weight: 600;
	margin: 0;
}

.cards.suppliesList> .item> .header> .name> .description {
	display: flex;
	gap: 16px;
}

.cards.suppliesList> .item> .header> .info {
	display: flex;
}

.cards.suppliesList> .item> .header> .info> .item {
	display: flex;
	flex-direction: column;
	padding: 0 12px;
	justify-content: center;
	border-left: 1px solid var(--table-border, #CBD5E1);
	min-width: 168px;
	color: var(--text-primary, #101F2C);
	font-size: var(--text-font-size-sm, 14px);
	font-style: normal;
	font-weight: 400;
	line-height: var(--space-5, 20px);
	gap: 8px;
}

.cards.suppliesList> .item> .header> .info> .item> b {
	font-weight: 400;
}

.cards.suppliesList> .item> .header> .info> .item> span {
	color: var(--text-tertiary, #94A3B8);
	font-size: var(--text-font-size-xs, 12px);
	font-style: normal;
	font-weight: 400;
	line-height: var(--space-4, 16px);
}

.cards.suppliesList> .item> .content {
	display: none;
	border-top: 1px solid var(--border-subtle, #EAEEF2);
}

.cards.suppliesList> .item.show> .content {
	display: flex;
}

.cards.suppliesList> .item> .content> .conTitle {
	padding: 0;
}

.supplyReservs {
	display: flex;
	position: relative;
	gap: 16px;
	justify-content: space-between;
}

.supplyReservs> .reservsTable {
	width: calc(100% - 360px - 16px);
	display: flex;
	flex-direction: column;
	position: relative;
	gap: 16px;
}

.supplyReservs> .reservsInfo {
	display: flex;
	flex-direction: column;
	position: relative;
	width: 360px;
	gap: 16px;
}

.rowTitle {
	display: flex;
	flex-wrap: wrap;
	position: relative;
	gap: 16px;
	align-items: center;
	min-height: 24px;
}

.rowTitle> h3 {
	margin: 0;
	color: var(--text-primary, #101F2C);
	font-size: var(--text-font-size-base, 16px);
	font-style: normal;
	font-weight: 600;
	line-height: var(--space-6, 24px);
}

span.badge {
	border-radius: var(--rounded-xl, 12px);
	border: 1px solid var(--border-regular, #CBD5E1);
	background: var(--background-base, #E2E9F0);
	position: relative;
	display: inline-flex;
	padding: 2px var(--space-2, 8px);
	justify-content: center;
	align-items: center;
	gap: 10px;
}

span.badge.red {
	border: 1px solid rgba(0, 0, 0, 0.10);
	background: var(--text-warning, #DE576F);
	color: #fff;
}

span.badge.green {
	border: 1px solid rgba(0, 0, 0, 0.10);
	background: var(--green, #64B170);
	color: #fff;
}

span.badgetext {
	display: block;
	position: relative;
}

span.badgetext.red {
	color: var(--text-warning, #DE576F);
}

span.badgetext.green {
	color: var(--green, #64B170);
}

span.badge + span.badgetext {
	margin-left: -8px;
}

.supplyDocumentsList {
	display: flex;
	flex-direction: column;
	position: relative;
	gap: 8px;
	column-gap: 48px;
	flex-wrap: wrap;
}

.supplyDocumentsList> .item {
	display: flex;
	align-items: center;
	position: relative;
	padding: 8px 0 8px;
	min-height: 40px;
	gap: 8px;
}

.supplyDocumentsList> .item> .ico {
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	border-radius: var(--space-5, 20px);
	border: 1px solid var(--border-regular, #CBD5E1);
	background: var(--background-surface, #FFF);
	width: 20px;
	height: 20px;
	padding: 2px 0 0;
	margin: 0 0 -1px;
}

.supplyDocumentsList> .item> .ico> svg {
	width: auto;
	height: 11px;
}

.supplyDocumentsList> .item> .ico> svg path {
	fill: #CBD5E1;
}

.supplyDocumentsList> .item> input {
	display: none;
}

.supplyDocumentsList> .item> a[data-enity="documentReset"] {
	display: none;
	align-items: center;
	justify-content: center;
	position: relative;
	bottom: -1px;
}

.supplyDocumentsList> .item> a[data-enity="documentReset"] svg {
	height: auto;
	width: 24px
}

.supplyDocumentsList> .item> a[data-enity="documentUpload"] {
	display: block;
}

.supplyDocumentsList> .item.uploaded> .name {
	color: var(--text-link, #0288D1);
}

.supplyDocumentsList> .item.uploaded> .ico {
	border: 1px solid var(--button-accent-background-normal, #0288D1);
	background: var(--button-accent-background-normal, #0288D1);
}

.supplyDocumentsList> .item.uploaded> .ico> svg path {
	fill: #fff;
}

.supplyDocumentsList> .item.uploaded> a[data-enity="documentReset"] {
	display: flex;
}

.supplyDocumentsList> .item.uploaded> a[data-enity="documentUpload"] {
	display: none;
}
/************************************************** END Supplies ************************************************/














/************************************************** START Модалка выбор заявки и потребности для резервирования ************************************************/
span.badgetext {
	display: block;
	position: relative;
}

span.badgetext.red {
	color: var(--text-warning, #DE576F);
}

span.badge + span.badgetext {
	margin-left: -8px;
}

.modal.reservItemChange .modalContent {
	max-width: 1480px;
}

.modalContent> .content.reservForm {
	margin: -24px -32px;
	z-index: 10;
	display: flex;
	flex-wrap: wrap;
	position: relative;
}

form.reservForm> .rfSidebar {
	display: flex;
	flex-direction: column;
	position: relative;
	width: 300px;
	border-right: 1px solid var(--border-regular);
}

form.reservForm> .rfContent {
	display: flex;
	flex-direction: column;
	position: relative;
	width: calc(100% - 300px);
}

form.reservForm> .rfButtons {
	display: flex;
	justify-content: space-between;
	width: 100%;
	position: relative;
	padding: 20px 24px;
	border-top: 1px solid var(--border-regular, #CBD5E1);
}

form.reservForm> .rfSidebar> .rfSearch {
	display: block;
	position: relative;
	border-bottom: 1px solid var(--table-border, #CBD5E1);
	background: var(--table-background-head, #E7EDF5);
	padding: 12px 16px;
}

form.reservForm> .rfSidebar> .rfSearch> .searchArea {
	display: block;
	position: relative;
	width: 100%;
	height: 40px;
}

form.reservForm> .rfSidebar> .rfSearch> .searchArea> input {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	font-size: var(--text-font-size-sm, 14px);
	font-style: normal;
	font-weight: 400;
	padding-right: 50px;
}

form.reservForm> .rfSidebar> .rfSearch> .searchArea> input::placeholder {
	font-style: normal;
	font-weight: 400;
}

form.reservForm> .rfSidebar> .rfSearch> .searchArea> button {
	position: absolute;
	right: 1px;
	padding-right: 10px;
	top: 1px;
	bottom: 1px;
	height: auto;
}

.modal.reservItemChange .modalContent> .title {
	border-bottom-color: var(--border-regular);
}

form.reservForm> .rfSidebar> .rfOrdersList {
	display: block;
	position: relative;
	max-height: calc(100vh - 318px);
	overflow-x: hidden;
	overflow-y: overlay;
	padding: 8px 4px 8px 16px;
	scrollbar-gutter: stable;
	gap: 8px;
	display: flex;
	flex-direction: column;
}

form.reservForm> .rfSidebar> .rfOrdersList::-webkit-scrollbar {
	width: 12px;
}

form.reservForm> .rfSidebar> .rfOrdersList::-webkit-scrollbar-thumb {
	background-color: #94A3B8;
}

form.reservForm> .rfSidebar> .rfOrdersList> a {
	display: flex;
	flex-direction: column;
	position: relative;
	padding: var(--space-2, 8px) var(--rounded-lg, 8px);
	align-self: stretch;
	border-radius: 8px;
	color: var(--text-secondary, #62748E);
	line-height: var(--space-5, 20px);
	gap: 2px;
}

form.reservForm> .rfSidebar> .rfOrdersList> a> h3 {
	margin: 0;
	color: var(--text-primary, #101F2C);
	font-family: var(--font-family-system, Inter);
	font-size: 16px;
	font-style: normal;
	font-weight: 500;
	line-height: 24px;
}

form.reservForm> .rfSidebar> .rfOrdersList> a.active {
	background: var(--panel-highlighted, #E2E8F0);
}

form.reservForm> .rfSidebar> .rfOrdersList> a:not(.active):hover {
	background: #F1F5F9;
}

form.reservForm> .rfContent> .rfOrderRequirementsHeader {
	display: flex;
	position: relative;
	height: 65px;
	border-bottom: 1px solid var(--table-border, #CBD5E1);
	background: var(--table-background-head, #E7EDF5);
	padding: 0 24px;
	gap: 16px;
}

form.reservForm> .rfContent> .rfOrderRequirementsHeader> .item {
	display: flex;
	align-items: center;
	white-space: nowrap;
	color: var(--table-text-head, #101F2C);
	font-weight: 500;
}

form.reservForm> .rfContent> .rfOrderRequirementsHeader> .item.name,
form.reservForm> .rfContent> .rfOrderRequirementsList> label.item> .info> .item.name {
	flex-grow: 1;
	white-space: initial;
}

form.reservForm> .rfContent> .rfOrderRequirementsHeader> .item.count,
form.reservForm> .rfContent> .rfOrderRequirementsHeader> .item.stock,
form.reservForm> .rfContent> .rfOrderRequirementsHeader> .item.date,
form.reservForm> .rfContent> .rfOrderRequirementsList> label.item> .info> .item.count,
form.reservForm> .rfContent> .rfOrderRequirementsList> label.item> .info> .item.stock,
form.reservForm> .rfContent> .rfOrderRequirementsList> label.item> .info> .item.date {
	text-align: right;
	min-width: 80px;
	justify-content: flex-end;
}

form.reservForm> .rfContent> .rfOrderRequirementsHeader> .item.unit,
form.reservForm> .rfContent> .rfOrderRequirementsList> label.item> .info> .item.unit {
	min-width: 40px;
}

form.reservForm> .rfContent> .rfOrderRequirementsList {
	position: relative;
	max-height: calc(100vh - 318px);
	overflow-x: hidden;
	overflow-y: overlay;
	padding: 8px 4px 8px 16px;
	scrollbar-gutter: stable;
	display: flex;
	flex-direction: column;
}

form.reservForm> .rfContent> .rfOrderRequirementsList::-webkit-scrollbar {
	width: 12px;
}

form.reservForm> .rfContent> .rfOrderRequirementsList::-webkit-scrollbar-thumb {
	background-color: #94A3B8;
}


form.reservForm> .rfContent> .rfOrderRequirementsList> label.item {
	display: block;
	position: relative;
	cursor: pointer;
}

form.reservForm> .rfContent> .rfOrderRequirementsList> label.item> input {
	display: none;
}

form.reservForm> .rfContent> .rfOrderRequirementsList> label.item> .info {
	display: flex;
	padding: 16px 8px;
	gap: 16px;
	border-radius: 8px;
	z-index: 2;
	position: relative;
}

form.reservForm> .rfContent> .rfOrderRequirementsList> label.item::after {
	content: '';
	height: 2px;
	display: block;
	position: absolute;
	bottom: 0;
	left: 8px;
	right: 8px;
	background: #F4F6F8;
	z-index: 1;
}

form.reservForm> .rfContent> .rfOrderRequirementsList> label.item:last-child::after {
	display: none;
}

form.reservForm> .rfContent> .rfOrderRequirementsList> label.item> .info> .item {
	display: flex;
	align-items: center;
	white-space: nowrap;
}

form.reservForm> .rfContent> .rfOrderRequirementsList> label.item> .info> .item.name {
	flex-grow: 1;
	white-space: initial;
}

form.reservForm> .rfContent> .rfOrderRequirementsList> label.item:hover> input:not(:checked) + .info {
	background: #F1F5F9;
}


form.reservForm> .rfContent> .rfOrderRequirementsList> label.item> input:checked + .info {
	background: var(--text-accent, #0288D1);
	color: #fff;
}

span.emptyText {
	display: block;
	position: relative;
	color: var(--text-tertiary, #94A3B8);
}

form.reservForm> .rfContent> .rfOrderRequirementsList> span.emptyText {
	padding: 8px;
}
/************************************************** END Модалка выбор заявки и потребности для резервирования ************************************************/