/* dark-mode.css — EB Solutions dark theme overrides
   Applied when body.ebs-dark is present or via the toggle script. */

/* Override design tokens inside the dark-mode root */
body.ebs-dark {
  --color-surface: #071020; /* surface/background */
  --color-bg: #05060A; /* page background */
  --color-neutral-900: #E6EEF8; /* text (light) */
  --color-neutral-700: #CBD5E1; /* muted text */
  --color-primary: #60A5FA;
  --color-primary-600: #2563EB;
  --color-accent: #0EA5B9;
}

body.ebs-dark, body.ebs-dark .site-content {
  background-color: var(--color-bg);
  color: var(--color-neutral-900);
}

/* Header / nav */
.ebs-site-header .navbar {
  background-color: rgba(7,18,32,0.92);
  border-bottom: 1px solid rgba(255,255,255,0.03);
}

.ebs-site-header .navbar a, .navbar-brand {
  color: var(--color-neutral-900) !important;
}

/* Hero */
.ebs-hero {
  background: linear-gradient(135deg, rgba(14,165,185,0.06), rgba(37,99,235,0.05));
  color: var(--color-neutral-900);
  padding: 4rem 0;
  /* make hero visually full-bleed while keeping content constrained */
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

.ebs-hero h1 {
  color: var(--color-neutral-900);
  font-size: 2.5rem;
}

/* Buttons */
.ebs-btn-primary, body.ebs-dark .wp-block-button__link.ebs-btn--primary {
  background-color: var(--color-primary-600) !important;
  color: var(--color-neutral-900) !important;
  border: 0;
  box-shadow: 0 6px 18px rgba(2,6,23,0.45);
}

/* Cards & groups */
.card, .wp-block-group {
  background-color: rgba(255,255,255,0.02);
  color: var(--color-neutral-900);
  border: 1px solid rgba(255,255,255,0.03);
  box-shadow: 0 8px 16px rgba(2,6,23,0.08);
}

/* Footer */
footer, .site-footer {
  background-color: rgba(7,12,20,0.95);
  color: var(--color-neutral-700);
  padding: 2rem 0;
}

/* Links */
a, .entry-title a {
  color: var(--color-primary);
}
a:hover, a:focus {
  color: var(--color-primary-600);
  text-decoration: underline;
}

/* Forms */
body.ebs-dark input, body.ebs-dark textarea, body.ebs-dark select {
  background: rgba(255,255,255,0.02);
  color: var(--color-neutral-900);
  border: 1px solid rgba(255,255,255,0.06);
}

/* Accessibility focus state */
:focus {
  outline: 3px solid rgba(99,102,241,0.18);
  outline-offset: 2px;
}

/* Dark toggle helper */
.ebs-dark-toggle {
  background: transparent;
  border: 0;
  color: var(--color-surface);
  font-size: 1rem;
  line-height: 1;
}
