@media (prefers-color-scheme : light)
{
    :root
    {
        --main-bg-color: #fff;
        --alt-bg-color: #f0f0f0;
        --main-header-bg-color: #d0eeff;
        --main-entryurl: #686;

        --font-color: #333333;
        --body-bg: #c4c4c4;

        --border-color: #000;

        --link-color: #b40;
        --link-visited-color: #840;

        --webdir-link-color: #8f5d00;
        --webdir-link-visited-color: #004a8f;
        --webdir-link-hover-color: #084;

        --cat-link-border-color: #810;

        --header-bg-color: #a2ddfd;

        --nav-bg-color: #40b2ee;
    }
}

@media (prefers-color-scheme : dark)
{
    :root {
        /* Backgrounds and Base Colors */
        --main-bg-color: #121212;
        --alt-bg-color: #1e1e1e;
        --main-header-bg-color: #0d1d2d;
        --body-bg: #202020;
        --header-bg-color: #242424;
        --nav-bg-color: #1f1f1f;
    
        /* Text and Borders */
        --font-color: #e0e0e0;
        --border-color: #444;
    
        /* Accent & Link Colors */
        --main-entryurl: #8f8; /* A bright green accent against dark backgrounds */
    
        --link-color: #ffa300;          /* Vibrant orange for links */
        --link-visited-color: #b27500;  /* A darker orange/brown for visited links */
    
        --webdir-link-color: #ffa300;           /* Matches primary link color */
        --webdir-link-visited-color: #3399ff;   /* A clear blue for visited state */
        --webdir-link-hover-color: #00aa88;     /* A teal highlight on hover */
    
        --cat-link-border-color: #ff8800; /* Slightly lighter orange for emphasis */
    }
    
}