/* GEO Toolbox — Brand consistency override
   Loaded AFTER style.css to align the app with geotoolbox.ai marketing site.
   Only overrides colors, fonts, and key visual tokens. No layout changes. */

/* ——— Fonts ——— */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500;600;700&family=DM+Mono:wght@400;500&display=swap');

:root {
  /* Font stacks */
  --font-sans: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'DM Mono', 'Fira Code', 'Consolas', monospace;

  /* Primary — teal to match marketing site */
  --color-primary: #115e59;
  --color-primary-light: #0f766e;

  /* Accent — teal */
  --color-accent: #0d9488;
  --color-accent-hover: #0f766e;
  --color-accent-light: #f0fdfa;

  /* Info — align with teal */
  --color-info: #0f766e;
  --color-info-bg: #f0fdfa;

  /* Geo-prefixed variables (used in tabs, links, badges) */
  --geo-primary: #0d9488;

  /* Border radius — slightly rounder for SaaS feel */
  --radius-md: 8px;
  --radius-lg: 10px;
  --radius-xl: 14px;
}

/* Body background — override hardcoded value */
body {
  background-color: #f9fafb;
}

/* ——————————————————————————————————————————————
   Hardcoded color overrides — buttons & elements
   that don't use CSS variables
   —————————————————————————————————————————————— */

/* Primary buttons (.geo-btn-primary) */
.geo-btn-primary {
  background: var(--color-accent) !important;
  color: #fff !important;
  box-shadow: 0 1px 3px rgba(13, 148, 136, 0.3), 0 1px 2px rgba(13, 148, 136, 0.2);
}
.geo-btn-primary:hover {
  background: var(--color-accent-hover) !important;
  box-shadow: 0 4px 12px rgba(13, 148, 136, 0.3), 0 2px 4px rgba(13, 148, 136, 0.15);
}

/* Citability CTA button (was #2563EB) */
.citability-cta-btn {
  background: var(--color-accent) !important;
  color: #fff !important;
}
.citability-cta-btn:hover {
  background: var(--color-accent-hover) !important;
}

/* Citability analyze button (was #1F4E79) */
#citability-analyze-btn {
  background: var(--color-primary) !important;
  color: #fff !important;
}
#citability-analyze-btn:hover:not(:disabled) {
  background: var(--color-primary-light) !important;
}
.citability-spinner {
  border-top-color: var(--color-primary) !important;
}

/* Citability paste toggle (was #2E75B6) */
.citability-paste-toggle-btn {
  background: var(--color-accent) !important;
  color: #fff !important;
}
.citability-paste-toggle-btn:hover {
  background: var(--color-accent-hover) !important;
}
.citability-benchmark-btn {
  color: var(--color-accent) !important;
  border-color: var(--color-accent) !important;
}
.citability-benchmark-btn:hover {
  background: var(--color-accent-light) !important;
}

/* Brief action buttons (was #1F4E79) */
.opp-brief-btn {
  background: var(--color-primary) !important;
  color: #fff !important;
}
.opp-brief-btn:hover {
  background: var(--color-primary-light) !important;
}

/* Brief gap/fact action links (was #0369a1) */
.brief-gap-action,
.brief-fact-action {
  color: var(--color-accent) !important;
}

/* Crawler primary button (was #4338ca indigo) */
.btn-crawler-primary {
  background: var(--color-accent) !important;
  color: #fff !important;
}
.btn-crawler-primary:hover:not(:disabled) {
  background: var(--color-accent-hover) !important;
}

/* GSC action buttons (was #1E3A8A) */
.gsc-action-btn {
  border-color: var(--color-primary) !important;
  color: var(--color-primary) !important;
}
.gsc-action-btn:hover {
  background: var(--color-primary) !important;
  color: #fff !important;
}

/* GSC GEO CTA button (was #1E3A8A) */
.gsc-geo-cta-btn {
  background: var(--color-primary) !important;
  color: #fff !important;
}
.gsc-geo-cta-btn:hover {
  background: var(--color-primary-light) !important;
}

/* Overview gap toggle (was #1E3A8A) */
.ov-gap-toggle--active {
  background: var(--color-primary) !important;
  color: #fff !important;
  border-color: var(--color-primary) !important;
}

/* Brief mode active button (uses var with #1E3A8A fallback — force override) */
.brief-mode-btn.active {
  background: var(--color-primary) !important;
  color: #fff !important;
  border-color: var(--color-primary) !important;
}

/* Cited text highlight (was rgba blue) */
.hl-cited {
  background: rgba(13, 148, 136, 0.08) !important;
  color: var(--color-accent) !important;
}

/* Brief draft input focus ring */
#brief-draft-input:focus {
  border-color: var(--color-primary) !important;
  box-shadow: 0 0 0 3px rgba(13, 148, 136, 0.1) !important;
}

/* Scan history pagination active */
.scan-history-pagination button.active {
  background: var(--color-primary) !important;
  color: #fff !important;
  border-color: var(--color-primary) !important;
}

/* Main submit button — Generate Brief, Run Scan, etc (was #2563eb) */
.geo-submit-btn {
  background: var(--color-accent) !important;
  color: #fff !important;
}
.geo-submit-btn:hover {
  background: var(--color-accent-hover) !important;
  box-shadow: 0 2px 8px rgba(13, 148, 136, 0.3) !important;
}

/* ——— Global: force white text on ALL accent/primary bg buttons ——— */
.geo-btn-primary,
.geo-btn-primary:disabled,
.geo-btn-primary.geo-btn-sm,
.geo-submit-btn,
.geo-submit-btn:disabled,
.geo-btn-export-email,
[class*="btn-primary"],
[class*="cta-btn"] {
  color: #fff !important;
}

/* ——— Dark mode ——— */
html[data-theme="dark"] {
  --color-primary: #5eead4;
  --color-primary-light: #2dd4bf;
  --color-accent: #14b8a6;
  --color-accent-hover: #2dd4bf;
  --color-accent-light: #042f2e;
  --color-info: #2dd4bf;
  --color-info-bg: #042f2e;
  --geo-primary: #14b8a6;
}

html[data-theme="dark"] .geo-btn-primary {
  box-shadow: 0 1px 3px rgba(20, 184, 166, 0.3), 0 1px 2px rgba(20, 184, 166, 0.2);
}
html[data-theme="dark"] .geo-btn-primary:hover {
  box-shadow: 0 4px 12px rgba(20, 184, 166, 0.3), 0 2px 4px rgba(20, 184, 166, 0.15);
}

/* Dark mode: buttons with dark text on teal need white text */
html[data-theme="dark"] .gsc-action-btn {
  border-color: var(--color-accent) !important;
  color: var(--color-accent) !important;
}
html[data-theme="dark"] .gsc-action-btn:hover {
  background: var(--color-accent) !important;
  color: #0f172a !important;
}