/* ============================================================
   QB ALB — Design Tokens (Matched to User Mockup)
   ============================================================ */

:root {
  /* ── Brand Colors (Awami League Green) ── */
  --primary:          #0f703c; /* Awami League Green */
  --primary-hover:    #0c5c31;
  --primary-light:    #eef7f2; /* Soft green highlight background */
  --primary-subtle:   #f4faf6;
  --primary-dark:     #083d21;
  --secondary:        #1877f2; /* Blue accents */

  /* ── Neutral Palette (White Theme from mockup) ── */
  --background:       #f0f2f5; /* Light gray body background */
  --background-alt:   #e4e6e9;
  --surface:          #ffffff; /* White cards and panels */
  --surface-muted:    #f7f8fa;
  --surface-hover:    #f2f3f5;

  /* ── Text Colors ── */
  --text-primary:     #050505;
  --text-secondary:   #65676b;
  --text-tertiary:    #8a8d91;
  --text-on-primary:  #ffffff;

  /* ── Borders ── */
  --border:           #e4e6e9; /* Light border line */
  --border-strong:    #ced0d4;

  /* ── State Colors ── */
  --success:          #28a745;
  --success-light:    #eef7f2;
  --danger:           #e41e3f;
  --danger-light:     #fce9eb;
  --warning:          #f5a623;
  --warning-light:    #fef7eb;
  --info:             #1877f2;
  --info-light:       #e7f3ff;
  --live-red:         #e41e3f;

  /* ── Typography ── */
  --font-sans:        'Hind Siliguri', 'Inter', -apple-system, sans-serif;
  --font-mono:        'Courier New', monospace;

  --text-xs:          0.75rem;
  --text-sm:          0.85rem;
  --text-base:        0.95rem;
  --text-md:          1.05rem;
  --text-lg:          1.2rem;
  --text-xl:          1.35rem;
  --text-2xl:         1.6rem;

  --weight-normal:    400;
  --weight-medium:    500;
  --weight-semibold:  600;
  --weight-bold:      700;
  --weight-extrabold: 800;

  /* ── Spacing ── */
  --space-1:    0.25rem;
  --space-2:    0.5rem;
  --space-3:    0.75rem;
  --space-4:    1rem;
  --space-5:    1.25rem;
  --space-6:    1.5rem;
  --space-8:    2rem;
  --space-10:   2.5rem;

  /* ── Dimensions ── */
  --sidebar-width:          260px;
  --topbar-height:          60px;
  --bottom-nav-height:      56px;
  --right-panel-width:      290px;
  --profile-panel-width:    360px;

  /* ── Radius ── */
  --radius-xs:   4px;
  --radius-sm:   8px;
  --radius-md:   12px;
  --radius-lg:   16px;
  --radius-full: 9999px;

  /* ── Shadows ── */
  --shadow-xs:  0 1px 2px rgba(0,0,0,0.05);
  --shadow-sm:  0 1px 3px rgba(0,0,0,0.08);
  --shadow-md:  0 4px 12px rgba(0,0,0,0.05);
  --shadow-lg:  0 8px 24px rgba(0,0,0,0.08);

  /* ── Transitions ── */
  --transition-fast:   0.12s ease;
  --transition-base:   0.2s ease;
}