/* GSoftly — CSS Custom Properties */

:root {
  /* Brand Colors */
  --primary-color:      #2596be;
  --primary-light:      #3ab6de;
  --primary-dark:       #1a7399;
  --secondary-color:    rgba(37, 150, 190, 0.25);
  --secondary-solid:    #e8f6fb;
  --accent-color:       #0ea5e9;

  /* Backgrounds */
  --background:         #daeff7;
  --background-alt:     #f0f8fd;
  --background-dark:    #0f172a;
  --surface:            #ffffff;
  --surface-alt:        #f8fafc;

  /* Text */
  --white:              #ffffff;
  --dark:               #0f172a;
  --dark-secondary:     #1e293b;
  --gray:               #64748b;
  --gray-light:         #94a3b8;
  --gray-lighter:       #cbd5e1;
  --gray-lightest:      #f1f5f9;

  /* Gradients */
  --gradient-primary:   linear-gradient(135deg, #2596be 0%, #1a7399 100%);
  --gradient-hero:      linear-gradient(135deg, #0f172a 0%, #1e293b 50%, #0c2233 100%);
  --gradient-card:      linear-gradient(135deg, rgba(37,150,190,0.1) 0%, rgba(37,150,190,0.02) 100%);
  --gradient-cta:       linear-gradient(135deg, #2596be 0%, #0ea5e9 50%, #2596be 100%);
  --gradient-glow:      radial-gradient(circle at 50% 50%, rgba(37,150,190,0.15) 0%, transparent 70%);

  /* Glassmorphism */
  --glass-bg:           rgba(255, 255, 255, 0.08);
  --glass-bg-light:     rgba(255, 255, 255, 0.7);
  --glass-border:       rgba(255, 255, 255, 0.15);
  --glass-blur:         blur(12px);
  --glass-shadow:       0 8px 32px rgba(0, 0, 0, 0.12);

  /* Shadows */
  --shadow-xs:          0 1px 2px rgba(0,0,0,0.05);
  --shadow-sm:          0 2px 8px rgba(0,0,0,0.06);
  --shadow-md:          0 4px 16px rgba(0,0,0,0.08);
  --shadow-lg:          0 8px 32px rgba(0,0,0,0.12);
  --shadow-xl:          0 16px 48px rgba(0,0,0,0.16);
  --shadow-2xl:         0 24px 64px rgba(0,0,0,0.20);
  --shadow-primary:     0 8px 24px rgba(37,150,190,0.35);
  --shadow-primary-lg:  0 16px 40px rgba(37,150,190,0.45);
  --shadow-card-hover:  0 20px 60px rgba(37,150,190,0.25);

  /* Borders */
  --border-radius-sm:   6px;
  --border-radius:      12px;
  --border-radius-lg:   16px;
  --border-radius-xl:   24px;
  --border-radius-2xl:  32px;
  --border-radius-full: 9999px;
  --border-color:       rgba(37,150,190,0.15);
  --border-color-hover: rgba(37,150,190,0.4);

  /* Transitions */
  --transition-fast:    all 0.15s ease;
  --transition:         all 0.25s ease;
  --transition-slow:    all 0.4s ease;
  --transition-bounce:  all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  --transition-spring:  all 0.5s cubic-bezier(0.23, 1, 0.32, 1);

  /* Spacing Scale */
  --space-1:   4px;
  --space-2:   8px;
  --space-3:   12px;
  --space-4:   16px;
  --space-5:   20px;
  --space-6:   24px;
  --space-8:   32px;
  --space-10:  40px;
  --space-12:  48px;
  --space-16:  64px;
  --space-20:  80px;
  --space-24:  96px;
  --space-32: 128px;

  /* Typography */
  --font-family:     'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono:       'JetBrains Mono', 'Fira Code', 'Courier New', monospace;
  --font-size-xs:    0.75rem;   /* 12px */
  --font-size-sm:    0.875rem;  /* 14px */
  --font-size-base:  1rem;      /* 16px */
  --font-size-lg:    1.125rem;  /* 18px */
  --font-size-xl:    1.25rem;   /* 20px */
  --font-size-2xl:   1.5rem;    /* 24px */
  --font-size-3xl:   1.875rem;  /* 30px */
  --font-size-4xl:   2.25rem;   /* 36px */
  --font-size-5xl:   3rem;      /* 48px */
  --font-size-6xl:   3.75rem;   /* 60px */
  --font-size-7xl:   4.5rem;    /* 72px */
  --line-height:     1.6;
  --line-height-tight: 1.25;
  --line-height-snug:  1.4;

  /* Z-index Scale */
  --z-below:      -1;
  --z-base:        0;
  --z-raised:     10;
  --z-dropdown:   100;
  --z-sticky:     200;
  --z-overlay:    300;
  --z-modal:      400;
  --z-toast:      500;
  --z-tooltip:    600;
  --z-cursor:     99999;
  --z-loader:     100000;

  /* Navbar */
  --navbar-height: 72px;

  /* Section spacing */
  --section-py: 100px;
}

/* Dark Mode overrides */
[data-theme="dark"] {
  --background:       #0f172a;
  --background-alt:   #1e293b;
  --surface:          #1e293b;
  --surface-alt:      #263147;
  --dark:             #f8fafc;
  --dark-secondary:   #e2e8f0;
  --gray:             #94a3b8;
  --border-color:     rgba(37,150,190,0.2);
  --glass-bg:         rgba(30, 41, 59, 0.6);
  --glass-bg-light:   rgba(30, 41, 59, 0.8);
}