/**
 * Design Tokens — Gasolineras MX
 * Variables CSS centralizadas para todo el theme.
 */
:root {
  /* Brand */
  --gas-orange: #f26800;
  --gas-orange-light: #f97045;
  --gas-blue: #2555c1;
  --gas-blue-dark: #1a3a6b;
  --gas-blue-light: #045dab;
  --gas-green: #0ed678;
  --gas-green-dark: #0d9d59;
  --gas-red: #ca0b00;
  --gas-yellow: #eed202;
  --gas-success: #4bb543;

  /* Neutrales */
  --gas-gray-900: #262626;
  --gas-gray-800: #333;
  --gas-gray-700: #3a3a3a;
  --gas-gray-600: #464a4f;
  --gas-gray-500: #5f7d95;
  --gas-gray-400: #607d8b;
  --gas-gray-300: #999;
  --gas-gray-200: #ccc;
  --gas-gray-100: #e9ebee;
  --gas-gray-50: #eff1f5;

  /* Backgrounds */
  --gas-bg-primary: #fff;
  --gas-bg-secondary: var(--gas-gray-50);

  /* Texto */
  --gas-text-primary: var(--gas-gray-800);
  --gas-text-secondary: rgb(106, 109, 117);
  --gas-text-muted: var(--gas-gray-600);

  /* Spacing scale */
  --gas-space-xs: 4px;
  --gas-space-sm: 8px;
  --gas-space-md: 16px;
  --gas-space-lg: 24px;
  --gas-space-xl: 32px;
  --gas-space-2xl: 48px;

  /* Border radius */
  --gas-radius-sm: 4px;
  --gas-radius-md: 8px;
  --gas-radius-lg: 18px;
  --gas-radius-full: 50%;

  /* Breakpoints (referencia, usados en media queries):
     --bp-sm: 576px;
     --bp-md: 768px;
     --bp-lg: 1024px;
     --bp-xl: 1280px;
  */

  /* Transiciones */
  --gas-transition: all 0.3s ease;
  --gas-transition-fast: all 0.15s ease;

  /* Focus ring */
  --gas-focus-ring: 0 0 0 3px rgba(37, 85, 193, 0.5);

  /* Sombras */
  --gas-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
  --gas-shadow-md: 0 4px 6px rgba(0, 0, 0, 0.07);
  --gas-shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.1);

  /* Fonts */
  --gas-font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}

/* ==========================================================================
   Shared component classes (used across multiple templates)
   ========================================================================== */

/* Page-level <main> container spacing */
.gas-page-container { margin-top: 1em }

/* AdSense ad wrapper */
.gas-ad-container { margin: 10px; text-align:center; }


/* "Pendiente" label for missing commercial names */
.commercial-pending { color: var(--gas-gray-300) }

/* Confidence percentage value in municipio table */
.confidence-value { display: block; margin-left: 46% }

/* Confidence totals stat boxes (rating) */
.conf-total-votes { background: #444 }
.conf-total-avg { background: #008000 }