/* ============================================================
   Hamac — Design System
   Clean, enterprise-grade backoffice styling.
   ============================================================ */

/* ---- Tokens ---- */
:root {
    /* Colors */
    --color-bg: #ffffff;
    --color-surface: #f7f8fa;
    --color-surface-raised: #ffffff;
    --color-border: #e3e5e8;
    --color-border-light: #f0f1f3;
    --color-text: #1a1d23;
    --color-text-secondary: #6b7280;
    --color-text-tertiary: #9ca3af;
    --color-primary: #2563eb;
    --color-primary-hover: #1d4ed8;
    --color-primary-bg: #eff6ff;
    --color-danger: #dc2626;
    --color-danger-bg: #fef2f2;
    --color-success: #16a34a;
    --color-success-bg: #f0fdf4;
    --color-warning: #d97706;
    --color-warning-bg: #fffbeb;

    /* Typography */
    --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
    --font-mono: 'SF Mono', 'Cascadia Code', 'Fira Code', monospace;
    --text-xs: 0.6875rem;   /* 11px */
    --text-sm: 0.8125rem;   /* 13px */
    --text-base: 0.875rem;  /* 14px */
    --text-lg: 1.0625rem;   /* 17px */
    --text-xl: 1.25rem;     /* 20px */

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

    /* Radii */
    --radius-sm: 4px;
    --radius-md: 6px;
    --radius-lg: 8px;

    /* Layout */
    --sidebar-width: 260px;
    --topbar-height: 48px;

    /* Motion */
    --transition: 180ms cubic-bezier(0.16, 1, 0.3, 1);
}