:root {

	color-scheme: light;

	--ns-tk-radius: 8px;
	--ns-tk-radius-sm: 5px;

--ns-esp-1: 8px;
	--ns-esp-2: 16px;
	--ns-esp-3: 28px;

	--ns-ombre: 0 0 1px rgb(0 0 0 / 7%), 0 2px 24px rgb(0 0 0 / 6%);
	--ns-ombre-forte: 0 0 1px rgb(0 0 0 / 10%), 0 6px 30px rgb(0 0 0 / 10%);
	--ns-contour: transparent;

	--ns-fond: #ffffff;
	--ns-fond-2: #f6f7f9;
	--ns-trait: #d5d9df;
	--ns-trait-fort: #c2c8d1;
	--ns-texte: #12151c;
	--ns-texte-2: #585f6d;
	--ns-gris: #828a99;

	--ns-ok: #147b3a;
	--ns-attention: #9c4d11;
	--ns-critique: #c0362c;
	--ns-info: #097990;
	--ns-ok-fond: #e7f5ec;
	--ns-attention-fond: #fdeee3;
	--ns-critique-fond: #fdeceb;
	--ns-info-fond: #ebf7fa;

--ns-tk-1-fond: #eeeefc;
	--ns-tk-1-trait: #4a4dc9;
	--ns-tk-2-fond: #fdecec;
	--ns-tk-2-trait: #b8332f;
	--ns-tk-3-fond: #e9f8f2;
	--ns-tk-3-trait: #2f8a68;
	--ns-tk-4-fond: #e7f4fd;
	--ns-tk-4-trait: #1f7fb8;
}

body.body__dark {

	color-scheme: dark;

--ns-ombre: 0 0 0 1px rgb(255 255 255 / 5%), 0 2px 20px rgb(0 0 0 / 40%);
	--ns-ombre-forte: 0 0 0 1px rgb(255 255 255 / 9%), 0 8px 30px rgb(0 0 0 / 55%);
	--ns-contour: transparent;

	--ns-fond: #151821;
	--ns-fond-2: #1b1f29;
	--ns-trait: #2a303c;
	--ns-trait-fort: #3a4252;
	--ns-texte: #eef0f4;
	--ns-texte-2: #9aa2b1;
	--ns-gris: #727a8a;

	--ns-ok: #3fbb74;
	--ns-attention: #dc8438;
	--ns-critique: #f0776a;
	--ns-info: #45afc4;
	--ns-ok-fond: #12241a;
	--ns-attention-fond: #291b0f;
	--ns-critique-fond: #2a1614;
	--ns-info-fond: #0e2429;

--ns-tk-1-fond: #23244a;
	--ns-tk-1-trait: #9fa1f5;
	--ns-tk-2-fond: #3a1f1e;
	--ns-tk-2-trait: #f0908d;
	--ns-tk-3-fond: #17332a;
	--ns-tk-3-trait: #7fd6b3;
	--ns-tk-4-fond: #16323f;
	--ns-tk-4-trait: #7cc7f0;
}

body:not(.this__is__login__page) .main__page__wraper .main__page__content {
	padding-right: calc(var(--gap) * 1.5);
}

.ns-tk {
	max-width: 1180px;
	margin-inline: auto;
	color: var(--ns-texte);

	padding-top: calc(var(--gap) * 1.5);
}

.ns-tk__recap[hidden],
[data-ns-tk-deptfield][hidden] {
	display: none;
}

.ns-tk__head {
	margin-bottom: var(--ns-esp-3);
}

.ns-tk__step {
	display: inline-block;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--ns-gris);
	margin-bottom: var(--ns-esp-1);
}

.ns-tk__title {
	font-size: 22px;
	font-weight: 600;
	line-height: 1.3;
	color: var(--ns-texte);
	margin: 0 0 6px;
}

.ns-tk__lead {
	font-size: 14px;
	line-height: 1.6;
	color: var(--ns-texte-2);
	margin: 0;
	max-width: 62ch;
}

.ns-tk__cell {
	margin-bottom: var(--ns-esp-2);
}

.ns-tk__dept {
	display: flex;
	flex-direction: column;
	height: 100%;
	padding: var(--ns-esp-2);
	border: 1px solid var(--ns-contour);
	border-radius: var(--ns-tk-radius);
	background: var(--ns-fond);
	box-shadow: var(--ns-ombre);
	color: var(--ns-texte);
	text-decoration: none;
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.ns-tk__dept:hover,
.ns-tk__dept:focus-visible {
	color: var(--ns-texte);
	text-decoration: none;
	transform: translateY(-2px);
	box-shadow: var(--ns-ombre-forte);
}

.ns-tk__dept:focus-visible {
	outline: 2px solid var(--ns-info);
	outline-offset: 2px;
}

.ns-tk__dept-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: var(--ns-tk-radius-sm);
	font-size: 19px;
	margin-bottom: var(--ns-esp-2);

	background: var(--ns-fond-2);
	color: var(--ns-texte-2);
}

.ns-tk__dept--1 .ns-tk__dept-icon { background: var(--ns-tk-1-fond); color: var(--ns-tk-1-trait); }
.ns-tk__dept--2 .ns-tk__dept-icon { background: var(--ns-tk-2-fond); color: var(--ns-tk-2-trait); }
.ns-tk__dept--3 .ns-tk__dept-icon { background: var(--ns-tk-3-fond); color: var(--ns-tk-3-trait); }
.ns-tk__dept--4 .ns-tk__dept-icon { background: var(--ns-tk-4-fond); color: var(--ns-tk-4-trait); }

.ns-tk__dept-name {
	font-size: 15px;
	font-weight: 600;
	line-height: 1.35;
	margin-bottom: 4px;
}

.ns-tk__dept-desc {
	font-size: 13px;
	line-height: 1.55;
	color: var(--ns-texte-2);
}

.ns-tk__dept-foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--ns-esp-1);
	margin-top: auto;
	padding-top: var(--ns-esp-2);
	font-size: 12px;
	color: var(--ns-gris);
}

.ns-tk__dept-delai i {
	margin-right: 4px;
}

.ns-tk__dept-go {
	font-size: 13px;
	color: var(--ns-gris);
	transition: transform 0.15s ease, color 0.15s ease;
}

.ns-tk__dept:hover .ns-tk__dept-go {
	transform: translateX(3px);
	color: var(--ns-texte);
}

@media (prefers-reduced-motion: reduce) {
	.ns-tk__dept,
	.ns-tk__dept-go {
		transition: none;
	}
	.ns-tk__dept:hover,
	.ns-tk__dept:focus-visible {
		transform: none;
	}
	.ns-tk__dept:hover .ns-tk__dept-go {
		transform: none;
	}
}

.ns-tk__panel {
	padding: var(--ns-esp-2);
	border: 1px solid var(--ns-contour);
	border-radius: var(--ns-tk-radius);
	background: var(--ns-fond);
	box-shadow: var(--ns-ombre);
	margin-bottom: var(--ns-esp-2);
}

.ns-tk__panel--alerte { border-left: 3px solid var(--ns-critique); }
.ns-tk__panel--veille { border-left: 3px solid var(--ns-attention); }
.ns-tk__panel--calme  { border-left: 3px solid var(--ns-ok); }

.ns-tk__panel--calme {
	padding: var(--ns-esp-1) var(--ns-esp-2);
}

.ns-tk__clear {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0;
	padding: 8px 0;
	font-size: 13px;
	line-height: 1.45;
	color: var(--ns-texte-2);
}

.ns-tk__clear i {
	flex: 0 0 auto;
	color: var(--ns-ok);
}

.ns-tk__clear + .ns-tk__clear {
	border-top: 1px solid var(--ns-trait);
}

.ns-tk__panel-title {
	display: flex;
	align-items: center;
	gap: var(--ns-esp-1);
	font-size: 14px;
	font-weight: 600;
	color: var(--ns-texte);
	margin: 0 0 6px;
}

.ns-tk__count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 20px;
	height: 20px;
	padding: 0 6px;
	border-radius: 10px;
	background: var(--ns-info-fond);
	color: var(--ns-info);
	font-size: 11px;
	font-weight: 600;
}

.ns-tk__panel-hint {
	font-size: 12px;
	line-height: 1.55;
	color: var(--ns-texte-2);
	margin: 0 0 var(--ns-esp-2);
}

.ns-tk__list {
	list-style: none;
	margin: 0 0 var(--ns-esp-1);
	padding: 0;
}

.ns-tk__list > li + li {
	border-top: 1px solid var(--ns-trait);
}

.ns-tk__ticket {
	display: block;
	padding: 10px 0;
	color: var(--ns-texte);
	text-decoration: none;
}

.ns-tk__ticket:hover,
.ns-tk__ticket:focus-visible {
	color: var(--ns-texte);
	text-decoration: none;
}

.ns-tk__ticket:hover .ns-tk__ticket-subject {
	text-decoration: underline;
}

.ns-tk__ticket-top {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: var(--ns-esp-1);
}

.ns-tk__ticket-subject {
	font-size: 13px;
	font-weight: 500;
	line-height: 1.4;

	min-width: 0;
	overflow-wrap: anywhere;
}

.ns-tk__dot {
	flex: 0 0 auto;
	width: 8px;
	height: 8px;
	margin-top: 5px;
	border-radius: 50%;
	background: var(--ns-critique);
}

.ns-tk__ticket-meta {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 6px;
	margin-top: 5px;
	font-size: 11px;
	color: var(--ns-gris);
}

.ns-tk__tag {
	display: inline-block;
	padding: 1px 7px;
	border-radius: 3px;
	font-size: 10px;
	font-weight: 600;
	line-height: 1.6;
}

.ns-tk__tag--ok      { background: var(--ns-ok-fond);        color: var(--ns-ok); }
.ns-tk__tag--info    { background: var(--ns-info-fond);      color: var(--ns-info); }
.ns-tk__tag--attente { background: var(--ns-attention-fond); color: var(--ns-attention); }

.ns-tk__panel-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	font-weight: 500;
	color: var(--ns-info);
	text-decoration: none;
}

.ns-tk__panel-link:hover,
.ns-tk__panel-link:focus-visible {
	color: var(--ns-info);
	text-decoration: underline;
}

.ns-tk__main {
	max-width: 760px;
	margin-inline: auto;
}

@media (min-width: 1200px) {
	.ns-tk__rail-inner {
		position: sticky;
		top: calc(var(--header-default-height, 70px) + 16px);
	}
}

.ns-tk__form .form-group {
	margin-bottom: var(--ns-esp-3);
}

.ns-tk__form .form-control-label,
.ns-tk__form legend.form-control-label {
	display: block;
	font-size: 13px;
	font-weight: 600;
	color: var(--ns-texte);
	margin-bottom: 6px;
}

.ns-tk__form legend.form-control-label {
	width: auto;
	padding: 0;
	font-size: 13px;
	line-height: inherit;
	border: 0;
}

.ns-tk__hint {
	margin: 6px 0 0;
	font-size: 12px;
	color: var(--ns-gris);
}

.ns-tk__error {
	margin: 6px 0 0;
	font-size: 12px;
	color: var(--ns-critique);
}

.ns-tk__error[hidden] {
	display: none;
}

.ns-tk__message .md-editor > textarea,
.ns-tk__message textarea.form-control {
	min-height: 240px;
	resize: vertical;
}

.ns-tk__ctx-row {
	margin-top: var(--ns-esp-2);
	padding-top: var(--ns-esp-2);
	border-top: 1px solid var(--ns-trait);
}

.ns-tk__ctx .form-group {
	margin-bottom: 0;
}

.ns-tk__ctx-note {
	margin: 7px 0 0;
	font-size: 11.5px;
	line-height: 1.45;
	color: var(--ns-gris);
}

.ns-tk__pick {
	position: relative;
	display: flex;
	align-items: center;
	border: 1px solid var(--ns-trait-fort);
	border-radius: var(--ns-tk-radius-sm);
	background: var(--ns-fond);
	transition: border-color 0.12s ease, box-shadow 0.12s ease;
}

.ns-tk__pick:focus-within {
	border-color: var(--ns-info);
	box-shadow: 0 0 0 3px var(--ns-info-fond);
}

.ns-tk__pick select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	flex: 1;
	min-width: 0;

	padding: 9px 30px 9px 32px;
	border: 0;

	background-color: var(--ns-fond);
	color: var(--ns-texte);
	font-size: 12.5px;
	line-height: 1.4;
	cursor: pointer;

	text-overflow: ellipsis;
}

.ns-tk__pick option {
	background-color: var(--ns-fond);
	color: var(--ns-texte);
}

.ns-tk__pick select:focus {
	outline: none;
}

.ns-tk__pick-icon,
.ns-tk__pick-caret {
	position: absolute;
	pointer-events: none;
	color: var(--ns-gris);
	font-size: 13px;
}

.ns-tk__pick-icon  { left: 11px; }
.ns-tk__pick-caret { right: 11px; }

.ns-tk__pick:focus-within .ns-tk__pick-icon,
.ns-tk__pick:focus-within .ns-tk__pick-caret {
	color: var(--ns-info);
}

.ns-tk__tips {
	background: var(--ns-fond-2);
	border-color: var(--ns-trait);
	box-shadow: none;
}

.ns-tk__tips .ns-tk__panel-title i {
	color: var(--ns-attention);
	font-size: 13px;
}

.ns-tk__tips ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.ns-tk__tips li {
	display: grid;
	grid-template-columns: 16px 1fr;
	gap: 9px;
	align-items: start;
	font-size: 12.5px;
	line-height: 1.5;
	color: var(--ns-texte-2);
}

.ns-tk__tips li + li {
	margin-top: 9px;
}

.ns-tk__tips li i {
	color: var(--ns-gris);
	font-size: 12px;

	margin-top: 3px;
	text-align: center;
}

.ns-tk__prio {
	border: 0;
	padding: 0;
	margin-bottom: 0;
}

.ns-tk__seg {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
}

.ns-tk__seg input[type="radio"] {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

.ns-tk__seg label {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin: 0;
	padding: 5px 12px;
	border: 1px solid var(--ns-trait);
	border-radius: 12px;
	background: var(--ns-fond-2);
	color: var(--ns-texte-2);
	font-size: 12px;
	font-weight: 600;
	cursor: pointer;
	transition: background 0.12s ease, color 0.12s ease, border-color 0.12s ease;
}

.ns-tk__seg label:hover {
	background: var(--ns-fond-2);
	color: var(--ns-texte);
}

.ns-tk__seg-dot {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	flex: 0 0 auto;
	background: currentColor;
}

.ns-tk__seg--low  .ns-tk__seg-dot { background: var(--ns-ok); }
.ns-tk__seg--med  .ns-tk__seg-dot { background: var(--ns-info); }
.ns-tk__seg--high .ns-tk__seg-dot { background: var(--ns-critique); }

.ns-tk__seg input[type="radio"]:checked + label.ns-tk__seg--low {
	background: var(--ns-ok-fond);
	border-color: var(--ns-ok);
	color: var(--ns-ok);
}

.ns-tk__seg input[type="radio"]:checked + label.ns-tk__seg--med {
	background: var(--ns-info-fond);
	border-color: var(--ns-info);
	color: var(--ns-info);
}

.ns-tk__seg input[type="radio"]:checked + label.ns-tk__seg--high {
	background: var(--ns-critique-fond);
	border-color: var(--ns-critique);
	color: var(--ns-critique);
}

.ns-tk__seg input[type="radio"]:focus-visible + label {
	outline: 2px solid var(--ns-info);
	outline-offset: 2px;
}

.ns-tk__seg-hint {
	display: none;
	width: 100%;
	margin: 10px 0 0;
	padding-left: 9px;
	border-left: 2px solid var(--ns-trait-fort);
	font-size: 11.5px;
	line-height: 1.45;
	color: var(--ns-texte-2);
}

#nsTkPrioLow:checked  ~ .ns-tk__seg-hint--low,
#nsTkPrioMed:checked  ~ .ns-tk__seg-hint--med,
#nsTkPrioHigh:checked ~ .ns-tk__seg-hint--high {
	display: block;
}

.ns-tk__seg-hint--low  { border-left-color: var(--ns-ok); }
.ns-tk__seg-hint--med  { border-left-color: var(--ns-info); }
.ns-tk__seg-hint--high { border-left-color: var(--ns-critique); }

.ns-tk__drop {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 88px;
	padding: var(--ns-esp-2);
	border: 1px dashed var(--ns-trait-fort);
	border-radius: var(--ns-tk-radius);
	background: var(--ns-fond-2);
	text-align: center;
	transition: border-color 0.12s ease, background 0.12s ease;
}

.ns-tk__drop-input {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	cursor: pointer;
}

.ns-tk__drop-text {
	display: flex;
	align-items: center;
	gap: var(--ns-esp-1);
	font-size: 13px;
	color: var(--ns-texte-2);
	pointer-events: none;
}

.ns-tk__drop:hover,
.ns-tk__drop.is-over {
	border-color: var(--ns-info);
	background: var(--ns-info-fond);
}

.ns-tk__drop:focus-within {
	border-style: solid;
	border-color: var(--ns-info);
	background: var(--ns-info-fond);
	outline: 2px solid var(--ns-info);
	outline-offset: 2px;
}

.ns-tk__files {
	list-style: none;
	margin: var(--ns-esp-1) 0 0;
	padding: 0;
}

.ns-tk__files[hidden] {
	display: none;
}

.ns-tk__files li {
	display: flex;
	align-items: center;
	gap: var(--ns-esp-1);
	padding: 8px 10px;
	border: 1px solid var(--ns-trait);
	border-radius: var(--ns-tk-radius-sm);
	background: var(--ns-fond);
	font-size: 13px;
	color: var(--ns-texte);
}

.ns-tk__files li + li {
	margin-top: 6px;
}

.ns-tk__file-name {
	overflow-wrap: anywhere;
	margin-right: auto;
}

.ns-tk__file-size {
	flex: 0 0 auto;
	font-size: 12px;
	color: var(--ns-gris);
}

.ns-tk__file-drop {
	flex: 0 0 auto;
	padding: 2px 6px;
	border: 0;
	background: none;
	color: var(--ns-gris);
	cursor: pointer;
	line-height: 1;
}

.ns-tk__file-drop:hover {
	color: var(--ns-critique);
}

.ns-tk__form .ns-tk__custom,
.ns-tk__form .ns-tk__captcha {
	margin-bottom: 0;
}

.ns-tk__custom > * {
	margin-bottom: var(--ns-esp-3);
}

.ns-tk__captcha .coodiv__captcha__wrapper {
	display: flex;
	justify-content: flex-start;
	margin-bottom: var(--ns-esp-3);
}

.ns-tk__foot {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--ns-esp-2);
	padding-top: var(--ns-esp-2);
	border-top: 1px solid var(--ns-trait);
}

.ns-tk__identity {
	margin: 0 auto 0 0;
	font-size: 13px;
	color: var(--ns-texte-2);
}

.ns-tk__identity strong {
	color: var(--ns-texte);
	font-weight: 600;
}

.ns-tk__identity a {
	margin-left: var(--ns-esp-1);
	font-size: 12px;
	color: var(--ns-info);
}

.ns-tk__guest {
	width: 100%;
}

.ns-tk__actions {
	display: flex;
	align-items: center;
	gap: var(--ns-esp-1);
	margin-left: auto;
}

.ns-tk__actions .btn {
	gap: 8px;
}

.ns-tk__actions .btn.is-sending {
	pointer-events: none;
	opacity: 0.7;
	cursor: default;
}

.ns-tk__recap {
	display: flex;
	align-items: center;
	gap: var(--ns-esp-1);
}

.ns-tk__recap-mark {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 34px;
	height: 34px;
	border-radius: var(--ns-tk-radius-sm);
	font-size: 15px;
	background: var(--ns-fond-2);
	color: var(--ns-texte-2);
}

.ns-tk__recap-mark--1 { background: var(--ns-tk-1-fond); color: var(--ns-tk-1-trait); }
.ns-tk__recap-mark--2 { background: var(--ns-tk-2-fond); color: var(--ns-tk-2-trait); }
.ns-tk__recap-mark--3 { background: var(--ns-tk-3-fond); color: var(--ns-tk-3-trait); }
.ns-tk__recap-mark--4 { background: var(--ns-tk-4-fond); color: var(--ns-tk-4-trait); }

.ns-tk__recap-text {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.ns-tk__recap-value {
	font-size: 13.5px;
	font-weight: 600;
	line-height: 1.3;
	color: var(--ns-texte);
	overflow-wrap: anywhere;
}

.ns-tk__recap-delai {
	font-size: 11.5px;
	line-height: 1.35;
	color: var(--ns-gris);
}

.ns-tk__recap-change {

	margin-left: auto;
	flex: 0 0 auto;
	align-self: flex-start;
	padding: 0;
	border: 0;
	background: none;
	font-size: 12px;
	font-weight: 500;
	color: var(--ns-info);
	text-decoration: underline;
	cursor: pointer;
}

a.ns-tk__recap-change:hover,
a.ns-tk__recap-change:focus {
	color: var(--ns-texte);
	text-decoration: underline;
}

.ns-tk__recap-change:focus-visible {
	outline: 2px solid var(--ns-info);
	outline-offset: 2px;
	border-radius: 2px;
}

@media (max-width: 1199px) {
	.ns-tk__rail {
		margin-top: var(--ns-esp-2);
	}

	.ns-tk--compose .ns-tk__rail {
		margin-top: 0;
		margin-bottom: var(--ns-esp-3);
	}
}

@media (max-width: 767px) {
	.ns-tk__title {
		font-size: 19px;
	}

	.ns-tk__dept {
		padding: var(--ns-esp-2) 14px;
	}

.ns-tk__dept-icon {
		width: 36px;
		height: 36px;
		font-size: 16px;
		margin-bottom: 10px;
	}

}
