/**
 * CompanyHunter.ai Custom Theme
 * Futuristic, Modern, AI-focused Design
 * Color Scheme:
 * - Primary (Dark Navy): #162F3F
 * - Secondary (Gray-Blue): #5B6D78
 * - Accent (Teal): #287F71
 */

/* Import the base magenta theme and override colors */
@import url('magenta-theme.css');

/* Root Variables for Easy Color Management */
:root {
  --ch-primary: #162F3F;
  --ch-secondary: #5B6D78;
  --ch-accent: #287F71;
  --ch-accent-light: #2DA89A;
  --ch-dark: #0D1F2D;
  --ch-light: #F5F7FA;
  --ch-gradient-primary: linear-gradient(135deg, #162F3F 0%, #287F71 100%);
  --ch-gradient-accent: linear-gradient(135deg, #287F71 0%, #2DA89A 100%);
  --ch-shadow-sm: 0 2px 8px rgba(22, 47, 63, 0.1);
  --ch-shadow-md: 0 4px 16px rgba(22, 47, 63, 0.15);
  --ch-shadow-lg: 0 8px 32px rgba(22, 47, 63, 0.2);
  --ch-glow: 0 0 20px rgba(40, 127, 113, 0.3);
}

/* Primary Colors Override */
.btn--theme,
.btn.btn--theme {
  background: var(--ch-gradient-primary) !important;
  border-color: var(--ch-primary) !important;
  color: #fff !important;
  box-shadow: var(--ch-shadow-md);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  font-weight: 600;
  letter-spacing: 0.02em;
}

.btn--theme:hover,
.btn.btn--theme:hover {
  background: var(--ch-gradient-accent) !important;
  box-shadow: var(--ch-shadow-lg), var(--ch-glow);
  transform: translateY(-2px);
}

.hover--theme:hover {
  background: var(--ch-accent) !important;
  border-color: var(--ch-accent) !important;
}

/* Links and Navigation */
.h-link,
a.h-link {
  color: var(--ch-primary) !important;
  font-weight: 500;
  transition: all 0.3s ease;
}

.h-link:hover,
a.h-link:hover {
  color: var(--ch-accent) !important;
}

/* Global Reset to ensure no gaps */
html,
body {
  margin: 0 !important;
  padding: 0 !important;
}

/* Legacy Header Styles - Hidden (using new React Navbar) */
#header {
  display: none !important;
}

.header-wrapper {
  display: none !important;
}

/* Sections and Backgrounds */
.bg--theme,
.bg-theme {
  background: var(--ch-gradient-primary) !important;
}

.bg--accent {
  background: var(--ch-gradient-accent) !important;
}

/* Text Colors */
.theme-color,
.text--theme {
  color: var(--ch-primary) !important;
}

.text--accent {
  color: var(--ch-accent) !important;
}

.text--secondary {
  color: var(--ch-secondary) !important;
}

/* Borders and Dividers */
.border--theme {
  border-color: var(--ch-primary) !important;
}

.border--accent {
  border-color: var(--ch-accent) !important;
}

/* Cards and Content Blocks */
.card,
.content-box {
  border-radius: 12px;
  box-shadow: var(--ch-shadow-md);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.card:hover,
.content-box:hover {
  box-shadow: var(--ch-shadow-lg);
  transform: translateY(-4px);
}

/* Icons and Badges */
.icon--theme {
  color: var(--ch-accent) !important;
}

.badge--theme {
  background: var(--ch-gradient-primary);
  color: #fff;
}

/* Forms */
input:focus,
textarea:focus,
select:focus {
  border-color: var(--ch-accent) !important;
  box-shadow: 0 0 0 3px rgba(40, 127, 113, 0.1) !important;
}

/* Futuristic Accents */
.ai-glow {
  text-shadow: var(--ch-glow);
}

.gradient-text {
  background: var(--ch-gradient-accent);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.glass-effect {
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.2);
}

/* Modern Animations */
@keyframes pulse-glow {
  0%, 100% {
    box-shadow: 0 0 20px rgba(40, 127, 113, 0.3);
  }
  50% {
    box-shadow: 0 0 40px rgba(40, 127, 113, 0.6);
  }
}

.animate-pulse-glow {
  animation: pulse-glow 2s ease-in-out infinite;
}

/* Scrollbar Styling (Modern/Futuristic) */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: var(--ch-light);
}

::-webkit-scrollbar-thumb {
  background: var(--ch-secondary);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--ch-accent);
}

/* Utility Classes */
.shadow-sm-ch {
  box-shadow: var(--ch-shadow-sm) !important;
}

.shadow-md-ch {
  box-shadow: var(--ch-shadow-md) !important;
}

.shadow-lg-ch {
  box-shadow: var(--ch-shadow-lg) !important;
}

/* Mobile Responsive */
@media (max-width: 768px) {
  .card,
  .content-box {
    border-radius: 8px;
  }
  
  .btn--theme,
  .btn.btn--theme {
    font-size: 0.95em;
  }
}