:root {
    /* Brand */
    --brand-name: "Credere Backoffice";

    /* Typography */
    --font-sans: ui-sans-serif, system-ui, sans-serif, system-emoji;
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Courier New";

    --text-2xs: 0.625rem;
    --text-xs: 0.6875rem;
    --text-sm: 0.75rem;
    --text-base: 0.875rem;
    --text-lg: 1rem;
    --text-xl: 1.125rem;
    --text-2xl: 1.25rem;
    --text-3xl: 1.5rem;
    --text-4xl: 1.875rem;

    /* Font weights */
    --font-normal: 400;
    --font-medium: 500;
    --font-semibold: 600;
    --font-bold: 700;

    --color-primary: #20C3C3;
    --color-primary-hover: #17AEAE;
    --color-primary-strong: #0B9FA5;
    --color-primary-soft: #E8FAF9;
    --color-primary-ring: rgba(32, 195, 195, 0.2);

    --color-background: #F7F9FA;
    --color-surface: #FFFFFF;
    --color-surface-muted: #F7F9FA;
    --color-field: #F3F3F5;

    --color-text: #172033;
    --color-text-strong: #0B1F3A;
    --color-text-muted: #667085;
    --color-text-faint: #9CA3AF;

    --color-border: #DDE4E8;
    --color-border-card: #D9E1E8;
    --color-border-soft: #F0F4F8;

    --color-red: #D64545;
    --color-orange: #F97316;
    --color-amber: #F59E0B;
    --color-yellow: #EAB308;
    --color-lime: #65A30D;
    --color-green: #22A06B;
    --color-emerald: #22A06B;
    --color-teal: #20C3C3;
    --color-cyan: #06B6D4;
    --color-sky: #0EA5E9;
    --color-blue: #1D4ED8;
    --color-indigo: #6366F1;
    --color-violet: #7C3AED;
    --color-purple: #9333EA;
    --color-fuchsia: #C026D3;
    --color-pink: #DB2777;
    --color-rose: #E11D48;

    --color-success: #22A06B;
    --color-success-soft: #E8F7F0;
    --color-error: #D64545;
    --color-error-soft: #FEF2F2;
    
    --color-error-ring: rgba(214, 69, 69, 0.18);
    --color-warning: #F59E0B;
    --color-warning-soft: #FFF8E6;
    --color-info: #6366F1;
    --color-info-soft: #EEF2FF;

    --color-gray-50: #F7F9FA;
    --color-gray-100: #F0F4F8;
    --color-gray-200: #DDE4E8;
    --color-gray-300: #CBD5E1;
    --color-gray-400: #9CA3AF;
    --color-gray-500: #808A9D;
    --color-gray-600: #667085;
    --color-gray-700: #4B5565;
    --color-gray-800: #303642;
    --color-gray-900: #172033;
    --color-gray-950: #0B1F3A;

    /* Basics */
    --color-white: #fff;
    --color-black: #000;
    --color-transparent: transparent;

    /* Spacing */
    --space-0: 0;
    --space-px: 1px;
    --space-0-5: 0.125rem;
    --space-1: 0.25rem;
    --space-1-5: 0.375rem;
    --space-2: 0.5rem;
    --space-2-5: 0.625rem;
    --space-3: 0.75rem;
    --space-3-5: 0.875rem;
    --space-4: 1rem;
    --space-5: 1.25rem;
    --space-6: 1.5rem;
    --space-7: 1.75rem;
    --space-8: 2rem;
    --space-9: 2.25rem;
    --space-10: 2.5rem;
    --space-11: 2.75rem;
    --space-12: 3rem;
    --space-14: 3.5rem;
    --space-16: 4rem;
    --space-20: 5rem;
    --space-24: 6rem;

    --radius-none: 0;
    --radius-xs: 0.25rem;
    --radius-sm: 0.5rem;
    --radius-md: 0.5rem;
    --radius-lg: 0.625rem;
    --radius-xl: 0.875rem;
    --radius-2xl: 0.875rem;
    --radius-3xl: 1.25rem;
    --radius-full: 9999px;

    --control-height: 40px;
    --control-height-sm: 36px;
    --control-height-lg: 48px;
    --row-height: 57px;

    /* Transitions */
    --duration-default: 0.15s;
    --ease-default: cubic-bezier(.4, 0, .2, 1);

    /* Blurs */
    --blur-sm: 4px;
    --blur: 8px;
    --blur-md: 12px;
    --blur-lg: 16px;

    --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
    --shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
    --shadow-md: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
    --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    --shadow-xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);
    --shadow-drawer: 0 25px 50px -12px rgb(0 0 0 / 0.25);
}