/* =========================================
   Bevo Basketball Leadership - Dark Theme
   Based on referring website aesthetic
   Professional, modern, easy on the eyes
   ========================================= */

:root {
  /* Page backgrounds - Dark navy/charcoal theme */
  --academy-bg-primary: #0a0e27;        /* Deep navy - Main background */
  --academy-bg-secondary: #151b3d;      /* Navy - Card backgrounds */
  --academy-bg-tertiary: #1e2749;       /* Lighter navy - Nested elements */
  --academy-bg-hover: rgba(30, 39, 73, 0.8);

  /* Text colors - Light on dark */
  --academy-text-primary: #ffffff;      /* White for main headings */
  --academy-text-secondary: #e8edf5;    /* Off-white for secondary */
  --academy-text-body: #c5cfe0;         /* Light blue-gray for body */
  --academy-text-muted: #8b95a8;        /* Muted blue-gray */
  --academy-text-subtle: #5a6477;       /* Subtle gray */

  /* Border colors */
  --academy-border-primary: #2a3454;
  --academy-border-secondary: #1e2749;
  --academy-border-accent: #4a90e2;

  /* Accent colors - Bright for dark backgrounds */
  --academy-accent-blue: #4a90e2;       /* Bright blue */
  --academy-accent-blue-light: #6eb5ff;
  --academy-accent-green: #4ade80;      /* Bright green */
  --academy-accent-red: #ff6b6b;        /* Bright red */
  --academy-accent-orange: #ffa94d;     /* Bright orange */
  --academy-accent-gold: #ffd93d;       /* Gold/yellow */
  --academy-accent-purple: #c084fc;     /* Purple */

  /* Table colors - Dark theme */
  --academy-table-header-bg: linear-gradient(135deg, #1e3a8a, #3b82f6);
  --academy-table-header-first: linear-gradient(135deg, #1e293b, #334155);
  --academy-table-row-odd: #1e2749;
  --academy-table-row-even: #151b3d;
  --academy-table-hover: rgba(74, 144, 226, 0.15);

  /* Special boxes - Dark theme */
  --academy-tip-bg: rgba(74, 144, 226, 0.15);
  --academy-tip-border: #4a90e2;
  --academy-warning-bg: rgba(255, 169, 77, 0.15);
  --academy-warning-border: #ffa94d;
  --academy-success-bg: rgba(74, 222, 128, 0.15);
  --academy-success-border: #4ade80;
  --academy-premium-bg: rgba(192, 132, 252, 0.15);
  --academy-premium-border: #c084fc;
}

/* ==========================================
   Global Dark Page Styling
   ========================================== */
.academy-page-dark,
.academy-page-light,
.academy-page {
  background-color: var(--academy-bg-primary);
  min-height: 100vh;
  color: var(--academy-text-body);
}

/* Default heading styles for dark theme */
.academy-page-dark h1,
.academy-page-dark h2,
.academy-page-dark h3,
.academy-page-dark h4,
.academy-page-dark h5,
.academy-page-dark h6 {
  color: var(--academy-text-primary);
}

.academy-page-dark h1 {
  font-weight: 700;
}

.academy-page-dark h2 {
  color: var(--academy-text-secondary);
  font-weight: 600;
}

.academy-page-dark h3 {
  color: var(--academy-text-secondary);
  font-weight: 600;
}

/* List items - better visibility */
.academy-page-dark ul li,
.academy-page-dark ol li {
  color: var(--academy-text-body);
  margin-bottom: 0.5rem;
}

.academy-page-dark ul,
.academy-page-dark ol {
  color: var(--academy-text-body);
}

/* ==========================================
   Academy Content Custom Heading Colors
   Use CSS variables from Advanced Content Styling
   ========================================== */
.academy-content h1 {
  color: var(--academy-heading-h1, var(--academy-text-primary));
}

.academy-content h2 {
  color: var(--academy-heading-h2, var(--academy-text-secondary));
}

.academy-content h3 {
  color: var(--academy-heading-h3, var(--academy-text-secondary));
}

.academy-content h4 {
  color: var(--academy-heading-h4, var(--academy-text-body));
}

.academy-content h5 {
  color: var(--academy-heading-h5, var(--academy-text-body));
}

.academy-content h6 {
  color: var(--academy-heading-h6, var(--academy-text-body));
}

.academy-content p {
  color: var(--academy-text-body-custom, var(--academy-text-body));
}

/* Custom list colors (only in academy content) */
.academy-content ul li,
.academy-content ol li {
  color: var(--academy-list-text, var(--academy-text-body));
}

.academy-content ul li::marker,
.academy-content ol li::marker {
  color: var(--academy-list-marker, var(--academy-accent-blue));
}

/* Strong/bold text - high visibility */
.academy-page-dark strong,
.academy-page-dark b {
  color: var(--academy-text-primary);
  font-weight: 700;
}

/* Custom strong color (only in academy content) */
.academy-content strong,
.academy-content b {
  color: var(--academy-text-strong, var(--academy-text-primary));
}

/* Emphasis */
.academy-page-dark em,
.academy-page-dark i {
  color: var(--academy-text-secondary);
}

/* Paragraphs */
.academy-page-dark p {
  color: var(--academy-text-body);
}

/* ==========================================
   Product Cards - Dark Theme
   ========================================== */
.academy-product-card {
  background: linear-gradient(135deg, var(--academy-bg-secondary), var(--academy-bg-tertiary));
  border: 2px solid var(--academy-border-primary);
  border-radius: 0.75rem;
  box-shadow: 0 10px 30px rgba(0,0,0,0.5);
  overflow: hidden;
  transition: all 0.3s ease;
}

.academy-product-card:hover {
  transform: scale(1.05);
  box-shadow: 0 15px 40px rgba(0,0,0,0.7);
  border-color: var(--academy-accent-blue);
}

.academy-product-card-free {
  border-color: var(--academy-accent-green);
  box-shadow: 0 0 20px rgba(74, 222, 128, 0.2);
}

.academy-product-card-premium {
  border-color: var(--academy-accent-gold);
  box-shadow: 0 0 20px rgba(255, 217, 61, 0.2);
}

.academy-product-card-subscriber {
  border-color: var(--academy-accent-blue);
  box-shadow: 0 0 20px rgba(74, 144, 226, 0.2);
}

/* ==========================================
   Typography - Dark Theme
   ========================================== */
.academy-h1 {
  color: var(--academy-text-primary);
  border-bottom: 3px solid var(--academy-accent-blue);
  padding-bottom: 12px;
  font-weight: bold;
  text-shadow: 0 2px 4px rgba(0,0,0,0.3);
}

.academy-h2 {
  color: var(--academy-accent-blue-light);
  font-weight: bold;
  text-shadow: 0 2px 4px rgba(0,0,0,0.3);
}

.academy-h3 {
  color: var(--academy-text-secondary);
  font-weight: bold;
}

.academy-h4,
.academy-h5,
.academy-h6 {
  color: var(--academy-text-body);
  font-weight: 600;
}

/* ==========================================
   Cards and Sections
   ========================================== */
.academy-card {
  background-color: var(--academy-bg-secondary);
  border: 1px solid var(--academy-border-primary);
  border-radius: 0.75rem;
  padding: 1.5rem;
  box-shadow: 0 4px 12px rgba(0,0,0,0.3);
}

.academy-card-nested {
  background-color: var(--academy-bg-tertiary);
  border: 1px solid var(--academy-border-secondary);
  border-radius: 0.5rem;
  padding: 1rem;
}

.academy-card:hover {
  background-color: var(--academy-bg-hover);
  box-shadow: 0 6px 16px rgba(0,0,0,0.4);
}

/* ==========================================
   About Section - Dark Theme
   ========================================== */
.academy-about {
  background: linear-gradient(135deg, var(--academy-bg-secondary), var(--academy-bg-tertiary));
  border: 1px solid var(--academy-border-primary);
  border-radius: 1rem;
  padding: 2.5rem;
  box-shadow: 0 8px 24px rgba(0,0,0,0.4);
}

.academy-about-text {
  color: var(--academy-text-body);
  line-height: 1.8;
}

/* ==========================================
   Tables - Dark Theme
   ========================================== */
.academy-table {
  width: 100%;
  border-collapse: collapse;
  background-color: var(--academy-bg-secondary);
  box-shadow: 0 8px 20px rgba(0,0,0,0.4);
  border-radius: 8px;
  overflow: hidden;
}

.academy-table th {
  background: var(--academy-table-header-bg) !important;
  color: #FFFFFF !important;
  font-weight: bold !important;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 15px 18px;
  text-align: center !important;
}

.academy-table th:first-child {
  background: var(--academy-table-header-first) !important;
  color: #FFFFFF !important;
}

.academy-table td {
  border: 1px solid var(--academy-border-secondary);
  padding: 15px 18px;
  text-align: center;
  color: var(--academy-text-body);
}

.academy-table tbody tr:nth-child(odd) {
  background-color: var(--academy-table-row-odd);
}

.academy-table tbody tr:nth-child(even) {
  background-color: var(--academy-table-row-even);
}

/* Custom table colors (only in academy content) */
.academy-content .academy-table th {
  background: var(--academy-table-header-bg, linear-gradient(135deg, #1e3a8a, #3b82f6)) !important;
}

.academy-content .academy-table td {
  border-color: var(--academy-table-border, var(--academy-border-secondary));
}

.academy-content .academy-table tbody tr {
  background-color: var(--academy-table-row-bg, var(--academy-table-row-odd));
}

.academy-table td:first-child {
  text-align: left;
  font-weight: 600;
  background-color: var(--academy-bg-tertiary);
  border-right: 3px solid var(--academy-accent-blue);
}

.academy-table tbody tr:nth-child(odd) {
  background-color: var(--academy-table-row-odd);
}

.academy-table tbody tr:nth-child(even) {
  background-color: var(--academy-table-row-even);
}

.academy-table tbody tr:hover {
  background-color: var(--academy-table-hover);
  box-shadow: 0 2px 8px rgba(74, 144, 226, 0.2);
  transition: all 0.2s ease;
}

/* ==========================================
   Course/Lesson Listings - Dark
   ========================================== */
.academy-course-card {
  background-color: var(--academy-bg-tertiary);
  border: 1px solid var(--academy-border-primary);
  border-radius: 0.5rem;
  padding: 1rem;
  transition: all 0.2s ease;
}

.academy-course-card:hover {
  border-color: var(--academy-accent-blue);
  background-color: var(--academy-bg-hover);
  box-shadow: 0 4px 12px rgba(74, 144, 226, 0.2);
}

.academy-course-title {
  color: var(--academy-text-primary);
  font-weight: 600;
}

.academy-course-description {
  color: var(--academy-text-body);
}

/* ==========================================
   Special Content Boxes - Dark
   ========================================== */
.academy-tip {
  background-color: var(--academy-tip-bg);
  border-left: 4px solid var(--academy-tip-border);
  padding: 15px;
  margin: 20px 0;
  border-radius: 4px;
  backdrop-filter: blur(10px);
}

.academy-warning {
  background-color: var(--academy-warning-bg);
  border-left: 4px solid var(--academy-warning-border);
  padding: 15px;
  margin: 20px 0;
  border-radius: 4px;
  backdrop-filter: blur(10px);
}

.academy-success {
  background-color: var(--academy-success-bg);
  border-left: 4px solid var(--academy-success-border);
  padding: 15px;
  margin: 20px 0;
  border-radius: 4px;
  backdrop-filter: blur(10px);
}

.academy-premium {
  background-color: var(--academy-premium-bg);
  border-left: 4px solid var(--academy-premium-border);
  padding: 15px;
  margin: 20px 0;
  border-radius: 4px;
  backdrop-filter: blur(10px);
}

/* ==========================================
   Images - Dark Theme
   ========================================== */
.academy-img {
  max-width: 85%;
  height: auto;
  display: block;
  margin: 30px auto;
  border: 3px solid var(--academy-accent-blue);
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(74, 144, 226, 0.3);
  background: var(--academy-bg-tertiary);
  padding: 15px;
}

/* ==========================================
   Links and Interactive Elements
   ========================================== */
.academy-link {
  color: var(--academy-accent-blue-light);
  transition: all 0.2s ease;
}

.academy-link:hover {
  color: #ffffff;
  text-shadow: 0 0 8px var(--academy-accent-blue);
}

.academy-lesson-link {
  color: var(--academy-accent-blue);
  transition: color 0.2s ease;
}

.academy-lesson-link:hover {
  color: var(--academy-accent-blue-light);
  text-decoration: underline;
}

/* Custom link colors (only in academy content) */
.academy-content .academy-link,
.academy-content a {
  color: var(--academy-link-color, var(--academy-accent-blue));
}

.academy-content .academy-link:hover,
.academy-content a:hover {
  color: var(--academy-link-hover, var(--academy-accent-blue-light));
}


/* ==========================================
   Pricing Cards - Dark
   ========================================== */
.academy-pricing-card {
  background-color: var(--academy-bg-secondary);
  border: 2px solid var(--academy-border-primary);
  border-radius: 0.75rem;
  padding: 1.5rem;
  box-shadow: 0 4px 16px rgba(0,0,0,0.3);
  transition: all 0.3s ease;
}

.academy-pricing-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.5);
}

.academy-pricing-card-featured {
  background: linear-gradient(135deg, rgba(74, 222, 128, 0.1), var(--academy-bg-secondary));
  border-color: var(--academy-accent-green);
  box-shadow: 0 0 24px rgba(74, 222, 128, 0.2);
}

.academy-pricing-amount {
  color: var(--academy-text-primary);
  font-size: 2.5rem;
  font-weight: bold;
  text-shadow: 0 2px 4px rgba(0,0,0,0.3);
}

/* ==========================================
   Module Accordions - Dark
   ========================================== */
.academy-module-summary {
  color: var(--academy-text-secondary);
  cursor: pointer;
  padding: 0.75rem;
  border-radius: 0.375rem;
  transition: all 0.2s ease;
}

.academy-module-summary:hover {
  background-color: var(--academy-bg-hover);
  color: var(--academy-accent-blue-light);
}

/* ==========================================
   Trust Signals
   ========================================== */
.academy-trust-signal {
  color: var(--academy-text-body);
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.academy-trust-icon-success {
  color: var(--academy-accent-green);
}

.academy-trust-icon-info {
  color: var(--academy-accent-blue);
}

.academy-trust-icon-premium {
  color: var(--academy-accent-gold);
}

/* ==========================================
   Gradients and Overlays
   ========================================== */
.academy-gradient-overlay {
  background: linear-gradient(135deg, rgba(10, 14, 39, 0.95), rgba(21, 27, 61, 0.95));
}

.academy-glass-effect {
  background: rgba(21, 27, 61, 0.6);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

/* ==========================================
   Code and Blockquotes - Custom colors only in academy content
   ========================================== */
.academy-content code,
.academy-content pre {
  background-color: var(--academy-code-bg, var(--academy-bg-tertiary));
  border-radius: 4px;
  padding: 2px 6px;
}

.academy-content pre {
  padding: 1rem;
  overflow-x: auto;
}

.academy-content blockquote {
  border-left: 4px solid var(--academy-blockquote-border, var(--academy-accent-blue));
  padding-left: 1rem;
  margin: 1rem 0;
  color: var(--academy-text-secondary);
}

/* ==========================================
   Buttons - Custom colors only in academy content
   ========================================== */
.academy-content .academy-button {
  background-color: var(--academy-button-bg, var(--academy-accent-blue));
  color: var(--academy-button-text, #ffffff);
  padding: 0.5rem 1rem;
  border-radius: 0.375rem;
  transition: all 0.2s ease;
}

.academy-content .academy-button:hover {
  opacity: 0.9;
  transform: translateY(-1px);
}

/* ==========================================
   Custom Drill/Content Classes
   ========================================== */
/* Badges for drill metadata */
.academy-content .badge {
  display: inline-block;
  padding: 0.25rem 0.75rem;
  margin: 0.25rem 0.25rem 0.25rem 0;
  border-radius: 0.375rem;
  font-size: 0.875rem;
  font-weight: 600;
  background-color: var(--academy-accent-blue);
  color: #ffffff;
}

.academy-content .badge-cat {
  background-color: var(--academy-accent-orange);
}

.academy-content .badge-time,
.academy-content .badge-target {
  background-color: var(--academy-accent-blue);
}

/* Coaching box */
.academy-content .coaching-box {
  background-color: var(--academy-tip-bg);
  border-left: 4px solid var(--academy-tip-border);
  padding: 1rem;
  margin: 1.5rem 0;
  border-radius: 0.5rem;
}

.academy-content .coaching-box h3 {
  color: var(--academy-heading-h3, var(--academy-text-secondary));
  margin-top: 0;
  margin-bottom: 0.75rem;
}

.academy-content .coaching-box ul {
  margin-bottom: 0;
}

.academy-content .coaching-box li {
  color: var(--academy-list-text, var(--academy-text-body));
  margin-bottom: 0.5rem;
}

/* Document header */
.academy-content .document-header {
  margin-bottom: 2rem;
  padding-bottom: 1rem;
  border-bottom: 2px solid var(--academy-border-primary);
}

.academy-content .document-header h1 {
  color: var(--academy-heading-h1, var(--academy-text-primary));
  margin-bottom: 0;
}

/* Curriculum list */
.academy-content .curriculum-list {
  list-style-type: disc;
  padding-left: 1.5rem;
}

.academy-content .curriculum-list li {
  color: var(--academy-list-text, var(--academy-text-body));
  margin-bottom: 0.75rem;
}

.academy-content .curriculum-list li::marker {
  color: var(--academy-list-marker, var(--academy-accent-orange));
}

/* ==========================================
   Responsive Design
   ========================================== */
@media (max-width: 768px) {
  .academy-card {
    padding: 1rem;
  }

  .academy-about {
    padding: 1.5rem;
  }

  .academy-pricing-amount {
    font-size: 2rem;
  }
}