/* ============================================================
   LookingGlass — Design Tokens
   On-brand with ipgeolocation.io (light, indigo #412efa).
   Consumed by style.css and map.css. Loaded BEFORE them.
   ============================================================ */

:root {
    /* --- Brand indigo scale (anchored on #412efa) --- */
    --lg-indigo-50:  #eef0ff;
    --lg-indigo-100: #e0e3ff;
    --lg-indigo-200: #c7ccff;
    --lg-indigo-300: #a3aaff;
    --lg-indigo-400: #7b7bff;
    --lg-indigo-500: #412efa;   /* PRIMARY BRAND */
    --lg-indigo-600: #3525d6;
    --lg-indigo-700: #2a1eac;
    --lg-indigo-800: #211a85;
    --lg-indigo-900: #1a1566;

    /* --- Cool neutrals (slightly indigo-tinted) --- */
    --lg-white:    #ffffff;
    --lg-gray-25:  #fbfbfe;     /* page background */
    --lg-gray-50:  #f6f7fb;     /* subtle surface */
    --lg-gray-100: #eef0f6;     /* light borders / map dots */
    --lg-gray-200: #e2e5ee;     /* borders */
    --lg-gray-300: #cbd0dd;
    --lg-gray-400: #9aa1b4;
    --lg-gray-500: #6b7280;     /* muted text */
    --lg-gray-600: #4b5563;
    --lg-gray-700: #374151;     /* body text */
    --lg-gray-800: #1f2433;
    --lg-gray-900: #111322;     /* headings */

    /* --- Semantic latency scale (fast -> slow). Thresholds: 60/150/250 ms --- */
    --lg-rtt-fast:  #10b981;    /* < 60ms  */
    --lg-rtt-good:  #34d399;
    --lg-rtt-mid:   #f59e0b;    /* < 150ms */
    --lg-rtt-slow:  #f97316;    /* < 250ms */
    --lg-rtt-vslow: #ef4444;    /* >= 250ms */
    --lg-rtt-dead:  #9aa1b4;    /* unreachable / null */

    /* --- Status --- */
    --lg-success:    #10b981;
    --lg-success-bg: #ecfdf5;
    --lg-danger:     #ef4444;
    --lg-danger-bg:  #fef2f2;
    --lg-warning:    #f59e0b;
    --lg-warning-bg: #fffbeb;

    /* --- Semantic surface / border / text aliases --- */
    --lg-bg:            var(--lg-gray-25);
    --lg-surface:       var(--lg-white);
    --lg-surface-2:     var(--lg-gray-50);
    --lg-border:        var(--lg-gray-200);
    --lg-border-strong: var(--lg-gray-300);
    --lg-text:          var(--lg-gray-700);
    --lg-text-strong:   var(--lg-gray-900);
    --lg-text-muted:    var(--lg-gray-500);
    --lg-text-on-brand: #ffffff;

    /* --- Map-specific --- */
    --lg-map-dot:      #d6dbec;            /* land dot grid on light */
    --lg-map-dot-edge: #c7cde3;
    --lg-node:         var(--lg-indigo-500);
    --lg-node-glow:    rgba(65, 46, 250, .35);
    --lg-target:       #ff3d77;            /* hot-pink target accent */
    --lg-target-glow:  rgba(255, 61, 119, .40);

    /* --- Radius --- */
    --lg-radius-sm:   8px;
    --lg-radius:     12px;
    --lg-radius-lg:  16px;
    --lg-radius-pill: 999px;

    /* --- Shadows (soft, light theme) --- */
    --lg-shadow-sm:    0 1px 2px rgba(17, 19, 34, .05);
    --lg-shadow:       0 4px 16px rgba(17, 19, 34, .07);
    --lg-shadow-lg:    0 16px 48px rgba(17, 19, 34, .10);
    --lg-shadow-brand: 0 8px 28px rgba(65, 46, 250, .18);

    /* --- Spacing scale --- */
    --lg-s1: 4px;
    --lg-s2: 8px;
    --lg-s3: 12px;
    --lg-s4: 16px;
    --lg-s5: 24px;
    --lg-s6: 32px;
    --lg-s7: 48px;
    --lg-s8: 64px;

    /* --- Typography --- */
    --lg-font-sans: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --lg-font-data: var(--lg-font-sans);

    /* ============================================================
       Bootstrap 5 variable overrides — re-skins stock components
       (.btn-primary, links, focus rings, form controls, etc.)
       ============================================================ */
    --bs-primary: #412efa;
    --bs-primary-rgb: 65, 46, 250;
    --bs-link-color: #3525d6;
    --bs-link-color-rgb: 53, 37, 214;
    --bs-link-hover-color: #2a1eac;
    --bs-body-color: #374151;
    --bs-body-color-rgb: 55, 65, 81;
    --bs-body-bg: #fbfbfe;
    --bs-border-color: #e2e5ee;
    --bs-border-radius: 12px;
    --bs-border-radius-sm: 8px;
    --bs-border-radius-lg: 16px;
    --bs-font-sans-serif: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
    --bs-body-font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}