/*Fonts family*/
:root {
    --Font-title: 'Trenda', sans-serif;
    --Font-text: 'Roboto', sans-serif;
}

/*Font size*/
:root {
    --Text-4xl : 3rem;
    --Text-3xl : 2.25rem;
    --Text-2xl : 1.75rem;
    --Text-xl : 1.5rem;
    --Text-l : 1.25rem;
    --Text-m : 1.125rem;
    --Text-base : 1rem;
    --Text-paragraph : 1rem;
    --Text-s : 0.875rem;
    --Text-xs : 0.75rem;
    --Text-xxs: 0.65rem;
}

/*Colors*/
:root {
    --Color-background-primary: #0a0f1a;
    --Color-background-secondary: #111827;
    --Color-background-tertiary: #19202e;
    --Color-primary : #8A2BE2;
    --Color-success: #4b910f;
    --Color-error: #a80000;
    --Color-text-primary: #001f3f;
    --Color-light: #e4e4e4;
    --Color-light-hover: #cfdde6;
    --Color-delete: #830000;
    --Color-separator: #242a33;
}

/*Spacing*/
:root{
    --spacing-none: 0px;
    --spacing-05: 2px;
    --spacing-1: 4px;
    --spacing-2: 8px;
    --spacing-3: 12px;
    --spacing-3-5: 14px;
    --spacing-4: 16px;
    --spacing-5: 24px;
    --spacing-5-5 : 28px;
    --spacing-6: 32px;
    --spacing-7: 40px;
    --spacing-8: 56px;
    --spacing-9: 72px;
}

/*Radius*/
:root {
    --Radius-zero : 0px;
    --Radius-base : 4px;
    --Radius-medium : 8px;
    --Radius-round : 50%;
}

/*Shadow*/
:root {
    --Box-shadow: 0 0 0 1px #1f2937;
}