# CSS Architecture

## File Structure

- **variables.css** - CSS custom properties (variables) for colors and theme values
- **colors.css** - Reference documentation of all color values used in the project
- **common.css** - Shared styles: reset, header/nav, search bar, accessibility utilities
- **main.css** - Home page styles
- **admin.css** - Admin section styles
- **system.css** - System page styles
- **search.css** - Search/Directory page styles
- **apropos.css** - About page styles
- **tfe.css** - Individual thesis page styles
- **easymde.min.css** - EasyMDE editor styles (minified, third-party)
- **modern-normalize.min.css** - Modern normalize reset (minified, third-party)

## Imports

All CSS files automatically import `variables.css` to access CSS custom properties.

## Variables

### Shared Variables (public pages)
- `--purple`, `--purple-dark`, `--purple-light` - Purple palette
- `--black`, `--white` - Base colors
- `--grey-light` - Light grey background
- `--border-color` - Border color
- `--text-muted` - Muted text color

### Admin Variables
- `--admin-bg`, `--admin-bg-alt` - Background colors
- `--admin-border` - Border color
- `--admin-text`, `--admin-text-muted` - Text colors
- `--admin-purple` - Accent color
- `--admin-input-bg` - Input background