/* Light-DOM styles only. The app itself is styled inside its shadow roots (app.css). */

@font-face {
	font-family: "Dopabit Vazirmatn";
	src: url("../fonts/Vazirmatn-wght.woff2") format("woff2");
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}

.dpdd-host {
	display: block;
	position: relative;
	width: 100%;
	margin: 0;
	padding: 0;
	direction: rtl;
	text-align: right;
	font-family: "Vazirmatn", "Dopabit Vazirmatn", Tahoma, system-ui, sans-serif;
	line-height: 1.7;
	color: #F4F2FF;
	background: #0D0A22;
}

.dpdd-host--app { min-height: 640px; }
.dpdd-host--teaser { min-height: 380px; }

.dpdd-noscript {
	margin: 0;
	padding: 48px 20px;
	text-align: center;
	color: #B9B4D9;
}

/* Dialogs, sheets and toasts live on <body> so no transformed parent can trap them. */
.dpdd-layer {
	position: fixed;
	inset: 0;
	z-index: 2147483000;
	direction: rtl;
	font-family: "Vazirmatn", "Dopabit Vazirmatn", Tahoma, system-ui, sans-serif;
}

.dpdd-layer--toast {
	inset: auto 0 24px 0;
	z-index: 2147483001;
	pointer-events: none;
}

/* While a sheet is open the toast moves to the top, away from the sheet's buttons. */
.dpdd-layer--toast.dpdd-layer--top { inset: 16px 0 auto 0; }