/**
 * THEME VARIABLES - CUSTOMIZE FOR YOUR COURSE
 *
 * This file contains all customizable colors, fonts, and spacing.
 * Change these values to match your institution's brand or course aesthetic.
 *
 * The presentation.css file references these variables, so you should not
 * need to edit presentation.css directly.
 */

:root {
    /* ===================================
       TECHNICOLOR TERMINAL THEME
       Retro terminal with vibrant colors
       =================================== */
    --primary-color: #00D9FF;        /* Bright cyan - classic terminal */
    --primary-dark: #0088AA;         /* Darker cyan */
    --secondary-color: #00FF00;      /* Bright green - terminal green */
    --secondary-light: #88FF88;      /* Light green */
    --accent-color: #FFAA00;         /* Amber - old terminal glow */

    /* ===================================
       ADDITIONAL TERMINAL COLORS
       =================================== */
    --success-color: #00FF00;        /* Terminal green for success */
    --success-light: #88FF88;        /* Light green */
    --warning-color: #FFFF00;        /* Bright yellow for warnings */
    --danger-color: #FF0055;         /* Hot pink/red for errors */
    --magenta: #FF00FF;              /* Bright magenta accent */
    --terminal-amber: #FFAA00;       /* Classic amber terminal */

    /* ===================================
       SPACING SYSTEM
       Consistent spacing throughout
       =================================== */
    --spacing-xs: 8px;
    --spacing-sm: 16px;
    --spacing-md: 24px;
    --spacing-lg: 40px;
    --spacing-xl: 60px;

    /* ===================================
       TYPOGRAPHY - TERMINAL MONOSPACE
       =================================== */
    --font-family: 'Courier New', 'Consolas', 'Monaco', monospace;
    --font-size-xs: 0.9em;
    --font-size-sm: 1em;
    --font-size-md: 1.2em;
    --font-size-lg: 1.5em;
    --font-size-xl: 2em;
    --font-size-xxl: 2.8em;

    /* Code block typography */
    --code-font-family: 'Courier New', 'Consolas', 'Monaco', monospace;
    --code-font-size: 1.1em;
    --code-line-height: 1.6;
    --code-padding: 12px;

    /* ===================================
       LIGHT MODE THEME - RETRO TERMINAL
       Light terminal paper aesthetic
       =================================== */
    --bg-primary: #F5F5DC;           /* Beige/cream paper */
    --bg-secondary: #E8E8D0;         /* Slightly darker cream */
    --bg-accent: #D0F0D0;            /* Light green tint */
    --text-primary: #001100;         /* Very dark green, almost black */
    --text-secondary: #0088AA;       /* Cyan for secondary text */
    --text-muted: #555555;           /* Muted gray */
    --border-color: #00D9FF;         /* Bright cyan borders */
    --shadow-color: rgba(0, 217, 255, 0.2);
    --code-bg: #1a1a1a;              /* Dark terminal background */
    --code-text: #00FF00;            /* Bright green code */
    --success-bg: rgba(0, 255, 0, 0.1);
    --success-border: #00FF00;
    --warning-bg: rgba(255, 255, 0, 0.1);
    --warning-border: #FFFF00;
    --gradient-start: #00D9FF;       /* Cyan gradient */
    --gradient-end: #00FF00;         /* To green */
    --slide-bg: #F5F5DC;
    --slide-bg-rgb: 245, 245, 220;
    --nav-bg: #0088AA;
    --nav-text: #FFFF00;             /* Yellow text on cyan */
    --button-hover: #00D9FF;
    --link-color: #0088AA;
    --link-hover: #00FF00;
    --card-bg: #EFEFD8;
    --shadow: rgba(0, 0, 0, 0.15);
}

/* ===================================
   DARK MODE THEME - CRT TERMINAL
   Classic dark terminal with bright colors
   =================================== */
[data-theme="dark"] {
    --bg-primary: #000000;           /* Pure black CRT */
    --bg-secondary: #0a0a0a;         /* Slightly lighter black */
    --bg-accent: #001a1a;            /* Dark cyan tint */
    --text-primary: #00FF00;         /* Classic terminal green */
    --text-secondary: #00D9FF;       /* Bright cyan */
    --text-muted: #888888;           /* Gray */
    --border-color: #00FF00;         /* Green borders */
    --shadow-color: rgba(0, 255, 0, 0.3); /* Green glow */
    --code-bg: #000000;              /* Black code background */
    --code-text: #00FF00;            /* Green code text */
    --success-bg: rgba(0, 255, 0, 0.1);
    --success-border: #00FF00;
    --warning-bg: rgba(255, 170, 0, 0.1);
    --warning-border: #FFAA00;       /* Amber warning */
    --gradient-start: #000000;       /* Black to cyan gradient */
    --gradient-end: #00D9FF;
    --slide-bg: #000000;
    --slide-bg-rgb: 0, 0, 0;
    --nav-bg: #001100;               /* Very dark green */
    --nav-text: #00FF00;             /* Bright green */
    --button-hover: #00D9FF;         /* Cyan on hover */
    --link-color: #00D9FF;           /* Cyan links */
    --link-hover: #FFAA00;           /* Amber on hover */
    --card-bg: #0a0a0a;              /* Dark cards */
    --shadow: rgba(0, 255, 0, 0.2);  /* Green shadow/glow */
}

/* ===================================
   SMOOTH TRANSITIONS
   =================================== */
* {
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}