/* ui-design-tokens.css
   Variaveis canonicas do design system Antero.
   Aditivas - sao referencia para novo codigo sem afetar o atual.
*/
:root {
  /* Brand */
  --ui-purple: #9B27AF;
  --ui-teal:   #00C4A7;
  --ui-grad:   linear-gradient(135deg, #9B27AF, #00C4A7);

  /* Surfaces */
  --ui-bg:        #0e0817;
  --ui-surface-1: rgba(255,255,255,.03);
  --ui-surface-2: rgba(255,255,255,.06);
  --ui-surface-3: rgba(255,255,255,.09);
  --ui-border:    rgba(255,255,255,.1);
  --ui-border-strong: rgba(255,255,255,.22);

  /* Text */
  --ui-text:       #ffffff;
  --ui-text-muted: rgba(255,255,255,.55);
  --ui-text-subtle:rgba(255,255,255,.35);

  /* Semantics */
  --ui-ok:    #00C4A7;
  --ui-warn:  #ffb84c;
  --ui-err:   #ff4757;
  --ui-info:  #4c9eff;

  /* Spacing scale */
  --ui-space-0:  0;
  --ui-space-1:  4px;
  --ui-space-2:  8px;
  --ui-space-3:  12px;
  --ui-space-4:  16px;
  --ui-space-5:  20px;
  --ui-space-6:  24px;
  --ui-space-8:  32px;
  --ui-space-10: 40px;
  --ui-space-12: 48px;

  /* Font sizes */
  --ui-font-xs:   11px;
  --ui-font-sm:   12px;
  --ui-font-base: 13px;
  --ui-font-md:   14px;
  --ui-font-lg:   16px;
  --ui-font-xl:   18px;
  --ui-font-2xl:  22px;
  --ui-font-3xl:  28px;
  --ui-font-4xl:  34px;

  /* Weights */
  --ui-weight-regular: 400;
  --ui-weight-medium:  500;
  --ui-weight-semibold:600;
  --ui-weight-bold:    700;
  --ui-weight-black:   800;

  /* Radii */
  --ui-radius-sm: 6px;
  --ui-radius:    10px;
  --ui-radius-lg: 14px;
  --ui-radius-pill: 999px;

  /* Shadow */
  --ui-shadow-sm: 0 2px 8px rgba(0,0,0,.2);
  --ui-shadow:    0 8px 24px rgba(0,0,0,.28);
  --ui-shadow-lg: 0 16px 40px rgba(0,0,0,.4);

  /* Transition */
  --ui-t-fast: .12s ease;
  --ui-t:      .18s ease;
  --ui-t-slow: .28s cubic-bezier(.2,.9,.3,1);

  /* Z-index scale */
  --ui-z-sidebar: 20;
  --ui-z-header:  30;
  --ui-z-toast:   999999;
  --ui-z-modal:   999000;
  --ui-z-cmdk:    999997;
}
