/**
 * Valdemar Imóveis - Design System Variables
 * Paleta de cores, tipografia, espaçamentos e componentes
 */

:root {
  /* =====================================================
     CORES PRIMÁRIAS (AZUL)
     ===================================================== */
  --primary-900: #0A4A61;
  --primary-800: #0C5A75;
  --primary-700: #0E6A89;
  --primary-600: #0F6F92;
  --primary-500: #0093D5;
  --primary-400: #33A8DE;
  --primary-300: #66BDE7;
  --primary-200: #99D2F0;
  --primary-100: #CCE8F8;
  --primary-50:  #E6F4FB;

  /* =====================================================
     GRADIENTES
     ===================================================== */
  --gradient-primary: linear-gradient(135deg, #0F6F92 0%, #0093D5 100%);
  --gradient-primary-hover: linear-gradient(135deg, #0C5A75 0%, #0F6F92 100%);
  --gradient-dark: linear-gradient(135deg, #0A4A61 0%, #0F6F92 100%);
  --gradient-light: linear-gradient(135deg, #0093D5 0%, #66BDE7 100%);
  --gradient-card: linear-gradient(180deg, rgba(15, 111, 146, 0.05) 0%, rgba(0, 147, 213, 0.02) 100%);
  --gradient-overlay: linear-gradient(180deg, rgba(10, 74, 97, 0) 0%, rgba(10, 74, 97, 0.85) 100%);
  --gradient-hero: linear-gradient(135deg, rgba(10, 74, 97, 0.9) 0%, rgba(0, 147, 213, 0.8) 100%);

  /* =====================================================
     CORES NEUTRAS
     ===================================================== */
  --neutral-900: #1A1A2E;
  --neutral-800: #2D2D44;
  --neutral-700: #404059;
  --neutral-600: #53536E;
  --neutral-500: #6B6B84;
  --neutral-400: #9090A7;
  --neutral-300: #B5B5C6;
  --neutral-200: #DCDCE5;
  --neutral-100: #F0F0F5;
  --neutral-50:  #F8F8FB;
  --white: #FFFFFF;

  /* =====================================================
     CORES SEMÂNTICAS
     ===================================================== */
  --success-500: #10B981;
  --success-100: #D1FAE5;
  --warning-500: #F59E0B;
  --warning-100: #FEF3C7;
  --error-500: #EF4444;
  --error-100: #FEE2E2;
  --info-500: #0093D5;
  --info-100: #CCE8F8;

  /* =====================================================
     STATUS DE IMÓVEIS
     ===================================================== */
  --status-available: #10B981;
  --status-reserved: #F59E0B;
  --status-sold: #EF4444;
  --status-rented: #8B5CF6;

  /* =====================================================
     TIPOGRAFIA
     ===================================================== */
  --font-primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-heading: 'Poppins', var(--font-primary);
  --font-mono: 'JetBrains Mono', 'Fira Code', monospace;

  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.25rem;
  --text-2xl: 1.5rem;
  --text-3xl: 1.875rem;
  --text-4xl: 2.25rem;
  --text-5xl: 3rem;
  --text-6xl: 3.75rem;

  --font-light: 300;
  --font-regular: 400;
  --font-medium: 500;
  --font-semibold: 600;
  --font-bold: 700;

  --leading-tight: 1.25;
  --leading-normal: 1.5;
  --leading-relaxed: 1.75;

  /* =====================================================
     ESPAÇAMENTOS
     ===================================================== */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;

  /* =====================================================
     BORDAS
     ===================================================== */
  --radius-sm: 0.25rem;
  --radius-md: 0.5rem;
  --radius-lg: 0.75rem;
  --radius-xl: 1rem;
  --radius-2xl: 1.5rem;
  --radius-full: 9999px;

  /* =====================================================
     SOMBRAS
     ===================================================== */
  --shadow-xs: 0 1px 2px rgba(10, 74, 97, 0.05);
  --shadow-sm: 0 2px 4px rgba(10, 74, 97, 0.06);
  --shadow-md: 0 4px 8px rgba(10, 74, 97, 0.08);
  --shadow-lg: 0 8px 16px rgba(10, 74, 97, 0.10);
  --shadow-xl: 0 16px 32px rgba(10, 74, 97, 0.12);
  --shadow-2xl: 0 24px 48px rgba(10, 74, 97, 0.16);
  --shadow-elevated: 0 10px 40px rgba(10, 74, 97, 0.15);
  --shadow-card-hover: 0 12px 24px rgba(0, 147, 213, 0.15);

  /* =====================================================
     TRANSIÇÕES
     ===================================================== */
  --transition-fast: 150ms ease;
  --transition-base: 300ms ease;
  --transition-slow: 500ms ease;
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out: cubic-bezier(0, 0, 0.2, 1);
  --ease-in: cubic-bezier(0.4, 0, 1, 1);

  /* =====================================================
     BREAKPOINTS (para referência em JS)
     ===================================================== */
  --breakpoint-sm: 640px;
  --breakpoint-md: 768px;
  --breakpoint-lg: 1024px;
  --breakpoint-xl: 1280px;
  --breakpoint-2xl: 1536px;

  /* =====================================================
     LAYOUT
     ===================================================== */
  --container-max: 1280px;
  --header-height: 80px;
  --sidebar-width: 280px;
}