/* ============================================================
   COMPONENTS.CSS — Reusable UI Components
   Buttons, Cards, Badges, Archive Hero, Portal Panels,
   Sidebar Latest/Ebooks, Breadcrumbs, Sidebar Menu, List Items
   ============================================================ */

/* ----------------------------------------------------------
   Buttons
   ---------------------------------------------------------- */
.wl-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.85rem 1.75rem;
	border-radius: 12px;
	font-weight: 700;
	font-size: 0.95rem;
	letter-spacing: 0.2px;
	text-align: center;
	white-space: nowrap;
	cursor: pointer;
	border: none;
	transition: all 0.25s ease;
	box-shadow: 0 8px 20px rgba(37, 99, 235, 0.18);
}

.wl-btn-primary {
	background: var(--wl-color-blue);
	color: var(--wl-color-white);
}

.wl-btn-primary:hover {
	background: var(--wl-color-primary);
	color: var(--wl-color-white);
	transform: translateY(-1px);
}

.wl-btn-primary:active,
.wl-btn-primary:focus-visible,
.wl-btn-primary.wl-active {
	background: var(--wl-color-primary);
	box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.2);
	transform: translateY(0);
}

.wl-btn-secondary {
	background: rgba(255, 255, 255, 0.7);
	color: var(--wl-color-blue);
	border: 1px solid var(--wl-color-blue);
	box-shadow: none;
}

.wl-btn-secondary:hover {
	background: var(--wl-color-white);
}

.wl-btn-block {
	display: block;
	width: 100%;
	text-align: center;
	margin-top: 1.5rem;
}

/* ----------------------------------------------------------
   Archive Hero (used in archive-current_affair.php, archive-quiz.php)
   ---------------------------------------------------------- */
.wl-archive-hero {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
	padding: 2rem 2rem 1.5rem;
	margin-bottom: 2rem;
	background: linear-gradient(135deg, rgba(255, 255, 255, 0.95), rgba(248, 250, 252, 0.9));
	border: 1px solid var(--wl-color-border);
	border-radius: 22px;
	box-shadow: var(--wl-shadow-sm);
}

.wl-archive-header-copy {
	flex: 1;
}

.wl-eyebrow {
	display: inline-block;
	margin-bottom: 0.75rem;
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--wl-color-blue);
}

.page-title {
	font-size: clamp(2.2rem, 3.5vw, 3rem);
	margin: 0;
	line-height: 1.1;
	font-weight: 800;
	letter-spacing: -0.04em;
}

.archive-description {
	margin-top: 0.5rem;
	color: var(--wl-color-muted);
	font-size: 0.98rem;
}

.wl-archive-search-box {
	flex-shrink: 0;
	width: min(100%, 320px);
}

.wl-archive-search-box form {
	display: flex;
	gap: 0.75rem;
	padding: 0.5rem;
	background: rgba(255, 255, 255, 0.8);
	border: 1px solid var(--wl-color-border);
	border-radius: 14px;
}

.wl-archive-search-box input[type="search"] {
	flex: 1;
	border: none;
	outline: none;
	background: transparent;
	font-size: 0.95rem;
	padding: 0.7rem 0.75rem;
	color: var(--wl-color-primary);
}

.wl-archive-search-box button {
	border: none;
	background: var(--wl-color-blue);
	color: var(--wl-color-white);
	padding: 0.75rem 1rem;
	border-radius: 10px;
	font-weight: 700;
	cursor: pointer;
}

/* ----------------------------------------------------------
   Portal Sidebar Panels (used in sidebar-left.php)
   ---------------------------------------------------------- */
.wl-portal-sidebar {
	display: flex;
	flex-direction: column;
	gap: 1.25rem;
}

.wl-portal-panel {
	background: rgba(255, 255, 255, 0.7);
	border: 1px solid var(--wl-color-border);
	border-radius: 16px;
	padding: 1.25rem 1rem;
	box-shadow: var(--wl-shadow-sm);
}

.wl-portal-panel-secondary {
	padding: 1.25rem 1rem 1.5rem;
}

.wl-portal-panel-title,
.wl-portal-panel-title-small,
.wl-portal-menu-heading {
	margin: 0 0 1rem;
	color: var(--wl-color-blue);
	font-size: 1.1rem;
	font-weight: 700;
	line-height: 1.25;
}

.wl-portal-panel-title {
	padding-bottom: 0.7rem;
	border-bottom: 3px solid var(--wl-color-blue);
}

.wl-portal-menu-panel {
	display: flex;
	flex-direction: column;
	gap: 0.7rem;
}

.wl-portal-link {
	display: block;
	padding: 0.7rem 0.75rem;
	border-radius: 10px;
	font-size: 0.95rem;
	font-weight: 600;
	color: var(--wl-color-primary);
	background: transparent;
	border: 1px solid transparent;
	transition: all 0.2s ease;
}

.wl-portal-link:hover,
.wl-portal-link:focus-visible,
.wl-portal-link-primary {
	background: rgba(37, 99, 235, 0.08);
	border-color: rgba(37, 99, 235, 0.15);
	color: var(--wl-color-blue);
}

.wl-portal-link-primary {
	background: linear-gradient(135deg, rgba(37, 99, 235, 0.12), rgba(20, 184, 166, 0.08));
}

/* Indented sub-links (Topic Wise CA MCQs) */
.wl-portal-link-indent {
	padding-left: 1.5rem;
	font-size: 0.88rem;
	color: var(--wl-color-muted);
	border-left: 2px solid var(--wl-color-border);
	border-radius: 0 8px 8px 0;
	margin-left: 0.5rem;
}

.wl-portal-link-indent:hover {
	border-left-color: var(--wl-color-blue);
	color: var(--wl-color-blue);
	background: rgba(37, 99, 235, 0.06);
}


/* ----------------------------------------------------------
   Feature Panel (used in front-page.php)
   ---------------------------------------------------------- */
.wl-feature-panel {
	display: block;
	padding: 5rem 3rem;
	background: linear-gradient(to right, rgba(15, 23, 42, 0.95) 0%, rgba(15, 23, 42, 0.8) 45%, rgba(15, 23, 42, 0.1) 100%), url('../img/hero-bg.jpg') center right / cover no-repeat;
	border-radius: 24px;
	margin-bottom: 2.5rem;
	box-shadow: 0 15px 35px rgba(0,0,0,0.15);
	text-align: left;
	color: #fff;
}

/* Hero Layout: Full Width - no border-radius, edge to edge */
.wl-hero-layout-full-width {
	border-radius: 0;
	margin-left: calc(-1 * var(--wl-gap, 30px));
	margin-right: calc(-1 * var(--wl-gap, 30px));
	padding: 5rem 4rem;
}

/* Hero Layout: Container - default boxed style (same as base) */
.wl-hero-layout-container {
	border-radius: 24px;
}

/* Hero Layout: Minimal - smaller, lighter */
.wl-hero-layout-minimal {
	border-radius: 12px;
	padding: 2.5rem 2rem;
	background: linear-gradient(135deg, #1e3a5f 0%, #2563EB 100%);
	box-shadow: 0 6px 20px rgba(37, 99, 235, 0.2);
}

.wl-section-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 1.5rem;
	border-bottom: 2px solid var(--wl-color-border);
	padding-bottom: 0.9rem;
}

.wl-section-title {
	margin: 0;
	font-size: 1.75rem;
	font-weight: 700;
	color: var(--wl-color-primary);
}

.wl-section-link {
	font-weight: 600;
	color: var(--wl-color-blue);
}

.wl-feature-kicker {
	display: inline-block;
	font-size: 0.75rem;
	font-weight: 800;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: #60a5fa; /* light blue for dark bg */
	margin-bottom: 1rem;
}

.wl-feature-copy h1 {
	margin: 0 0 1rem;
	font-size: clamp(2.2rem, 3.5vw, 3.5rem);
	line-height: 1.08;
	font-weight: 800;
	letter-spacing: -0.04em;
	color: #ffffff;
}

.wl-feature-copy h1 span {
	color: #93c5fd; /* lighter blue */
}

.wl-feature-copy p {
	margin: 0 0 2rem;
	font-size: 1.15rem;
	max-width: 620px;
	font-weight: 400;
	color: #e2e8f0;
}

.wl-feature-actions {
	display: flex;
	gap: 1rem;
	flex-wrap: wrap;
	justify-content: flex-start;
}

.wl-section-heading {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 1rem;
	margin: 1rem 0 1.25rem;
}

.wl-section-heading h2,
.wl-section-heading h3 {
	font-size: 1.5rem;
	margin: 0 0 0.25rem;
	font-weight: 700;
}

.wl-section-heading p {
	margin: 0;
	font-size: 0.9rem;
	color: var(--wl-color-muted);
}

.wl-section-heading a {
	font-weight: 700;
	color: var(--wl-color-blue);
}

/* ----------------------------------------------------------
   Premium Cards UI
   ---------------------------------------------------------- */
.wl-card {
	background-color: var(--wl-color-white);
	border-radius: 24px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
	overflow: hidden;
	transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
	border: 1px solid rgba(0, 0, 0, 0.04);
}

.wl-card:hover {
	transform: translateY(-8px);
	box-shadow: 0 20px 40px rgba(37, 99, 235, 0.12);
	border-color: rgba(37, 99, 235, 0.1);
}

.wl-card-image {
	overflow: hidden;
}

.wl-card-image img {
	width: 100%;
	height: auto;
	aspect-ratio: 16/9;
	object-fit: cover; /* Back to cover but with proper aspect ratio so it looks cinematic edge-to-edge */
	transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.wl-card:hover .wl-card-image img {
	transform: scale(1.05);
}

.wl-card-content {
	padding: 1.8rem 2rem;
}

.wl-card-title {
	font-size: 1.45rem;
	margin-bottom: 0.7rem;
	line-height: 1.35;
	font-weight: 700;
}

.wl-card-title a {
	color: var(--wl-color-primary);
}

.wl-card-title a:hover {
	color: var(--wl-color-blue);
}

.wl-card-meta {
	font-size: 0.84rem;
	color: var(--wl-color-muted);
	margin-bottom: 1rem;
}

.wl-card-excerpt {
	color: var(--wl-color-text);
	font-size: 0.97rem;
	line-height: 1.7;
}

.wl-archive-grid {
	gap: 2rem;
}

/* ----------------------------------------------------------
   Badges
   ---------------------------------------------------------- */
.wl-badge {
	display: inline-block;
	padding: 0.25rem 0.75rem;
	border-radius: var(--wl-radius-full);
	font-size: 0.75rem;
	font-weight: 600;
	background-color: var(--wl-color-background);
	color: var(--wl-color-primary);
}

/* ----------------------------------------------------------
   Content List Items (used in content-list.php)
   ---------------------------------------------------------- */
.wl-list-item {
	display: flex;
	gap: 1rem;
	padding: 1rem 0;
	border-bottom: 1px solid var(--wl-color-border);
	align-items: flex-start;
}

.wl-list-item:last-child {
	border-bottom: none;
}

.wl-list-item-image {
	width: 180px;
	flex-shrink: 0;
}

.wl-list-item-image a {
	display: block;
}

.wl-list-item-image img {
	width: 100%;
	height: auto;
	border-radius: var(--wl-radius-md);
	aspect-ratio: 16/9;
	object-fit: cover;
}

.wl-list-item-content {
	flex-grow: 1;
}

.wl-list-item-title {
	font-size: 1.1rem;
	margin: 0 0 0.5rem;
	line-height: 1.4;
	font-weight: 600;
}

.wl-list-item-title a {
	color: var(--wl-color-primary);
	text-decoration: none;
	transition: color 0.2s;
}

.wl-list-item-title a:hover {
	color: var(--wl-color-blue);
}

.wl-list-item-excerpt {
	font-size: 0.95rem;
	color: var(--wl-color-text);
	line-height: 1.5;
	margin-bottom: 0.5rem;
}

.wl-list-item-meta {
	display: flex;
	gap: 1rem;
	align-items: center;
	font-size: 0.8rem;
	color: var(--wl-color-muted);
}

/* ----------------------------------------------------------
   Sidebar Latest Articles
   ---------------------------------------------------------- */
.wl-sidebar-latest-list {
	display: flex;
	flex-direction: column;
	gap: 1.25rem;
}

.wl-sidebar-latest-item {
	display: flex;
	gap: 1rem;
	align-items: center;
	padding: 0.5rem 0;
	transition: background 0.2s;
	border-radius: var(--wl-radius-md);
}

.wl-sidebar-latest-item:hover {
	background-color: var(--wl-color-background);
}

.wl-sidebar-latest-thumb {
	width: 70px;
	height: 70px;
	flex-shrink: 0;
	border-radius: var(--wl-radius-md);
	overflow: hidden;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.wl-sidebar-latest-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.3s;
}

.wl-sidebar-latest-item:hover .wl-sidebar-latest-thumb img {
	transform: scale(1.05);
}

.wl-sidebar-latest-content {
	flex-grow: 1;
}

.wl-sidebar-latest-title {
	font-size: 0.9rem;
	margin: 0 0 0.35rem;
	line-height: 1.4;
	font-weight: 600;
}

.wl-sidebar-latest-title a {
	color: var(--wl-color-primary);
	text-decoration: none;
	transition: color 0.2s;
}

.wl-sidebar-latest-title a:hover {
	color: var(--wl-color-blue);
}

.wl-sidebar-latest-date {
	font-size: 0.75rem;
	color: var(--wl-color-muted);
	font-weight: 500;
}

/* ----------------------------------------------------------
   Sidebar E-books List
   ---------------------------------------------------------- */
.wl-sidebar-ebook-list li {
	margin-bottom: 0.5rem;
}

.wl-sidebar-ebook-list a {
	padding: 0.5rem;
	border-radius: var(--wl-radius-md);
}

.wl-sidebar-ebook-list a:hover {
	background-color: var(--wl-color-background);
}

/* ----------------------------------------------------------
   Breadcrumbs
   ---------------------------------------------------------- */
.wl-breadcrumbs {
	margin-top: 2rem;
	margin-bottom: 2rem;
	background-color: var(--wl-color-white);
	padding: 1rem 1.5rem;
	border-radius: var(--wl-radius-md);
	box-shadow: var(--wl-shadow-sm);
	border: 1px solid var(--wl-color-border);
}

.wl-breadcrumb-list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	font-size: 0.9rem;
}

.wl-breadcrumb-item {
	color: var(--wl-color-muted);
	display: flex;
	align-items: center;
}

.wl-breadcrumb-item a {
	color: var(--wl-color-primary);
	text-decoration: none;
	font-weight: 500;
	transition: color 0.2s;
}

.wl-breadcrumb-item a:hover {
	color: var(--wl-color-blue);
}

.wl-breadcrumb-item.wl-current {
	color: var(--wl-color-muted);
}

.wl-breadcrumb-separator {
	margin: 0 0.75rem;
	color: var(--wl-color-border);
	font-weight: 400;
}

/* ----------------------------------------------------------
   Sidebar Menu Accordion (generated by JS in main.js)
   ---------------------------------------------------------- */
.wl-sidebar-menu {
	list-style: none;
	padding: 0;
	margin: 0;
}

.wl-sidebar-menu li {
	position: relative;
	margin-bottom: 0.25rem;
}

.wl-sidebar-menu a {
	display: block;
	padding: 0.5rem;
	color: var(--wl-color-primary);
	text-decoration: none;
	transition: color 0.2s;
	font-weight: 500;
}

.wl-sidebar-menu a:hover {
	color: var(--wl-color-blue);
}

.wl-sidebar-menu .menu-item-has-children {
	position: relative;
}

.wl-submenu-toggle {
	position: absolute;
	right: 0.5rem;
	top: 0.5rem;
	cursor: pointer;
	padding: 0.25rem;
	transition: transform 0.3s;
	color: var(--wl-color-muted);
	display: flex;
	align-items: center;
	justify-content: center;
}

.wl-submenu-toggle:hover {
	color: var(--wl-color-blue);
}

.wl-sidebar-menu .menu-item-has-children.open>.wl-submenu-toggle {
	transform: rotate(180deg);
}

.wl-sidebar-menu .sub-menu {
	list-style: none;
	padding-left: 1.5rem;
	margin: 0;
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.3s ease-out;
}

.wl-sidebar-menu .sub-menu a {
	font-weight: 400;
	font-size: 0.9em;
}

/* ----------------------------------------------------------
   PDF Resources Sidebar Widget
   ---------------------------------------------------------- */
.wl-pdf-widget {
	padding: 1.25rem;
}

.wl-pdf-list {
	list-style: none;
	padding: 0;
	margin: 0 0 1.25rem;
	display: flex;
	flex-direction: column;
	gap: 0.85rem;
}

.wl-pdf-item {
	display: flex;
	gap: 0.75rem;
	align-items: flex-start;
	padding: 0.85rem;
	border: 1px solid var(--wl-color-border);
	border-radius: var(--wl-radius-md);
	background: var(--wl-color-white);
	transition: border-color 0.2s, box-shadow 0.2s;
	position: relative;
}

.wl-pdf-item:hover {
	border-color: var(--wl-color-blue);
	box-shadow: 0 2px 8px rgba(37, 99, 235, 0.1);
}

.wl-pdf-item.wl-pdf-premium {
	border-color: #f59e0b;
	background: #fffbeb;
}

.wl-pdf-item.wl-pdf-premium:hover {
	border-color: #d97706;
	box-shadow: 0 2px 8px rgba(217, 119, 6, 0.12);
}

/* PDF Icon / Thumbnail */
.wl-pdf-icon {
	position: relative;
	flex-shrink: 0;
	width: 48px;
	height: 56px;
}

.wl-pdf-thumb {
	width: 48px;
	height: 56px;
	object-fit: cover;
	border-radius: 6px;
	display: block;
}

.wl-pdf-icon-placeholder {
	width: 48px;
	height: 56px;
	background: linear-gradient(135deg, #ef4444, #dc2626);
	border-radius: 6px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: white;
	font-size: 0.65rem;
	font-weight: 800;
	letter-spacing: 0.5px;
}

.wl-pdf-lock {
	position: absolute;
	bottom: -4px;
	right: -4px;
	font-size: 0.75rem;
	background: white;
	border-radius: 50%;
	width: 18px;
	height: 18px;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}

/* PDF Content Area */
.wl-pdf-info {
	flex-grow: 1;
	min-width: 0;
}

.wl-pdf-title {
	font-size: 0.85rem;
	font-weight: 600;
	line-height: 1.35;
	margin: 0 0 0.25rem;
	color: var(--wl-color-primary);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.wl-pdf-desc {
	font-size: 0.75rem;
	color: var(--wl-color-muted);
	margin: 0 0 0.35rem;
	line-height: 1.4;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* Meta badges (size, pages) */
.wl-pdf-meta {
	display: flex;
	gap: 0.35rem;
	flex-wrap: wrap;
	margin-bottom: 0.5rem;
}

.wl-pdf-meta-badge {
	font-size: 0.7rem;
	background: var(--wl-color-background);
	color: var(--wl-color-muted);
	padding: 0.15rem 0.45rem;
	border-radius: var(--wl-radius-sm);
	border: 1px solid var(--wl-color-border);
	font-weight: 500;
}

/* Download Button */
.wl-pdf-download-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.25rem;
	padding: 0.3rem 0.75rem;
	border-radius: 6px;
	font-size: 0.75rem;
	font-weight: 700;
	text-decoration: none;
	background: linear-gradient(135deg, var(--wl-color-blue), #1d4ed8);
	color: white;
	transition: opacity 0.2s, transform 0.2s;
	white-space: nowrap;
}

.wl-pdf-download-btn:hover {
	opacity: 0.88;
	transform: translateY(-1px);
	color: white;
}

.wl-pdf-btn-locked {
	background: linear-gradient(135deg, #f59e0b, #d97706);
	cursor: default;
}

.wl-pdf-btn-locked:hover {
	transform: none;
}

/* ============================================================
   PDF E-Books Archive Page (GKToday Style)
   ============================================================ */

/* Page Header */
.wl-ebook-page-header {
	background: linear-gradient(135deg, #1a73e8 0%, #0d47a1 100%);
	border-radius: 14px;
	padding: 2rem 2rem 1.75rem;
	margin-bottom: 2rem;
	color: white;
}

.wl-ebook-page-title {
	font-size: 1.75rem;
	font-weight: 800;
	margin: 0 0 0.5rem;
	color: white;
}

.wl-ebook-page-subtitle {
	font-size: 0.92rem;
	margin: 0;
	color: rgba(255, 255, 255, 0.85);
}

/* Category Group */
.wl-ebook-group {
	margin-bottom: 2rem;
	background: var(--wl-color-white);
	border: 1px solid var(--wl-color-border);
	border-radius: 12px;
	overflow: hidden;
	box-shadow: var(--wl-shadow-sm);
}

.wl-ebook-group-title {
	font-size: 1rem;
	font-weight: 700;
	padding: 0.75rem 1.25rem;
	margin: 0;
	background: #f1f5fb;
	border-bottom: 2px solid var(--wl-color-blue);
	color: var(--wl-color-primary);
	letter-spacing: 0.01em;
}

/* PDF Row */
.wl-ebook-list {
	display: flex;
	flex-direction: column;
}

.wl-ebook-row {
	display: flex;
	align-items: center;
	gap: 1rem;
	padding: 0.9rem 1.25rem;
	border-bottom: 1px solid var(--wl-color-border);
	transition: background 0.15s;
}

.wl-ebook-row:last-child {
	border-bottom: none;
}

.wl-ebook-row:hover {
	background: #f7f9ff;
}

.wl-ebook-row-premium {
	background: #fffbeb;
}

.wl-ebook-row-premium:hover {
	background: #fef3c7;
}

/* Row Icon */
.wl-ebook-row-icon {
	flex-shrink: 0;
	width: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.wl-ebook-thumb {
	width: 40px;
	height: 48px;
	object-fit: cover;
	border-radius: 5px;
	display: block;
}

.wl-ebook-icon-placeholder {
	width: 40px;
	height: 48px;
	background: linear-gradient(135deg, #ef4444, #b91c1c);
	border-radius: 5px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.25rem;
}

/* Row Body */
.wl-ebook-row-body {
	flex: 1;
	min-width: 0;
}

.wl-ebook-row-title {
	font-size: 0.92rem;
	font-weight: 600;
	margin: 0 0 0.2rem;
	line-height: 1.4;
	color: var(--wl-color-primary);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.wl-ebook-row-desc {
	font-size: 0.78rem;
	color: var(--wl-color-muted);
	margin: 0 0 0.3rem;
	line-height: 1.4;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.wl-ebook-row-meta {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	flex-wrap: wrap;
}

.wl-ebook-date {
	font-size: 0.72rem;
	color: var(--wl-color-muted);
}

.wl-ebook-badge {
	font-size: 0.68rem;
	background: var(--wl-color-background);
	border: 1px solid var(--wl-color-border);
	padding: 1px 6px;
	border-radius: 4px;
	color: var(--wl-color-muted);
	font-weight: 500;
}

/* Row Action Button */
.wl-ebook-row-action {
	flex-shrink: 0;
}

.wl-ebook-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.3rem;
	padding: 0.4rem 1rem;
	border-radius: 6px;
	font-size: 0.8rem;
	font-weight: 700;
	text-decoration: none;
	white-space: nowrap;
	transition: opacity 0.2s, transform 0.2s;
	border: none;
	cursor: pointer;
}

.wl-ebook-btn-free {
	background: linear-gradient(135deg, #16a34a, #15803d);
	color: white;
}

.wl-ebook-btn-free:hover {
	opacity: 0.88;
	color: white;
	transform: translateY(-1px);
}

.wl-ebook-btn-locked {
	background: linear-gradient(135deg, #f59e0b, #d97706);
	color: white;
}

.wl-ebook-btn-locked:hover {
	color: white;
	opacity: 0.88;
}

.wl-ebook-btn-soon {
	background: var(--wl-color-background);
	color: var(--wl-color-muted);
	border: 1px solid var(--wl-color-border);
}

/* Responsive */
@media (max-width: 600px) {
	.wl-ebook-row {
		flex-wrap: wrap;
		gap: 0.75rem;
	}

	.wl-ebook-row-action {
		width: 100%;
	}

	.wl-ebook-btn {
		width: 100%;
		justify-content: center;
	}

	.wl-ebook-row-title {
		white-space: normal;
	}
}


/* --- Refactored Sidebar & Generic Utility Classes --- */

/* Alternative Panel Title used in Sidebars */
.wl-panel-title-alt {
	text-transform: uppercase;
	color: var(--wl-color-blue);
	font-weight: 700;
	font-size: 0.95rem;
	margin-bottom: 1rem;
	border-bottom: none;
	padding-bottom: 0;
}

/* 1 Column Link Grid */
.wl-link-grid-1col {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0.5rem;
	margin-bottom: 1.25rem;
}

/* 2 Column Link Grid */
.wl-link-grid-2col {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0.75rem 0.5rem;
	margin-bottom: 1.25rem;
}

/* Sidebar Standard Link Item */
.wl-sidebar-link {
	font-size: 0.85rem;
	color: var(--wl-color-text);
	text-decoration: none;
	display: flex;
	align-items: flex-start;
	gap: 0.4rem;
	font-weight: 500;
	line-height: 1.4;
}

.wl-sidebar-link:hover {
	color: var(--wl-color-blue);
}

.wl-sidebar-link-center {
	align-items: center;
}

/* Sidebar SVGs / Icons */
.wl-sidebar-icon {
	color: var(--wl-color-muted);
	opacity: 0.7;
	flex-shrink: 0;
	margin-top: 2px;
}

.wl-sidebar-icon-red {
	color: var(--wl-color-red, #ef4444);
	flex-shrink: 0;
	margin-top: 2px;
}

/* Block Primary Button */
.wl-btn-block-primary {
	display: block;
	width: 100%;
	text-align: center;
	background-color: var(--wl-color-blue);
	color: #fff;
	border-radius: 6px;
	padding: 0.6rem;
	font-weight: 600;
	font-size: 0.85rem;
	text-decoration: none;
	transition: background-color 0.2s ease;
}

.wl-btn-block-primary:hover {
	background-color: var(--wl-color-primary);
	color: #fff;
}

/* Announcement Bar (Header) */
.wl-announcement-bar {
	background-color: var(--wl-color-white);
	border-bottom: 1px solid var(--wl-color-border);
	height: 44px;
	display: flex;
	align-items: center;
}

.wl-announcement-inner {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	font-size: 0.85rem;
}

.wl-announcement-label {
	font-weight: 700;
	background-color: var(--wl-color-blue);
	color: var(--wl-color-white);
	display: flex;
	align-items: center;
	gap: 0.4rem;
	padding: 0.25rem 0.75rem;
	border-radius: 4px;
}

.wl-announcement-ticker {
	color: var(--wl-color-text);
	font-weight: 500;
	flex: 1;
	overflow: hidden;
	display: flex;
	align-items: center;
}

.wl-ticker-item {
	display: inline-block;
	padding-right: 50px;
}

.wl-ticker-item a {
	color: inherit;
	text-decoration: none;
	transition: color 0.2s ease;
}

.wl-ticker-item a:hover {
	color: var(--wl-color-blue);
}

.wl-ticker-item span {
	color: var(--wl-color-muted);
	font-weight: 400;
	font-size: 0.8rem;
}

/* Sidebar Advertisement */
.wl-sidebar-ad-wrapper {
	text-align: center;
	padding: 0;
	background: transparent;
	border: none;
	box-shadow: none;
	margin-bottom: 0 !important;
}

.wl-ad-img {
	max-width: 100%;
	height: auto;
	border-radius: 8px;
	display: block;
	margin: 0 auto;
}

.wl-ad-placeholder {
	width: 300px;
	height: 250px;
	background-color: var(--wl-color-border);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--wl-color-muted);
	margin: 0 auto;
	max-width: 100%;
	border: 1px dashed #cbd5e1;
	border-radius: 8px;
}

/* ============================================================
   Custom Premium Language Toggle (EN / HI)
   ============================================================ */
.wl-lang-switch {
	display: inline-flex;
	background: #f1f5f9;
	border-radius: 20px;
	padding: 4px;
	margin-right: 15px;
	align-items: center;
	box-shadow: inset 0 2px 4px rgba(0,0,0,0.05);
}

.wl-lang-btn {
	border: none;
	background: transparent;
	padding: 4px 12px;
	font-size: 0.75rem;
	font-weight: 700;
	border-radius: 16px;
	cursor: pointer;
	color: var(--wl-color-muted);
	transition: all 0.25s ease;
}

.wl-lang-btn:hover {
	color: var(--wl-color-blue);
}

.wl-lang-btn.active {
	background: #fff;
	color: var(--wl-color-blue);
	box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

/* Hide Default Google Translate UI */
.skiptranslate, #goog-gt-tt { display: none !important; }
.goog-te-banner-frame { display: none !important; }

/* ============================================================
   Post Navigation (Previous / Next) — Premium Redesign
   ============================================================ */
.wl-post-navigation {
	margin-top: 3rem;
	margin-bottom: 1.5rem;
}

.wl-post-navigation .nav-links {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1rem;
}

.wl-post-navigation .nav-previous,
.wl-post-navigation .nav-next {
	display: flex;
}

.wl-post-navigation .nav-previous a,
.wl-post-navigation .nav-next a {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 1.25rem 1.5rem;
	width: 100%;
	background: linear-gradient(135deg, #f0f7ff 0%, #e8f4ff 100%);
	border: 1px solid #bfdbfe;
	border-radius: 16px;
	text-decoration: none;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	position: relative;
	overflow: hidden;
}

.wl-post-navigation .nav-previous a::before,
.wl-post-navigation .nav-next a::before {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(135deg, #2563eb 0%, #3b82f6 100%);
	opacity: 0;
	transition: opacity 0.3s ease;
	border-radius: 16px;
}

.wl-post-navigation .nav-previous a:hover::before,
.wl-post-navigation .nav-next a:hover::before {
	opacity: 1;
}

.wl-post-navigation .nav-previous a {
	align-items: flex-start;
}

.wl-post-navigation .nav-next a {
	align-items: flex-end;
	text-align: right;
}

.wl-post-navigation a:hover {
	border-color: #2563eb;
	box-shadow: 0 8px 25px -5px rgba(37, 99, 235, 0.4);
	transform: translateY(-3px);
}

.wl-post-navigation a:hover .wl-nav-label,
.wl-post-navigation a:hover .wl-nav-title,
.wl-post-navigation a:hover .wl-nav-arrow {
	color: #ffffff !important;
	position: relative;
	z-index: 1;
}

.wl-nav-arrow {
	font-size: 1.5rem;
	color: #2563eb;
	line-height: 1;
	font-weight: 300;
	position: relative;
	z-index: 1;
}

.wl-nav-label {
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: #2563eb;
	position: relative;
	z-index: 1;
}

.wl-nav-title {
	font-size: 0.9rem;
	font-weight: 700;
	color: #1e293b;
	line-height: 1.4;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	position: relative;
	z-index: 1;
}

/* Archive / Category Numbered Pagination — Covers all CPT archives */
.navigation.pagination,
.wl-pagination .navigation,
.wl-pagination {
	margin: 2.5rem 0;
}

.navigation.pagination .nav-links,
.wl-pagination .nav-links {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 0.4rem;
	flex-wrap: wrap;
}

.page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 42px;
	height: 42px;
	padding: 0 0.85rem;
	border: 2px solid #e2e8f0;
	border-radius: 10px;
	font-size: 0.875rem;
	font-weight: 700;
	color: #475569;
	text-decoration: none;
	background: #ffffff;
	transition: all 0.2s ease;
	box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}

.page-numbers:hover {
	border-color: #2563eb;
	color: #2563eb;
	background: #eff6ff;
	transform: translateY(-1px);
	box-shadow: 0 4px 12px -3px rgba(37, 99, 235, 0.3);
}

.page-numbers.current {
	background: linear-gradient(135deg, #1e3a8a 0%, #3b82f6 100%);
	border-color: transparent;
	color: #fff;
	box-shadow: 0 4px 14px -3px rgba(37, 99, 235, 0.5);
}

.page-numbers.dots {
	border: none;
	background: none;
	box-shadow: none;
	color: #94a3b8;
	font-size: 1rem;
}

/* Prev/Next text buttons in archive pagination */
.page-numbers.prev,
.page-numbers.next {
	padding: 0 1.1rem;
	gap: 0.4rem;
}

/* ============================================================
   Comments Section Styling
   ============================================================ */
.wl-comments-area {
	margin-top: 3rem;
	padding-top: 2rem;
	border-top: 1px solid var(--wl-color-border);
}

.wl-comments-title,
.comment-reply-title {
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--wl-color-primary);
	margin-bottom: 1.5rem;
}

/* Comment Form Elements */
.comment-form {
	background: #f8fafc;
	padding: 2rem;
	border-radius: var(--wl-radius-lg);
	border: 1px solid #e2e8f0;
}

.comment-notes {
	font-size: 0.9rem;
	color: #64748b;
	margin-bottom: 1.5rem;
}

.comment-form-comment,
.comment-form-author,
.comment-form-email,
.comment-form-url {
	margin-bottom: 1.2rem;
	display: flex;
	flex-direction: column;
}

.comment-form label {
	font-weight: 600;
	font-size: 0.95rem;
	color: #334155;
	margin-bottom: 0.5rem;
}

.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
	width: 100%;
	padding: 0.75rem 1rem;
	border: 1px solid #cbd5e1;
	border-radius: var(--wl-radius-md);
	font-size: 1rem;
	color: #334155;
	background: #ffffff;
	transition: all 0.2s ease;
	outline: none;
}

.comment-form input[type="text"]:focus,
.comment-form input[type="email"]:focus,
.comment-form input[type="url"]:focus,
.comment-form textarea:focus {
	border-color: #3b82f6;
	box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15);
}

.comment-form textarea {
	min-height: 120px;
	resize: vertical;
}

/* Save my name checkbox */
.comment-form-cookies-consent {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 0.9rem;
	color: #475569;
	margin-bottom: 1.5rem;
}

.comment-form-cookies-consent input {
	width: 16px;
	height: 16px;
	accent-color: #3b82f6;
	cursor: pointer;
}

/* Submit Button */
.form-submit {
	margin-bottom: 0;
}

.submit {
	background: linear-gradient(135deg, #1e3a8a 0%, #3b82f6 100%);
	color: #ffffff;
	border: none;
	padding: 0.8rem 1.5rem;
	font-size: 1rem;
	font-weight: 600;
	border-radius: 8px;
	cursor: pointer;
	transition: all 0.2s ease;
	box-shadow: 0 4px 10px rgba(37, 99, 235, 0.3);
}

.submit:hover {
	transform: translateY(-2px);
	box-shadow: 0 6px 14px rgba(37, 99, 235, 0.4);
}

/* Comment List */
.wl-comment-list {
	list-style: none;
	padding: 0;
	margin: 0 0 2rem 0;
}

.comment-body {
	display: flex;
	gap: 1rem;
	margin-bottom: 2rem;
	background: #ffffff;
	padding: 1.5rem;
	border-radius: var(--wl-radius-lg);
	border: 1px solid #f1f5f9;
	box-shadow: 0 2px 8px rgba(0,0,0,0.03);
}

.comment-author .avatar {
	border-radius: 50%;
	width: 48px;
	height: 48px;
}

.comment-meta {
	font-size: 0.85rem;
	color: #94a3b8;
	margin-bottom: 0.5rem;
}

.comment-author .fn {
	font-weight: 700;
	color: #1e293b;
	font-size: 1.05rem;
	font-style: normal;
}

.comment-content {
	color: #334155;
	line-height: 1.6;
	font-size: 0.95rem;
}

.reply a {
	display: inline-block;
	margin-top: 0.5rem;
	font-size: 0.85rem;
	font-weight: 600;
	color: #3b82f6;
	text-decoration: none;
	transition: color 0.2s;
}

.reply a:hover {
	color: #1e3a8a;
	text-decoration: underline;
}

/* Nested Comments */
.children {
	list-style: none;
	padding-left: 2rem;
	border-left: 2px solid #e2e8f0;
	margin-top: 1rem;
}