﻿.approvals {
	flex: 1;
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

.approvals_loader {
	display: flex;
}

.approvals_legend {
	font-size: 14px;
	padding: 5px 0 0 2px;
}

.approvals_spinner {
	margin: 3px 0 0 10px;
}

.approvals_commands {
	border-bottom: 1px solid rgba(34, 36, 38, 0.15);
}

.approval_toolbar {
	display: flex;
	cursor: pointer;
}

.approval_toolbar_button {
	color: white;
	background-color: darkgrey;
}

.approvals_panel {
	flex: 1;
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

.approvals_box {
	flex: 1;
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

.approvals_box_closed {
}

.approvals_box_bottom {
	flex: 1;
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

.approvals_cards {
	display: grid;
	grid-template-columns: repeat(auto-fill, 190px);
	grid-gap: 5px;
	overflow: auto;
}

.approval_card {
	border: 1px solid #555;
	box-shadow: 1px 2px 3px #555;
	display: flex;
	flex-direction: column;
}

.approval_status {
	height: 32px;
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 14px;
	font-weight: bold;
	color: white;
}

.approval_box {
	margin: 0 0 5px 0;
	background-color: darkgrey;
}

.approval_pending {
	background-color: lightgray;
}

.approval_granted {
	background-color: darkgreen;
}

.approval_denied {
	background-color: red;
}

.approval_voluntary {
	background-color: gold;
	color: black;
}

.approval_banner {
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: slategrey;
	color: white;
	font-size: 14px;
	padding: 3px;
}

.approval_icon {
}

.approval_title {
	margin-left: 5px;
	font-weight: bold;
}

.approval_content {
	flex: 1;
	padding: 3px;
}

.approval_content > div {
	margin-top: 5px;
}

.approval_employee {
	font-weight: bold;
}

.approval_date {
	font-weight: bold;
}

.approval_comments {
	font-style: italic;
}

.approval_times {
}

.approval_motive {
}

.approval_folio {
}

.approval_block {
	display: flex;
	flex-direction: row;
}

.approval_block_icon {
	margin-right: 5px;
	padding: 2px 0;
}

.approval_block_text {
	flex: 1;
}

.approval_comments {
	color: black;
	margin-right: 5px;
}

.approval_extemporaneous {
	color: white;
	background-color: black;
	padding: 5px;
}

.approvals_swatch {
	border-top: 1px solid lightgray;
	padding: 5px;
}

.approvals_buttons {
	display: flex;
	flex-direction: row;
	margin-top: 5px;
}

.approvals_buttons_commands {
	flex: 1;
}

.approvals_buttons_togglers {
	display: flex;
}

.approvals_buttons_togglers > button {
	margin-left: 5px;
}

.ticket {
	cursor: pointer;
}
