/*
 * cg-overrides.css — surgical CSS overrides to undo plugin/theme conflicts
 * Generated 2026-05-01 from live computed-style audit on catgurukul.com
 * Drop into: wp-content/themes/cg-theme/assets/css/cg-overrides.css
 * Enqueue order: AFTER buddyboss.css and lms.css (priority 200+ on wp_enqueue_scripts)
 *
 * Strategy: use :where() (specificity 0,0,0) wherever possible so the rules
 * win only by load order — easy to override locally if a specific page needs it.
 * Use !important sparingly (only on font-family — the cascade is too messy there).
 *
 * AUDIT EVIDENCE:
 *   Page: /courses-pricing/
 *   Stylesheets: 94 · Inline blocks: 17 · Inline bytes: 79,754
 *   Distinct font-families on page: 10 (smoking gun)
 *   Body resolved font: "Athletics, Inter, ..."  ← BuddyBoss winning
 *   Heading resolved font: "Inter, ..."           ← cg-theme winning
 *   Inputs resolved font: "Athletics, Inter, ..." ← BB winning
 *   Result: visible mismatch between heading (Inter) and body/inputs (Athletics)
 */

/* =====================================================================
   1. FONT FAMILY: force Inter everywhere except icon fonts
   ===================================================================== */

:where(body),
:where(input, textarea, select, button),
:where(.bb-grid, .buddypanel, .bp-nouveau, .bp-nouveau *),
:where(.learndash-wrapper, .learndash-wrapper *),
:where(.mp_wrapper, .mepr-account-bar, .mepr_signup_form *),
:where(.bb-card, .bb-card *),
:where(.gamipress-achievement, .gamipress-achievement *),
:where(.cp-wrap, .cp-wrap *) {
	font-family: "Inter", -apple-system, "system-ui", "Segoe UI", Roboto, sans-serif !important;
}

/* But preserve icon fonts where they're set explicitly */
:where(.bb-icon, .bb-icons-rl, [class^="bb-icon-"], [class*=" bb-icon-"]) {
	font-family: "bb-icons" !important;
}
:where(.dashicons, .dashicons-before::before) {
	font-family: "dashicons" !important;
}

/* =====================================================================
   2. BUTTON NORMALISATION
   Audit: cp-btn-primary uses #FF6B35; bb buttons use BB orange; ld-button uses
   LD blue; mp buttons grey. Standardise on cg orange for primary CTAs in LMS
   surface only — leave BuddyBoss community/profile buttons untouched (they
   need to look BuddyBoss-native there).
   ===================================================================== */

:where(.learndash-wrapper) .ld-button,
:where(.learndash-wrapper) .ld-primary-button {
	background-color: #ff6b35;
	border-color: #ff6b35;
	border-radius: 10px;
	font-weight: 600;
	letter-spacing: 0;
	transition: background-color .15s ease, transform .15s ease;
}
:where(.learndash-wrapper) .ld-button:hover {
	background-color: #ea5826;
	transform: translateY(-1px);
}

/* =====================================================================
   3. FORM CONTROL CONSISTENCY
   Audit: inputs render with 2px solid #e0e0e0 border + 8px radius (cg-theme)
   on most pages, but 1px solid #d1d5db on MP/Zoho-form pages. Lock to
   cg-theme spec.
   ===================================================================== */

:where(.learndash-wrapper, .mp_wrapper, .bb-meprlms, body) input[type="text"],
:where(.learndash-wrapper, .mp_wrapper, .bb-meprlms, body) input[type="email"],
:where(.learndash-wrapper, .mp_wrapper, .bb-meprlms, body) input[type="number"],
:where(.learndash-wrapper, .mp_wrapper, .bb-meprlms, body) input[type="password"],
:where(.learndash-wrapper, .mp_wrapper, .bb-meprlms, body) input[type="tel"],
:where(.learndash-wrapper, .mp_wrapper, .bb-meprlms, body) textarea,
:where(.learndash-wrapper, .mp_wrapper, .bb-meprlms, body) select {
	border: 2px solid #e0e0e0;
	border-radius: 8px;
	padding: 10px 14px;
	font-size: 15px;
	line-height: 1.5;
	transition: border-color .15s ease, box-shadow .15s ease;
}
:where(.learndash-wrapper, .mp_wrapper, .bb-meprlms, body) input:focus,
:where(.learndash-wrapper, .mp_wrapper, .bb-meprlms, body) textarea:focus,
:where(.learndash-wrapper, .mp_wrapper, .bb-meprlms, body) select:focus {
	border-color: #ff6b35;
	box-shadow: 0 0 0 3px rgba(255, 107, 53, .15);
	outline: none;
}

/* =====================================================================
   4. LD30 + LEGACY QUIZ CONFLICT FALLBACK
   The dequeue plugin removes legacy CSS, but in case a stale page load gets
   it, neutralise the legacy quiz wrappers when LD30 is active.
   ===================================================================== */

body.learndash-cpt .wpProQuiz_content {
	all: revert;  /* let LD30's .ld-quiz-* rules own this surface */
}
body.learndash-cpt .wpProQuiz_question_page {
	background: transparent;
	border: 0;
	padding: 0;
	margin: 0;
}

/* =====================================================================
   5. FOCUS MODE — kill the leaking sales-page styles
   When focus mode is on, the page should ONLY show LD content. Hide leaks.
   ===================================================================== */

body.ld-in-focus-mode .cp-wrap,
body.ld-in-focus-mode #cg-enroll-overlay,
body.ld-in-focus-mode .cgexp-popup,
body.ld-in-focus-mode .pushengage-whatsapp-widget,
body.ld-in-focus-mode .zsiq_floatmain {
	display: none !important;
}

/* =====================================================================
   6. BUDDYBOSS LD-INTEGRATION — fix card grid distortion
   Audit: bb-meprlms-frontend has 352 rules; some override LD30 grid widths.
   Lock the LMS card grid to cg-theme spec.
   ===================================================================== */

:where(.bb-meprlms .ld-course-list-items),
:where(.bb-meprlms .learndash-wrapper .ld-course-list-items) {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 24px;
}
:where(.bb-meprlms .ld-course-list-items > article) {
	width: auto;
	max-width: none;
	margin: 0;
}

/* =====================================================================
   7. GLOBAL RESET — heading line-heights
   Audit: bp-nouveau sets h1 line-height:1.1 then various inline blocks
   override to 1.2 or 50.4px. Standardise.
   ===================================================================== */

:where(.learndash-wrapper, .mp_wrapper, .bb-meprlms, .cp-wrap) h1 { line-height: 1.2; }
:where(.learndash-wrapper, .mp_wrapper, .bb-meprlms, .cp-wrap) h2 { line-height: 1.25; }
:where(.learndash-wrapper, .mp_wrapper, .bb-meprlms, .cp-wrap) h3 { line-height: 1.3; }

/* =====================================================================
   8. UNCANNY TOOLKIT FREE NEUTRALISATION
   Free version's bundle.min.css fights Pro on .uo-* selectors. The dequeue
   plugin removes Free where Pro is loaded, but in case it's not deactivated
   site-wide, kill its specificity here.
   ===================================================================== */

.uncanny-learndash-toolkit-free .uo-button,
.uncanny-learndash-toolkit-free [class^="uo-"] {
	all: revert;
}

/* =====================================================================
   9. PUSHENGAGE / ZOHO SALESIQ — keep them OUT of focus mode + lessons
   ===================================================================== */

body.single-sfwd-lessons .pushengage-whatsapp-widget,
body.single-sfwd-topic   .pushengage-whatsapp-widget,
body.single-sfwd-quiz    .pushengage-whatsapp-widget,
body.ld-in-focus-mode    .pushengage-whatsapp-widget {
	display: none !important;
}

/* =====================================================================
   10. FOCUS-MODE SIDEBAR — fix washed-out topic/lesson titles
   Audit 2026-05-01 (logged-in lesson page):
     .ld-topic-title color = rgba(255,255,255, 0.65)  ← white at 65% opacity
     .ld-lesson-item-preview-heading color = rgba(255,255,255, 0.88)
   Result: faint, low-contrast text on dark navy sidebar.
   Fix: bump to 0.95 opacity + 600 weight for clear hierarchy.
   ===================================================================== */

/* Specificity boost: use html body prefix to beat LD30's inline-style
   block (which uses .ld-focus .ld-focus-sidebar selector + !important
   and loads AFTER our external CSS — same specificity = later wins).
   html body adds (0,0,2) base, beating LD30's inline (0,3,0) cleanly. */

html body .ld-focus .ld-focus-sidebar .ld-topic-title,
html body .ld-focus-sidebar .ld-topic-title,
html body .learndash-wrapper .ld-focus-sidebar .ld-topic-title {
	color: rgba(255, 255, 255, 0.95) !important;
	font-weight: 500 !important;
	line-height: 1.4 !important;
}

html body .ld-focus .ld-focus-sidebar .ld-lesson-item-preview-heading,
html body .ld-focus-sidebar .ld-lesson-item-preview-heading,
html body .learndash-wrapper .ld-focus-sidebar .ld-lesson-item-preview-heading,
html body .ld-focus .ld-focus-sidebar .ld-lesson-title {
	color: #ffffff !important;
	font-weight: 600 !important;
	font-size: 14px !important;
}

/* Hover state — make the text + orange accent fully visible */
html body .ld-focus-sidebar .ld-table-list-item-preview:hover .ld-topic-title,
html body .ld-focus .ld-table-list-item-preview:hover .ld-topic-title {
	color: #ffffff !important;
}

/* The orange progress circle on the LEFT of each topic — keep brand orange */
.ld-focus-sidebar .ld-status-icon,
.ld-focus-sidebar .ld-icon {
	color: #ff6b35;
}

/* Currently-active topic — make it visually distinct */
html body .ld-focus-sidebar .ld-table-list-item.ld-is-current-item .ld-topic-title,
html body .ld-focus-sidebar .ld-table-list-item.ld-is-current-item .ld-lesson-item-preview-heading {
	color: #ff6b35 !important;
	font-weight: 700 !important;
}

/* Sidebar separator hairlines — visible on dark navy */
html body .ld-focus-sidebar .ld-table-list-item {
	border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

/* =====================================================================
   11. SIDEBAR LIGHT-GRAY CONTAINER FIX (THE REAL DISTORTION)
   Audit 2026-05-01 (logged-in topic page):
     .ld-focus-sidebar bg = rgb(15, 23, 42) dark navy ✓
     BUT .ld-table-list.ld-topic-list (the inner topic-list wrapper) has
     bg = rgb(240, 243, 246) LIGHT GRAY — LD30's default nested-list style.
     White topic-title text on light gray = INVISIBLE.
   Fix: keep the inner topic-list dark (transparent or slightly lighter
     than parent navy) so white text remains readable.
   ===================================================================== */

html body .ld-focus-sidebar .ld-table-list.ld-topic-list,
html body .ld-focus-sidebar .ld-lesson-item-expanded.ld-expandable .ld-table-list,
html body .ld-focus-sidebar .ld-table-list-items {
	background-color: transparent !important;
}

/* The expanded-lesson container (the orange-tint highlighted block):
   keep a subtle dark-navy tint instead of the LD30 default light bg. */
html body .ld-focus-sidebar .ld-lesson-item-expanded {
	background-color: rgba(255, 255, 255, 0.04) !important;
	border-radius: 6px;
}

/* Active-lesson highlight stripe — match brand orange but on dark */
html body .ld-focus-sidebar .ld-lesson-item.ld-is-current-lesson .ld-lesson-item-preview {
	background-color: rgba(255, 107, 53, 0.18) !important;
	border-left: 3px solid #ff6b35;
}

/* Topic-row hover — needs to beat cg-bbux-ld inline rule that sets
   rgb(240, 244, 255) !important on body.single-sfwd-lessons selectors.
   Use body.single-sfwd-lessons + body.single-sfwd-topic prefix to match
   their specificity, then double-class-up to win. */
html body.single-sfwd-lessons .ld-focus-sidebar .ld-table-list-item-preview:hover,
html body.single-sfwd-topic   .ld-focus-sidebar .ld-table-list-item-preview:hover,
html body.single-sfwd-quiz    .ld-focus-sidebar .ld-table-list-item-preview:hover,
html body .ld-focus-sidebar.ld-focus-sidebar .ld-table-list-item-preview:hover,
html body .ld-focus-sidebar .ld-table-list-item:hover .ld-table-list-item-preview {
	background-color: rgba(255, 107, 53, 0.10) !important;
	border-left-color: #ff6b35 !important;
}

html body.single-sfwd-lessons .ld-focus-sidebar .ld-lesson-item:hover,
html body.single-sfwd-topic   .ld-focus-sidebar .ld-lesson-item:hover,
html body.single-sfwd-quiz    .ld-focus-sidebar .ld-lesson-item:hover,
html body .ld-focus-sidebar .ld-lesson-item:hover {
	background-color: rgba(255, 255, 255, 0.04) !important;
}

/* Kill the cg-bbux-ld inline white-hover specifically — its selectors target
   .bb-lesson-item and .ld-item-list-item :hover with light backgrounds */
html body.single-sfwd-lessons .lms-topic-sidebar-wrapper .bb-lesson-item:hover,
html body.single-sfwd-lessons .bb-single-course-sidebar .ld-item-list-item:hover,
html body .ld-focus-sidebar .bb-lesson-item:hover,
html body .ld-focus-sidebar .ld-item-list-item:hover {
	background: rgba(255, 107, 53, 0.10) !important;
	border-left-color: #ff6b35 !important;
}

/* Hover keeps text WHITE (LD30 default switches to blue rgb(35,90,243) — kill that) */
html body .ld-focus-sidebar .ld-table-list a.ld-table-list-item-preview:hover,
html body .ld-focus-sidebar .ld-table-list .ld-table-list-item .ld-table-list-title a:hover,
html body .ld-focus-sidebar .ld-table-list-item-preview:hover .ld-topic-title,
html body .ld-focus-sidebar .ld-table-list-item-preview:hover .ld-lesson-title,
html body .ld-focus-sidebar a.ld-table-list-item-preview:hover {
	color: #ffffff !important;
}

html body .ld-focus-sidebar .ld-course-navigation .ld-lesson-item-preview a.ld-lesson-item-preview-heading:hover {
	color: #ffffff !important;
}

/* ld-status-icon (the orange circle at the start of each row) — keep visible */
html body .ld-focus-sidebar .ld-status-icon,
html body .ld-focus-sidebar .ld-status {
	background-color: transparent;
	border-color: #ff6b35;
}

/* The "10 Topics  10 Quizzes" expand label was in dark slate (#1e293b) on
   light gray — also unreadable on the new dark bg. Make it light. */
html body .ld-focus-sidebar .ld-expand-text,
html body .ld-focus-sidebar .ld-text.screen-reader-text,
html body .ld-focus-sidebar .ld-lesson-item .screen-reader-text {
	color: rgba(255, 255, 255, 0.85) !important;
}

/* Lesson title (the "30 April 2026" parent heading) was at 0.88 — boost */
html body .ld-focus-sidebar .ld-lesson-title {
	color: #ffffff !important;
	font-weight: 700 !important;
}

/* =====================================================================
   12. SIDEBAR POLISH PASS — color scheme + spacing + hierarchy
   Goals: refined visual rhythm, clearer current-item indicator,
   readable type ramp, brand-consistent accents.
   ===================================================================== */

/* Sidebar gets a very subtle gradient instead of flat navy — adds depth.
   Inline rule uses .ld-focus .ld-focus-sidebar (0,2,0). Beat with (0,3,2). */
html body .ld-focus.ld-focus .ld-focus-sidebar,
html body .learndash-wrapper .ld-focus .ld-focus-sidebar,
html body .learndash-wrapper.learndash-wrapper .ld-focus .ld-focus-sidebar {
	background: linear-gradient(180deg, #0f172a 0%, #111c33 100%) !important;
	background-color: #0f172a !important;
	background-image: linear-gradient(180deg, #0f172a 0%, #111c33 100%) !important;
}

/* Topic / lesson row spacing — give items room to breathe */
html body .ld-focus-sidebar .ld-table-list-item-preview {
	padding: 12px 16px !important;
	border-radius: 0 !important;
	transition: background-color .15s ease, border-left-color .15s ease;
	border-left: 3px solid transparent;
}

/* Active topic — orange left stripe + bold orange text */
html body .ld-focus-sidebar .ld-table-list-item.ld-is-current-item .ld-table-list-item-preview,
html body .ld-focus-sidebar .ld-is-current-item.ld-table-list-item .ld-topic-row {
	background-color: rgba(255, 107, 53, 0.14) !important;
	border-left-color: #ff6b35 !important;
}
html body .ld-focus-sidebar .ld-table-list-item.ld-is-current-item .ld-topic-title,
html body .ld-focus-sidebar .ld-is-current-item .ld-topic-title {
	color: #ffba07 !important;
	font-weight: 600 !important;
}

/* Quiz items in the sidebar — distinguish with a small badge tint */
html body .ld-focus-sidebar .ld-status-quiz {
	background: rgba(255, 186, 7, 0.18);
	color: #ffba07;
}

/* Course navigation header (the "GK & Current Affairs — Daily" link) */
html body .ld-focus-sidebar .ld-course-navigation-heading,
html body .ld-focus-sidebar .ld-course-navigation-heading a {
	color: #ffffff !important;
	font-weight: 700 !important;
	letter-spacing: -0.01em;
}

/* Lesson title (parent group heading) styling.
   Inline rule uses .ld-focus .ld-focus-sidebar .ld-lesson-item-preview-heading
   = (0,3,0). Combined with deeper LD30 nesting like .learndash-wrapper
   .ld-course-navigation .ld-lesson-item.ld-is-current-lesson .ld-lesson-item-preview-heading
   = (0,4,0). Beat with (0,5,2) using .ld-focus.ld-focus duplication. */
html body.single-sfwd-lessons .learndash-wrapper .ld-focus.ld-focus .ld-focus-sidebar .ld-lesson-item .ld-lesson-item-preview-heading,
html body.single-sfwd-topic   .learndash-wrapper .ld-focus.ld-focus .ld-focus-sidebar .ld-lesson-item .ld-lesson-item-preview-heading,
html body.single-sfwd-quiz    .learndash-wrapper .ld-focus.ld-focus .ld-focus-sidebar .ld-lesson-item .ld-lesson-item-preview-heading,
html body .learndash-wrapper .ld-focus.ld-focus .ld-focus-sidebar .ld-lesson-item.ld-lesson-item .ld-lesson-item-preview-heading,
html body .ld-focus.ld-focus .ld-focus-sidebar.ld-focus-sidebar .ld-lesson-item .ld-lesson-item-preview-heading {
	color: #ffffff !important;
	font-weight: 700 !important;
	font-size: 14px !important;
	letter-spacing: -0.01em;
	opacity: 1 !important;
}

/* Currently-active LESSON gets a strong orange-left stripe + bold heading */
html body .ld-focus-sidebar .ld-lesson-item.ld-is-current-lesson .ld-lesson-item-preview {
	background-color: rgba(255, 107, 53, 0.14) !important;
	border-left: 3px solid #ff6b35 !important;
}
html body .ld-focus-sidebar .ld-lesson-item.ld-is-current-lesson .ld-lesson-item-preview-heading {
	color: #ffffff !important;
	font-weight: 800 !important;
}

/* Sidebar trigger button (collapse arrow) — clear contrast */
html body .ld-focus-sidebar-trigger {
	background-color: #ff6b35 !important;
	color: #ffffff !important;
}
html body .ld-focus-sidebar-trigger:hover {
	background-color: #ea5826 !important;
}

/* Progress / topic counter ("10 Topics | 10 Quizzes") — subtle white */
html body .ld-focus-sidebar .ld-expand-text,
html body .ld-focus-sidebar .ld-expand-text.ld-primary-color {
	color: rgba(255, 255, 255, 0.75) !important;
	font-weight: 500 !important;
}

/* Topic status circle — clear orange ring on dark, filled when complete */
html body .ld-focus-sidebar .ld-status-icon {
	background-color: transparent !important;
	border: 2px solid #ff6b35 !important;
	color: #ff6b35 !important;
}
html body .ld-focus-sidebar .ld-status-icon.ld-status-complete {
	background-color: #ff6b35 !important;
	color: #ffffff !important;
}

/* Hairline separators between rows — barely visible but adds rhythm */
html body .ld-focus-sidebar .ld-table-list-item {
	border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
}
html body .ld-focus-sidebar .ld-table-list-item:last-child {
	border-bottom: 0 !important;
}

/* Lesson list item bottom border (between groups) */
html body .ld-focus-sidebar .ld-lesson-item {
	border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
	margin-bottom: 4px;
}

/* Scrollbar styling — subtle, branded */
html body .ld-focus-sidebar::-webkit-scrollbar {
	width: 8px;
}
html body .ld-focus-sidebar::-webkit-scrollbar-track {
	background: rgba(0, 0, 0, 0.2);
}
html body .ld-focus-sidebar::-webkit-scrollbar-thumb {
	background: rgba(255, 107, 53, 0.4);
	border-radius: 4px;
}
html body .ld-focus-sidebar::-webkit-scrollbar-thumb:hover {
	background: rgba(255, 107, 53, 0.7);
}

/* End of cg-overrides.css */
