/* ============================================================
   SMART FARMING — Design Tokens (CSS Custom Properties)
   ============================================================ */

:root {
    /* ── Colors ─────────────────────────────────────────────── */
    --color-primary:        #16A34A;
    --color-primary-dark:   #15803D;
    --color-primary-light:  #DCFCE7;

    --color-bg:             #F7FAF8;
    --color-surface:        #FFFFFF;

    --color-text:           #111827;
    --color-text-secondary: #6B7280;

    --color-border:         #E5E7EB;

    /* Status */
    --color-success:        #16A34A;
    --color-success-bg:     #DCFCE7;

    --color-warning:        #D97706;
    --color-warning-bg:     #FEF3C7;

    --color-danger:         #DC2626;
    --color-danger-bg:      #FEE2E2;

    /* ── Spacing ────────────────────────────────────────────── */
    --space-xs:   4px;
    --space-sm:   8px;
    --space-md:   16px;
    --space-lg:   24px;
    --space-xl:   32px;
    --space-2xl:  48px;

    /* ── Typography ─────────────────────────────────────────── */
    --font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI',
                   Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue',
                   sans-serif;

    --text-xs:    0.75rem;    /* 12px */
    --text-sm:    0.875rem;   /* 14px */
    --text-base:  1rem;       /* 16px */
    --text-lg:    1.125rem;   /* 18px */
    --text-xl:    1.25rem;    /* 20px */
    --text-2xl:   1.5rem;     /* 24px */
    --text-3xl:   1.875rem;   /* 30px */

    /* ── Border Radius ──────────────────────────────────────── */
    --radius-sm:   6px;
    --radius-md:   10px;
    --radius-lg:   14px;
    --radius-full: 9999px;

    /* ── Shadows ────────────────────────────────────────────── */
    --shadow-xs:  0 1px 2px  rgba(0, 0, 0, 0.04);
    --shadow-sm:  0 1px 3px  rgba(0, 0, 0, 0.06),
                  0 1px 2px  rgba(0, 0, 0, 0.04);
    --shadow-md:  0 4px 6px  rgba(0, 0, 0, 0.06),
                  0 2px 4px  rgba(0, 0, 0, 0.04);
    --shadow-lg:  0 10px 15px rgba(0, 0, 0, 0.08),
                  0 4px  6px  rgba(0, 0, 0, 0.04);

    /* ── Transitions ────────────────────────────────────────── */
    --transition:      0.2s ease;
    --transition-slow: 0.35s ease;

    /* ── Layout ─────────────────────────────────────────────── */
    --sidebar-width: 260px;
}