:root {
    /* Base Colors */
    --white: rgb(255, 255, 255);
    --black: rgb(0, 0, 0);

    /* Gray Scale */
    --gray: rgb(64, 64, 64);           /* Dark gray for text */
    --alt-gray: rgb(160, 160, 160);     /* Medium gray for borders */
    --bg-gray: rgb(246, 246, 246);      /* Light gray for backgrounds */

    /* Pink (Primary Brand) */
    --pink: rgb(255, 0, 122);           /* Vibrant pink */
    --alt-pink: rgb(255, 180, 215);     /* Soft pink for hovers */
    --bg-pink: rgb(255, 246, 237);      /* Very light pink background */

    /* Red (Error/Danger) */
    --red: rgb(255, 0, 0);
    --alt-red: rgb(255, 180, 180);
    --bg-red: rgb(255, 237, 237);

    /* Orange (Warning) */
    --orange: rgb(255, 64, 0);
    --alt-orange: rgb(255, 210, 180);
    --bg-orange: rgb(255, 246, 237);

    /* Yellow (Caution) */
    --yellow: rgb(255, 192, 0);
    --alt-yellow: rgb(255, 230, 180);
    --bg-yellow: rgb(255, 252, 237);

    /* Green (Success) */
    --green: rgb(0, 128, 64);
    --alt-green: rgb(180, 255, 215);
    --bg-green: rgb(237, 255, 246);

    /* Blue (Info) */
    --blue: rgb(0, 64, 255);
    --alt-blue: rgb(180, 210, 255);
    --bg-blue: rgb(237, 246, 255);

    /* Purple (Special) */
    --purple: rgb(128, 0, 255);
    --alt-purple: rgb(215, 180, 255);
    --bg-purple: rgb(246, 237, 255);

    /* Brown (Neutral/Docs theme) */
    --brown: rgb(139, 69, 19);
    --alt-brown: rgb(220, 190, 180);
    --bg-brown: rgb(252, 248, 246);
}