.single-note {
	.container {
		position: relative;
	}
}

// Header page single note
.single-note .header {
	@include flexbox();
	flex-wrap: nowrap;

	@media ( max-width: $media__small ) {
		flex-wrap: wrap;
		padding-bottom: 1em;
	}

	> * {
		margin: auto 0;
	}
	.close {
		font-size: 28px;
		padding: 0.8em;
		@include transition();
	}
	.title {
		width: 100%;

		h2 {
			margin: 0;
			font-size: 18px;
			text-transform: uppercase;
			font-weight: 400;
		}
		.note-last-update {
			font-size: 14px;
			font-style: italic;
		}
	}
	.validation_status {
		min-width: 150px;

		.dropdown-toggle {
			background: rgba(255,255,255,0.2);
			font-size: 14px;
			padding: 0.8em 1.4em;

			&:hover {
				box-shadow: none;
				background: rgba(255,255,255,0.4);
			}
			&.button-disable {
				background: rgba(255,255,255,0.1) !important;
				border-color: transparent !important;
				color: rgba(255,255,255,0.6) !important;

				.button-icon {
					display: none;
				}
			}
		}
	}
	.export {
		text-align: right;
		min-width: 130px;

		.dropdown-toggle.button-main {
			background: rgba(255,255,255,0.2);

			&:hover {
				background: rgba(255,255,255,0.4);
				box-shadow: none;
			}
		}
		.dropdown-toggle.button-disable {
			background: rgba(255,255,255,0.1) !important;
			border-color: transparent !important;
			color: $color__primary !important;
		}
		.dropdown-toggle.button-transparent {
			color: rgba(255,255,255,0.6);
			font-size: 22px;

			&:hover {
				color: rgba(255,255,255,1);
			}
		}
		.dropdown-content {
			text-align: left;
		}
	}

	@media ( max-width: $media__small ) {
		.close {
			width: 20%;
		}
		.title {
			width: 80%;
		}
		.validation_status, .export {
			width: 50%;
		}
		.validation_status {
			text-align: right;
		}
		.export {
			text-align: left;
		}
	}
}

// Content
.single-note .content {
	background: #fff;
	padding: 1.6em;
}

// Barre d'actions
.single-note .note-action {
	@include flexbox();
	margin-left: -0.4em;
	margin-right: -0.4em;

	.bloc-reassign {
		width: 40%;

		.wpeo-button {
			padding: 8px 14px;
		}
	}

	@media ( max-width: $media__small ) {
		flex-direction: column;
	}

	> * {
		margin: auto 0.4em;

		@media ( max-width: $media__small ) {
			margin: 0.2em 0;
		}
	}
	.note-ttc, .note-tva {
		display: inline-block;

		.value {
			font-weight: 700;
			font-size: 20px;
		}
		.currency {
			font-size: 16px;
			position: relative;
			top: 1px;
			left: -1px;
			color: rgba(0,0,0,0.4);
		}
		.taxe {
			font-size: 14px;
			position: relative;
			top: -10px;
			left: -4px;
		}
	}
	.note-recap {
		margin-left: auto;

		@media ( max-width: $media__small ) {
			margin-left: 0;
		}
	}
	.display-method {
		.wpeo-button.active {
			background: $color__primary;
			color: #fff;
			border-color: $color__primary;
		}
	}
}