$skills-light-theme: (
  // Skills section colors
  skills-background: linear-gradient(135deg, #e0e7ef 0%, #bae6fd 100%),
  skills-background-pattern:
    radial-gradient(circle at 25% 25%, #3b82f6, transparent 50%),
  gradient-skills-title: linear-gradient(90deg, #1e40af, #3b82f6, #10b981),
  skills-category-bg: rgba(255, 255, 255, 0.7),
  skills-category-border: rgba(148, 163, 184, 0.2),
  skills-category-title-color: #1e293b,
  skills-skill-name-color: #334155,
  skills-skill-level-color: #64748b,
  skills-skill-percentage-color: #475569,
  skills-progress-bg: rgba(226, 232, 240, 0.8),
  // Card 1 - Web Frameworks (Blue theme - matching hero)
  skills-category-bg-primary:
    linear-gradient(
      135deg,
      rgba(239, 246, 255, 0.9),
      rgba(219, 234, 254, 0.95)
    ),
  skills-category-border-primary: rgba(59, 130, 246, 0.2),
  skills-gradient-primary:
    linear-gradient(135deg, rgba(59, 130, 246, 0.1), rgba(37, 99, 235, 0.05)),
  skills-accent-primary: #3b82f6,

  // Card 2 - Styling & Design (Green theme - matching about)
  skills-category-bg-secondary:
    linear-gradient(
      135deg,
      rgba(236, 253, 245, 0.9),
      rgba(209, 250, 229, 0.95)
    ),
  skills-category-border-secondary: rgba(16, 185, 129, 0.2),
  skills-gradient-secondary:
    linear-gradient(135deg, rgba(16, 185, 129, 0.1), rgba(5, 150, 105, 0.05)),
  skills-accent-secondary: #10b981,

  // Card 3 - Backend Development (Purple theme)
  skills-category-bg-tertiary:
    linear-gradient(
      135deg,
      rgba(245, 243, 255, 0.9),
      rgba(237, 233, 254, 0.95)
    ),
  skills-category-border-tertiary: rgba(139, 92, 246, 0.2),
  skills-gradient-tertiary:
    linear-gradient(135deg, rgba(139, 92, 246, 0.1), rgba(124, 58, 237, 0.05)),
  skills-accent-tertiary: #8b5cf6,

  // Card 4 - Development Tools (Teal theme)
  skills-category-bg-quaternary:
    linear-gradient(
      135deg,
      rgba(240, 253, 250, 0.9),
      rgba(204, 251, 241, 0.95)
    ),
  skills-category-border-quaternary: rgba(6, 182, 212, 0.2),
  skills-gradient-quaternary:
    linear-gradient(135deg, rgba(6, 182, 212, 0.1), rgba(8, 145, 178, 0.05)),
  skills-accent-quaternary: #06b6d4,

  // Card 5 - Testing & Quality (Orange theme)
  skills-category-bg-quinary:
    linear-gradient(
      135deg,
      rgba(255, 251, 235, 0.9),
      rgba(254, 243, 199, 0.95)
    ),
  skills-category-border-quinary: rgba(245, 158, 11, 0.2),
  skills-gradient-quinary:
    linear-gradient(135deg, rgba(245, 158, 11, 0.1), rgba(217, 119, 6, 0.05)),
  skills-accent-quinary: #f59e0b,

  // Card 6 - AI-Tools (Indigo theme)
  skills-category-bg-senary:
    linear-gradient(
      135deg,
      rgba(238, 242, 255, 0.9),
      rgba(224, 231, 255, 0.95)
    ),
  skills-category-border-senary: rgba(99, 102, 241, 0.2),
  skills-gradient-senary:
    linear-gradient(135deg, rgba(99, 102, 241, 0.1), rgba(79, 70, 229, 0.05)),
  skills-accent-senary: #6366f1,

  // Enhanced progress bar colors
  skills-progress-primary: linear-gradient(90deg, #3b82f6, #1d4ed8, #1e40af),
  skills-progress-secondary: linear-gradient(90deg, #10b981, #047857, #065f46),
  skills-progress-tertiary: linear-gradient(90deg, #8b5cf6, #7c3aed, #6d28d9),
  skills-progress-quaternary: linear-gradient(90deg, #06b6d4, #0891b2, #0e7490),
  skills-progress-quinary: linear-gradient(90deg, #f59e0b, #d97706, #b45309),
  skills-progress-senary: linear-gradient(90deg, #6366f1, #4f46e5, #4338ca)
);

$skills-dark-theme: (
  // Skills section colors
  skills-background: linear-gradient(135deg, #1e293b 0%, #0ea5e9 100%),
  skills-background-pattern:
    radial-gradient(circle at 25% 25%, #1e40af, transparent 50%),
  gradient-skills-title: linear-gradient(90deg, #60a5fa, #34d399, #a78bfa),
  skills-category-bg: rgba(30, 41, 55, 0.8),
  skills-category-border: rgba(71, 85, 105, 0.3),
  skills-category-title-color: #f1f5f9,
  skills-skill-name-color: #cbd5e1,
  skills-skill-level-color: #94a3b8,
  skills-skill-percentage-color: #e2e8f0,
  skills-progress-bg: rgba(51, 65, 85, 0.8),
  // Dark theme card backgrounds
  skills-category-bg-primary:
    linear-gradient(135deg, rgba(30, 58, 138, 0.4), rgba(29, 78, 216, 0.3)),
  skills-category-border-primary: rgba(96, 165, 250, 0.3),
  skills-gradient-primary:
    linear-gradient(135deg, rgba(96, 165, 250, 0.1), rgba(59, 130, 246, 0.05)),
  skills-accent-primary: #60a5fa,

  skills-category-bg-secondary:
    linear-gradient(135deg, rgba(6, 95, 70, 0.4), rgba(4, 120, 87, 0.3)),
  skills-category-border-secondary: rgba(52, 211, 153, 0.3),
  skills-gradient-secondary:
    linear-gradient(135deg, rgba(52, 211, 153, 0.1), rgba(16, 185, 129, 0.05)),
  skills-accent-secondary: #34d399,

  skills-category-bg-tertiary:
    linear-gradient(135deg, rgba(88, 28, 135, 0.4), rgba(109, 40, 217, 0.3)),
  skills-category-border-tertiary: rgba(167, 139, 250, 0.3),
  skills-gradient-tertiary:
    linear-gradient(135deg, rgba(167, 139, 250, 0.1), rgba(139, 92, 246, 0.05)),
  skills-accent-tertiary: #a78bfa,

  skills-category-bg-quaternary:
    linear-gradient(135deg, rgba(15, 118, 110, 0.4), rgba(17, 94, 89, 0.3)),
  skills-category-border-quaternary: rgba(34, 211, 238, 0.3),
  skills-gradient-quaternary:
    linear-gradient(135deg, rgba(34, 211, 238, 0.1), rgba(6, 182, 212, 0.05)),
  skills-accent-quaternary: #22d3ee,

  skills-category-bg-quinary:
    linear-gradient(135deg, rgba(180, 83, 9, 0.4), rgba(217, 119, 6, 0.3)),
  skills-category-border-quinary: rgba(251, 191, 36, 0.3),
  skills-gradient-quinary:
    linear-gradient(135deg, rgba(251, 191, 36, 0.1), rgba(245, 158, 11, 0.05)),
  skills-accent-quinary: #fbbf24,

  skills-category-bg-senary:
    linear-gradient(135deg, rgba(67, 56, 202, 0.4), rgba(79, 70, 229, 0.3)),
  skills-category-border-senary: rgba(129, 140, 248, 0.3),
  skills-gradient-senary:
    linear-gradient(135deg, rgba(129, 140, 248, 0.1), rgba(99, 102, 241, 0.05)),
  skills-accent-senary: #818cf8,

  // Enhanced progress bars for dark theme
  skills-progress-primary: linear-gradient(90deg, #60a5fa, #3b82f6, #2563eb),
  skills-progress-secondary: linear-gradient(90deg, #34d399, #10b981, #059669),
  skills-progress-tertiary: linear-gradient(90deg, #a78bfa, #8b5cf6, #7c3aed),
  skills-progress-quaternary: linear-gradient(90deg, #22d3ee, #06b6d4, #0891b2),
  skills-progress-quinary: linear-gradient(90deg, #fbbf24, #f59e0b, #d97706),
  skills-progress-senary: linear-gradient(90deg, #818cf8, #6366f1, #4f46e5)
);
