/**
 * Course Taxonomy Styles
 * Styling for course levels, topics, and taxonomy navigation
 *
 * @package EthicalHackingYouTube
 * @version 1.0.0
 */

/* ============================================
   TAXONOMY ARCHIVE PAGES
   ============================================ */

.ehc-taxonomy-archive {
  background: var(--betterdocs-bg, #0a0a0f);
}

.ehc-taxonomy-hero {
  background: var(--betterdocs-surface, #12121a) !important;
  border-bottom: 1px solid var(--betterdocs-border, #2d2d3a);
}

.ehc-taxonomy-label {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
}

/* ============================================
   TAXONOMY STATS SHORTCODE
   ============================================ */

.ehc-taxonomy-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.ehc-stat-item {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: var(--betterdocs-surface, #12121a);
  border: 1px solid var(--betterdocs-border, #2d2d3a);
  border-radius: 100px;
  color: var(--betterdocs-text-secondary, #94a3b8);
  text-decoration: none;
  font-size: 0.875rem;
  transition: all 0.2s ease;
}

.ehc-stat-item:hover {
  border-color: var(--stat-color, var(--betterdocs-primary, #00ff88));
  color: var(--stat-color, var(--betterdocs-primary, #00ff88));
  transform: translateY(-1px);
}

.ehc-stat-icon {
  font-size: 1rem;
}

.ehc-stat-name {
  font-weight: 500;
}

.ehc-stat-count {
  background: rgba(255, 255, 255, 0.1);
  padding: 0.125rem 0.5rem;
  border-radius: 100px;
  font-size: 0.75rem;
  font-weight: 600;
}

/* ============================================
   TOPIC GRID SHORTCODE
   ============================================ */

.ehc-topic-grid {
  display: grid;
  grid-template-columns: repeat(var(--columns, 3), 1fr);
  gap: 1rem;
}

@media (max-width: 991px) {
  .ehc-topic-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 576px) {
  .ehc-topic-grid {
    grid-template-columns: 1fr;
  }
}

.ehc-topic-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 1.5rem 1rem;
  background: var(--betterdocs-surface, #12121a);
  border: 1px solid var(--betterdocs-border, #2d2d3a);
  border-radius: 12px;
  text-decoration: none;
  transition: all 0.3s ease;
}

.ehc-topic-card:hover {
  border-color: var(--topic-color, var(--betterdocs-primary, #00ff88));
  box-shadow: 0 0 20px rgba(0, 255, 136, 0.1);
  transform: translateY(-3px);
}

.ehc-topic-icon {
  font-size: 2rem;
  margin-bottom: 0.75rem;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  background: linear-gradient(135deg, rgba(0, 255, 136, 0.1), rgba(0, 212, 255, 0.1));
  border-radius: 12px;
}

.ehc-topic-card:hover .ehc-topic-icon {
  background: linear-gradient(135deg, var(--topic-color, #00ff88), rgba(0, 212, 255, 0.5));
}

.ehc-topic-name {
  font-size: 1rem;
  font-weight: 600;
  color: var(--betterdocs-text, #f8fafc);
  margin-bottom: 0.25rem;
}

.ehc-topic-count {
  font-size: 0.8125rem;
  color: var(--betterdocs-text-muted, #64748b);
}

.ehc-topic-desc {
  font-size: 0.8125rem;
  color: var(--betterdocs-text-secondary, #94a3b8);
  margin-top: 0.5rem;
  line-height: 1.4;
}

/* ============================================
   COURSE LEVELS OVERVIEW
   ============================================ */

.ehc-levels-overview {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
}

.ehc-level-card {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem 1.5rem;
  background: var(--betterdocs-surface, #12121a);
  border: 1px solid var(--betterdocs-border, #2d2d3a);
  border-radius: 12px;
  text-decoration: none;
  transition: all 0.3s ease;
  min-width: 200px;
}

.ehc-level-card:hover {
  border-color: var(--betterdocs-primary, #00ff88);
  background: var(--betterdocs-surface-hover, #1a1a24);
  transform: translateY(-2px);
}

.ehc-level-icon {
  font-size: 2rem;
  flex-shrink: 0;
}

.ehc-level-info {
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
}

.ehc-level-name {
  font-size: 1rem;
  font-weight: 600;
  color: var(--betterdocs-text, #f8fafc);
}

.ehc-level-duration {
  font-size: 0.8125rem;
  color: var(--betterdocs-primary, #00ff88);
}

.ehc-level-count {
  font-size: 0.75rem;
  color: var(--betterdocs-text-muted, #64748b);
}

/* ============================================
   COURSE CARDS
   ============================================ */

.ehc-course-card {
  background: var(--betterdocs-surface, #12121a) !important;
  border: 1px solid var(--betterdocs-border, #2d2d3a) !important;
  transition: all 0.3s ease !important;
}

.ehc-course-card:hover {
  border-color: var(--betterdocs-primary, #00ff88) !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3) !important;
  transform: translateY(-4px);
}

.ehc-course-card .wp-block-post-title a {
  color: var(--betterdocs-text, #f8fafc);
  text-decoration: none;
  transition: color 0.2s ease;
}

.ehc-course-card .wp-block-post-title a:hover {
  color: var(--betterdocs-primary, #00ff88);
}

.ehc-course-card .wp-block-post-excerpt {
  color: var(--betterdocs-text-secondary, #94a3b8);
}

.ehc-course-card .wp-block-post-terms a {
  text-decoration: none;
  padding: 0.25rem 0.5rem;
  background: rgba(0, 255, 136, 0.1);
  border-radius: 4px;
  transition: all 0.2s ease;
}

.ehc-course-card .wp-block-post-terms a:hover {
  background: rgba(0, 255, 136, 0.2);
}

.ehc-course-card .wp-block-read-more {
  text-decoration: none;
  transition: all 0.2s ease;
}

.ehc-course-card .wp-block-read-more:hover {
  transform: translateX(4px);
}

/* ============================================
   FILTER BAR
   ============================================ */

.ehc-filter-bar {
  background: var(--betterdocs-surface, #12121a) !important;
}

.ehc-filter-bar .ehc-taxonomy-stats {
  gap: 0.5rem;
}

.ehc-filter-bar .ehc-stat-item {
  padding: 0.375rem 0.75rem;
  font-size: 0.8125rem;
}

/* ============================================
   RELATED TOPICS SECTION
   ============================================ */

.ehc-related-topics {
  background: var(--betterdocs-surface, #12121a) !important;
}

.ehc-related-topics .ehc-topic-grid {
  grid-template-columns: repeat(4, 1fr);
}

@media (max-width: 991px) {
  .ehc-related-topics .ehc-topic-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 576px) {
  .ehc-related-topics .ehc-topic-grid {
    grid-template-columns: 1fr;
  }
}

/* ============================================
   CERTIFICATION BADGES
   ============================================ */

.ehc-cert-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.375rem 0.75rem;
  background: linear-gradient(135deg, rgba(255, 107, 53, 0.1), rgba(255, 107, 53, 0.2));
  border: 1px solid rgba(255, 107, 53, 0.3);
  border-radius: 6px;
  color: #ff6b35;
  font-size: 0.75rem;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.2s ease;
}

.ehc-cert-badge:hover {
  background: rgba(255, 107, 53, 0.2);
  border-color: #ff6b35;
  transform: scale(1.02);
}

/* ============================================
   SKILL LEVEL INDICATORS
   ============================================ */

.ehc-skill-indicator {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
}

.ehc-skill-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--betterdocs-border, #2d2d3a);
}

.ehc-skill-indicator[data-level="beginner"] .ehc-skill-dot:nth-child(1) {
  background: #22c55e;
}

.ehc-skill-indicator[data-level="intermediate"] .ehc-skill-dot:nth-child(1),
.ehc-skill-indicator[data-level="intermediate"] .ehc-skill-dot:nth-child(2) {
  background: #eab308;
}

.ehc-skill-indicator[data-level="advanced"] .ehc-skill-dot:nth-child(1),
.ehc-skill-indicator[data-level="advanced"] .ehc-skill-dot:nth-child(2),
.ehc-skill-indicator[data-level="advanced"] .ehc-skill-dot:nth-child(3) {
  background: #f97316;
}

.ehc-skill-indicator[data-level="expert"] .ehc-skill-dot {
  background: #ef4444;
}

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

@media (max-width: 767px) {
  .ehc-taxonomy-hero {
    padding: 2rem 1rem !important;
  }

  .ehc-taxonomy-hero .wp-block-group {
    flex-direction: column;
    gap: 1.5rem;
  }

  .ehc-levels-overview {
    flex-direction: column;
  }

  .ehc-level-card {
    width: 100%;
    min-width: auto;
  }

  .ehc-filter-bar {
    padding: 1rem !important;
  }

  .ehc-filter-bar .wp-block-group {
    flex-direction: column;
    gap: 1rem;
    align-items: flex-start;
  }
}

/* ============================================
   DARK MODE FORCE
   ============================================ */

body.tax-course_level,
body.tax-course_topic,
body.tax-skill_level,
body.tax-certification {
  background: var(--betterdocs-bg, #0a0a0f) !important;
}

body.tax-course_level .wp-site-blocks,
body.tax-course_topic .wp-site-blocks,
body.tax-skill_level .wp-site-blocks,
body.tax-certification .wp-site-blocks {
  background: var(--betterdocs-bg, #0a0a0f) !important;
}
