/* ==========================================================================
   Xargo Design System — Luxury Black & White
   ==========================================================================
   This file defines the core design tokens for the Xargo brand.
   Tasks 15, 19, 22 will apply these tokens to actual pages.
   ========================================================================== */

:root {
    /* ── Brand Colors ── */
    --brand-primary: #000000;          /* Black — primary brand color */
    --brand-secondary: #FFFFFF;        /* White — secondary brand color */
    --brand-accent: #C9A84C;           /* Gold — highlights, CTAs, premium feel */

    /* ── Neutral Grays ── */
    --brand-bg-light: #F5F5F5;         /* Light background */
    --brand-border: #E5E5E5;           /* Borders, dividers */
    --brand-text-muted: #737373;       /* Muted/secondary text */
    --brand-text-primary: #171717;     /* Primary text color */

    /* ── Status Colors ── */
    --brand-success: #16A34A;          /* Success green */
    --brand-error: #DC2626;            /* Error red */
    --brand-warning: #D97706;          /* Warning amber */

    /* ── Typography ── */
    --brand-font-family: 'Inter', sans-serif;
    --brand-font-weight-regular: 400;
    --brand-font-weight-medium: 500;
    --brand-font-weight-semibold: 600;
    --brand-font-weight-bold: 700;

    /* ── Spacing (reference scale) ── */
    --brand-radius-sm: 0.375rem;       /* 6px */
    --brand-radius-md: 0.5rem;         /* 8px */
    --brand-radius-lg: 0.75rem;        /* 12px */
    --brand-radius-xl: 1rem;           /* 16px */

    /* ── Shadows ── */
    --brand-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
    --brand-shadow-md: 0 4px 6px rgba(0, 0, 0, 0.07);
    --brand-shadow-lg: 0 20px 40px rgba(0, 0, 0, 0.1);
    --brand-shadow-xl: 0 25px 50px rgba(0, 0, 0, 0.15);
}