/* ==========================================
   ACTIVE DESK BOOK
========================================== */

.mpp-active-desk-book {
	position: absolute;
	z-index: 80;

	top: 50.5%;
	left: 42%;
	width: 24%;

	margin: 0;
	padding: 0 !important;

	border: 0 !important;
	background: transparent !important;
	background-color: transparent !important;
	box-shadow: none !important;
	outline: none;

	cursor: pointer;
	-webkit-tap-highlight-color: transparent;

	transform:
		translateX(-50%)
		perspective(900px)
		rotateX(65deg);

	transform-origin: center bottom;
}

.mpp-active-desk-book:hover,
.mpp-active-desk-book:focus,
.mpp-active-desk-book:focus-visible,
.mpp-active-desk-book:active {
	border: 0 !important;
	background: transparent !important;
	background-color: transparent !important;
	box-shadow: none !important;
	outline: none !important;
}

.mpp-active-desk-book__base {
	display: block;
	width: 100%;
	height: auto;

	pointer-events: none;
}

/* ==========================================
   PAGE COMPLETION STAMP
========================================== */

.mpp-page-completion-stamp {
	position: absolute;
	z-index: 5;

	left: 50%;
	bottom: 12.5%;

	width: 80%;
	margin: 0;

	text-align: center;

	transform: translateX(-50%);
}

.mpp-page-completion-stamp[hidden] {
	display: none !important;
}

.mpp-page-completion-stamp img {
	display: block;

	width: min(130px, 45%);
	height: auto;
	margin: 0 auto;
}

/* ==========================================
   STARTED DESK BOOK PILE
========================================== */

.mpp-started-desk-book-pile {
	position: absolute;
	z-index: 80;

	top: 43%;
	left: 24%;

	width: 14%;
	height: 25%;

	pointer-events: none;
}

.mpp-started-desk-book {
	--mpp-desk-x: 0px;
	--mpp-desk-rotation: 0deg;

	appearance: none;
	position: absolute;

	left: 0;
	bottom: calc(var(--mpp-desk-stack-index) * 5%);

	width: 56%;
	margin: 0;
	padding: 0 !important;

	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	background-color: transparent !important;
	box-shadow: none !important;
	outline: none !important;

	cursor: pointer;
	pointer-events: auto;
	-webkit-tap-highlight-color: transparent;

	transform:
    translateX(var(--mpp-desk-x))
    perspective(800px)
    rotateX(8deg)
    rotate(var(--mpp-desk-rotation));

	transform-origin: center bottom;

	filter:
		drop-shadow(
			0 5px 5px
			rgb(46 37 31 / 24%)
		);

	transition:
		transform 180ms ease,
		filter 180ms ease;
}

.mpp-started-desk-book img {
	display: block;

	width: 100%;
	height: auto;

	border-radius: 3px;

	pointer-events: none;
}

/* Individual natural book positions */

.mpp-started-desk-book:nth-child(1) {
	--mpp-desk-x: 0px;
	--mpp-desk-rotation: -0.8deg;
}

.mpp-started-desk-book:nth-child(2) {
	--mpp-desk-x: -1px;
	--mpp-desk-rotation: 0.4deg;
}

.mpp-started-desk-book:nth-child(3) {
	--mpp-desk-x: 2px;
	--mpp-desk-rotation: -0.3deg;
}

.mpp-started-desk-book:nth-child(4) {
	--mpp-desk-x: -2px;
	--mpp-desk-rotation: 0.7deg;
}

.mpp-started-desk-book:nth-child(5) {
	--mpp-desk-x: 1px;
	--mpp-desk-rotation: -0.5deg;
}

.mpp-started-desk-book:nth-child(6) {
	--mpp-desk-x: -1px;
	--mpp-desk-rotation: 0.2deg;
}

.mpp-started-desk-book:hover,
.mpp-started-desk-book:focus,
.mpp-started-desk-book:focus-visible {
	z-index: 20;

	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	background-color: transparent !important;
	box-shadow: none !important;
	outline: none !important;

	transform:
    translateX(var(--mpp-desk-x))
    translateY(-7px)
    perspective(800px)
    rotateX(8deg)
    rotate(var(--mpp-desk-rotation));

	filter:
		drop-shadow(
			0 9px 8px
			rgb(46 37 31 / 30%)
		);
}

.mpp-started-desk-book:active {
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	background-color: transparent !important;
	box-shadow: none !important;
	outline: none !important;
}

/* ==========================================
   ADMIN BOOK RESET BUTTON
========================================== */

.mpp-reset-book-progress {
	position: absolute;
	z-index: 500;

	right: 200px;
	bottom: 20px;

	margin: 0;
	padding: 8px 14px;

	border: 0;
	border-radius: 6px;
	background: #758693;
	color: #ffffff;

	font-family: "Montserrat", sans-serif;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.06em;
	line-height: 1.2;
	text-transform: uppercase;

	cursor: pointer;
}

.mpp-reset-book-progress:hover,
.mpp-reset-book-progress:focus,
.mpp-reset-book-progress:focus-visible,
.mpp-reset-book-progress:active {
	background: #9ba284;
	color: #ffffff;
	outline: none;
	box-shadow: none;
}

/* ==========================================
   ADMIN APPROVE PAGE BUTTON
========================================== */

.mpp-approve-page-one,
.mpp-approve-all-pages-test {
	position: absolute;
	z-index: 500;

	right: 430px;
	bottom: 20px;

	width: auto;
	margin: 0 !important;
	padding: 8px 14px !important;

	border: 0 !important;
	border-radius: 6px;
	background: #b1a6b7 !important;
	color: #ffffff !important;

	font-family: "Montserrat", sans-serif;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.06em;
	line-height: 1.2;
	text-transform: uppercase;

	cursor: pointer;
}

.mpp-approve-all-pages-test {
	right: 635px;
	background: #8e7e98 !important;
}

.mpp-approve-page-one:hover,
.mpp-approve-page-one:focus,
.mpp-approve-page-one:focus-visible,
.mpp-approve-page-one:active,
.mpp-approve-all-pages-test:hover,
.mpp-approve-all-pages-test:focus,
.mpp-approve-all-pages-test:focus-visible,
.mpp-approve-all-pages-test:active {
	background: #9ba284 !important;
	color: #ffffff !important;
	outline: none;
	box-shadow: none;
}

/* ==========================================
   HIDDEN BOOK VIEWER SECTIONS
========================================== */

.mpp-book-viewer__header[hidden],
.mpp-book-viewer__navigation[hidden],
.mpp-book-viewer__start-wrap[hidden] {
	display: none !important;
}
