/* ============================================================
   ATI Retail · Brand Tokens
   ============================================================
   SINGLE SOURCE OF TRUTH pentru identitatea vizuală.

   Importă acest fișier ÎNAINTEA oricărui CSS al unui modul nou:
       <link rel="stylesheet" href="/assets/brand/brand-tokens.css">

   Folosește variabilele CSS, NU hardcoda culori sau spacing.
   ============================================================ */

:root {
  /* === BRAND COLORS — gradient stops === */
  --brand-blue:        #3b82f6;   /* gradient stop 1 (light bg) */
  --brand-violet:      #8b5cf6;   /* gradient stop 2 + theme color */
  --brand-pink:        #ec4899;   /* gradient stop 3 + accent dot */
  --brand-violet-text: #7c3aed;   /* text accent (taglines, links pe alb) */
  --brand-violet-soft: #a78bfa;   /* text accent pe dark */
  --brand-violet-deep: #6d28d9;   /* hover/active state */
  --brand-violet-tint: #f5f3ff;   /* background subtle, hover state */

  /* === BRAND GRADIENT === */
  --brand-gradient: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 50%, #ec4899 100%);
  --brand-gradient-soft: linear-gradient(135deg, #60a5fa 0%, #a78bfa 50%, #f472b6 100%);
  --brand-gradient-hover: linear-gradient(135deg, #2563eb 0%, #7c3aed 50%, #db2777 100%);

  /* === NEUTRALS === */
  --brand-ink:          #09090b;   /* text primary */
  --brand-ink-2:        #18181b;   /* surface dark */
  --brand-paper:        #ffffff;   /* background light */
  --brand-cream:        #fafafa;   /* background subtle */
  --brand-line:         #e4e4e7;   /* border default */
  --brand-line-strong:  #d4d4d8;   /* border focus / divider strong */
  --brand-muted:        #71717a;   /* text secondary */
  --brand-muted-soft:   #a1a1aa;   /* text on dark / disabled */
  --brand-muted-deep:   #52525b;   /* text body secondary */

  /* === SEMANTIC COLORS === */
  --brand-success:      #16a34a;
  --brand-success-bg:   #dcfce7;
  --brand-warning:      #d97706;
  --brand-warning-bg:   #fef3c7;
  --brand-error:        #dc2626;
  --brand-error-bg:     #fee2e2;
  --brand-info:         #7c3aed;   /* INFO uses brand violet */
  --brand-info-bg:      #ede9fe;

  /* === TYPOGRAPHY === */
  --brand-font-display: 'Manrope', 'Helvetica Neue', Arial, sans-serif;
  --brand-font-body:    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --brand-font-mono:    'JetBrains Mono', 'SF Mono', Menlo, monospace;

  /* === RADIUS === */
  --brand-radius-sm:    6px;
  --brand-radius-md:    8px;
  --brand-radius-lg:    12px;
  --brand-radius-xl:    20px;
  --brand-radius-pill:  999px;
  --brand-radius-mark:  20px;     /* mark icon (gradient square) corner */

  /* === SHADOW === */
  --brand-shadow-sm:    0 1px 2px rgba(9, 9, 11, 0.04);
  --brand-shadow-md:    0 4px 12px rgba(9, 9, 11, 0.08);
  --brand-shadow-lg:    0 12px 32px rgba(9, 9, 11, 0.10);
  --brand-shadow-glow:  0 8px 32px rgba(139, 92, 246, 0.20);
  --brand-shadow-glow-strong: 0 16px 48px rgba(139, 92, 246, 0.32);

  /* === SPACING === */
  --brand-space-1:      4px;
  --brand-space-2:      8px;
  --brand-space-3:      12px;
  --brand-space-4:      16px;
  --brand-space-5:      20px;
  --brand-space-6:      24px;
  --brand-space-8:      32px;
  --brand-space-10:     40px;

  /* === Z INDEX === */
  --brand-z-modal:      1000;
  --brand-z-toast:      1100;
  --brand-z-tooltip:    1200;
}

/* === Asset URLs (folosește pentru img src/CSS background) === */
:root {
  --brand-asset-mark-svg:    "/assets/brand/ati-mark.svg";
  --brand-asset-mark-128:    "/assets/brand/ati-mark-128.png";
  --brand-asset-mark-256:    "/assets/brand/ati-mark-256.png";
  --brand-asset-logo-light:  "/assets/brand/ati-retail-logo-light.svg";
  --brand-asset-logo-dark:   "/assets/brand/ati-retail-logo-dark.svg";
  --brand-asset-og:          "/assets/brand/ati-retail-og.png";
}