@charset "UTF-8";
/* to customize
   ============
   - set primary-color to the customer-color, e.g. from red to green
     (this effects all style-classes using this var in dap.css)
*/
:root {
	--surface-a:#ffffff;
	--surface-b:#f8f9fa;
	--surface-c:#e9ecef;
	--surface-d:#dee2e6;
	--surface-e:#ffffff;
	--surface-f:#ffffff;
	--text-color:#495057;
	--text-color-secondary:#6c757d;
	/* change from A1-red to customer colour */
	/*--primary-color: #1cda1f;*/
	--primary-color: #da291c;
	--primary-color-text:#ffffff;
	--font-family: Verdana,Arial,Helvetica,sans-serif;
}

/*
 * CSS styles for flowjs can be changed per instance
 */
.drop-and-actions {
	display: flex;
	justify-content: space-between;
	align-items: stretch;
}

/*RS new for PF*/
.drop-zone {
	border: 2px #bbb dashed;
	background-color: #efefef;
	width: 100%;
	/*max-width: 695px;*/
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	display: inline-flex;
	min-height: 86px;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.drop-zone.with-three-buttons {
	min-height: 134px;
}
/* for PF fileupload*/
.drop-zone.drop-faded {
	color: #bbb;
	font-size: 24px;
	/*margin-top: 16px;
	margin-bottom: 16px;*/
}

.drop-and-actions .drop-more {
	font-size: 10pt;
	height: 100%;
	flex-direction: column !important;
	justify-content: flex-end;
}

.flowUploadButtons {
	display: flex;
	justify-content: right;
}

.flowUploadButton {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	/*background-color: khaki;*/
	width: 215px;
	height: 40px;
	color: white;
	margin: 3px 0px 3px 10px;
	padding-right: 3px;
	padding-left: 6px;
	cursor: pointer;
	border-radius: 4px; /*rounded*/
}

.flowUploadButton img {
	height: 32px;
	margin-left: 6px;
	margin-right: 3px;
}

.flowUploadButton.secondary {
	background-color: #585858;
}

.flowUploadButton.disabled {
	background-color: #bbb;
	cursor: default;
}

/* to style command-links like other buttons (font size etc.) */
a.flowUploadButtonFontConsistency, 
a.flowUploadButtonFontConsistency:visited,
a.flowUploadButtonFontConsistency:hover {
	color: white;
	text-decoration: none;
	font-size: 12px;
}

.flowUploadButtonAbsolutePositioned {
	position: absolute;
	right: 15px;
	transform: translateY(64px);
}

.flowUploadButtonAbsolutePositioned.directoryButtonAlsoPresent {
	transform: translateY(110px);
}

.flowUploadButtonAbsolutePositioned.simpleSend {
	transform: translateY(24px);
}

.flowJsFeedback {
	background-color: #FFFFDD;
	color: #99cc00;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 12px;
	font-weight: normal;
	flex: 1 1 auto;
	margin: 10px 0;
	height: 24px;
	padding: 4px 10px;
}

.flowJsFeedback img.smallIcon {
	width: 18px;
	height: 18px;
	margin-right: 2px;
	vertical-align: middle;
}

.flowJsFeedback-success {
	/* The A1 red used here */
	/*color: #DA291C;*/
	color: black;
	background-color: #99cc00;
}

.flowJsFeedback-warning {
	/* typical bootstrap colors used here */
	color: rgb(138, 109, 59);
	background-color: rgb(252, 248, 227);
}

.flowJsFeedback-failure {
	color: #d01e33;
	background-color: #eecccc;
}

table.flowFiles {
	width: 100%;
	margin: 24px 0 0 0;
}

table.flowFiles tr {
	height: 40px;
}

table.flowFiles td {
	background-color: #efefef;
	vertical-align: top;
	padding: 3px;
}

table.flowFiles td img {
	height: 32px;
}

td.flowFilesIndex {
	min-width: 36px;
	vertical-align: middle;
	text-align: center;
}

td.flowFilesStatus {
	min-width: 36px;
}

td.flowFilesFile {
	text-align: left;
	min-width: 36px;
}

td.flowFilesMain {
	width: 99%;
}

td.flowFilesActions {
	min-width: 72px;
}

td.flowFilesActions {
	min-width: 72px;
}

.flowFilesActionsButtons {
	display: flex;
	justify-content: flex-end;
	flex-wrap: wrap-reverse;
}

#uploadForm\:fileUpload div.ui-fileupload-files  div.ui-fileupload-filename
/*,.flowFileInfos */
{
	/* background-color: khaki; */
	display: flex;
	justify-content: space-between;
	font-weight: bold;
	margin-left: 3px;
}

/*
.flowFileInfoNumerics {
	display: flex;
	width: 240px;
	min-width: 240px;
}
*/

/*.flowFileInfoNumeric {*/
/*	text-align: right;*/
/*	!* background-color: tomato; *!*/
/*	width: 120px;*/
/*}*/

.flowFileInfoProgress {
	width: 100%;
	/* background-color: cyan; */
	/* display: flex;
	flex-direction: column;
	justify-content: space-between; */
}

.flowBelowTableFooter {
	display: flex;
	justify-content: flex-end;
	min-height: 40px;
}

.flowBelowTableFooter a, .flowBelowTableFooter a:hover,
	.flowBelowTableFooter a:visited {
	text-decoration: none;
	font-size: 12px;
	color: black;
	cursor: pointer;
}

.flowBelowTableFooter img {
	padding-bottom: 4px;
	margin-left: 6px;
	margin-right: 5px;
	vertical-align: middle;
	height: 32px;
}
/* =============================================== style for xxx  */
/* customize the calendar icon, which is in a1-red */

/*.ui-icon-calendar {*/
/*	!* note: to reference a custom icon use this *!*/
/*	background-image: url("dap_resource?f=skins/media/A1_calendar_black.svg");*/
/*	width: 1.2em;*/
/*	height: 1em;*/
/*}*/
