/**
 * SignSafe Dark Theme - Single Source of Truth
 * Include this file and add .dark-theme to body
 */

.dark-theme {
  /* Brand */
  --primary: #0066ff;
  --primary-dark: #0052cc;
  --primary-light: #3b82f6;
  --primary-bg: rgba(0, 102, 255, 0.15);
  --primary-hover: rgba(0, 102, 255, 0.25);
  --accent: #0066ff;

  /* Semantic */
  --success: #36b37e;
  --success-light: rgba(0, 135, 90, 0.15);
  --warning: #ffab00;
  --warning-light: rgba(255, 139, 0, 0.15);
  --error: #ff5630;
  --error-light: rgba(222, 53, 11, 0.15);

  /* Surfaces */
  --bg: #0d1117;
  --bg-alt: #161b22;
  --card: #161b22;
  --card-bg: #161b22;
  --card-elevated: #21262d;

  /* Text - v18.0: WCAG 2.2 AA compliant on dark bg */
  --text: #f0f6fc;
  --text-primary: #f0f6fc;
  --text-secondary: #c9d1d9; /* 8.5:1 on #0d1117 - improved from #b1bac4 */
  --text-tertiary: #b1bac4; /* 6.3:1 on #0d1117 - was missing */
  --text-muted: #9ca3af; /* 4.6:1 on #0d1117 - was #6e7681 */
  --text-inverse: #172b4d;

  /* Borders */
  --border: #30363d;
  --border-light: #21262d;
  --border-subtle: #21262d;
  --border-strong: #484f58;

  /* Gray scale - v18.0: WCAG 2.2 AA compliant */
  --gray-50: #0d1117;
  --gray-100: #161b22;
  --gray-200: #21262d;
  --gray-300: #30363d;
  --gray-400: #9ca3af; /* 4.6:1 - muted text */
  --gray-500: #b1bac4; /* 6.3:1 - tertiary text */
  --gray-600: #c9d1d9; /* 8.5:1 - secondary text, improved from #b1bac4 */
  --gray-700: #d1d9e0; /* 10.1:1 - body text */
  --gray-800: #e6edf3; /* 12.5:1 - emphasized text */
  --gray-900: #f0f6fc; /* 14.7:1 - primary text */

  /* Shadows */
  --shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, 0.3);
  --shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.4);
  --shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.4);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.4);
  --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.5);

  /* Surface colors - enterprise.css compatibility */
  --surface-ground: #0d1117;
  --surface-card: #161b22;
  --surface-elevated: #21262d;
}

/* Nav in dark theme */
.dark-theme .nav,
.dark-theme .nav-enterprise {
  background: rgba(13, 17, 23, 0.95);
  border-color: var(--border);
}

/* Cards in dark theme */
.dark-theme .auth-card,
.dark-theme .feature-card,
.dark-theme .pricing-card,
.dark-theme .testimonial-card {
  background: var(--card);
  border-color: var(--border);
}

/* Testimonial text in dark theme - WCAG 2.2 AA compliant */
.dark-theme .testimonial-card__quote,
.dark-theme .testimonial-text {
  color: var(--text-secondary); /* 8.5:1 contrast */
}

.dark-theme .testimonial-card__author strong,
.dark-theme .testimonial-name {
  color: var(--text-primary) !important; /* 14.7:1 contrast */
}

.dark-theme .testimonial-card__author span,
.dark-theme .testimonial-role {
  color: var(--text-tertiary); /* 6.3:1 contrast */
}

/* Buttons */
.dark-theme .btn-secondary {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.2);
  color: var(--text);
}

.dark-theme .btn-secondary:hover {
  background: rgba(255, 255, 255, 0.15);
}

/* Enhanced focus states for accessibility */
.dark-theme :focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
}

/* Smooth transitions */
.dark-theme a,
.dark-theme button,
.dark-theme input,
.dark-theme .btn {
  transition: all 0.15s ease;
}

/* Better text contrast for readability */
.dark-theme p,
.dark-theme li {
  color: var(--text-secondary);
}

.dark-theme h1,
.dark-theme h2,
.dark-theme h3,
.dark-theme h4,
.dark-theme h5,
.dark-theme h6 {
  color: var(--text);
}

/* Input fields */
.dark-theme input,
.dark-theme textarea,
.dark-theme select {
  background: var(--bg-alt);
  border-color: var(--border);
  color: var(--text);
}

.dark-theme input::placeholder,
.dark-theme textarea::placeholder {
  color: var(--text-muted);
}

/* Scrollbar styling */
.dark-theme ::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

.dark-theme ::-webkit-scrollbar-track {
  background: var(--bg);
}

.dark-theme ::-webkit-scrollbar-thumb {
  background: var(--border-strong);
  border-radius: 4px;
}

.dark-theme ::-webkit-scrollbar-thumb:hover {
  background: var(--text-muted);
}