/* ============================================
   AgriTerra Scout — Design Tokens
   Centralised CSS custom properties.
   Keep this file as the single source of truth;
   individual page <style> blocks should NOT
   redefine these variables.
   ============================================ */

:root {
  /* ---- Brand colours ---- */
  --brand-green: #27ae60;
  --brand-green-hover: #219150;
  --dark-slate: #2c3e50;
  --dark-slate-hover: #1a252f;
  --accent: #2980b9;

  /* ---- Text colours ---- */
  --text-primary: #333;
  --text-secondary: #4a5568;
  --text-muted: #475569;
  --text-light: #475569;

  /* ---- Borders ---- */
  --border: #cbd5e0;
  --border-light: #e2e8f0;

  /* ---- Backgrounds ---- */
  --bg-page: #f4f7f6;
  --bg-surface: #ffffff;
  --bg-subtle: #f8fafc;
  --bg-sidebar: #f8f9fa;

  /* ---- Feedback / status ---- */
  --success: #059669;
  --success-bg: #d1fae5;
  --warning: #f59e0b;
  --warning-bg: #fef9c3;
  --error: #e74c3c;
  --error-bg: #fee2e2;

  /* ---- Domain colours ---- */
  --solar: #f1c40f;
  --wind: #3498db;
  --water: #2980b9;
  --soil: #8b5e3c;
  --conservation: #27ae60;

  /* ---- Spacing (8 px base grid) ---- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 40px;
  --space-8: 48px;

  /* ---- Border radius ---- */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 12px;
  --radius-pill: 20px;

  /* ---- Shadows ---- */
  --shadow-sm: 0 2px 5px rgba(0, 0, 0, 0.05);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.1);
  --shadow-lg: 0 20px 60px rgba(0, 0, 0, 0.3);

  /* ---- Typography ---- */
  --font-family: 'Segoe UI', system-ui, sans-serif;
  --text-xs: 0.72rem;
  --text-sm: 0.82rem;
  --text-base: 0.9rem;
  --text-md: 0.95rem;
  --text-lg: 1.1rem;
  --text-xl: 1.3rem;
  --text-2xl: 1.6rem;
  --text-3xl: 2rem;
}

/* ---- Focus indicator ---- */
:focus-visible {
  outline: 2px solid var(--brand-green);
  outline-offset: 2px;
}

/* ---- Skip link ---- */
.skip-link {
  position: absolute;
  top: -100%;
  left: 16px;
  background: var(--brand-green);
  color: #fff;
  padding: 8px 16px;
  border-radius: 0 0 6px 6px;
  font-size: 0.85rem;
  font-weight: 600;
  text-decoration: none;
  z-index: 10000;
  transition: top 0.15s;
}
.skip-link:focus {
  top: 0;
}

/* ---- Skeleton loading placeholders ---- */
.skeleton-block {
  background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
  background-size: 200% 100%;
  animation: shimmer 1.5s infinite;
  border-radius: var(--radius-md);
  min-height: 80px;
}
.skeleton-text {
  height: 1em;
  width: 60%;
  background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
  background-size: 200% 100%;
  animation: shimmer 1.5s infinite;
  border-radius: 4px;
  display: inline-block;
}
@keyframes shimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* ---- PDF export mode ---- */
.pdf-mode body { background: white !important; }
.pdf-mode #downloadBtn,
.pdf-mode #printBtn,
.pdf-mode .btn-print,
.pdf-mode .bottom-cta,
.pdf-mode .skip-link,
.pdf-mode #mainNav,
.pdf-mode .dash-header,
.pdf-mode .market-strip { display: none !important; }
.pdf-mode #reportWrapper,
.pdf-mode .report-wrapper,
.pdf-mode .report-body,
.pdf-mode .main { max-width: 816px !important; margin: 0 auto; }
.pdf-mode .report-subheader,
.pdf-mode .recommendations,
.pdf-mode .summary-banner,
.pdf-mode .elig-tag,
.pdf-mode .elig-badge,
.pdf-mode .insight-box,
.pdf-mode .report-section,
.pdf-mode .scenario-quality,
.pdf-mode .premium-badge {
  -webkit-print-color-adjust: exact !important;
  print-color-adjust: exact !important;
}
.pdf-mode .report-section,
.pdf-mode .parcel-card,
.pdf-mode .scenario-card,
.pdf-mode .budget-table,
.pdf-mode .sens-table,
.pdf-mode .summary-card { box-shadow: none !important; }
