/* ============================================================
   TellTours - Design Tokens
   Mirrors Theme.ts from the frontend codebase exactly.
   ============================================================ */
:root {
  /* Brand */
  --green:        #34A160;
  --green-deep:   #247A46;
  --green-light:  #52C27F;
  --green-vivid:  #4AD082;

  /* Surfaces (dark-app palette) */
  --surface:      #0B0E11;
  --surface-alt:  #15191E;
  --card:         rgba(26, 32, 40, 0.78);
  --card-solid:   #1A2026;
  --card-border:  rgba(255, 255, 255, 0.08);
  --divider:      rgba(255, 255, 255, 0.07);

  /* Text */
  --ink:          #F5F0E8;
  --ink-mid:      #94A3B8;
  --ink-dim:      #64748B;

  /* Accent soft */
  --green-soft:   rgba(52, 161, 96, 0.18);
  --green-ghost:  rgba(52, 161, 96, 0.06);
  --green-glow:   rgba(52, 161, 96, 0.45);

  /* Gradients (from GRADIENTS in Theme.ts) */
  --grad-primary:  linear-gradient(150deg, #4AD082 0%, #34A160 55%, #1A4F2F 100%);
  --grad-sunset:   linear-gradient(150deg, #FFB678 0%, #E76F51 55%, #6A2E63 100%);
  --grad-ocean:    linear-gradient(150deg, #9CC1E6 0%, #3F6FA3 55%, #1B2D45 100%);
  --grad-forest:   linear-gradient(150deg, #7DD3A8 0%, #3F8E6E 55%, #1B3F2D 100%);
  --grad-food:     linear-gradient(150deg, #F4B860 0%, #C8552B 55%, #5A1F1F 100%);
  --grad-pro:      linear-gradient(135deg, #112E1D, #1A4F2F 60%, #34A160);

  /* Map palette (light OSM match) */
  --map-base:        #E8E2D2;
  --map-street:      #F7F1E2;
  --map-street-edge: #DDD2B8;
  --map-minor:       #EFE7D3;
  --map-building:    #DBCFB2;
  --map-water:       #AECde0;
  --map-park:        #CDDDB2;

  /* App dot (location) */
  --user-dot:     #2D7DF6;

  /* Fonts */
  --serif: 'Instrument Serif', Georgia, serif;
  --sans:  'Inter', -apple-system, BlinkMacSystemFont, sans-serif;

  /* Spacing & radii */
  --max-w:   1280px;
  --pad-x:   clamp(20px, 5vw, 80px);
  --r-card:  22px;
  --r-lg:    18px;
  --r-pill:  999px;
}