/* NexousHub landing - LMS page styles.
   NOTE: the original global stylesheet defining these classes was not in the zip,
   so this file is reconstructed from the class names used by Lms.tsx. */

.lms-landing-container {
  position: relative;
  color: var(--text-secondary, rgba(255, 255, 255, 0.6));
}

.section-tag { letter-spacing: 0.12em; }

.lms-divider {
  height: 1px;
  max-width: 1100px;
  margin: 0 auto;
  background: linear-gradient(90deg, transparent, rgba(139, 92, 246, 0.3), transparent);
}

/* Hero mockup */
.lms-mockup-wrap { position: relative; }
.lms-mockup { box-shadow: 0 30px 80px rgba(0, 0, 0, 0.45), 0 0 60px rgba(139, 92, 246, 0.12); }
.mini-chart-svg { display: block; }

/* Metrics bar */
.lms-metric-item {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 20px 24px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.025);
  border: 1px solid rgba(255, 255, 255, 0.07);
  transition: all 0.3s ease;
}
.lms-metric-item:hover {
  background: rgba(139, 92, 246, 0.08);
  border-color: rgba(139, 92, 246, 0.25);
  transform: translateY(-3px);
}
.lms-metric-num {
  font-size: 1.75rem;
  font-weight: 800;
  font-family: 'Poppins', sans-serif;
  background: linear-gradient(135deg, #fff, rgba(255, 255, 255, 0.7));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
@media (max-width: 480px) {
  .metrics-bar .grid { grid-template-columns: 1fr !important; }
}

/* Feature cards */
.lms-feature-card {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 20px;
  padding: 28px;
  transition: all 0.3s ease;
}
.lms-feature-card:hover { transform: translateY(-4px); box-shadow: 0 16px 50px rgba(0, 0, 0, 0.3); }
.lms-feature-card[data-color="purple"]:hover { border-color: rgba(139, 92, 246, 0.4); }
.lms-feature-card[data-color="blue"]:hover   { border-color: rgba(79, 142, 247, 0.4); }
.lms-feature-card[data-color="cyan"]:hover   { border-color: rgba(6, 182, 212, 0.4); }

/* Dashboard chart cards */
.lms-chart-card { transition: border-color 0.3s ease; }
.lms-chart-card:hover { border-color: rgba(139, 92, 246, 0.3); }

/* Course management */
.course-item-ui { transition: all 0.2s ease; }

/* Workflow */
.lms-step-card { text-align: center; position: relative; z-index: 1; }

/* FAQ */
.lms-faq-item {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  overflow: hidden;
  align-self: start;
  transition: border-color 0.3s ease, background 0.3s ease;
}
.lms-faq-item.faq-open { border-color: rgba(139, 92, 246, 0.4); }

/* CTA */
.lms-cta-box {
  background: linear-gradient(135deg, rgba(139, 92, 246, 0.08), rgba(79, 142, 247, 0.08));
  border: 1px solid rgba(139, 92, 246, 0.2);
  border-radius: 28px;
  padding: 56px 32px;
}

@media (max-width: 480px) {
  .steps { grid-template-columns: 1fr !important; }
}

/* Light theme */
[data-theme="light"] .lms-landing-container { color: #475569; }
[data-theme="light"] .lms-landing-container .text-white { color: #0f172a; }
[data-theme="light"] .lms-metric-item,
[data-theme="light"] .lms-feature-card,
[data-theme="light"] .lms-faq-item { background: #ffffff; border-color: rgba(0, 0, 0, 0.08); box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06); }
[data-theme="light"] .lms-metric-num { background: linear-gradient(135deg, #1e293b, #334155); -webkit-background-clip: text; background-clip: text; }
[data-theme="light"] .lms-mockup .text-white { color: #fff; }