/**
 * ====================================================================================================
 *   NIGAMA CONNECT — OFFICIAL WEB APPLICATION DESIGN SYSTEM TOKENS
 *   File: css/variables.css
 *   Architecture: CSS3 Custom Properties Design Token System
 *   Standard: Luxury Glassmorphism, Fluid Clamp Typography & Cosmic Spatial Depth
 * ====================================================================================================
 */

:root {
  /* --------------------------------------------------------------------------------------------------
   * 1. BRAND IDENTITY & EXTENDED COLOR PALETTE
   * -------------------------------------------------------------------------------------------------- */
  /* Primary Brand Cyan (Tree canopy, primary CTAs, active highlights) */
  --nc-brand-primary: #0FA3D9;
  --nc-brand-primary-rgb: 15, 163, 217;
  --nc-brand-primary-hover: #0284C7;
  --nc-brand-primary-active: #0369A1;
  --nc-brand-primary-glow: rgba(15, 163, 217, 0.35);
  --nc-brand-primary-glow-subtle: rgba(15, 163, 217, 0.15);

  /* Kinship Emerald & Growth Mint */
  --nc-brand-secondary: #10B981;
  --nc-brand-secondary-rgb: 16, 185, 129;
  --nc-brand-secondary-light: #4FD8A0;
  --nc-brand-mint: #4FD8A0;
  --nc-brand-mint-rgb: 79, 216, 160;
  --nc-brand-secondary-hover: #059669;
  --nc-brand-secondary-glow: rgba(16, 185, 129, 0.35);

  /* Sunrise Warm Orange (Panchangam, Rahu Kalam, Gotram, Festive alerts) */
  --nc-brand-accent: #FFA24D;
  --nc-brand-accent-rgb: 255, 162, 77;
  --nc-brand-accent-hover: #EA580C;
  --nc-brand-accent-glow: rgba(255, 162, 77, 0.35);

  /* Sacred Vedic Gold (Self node aura, heritage badges, sacred honors) */
  --nc-brand-gold: #F59E0B;
  --nc-brand-gold-rgb: 245, 158, 11;
  --nc-brand-gold-glow: rgba(245, 158, 11, 0.35);

  /* Royal Violet & Community Ceremonies */
  --nc-brand-purple: #8B5CF6;
  --nc-brand-purple-rgb: 139, 92, 246;
  --nc-brand-purple-glow: rgba(139, 92, 246, 0.3);

  /* Matrimony Sacred Rose */
  --nc-brand-rose: #EC4899;
  --nc-brand-rose-rgb: 236, 72, 153;
  --nc-brand-rose-glow: rgba(236, 72, 153, 0.3);

  /* --------------------------------------------------------------------------------------------------
   * 2. THEME COLORS: DARK MODE (DEFAULT)
   * -------------------------------------------------------------------------------------------------- */
  --nc-bg-main: #020617;
  --nc-bg-radial: radial-gradient(circle at 50% 0%, #0B1933 0%, #020617 80%);
  --nc-surface-card: #0B1528;
  --nc-surface-card-hover: #0F1D38;
  --nc-surface-hover: #0F1D38;
  --nc-surface-elevated: #11203B;
  --nc-surface-dock: rgba(11, 21, 40, 0.82);
  --nc-surface-glass: rgba(15, 29, 56, 0.65);
  --nc-surface-glass-active: rgba(25, 45, 85, 0.75);

  /* Text & Content Tokens */
  --nc-text-primary: #F8FAFC;
  --nc-text-secondary: #94A3B8;
  --nc-text-muted: #64748B;
  --nc-text-dim: #475569;
  --nc-text-inverse: #020617;

  /* Glass Borders & Specular Sheen */
  --nc-border-glass: rgba(255, 255, 255, 0.12);
  --nc-border-glass-subtle: rgba(255, 255, 255, 0.06);
  --nc-border-glass-strong: rgba(255, 255, 255, 0.22);
  --nc-border-subtle: rgba(255, 255, 255, 0.08);
  --nc-border-glow-primary: rgba(15, 163, 217, 0.45);
  --nc-border-glow-gold: rgba(245, 158, 11, 0.45);

  /* Ambient Mesh Gradients & Overlays */
  --nc-mesh-gradient: radial-gradient(at 15% 15%, rgba(15, 163, 217, 0.15) 0px, transparent 60%),
                      radial-gradient(at 85% 20%, rgba(16, 185, 129, 0.12) 0px, transparent 60%),
                      radial-gradient(at 50% 80%, rgba(245, 158, 11, 0.08) 0px, transparent 70%);

  /* --------------------------------------------------------------------------------------------------
   * 3. TYPOGRAPHY SYSTEM (FLUID SCALES VIA CLAMP)
   * -------------------------------------------------------------------------------------------------- */
  --nc-font-display: 'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --nc-font-sans: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --nc-font-mono: 'JetBrains Mono', monospace;

  --nc-fs-display: clamp(2.5rem, 6vw + 1rem, 5rem);
  --nc-fs-h1: clamp(2rem, 4vw + 0.5rem, 3.5rem);
  --nc-fs-h2: clamp(1.6rem, 3vw + 0.25rem, 2.5rem);
  --nc-fs-h3: clamp(1.25rem, 2vw + 0.2rem, 1.75rem);
  --nc-fs-h4: clamp(1.1rem, 1.5vw + 0.1rem, 1.35rem);
  --nc-fs-body: clamp(0.9375rem, 0.9vw + 0.2rem, 1.125rem);
  --nc-fs-small: clamp(0.8125rem, 0.8vw + 0.15rem, 0.9rem);
  --nc-fs-tiny: clamp(0.7rem, 0.7vw + 0.1rem, 0.775rem);

  --nc-lh-tight: 1.15;
  --nc-lh-snug: 1.3;
  --nc-lh-normal: 1.6;
  --nc-lh-relaxed: 1.75;

  /* --------------------------------------------------------------------------------------------------
   * 4. SPATIAL ELEVATION, RADIUS & SHADOW TOKENS
   * -------------------------------------------------------------------------------------------------- */
  --nc-radius-sm: 8px;
  --nc-radius-md: 14px;
  --nc-radius-lg: 20px;
  --nc-radius-xl: 28px;
  --nc-radius-full: 9999px;

  --nc-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.35);
  --nc-shadow-md: 0 8px 24px -4px rgba(0, 0, 0, 0.45);
  --nc-shadow-lg: 0 16px 40px -8px rgba(0, 0, 0, 0.6);
  --nc-shadow-glow: 0 0 40px -10px var(--nc-brand-primary-glow);
  --nc-shadow-gold-glow: 0 0 35px -8px var(--nc-brand-gold-glow);

  /* Backdrop Blur Filters */
  --nc-blur-dock: blur(24px) saturate(180%);
  --nc-blur-card: blur(20px) saturate(160%);
  --nc-blur-modal: blur(32px) saturate(190%);

  /* --------------------------------------------------------------------------------------------------
   * 5. MOTION PHYSICS & EASING TOKENS
   * -------------------------------------------------------------------------------------------------- */
  --nc-ease-spring: cubic-bezier(0.175, 0.885, 0.32, 1.275);
  --nc-ease-smooth: cubic-bezier(0.16, 1, 0.3, 1);
  --nc-ease-out: cubic-bezier(0, 0, 0.2, 1);
  --nc-ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);

  --nc-dur-instant: 100ms;
  --nc-dur-fast: 180ms;
  --nc-dur-base: 320ms;
  --nc-dur-slow: 600ms;
  --nc-dur-deliberate: 1000ms;

  /* --------------------------------------------------------------------------------------------------
   * 6. LAYOUT & RESPONSIVE CONSTANTS
   * -------------------------------------------------------------------------------------------------- */
  --nc-max-w-content: 1640px;
  --nc-max-w-narrow: 1160px;
  --nc-header-h-desktop: 80px;
  --nc-header-h-mobile: 60px;
  --nc-bottom-bar-h: 68px;
  --nc-safe-area-bottom: env(safe-area-inset-bottom, 0px);
}

/* ----------------------------------------------------------------------------------------------------
 * 7. THEME OVERRIDES: LIGHT MODE (`[data-theme="light"]`)
 * ---------------------------------------------------------------------------------------------------- */
[data-theme="light"] {
  /* Ambient Luxury Tinted Base (Eliminates flat harsh white) */
  --nc-bg-main: #EBF2F7;
  --nc-bg-radial: radial-gradient(circle at 50% 0%, #DCECF9 0%, #EBF2F7 55%, #DEE8F1 100%);
  --nc-surface-card: rgba(255, 255, 255, 0.82);
  --nc-surface-card-hover: rgba(255, 255, 255, 0.94);
  --nc-surface-hover: rgba(235, 242, 248, 0.9);
  --nc-surface-elevated: rgba(255, 255, 255, 0.92);
  --nc-surface-dock: rgba(240, 246, 252, 0.88);
  --nc-surface-glass: rgba(255, 255, 255, 0.80);
  --nc-surface-glass-active: rgba(224, 242, 254, 0.92);

  /* High-Contrast Light Mode Typography */
  --nc-text-primary: #0F172A;
  --nc-text-secondary: #334155;
  --nc-text-muted: #64748B;
  --nc-text-dim: #94A3B8;
  --nc-text-inverse: #FFFFFF;

  /* Light Mode Borders with Subtle Opacity */
  --nc-border-glass: rgba(15, 23, 42, 0.09);
  --nc-border-glass-subtle: rgba(15, 23, 42, 0.05);
  --nc-border-glass-strong: rgba(15, 23, 42, 0.18);
  --nc-border-subtle: rgba(15, 23, 42, 0.09);
  --nc-border-glow-primary: rgba(15, 163, 217, 0.45);
  --nc-border-glow-gold: rgba(245, 158, 11, 0.45);

  --nc-shadow-sm: 0 2px 8px rgba(15, 23, 42, 0.06);
  --nc-shadow-md: 0 8px 24px -4px rgba(15, 23, 42, 0.09);
  --nc-shadow-lg: 0 16px 40px -8px rgba(15, 23, 42, 0.12);

  /* Rich Radiant Atmospheric Mesh Gradient (Sapphire Sky, Kinship Emerald, Vedic Amber & Royal Violet) */
  --nc-mesh-gradient: 
    radial-gradient(at 6% 10%, rgba(14, 165, 233, 0.22) 0px, transparent 52%),
    radial-gradient(at 94% 12%, rgba(16, 185, 129, 0.18) 0px, transparent 48%),
    radial-gradient(at 50% 45%, rgba(245, 158, 11, 0.13) 0px, transparent 62%),
    radial-gradient(at 88% 85%, rgba(139, 92, 246, 0.15) 0px, transparent 52%),
    radial-gradient(at 12% 85%, rgba(14, 165, 233, 0.17) 0px, transparent 50%);
}
