/* ============================================================
   ZIMOZO ERP — Design Tokens
   Single source for typography, spacing, breakpoints.
   Theme colors and skins are in theme-skins.css (after tokens).
   ============================================================ */

:root {
    /* Typography scale */
    --z-font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --z-text-xs: 0.75rem;      /* 12px */
    --z-text-sm: 0.875rem;     /* 14px */
    --z-text-base: 1rem;       /* 16px */
    --z-text-lg: 1.125rem;     /* 18px */
    --z-text-xl: 1.25rem;      /* 20px */
    --z-text-2xl: 1.5rem;      /* 24px */
    --z-line-height-tight: 1.25;
    --z-line-height-normal: 1.5;
    --z-line-height-relaxed: 1.625;
    --z-weight-normal: 400;
    --z-weight-medium: 500;
    --z-weight-semibold: 600;
    --z-weight-bold: 700;

    /* Enterprise palette (flat, white-first) — 2026 SaaS */
    --z-bg-page: #F8FAFC;
    --z-bg-subtle: #F8F9FA;
    --z-bg-muted: #EEF1F4;
    --z-bg-table-head: #F9FAFB;
    --z-bg-row-hover: #F3F4F6;
    --z-border: #E5E7EB;
    --z-border-input: #D1D5DB;
    --z-btn-primary-bg: #111827;
    --z-btn-primary-text: #FFFFFF;
    --z-text: #374151;
    --z-text-primary: #111827;
    --z-text-secondary: #6B7280;
    --z-primary: #111827;
    --z-primary-rgb: 17, 24, 39;
    --z-transition: all 0.2s ease;

    /* Semantic (status, alerts) — enterprise-safe */
    --z-success: #059669;
    --z-warning: #D97706;
    --z-danger: #DC2626;
    --z-info: #2563EB;
    --z-border-light: #F3F4F6;

    /* Spacing — 8px grid (8, 16, 24, 32, 40, 48) */
    --z-space-1: 0.25rem;   /* 4px */
    --z-space-2: 0.5rem;    /* 8px */
    --z-space-3: 0.75rem;   /* 12px */
    --z-space-4: 1rem;      /* 16px — 2 units */
    --z-space-5: 1.25rem;   /* 20px */
    --z-space-6: 1.5rem;    /* 24px — 3 units */
    --z-space-8: 2rem;      /* 32px */
    --z-space-10: 2.5rem;   /* 40px */
    --z-space-12: 3rem;     /* 48px */

    /* Radius (enterprise) */
    --z-radius-card: 12px;
    --z-radius-btn: 8px;

    /* Shadows — minimal, flat-friendly */
    --z-shadow-card: 0 1px 3px rgba(0, 0, 0, 0.06);

    /* Breakpoints (for reference; use in media queries) */
    --z-breakpoint-sm: 640px;
    --z-breakpoint-md: 768px;
    --z-breakpoint-lg: 1024px;
    --z-breakpoint-xl: 1280px;
    --z-breakpoint-pos: 1366px;   /* 15.6" display typical min width; POS optimized */
    --z-breakpoint-pos-max: 1920px;
}

/* POS layout: applied when $pos_layout is true in app.blade.php; optimized for 15.6" and above */
@media (min-width: 1366px) {
    body.hold-transition.lockscreen .content-wrapper {
        /* POS-specific density can be tuned here without affecting mobile */
    }
}