/* ==========================================================================
   Design tokens — The Alpha Picks frontend
   Source: extracted from coreluxreview.com's own theme (css/app.css),
   the operator's existing coupon site, so the new brand ("The Alpha Picks")
   inherits the same verified color/type/spacing system.
   ========================================================================== */

:root {
  /* Brand */
  --color-primary: #019a04;
  --color-primary-dark: #095400;
  --color-primary-light: #e8f6e8;

  /* Text */
  --color-heading: #232323;
  --color-text: #404040;
  --color-text-muted: #8a8a8a;
  --color-text-muted-2: #636363;
  --color-text-inverse: #ffffff;

  /* Surfaces */
  --color-bg: #f5f5f5;
  --color-surface: #ffffff;
  --color-border: #e7e7e7;
  --color-border-strong: #dee2e6;

  /* Feedback / secondary accents */
  --color-warning-bg: #fef5e2;
  --color-warning-text: #faaf19;
  --color-danger: #dc3545;

  /* Footer (dark background — needs its own light-on-dark text scale) */
  --color-footer-text: #d9d9d9;
  --color-footer-text-muted: #a3a3a3;
  --color-footer-link: #b3b3b3;
  --color-footer-border: #3a3a3a;

  /* Typography — single family for headings and body, matching the source theme */
  --font-family: "Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-heading: var(--font-family);
  --font-body: var(--font-family);

  /* Radius */
  --radius-sm: 4px;
  --radius-md: 5px;
  --radius-pill: 999px;
  --radius-circle: 50%;

  /* Shadow */
  --shadow-card: 0 6px 16px 0 rgba(0, 0, 0, 0.07);
  --shadow-card-sm: 0 2px 5px 0 rgba(0, 0, 0, 0.22);

  /* Spacing scale (4px base, matches the 10/15/20/24px paddings in the source theme) */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 48px;

  /* Layout */
  --container-width: 1140px;
}