/*
 * OpenBazaar.ai Design System — single entry point
 *
 * Design tokens (CSS custom properties) and shared component primitives.
 * Include ONE link to this file per page:
 *
 *   <link rel="stylesheet" href="/css/design-system.css">
 *
 * This file is the canonical import that pulls in:
 *   - variables.css  →  all CSS custom properties (colors, spacing, type, shadows…)
 *   - base.css       →  reset, typography, layout helpers, shared components
 *
 * Page-specific styles belong in a <style> block or a separate stylesheet
 * loaded AFTER this one.
 *
 * ─────────────────────────────────────────────────────────────────────────
 * Design Tokens (defined in ../styles/variables.css):
 *
 * Colors
 *   --color-primary        Brand purple   #7C3AED
 *   --color-primary-dark                  #6D28D9
 *   --color-success                       #10B981
 *   --color-danger                        #EF4444
 *   --color-warning                       #F59E0B
 *   --color-info                          #3B82F6
 *
 * Surfaces
 *   --color-bg             Page background #F9FAFB
 *   --color-surface        Card / panel    #FFFFFF
 *   --color-bg-alt                         #F3F4F6
 *
 * Text
 *   --color-text                           #111827
 *   --color-text-muted                     #6B7280
 *   --color-text-subtle                    #9CA3AF
 *
 * Border
 *   --color-border                         #E5E7EB
 *   --color-border-focus                   #7C3AED
 *
 * Typography
 *   --font-sans            System font stack
 *   --font-mono            Monospace stack
 *   --text-xs / sm / base / lg / xl / 2xl / 3xl / 4xl
 *
 * Spacing (multiples of 4px)
 *   --space-1 (4px) … --space-16 (64px)
 *
 * Border Radius
 *   --radius-sm (4px) / --radius-md (8px) / --radius-lg (12px) /
 *   --radius-xl (16px) / --radius-full (9999px)
 *
 * Shadows
 *   --shadow-sm / --shadow-md / --shadow-lg / --shadow-xl
 *
 * Layout
 *   --max-w-xs (480px) … --max-w-xl (1280px)
 *
 * Transitions
 *   --transition-fast (150ms) / --transition-base (200ms) / --transition-slow (300ms)
 *
 * ─────────────────────────────────────────────────────────────────────────
 * Shared Components (defined in ../styles/base.css):
 *
 * Layout      .container / .container--md / .container--sm
 * Header      .site-header / .site-header__inner / .site-header__logo / .site-header__nav
 * Buttons     .btn + .btn--primary / --secondary / --danger / --ghost / --sm / --lg / --full
 * Cards       .card / .card--shadow / .card--hover
 * Forms       .form-group / .form-label / .form-input / .form-select / .form-textarea /
 *             .form-hint / .form-error
 * Badges      .badge + .badge--success / --danger / --warning / --info / --default
 * Alerts      .alert + .alert--success / --danger / --warning / --info
 * Utilities   .text-muted / .text-success / .text-danger / .text-primary /
 *             .text-center / .text-sm / .text-lg / .sr-only
 * ─────────────────────────────────────────────────────────────────────────
 */

@import url('../styles/variables.css');
@import url('../styles/base.css');