:root {
  /* === Primary Brand Colors === */
  --color-primary: #0066FF;
  --color-primary-rgb: 0, 102, 255;
  --color-primary-light: rgba(0, 102, 255, 0.9);
  --color-primary-dark: #0052CC;
  
  /* === Neutral Colors === */
  --color-white: #FFFFFF;
  --color-black: #000000;
  --color-gray-50: #F9FAFB;
  --color-gray-100: #F5F5F5;
  --color-gray-200: #EBEBEB;
  --color-gray-300: #E8E8E8;
  --color-gray-400: #E5E7EB;
  --color-gray-500: #D1D5DB;
  --color-gray-600: #9CA3AF;
  --color-gray-700: #6B7280;
  --color-gray-800: #374151;
  --color-gray-900: #1F2937;
  --color-gray-950: #111827;
  
  /* === Status Colors === */
  --color-success: #22C55E;
  --color-success-light: #E0F7FA;
  --color-success-dark: #005A80;
  --color-warning: #F59E0B;
  --color-danger: #EF4444;
  --color-info: #3B82F6;
  
  /* === Sidebar Specific Colors === */
  --sidebar-bg: var(--color-gray-100);
  --sidebar-border: var(--color-gray-300);
  --sidebar-text: var(--color-gray-800);
  --sidebar-text-muted: var(--color-gray-600);
  --sidebar-hover-bg: var(--color-gray-200);
  --sidebar-hover-text: var(--color-gray-950);
  --sidebar-active-bg: var(--color-primary);
  --sidebar-active-hover-bg: var(--color-primary-light);
  --sidebar-active-text: var(--color-white);
  --sidebar-divider: var(--color-gray-400);
  
  /* === Menu Item Colors === */
  --menu-item-text: var(--color-gray-800);
  --menu-item-hover-bg: var(--color-gray-200);
  --menu-item-hover-text: var(--color-gray-950);
  --menu-item-active-bg: var(--color-primary);
  --menu-item-active-text: var(--color-white);
  
  /* === Child Menu Colors === */
  --child-menu-text: var(--color-gray-700);
  --child-menu-hover-bg: var(--color-gray-200);
  --child-menu-hover-text: var(--color-gray-900);
  --child-menu-active-bg: var(--color-success-light);
  --child-menu-active-text: var(--color-success-dark);
  --child-dot: var(--color-gray-500);
  --child-dot-hover: var(--color-gray-600);
  --child-dot-active: var(--color-warning);
  --child-border: var(--color-gray-500);
  
  /* === Profile Card Colors === */
  --profile-bg: var(--color-gray-100);
  --profile-hover-bg: var(--color-gray-200);
  --profile-name-bg: var(--color-gray-900);
  --profile-name-text: var(--color-white);
  --profile-role-text: var(--color-success);
  --profile-avatar-bg: var(--color-gray-400);
  
  /* === Border Colors === */
  --border-light: #E0E0E0;
  --border-default: #DDD;
  --border-gray: #CCC;
  --border-dark: #999;
  
  /* === Legacy Skin Colors (for compatibility) === */
  --skin-aqua-border: #3C8DBC;
  --skin-black-border: #3C8DBC;
  
  /* === Background Colors === */
  --bg-light: #D2D6DE;
  --bg-secondary: #E2E4E6;
  
  /* === Shadow Colors === */
  --shadow-light: rgba(0, 0, 0, 0.1);
  --shadow-medium: rgba(0, 0, 0, 0.2);
  --shadow-dark: rgba(0, 0, 0, 0.8);
  
  /* === Blockquote & Special Elements === */
  --blockquote-border: #EEE;
  --tooltip-bg: var(--color-black);
  --popover-border: rgba(0, 0, 0, 0.25);
}
