/**
 * ANSI 16-Color Palette System
 * Accurate reproductions of classic terminal colors for authentic BBS aesthetic
 * 
 * Based on historical ANSI color standards and modern screen calibration
 * Colors are optimized for readability and authentic terminal appearance
 */

:root {
    /* ANSI 16-Color Palette */
    
    /* Standard Colors (0-7) */
    --ansi-black: #000000;           /* ANSI 0 - Pure black */
    --ansi-red: #AA0000;             /* ANSI 1 - Dark red */
    --ansi-green: #00AA00;           /* ANSI 2 - Dark green (our primary) */
    --ansi-yellow: #AA5500;          /* ANSI 3 - Dark yellow/brown */
    --ansi-blue: #0000AA;            /* ANSI 4 - Dark blue */
    --ansi-magenta: #AA00AA;         /* ANSI 5 - Dark magenta */
    --ansi-cyan: #00AAAA;            /* ANSI 6 - Dark cyan */
    --ansi-white: #AAAAAA;           /* ANSI 7 - Light gray */
    
    /* Bright Colors (8-15) */
    --ansi-bright-black: #555555;    /* ANSI 8 - Dark gray */
    --ansi-bright-red: #FF5555;      /* ANSI 9 - Bright red */
    --ansi-bright-green: #55FF55;    /* ANSI 10 - Bright green */
    --ansi-bright-yellow: #FFFF55;   /* ANSI 11 - Bright yellow */
    --ansi-bright-blue: #5555FF;     /* ANSI 12 - Bright blue */
    --ansi-bright-magenta: #FF55FF;  /* ANSI 13 - Bright magenta */
    --ansi-bright-cyan: #55FFFF;     /* ANSI 14 - Bright cyan */
    --ansi-bright-white: #FFFFFF;    /* ANSI 15 - Pure white */
    
    /* Semantic Color Aliases */
    --primary-text: var(--ansi-bright-green);      /* Main text color */
    --secondary-text: var(--ansi-white);            /* Secondary text */
    --accent-text: var(--ansi-bright-cyan);        /* Accent/highlight text */
    --error-text: var(--ansi-bright-red);          /* Error messages */
    --warning-text: var(--ansi-bright-yellow);     /* Warning messages */
    --info-text: var(--ansi-bright-blue);          /* Info messages */
    
    /* Background Colors */
    --bg-primary: var(--ansi-black);               /* Main background */
    --bg-secondary: var(--ansi-bright-black);      /* Secondary background */
    --bg-accent: rgba(0, 170, 0, 0.1);            /* Accent background */
    
    /* Border Colors */
    --border-primary: var(--ansi-green);           /* Primary borders */
    --border-secondary: var(--ansi-white);         /* Secondary borders */
    --border-accent: var(--ansi-bright-green);     /* Accent borders */
    
    /* Interactive Colors */
    --link-color: var(--ansi-bright-cyan);         /* Link color */
    --link-hover: var(--ansi-bright-white);        /* Link hover */
    --button-bg: var(--ansi-green);                /* Button background */
    --button-text: var(--ansi-black);              /* Button text */
    --button-hover-bg: var(--ansi-bright-green);   /* Button hover */
    --button-hover-text: var(--ansi-black);        /* Button hover text */
    
    /* Glow Effects */
    --glow-primary: 0 0 2px var(--ansi-green);    /* Primary glow */
    --glow-secondary: 0 0 1px var(--ansi-white);  /* Secondary glow */
    --glow-accent: 0 0 3px var(--ansi-bright-cyan); /* Accent glow */
    --glow-error: 0 0 2px var(--ansi-bright-red); /* Error glow */
    
    /* Transparency Variations */
    --ansi-green-10: rgba(0, 170, 0, 0.1);       /* 10% opacity */
    --ansi-green-20: rgba(0, 170, 0, 0.2);       /* 20% opacity */
    --ansi-green-30: rgba(0, 170, 0, 0.3);       /* 30% opacity */
    --ansi-green-50: rgba(0, 170, 0, 0.5);       /* 50% opacity */
    --ansi-green-70: rgba(0, 170, 0, 0.7);       /* 70% opacity */
}

/* Utility Classes for ANSI Colors */
.ansi-black { color: var(--ansi-black); }
.ansi-red { color: var(--ansi-red); }
.ansi-green { color: var(--ansi-green); }
.ansi-yellow { color: var(--ansi-yellow); }
.ansi-blue { color: var(--ansi-blue); }
.ansi-magenta { color: var(--ansi-magenta); }
.ansi-cyan { color: var(--ansi-cyan); }
.ansi-white { color: var(--ansi-white); }
.ansi-bright-black { color: var(--ansi-bright-black); }
.ansi-bright-red { color: var(--ansi-bright-red); }
.ansi-bright-green { color: var(--ansi-bright-green); }
.ansi-bright-yellow { color: var(--ansi-bright-yellow); }
.ansi-bright-blue { color: var(--ansi-bright-blue); }
.ansi-bright-magenta { color: var(--ansi-bright-magenta); }
.ansi-bright-cyan { color: var(--ansi-bright-cyan); }
.ansi-bright-white { color: var(--ansi-bright-white); }

/* Background Utility Classes */
.bg-ansi-black { background-color: var(--ansi-black); }
.bg-ansi-red { background-color: var(--ansi-red); }
.bg-ansi-green { background-color: var(--ansi-green); }
.bg-ansi-yellow { background-color: var(--ansi-yellow); }
.bg-ansi-blue { background-color: var(--ansi-blue); }
.bg-ansi-magenta { background-color: var(--ansi-magenta); }
.bg-ansi-cyan { background-color: var(--ansi-cyan); }
.bg-ansi-white { background-color: var(--ansi-white); }
.bg-ansi-bright-black { background-color: var(--ansi-bright-black); }
.bg-ansi-bright-red { background-color: var(--ansi-bright-red); }
.bg-ansi-bright-green { background-color: var(--ansi-bright-green); }
.bg-ansi-bright-yellow { background-color: var(--ansi-bright-yellow); }
.bg-ansi-bright-blue { background-color: var(--ansi-bright-blue); }
.bg-ansi-bright-magenta { background-color: var(--ansi-bright-magenta); }
.bg-ansi-bright-cyan { background-color: var(--ansi-bright-cyan); }
.bg-ansi-bright-white { background-color: var(--ansi-bright-white); }

/* Semantic Utility Classes */
.text-primary { color: var(--primary-text); }
.text-secondary { color: var(--secondary-text); }
.text-accent { color: var(--accent-text); }
.text-error { color: var(--error-text); }
.text-warning { color: var(--warning-text); }
.text-info { color: var(--info-text); }

.bg-primary { background-color: var(--bg-primary); }
.bg-secondary { background-color: var(--bg-secondary); }
.bg-accent { background-color: var(--bg-accent); }

.border-primary { border-color: var(--border-primary); }
.border-secondary { border-color: var(--border-secondary); }
.border-accent { border-color: var(--border-accent); }

/* Glow Utility Classes */
.glow-primary { text-shadow: var(--glow-primary); }
.glow-secondary { text-shadow: var(--glow-secondary); }
.glow-accent { text-shadow: var(--glow-accent); }
.glow-error { text-shadow: var(--glow-error); }

/* Interactive States */
.link-ansi {
    color: var(--link-color);
    text-decoration: none;
    transition: color 0.2s;
}

.link-ansi:hover {
    color: var(--link-hover);
    text-shadow: var(--glow-accent);
}

.button-ansi {
    background-color: var(--button-bg);
    color: var(--button-text);
    border: 1px solid var(--border-primary);
    padding: 0.2rem 0.7rem;
    border-radius: 4px;
    text-decoration: none;
    font-size: 0.95rem;
    transition: all 0.2s;
    font-family: 'Fira Mono', 'Consolas', 'Courier New', monospace;
}

.button-ansi:hover {
    background-color: var(--button-hover-bg);
    color: var(--button-hover-text);
    text-shadow: var(--glow-primary);
}

.button-ansi.primary {
    background-color: var(--ansi-green);
    color: var(--ansi-black);
    border-color: var(--ansi-green);
}

.button-ansi.primary:hover {
    background-color: var(--ansi-bright-green);
    color: var(--ansi-black);
    border-color: var(--ansi-bright-green);
} 