/*
 * JobReady Global Design System - Typography Overrides
 * Applies design system typography tokens to Wellearn theme
 * 
 * This file overrides the theme's default font sizes to match
 * the JobReady Global design system specifications.
 */

/* ===========================
   GLOBAL TYPOGRAPHY RESET
   =========================== */
body {
  font-family: var(--font-primary);
  font-size: var(--body-s);
  line-height: var(--body-s-line-height);
  font-weight: var(--body-s-weight);
  letter-spacing: var(--body-s-letter-spacing);
}

/* ===========================
   HEADING TYPOGRAPHY
   =========================== */
h1, .h1 {
  font-size: var(--heading-5xl);
  line-height: var(--heading-5xl-line-height);
  letter-spacing: var(--heading-5xl-letter-spacing);
  font-weight: var(--heading-5xl-weight);
}

h2, .h2 {
  font-size: var(--heading-4xl);
  line-height: var(--heading-4xl-line-height);
  letter-spacing: var(--heading-4xl-letter-spacing);
  font-weight: var(--heading-4xl-weight);
}

h3, .h3 {
  font-size: var(--heading-3xl);
  line-height: var(--heading-3xl-line-height);
  letter-spacing: var(--heading-3xl-letter-spacing);
  font-weight: var(--heading-3xl-weight);
}

h4, .h4 {
  font-size: var(--heading-2xl);
  line-height: var(--heading-2xl-line-height);
  letter-spacing: var(--heading-2xl-letter-spacing);
  font-weight: var(--heading-2xl-weight);
}

h5, .h5 {
  font-size: var(--heading-xl);
  line-height: var(--heading-xl-line-height);
  letter-spacing: var(--heading-xl-letter-spacing);
  font-weight: var(--heading-xl-weight);
}

h6, .h6 {
  font-size: var(--heading-l);
  line-height: var(--heading-l-line-height);
  letter-spacing: var(--heading-l-letter-spacing);
  font-weight: var(--heading-l-weight);
}

/* ===========================
   BODY TEXT VARIANTS
   =========================== */
.text-body-l {
  font-size: var(--body-l);
  line-height: var(--body-l-line-height);
  letter-spacing: var(--body-l-letter-spacing);
  font-weight: var(--body-l-weight);
}

.text-body-m {
  font-size: var(--body-m);
  line-height: var(--body-m-line-height);
  letter-spacing: var(--body-m-letter-spacing);
  font-weight: var(--body-m-weight);
}

.text-body-s {
  font-size: var(--body-s);
  line-height: var(--body-s-line-height);
  letter-spacing: var(--body-s-letter-spacing);
  font-weight: var(--body-s-weight);
}

.text-body-xs {
  font-size: var(--body-xs);
  line-height: var(--body-xs-line-height);
  letter-spacing: var(--body-xs-letter-spacing);
  font-weight: var(--body-xs-weight);
}

/* ===========================
   HEADING VARIANTS (CSS Classes)
   =========================== */
.heading-5xl {
  font-size: var(--heading-5xl);
  line-height: var(--heading-5xl-line-height);
  letter-spacing: var(--heading-5xl-letter-spacing);
  font-weight: var(--heading-5xl-weight);
}

.heading-4xl {
  font-size: var(--heading-4xl);
  line-height: var(--heading-4xl-line-height);
  letter-spacing: var(--heading-4xl-letter-spacing);
  font-weight: var(--heading-4xl-weight);
}

.heading-3xl {
  font-size: var(--heading-3xl);
  line-height: var(--heading-3xl-line-height);
  letter-spacing: var(--heading-3xl-letter-spacing);
  font-weight: var(--heading-3xl-weight);
}

.heading-2xl {
  font-size: var(--heading-2xl);
  line-height: var(--heading-2xl-line-height);
  letter-spacing: var(--heading-2xl-letter-spacing);
  font-weight: var(--heading-2xl-weight);
}

.heading-xl {
  font-size: var(--heading-xl);
  line-height: var(--heading-xl-line-height);
  letter-spacing: var(--heading-xl-letter-spacing);
  font-weight: var(--heading-xl-weight);
}

.heading-l {
  font-size: var(--heading-l);
  line-height: var(--heading-l-line-height);
  letter-spacing: var(--heading-l-letter-spacing);
  font-weight: var(--heading-l-weight);
}

.heading-m {
  font-size: var(--heading-m);
  line-height: var(--heading-m-line-height);
  letter-spacing: var(--heading-m-letter-spacing);
  font-weight: var(--heading-m-weight);
}

/* ===========================
   THEME-SPECIFIC OVERRIDES
   =========================== */

/* Page titles */
.page-title, 
.entry-title, 
.post-title,
.product-title,
.course-title {
  font-size: var(--heading-3xl);
  line-height: var(--heading-3xl-line-height);
  letter-spacing: var(--heading-3xl-letter-spacing);
  font-weight: var(--heading-3xl-weight);
}

/* Section titles */
.section-title,
.widget-title {
  font-size: var(--heading-2xl);
  line-height: var(--heading-2xl-line-height);
  letter-spacing: var(--heading-2xl-letter-spacing);
  font-weight: var(--heading-2xl-weight);
}

/* Card titles */
.card-title,
.course-card-title {
  font-size: var(--heading-l);
  line-height: var(--heading-l-line-height);
  letter-spacing: var(--heading-l-letter-spacing);
  font-weight: var(--heading-l-weight);
}

/* Subtitles */
.subtitle,
.card-subtitle {
  font-size: var(--heading-m);
  line-height: var(--heading-m-line-height);
  letter-spacing: var(--heading-m-letter-spacing);
  font-weight: var(--heading-m-weight);
}

/* Body text */
/* p, 
.paragraph,
.content-text {
  font-size: var(--body-s);
  line-height: var(--body-s-line-height);
  letter-spacing: var(--body-s-letter-spacing);
  font-weight: var(--body-s-weight);
} */

/* Small text */
small, 
.small,
.text-small {
  font-size: var(--body-xs);
  line-height: var(--body-xs-line-height);
  letter-spacing: var(--body-xs-letter-spacing);
  font-weight: var(--body-xs-weight);
}

/* Lead text */
.lead {
  font-size: var(--body-l);
  line-height: var(--body-l-line-height);
  letter-spacing: var(--body-l-letter-spacing);
  font-weight: var(--body-l-weight);
}

/* ===========================
   COMPONENT-SPECIFIC OVERRIDES
   =========================== */

/* Navigation */
.nav-link {
  font-size: var(--body-s);
  line-height: var(--body-s-line-height);
  font-weight: var(--font-weight-medium);
}

/* Buttons */
.btn {
  font-size: var(--body-s);
  line-height: var(--body-s-line-height);
  font-weight: var(--font-weight-medium);
}

.btn-lg {
  font-size: var(--body-m);
  line-height: var(--body-m-line-height);
}

.btn-sm {
  font-size: var(--body-xs);
  line-height: var(--body-xs-line-height);
}

/* Form elements */
label, 
.form-label {
  font-size: var(--body-s);
  line-height: var(--body-s-line-height);
  font-weight: var(--font-weight-medium);
}

.form-control,
.form-select {
  font-size: var(--body-s);
  line-height: var(--body-s-line-height);
}

/* Badges */
.badge {
  font-size: var(--body-xs);
  line-height: var(--body-xs-line-height);
  font-weight: var(--font-weight-medium);
}

/* Alerts */
.alert {
  font-size: var(--body-s);
  line-height: var(--body-s-line-height);
}

/* Cards */
.card-body {
  font-size: var(--body-s);
  line-height: var(--body-s-line-height);
}

/* Tables */
.table {
  font-size: var(--body-s);
  line-height: var(--body-s-line-height);
}

/* Blockquotes */
blockquote {
  font-size: var(--body-l);
  line-height: var(--body-l-line-height);
  font-style: italic;
}

/* Code */
code, 
kbd, 
pre, 
samp {
  font-size: var(--body-xs);
  line-height: var(--body-xs-line-height);
}

/* ===========================
   THEME COMPONENT OVERRIDES
   =========================== */

/* Course cards */
.tutor-course-card .tutor-course-title {
  font-size: var(--heading-l);
  line-height: var(--heading-l-line-height);
  font-weight: var(--heading-l-weight);
}

.tutor-course-card .tutor-course-excerpt {
  font-size: var(--body-s);
  line-height: var(--body-s-line-height);
}

/* WooCommerce */
.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product h3 {
  font-size: var(--heading-m);
  line-height: var(--heading-m-line-height);
  font-weight: var(--heading-m-weight);
}

.woocommerce ul.products li.product .price {
  font-size: var(--body-s);
  line-height: var(--body-s-line-height);
  font-weight: var(--font-weight-semibold);
}

.woocommerce .product .product_title {
  font-size: var(--heading-3xl);
  line-height: var(--heading-3xl-line-height);
  font-weight: var(--heading-3xl-weight);
}

/* Blog posts */
.blog-post .entry-title {
  font-size: var(--heading-2xl);
  line-height: var(--heading-2xl-line-height);
  font-weight: var(--heading-2xl-weight);
}

.blog-post .entry-content {
  font-size: var(--body-s);
  line-height: var(--body-s-line-height);
}

/* Footer */
.footer-widget .widget-title {
  font-size: var(--heading-l);
  line-height: var(--heading-l-line-height);
  font-weight: var(--heading-l-weight);
}

.footer-widget p,
.footer-widget li {
  font-size: var(--body-s);
  line-height: var(--body-s-line-height);
}

/* Sidebar */
.sidebar .widget-title {
  font-size: var(--heading-l);
  line-height: var(--heading-l-line-height);
  font-weight: var(--heading-l-weight);
}

.sidebar .widget {
  font-size: var(--body-s);
  line-height: var(--body-s-line-height);
}

/* ===========================
   BREADCRUMB
   =========================== */
.breadcrumb {
  font-size: var(--body-xs);
  line-height: var(--body-xs-line-height);
}

.breadcrumb-item a {
  font-size: var(--body-xs);
  line-height: var(--body-xs-line-height);
}

/* ===========================
   PAGINATION
   =========================== */
.pagination .page-link {
  font-size: var(--body-s);
  line-height: var(--body-s-line-height);
}

/* ===========================
   SEARCH FORM
   =========================== */
.search-form input[type="search"] {
  font-size: var(--body-s);
  line-height: var(--body-s-line-height);
}

/* ===========================
   COMMENT SECTION
   =========================== */
.comment-content {
  font-size: var(--body-s);
  line-height: var(--body-s-line-height);
}

.comment-author .fn {
  font-size: var(--heading-m);
  line-height: var(--heading-m-line-height);
  font-weight: var(--heading-m-weight);
}

/* ===========================
   ARCHIVE/ CATEGORY TITLES
   =========================== */
.archive-title,
.category-title,
.tag-title {
  font-size: var(--heading-3xl);
  line-height: var(--heading-3xl-line-height);
  font-weight: var(--heading-3xl-weight);
}

/* ===========================
   RESPONSIVE ADJUSTMENTS
   =========================== */

/* Tablet adjustments */
@media (max-width: 768px) {
  /* Reduce heading sizes for tablet */
  h1, .h1 {
    font-size: var(--heading-5xl);
    line-height: var(--heading-5xl-line-height);
  }
  
  h2, .h2 {
    font-size: var(--heading-4xl);
    line-height: var(--heading-4xl-line-height);
  }
  
  h3, .h3 {
    font-size: var(--heading-3xl);
    line-height: var(--heading-3xl-line-height);
  }
  
  h4, .h4 {
    font-size: var(--heading-2xl);
    line-height: var(--heading-2xl-line-height);
  }
  
  h5, .h5 {
    font-size: var(--heading-xl);
    line-height: var(--heading-xl-line-height);
  }
  
  h6, .h6 {
    font-size: var(--heading-l);
    line-height: var(--heading-l-line-height);
  }
  
  /* Reduce body text for tablet */
  .lead {
    font-size: var(--body-l);
    line-height: var(--body-l-line-height);
  }
  
  .text-body-l {
    font-size: var(--body-l);
    line-height: var(--body-l-line-height);
  }
}

/* Mobile adjustments */
@media (max-width: 576px) {
  /* Further reduce heading sizes for mobile */
  h1, .h1 {
    font-size: var(--heading-5xl);
    line-height: var(--heading-5xl-line-height);
  }
  
  h2, .h2 {
    font-size: var(--heading-4xl);
    line-height: var(--heading-4xl-line-height);
  }
  
  h3, .h3 {
    font-size: var(--heading-3xl);
    line-height: var(--heading-3xl-line-height);
  }
  
  h4, .h4 {
    font-size: var(--heading-2xl);
    line-height: var(--heading-2xl-line-height);
  }
  
  h5, .h5 {
    font-size: var(--heading-xl);
    line-height: var(--heading-xl-line-height);
  }
  
  h6, .h6 {
    font-size: var(--heading-l);
    line-height: var(--heading-l-line-height);
  }
  
  /* Reduce body text for mobile */
  body {
    font-size: var(--body-s);
    line-height: var(--body-s-line-height);
  }
  
  .lead {
    font-size: var(--body-m);
    line-height: var(--body-m-line-height);
  }
  
  .text-body-l {
    font-size: var(--body-m);
    line-height: var(--body-m-line-height);
  }
}

/* ===========================
   UTILITY CLASSES
   =========================== */
.font-primary {
  font-family: var(--font-primary);
}

.font-secondary {
  font-family: var(--font-secondary);
}

.font-bangla {
  font-family: var(--font-bangla);
}

.font-weight-regular {
  font-weight: var(--font-weight-regular);
}

.font-weight-medium {
  font-weight: var(--font-weight-medium);
}

.font-weight-semibold {
  font-weight: var(--font-weight-semibold);
}

.font-weight-bold {
  font-weight: var(--font-weight-bold);
}

/* ===========================
   PRINT STYLES
   =========================== */
@media print {
  body {
    font-size: 12pt;
    line-height: 1.4;
  }
  
  h1, .h1 {
    font-size: 24pt;
  }
  
  h2, .h2 {
    font-size: 20pt;
  }
  
  h3, .h3 {
    font-size: 18pt;
  }
  
  h4, .h4 {
    font-size: 16pt;
  }
  
  h5, .h5 {
    font-size: 14pt;
  }
  
  h6, .h6 {
    font-size: 12pt;
  }
}