/* ==========================================================================
   ZenCabs design tokens — 2026-04-14
   Additive only. Use with zc-* prefix components. Safe to layer over
   style-admin.css without overriding anything.
   ========================================================================== */

/* Inter font family — matches customer/admin panel. Declared here so RBAC
   and other zc-* surfaces don't need to re-import. style-admin.css also
   declares these; duplicate declarations are de-duped by the browser. */
@font-face {
    font-family: 'Inter'; font-weight: 300; font-style: normal; font-display: swap;
    src: url('../fonts/Inter-Light.woff2') format('woff2'), url('../fonts/Inter-Light.woff') format('woff');
}
@font-face {
    font-family: 'Inter'; font-weight: 400; font-style: normal; font-display: swap;
    src: url('../fonts/Inter-Regular.woff2') format('woff2'), url('../fonts/Inter-Regular.woff') format('woff');
}
@font-face {
    font-family: 'Inter'; font-weight: 500; font-style: normal; font-display: swap;
    src: url('../fonts/Inter-Medium.woff2') format('woff2'), url('../fonts/Inter-Medium.woff') format('woff');
}
@font-face {
    font-family: 'Inter'; font-weight: 600; font-style: normal; font-display: swap;
    src: url('../fonts/Inter-SemiBold.woff2') format('woff2'), url('../fonts/Inter-SemiBold.woff') format('woff');
}
@font-face {
    font-family: 'Inter'; font-weight: 700; font-style: normal; font-display: swap;
    src: url('../fonts/Inter-Bold.woff2') format('woff2'), url('../fonts/Inter-Bold.woff') format('woff');
}

:root {
    /* Canonical brand font stack — Inter first, then platform fallbacks. */
    --zc-font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
    --zc-font-mono: ui-monospace, 'SF Mono', Menlo, Consolas, monospace;

    /* Brand ------------------------------------------------------------- */
    --zc-brand-50:  #ecfbe9;
    --zc-brand-100: #d2f3c9;
    --zc-brand-300: #a6df94;
    --zc-brand-500: #6dbd63;  /* existing ZenCabs green */
    --zc-brand-600: #5aa352;
    --zc-brand-700: #468041;
    --zc-brand-900: #234620;

    /* Neutrals ---------------------------------------------------------- */
    --zc-slate-50:  #f8fafc;
    --zc-slate-100: #f1f5f9;
    --zc-slate-200: #e2e8f0;
    --zc-slate-300: #cbd5e1;
    --zc-slate-400: #94a3b8;
    --zc-slate-500: #64748b;
    --zc-slate-600: #475569;
    --zc-slate-700: #334155;
    --zc-slate-800: #1e293b;
    --zc-slate-900: #0f172a;

    /* Semantic ---------------------------------------------------------- */
    --zc-success: #16a34a;
    --zc-success-50: #f0fdf4;
    --zc-warning: #d97706;
    --zc-warning-50: #fffbeb;
    --zc-danger:  #dc2626;
    --zc-danger-50: #fef2f2;
    --zc-info:    #0284c7;
    --zc-info-50: #f0f9ff;

    /* Spacing — 4px grid ----------------------------------------------- */
    --zc-space-1: 4px;
    --zc-space-2: 8px;
    --zc-space-3: 12px;
    --zc-space-4: 16px;
    --zc-space-5: 20px;
    --zc-space-6: 24px;
    --zc-space-7: 32px;
    --zc-space-8: 40px;

    /* Radii ------------------------------------------------------------- */
    --zc-radius-sm: 6px;
    --zc-radius-md: 10px;
    --zc-radius-lg: 16px;
    --zc-radius-pill: 999px;

    /* Shadows ----------------------------------------------------------- */
    --zc-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.06);
    --zc-shadow-md: 0 4px 16px rgba(15, 23, 42, 0.06);
    --zc-shadow-lg: 0 16px 40px rgba(15, 23, 42, 0.08);
    --zc-shadow-focus: 0 0 0 3px rgba(109, 189, 99, 0.25);

    /* Typography -------------------------------------------------------- */
    --zc-fs-xs:   11px;
    --zc-fs-sm:   12px;
    --zc-fs-md:   13px;
    --zc-fs-lg:   15px;
    --zc-fs-xl:   18px;
    --zc-fs-2xl:  22px;
    /* KPI values responsive clamp — prevents overflow on narrow cards */
    --zc-fs-kpi:  clamp(1.1rem, 1.4vw + 0.5rem, 1.85rem);

    /* Motion ------------------------------------------------------------ */
    --zc-transition-fast: 120ms ease;
    --zc-transition-med:  200ms ease;

    /* Z-index ----------------------------------------------------------- */
    --zc-z-toast:     9000;
    --zc-z-palette:   9500;
    --zc-z-modal:     10000;
}
