:root {
    --primary: #b496ef;
    --primary-hover: #6f1dfd;

    --primary-light: #5e5675;
    --success: #a479d0;
    --success-light: #d1fae5;
    --danger: #ef5e44;
    --danger-light: #fee2e2;
    --warning: #00ACC0;
    --warning-light: #fef3c7;
    --info: #3b82f6;
    --info-light: #dbeafe;
    --bg-primary: #2a2539;
    --bg-secondary: #2e2d33;
    --bg-tertiary: #474565;
    --bg-quaternary: #484675;
    --bg-degrade: radial-gradient(circle at top right, rgba(168, 85, 247, 0.15), transparent), radial-gradient(circle at bottom left, rgba(59, 130, 246, 0.1), transparent);
    /*from left*/
    --bg-degrade-bis: linear-gradient(0deg, #303647, #333243);
    /* --bg-degrade:#33302d;*/
    --bg-tr1: rgba(30, 30, 30, 0.3);
    --bg-tr2: #423e39;

    --bg-hover: #4b4a48;
    --bg-active: #6b6a63;
    --bg-dark: #232120;
    --text-primary: #f8f7f3;
    --text-secondary: #c9c2b7;
    --text-tertiary: #a199d9;
    --text-inverse: #ffffff;
    --border-color: #363632;
    --border-hover: #4b4a48;
    --border-focus: #00ACC0;
    --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
    --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1);
    --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1);
    --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1);
    --spacing-xs: 0.25rem;
    --spacing-sm: 1rem;
    --spacing-md: 1rem;
    --spacing-lg: 1.5rem;
    --spacing-xl: 2rem;
    --spacing-2xl: 3rem;
    --radius-sm: 0.375rem;
    --radius-md: 0.5rem;
    --radius-lg: 1.5rem;
    --radius-xl: 1rem;
    --radius-full: 9999px;
    --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
    --transition-base: 200ms cubic-bezier(0.4, 0, 0.2, 1);
    --transition-slow: 300ms cubic-bezier(0.4, 0, 0.2, 1);
    --z-dropdown: 1000;
    --z-sticky: 1020;
    --z-fixed: 1030;
    --z-modal-backdrop: 1040;
    --z-modal: 1050;
    --z-popover: 1060;
    --z-tooltip: 1070;
    --header-height: 60px;
    --sidebar-width: 272px !important;
    --chat-width: 65%;
    --bg-card: #292937;
}