:root {


    
    /* colors */
    --p50: #f0f7ff;
    --p100: #e0f0ff;
    --p200: #bae0ff;
    --p300: #3b82f5;
    --p400: #2664eb;
    --p500: #1d4ed8;
    --p600: #1e40b0;


    --s50: #fafafa;
    --s100: #ebf0ec;
    --s200: #9aa396;
    --s300: #4a5448;
    --s400: #374734;
    --s500: #2d382b;
    --s600: #1f261f;


    --n50: #f7f9fa;
    --n100: #f2f3f5;
    --n200: #e4e6eb;
    --n300: #d0d5db;
    --n400: #9da4b0;
    --n500: #6b7280;
    --n600: #4c5663;
    --n700: #374152;
    --n800: #1f2a38;
    --n900: #111826;


    --success: #11ba82;
    --warning: #f59f0a;
    --error: #f04343;
    --errorHover:#d13636;

    --white:#ffffff;
    --dark:#000000;


    /* others */

    --border-radius: 8px;
    --box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    --transition-speed: 0.3s;
}