/* ============================================================
   VENTAMAX POS — Design Tokens
   Central source of truth for all design decisions.
   Keep all magic numbers and colors here ONLY.
   ============================================================ */

:root {
  /* ── Brand Accent ── */
  --vm-accent:           #6366f1;
  --vm-accent-hover:     #4f46e5;
  --vm-accent-light:     rgba(99, 102, 241, 0.15);
  --vm-accent-rgb:       99, 102, 241;

  /* ── Gradient Pairs ── */
  --vm-gradient-brand:   linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  --vm-gradient-ia:      linear-gradient(135deg, #6f42c1 0%, #d63384 100%);
  --vm-gradient-danger:  linear-gradient(135deg, #ff416c 0%, #ff4b2b 100%);
  --vm-gradient-success: linear-gradient(135deg, #11998e 0%, #38ef7d 100%);
  --vm-gradient-blue:    linear-gradient(135deg, #396afc 0%, #2948ff 100%);
  --vm-gradient-login:   linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
  --vm-gradient-demo:    linear-gradient(90deg, #f59e0b 0%, #d97706 50%, #b45309 100%);

  /* ── Hero Card Gradients ── */
  --vm-hero-ventas:      var(--vm-gradient-success);
  --vm-hero-compras:     var(--vm-gradient-danger);
  --vm-hero-utilidad:    var(--vm-gradient-blue);

  /* ── Sidebar ── */
  --vm-sidebar-bg-from:  #1e293b;
  --vm-sidebar-bg-to:    #0f172a;
  --vm-sidebar-text:     rgba(255, 255, 255, 0.7);
  --vm-sidebar-active:   #6366f1;

  /* ── IA / Chatbot Colors ── */
  --vm-ia-from:          #6f42c1;
  --vm-ia-to:            #d63384;
  --vm-ia-rgb:           111, 66, 193;

  /* ── Border Radius ── */
  --vm-radius-xs:   4px;
  --vm-radius-sm:   6px;
  --vm-radius-md:   8px;
  --vm-radius-lg:   12px;
  --vm-radius-xl:   16px;
  --vm-radius-2xl:  20px;
  --vm-radius-full: 50px;

  /* ── Transitions ── */
  --vm-ease:         cubic-bezier(0.4, 0, 0.2, 1);
  --vm-trans-fast:   0.15s var(--vm-ease);
  --vm-trans-base:   0.2s var(--vm-ease);
  --vm-trans-slow:   0.35s var(--vm-ease);

  /* ── Shadows ── */
  --vm-shadow-xs:  0 1px 3px rgba(0, 0, 0, 0.06);
  --vm-shadow-sm:  0 2px 8px rgba(0, 0, 0, 0.08);
  --vm-shadow-md:  0 4px 15px rgba(0, 0, 0, 0.10);
  --vm-shadow-lg:  0 8px 32px rgba(0, 0, 0, 0.15);
  --vm-shadow-xl:  0 15px 40px rgba(0, 0, 0, 0.20);

  /* ── Z-Index Scale ── */
  --vm-z-dropdown: 1050;
  --vm-z-chatbot:  9998;
  --vm-z-demo:     9999;

  /* ── Typography ── */
  --vm-font-base: 'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif;
}