/*
  Justice-Negar Yazd — unified theme override
  Add this file AFTER style.css, rtl.css, and responsive.css.
  Keeps existing Bootstrap, Web Forms controls, RTL rules, and responsive layout.
*/
:root {
  --jn-ink: #183b35;
  --jn-ink-deep: #102d29;
  --jn-green: #2f6656;
  --jn-green-soft: #e8efe8;
  --jn-gold: #c49a52;
  --jn-gold-light: #f1dfb9;
  --jn-paper: #fbfaf6;
  --jn-surface: #ffffff;
  --jn-muted: #687771;
  --jn-line: #e5e9e2;

  /* Compatibility with existing course module variables */
  --course-primary: var(--jn-green);
  --course-primary-dark: var(--jn-ink-deep);
  --course-accent: var(--jn-gold);
  --course-success: #467b60;
  --course-danger: #b94b45;
}

html { scroll-behavior: smooth; }
body {
  color: var(--jn-ink);
  background: var(--jn-paper);
  font-family: "Vazir-FD", Tahoma, sans-serif;
}
a { color: var(--jn-green); }
a:hover, a:focus { color: var(--jn-gold); }

/* Shared typography and section headings */
h1, h2, h3, h4, h5, h6 { color: var(--jn-ink-deep); }
p { color: #586a63; }
.section-title h2 span,
.section-title.text-left .sub-title { color: var(--jn-green); }
.section-title h2 { color: var(--jn-ink-deep); }
.section-title::before { border-color: rgba(196,154,82,.4); }

/* Main buttons */
.default-btn {
  color: #fff;
  background-color: var(--jn-ink);
  border-radius: 12px;
  box-shadow: 0 8px 22px rgba(24,59,53,.12);
}
.default-btn i { color: var(--jn-gold-light); }
.default-btn span { background-color: var(--jn-green); }
.default-btn:hover, .default-btn:focus {
  color: #fff;
  box-shadow: 0 8px 24px rgba(24,59,53,.22) !important;
}
.optional-btn { color: var(--jn-ink); }
.optional-btn i { color: var(--jn-green); }
.optional-btn::before { border-color: #cbd7cd; border-radius: 12px; }
.optional-btn span { background-color: var(--jn-green); }
.optional-btn:hover::before, .optional-btn:focus::before { border-color: var(--jn-green); }

/* Header / navigation from the original Strax theme */
.navbar-area,
.navbar-area.navbar-style-two { background-color: rgba(251,250,246,.97); }
.navbar-area.is-sticky {
  background-color: rgba(255,255,255,.97) !important;
  box-shadow: 0 8px 26px rgba(16,45,41,.09);
  border-bottom: 1px solid rgba(229,233,226,.8);
}
.spacle-nav .navbar .navbar-nav .nav-item a { color: #52665d; }
.spacle-nav .navbar .navbar-nav .nav-item a:hover,
.spacle-nav .navbar .navbar-nav .nav-item a:focus,
.spacle-nav .navbar .navbar-nav .nav-item a.active { color: var(--jn-green); }
.spacle-nav .navbar .navbar-nav .nav-item a::before { background: var(--jn-gold); }
.spacle-nav .navbar .navbar-nav .nav-item .dropdown-menu {
  border: 1px solid var(--jn-line);
  border-radius: 14px;
  box-shadow: 0 18px 40px rgba(16,45,41,.12);
}
.spacle-nav .navbar .navbar-nav .nav-item .dropdown-menu li a { color: var(--jn-ink); }
.spacle-nav .navbar .navbar-nav .nav-item .dropdown-menu li a:hover { color: var(--jn-green); background: #f3f6f0; }
.spacle-responsive-nav { background: var(--jn-paper); }
.mean-container .mean-bar { background: var(--jn-ink); }
.mean-container .mean-nav { background: var(--jn-ink-deep); }

/* Hero areas and page banners */
.main-banner,
.banner-section,
.saas-banner,
.page-title-area {
  background-color: var(--jn-paper);
}
.main-banner-content .content h1,
.banner-content .content h1,
.saas-banner .hero-content h1 { color: var(--jn-ink-deep); }
.main-banner-content .content p,
.banner-content .content p,
.saas-banner .hero-content p { color: #586a63; }
.banner-image, .banner-img { background-color: #e9eee5; }
.page-title-area { color: var(--jn-ink); }
.page-title-area h2, .page-title-area h1 { color: var(--jn-ink-deep); }

/* Content cards, feature boxes, services, and article surfaces */
.single-features-box,
.features-box,
.single-services-box,
.services-box,
.single-blog-post,
.single-team-box,
.single-pricing-table,
.single-testimonials-item,
.single-feedback-item .feedback-desc,
.faq-accordion .accordion .accordion-item,
.widget-area .widget {
  border-color: var(--jn-line);
}
.single-features-box,
.features-box,
.single-services-box,
.single-blog-post .post-content,
.single-team-box .content,
.single-pricing-table,
.single-testimonials-item,
.faq-accordion .accordion .accordion-item,
.widget-area .widget {
  background-color: var(--jn-surface);
}
.features-box .icon,
.single-features-box .icon,
.feature-box i,
.services-content .content .feature-box i { color: var(--jn-green); }
.features-box .icon::before,
.single-features-box .icon::before { border-color: rgba(196,154,82,.45); }
.services-area.bg-left-color::before,
.services-area.bg-right-color::before { background-color: #edf2eb; }
.services-area.bg-left-shape::before,
.services-area.bg-right-shape::before { background-color: rgba(47,102,86,.08); }
.single-blog-post .post-content h3 a,
.single-features-box h3,
.features-box h3,
.single-pricing-table .pricing-header h3 { color: var(--jn-ink-deep); }
.single-blog-post .post-content h3 a:hover { color: var(--jn-green); }
.single-blog-post .post-image .date { background: var(--jn-green); color: #fff; }
.single-blog-post .post-content .post-info .details-btn a { background: var(--jn-green); color: #fff; }
.single-blog-post .post-content .post-info .details-btn a:hover { background: var(--jn-ink-deep); }
.single-pricing-table .pricing-header { background: #edf2eb; }
.single-pricing-table .price { color: var(--jn-green); }
.pricing-list-tab .tabs li a { background: #edf2eb; color: var(--jn-ink); }
.pricing-list-tab .tabs li a.active { background: var(--jn-ink); color: #fff; }
.faq-accordion .accordion .accordion-title { color: var(--jn-ink); }
.faq-accordion .accordion .accordion-title i { color: var(--jn-green); }

/* Form controls */
input, select, textarea, .form-control {
  border-color: #dbe2da;
  border-radius: 10px;
}
input:focus, select:focus, textarea:focus, .form-control:focus {
  border-color: var(--jn-green);
  box-shadow: 0 0 0 .2rem rgba(47,102,86,.12);
}

/* Footer */
.footer-area,
.footer-area.bg-f4f6fc,
.footer-area.bg-f8fbfa {
  background: var(--jn-ink-deep);
}
.footer-area,
.footer-area p,
.footer-area .single-footer-widget p { color: #d0dcd4; }
.footer-area h3, .footer-area h4, .footer-area h5,
.footer-area .single-footer-widget h3 { color: #fff; }
.single-footer-widget .services-list li a,
.single-footer-widget .support-list li a,
.single-footer-widget .footer-contact-info li,
.single-footer-widget .footer-contact-info li a { color: #c4d1c8; }
.single-footer-widget .services-list li a:hover,
.single-footer-widget .support-list li a:hover,
.single-footer-widget .footer-contact-info li a:hover { color: var(--jn-gold-light); }
.footer-area .social li a { background: rgba(255,255,255,.08); color: #fff; }
.footer-area .social li a:hover { background: var(--jn-green); color: #fff; }

/* Existing course module: same palette as the new home page */
.course-navbar {
  background: rgba(255,255,255,.96);
  border-bottom: 1px solid var(--jn-line);
  box-shadow: 0 6px 22px rgba(16,45,41,.06);
}
.course-navbar .navbar-nav .nav-link { color: #53675e; }
.course-navbar .navbar-nav .nav-link:hover,
.course-navbar .navbar-nav .nav-link.active { color: var(--jn-green); }
.nav-auth-btns .btn { border-radius: 12px; }
.nav-auth-btns .btn-outline-primary {
  color: var(--jn-green);
  border-color: #b8cbbd;
}
.nav-auth-btns .btn-outline-primary:hover {
  background: var(--jn-green);
  border-color: var(--jn-green);
  color: #fff;
}
.nav-auth-btns .btn-primary {
  background: var(--jn-ink);
  border-color: var(--jn-ink);
}
.nav-auth-btns .btn-primary:hover {
  background: var(--jn-green);
  border-color: var(--jn-green);
}
.course-hero {
  background: radial-gradient(circle at 10% 15%, rgba(241,223,185,.2), transparent 28%),
              linear-gradient(125deg, var(--jn-ink-deep), var(--jn-green));
}
.course-page-banner {
  background: linear-gradient(120deg, var(--jn-ink-deep), var(--jn-green));
}
.course-breadcrumb { background: #f4f5ef; border-bottom-color: var(--jn-line); }
.course-breadcrumb a { color: var(--jn-green); }
.course-content { background: var(--jn-paper); }
.course-footer {
  background: var(--jn-ink-deep);
  color: #c4d1c8;
}
.course-footer h5 { color: #fff; }
.course-footer a { color: #c4d1c8; }
.course-footer a:hover { color: var(--jn-gold-light); }
.course-footer .footer-bottom { border-top-color: rgba(255,255,255,.14); }
.go-top { background: var(--jn-green); box-shadow: 0 8px 22px rgba(24,59,53,.24); }
.go-top:hover { background: var(--jn-ink-deep); }

/* Small details / status colors */
.preloader-area { background-color: var(--jn-ink-deep); }
.pagination-area .page-numbers.current,
.pagination-area .page-numbers:hover { background: var(--jn-green); color: #fff; }
.widget-area .widget .widget-title::before { background: var(--jn-gold); }
blockquote, .blockquote { border-right-color: var(--jn-gold); }
::selection { background: var(--jn-green); color: #fff; }

@media (max-width: 767px) {
  .navbar-area, .navbar-area.navbar-style-two { background-color: rgba(251,250,246,.98); }
  .course-navbar .navbar-collapse {
    background: #fff;
    border: 1px solid var(--jn-line);
  }
}