/* ============================================================
   SAHAJ CONNECT — DESIGN SYSTEM TOKENS (DS-1)
   SINGLE SOURCE OF TRUTH for shared visual tokens.
   Loaded FIRST in every layout (admin / guest / public / print-safe).
   Adopts the existing brand family (blue #1a56b0 + gold #e8a838) already
   used by the public site, so nothing regresses. New DS components use the
   --ds-* names; legacy variable names are ALIASED at the bottom for backward
   compatibility so current CSS keeps working unchanged.
   PRESENTATION ONLY — no functional/behavioural impact.
   ============================================================ */
:root {
    /* ---- Brand ---- */
    --ds-primary:            #1a56b0;   /* trustworthy consultancy blue */
    --ds-primary-hover:      #164a99;
    --ds-primary-active:     #0f3a7a;
    --ds-primary-soft:       #eaf1fb;   /* pale blue surface */
    --ds-primary-contrast:   #ffffff;
    --ds-accent:             #e8a838;   /* gold */
    --ds-accent-hover:       #c8891f;
    --ds-accent-soft:        #fdf4e0;

    /* ---- Neutrals (ramp) ---- */
    --ds-neutral-0:          #ffffff;
    --ds-neutral-50:         #f7f9fc;
    --ds-neutral-100:        #f3f7fd;
    --ds-neutral-200:        #e2e8f2;
    --ds-neutral-300:        #cdd6e4;
    --ds-neutral-400:        #9aa8bd;
    --ds-neutral-500:        #5b6b82;
    --ds-neutral-700:        #34435a;
    --ds-neutral-900:        #14243b;

    /* ---- Surfaces / structure ---- */
    --ds-bg:                 #f5f8fc;   /* app page background */
    --ds-surface:            #ffffff;   /* cards / panels */
    --ds-surface-elevated:   #ffffff;
    --ds-surface-muted:      #f3f7fd;
    --ds-surface-hover:      #eef3fb;
    --ds-surface-selected:   #eaf1fb;
    --ds-border:             #e2e8f2;
    --ds-border-strong:      #cdd6e4;

    /* ---- Text ---- */
    --ds-text:               #14243b;
    --ds-text-muted:         #5b6b82;
    --ds-text-subtle:        #8493a8;
    --ds-text-inverse:       #ffffff;

    /* ---- Semantic states (base + soft) ---- */
    --ds-success:            #0e9f6e;   --ds-success-soft: #e6f6ef;
    --ds-warning:            #b7791f;   --ds-warning-soft: #fdf4e0;
    --ds-danger:             #d0342c;   --ds-danger-soft:  #fdeceb;
    --ds-info:               #1a56b0;   --ds-info-soft:    #eaf1fb;
    --ds-neutral-soft:       #eef2f7;

    /* ---- Interaction ---- */
    --ds-link:               #1a56b0;
    --ds-focus-ring:         0 0 0 3px rgba(26,86,176,.35);
    --ds-disabled-bg:        #eef1f5;
    --ds-disabled-text:      #9aa8bd;
    --ds-disabled-border:    #e2e8f2;

    /* ---- Typography ---- */
    --ds-font: 'Segoe UI', system-ui, -apple-system, Roboto, "Noto Sans",
               "Noto Sans Bengali", "Noto Serif Bengali", "Helvetica Neue", Arial, sans-serif;
    --ds-font-mono: ui-monospace, SFMono-Regular, "Cascadia Code", Consolas, "Liberation Mono", monospace;
    --ds-fs-xs: 12px;  --ds-fs-sm: 13px;  --ds-fs-base: 14px;  --ds-fs-md: 16px;
    --ds-fs-lg: 18px;  --ds-fs-xl: 22px;  --ds-fs-2xl: 26px;   --ds-fs-3xl: 30px;
    --ds-lh-tight: 1.25;  --ds-lh-base: 1.5;  --ds-lh-loose: 1.7;
    --ds-fw-regular: 400; --ds-fw-medium: 500; --ds-fw-semibold: 600; --ds-fw-bold: 700;

    /* ---- Spacing scale (4px base) ---- */
    --ds-space-1: 4px;  --ds-space-2: 8px;   --ds-space-3: 12px; --ds-space-4: 16px;
    --ds-space-5: 24px; --ds-space-6: 32px;  --ds-space-7: 48px; --ds-space-8: 64px;
    --ds-gap-section: 24px;

    /* ---- Sizing ---- */
    --ds-control-h: 40px;         /* inputs/buttons */
    --ds-control-h-sm: 32px;
    --ds-touch-min: 44px;         /* minimum touch target */
    --ds-content-max: 1150px;     /* app content max width */
    --ds-prose-max: 720px;        /* readable public prose */

    /* ---- Radius ---- */
    --ds-radius-sm: 6px;  --ds-radius-md: 10px;  --ds-radius-lg: 14px;  --ds-radius-pill: 999px;
    --ds-border-w: 1px;

    /* ---- Shadow ---- */
    --ds-shadow-sm: 0 1px 3px rgba(15,58,122,.08);
    --ds-shadow-md: 0 4px 14px rgba(15,58,122,.10);
    --ds-shadow-lg: 0 10px 30px rgba(15,58,122,.12);

    /* ---- Motion ---- */
    --ds-motion-fast: 120ms;  --ds-motion-standard: 200ms;
    --ds-ease: cubic-bezier(.2,.6,.3,1);

    /* ---- Shell foundation (consumed by DS-3 Admin / DS-4 Workspace shells) ---- */
    --ds-sidebar-w: 248px;  --ds-sidebar-collapsed-w: 64px;  --ds-header-h: 56px;  --ds-bottomnav-h: 60px;

    /* ---- Standard breakpoints (documented; use in @media via these pixel values) ----
       --ds-bp-sm: 375px  (mobile small)
       --ds-bp-md: 640px  (mobile/tablet)
       --ds-bp-lg: 1024px (tablet/desktop)
       --ds-bp-xl: 1440px (wide desktop)
       (CSS custom properties can't be used inside @media conditions, so these are
        the canonical values components must use in their media queries.) */
}

/* ============================================================
   LEGACY COMPATIBILITY ALIASES
   Map pre-DS variable names to the SSOT so existing admin.css / site.css and
   inline usages keep working AND now flow from tokens.css when their own
   :root does not redefine them (admin/guest layouts previously had NO colour
   tokens at all). Where site.css re-declares these, its later load wins and
   the current public look is preserved exactly.
   ============================================================ */
:root {
    --brand:        var(--ds-primary);
    --brand-dark:   var(--ds-primary-active);
    --brand-darker: #0a2650;
    --accent:       var(--ds-accent);
    --accent-dark:  var(--ds-accent-hover);
    --ink:          var(--ds-text);
    --muted:        var(--ds-text-muted);
    --bg:           var(--ds-neutral-0);
    --soft:         var(--ds-primary-soft);
    --soft2:        #eaf1fb;
    --line:         var(--ds-border);
    --ok:           var(--ds-success);
    --radius:       var(--ds-radius-lg);
    --shadow:       var(--ds-shadow-lg);
    --shadow-sm:    var(--ds-shadow-sm);
    --wrap:         var(--ds-content-max);
    --font:         var(--ds-font);
}