/*
 * Design tokens — the single source of truth for colour, radius, shadow and type (§21.3).
 *
 * Nothing but :root belongs in this file, and no literal colour belongs anywhere else.
 * Values are lifted from the design prototype in design/**\/*.dc.html.
 */
:root {
    /* --- brand green ------------------------------------------------------- */
    --zs-green: #17c653;
    --zs-green-dark: #0b9e42;
    --zs-green-bright: #2fd968;
    --zs-green-pale: #eafff3;
    --zs-green-soft: #8ff0b4;

    /* --- blue (roles, avatars) --------------------------------------------- */
    --zs-blue: #1b84ff;
    --zs-blue-dark: #0b63d6;
    --zs-blue-pale: #eef4ff;

    /* --- amber (status pills, notices) ------------------------------------- */
    --zs-amber: #ffcf4d;
    --zs-amber-strong: #f6b100;
    --zs-amber-pale: #fff8e7;
    --zs-amber-border: #ffe2a8;
    --zs-amber-ink: #8a6100;

    /* --- categorical accents (dashboard tiles) ----------------------------- */
    --zs-purple: #7239ea;
    --zs-purple-pale: #f4efff;
    --zs-red: #f8285a;
    --zs-red-pale: #fff5f8;

    /* --- ink and text ------------------------------------------------------ */
    --zs-ink: #071437;
    --zs-ink-light: #12213f;
    --zs-text: #071437;
    --zs-text-muted: #4b5675;
    --zs-text-soft: #78829d;
    --zs-text-dim: #99a1b7;
    --zs-text-faint: #b5b5c3;
    --zs-text-placeholder: #aeb4c2;
    --zs-text-disabled: #c9cdd8;

    /* on the dark placeholder background */
    --zs-on-dark: #ffffff;
    --zs-on-dark-muted: #aeb7cc;
    --zs-on-dark-dim: #8b97b3;

    /* --- surfaces ---------------------------------------------------------- */
    --zs-surface: #ffffff;
    --zs-canvas: #f7f8fa;
    --zs-canvas-sunken: #f8f9fb;
    --zs-canvas-hover: #f2f4f7;
    --zs-field: #fbfbfc;
    --zs-border: #f1f1f4;
    --zs-border-soft: #f5f5f7;
    --zs-border-strong: #eef0f4;
    --zs-border-field: #e6e9ef;

    /* --- map placeholder ---------------------------------------------------- */
    /* The drawn stand-in for the office map; replaced wholesale by a real static image. */
    --zs-map-ground: #e8ebe4;
    --zs-map-grid: #dfe3da;

    /* --- radii ------------------------------------------------------------- */
    --zs-radius-sm: 10px;
    --zs-radius: 12px;
    --zs-radius-lg: 16px;
    --zs-radius-xl: 34px;
    --zs-radius-pill: 99px;

    /* --- shadows ----------------------------------------------------------- */
    --zs-shadow-green: 0 6px 14px rgba(23, 198, 83, .35);
    --zs-shadow-green-lg: 0 8px 20px rgba(23, 198, 83, .45);
    --zs-shadow-green-xl: 0 24px 50px -20px rgba(23, 198, 83, .7);

    /* --- type -------------------------------------------------------------- */
    --zs-font: 'Vazirmatn', 'Segoe UI', Tahoma, sans-serif;
    --zs-font-icon: 'Material Symbols Rounded';

    /* --- layout ------------------------------------------------------------ */
    --zs-sidebar-width: 264px;
    --zs-header-height: 70px;
}