/* master-tokens.css*/
/* =========================================
   GLOBAL DESIGN TOKENS
   This file defines the core design tokens for the application, including colors, 
   typography, spacing, and other fundamental styles. 
   These tokens serve as the single source of truth for the design system, ensuring 
   consistency across all components and screens.
========================================= */

:root {

  /* App Background */
  --color-bg-app: #b5b5b8;      /* Light gray body */

  --color-bg-main: #000000;      /* dark surface */
  --color-bg-elevated: #111827;  /* deeper background */

  /* Surfaces */
  --color-bg-surface: #ffffff;  /* Cards */
  --color-bg-widget: #f3f4f6;

  /* Dark Surfaces */
  --color-bg-navbar: #000000;   /* BLACK NAVBAR */
  --color-bg-sidebar: #0b0f1a;

 /* Dark Surfaces */
  --color-black: #000000;   /* BLACK NAVBAR */

  /* Brand */
  --color-primary: #4f46e5;
  --color-primary-hover: #4338ca;
  --color-primary-soft: rgba(79, 70, 229, 0.12);
  --color-primary-soft-strong: rgba(79, 70, 229, 0.20);

   /* Brand */
  --color-secondary: #aaa83b;
  --color-secondary-hover: #000;
  --color-secondary-soft: rgba(170, 168, 59, 0.12);
  --color-secondary-soft-strong: rgba(170, 168, 59, 0.20);

  /* Borders */
  --color-border-subtle: rgba(0,0,0,0.08);
  --color-border-primary: rgba(79,70,229,0.35);

  /* Text (light mode base) */
  --color-text-main: #000000;
  --color-text-strong: #111827;
  --color-text-muted: #676e7c;

  --color-success: #22c55e;        /* green */
  --color-success-hover: #16a34a;  /* darker green */
  --color-success-soft: rgba(34,197,94,0.15);

  /* Navbar text (dark surface) */
  --color-text-on-dark: #ffffff;
  --color-text-on-dark-muted: rgba(255,255,255,0.8);

  /* Overlay */
  --color-overlay: rgba(0,0,0,0.4);
  /* Danger */
  --color-danger: #ef4444;          /* red-500 */
  --color-danger-hover: #dc2626;    /* red-600 */
  --color-danger-soft: rgba(239,68,68,0.12);
}