/* ==========================================
   CONTENTS PAGE SIDEBAR
========================================== */

/*
 * On the Contents page:
 * - keep the normal book title and date;
 * - hide the page number, prompt and normal reward;
 * - show the Cottage Treasures collection;
 * - show only the Next button.
 */

.mpp-book-viewer__dialog:has(
	.mpp-book-viewer__contents-rewards[aria-hidden="false"]
) .mpp-book-viewer__page-number,
.mpp-book-viewer__dialog:has(
	.mpp-book-viewer__contents-rewards[aria-hidden="false"]
) .mpp-book-viewer__prompt,
.mpp-book-viewer__dialog:has(
	.mpp-book-viewer__contents-rewards[aria-hidden="false"]
) .mpp-book-viewer__reward,
.mpp-book-viewer__dialog:has(
	.mpp-book-viewer__contents-rewards[aria-hidden="false"]
) .mpp-book-viewer__start-wrap {
	display: none !important;
}

/* Hide Previous and Contents while already on Contents. */

.mpp-book-viewer__dialog:has(
	.mpp-book-viewer__contents-rewards[aria-hidden="false"]
) .mpp-book-viewer__previous,
.mpp-book-viewer__dialog:has(
	.mpp-book-viewer__contents-rewards[aria-hidden="false"]
) .mpp-book-viewer__contents {
	display: none !important;
}

/* ==========================================
   CONTENTS SIDEBAR POSITIONING
========================================== */

/*
 * Keep the title in the normal top row.
 * Make the rewards and Next button form one
 * compact central group beneath it.
 */

.mpp-book-viewer__dialog:has(
	.mpp-book-viewer__contents-rewards[aria-hidden="false"]
) .mpp-book-viewer__contents-rewards {
	grid-column: 2;
	grid-row: 2 / 4;

	align-self: center;
	justify-self: center;

	width: min(220px, 100%);
	margin: 0;
	padding: 0;

	transform:
		translateX(var(--mpp-sidebar-x))
		translateY(-18px);
}

.mpp-book-viewer__dialog:has(
	.mpp-book-viewer__contents-rewards[aria-hidden="false"]
) .mpp-book-viewer__navigation {
	grid-column: 2;
	grid-row: 4;

	align-self: start;
	justify-self: center;

	width: min(190px, 100%);
	margin: -48px 0 0;

	transform: translateX(var(--mpp-sidebar-x));
}

.mpp-book-viewer__dialog:has(
	.mpp-book-viewer__contents-rewards[aria-hidden="false"]
) .mpp-book-viewer__next {
	display: block !important;
	width: 100%;
}

/* ==========================================
   COTTAGE TREASURES COLLECTION
========================================== */

.mpp-book-viewer__contents-rewards[hidden] {
	display: none !important;
}

.mpp-book-viewer__contents-rewards[aria-hidden="false"] {
	display: block !important;
}

.mpp-contents-rewards__collection {
	display: flex;
	flex-direction: column;
	align-items: center;

	width: 100%;
	text-align: center;
}

.mpp-contents-rewards__heading {
	margin: 0 0 15px !important;

	color: #3d3833;
	font-family: "Montserrat", sans-serif;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.12em;
	line-height: 1.3;
	text-transform: uppercase;
}

/* ==========================================
   PAGE REWARDS — 4 / 4 / 2
========================================== */

.mpp-contents-reward-grid {
	display: grid;
	grid-template-columns: repeat(4, 60px);
	justify-content: center;
	gap: 11px;

	width: 100%;
	margin: 0 auto;
}

.mpp-contents-reward {
	position: relative;

	display: grid;
	place-items: center;

	box-sizing: border-box;
	width: 60px;
	height: 60px;
	padding: 4px;

	border: 1px solid rgb(79 71 65 / 12%);
	border-radius: 9px;
	background: rgb(252 247 241 / 82%);

	overflow: hidden;
}

.mpp-contents-reward:nth-child(9) {
	grid-column: 2;
}

.mpp-contents-reward:nth-child(10) {
	grid-column: 3;
}

.mpp-contents-reward img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.mpp-contents-reward.is-locked img {
	opacity: 0.28;
	filter: grayscale(0.75);
}

.mpp-contents-reward__page {
	position: absolute;
	right: 2px;
	bottom: 2px;

	display: inline-grid;
	place-items: center;

	width: 16px;
	height: 16px;

	border-radius: 50%;
	background: rgb(79 71 65 / 82%);
	color: #ffffff;

	font-family: "Montserrat", sans-serif;
	font-size: 8px;
	font-weight: 500;
	line-height: 1;
}

/* ==========================================
   FINAL BOOK REWARD
========================================== */

.mpp-contents-book-reward {
	display: grid;
	place-items: center;

	width: 78px;
	height: 78px;
	margin: 16px auto 0;
}

.mpp-contents-book-reward__image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.mpp-contents-book-reward__image.is-locked {
	opacity: 0.28;
	filter: grayscale(0.75);
}

.mpp-contents-book-title {
	display: none !important;
}

.mpp-contents-rewards__message {
	max-width: 190px;
	margin: 10px auto 0 !important;

	color: #3d3833;
	font-family: "Montserrat", sans-serif;
	font-size: 12px;
	font-weight: 500;
	line-height: 1.45;
	text-align: center;
}