/* tokens.css — mandir design system (copied from mandir/css/tokens.css) */

:root {
  /* Color — warm, calm, temple-inspired */
  --c-bg:       #faf9f7;
  --c-surface:  #ffffff;
  --c-border:   #e8e4df;
  --c-text:     #2d2a26;
  --c-text-dim: #8a857e;
  --c-accent:   #6b5ce7;    /* devotional purple */
  --c-accent-h: #5a4bd6;    /* hover */
  --c-ok:       #3a9e6e;    /* positive / income */
  --c-warn:     #e6a23c;
  --c-err:      #e25c5c;    /* negative / expense */

  /* Category colors */
  --c-cat-purple: #6b5ce7;
  --c-cat-amber:  #b8860b;
  --c-cat-teal:   #1a7a72;
  --c-cat-blue:   #3a6098;
  --c-cat-green:  #2d7a52;
  --c-cat-brown:  #7a5c30;
  --c-cat-indigo: #504696;
  --c-cat-gray:   #aaa;

  /* Space — 4px base, limited scale */
  --s-xs:  0.25rem;   /* 4 */
  --s-sm:  0.5rem;    /* 8 */
  --s-md:  1rem;      /* 16 */
  --s-lg:  1.5rem;    /* 24 */
  --s-xl:  2rem;      /* 32 */
  --s-2xl: 3rem;      /* 48 */

  /* Typography */
  --f-sans: system-ui, -apple-system, sans-serif;
  --f-mono: ui-monospace, 'SF Mono', monospace;
  --f-xs:  0.75rem;   /* 12 */
  --f-sm:   0.875rem; /* 14 */
  --f-md:   1rem;     /* 16 */
  --f-lg:   1.25rem;  /* 20 */
  --f-xl:   1.5rem;   /* 24 */
  --f-2xl:  1.75rem;  /* 28 */
  --f-3xl: 2.5rem;    /* 40 */
  --f-wt:   400;
  --f-wt-b: 600;

  /* Radius */
  --r-sm:  0.375rem;  /* 6 */
  --r-md:  0.625rem;  /* 10 */
  --r-lg:  1rem;      /* 16 */
  --r-xl:  1.5rem;    /* 24 */

  /* Shadow */
  --sh-sm: 0 1px 2px rgba(0,0,0,.06);
  --sh-md: 0 4px 12px rgba(0,0,0,.08);
  --sh-lg: 0 8px 24px rgba(0,0,0,.12);
  --focus-ring: 0 0 0 3px rgba(107, 92, 231, .12);

  /* Layout */
  --w-max:   72rem;   /* 1152px */
  --w-modal: 40rem;   /* modal dialog */
  --w-form:  24rem;   /* narrow form / toast */
  --h-input: 2.625rem;

  /* Semantic tints */
  --c-white:          #fff;
  --c-neutral-hover:  rgba(0, 0, 0, .04);
  --c-neutral-active: rgba(0, 0, 0, .06);
  --c-accent-hover:   rgba(107, 92, 231, .10);
  --c-accent-active:  rgba(107, 92, 231, .10);
  --c-err-hover:      rgba(226, 92, 92, .08);
  --c-err-active:     rgba(226, 92, 92, .10);
  --c-ok-active:      rgba(58, 158, 110, .10);
  --c-warn-active:    rgba(230, 162, 60, .12);

  /* Warning family */
  --c-warn-text:   rgb(180, 115, 0);
  --c-warn-amber:  #96700a;
  --c-warn-bg:     rgba(245, 158, 11, .08);
  --c-warn-border: rgba(245, 158, 11, .3);

  /* Search highlight */
  --c-hl-bg:   #ffeb3b;
  --c-hl-text: #1f1a00;

  /* Overlays */
  --c-overlay:      rgba(0, 0, 0, .4);
  --c-overlay-dark: rgba(0, 0, 0, .85);
}
