/*====================( Common )=============================*/

html {
	overflow-y: scroll;
}

body {
	margin: 0
}

#dvContentUnauthorized {
	display: none;
	padding-top: 100px;
	width: 300px;
	margin: 15px auto;
}


#dvContentUnauthorized div {
	text-align: center;
	padding: 10px;
}

#dvContentAuthorized {
	display: none;
}

#dvHeader {
	background-color: #dcd4cc;
	padding: 12px 20px;
	display: flex;
	justify-content: space-between;
}

#dvHdrTitle {
	font-size: 20px;
	font-weight: bold;
}

#dvHdrTitle a {
	text-decoration: none;
	color: #606060;
}

#spVerNum {
	margin-left: 12px;
	font-size: 12px;
	color: #606060;
}

#dvMenuHolder {
	padding: 5px 10px;
}

#dvMenuHolder a:not(:last-child) {
	margin-right: 20px;
}

#spLoggedUser {
	margin-right: 20px;
}

#dvLoggedContent {
	padding: 0 30px 30px;
}

.textCentered {
	text-align: center;
}

table th {
	text-align: center;
}

#dvLoading {
	padding: 20px;
	font-size: 16px;
	font-style: italic;
	font-weight: bold;
	color: #b0b0b0;
}

a.disabledLink {
	opacity: 0.5;
	pointer-events: none;
	cursor: default;
}

.short-text {
	display: none;
}

@media only screen and (max-width: 768px) {

	.short-text {
		display: inline-block;
	}

	.full-text {
		display: none;
	}

	.hideOnSmallScreen {
		display: none;
	}

	#dvLoggedContent {
		padding: 0 5px 5px;
	}

	.smallerSizeOnNarrowScreen {
		font-size: 80%;
	}

	#dvHeader {
		padding: 8px;
	}

	#spLoggedUser {
		margin-right: 4px;
	}

	#dvMenuHolder a:not(:last-child) {
		margin-right: 10px;
	}
}

tr.rowHighlighted {
	background-color: #d0e0f0 !important;
}

/*======================( Sites )============================*/

#dvSites {
	/*max-width: 1000px;*/
	/*margin: 15px auto;*/
}

#dvRunsContent {
	margin-top: 20px;
	min-height: 300px;
}

#spRunsWait {
	display: none;
	font-style: italic;
	margin-left: 20px;
}

#dvEditSite > div {
	font-weight: normal;
	display: flex;
	padding: 2px 0;
}

#dvEditSite label {
	font-weight: normal;
}

#dvEditSite label:first-child {
	width: 120px;
	text-align: right;
	padding: 6px;
}

#dvEditSite i:first-child {
	width: 120px;
	text-align: right;
	padding: 6px;
}

#dvEditSite input[type='checkbox'] {
	margin-right: 4px;
}

/*======================( SiteInfo )=========================*/

.tableProdInfo td {
	padding: 2px 5px !important;
}

.tableInfo td {
	padding: 2px 5px;
}

.tableInfo td:first-child {
	text-align: right;
	background-color: #e1e1e1;
	width: 150px;
}

.tableInfo td.hdrInfo {
	text-align: right;
	background-color: #e1e1e1;
	width: 120px;
}

div.reqsChartHolder {

}

div.reqsChartHolder div {
	/*background-color: #d43f3a;*/
	line-height: 1;
}

div.prodsFilt label {
	margin-bottom: 5px;
	font-weight: normal;
	user-select: none;
}

div.prodsFilt label:not(:last-child) {
	margin-right: 15px;
}

table.tblChart tr {
	line-height: 1;
}

table.tblChart td {
	text-align: right;
	padding: 0 5px;
}

table#tblCategLevels td {
	padding: 0 5px;
}

table.cells-pad-1-5 td {
	padding: 1px 5px !important;
}

table.cells-pad-2-5 td {
	padding: 2px 5px !important;
}

span.siteFlag {
	white-space: nowrap;
}

span.siteFlag:not(:last-child) {
	padding-right: 10px;
	margin-right: 10px;
	border-right: silver 1px solid;
}

/*======================( UserInfo )=========================*/

/*======================( ProdInfo )=========================*/

a.prodImgLink {
	margin: 5px;
	display: inline-block;
}

a.prodImgLink > img {
	max-width: 160px;
	max-height: 100px;
}

div.matchesInfoHolder {
	border: 3px solid #f1e1d1;
	margin-bottom: 20px;
}

div.matchesInfoHdr {
	padding: 5px 10px;
	font-weight: bold;
	font-size: 16px;
	font-style: italic;
}

/*======================( DynPrTenant )======================*/

div.foundProdInfo > b {
	margin-right: 20px;
}

/*======================( Users )============================*/

/*======================( ProdMatch )========================*/

div.matchesCompContainerUrlsOnly {
	display: grid;
	grid-template-columns: 1fr 30px;
	grid-column-gap: 10px;
	grid-row-gap: 8px;
	/*align-items: start;*/
}

div.matchesCompContainerExt {
	display: grid;
	grid-template-columns: 180px 6fr 40px 4fr;
	grid-column-gap: 10px;
	/*grid-row-gap: 8px;*/
	/*align-items: start;*/
	padding: 3px;
}

div.matchesCompContainerExt:focus-within {
	background-color: #f0f0d0;
}

#dvSimRecEditContent {
	padding: 10px 30px 20px;
	margin-left: 30px;
	background-color: #e0e8e0;
}

#dvSimRecEditContent label {
	font-weight: normal;
	margin: 6px 6px 0 20px;
}

/*======================( TasksIB )========================*/

div.prodIbRow {
	display: flex;
	border: solid 1px silver;
	margin-top: 8px;
}

div.invalidImgBasedTask {
	border: solid 1px silver;
	background-color: #f0d0d0;
	padding: 20px;
	margin-top: 8px;
	color: red;
	font-size: 20px;
}

div.prodIbRowCmpsHolder {
	display: flex;
	flex-wrap: wrap;
	border-left: solid 1px silver;
}

div.prodIbTile {
	display: inline-block;
	margin: 4px;
}

div.prodIbTile:hover {
	background-color: #80b0e0;
}

a.flagNoMatch {
	padding: 20px 10px;
	margin: 5px;
	color: darkred;
	font-size: 20px;
	text-decoration: none;
	flex: 1;
}

a.flagNoMatch:hover {
	background-color: lightcoral;
}

/*======================( PivotPair )===================*/

#dvQuickInfo {
	position: absolute;
	display: none;
	background-color: #b0e080;
	padding: 5px 8px;
	border: #70a020 solid 1px;
}

table.distrTable td {
	padding: 0 8px;
}

table.distrTable tr:hover {
	background-color: #f1f1d1;
}

div.distribDetailsHolder {
	padding: 5px;
	font-size: 12px;
}

div.catsForExcludeHolder {
	width: 700px;
	display: none;
}

div.catsForExcludeHolder * {
	margin-top: 5px;
}

textarea.catsForExclude {
	white-space: pre;
	overflow-wrap: normal;
	overflow-x: scroll;
}

/*======================( PivotData )===================*/

table.pivDataTbl th {
	padding: 2px 5px !important;
	vertical-align: middle !important;
	font-size: 85%;
}

/*======================( Tasks )========================*/

table.tasksTbl th {
	vertical-align: middle !important;
}

/*======================( Task )========================*/

#tblTaskProds {
	border-collapse: collapse;
	border: 1px solid silver;
}

#tblTaskProds th, #tblTaskProds td {
	background-color: #ffffff;
	min-width: 260px;
	max-width: 260px;
	border: 1px solid silver;
	padding: 2px 4px;
}

#tblTaskProds th {
	background-color: #f0f0c0;
	position: -webkit-sticky; /* for Safari */
	position: sticky;
	left: 0;
	font-weight: normal;
	text-align: left;
	vertical-align: top;
}

#tblTaskProds th:first-child {
	background-color: #d0d0d0;
	font-size: 10px;
	font-weight: bold;
	color: #444;
	min-width: 60px;
	border: 1px solid silver;
}

#tblTaskProds tr:first-child th, #tblTaskProds tr:first-child td {
	padding: 0;
}

div.taskImageSectionHolder {
	--task-img-hei: 220px;
	--task-bar-hei: 24px;
	display: flex;
	flex-direction: column;
	height: calc(var(--task-img-hei) + var(--task-bar-hei));
}

a.prodImageLink > img {
	max-width: 100%;
	max-height: var(--task-img-hei);
}

div.taskSuggHdr {
	display: flex;
	flex-direction: row;
	height: var(--task-bar-hei);
	font-size: 16px;
	color: #a0a0a0;
	padding: 1px 10px 2px 10px;
}

div.taskImgHolder {
	display: flex;
	min-height: 210px;
	background-color: #1b6d85;
}

div.taskVarNum {
	font-weight: bold;
}

div.taskVarScr {
	font-size: 12px;
	font-weight: normal;
	padding-top: 3px;
}

div.taskVarImgsCnt {
	cursor: pointer;
	background-color: #b2b2b2;
	color: white;
	font-size: 14px;
	font-weight: normal;
	padding: 0 15px;
	border-radius: 10px;
}

div.taskVarImgsCnt:hover {
	background-color: #bfbfbf;
}

table.taskCatsTable td {
	padding: 0 3px;
	font-size: 11px;
	max-width: 300px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

span.highlightTitleWord {
	background-color: #a5f5a5;
}

span.highlightTitleWordPartial {
	background-color: #f5f5a5;
}

span.titleWord {
	word-wrap: break-word;
}

span.titleWord:hover {
	color: blue;
}

table.lastTasksTable td {
	padding: 2px 10px;
}

table.specTable tr {
	border-bottom: 1px solid #dfdfdf;
}

table.specTable td {
	max-width: 300px;
	word-wrap: break-word;
	font-size: 13px;
}

table.specTable td:first-child {
	max-width: 200px; /* The "key" column */
}

div#dvDlgImages {
	position: absolute;
	background-color: #808080;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1000;
}

div#dvSpecOptions {
	padding: 0 10px;
}

div#dvSpecOptions label {
	font-weight: normal;
	margin-right: 25px;
	user-select: none;
	cursor: pointer;
}

/*======================( UsersActivity )========================*/

#dvUsersActivity label {
	font-weight: normal;
}

/*======================( Spec )========================*/

a.catSpecStats {
	margin-left: 30px;
}

a.cancelSelectedSpecCat {
	margin-left: 30px;
}

span.csSelected {
	padding: 5px 10px;
}

/*======================( SpecAll )========================*/

#spPseStatsLinks a {
	margin-left: 20px;
}

.workDone {
	text-align: right;
	/*background-color: #DDFFDD;*/
	background-image: linear-gradient(0deg, #DDFFDD, #DDFFDD);
}

.workPend {
	text-align: right;
	/*background-color: #FFEEDD;*/
	background-image: linear-gradient(0deg, #FFEEDD, #FFEEDD);
}

.tblPseRep tfoot td {
	font-weight: bold;
	border-top: 2px solid #DDDDDD;
	background-blend-mode: multiply;
	background-color: #eec;
}

div.pseRepNotes {
	padding: 0 0 10px 0;
	font-style: italic;
}

/*======================( SpecCat )========================*/

div.filterHolder {
	display: flex;
	border: solid #c0c0b0 1px;
	background-color: #f8f8ea;
	padding: 15px;
}

div.filterHolder input, div.filterHolder select {
	margin-right: 10px
}

/*======================( SpecPseEdit )========================*/

div.sectionBar {
	background-color: #e0e0d0;
	color: #505010;
	padding: 8px 12px;
	margin-bottom: 10px;
	border: solid 1px #d0d0e0;
	border-radius: 5px;
}

tr.rawSpecsTableRow > td {
	padding: 3px 5px;
}

tr.rawSpecsTableRow > td.specKey {
	background-color: #e1e1e1;
}

tr.rawSpecsTableRow:hover {
	background-color: #ececec;
}

tr.rawSpecsTableRow:hover td.specKey {
	background-color: #d1d1d1;
}

tr.highlightedSpecProp {
	background-color: #e5e5c0;
}

tr.highlightedSpecProp td.specKey {
	background-color: #d0d0a0;
}

input.specPropVal {
	width: 300px;
}

span.propNewVal {
	background-color: #fb842c;
	color: #803000;
	padding: 3px 6px;
	margin: 7px;
	font-size: 10px;
	font-weight: bold;
	border-radius: 5px;
}

span.propNewValActive {
	opacity: 40%;
}

/*======================( SpecCatEdit )========================*/

#dvSpecCatEdit li::marker {
	margin-right: 8px !important;
}

div.statPropValueRow {
	display: flex;
}

div.statPropValueRow:hover {
	background-color: #f0f0c0;
}

div.statValueInfoHolder {
	padding: 5px 40px 10px 40px;
}

/*===========================================================*/

div.sectionTitle {
	display: flex;
	justify-content: space-between;
	margin-bottom: 10px;
}

div.sectionTitle div:first-child {
	font-size: 20px;
	font-weight: bold;
}

div.sectionTitle div:last-child {
	align-self: flex-end;
}

/*===========================================================*/

label.colVisLab {
	margin-bottom: 0;
	font-weight: normal;
}

/*===========================================================*/

div.buttonsHolder {
	margin-bottom: 10px;
}

div.buttonsHolder button {
	margin-bottom: 10px;
}

/*===========================================================*/

div.filterPaneCompactRows {
	display: flex;
}

div.filterPaneCompactRows label {
	font-weight: normal;
	margin: 6px 6px 6px 0;
}

/*===========================================================*/

/**
 * Spacing.
 */
.space-y-2 * + * {
	margin-top: 0.5rem;
}