/*
|--------------------------------------------------------------------------
| CFPO Digital Library
|--------------------------------------------------------------------------
| Main frontend stylesheet
|
| File:
| wp-content/plugins/cfpo-digital-library/assets/css/library.css
|--------------------------------------------------------------------------
*/


/* ==========================================================================
   1. DESIGN VARIABLES
   ========================================================================== */

.cfpo-library-page {
	--cfpo-green: #064f3b;
	--cfpo-green-dark: #043d2e;
	--cfpo-green-soft: #eaf4f0;

	--cfpo-gold: #b0782a;
	--cfpo-gold-dark: #8d5c1d;
	--cfpo-gold-light: #f3d89f;
	--cfpo-gold-soft: #fff8e8;

	--cfpo-brown: #4b2e19;
	--cfpo-brown-dark: #2f1c0f;

	--cfpo-page: #f7f5f0;
	--cfpo-card: #ffffff;
	--cfpo-reader-bg: #edf0f3;

	--cfpo-text: #171717;
	--cfpo-text-soft: #393939;
	--cfpo-muted: #6b7280;

	--cfpo-border: #e5e3df;
	--cfpo-border-dark: #d5d1ca;

	--cfpo-radius-sm: 10px;
	--cfpo-radius-md: 16px;
	--cfpo-radius-lg: 24px;
	--cfpo-radius-xl: 30px;

	--cfpo-shadow-sm:
		0 8px 24px rgba(22, 18, 12, 0.06);

	--cfpo-shadow-md:
		0 18px 48px rgba(22, 18, 12, 0.09);

	--cfpo-shadow-lg:
		0 30px 80px rgba(22, 18, 12, 0.14);

	--cfpo-content-width: 1780px;
	--cfpo-page-padding: clamp(18px, 3vw, 54px);
}


/* ==========================================================================
   2. RESET AND THEME PROTECTION
   ========================================================================== */

html,
body {
	margin: 0;
	padding: 0;
}

.cfpo-library-page,
.cfpo-library-page *,
.cfpo-library-page *::before,
.cfpo-library-page *::after {
	box-sizing: border-box;
}

.cfpo-library-page {
	display: block;
	width: 100%;
	max-width: none;
	min-height: 100vh;
	margin: 0;
	padding: 0;
	overflow-x: clip;
	background:
		radial-gradient(
			circle at 0 0,
			rgba(176, 120, 42, 0.09),
			transparent 24%
		),
		radial-gradient(
			circle at 100% 0,
			rgba(6, 79, 59, 0.08),
			transparent 26%
		),
		var(--cfpo-page);
	color: var(--cfpo-text);
	font-family:
		Inter,
		-apple-system,
		BlinkMacSystemFont,
		"Segoe UI",
		Arial,
		sans-serif;
	font-size: 16px;
	line-height: 1.6;
}

.cfpo-library-page img {
	max-width: 100%;
	height: auto;
}

.cfpo-library-page button,
.cfpo-library-page input,
.cfpo-library-page select,
.cfpo-library-page textarea {
	font: inherit;
}

.cfpo-library-page button,
.cfpo-library-page a {
	-webkit-tap-highlight-color: transparent;
}

.cfpo-library-page a {
	color: inherit;
	text-decoration: none;
}

.cfpo-library-page button {
	cursor: pointer;
}

.cfpo-library-page [hidden] {
	display: none !important;
}

.cfpo-library-page :focus-visible {
	outline: 3px solid rgba(176, 120, 42, 0.38);
	outline-offset: 3px;
}


/* ==========================================================================
   3. GLOBAL CONTAINERS
   ========================================================================== */

.cfpo-library-container {
	width: min(
		calc(100% - (var(--cfpo-page-padding) * 2)),
		var(--cfpo-content-width)
	);
	max-width: var(--cfpo-content-width);
	margin: 0 auto;
	padding: 44px 0 90px;
}

.cfpo-home-style {
	width: 100%;
	max-width: none;
	margin: 0;
	padding: 0;
}

.cfpo-home-style .cfpo-library-container {
	width: min(
		calc(100% - (var(--cfpo-page-padding) * 2)),
		var(--cfpo-content-width)
	);
	max-width: var(--cfpo-content-width);
	margin: 0 auto;
	padding: 48px 0 90px;
}


/* ==========================================================================
   4. FULL-WIDTH APPLICATION HEADER
   ========================================================================== */

.cfpo-app-header {
	position: sticky;
	top: 0;
	z-index: 10000;

	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 28px;

	width: 100vw;
	max-width: none;
	min-height: 96px;

	margin: 0;
	margin-left: calc(50% - 50vw);

	padding:
		16px
		max(
			var(--cfpo-page-padding),
			calc((100vw - var(--cfpo-content-width)) / 2)
		);

	background:
		linear-gradient(
			135deg,
			#b0782a 0%,
			#bd8738 48%,
			#a86d22 100%
		);

	border: 0;
	border-bottom: 1px solid rgba(75, 46, 25, 0.22);

	box-shadow:
		0 10px 30px rgba(53, 33, 14, 0.13);

	color: #ffffff;
}

.admin-bar .cfpo-app-header {
	top: 32px;
}

.cfpo-app-brand {
	display: flex;
	align-items: center;
	flex: 0 1 auto;
	gap: 15px;
	min-width: 0;
}

.cfpo-app-brand > a {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
}

.cfpo-app-brand img {
	display: block;
	width: 64px;
	height: 64px;
	padding: 4px;
	object-fit: contain;
	background: rgba(255, 255, 255, 0.96);
	border-radius: 50%;
	box-shadow:
		0 8px 24px rgba(57, 33, 10, 0.18);
}

.cfpo-app-brand > div {
	min-width: 0;
}

.cfpo-app-brand h2 {
	margin: 0;
	color: #17110b;
	font-size: clamp(26px, 2.2vw, 35px);
	font-weight: 900;
	line-height: 1;
	letter-spacing: -0.045em;
}

.cfpo-app-brand span {
	display: block;
	margin-top: 6px;
	color: rgba(255, 255, 255, 0.96);
	font-size: 12px;
	font-weight: 900;
	line-height: 1.2;
	letter-spacing: 0.13em;
	text-transform: uppercase;
}

.cfpo-app-nav {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	flex: 0 0 auto;
	gap: 8px;
	flex-wrap: wrap;
}

.cfpo-app-nav a {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	min-height: 44px;
	padding: 10px 17px;

	border: 1px solid transparent;
	border-radius: 999px;

	color: #21170c;
	font-size: 14px;
	font-weight: 850;
	line-height: 1;

	transition:
		background-color 0.2s ease,
		color 0.2s ease,
		border-color 0.2s ease,
		transform 0.2s ease;
}

.cfpo-app-nav a:hover {
	transform: translateY(-1px);
	background: rgba(255, 255, 255, 0.2);
	border-color: rgba(255, 255, 255, 0.3);
	color: #ffffff;
}

.cfpo-app-nav a.active {
	background: var(--cfpo-green);
	border-color: var(--cfpo-green);
	color: #ffffff;
	box-shadow:
		0 10px 24px rgba(4, 61, 46, 0.24);
}


/* ==========================================================================
   5. ARCHIVE HERO
   ========================================================================== */

.cfpo-hero {
	display: flex;
	align-items: center;
	width: 100vw;
	min-height: 430px;
	margin-left: calc(50% - 50vw);
	padding:
		82px
		max(
			var(--cfpo-page-padding),
			calc((100vw - var(--cfpo-content-width)) / 2)
		);

	background:
		linear-gradient(
			90deg,
			rgba(24, 17, 10, 0.94) 0%,
			rgba(24, 17, 10, 0.76) 43%,
			rgba(24, 17, 10, 0.28) 100%
		),
		radial-gradient(
			circle at 85% 32%,
			rgba(176, 120, 42, 0.48),
			transparent 31%
		),
		linear-gradient(
			135deg,
			#2d2118,
			#4b2e19
		);

	color: #ffffff;
}

.cfpo-hero-content {
	width: 100%;
	max-width: 760px;
}

.cfpo-hero h1 {
	margin: 0 0 20px;
	color: #ffffff;
	font-size: clamp(48px, 6vw, 88px);
	font-weight: 900;
	line-height: 0.98;
	letter-spacing: -0.06em;
}

.cfpo-hero h1 span {
	color: #f3c96f;
}

.cfpo-hero p {
	max-width: 620px;
	margin: 0;
	color: rgba(255, 255, 255, 0.85);
	font-size: clamp(17px, 1.8vw, 21px);
	line-height: 1.7;
}


/* ==========================================================================
   6. GENERAL BUTTONS
   ========================================================================== */

.cfpo-btn,
.cfpo-book-card-actions a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;

	min-height: 44px;
	padding: 11px 18px;

	border: 1px solid transparent;
	border-radius: 12px;

	font-size: 14px;
	font-weight: 850;
	line-height: 1.1;

	transition:
		background-color 0.2s ease,
		border-color 0.2s ease,
		color 0.2s ease,
		transform 0.2s ease,
		box-shadow 0.2s ease;
}

.cfpo-btn:hover,
.cfpo-book-card-actions a:hover {
	transform: translateY(-1px);
}

.cfpo-btn-primary {
	background: var(--cfpo-green);
	border-color: var(--cfpo-green);
	color: #ffffff;
	box-shadow:
		0 10px 24px rgba(6, 79, 59, 0.16);
}

.cfpo-btn-primary:hover {
	background: var(--cfpo-green-dark);
	border-color: var(--cfpo-green-dark);
	color: #ffffff;
}

.cfpo-btn-light {
	background: #ffffff;
	border-color: var(--cfpo-border);
	color: var(--cfpo-text);
}

.cfpo-btn-light:hover {
	background: var(--cfpo-gold-soft);
	border-color: var(--cfpo-gold-light);
	color: var(--cfpo-brown);
}

/*
|--------------------------------------------------------------------------
| Remove accidental search icon or empty icon line
|--------------------------------------------------------------------------
*/

.cfpo-books-wrap > svg,
.cfpo-books-wrap > i,
.cfpo-books-wrap > .search-icon,
.cfpo-books-wrap > .cfpo-search-icon {
	display: none;
}

/*
|--------------------------------------------------------------------------
| When the template has no common filter wrapper
|--------------------------------------------------------------------------
|
| These rules make the three controls sit on one row when they are direct
| children of the books wrapper.
*/

.cfpo-books-wrap:has(> .cfpo-book-search) {
	display: grid;
	grid-template-columns:
		minmax(320px, 2fr)
		minmax(190px, 0.7fr)
		minmax(190px, 0.7fr);
	gap: 12px;
	align-items: center;
}

.cfpo-books-wrap:has(> .cfpo-book-search) > .cfpo-book-search,
.cfpo-books-wrap:has(> .cfpo-book-search) > .cfpo-category-filter,
.cfpo-books-wrap:has(> .cfpo-book-search) > .cfpo-sort-filter {
	margin-bottom: 22px;
}

.cfpo-books-wrap:has(> .cfpo-book-search) > .cfpo-books-grid,
.cfpo-books-wrap:has(> .cfpo-book-search) > .cfpo-section-heading,
.cfpo-books-wrap:has(> .cfpo-book-search) > .cfpo-pagination {
	grid-column: 1 / -1;
}

/* ==========================================================================
   8. SECTION HEADINGS
   ========================================================================== */

.cfpo-section-heading {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 20px;
	margin: 0 0 24px;
}

.cfpo-section-heading h2 {
	margin: 0;
	color: var(--cfpo-text);
	font-size: clamp(26px, 3vw, 36px);
	font-weight: 900;
	line-height: 1.1;
	letter-spacing: -0.04em;
}

.cfpo-section-heading a {
	color: var(--cfpo-green);
	font-size: 14px;
	font-weight: 850;
}

.cfpo-section-heading a:hover {
	color: var(--cfpo-gold-dark);
}


/* ==========================================================================
   9. COMPACT CONTINUE READING
   ========================================================================== */

.cfpo-continue-section {
	margin-bottom: 46px;
}

.cfpo-continue-section .cfpo-section-heading {
	margin-bottom: 18px;
}

.cfpo-continue-section .cfpo-section-heading h2 {
	font-size: clamp(25px, 2.6vw, 34px);
}

.cfpo-continue-grid {
	display: grid;
	grid-template-columns:
		repeat(5, minmax(0, 1fr));
	gap: 16px;
}

.cfpo-continue-card {
	display: grid;
	grid-template-columns: 92px minmax(0, 1fr);
	grid-template-rows: auto auto auto;
	align-items: start;
	column-gap: 14px;
	row-gap: 8px;

	min-width: 0;
	min-height: 170px;
	padding: 14px;

	overflow: hidden;

	background: var(--cfpo-card);
	border: 1px solid var(--cfpo-border);
	border-radius: 17px;

	color: var(--cfpo-text);

	box-shadow:
		0 10px 28px rgba(22, 18, 12, 0.055);

	transition:
		transform 0.22s ease,
		box-shadow 0.22s ease,
		border-color 0.22s ease;
}

.cfpo-continue-card:hover {
	transform: translateY(-3px);
	border-color: rgba(176, 120, 42, 0.4);

	box-shadow:
		0 18px 38px rgba(22, 18, 12, 0.1);
}

/*
|--------------------------------------------------------------------------
| Compact book cover
|--------------------------------------------------------------------------
*/

.cfpo-continue-cover {
	grid-column: 1;
	grid-row: 1 / span 3;

	display: flex;
	align-items: center;
	justify-content: center;

	width: 92px;
	height: 138px;
	min-height: 0;
	aspect-ratio: auto;
	margin: 0;

	overflow: hidden;

	background: #f4f2ed;
	border-radius: 11px;
}

.cfpo-continue-cover img,
.cfpo-continue-cover .cfpo-book-cover-placeholder {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;

	background: #ffffff;
}

/*
|--------------------------------------------------------------------------
| Title
|--------------------------------------------------------------------------
*/

.cfpo-continue-card h3 {
	grid-column: 2;
	grid-row: 1;

	display: -webkit-box;
	margin: 2px 0 0;
	overflow: hidden;

	color: var(--cfpo-text);
	font-size: 14px;
	font-weight: 900;
	line-height: 1.35;
	letter-spacing: -0.015em;

	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
}

/*
|--------------------------------------------------------------------------
| Progress
|--------------------------------------------------------------------------
*/

.cfpo-mini-progress {
	grid-column: 2;
	grid-row: 2;

	width: 100%;
	height: 6px;
	margin: 2px 0 0;

	overflow: hidden;

	background: #e8e6e1;
	border-radius: 999px;
}

.cfpo-mini-progress span {
	display: block;
	height: 100%;

	background:
		linear-gradient(
			90deg,
			var(--cfpo-green),
			var(--cfpo-gold)
		);

	border-radius: 999px;
}

/*
|--------------------------------------------------------------------------
| Continue label
|--------------------------------------------------------------------------
*/

.cfpo-continue-card small {
	grid-column: 2;
	grid-row: 3;

	display: block;
	margin: 0;

	color: var(--cfpo-green);
	font-size: 11px;
	font-weight: 850;
	line-height: 1.35;
}


/* ==========================================================================
   10. CATEGORIES
   ========================================================================== */

.cfpo-categories-section {
	margin-bottom: 58px;
}

.cfpo-category-grid {
	display: grid;
	grid-template-columns:
		repeat(5, minmax(0, 1fr));
	gap: 16px;
}

.cfpo-category-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 10px;

	min-height: 145px;
	padding: 22px 16px;

	background: #ffffff;
	border: 1px solid var(--cfpo-border);
	border-radius: 20px;

	color: var(--cfpo-text);
	text-align: center;

	box-shadow: var(--cfpo-shadow-sm);

	transition:
		transform 0.22s ease,
		background-color 0.22s ease,
		color 0.22s ease,
		border-color 0.22s ease,
		box-shadow 0.22s ease;
}

.cfpo-category-card:hover {
	transform: translateY(-4px);
	background: var(--cfpo-green);
	border-color: var(--cfpo-green);
	color: #ffffff;
	box-shadow:
		0 20px 44px rgba(6, 79, 59, 0.16);
}

.cfpo-category-card span {
	display: grid;
	place-items: center;

	width: 50px;
	height: 50px;

	border-radius: 15px;
	background: var(--cfpo-gold-soft);
	color: var(--cfpo-gold);

	font-size: 22px;
	font-weight: 900;
}

.cfpo-category-card:hover span {
	background: rgba(255, 255, 255, 0.16);
	color: #ffffff;
}

.cfpo-category-card strong {
	font-size: 15px;
	font-weight: 900;
	line-height: 1.25;
}

.cfpo-category-card small {
	color: var(--cfpo-muted);
	font-size: 12px;
	font-weight: 700;
}

.cfpo-category-card:hover small {
	color: rgba(255, 255, 255, 0.78);
}


/* ==========================================================================
   11. BOOK GRID
   ========================================================================== */

.cfpo-books-grid {
	display: grid;
	grid-template-columns:
		repeat(4, minmax(0, 1fr));
	gap: 22px;
	align-items: stretch;
}

.cfpo-book-card-wrap {
	min-width: 0;
}

.cfpo-book-card {
	display: flex;
	flex-direction: column;

	height: 100%;
	min-width: 0;

	overflow: hidden;
	background: var(--cfpo-card);
	border: 1px solid var(--cfpo-border);
	border-radius: var(--cfpo-radius-lg);

	box-shadow: var(--cfpo-shadow-sm);

	transition:
		transform 0.24s ease,
		box-shadow 0.24s ease,
		border-color 0.24s ease;
}

.cfpo-book-card:hover {
	transform: translateY(-5px);
	border-color: rgba(176, 120, 42, 0.34);
	box-shadow: var(--cfpo-shadow-md);
}

.cfpo-book-card-main {
	display: grid;
	grid-template-columns: 132px minmax(0, 1fr);
	align-items: start;
	gap: 18px;
	padding: 20px;
}

.cfpo-book-cover-link {
	display: block;
	width: 132px;
	min-width: 132px;
	aspect-ratio: 2 / 3;
	overflow: hidden;
	border-radius: 13px;
	background: #f3f1ed;
	box-shadow:
		0 12px 30px rgba(22, 18, 12, 0.14);
}

.cfpo-book-cover-img,
.cfpo-book-cover-link img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
	background: #ffffff;
}

.cfpo-book-cover-placeholder {
	display: grid;
	place-items: center;

	width: 100%;
	height: 100%;

	background:
		linear-gradient(
			145deg,
			var(--cfpo-green),
			var(--cfpo-gold)
		);

	color: #ffffff;
	font-size: 18px;
	font-weight: 900;
	letter-spacing: 0.09em;
}

.cfpo-book-card-info {
	min-width: 0;
	padding-top: 2px;
}

.cfpo-book-chip,
.cfpo-format-badge,
.cfpo-progress-format {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	width: fit-content;
	max-width: 100%;

	padding: 7px 12px;

	border-radius: 999px;

	font-size: 11px;
	font-weight: 900;
	line-height: 1.2;
	letter-spacing: 0.03em;
	text-transform: uppercase;
}

.cfpo-book-chip {
	margin-bottom: 12px;
	background: var(--cfpo-green-soft);
	color: var(--cfpo-green);
}

.cfpo-format-badge {
	background: var(--cfpo-gold-soft);
	color: var(--cfpo-gold-dark);
}

.cfpo-book-card-info h3 {
	margin: 0 0 10px;
	font-size: 19px;
	font-weight: 900;
	line-height: 1.28;
	letter-spacing: -0.025em;
}

.cfpo-book-card-info h3 a {
	color: var(--cfpo-text);
}

.cfpo-book-card-info h3 a:hover {
	color: var(--cfpo-green);
}

.cfpo-book-subtitle {
	display: -webkit-box;
	margin: 0 0 12px;
	overflow: hidden;
	color: var(--cfpo-text-soft);
	font-size: 13px;
	line-height: 1.55;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
}

.cfpo-book-time {
	margin: 0;
	color: var(--cfpo-muted);
	font-size: 12px;
	font-weight: 750;
}

.cfpo-book-card-actions {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;

	margin-top: auto;
	padding: 15px 20px 20px;

	border-top: 1px solid var(--cfpo-border);
}


/* ==========================================================================
   12. SINGLE BOOK TOOLBAR
   ========================================================================== */

.cfpo-book-toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	margin-bottom: 24px;
}

.cfpo-back-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;

	min-height: 44px;
	padding: 10px 16px;

	background: #ffffff;
	border: 1px solid var(--cfpo-border);
	border-radius: 999px;

	color: var(--cfpo-green);
	font-size: 14px;
	font-weight: 850;

	box-shadow: var(--cfpo-shadow-sm);

	transition:
		transform 0.2s ease,
		background-color 0.2s ease,
		color 0.2s ease;
}

.cfpo-back-link:hover {
	transform: translateX(-2px);
	background: var(--cfpo-green);
	color: #ffffff;
}

.cfpo-book-toolbar-right {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 9px;
	flex-wrap: wrap;
}

.cfpo-reading-time {
	display: inline-flex;
	align-items: center;
	min-height: 32px;
	padding: 7px 12px;
	border-radius: 999px;
	background: #ffffff;
	border: 1px solid var(--cfpo-border);
	color: var(--cfpo-text-soft);
	font-size: 12px;
	font-weight: 800;
}


/* ==========================================================================
   13. SINGLE BOOK HERO
   ========================================================================== */

.cfpo-single-book {
	width: 100%;
	max-width: 1700px;
	margin: 0 auto;
}

.cfpo-single-hero,
.cfpo-details-panel {
	margin-bottom: 24px;

	background: var(--cfpo-card);
	border: 1px solid var(--cfpo-border);
	border-radius: var(--cfpo-radius-lg);

	box-shadow: var(--cfpo-shadow-sm);
}

.cfpo-single-hero {
	position: relative;
	display: grid;
	grid-template-columns: minmax(240px, 310px) minmax(0, 1fr);
	align-items: center;
	gap: clamp(30px, 4vw, 60px);

	padding: clamp(28px, 4vw, 54px);

	overflow: hidden;
}

.cfpo-single-hero::before {
	content: "";
	position: absolute;
	inset: 0 auto 0 0;
	width: 7px;
	background:
		linear-gradient(
			180deg,
			var(--cfpo-gold),
			var(--cfpo-green)
		);
}

.cfpo-single-cover {
	position: relative;
	z-index: 1;
	width: 100%;
	max-width: 310px;
	margin: 0 auto;
}

.cfpo-single-cover img,
.cfpo-single-cover-image {
	display: block;
	width: 100%;
	height: auto;
	max-height: 470px;
	object-fit: contain;
	border-radius: 16px;
	background: #ffffff;
	box-shadow:
		0 24px 58px rgba(22, 18, 12, 0.22);
}

.cfpo-single-cover .cfpo-book-cover-placeholder {
	min-height: 420px;
	border-radius: 16px;
}

.cfpo-single-info {
	min-width: 0;
}

.cfpo-single-info h1 {
	max-width: 1050px;
	margin: 0 0 16px;
	color: var(--cfpo-text);
	font-size: clamp(40px, 4.5vw, 70px);
	font-weight: 900;
	line-height: 0.99;
	letter-spacing: -0.055em;
	overflow-wrap: anywhere;
}

.cfpo-single-info h2 {
	max-width: 900px;
	margin: 0 0 22px;
	color: var(--cfpo-muted);
	font-size: clamp(18px, 2vw, 24px);
	font-weight: 500;
	line-height: 1.45;
	letter-spacing: -0.01em;
}

.cfpo-single-meta {
	display: grid;
	grid-template-columns:
		repeat(2, minmax(0, 1fr));
	gap: 10px 24px;

	max-width: 1050px;
	margin: 24px 0;

	color: var(--cfpo-text-soft);
}

.cfpo-single-meta span {
	display: block;
	min-width: 0;
	padding: 10px 0;
	border-bottom: 1px solid #efede8;
	font-size: 14px;
	line-height: 1.5;
}

.cfpo-single-meta strong {
	color: var(--cfpo-text);
	font-weight: 850;
}

.cfpo-reader-tools {
	display: flex;
	align-items: center;
	gap: 9px;
	flex-wrap: wrap;
}

.cfpo-reader-tools button {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	min-height: 43px;
	padding: 10px 15px;

	background: #ffffff;
	border: 1px solid var(--cfpo-border);
	border-radius: 11px;

	color: var(--cfpo-text);
	font-size: 13px;
	font-weight: 850;

	transition:
		background-color 0.2s ease,
		color 0.2s ease,
		border-color 0.2s ease,
		transform 0.2s ease;
}

.cfpo-reader-tools button:hover {
	transform: translateY(-1px);
	background: var(--cfpo-green);
	border-color: var(--cfpo-green);
	color: #ffffff;
}


/* ==========================================================================
   14. DETAIL PANELS
   ========================================================================== */

.cfpo-details-panel {
	padding: clamp(24px, 3vw, 40px);
}

.cfpo-details-panel h2 {
	margin: 0 0 20px;
	color: var(--cfpo-text);
	font-size: clamp(25px, 2.6vw, 34px);
	font-weight: 900;
	line-height: 1.15;
	letter-spacing: -0.035em;
}

.cfpo-detail-item {
	padding: 22px 0;
	border-top: 1px solid var(--cfpo-border);
}

.cfpo-detail-item:first-child {
	border-top: 0;
}

.cfpo-detail-item h3 {
	margin: 0 0 9px;
	font-size: 18px;
	font-weight: 850;
}

.cfpo-detail-item p {
	margin: 0;
	color: var(--cfpo-text-soft);
	font-size: 15px;
	line-height: 1.8;
}


/* ==========================================================================
   15. READING PROGRESS PANEL
   ========================================================================== */

.cfpo-progress-panel {
	padding: clamp(24px, 3vw, 38px);
}

.cfpo-progress-card-heading {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 22px;
	margin-bottom: 24px;
}

.cfpo-progress-card-heading h2 {
	margin: 0 0 7px;
}

.cfpo-progress-card-heading p,
.cfpo-progress-panel > p {
	margin: 0;
	color: var(--cfpo-muted);
	font-size: 14px;
	line-height: 1.65;
}

.cfpo-progress-format {
	flex: 0 0 auto;
	background: var(--cfpo-gold-soft);
	color: var(--cfpo-gold-dark);
}

.cfpo-progress-form {
	display: grid;
	grid-template-columns:
		minmax(240px, 1fr)
		auto
		auto;
	align-items: center;
	gap: 12px;
	margin-bottom: 24px;
}

#cfpo-reader-email {
	width: 100%;
	height: 56px;
	padding: 0 18px;

	background: #ffffff;
	border: 1px solid var(--cfpo-border-dark);
	border-radius: 13px;

	color: var(--cfpo-text);
	font-size: 15px;
	outline: 0;

	transition:
		border-color 0.2s ease,
		box-shadow 0.2s ease;
}

#cfpo-reader-email::placeholder {
	color: #9298a1;
}

#cfpo-reader-email:focus {
	border-color: var(--cfpo-green);
	box-shadow:
		0 0 0 4px rgba(6, 79, 59, 0.1);
}

#cfpo-save-progress,
#cfpo-continue-reading {
	min-height: 56px;
	padding-left: 23px;
	padding-right: 23px;
	white-space: nowrap;
}

.cfpo-progress-shell {
	width: 100%;
	height: 11px;
	margin: 4px 0 12px;
	overflow: hidden;
	border-radius: 999px;
	background: #e9e7e2;
}

.cfpo-progress-bar {
	width: 0;
	height: 100%;
	border-radius: 999px;
	background:
		linear-gradient(
			90deg,
			var(--cfpo-green),
			var(--cfpo-gold)
		);
	transition: width 0.38s ease;
}

.cfpo-progress-text {
	margin: 0 !important;
	color: var(--cfpo-green) !important;
	font-size: 14px !important;
	font-weight: 850;
}

.cfpo-progress-message {
	min-height: 22px;
	margin: 8px 0 0 !important;
	color: var(--cfpo-muted) !important;
	font-size: 13px !important;
}

.cfpo-progress-message.success {
	color: var(--cfpo-green) !important;
}

.cfpo-progress-message.error {
	color: #a63232 !important;
}


/* ==========================================================================
   16. BOOK TABS
   ========================================================================== */

.cfpo-book-tabs,
.cfpo-tab-buttons {
	position: static;
	inset: auto;
	transform: none;
}

.cfpo-book-tabs {
	width: 100%;
	min-width: 0;
}

.cfpo-tab-buttons {
	display: flex;
	align-items: center;
	gap: 9px;

	width: 100%;
	margin-bottom: 18px;
	padding: 8px;

	overflow-x: auto;
	overscroll-behavior-inline: contain;
	scrollbar-width: thin;

	background: rgba(255, 255, 255, 0.8);
	border: 1px solid var(--cfpo-border);
	border-radius: 17px;

	box-shadow: var(--cfpo-shadow-sm);
}

.cfpo-tab-buttons::-webkit-scrollbar {
	height: 7px;
}

.cfpo-tab-buttons::-webkit-scrollbar-thumb {
	background: #cec9c0;
	border-radius: 999px;
}

.cfpo-tab-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;

	min-height: 43px;
	padding: 10px 15px;

	background: transparent;
	border: 1px solid transparent;
	border-radius: 11px;

	color: var(--cfpo-text-soft);
	font-size: 13px;
	font-weight: 850;
	line-height: 1.15;
	white-space: nowrap;

	transition:
		background-color 0.2s ease,
		border-color 0.2s ease,
		color 0.2s ease;
}

.cfpo-tab-btn:hover {
	background: var(--cfpo-gold-soft);
	color: var(--cfpo-brown);
}

.cfpo-tab-btn.active,
.cfpo-tab-btn[aria-selected="true"] {
	background: var(--cfpo-green);
	border-color: var(--cfpo-green);
	color: #ffffff;
	box-shadow:
		0 8px 20px rgba(6, 79, 59, 0.15);
}

.cfpo-tab-content {
	display: none;
	width: 100%;
	min-width: 0;
}

.cfpo-tab-content.active {
	display: block;
}

.cfpo-tab-section-panel {
	overflow: hidden;
}

.cfpo-tab-section-heading {
	display: flex;
	align-items: center;
	gap: 16px;
	margin-bottom: 22px;
	padding-bottom: 20px;
	border-bottom: 1px solid var(--cfpo-border);
}

.cfpo-tab-section-heading > span {
	display: grid;
	place-items: center;
	flex: 0 0 auto;

	width: 48px;
	height: 48px;

	border-radius: 14px;
	background: var(--cfpo-gold-soft);
	color: var(--cfpo-gold-dark);
	font-size: 22px;
}

.cfpo-tab-section-heading h2 {
	margin: 0 0 4px;
}

.cfpo-tab-section-heading p {
	margin: 0;
	color: var(--cfpo-muted);
	font-size: 14px;
}

.cfpo-tab-section-body {
	max-width: 1100px;
	color: var(--cfpo-text-soft);
	font-size: 16px;
	line-height: 1.85;
	overflow-wrap: anywhere;
}


/* ==========================================================================
   17. READER SECTION HEADING
   ========================================================================== */

.cfpo-reader-section {
	width: 100%;
	max-width: none;
	min-width: 0;
	padding: 22px;
}

.cfpo-reader-heading {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 24px;

	margin-bottom: 22px;
	padding-bottom: 20px;

	border-bottom: 1px solid var(--cfpo-border);
}

.cfpo-reader-heading h2 {
	margin: 0 0 8px;
}

.cfpo-reader-heading p {
	max-width: 760px;
	margin: 0;
	color: var(--cfpo-muted);
	font-size: 14px;
	line-height: 1.65;
}

.cfpo-reader-actions {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 9px;
	flex-wrap: wrap;
	flex: 0 0 auto;
}

.cfpo-empty-reader {
	padding: 60px 26px;
	border: 1px dashed var(--cfpo-border-dark);
	border-radius: 18px;
	background: #faf9f6;
	text-align: center;
}

.cfpo-empty-reader h3 {
	margin: 0 0 8px;
	font-size: 23px;
}

.cfpo-empty-reader p {
	margin: 0;
	color: var(--cfpo-muted);
}


/* ==========================================================================
   18. PDF READER LAYOUT
   ========================================================================== */

#cfpo-tab-reader .cfpo-reader-layout {
	display: grid;
	grid-template-columns:
		190px
		minmax(0, 1fr);
	align-items: stretch;
	gap: 16px;

	width: 100%;
	max-width: none;
	min-width: 0;
	margin-top: 20px;
}

#cfpo-tab-reader .cfpo-reader-sidebar {
	position: relative;
	top: auto;

	width: 190px;
	min-width: 190px;
	height: min(88vh, 980px);
	min-height: 720px;

	padding: 15px;

	overflow: auto;
	overscroll-behavior: contain;

	background: #ffffff;
	border: 1px solid var(--cfpo-border);
	border-radius: 18px;

	box-shadow: var(--cfpo-shadow-sm);
}

#cfpo-tab-reader .cfpo-reader-sidebar h3 {
	position: sticky;
	top: -15px;
	z-index: 5;

	margin: -15px -15px 14px;
	padding: 17px 15px 13px;

	background: rgba(255, 255, 255, 0.96);
	border-bottom: 1px solid var(--cfpo-border);

	color: var(--cfpo-text);
	font-size: 17px;
	font-weight: 900;
}

.cfpo-pdf-thumbnails {
	width: 100%;
	min-height: 100px;
}

.cfpo-thumb-loading {
	margin: 0;
	color: var(--cfpo-muted);
	font-size: 13px;
}

.cfpo-page-thumb {
	display: block;
	width: 100%;
	margin: 0 0 13px;
	padding: 8px;

	background: #ffffff;
	border: 2px solid transparent;
	border-radius: 12px;

	color: var(--cfpo-text);
	cursor: pointer;

	transition:
		transform 0.2s ease,
		border-color 0.2s ease,
		box-shadow 0.2s ease,
		background-color 0.2s ease;
}

.cfpo-page-thumb:hover {
	transform: translateY(-2px);
	border-color: rgba(6, 79, 59, 0.45);
	background: var(--cfpo-green-soft);
}

.cfpo-page-thumb.active {
	border-color: var(--cfpo-green);
	box-shadow:
		0 10px 24px rgba(6, 79, 59, 0.16);
}

.cfpo-thumbnail-preview {
	display: flex;
	align-items: center;
	justify-content: center;

	width: 100%;
	min-height: 145px;

	overflow: hidden;
	border-radius: 8px;
	background: #eef0f2;
}

.cfpo-page-thumb canvas {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 6px;
	background: #ffffff;
}

.cfpo-thumbnail-loading {
	color: var(--cfpo-muted);
	font-size: 11px;
	font-weight: 700;
}

.cfpo-thumbnail-fallback {
	display: grid;
	place-items: center;
	width: 52px;
	height: 68px;
	border-radius: 8px;
	background: #ffffff;
	color: var(--cfpo-green);
	font-size: 20px;
	font-weight: 900;
}

.cfpo-page-number {
	display: block;
	margin-top: 8px;
	color: var(--cfpo-green);
	font-size: 11px;
	font-weight: 850;
	text-align: center;
}

#cfpo-tab-reader .cfpo-reader-panel {
	width: 100%;
	max-width: none;
	min-width: 0;
	overflow: hidden;

	background: #ffffff;
	border: 1px solid var(--cfpo-border);
	border-radius: 18px;

	box-shadow: var(--cfpo-shadow-sm);
}


/* ==========================================================================
   19. PDF READER
   ========================================================================== */

#cfpo-pdf-reader {
	position: relative;
	display: flex;
	flex-direction: column;

	width: 100%;
	max-width: none;
	min-width: 0;

	height: min(88vh, 980px);
	min-height: 720px;

	margin: 0;
	overflow: hidden;

	background: var(--cfpo-reader-bg);
	border: 0;
	border-radius: 18px;
}

#cfpo-pdf-reader .cfpo-pdf-toolbar {
	position: relative;
	z-index: 30;

	display: flex;
	align-items: center;
	justify-content: space-between;
	flex: 0 0 auto;
	gap: 14px;

	min-height: 68px;
	padding: 11px 16px;

	background: rgba(255, 255, 255, 0.98);
	border-bottom: 1px solid var(--cfpo-border);
}

#cfpo-pdf-reader .cfpo-toolbar-left,
#cfpo-pdf-reader .cfpo-toolbar-right {
	display: flex;
	align-items: center;
	gap: 8px;
	min-width: 0;
}

#cfpo-pdf-reader .cfpo-pdf-toolbar button,
#cfpo-pdf-pages-toggle,
#cfpo-pdf-fullscreen {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	min-width: 42px;
	min-height: 42px;
	margin: 0;
	padding: 9px 13px;

	background: #ffffff;
	border: 1px solid #dde1e5;
	border-radius: 10px;

	color: var(--cfpo-text);
	font-size: 12px;
	font-weight: 850;
	line-height: 1.1;
	white-space: nowrap;

	transition:
		background-color 0.2s ease,
		border-color 0.2s ease,
		color 0.2s ease,
		transform 0.2s ease;
}

#cfpo-pdf-reader .cfpo-pdf-toolbar button:hover,
#cfpo-pdf-pages-toggle:hover,
#cfpo-pdf-fullscreen:hover {
	transform: translateY(-1px);
	background: var(--cfpo-green-soft);
	border-color: var(--cfpo-green);
	color: var(--cfpo-green-dark);
}

#cfpo-pdf-next {
	background: var(--cfpo-green) !important;
	border-color: var(--cfpo-green) !important;
	color: #ffffff !important;
}

#cfpo-pdf-next:hover {
	background: var(--cfpo-green-dark) !important;
	border-color: var(--cfpo-green-dark) !important;
}

#cfpo-pdf-reader .cfpo-page-counter,
#cfpo-pdf-reader .cfpo-zoom-label {
	color: var(--cfpo-text-soft);
	font-size: 12px;
	font-weight: 850;
	white-space: nowrap;
}

#cfpo-pdf-reader .cfpo-page-counter strong {
	color: var(--cfpo-text);
}

#cfpo-pdf-reader .cfpo-pdf-stage {
	display: flex;
	align-items: flex-start;
	justify-content: center;
	flex: 1 1 auto;

	width: 100%;
	min-width: 0;
	min-height: 0;

	padding: 20px;

	overflow: auto;
	overscroll-behavior: contain;
	scrollbar-gutter: stable;

	background:
		linear-gradient(
			135deg,
			#e8ebee 0%,
			#f2f3f4 100%
		);
}

#cfpo-pdf-reader #cfpo-pdf-canvas {
	display: block;
	flex: 0 0 auto;

	max-width: none;
	height: auto;
	margin: 0 auto;

	background: #ffffff;
	border-radius: 6px;

	box-shadow:
		0 25px 65px rgba(22, 18, 12, 0.2);
}

#cfpo-pdf-reader .cfpo-reader-footer {
	display: flex;
	align-items: center;
	flex: 0 0 auto;
	gap: 18px;

	min-height: 58px;
	padding: 12px 18px;

	background: #ffffff;
	border-top: 1px solid var(--cfpo-border);
}

#cfpo-pdf-reader .cfpo-progress {
	flex: 1 1 auto;
	min-width: 80px;
	margin: 0;
}

#cfpo-pdf-reader .cfpo-progress-track {
	width: 100%;
	height: 7px;
	overflow: hidden;
	border-radius: 999px;
	background: #e4e5e7;
}

#cfpo-pdf-reader .cfpo-progress-fill {
	width: 0;
	height: 100%;
	border-radius: 999px;
	background:
		linear-gradient(
			90deg,
			var(--cfpo-green),
			var(--cfpo-gold)
		);
	transition: width 0.3s ease;
}

#cfpo-pdf-reader .cfpo-progress-label {
	flex: 0 0 auto;
	margin: 0;
	color: var(--cfpo-text-soft);
	font-size: 12px;
	font-weight: 850;
	white-space: nowrap;
}


/* PDF sidebar hidden state */

.cfpo-reader-layout.cfpo-pages-hidden {
	grid-template-columns: minmax(0, 1fr) !important;
}

.cfpo-reader-layout.cfpo-pages-hidden .cfpo-reader-sidebar {
	display: none !important;
}


/* PDF fullscreen */

#cfpo-pdf-reader:fullscreen,
#cfpo-pdf-reader:-webkit-full-screen,
#cfpo-pdf-reader.cfpo-pdf-fullscreen-fallback {
	width: 100vw !important;
	max-width: none !important;
	height: 100vh !important;
	height: 100dvh !important;
	min-height: 0 !important;
	margin: 0 !important;
	border-radius: 0 !important;
	background: var(--cfpo-reader-bg) !important;
}

#cfpo-pdf-reader.cfpo-pdf-fullscreen-fallback {
	position: fixed !important;
	inset: 0 !important;
	z-index: 2147483647 !important;
}

body.cfpo-pdf-fullscreen-open {
	overflow: hidden !important;
}

#cfpo-pdf-reader:fullscreen .cfpo-pdf-stage,
#cfpo-pdf-reader:-webkit-full-screen .cfpo-pdf-stage,
#cfpo-pdf-reader.cfpo-pdf-fullscreen-fallback .cfpo-pdf-stage {
	padding: 18px;
}


/* ==========================================================================
   20. EPUB READER
   ========================================================================== */

.cfpo-epub-reader {
	position: relative;
	display: flex;
	flex-direction: column;

	width: 100%;
	min-width: 0;
	height: min(84vh, 920px);
	min-height: 680px;

	overflow: hidden;

	background: #fffdf8;
	border: 1px solid var(--cfpo-border);
	border-radius: 18px;

	box-shadow: var(--cfpo-shadow-sm);
}

.cfpo-epub-toolbar {
	display: grid;
	grid-template-columns:
		minmax(0, 1fr)
		auto
		minmax(0, 1fr);
	align-items: center;
	gap: 14px;
	flex: 0 0 auto;

	min-height: 72px;
	padding: 12px 16px;

	background: #ffffff;
	border-bottom: 1px solid var(--cfpo-border);
}

.cfpo-epub-toolbar-left,
.cfpo-epub-toolbar-center,
.cfpo-epub-toolbar-right {
	display: flex;
	align-items: center;
	gap: 8px;
	min-width: 0;
}

.cfpo-epub-toolbar-center {
	justify-content: center;
}

.cfpo-epub-toolbar-right {
	justify-content: flex-end;
}

.cfpo-epub-toolbar button {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	min-width: 42px;
	min-height: 42px;
	padding: 9px 12px;

	background: #ffffff;
	border: 1px solid #ddd9d2;
	border-radius: 10px;

	color: var(--cfpo-text);
	font-size: 12px;
	font-weight: 850;

	transition:
		background-color 0.2s ease,
		border-color 0.2s ease,
		color 0.2s ease,
		transform 0.2s ease;
}

.cfpo-epub-toolbar button:hover {
	transform: translateY(-1px);
	background: var(--cfpo-gold-soft);
	border-color: var(--cfpo-gold);
	color: var(--cfpo-brown);
}

.cfpo-epub-icon-button {
	flex: 0 0 auto;
}

.cfpo-epub-chapter-title {
	display: block;
	min-width: 0;
	max-width: 320px;
	overflow: hidden;
	color: var(--cfpo-text-soft);
	font-size: 13px;
	font-weight: 850;
	text-overflow: ellipsis;
	white-space: nowrap;
}

#cfpo-epub-font-label {
	min-width: 44px;
	color: var(--cfpo-text-soft);
	font-size: 12px;
	font-weight: 850;
	text-align: center;
}

.cfpo-epub-body {
	position: relative;
	display: flex;
	flex: 1 1 auto;
	min-height: 0;
	overflow: hidden;
}

.cfpo-epub-toc {
	position: relative;
	z-index: 10;
	flex: 0 0 280px;
	width: 280px;
	height: 100%;
	padding: 18px;

	overflow-y: auto;

	background: #ffffff;
	border-right: 1px solid var(--cfpo-border);
}

.cfpo-epub-toc-heading {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 15px;
}

.cfpo-epub-toc-heading h3 {
	margin: 0;
	font-size: 19px;
	font-weight: 900;
}

#cfpo-epub-toc-close {
	display: none;
}

.cfpo-epub-toc-list {
	display: grid;
	gap: 5px;
}

.cfpo-epub-toc-list a,
.cfpo-epub-toc-list button {
	display: block;
	width: 100%;
	padding: 10px 11px;

	background: transparent;
	border: 0;
	border-radius: 9px;

	color: var(--cfpo-text-soft);
	font-size: 13px;
	font-weight: 700;
	line-height: 1.4;
	text-align: left;
}

.cfpo-epub-toc-list a:hover,
.cfpo-epub-toc-list button:hover,
.cfpo-epub-toc-list .active {
	background: var(--cfpo-green-soft);
	color: var(--cfpo-green);
}

.cfpo-epub-loading {
	margin: 0;
	color: var(--cfpo-muted);
	font-size: 13px;
}

.cfpo-epub-stage {
	position: relative;
	flex: 1 1 auto;
	min-width: 0;
	min-height: 0;
	overflow: hidden;
	background: #fffdf8;
}

#cfpo-epub-view {
	width: 100%;
	height: 100%;
	min-height: 0;
}

#cfpo-epub-view iframe {
	display: block;
	width: 100% !important;
	height: 100% !important;
	border: 0 !important;
}

.cfpo-epub-status {
	position: absolute;
	inset: 0;
	z-index: 5;

	display: flex;
	align-items: center;
	justify-content: center;

	padding: 24px;

	background: #fffdf8;
	color: var(--cfpo-muted);

	font-size: 14px;
	font-weight: 750;
	text-align: center;

	pointer-events: none;
}

.cfpo-epub-status:empty {
	display: none;
}

.cfpo-epub-footer {
	display: grid;
	grid-template-columns:
		minmax(0, 1fr)
		auto
		auto;
	align-items: center;
	gap: 14px;
	flex: 0 0 auto;

	min-height: 60px;
	padding: 12px 18px;

	background: #ffffff;
	border-top: 1px solid var(--cfpo-border);
}

.cfpo-epub-progress-track {
	width: 100%;
	height: 7px;
	overflow: hidden;
	border-radius: 999px;
	background: #e8e5df;
}

.cfpo-epub-progress-fill {
	width: 0;
	height: 100%;
	border-radius: 999px;
	background:
		linear-gradient(
			90deg,
			var(--cfpo-green),
			var(--cfpo-gold)
		);
	transition: width 0.3s ease;
}

#cfpo-epub-progress-text,
#cfpo-epub-location-text {
	color: var(--cfpo-text-soft);
	font-size: 12px;
	font-weight: 800;
	white-space: nowrap;
}


/* EPUB fullscreen */

body.cfpo-reader-fullscreen-open {
	position: fixed !important;
	inset: 0 !important;
	width: 100% !important;
	height: 100% !important;
	overflow: hidden !important;
	touch-action: none;
}

.cfpo-epub-reader.cfpo-mobile-fullscreen,
.cfpo-epub-reader:fullscreen,
.cfpo-epub-reader:-webkit-full-screen {
	position: fixed !important;
	inset: 0 !important;
	z-index: 2147483647 !important;

	display: flex !important;
	flex-direction: column !important;

	width: 100vw !important;
	max-width: none !important;
	height: 100vh !important;
	height: 100dvh !important;
	max-height: none !important;
	min-height: 0 !important;

	margin: 0 !important;
	padding: 0 !important;

	overflow: hidden !important;

	background: #fffdf8 !important;
	border: 0 !important;
	border-radius: 0 !important;
}

.cfpo-epub-reader.cfpo-mobile-fullscreen .cfpo-epub-toolbar,
.cfpo-epub-reader:fullscreen .cfpo-epub-toolbar,
.cfpo-epub-reader:-webkit-full-screen .cfpo-epub-toolbar {
	flex: 0 0 auto !important;
	width: 100% !important;
	border-radius: 0 !important;
}

.cfpo-epub-reader.cfpo-mobile-fullscreen .cfpo-epub-body,
.cfpo-epub-reader:fullscreen .cfpo-epub-body,
.cfpo-epub-reader:-webkit-full-screen .cfpo-epub-body {
	display: flex !important;
	flex: 1 1 auto !important;
	min-height: 0 !important;
	height: auto !important;
	overflow: hidden !important;
}

.cfpo-epub-reader.cfpo-mobile-fullscreen .cfpo-epub-stage,
.cfpo-epub-reader:fullscreen .cfpo-epub-stage,
.cfpo-epub-reader:-webkit-full-screen .cfpo-epub-stage {
	flex: 1 1 auto !important;
	width: 100% !important;
	height: 100% !important;
	min-height: 0 !important;
}

.cfpo-epub-reader.cfpo-mobile-fullscreen #cfpo-epub-view,
.cfpo-epub-reader:fullscreen #cfpo-epub-view,
.cfpo-epub-reader:-webkit-full-screen #cfpo-epub-view {
	width: 100% !important;
	height: 100% !important;
	min-height: 0 !important;
}

.cfpo-epub-reader.cfpo-mobile-fullscreen #cfpo-epub-view iframe,
.cfpo-epub-reader:fullscreen #cfpo-epub-view iframe,
.cfpo-epub-reader:-webkit-full-screen #cfpo-epub-view iframe {
	width: 100% !important;
	height: 100% !important;
	min-height: 100% !important;
	border: 0 !important;
}

.cfpo-epub-reader.cfpo-mobile-fullscreen .cfpo-epub-footer,
.cfpo-epub-reader:fullscreen .cfpo-epub-footer,
.cfpo-epub-reader:-webkit-full-screen .cfpo-epub-footer {
	flex: 0 0 auto !important;
	width: 100% !important;
	border-radius: 0 !important;
}

.cfpo-epub-reader.cfpo-mobile-fullscreen #cfpo-epub-fullscreen {
	background: var(--cfpo-brown) !important;
	border-color: var(--cfpo-brown) !important;
	color: #ffffff !important;
}


/* ==========================================================================
   21. DARK MODE SUPPORT
   ========================================================================== */

.cfpo-library-page.cfpo-dark-mode {
	--cfpo-page: #171816;
	--cfpo-card: #21231f;
	--cfpo-reader-bg: #121412;
	--cfpo-text: #f4f1e9;
	--cfpo-text-soft: #d8d3c9;
	--cfpo-muted: #aaa69e;
	--cfpo-border: #383b35;
	--cfpo-border-dark: #4b4e47;

	background: #171816;
	color: var(--cfpo-text);
}

.cfpo-library-page.cfpo-dark-mode .cfpo-single-hero,
.cfpo-library-page.cfpo-dark-mode .cfpo-details-panel,
.cfpo-library-page.cfpo-dark-mode .cfpo-tab-buttons,
.cfpo-library-page.cfpo-dark-mode .cfpo-book-card,
.cfpo-library-page.cfpo-dark-mode .cfpo-continue-card,
.cfpo-library-page.cfpo-dark-mode .cfpo-category-card {
	background: var(--cfpo-card);
	border-color: var(--cfpo-border);
}

.cfpo-library-page.cfpo-dark-mode .cfpo-tab-btn,
.cfpo-library-page.cfpo-dark-mode .cfpo-reader-tools button,
.cfpo-library-page.cfpo-dark-mode .cfpo-btn-light {
	background: #282a26;
	border-color: var(--cfpo-border);
	color: var(--cfpo-text);
}


/* ==========================================================================
   22. WORDPRESS THEME LAYERING
   ========================================================================== */

.site-header,
#masthead,
.main-header,
.header,
.main-navigation {
	position: relative;
	z-index: 99999;
}

.cfpo-app-header {
	z-index: 1000;
}


/* ==========================================================================
   23. LARGE DESKTOP
   ========================================================================== */

@media (min-width: 1500px) {

	.cfpo-library-page {
		--cfpo-content-width: 1840px;
		--cfpo-page-padding: 30px;
	}

	.cfpo-single-book {
		max-width: 1780px;
	}

	#cfpo-tab-reader .cfpo-reader-layout {
		grid-template-columns:
			200px
			minmax(0, 1fr);
		gap: 18px;
	}

	#cfpo-tab-reader .cfpo-reader-sidebar {
		width: 200px;
		min-width: 200px;
		height: min(90vh, 1050px);
	}

	#cfpo-pdf-reader {
		height: min(90vh, 1050px);
		min-height: 800px;
	}
}


/* ==========================================================================
   24. LAPTOP AND TABLET
   ========================================================================== */

@media (max-width: 1450px) {

	.cfpo-books-grid {
		grid-template-columns:
			repeat(3, minmax(0, 1fr));
	}

	.cfpo-category-grid {
		grid-template-columns:
			repeat(4, minmax(0, 1fr));
	}

	.cfpo-continue-grid {
		grid-template-columns:
			repeat(3, minmax(0, 1fr));
	}
}


@media (max-width: 1180px) {

	.cfpo-app-header {
		align-items: flex-start;
	}

	.cfpo-app-nav {
		max-width: 520px;
	}

	.cfpo-single-hero {
		grid-template-columns:
			minmax(220px, 270px)
			minmax(0, 1fr);
		gap: 32px;
	}

	.cfpo-single-info h1 {
		font-size: clamp(38px, 5vw, 58px);
	}

	.cfpo-progress-form {
		grid-template-columns:
			minmax(220px, 1fr)
			auto;
	}

	#cfpo-continue-reading {
		grid-column: 2;
	}

	#cfpo-tab-reader .cfpo-reader-layout {
		grid-template-columns:
			165px
			minmax(0, 1fr);
		gap: 14px;
	}

	#cfpo-tab-reader .cfpo-reader-sidebar {
		width: 165px;
		min-width: 165px;
	}

	.cfpo-epub-toolbar {
		grid-template-columns:
			minmax(0, 1fr)
			auto;
	}

	.cfpo-epub-toolbar-center {
		grid-column: 1 / -1;
		grid-row: 2;
		order: 3;
		padding-top: 4px;
	}

	.cfpo-epub-toolbar-right {
		grid-column: 2;
		grid-row: 1;
	}
}


@media (max-width: 991px) {

	.admin-bar .cfpo-app-header {
		top: 46px;
	}

	.cfpo-app-header {
		position: relative;
		top: auto;

		flex-direction: column;
		align-items: stretch;
		gap: 14px;

		min-height: 0;
		padding-top: 14px;
		padding-bottom: 14px;
	}

	.cfpo-app-brand {
		width: 100%;
	}

	.cfpo-app-nav {
		justify-content: flex-start;
		width: 100%;
		max-width: none;
		overflow-x: auto;
		flex-wrap: nowrap;
		padding-bottom: 2px;
	}

	.cfpo-app-nav a {
		flex: 0 0 auto;
	}

	.cfpo-books-grid {
		grid-template-columns:
			repeat(2, minmax(0, 1fr));
	}

	.cfpo-category-grid {
		grid-template-columns:
			repeat(3, minmax(0, 1fr));
	}

	.cfpo-continue-grid {
		grid-template-columns:
			repeat(2, minmax(0, 1fr));
	}

	.cfpo-single-hero {
		grid-template-columns:
			230px
			minmax(0, 1fr);
		padding: 28px;
	}

	.cfpo-single-meta {
		grid-template-columns: 1fr;
	}

	.cfpo-reader-heading {
		flex-direction: column;
	}

	.cfpo-reader-actions {
		justify-content: flex-start;
	}

	#cfpo-tab-reader .cfpo-reader-layout {
		display: block;
	}

	#cfpo-tab-reader .cfpo-reader-sidebar {
		display: none;
	}

	#cfpo-tab-reader .cfpo-reader-panel {
		width: 100%;
	}

	#cfpo-pdf-reader {
		height: min(82vh, 900px);
		min-height: 650px;
	}

	.cfpo-epub-toc {
		position: absolute;
		inset: 0 auto 0 0;
		z-index: 40;

		width: min(86vw, 320px);
		max-width: 320px;

		transform: translateX(-105%);
		box-shadow:
			18px 0 45px rgba(22, 18, 12, 0.18);

		transition: transform 0.25s ease;
	}

	.cfpo-epub-reader.cfpo-toc-open .cfpo-epub-toc {
		transform: translateX(0);
	}

	#cfpo-epub-toc-close {
		display: inline-flex;
	}
}


/* ==========================================================================
   25. MOBILE
   ========================================================================== */

@media (max-width: 760px) {

	.cfpo-library-page {
		--cfpo-page-padding: 12px;
	}

	.cfpo-library-container,
	.cfpo-home-style .cfpo-library-container {
		width: calc(100% - 20px);
		padding-top: 22px;
		padding-bottom: 70px;
	}

	.cfpo-app-header {
		width: 100vw;
		margin-left: calc(50% - 50vw);
		padding:
			12px
			max(
				12px,
				env(safe-area-inset-right)
			)
			12px
			max(
				12px,
				env(safe-area-inset-left)
			);
	}

	.cfpo-app-brand {
		gap: 11px;
	}

	.cfpo-app-brand img {
		width: 50px;
		height: 50px;
	}

	.cfpo-app-brand h2 {
		font-size: 26px;
	}

	.cfpo-app-brand span {
		margin-top: 4px;
		font-size: 10px;
		letter-spacing: 0.1em;
	}

	.cfpo-app-nav {
		gap: 6px;
	}

	.cfpo-app-nav a {
		min-height: 38px;
		padding: 9px 12px;
		font-size: 12px;
	}

	.cfpo-hero {
		min-height: 360px;
		padding:
			60px
			18px
			78px;
	}

	.cfpo-hero h1 {
		font-size: clamp(42px, 14vw, 62px);
	}

	.cfpo-hero p {
		font-size: 16px;
	}

	.cfpo-library-search-hero {
		margin-top: -55px;
		margin-bottom: 34px;
	}

	.cfpo-library-search-hero .cfpo-book-search {
		height: 58px;
		padding: 0 21px;
		font-size: 15px;
	}

	.cfpo-section-heading {
		align-items: flex-start;
		flex-direction: column;
		gap: 7px;
	}

	.cfpo-books-grid,
	.cfpo-continue-grid {
		grid-template-columns:
			repeat(2, minmax(0, 1fr));
		gap: 10px;
	}

	.cfpo-category-grid {
		grid-template-columns:
			repeat(2, minmax(0, 1fr));
		gap: 10px;
	}

	.cfpo-category-card {
		min-height: 118px;
		padding: 16px 10px;
		border-radius: 15px;
	}

	.cfpo-category-card span {
		width: 42px;
		height: 42px;
	}

	.cfpo-continue-card {
		padding: 10px;
		border-radius: 15px;
	}

	.cfpo-continue-cover {
		min-height: 185px;
		margin-bottom: 11px;
		border-radius: 11px;
	}

	.cfpo-continue-card h3 {
		font-size: 14px;
	}

	.cfpo-book-card {
		border-radius: 15px;
	}

	.cfpo-book-card-main {
		display: flex;
		flex-direction: column;
		gap: 11px;
		padding: 10px;
	}

	.cfpo-book-cover-link {
		width: 100%;
		min-width: 0;
		aspect-ratio: 2 / 3;
		border-radius: 11px;
	}

	.cfpo-book-card-info {
		width: 100%;
		padding: 0;
	}

	.cfpo-book-chip {
		margin-bottom: 8px;
		padding: 5px 8px;
		font-size: 9px;
	}

	.cfpo-book-card-info h3 {
		margin-bottom: 7px;
		font-size: 14px;
		line-height: 1.3;
	}

	.cfpo-book-subtitle {
		margin-bottom: 8px;
		font-size: 11px;
		line-height: 1.45;
		-webkit-line-clamp: 3;
	}

	.cfpo-book-time {
		font-size: 10px;
	}

	.cfpo-book-card-actions {
		display: grid;
		grid-template-columns: 1fr;
		gap: 6px;
		padding: 9px 10px 11px;
	}

	.cfpo-book-card-actions a,
	.cfpo-book-card-actions .cfpo-btn {
		width: 100%;
		min-height: 37px;
		padding: 8px 7px;
		border-radius: 9px;
		font-size: 11px;
		text-align: center;
	}

	.cfpo-book-toolbar {
		align-items: flex-start;
		flex-direction: column;
		gap: 12px;
	}

	.cfpo-book-toolbar-right {
		justify-content: flex-start;
		width: 100%;
	}

	.cfpo-single-hero {
		grid-template-columns: 1fr;
		gap: 24px;
		padding: 20px;
	}

	.cfpo-single-cover {
		max-width: 230px;
	}

	.cfpo-single-cover img,
	.cfpo-single-cover-image {
		max-height: 360px;
	}

	.cfpo-single-cover .cfpo-book-cover-placeholder {
		min-height: 330px;
	}

	.cfpo-single-info h1 {
		font-size: clamp(34px, 11vw, 46px);
	}

	.cfpo-single-info h2 {
		font-size: 17px;
	}

	.cfpo-single-meta {
		gap: 0;
	}

	.cfpo-reader-tools {
		display: grid;
		grid-template-columns:
			repeat(2, minmax(0, 1fr));
	}

	.cfpo-reader-tools button {
		width: 100%;
		padding: 9px 8px;
		font-size: 11px;
	}

	.cfpo-details-panel {
		padding: 20px;
		border-radius: 18px;
	}

	.cfpo-progress-card-heading {
		flex-direction: column;
		gap: 10px;
	}

	.cfpo-progress-form {
		display: grid;
		grid-template-columns: 1fr;
		gap: 9px;
	}

	#cfpo-save-progress,
	#cfpo-continue-reading {
		grid-column: auto;
		width: 100%;
		min-height: 50px;
	}

	.cfpo-tab-buttons {
		gap: 6px;
		padding: 6px;
		border-radius: 13px;
	}

	.cfpo-tab-btn {
		min-height: 39px;
		padding: 9px 11px;
		border-radius: 9px;
		font-size: 11px;
	}

	.cfpo-reader-section {
		padding: 7px;
	}

	.cfpo-reader-heading {
		padding: 14px 12px 16px;
		margin-bottom: 8px;
	}

	.cfpo-reader-actions {
		display: grid;
		grid-template-columns:
			repeat(2, minmax(0, 1fr));
		width: 100%;
	}

	.cfpo-reader-actions .cfpo-btn {
		width: 100%;
		padding: 9px 8px;
		font-size: 11px;
	}

	#cfpo-pdf-reader {
		width: 100%;
		height: 78vh;
		height: 78dvh;
		min-height: 560px;
		border-radius: 13px;
	}

	#cfpo-pdf-reader .cfpo-pdf-toolbar {
		display: grid;
		grid-template-columns: 1fr;
		gap: 8px;
		padding: 8px;
		min-height: 0;
	}

	#cfpo-pdf-reader .cfpo-toolbar-left,
	#cfpo-pdf-reader .cfpo-toolbar-right {
		justify-content: center;
		width: 100%;
		gap: 5px;
		flex-wrap: wrap;
	}

	#cfpo-pdf-reader .cfpo-pdf-toolbar button,
	#cfpo-pdf-pages-toggle,
	#cfpo-pdf-fullscreen {
		flex: 0 1 auto;
		min-width: 38px;
		min-height: 38px;
		padding: 7px 9px;
		border-radius: 8px;
		font-size: 10px;
	}

	#cfpo-pdf-reader .cfpo-page-counter,
	#cfpo-pdf-reader .cfpo-zoom-label {
		font-size: 10px;
	}

	#cfpo-pdf-reader .cfpo-pdf-stage {
		padding: 7px;
	}

	#cfpo-pdf-reader .cfpo-reader-footer {
		gap: 8px;
		min-height: 48px;
		padding: 9px 10px;
	}

	#cfpo-pdf-reader .cfpo-progress-label {
		font-size: 10px;
	}

	.cfpo-epub-reader {
		height: 78vh;
		height: 78dvh;
		min-height: 580px;
		border-radius: 13px;
	}

	.cfpo-epub-toolbar {
		display: grid;
		grid-template-columns:
			minmax(0, 1fr)
			auto;
		gap: 7px;
		padding: 8px;
	}

	.cfpo-epub-toolbar-left {
		min-width: 0;
	}

	.cfpo-epub-chapter-title {
		max-width: 190px;
		font-size: 11px;
	}

	.cfpo-epub-toolbar-center {
		grid-column: 1 / -1;
		display: grid;
		grid-template-columns:
			1fr
			1fr;
		gap: 7px;
		order: 3;
	}

	.cfpo-epub-toolbar-right {
		gap: 4px;
	}

	.cfpo-epub-toolbar button {
		min-width: 36px;
		min-height: 36px;
		padding: 7px 8px;
		border-radius: 8px;
		font-size: 10px;
	}

	#cfpo-epub-font-label {
		min-width: 35px;
		font-size: 10px;
	}

	.cfpo-epub-footer {
		grid-template-columns: 1fr auto;
		gap: 8px;
		padding: 9px 10px;
	}

	#cfpo-epub-location-text {
		grid-column: 1 / -1;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.cfpo-epub-reader.cfpo-mobile-fullscreen .cfpo-epub-toolbar {
		padding:
			max(8px, env(safe-area-inset-top))
			10px
			8px !important;
	}

	.cfpo-epub-reader.cfpo-mobile-fullscreen .cfpo-epub-footer {
		padding:
			9px
			10px
			max(9px, env(safe-area-inset-bottom)) !important;
	}
}


/* ==========================================================================
   26. VERY SMALL PHONES
   ========================================================================== */

@media (max-width: 390px) {

	.cfpo-library-container,
	.cfpo-home-style .cfpo-library-container {
		width: calc(100% - 14px);
	}

	.cfpo-books-grid,
	.cfpo-continue-grid,
	.cfpo-category-grid {
		gap: 7px;
	}

	.cfpo-app-header {
		padding-left: 9px;
		padding-right: 9px;
	}

	.cfpo-app-brand img {
		width: 44px;
		height: 44px;
	}

	.cfpo-app-brand h2 {
		font-size: 23px;
	}

	.cfpo-app-nav a {
		padding: 8px 10px;
		font-size: 11px;
	}

	.cfpo-continue-cover {
		min-height: 165px;
	}

	.cfpo-book-card-main {
		padding: 8px;
	}

	.cfpo-book-card-info h3 {
		font-size: 13px;
	}

	.cfpo-book-subtitle {
		font-size: 10px;
	}

	.cfpo-single-hero {
		padding: 17px;
	}

	.cfpo-single-info h1 {
		font-size: 34px;
	}

	.cfpo-reader-tools {
		grid-template-columns: 1fr;
	}

	.cfpo-reader-actions {
		grid-template-columns: 1fr;
	}

	#cfpo-pdf-reader .cfpo-pdf-toolbar button {
		padding-left: 7px;
		padding-right: 7px;
	}

	.cfpo-epub-chapter-title {
		max-width: 145px;
	}
}


/* ==========================================================================
   27. REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

	.cfpo-library-page *,
	.cfpo-library-page *::before,
	.cfpo-library-page *::after {
		scroll-behavior: auto !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}

/* ==========================================================================
   CFPO FINAL ARCHIVE HEADER AND LAYOUT-STABILITY FIX
   ========================================================================== */

/*
|--------------------------------------------------------------------------
| 1. Remove the empty theme header above the CFPO library
|--------------------------------------------------------------------------
*/

body.post-type-archive-cfpo_book,
body.tax-cfpo_book_category {
	margin: 0 !important;
	padding: 0 !important;
}

body.post-type-archive-cfpo_book .site-header,
body.post-type-archive-cfpo_book #masthead,
body.post-type-archive-cfpo_book header.site-header,
body.post-type-archive-cfpo_book .wp-site-blocks > header,
body.tax-cfpo_book_category .site-header,
body.tax-cfpo_book_category #masthead,
body.tax-cfpo_book_category header.site-header,
body.tax-cfpo_book_category .wp-site-blocks > header {
	display: none !important;
	height: 0 !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	overflow: hidden !important;
}

/*
|--------------------------------------------------------------------------
| 2. Remove theme container restrictions
|--------------------------------------------------------------------------
*/

body.post-type-archive-cfpo_book #page,
body.post-type-archive-cfpo_book #content,
body.post-type-archive-cfpo_book #primary,
body.post-type-archive-cfpo_book .site-content,
body.post-type-archive-cfpo_book .content-area,
body.post-type-archive-cfpo_book .site-main,
body.post-type-archive-cfpo_book .wp-site-blocks,
body.tax-cfpo_book_category #page,
body.tax-cfpo_book_category #content,
body.tax-cfpo_book_category #primary,
body.tax-cfpo_book_category .site-content,
body.tax-cfpo_book_category .content-area,
body.tax-cfpo_book_category .site-main,
body.tax-cfpo_book_category .wp-site-blocks {
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

/*
|--------------------------------------------------------------------------
| 3. Stable CFPO header
|--------------------------------------------------------------------------
*/

.cfpo-app-header {
	position: relative !important;
	top: auto !important;
	left: auto !important;
	right: auto !important;

	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 30px !important;

	width: 100% !important;
	max-width: none !important;
	min-height: 112px !important;

	margin: 0 !important;
	padding: 18px clamp(24px, 4.5vw, 88px) !important;

	background: #b77b28 !important;
	border: 0 !important;
	border-bottom: 1px solid rgba(60, 35, 10, 0.18) !important;

	box-shadow: none !important;
	transform: none !important;
	z-index: 1000 !important;
}

/*
|--------------------------------------------------------------------------
| 4. Header brand
|--------------------------------------------------------------------------
*/

.cfpo-app-brand {
	display: flex !important;
	align-items: center !important;
	flex: 0 0 auto !important;
	gap: 17px !important;

	width: auto !important;
	min-width: 0 !important;
	margin: 0 !important;
}

.cfpo-app-brand > a {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;

	width: 74px !important;
	height: 74px !important;
	flex: 0 0 74px !important;

	margin: 0 !important;
	padding: 0 !important;

	background: #ffffff !important;
	border-radius: 50% !important;

	overflow: hidden !important;
}

.cfpo-app-brand img {
	display: block !important;

	width: 64px !important;
	height: 64px !important;
	max-width: 64px !important;
	max-height: 64px !important;

	margin: 0 !important;
	padding: 2px !important;

	object-fit: contain !important;
	object-position: center !important;

	background: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;

	box-shadow: none !important;
}

.cfpo-app-brand h2 {
	margin: 0 !important;

	color: #111111 !important;
	font-size: clamp(31px, 2.4vw, 43px) !important;
	font-weight: 900 !important;
	line-height: 0.95 !important;
	letter-spacing: -0.045em !important;
}

.cfpo-app-brand span {
	display: block !important;

	margin-top: 8px !important;

	color: #ffffff !important;
	font-size: 14px !important;
	font-weight: 900 !important;
	line-height: 1.1 !important;
	letter-spacing: 0.05em !important;
	text-transform: uppercase !important;
}

/*
|--------------------------------------------------------------------------
| 5. Header navigation
|--------------------------------------------------------------------------
*/

.cfpo-app-nav {
	display: flex !important;
	align-items: center !important;
	justify-content: flex-end !important;
	flex: 0 0 auto !important;
	gap: clamp(10px, 1.6vw, 28px) !important;

	margin: 0 !important;
	padding: 0 !important;

	overflow: visible !important;
}

.cfpo-app-nav a {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;

	min-width: 0 !important;
	min-height: 48px !important;

	margin: 0 !important;
	padding: 12px 19px !important;

	background: transparent !important;
	border: 0 !important;
	border-radius: 999px !important;

	color: #111111 !important;
	font-size: 16px !important;
	font-weight: 850 !important;
	line-height: 1 !important;
	white-space: nowrap !important;

	box-shadow: none !important;
	transform: none !important;

	transition:
		background-color 0.18s ease,
		color 0.18s ease !important;
}

.cfpo-app-nav a:hover {
	background: rgba(255, 255, 255, 0.18) !important;
	color: #ffffff !important;
	transform: none !important;
}

.cfpo-app-nav a.active {
	background: #064f3b !important;
	color: #ffffff !important;

	box-shadow:
		0 8px 20px rgba(6, 79, 59, 0.18) !important;
}


/*
|--------------------------------------------------------------------------
| 7. Stable archive content
|--------------------------------------------------------------------------
*/

.cfpo-home-style {
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

.cfpo-home-style .cfpo-library-container {
	width: min(1760px, calc(100% - 48px)) !important;
	max-width: 1760px !important;
	margin: 0 auto !important;
	padding: 44px 0 90px !important;
}

/*
|--------------------------------------------------------------------------
| 8. Stop book sections from shifting during image loading
|--------------------------------------------------------------------------
*/

.cfpo-continue-grid,
.cfpo-books-grid {
	align-items: stretch !important;
}

.cfpo-continue-card,
.cfpo-book-card {
	position: relative !important;
	transform: none;
	contain: layout paint;
}

.cfpo-continue-card:hover,
.cfpo-book-card:hover {
	transform: translateY(-3px);
}

/*
|--------------------------------------------------------------------------
| 9. Fixed Continue Reading cover dimensions
|--------------------------------------------------------------------------
*/

.cfpo-continue-grid {
	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
	gap: 16px !important;
}

.cfpo-continue-card {
	display: grid !important;
	grid-template-columns: 88px minmax(0, 1fr) !important;
	grid-template-rows: auto 8px auto !important;
	align-items: start !important;

	column-gap: 13px !important;
	row-gap: 8px !important;

	min-width: 0 !important;
	height: 150px !important;
	min-height: 150px !important;
	max-height: 150px !important;

	padding: 12px !important;

	overflow: hidden !important;

	background: #ffffff !important;
	border: 1px solid var(--cfpo-border) !important;
	border-radius: 16px !important;
}

.cfpo-continue-cover {
	grid-column: 1 !important;
	grid-row: 1 / 4 !important;

	display: block !important;

	width: 88px !important;
	min-width: 88px !important;
	max-width: 88px !important;

	height: 126px !important;
	min-height: 126px !important;
	max-height: 126px !important;

	margin: 0 !important;
	padding: 0 !important;

	aspect-ratio: auto !important;

	overflow: hidden !important;

	background: #f1efe9 !important;
	border-radius: 9px !important;
}

.cfpo-continue-cover img,
.cfpo-continue-cover .cfpo-book-cover-placeholder {
	display: block !important;

	width: 88px !important;
	min-width: 88px !important;
	max-width: 88px !important;

	height: 126px !important;
	min-height: 126px !important;
	max-height: 126px !important;

	margin: 0 !important;
	padding: 0 !important;

	object-fit: contain !important;
	object-position: center !important;

	background: #ffffff !important;
}

/*
|--------------------------------------------------------------------------
| 10. Stable text dimensions
|--------------------------------------------------------------------------
*/

.cfpo-continue-card h3 {
	grid-column: 2 !important;
	grid-row: 1 !important;

	display: -webkit-box !important;

	min-height: 57px !important;
	max-height: 57px !important;

	margin: 0 !important;
	overflow: hidden !important;

	font-size: 14px !important;
	line-height: 1.35 !important;

	-webkit-line-clamp: 3 !important;
	-webkit-box-orient: vertical !important;
}

.cfpo-mini-progress {
	grid-column: 2 !important;
	grid-row: 2 !important;

	width: 100% !important;
	height: 6px !important;
	min-height: 6px !important;
	max-height: 6px !important;

	margin: 0 !important;

	overflow: hidden !important;
	border-radius: 999px !important;
	background: #e8e6e1 !important;
}

.cfpo-continue-card small {
	grid-column: 2 !important;
	grid-row: 3 !important;

	display: block !important;

	min-height: 18px !important;
	margin: 0 !important;

	color: #064f3b !important;
	font-size: 11px !important;
	font-weight: 850 !important;
	line-height: 1.35 !important;
}

/*
|--------------------------------------------------------------------------
| 11. Stabilize all regular book-cover images
|--------------------------------------------------------------------------
*/

.cfpo-book-cover-link {
	display: block !important;

	width: 132px !important;
	min-width: 132px !important;
	max-width: 132px !important;

	height: 198px !important;
	min-height: 198px !important;
	max-height: 198px !important;

	aspect-ratio: auto !important;

	overflow: hidden !important;
	background: #f3f1ed !important;
}

.cfpo-book-cover-link img,
.cfpo-book-cover-img {
	display: block !important;

	width: 132px !important;
	min-width: 132px !important;
	max-width: 132px !important;

	height: 198px !important;
	min-height: 198px !important;
	max-height: 198px !important;

	object-fit: contain !important;
	object-position: center !important;

	background: #ffffff !important;
}

/*
|--------------------------------------------------------------------------
| 12. Prevent animations while the page is initially loading
|--------------------------------------------------------------------------
*/

html:not(.cfpo-page-ready) .cfpo-book-card,
html:not(.cfpo-page-ready) .cfpo-continue-card,
html:not(.cfpo-page-ready) .cfpo-book-cover-link,
html:not(.cfpo-page-ready) .cfpo-continue-cover {
	transition: none !important;
	animation: none !important;
	transform: none !important;
}

/*
|--------------------------------------------------------------------------
| Responsive header and cards
|--------------------------------------------------------------------------
*/

@media (max-width: 1180px) {

	.cfpo-app-header {
		padding-left: 28px !important;
		padding-right: 28px !important;
	}

	.cfpo-app-nav {
		gap: 6px !important;
	}

	.cfpo-app-nav a {
		padding-left: 13px !important;
		padding-right: 13px !important;
		font-size: 14px !important;
	}

	.cfpo-continue-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	}
}

@media (max-width: 850px) {

	.cfpo-app-header {
		flex-direction: column !important;
		align-items: flex-start !important;
		gap: 15px !important;

		min-height: 0 !important;
		padding: 15px 18px !important;
	}

	.cfpo-app-brand > a {
		width: 58px !important;
		height: 58px !important;
		flex-basis: 58px !important;
	}

	.cfpo-app-brand img {
		width: 50px !important;
		height: 50px !important;
		max-width: 50px !important;
		max-height: 50px !important;
	}

	.cfpo-app-brand h2 {
		font-size: 29px !important;
	}

	.cfpo-app-brand span {
		margin-top: 5px !important;
		font-size: 11px !important;
	}

	.cfpo-app-nav {
		justify-content: flex-start !important;

		width: 100% !important;
		max-width: 100% !important;

		gap: 5px !important;

		overflow-x: auto !important;
		overflow-y: hidden !important;
		flex-wrap: nowrap !important;

		scrollbar-width: none;
	}

	.cfpo-app-nav::-webkit-scrollbar {
		display: none;
	}

	.cfpo-app-nav a {
		flex: 0 0 auto !important;
		min-height: 39px !important;
		padding: 9px 12px !important;
		font-size: 12px !important;
	}

	.cfpo-home-style .cfpo-library-container {
		width: calc(100% - 24px) !important;
		padding-top: 26px !important;
	}

	.cfpo-continue-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}

@media (max-width: 540px) {

	.cfpo-continue-grid {
		grid-template-columns: 1fr !important;
		gap: 10px !important;
	}

	.cfpo-continue-card {
		grid-template-columns: 76px minmax(0, 1fr) !important;

		height: 126px !important;
		min-height: 126px !important;
		max-height: 126px !important;

		padding: 10px !important;
	}

	.cfpo-continue-cover,
	.cfpo-continue-cover img,
	.cfpo-continue-cover .cfpo-book-cover-placeholder {
		width: 76px !important;
		min-width: 76px !important;
		max-width: 76px !important;

		height: 106px !important;
		min-height: 106px !important;
		max-height: 106px !important;
	}

	.cfpo-continue-card h3 {
		min-height: 40px !important;
		max-height: 40px !important;

		font-size: 13px !important;

		-webkit-line-clamp: 2 !important;
	}

	.cfpo-books-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		gap: 9px !important;
	}

	.cfpo-book-card-main {
		display: block !important;
		padding: 9px !important;
	}

	.cfpo-book-cover-link,
	.cfpo-book-cover-link img,
	.cfpo-book-cover-img {
		width: 100% !important;
		min-width: 0 !important;
		max-width: none !important;

		height: 190px !important;
		min-height: 190px !important;
		max-height: 190px !important;
	}
}

/* Prevent initial Continue Reading flash and layout movement */

.cfpo-continue-section {
	min-height: 0;
}

html:not(.cfpo-library-layout-ready)
.cfpo-continue-section {
	pointer-events: none;
}

.cfpo-book-cover-link,
.cfpo-continue-cover {
	flex-shrink: 0;
}

.cfpo-book-cover-link img,
.cfpo-continue-cover img {
	display: block;
}

.cfpo-library-empty-state {
	grid-column: 1 / -1;
	padding: 50px 24px;
	background: #ffffff;
	border: 1px solid var(--cfpo-border);
	border-radius: 18px;
	text-align: center;
}

.cfpo-library-empty-state h3 {
	margin: 0 0 7px;
	font-size: 23px;
}

.cfpo-library-empty-state p {
	margin: 0;
	color: var(--cfpo-muted);
}

/* ==========================================================================
   FINAL CFPO ARCHIVE HEADER AND HERO FIX
   ========================================================================== */

html {
	margin: 0 !important;
	padding: 0 !important;
}

body.cfpo-standalone-library-page {
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	overflow-x: hidden !important;
	background: #f7f5f0 !important;
}

body.cfpo-standalone-library-page > .cfpo-library-page {
	margin: 0 !important;
	padding: 0 !important;
}

/* Remove unwanted space above the CFPO header */
.cfpo-standalone-library-page .cfpo-app-header {
	position: relative !important;
	top: 0 !important;
	left: 0 !important;

	display: block !important;

	width: 100% !important;
	max-width: none !important;
	min-height: 104px !important;

	margin: 0 !important;
	padding: 0 !important;

	background: #b77b28 !important;
	border: 0 !important;
	border-bottom: 1px solid rgba(64, 37, 10, 0.18) !important;

	box-shadow: none !important;
	transform: none !important;
}

/* Header inner alignment */
.cfpo-app-header-inner {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 32px !important;

	width: min(1700px, calc(100% - 64px)) !important;
	min-height: 104px !important;

	margin: 0 auto !important;
	padding: 14px 0 !important;
}

/* Brand */
.cfpo-app-brand {
	display: flex !important;
	align-items: center !important;
	gap: 16px !important;
	margin: 0 !important;
}

.cfpo-app-logo-link {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;

	width: 72px !important;
	height: 72px !important;
	flex: 0 0 72px !important;

	margin: 0 !important;
	padding: 5px !important;

	overflow: hidden !important;
	background: #ffffff !important;
	border-radius: 50% !important;
}

.cfpo-app-logo-link img,
.cfpo-app-brand img {
	display: block !important;

	width: 62px !important;
	height: 62px !important;
	max-width: 62px !important;
	max-height: 62px !important;

	margin: 0 !important;
	padding: 0 !important;

	object-fit: contain !important;
	object-position: center !important;

	background: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}

.cfpo-app-brand h2 {
	margin: 0 !important;
	color: #111111 !important;
	font-size: 40px !important;
	font-weight: 900 !important;
	line-height: 0.95 !important;
}

.cfpo-app-brand span {
	display: block !important;
	margin-top: 8px !important;

	color: #ffffff !important;
	font-size: 13px !important;
	font-weight: 900 !important;
	line-height: 1 !important;
	letter-spacing: 0.07em !important;
	text-transform: uppercase !important;
}

/* Navigation */
.cfpo-app-nav {
	display: flex !important;
	align-items: center !important;
	justify-content: flex-end !important;
	gap: 18px !important;
	flex-wrap: nowrap !important;

	margin: 0 !important;
	padding: 0 !important;
}

.cfpo-app-nav a {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;

	min-height: 48px !important;
	padding: 11px 20px !important;

	background: transparent !important;
	border: 0 !important;
	border-radius: 999px !important;

	color: #111111 !important;
	font-size: 16px !important;
	font-weight: 850 !important;
	line-height: 1 !important;
	white-space: nowrap !important;

	box-shadow: none !important;
	transform: none !important;
}

.cfpo-app-nav a:hover {
	background: rgba(255, 255, 255, 0.18) !important;
	color: #ffffff !important;
}

.cfpo-app-nav a.active {
	background: #064f3b !important;
	color: #ffffff !important;
}

/* Restore the banner */
.cfpo-standalone-library-page .cfpo-hero {
	display: flex !important;
	align-items: center !important;

	width: 100% !important;
	max-width: none !important;
	min-height: 420px !important;

	margin: 0 !important;
	padding: 80px 0 !important;

	overflow: hidden !important;

	background:
		linear-gradient(
			90deg,
			rgba(20, 14, 8, 0.93) 0%,
			rgba(20, 14, 8, 0.76) 46%,
			rgba(20, 14, 8, 0.36) 100%
		),
		radial-gradient(
			circle at 84% 38%,
			rgba(176, 120, 42, 0.5),
			transparent 32%
		),
		linear-gradient(
			135deg,
			#251a12,
			#4b2e19
		) !important;

	color: #ffffff !important;
}

.cfpo-hero-inner {
	width: min(1700px, calc(100% - 64px)) !important;
	margin: 0 auto !important;
}

.cfpo-hero-content {
	display: block !important;
	width: 100% !important;
	max-width: 760px !important;
}

.cfpo-hero h1 {
	margin: 0 0 18px !important;

	color: #ffffff !important;
	font-size: clamp(48px, 6vw, 86px) !important;
	font-weight: 900 !important;
	line-height: 0.98 !important;
	letter-spacing: -0.055em !important;
}

.cfpo-hero h1 span {
	color: #f2c15b !important;
}

.cfpo-hero p {
	max-width: 600px !important;
	margin: 0 !important;

	color: rgba(255, 255, 255, 0.9) !important;
	font-size: 20px !important;
	line-height: 1.65 !important;
}

/* Library content */
.cfpo-home-style .cfpo-library-container {
	width: min(1700px, calc(100% - 64px)) !important;
	max-width: 1700px !important;

	margin: 0 auto !important;
	padding: 48px 0 90px !important;
}

@media (max-width: 850px) {

	.cfpo-app-header-inner {
		flex-direction: column !important;
		align-items: flex-start !important;
		gap: 13px !important;

		width: calc(100% - 28px) !important;
		padding: 14px 0 !important;
	}

	.cfpo-app-nav {
		justify-content: flex-start !important;

		width: 100% !important;

		overflow-x: auto !important;
		flex-wrap: nowrap !important;
		gap: 5px !important;
	}

	.cfpo-app-nav a {
		flex: 0 0 auto !important;
		min-height: 39px !important;
		padding: 9px 12px !important;
		font-size: 12px !important;
	}

	.cfpo-standalone-library-page .cfpo-hero {
		min-height: 340px !important;
		padding: 60px 0 !important;
	}

	.cfpo-hero-inner {
		width: calc(100% - 36px) !important;
	}

	.cfpo-hero h1 {
		font-size: clamp(42px, 13vw, 64px) !important;
	}

	.cfpo-hero p {
		font-size: 16px !important;
	}

	.cfpo-home-style .cfpo-library-container {
		width: calc(100% - 24px) !important;
		padding-top: 30px !important;
	}
}
/* ==========================================================================
   CFPO ARCHIVE — DEFINITIVE HEADER AND HERO RULES
   ========================================================================== */

html,
body.cfpo-standalone-library-page {
	margin: 0 !important;
	padding: 0 !important;
}

body.cfpo-standalone-library-page {
	width: 100%;
	overflow-x: hidden;
	background: #f7f5f0;
}

body.cfpo-standalone-library-page .cfpo-library-page {
	width: 100%;
	max-width: none;
	margin: 0;
	padding: 0;
}

body.cfpo-standalone-library-page .cfpo-app-header {
	position: relative !important;
	inset: auto !important;

	display: block !important;

	width: 100% !important;
	max-width: none !important;
	min-height: 104px !important;

	margin: 0 !important;
	padding: 0 !important;

	background: #b77b28 !important;
	border: 0 !important;
	border-bottom: 1px solid rgba(64, 37, 10, 0.18) !important;

	box-shadow: none !important;
	transform: none !important;
}

.cfpo-app-header-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 32px;

	width: min(1700px, calc(100% - 64px));
	min-height: 104px;

	margin: 0 auto;
	padding: 14px 0;
}

.cfpo-app-brand {
	display: flex !important;
	align-items: center !important;
	gap: 16px !important;
	margin: 0 !important;
}

.cfpo-app-logo-link {
	display: flex;
	align-items: center;
	justify-content: center;

	width: 72px;
	height: 72px;
	flex: 0 0 72px;

	padding: 5px;

	overflow: hidden;
	background: #ffffff;
	border-radius: 50%;
}

.cfpo-app-logo-link img,
.cfpo-app-brand img {
	display: block !important;

	width: 62px !important;
	height: 62px !important;
	max-width: 62px !important;
	max-height: 62px !important;

	margin: 0 !important;
	padding: 0 !important;

	object-fit: contain !important;
	object-position: center !important;

	background: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}

.cfpo-app-brand h2 {
	margin: 0 !important;
	color: #111111 !important;
	font-size: 40px !important;
	font-weight: 900 !important;
	line-height: 0.95 !important;
}

.cfpo-app-brand span {
	display: block !important;
	margin-top: 8px !important;

	color: #ffffff !important;
	font-size: 13px !important;
	font-weight: 900 !important;
	line-height: 1 !important;
	letter-spacing: 0.07em !important;
	text-transform: uppercase !important;
}

.cfpo-app-nav {
	display: flex !important;
	align-items: center !important;
	justify-content: flex-end !important;
	gap: 18px !important;
	flex-wrap: nowrap !important;

	margin: 0 !important;
	padding: 0 !important;
}

.cfpo-app-nav a {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;

	min-height: 48px !important;
	padding: 11px 20px !important;

	background: transparent !important;
	border: 0 !important;
	border-radius: 999px !important;

	color: #111111 !important;
	font-size: 16px !important;
	font-weight: 850 !important;
	line-height: 1 !important;
	white-space: nowrap !important;
}

.cfpo-app-nav a:hover {
	background: rgba(255, 255, 255, 0.18) !important;
	color: #ffffff !important;
}

.cfpo-app-nav a.active {
	background: #064f3b !important;
	color: #ffffff !important;
}

/* Restore and display the banner. */
body.cfpo-standalone-library-page .cfpo-hero {
	display: flex !important;
	align-items: center !important;

	width: 100% !important;
	max-width: none !important;
	min-height: 420px !important;
	height: auto !important;

	margin: 0 !important;
	padding: 80px 0 !important;

	overflow: hidden !important;

	background:
		linear-gradient(
			90deg,
			rgba(20, 14, 8, 0.93),
			rgba(20, 14, 8, 0.74),
			rgba(20, 14, 8, 0.28)
		),
		radial-gradient(
			circle at 84% 38%,
			rgba(176, 120, 42, 0.52),
			transparent 32%
		),
		linear-gradient(
			135deg,
			#251a12,
			#4b2e19
		) !important;
}

.cfpo-hero-inner {
	width: min(1700px, calc(100% - 64px));
	margin: 0 auto;
}

.cfpo-hero-content {
	display: block !important;
	width: 100% !important;
	max-width: 760px !important;
}

.cfpo-hero h1 {
	margin: 0 0 18px !important;
	color: #ffffff !important;
	font-size: clamp(48px, 6vw, 86px) !important;
	font-weight: 900 !important;
	line-height: 0.98 !important;
}

.cfpo-hero h1 span {
	color: #f2c15b !important;
}

.cfpo-hero p {
	max-width: 600px !important;
	margin: 0 !important;
	color: rgba(255, 255, 255, 0.9) !important;
	font-size: 20px !important;
	line-height: 1.65 !important;
}

body.cfpo-standalone-library-page .cfpo-library-container {
	width: min(1700px, calc(100% - 64px)) !important;
	max-width: 1700px !important;
	margin: 0 auto !important;
	padding: 48px 0 90px !important;
}

@media (max-width: 850px) {
	.cfpo-app-header-inner {
		flex-direction: column;
		align-items: flex-start;
		gap: 13px;

		width: calc(100% - 28px);
		padding: 14px 0;
	}

	.cfpo-app-nav {
		justify-content: flex-start !important;
		width: 100% !important;
		overflow-x: auto !important;
		gap: 5px !important;
	}

	.cfpo-app-nav a {
		flex: 0 0 auto !important;
		min-height: 39px !important;
		padding: 9px 12px !important;
		font-size: 12px !important;
	}

	body.cfpo-standalone-library-page .cfpo-hero {
		min-height: 340px !important;
		padding: 60px 0 !important;
	}

	.cfpo-hero-inner {
		width: calc(100% - 36px);
	}

	body.cfpo-standalone-library-page .cfpo-library-container {
		width: calc(100% - 24px) !important;
		padding-top: 30px !important;
	}
}/* =====================================================
   CFPO CUSTOM FOOTER — FINAL
===================================================== */

.cfpo-footer {
	position: relative;
	z-index: 30;

	width: 100%;
	margin: 0;
	padding: 0;

	background:
		linear-gradient(
			135deg,
			#16120e 0%,
			#25180f 55%,
			#3a2415 100%
		);

	border-top: 4px solid #b0782a;
	color: #ffffff;
}

.cfpo-footer-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 40px;

	width: min(1700px, calc(100% - 64px));
	margin: 0 auto;
	padding: 32px 0;
}

.cfpo-footer-brand {
	display: flex;
	align-items: center;
	gap: 16px;
	min-width: 0;
}

.cfpo-footer-logo {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 58px;

	width: 58px;
	height: 58px;
	padding: 5px;

	overflow: hidden;
	background: #ffffff;
	border-radius: 50%;
}

.cfpo-footer-logo img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.cfpo-footer-brand strong {
	display: block;
	margin-bottom: 5px;

	color: #ffffff;
	font-size: 18px;
	font-weight: 900;
	line-height: 1.2;
}

.cfpo-footer-brand p {
	margin: 0;
	color: rgba(255, 255, 255, 0.72);
	font-size: 13px;
	line-height: 1.5;
}

.cfpo-footer-links {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 10px;
	flex-wrap: wrap;
}

.cfpo-footer-links a {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	min-height: 40px;
	padding: 9px 14px;

	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 999px;

	color: #ffffff;
	font-size: 13px;
	font-weight: 800;
	text-decoration: none;

	transition:
		background-color 0.2s ease,
		border-color 0.2s ease,
		color 0.2s ease;
}

.cfpo-footer-links a:hover {
	background: #b0782a;
	border-color: #b0782a;
	color: #ffffff;
}

.cfpo-footer-bottom {
	width: 100%;
	padding: 15px 24px;

	background: rgba(0, 0, 0, 0.22);
	border-top: 1px solid rgba(255, 255, 255, 0.08);

	color: rgba(255, 255, 255, 0.62);
	font-size: 12px;
	text-align: center;
}

@media (max-width: 760px) {

	.cfpo-footer-inner {
		flex-direction: column;
		align-items: center;

		width: calc(100% - 36px);
		padding: 28px 0;

		text-align: center;
	}

	.cfpo-footer-brand {
		flex-direction: column;
	}

	.cfpo-footer-links {
		justify-content: center;
	}
}
/* =====================================================
   CFPO ALL BOOKS FILTER — FINAL
===================================================== */

.cfpo-books-wrap {
	display: block !important;
	width: 100% !important;
	margin-top: 10px !important;
}

.cfpo-books-wrap .cfpo-section-heading {
	display: flex !important;
	width: 100% !important;
	margin-bottom: 22px !important;
}

.cfpo-books-wrap .cfpo-filter-row {
	display: grid !important;
	grid-template-columns:
		minmax(280px, 1fr)
		minmax(190px, 250px)
		minmax(190px, 250px) !important;
	align-items: center !important;
	gap: 14px !important;

	width: 100% !important;
	margin: 0 0 32px !important;
	padding: 0 !important;
}

.cfpo-filter-search {
	position: relative !important;
	display: block !important;
	width: 100% !important;
	min-width: 0 !important;
}

.cfpo-filter-icon {
	position: absolute !important;
	top: 50% !important;
	left: 18px !important;
	z-index: 2 !important;

	display: block !important;
	transform: translateY(-50%) !important;

	color: #8a7967 !important;
	font-size: 21px !important;
	line-height: 1 !important;
	pointer-events: none !important;
}

.cfpo-filter-search .cfpo-book-search,
.cfpo-books-wrap .cfpo-category-filter,
.cfpo-books-wrap .cfpo-sort-filter {
	display: block !important;
	width: 100% !important;
	height: 56px !important;
	min-height: 56px !important;

	margin: 0 !important;
	border: 1px solid #dfd9d0 !important;
	border-radius: 14px !important;

	background-color: #ffffff !important;
	color: #24180f !important;

	font-size: 15px !important;
	line-height: 1 !important;

	box-shadow: 0 10px 26px rgba(75, 46, 25, 0.06) !important;
	outline: none !important;
}

.cfpo-filter-search .cfpo-book-search {
	padding: 0 18px 0 50px !important;
}

.cfpo-books-wrap .cfpo-category-filter,
.cfpo-books-wrap .cfpo-sort-filter {
	padding: 0 46px 0 18px !important;
	font-weight: 700 !important;
	cursor: pointer !important;
}

.cfpo-filter-search .cfpo-book-search:focus,
.cfpo-books-wrap .cfpo-category-filter:focus,
.cfpo-books-wrap .cfpo-sort-filter:focus {
	border-color: #b0782a !important;
	box-shadow: 0 0 0 4px rgba(176, 120, 42, 0.12) !important;
}

.cfpo-books-wrap .cfpo-books-grid {
	display: grid !important;
	width: 100% !important;
}

@media (max-width: 900px) {

	.cfpo-books-wrap .cfpo-filter-row {
		grid-template-columns: 1fr 1fr !important;
	}

	.cfpo-filter-search {
		grid-column: 1 / -1 !important;
	}
}

@media (max-width: 600px) {

	.cfpo-books-wrap .cfpo-filter-row {
		grid-template-columns: 1fr !important;
		gap: 10px !important;
	}

	.cfpo-filter-search,
	.cfpo-books-wrap .cfpo-category-filter,
	.cfpo-books-wrap .cfpo-sort-filter {
		grid-column: 1 !important;
	}
}
/* =====================================================
   FINAL CONTINUE READING CLICK FIX
===================================================== */

.cfpo-continue-section,
.cfpo-continue-grid {
	position: relative !important;
	z-index: 20 !important;
	pointer-events: auto !important;
}

.cfpo-continue-card {
	position: relative !important;
	z-index: 21 !important;

	display: grid !important;

	pointer-events: auto !important;
	cursor: pointer !important;
	text-decoration: none !important;
}

.cfpo-continue-card > * {
	pointer-events: none !important;
}

.cfpo-continue-card::before,
.cfpo-continue-card::after {
	pointer-events: none !important;
}

/* ==========================================================================
   CFPO MODERN SIMPLIFIED DESIGN OVERRIDES
   Paste this entire section at the END of library.css
   ========================================================================== */


/* ==========================================================================
   1. CLEANER DESIGN VARIABLES
   ========================================================================== */

.cfpo-library-page {
	--cfpo-green: #075844;
	--cfpo-green-dark: #043f31;
	--cfpo-green-soft: #edf7f3;

	--cfpo-gold: #b77a24;
	--cfpo-gold-dark: #8a5817;
	--cfpo-gold-light: #ecd3a3;
	--cfpo-gold-soft: #fff8eb;

	--cfpo-page: #f7f7f5;
	--cfpo-card: #ffffff;
	--cfpo-reader-bg: #e9ecef;

	--cfpo-text: #171717;
	--cfpo-text-soft: #414141;
	--cfpo-muted: #707070;

	--cfpo-border: #e9e8e4;
	--cfpo-border-dark: #dcd9d2;

	--cfpo-radius-sm: 8px;
	--cfpo-radius-md: 12px;
	--cfpo-radius-lg: 18px;
	--cfpo-radius-xl: 22px;

	--cfpo-shadow-sm:
		0 4px 18px rgba(23, 23, 23, 0.045);

	--cfpo-shadow-md:
		0 12px 38px rgba(23, 23, 23, 0.075);

	--cfpo-shadow-lg:
		0 24px 70px rgba(23, 23, 23, 0.11);

	--cfpo-content-width: 1720px;
	--cfpo-page-padding: clamp(18px, 3vw, 48px);

	background:
		linear-gradient(
			180deg,
			#f9f8f5 0%,
			#f5f5f2 100%
		);
}


/* ==========================================================================
   2. CLEANER, SMALLER HEADER
   ========================================================================== */

.cfpo-app-header {
	position: sticky;
	top: 0;
	z-index: 1000;

	width: 100vw;
	min-height: 76px;

	margin: 0;
	margin-left: calc(50% - 50vw);

	padding:
		10px
		max(
			var(--cfpo-page-padding),
			calc((100vw - var(--cfpo-content-width)) / 2)
		);

	background: rgba(181, 119, 35, 0.97);

	border-bottom:
		1px solid rgba(75, 46, 25, 0.14);

	box-shadow:
		0 6px 24px rgba(65, 41, 15, 0.09);

	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
}

.admin-bar .cfpo-app-header {
	top: 32px;
}

.cfpo-app-header-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 28px;

	width: 100%;
	max-width: var(--cfpo-content-width);
	margin: 0 auto;
}

.cfpo-app-brand {
	gap: 12px;
}

.cfpo-app-brand img {
	width: 54px;
	height: 54px;
	padding: 4px;

	border-radius: 50%;

	box-shadow:
		0 5px 18px rgba(50, 29, 7, 0.14);
}

.cfpo-app-brand h2 {
	font-size: 29px;
	line-height: 1;
	letter-spacing: -0.035em;
}

.cfpo-app-brand span {
	margin-top: 4px;

	font-size: 10px;
	letter-spacing: 0.11em;
}

.cfpo-app-nav {
	gap: 4px;
}

.cfpo-app-nav a {
	min-height: 40px;
	padding: 9px 15px;

	border-radius: 10px;

	font-size: 13px;
	font-weight: 800;
}

.cfpo-app-nav a:hover {
	transform: none;

	background: rgba(255, 255, 255, 0.2);
	border-color: transparent;
}

.cfpo-app-nav a.active {
	background: var(--cfpo-green);

	box-shadow:
		0 5px 16px rgba(4, 61, 46, 0.17);
}


/* ==========================================================================
   3. SIMPLER ARCHIVE HERO
   ========================================================================== */

.cfpo-hero {
	min-height: 340px;

	padding:
		66px
		max(
			var(--cfpo-page-padding),
			calc((100vw - var(--cfpo-content-width)) / 2)
		);

	background:
		linear-gradient(
			90deg,
			rgba(20, 14, 9, 0.96) 0%,
			rgba(28, 19, 12, 0.82) 52%,
			rgba(50, 31, 15, 0.5) 100%
		),
		radial-gradient(
			circle at 85% 45%,
			rgba(183, 122, 36, 0.42),
			transparent 31%
		),
		#21170f;
}

.cfpo-hero-inner {
	width: 100%;
	max-width: var(--cfpo-content-width);
	margin: 0 auto;
}

.cfpo-hero-content {
	max-width: 690px;
}

.cfpo-hero h1 {
	margin-bottom: 17px;

	font-size: clamp(43px, 5vw, 72px);
	line-height: 1;
	letter-spacing: -0.05em;
}

.cfpo-hero p {
	max-width: 560px;

	font-size: clamp(16px, 1.5vw, 19px);
	line-height: 1.6;
}


/* ==========================================================================
   4. PAGE SPACING
   ========================================================================== */

.cfpo-library-container,
.cfpo-home-style .cfpo-library-container {
	padding-top: 34px;
	padding-bottom: 70px;
}

.cfpo-single-book {
	max-width: 1680px;
}


/* ==========================================================================
   5. COMPACT SINGLE-BOOK TOOLBAR
   ========================================================================== */

.cfpo-book-toolbar {
	margin-bottom: 18px;
}

.cfpo-back-link {
	min-height: 40px;
	padding: 8px 14px;

	border: 0;
	border-radius: 10px;

	color: var(--cfpo-text);

	box-shadow: var(--cfpo-shadow-sm);
}

.cfpo-back-link:hover {
	transform: none;

	background: var(--cfpo-green);
	color: #ffffff;
}

.cfpo-book-toolbar-right {
	gap: 7px;
}

.cfpo-book-toolbar .cfpo-book-chip,
.cfpo-book-toolbar .cfpo-format-badge,
.cfpo-reading-time {
	min-height: 29px;
	padding: 6px 10px;

	border: 0;
	border-radius: 8px;

	font-size: 10px;
}


/* ==========================================================================
   6. CLEANER SINGLE BOOK HERO
   ========================================================================== */

.cfpo-single-hero {
	grid-template-columns:
		minmax(190px, 250px)
		minmax(0, 1fr);

	align-items: center;

	gap: clamp(28px, 4vw, 52px);

	margin-bottom: 18px;
	padding: clamp(24px, 3.3vw, 44px);

	border: 0;
	border-radius: 20px;

	box-shadow:
		0 8px 34px rgba(20, 20, 20, 0.06);
}

.cfpo-single-hero::before {
	width: 4px;
}

.cfpo-single-cover {
	max-width: 250px;
}

.cfpo-single-cover img,
.cfpo-single-cover-image {
	max-height: 390px;

	border-radius: 10px;

	box-shadow:
		0 18px 42px rgba(20, 20, 20, 0.16);
}

.cfpo-single-cover .cfpo-book-cover-placeholder {
	min-height: 360px;
	border-radius: 10px;
}

.cfpo-single-info .cfpo-book-chip {
	margin-bottom: 14px;

	padding: 6px 10px;

	border-radius: 8px;

	font-size: 10px;
}

.cfpo-single-info h1 {
	max-width: 980px;

	margin-bottom: 12px;

	font-size: clamp(36px, 4.2vw, 64px);
	line-height: 1.02;
	letter-spacing: -0.05em;
}

.cfpo-single-info h2 {
	max-width: 880px;

	margin-bottom: 16px;

	font-size: clamp(17px, 1.8vw, 22px);
	line-height: 1.4;
}

.cfpo-single-meta {
	grid-template-columns:
		repeat(2, minmax(0, 1fr));

	gap: 0 28px;

	margin: 18px 0;
}

.cfpo-single-meta span {
	padding: 9px 0;

	border-bottom: 1px solid #efeee9;

	font-size: 13px;
}

.cfpo-reader-tools {
	gap: 7px;
}

.cfpo-reader-tools button {
	min-height: 39px;
	padding: 8px 13px;

	border-radius: 9px;

	font-size: 12px;
}

.cfpo-reader-tools button:hover {
	transform: none;
}


/* ==========================================================================
   7. SIMPLER DETAIL CARDS
   ========================================================================== */

.cfpo-single-hero,
.cfpo-details-panel {
	border: 0;
}

.cfpo-details-panel {
	margin-bottom: 18px;
	padding: clamp(22px, 2.7vw, 34px);

	border-radius: 18px;

	box-shadow:
		0 7px 28px rgba(20, 20, 20, 0.05);
}

.cfpo-details-panel h2 {
	font-size: clamp(23px, 2.3vw, 31px);
}


/* ==========================================================================
   8. MODERN COMPACT READING PROGRESS
   ========================================================================== */

.cfpo-progress-panel {
	position: relative;

	padding: 25px 28px;
}

.cfpo-progress-card-heading {
	align-items: center;

	margin-bottom: 18px;
}

.cfpo-progress-card-heading h2 {
	margin-bottom: 3px;

	font-size: 25px;
}

.cfpo-progress-card-heading p {
	font-size: 13px;
}

.cfpo-progress-format {
	padding: 6px 10px;

	border-radius: 8px;

	font-size: 10px;
}

.cfpo-progress-form {
	grid-template-columns:
		minmax(220px, 1fr)
		auto
		auto;

	gap: 9px;

	margin-bottom: 16px;
}

#cfpo-reader-email {
	height: 48px;
	padding: 0 15px;

	border-radius: 10px;

	font-size: 14px;
}

#cfpo-save-progress,
#cfpo-continue-reading {
	min-height: 48px;
	padding-left: 18px;
	padding-right: 18px;

	border-radius: 10px;
}

.cfpo-progress-shell {
	height: 7px;

	margin: 3px 0 10px;
}

.cfpo-progress-text {
	font-size: 13px !important;
}

.cfpo-progress-message {
	min-height: 18px;

	margin-top: 5px !important;

	font-size: 12px !important;
}


/* ==========================================================================
   9. MINIMAL TABS
   ========================================================================== */

.cfpo-tab-buttons {
	gap: 3px;

	margin-bottom: 14px;
	padding: 0 2px;

	background: transparent;
	border: 0;
	border-bottom: 1px solid var(--cfpo-border);
	border-radius: 0;

	box-shadow: none;
}

.cfpo-tab-btn {
	position: relative;

	min-height: 46px;
	padding: 11px 14px;

	background: transparent;
	border: 0;
	border-radius: 0;

	color: var(--cfpo-muted);

	font-size: 12px;
}

.cfpo-tab-btn::after {
	content: "";

	position: absolute;
	right: 12px;
	bottom: -1px;
	left: 12px;

	height: 2px;

	background: transparent;
	border-radius: 999px;
}

.cfpo-tab-btn:hover {
	background: transparent;
	color: var(--cfpo-green);
}

.cfpo-tab-btn.active,
.cfpo-tab-btn[aria-selected="true"] {
	background: transparent;
	border: 0;
	color: var(--cfpo-green);

	box-shadow: none;
}

.cfpo-tab-btn.active::after,
.cfpo-tab-btn[aria-selected="true"]::after {
	background: var(--cfpo-green);
}


/* ==========================================================================
   10. CLEANER READER HEADING
   ========================================================================== */

.cfpo-reader-section {
	padding: 16px;
}

.cfpo-reader-heading {
	align-items: center;

	margin-bottom: 15px;
	padding: 4px 4px 15px;
}

.cfpo-reader-heading h2 {
	margin-bottom: 4px;

	font-size: 25px;
}

.cfpo-reader-heading p {
	font-size: 13px;
}

.cfpo-reader-actions {
	gap: 7px;
}

.cfpo-reader-actions .cfpo-btn {
	min-height: 39px;
	padding: 8px 13px;

	border-radius: 9px;

	font-size: 11px;
}


/* ==========================================================================
   11. CLEANER PDF READER
   ========================================================================== */

#cfpo-tab-reader .cfpo-reader-layout {
	grid-template-columns:
		175px
		minmax(0, 1fr);

	gap: 10px;

	margin-top: 12px;
}

#cfpo-tab-reader .cfpo-reader-sidebar {
	width: 175px;
	min-width: 175px;

	height: min(86vh, 920px);
	min-height: 660px;

	padding: 11px;

	border: 0;
	border-radius: 14px;

	box-shadow:
		0 4px 20px rgba(20, 20, 20, 0.05);
}

#cfpo-tab-reader .cfpo-reader-sidebar h3 {
	top: -11px;

	margin: -11px -11px 10px;
	padding: 13px 12px 11px;

	font-size: 14px;
}

.cfpo-page-thumb {
	margin-bottom: 9px;
	padding: 6px;

	border-width: 1px;
	border-radius: 9px;
}

.cfpo-page-thumb:hover {
	transform: none;
}

.cfpo-thumbnail-preview {
	min-height: 125px;

	border-radius: 6px;
}

.cfpo-page-number {
	margin-top: 6px;

	font-size: 10px;
}

#cfpo-tab-reader .cfpo-reader-panel {
	border: 0;
	border-radius: 14px;

	box-shadow:
		0 4px 20px rgba(20, 20, 20, 0.05);
}

#cfpo-pdf-reader {
	height: min(86vh, 920px);
	min-height: 660px;

	border-radius: 14px;
}

#cfpo-pdf-reader .cfpo-pdf-toolbar {
	min-height: 56px;
	padding: 8px 12px;

	border-bottom: 1px solid #e7e6e2;
}

#cfpo-pdf-reader .cfpo-toolbar-left,
#cfpo-pdf-reader .cfpo-toolbar-right {
	gap: 5px;
}

#cfpo-pdf-reader .cfpo-pdf-toolbar button,
#cfpo-pdf-pages-toggle,
#cfpo-pdf-fullscreen {
	min-width: 36px;
	min-height: 36px;
	padding: 7px 10px;

	border-radius: 8px;

	font-size: 11px;
}

#cfpo-pdf-reader .cfpo-pdf-toolbar button:hover {
	transform: none;
}

#cfpo-pdf-reader .cfpo-page-counter,
#cfpo-pdf-reader .cfpo-zoom-label {
	font-size: 11px;
}

#cfpo-pdf-reader .cfpo-pdf-stage {
	padding: 13px;

	background: #e9ecef;
}

#cfpo-pdf-reader #cfpo-pdf-canvas {
	border-radius: 2px;

	box-shadow:
		0 16px 42px rgba(18, 18, 18, 0.17);
}

#cfpo-pdf-reader .cfpo-reader-footer {
	min-height: 48px;
	padding: 9px 13px;
}

#cfpo-pdf-reader .cfpo-progress-track {
	height: 5px;
}


/* ==========================================================================
   12. CLEANER EPUB READER
   ========================================================================== */

.cfpo-epub-reader {
	height: min(84vh, 900px);
	min-height: 650px;

	border: 0;
	border-radius: 14px;

	box-shadow:
		0 5px 22px rgba(20, 20, 20, 0.06);
}

.cfpo-epub-toolbar {
	min-height: 58px;
	padding: 8px 12px;
}

.cfpo-epub-toolbar button {
	min-width: 36px;
	min-height: 36px;
	padding: 7px 10px;

	border-radius: 8px;

	font-size: 11px;
}

.cfpo-epub-toolbar button:hover {
	transform: none;
}

.cfpo-epub-footer {
	min-height: 48px;
	padding: 9px 13px;
}


/* ==========================================================================
   13. SIMPLER BOOK CARDS
   ========================================================================== */

.cfpo-book-card {
	border: 0;
	border-radius: 17px;

	box-shadow:
		0 5px 24px rgba(20, 20, 20, 0.055);
}

.cfpo-book-card:hover {
	transform: translateY(-3px);

	box-shadow:
		0 11px 34px rgba(20, 20, 20, 0.09);
}

.cfpo-book-card-main {
	grid-template-columns:
		118px
		minmax(0, 1fr);

	gap: 15px;
	padding: 16px;
}

.cfpo-book-cover-link {
	width: 118px;
	min-width: 118px;

	border-radius: 9px;

	box-shadow:
		0 9px 26px rgba(20, 20, 20, 0.12);
}

.cfpo-book-card-info h3 {
	font-size: 17px;
}

.cfpo-book-card-actions {
	padding: 12px 16px 15px;
}


/* ==========================================================================
   14. SIMPLER CONTINUE READING CARDS
   ========================================================================== */

.cfpo-continue-grid {
	gap: 12px;
}

.cfpo-continue-card {
	grid-template-columns:
		76px
		minmax(0, 1fr);

	column-gap: 12px;

	min-height: 138px;
	padding: 11px;

	border: 0;
	border-radius: 14px;

	box-shadow:
		0 5px 22px rgba(20, 20, 20, 0.05);
}

.cfpo-continue-card:hover {
	transform: translateY(-2px);

	box-shadow:
		0 10px 30px rgba(20, 20, 20, 0.08);
}

.cfpo-continue-cover {
	width: 76px;
	height: 114px;

	border-radius: 7px;
}

.cfpo-continue-card h3 {
	font-size: 13px;
}

.cfpo-mini-progress {
	height: 5px;
}

.cfpo-continue-card small {
	font-size: 10px;
}


/* ==========================================================================
   15. SIMPLER CATEGORY CARDS
   ========================================================================== */

.cfpo-category-card {
	min-height: 125px;
	padding: 18px 14px;

	border: 0;
	border-radius: 16px;

	box-shadow:
		0 5px 22px rgba(20, 20, 20, 0.05);
}

.cfpo-category-card:hover {
	transform: translateY(-2px);
}

.cfpo-category-card span {
	width: 44px;
	height: 44px;

	border-radius: 12px;

	font-size: 19px;
}


/* ==========================================================================
   16. DARK MODE CLEANUP
   ========================================================================== */

.cfpo-library-page.cfpo-dark-mode {
	background: #151613;
}

.cfpo-library-page.cfpo-dark-mode .cfpo-tab-buttons {
	background: transparent;
	border-bottom-color: var(--cfpo-border);
}

.cfpo-library-page.cfpo-dark-mode .cfpo-tab-btn.active,
.cfpo-library-page.cfpo-dark-mode
	.cfpo-tab-btn[aria-selected="true"] {
	background: transparent;
	color: #7fd1b5;
}


/* ==========================================================================
   17. TABLET
   ========================================================================== */

@media (max-width: 991px) {

	.cfpo-app-header-inner {
		flex-direction: column;
		align-items: stretch;
		gap: 9px;
	}

	.cfpo-app-header {
		position: relative;
		top: auto;

		min-height: 0;
		padding-top: 10px;
		padding-bottom: 10px;
	}

	.cfpo-single-hero {
		grid-template-columns:
			190px
			minmax(0, 1fr);

		gap: 25px;
		padding: 24px;
	}

	.cfpo-single-cover {
		max-width: 190px;
	}

	.cfpo-single-info h1 {
		font-size: clamp(33px, 5.5vw, 52px);
	}

	.cfpo-progress-form {
		grid-template-columns:
			minmax(220px, 1fr)
			auto;

	}

	#cfpo-continue-reading {
		grid-column: 2;
	}

	#cfpo-tab-reader .cfpo-reader-layout {
		display: block;
	}

	#cfpo-tab-reader .cfpo-reader-sidebar {
		display: none;
	}
}


/* ==========================================================================
   18. MOBILE
   ========================================================================== */

@media (max-width: 760px) {

	.cfpo-library-container,
	.cfpo-home-style .cfpo-library-container {
		width: calc(100% - 20px);
		padding-top: 18px;
		padding-bottom: 55px;
	}

	.cfpo-app-header {
		padding: 9px 12px;
	}

	.cfpo-app-header-inner {
		gap: 8px;
	}

	.cfpo-app-brand img {
		width: 45px;
		height: 45px;
	}

	.cfpo-app-brand h2 {
		font-size: 24px;
	}

	.cfpo-app-nav {
		gap: 3px;
	}

	.cfpo-app-nav a {
		min-height: 35px;
		padding: 7px 10px;

		font-size: 11px;
	}

	.cfpo-hero {
		min-height: 290px;
		padding: 48px 17px 58px;
	}

	.cfpo-hero h1 {
		font-size: clamp(39px, 13vw, 56px);
	}

	.cfpo-book-toolbar {
		gap: 9px;
	}

	.cfpo-back-link {
		min-height: 37px;
		padding: 7px 12px;

		font-size: 12px;
	}

	.cfpo-single-hero {
		grid-template-columns: 1fr;

		gap: 20px;
		padding: 18px;

		border-radius: 16px;
	}

	.cfpo-single-cover {
		max-width: 190px;
	}

	.cfpo-single-cover img,
	.cfpo-single-cover-image {
		max-height: 300px;
	}

	.cfpo-single-info h1 {
		font-size: clamp(31px, 10vw, 42px);
	}

	.cfpo-single-meta {
		grid-template-columns: 1fr;
	}

	.cfpo-reader-tools {
		display: flex;
		flex-wrap: wrap;
	}

	.cfpo-reader-tools button {
		width: auto;
		flex: 1 1 auto;
	}

	.cfpo-details-panel {
		padding: 18px;

		border-radius: 15px;
	}

	.cfpo-progress-panel {
		padding: 19px;
	}

	.cfpo-progress-card-heading {
		align-items: flex-start;
		flex-direction: column;

		gap: 7px;
	}

	.cfpo-progress-form {
		grid-template-columns: 1fr;
	}

	#cfpo-save-progress,
	#cfpo-continue-reading {
		grid-column: auto;

		width: 100%;
		min-height: 45px;
	}

	.cfpo-tab-buttons {
		gap: 0;
	}

	.cfpo-tab-btn {
		min-height: 42px;
		padding: 9px 11px;

		font-size: 10px;
	}

	.cfpo-reader-section {
		padding: 5px;
	}

	.cfpo-reader-heading {
		align-items: flex-start;
		flex-direction: column;

		padding: 10px 8px 13px;
	}

	.cfpo-reader-actions {
		display: flex;
		width: 100%;
	}

	.cfpo-reader-actions .cfpo-btn {
		flex: 1 1 auto;
	}

	#cfpo-pdf-reader {
		height: 76dvh;
		min-height: 520px;

		border-radius: 10px;
	}

	#cfpo-pdf-reader .cfpo-pdf-toolbar {
		display: grid;
		grid-template-columns: 1fr;

		gap: 6px;
		padding: 7px;
	}

	#cfpo-pdf-reader .cfpo-toolbar-left,
	#cfpo-pdf-reader .cfpo-toolbar-right {
		justify-content: center;
	}

	#cfpo-pdf-reader .cfpo-pdf-stage {
		padding: 5px;
	}

	.cfpo-continue-card {
		grid-template-columns: 1fr;

		min-height: auto;
	}

	.cfpo-continue-cover {
		grid-column: 1;
		grid-row: 1;

		width: 100%;
		height: auto;
		aspect-ratio: 2 / 3;
	}

	.cfpo-continue-card h3,
	.cfpo-mini-progress,
	.cfpo-continue-card small {
		grid-column: 1;
	}

	.cfpo-continue-card h3 {
		grid-row: 2;
	}

	.cfpo-mini-progress {
		grid-row: 3;
	}

	.cfpo-continue-card small {
		grid-row: 4;
	}
}