/* ============================================================
   RideOps Design System — variables.css
   Tüm renk, boşluk, radius ve gölge token'ları burada tanımlanır.
   Hiçbir component dosyası renk kodunu doğrudan yazmaz; sadece
   bu değişkenleri kullanır. Bu sayede tema tek noktadan yönetilir.
   ============================================================ */

:root,
.dark {
    /* ── Yüzeyler ──────────────────────────────────────────── */
    --ro-bg:            #0B1220;
    --ro-sidebar:        #111827;
    --ro-topbar:         #111827;
    --ro-card:           #182235;
    --ro-card-hover:     #202D45;
    --ro-border:         #2A3B57;
    --ro-border-soft:    rgba(42, 59, 87, .55);

    /* ── Marka ─────────────────────────────────────────────── */
    --ro-primary:        #F97316;
    --ro-primary-hover:  #EA580C;
    --ro-primary-active: #C2410C;
    --ro-primary-soft:   rgba(249, 115, 22, .14);
    --ro-primary-soft-strong: rgba(249, 115, 22, .22);

    /* ── AI Asistan (sadece AI panelinde kullanılır) ─────────── */
    --ro-ai:             #8B5CF6;
    --ro-ai-hover:       #7C3AED;
    --ro-ai-soft:        rgba(139, 92, 246, .16);

    /* ── Metin ─────────────────────────────────────────────── */
    --ro-text:           #F8FAFC;
    --ro-text-secondary: #CBD5E1;
    --ro-muted:          #94A3B8;
    --ro-muted-strong:   #64748B;

    /* ── Semantik durumlar ─────────────────────────────────── */
    --ro-success:        #22C55E;
    --ro-success-soft:   rgba(34, 197, 94, .14);
    --ro-warning:        #F59E0B;
    --ro-warning-soft:   rgba(245, 158, 11, .14);
    --ro-danger:         #EF4444;
    --ro-danger-soft:    rgba(239, 68, 68, .14);
    --ro-info:           #3B82F6;
    --ro-info-soft:      rgba(59, 130, 246, .14);

    /* ── Tipografi ─────────────────────────────────────────── */
    --ro-font-sans: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
    --ro-fw-regular: 400;
    --ro-fw-medium:  500;
    --ro-fw-semibold: 600;
    --ro-fw-bold:    700;

    /* ── 8px spacing sistemi ───────────────────────────────── */
    --ro-space-1: 4px;
    --ro-space-2: 8px;
    --ro-space-3: 16px;
    --ro-space-4: 24px;
    --ro-space-5: 32px;
    --ro-space-6: 40px;
    --ro-space-7: 48px;

    /* ── Radius ────────────────────────────────────────────── */
    --ro-radius-sm:  10px;
    --ro-radius-md:  14px;
    --ro-radius-lg:  20px;
    --ro-radius-full: 999px;

    /* ── Gölgeler (yumuşak, sert kenar yok) ────────────────── */
    --ro-shadow-sm: 0 1px 2px rgba(0, 0, 0, .35);
    --ro-shadow-md: 0 6px 20px -4px rgba(0, 0, 0, .45);
    --ro-shadow-lg: 0 16px 40px -8px rgba(0, 0, 0, .55);
    --ro-shadow-glow-primary: 0 0 0 1px rgba(249, 115, 22, .35), 0 8px 24px -6px rgba(249, 115, 22, .25);
    --ro-shadow-glow-ai: 0 0 0 1px rgba(139, 92, 246, .35), 0 8px 24px -6px rgba(139, 92, 246, .25);

    /* ── Boyutlar ──────────────────────────────────────────── */
    --ro-sidebar-width: 260px;
    --ro-topbar-height: 72px;

    /* ── Geçiş süreleri ────────────────────────────────────── */
    --ro-transition-fast: 120ms ease;
    --ro-transition: 180ms cubic-bezier(.4, 0, .2, 1);
}