/* ==========================================================================
   Swedbank Design Tokens — Variables Only
   Import this file to get all design tokens as CSS custom properties.
   Usage: @import url('swedbank-tokens.css');
   ========================================================================== */

:root {
  /* Colors — Brand */
  --sw-primary: #FF5F00;
  --sw-primary-dark: #FB4F00;
  --sw-white: #FFFFFF;
  --sw-light-pink: #FBF3F7;
  --sw-dark-brown: #3D2222;
  --sw-avatar-brown: #512A2B;
  --sw-tab-active-bg: #FDEAE0;

  /* Colors — Neutral */
  --sw-black: #1A1A1A;
  --sw-gray-600: #6B7280;
  --sw-gray-100: #F3F4F6;
  --sw-gray-200: #E5E7EB;

  /* Colors — Semantic */
  --sw-success: #10B981;
  --sw-error: #EF4444;
  --sw-warning: #F59E0B;

  /* Fonts */
  --sw-font-heading: 'Swedbank Headline', 'Inter', sans-serif;
  --sw-font-body: 'Swedbank Sans', 'Inter', sans-serif;

  /* Font Sizes */
  --sw-text-h1: 40px;
  --sw-text-h2: 32px;
  --sw-text-h3: 24px;
  --sw-text-h4: 20px;
  --sw-text-body-lg: 18px;
  --sw-text-body: 16px;
  --sw-text-caption: 14px;
  --sw-text-small: 12px;
  --sw-text-tab: 11px;

  /* Font Weights */
  --sw-weight-black: 900;
  --sw-weight-bold: 700;
  --sw-weight-semibold: 600;
  --sw-weight-medium: 500;
  --sw-weight-regular: 400;

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

  /* Border Radius */
  --sw-radius-sm: 4px;
  --sw-radius-md: 8px;
  --sw-radius-lg: 16px;
  --sw-radius-xl: 24px;
  --sw-radius-pill: 18px;
  --sw-radius-full: 9999px;
}