/* InspectAfrica LMS UX — site-wide font + course/lesson page override
   Earlier version scoped everything to `body.learnpress`, which turned out
   not to be present on the actual live templates (course pages render via
   WooCommerce's single-product template due to the learnpress-woo-payment
   bridge; lesson pages use their own template). Applying font-family
   site-wide is more robust than guessing body classes — it can't fail to
   match, and more specific component rules below layer on top where their
   selectors do happen to match. */

:root {
  --ialu-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --ialu-primary: #1a4d3e;
  --ialu-primary-hover: #123a2e;
  --ialu-text: #1f2937;
  --ialu-muted: #6b7280;
  --ialu-border: #e5e7eb;
  --ialu-bg-soft: #f7f8f7;
}

/* Site-wide base typography — deliberately high specificity via !important
   since we don't know the active theme's own specificity, and "even just
   the font improvement" was the explicit ask. */
body,
input,
button,
select,
textarea,
p, li, span, div {
  font-family: var(--ialu-font) !important;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--ialu-font) !important;
  font-weight: 700;
  letter-spacing: -0.01em;
}

body {
  color: var(--ialu-text);
}

/* Lesson/quiz reading content: fix unexpected center-aligned body text and
   give it a comfortable reading measure + line-height. Targets any element
   whose class contains "content-item" or "lesson" — broad on purpose. */
[class*="content-item"],
[class*="lesson-content"],
[class*="course-item-content"] {
  text-align: left !important;
  font-size: 16px;
  line-height: 1.75;
  max-width: 760px;
}

[class*="content-item"] h1,
[class*="content-item"] h2,
[class*="content-item"] h3,
[class*="lesson-content"] h1,
[class*="lesson-content"] h2,
[class*="lesson-content"] h3 {
  text-align: left !important;
  margin-top: 28px;
  margin-bottom: 12px;
}

[class*="content-item"] ul,
[class*="content-item"] ol,
[class*="lesson-content"] ul,
[class*="lesson-content"] ol {
  text-align: left !important;
}

/* Curriculum / section list — LearnPress's own class names, kept as a
   progressive enhancement in case they do match on some templates. */
.curriculum-sections,
.course-curriculum {
  border: 1px solid var(--ialu-border);
  border-radius: 12px;
  overflow: hidden;
  background: #ffffff;
}

.section {
  border-bottom: 1px solid var(--ialu-border);
}

.section:last-child {
  border-bottom: none;
}

.section-header,
.section-title {
  font-weight: 600;
  font-size: 15px;
  padding: 16px 20px;
  background: var(--ialu-bg-soft);
}

.course-item {
  padding: 12px 20px;
  border-top: 1px solid var(--ialu-border);
  display: flex;
  align-items: center;
  gap: 10px;
  transition: background 0.12s ease;
}

.course-item:first-child {
  border-top: none;
}

.course-item:hover {
  background: var(--ialu-bg-soft);
}

.course-item .item-name,
.course-item .item-name a {
  font-size: 14px;
  font-weight: 500;
  color: var(--ialu-text);
}

.course-item .item-meta,
.course-item .duration,
.course-item .count-items {
  font-size: 12px;
  color: var(--ialu-muted);
}

/* Buttons — LearnPress's own "Enroll"/"Add to cart" AND WooCommerce's
   single-product "Add to cart" button, since course pages actually render
   through WooCommerce's product template. */
.lp-button,
button.lp-button,
.course-buttons .lp-button,
a.enroll-course,
a.add-to-cart,
.woocommerce div.product form.cart .button,
.woocommerce a.single_add_to_cart_button,
.woocommerce button.single_add_to_cart_button {
  font-weight: 600;
  font-size: 15px;
  background: var(--ialu-primary) !important;
  color: #ffffff !important;
  border: none;
  border-radius: 8px;
  padding: 12px 24px;
  line-height: 1.4;
  transition: background 0.15s ease;
}

.lp-button:hover,
button.lp-button:hover,
a.enroll-course:hover,
a.add-to-cart:hover,
.woocommerce div.product form.cart .button:hover,
.woocommerce a.single_add_to_cart_button:hover,
.woocommerce button.single_add_to_cart_button:hover {
  background: var(--ialu-primary-hover) !important;
  color: #ffffff !important;
}

/* Price display — LearnPress's own class + WooCommerce's single-product price */
.course-price,
.woocommerce div.product p.price,
.woocommerce div.product span.price {
  font-weight: 700;
  font-size: 20px;
  color: var(--ialu-primary);
}

/* Course tabs / meta */
.course-tabs .tabs li a {
  font-weight: 600;
  font-size: 14px;
  color: var(--ialu-muted);
}

.course-tabs .tabs li.active a {
  color: var(--ialu-primary);
}

/* Safety net: hide the comment/reply box on course pages even if the theme
   renders it regardless of comments_open() (the PHP-level fix in
   inspectafrica-lms-ux.php is the real, functional disable — this is just
   a visual backstop). */
.comments-area,
#comments,
#respond,
.comment-respond {
  display: none !important;
}