/* ═══════════════════════════════════════════════════════════════════
   İş Ekstra - CSS Değişkenleri (Design Tokens)
   Premium koyu tema tasarım sistemi
   ═══════════════════════════════════════════════════════════════════ */

:root {
    /* ─── Arka Plan Renkleri ──────────────────────────────────────── */
    --bg-primary: #F8F9FA;
    --bg-primary-light: #FFFFFF;
    --bg-card: #FFFFFF;
    --bg-card-hover: #F1F3F5;
    --bg-card-active: #E9ECEF;
    --bg-surface: #FFFFFF;
    --bg-surface-border: #DEE2E6;
    --bg-input: #FFFFFF;
    --bg-input-focus: #FFF4E6;
    --bg-overlay: rgba(0, 0, 0, 0.4);
    --bg-skeleton: linear-gradient(90deg, #F8F9FA 25%, #E9ECEF 50%, #F8F9FA 75%);

    /* ─── Vurgu Renkleri ─────────────────────────────────────────── */
    --accent-primary: #FD7E14;
    --accent-primary-hover: #E85D04;
    --accent-primary-light: rgba(253, 126, 20, 0.15);
    --accent-primary-glow: rgba(253, 126, 20, 0.4);
    --accent-secondary: #FFA94D;
    --accent-secondary-hover: #FF922B;
    --accent-secondary-light: rgba(255, 169, 77, 0.15);
    --accent-success: #00B894;
    --accent-success-light: rgba(0, 184, 148, 0.15);
    --accent-warning: #FDCB6E;
    --accent-warning-light: rgba(253, 203, 110, 0.15);
    --accent-danger: #E17055;
    --accent-danger-light: rgba(225, 112, 85, 0.15);
    --accent-info: #74B9FF;
    --accent-info-light: rgba(116, 185, 255, 0.15);
    --accent-gold: #F9CA24;
    --accent-gold-light: rgba(249, 202, 36, 0.15);

    /* ─── Metin Renkleri ─────────────────────────────────────────── */
    --text-primary: #212529;
    --text-secondary: #495057;
    --text-muted: #868E96;
    --text-disabled: #CED4DA;
    --text-link: #FD7E14;
    --text-link-hover: #E85D04;
    --text-inverse: #FFFFFF;

    /* ─── Kenar Yuvarlaklıkları ───────────────────────────────────── */
    --radius-xs: 4px;
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;
    --radius-xl: 24px;
    --radius-2xl: 32px;
    --radius-full: 9999px;

    /* ─── Gölgeler ────────────────────────────────────────────────── */
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.2);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.3);
    --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.4);
    --shadow-xl: 0 16px 48px rgba(0, 0, 0, 0.5);
    --shadow-glow: 0 0 20px var(--accent-primary-glow);
    --shadow-glow-sm: 0 0 10px var(--accent-primary-glow);
    --shadow-glow-accent: 0 0 20px rgba(0, 210, 211, 0.3);
    --shadow-card-hover: 0 12px 40px rgba(0, 0, 0, 0.5), 0 0 20px var(--accent-primary-glow);
    --shadow-inset: inset 0 2px 4px rgba(0, 0, 0, 0.3);

    /* ─── Geçiş Animasyonları ─────────────────────────────────────── */
    --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
    --transition-normal: 300ms cubic-bezier(0.4, 0, 0.2, 1);
    --transition-slow: 500ms cubic-bezier(0.4, 0, 0.2, 1);
    --transition-bounce: 500ms cubic-bezier(0.34, 1.56, 0.64, 1);
    --transition-spring: 600ms cubic-bezier(0.175, 0.885, 0.32, 1.275);

    /* ─── Camlaşma (Glassmorphism) ────────────────────────────────── */
    --glass-bg: rgba(255, 255, 255, 0.8);
    --glass-bg-light: rgba(255, 255, 255, 0.6);
    --glass-bg-heavy: rgba(255, 255, 255, 0.95);
    --glass-border: rgba(0, 0, 0, 0.05);
    --glass-border-light: rgba(0, 0, 0, 0.02);
    --glass-border-active: rgba(0, 0, 0, 0.1);
    --glass-blur: blur(20px);
    --glass-blur-sm: blur(10px);
    --glass-blur-lg: blur(40px);

    /* ─── Degradeler (Gradients) ──────────────────────────────────── */
    --gradient-primary: linear-gradient(135deg, #FD7E14 0%, #FF922B 100%);
    --gradient-accent: linear-gradient(135deg, #FD7E14 0%, #FFA94D 100%);
    --gradient-success: linear-gradient(135deg, #00B894 0%, #00D2D3 100%);
    --gradient-warning: linear-gradient(135deg, #FDCB6E 0%, #E17055 100%);
    --gradient-danger: linear-gradient(135deg, #E17055 0%, #d63031 100%);
    --gradient-gold: linear-gradient(135deg, #F9CA24 0%, #f0932b 100%);
    --gradient-dark: linear-gradient(135deg, #F8F9FA 0%, #E9ECEF 100%);
    --gradient-hero: linear-gradient(135deg, #F8F9FA 0%, #FFFFFF 40%, #F1F3F5 100%);
    --gradient-card-shine: linear-gradient(135deg, rgba(253, 126, 20, 0.05) 0%, rgba(255,255,255,0) 50%);
    --gradient-text: linear-gradient(135deg, #FD7E14, #FFA94D);
    --gradient-mesh: radial-gradient(at 40% 20%, rgba(253, 126, 20, 0.08) 0px, transparent 50%),
                     radial-gradient(at 80% 0%, rgba(255, 169, 77, 0.05) 0px, transparent 50%),
                     radial-gradient(at 0% 50%, rgba(253, 126, 20, 0.05) 0px, transparent 50%);

    /* ─── Tipografi ───────────────────────────────────────────────── */
    --font-primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-mono: 'JetBrains Mono', 'Fira Code', monospace;
    
    --text-xs: 0.75rem;     /* 12px */
    --text-sm: 0.875rem;    /* 14px */
    --text-base: 1rem;      /* 16px */
    --text-lg: 1.125rem;    /* 18px */
    --text-xl: 1.25rem;     /* 20px */
    --text-2xl: 1.5rem;     /* 24px */
    --text-3xl: 1.875rem;   /* 30px */
    --text-4xl: 2.25rem;    /* 36px */
    --text-5xl: 3rem;       /* 48px */
    --text-6xl: 3.75rem;    /* 60px */

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

    --tracking-tight: -0.025em;
    --tracking-normal: 0;
    --tracking-wide: 0.025em;

    /* ─── Aralıklar (Spacing) ─────────────────────────────────────── */
    --space-1: 0.25rem;   /* 4px */
    --space-2: 0.5rem;    /* 8px */
    --space-3: 0.75rem;   /* 12px */
    --space-4: 1rem;      /* 16px */
    --space-5: 1.25rem;   /* 20px */
    --space-6: 1.5rem;    /* 24px */
    --space-8: 2rem;      /* 32px */
    --space-10: 2.5rem;   /* 40px */
    --space-12: 3rem;     /* 48px */
    --space-16: 4rem;     /* 64px */
    --space-20: 5rem;     /* 80px */
    --space-24: 6rem;     /* 96px */

    /* ─── Z-Index Katmanları ──────────────────────────────────────── */
    --z-dropdown: 1040;
    --z-sticky: 1020;
    --z-fixed: 1030;
    --z-modal-backdrop: 1050;
    --z-modal: 1060;
    --z-popover: 1070;
    --z-tooltip: 1080;
    --z-toast: 1090;

    /* ─── 3D ve Perspektif ────────────────────────────────────────── */
    --perspective: 1000px;
    --perspective-lg: 2000px;
    --rotate-subtle: 2deg;
    --rotate-card: 5deg;

    /* ─── Sidebar Genişlikleri ────────────────────────────────────── */
    --sidebar-width: 280px;
    --sidebar-collapsed-width: 80px;
    --navbar-height: 70px;

    /* ─── Kategori Renkleri ────────────────────────────────────────── */
    --cat-temizlik: #00B894;
    --cat-tamirat: #E17055;
    --cat-tasima: #6C5CE7;
    --cat-bahce: #00D2D3;
    --cat-boya: #FDCB6E;
    --cat-insaat: #74B9FF;
    --cat-elektrik: #F9CA24;
    --cat-tesisat: #a855f7;
    --cat-diger: #8B8DA3;
}

/* ─── Açık Tema Bootstrap Override Değişkenleri ───────────────────── */
[data-bs-theme="light"] {
    --bs-body-bg: var(--bg-primary);
    --bs-body-color: var(--text-primary);
    --bs-border-color: var(--bg-surface-border);
    --bs-primary: var(--accent-primary);
    --bs-primary-rgb: 253, 126, 20;
    --bs-secondary: var(--text-secondary);
    --bs-secondary-rgb: 73, 80, 87;
    --bs-success: var(--accent-success);
    --bs-success-rgb: 0, 184, 148;
    --bs-warning: var(--accent-warning);
    --bs-warning-rgb: 253, 203, 110;
    --bs-danger: var(--accent-danger);
    --bs-danger-rgb: 225, 112, 85;
    --bs-info: var(--accent-info);
    --bs-info-rgb: 116, 185, 255;
    --bs-card-bg: var(--bg-card);
    --bs-modal-bg: var(--bg-card);
}
