/*
Theme Name: Veritas University Academic LMS
Theme URI: https://veritas.edu/lms-theme
Author: Veritas Academic Computing Initiative
Author URI: https://veritas.edu
Description: Production-ready Academic University Learning Management System (LMS) theme. Mirrors the official Veritas University Global Campus design system with collegiate course catalog, modular curriculum builder, interactive lesson viewer, assignments, quiz engine, gradebook, degree programs, student portal, and tuition checkout.
Version: 4.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: veritas-university-lms
Tags: education, lms, university, academic, courses, lessons, elearning, gradebook
*/

:root {
  --vu-crimson: #990000;
  --vu-crimson-dark: #7a0000;
  --vu-crimson-light: #fff5f5;
  --vu-gold: #EAA812;
  --vu-gold-hover: #d8980b;
  --vu-gold-light: #fef9e7;
  --vu-dark: #2C3338;
  --vu-dark-alt: #2C2F36;
  --vu-surface: #ffffff;
  --vu-background: #f8fafc;
  --vu-border: #e2e8f0;
  --vu-text-main: #0f172a;
  --vu-text-muted: #64748b;
  --vu-radius: 0px;
  --vu-font-sans: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --vu-font-cinzel: 'Cinzel', serif;
  --vu-font-display: 'Playfair Display', Georgia, serif;
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  font-family: var(--vu-font-sans);
  background-color: var(--vu-background);
  color: var(--vu-text-main);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

a {
  color: var(--vu-crimson);
  text-decoration: none;
  transition: color 0.15s ease;
}

a:hover {
  color: var(--vu-crimson-dark);
}

.vu-container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 1.5rem;
}

/* Institutional Top Utility Bar */
.vu-topbar {
  background: #ffffff;
  color: #475569;
  border-bottom: 1px solid #e2e8f0;
  font-size: 11px;
  padding: 6px 0;
}

.vu-topbar-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.vu-topbar-left {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.vu-topbar-left a, .vu-topbar-left button {
  color: #475569;
  text-decoration: none;
  font-weight: 500;
  font-size: 11px;
  background: none;
  border: none;
  cursor: pointer;
}

.vu-topbar-left a:hover, .vu-topbar-left button:hover {
  color: var(--vu-crimson);
}

.vu-topbar-right {
  display: flex;
  align-items: center;
  gap: 0.65rem;
}

.vu-btn-req-info {
  border: 1px solid var(--vu-gold);
  background: #ffffff;
  color: #0f172a;
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  padding: 4px 10px;
  cursor: pointer;
  transition: background 0.15s ease;
}

.vu-btn-req-info:hover {
  background: var(--vu-gold-light);
}

.vu-btn-apply-now {
  background: var(--vu-gold);
  color: #0f172a;
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  padding: 5px 14px;
  cursor: pointer;
  border: none;
  transition: background 0.15s ease;
}

.vu-btn-apply-now:hover {
  background: var(--vu-gold-hover);
}

/* Institutional Main Header */
.vu-site-header {
  background: #ffffff;
  border-bottom: 1px solid #e2e8f0;
  position: sticky;
  top: 0;
  z-index: 1000;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

.vu-header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 80px;
}

.vu-brand {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  text-decoration: none;
}

.vu-brand-seal {
  width: 44px;
  height: 44px;
  background: var(--vu-crimson);
  color: var(--vu-gold);
  border: 2px solid var(--vu-gold);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--vu-font-cinzel);
  font-weight: 700;
  font-size: 1.35rem;
  letter-spacing: -1px;
}

.vu-brand-text {
  display: flex;
  flex-direction: column;
}

.vu-brand-name {
  font-family: var(--vu-font-sans);
  font-size: 1.05rem;
  font-weight: 800;
  letter-spacing: -0.2px;
  color: #0f172a;
  line-height: 1.1;
}

.vu-brand-sub {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: var(--vu-crimson);
  font-weight: 700;
  margin-top: 2px;
}

.vu-nav {
  display: flex;
  align-items: center;
  gap: 1.25rem;
}

.vu-nav a, .vu-nav button {
  color: #1e293b;
  font-size: 12px;
  font-weight: 700;
  background: none;
  border: none;
  cursor: pointer;
  padding: 6px 2px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  text-decoration: none;
  transition: color 0.15s ease;
}

.vu-nav a:hover, .vu-nav button:hover, .vu-nav a.active {
  color: var(--vu-crimson);
}

.vu-btn-portal {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border: 1px solid #cbd5e1;
  background: #ffffff;
  color: #1e293b !important;
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.15s ease;
}

.vu-btn-portal:hover {
  background: #f8fafc;
  border-color: #94a3b8;
}

/* 3-Column Micro-Banner */
.vu-micro-banner {
  background: #ffffff;
  border-bottom: 1px solid #e2e8f0;
  padding: 1.15rem 0;
  font-size: 12px;
  color: #475569;
}

.vu-micro-banner-inner {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

@media (min-width: 1024px) {
  .vu-micro-banner-inner {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }
}

.vu-micro-title {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 700;
  font-size: 14px;
  color: #0f172a;
  text-decoration: none;
  white-space: nowrap;
}

.vu-micro-title:hover {
  color: var(--vu-crimson);
}

.vu-micro-cols {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
  flex: 1;
}

@media (min-width: 768px) {
  .vu-micro-cols {
    grid-template-columns: repeat(3, 1fr);
    padding-left: 1.5rem;
    border-left: 1px solid #e2e8f0;
  }
}

/* Signature Split Hero (Angled / Diagonal Cut) */
.vu-split-hero {
  position: relative;
  width: 100%;
  overflow: hidden;
  border-bottom: 1px solid #e2e8f0;
}

.vu-split-grid {
  display: grid;
  grid-template-columns: 1fr;
  min-height: 380px;
}

@media (min-width: 1024px) {
  .vu-split-grid {
    grid-template-columns: 1fr 1fr;
  }
}

.vu-split-left {
  background: #ffffff;
  padding: 3.5rem 2rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  z-index: 10;
}

@media (min-width: 768px) {
  .vu-split-left {
    padding: 3.5rem 4rem;
  }
}

.vu-split-right {
  background: var(--vu-crimson);
  color: #ffffff;
  padding: 3.5rem 2rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  overflow: hidden;
}

@media (min-width: 768px) {
  .vu-split-right {
    padding: 3.5rem 4rem;
  }
}

@media (min-width: 1024px) {
  .vu-split-angle {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 64px;
    background: var(--vu-crimson);
    clip-path: polygon(100% 0, 100% 100%, 0% 100%);
    transform: translateX(-100%);
    pointer-events: none;
  }
}

.vu-split-title {
  font-size: 1.75rem;
  font-weight: 700;
  letter-spacing: -0.5px;
  line-height: 1.25;
  margin-bottom: 1rem;
}

.vu-split-left .vu-split-title {
  color: #0f172a;
}

.vu-split-right .vu-split-title {
  color: #ffffff;
}

.vu-split-desc {
  font-size: 0.95rem;
  line-height: 1.6;
  margin-bottom: 1.5rem;
}

.vu-split-left .vu-split-desc {
  color: #475569;
}

.vu-split-right .vu-split-desc {
  color: rgba(255, 255, 255, 0.9);
}

.vu-btn-hero {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: var(--vu-gold);
  color: #0f172a;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  padding: 14px 24px;
  border: none;
  cursor: pointer;
  transition: background 0.15s ease, box-shadow 0.15s ease;
  width: fit-content;
}

.vu-btn-hero:hover {
  background: var(--vu-gold-hover);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

/* Student Spotlight Carousel */
.vu-spotlight {
  background: #ffffff;
  padding: 4rem 0;
  border-bottom: 1px solid #e2e8f0;
  position: relative;
}

.vu-spotlight-nav-btn {
  width: 44px;
  height: 44px;
  background: #2C3338;
  color: #ffffff;
  border: 1px solid #475569;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 0.15s ease;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
}

.vu-spotlight-nav-btn:hover {
  background: #1D2327;
}

.vu-spotlight-dot {
  display: inline-block;
  cursor: pointer;
  transition: all 0.2s ease;
}

.vu-course-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.95rem;
  color: #0f172a;
  font-weight: 500;
  margin-top: auto;
  padding-top: 0.75rem;
}

.vu-course-meta .vu-course-price {
  font-weight: 800;
  color: #0f172a;
}

/* Course Catalog Hero & Directory */
.vu-catalog-hero {
  background: linear-gradient(135deg, #0f172a 0%, #1e1b4b 50%, #0f172a 100%);
  color: #ffffff;
  padding: 3.5rem 0;
  border-bottom: 3px solid var(--vu-gold);
  position: relative;
  overflow: hidden;
}

.vu-catalog-hero-inner {
  position: relative;
  z-index: 10;
  max-width: 800px;
}

.vu-catalog-hero-badge {
  display: inline-block;
  background: rgba(99, 102, 241, 0.2);
  border: 1px solid rgba(129, 140, 248, 0.3);
  color: #c7d2fe;
  padding: 4px 12px;
  font-size: 12px;
  font-weight: 600;
  margin-bottom: 1rem;
}

.vu-catalog-hero-title {
  font-family: var(--vu-font-cinzel);
  font-size: 2.25rem;
  font-weight: 700;
  margin-bottom: 0.75rem;
  letter-spacing: -0.5px;
}

.vu-catalog-hero-desc {
  color: #cbd5e1;
  font-size: 1rem;
  line-height: 1.6;
  margin-bottom: 1.25rem;
}

.vu-catalog-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 1.25rem;
  font-size: 12px;
  color: #cbd5e1;
}

/* Filter Bar */
.vu-filter-bar {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  padding: 1rem 1.25rem;
  margin: 2rem 0;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

@media (min-width: 768px) {
  .vu-filter-bar {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }
}

.vu-filter-search {
  position: relative;
  flex: 1;
}

.vu-filter-search input {
  width: 100%;
  padding: 8px 12px 8px 36px;
  border: 1px solid #cbd5e1;
  font-size: 12px;
  outline: none;
  font-family: var(--vu-font-sans);
}

.vu-filter-search input:focus {
  border-color: var(--vu-crimson);
}

.vu-filter-selects {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.vu-filter-selects select {
  padding: 8px 12px;
  border: 1px solid #cbd5e1;
  background: #ffffff;
  color: #334155;
  font-size: 12px;
  font-family: var(--vu-font-sans);
  outline: none;
}

/* Course Grid & Cards */
.vu-course-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 1.75rem;
  margin-bottom: 3.5rem;
}

.vu-course-card {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  display: flex;
  flex-direction: column;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.vu-course-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
}

.vu-course-thumb {
  position: relative;
  height: 175px;
  background-size: cover;
  background-position: center;
}

.vu-course-badge {
  position: absolute;
  top: 10px;
  left: 10px;
  background: rgba(15, 23, 42, 0.9);
  color: #ffffff;
  padding: 3px 8px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.5px;
}

.vu-course-level {
  position: absolute;
  top: 10px;
  right: 10px;
  background: var(--vu-crimson);
  color: #ffffff;
  padding: 3px 8px;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
}

.vu-course-body {
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  flex: 1;
}

.vu-course-dept {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--vu-crimson);
  letter-spacing: 0.5px;
  margin-bottom: 4px;
}

.vu-course-title {
  font-size: 1.1rem;
  font-weight: 700;
  color: #0f172a;
  line-height: 1.3;
  margin-bottom: 0.5rem;
}

.vu-course-title a {
  color: #0f172a;
  text-decoration: none;
}

.vu-course-title a:hover {
  color: var(--vu-crimson);
}

.vu-course-desc {
  font-size: 13px;
  color: #64748b;
  line-height: 1.5;
  margin-bottom: 1rem;
  flex: 1;
}

.vu-course-instructor {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 1rem;
  font-size: 12px;
  color: #475569;
}

.vu-course-instructor img {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  object-fit: cover;
  border: 1px solid #e2e8f0;
}

.vu-course-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-top: 1px solid #f1f5f9;
  padding-top: 0.75rem;
}

.vu-course-price {
  font-size: 1.05rem;
  font-weight: 800;
  color: #0f172a;
}

.vu-btn-enroll {
  background: var(--vu-gold);
  color: #0f172a;
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  padding: 6px 12px;
  border: none;
  cursor: pointer;
  text-decoration: none;
  transition: background 0.15s ease;
}

.vu-btn-enroll:hover {
  background: var(--vu-gold-hover);
  color: #0f172a;
}

/* Contact Admissions Section */
.vu-contact-section {
  background: var(--vu-dark-alt);
  color: #ffffff;
  padding: 4rem 0;
  border-top: 1px solid #475569;
}

/* Footer */
.vu-site-footer {
  background: #1D2327;
  color: #cbd5e1;
  padding: 4rem 0 2rem;
  border-top: 3px solid var(--vu-crimson);
}

.vu-footer-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 3rem;
  margin-bottom: 3rem;
}

@media (max-width: 768px) {
  .vu-footer-grid {
    grid-template-columns: 1fr;
    gap: 2rem;
  }
}

.vu-footer-bottom {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  padding-top: 1.5rem;
  display: flex;
  justify-content: space-between;
  font-size: 0.8rem;
  color: #64748b;
}

/* Course Curriculum Horizontal Line Bar (matching Institutional Current Students utility style) */
.vu-curriculum-line-bar {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  padding: 0.65rem 1rem;
  margin: 1.25rem 0 2rem;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
  transition: box-shadow 0.2s ease;
}

.vu-curriculum-line-bar:hover {
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
}

.vu-curriculum-line-bar a {
  transition: color 0.15s ease, text-decoration 0.15s ease;
}

.vu-curriculum-line-bar a:hover {
  color: var(--vu-crimson) !important;
}
