/**
* IBM Confidential
* OCO Source Materials
* IBM Business Platform: Dashboard
* (C) Copyright IBM Corp. 2018, 2020
* The source code for this program is not published or otherwise divested of its trade secrets,
* irrespective of what has been deposited with the U.S. Copyright Office
**/
@import "../lib/@ba-ui-toolkit/essentials/_essentials.scss";
html {
	.glass {
		.dialogBlocker {
			.modelDialogBlockerCell {
				width: 100%;
			}
		}
	}
}

%blocker {
	@include absolute-position(0, 0, 0, 0);
	height: 100%;
	width: 100%;
	display: none;
	text-align: center;
	@include theming(background-color, ui-background);
	border: none;
	z-index: 3000;
	overflow: auto;
}

.dialogBlocker {
	@extend %blocker;
}

.loadingBlocker {
	@extend %blocker;
	display: flex;
	@include theming(background-color, ui-01);
}

.dialogBlocker.transparent {
	background-color: transparent;
}

.dialogBlocker.show {
	display: table;
}

.dialogBlockerCell {
	display: block;
	margin-top: 10vmin;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
}

.dialogVerticalAlign {
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	margin-top: auto;
	margin-bottom: auto;
}

.modalDialog {
	display: inline-block;
	text-align: left;
	@include theming(background-color, ui-01);
	&[dir="rtl"] {
		text-align: right;
	}
}

.modalDialog .dialogHeader {
	position: relative;
}

.dialogHeader header {
	border-bottom: 1px solid;
	@include theming(border-bottom, ui-03);
	padding: 21px 24px;
	line-height: 100%;
	height: 65px;
	text-align: center;
	@include theming(color, text-01);
	font-weight: $fw-medium;
	font-style: normal;
	@include theming(background-color, ui-01);
	font-size: $heading-size-s;
}

.dialogContent {
	min-height: 100px;
}

.dialogButton {
	display: inline-block;
	text-align: center;
	cursor: pointer;
	@include theming(color, interactive-01);
	width: auto;
	min-width: 90px;
	padding: 0px;
	margin: 0px;
	height: 36px;
	@include theming(background-color, ui-01);
}

/* set primary button style */
.dialogButton.primary {
	@include theming(color, ui-01);
	@include theming(background-color, interactive-01);
	padding-left: 32px;
	padding-right: 32px;
	margin: 0px 16px 20px 0px;
	border-width: 2px;
	border-style: solid;
	@include theming(border-color, interactive-01);
	&[dir="rtl"] {
		margin: 0px 0px 20px 16px;
	}
	&:hover {
		@include theming(color, ui-01);
		@include theming(background-color, hover-primary);
	}
	&:focus {
		@include theming(outline-color, focus);
		outline-style: solid;
		outline-width: 2px;
	}
	&:active {
		@include theming(color, ui-01);
		@include theming(background-color, active-primary);
		border-width: 2px;
		border-style: solid;
		@include theming(border-color, active-primary);
	}
	&.selected {
		@include theming(color, ui-01);
		@include theming(background-color, interactive-01);
	}
	&.disabled,
	&:disabled {
		@include theming(background-color, disabled-02);
	}
}

/* set secondary button style */
.dialogButton.secondary {
	@include theming(background-color, interactive-02);
	@include theming(color, ui-01);
	margin: 0px;
	display: inline-block;
	border-width: 2px;
	border-style: solid;
	@include theming(border-color, interactive-02);
	&:hover {
		@include theming(background-color, hover-secondary);
		@include theming(color, ui-01);
	}
	&:focus {
		@include theming(outline-color, focus);
		outline-style: solid;
		outline-width: 2px;
	}
	&:active {
		@include theming(color, ui-01);
		@include theming(background-color, active-secondary);
		border-width: 2px;
		border-style: solid;
		@include theming(border-color, active-secondary);
	}
	&.selected {
		@include theming(background-color, selected-ui);
	}
	&.disabled,
	&:disabled {
		@include theming(background-color, disabled-02);
		cursor: default;
	}
}

.dashboardMessageBox {
	min-height: 40px;
	padding-left: 40px;
	margin: 10px;
	white-space: pre-wrap;
	word-wrap: break-word;
	@include user-select(text);
	&[dir="rtl"] {
		padding-left: 0px;
		padding-right: 40px;
	}
	&.info {
		background: url(icons/mb_info.png) no-repeat;
	}
	&.warning {
		background: url(icons/mb_warning.png) no-repeat;
	}
	&.error {
		background: url(../images/error.png) no-repeat;
	}
	&.selectableInfo {
		max-height: 500px;
		width: 65vw;
		white-space: pre;
		overflow-y: scroll;
	}
	&.editableInfo {
		max-height: 500px;
		height: 80vw;
		width: 65vw;
		white-space: pre;
		overflow-y: scroll;
	}
	&.none {
		margin: 0px;
		padding-left: 0px;
		padding-right: 0px;
	}
}

.blockerCenterContents {
	align-items: center !important;
	justify-content: center !important;
}